Merge pull request #2667 from AnalyticalGraphicsInc/canvas-material

Add ability for Materials to take canvas uniform values
CesiumGS · Apr 28, 2015 · f0085cf · f0085cf
2 parents a6e430c + 5fee0bc
commit f0085cf
Show file tree

Hide file tree

Showing 4 changed files with 31 additions and 3 deletions.
diff --git a/CHANGES.md b/CHANGES.md
@@ -19,6 +19,7 @@ Change Log
 * Fixed `Geocoder` styling issue in Safari. [#2658](https://github.com/AnalyticalGraphicsInc/cesium/pull/2658).
 * Fixed a crash that would occur when the `Viewer` or `CesiumWidget` was resized to 0 while the camera was in motion.
 * Added number of cached shaders to the `CesiumInspector` debugging widget.
+* Entity `material` properties and `Material` uniform values can now take a `canvas` element in addition to an image or url.
 
 ### 1.8 - 2015-04-01
 

diff --git a/Source/DataSources/createMaterialPropertyDescriptor.js b/Source/DataSources/createMaterialPropertyDescriptor.js
@@ -18,7 +18,7 @@ define([
             return new ColorMaterialProperty(value);
         }
 
-        if (typeof value === 'string') {
+        if (typeof value === 'string' || value instanceof HTMLCanvasElement) {
             var result = new ImageMaterialProperty();
             result.image = value;
             return result;

diff --git a/Source/Scene/Material.js b/Source/Scene/Material.js
@@ -702,13 +702,18 @@ define([
                 if (defined(newTexture)) {
                     Material._textureCache.releaseTexture(material._texturePaths[uniformId]);
                     material._textures[uniformId] = newTexture;
-                } else {
+                } else if (typeof uniformValue === 'string') {
                     when(loadImage(uniformValue), function(image) {
                         material._loadedImages.push({
                             id : uniformId,
                             image : image
                         });
                     });
+                } else if (uniformValue instanceof HTMLCanvasElement) {
+                    material._loadedImages.push({
+                        id : uniformId,
+                        image : uniformValue
+                    });
                 }
 
                 material._texturePaths[uniformId] = uniformValue;
@@ -853,7 +858,7 @@ define([
                 uniformType = 'float';
             } else if (type === 'boolean') {
                 uniformType = 'bool';
-            } else if (type === 'string') {
+            } else if (type === 'string' || uniformValue instanceof HTMLCanvasElement) {
                 if (/^([rgba]){1,4}$/i.test(uniformValue)) {
                     uniformType = 'channels';
                 } else if (uniformValue === Material.DefaultCubeMapId) {

diff --git a/Specs/Scene/MaterialSpec.js b/Specs/Scene/MaterialSpec.js
@@ -322,6 +322,28 @@ defineSuite([
         expect(pixel).not.toEqual([0, 0, 0, 0]);
     });
 
+    it('creates a material with an image canvas uniform', function() {
+        var canvas = document.createElement('canvas');
+        var context2D = canvas.getContext('2d');
+        context2D.width = 1;
+        context2D.height = 1;
+        context2D.fillStyle = 'rgb(0,0,255)';
+        context2D.fillRect(0, 0, 1, 1);
+
+        var material = new Material({
+            strict : true,
+            fabric : {
+                type : 'DiffuseMap',
+                uniforms : {
+                    image : canvas
+                }
+            }
+        });
+
+        var pixel = renderMaterial(material);
+        expect(pixel).not.toEqual([0, 0, 0, 0]);
+    });
+
     it('creates a material with a cube map uniform', function() {
         var material = new Material({
             strict : true,