diff --git a/examples/wip/bmd2.js b/examples/wip/bmd2.js index 0dba6b07..23f586f4 100644 --- a/examples/wip/bmd2.js +++ b/examples/wip/bmd2.js @@ -1,5 +1,5 @@ -var game = new Phaser.Game(800, 600, Phaser.AUTO, 'phaser-example', { preload: preload, create: create, update: update, render: render }); +var game = new Phaser.Game(800, 600, Phaser.CANVAS, 'phaser-example', { preload: preload, create: create, update: update, render: render }); function preload() { diff --git a/examples/wip/gc1.js b/examples/wip/gc1.js new file mode 100644 index 00000000..2c0900a6 --- /dev/null +++ b/examples/wip/gc1.js @@ -0,0 +1,14 @@ + +var game = new Phaser.Game(800, 600, Phaser.CANVAS, 'phaser-example', { preload: preload, create: create, update: update, render: render }); + +function preload() { +} + +function create() { +} + +function update() { +} + +function render() { +} diff --git a/src/PixiPatch.js b/src/PixiPatch.js index c1bfe366..ec31a300 100644 --- a/src/PixiPatch.js +++ b/src/PixiPatch.js @@ -1,116 +1,139 @@ /** - * We're replacing a couple of Pixi's methods here to fix or add some vital functionality: +* We're replacing a couple of Pixi's methods here to fix or add some vital functionality: +* +* 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 +* +* Hopefully we can remove this once Pixi has been updated to support these things. +*/ + +/** + * Renders the stage to its canvas view * - * 1) Added support for Trimmed sprite sheets - * 2) Skip display objects with an alpha of zero - * - * Hopefully we can remove this once Pixi has been updated to support these things. + * @method render + * @param stage {Stage} the Stage element to be rendered */ +PIXI.CanvasRenderer.prototype.render = function(stage) +{ + PIXI.texturesToUpdate.length = 0; + PIXI.texturesToDestroy.length = 0; + + PIXI.visibleCount++; + stage.updateTransform(); + + // update the background color + // if(this.view.style.backgroundColor!=stage.backgroundColorString && !this.transparent)this.view.style.backgroundColor = stage.backgroundColorString; + + this.context.setTransform(1, 0, 0, 1, 0, 0); + this.context.clearRect(0, 0, this.width, this.height) + this.renderDisplayObject(stage); + + // Remove frame updates + if (PIXI.Texture.frameUpdates.length > 0) + { + PIXI.Texture.frameUpdates.length = 0; + } + +} PIXI.CanvasRenderer.prototype.renderDisplayObject = function(displayObject) { - // no loger recurrsive! - var transform; - var context = this.context; - - context.globalCompositeOperation = 'source-over'; - - // one the display object hits this. we can break the loop + // Once the display object hits this we can break the loop var testObject = displayObject.last._iNext; displayObject = displayObject.first; do { - transform = displayObject.worldTransform; + //transform = displayObject.worldTransform; - if(!displayObject.visible) + if (!displayObject.visible) { displayObject = displayObject.last._iNext; continue; } - if(!displayObject.renderable || displayObject.alpha == 0) + if (!displayObject.renderable || displayObject.alpha == 0) { displayObject = displayObject._iNext; continue; } - if(displayObject instanceof PIXI.Sprite) + if (displayObject instanceof PIXI.Sprite) { - var frame = displayObject.texture.frame; + // var frame = displayObject.texture.frame; - if(frame) + if (displayObject.texture.frame) { - context.globalAlpha = displayObject.worldAlpha; + this.context.globalAlpha = displayObject.worldAlpha; if (displayObject.texture.trimmed) { - context.setTransform(transform[0], transform[3], transform[1], transform[4], transform[2] + displayObject.texture.trim.x, transform[5] + displayObject.texture.trim.y); + this.context.setTransform(displayObject.worldTransform[0], displayObject.worldTransform[3], displayObject.worldTransform[1], displayObject.worldTransform[4], displayObject.worldTransform[2] + displayObject.texture.trim.x, displayObject.worldTransform[5] + displayObject.texture.trim.y); } else { - context.setTransform(transform[0], transform[3], transform[1], transform[4], transform[2], transform[5]); + this.context.setTransform(displayObject.worldTransform[0], displayObject.worldTransform[3], displayObject.worldTransform[1], displayObject.worldTransform[4], displayObject.worldTransform[2], displayObject.worldTransform[5]); } - context.drawImage(displayObject.texture.baseTexture.source, - frame.x, - frame.y, - frame.width, - frame.height, - (displayObject.anchor.x) * -frame.width, - (displayObject.anchor.y) * -frame.height, - frame.width, - frame.height); + this.context.drawImage( + displayObject.texture.baseTexture.source, + displayObject.texture.frame.x, + displayObject.texture.frame.y, + displayObject.texture.frame.width, + displayObject.texture.frame.height, + (displayObject.anchor.x) * -displayObject.texture.frame.width, + (displayObject.anchor.y) * -displayObject.texture.frame.height, + displayObject.texture.frame.width, + displayObject.texture.frame.height); } } - else if(displayObject instanceof PIXI.Strip) + else if (displayObject instanceof PIXI.Strip) { - context.setTransform(transform[0], transform[3], transform[1], transform[4], transform[2], transform[5]) + this.context.setTransform(displayObject.worldTransform[0], displayObject.worldTransform[3], displayObject.worldTransform[1], displayObject.worldTransform[4], displayObject.worldTransform[2], displayObject.worldTransform[5]) this.renderStrip(displayObject); } - else if(displayObject instanceof PIXI.TilingSprite) + else if (displayObject instanceof PIXI.TilingSprite) { - context.setTransform(transform[0], transform[3], transform[1], transform[4], transform[2], transform[5]) + this.context.setTransform(displayObject.worldTransform[0], displayObject.worldTransform[3], displayObject.worldTransform[1], displayObject.worldTransform[4], displayObject.worldTransform[2], displayObject.worldTransform[5]) this.renderTilingSprite(displayObject); } - else if(displayObject instanceof PIXI.CustomRenderable) + else if (displayObject instanceof PIXI.CustomRenderable) { displayObject.renderCanvas(this); } - else if(displayObject instanceof PIXI.Graphics) + else if (displayObject instanceof PIXI.Graphics) { - context.setTransform(transform[0], transform[3], transform[1], transform[4], transform[2], transform[5]) - PIXI.CanvasGraphics.renderGraphics(displayObject, context); + this.context.setTransform(displayObject.worldTransform[0], displayObject.worldTransform[3], displayObject.worldTransform[1], displayObject.worldTransform[4], displayObject.worldTransform[2], displayObject.worldTransform[5]) + PIXI.CanvasGraphics.renderGraphics(displayObject, this.context); } - else if(displayObject instanceof PIXI.FilterBlock) + else if (displayObject instanceof PIXI.FilterBlock) { - if(displayObject.open) + if (displayObject.open) { - context.save(); + this.context.save(); var cacheAlpha = displayObject.mask.alpha; var maskTransform = displayObject.mask.worldTransform; - context.setTransform(maskTransform[0], maskTransform[3], maskTransform[1], maskTransform[4], maskTransform[2], maskTransform[5]) + this.context.setTransform(maskTransform[0], maskTransform[3], maskTransform[1], maskTransform[4], maskTransform[2], maskTransform[5]) displayObject.mask.worldAlpha = 0.5; - context.worldAlpha = 0; + this.context.worldAlpha = 0; - PIXI.CanvasGraphics.renderGraphicsMask(displayObject.mask, context); - context.clip(); + PIXI.CanvasGraphics.renderGraphicsMask(displayObject.mask, this.context); + this.context.clip(); displayObject.mask.worldAlpha = cacheAlpha; } else { - context.restore(); + this.context.restore(); } } - // count++ + // count++ displayObject = displayObject._iNext; - - } while(displayObject != testObject) diff --git a/src/gameobjects/BitmapData.js b/src/gameobjects/BitmapData.js index 2d42c70d..863d7e56 100644 --- a/src/gameobjects/BitmapData.js +++ b/src/gameobjects/BitmapData.js @@ -54,29 +54,31 @@ Phaser.BitmapData = function (game, width, height) { * @property {array} imageData - The canvas image data. */ this.imageData = this.context.getImageData(0, 0, width, height); - + + this.pixels = new Int32Array(this.imageData.data.buffer); + /** * @property {Uint8ClampedArray} data8 - A uint8 clamped view on the buffer. */ - this.data8 = new Uint8ClampedArray(this.imageData.buffer); + // this.data8 = new Uint8ClampedArray(this.imageData.buffer); /** * @property {Uint32Array} data32 - A Uint32 view on the buffer. */ - this.data32 = new Uint32Array(this.imageData.buffer); + // this.data32 = new Uint32Array(this.imageData.buffer); // Little or big-endian? - this.data32[1] = 0x0a0b0c0d; + // this.data32[1] = 0x0a0b0c0d; /** * @property {boolean} isLittleEndian - . */ this.isLittleEndian = true; - if (this.data32[4] === 0x0a && this.data32[5] === 0x0b && this.data32[6] === 0x0c && this.data32[7] === 0x0d) - { - this.isLittleEndian = false; - } + // if (this.data32[4] === 0x0a && this.data32[5] === 0x0b && this.data32[6] === 0x0c && this.data32[7] === 0x0d) + // { + // this.isLittleEndian = false; + // } /** * @property {PIXI.BaseTexture} baseTexture - The PIXI.BaseTexture. @@ -150,8 +152,10 @@ Phaser.BitmapData.prototype = { refreshBuffer: function () { this.imageData = this.context.getImageData(0, 0, this.width, this.height); - this.data8 = new Uint8ClampedArray(this.imageData.buffer); - this.data32 = new Uint32Array(this.imageData.buffer); + this.pixels = new Int32Array(this.imageData.data.buffer); + + // this.data8 = new Uint8ClampedArray(this.imageData.buffer); + // this.data32 = new Uint32Array(this.imageData.buffer); }, @@ -169,6 +173,9 @@ Phaser.BitmapData.prototype = { if (x >= 0 && x <= this.width && y >= 0 && y <= this.height) { + this.pixels[y * this.width + x] = (alpha << 24) | (blue << 16) | (green << 8) | red; + + /* if (this.isLittleEndian) { this.data32[y * this.width + x] = (alpha << 24) | (blue << 16) | (green << 8) | red; @@ -177,8 +184,9 @@ Phaser.BitmapData.prototype = { { this.data32[y * this.width + x] = (red << 24) | (green << 16) | (blue << 8) | alpha; } + */ - this.imageData.data.set(this.data8); + // this.imageData.data.set(this.data8); this.context.putImageData(this.imageData, 0, 0); diff --git a/src/input/Mouse.js b/src/input/Mouse.js index 155666c0..6ed205bb 100644 --- a/src/input/Mouse.js +++ b/src/input/Mouse.js @@ -69,6 +69,30 @@ Phaser.Mouse = function (game) { */ this.pointerLock = new Phaser.Signal; + /** + * The browser mouse event. + * @property {MouseEvent} event + */ + this.event; + + /** + * @property {function} _onMouseDown + * @private + */ + this._onMouseDown; + + /** + * @property {function} _onMouseMove + * @private + */ + this._onMouseMove; + + /** + * @property {function} _onMouseUp + * @private + */ + this._onMouseUp; + }; /** @@ -122,9 +146,13 @@ Phaser.Mouse.prototype = { return _this.onMouseUp(event); }; - this.game.renderer.view.addEventListener('mousedown', this._onMouseDown, true); - this.game.renderer.view.addEventListener('mousemove', this._onMouseMove, true); - this.game.renderer.view.addEventListener('mouseup', this._onMouseUp, true); + // this.game.renderer.view.addEventListener('mousedown', this._onMouseDown, true); + // this.game.renderer.view.addEventListener('mousemove', this._onMouseMove, true); + // this.game.renderer.view.addEventListener('mouseup', this._onMouseUp, true); + + document.addEventListener('mousedown', this._onMouseDown, true); + document.addEventListener('mousemove', this._onMouseMove, true); + document.addEventListener('mouseup', this._onMouseUp, true); }, @@ -135,20 +163,11 @@ Phaser.Mouse.prototype = { */ onMouseDown: function (event) { + this.event = event; + event.preventDefault(); - if (event.which === 1) - { - this.button = Phaser.Mouse.LEFT_BUTTON; - } - else if (event.which === 2) - { - this.button = Phaser.Mouse.MIDDLE_BUTTON; - } - else if (event.which === 3) - { - this.button = Phaser.Mouse.RIGHT_BUTTON; - } + this.button = event.which; if (this.mouseDownCallback) { @@ -173,6 +192,8 @@ Phaser.Mouse.prototype = { */ onMouseMove: function (event) { + this.event = event; + event.preventDefault(); if (this.mouseMoveCallback) @@ -198,6 +219,8 @@ Phaser.Mouse.prototype = { */ onMouseUp: function (event) { + this.event = event; + event.preventDefault(); this.button = Phaser.Mouse.NO_BUTTON; @@ -293,9 +316,13 @@ Phaser.Mouse.prototype = { */ stop: function () { - this.game.stage.canvas.removeEventListener('mousedown', this._onMouseDown, true); - this.game.stage.canvas.removeEventListener('mousemove', this._onMouseMove, true); - this.game.stage.canvas.removeEventListener('mouseup', this._onMouseUp, true); + // this.game.stage.canvas.removeEventListener('mousedown', this._onMouseDown, true); + // this.game.stage.canvas.removeEventListener('mousemove', this._onMouseMove, true); + // this.game.stage.canvas.removeEventListener('mouseup', this._onMouseUp, true); + + document.removeEventListener('mousedown', this._onMouseDown, true); + document.removeEventListener('mousemove', this._onMouseMove, true); + document.removeEventListener('mouseup', this._onMouseUp, true); } diff --git a/src/system/RequestAnimationFrame.js b/src/system/RequestAnimationFrame.js index 8d3ca09f..b7eeb665 100644 --- a/src/system/RequestAnimationFrame.js +++ b/src/system/RequestAnimationFrame.js @@ -13,21 +13,15 @@ */ Phaser.RequestAnimationFrame = function(game) { - /** - * @property {Phaser.Game} game - The currently running game. - */ + /** + * @property {Phaser.Game} game - The currently running game. + */ this.game = game; - /** - * @property {boolean} _isSetTimeOut - Description. - * @private - */ - this._isSetTimeOut = false; - - /** - * @property {boolean} isRunning - Description. - * @default - */ + /** + * @property {boolean} isRunning - true if RequestAnimationFrame is running, otherwise false. + * @default + */ this.isRunning = false; var vendors = [ @@ -44,15 +38,19 @@ Phaser.RequestAnimationFrame = function(game) { } /** - * The function called by the update - * @property _onLoop + * @property {boolean} _isSetTimeOut - true if the browser is using setTimeout instead of raf. + * @private + */ + this._isSetTimeOut = false; + + /** + * @property {function} _onLoop - The function called by the update. * @private */ this._onLoop = null; /** - * The callback ID used when calling cancel - * @property _timeOutID + * @property {number} _timeOutID - The callback ID used when calling cancel. * @private */ this._timeOutID = null; @@ -61,7 +59,6 @@ Phaser.RequestAnimationFrame = function(game) { Phaser.RequestAnimationFrame.prototype = { - /** * Starts the requestAnimatioFrame running or setTimeout if unavailable in browser * @method Phaser.RequestAnimationFrame#start