Updated to use matrix and support crop

Author: photonstorm

src/renderer/canvas/utils/DrawImage.js

@@ -4,6 +4,11 @@
  * @license      {@link https://github.com/photonstorm/phaser/blob/master/license.txt|MIT License}
  */
 
+var TransformMatrix = require('../../../gameobjects/components/TransformMatrix');
+
+var _tempCameraMatrix = new TransformMatrix();
+var _tempSpriteMatrix = new TransformMatrix();
+
 /**
  * [description]
  *
@@ -12,13 +17,11 @@
  *
  * @param {Phaser.GameObjects.GameObject} src - [description]
  * @param {Phaser.Cameras.Scene2D.Camera} camera - [description]
- * @param {Phaser.GameObjects.Components.TransformMatrix} parentMatrix - [description]
+ * @param {Phaser.GameObjects.Components.TransformMatrix} parentTransformMatrix - [description]
  */
-var DrawImage = function (src, camera, parentMatrix)
+var DrawImage = function (src, camera, parentTransformMatrix)
 {
     var ctx = this.currentContext;
-    var frame = src.frame;
-    var cd = frame.canvasData;
 
     //  Alpha
 
@@ -42,13 +45,123 @@ var DrawImage = function (src, camera, parentMatrix)
 
     //  Smoothing
 
-    if (this.currentScaleMode !== src.scaleMode)
+    // if (this.currentScaleMode !== src.scaleMode)
+    // {
+        // this.currentScaleMode = src.scaleMode;
+        // ctx[this.smoothProperty] = (source.scaleMode === ScaleModes.LINEAR);
+    // }
+
+    var camMatrix = _tempCameraMatrix;
+    var spriteMatrix = _tempSpriteMatrix;
+
+    spriteMatrix.applyITRS(src.x - camera.scrollX * src.scrollFactorX, src.y - camera.scrollY * src.scrollFactorY, src.rotation, src.scaleX, src.scaleY);
+
+    var frame = src.frame;
+    var frameX = frame.x;
+    var frameY = frame.y;
+    var frameWidth = frame.width;
+    var frameHeight = frame.height;
+
+    var x = -src.displayOriginX + frameX;
+    var y = -src.displayOriginY + frameY;
+
+    var fx = 1;
+    var fy = 1;
+
+    if (src.isCropped)
     {
-        this.currentScaleMode = src.scaleMode;
+        var crop = src._crop;
 
-        // ctx[this.smoothProperty] = (source.scaleMode === ScaleModes.LINEAR);
+        if (crop.flipX !== src.flipX || crop.flipY !== src.flipY)
+        {
+            frame.updateCropUVs(crop, src.flipX, src.flipY);
+        }
+
+        frameWidth = crop.width;
+        frameHeight = crop.height;
+
+        frameX = crop.x;
+        frameY = crop.y;
+
+        x = -src.displayOriginX + frameX;
+        y = -src.displayOriginY + frameY;
+    }
+
+    if (src.flipX)
+    {
+        fx = -1;
+    }
+
+    if (src.flipY)
+    {
+        fy = -1;
     }
 
+    camMatrix.copyFrom(camera.matrix);
+
+    var calcMatrix;
+
+    if (parentTransformMatrix)
+    {
+        //  Multiply the camera by the parent matrix
+        camMatrix.multiplyWithOffset(parentTransformMatrix, -camera.scrollX * src.scrollFactorX, -camera.scrollY * src.scrollFactorY);
+
+        //  Undo the camera scroll
+        spriteMatrix.e = src.x;
+        spriteMatrix.f = src.y;
+
+        //  Multiply by the Sprite matrix
+        calcMatrix = camMatrix.multiply(spriteMatrix);
+    }
+    else
+    {
+        calcMatrix = spriteMatrix.multiply(camMatrix);
+    }
+
+    ctx.save();
+
+    ctx.transform(calcMatrix.a, calcMatrix.b, calcMatrix.c, calcMatrix.d, calcMatrix.e, calcMatrix.f);
+
+    ctx.scale(fx, fy);
+
+    if (src.isCropped)
+    {
+        if (src.flipX)
+        {
+            if (x >= 0)
+            {
+                x = -(x + crop.cw);
+            }
+            else if (x < 0)
+            {
+                x = (Math.abs(x) - crop.cw);
+            }
+        }
+    
+        if (src.flipY)
+        {
+            if (y >= 0)
+            {
+                y = -(y + crop.ch);
+            }
+            else if (y < 0)
+            {
+                y = (Math.abs(y) - crop.ch);
+            }
+        }
+
+        ctx.drawImage(frame.source.image, crop.cx, crop.cy, crop.cw, crop.ch, x, y, crop.cw, crop.ch);
+    }
+    else
+    {
+        var cd = frame.canvasData;
+
+        ctx.drawImage(frame.source.image, cd.x, cd.y, frameWidth, frameHeight, x, y, frameWidth, frameHeight);
+    }
+
+    ctx.restore();
+
+    /*
     var dx = frame.x;
     var dy = frame.y;
 
@@ -104,10 +217,8 @@ var DrawImage = function (src, camera, parentMatrix)
     ctx.scale(src.scaleX, src.scaleY);
     ctx.scale(fx, fy);
 
-    if (src.isCropped)
+    if (crop)
     {
-        var crop = src._crop;
-
         ctx.drawImage(frame.source.image, crop.cx, crop.cy, crop.width, crop.height, crop.x + dx, crop.y + dy, crop.width, crop.height);
     }
     else
@@ -116,6 +227,7 @@ var DrawImage = function (src, camera, parentMatrix)
     }
 
     ctx.restore();
+    */
 };
 
 module.exports = DrawImage;