Phaser.CANVAS_PX_ROUND is a boolean. If 'true' the Canvas renderer will Math.floor() all coordinates before drawImage, stopping pixel interpolation. Defaults to false.

photonstorm · photonstorm · commit 13a86765cbe7 · 2014-01-31T04:14:02.000Z
Phaser.CANVAS_CLEAR_RECT is a boolean. If 'true' (the default) it will context.clearRect() every frame. If false this is skipped (useful if you know you don't need it)
Collision now works between Sprites positioned via sprite.x/y, sprite.body.x/y or sprite.body.velocity.
If you are tweening a sprite and still want physics collision, set `sprite.body.moves = false` otherwise it will fight against the tween motion.
diff --git a/README.md b/README.md
@@ -112,6 +112,11 @@ New features:
 * Math.normalizeLatitude - Normalizes a latitude to the [-90,90] range.
 * Math.normalizeLongitude - Normalizes a longitude to the [-180,180] range.
 * Phaser.Line added to the group of geometry classes, with full point on line/segment and intersection tests (see new examples)
+* Phaser.CANVAS_PX_ROUND is a boolean. If 'true' the Canvas renderer will Math.floor() all coordinates before drawImage, stopping pixel interpolation. Defaults to false.
+* Phaser.CANVAS_CLEAR_RECT is a boolean. If 'true' (the default) it will context.clearRect() every frame. If false this is skipped (useful if you know you don't need it)
+* Collision now works between Sprites positioned via sprite.x/y, sprite.body.x/y or sprite.body.velocity.
+* If you are tweening a sprite and still want physics collision, set `sprite.body.moves = false` otherwise it will fight against the tween motion.
+
 
 
 New Examples:
@@ -204,6 +209,8 @@ Bug Fixes:
 * Removed the frame property from TileSprites as it cannot use them, it tiles the whole image only, not just a section of it.
 * Fixed WebGLRenderer updateGraphics bug (thanks theadam)
 * Removed duplicate Timer.create line (thanks hstolte)
+* Fixed issue with the camera being slightly out of sync with 'fixedToCamera' sprites.
+* 1px camera jitter issue fixed where map is same size, or smaller than the game size.
 
 
 You can view the Change Log for all previous versions at https://github.com/photonstorm/phaser/changelog.md
diff --git a/examples/wip/rabbit map.js b/examples/wip/rabbit map.js
@@ -8,7 +8,7 @@ function preload() {
     game.load.image('walls_1x2', 'assets/tilemaps/tiles/walls_1x2.png');
     game.load.image('tiles2', 'assets/tilemaps/tiles/tiles2.png');
 
-    // game.load.image('phaser', 'assets/sprites/shinyball.png');
+    game.load.image('ball', 'assets/sprites/shinyball.png');
     game.load.image('phaser', 'assets/sprites/firstaid.png');
     // game.load.image('phaser', 'assets/sprites/atari130xe.png');
     // game.load.image('phaser', 'assets/sprites/mushroom2.png');
@@ -24,6 +24,7 @@ var layer2;
 var layer3;
 
 var sprite;
+var ball;
 var marker;
 
 function create() {
@@ -34,7 +35,7 @@ console.log(' --- state create start ---');
         game.step();
     });
 
-    // game.stage.backgroundColor = '#124184';
+    game.stage.backgroundColor = '#124184';
 
 
     marker = new Phaser.Line(256, 0, 256, 600);
@@ -56,7 +57,12 @@ console.log(' --- state create start ---');
     // game.physics.gravity.y = 200;
 
 
-    sprite = game.add.sprite(100, 300, 'phaser'); // up test
+    sprite = game.add.sprite(100, 180, 'phaser');
+    sprite.body.moves = false;
+
+    ball = game.add.sprite(200, 180, 'ball');
+
+    game.add.tween(sprite).to({x: 500},5000,Phaser.Easing.Linear.None,true);
 
     // sprite = game.add.sprite(200, 240, 'phaser'); // 3-block corner test
 
@@ -112,12 +118,14 @@ function update() {
         layer.scrollY += 4;
     }
 */
+
     game.physics.collide(sprite, layer);
+    game.physics.collide(sprite, ball);
 
     // sprite.body.velocity.y = -300;
 
-    sprite.body.velocity.x = 0;
-    sprite.body.velocity.y = 0;
+    // sprite.body.velocity.x = 0;
+    // sprite.body.velocity.y = 0;
     // sprite.body.angularVelocity = 0;
 
     // sprite.body.acceleration.x = 0;
@@ -157,25 +165,62 @@ function update() {
     sprite.angle = sprite.angle + 1;
     */
 
+    // if (cursors.up.isDown)
+    // {
+    //     sprite.body.velocity.y = -200;
+    // }
+    // else if (cursors.down.isDown)
+    // {
+    //     sprite.body.velocity.y = 100;
+    // }
+
+    // if (cursors.left.isDown)
+    // {
+    //     sprite.body.velocity.x = -200;
+    // }
+    // else if (cursors.right.isDown)
+    // {
+    //     sprite.body.velocity.x = 200;
+    // }
+
+    // if (cursors.up.isDown)
+    // {
+    //     sprite.y -= 2;
+    // }
+    // else if (cursors.down.isDown)
+    // {
+    //     sprite.y += 2;
+    // }
+
+    // if (cursors.left.isDown)
+    // {
+    //     sprite.x -= 2;
+    // }
+    // else if (cursors.right.isDown)
+    // {
+    //     sprite.x += 2;
+    // }
+
     if (cursors.up.isDown)
     {
-        // console.log('cursor up');
-        sprite.body.velocity.y = -200;
+        sprite.body.y -= 2;
     }
     else if (cursors.down.isDown)
     {
-        sprite.body.velocity.y = 100;
+        sprite.body.y += 2;
     }
 
     if (cursors.left.isDown)
     {
-        sprite.body.velocity.x = -200;
+        sprite.body.x -= 2;
     }
     else if (cursors.right.isDown)
     {
-        sprite.body.velocity.x = 200;
+        sprite.body.x += 2;
     }
 
+
+
 }
 
 function render() {
diff --git a/src/Phaser.js b/src/Phaser.js
@@ -39,7 +39,10 @@ var Phaser = Phaser || {
 	LEFT: 1,
 	RIGHT: 2,
 	UP: 3,
-	DOWN: 4
+	DOWN: 4,
+
+	CANVAS_PX_ROUND: false,
+	CANVAS_CLEAR_RECT: true
 
  };
 
diff --git a/src/PixiPatch.js b/src/PixiPatch.js
@@ -4,6 +4,7 @@
 * 1) Added support for Trimmed sprite sheets
 * 2) Skip display objects with an alpha of zero
 * 3) Avoid Style Recalculation from the incorrect bgcolor value
