Fixed issue with sprite matrix and camera scaling

Author: photonstorm

src/gameobjects/bitmaptext/static/BitmapTextWebGLRenderer.js

@@ -36,15 +36,14 @@ var BitmapTextWebGLRenderer = function (renderer, src, interpolationPercentage,
 
     renderer.setPipeline(pipeline);
 
-    var camMatrix = pipeline._tempCameraMatrix;
-    var spriteMatrix = pipeline._tempSpriteMatrix;
+    var camMatrix = pipeline._tempMatrix1;
+    var spriteMatrix = pipeline._tempMatrix2;
+    var calcMatrix = pipeline._tempMatrix3;
 
-    spriteMatrix.applyITRS(src.x - camera.scrollX * src.scrollFactorX, src.y - camera.scrollY * src.scrollFactorY, src.rotation, src.scaleX, src.scaleY);
+    spriteMatrix.applyITRS(src.x, src.y, src.rotation, src.scaleX, src.scaleY);
 
     camMatrix.copyFrom(camera.matrix);
 
-    var calcMatrix;
-
     if (parentMatrix)
     {
         //  Multiply the camera by the parent matrix
@@ -54,12 +53,16 @@ var BitmapTextWebGLRenderer = function (renderer, src, interpolationPercentage,
         spriteMatrix.e = src.x;
         spriteMatrix.f = src.y;
 
-        //  Multiply by the Sprite matrix
-        calcMatrix = camMatrix.multiply(spriteMatrix);
+        //  Multiply by the Sprite matrix, store result in calcMatrix
+        camMatrix.multiply(spriteMatrix, calcMatrix);
     }
     else
     {
-        calcMatrix = camMatrix.multiply(spriteMatrix);
+        spriteMatrix.e -= camera.scrollX * src.scrollFactorX;
+        spriteMatrix.f -= camera.scrollY * src.scrollFactorY;
+
+        //  Multiply by the Sprite matrix, store result in calcMatrix
+        camMatrix.multiply(spriteMatrix, calcMatrix);
     }
 
     var frame = src.frame;

src/gameobjects/blitter/BlitterWebGLRenderer.js

@@ -36,7 +36,7 @@ var BlitterWebGLRenderer = function (renderer, src, interpolationPercentage, cam
     var cameraScrollX = camera.scrollX * src.scrollFactorX;
     var cameraScrollY = camera.scrollY * src.scrollFactorY;
 
-    var matrix = pipeline._tempCameraMatrix;
+    var matrix = pipeline._tempMatrix1;
 
     matrix.copyFrom(camera.matrix);
 
@@ -107,6 +107,7 @@ var BlitterWebGLRenderer = function (renderer, src, interpolationPercentage, cam
         {
             tx0 |= 0;
             ty0 |= 0;
+
             tx1 |= 0;
             ty1 |= 0;
         }

src/gameobjects/image/ImageWebGLRenderer.js

@@ -27,8 +27,9 @@ var ImageWebGLRenderer = function (renderer, src, interpolationPercentage, camer
     {
         return;
     }
-    
+
     this.pipeline.batchSprite(src, camera, parentMatrix);
+
 };
 
 module.exports = ImageWebGLRenderer;

src/gameobjects/mesh/MeshWebGLRenderer.js

@@ -33,15 +33,14 @@ var MeshWebGLRenderer = function (renderer, src, interpolationPercentage, camera
 
     renderer.setPipeline(pipeline);
 
-    var camMatrix = pipeline._tempCameraMatrix;
-    var spriteMatrix = pipeline._tempSpriteMatrix;
+    var camMatrix = pipeline._tempMatrix1;
+    var spriteMatrix = pipeline._tempMatrix2;
+    var calcMatrix = pipeline._tempMatrix3;
 
-    spriteMatrix.applyITRS(src.x - camera.scrollX * src.scrollFactorX, src.y - camera.scrollY * src.scrollFactorY, src.rotation, src.scaleX, src.scaleY);
+    spriteMatrix.applyITRS(src.x, src.y, src.rotation, src.scaleX, src.scaleY);
 
     camMatrix.copyFrom(camera.matrix);
 
-    var calcMatrix;
-
     if (parentMatrix)
     {
         //  Multiply the camera by the parent matrix
@@ -51,13 +50,17 @@ var MeshWebGLRenderer = function (renderer, src, interpolationPercentage, camera
         spriteMatrix.e = src.x;
         spriteMatrix.f = src.y;
 
-        //  Multiply by the Sprite matrix
-        calcMatrix = camMatrix.multiply(spriteMatrix);
+        //  Multiply by the Sprite matrix, store result in calcMatrix
+        camMatrix.multiply(spriteMatrix, calcMatrix);
     }
     else
     {
-        calcMatrix = camMatrix.multiply(spriteMatrix);
-    }
+        spriteMatrix.e -= camera.scrollX * src.scrollFactorX;
+        spriteMatrix.f -= camera.scrollY * src.scrollFactorY;
+
+        //  Multiply by the Sprite matrix, store result in calcMatrix
+        camMatrix.multiply(spriteMatrix, calcMatrix);
+}
 
     var frame = src.frame;
     var texture = frame.glTexture;

src/renderer/webgl/WebGLRenderer.js

@@ -1536,6 +1536,7 @@ var WebGLRenderer = new Class({
             pipelines[key].onRender(scene, camera);
         }
 
+        //   Apply scissor for cam region + render background color, if not transparent
         this.preRenderCamera(camera);
 
         for (var index = 0; index < childCount; ++index)
@@ -1567,6 +1568,8 @@ var WebGLRenderer = new Class({
 
         this.flush();
         this.setBlendMode(CONST.BlendModes.NORMAL);
+
+        //  Applies camera effects and pops the scissor, if set
         this.postRenderCamera(camera);
     },