diff --git a/src/core/renderers/canvas/CanvasRenderer.js b/src/core/renderers/canvas/CanvasRenderer.js index 0ca0c48..84b841a 100644 --- a/src/core/renderers/canvas/CanvasRenderer.js +++ b/src/core/renderers/canvas/CanvasRenderer.js @@ -97,6 +97,8 @@ } } + this.initPlugins(); + this._mapBlendModes(); /** @@ -110,6 +112,7 @@ worldAlpha: 1 }; + this.resize(width, height); } @@ -117,6 +120,7 @@ CanvasRenderer.prototype = Object.create(SystemRenderer.prototype); CanvasRenderer.prototype.constructor = CanvasRenderer; module.exports = CanvasRenderer; +utils.pluginTarget.mixin(CanvasRenderer); /** * Renders the object to this canvas view @@ -126,6 +130,9 @@ CanvasRenderer.prototype.render = function (object) { var cacheParent = object.parent; + + this._lastObjectRendered = object; + object.parent = this._tempDisplayObjectParent; // update the scene graph @@ -169,6 +176,8 @@ */ CanvasRenderer.prototype.destroy = function (removeView) { + this.destroyPlugins(); + // call the base destroy SystemRenderer.prototype.destroy.call(this, removeView); diff --git a/src/core/renderers/canvas/CanvasRenderer.js b/src/core/renderers/canvas/CanvasRenderer.js index 0ca0c48..84b841a 100644 --- a/src/core/renderers/canvas/CanvasRenderer.js +++ b/src/core/renderers/canvas/CanvasRenderer.js @@ -97,6 +97,8 @@ } } + this.initPlugins(); + this._mapBlendModes(); /** @@ -110,6 +112,7 @@ worldAlpha: 1 }; + this.resize(width, height); } @@ -117,6 +120,7 @@ CanvasRenderer.prototype = Object.create(SystemRenderer.prototype); CanvasRenderer.prototype.constructor = CanvasRenderer; module.exports = CanvasRenderer; +utils.pluginTarget.mixin(CanvasRenderer); /** * Renders the object to this canvas view @@ -126,6 +130,9 @@ CanvasRenderer.prototype.render = function (object) { var cacheParent = object.parent; + + this._lastObjectRendered = object; + object.parent = this._tempDisplayObjectParent; // update the scene graph @@ -169,6 +176,8 @@ */ CanvasRenderer.prototype.destroy = function (removeView) { + this.destroyPlugins(); + // call the base destroy SystemRenderer.prototype.destroy.call(this, removeView); diff --git a/src/core/renderers/canvas/utils/CanvasBuffer.js b/src/core/renderers/canvas/utils/CanvasBuffer.js index b183a66..0ebd152 100644 --- a/src/core/renderers/canvas/utils/CanvasBuffer.js +++ b/src/core/renderers/canvas/utils/CanvasBuffer.js @@ -86,3 +86,9 @@ this.canvas.width = width; this.canvas.height = height; }; + +CanvasBuffer.prototype.destroy = function (width, height) +{ + this.context = null; + this.canvas = null; +}; diff --git a/src/core/renderers/canvas/CanvasRenderer.js b/src/core/renderers/canvas/CanvasRenderer.js index 0ca0c48..84b841a 100644 --- a/src/core/renderers/canvas/CanvasRenderer.js +++ b/src/core/renderers/canvas/CanvasRenderer.js @@ -97,6 +97,8 @@ } } + this.initPlugins(); + this._mapBlendModes(); /** @@ -110,6 +112,7 @@ worldAlpha: 1 }; + this.resize(width, height); } @@ -117,6 +120,7 @@ CanvasRenderer.prototype = Object.create(SystemRenderer.prototype); CanvasRenderer.prototype.constructor = CanvasRenderer; module.exports = CanvasRenderer; +utils.pluginTarget.mixin(CanvasRenderer); /** * Renders the object to this canvas view @@ -126,6 +130,9 @@ CanvasRenderer.prototype.render = function (object) { var cacheParent = object.parent; + + this._lastObjectRendered = object; + object.parent = this._tempDisplayObjectParent; // update the scene graph @@ -169,6 +176,8 @@ */ CanvasRenderer.prototype.destroy = function (removeView) { + this.destroyPlugins(); + // call the base destroy SystemRenderer.prototype.destroy.call(this, removeView); diff --git a/src/core/renderers/canvas/utils/CanvasBuffer.js b/src/core/renderers/canvas/utils/CanvasBuffer.js index b183a66..0ebd152 100644 --- a/src/core/renderers/canvas/utils/CanvasBuffer.js +++ b/src/core/renderers/canvas/utils/CanvasBuffer.js @@ -86,3 +86,9 @@ this.canvas.width = width; this.canvas.height = height; }; + +CanvasBuffer.prototype.destroy = function (width, height) +{ + this.context = null; + this.canvas = null; +}; diff --git a/src/core/renderers/canvas/utils/CanvasMaskManager.js b/src/core/renderers/canvas/utils/CanvasMaskManager.js index 9827d36..49749d3 100644 --- a/src/core/renderers/canvas/utils/CanvasMaskManager.js +++ b/src/core/renderers/canvas/utils/CanvasMaskManager.js @@ -20,6 +20,7 @@ */ CanvasMaskManager.prototype.pushMask = function (maskData, renderer) { + renderer.context.save(); var cacheAlpha = maskData.alpha; @@ -35,9 +36,13 @@ transform.ty * resolution ); - CanvasGraphics.renderGraphicsMask(maskData, renderer.context); - - renderer.context.clip(); + //TODO suport sprite alpha masks?? + //lots of effort required. If demand is great enough.. + if(!maskData.texture) + { + CanvasGraphics.renderGraphicsMask(maskData, renderer.context); + renderer.context.clip(); + } maskData.worldAlpha = cacheAlpha; }; diff --git a/src/core/renderers/canvas/CanvasRenderer.js b/src/core/renderers/canvas/CanvasRenderer.js index 0ca0c48..84b841a 100644 --- a/src/core/renderers/canvas/CanvasRenderer.js +++ b/src/core/renderers/canvas/CanvasRenderer.js @@ -97,6 +97,8 @@ } } + this.initPlugins(); + this._mapBlendModes(); /** @@ -110,6 +112,7 @@ worldAlpha: 1 }; + this.resize(width, height); } @@ -117,6 +120,7 @@ CanvasRenderer.prototype = Object.create(SystemRenderer.prototype); CanvasRenderer.prototype.constructor = CanvasRenderer; module.exports = CanvasRenderer; +utils.pluginTarget.mixin(CanvasRenderer); /** * Renders the object to this canvas view @@ -126,6 +130,9 @@ CanvasRenderer.prototype.render = function (object) { var cacheParent = object.parent; + + this._lastObjectRendered = object; + object.parent = this._tempDisplayObjectParent; // update the scene graph @@ -169,6 +176,8 @@ */ CanvasRenderer.prototype.destroy = function (removeView) { + this.destroyPlugins(); + // call the base destroy SystemRenderer.prototype.destroy.call(this, removeView); diff --git a/src/core/renderers/canvas/utils/CanvasBuffer.js b/src/core/renderers/canvas/utils/CanvasBuffer.js index b183a66..0ebd152 100644 --- a/src/core/renderers/canvas/utils/CanvasBuffer.js +++ b/src/core/renderers/canvas/utils/CanvasBuffer.js @@ -86,3 +86,9 @@ this.canvas.width = width; this.canvas.height = height; }; + +CanvasBuffer.prototype.destroy = function (width, height) +{ + this.context = null; + this.canvas = null; +}; diff --git a/src/core/renderers/canvas/utils/CanvasMaskManager.js b/src/core/renderers/canvas/utils/CanvasMaskManager.js index 9827d36..49749d3 100644 --- a/src/core/renderers/canvas/utils/CanvasMaskManager.js +++ b/src/core/renderers/canvas/utils/CanvasMaskManager.js @@ -20,6 +20,7 @@ */ CanvasMaskManager.prototype.pushMask = function (maskData, renderer) { + renderer.context.save(); var cacheAlpha = maskData.alpha; @@ -35,9 +36,13 @@ transform.ty * resolution ); - CanvasGraphics.renderGraphicsMask(maskData, renderer.context); - - renderer.context.clip(); + //TODO suport sprite alpha masks?? + //lots of effort required. If demand is great enough.. + if(!maskData.texture) + { + CanvasGraphics.renderGraphicsMask(maskData, renderer.context); + renderer.context.clip(); + } maskData.worldAlpha = cacheAlpha; }; diff --git a/src/core/sprites/Sprite.js b/src/core/sprites/Sprite.js index ed69607..0586999 100644 --- a/src/core/sprites/Sprite.js +++ b/src/core/sprites/Sprite.js @@ -316,7 +316,7 @@ */ Sprite.prototype.renderCanvas = function (renderer) { - if (!this.visible || this.alpha <= 0 || this.texture.crop.width <= 0 || this.texture.crop.height <= 0) + if (!this.visible || this.alpha <= 0 || this.texture.crop.width <= 0 || this.texture.crop.height <= 0 || !this.renderable) { return; } diff --git a/src/core/renderers/canvas/CanvasRenderer.js b/src/core/renderers/canvas/CanvasRenderer.js index 0ca0c48..84b841a 100644 --- a/src/core/renderers/canvas/CanvasRenderer.js +++ b/src/core/renderers/canvas/CanvasRenderer.js @@ -97,6 +97,8 @@ } } + this.initPlugins(); + this._mapBlendModes(); /** @@ -110,6 +112,7 @@ worldAlpha: 1 }; + this.resize(width, height); } @@ -117,6 +120,7 @@ CanvasRenderer.prototype = Object.create(SystemRenderer.prototype); CanvasRenderer.prototype.constructor = CanvasRenderer; module.exports = CanvasRenderer; +utils.pluginTarget.mixin(CanvasRenderer); /** * Renders the object to this canvas view @@ -126,6 +130,9 @@ CanvasRenderer.prototype.render = function (object) { var cacheParent = object.parent; + + this._lastObjectRendered = object; + object.parent = this._tempDisplayObjectParent; // update the scene graph @@ -169,6 +176,8 @@ */ CanvasRenderer.prototype.destroy = function (removeView) { + this.destroyPlugins(); + // call the base destroy SystemRenderer.prototype.destroy.call(this, removeView); diff --git a/src/core/renderers/canvas/utils/CanvasBuffer.js b/src/core/renderers/canvas/utils/CanvasBuffer.js index b183a66..0ebd152 100644 --- a/src/core/renderers/canvas/utils/CanvasBuffer.js +++ b/src/core/renderers/canvas/utils/CanvasBuffer.js @@ -86,3 +86,9 @@ this.canvas.width = width; this.canvas.height = height; }; + +CanvasBuffer.prototype.destroy = function (width, height) +{ + this.context = null; + this.canvas = null; +}; diff --git a/src/core/renderers/canvas/utils/CanvasMaskManager.js b/src/core/renderers/canvas/utils/CanvasMaskManager.js index 9827d36..49749d3 100644 --- a/src/core/renderers/canvas/utils/CanvasMaskManager.js +++ b/src/core/renderers/canvas/utils/CanvasMaskManager.js @@ -20,6 +20,7 @@ */ CanvasMaskManager.prototype.pushMask = function (maskData, renderer) { + renderer.context.save(); var cacheAlpha = maskData.alpha; @@ -35,9 +36,13 @@ transform.ty * resolution ); - CanvasGraphics.renderGraphicsMask(maskData, renderer.context); - - renderer.context.clip(); + //TODO suport sprite alpha masks?? + //lots of effort required. If demand is great enough.. + if(!maskData.texture) + { + CanvasGraphics.renderGraphicsMask(maskData, renderer.context); + renderer.context.clip(); + } maskData.worldAlpha = cacheAlpha; }; diff --git a/src/core/sprites/Sprite.js b/src/core/sprites/Sprite.js index ed69607..0586999 100644 --- a/src/core/sprites/Sprite.js +++ b/src/core/sprites/Sprite.js @@ -316,7 +316,7 @@ */ Sprite.prototype.renderCanvas = function (renderer) { - if (!this.visible || this.alpha <= 0 || this.texture.crop.width <= 0 || this.texture.crop.height <= 0) + if (!this.visible || this.alpha <= 0 || this.texture.crop.width <= 0 || this.texture.crop.height <= 0 || !this.renderable) { return; } diff --git a/src/core/textures/RenderTexture.js b/src/core/textures/RenderTexture.js index d6b3f77..9cf5a8e 100644 --- a/src/core/textures/RenderTexture.js +++ b/src/core/textures/RenderTexture.js @@ -3,7 +3,8 @@ RenderTarget = require('../renderers/webgl/utils/RenderTarget'), CanvasBuffer = require('../renderers/canvas/utils/CanvasBuffer'), math = require('../math'), - CONST = require('../const'); + CONST = require('../const'), + tempMatrix = new math.Matrix(); /** * A RenderTexture is a special texture that allows any Pixi display object to be rendered to it. @@ -286,14 +287,17 @@ * @param [matrix] {Matrix} Optional matrix to apply to the display object before rendering. * @param [clear] {boolean} If true the texture will be cleared before the displayObject is drawn */ -RenderTexture.prototype.renderCanvas = function (displayObject, matrix, clear) +RenderTexture.prototype.renderCanvas = function (displayObject, matrix, clear, updateTransform) { if (!this.valid) { return; } - var wt = displayObject.worldTransform; + updateTransform = !!updateTransform; + var cachedWt = displayObject.worldTransform; + + var wt = tempMatrix; wt.identity(); @@ -302,6 +306,8 @@ wt.append(matrix); } + displayObject.worldTransform = wt; + // setWorld Alpha to ensure that the object is renderer at full opacity displayObject.worldAlpha = 1; @@ -319,6 +325,8 @@ this.textureBuffer.clear(); } + displayObject.worldTransform = cachedWt; + // this.textureBuffer. var context = this.textureBuffer.context; diff --git a/src/core/renderers/canvas/CanvasRenderer.js b/src/core/renderers/canvas/CanvasRenderer.js index 0ca0c48..84b841a 100644 --- a/src/core/renderers/canvas/CanvasRenderer.js +++ b/src/core/renderers/canvas/CanvasRenderer.js @@ -97,6 +97,8 @@ } } + this.initPlugins(); + this._mapBlendModes(); /** @@ -110,6 +112,7 @@ worldAlpha: 1 }; + this.resize(width, height); } @@ -117,6 +120,7 @@ CanvasRenderer.prototype = Object.create(SystemRenderer.prototype); CanvasRenderer.prototype.constructor = CanvasRenderer; module.exports = CanvasRenderer; +utils.pluginTarget.mixin(CanvasRenderer); /** * Renders the object to this canvas view @@ -126,6 +130,9 @@ CanvasRenderer.prototype.render = function (object) { var cacheParent = object.parent; + + this._lastObjectRendered = object; + object.parent = this._tempDisplayObjectParent; // update the scene graph @@ -169,6 +176,8 @@ */ CanvasRenderer.prototype.destroy = function (removeView) { + this.destroyPlugins(); + // call the base destroy SystemRenderer.prototype.destroy.call(this, removeView); diff --git a/src/core/renderers/canvas/utils/CanvasBuffer.js b/src/core/renderers/canvas/utils/CanvasBuffer.js index b183a66..0ebd152 100644 --- a/src/core/renderers/canvas/utils/CanvasBuffer.js +++ b/src/core/renderers/canvas/utils/CanvasBuffer.js @@ -86,3 +86,9 @@ this.canvas.width = width; this.canvas.height = height; }; + +CanvasBuffer.prototype.destroy = function (width, height) +{ + this.context = null; + this.canvas = null; +}; diff --git a/src/core/renderers/canvas/utils/CanvasMaskManager.js b/src/core/renderers/canvas/utils/CanvasMaskManager.js index 9827d36..49749d3 100644 --- a/src/core/renderers/canvas/utils/CanvasMaskManager.js +++ b/src/core/renderers/canvas/utils/CanvasMaskManager.js @@ -20,6 +20,7 @@ */ CanvasMaskManager.prototype.pushMask = function (maskData, renderer) { + renderer.context.save(); var cacheAlpha = maskData.alpha; @@ -35,9 +36,13 @@ transform.ty * resolution ); - CanvasGraphics.renderGraphicsMask(maskData, renderer.context); - - renderer.context.clip(); + //TODO suport sprite alpha masks?? + //lots of effort required. If demand is great enough.. + if(!maskData.texture) + { + CanvasGraphics.renderGraphicsMask(maskData, renderer.context); + renderer.context.clip(); + } maskData.worldAlpha = cacheAlpha; }; diff --git a/src/core/sprites/Sprite.js b/src/core/sprites/Sprite.js index ed69607..0586999 100644 --- a/src/core/sprites/Sprite.js +++ b/src/core/sprites/Sprite.js @@ -316,7 +316,7 @@ */ Sprite.prototype.renderCanvas = function (renderer) { - if (!this.visible || this.alpha <= 0 || this.texture.crop.width <= 0 || this.texture.crop.height <= 0) + if (!this.visible || this.alpha <= 0 || this.texture.crop.width <= 0 || this.texture.crop.height <= 0 || !this.renderable) { return; } diff --git a/src/core/textures/RenderTexture.js b/src/core/textures/RenderTexture.js index d6b3f77..9cf5a8e 100644 --- a/src/core/textures/RenderTexture.js +++ b/src/core/textures/RenderTexture.js @@ -3,7 +3,8 @@ RenderTarget = require('../renderers/webgl/utils/RenderTarget'), CanvasBuffer = require('../renderers/canvas/utils/CanvasBuffer'), math = require('../math'), - CONST = require('../const'); + CONST = require('../const'), + tempMatrix = new math.Matrix(); /** * A RenderTexture is a special texture that allows any Pixi display object to be rendered to it. @@ -286,14 +287,17 @@ * @param [matrix] {Matrix} Optional matrix to apply to the display object before rendering. * @param [clear] {boolean} If true the texture will be cleared before the displayObject is drawn */ -RenderTexture.prototype.renderCanvas = function (displayObject, matrix, clear) +RenderTexture.prototype.renderCanvas = function (displayObject, matrix, clear, updateTransform) { if (!this.valid) { return; } - var wt = displayObject.worldTransform; + updateTransform = !!updateTransform; + var cachedWt = displayObject.worldTransform; + + var wt = tempMatrix; wt.identity(); @@ -302,6 +306,8 @@ wt.append(matrix); } + displayObject.worldTransform = wt; + // setWorld Alpha to ensure that the object is renderer at full opacity displayObject.worldAlpha = 1; @@ -319,6 +325,8 @@ this.textureBuffer.clear(); } + displayObject.worldTransform = cachedWt; + // this.textureBuffer. var context = this.textureBuffer.context; diff --git a/src/extras/cacheAsBitmap.js b/src/extras/cacheAsBitmap.js index 9defbaa..3ea836c 100644 --- a/src/extras/cacheAsBitmap.js +++ b/src/extras/cacheAsBitmap.js @@ -6,7 +6,8 @@ _tempMatrix = new math.Matrix(); DisplayObject.prototype._cacheAsBitmap = false; -DisplayObject.prototype._originalRenderWebGL = false; +DisplayObject.prototype._originalRenderWebGL = null; +DisplayObject.prototype._originalRenderCanvas = null; DisplayObject.prototype._originalUpdateTransform = null; DisplayObject.prototype._originalHitTest = null; @@ -33,10 +34,14 @@ if(value) { this._originalRenderWebGL = this.renderWebGL; + this._originalRenderCanvas = this.renderCanvas; + this._originalUpdateTransform = this.updateTransform; this._originalHitTest = this.hitTest; this.renderWebGL = this._renderCachedWebGL; + this.renderCanvas = this._renderCachedCanvas; + this.updateTransform = this.displayObjectUpdateTransform; } @@ -48,6 +53,8 @@ } this.renderWebGL = this._originalRenderWebGL; + this.renderCanvas = this._originalRenderCanvas; + this.updateTransform = this._originalUpdateTransform; this.hitTest = this._originalHitTest; } @@ -105,18 +112,64 @@ this.hitTest = this._cachedSprite.hitTest.bind(this._cachedSprite); }; + +DisplayObject.prototype._renderCachedCanvas = function(renderer) +{ + // console.log("!!!!") + this._initCachedDisplayObjectCanvas( renderer ); + // console.log("<>") + this._cachedSprite.worldAlpha = this.worldAlpha; + + this._cachedSprite.renderCanvas(renderer); +}; + +DisplayObject.prototype._initCachedDisplayObjectCanvas = function( renderer ) +{ + if(this._cachedSprite) + { + return; + } + + //get bounds actually transforms the object for us already! + var bounds = this.getLocalBounds(); + + var cachedRenderTarget = renderer.context; + + var renderTexture = new RenderTexture(renderer, bounds.width | 0, bounds.height | 0); + + // need to set // + var m = _tempMatrix; + + m.tx = -bounds.x; + m.ty = -bounds.y; + + // set all properties to there original so we can render to a texture + this._cacheAsBitmap = false; + this.renderCanvas = this._originalRenderCanvas; + + renderTexture.render(this, m, true); + + // now restore the state be setting the new properties + renderer.context = cachedRenderTarget; + + this.renderCanvas = this._renderCachedCanvas; + this._cacheAsBitmap = true; + + // create our cached sprite + this._cachedSprite = new Sprite(renderTexture); + this._cachedSprite.worldTransform = this.worldTransform; + this._cachedSprite.anchor.x = -( bounds.x / bounds.width ); + this._cachedSprite.anchor.y = -( bounds.y / bounds.height ); + this.hitTest = this._cachedSprite.hitTest.bind(this._cachedSprite); +}; + + DisplayObject.prototype._destroyCachedDisplayObject = function() { this._cachedSprite._texture.destroy(); this._cachedSprite = null; }; -DisplayObject.prototype._renderCachedCanvas = function( renderer ) -{ - this._initCachedDisplayObject( renderer ); - - //TODO add some codes init! -}; module.exports = {}; diff --git a/src/core/renderers/canvas/CanvasRenderer.js b/src/core/renderers/canvas/CanvasRenderer.js index 0ca0c48..84b841a 100644 --- a/src/core/renderers/canvas/CanvasRenderer.js +++ b/src/core/renderers/canvas/CanvasRenderer.js @@ -97,6 +97,8 @@ } } + this.initPlugins(); + this._mapBlendModes(); /** @@ -110,6 +112,7 @@ worldAlpha: 1 }; + this.resize(width, height); } @@ -117,6 +120,7 @@ CanvasRenderer.prototype = Object.create(SystemRenderer.prototype); CanvasRenderer.prototype.constructor = CanvasRenderer; module.exports = CanvasRenderer; +utils.pluginTarget.mixin(CanvasRenderer); /** * Renders the object to this canvas view @@ -126,6 +130,9 @@ CanvasRenderer.prototype.render = function (object) { var cacheParent = object.parent; + + this._lastObjectRendered = object; + object.parent = this._tempDisplayObjectParent; // update the scene graph @@ -169,6 +176,8 @@ */ CanvasRenderer.prototype.destroy = function (removeView) { + this.destroyPlugins(); + // call the base destroy SystemRenderer.prototype.destroy.call(this, removeView); diff --git a/src/core/renderers/canvas/utils/CanvasBuffer.js b/src/core/renderers/canvas/utils/CanvasBuffer.js index b183a66..0ebd152 100644 --- a/src/core/renderers/canvas/utils/CanvasBuffer.js +++ b/src/core/renderers/canvas/utils/CanvasBuffer.js @@ -86,3 +86,9 @@ this.canvas.width = width; this.canvas.height = height; }; + +CanvasBuffer.prototype.destroy = function (width, height) +{ + this.context = null; + this.canvas = null; +}; diff --git a/src/core/renderers/canvas/utils/CanvasMaskManager.js b/src/core/renderers/canvas/utils/CanvasMaskManager.js index 9827d36..49749d3 100644 --- a/src/core/renderers/canvas/utils/CanvasMaskManager.js +++ b/src/core/renderers/canvas/utils/CanvasMaskManager.js @@ -20,6 +20,7 @@ */ CanvasMaskManager.prototype.pushMask = function (maskData, renderer) { + renderer.context.save(); var cacheAlpha = maskData.alpha; @@ -35,9 +36,13 @@ transform.ty * resolution ); - CanvasGraphics.renderGraphicsMask(maskData, renderer.context); - - renderer.context.clip(); + //TODO suport sprite alpha masks?? + //lots of effort required. If demand is great enough.. + if(!maskData.texture) + { + CanvasGraphics.renderGraphicsMask(maskData, renderer.context); + renderer.context.clip(); + } maskData.worldAlpha = cacheAlpha; }; diff --git a/src/core/sprites/Sprite.js b/src/core/sprites/Sprite.js index ed69607..0586999 100644 --- a/src/core/sprites/Sprite.js +++ b/src/core/sprites/Sprite.js @@ -316,7 +316,7 @@ */ Sprite.prototype.renderCanvas = function (renderer) { - if (!this.visible || this.alpha <= 0 || this.texture.crop.width <= 0 || this.texture.crop.height <= 0) + if (!this.visible || this.alpha <= 0 || this.texture.crop.width <= 0 || this.texture.crop.height <= 0 || !this.renderable) { return; } diff --git a/src/core/textures/RenderTexture.js b/src/core/textures/RenderTexture.js index d6b3f77..9cf5a8e 100644 --- a/src/core/textures/RenderTexture.js +++ b/src/core/textures/RenderTexture.js @@ -3,7 +3,8 @@ RenderTarget = require('../renderers/webgl/utils/RenderTarget'), CanvasBuffer = require('../renderers/canvas/utils/CanvasBuffer'), math = require('../math'), - CONST = require('../const'); + CONST = require('../const'), + tempMatrix = new math.Matrix(); /** * A RenderTexture is a special texture that allows any Pixi display object to be rendered to it. @@ -286,14 +287,17 @@ * @param [matrix] {Matrix} Optional matrix to apply to the display object before rendering. * @param [clear] {boolean} If true the texture will be cleared before the displayObject is drawn */ -RenderTexture.prototype.renderCanvas = function (displayObject, matrix, clear) +RenderTexture.prototype.renderCanvas = function (displayObject, matrix, clear, updateTransform) { if (!this.valid) { return; } - var wt = displayObject.worldTransform; + updateTransform = !!updateTransform; + var cachedWt = displayObject.worldTransform; + + var wt = tempMatrix; wt.identity(); @@ -302,6 +306,8 @@ wt.append(matrix); } + displayObject.worldTransform = wt; + // setWorld Alpha to ensure that the object is renderer at full opacity displayObject.worldAlpha = 1; @@ -319,6 +325,8 @@ this.textureBuffer.clear(); } + displayObject.worldTransform = cachedWt; + // this.textureBuffer. var context = this.textureBuffer.context; diff --git a/src/extras/cacheAsBitmap.js b/src/extras/cacheAsBitmap.js index 9defbaa..3ea836c 100644 --- a/src/extras/cacheAsBitmap.js +++ b/src/extras/cacheAsBitmap.js @@ -6,7 +6,8 @@ _tempMatrix = new math.Matrix(); DisplayObject.prototype._cacheAsBitmap = false; -DisplayObject.prototype._originalRenderWebGL = false; +DisplayObject.prototype._originalRenderWebGL = null; +DisplayObject.prototype._originalRenderCanvas = null; DisplayObject.prototype._originalUpdateTransform = null; DisplayObject.prototype._originalHitTest = null; @@ -33,10 +34,14 @@ if(value) { this._originalRenderWebGL = this.renderWebGL; + this._originalRenderCanvas = this.renderCanvas; + this._originalUpdateTransform = this.updateTransform; this._originalHitTest = this.hitTest; this.renderWebGL = this._renderCachedWebGL; + this.renderCanvas = this._renderCachedCanvas; + this.updateTransform = this.displayObjectUpdateTransform; } @@ -48,6 +53,8 @@ } this.renderWebGL = this._originalRenderWebGL; + this.renderCanvas = this._originalRenderCanvas; + this.updateTransform = this._originalUpdateTransform; this.hitTest = this._originalHitTest; } @@ -105,18 +112,64 @@ this.hitTest = this._cachedSprite.hitTest.bind(this._cachedSprite); }; + +DisplayObject.prototype._renderCachedCanvas = function(renderer) +{ + // console.log("!!!!") + this._initCachedDisplayObjectCanvas( renderer ); + // console.log("<>") + this._cachedSprite.worldAlpha = this.worldAlpha; + + this._cachedSprite.renderCanvas(renderer); +}; + +DisplayObject.prototype._initCachedDisplayObjectCanvas = function( renderer ) +{ + if(this._cachedSprite) + { + return; + } + + //get bounds actually transforms the object for us already! + var bounds = this.getLocalBounds(); + + var cachedRenderTarget = renderer.context; + + var renderTexture = new RenderTexture(renderer, bounds.width | 0, bounds.height | 0); + + // need to set // + var m = _tempMatrix; + + m.tx = -bounds.x; + m.ty = -bounds.y; + + // set all properties to there original so we can render to a texture + this._cacheAsBitmap = false; + this.renderCanvas = this._originalRenderCanvas; + + renderTexture.render(this, m, true); + + // now restore the state be setting the new properties + renderer.context = cachedRenderTarget; + + this.renderCanvas = this._renderCachedCanvas; + this._cacheAsBitmap = true; + + // create our cached sprite + this._cachedSprite = new Sprite(renderTexture); + this._cachedSprite.worldTransform = this.worldTransform; + this._cachedSprite.anchor.x = -( bounds.x / bounds.width ); + this._cachedSprite.anchor.y = -( bounds.y / bounds.height ); + this.hitTest = this._cachedSprite.hitTest.bind(this._cachedSprite); +}; + + DisplayObject.prototype._destroyCachedDisplayObject = function() { this._cachedSprite._texture.destroy(); this._cachedSprite = null; }; -DisplayObject.prototype._renderCachedCanvas = function( renderer ) -{ - this._initCachedDisplayObject( renderer ); - - //TODO add some codes init! -}; module.exports = {}; diff --git a/src/interaction/InteractionManager.js b/src/interaction/InteractionManager.js index c896437..1270b14 100644 --- a/src/interaction/InteractionManager.js +++ b/src/interaction/InteractionManager.js @@ -685,3 +685,4 @@ core.WebGLRenderer.registerPlugin('interaction', InteractionManager); +core.CanvasRenderer.registerPlugin('interaction', InteractionManager);