+* 4) Added support for Canvas unit rounding via Phaser.CANVAS_PX_ROUND boolean (disabled by default).
 *
 * Hopefully we can remove this once Pixi has been updated to support these things.
 */
@@ -23,7 +24,12 @@ PIXI.CanvasRenderer.prototype.render = function(stage)
     stage.updateTransform();
 
     this.context.setTransform(1, 0, 0, 1, 0, 0);
-    this.context.clearRect(0, 0, this.width, this.height)
+
+    if (Phaser.CANVAS_CLEAR_RECT)
+    {
+        this.context.clearRect(0, 0, this.width, this.height)
+    }
+
     this.renderDisplayObject(stage, false);
    
     //  Remove frame updates
@@ -44,8 +50,6 @@ PIXI.CanvasRenderer.prototype.renderDisplayObject = function(displayObject, rend
     
     do
     {
-        //transform = displayObject.worldTransform;
-        
         if (!displayObject.visible && !renderHidden)
         {
             displayObject = displayObject.last._iNext;
@@ -60,27 +64,30 @@ PIXI.CanvasRenderer.prototype.renderDisplayObject = function(displayObject, rend
         
         if (displayObject instanceof PIXI.Sprite)
         {
-            // var frame = displayObject.texture.frame;
-            
             if (displayObject.texture.frame)
             {
                 this.context.globalAlpha = displayObject.worldAlpha;
 
-                // this.context.setTransform(
-                //         displayObject.worldTransform[0],
-                //         displayObject.worldTransform[3],
-                //         displayObject.worldTransform[1],
-                //         displayObject.worldTransform[4],
-                //         displayObject.worldTransform[2],
-                //         displayObject.worldTransform[5]);
-
-                this.context.setTransform(
-                        displayObject.worldTransform[0],
-                        displayObject.worldTransform[3],
-                        displayObject.worldTransform[1],
-                        displayObject.worldTransform[4],
-                        Math.floor(displayObject.worldTransform[2]),
-                        Math.floor(displayObject.worldTransform[5]));
+                if (Phaser.CANVAS_PX_ROUND)
+                {
+                    this.context.setTransform(
+                            displayObject.worldTransform[0],
+                            displayObject.worldTransform[3],
+                            displayObject.worldTransform[1],
+                            displayObject.worldTransform[4],
+                            Math.floor(displayObject.worldTransform[2]),
+                            Math.floor(displayObject.worldTransform[5]));
+                }
+                else
+                {
+                    this.context.setTransform(
+                            displayObject.worldTransform[0],
+                            displayObject.worldTransform[3],
+                            displayObject.worldTransform[1],
+                            displayObject.worldTransform[4],
+                            displayObject.worldTransform[2],
+                            displayObject.worldTransform[5]);
+                }
 
                 if (displayObject.texture.trimmed)
                 {
diff --git a/src/physics/arcade/Body.js b/src/physics/arcade/Body.js
@@ -1273,19 +1273,19 @@ if (this.sprite.debug)
                 this.facing = Phaser.DOWN;
             }
 
-            // this.updateBounds();
-
 if (this.sprite.debug)
 {
     console.log('Body postUpdate x:', this.x, 'y:', this.y, 'left:', this.left, 'right:', this.right, 'WAS', this.preX, this.preY);
     console.log('Body postUpdate blocked:', this.blocked, this.blockFlags);
     console.log('Body postUpdate velocity:', this.velocity.x, this.velocity.y);
+    console.log('Body postUpdate Sprite:', this.sprite.x, this.sprite.y, 'cached', this.sprite._cache.x, this.sprite._cache.y);
 }
 
-            this.sprite.x = this.x - this.offset.x;
-            this.sprite.y = this.y - this.offset.y;
-            this.sprite.worldTransform[2] = this.x - this.offset.x;
-            this.sprite.worldTransform[5] = this.y - this.offset.y;
+            if (this.deltaX() !== 0 || this.deltaY() !== 0)
+            {
+                this.sprite.worldTransform[2] = this.sprite.x = (this.x - this.offset.x);
+                this.sprite.worldTransform[5] = this.sprite.y = (this.y - this.offset.y);
+            }
 
             if (this.allowRotation)
             {
@@ -1319,7 +1319,7 @@ if (this.sprite.debug)
         this.mass = 1;
         this.friction = 0.1;
         this.checkCollision = { none: false, any: true, up: true, down: true, left: true, right: true };
-        this.blocked
+        this.blocked = { x: 0, y: 0, up: false, down: false, left: false, right: false };
 
     },
 
diff --git a/src/tilemap/TilemapLayer.js b/src/tilemap/TilemapLayer.js
@@ -734,8 +734,6 @@ Phaser.TilemapLayer.prototype.render = function () {
     this._ty = this._dy;
 
     this.context.clearRect(0, 0, this.canvas.width, this.canvas.height);
-    // this.context.fillStyle = '#ff00ff';
-    // this.context.fillRect(0, 0, this.canvas.width, this.canvas.height);
 
     this.context.fillStyle = this.tileColor;
 
@@ -802,7 +800,7 @@ Phaser.TilemapLayer.prototype.render = function () {
 
                         if (tile.debug)
                         {
-                            this.context.fillStyle = 'rgba(0,255,0,0.5)';
+                            this.context.fillStyle = 'rgba(0, 255, 0, 0.4)';
                             this.context.fillRect(Math.floor(this._tx), Math.floor(this._ty), this.map.tileWidth, this.map.tileHeight);
                         }
                     }

Original file line number	Diff line number	Diff line change
`@@ -734,8 +734,6 @@ Phaser.TilemapLayer.prototype.render = function () {`
`734`	`734`	`this._ty = this._dy;`
`735`	`735`
`736`	`736`	`this.context.clearRect(0, 0, this.canvas.width, this.canvas.height);`
`737`		`- // this.context.fillStyle = '#ff00ff';`
`738`		`- // this.context.fillRect(0, 0, this.canvas.width, this.canvas.height);`
`739`	`737`
`740`	`738`	`this.context.fillStyle = this.tileColor;`
`741`	`739`
`@@ -802,7 +800,7 @@ Phaser.TilemapLayer.prototype.render = function () {`
`802`	`800`
`803`	`801`	`if (tile.debug)`
`804`	`802`	`{`
`805`		`- this.context.fillStyle = 'rgba(0,255,0,0.5)';`
	`803`	`+ this.context.fillStyle = 'rgba(0, 255, 0, 0.4)';`
`806`	`804`	`this.context.fillRect(Math.floor(this._tx), Math.floor(this._ty), this.map.tileWidth, this.map.tileHeight);`
`807`	`805`	`}`
`808`	`806`	`}`