Fixed tint order and exposed via getters.

Author: photonstorm

src/components/Color.js

@@ -23,7 +23,8 @@ Phaser.Component.Color = function (gameObject)
 
     this._blendMode = 0;
 
-    this._tint = [ 0xffffff, 0xffffff, 0xffffff, 0xffffff ];
+    this._tint = { topLeft: 0xffffff, topRight: 0xffffff, bottomLeft: 0xffffff, bottomRight: 0xffffff };
+    this._glTint = { topLeft: 16777215, topRight: 16777215, bottomLeft: 16777215, bottomRight: 16777215 };
     this._hasTint = false;
 
     this._r = 0;
@@ -58,9 +59,9 @@ Phaser.Component.Color.prototype = {
 
     clearTint: function ()
     {
-        this._hasTint = false;
+        this.setTint(0xffffff);
 
-        this.setDirty();
+        this._hasTint = false;
     },
 
     setTint: function (topLeft, topRight, bottomLeft, bottomRight)
@@ -72,10 +73,10 @@ Phaser.Component.Color.prototype = {
             bottomRight = topLeft;
         }
 
-        this._tint[0] = topLeft;
-        this._tint[1] = topRight;
-        this._tint[2] = bottomLeft;
-        this._tint[3] = bottomRight;
+        this.tintTopLeft = topLeft;
+        this.tintTopRight = topRight;
+        this.tintBottomLeft = bottomLeft;
+        this.tintBottomRight = bottomRight;
 
         this._hasTint = true;
 
@@ -128,34 +129,98 @@ Phaser.Component.Color.prototype = {
 
 Object.defineProperties(Phaser.Component.Color.prototype, {
 
-    tint: {
+    tintTopLeft: {
 
         enumerable: true,
 
         get: function ()
         {
-            return this._tint;
+            return this._tint.topLeft;
         },
 
         set: function (value)
         {
-            if (Array.isArray(value))
-            {
-                this._tint = value;
-            }
-            else
-            {
-                this._tint[0] = value;
-                this._tint[1] = value;
-                this._tint[2] = value;
-                this._tint[3] = value;
-            }
+            this._tint.topLeft = value;
+            // this._glTint.topLeft = (value >> 16) + (value & 0xff00) + ((value & 0xff) << 16) + (this._worldAlpha * 255 << 24);
+            this._glTint.topLeft = (value >> 16) + (value & 0xff00) + ((value & 0xff) << 16);
+            this.setDirty();
+        }
+
+    },
 
+    tintTopRight: {
+
+        enumerable: true,
+
+        get: function ()
+        {
+            return this._tint.topRight;
+        },
+
+        set: function (value)
+        {
+            this._tint.topRight = value;
+            // this._glTint.topRight = (value >> 16) + (value & 0xff00) + ((value & 0xff) << 16) + (this._worldAlpha * 255 << 24);
+            this._glTint.topRight = (value >> 16) + (value & 0xff00) + ((value & 0xff) << 16);
             this.setDirty();
         }
 
     },
 
+    tintBottomLeft: {
+
+        enumerable: true,
+
+        get: function ()
+        {
+            return this._tint.bottomLeft;
+        },
+
+        set: function (value)
+        {
+            this._tint.bottomLeft = value;
+            this._glTint.bottomLeft = (value >> 16) + (value & 0xff00) + ((value & 0xff) << 16);
+            // this._glTint.bottomLeft = (value >> 16) + (value & 0xff00) + ((value & 0xff) << 16) + (this._worldAlpha * 255 << 24);
+            this.setDirty();
+        }
+
+    },
+
+    tintBottomRight: {
+
+        enumerable: true,
+
+        get: function ()
+        {
+            return this._tint.bottomRight;
+        },
+
+        set: function (value)
+        {
+            this._tint.bottomRight = value;
+            this._glTint.bottomRight = (value >> 16) + (value & 0xff00) + ((value & 0xff) << 16);
+            // this._glTint.bottomRight = (value >> 16) + (value & 0xff00) + ((value & 0xff) << 16) + (this._worldAlpha * 255 << 24);
+            this.setDirty();
+        }
+
+    },
+
+    tint: {
+
+        enumerable: true,
+
+        get: function ()
+        {
+            return this._tint;
+        },
+
+        set: function (value)
+        {
+            this.setTint(value, value, value, value);
+        }
+
+    },
+
     alpha: {
 
         enumerable: true,

src/renderer/webgl/BatchManager.js

@@ -462,54 +462,38 @@ Phaser.Renderer.WebGL.BatchManager.prototype = {
             ty |= 0;
         }
 
-        //  Interleaved vert and color data
-        //  The color passed here includes an applied tint *see bitwise ops above *
-        //  Better to calculate that in the shader?
-
         var i = this.currentBatchSize * this.vertSize;
 
         //  Top Left vert (xy, uv, color)
         positions[i++] = a * w1 + c * h1 + tx;
         positions[i++] = d * h1 + b * w1 + ty;
         positions[i++] = uvs.x0;
         positions[i++] = uvs.y0;
-
-        var tint = sprite.color.tint[0];
-        colors[i++] = (tint >> 16) + (tint & 0xff00) + ((tint & 0xff) << 16) + (sprite.color.worldAlpha * 255 << 24);
-
+        colors[i++] = sprite.color._glTint.topLeft + (sprite.color.worldAlpha * 255 << 24);
         // positions[i++] = textureIndex;
 
         //  Top Right vert (xy, uv, color)
         positions[i++] = a * w0 + c * h1 + tx;
         positions[i++] = d * h1 + b * w0 + ty;
         positions[i++] = uvs.x1;
         positions[i++] = uvs.y1;
-
-        tint = sprite.color.tint[1];
-        colors[i++] = (tint >> 16) + (tint & 0xff00) + ((tint & 0xff) << 16) + (sprite.color.worldAlpha * 255 << 24);
-
+        colors[i++] = sprite.color._glTint.topRight + (sprite.color.worldAlpha * 255 << 24);
         // positions[i++] = textureIndex;
 
         //  Bottom Right vert (xy, uv, color)
         positions[i++] = a * w0 + c * h0 + tx;
         positions[i++] = d * h0 + b * w0 + ty;
         positions[i++] = uvs.x2;
         positions[i++] = uvs.y2;
-
-        tint = sprite.color.tint[3];
-        colors[i++] = (tint >> 16) + (tint & 0xff00) + ((tint & 0xff) << 16) + (sprite.color.worldAlpha * 255 << 24);
-
+        colors[i++] = sprite.color._glTint.bottomRight + (sprite.color.worldAlpha * 255 << 24);
         // positions[i++] = textureIndex;
 
         //  Bottom Left vert (xy, uv, color)
         positions[i++] = a * w1 + c * h0 + tx;
         positions[i++] = d * h0 + b * w1 + ty;
         positions[i++] = uvs.x3;
         positions[i++] = uvs.y3;
-
-        tint = sprite.color.tint[2];
-        colors[i++] = (tint >> 16) + (tint & 0xff00) + ((tint & 0xff) << 16) + (sprite.color.worldAlpha * 255 << 24);
-
+        colors[i++] = sprite.color._glTint.bottomLeft + (sprite.color.worldAlpha * 255 << 24);
         // positions[i++] = textureIndex;
 
         this.sprites[this.currentBatchSize++] = sprite;