From d1d09f9f2b012ffea465f888346a518481096e6d Mon Sep 17 00:00:00 2001
From: Sean Lilley <lilleyse@gmail.com>
Date: Fri, 28 Oct 2016 20:56:56 -0400
Subject: [PATCH 01/14] Added model color

---
 CHANGES.md               |  1 +
 Source/Scene/Model.js    | 56 +++++++++++++++++++++++++++++++++++++++-
 Specs/Scene/ModelSpec.js | 30 +++++++++++++++++++++
 3 files changed, 86 insertions(+), 1 deletion(-)

diff --git a/CHANGES.md b/CHANGES.md
index c2d7354f028f..1402dc954190 100644
--- a/CHANGES.md
+++ b/CHANGES.md
@@ -41,6 +41,7 @@ Change Log
 * Fix warning when using Webpack. [#4467](https://github.com/AnalyticalGraphicsInc/cesium/pull/4467)
 * Fix primitive bounding sphere bug that would cause a crash when loading data sources. [#4431](https://github.com/AnalyticalGraphicsInc/cesium/issues/4431)
 * Fix a crash when clustering is enabled, an entity has a label graphics defined, but the label isn't visible. [#4414](https://github.com/AnalyticalGraphicsInc/cesium/issues/4414)
+* Added the ability to blend a `Model` with a color. [#4547](https://github.com/AnalyticalGraphicsInc/cesium/pull/4547)
 
 ### 1.26 - 2016-10-03
 
diff --git a/Source/Scene/Model.js b/Source/Scene/Model.js
index 0d70dce0f32a..aeb2b6014d9e 100644
--- a/Source/Scene/Model.js
+++ b/Source/Scene/Model.js
@@ -6,6 +6,7 @@ define([
         '../Core/Cartesian4',
         '../Core/Cartographic',
         '../Core/clone',
+        '../Core/Color',
         '../Core/combine',
         '../Core/ComponentDatatype',
         '../Core/defaultValue',
@@ -66,6 +67,7 @@ define([
         Cartesian4,
         Cartographic,
         clone,
+        Color,
         combine,
         ComponentDatatype,
         defaultValue,
@@ -321,6 +323,8 @@ define([
      * @param {HeightReference} [options.heightReference] Determines how the model is drawn relative to terrain.
      * @param {Scene} [options.scene] Must be passed in for models that use the height reference property.
      * @param {DistanceDisplayCondition} [options.istanceDisplayCondition] The condition specifying at what distance from the camera that this model will be displayed.
+     * @param {Color} [options.blendColor=Color.RED] A color that blends with the model's rendered color.
+     * @param {Number} [options.blendAmount=0.0] Value used to mix between the render color and blend color. A value of 0.0 results in no blending while a value of 1.0 results in a solid blend color.
      *
      * @exception {DeveloperError} bgltf is not a valid Binary glTF file.
      * @exception {DeveloperError} Only glTF Binary version 1 is supported.
@@ -516,6 +520,24 @@ define([
         this.shadows = defaultValue(options.shadows, ShadowMode.ENABLED);
         this._shadows = this.shadows;
 
+        /**
+         * A color that blends with the model's rendered color.
+         *
+         * @type {Color}
+         *
+         * @default Color.RED
+         */
+        this.blendColor = defaultValue(options.blendColor, Color.RED);
+
+        /**
+         * Value used to mix between the render color and blend color. A value of 0.0 results in no blending while a value of 1.0 results in a solid blend color.
+         *
+         * @type {Number}
+         *
+         * @default 0.0
+         */
+        this.blendAmount = defaultValue(options.blendAmount, 0.0);
+
         /**
          * This property is for debugging only; it is not for production use nor is it optimized.
          * <p>
@@ -1719,6 +1741,19 @@ define([
         return shader;
     }
 
+    function modifyShaderForBlendColor(shader) {
+        shader = ShaderSource.replaceMain(shader, 'czm_blend_main');
+        shader +=
+            'uniform vec4 czm_blendColor; \n' +
+            'uniform float czm_blendAmount; \n' +
+            'void main() \n' +
+            '{ \n' +
+            '    czm_blend_main(); \n' +
+            '    gl_FragColor.rgb = mix(gl_FragColor.rgb, czm_blendColor.rgb, czm_blendAmount); \n' +
+            '} \n';
+        return shader;
+    }
+
     function modifyShader(shader, programName, callback) {
         if (defined(callback)) {
             shader = callback(shader, programName);
@@ -1750,8 +1785,10 @@ define([
             vs = modifyShaderForQuantizedAttributes(vs, id, model, context);
         }
 
+        var blendFS = modifyShaderForBlendColor(fs);
+
         var drawVS = modifyShader(vs, id, model._vertexShaderLoaded);
-        var drawFS = modifyShader(fs, id, model._fragmentShaderLoaded);
+        var drawFS = modifyShader(blendFS, id, model._fragmentShaderLoaded);
 
         model._rendererResources.programs[id] = ShaderProgram.fromCache({
             context : context,
@@ -2841,6 +2878,18 @@ define([
         };
     }
 
+    function createBlendColorFunction(model) {
+        return function() {
+            return model.blendColor;
+        };
+    }
+
+    function createBlendAmountFunction(model) {
+        return function() {
+            return model.blendAmount;
+        };
+    }
+
     function createCommand(model, gltfNode, runtimeNode, context, scene3DOnly) {
         var nodeCommands = model._nodeCommands;
         var pickIds = model._pickIds;
@@ -2909,6 +2958,11 @@ define([
                     uniformMap = combine(uniformMap, jointUniformMap);
                 }
 
+                uniformMap = combine(uniformMap, {
+                    czm_blendColor : createBlendColorFunction(model),
+                    czm_blendAmount : createBlendAmountFunction(model)
+                });
+
                 // Allow callback to modify the uniformMap
                 if (defined(model._uniformMapLoaded)) {
                     uniformMap = model._uniformMapLoaded(uniformMap, programId, runtimeNode);
diff --git a/Specs/Scene/ModelSpec.js b/Specs/Scene/ModelSpec.js
index 2699f497616c..ca98cf69586b 100644
--- a/Specs/Scene/ModelSpec.js
+++ b/Specs/Scene/ModelSpec.js
@@ -6,6 +6,7 @@ defineSuite([
         'Core/Cartesian4',
         'Core/CesiumTerrainProvider',
         'Core/clone',
+        'Core/Color',
         'Core/combine',
         'Core/defaultValue',
         'Core/defined',
@@ -38,6 +39,7 @@ defineSuite([
         Cartesian4,
         CesiumTerrainProvider,
         clone,
+        Color,
         combine,
         defaultValue,
         defined,
@@ -1869,6 +1871,34 @@ defineSuite([
         });
     });
 
+    it('renders with a blend color', function() {
+        return loadModel(boxUrl).then(function(model) {
+            model.show = true;
+            model.zoomTo();
+
+            // Model is originally red
+            var sourceColor = scene.renderForSpecs();
+            expect(sourceColor[0]).toBeGreaterThan(0);
+            expect(sourceColor[1]).toEqual(0);
+
+            model.blendColor = Color.LIME;
+
+            model.blendAmount = 0.0;
+            var blendColor = scene.renderForSpecs();
+            expect(blendColor).toEqual(sourceColor);
+
+            model.blendAmount = 0.5;
+            blendColor = scene.renderForSpecs();
+            expect(blendColor[0]).toBeGreaterThan(0);
+            expect(blendColor[1]).toBeGreaterThan(0);
+
+            model.blendAmount = 1.0;
+            blendColor = scene.renderForSpecs();
+            expect(blendColor[0]).toEqual(0);
+            expect(blendColor[1]).toEqual(255);
+        });
+    });
+
     describe('height referenced model', function() {
         function createMockGlobe() {
             var globe = {

From 5c7911d01d4b7004c21677e82cf0e68fca2b63fd Mon Sep 17 00:00:00 2001
From: Sean Lilley <lilleyse@gmail.com>
Date: Mon, 5 Dec 2016 13:27:05 -0500
Subject: [PATCH 02/14] Updated 3D Models dev Sandcastle

---
 .../gallery/development/3D Models.html        | 87 ++++++++++++++++---
 Source/Scene/Model.js                         | 22 ++---
 2 files changed, 85 insertions(+), 24 deletions(-)

diff --git a/Apps/Sandcastle/gallery/development/3D Models.html b/Apps/Sandcastle/gallery/development/3D Models.html
index 0504f5af2a7b..90bb61846a9a 100644
--- a/Apps/Sandcastle/gallery/development/3D Models.html	
+++ b/Apps/Sandcastle/gallery/development/3D Models.html	
@@ -19,16 +19,70 @@
 <body class="sandcastle-loading" data-sandcastle-bucket="bucket-requirejs.html">
 <style>
     @import url(../templates/bucket.css);
+    #toolbar {
+        background: rgba(42, 42, 42, 0.8);
+        padding: 4px;
+        border-radius: 4px;
+    }
+    #toolbar input {
+        vertical-align: middle;
+        padding-top: 2px;
+        padding-bottom: 2px;
+    }
 </style>
 <div id="cesiumContainer" class="fullSize"></div>
 <div id="loadingOverlay"><h1>Loading...</h1></div>
-<div id="toolbar"></div>
+<div id="toolbar">
+    <table><tbody>
+    <tr>
+        <td>Blend Amount</td>
+        <td>
+            <input type="range" min="0.0" max="1.0" step="0.01" data-bind="value: blendAmount, valueUpdate: 'input'">
+            <input type="text" size="5" data-bind="value: blendAmount">
+        </td>
+    </tr>
+    <tr>
+        <td>Blend Color</td>
+        <td>
+            <input type="range" min="0.0" max="1.0" step="0.01" data-bind="value: blendColor, valueUpdate: 'input'">
+            <input type="text" size="5" data-bind="value: blendColor">
+        </td>
+    </tr>
+    </tbody></table>
+
+</div>
 <script id="cesium_sandcastle_script">
 function startup(Cesium) {
     'use strict';
 //Sandcastle_Begin
 var viewer = new Cesium.Viewer('cesiumContainer');
+viewer.shadows = true;
 var scene = viewer.scene;
+var model;
+
+// The viewModel tracks the state of our mini application.
+var viewModel = {
+    blendAmount : 0.0,
+    blendColor : 0.0
+};
+// Convert the viewModel members into knockout observables.
+Cesium.knockout.track(viewModel);
+
+// Bind the viewModel to the DOM elements of the UI that call for it.
+var toolbar = document.getElementById('toolbar');
+Cesium.knockout.applyBindings(viewModel, toolbar);
+
+Cesium.knockout.getObservable(viewModel, 'blendAmount').subscribe(
+    function(newValue) {
+        model.blendAmount = newValue;
+    }
+);
+
+Cesium.knockout.getObservable(viewModel, 'blendColor').subscribe(
+    function(newValue) {
+        model.blendColor = Cesium.Color.fromHsl(newValue, 1.0, 0.5);
+    }
+);
 
 function createModel(url, height, heading, pitch, roll) {
     height = Cesium.defaultValue(height, 0.0);
@@ -41,26 +95,28 @@
     var modelMatrix = Cesium.Transforms.headingPitchRollToFixedFrame(origin, hpr);
 
     scene.primitives.removeAll(); // Remove previous model
-    var model = scene.primitives.add(Cesium.Model.fromGltf({
+    model = scene.primitives.add(Cesium.Model.fromGltf({
         url : url,
         modelMatrix : modelMatrix,
         minimumPixelSize : 128
     }));
 
     model.readyPromise.then(function(model) {
+        model.blendAmount = viewModel.blendAmount;
+        model.blendColor = Cesium.Color.fromHsl(viewModel.blendColor, 1.0, 0.5);
         // Play and loop all animations at half-speed
         model.activeAnimations.addAll({
             speedup : 0.5,
             loop : Cesium.ModelAnimationLoop.REPEAT
         });
-        
+
         var camera = viewer.camera;
-        
+
         // Zoom to model
         var controller = scene.screenSpaceCameraController;
         var r = 2.0 * Math.max(model.boundingSphere.radius, camera.frustum.near);
         controller.minimumZoomDistance = r * 0.5;
-        
+
         var center = Cesium.Matrix4.multiplyByPoint(model.modelMatrix, model.boundingSphere.center, new Cesium.Cartesian3());
         var heading = Cesium.Math.toRadians(230.0);
         var pitch = Cesium.Math.toRadians(-20.0);
@@ -74,7 +130,7 @@
 handler.setInputAction(function(movement) {
     var pick = scene.pick(movement.endPosition);
     if (Cesium.defined(pick) && Cesium.defined(pick.node) && Cesium.defined(pick.mesh)) {
-        // Output glTF node and mesh under the mouse. 
+        // Output glTF node and mesh under the mouse.
         console.log('node: ' + pick.node.name + '. mesh: ' + pick.mesh.name);
     }
 }, Cesium.ScreenSpaceEventType.MOUSE_MOVE);
@@ -82,8 +138,8 @@
 ///////////////////////////////////////////////////////////////////////////
 
 var options = [{
-text : 'Aircraft',
-onselect : function() {
+    text : 'Aircraft',
+    onselect : function() {
         var height = 5000.0;
         var heading = 0.0;
         var pitch = Cesium.Math.toRadians(10.0);
@@ -91,15 +147,15 @@
         createModel('../../SampleData/models/CesiumAir/Cesium_Air.glb', height, heading, pitch, roll);
     }
 }, {
-text : 'Ground vehicle',
+    text : 'Ground vehicle',
     onselect : function() {
         createModel('../../SampleData/models/CesiumGround/Cesium_Ground.glb');
     }
 }, {
-text : 'Milk truck',
-onselect : function() {
-    createModel('../../SampleData/models/CesiumMilkTruck/CesiumMilkTruck.glb');
-}
+    text : 'Milk truck',
+    onselect : function() {
+        createModel('../../SampleData/models/CesiumMilkTruck/CesiumMilkTruck.glb');
+    }
 }, {
     text : 'Skinned character',
     onselect : function() {
@@ -108,6 +164,11 @@
 }];
 
 Sandcastle.addToolbarMenu(options);
+
+Sandcastle.addToggleButton('Shadows', viewer.shadows, function(checked) {
+    viewer.shadows = checked;
+});
+
 //Sandcastle_End
 Sandcastle.finishedLoading();
 }
diff --git a/Source/Scene/Model.js b/Source/Scene/Model.js
index 21ea901ad0d8..78485264bc56 100644
--- a/Source/Scene/Model.js
+++ b/Source/Scene/Model.js
@@ -1677,7 +1677,7 @@ define([
             if (getProgramForPrimitive(model, primitive) === programName) {
                 for (var attributeSemantic in primitive.attributes) {
                     if (primitive.attributes.hasOwnProperty(attributeSemantic)) {
-                        var decodeUniformVarName = 'czm_u_dec_' + attributeSemantic.toLowerCase();
+                        var decodeUniformVarName = 'gltf_u_dec_' + attributeSemantic.toLowerCase();
                         var decodeUniformVarNameScale = decodeUniformVarName + '_scale';
                         var decodeUniformVarNameTranslate = decodeUniformVarName + '_translate';
                         if (!defined(quantizedUniforms[decodeUniformVarName]) && !defined(quantizedUniforms[decodeUniformVarNameScale])) {
@@ -1686,8 +1686,8 @@ define([
                             if (defined(quantizedAttributes)) {
                                 var attributeVarName = getAttributeVariableName(model, primitive, attributeSemantic);
                                 var decodeMatrix = quantizedAttributes.decodeMatrix;
-                                var newMain = 'czm_decoded_' + attributeSemantic;
-                                var decodedAttributeVarName = attributeVarName.replace('a_', 'czm_a_dec_');
+                                var newMain = 'gltf_decoded_' + attributeSemantic;
+                                var decodedAttributeVarName = attributeVarName.replace('a_', 'gltf_a_dec_');
                                 var size = Math.floor(Math.sqrt(decodeMatrix.length));
 
                                 // replace usages of the original attribute with the decoded version, but not the declaration
@@ -1740,14 +1740,14 @@ define([
     }
 
     function modifyShaderForBlendColor(shader) {
-        shader = ShaderSource.replaceMain(shader, 'czm_blend_main');
+        shader = ShaderSource.replaceMain(shader, 'gltf_blend_main');
         shader +=
-            'uniform vec4 czm_blendColor; \n' +
-            'uniform float czm_blendAmount; \n' +
+            'uniform vec4 gltf_blendColor; \n' +
+            'uniform float gltf_blendAmount; \n' +
             'void main() \n' +
             '{ \n' +
-            '    czm_blend_main(); \n' +
-            '    gl_FragColor.rgb = mix(gl_FragColor.rgb, czm_blendColor.rgb, czm_blendAmount); \n' +
+            '    gltf_blend_main(); \n' +
+            '    gl_FragColor.rgb = mix(gl_FragColor.rgb, gltf_blendColor.rgb, gltf_blendAmount); \n' +
             '} \n';
         return shader;
     }
@@ -2809,7 +2809,7 @@ define([
                     var quantizedAttributes = extensions.WEB3D_quantized_attributes;
                     if (defined(quantizedAttributes)) {
                         var decodeMatrix = quantizedAttributes.decodeMatrix;
-                        var uniformVariable = 'czm_u_dec_' + attribute.toLowerCase();
+                        var uniformVariable = 'gltf_u_dec_' + attribute.toLowerCase();
 
                         switch (a.type) {
                             case 'SCALAR':
@@ -2957,8 +2957,8 @@ define([
                 }
 
                 uniformMap = combine(uniformMap, {
-                    czm_blendColor : createBlendColorFunction(model),
-                    czm_blendAmount : createBlendAmountFunction(model)
+                    gltf_blendColor : createBlendColorFunction(model),
+                    gltf_blendAmount : createBlendAmountFunction(model)
                 });
 
                 // Allow callback to modify the uniformMap

From bdc842513448f9b4269e29b1f680032a650f4f8c Mon Sep 17 00:00:00 2001
From: Sean Lilley <lilleyse@gmail.com>
Date: Mon, 5 Dec 2016 14:28:11 -0500
Subject: [PATCH 03/14] Add to Entity API, CZML, and 3D Models showcase

---
 Apps/Sandcastle/gallery/3D Models.html        | 67 ++++++++++++++++++-
 .../gallery/development/3D Models.html        |  7 +-
 Source/DataSources/CzmlDataSource.js          |  2 +
 Source/DataSources/ModelGraphics.js           | 30 ++++++++-
 Source/DataSources/ModelVisualizer.js         |  7 ++
 Specs/DataSources/CzmlDataSourceSpec.js       | 18 +++++
 Specs/DataSources/ModelGraphicsSpec.js        | 38 +++++++++++
 7 files changed, 162 insertions(+), 7 deletions(-)

diff --git a/Apps/Sandcastle/gallery/3D Models.html b/Apps/Sandcastle/gallery/3D Models.html
index 30caabdb7188..3f6c292772c0 100644
--- a/Apps/Sandcastle/gallery/3D Models.html	
+++ b/Apps/Sandcastle/gallery/3D Models.html	
@@ -19,10 +19,38 @@
 <body class="sandcastle-loading" data-sandcastle-bucket="bucket-requirejs.html">
 <style>
     @import url(../templates/bucket.css);
+    #toolbar {
+        background: rgba(42, 42, 42, 0.8);
+        padding: 4px;
+        border-radius: 4px;
+    }
+    #toolbar input {
+        vertical-align: middle;
+        padding-top: 2px;
+        padding-bottom: 2px;
+    }
 </style>
 <div id="cesiumContainer" class="fullSize"></div>
 <div id="loadingOverlay"><h1>Loading...</h1></div>
-<div id="toolbar"></div>
+<div id="toolbar">
+    <table><tbody>
+    <tr>
+        <td>Blend Amount</td>
+        <td>
+            <input type="range" min="0.0" max="1.0" step="0.01" data-bind="value: blendAmount, valueUpdate: 'input'">
+            <input type="text" size="5" data-bind="value: blendAmount">
+        </td>
+    </tr>
+    <tr>
+        <td>Blend Color</td>
+        <td>
+            <input type="range" min="0.0" max="1.0" step="0.01" data-bind="value: blendColor, valueUpdate: 'input'">
+            <input type="text" size="5" data-bind="value: blendColor">
+        </td>
+    </tr>
+    </tbody></table>
+
+</div>
 <script id="cesium_sandcastle_script">
 function startup(Cesium) {
     'use strict';
@@ -33,6 +61,32 @@
     shadows : true
 });
 
+var entity;
+
+// The viewModel tracks the state of our mini application.
+var viewModel = {
+    blendAmount : 0.0,
+    blendColor : 0.0
+};
+// Convert the viewModel members into knockout observables.
+Cesium.knockout.track(viewModel);
+
+// Bind the viewModel to the DOM elements of the UI that call for it.
+var toolbar = document.getElementById('toolbar');
+Cesium.knockout.applyBindings(viewModel, toolbar);
+
+Cesium.knockout.getObservable(viewModel, 'blendAmount').subscribe(
+    function(newValue) {
+        entity.model.blendAmount = newValue;
+    }
+);
+
+Cesium.knockout.getObservable(viewModel, 'blendColor').subscribe(
+    function(newValue) {
+        entity.model.blendColor = Cesium.Color.fromHsl(newValue, 1.0, 0.5);
+    }
+);
+
 function createModel(url, height) {
     viewer.entities.removeAll();
 
@@ -43,14 +97,16 @@
     var hpr = new Cesium.HeadingPitchRoll(heading, pitch, roll);
     var orientation = Cesium.Transforms.headingPitchRollQuaternion(position, hpr);
 
-    var entity = viewer.entities.add({
+    entity = viewer.entities.add({
         name : url,
         position : position,
         orientation : orientation,
         model : {
             uri : url,
             minimumPixelSize : 128,
-            maximumScale : 20000
+            maximumScale : 20000,
+            blendAmount : viewModel.blendAmount,
+            blendColor : Cesium.Color.fromHsl(viewModel.blendColor, 1.0, 0.5)
         }
     });
     viewer.trackedEntity = entity;
@@ -84,6 +140,11 @@
 }];
 
 Sandcastle.addToolbarMenu(options);
+
+Sandcastle.addToggleButton('Shadows', viewer.shadows, function(checked) {
+    viewer.shadows = checked;
+});
+
 //Sandcastle_End
 Sandcastle.finishedLoading();
 }
diff --git a/Apps/Sandcastle/gallery/development/3D Models.html b/Apps/Sandcastle/gallery/development/3D Models.html
index 90bb61846a9a..dbd8409deea8 100644
--- a/Apps/Sandcastle/gallery/development/3D Models.html	
+++ b/Apps/Sandcastle/gallery/development/3D Models.html	
@@ -55,8 +55,10 @@
 function startup(Cesium) {
     'use strict';
 //Sandcastle_Begin
-var viewer = new Cesium.Viewer('cesiumContainer');
-viewer.shadows = true;
+var viewer = new Cesium.Viewer('cesiumContainer', {
+    shadows : true
+});
+
 var scene = viewer.scene;
 var model;
 
@@ -65,6 +67,7 @@
     blendAmount : 0.0,
     blendColor : 0.0
 };
+
 // Convert the viewModel members into knockout observables.
 Cesium.knockout.track(viewModel);
 
diff --git a/Source/DataSources/CzmlDataSource.js b/Source/DataSources/CzmlDataSource.js
index 46563103ff83..dc1624d95c7e 100644
--- a/Source/DataSources/CzmlDataSource.js
+++ b/Source/DataSources/CzmlDataSource.js
@@ -1413,6 +1413,8 @@ define([
         processPacketData(Boolean, model, 'runAnimations', modelData.runAnimations, interval, sourceUri, entityCollection);
         processPacketData(ShadowMode, model, 'shadows', modelData.shadows, interval, sourceUri, entityCollection);
         processPacketData(HeightReference, model, 'heightReference', modelData.heightReference, interval, sourceUri, entityCollection);
+        processPacketData(Color, model, 'blendColor', modelData.blendColor, interval, sourceUri, entityCollection);
+        processPacketData(Number, model, 'blendAmount', modelData.blendAmount, interval, sourceUri, entityCollection);
 
         var nodeTransformationsData = modelData.nodeTransformations;
         if (defined(nodeTransformationsData)) {
diff --git a/Source/DataSources/ModelGraphics.js b/Source/DataSources/ModelGraphics.js
index 81d48182b0cb..c2249b75f36b 100644
--- a/Source/DataSources/ModelGraphics.js
+++ b/Source/DataSources/ModelGraphics.js
@@ -50,7 +50,8 @@ define([
      * @param {Property} [options.shadows=ShadowMode.ENABLED] An enum Property specifying whether the model casts or receives shadows from each light source.
      * @param {Property} [options.heightReference=HeightReference.NONE] A Property specifying what the height is relative to.
      * @param {Property} [options.distanceDisplayCondition] A Property specifying at what distance from the camera that this model will be displayed.
-     *
+     * @param {Property} [options.blendColor=Color.RED] A Property specifying the {@link Color} that blends with the model's rendered color.
+     * @param {Property} [options.blendAmount=0.0] A numeric Property specifying a value used to mix between the render color and blend color. A value of 0.0 results in no blending while a value of 1.0 results in a solid blend color.
      * @see {@link http://cesiumjs.org/2014/03/03/Cesium-3D-Models-Tutorial/|3D Models Tutorial}
      * @demo {@link http://cesiumjs.org/Cesium/Apps/Sandcastle/index.html?src=3D%20Models.html|Cesium Sandcastle 3D Models Demo}
      */
@@ -77,6 +78,10 @@ define([
         this._heightReferenceSubscription = undefined;
         this._distanceDisplayCondition = undefined;
         this._distanceDisplayConditionSubscription = undefined;
+        this._blendColor = undefined;
+        this._blendColorSubscription = undefined;
+        this._blendAmount = undefined;
+        this._blendAmountSubscription = undefined;
         this._definitionChanged = new Event();
 
         this.merge(defaultValue(options, defaultValue.EMPTY_OBJECT));
@@ -186,7 +191,24 @@ define([
          * @memberof ModelGraphics.prototype
          * @type {Property}
          */
-        distanceDisplayCondition : createPropertyDescriptor('distanceDisplayCondition')
+        distanceDisplayCondition : createPropertyDescriptor('distanceDisplayCondition'),
+
+        /**
+         * Gets or sets the Property specifying the {@link Color} color that blends with the model's rendered color.
+         * @memberof ModelGraphics.prototype
+         * @type {Property}
+         * @default Color.RED
+         */
+        blendColor : createPropertyDescriptor('blendColor'),
+
+        /**
+         * Gets or sets the numeric Property specifying specifying a value used to mix between the render color
+         * and blend color. A value of 0.0 results in no blending while a value of 1.0 results in a solid blend color.
+         * @memberof ModelGraphics.prototype
+         * @type {Property}
+         * @default 0.0
+         */
+        blendAmount : createPropertyDescriptor('blendAmount')
     });
 
     /**
@@ -210,6 +232,8 @@ define([
         result.nodeTransformations = this.nodeTransformations;
         result.heightReference = this._heightReference;
         result.distanceDisplayCondition = this.distanceDisplayCondition;
+        result.blendColor = this.blendColor;
+        result.blendAmount = this.blendAmount;
 
         return result;
     };
@@ -237,6 +261,8 @@ define([
         this.runAnimations = defaultValue(this.runAnimations, source.runAnimations);
         this.heightReference = defaultValue(this.heightReference, source.heightReference);
         this.distanceDisplayCondition = defaultValue(this.distanceDisplayCondition, source.distanceDisplayCondition);
+        this.blendColor = defaultValue(this.blendColor, source.blendColor);
+        this.blendAmount = defaultValue(this.blendAmount, source.blendAmount);
 
         var sourceNodeTransformations = source.nodeTransformations;
         if (defined(sourceNodeTransformations)) {
diff --git a/Source/DataSources/ModelVisualizer.js b/Source/DataSources/ModelVisualizer.js
index 110aafe889f8..7e61acdc1f2c 100644
--- a/Source/DataSources/ModelVisualizer.js
+++ b/Source/DataSources/ModelVisualizer.js
@@ -2,6 +2,7 @@
 define([
         '../Core/AssociativeArray',
         '../Core/BoundingSphere',
+        '../Core/Color',
         '../Core/defined',
         '../Core/destroyObject',
         '../Core/DeveloperError',
@@ -15,6 +16,7 @@ define([
     ], function(
         AssociativeArray,
         BoundingSphere,
+        Color,
         defined,
         destroyObject,
         DeveloperError,
@@ -32,7 +34,10 @@ define([
     var defaultIncrementallyLoadTextures = true;
     var defaultShadows = ShadowMode.ENABLED;
     var defaultHeightReference = HeightReference.NONE;
+    var defaultBlendColor = Color.RED;
+    var defaultBlendAmount = 0.0;
 
+    var color = new Color();
     var modelMatrixScratch = new Matrix4();
     var nodeMatrixScratch = new Matrix4();
 
@@ -139,6 +144,8 @@ define([
             model.shadows = Property.getValueOrDefault(modelGraphics._shadows, time, defaultShadows);
             model.heightReference = Property.getValueOrDefault(modelGraphics._heightReference, time, defaultHeightReference);
             model.distanceDisplayCondition = Property.getValueOrUndefined(modelGraphics._distanceDisplayCondition, time);
+            model.blendColor = Property.getValueOrDefault(modelGraphics._blendColor, time, defaultBlendColor, color);
+            model.blendAmount = Property.getValueOrDefault(modelGraphics._blendAmount, time, defaultBlendAmount);
 
             if (model.ready) {
                 var runAnimations = Property.getValueOrDefault(modelGraphics._runAnimations, time, true);
diff --git a/Specs/DataSources/CzmlDataSourceSpec.js b/Specs/DataSources/CzmlDataSourceSpec.js
index 5a6cbbe0fa81..b0e6136b7622 100644
--- a/Specs/DataSources/CzmlDataSourceSpec.js
+++ b/Specs/DataSources/CzmlDataSourceSpec.js
@@ -1838,6 +1838,10 @@ defineSuite([
                 incrementallyLoadTextures : true,
                 shadows : 'ENABLED',
                 heightReference: 'CLAMP_TO_GROUND',
+                blendColor : {
+                    rgbaf : [0.0, 1.0, 0.0, 0.2]
+                },
+                blendAmount : 0.5,
                 nodeTransformations : {
                     Mesh : {
                         scale : {
@@ -1867,6 +1871,8 @@ defineSuite([
         expect(entity.model.incrementallyLoadTextures.getValue(Iso8601.MINIMUM_VALUE)).toEqual(true);
         expect(entity.model.shadows.getValue(Iso8601.MINIMUM_VALUE)).toEqual(ShadowMode.ENABLED);
         expect(entity.model.heightReference.getValue(Iso8601.MINIMUM_VALUE)).toEqual(HeightReference.CLAMP_TO_GROUND);
+        expect(entity.model.blendColor.getValue(Iso8601.MINIMUM_VALUE)).toEqual(new Color(0.0, 1.0, 0.0, 0.2));
+        expect(entity.model.blendAmount.getValue(Iso8601.MINIMUM_VALUE)).toEqual(0.5);
 
         var nodeTransform = entity.model.nodeTransformations.getValue(Iso8601.MINIMUM_VALUE).Mesh;
         expect(nodeTransform).toBeDefined();
@@ -1892,6 +1898,12 @@ defineSuite([
                 gltf : './Data/Models/Box/CesiumBoxTest.gltf',
                 incrementallyLoadTextures : true,
                 shadows : 'ENABLED',
+                heightReference: 'CLAMP_TO_GROUND',
+                blendColor : {
+                    rgbaf : [0.0, 1.0, 0.0, 0.2]
+                },
+                blendAmount : 0.5,
+
                 nodeTransformations : {
                     Mesh : {
                         scale : {
@@ -1924,6 +1936,9 @@ defineSuite([
         expect(entity.model.uri.getValue(validTime)).toEqual('./Data/Models/Box/CesiumBoxTest.gltf');
         expect(entity.model.incrementallyLoadTextures.getValue(validTime)).toEqual(true);
         expect(entity.model.shadows.getValue(validTime)).toEqual(ShadowMode.ENABLED);
+        expect(entity.model.heightReference.getValue(validTime)).toEqual(HeightReference.CLAMP_TO_GROUND);
+        expect(entity.model.blendColor.getValue(validTime)).toEqual(new Color(0.0, 1.0, 0.0, 0.2));
+        expect(entity.model.blendAmount.getValue(validTime)).toEqual(0.5);
 
         var nodeTransform = entity.model.nodeTransformations.getValue(validTime).Mesh;
         expect(nodeTransform).toBeDefined();
@@ -1944,6 +1959,9 @@ defineSuite([
         expect(entity.model.uri.getValue(invalidTime)).toBeUndefined();
         expect(entity.model.incrementallyLoadTextures.getValue(invalidTime)).toBeUndefined();
         expect(entity.model.shadows.getValue(invalidTime)).toBeUndefined();
+        expect(entity.model.heightReference.getValue(invalidTime)).toBeUndefined();
+        expect(entity.model.blendColor.getValue(invalidTime)).toBeUndefined();
+        expect(entity.model.blendAmount.getValue(invalidTime)).toBeUndefined();
 
         expect(entity.model.nodeTransformations.Mesh.getValue(invalidTime)).toEqual(new TranslationRotationScale());
         expect(entity.model.nodeTransformations.Mesh.scale.getValue(invalidTime)).toBeUndefined();
diff --git a/Specs/DataSources/ModelGraphicsSpec.js b/Specs/DataSources/ModelGraphicsSpec.js
index c2c18f2965df..06c8bf0aedfb 100644
--- a/Specs/DataSources/ModelGraphicsSpec.js
+++ b/Specs/DataSources/ModelGraphicsSpec.js
@@ -2,22 +2,26 @@
 defineSuite([
         'DataSources/ModelGraphics',
         'Core/Cartesian3',
+        'Core/Color',
         'Core/DistanceDisplayCondition',
         'Core/JulianDate',
         'Core/Quaternion',
         'DataSources/ConstantProperty',
         'DataSources/NodeTransformationProperty',
         'DataSources/PropertyBag',
+        'Scene/HeightReference',
         'Scene/ShadowMode'
     ], function(
         ModelGraphics,
         Cartesian3,
+        Color,
         DistanceDisplayCondition,
         JulianDate,
         Quaternion,
         ConstantProperty,
         NodeTransformationProperty,
         PropertyBag,
+        HeightReference,
         ShadowMode) {
     'use strict';
 
@@ -31,7 +35,10 @@ defineSuite([
             incrementallyLoadTextures : false,
             runAnimations : false,
             shadows : ShadowMode.DISABLED,
+            heightReference : HeightReference.CLAMP_TO_GROUND,
             distanceDisplayCondition : new DistanceDisplayCondition(),
+            blendColor : new Color(0.0, 1.0, 0.0, 0.2),
+            blendAmount : 0.5,
             nodeTransformations : {
                 node1 : {
                     translation : Cartesian3.UNIT_Y,
@@ -49,6 +56,10 @@ defineSuite([
         expect(model.maximumScale).toBeInstanceOf(ConstantProperty);
         expect(model.incrementallyLoadTextures).toBeInstanceOf(ConstantProperty);
         expect(model.shadows).toBeInstanceOf(ConstantProperty);
+        expect(model.heightReference).toBeInstanceOf(ConstantProperty);
+        expect(model.distanceDisplayCondition).toBeInstanceOf(ConstantProperty);
+        expect(model.blendColor).toBeInstanceOf(ConstantProperty);
+        expect(model.blendAmount).toBeInstanceOf(ConstantProperty);
         expect(model.runAnimations).toBeInstanceOf(ConstantProperty);
 
         expect(model.nodeTransformations).toBeInstanceOf(PropertyBag);
@@ -60,7 +71,10 @@ defineSuite([
         expect(model.maximumScale.getValue()).toEqual(options.maximumScale);
         expect(model.incrementallyLoadTextures.getValue()).toEqual(options.incrementallyLoadTextures);
         expect(model.shadows.getValue()).toEqual(options.shadows);
+        expect(model.heightReference.getValue()).toEqual(options.heightReference);
         expect(model.distanceDisplayCondition.getValue()).toEqual(options.distanceDisplayCondition);
+        expect(model.blendColor.getValue()).toEqual(options.blendColor);
+        expect(model.blendAmount.getValue()).toEqual(options.blendAmount);
         expect(model.runAnimations.getValue()).toEqual(options.runAnimations);
 
         var actualNodeTransformations = model.nodeTransformations.getValue(new JulianDate());
@@ -81,7 +95,10 @@ defineSuite([
         source.maximumScale = new ConstantProperty(200.0);
         source.incrementallyLoadTextures = new ConstantProperty(true);
         source.shadows = new ConstantProperty(ShadowMode.ENABLED);
+        source.heightReference = new ConstantProperty(HeightReference.CLAMP_TO_GROUND);
         source.distanceDisplayCondition = new ConstantProperty(new DistanceDisplayCondition());
+        source.blendColor = new ConstantProperty(new Color(0.0, 1.0, 0.0, 0.2));
+        source.blendAmount = new ConstantProperty(0.5);
         source.runAnimations = new ConstantProperty(true);
         source.nodeTransformations = {
             node1 : new NodeTransformationProperty({
@@ -104,7 +121,10 @@ defineSuite([
         expect(target.maximumScale).toBe(source.maximumScale);
         expect(target.incrementallyLoadTextures).toBe(source.incrementallyLoadTextures);
         expect(target.shadows).toBe(source.shadows);
+        expect(target.heightReference).toBe(source.heightReference);
         expect(target.distanceDisplayCondition).toBe(source.distanceDisplayCondition);
+        expect(target.blendColor).toBe(source.blendColor);
+        expect(target.blendAmount).toBe(source.blendAmount);
         expect(target.runAnimations).toBe(source.runAnimations);
         expect(target.nodeTransformations).toEqual(source.nodeTransformations);
     });
@@ -118,7 +138,10 @@ defineSuite([
         source.maximumScale = new ConstantProperty(200.0);
         source.incrementallyLoadTextures = new ConstantProperty(true);
         source.shadows = new ConstantProperty(ShadowMode.ENABLED);
+        source.heightReference = new ConstantProperty(HeightReference.CLAMP_TO_GROUND);
         source.distanceDisplayCondition = new ConstantProperty(new DistanceDisplayCondition());
+        source.blendColor = new ConstantProperty(new Color(0.0, 1.0, 0.0, 0.2));
+        source.blendAmount = new ConstantProperty(0.5);
         source.runAnimations = new ConstantProperty(true);
         source.nodeTransformations = {
             transform : new NodeTransformationProperty()
@@ -131,7 +154,10 @@ defineSuite([
         var maximumScale = new ConstantProperty(200.0);
         var incrementallyLoadTextures = new ConstantProperty(true);
         var shadows = new ConstantProperty(ShadowMode.ENABLED);
+        var heightReference = new ConstantProperty(HeightReference.CLAMP_TO_GROUND);
         var distanceDisplayCondition = new ConstantProperty(new DistanceDisplayCondition());
+        var blendColor = new ConstantProperty(new Color(0.0, 1.0, 0.0, 0.2));
+        var blendAmount = new ConstantProperty(0.5);
         var runAnimations = new ConstantProperty(true);
         var nodeTransformations = new PropertyBag({
             transform : new NodeTransformationProperty()
@@ -145,7 +171,10 @@ defineSuite([
         target.maximumScale = maximumScale;
         target.incrementallyLoadTextures = incrementallyLoadTextures;
         target.shadows = shadows;
+        target.heightReference = heightReference;
         target.distanceDisplayCondition = distanceDisplayCondition;
+        target.blendColor = blendColor;
+        target.blendAmount = blendAmount;
         target.runAnimations = runAnimations;
         target.nodeTransformations = nodeTransformations;
 
@@ -158,7 +187,10 @@ defineSuite([
         expect(target.maximumScale).toBe(maximumScale);
         expect(target.incrementallyLoadTextures).toBe(incrementallyLoadTextures);
         expect(target.shadows).toBe(shadows);
+        expect(target.heightReference).toBe(heightReference);
         expect(target.distanceDisplayCondition).toBe(distanceDisplayCondition);
+        expect(target.blendColor).toBe(blendColor);
+        expect(target.blendAmount).toBe(blendAmount);
         expect(target.runAnimations).toBe(runAnimations);
         expect(target.nodeTransformations).toBe(nodeTransformations);
     });
@@ -172,7 +204,10 @@ defineSuite([
         source.maximumScale = new ConstantProperty(200.0);
         source.incrementallyLoadTextures = new ConstantProperty(true);
         source.shadows = new ConstantProperty(ShadowMode.ENABLED);
+        source.heightReference = new ConstantProperty(HeightReference.CLAMP_TO_GROUND);
         source.distanceDisplayCondition = new ConstantProperty(new DistanceDisplayCondition());
+        source.blendColor = new ConstantProperty(new Color(0.0, 1.0, 0.0, 0.2));
+        source.blendAmount = new ConstantProperty(0.5);
         source.runAnimations = new ConstantProperty(true);
         source.nodeTransformations = {
             node1 : new NodeTransformationProperty(),
@@ -187,7 +222,10 @@ defineSuite([
         expect(result.maximumScale).toBe(source.maximumScale);
         expect(result.incrementallyLoadTextures).toBe(source.incrementallyLoadTextures);
         expect(result.shadows).toBe(source.shadows);
+        expect(result.heightReference).toBe(source.heightReference);
         expect(result.distanceDisplayCondition).toBe(source.distanceDisplayCondition);
+        expect(result.blendColor).toBe(source.blendColor);
+        expect(result.blendAmount).toBe(source.blendAmount);
         expect(result.runAnimations).toBe(source.runAnimations);
         expect(result.nodeTransformations).toEqual(source.nodeTransformations);
     });

From 4bd0ad605d92440034bc02e8bc16d0b9aef0a2d5 Mon Sep 17 00:00:00 2001
From: Sean Lilley <lilleyse@gmail.com>
Date: Mon, 5 Dec 2016 15:43:54 -0500
Subject: [PATCH 04/14] Support alpha in blend color

---
 Apps/Sandcastle/gallery/3D Models.html        | 20 +++++++++++--
 .../gallery/development/3D Models.html        | 20 +++++++++++--
 Source/Scene/Model.js                         | 30 +++++++++++++++++--
 3 files changed, 61 insertions(+), 9 deletions(-)

diff --git a/Apps/Sandcastle/gallery/3D Models.html b/Apps/Sandcastle/gallery/3D Models.html
index 3f6c292772c0..a772afc586db 100644
--- a/Apps/Sandcastle/gallery/3D Models.html	
+++ b/Apps/Sandcastle/gallery/3D Models.html	
@@ -48,6 +48,13 @@
             <input type="text" size="5" data-bind="value: blendColor">
         </td>
     </tr>
+    <tr>
+        <td>Blend Alpha</td>
+        <td>
+            <input type="range" min="0.0" max="1.0" step="0.01" data-bind="value: blendAlpha, valueUpdate: 'input'">
+            <input type="text" size="5" data-bind="value: blendAlpha">
+        </td>
+    </tr>
     </tbody></table>
 
 </div>
@@ -66,7 +73,8 @@
 // The viewModel tracks the state of our mini application.
 var viewModel = {
     blendAmount : 0.0,
-    blendColor : 0.0
+    blendColor : 0.0,
+    blendAlpha : 1.0
 };
 // Convert the viewModel members into knockout observables.
 Cesium.knockout.track(viewModel);
@@ -83,7 +91,13 @@
 
 Cesium.knockout.getObservable(viewModel, 'blendColor').subscribe(
     function(newValue) {
-        entity.model.blendColor = Cesium.Color.fromHsl(newValue, 1.0, 0.5);
+        entity.model.blendColor = Cesium.Color.fromHsl(newValue, 1.0, 0.5, viewModel.blendAlpha);
+    }
+);
+
+Cesium.knockout.getObservable(viewModel, 'blendAlpha').subscribe(
+    function(newValue) {
+        entity.model.blendColor = Cesium.Color.fromHsl(viewModel.blendColor, 1.0, 0.5, newValue);
     }
 );
 
@@ -106,7 +120,7 @@
             minimumPixelSize : 128,
             maximumScale : 20000,
             blendAmount : viewModel.blendAmount,
-            blendColor : Cesium.Color.fromHsl(viewModel.blendColor, 1.0, 0.5)
+            blendColor : Cesium.Color.fromHsl(viewModel.blendColor, 1.0, 0.5, viewModel.blendAlpha)
         }
     });
     viewer.trackedEntity = entity;
diff --git a/Apps/Sandcastle/gallery/development/3D Models.html b/Apps/Sandcastle/gallery/development/3D Models.html
index dbd8409deea8..dbc7680fcd9c 100644
--- a/Apps/Sandcastle/gallery/development/3D Models.html	
+++ b/Apps/Sandcastle/gallery/development/3D Models.html	
@@ -48,6 +48,13 @@
             <input type="text" size="5" data-bind="value: blendColor">
         </td>
     </tr>
+    <tr>
+        <td>Blend Alpha</td>
+        <td>
+            <input type="range" min="0.0" max="1.0" step="0.01" data-bind="value: blendAlpha, valueUpdate: 'input'">
+            <input type="text" size="5" data-bind="value: blendAlpha">
+        </td>
+    </tr>
     </tbody></table>
 
 </div>
@@ -65,7 +72,8 @@
 // The viewModel tracks the state of our mini application.
 var viewModel = {
     blendAmount : 0.0,
-    blendColor : 0.0
+    blendColor : 0.0,
+    blendAlpha : 1.0
 };
 
 // Convert the viewModel members into knockout observables.
@@ -83,7 +91,13 @@
 
 Cesium.knockout.getObservable(viewModel, 'blendColor').subscribe(
     function(newValue) {
-        model.blendColor = Cesium.Color.fromHsl(newValue, 1.0, 0.5);
+        entity.model.blendColor = Cesium.Color.fromHsl(newValue, 1.0, 0.5, viewModel.blendAlpha);
+    }
+);
+
+Cesium.knockout.getObservable(viewModel, 'blendAlpha').subscribe(
+    function(newValue) {
+        entity.model.blendColor = Cesium.Color.fromHsl(viewModel.blendColor, 1.0, 0.5, newValue);
     }
 );
 
@@ -106,7 +120,7 @@
 
     model.readyPromise.then(function(model) {
         model.blendAmount = viewModel.blendAmount;
-        model.blendColor = Cesium.Color.fromHsl(viewModel.blendColor, 1.0, 0.5);
+        model.blendColor = Cesium.Color.fromHsl(viewModel.blendColor, 1.0, viewModel.blendAlpha);
         // Play and loop all animations at half-speed
         model.activeAnimations.addAll({
             speedup : 0.5,
diff --git a/Source/Scene/Model.js b/Source/Scene/Model.js
index 78485264bc56..f9e602d44424 100644
--- a/Source/Scene/Model.js
+++ b/Source/Scene/Model.js
@@ -1739,15 +1739,28 @@ define([
         return shader;
     }
 
-    function modifyShaderForBlendColor(shader) {
+    function hasPremultipliedAlpha(model) {
+        var gltf = model.gltf;
+        return defined(gltf.asset) ? defaultValue(gltf.asset.premultipliedAlpha, false) : false;
+    }
+
+    function modifyShaderForBlendColor(shader, premultipliedAlpha) {
         shader = ShaderSource.replaceMain(shader, 'gltf_blend_main');
         shader +=
             'uniform vec4 gltf_blendColor; \n' +
             'uniform float gltf_blendAmount; \n' +
             'void main() \n' +
             '{ \n' +
-            '    gltf_blend_main(); \n' +
+            '    gltf_blend_main(); \n';
+
+        // Un-premultiply the alpha so that blending is correct.
+        if (premultipliedAlpha) {
+            shader += '    gl_FragColor.rgb /= gl_FragColor.a; \n';
+        }
+
+        shader +=
             '    gl_FragColor.rgb = mix(gl_FragColor.rgb, gltf_blendColor.rgb, gltf_blendAmount); \n' +
+            '    gl_FragColor.a *= gltf_blendColor.a; \n' +
             '} \n';
         return shader;
     }
@@ -1783,7 +1796,8 @@ define([
             vs = modifyShaderForQuantizedAttributes(vs, id, model, context);
         }
 
-        var blendFS = modifyShaderForBlendColor(fs);
+        var premultipliedAlpha = hasPremultipliedAlpha(model);
+        var blendFS = modifyShaderForBlendColor(fs, premultipliedAlpha);
 
         var drawVS = modifyShader(vs, id, model._vertexShaderLoaded);
         var drawFS = modifyShader(blendFS, id, model._fragmentShaderLoaded);
@@ -2319,6 +2333,16 @@ define([
         var polygonOffset = defaultValue(statesFunctions.polygonOffset, [0.0, 0.0]);
         var scissor = defaultValue(statesFunctions.scissor, [0.0, 0.0, 0.0, 0.0]);
 
+        // Change the render state to use traditional alpha blending instead of premultiplied alpha blending
+        if (booleanStates[WebGLConstants.BLEND] && hasPremultipliedAlpha(model)) {
+            if ((blendFuncSeparate[0] === WebGLConstants.ONE) && (blendFuncSeparate[1] === WebGLConstants.ONE_MINUS_SRC_ALPHA)) {
+                blendFuncSeparate[0] = WebGLConstants.SRC_ALPHA;
+                blendFuncSeparate[1] = WebGLConstants.ONE_MINUS_SRC_ALPHA;
+                blendFuncSeparate[2] = WebGLConstants.ONE;
+                blendFuncSeparate[3] = WebGLConstants.ONE_MINUS_SRC_ALPHA;
+            }
+        }
+
         rendererRenderStates[id] = RenderState.fromCache({
             frontFace : defined(statesFunctions.frontFace) ? statesFunctions.frontFace[0] : WebGLConstants.CCW,
             cull : {

From 250874e2dacd45663eaee89af948e4aafcee6188 Mon Sep 17 00:00:00 2001
From: Sean Lilley <lilleyse@gmail.com>
Date: Mon, 5 Dec 2016 16:39:27 -0500
Subject: [PATCH 05/14] Switch render states depending on alpha

---
 Source/Scene/Model.js | 72 +++++++++++++++++++++++++++++++++++++++----
 1 file changed, 66 insertions(+), 6 deletions(-)

diff --git a/Source/Scene/Model.js b/Source/Scene/Model.js
index f9e602d44424..05d142555125 100644
--- a/Source/Scene/Model.js
+++ b/Source/Scene/Model.js
@@ -48,6 +48,8 @@ define([
         '../ThirdParty/gltfDefaults',
         '../ThirdParty/Uri',
         '../ThirdParty/when',
+        './BlendingState',
+        './CullFace',
         './getBinaryAccessor',
         './HeightReference',
         './ModelAnimationCache',
@@ -108,6 +110,8 @@ define([
         gltfDefaults,
         Uri,
         when,
+        BlendingState,
+        CullFace,
         getBinaryAccessor,
         HeightReference,
         ModelAnimationCache,
@@ -2338,7 +2342,7 @@ define([
             if ((blendFuncSeparate[0] === WebGLConstants.ONE) && (blendFuncSeparate[1] === WebGLConstants.ONE_MINUS_SRC_ALPHA)) {
                 blendFuncSeparate[0] = WebGLConstants.SRC_ALPHA;
                 blendFuncSeparate[1] = WebGLConstants.ONE_MINUS_SRC_ALPHA;
-                blendFuncSeparate[2] = WebGLConstants.ONE;
+                blendFuncSeparate[2] = WebGLConstants.SRC_ALPHA;
                 blendFuncSeparate[3] = WebGLConstants.ONE_MINUS_SRC_ALPHA;
             }
         }
@@ -3087,7 +3091,12 @@ define([
                     command : command,
                     pickCommand : pickCommand,
                     command2D : command2D,
-                    pickCommand2D : pickCommand2D
+                    pickCommand2D : pickCommand2D,
+                    // Generate on demand when blendColor alpha is less than 1.0
+                    translucentCommandBack : undefined,
+                    translucentCommandFront : undefined,
+                    translucentCommandBack2D : undefined,
+                    translucentCommandFront2D : undefined
                 };
                 runtimeNode.commands.push(nodeCommand);
                 nodeCommands.push(nodeCommand);
@@ -3464,6 +3473,46 @@ define([
         }
     }
 
+    function getTranslucentRenderState(renderState, cullFace) {
+        var rs = clone(renderState, true);
+        rs.cull.enabled = true;
+        rs.cull.face = cullFace;
+        rs.depthTest.enabled = true;
+        rs.depthMask = false;
+        rs.blending = BlendingState.ALPHA_BLEND;
+
+        return RenderState.fromCache(rs);
+    }
+
+    function deriveTranslucentCommand(command, cullFace) {
+        var translucentCommand = DrawCommand.shallowClone(command);
+        translucentCommand.pass = Pass.TRANSLUCENT;
+        translucentCommand.renderState = getTranslucentRenderState(command.renderState, cullFace);
+        return translucentCommand;
+    }
+
+    function updateBlendColor(model, frameState) {
+        var scene3DOnly = frameState.scene3DOnly;
+        if (model.blendColor.alpha < 1.0) {
+            var nodeCommands = model._nodeCommands;
+            var length = nodeCommands.length;
+            // Generate translucent commands when the blend color has an alpha less than 1.0
+            if (!defined(nodeCommands[0].translucentCommandBack)) {
+                for (var i = 0; i < length; ++i) {
+                    var nodeCommand = nodeCommands[i];
+                    var command = nodeCommand.command;
+                    nodeCommand.translucentCommandBack = deriveTranslucentCommand(command, CullFace.FRONT);
+                    nodeCommand.translucentCommandFront = deriveTranslucentCommand(command, CullFace.BACK);
+                    if (!scene3DOnly) {
+                        var command2D = nodeCommand.command2D;
+                        nodeCommand.translucentCommandBack2D = deriveTranslucentCommand(command2D, CullFace.FRONT);
+                        nodeCommand.translucentCommandFront2D = deriveTranslucentCommand(command2D, CullFace.BACK);
+                    }
+                }
+            }
+        }
+    }
+
     var scratchBoundingSphere = new BoundingSphere();
 
     function scaleInPixels(positionWC, radius, frameState) {
@@ -3858,6 +3907,7 @@ define([
             updateWireframe(this);
             updateShowBoundingVolume(this);
             updateShadows(this);
+            updateBlendColor(this, frameState);
         }
 
         if (justLoaded) {
@@ -3889,13 +3939,23 @@ define([
                 for (i = 0; i < length; ++i) {
                     nc = nodeCommands[i];
                     if (nc.show) {
-                        var command = nc.command;
-                        commandList.push(command);
+                        var translucent = (this.blendColor.alpha < 1.0);
+                        if (translucent) {
+                            commandList.push(nc.translucentCommandBack);
+                            commandList.push(nc.translucentCommandFront);
+                        } else {
+                            commandList.push(nc.command);
+                        }
 
-                        boundingVolume = command.boundingVolume;
+                        boundingVolume = nc.command.boundingVolume;
                         if (frameState.mode === SceneMode.SCENE2D &&
                             (boundingVolume.center.y + boundingVolume.radius > idl2D || boundingVolume.center.y - boundingVolume.radius < idl2D)) {
-                            commandList.push(nc.command2D);
+                            if (translucent) {
+                                commandList.push(nc.translucentCommandBack2D);
+                                commandList.push(nc.translucentCommandFront2D);
+                            } else {
+                                commandList.push(nc.command2D);
+                            }
                         }
                     }
                 }

From dec5b0a28c57d336ceaa6ebbd8ed5d3173bb9820 Mon Sep 17 00:00:00 2001
From: Sean Lilley <lilleyse@gmail.com>
Date: Mon, 5 Dec 2016 16:54:59 -0500
Subject: [PATCH 06/14] Alpha test

---
 Apps/Sandcastle/gallery/3D Models.html             | 2 +-
 Apps/Sandcastle/gallery/development/3D Models.html | 1 -
 Source/Scene/Model.js                              | 1 +
 Specs/Scene/ModelSpec.js                           | 7 +++++++
 4 files changed, 9 insertions(+), 2 deletions(-)

diff --git a/Apps/Sandcastle/gallery/3D Models.html b/Apps/Sandcastle/gallery/3D Models.html
index a772afc586db..2699da4aa17a 100644
--- a/Apps/Sandcastle/gallery/3D Models.html	
+++ b/Apps/Sandcastle/gallery/3D Models.html	
@@ -56,7 +56,6 @@
         </td>
     </tr>
     </tbody></table>
-
 </div>
 <script id="cesium_sandcastle_script">
 function startup(Cesium) {
@@ -76,6 +75,7 @@
     blendColor : 0.0,
     blendAlpha : 1.0
 };
+
 // Convert the viewModel members into knockout observables.
 Cesium.knockout.track(viewModel);
 
diff --git a/Apps/Sandcastle/gallery/development/3D Models.html b/Apps/Sandcastle/gallery/development/3D Models.html
index dbc7680fcd9c..0c86f0eed947 100644
--- a/Apps/Sandcastle/gallery/development/3D Models.html	
+++ b/Apps/Sandcastle/gallery/development/3D Models.html	
@@ -56,7 +56,6 @@
         </td>
     </tr>
     </tbody></table>
-
 </div>
 <script id="cesium_sandcastle_script">
 function startup(Cesium) {
diff --git a/Source/Scene/Model.js b/Source/Scene/Model.js
index 05d142555125..6ffa3cfa4b95 100644
--- a/Source/Scene/Model.js
+++ b/Source/Scene/Model.js
@@ -1766,6 +1766,7 @@ define([
             '    gl_FragColor.rgb = mix(gl_FragColor.rgb, gltf_blendColor.rgb, gltf_blendAmount); \n' +
             '    gl_FragColor.a *= gltf_blendColor.a; \n' +
             '} \n';
+
         return shader;
     }
 
diff --git a/Specs/Scene/ModelSpec.js b/Specs/Scene/ModelSpec.js
index c9eeb1ab6532..72c18b640237 100644
--- a/Specs/Scene/ModelSpec.js
+++ b/Specs/Scene/ModelSpec.js
@@ -1894,6 +1894,13 @@ defineSuite([
             blendColor = scene.renderForSpecs();
             expect(blendColor[0]).toEqual(0);
             expect(blendColor[1]).toEqual(255);
+
+            // Check alpha. Alpha works independently of the blendAmount.
+            model.blendColor = Color.fromAlpha(Color.LIME, 0.5);
+            blendColor = scene.renderForSpecs();
+            expect(blendColor[0]).toEqual(0);
+            expect(blendColor[1]).toBeLessThan(255);
+            expect(blendColor[1]).toBeGreaterThan(0);
         });
     });
 

From 5c20c55771f2ea7e7f79c8f9c12154fa5f0b71fc Mon Sep 17 00:00:00 2001
From: Sean Lilley <lilleyse@gmail.com>
Date: Mon, 5 Dec 2016 17:24:12 -0500
Subject: [PATCH 07/14] Remove separation of front/back commands

---
 .../gallery/development/3D Models.html        |  4 +-
 Source/Scene/Model.js                         | 42 ++++++-------------
 2 files changed, 15 insertions(+), 31 deletions(-)

diff --git a/Apps/Sandcastle/gallery/development/3D Models.html b/Apps/Sandcastle/gallery/development/3D Models.html
index 0c86f0eed947..c674c357f7c5 100644
--- a/Apps/Sandcastle/gallery/development/3D Models.html	
+++ b/Apps/Sandcastle/gallery/development/3D Models.html	
@@ -90,13 +90,13 @@
 
 Cesium.knockout.getObservable(viewModel, 'blendColor').subscribe(
     function(newValue) {
-        entity.model.blendColor = Cesium.Color.fromHsl(newValue, 1.0, 0.5, viewModel.blendAlpha);
+        model.blendColor = Cesium.Color.fromHsl(newValue, 1.0, 0.5, viewModel.blendAlpha);
     }
 );
 
 Cesium.knockout.getObservable(viewModel, 'blendAlpha').subscribe(
     function(newValue) {
-        entity.model.blendColor = Cesium.Color.fromHsl(viewModel.blendColor, 1.0, 0.5, newValue);
+        model.blendColor = Cesium.Color.fromHsl(viewModel.blendColor, 1.0, 0.5, newValue);
     }
 );
 
diff --git a/Source/Scene/Model.js b/Source/Scene/Model.js
index 6ffa3cfa4b95..0fb836be9b16 100644
--- a/Source/Scene/Model.js
+++ b/Source/Scene/Model.js
@@ -49,7 +49,6 @@ define([
         '../ThirdParty/Uri',
         '../ThirdParty/when',
         './BlendingState',
-        './CullFace',
         './getBinaryAccessor',
         './HeightReference',
         './ModelAnimationCache',
@@ -111,7 +110,6 @@ define([
         Uri,
         when,
         BlendingState,
-        CullFace,
         getBinaryAccessor,
         HeightReference,
         ModelAnimationCache,
@@ -3094,10 +3092,8 @@ define([
                     command2D : command2D,
                     pickCommand2D : pickCommand2D,
                     // Generate on demand when blendColor alpha is less than 1.0
-                    translucentCommandBack : undefined,
-                    translucentCommandFront : undefined,
-                    translucentCommandBack2D : undefined,
-                    translucentCommandFront2D : undefined
+                    translucentCommand : undefined,
+                    translucentCommand2D : undefined
                 };
                 runtimeNode.commands.push(nodeCommand);
                 nodeCommands.push(nodeCommand);
@@ -3474,10 +3470,9 @@ define([
         }
     }
 
-    function getTranslucentRenderState(renderState, cullFace) {
+    function getTranslucentRenderState(renderState) {
         var rs = clone(renderState, true);
-        rs.cull.enabled = true;
-        rs.cull.face = cullFace;
+        rs.cull.enabled = false;
         rs.depthTest.enabled = true;
         rs.depthMask = false;
         rs.blending = BlendingState.ALPHA_BLEND;
@@ -3485,10 +3480,10 @@ define([
         return RenderState.fromCache(rs);
     }
 
-    function deriveTranslucentCommand(command, cullFace) {
+    function deriveTranslucentCommand(command) {
         var translucentCommand = DrawCommand.shallowClone(command);
         translucentCommand.pass = Pass.TRANSLUCENT;
-        translucentCommand.renderState = getTranslucentRenderState(command.renderState, cullFace);
+        translucentCommand.renderState = getTranslucentRenderState(command.renderState);
         return translucentCommand;
     }
 
@@ -3498,16 +3493,14 @@ define([
             var nodeCommands = model._nodeCommands;
             var length = nodeCommands.length;
             // Generate translucent commands when the blend color has an alpha less than 1.0
-            if (!defined(nodeCommands[0].translucentCommandBack)) {
+            if (!defined(nodeCommands[0].translucentCommand)) {
                 for (var i = 0; i < length; ++i) {
                     var nodeCommand = nodeCommands[i];
                     var command = nodeCommand.command;
-                    nodeCommand.translucentCommandBack = deriveTranslucentCommand(command, CullFace.FRONT);
-                    nodeCommand.translucentCommandFront = deriveTranslucentCommand(command, CullFace.BACK);
+                    nodeCommand.translucentCommand = deriveTranslucentCommand(command);
                     if (!scene3DOnly) {
                         var command2D = nodeCommand.command2D;
-                        nodeCommand.translucentCommandBack2D = deriveTranslucentCommand(command2D, CullFace.FRONT);
-                        nodeCommand.translucentCommandFront2D = deriveTranslucentCommand(command2D, CullFace.BACK);
+                        nodeCommand.translucentCommand2D = deriveTranslucentCommand(command2D);
                     }
                 }
             }
@@ -3941,22 +3934,13 @@ define([
                     nc = nodeCommands[i];
                     if (nc.show) {
                         var translucent = (this.blendColor.alpha < 1.0);
-                        if (translucent) {
-                            commandList.push(nc.translucentCommandBack);
-                            commandList.push(nc.translucentCommandFront);
-                        } else {
-                            commandList.push(nc.command);
-                        }
-
+                        var command = translucent ? nc.translucentCommand : nc.command;
+                        commandList.push(command);
                         boundingVolume = nc.command.boundingVolume;
                         if (frameState.mode === SceneMode.SCENE2D &&
                             (boundingVolume.center.y + boundingVolume.radius > idl2D || boundingVolume.center.y - boundingVolume.radius < idl2D)) {
-                            if (translucent) {
-                                commandList.push(nc.translucentCommandBack2D);
-                                commandList.push(nc.translucentCommandFront2D);
-                            } else {
-                                commandList.push(nc.command2D);
-                            }
+                            var command2D = translucent ? nc.translucentCommand2D : nc.command2D;
+                            commandList.push(command2D);
                         }
                     }
                 }

From dcf2f2b2e77431ce4d85b4687acd332e9364f00e Mon Sep 17 00:00:00 2001
From: Patrick Cozzi <pjcozzi@gmail.com>
Date: Mon, 5 Dec 2016 17:30:19 -0500
Subject: [PATCH 08/14] Move CHANGES.md update to 1.29

---
 CHANGES.md | 5 ++++-
 1 file changed, 4 insertions(+), 1 deletion(-)

diff --git a/CHANGES.md b/CHANGES.md
index 57875f22f066..f7ec8da9f56a 100644
--- a/CHANGES.md
+++ b/CHANGES.md
@@ -1,6 +1,10 @@
 Change Log
 ==========
 
+### 1.29 - 2017-01-02
+
+* Added the ability to blend a `Model` with a color/translucency. [#4547](https://github.com/AnalyticalGraphicsInc/cesium/pull/4547)
+
 ### 1.28 - 2016-12-01
 
 * Improved terrain/imagery load ordering, especially when the terrain is already fully loaded and a new imagery layer is loaded.  This results in a 25% reduction in load times in many cases. [#4616](https://github.com/AnalyticalGraphicsInc/cesium/pull/4616)
@@ -12,7 +16,6 @@ Change Log
 * Fall back to packing floats into an unsigned byte texture when floating point textures are unsupported. [#4563](https://github.com/AnalyticalGraphicsInc/cesium/issues/4563)
 * Added support for saving html and css in GitHub Gists. [#4125](https://github.com/AnalyticalGraphicsInc/cesium/issues/4125)
 * Fixed `Cartographic.fromCartesian` when the cartesian is not on the ellipsoid surface. [#4611](https://github.com/AnalyticalGraphicsInc/cesium/issues/4611)
-* Added the ability to blend a `Model` with a color. [#4547](https://github.com/AnalyticalGraphicsInc/cesium/pull/4547)
 
 ### 1.27 - 2016-11-01
 * Deprecated

From 77ace36d767e95362b0be85ee47c6b62c958bbdc Mon Sep 17 00:00:00 2001
From: Sean Lilley <lilleyse@gmail.com>
Date: Mon, 5 Dec 2016 20:20:47 -0500
Subject: [PATCH 09/14] Small fix

---
 Apps/Sandcastle/gallery/development/3D Models.html | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/Apps/Sandcastle/gallery/development/3D Models.html b/Apps/Sandcastle/gallery/development/3D Models.html
index c674c357f7c5..fa2d5d1b030d 100644
--- a/Apps/Sandcastle/gallery/development/3D Models.html	
+++ b/Apps/Sandcastle/gallery/development/3D Models.html	
@@ -119,7 +119,7 @@
 
     model.readyPromise.then(function(model) {
         model.blendAmount = viewModel.blendAmount;
-        model.blendColor = Cesium.Color.fromHsl(viewModel.blendColor, 1.0, viewModel.blendAlpha);
+        model.blendColor = Cesium.Color.fromHsl(viewModel.blendColor, 1.0, 0.5, viewModel.blendAlpha);
         // Play and loop all animations at half-speed
         model.activeAnimations.addAll({
             speedup : 0.5,

From 84fbd37282e27d10da786f2ac5e309e252ed07c8 Mon Sep 17 00:00:00 2001
From: Sean Lilley <lilleyse@gmail.com>
Date: Mon, 5 Dec 2016 22:37:47 -0500
Subject: [PATCH 10/14] Use ColorBlendMode instead of always Mix

---
 Apps/Sandcastle/gallery/3D Models.html        | 66 +++++++++++------
 .../gallery/development/3D Models.html        | 66 +++++++++++------
 Source/DataSources/CzmlDataSource.js          |  9 ++-
 Source/DataSources/ModelGraphics.js           | 49 ++++++++-----
 Source/DataSources/ModelVisualizer.js         | 12 ++-
 Source/Scene/ColorBlendMode.js                | 26 +++++++
 Source/Scene/Model.js                         | 73 +++++++++++++------
 Specs/DataSources/CzmlDataSourceSpec.js       | 28 ++++---
 Specs/DataSources/ModelGraphicsSpec.js        | 57 +++++++++------
 Specs/Scene/ModelSpec.js                      | 67 +++++++++++------
 10 files changed, 306 insertions(+), 147 deletions(-)
 create mode 100644 Source/Scene/ColorBlendMode.js

diff --git a/Apps/Sandcastle/gallery/3D Models.html b/Apps/Sandcastle/gallery/3D Models.html
index 2699da4aa17a..525139952345 100644
--- a/Apps/Sandcastle/gallery/3D Models.html	
+++ b/Apps/Sandcastle/gallery/3D Models.html	
@@ -35,24 +35,25 @@
 <div id="toolbar">
     <table><tbody>
     <tr>
-        <td>Blend Amount</td>
-        <td>
-            <input type="range" min="0.0" max="1.0" step="0.01" data-bind="value: blendAmount, valueUpdate: 'input'">
-            <input type="text" size="5" data-bind="value: blendAmount">
-        </td>
+        <td>Mode</td>
+        <td><select data-bind="options: colorBlendModes, value: colorBlendMode"></select></td>
+    </tr>
+    <tr>
+        <td>Color</td>
+        <td><select data-bind="options: colors, value: color"></select></td>
     </tr>
     <tr>
-        <td>Blend Color</td>
+        <td>Alpha</td>
         <td>
-            <input type="range" min="0.0" max="1.0" step="0.01" data-bind="value: blendColor, valueUpdate: 'input'">
-            <input type="text" size="5" data-bind="value: blendColor">
+            <input type="range" min="0.0" max="1.0" step="0.01" data-bind="value: alpha, valueUpdate: 'input'">
+            <input type="text" size="5" data-bind="value: alpha">
         </td>
     </tr>
     <tr>
-        <td>Blend Alpha</td>
+        <td data-bind="style: { color: colorBlendAmountEnabled ? '' : 'gray'}">Mix</td>
         <td>
-            <input type="range" min="0.0" max="1.0" step="0.01" data-bind="value: blendAlpha, valueUpdate: 'input'">
-            <input type="text" size="5" data-bind="value: blendAlpha">
+            <input type="range" min="0.0" max="1.0" step="0.01" data-bind="value: colorBlendAmount, valueUpdate: 'input', enable: colorBlendAmountEnabled">
+            <input type="text" size="5" data-bind="value: colorBlendAmount, enable: colorBlendAmountEnabled">
         </td>
     </tr>
     </tbody></table>
@@ -69,11 +70,23 @@
 
 var entity;
 
+function getColorBlendMode(colorBlendMode) {
+    return Cesium.ColorBlendMode[colorBlendMode.toUpperCase()];
+}
+
+function getColor(color) {
+    return Cesium.Color[color.toUpperCase()];
+}
+
 // The viewModel tracks the state of our mini application.
 var viewModel = {
-    blendAmount : 0.0,
-    blendColor : 0.0,
-    blendAlpha : 1.0
+    color : 'White',
+    colors : ['White', 'Red', 'Green', 'Blue', 'Yellow', 'Gray'],
+    alpha : 1.0,
+    colorBlendMode : 'Highlight',
+    colorBlendModes : ['Highlight', 'Replace', 'Mix'],
+    colorBlendAmount : 0.5,
+    colorBlendAmountEnabled : false
 };
 
 // Convert the viewModel members into knockout observables.
@@ -83,21 +96,29 @@
 var toolbar = document.getElementById('toolbar');
 Cesium.knockout.applyBindings(viewModel, toolbar);
 
-Cesium.knockout.getObservable(viewModel, 'blendAmount').subscribe(
+Cesium.knockout.getObservable(viewModel, 'color').subscribe(
+    function(newValue) {
+        entity.model.color = Cesium.Color.fromAlpha(getColor(newValue), viewModel.alpha);
+    }
+);
+
+Cesium.knockout.getObservable(viewModel, 'alpha').subscribe(
     function(newValue) {
-        entity.model.blendAmount = newValue;
+        entity.model.color = Cesium.Color.fromAlpha(getColor(viewModel.color), newValue);
     }
 );
 
-Cesium.knockout.getObservable(viewModel, 'blendColor').subscribe(
+Cesium.knockout.getObservable(viewModel, 'colorBlendMode').subscribe(
     function(newValue) {
-        entity.model.blendColor = Cesium.Color.fromHsl(newValue, 1.0, 0.5, viewModel.blendAlpha);
+        var colorBlendMode = getColorBlendMode(newValue);
+        entity.model.colorBlendMode = colorBlendMode;
+        viewModel.colorBlendAmountEnabled = (colorBlendMode === Cesium.ColorBlendMode.MIX);
     }
 );
 
-Cesium.knockout.getObservable(viewModel, 'blendAlpha').subscribe(
+Cesium.knockout.getObservable(viewModel, 'colorBlendAmount').subscribe(
     function(newValue) {
-        entity.model.blendColor = Cesium.Color.fromHsl(viewModel.blendColor, 1.0, 0.5, newValue);
+        entity.model.colorBlendAmount = newValue;
     }
 );
 
@@ -119,8 +140,9 @@
             uri : url,
             minimumPixelSize : 128,
             maximumScale : 20000,
-            blendAmount : viewModel.blendAmount,
-            blendColor : Cesium.Color.fromHsl(viewModel.blendColor, 1.0, 0.5, viewModel.blendAlpha)
+            color : Cesium.Color.fromAlpha(getColor(viewModel.color), viewModel.alpha),
+            colorBlendMode : getColorBlendMode(viewModel.colorBlendMode),
+            colorBlendAmount : viewModel.colorBlendAmount
         }
     });
     viewer.trackedEntity = entity;
diff --git a/Apps/Sandcastle/gallery/development/3D Models.html b/Apps/Sandcastle/gallery/development/3D Models.html
index fa2d5d1b030d..ffc969e4dc54 100644
--- a/Apps/Sandcastle/gallery/development/3D Models.html	
+++ b/Apps/Sandcastle/gallery/development/3D Models.html	
@@ -35,24 +35,25 @@
 <div id="toolbar">
     <table><tbody>
     <tr>
-        <td>Blend Amount</td>
-        <td>
-            <input type="range" min="0.0" max="1.0" step="0.01" data-bind="value: blendAmount, valueUpdate: 'input'">
-            <input type="text" size="5" data-bind="value: blendAmount">
-        </td>
+        <td>Mode</td>
+        <td><select data-bind="options: colorBlendModes, value: colorBlendMode"></select></td>
+    </tr>
+    <tr>
+        <td>Color</td>
+        <td><select data-bind="options: colors, value: color"></select></td>
     </tr>
     <tr>
-        <td>Blend Color</td>
+        <td>Alpha</td>
         <td>
-            <input type="range" min="0.0" max="1.0" step="0.01" data-bind="value: blendColor, valueUpdate: 'input'">
-            <input type="text" size="5" data-bind="value: blendColor">
+            <input type="range" min="0.0" max="1.0" step="0.01" data-bind="value: alpha, valueUpdate: 'input'">
+            <input type="text" size="5" data-bind="value: alpha">
         </td>
     </tr>
     <tr>
-        <td>Blend Alpha</td>
+        <td data-bind="style: { color: colorBlendAmountEnabled ? '' : 'gray'}">Mix</td>
         <td>
-            <input type="range" min="0.0" max="1.0" step="0.01" data-bind="value: blendAlpha, valueUpdate: 'input'">
-            <input type="text" size="5" data-bind="value: blendAlpha">
+            <input type="range" min="0.0" max="1.0" step="0.01" data-bind="value: colorBlendAmount, valueUpdate: 'input', enable: colorBlendAmountEnabled">
+            <input type="text" size="5" data-bind="value: colorBlendAmount, enable: colorBlendAmountEnabled">
         </td>
     </tr>
     </tbody></table>
@@ -68,11 +69,23 @@
 var scene = viewer.scene;
 var model;
 
+function getColorBlendMode(colorBlendMode) {
+    return Cesium.ColorBlendMode[colorBlendMode.toUpperCase()];
+}
+
+function getColor(color) {
+    return Cesium.Color[color.toUpperCase()];
+}
+
 // The viewModel tracks the state of our mini application.
 var viewModel = {
-    blendAmount : 0.0,
-    blendColor : 0.0,
-    blendAlpha : 1.0
+    color : 'White',
+    colors : ['White', 'Red', 'Green', 'Blue', 'Yellow', 'Gray'],
+    alpha : 1.0,
+    colorBlendMode : 'Highlight',
+    colorBlendModes : ['Highlight', 'Replace', 'Mix'],
+    colorBlendAmount : 0.5,
+    colorBlendAmountEnabled : false
 };
 
 // Convert the viewModel members into knockout observables.
@@ -82,21 +95,29 @@
 var toolbar = document.getElementById('toolbar');
 Cesium.knockout.applyBindings(viewModel, toolbar);
 
-Cesium.knockout.getObservable(viewModel, 'blendAmount').subscribe(
+Cesium.knockout.getObservable(viewModel, 'color').subscribe(
+    function(newValue) {
+        model.color = Cesium.Color.fromAlpha(getColor(newValue), viewModel.alpha);
+    }
+);
+
+Cesium.knockout.getObservable(viewModel, 'alpha').subscribe(
     function(newValue) {
-        model.blendAmount = newValue;
+        model.color = Cesium.Color.fromAlpha(getColor(viewModel.color), newValue);
     }
 );
 
-Cesium.knockout.getObservable(viewModel, 'blendColor').subscribe(
+Cesium.knockout.getObservable(viewModel, 'colorBlendMode').subscribe(
     function(newValue) {
-        model.blendColor = Cesium.Color.fromHsl(newValue, 1.0, 0.5, viewModel.blendAlpha);
+        var colorBlendMode = getColorBlendMode(newValue);
+        model.colorBlendMode = colorBlendMode;
+        viewModel.colorBlendAmountEnabled = (colorBlendMode === Cesium.ColorBlendMode.MIX);
     }
 );
 
-Cesium.knockout.getObservable(viewModel, 'blendAlpha').subscribe(
+Cesium.knockout.getObservable(viewModel, 'colorBlendAmount').subscribe(
     function(newValue) {
-        model.blendColor = Cesium.Color.fromHsl(viewModel.blendColor, 1.0, 0.5, newValue);
+        model.colorBlendAmount = newValue;
     }
 );
 
@@ -118,8 +139,9 @@
     }));
 
     model.readyPromise.then(function(model) {
-        model.blendAmount = viewModel.blendAmount;
-        model.blendColor = Cesium.Color.fromHsl(viewModel.blendColor, 1.0, 0.5, viewModel.blendAlpha);
+        model.color = Cesium.Color.fromAlpha(getColor(viewModel.color), viewModel.alpha);
+        model.colorBlendMode = getColorBlendMode(viewModel.colorBlendMode);
+        model.colorBlendAmount = viewModel.colorBlendAmount;
         // Play and loop all animations at half-speed
         model.activeAnimations.addAll({
             speedup : 0.5,
diff --git a/Source/DataSources/CzmlDataSource.js b/Source/DataSources/CzmlDataSource.js
index dc1624d95c7e..02b3b7ca4bd5 100644
--- a/Source/DataSources/CzmlDataSource.js
+++ b/Source/DataSources/CzmlDataSource.js
@@ -34,6 +34,7 @@ define([
         '../Core/Spherical',
         '../Core/TimeInterval',
         '../Core/TimeIntervalCollection',
+        '../Scene/ColorBlendMode',
         '../Scene/HeightReference',
         '../Scene/HorizontalOrigin',
         '../Scene/LabelStyle',
@@ -118,6 +119,7 @@ define([
         Spherical,
         TimeInterval,
         TimeIntervalCollection,
+        ColorBlendMode,
         HeightReference,
         HorizontalOrigin,
         LabelStyle,
@@ -430,6 +432,8 @@ define([
                 return unwrapCartesianInterval(czmlInterval);
             case Color:
                 return unwrapColorInterval(czmlInterval);
+            case ColorBlendMode:
+                return ColorBlendMode[defaultValue(czmlInterval.colorBlendMode, czmlInterval)];
             case CornerType:
                 return CornerType[defaultValue(czmlInterval.cornerType, czmlInterval)];
             case HeightReference:
@@ -1413,8 +1417,9 @@ define([
         processPacketData(Boolean, model, 'runAnimations', modelData.runAnimations, interval, sourceUri, entityCollection);
         processPacketData(ShadowMode, model, 'shadows', modelData.shadows, interval, sourceUri, entityCollection);
         processPacketData(HeightReference, model, 'heightReference', modelData.heightReference, interval, sourceUri, entityCollection);
-        processPacketData(Color, model, 'blendColor', modelData.blendColor, interval, sourceUri, entityCollection);
-        processPacketData(Number, model, 'blendAmount', modelData.blendAmount, interval, sourceUri, entityCollection);
+        processPacketData(Color, model, 'color', modelData.color, interval, sourceUri, entityCollection);
+        processPacketData(ColorBlendMode, model, 'colorBlendMode', modelData.colorBlendMode, interval, sourceUri, entityCollection);
+        processPacketData(Number, model, 'colorBlendAmount', modelData.colorBlendAmount, interval, sourceUri, entityCollection);
 
         var nodeTransformationsData = modelData.nodeTransformations;
         if (defined(nodeTransformationsData)) {
diff --git a/Source/DataSources/ModelGraphics.js b/Source/DataSources/ModelGraphics.js
index c2249b75f36b..d98013280b19 100644
--- a/Source/DataSources/ModelGraphics.js
+++ b/Source/DataSources/ModelGraphics.js
@@ -50,8 +50,10 @@ define([
      * @param {Property} [options.shadows=ShadowMode.ENABLED] An enum Property specifying whether the model casts or receives shadows from each light source.
      * @param {Property} [options.heightReference=HeightReference.NONE] A Property specifying what the height is relative to.
      * @param {Property} [options.distanceDisplayCondition] A Property specifying at what distance from the camera that this model will be displayed.
-     * @param {Property} [options.blendColor=Color.RED] A Property specifying the {@link Color} that blends with the model's rendered color.
-     * @param {Property} [options.blendAmount=0.0] A numeric Property specifying a value used to mix between the render color and blend color. A value of 0.0 results in no blending while a value of 1.0 results in a solid blend color.
+     * @param {Property} [options.color=Color.WHITE] A Property specifying the {@link Color} that blends with the model's rendered color.
+     * @param {Property} [options.colorBlendMode=ColorBlendMode.HIGHLIGHT] An enum Property specifying how the color blends with the model.
+     * @param {Property} [options.colorBlendAmount=0.5] A numeric Property specifying the color strength when the <code>colorBlendMode</code> is <code>MIX</code>. A value of 0.0 results in the model's rendered color while a value of 1.0 results in a solid color, with any value in-between resulting in a mix of the two.
+     *
      * @see {@link http://cesiumjs.org/2014/03/03/Cesium-3D-Models-Tutorial/|3D Models Tutorial}
      * @demo {@link http://cesiumjs.org/Cesium/Apps/Sandcastle/index.html?src=3D%20Models.html|Cesium Sandcastle 3D Models Demo}
      */
@@ -78,10 +80,12 @@ define([
         this._heightReferenceSubscription = undefined;
         this._distanceDisplayCondition = undefined;
         this._distanceDisplayConditionSubscription = undefined;
-        this._blendColor = undefined;
-        this._blendColorSubscription = undefined;
-        this._blendAmount = undefined;
-        this._blendAmountSubscription = undefined;
+        this._color = undefined;
+        this._colorSubscription = undefined;
+        this._colorBlendMode = undefined;
+        this._colorBlendModeSubscription = undefined;
+        this._colorBlendAmount = undefined;
+        this._colorBlendAmountSubscription = undefined;
         this._definitionChanged = new Event();
 
         this.merge(defaultValue(options, defaultValue.EMPTY_OBJECT));
@@ -194,21 +198,30 @@ define([
         distanceDisplayCondition : createPropertyDescriptor('distanceDisplayCondition'),
 
         /**
-         * Gets or sets the Property specifying the {@link Color} color that blends with the model's rendered color.
+         * Gets or sets the Property specifying the {@link Color} that blends with the model's rendered color.
          * @memberof ModelGraphics.prototype
          * @type {Property}
-         * @default Color.RED
+         * @default Color.WHITE
          */
-        blendColor : createPropertyDescriptor('blendColor'),
+        color : createPropertyDescriptor('color'),
 
         /**
-         * Gets or sets the numeric Property specifying specifying a value used to mix between the render color
-         * and blend color. A value of 0.0 results in no blending while a value of 1.0 results in a solid blend color.
+         * Gets or sets the enum Property specifying how the color blends with the model.
          * @memberof ModelGraphics.prototype
          * @type {Property}
-         * @default 0.0
+         * @default ColorBlendMode.HIGHLIGHT
+         */
+        colorBlendMode : createPropertyDescriptor('colorBlendMode'),
+
+        /**
+         * A numeric Property specifying the color strength when the <code>colorBlendMode</code> is MIX.
+         * A value of 0.0 results in the model's rendered color while a value of 1.0 results in a solid color, with
+         * any value in-between resulting in a mix of the two.
+         * @memberof ModelGraphics.prototype
+         * @type {Property}
+         * @default 0.5
          */
-        blendAmount : createPropertyDescriptor('blendAmount')
+        colorBlendAmount : createPropertyDescriptor('colorBlendAmount')
     });
 
     /**
@@ -232,8 +245,9 @@ define([
         result.nodeTransformations = this.nodeTransformations;
         result.heightReference = this._heightReference;
         result.distanceDisplayCondition = this.distanceDisplayCondition;
-        result.blendColor = this.blendColor;
-        result.blendAmount = this.blendAmount;
+        result.color = this.color;
+        result.colorBlendMode = this.colorBlendMode;
+        result.colorBlendAmount = this.colorBlendAmount;
 
         return result;
     };
@@ -261,8 +275,9 @@ define([
         this.runAnimations = defaultValue(this.runAnimations, source.runAnimations);
         this.heightReference = defaultValue(this.heightReference, source.heightReference);
         this.distanceDisplayCondition = defaultValue(this.distanceDisplayCondition, source.distanceDisplayCondition);
-        this.blendColor = defaultValue(this.blendColor, source.blendColor);
-        this.blendAmount = defaultValue(this.blendAmount, source.blendAmount);
+        this.color = defaultValue(this.color, source.color);
+        this.colorBlendMode = defaultValue(this.colorBlendMode, source.colorBlendMode);
+        this.colorBlendAmount = defaultValue(this.colorBlendAmount, source.colorBlendAmount);
 
         var sourceNodeTransformations = source.nodeTransformations;
         if (defined(sourceNodeTransformations)) {
diff --git a/Source/DataSources/ModelVisualizer.js b/Source/DataSources/ModelVisualizer.js
index 7e61acdc1f2c..0cfd2fc8c248 100644
--- a/Source/DataSources/ModelVisualizer.js
+++ b/Source/DataSources/ModelVisualizer.js
@@ -7,6 +7,7 @@ define([
         '../Core/destroyObject',
         '../Core/DeveloperError',
         '../Core/Matrix4',
+        '../Scene/ColorBlendMode',
         '../Scene/HeightReference',
         '../Scene/Model',
         '../Scene/ModelAnimationLoop',
@@ -21,6 +22,7 @@ define([
         destroyObject,
         DeveloperError,
         Matrix4,
+        ColorBlendMode,
         HeightReference,
         Model,
         ModelAnimationLoop,
@@ -34,8 +36,9 @@ define([
     var defaultIncrementallyLoadTextures = true;
     var defaultShadows = ShadowMode.ENABLED;
     var defaultHeightReference = HeightReference.NONE;
-    var defaultBlendColor = Color.RED;
-    var defaultBlendAmount = 0.0;
+    var defaultColor = Color.WHITE;
+    var defaultColorBlendMode = ColorBlendMode.HIGHLIGHT;
+    var defaultColorBlendAmount = 0.5;
 
     var color = new Color();
     var modelMatrixScratch = new Matrix4();
@@ -144,8 +147,9 @@ define([
             model.shadows = Property.getValueOrDefault(modelGraphics._shadows, time, defaultShadows);
             model.heightReference = Property.getValueOrDefault(modelGraphics._heightReference, time, defaultHeightReference);
             model.distanceDisplayCondition = Property.getValueOrUndefined(modelGraphics._distanceDisplayCondition, time);
-            model.blendColor = Property.getValueOrDefault(modelGraphics._blendColor, time, defaultBlendColor, color);
-            model.blendAmount = Property.getValueOrDefault(modelGraphics._blendAmount, time, defaultBlendAmount);
+            model.color = Property.getValueOrDefault(modelGraphics._color, time, defaultColor, color);
+            model.colorBlendMode = Property.getValueOrDefault(modelGraphics._colorBlendMode, time, defaultColorBlendMode);
+            model.colorBlendAmount = Property.getValueOrDefault(modelGraphics._colorBlendAmount, time, defaultColorBlendAmount);
 
             if (model.ready) {
                 var runAnimations = Property.getValueOrDefault(modelGraphics._runAnimations, time, true);
diff --git a/Source/Scene/ColorBlendMode.js b/Source/Scene/ColorBlendMode.js
new file mode 100644
index 000000000000..732760e7ee00
--- /dev/null
+++ b/Source/Scene/ColorBlendMode.js
@@ -0,0 +1,26 @@
+/*global define*/
+define([
+        '../Core/freezeObject'
+], function(
+        freezeObject) {
+    'use strict';
+
+    /**
+     * Defines different modes for blending between a target color and a primitive's source color.
+     *
+     * HIGHLIGHT multiplies the source color by the target color
+     * REPLACE replaces the source color with the target color
+     * MIX blends the source color and target color together
+     *
+     * @exports ColorBlendMode
+     *
+     * @see Model.colorBlendMode
+     */
+    var ColorBlendMode = {
+        HIGHLIGHT : 0,
+        REPLACE : 1,
+        MIX : 2
+    };
+
+    return freezeObject(ColorBlendMode);
+});
\ No newline at end of file
diff --git a/Source/Scene/Model.js b/Source/Scene/Model.js
index 0fb836be9b16..b86759931900 100644
--- a/Source/Scene/Model.js
+++ b/Source/Scene/Model.js
@@ -49,6 +49,7 @@ define([
         '../ThirdParty/Uri',
         '../ThirdParty/when',
         './BlendingState',
+        './ColorBlendMode',
         './getBinaryAccessor',
         './HeightReference',
         './ModelAnimationCache',
@@ -110,6 +111,7 @@ define([
         Uri,
         when,
         BlendingState,
+        ColorBlendMode,
         getBinaryAccessor,
         HeightReference,
         ModelAnimationCache,
@@ -323,8 +325,9 @@ define([
      * @param {HeightReference} [options.heightReference] Determines how the model is drawn relative to terrain.
      * @param {Scene} [options.scene] Must be passed in for models that use the height reference property.
      * @param {DistanceDisplayCondition} [options.istanceDisplayCondition] The condition specifying at what distance from the camera that this model will be displayed.
-     * @param {Color} [options.blendColor=Color.RED] A color that blends with the model's rendered color.
-     * @param {Number} [options.blendAmount=0.0] Value used to mix between the render color and blend color. A value of 0.0 results in no blending while a value of 1.0 results in a solid blend color.
+     * @param {Color} [options.color=Color.WHITE] A color that blends with the model's rendered color.
+     * @param {ColorBlendMode} [options.colorBlendMode=ColorBlendMode.HIGHLIGHT] Defines how the color blends with the model.
+     * @param {Number} [options.colorBlendAmount=0.5] Value used to determine the color strength when the <code>colorBlendMode</code> is <code>MIX</code>. A value of 0.0 results in the model's rendered color while a value of 1.0 results in a solid color, with any value in-between resulting in a mix of the two.
      *
      * @exception {DeveloperError} bgltf is not a valid Binary glTF file.
      * @exception {DeveloperError} Only glTF Binary version 1 is supported.
@@ -525,18 +528,29 @@ define([
          *
          * @type {Color}
          *
-         * @default Color.RED
+         * @default Color.WHITE
          */
-        this.blendColor = defaultValue(options.blendColor, Color.RED);
+        this.color = defaultValue(options.color, Color.WHITE);
 
         /**
-         * Value used to mix between the render color and blend color. A value of 0.0 results in no blending while a value of 1.0 results in a solid blend color.
+         * Defines how the color blends with the model.
+         *
+         * @type {ColorBlendMode}
+         *
+         * @default ColorBlendMode.HIGHLIGHT
+         */
+        this.colorBlendMode = defaultValue(options.colorBlendMode, ColorBlendMode.HIGHLIGHT);
+
+        /**
+         * Value used to determine the color strength when the <code>colorBlendMode</code> is <code>MIX</code>.
+         * A value of 0.0 results in the model's rendered color while a value of 1.0 results in a solid color, with
+         * any value in-between resulting in a mix of the two.
          *
          * @type {Number}
          *
-         * @default 0.0
+         * @default 0.5
          */
-        this.blendAmount = defaultValue(options.blendAmount, 0.0);
+        this.colorBlendAmount = defaultValue(options.colorBlendAmount, 0.5);
 
         /**
          * This property is for debugging only; it is not for production use nor is it optimized.
@@ -1746,11 +1760,11 @@ define([
         return defined(gltf.asset) ? defaultValue(gltf.asset.premultipliedAlpha, false) : false;
     }
 
-    function modifyShaderForBlendColor(shader, premultipliedAlpha) {
+    function modifyShaderForColor(shader, premultipliedAlpha) {
         shader = ShaderSource.replaceMain(shader, 'gltf_blend_main');
         shader +=
-            'uniform vec4 gltf_blendColor; \n' +
-            'uniform float gltf_blendAmount; \n' +
+            'uniform vec4 gltf_color; \n' +
+            'uniform float gltf_colorBlend; \n' +
             'void main() \n' +
             '{ \n' +
             '    gltf_blend_main(); \n';
@@ -1761,8 +1775,10 @@ define([
         }
 
         shader +=
-            '    gl_FragColor.rgb = mix(gl_FragColor.rgb, gltf_blendColor.rgb, gltf_blendAmount); \n' +
-            '    gl_FragColor.a *= gltf_blendColor.a; \n' +
+            '    gl_FragColor.rgb = mix(gl_FragColor.rgb, gltf_color.rgb, gltf_colorBlend); \n' +
+            '    float highlight = ceil(gltf_colorBlend); \n' +
+            '    gl_FragColor.rgb *= mix(gltf_color.rgb, vec3(1.0), highlight); \n' +
+            '    gl_FragColor.a *= gltf_color.a; \n' +
             '} \n';
 
         return shader;
@@ -1800,7 +1816,7 @@ define([
         }
 
         var premultipliedAlpha = hasPremultipliedAlpha(model);
-        var blendFS = modifyShaderForBlendColor(fs, premultipliedAlpha);
+        var blendFS = modifyShaderForColor(fs, premultipliedAlpha);
 
         var drawVS = modifyShader(vs, id, model._vertexShaderLoaded);
         var drawFS = modifyShader(blendFS, id, model._fragmentShaderLoaded);
@@ -2903,15 +2919,24 @@ define([
         };
     }
 
-    function createBlendColorFunction(model) {
+    function createColorFunction(model) {
         return function() {
-            return model.blendColor;
+            return model.color;
         };
     }
 
-    function createBlendAmountFunction(model) {
+    function createColorBlendFunction(model) {
         return function() {
-            return model.blendAmount;
+            var colorBlendMode = model.colorBlendMode;
+            var colorBlendAmount = model.colorBlendAmount;
+            if (colorBlendMode === ColorBlendMode.HIGHLIGHT) {
+                return 0.0;
+            } else if (colorBlendMode === ColorBlendMode.REPLACE) {
+                return 1.0;
+            } else if (colorBlendMode === ColorBlendMode.MIX) {
+                // The value 0.0 is reserved for highlight, so clamp to just above 0.0.
+                return CesiumMath.clamp(colorBlendAmount, CesiumMath.EPSILON4, 1.0);
+            }
         };
     }
 
@@ -2984,8 +3009,8 @@ define([
                 }
 
                 uniformMap = combine(uniformMap, {
-                    gltf_blendColor : createBlendColorFunction(model),
-                    gltf_blendAmount : createBlendAmountFunction(model)
+                    gltf_color : createColorFunction(model),
+                    gltf_colorBlend : createColorBlendFunction(model)
                 });
 
                 // Allow callback to modify the uniformMap
@@ -3091,7 +3116,7 @@ define([
                     pickCommand : pickCommand,
                     command2D : command2D,
                     pickCommand2D : pickCommand2D,
-                    // Generate on demand when blendColor alpha is less than 1.0
+                    // Generate on demand when color alpha is less than 1.0
                     translucentCommand : undefined,
                     translucentCommand2D : undefined
                 };
@@ -3487,9 +3512,9 @@ define([
         return translucentCommand;
     }
 
-    function updateBlendColor(model, frameState) {
+    function updateColor(model, frameState) {
         var scene3DOnly = frameState.scene3DOnly;
-        if (model.blendColor.alpha < 1.0) {
+        if (model.color.alpha < 1.0) {
             var nodeCommands = model._nodeCommands;
             var length = nodeCommands.length;
             // Generate translucent commands when the blend color has an alpha less than 1.0
@@ -3901,7 +3926,7 @@ define([
             updateWireframe(this);
             updateShowBoundingVolume(this);
             updateShadows(this);
-            updateBlendColor(this, frameState);
+            updateColor(this, frameState);
         }
 
         if (justLoaded) {
@@ -3933,7 +3958,7 @@ define([
                 for (i = 0; i < length; ++i) {
                     nc = nodeCommands[i];
                     if (nc.show) {
-                        var translucent = (this.blendColor.alpha < 1.0);
+                        var translucent = (this.color.alpha < 1.0);
                         var command = translucent ? nc.translucentCommand : nc.command;
                         commandList.push(command);
                         boundingVolume = nc.command.boundingVolume;
diff --git a/Specs/DataSources/CzmlDataSourceSpec.js b/Specs/DataSources/CzmlDataSourceSpec.js
index b0e6136b7622..b3be324ede7e 100644
--- a/Specs/DataSources/CzmlDataSourceSpec.js
+++ b/Specs/DataSources/CzmlDataSourceSpec.js
@@ -27,6 +27,7 @@ defineSuite([
         'DataSources/EntityCollection',
         'DataSources/ReferenceProperty',
         'DataSources/StripeOrientation',
+        'Scene/ColorBlendMode',
         'Scene/HeightReference',
         'Scene/HorizontalOrigin',
         'Scene/LabelStyle',
@@ -61,6 +62,7 @@ defineSuite([
         EntityCollection,
         ReferenceProperty,
         StripeOrientation,
+        ColorBlendMode,
         HeightReference,
         HorizontalOrigin,
         LabelStyle,
@@ -1838,10 +1840,11 @@ defineSuite([
                 incrementallyLoadTextures : true,
                 shadows : 'ENABLED',
                 heightReference: 'CLAMP_TO_GROUND',
-                blendColor : {
+                color : {
                     rgbaf : [0.0, 1.0, 0.0, 0.2]
                 },
-                blendAmount : 0.5,
+                colorBlendMode : 'HIGHLIGHT',
+                colorBlendAmount : 0.5,
                 nodeTransformations : {
                     Mesh : {
                         scale : {
@@ -1871,8 +1874,9 @@ defineSuite([
         expect(entity.model.incrementallyLoadTextures.getValue(Iso8601.MINIMUM_VALUE)).toEqual(true);
         expect(entity.model.shadows.getValue(Iso8601.MINIMUM_VALUE)).toEqual(ShadowMode.ENABLED);
         expect(entity.model.heightReference.getValue(Iso8601.MINIMUM_VALUE)).toEqual(HeightReference.CLAMP_TO_GROUND);
-        expect(entity.model.blendColor.getValue(Iso8601.MINIMUM_VALUE)).toEqual(new Color(0.0, 1.0, 0.0, 0.2));
-        expect(entity.model.blendAmount.getValue(Iso8601.MINIMUM_VALUE)).toEqual(0.5);
+        expect(entity.model.color.getValue(Iso8601.MINIMUM_VALUE)).toEqual(new Color(0.0, 1.0, 0.0, 0.2));
+        expect(entity.model.colorBlendMode.getValue(Iso8601.MINIMUM_VALUE)).toEqual(ColorBlendMode.HIGHLIGHT);
+        expect(entity.model.colorBlendAmount.getValue(Iso8601.MINIMUM_VALUE)).toEqual(0.5);
 
         var nodeTransform = entity.model.nodeTransformations.getValue(Iso8601.MINIMUM_VALUE).Mesh;
         expect(nodeTransform).toBeDefined();
@@ -1899,11 +1903,11 @@ defineSuite([
                 incrementallyLoadTextures : true,
                 shadows : 'ENABLED',
                 heightReference: 'CLAMP_TO_GROUND',
-                blendColor : {
+                color : {
                     rgbaf : [0.0, 1.0, 0.0, 0.2]
                 },
-                blendAmount : 0.5,
-
+                colorBlendMode : 'HIGHLIGHT',
+                colorBlendAmount : 0.5,
                 nodeTransformations : {
                     Mesh : {
                         scale : {
@@ -1937,8 +1941,9 @@ defineSuite([
         expect(entity.model.incrementallyLoadTextures.getValue(validTime)).toEqual(true);
         expect(entity.model.shadows.getValue(validTime)).toEqual(ShadowMode.ENABLED);
         expect(entity.model.heightReference.getValue(validTime)).toEqual(HeightReference.CLAMP_TO_GROUND);
-        expect(entity.model.blendColor.getValue(validTime)).toEqual(new Color(0.0, 1.0, 0.0, 0.2));
-        expect(entity.model.blendAmount.getValue(validTime)).toEqual(0.5);
+        expect(entity.model.color.getValue(validTime)).toEqual(new Color(0.0, 1.0, 0.0, 0.2));
+        expect(entity.model.colorBlendMode.getValue(validTime)).toEqual(ColorBlendMode.HIGHLIGHT);
+        expect(entity.model.colorBlendAmount.getValue(validTime)).toEqual(0.5);
 
         var nodeTransform = entity.model.nodeTransformations.getValue(validTime).Mesh;
         expect(nodeTransform).toBeDefined();
@@ -1960,8 +1965,9 @@ defineSuite([
         expect(entity.model.incrementallyLoadTextures.getValue(invalidTime)).toBeUndefined();
         expect(entity.model.shadows.getValue(invalidTime)).toBeUndefined();
         expect(entity.model.heightReference.getValue(invalidTime)).toBeUndefined();
-        expect(entity.model.blendColor.getValue(invalidTime)).toBeUndefined();
-        expect(entity.model.blendAmount.getValue(invalidTime)).toBeUndefined();
+        expect(entity.model.color.getValue(invalidTime)).toBeUndefined();
+        expect(entity.model.colorBlendMode.getValue(invalidTime)).toBeUndefined();
+        expect(entity.model.colorBlendAmount.getValue(invalidTime)).toBeUndefined();
 
         expect(entity.model.nodeTransformations.Mesh.getValue(invalidTime)).toEqual(new TranslationRotationScale());
         expect(entity.model.nodeTransformations.Mesh.scale.getValue(invalidTime)).toBeUndefined();
diff --git a/Specs/DataSources/ModelGraphicsSpec.js b/Specs/DataSources/ModelGraphicsSpec.js
index 06c8bf0aedfb..5c6fdb521c99 100644
--- a/Specs/DataSources/ModelGraphicsSpec.js
+++ b/Specs/DataSources/ModelGraphicsSpec.js
@@ -9,6 +9,7 @@ defineSuite([
         'DataSources/ConstantProperty',
         'DataSources/NodeTransformationProperty',
         'DataSources/PropertyBag',
+        'Scene/ColorBlendMode',
         'Scene/HeightReference',
         'Scene/ShadowMode'
     ], function(
@@ -21,6 +22,7 @@ defineSuite([
         ConstantProperty,
         NodeTransformationProperty,
         PropertyBag,
+        ColorBlendMode,
         HeightReference,
         ShadowMode) {
     'use strict';
@@ -37,8 +39,9 @@ defineSuite([
             shadows : ShadowMode.DISABLED,
             heightReference : HeightReference.CLAMP_TO_GROUND,
             distanceDisplayCondition : new DistanceDisplayCondition(),
-            blendColor : new Color(0.0, 1.0, 0.0, 0.2),
-            blendAmount : 0.5,
+            color : new Color(0.0, 1.0, 0.0, 0.2),
+            colorBlendMode : ColorBlendMode.HIGHLIGHT,
+            colorBlendAmount : 0.5,
             nodeTransformations : {
                 node1 : {
                     translation : Cartesian3.UNIT_Y,
@@ -58,8 +61,9 @@ defineSuite([
         expect(model.shadows).toBeInstanceOf(ConstantProperty);
         expect(model.heightReference).toBeInstanceOf(ConstantProperty);
         expect(model.distanceDisplayCondition).toBeInstanceOf(ConstantProperty);
-        expect(model.blendColor).toBeInstanceOf(ConstantProperty);
-        expect(model.blendAmount).toBeInstanceOf(ConstantProperty);
+        expect(model.color).toBeInstanceOf(ConstantProperty);
+        expect(model.colorBlendMode).toBeInstanceOf(ConstantProperty);
+        expect(model.colorBlendAmount).toBeInstanceOf(ConstantProperty);
         expect(model.runAnimations).toBeInstanceOf(ConstantProperty);
 
         expect(model.nodeTransformations).toBeInstanceOf(PropertyBag);
@@ -73,8 +77,9 @@ defineSuite([
         expect(model.shadows.getValue()).toEqual(options.shadows);
         expect(model.heightReference.getValue()).toEqual(options.heightReference);
         expect(model.distanceDisplayCondition.getValue()).toEqual(options.distanceDisplayCondition);
-        expect(model.blendColor.getValue()).toEqual(options.blendColor);
-        expect(model.blendAmount.getValue()).toEqual(options.blendAmount);
+        expect(model.color.getValue()).toEqual(options.color);
+        expect(model.colorBlendMode.getValue()).toEqual(options.colorBlendMode);
+        expect(model.colorBlendAmount.getValue()).toEqual(options.colorBlendAmount);
         expect(model.runAnimations.getValue()).toEqual(options.runAnimations);
 
         var actualNodeTransformations = model.nodeTransformations.getValue(new JulianDate());
@@ -97,8 +102,9 @@ defineSuite([
         source.shadows = new ConstantProperty(ShadowMode.ENABLED);
         source.heightReference = new ConstantProperty(HeightReference.CLAMP_TO_GROUND);
         source.distanceDisplayCondition = new ConstantProperty(new DistanceDisplayCondition());
-        source.blendColor = new ConstantProperty(new Color(0.0, 1.0, 0.0, 0.2));
-        source.blendAmount = new ConstantProperty(0.5);
+        source.color = new ConstantProperty(new Color(0.0, 1.0, 0.0, 0.2));
+        source.colorBlendMode = new ConstantProperty(ColorBlendMode.HIGHLIGHT);
+        source.colorBlendAmount = new ConstantProperty(0.5);
         source.runAnimations = new ConstantProperty(true);
         source.nodeTransformations = {
             node1 : new NodeTransformationProperty({
@@ -123,8 +129,9 @@ defineSuite([
         expect(target.shadows).toBe(source.shadows);
         expect(target.heightReference).toBe(source.heightReference);
         expect(target.distanceDisplayCondition).toBe(source.distanceDisplayCondition);
-        expect(target.blendColor).toBe(source.blendColor);
-        expect(target.blendAmount).toBe(source.blendAmount);
+        expect(target.color).toBe(source.color);
+        expect(target.colorBlendMode).toBe(source.colorBlendMode);
+        expect(target.colorBlendAmount).toBe(source.colorBlendAmount);
         expect(target.runAnimations).toBe(source.runAnimations);
         expect(target.nodeTransformations).toEqual(source.nodeTransformations);
     });
@@ -140,8 +147,9 @@ defineSuite([
         source.shadows = new ConstantProperty(ShadowMode.ENABLED);
         source.heightReference = new ConstantProperty(HeightReference.CLAMP_TO_GROUND);
         source.distanceDisplayCondition = new ConstantProperty(new DistanceDisplayCondition());
-        source.blendColor = new ConstantProperty(new Color(0.0, 1.0, 0.0, 0.2));
-        source.blendAmount = new ConstantProperty(0.5);
+        source.color = new ConstantProperty(new Color(0.0, 1.0, 0.0, 0.2));
+        source.colorBlendMode = new ConstantProperty(ColorBlendMode.HIGHLIGHT);
+        source.colorBlendAmount = new ConstantProperty(0.5);
         source.runAnimations = new ConstantProperty(true);
         source.nodeTransformations = {
             transform : new NodeTransformationProperty()
@@ -156,8 +164,9 @@ defineSuite([
         var shadows = new ConstantProperty(ShadowMode.ENABLED);
         var heightReference = new ConstantProperty(HeightReference.CLAMP_TO_GROUND);
         var distanceDisplayCondition = new ConstantProperty(new DistanceDisplayCondition());
-        var blendColor = new ConstantProperty(new Color(0.0, 1.0, 0.0, 0.2));
-        var blendAmount = new ConstantProperty(0.5);
+        var color = new ConstantProperty(new Color(0.0, 1.0, 0.0, 0.2));
+        var colorBlendMode = new ConstantProperty(ColorBlendMode.HIGHLIGHT);
+        var colorBlendAmount = new ConstantProperty(0.5);
         var runAnimations = new ConstantProperty(true);
         var nodeTransformations = new PropertyBag({
             transform : new NodeTransformationProperty()
@@ -173,8 +182,9 @@ defineSuite([
         target.shadows = shadows;
         target.heightReference = heightReference;
         target.distanceDisplayCondition = distanceDisplayCondition;
-        target.blendColor = blendColor;
-        target.blendAmount = blendAmount;
+        target.color = color;
+        target.colorBlendMode = colorBlendMode;
+        target.colorBlendAmount = colorBlendAmount;
         target.runAnimations = runAnimations;
         target.nodeTransformations = nodeTransformations;
 
@@ -189,8 +199,9 @@ defineSuite([
         expect(target.shadows).toBe(shadows);
         expect(target.heightReference).toBe(heightReference);
         expect(target.distanceDisplayCondition).toBe(distanceDisplayCondition);
-        expect(target.blendColor).toBe(blendColor);
-        expect(target.blendAmount).toBe(blendAmount);
+        expect(target.color).toBe(color);
+        expect(target.colorBlendMode).toBe(colorBlendMode);
+        expect(target.colorBlendAmount).toBe(colorBlendAmount);
         expect(target.runAnimations).toBe(runAnimations);
         expect(target.nodeTransformations).toBe(nodeTransformations);
     });
@@ -206,8 +217,9 @@ defineSuite([
         source.shadows = new ConstantProperty(ShadowMode.ENABLED);
         source.heightReference = new ConstantProperty(HeightReference.CLAMP_TO_GROUND);
         source.distanceDisplayCondition = new ConstantProperty(new DistanceDisplayCondition());
-        source.blendColor = new ConstantProperty(new Color(0.0, 1.0, 0.0, 0.2));
-        source.blendAmount = new ConstantProperty(0.5);
+        source.color = new ConstantProperty(new Color(0.0, 1.0, 0.0, 0.2));
+        source.colorBlendMode = new ConstantProperty(ColorBlendMode.HIGHLIGHT);
+        source.colorBlendAmount = new ConstantProperty(0.5);
         source.runAnimations = new ConstantProperty(true);
         source.nodeTransformations = {
             node1 : new NodeTransformationProperty(),
@@ -224,8 +236,9 @@ defineSuite([
         expect(result.shadows).toBe(source.shadows);
         expect(result.heightReference).toBe(source.heightReference);
         expect(result.distanceDisplayCondition).toBe(source.distanceDisplayCondition);
-        expect(result.blendColor).toBe(source.blendColor);
-        expect(result.blendAmount).toBe(source.blendAmount);
+        expect(result.color).toBe(source.color);
+        expect(result.colorBlendMode).toBe(source.colorBlendMode);
+        expect(result.colorBlendAmount).toBe(source.colorBlendAmount);
         expect(result.runAnimations).toBe(source.runAnimations);
         expect(result.nodeTransformations).toEqual(source.nodeTransformations);
     });
diff --git a/Specs/Scene/ModelSpec.js b/Specs/Scene/ModelSpec.js
index 72c18b640237..c6e056fb8808 100644
--- a/Specs/Scene/ModelSpec.js
+++ b/Specs/Scene/ModelSpec.js
@@ -26,6 +26,7 @@ defineSuite([
         'Renderer/RenderState',
         'Renderer/ShaderSource',
         'Renderer/WebGLConstants',
+        'Scene/ColorBlendMode',
         'Scene/HeightReference',
         'Scene/ModelAnimationLoop',
         'Specs/createScene',
@@ -58,6 +59,7 @@ defineSuite([
         RenderState,
         ShaderSource,
         WebGLConstants,
+        ColorBlendMode,
         HeightReference,
         ModelAnimationLoop,
         createScene,
@@ -1869,7 +1871,7 @@ defineSuite([
         });
     });
 
-    it('renders with a blend color', function() {
+    it('renders with a color', function() {
         return loadModel(boxUrl).then(function(model) {
             model.show = true;
             model.zoomTo();
@@ -1879,28 +1881,47 @@ defineSuite([
             expect(sourceColor[0]).toBeGreaterThan(0);
             expect(sourceColor[1]).toEqual(0);
 
-            model.blendColor = Color.LIME;
-
-            model.blendAmount = 0.0;
-            var blendColor = scene.renderForSpecs();
-            expect(blendColor).toEqual(sourceColor);
-
-            model.blendAmount = 0.5;
-            blendColor = scene.renderForSpecs();
-            expect(blendColor[0]).toBeGreaterThan(0);
-            expect(blendColor[1]).toBeGreaterThan(0);
-
-            model.blendAmount = 1.0;
-            blendColor = scene.renderForSpecs();
-            expect(blendColor[0]).toEqual(0);
-            expect(blendColor[1]).toEqual(255);
-
-            // Check alpha. Alpha works independently of the blendAmount.
-            model.blendColor = Color.fromAlpha(Color.LIME, 0.5);
-            blendColor = scene.renderForSpecs();
-            expect(blendColor[0]).toEqual(0);
-            expect(blendColor[1]).toBeLessThan(255);
-            expect(blendColor[1]).toBeGreaterThan(0);
+            // Check MIX
+            model.colorBlendMode = ColorBlendMode.MIX;
+            model.color = Color.LIME;
+
+            model.colorBlendAmount = 0.0;
+            var color = scene.renderForSpecs();
+            expect(color).toEqual(sourceColor);
+
+            model.colorBlendAmount = 0.5;
+            color = scene.renderForSpecs();
+            expect(color[0]).toBeGreaterThan(0);
+            expect(color[1]).toBeGreaterThan(0);
+
+            model.colorBlendAmount = 1.0;
+            color = scene.renderForSpecs();
+            expect(color[0]).toEqual(0);
+            expect(color[1]).toEqual(255);
+
+            // Check REPLACE
+            model.colorBlendMode = ColorBlendMode.REPLACE;
+            model.colorBlendAmount = 0.5; // Should have no effect
+            color = scene.renderForSpecs();
+            expect(color[0]).toEqual(0);
+            expect(color[1]).toEqual(255);
+
+            // Check HIGHLIGHT
+            model.colorBlendMode = ColorBlendMode.HIGHLIGHT;
+            model.color = Color.DARKGRAY;
+            color = scene.renderForSpecs();
+            expect(sourceColor[0]).toBeGreaterThan(0);
+            expect(sourceColor[0]).toBeLessThan(255);
+            expect(sourceColor[1]).toEqual(0);
+            expect(sourceColor[2]).toEqual(0);
+
+            // Check alpha.
+            model.colorBlendMode = ColorBlendMode.REPLACE;
+            model.color = Color.fromAlpha(Color.LIME, 0.5);
+            color = scene.renderForSpecs();
+            expect(color[0]).toEqual(0);
+            expect(color[1]).toBeLessThan(255);
+            expect(color[1]).toBeGreaterThan(0);
         });
     });
 

From 5e9e66d5b8b65b30e710aed932a0d160d09b04ac Mon Sep 17 00:00:00 2001
From: Patrick Cozzi <pjcozzi@gmail.com>
Date: Tue, 6 Dec 2016 10:20:14 -0500
Subject: [PATCH 11/14] Update CHANGES.md

---
 CHANGES.md | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/CHANGES.md b/CHANGES.md
index f7ec8da9f56a..f9eeb43dd66d 100644
--- a/CHANGES.md
+++ b/CHANGES.md
@@ -3,7 +3,7 @@ Change Log
 
 ### 1.29 - 2017-01-02
 
-* Added the ability to blend a `Model` with a color/translucency. [#4547](https://github.com/AnalyticalGraphicsInc/cesium/pull/4547)
+* Added the ability to blend a `Model` with a color/translucency. Added `color`, `colorBlendMode`, and `colorBlendAmount` properties to `Model`, `ModelGraphics`, and CZML. Added `ColorBlendMode` enum. [#4547](https://github.com/AnalyticalGraphicsInc/cesium/pull/4547)
 
 ### 1.28 - 2016-12-01
 

From cade6fac06812a8a17e4f4d4980778db9fc55471 Mon Sep 17 00:00:00 2001
From: Sean Lilley <lilleyse@gmail.com>
Date: Tue, 6 Dec 2016 10:35:26 -0500
Subject: [PATCH 12/14] Separate model coloring into its own demo

---
 .../gallery/3D Models Coloring.html           | 194 ++++++++++++++++++
 .../Sandcastle/gallery/3D Models Coloring.jpg | Bin 0 -> 21074 bytes
 Apps/Sandcastle/gallery/3D Models.html        | 105 +---------
 3 files changed, 198 insertions(+), 101 deletions(-)
 create mode 100644 Apps/Sandcastle/gallery/3D Models Coloring.html
 create mode 100644 Apps/Sandcastle/gallery/3D Models Coloring.jpg

diff --git a/Apps/Sandcastle/gallery/3D Models Coloring.html b/Apps/Sandcastle/gallery/3D Models Coloring.html
new file mode 100644
index 000000000000..e67783ba0e80
--- /dev/null
+++ b/Apps/Sandcastle/gallery/3D Models Coloring.html	
@@ -0,0 +1,194 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="utf-8">
+    <meta http-equiv="X-UA-Compatible" content="IE=edge">
+    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no">
+    <meta name="description" content="Change color of 3D models.">
+    <meta name="cesium-sandcastle-labels" content="Showcases">
+    <title>Cesium Demo</title>
+    <script type="text/javascript" src="../Sandcastle-header.js"></script>
+    <script type="text/javascript" src="../../../ThirdParty/requirejs-2.1.20/require.js"></script>
+    <script type="text/javascript">
+    require.config({
+        baseUrl : '../../../Source',
+        waitSeconds : 60
+    });
+    </script>
+</head>
+<body class="sandcastle-loading" data-sandcastle-bucket="bucket-requirejs.html">
+<style>
+    @import url(../templates/bucket.css);
+    #toolbar {
+        background: rgba(42, 42, 42, 0.8);
+        padding: 4px;
+        border-radius: 4px;
+    }
+    #toolbar input {
+        vertical-align: middle;
+        padding-top: 2px;
+        padding-bottom: 2px;
+    }
+</style>
+<div id="cesiumContainer" class="fullSize"></div>
+<div id="loadingOverlay"><h1>Loading...</h1></div>
+<div id="toolbar">
+    <table><tbody>
+    <tr>
+        <td>Mode</td>
+        <td><select data-bind="options: colorBlendModes, value: colorBlendMode"></select></td>
+    </tr>
+    <tr>
+        <td>Color</td>
+        <td><select data-bind="options: colors, value: color"></select></td>
+    </tr>
+    <tr>
+        <td>Alpha</td>
+        <td>
+            <input type="range" min="0.0" max="1.0" step="0.01" data-bind="value: alpha, valueUpdate: 'input'">
+            <input type="text" size="5" data-bind="value: alpha">
+        </td>
+    </tr>
+    <tr>
+        <td data-bind="style: { color: colorBlendAmountEnabled ? '' : 'gray'}">Mix</td>
+        <td>
+            <input type="range" min="0.0" max="1.0" step="0.01" data-bind="value: colorBlendAmount, valueUpdate: 'input', enable: colorBlendAmountEnabled">
+            <input type="text" size="5" data-bind="value: colorBlendAmount, enable: colorBlendAmountEnabled">
+        </td>
+    </tr>
+    </tbody></table>
+</div>
+<script id="cesium_sandcastle_script">
+function startup(Cesium) {
+    'use strict';
+//Sandcastle_Begin
+var viewer = new Cesium.Viewer('cesiumContainer', {
+    infoBox : false,
+    selectionIndicator : false,
+    shadows : true
+});
+
+var entity;
+
+function getColorBlendMode(colorBlendMode) {
+    return Cesium.ColorBlendMode[colorBlendMode.toUpperCase()];
+}
+
+function getColor(color) {
+    return Cesium.Color[color.toUpperCase()];
+}
+
+// The viewModel tracks the state of our mini application.
+var viewModel = {
+    color : 'Red',
+    colors : ['White', 'Red', 'Green', 'Blue', 'Yellow', 'Gray'],
+    alpha : 1.0,
+    colorBlendMode : 'Highlight',
+    colorBlendModes : ['Highlight', 'Replace', 'Mix'],
+    colorBlendAmount : 0.5,
+    colorBlendAmountEnabled : false
+};
+
+// Convert the viewModel members into knockout observables.
+Cesium.knockout.track(viewModel);
+
+// Bind the viewModel to the DOM elements of the UI that call for it.
+var toolbar = document.getElementById('toolbar');
+Cesium.knockout.applyBindings(viewModel, toolbar);
+
+Cesium.knockout.getObservable(viewModel, 'color').subscribe(
+    function(newValue) {
+        entity.model.color = Cesium.Color.fromAlpha(getColor(newValue), viewModel.alpha);
+    }
+);
+
+Cesium.knockout.getObservable(viewModel, 'alpha').subscribe(
+    function(newValue) {
+        entity.model.color = Cesium.Color.fromAlpha(getColor(viewModel.color), newValue);
+    }
+);
+
+Cesium.knockout.getObservable(viewModel, 'colorBlendMode').subscribe(
+    function(newValue) {
+        var colorBlendMode = getColorBlendMode(newValue);
+        entity.model.colorBlendMode = colorBlendMode;
+        viewModel.colorBlendAmountEnabled = (colorBlendMode === Cesium.ColorBlendMode.MIX);
+    }
+);
+
+Cesium.knockout.getObservable(viewModel, 'colorBlendAmount').subscribe(
+    function(newValue) {
+        entity.model.colorBlendAmount = newValue;
+    }
+);
+
+function createModel(url, height) {
+    viewer.entities.removeAll();
+
+    var position = Cesium.Cartesian3.fromDegrees(-123.0744619, 44.0503706, height);
+    var heading = Cesium.Math.toRadians(135);
+    var pitch = 0;
+    var roll = 0;
+    var hpr = new Cesium.HeadingPitchRoll(heading, pitch, roll);
+    var orientation = Cesium.Transforms.headingPitchRollQuaternion(position, hpr);
+
+    entity = viewer.entities.add({
+        name : url,
+        position : position,
+        orientation : orientation,
+        model : {
+            uri : url,
+            minimumPixelSize : 128,
+            maximumScale : 20000,
+            color : Cesium.Color.fromAlpha(getColor(viewModel.color), viewModel.alpha),
+            colorBlendMode : getColorBlendMode(viewModel.colorBlendMode),
+            colorBlendAmount : viewModel.colorBlendAmount
+        }
+    });
+    viewer.trackedEntity = entity;
+}
+
+var options = [{
+    text : 'Aircraft',
+    onselect : function() {
+        createModel('../../SampleData/models/CesiumAir/Cesium_Air.glb', 5000.0);
+    }
+}, {
+    text : 'Ground vehicle',
+    onselect : function() {
+        createModel('../../SampleData/models/CesiumGround/Cesium_Ground.glb', 0);
+    }
+}, {
+    text : 'Hot Air Balloon',
+    onselect : function() {
+        createModel('../../SampleData/models/CesiumBalloon/CesiumBalloon.glb', 1000.0);
+    }
+}, {
+    text : 'Milk truck',
+    onselect : function() {
+        createModel('../../SampleData/models/CesiumMilkTruck/CesiumMilkTruck-kmc.glb', 0);
+    }
+}, {
+    text : 'Skinned character',
+    onselect : function() {
+        createModel('../../SampleData/models/CesiumMan/Cesium_Man.glb', 0);
+    }
+}];
+
+Sandcastle.addToolbarMenu(options);
+
+Sandcastle.addToggleButton('Shadows', viewer.shadows, function(checked) {
+    viewer.shadows = checked;
+});
+
+//Sandcastle_End
+Sandcastle.finishedLoading();
+}
+if (typeof Cesium !== "undefined") {
+    startup(Cesium);
+} else if (typeof require === "function") {
+    require(["Cesium"], startup);
+}
+</script>
+</body>
+</html>
diff --git a/Apps/Sandcastle/gallery/3D Models Coloring.jpg b/Apps/Sandcastle/gallery/3D Models Coloring.jpg
new file mode 100644
index 0000000000000000000000000000000000000000..dff69552e5cad26e2a773a4491a6dfd7c1c31f7a
GIT binary patch
literal 21074
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
W@av$Wc<ibxCD!BYkH>(YYySsald{eL

literal 0
HcmV?d00001

diff --git a/Apps/Sandcastle/gallery/3D Models.html b/Apps/Sandcastle/gallery/3D Models.html
index 525139952345..faa2af95ed0a 100644
--- a/Apps/Sandcastle/gallery/3D Models.html	
+++ b/Apps/Sandcastle/gallery/3D Models.html	
@@ -19,45 +19,10 @@
 <body class="sandcastle-loading" data-sandcastle-bucket="bucket-requirejs.html">
 <style>
     @import url(../templates/bucket.css);
-    #toolbar {
-        background: rgba(42, 42, 42, 0.8);
-        padding: 4px;
-        border-radius: 4px;
-    }
-    #toolbar input {
-        vertical-align: middle;
-        padding-top: 2px;
-        padding-bottom: 2px;
-    }
 </style>
 <div id="cesiumContainer" class="fullSize"></div>
 <div id="loadingOverlay"><h1>Loading...</h1></div>
-<div id="toolbar">
-    <table><tbody>
-    <tr>
-        <td>Mode</td>
-        <td><select data-bind="options: colorBlendModes, value: colorBlendMode"></select></td>
-    </tr>
-    <tr>
-        <td>Color</td>
-        <td><select data-bind="options: colors, value: color"></select></td>
-    </tr>
-    <tr>
-        <td>Alpha</td>
-        <td>
-            <input type="range" min="0.0" max="1.0" step="0.01" data-bind="value: alpha, valueUpdate: 'input'">
-            <input type="text" size="5" data-bind="value: alpha">
-        </td>
-    </tr>
-    <tr>
-        <td data-bind="style: { color: colorBlendAmountEnabled ? '' : 'gray'}">Mix</td>
-        <td>
-            <input type="range" min="0.0" max="1.0" step="0.01" data-bind="value: colorBlendAmount, valueUpdate: 'input', enable: colorBlendAmountEnabled">
-            <input type="text" size="5" data-bind="value: colorBlendAmount, enable: colorBlendAmountEnabled">
-        </td>
-    </tr>
-    </tbody></table>
-</div>
+<div id="toolbar"></div>
 <script id="cesium_sandcastle_script">
 function startup(Cesium) {
     'use strict';
@@ -68,60 +33,6 @@
     shadows : true
 });
 
-var entity;
-
-function getColorBlendMode(colorBlendMode) {
-    return Cesium.ColorBlendMode[colorBlendMode.toUpperCase()];
-}
-
-function getColor(color) {
-    return Cesium.Color[color.toUpperCase()];
-}
-
-// The viewModel tracks the state of our mini application.
-var viewModel = {
-    color : 'White',
-    colors : ['White', 'Red', 'Green', 'Blue', 'Yellow', 'Gray'],
-    alpha : 1.0,
-    colorBlendMode : 'Highlight',
-    colorBlendModes : ['Highlight', 'Replace', 'Mix'],
-    colorBlendAmount : 0.5,
-    colorBlendAmountEnabled : false
-};
-
-// Convert the viewModel members into knockout observables.
-Cesium.knockout.track(viewModel);
-
-// Bind the viewModel to the DOM elements of the UI that call for it.
-var toolbar = document.getElementById('toolbar');
-Cesium.knockout.applyBindings(viewModel, toolbar);
-
-Cesium.knockout.getObservable(viewModel, 'color').subscribe(
-    function(newValue) {
-        entity.model.color = Cesium.Color.fromAlpha(getColor(newValue), viewModel.alpha);
-    }
-);
-
-Cesium.knockout.getObservable(viewModel, 'alpha').subscribe(
-    function(newValue) {
-        entity.model.color = Cesium.Color.fromAlpha(getColor(viewModel.color), newValue);
-    }
-);
-
-Cesium.knockout.getObservable(viewModel, 'colorBlendMode').subscribe(
-    function(newValue) {
-        var colorBlendMode = getColorBlendMode(newValue);
-        entity.model.colorBlendMode = colorBlendMode;
-        viewModel.colorBlendAmountEnabled = (colorBlendMode === Cesium.ColorBlendMode.MIX);
-    }
-);
-
-Cesium.knockout.getObservable(viewModel, 'colorBlendAmount').subscribe(
-    function(newValue) {
-        entity.model.colorBlendAmount = newValue;
-    }
-);
-
 function createModel(url, height) {
     viewer.entities.removeAll();
 
@@ -132,17 +43,14 @@
     var hpr = new Cesium.HeadingPitchRoll(heading, pitch, roll);
     var orientation = Cesium.Transforms.headingPitchRollQuaternion(position, hpr);
 
-    entity = viewer.entities.add({
+    var entity = viewer.entities.add({
         name : url,
         position : position,
         orientation : orientation,
         model : {
             uri : url,
             minimumPixelSize : 128,
-            maximumScale : 20000,
-            color : Cesium.Color.fromAlpha(getColor(viewModel.color), viewModel.alpha),
-            colorBlendMode : getColorBlendMode(viewModel.colorBlendMode),
-            colorBlendAmount : viewModel.colorBlendAmount
+            maximumScale : 20000
         }
     });
     viewer.trackedEntity = entity;
@@ -176,11 +84,6 @@
 }];
 
 Sandcastle.addToolbarMenu(options);
-
-Sandcastle.addToggleButton('Shadows', viewer.shadows, function(checked) {
-    viewer.shadows = checked;
-});
-
 //Sandcastle_End
 Sandcastle.finishedLoading();
 }
@@ -191,4 +94,4 @@
 }
 </script>
 </body>
-</html>
+</html>
\ No newline at end of file

From 6a60f25a97858de0057dd5ecef08ef851ff47234 Mon Sep 17 00:00:00 2001
From: Sean Lilley <lilleyse@gmail.com>
Date: Tue, 6 Dec 2016 10:40:30 -0500
Subject: [PATCH 13/14] Use ColorBlendMode.getColorBlend function

---
 Source/Scene/ColorBlendMode.js | 17 +++++++++++++++--
 Source/Scene/Model.js          | 11 +----------
 2 files changed, 16 insertions(+), 12 deletions(-)

diff --git a/Source/Scene/ColorBlendMode.js b/Source/Scene/ColorBlendMode.js
index 732760e7ee00..224acbb5284e 100644
--- a/Source/Scene/ColorBlendMode.js
+++ b/Source/Scene/ColorBlendMode.js
@@ -1,8 +1,10 @@
 /*global define*/
 define([
-        '../Core/freezeObject'
+        '../Core/freezeObject',
+        '../Core/Math'
 ], function(
-        freezeObject) {
+        freezeObject,
+        CesiumMath) {
     'use strict';
 
     /**
@@ -22,5 +24,16 @@ define([
         MIX : 2
     };
 
+    ColorBlendMode.getColorBlend = function(colorBlendMode, colorBlendAmount) {
+        if (colorBlendMode === ColorBlendMode.HIGHLIGHT) {
+            return 0.0;
+        } else if (colorBlendMode === ColorBlendMode.REPLACE) {
+            return 1.0;
+        } else if (colorBlendMode === ColorBlendMode.MIX) {
+            // The value 0.0 is reserved for highlight, so clamp to just above 0.0.
+            return CesiumMath.clamp(colorBlendAmount, CesiumMath.EPSILON4, 1.0);
+        }
+    };
+
     return freezeObject(ColorBlendMode);
 });
\ No newline at end of file
diff --git a/Source/Scene/Model.js b/Source/Scene/Model.js
index b86759931900..63e57103369f 100644
--- a/Source/Scene/Model.js
+++ b/Source/Scene/Model.js
@@ -2927,16 +2927,7 @@ define([
 
     function createColorBlendFunction(model) {
         return function() {
-            var colorBlendMode = model.colorBlendMode;
-            var colorBlendAmount = model.colorBlendAmount;
-            if (colorBlendMode === ColorBlendMode.HIGHLIGHT) {
-                return 0.0;
-            } else if (colorBlendMode === ColorBlendMode.REPLACE) {
-                return 1.0;
-            } else if (colorBlendMode === ColorBlendMode.MIX) {
-                // The value 0.0 is reserved for highlight, so clamp to just above 0.0.
-                return CesiumMath.clamp(colorBlendAmount, CesiumMath.EPSILON4, 1.0);
-            }
+            return ColorBlendMode.getColorBlend(model.colorBlendMode, model.colorBlendAmount);
         };
     }
 

From f23d43635dfe65c54fb09f5934f3ba3d1bba352d Mon Sep 17 00:00:00 2001
From: Sean Lilley <lilleyse@gmail.com>
Date: Tue, 6 Dec 2016 11:50:49 -0500
Subject: [PATCH 14/14] Don't issue command when alpha is 0

---
 Source/Scene/Model.js    | 8 +++++---
 Specs/Scene/ModelSpec.js | 8 +++++++-
 2 files changed, 12 insertions(+), 4 deletions(-)

diff --git a/Source/Scene/Model.js b/Source/Scene/Model.js
index 63e57103369f..703abe4e8708 100644
--- a/Source/Scene/Model.js
+++ b/Source/Scene/Model.js
@@ -3505,7 +3505,8 @@ define([
 
     function updateColor(model, frameState) {
         var scene3DOnly = frameState.scene3DOnly;
-        if (model.color.alpha < 1.0) {
+        var alpha = model.color.alpha;
+        if ((alpha > 0.0) && (alpha < 1.0)) {
             var nodeCommands = model._nodeCommands;
             var length = nodeCommands.length;
             // Generate translucent commands when the blend color has an alpha less than 1.0
@@ -3857,8 +3858,9 @@ define([
             }
         }
 
+        var alpha = this.color.alpha;
         var displayConditionPassed = defined(this.distanceDisplayCondition) ? distanceDisplayConditionVisible(this, frameState) : true;
-        var show = this.show && displayConditionPassed && (this.scale !== 0.0);
+        var show = this.show && displayConditionPassed && (this.scale !== 0.0) && (alpha > 0.0);
 
         if ((show && this._state === ModelState.LOADED) || justLoaded) {
             var animated = this.activeAnimations.update(frameState) || this._cesiumAnimationsDirty;
@@ -3949,7 +3951,7 @@ define([
                 for (i = 0; i < length; ++i) {
                     nc = nodeCommands[i];
                     if (nc.show) {
-                        var translucent = (this.color.alpha < 1.0);
+                        var translucent = (alpha < 1.0);
                         var command = translucent ? nc.translucentCommand : nc.command;
                         commandList.push(command);
                         boundingVolume = nc.command.boundingVolume;
diff --git a/Specs/Scene/ModelSpec.js b/Specs/Scene/ModelSpec.js
index c6e056fb8808..3e4d240a34e1 100644
--- a/Specs/Scene/ModelSpec.js
+++ b/Specs/Scene/ModelSpec.js
@@ -1915,13 +1915,19 @@ defineSuite([
             expect(sourceColor[1]).toEqual(0);
             expect(sourceColor[2]).toEqual(0);
 
-            // Check alpha.
+            // Check alpha
             model.colorBlendMode = ColorBlendMode.REPLACE;
             model.color = Color.fromAlpha(Color.LIME, 0.5);
             color = scene.renderForSpecs();
             expect(color[0]).toEqual(0);
             expect(color[1]).toBeLessThan(255);
             expect(color[1]).toBeGreaterThan(0);
+
+            // No commands are issued when the alpha is 0.0
+            model.color = Color.fromAlpha(Color.LIME, 0.0);
+            scene.renderForSpecs();
+            var commands = scene.frameState.commandList;
+            expect(commands.length).toBe(0);
         });
     });