diff --git a/src/pixi/Pixi.js b/src/pixi/Pixi.js index 4cf4f3e..1eb1010 100644 --- a/src/pixi/Pixi.js +++ b/src/pixi/Pixi.js @@ -16,7 +16,7 @@ PIXI.CANVAS_RENDERER = 1; // useful for testing against if your lib is using pixi. -PIXI.VERSION = "v1.6.1"; +PIXI.VERSION = "v2.0.0"; // the various blend modes supported by pixi diff --git a/src/pixi/Pixi.js b/src/pixi/Pixi.js index 4cf4f3e..1eb1010 100644 --- a/src/pixi/Pixi.js +++ b/src/pixi/Pixi.js @@ -16,7 +16,7 @@ PIXI.CANVAS_RENDERER = 1; // useful for testing against if your lib is using pixi. -PIXI.VERSION = "v1.6.1"; +PIXI.VERSION = "v2.0.0"; // the various blend modes supported by pixi diff --git a/src/pixi/renderers/webgl/WebGLRenderer.js b/src/pixi/renderers/webgl/WebGLRenderer.js index e9e4658..c75bbb4 100644 --- a/src/pixi/renderers/webgl/WebGLRenderer.js +++ b/src/pixi/renderers/webgl/WebGLRenderer.js @@ -99,13 +99,13 @@ this.view = options.view || document.createElement( 'canvas' ); // deal with losing context.. - this.contextLostFunction = this.handleContextLost.bind(this); - this.contextRestoredFunction = this.handleContextRestored.bind(this); + this.contextLostBound = this.handleContextLost.bind(this); + this.contextRestoredBound = this.handleContextRestored.bind(this); - this.view.addEventListener('webglcontextlost', this.contextLostFunction, false); - this.view.addEventListener('webglcontextrestored', this.contextRestoredFunction, false); + this.view.addEventListener('webglcontextlost', this.contextLostBound, false); + this.view.addEventListener('webglcontextrestored', this.contextRestoredBound, false); - this.contextOptions = { + this._contextOptions = { alpha: this.transparent, antialias: options.antialias, // SPEED UP?? premultipliedAlpha:this.transparent && this.transparent !== 'notMultiplied', @@ -113,62 +113,16 @@ preserveDrawingBuffer: options.preserveDrawingBuffer }; - var gl = null; - - ['experimental-webgl', 'webgl'].forEach(function(name) { - try { - gl = gl || this.view.getContext(name, this.contextOptions); - } catch(e) {} - }, this); - - if (!gl) { - // fail, not able to get a context - throw new Error('This browser does not support webGL. Try using the canvas renderer' + this); - } - - this.gl = gl; - this.glContextId = gl.id = PIXI.WebGLRenderer.glContextId ++; - - PIXI.glContexts[this.glContextId] = gl; - - if(!PIXI.blendModesWebGL) - { - PIXI.blendModesWebGL = []; - - PIXI.blendModesWebGL[PIXI.blendModes.NORMAL] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; - PIXI.blendModesWebGL[PIXI.blendModes.ADD] = [gl.SRC_ALPHA, gl.DST_ALPHA]; - PIXI.blendModesWebGL[PIXI.blendModes.MULTIPLY] = [gl.DST_COLOR, gl.ONE_MINUS_SRC_ALPHA]; - PIXI.blendModesWebGL[PIXI.blendModes.SCREEN] = [gl.SRC_ALPHA, gl.ONE]; - PIXI.blendModesWebGL[PIXI.blendModes.OVERLAY] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; - PIXI.blendModesWebGL[PIXI.blendModes.DARKEN] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; - PIXI.blendModesWebGL[PIXI.blendModes.LIGHTEN] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; - PIXI.blendModesWebGL[PIXI.blendModes.COLOR_DODGE] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; - PIXI.blendModesWebGL[PIXI.blendModes.COLOR_BURN] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; - PIXI.blendModesWebGL[PIXI.blendModes.HARD_LIGHT] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; - PIXI.blendModesWebGL[PIXI.blendModes.SOFT_LIGHT] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; - PIXI.blendModesWebGL[PIXI.blendModes.DIFFERENCE] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; - PIXI.blendModesWebGL[PIXI.blendModes.EXCLUSION] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; - PIXI.blendModesWebGL[PIXI.blendModes.HUE] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; - PIXI.blendModesWebGL[PIXI.blendModes.SATURATION] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; - PIXI.blendModesWebGL[PIXI.blendModes.COLOR] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; - PIXI.blendModesWebGL[PIXI.blendModes.LUMINOSITY] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; - } - this.projection = new PIXI.Point(); - this.offset = new PIXI.Point(0, 0); - this.resize(width, height); - - this.contextLost = false; - // time to create the render managers! each one focuses on managine a state in webGL - this.shaderManager = new PIXI.WebGLShaderManager(gl); // deals with managing the shader programs and their attribs - this.spriteBatch = new PIXI.WebGLSpriteBatch(gl); // manages the rendering of sprites - this.maskManager = new PIXI.WebGLMaskManager(gl); // manages the masks using the stencil buffer - this.filterManager = new PIXI.WebGLFilterManager(gl, this.transparent); // manages the filters - this.stencilManager = new PIXI.WebGLStencilManager(gl); - this.blendModeManager = new PIXI.WebGLBlendModeManager(gl); + this.shaderManager = new PIXI.WebGLShaderManager(); // deals with managing the shader programs and their attribs + this.spriteBatch = new PIXI.WebGLSpriteBatch(); // manages the rendering of sprites + this.maskManager = new PIXI.WebGLMaskManager(); // manages the masks using the stencil buffer + this.filterManager = new PIXI.WebGLFilterManager(); // manages the filters + this.stencilManager = new PIXI.WebGLStencilManager(); + this.blendModeManager = new PIXI.WebGLBlendModeManager(); // TODO remove this.renderSession = {}; @@ -183,16 +137,49 @@ this.renderSession.renderer = this; this.renderSession.resolution = this.resolution; - gl.disable(gl.DEPTH_TEST); - gl.disable(gl.CULL_FACE); - gl.enable(gl.BLEND); + // time init the context.. + this.initContext(); - gl.colorMask(true, true, true, true); + this.mapBlendModes(); }; // constructor PIXI.WebGLRenderer.prototype.constructor = PIXI.WebGLRenderer; +PIXI.WebGLRenderer.prototype.initContext = function() +{ + var gl = this.view.getContext('webgl', this._contextOptions) || this.view.getContext('experimental-webgl', this._contextOptions); + this.gl = gl; + + if (!gl) { + // fail, not able to get a context + throw new Error('This browser does not support webGL. Try using the canvas renderer'); + } + + this.glContextId = gl.id = PIXI.WebGLRenderer.glContextId ++; + + PIXI.glContexts[this.glContextId] = gl; + + // set up the default pixi settings.. + gl.disable(gl.DEPTH_TEST); + gl.disable(gl.CULL_FACE); + gl.enable(gl.BLEND); + + // need to set the context... + this.shaderManager.setContext(gl); + this.spriteBatch.setContext(gl); + this.maskManager.setContext(gl); + this.filterManager.setContext(gl); + this.blendModeManager.setContext(gl); + this.stencilManager.setContext(gl); + + this.renderSession.gl = this.gl; + + // now resize and we are good to go! + this.resize(this.width, this.height); +}; + + /** * Renders the stage to its webGL view * @@ -218,6 +205,10 @@ stage.updateTransform(); + var gl = this.gl; + + // -- Does this need to be set every frame? -- // + // interaction if(stage._interactive) { @@ -225,13 +216,17 @@ if(!stage._interactiveEventsAdded) { stage._interactiveEventsAdded = true; - stage.interactionManager.setTarget( this ); + stage.interactionManager.setTarget(this); } } - - var gl = this.gl; - - // -- Does this need to be set every frame? -- // + else + { + if(stage._interactiveEventsAdded) + { + stage._interactiveEventsAdded = false; + stage.interactionManager.setTarget(this); + } + } gl.viewport(0, 0, this.width, this.height); @@ -250,46 +245,6 @@ gl.clear(gl.COLOR_BUFFER_BIT); this.renderDisplayObject( stage, this.projection ); - - // interaction - if(stage.interactive) - { - //need to add some events! - if(!stage._interactiveEventsAdded) - { - stage._interactiveEventsAdded = true; - stage.interactionManager.setTarget(this); - } - } - else - { - if(stage._interactiveEventsAdded) - { - stage._interactiveEventsAdded = false; - stage.interactionManager.setTarget(this); - } - } - - /* - //can simulate context loss in Chrome like so: - this.view.onmousedown = function(ev) { - console.dir(this.gl.getSupportedExtensions()); - var ext = ( - gl.getExtension("WEBGL_scompressed_texture_s3tc") - // gl.getExtension("WEBGL_compressed_texture_s3tc") || - // gl.getExtension("MOZ_WEBGL_compressed_texture_s3tc") || - // gl.getExtension("WEBKIT_WEBGL_compressed_texture_s3tc") - ); - console.dir(ext); - var loseCtx = this.gl.getExtension("WEBGL_lose_context"); - console.log("killing context"); - loseCtx.loseContext(); - setTimeout(function() { - console.log("restoring context..."); - loseCtx.restoreContext(); - }.bind(this), 1000); - }.bind(this); - */ }; /** @@ -401,6 +356,7 @@ this.contextLost = true; }; + /** * Handles a restored webgl context * @@ -411,59 +367,16 @@ PIXI.WebGLRenderer.prototype.handleContextRestored = function() { - //try 'experimental-webgl' - try { - this.gl = this.view.getContext('experimental-webgl', this.contextOptions); - } catch (e) { - //try 'webgl' - try { - this.gl = this.view.getContext('webgl', this.contextOptions); - } catch (e2) { - // fail, not able to get a context - throw new Error(' This browser does not support webGL. Try using the canvas renderer' + this); - } - } + this.initContext(); - PIXI.glContexts[this.glContextId] = null; - - var gl = this.gl; - this.glContextId = gl.id = PIXI.WebGLRenderer.glContextId++; - - PIXI.glContexts[this.glContextId] = gl; - - - - // need to set the context... - this.shaderManager.setContext(gl); - this.spriteBatch.setContext(gl); - // this.primitiveBatch.setContext(gl); - this.maskManager.setContext(gl); - this.filterManager.setContext(gl); - - - this.renderSession.gl = this.gl; - - gl.disable(gl.DEPTH_TEST); - gl.disable(gl.CULL_FACE); - - gl.enable(gl.BLEND); - gl.colorMask(true, true, true, true);//this.transparent); - - this.gl.viewport(0, 0, this.width, this.height); - + // empty all the ol gl textures as they are useless now for(var key in PIXI.TextureCache) { var texture = PIXI.TextureCache[key].baseTexture; texture._glTextures = []; } - - /** - * Whether the context was lost - * @property contextLost - * @type Boolean - */ + this.contextLost = false; - }; /** @@ -473,12 +386,9 @@ */ PIXI.WebGLRenderer.prototype.destroy = function() { - - // deal with losing context.. - // remove listeners - this.view.off('webglcontextlost', this.contextLostFunction); - this.view.off('webglcontextrestored', this.contextRestoredFunction); + this.view.off('webglcontextlost', this.contextLostBound); + this.view.off('webglcontextrestored', this.contextRestoredBound); PIXI.glContexts[this.glContextId] = null; @@ -500,4 +410,32 @@ this.renderSession = null; }; +PIXI.WebGLRenderer.prototype.mapBlendModes = function() +{ + var gl = this.gl; + + if(!PIXI.blendModesWebGL) + { + PIXI.blendModesWebGL = []; + + PIXI.blendModesWebGL[PIXI.blendModes.NORMAL] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; + PIXI.blendModesWebGL[PIXI.blendModes.ADD] = [gl.SRC_ALPHA, gl.DST_ALPHA]; + PIXI.blendModesWebGL[PIXI.blendModes.MULTIPLY] = [gl.DST_COLOR, gl.ONE_MINUS_SRC_ALPHA]; + PIXI.blendModesWebGL[PIXI.blendModes.SCREEN] = [gl.SRC_ALPHA, gl.ONE]; + PIXI.blendModesWebGL[PIXI.blendModes.OVERLAY] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; + PIXI.blendModesWebGL[PIXI.blendModes.DARKEN] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; + PIXI.blendModesWebGL[PIXI.blendModes.LIGHTEN] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; + PIXI.blendModesWebGL[PIXI.blendModes.COLOR_DODGE] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; + PIXI.blendModesWebGL[PIXI.blendModes.COLOR_BURN] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; + PIXI.blendModesWebGL[PIXI.blendModes.HARD_LIGHT] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; + PIXI.blendModesWebGL[PIXI.blendModes.SOFT_LIGHT] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; + PIXI.blendModesWebGL[PIXI.blendModes.DIFFERENCE] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; + PIXI.blendModesWebGL[PIXI.blendModes.EXCLUSION] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; + PIXI.blendModesWebGL[PIXI.blendModes.HUE] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; + PIXI.blendModesWebGL[PIXI.blendModes.SATURATION] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; + PIXI.blendModesWebGL[PIXI.blendModes.COLOR] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; + PIXI.blendModesWebGL[PIXI.blendModes.LUMINOSITY] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; + } +}; + PIXI.WebGLRenderer.glContextId = 0; diff --git a/src/pixi/Pixi.js b/src/pixi/Pixi.js index 4cf4f3e..1eb1010 100644 --- a/src/pixi/Pixi.js +++ b/src/pixi/Pixi.js @@ -16,7 +16,7 @@ PIXI.CANVAS_RENDERER = 1; // useful for testing against if your lib is using pixi. -PIXI.VERSION = "v1.6.1"; +PIXI.VERSION = "v2.0.0"; // the various blend modes supported by pixi diff --git a/src/pixi/renderers/webgl/WebGLRenderer.js b/src/pixi/renderers/webgl/WebGLRenderer.js index e9e4658..c75bbb4 100644 --- a/src/pixi/renderers/webgl/WebGLRenderer.js +++ b/src/pixi/renderers/webgl/WebGLRenderer.js @@ -99,13 +99,13 @@ this.view = options.view || document.createElement( 'canvas' ); // deal with losing context.. - this.contextLostFunction = this.handleContextLost.bind(this); - this.contextRestoredFunction = this.handleContextRestored.bind(this); + this.contextLostBound = this.handleContextLost.bind(this); + this.contextRestoredBound = this.handleContextRestored.bind(this); - this.view.addEventListener('webglcontextlost', this.contextLostFunction, false); - this.view.addEventListener('webglcontextrestored', this.contextRestoredFunction, false); + this.view.addEventListener('webglcontextlost', this.contextLostBound, false); + this.view.addEventListener('webglcontextrestored', this.contextRestoredBound, false); - this.contextOptions = { + this._contextOptions = { alpha: this.transparent, antialias: options.antialias, // SPEED UP?? premultipliedAlpha:this.transparent && this.transparent !== 'notMultiplied', @@ -113,62 +113,16 @@ preserveDrawingBuffer: options.preserveDrawingBuffer }; - var gl = null; - - ['experimental-webgl', 'webgl'].forEach(function(name) { - try { - gl = gl || this.view.getContext(name, this.contextOptions); - } catch(e) {} - }, this); - - if (!gl) { - // fail, not able to get a context - throw new Error('This browser does not support webGL. Try using the canvas renderer' + this); - } - - this.gl = gl; - this.glContextId = gl.id = PIXI.WebGLRenderer.glContextId ++; - - PIXI.glContexts[this.glContextId] = gl; - - if(!PIXI.blendModesWebGL) - { - PIXI.blendModesWebGL = []; - - PIXI.blendModesWebGL[PIXI.blendModes.NORMAL] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; - PIXI.blendModesWebGL[PIXI.blendModes.ADD] = [gl.SRC_ALPHA, gl.DST_ALPHA]; - PIXI.blendModesWebGL[PIXI.blendModes.MULTIPLY] = [gl.DST_COLOR, gl.ONE_MINUS_SRC_ALPHA]; - PIXI.blendModesWebGL[PIXI.blendModes.SCREEN] = [gl.SRC_ALPHA, gl.ONE]; - PIXI.blendModesWebGL[PIXI.blendModes.OVERLAY] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; - PIXI.blendModesWebGL[PIXI.blendModes.DARKEN] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; - PIXI.blendModesWebGL[PIXI.blendModes.LIGHTEN] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; - PIXI.blendModesWebGL[PIXI.blendModes.COLOR_DODGE] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; - PIXI.blendModesWebGL[PIXI.blendModes.COLOR_BURN] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; - PIXI.blendModesWebGL[PIXI.blendModes.HARD_LIGHT] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; - PIXI.blendModesWebGL[PIXI.blendModes.SOFT_LIGHT] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; - PIXI.blendModesWebGL[PIXI.blendModes.DIFFERENCE] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; - PIXI.blendModesWebGL[PIXI.blendModes.EXCLUSION] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; - PIXI.blendModesWebGL[PIXI.blendModes.HUE] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; - PIXI.blendModesWebGL[PIXI.blendModes.SATURATION] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; - PIXI.blendModesWebGL[PIXI.blendModes.COLOR] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; - PIXI.blendModesWebGL[PIXI.blendModes.LUMINOSITY] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; - } - this.projection = new PIXI.Point(); - this.offset = new PIXI.Point(0, 0); - this.resize(width, height); - - this.contextLost = false; - // time to create the render managers! each one focuses on managine a state in webGL - this.shaderManager = new PIXI.WebGLShaderManager(gl); // deals with managing the shader programs and their attribs - this.spriteBatch = new PIXI.WebGLSpriteBatch(gl); // manages the rendering of sprites - this.maskManager = new PIXI.WebGLMaskManager(gl); // manages the masks using the stencil buffer - this.filterManager = new PIXI.WebGLFilterManager(gl, this.transparent); // manages the filters - this.stencilManager = new PIXI.WebGLStencilManager(gl); - this.blendModeManager = new PIXI.WebGLBlendModeManager(gl); + this.shaderManager = new PIXI.WebGLShaderManager(); // deals with managing the shader programs and their attribs + this.spriteBatch = new PIXI.WebGLSpriteBatch(); // manages the rendering of sprites + this.maskManager = new PIXI.WebGLMaskManager(); // manages the masks using the stencil buffer + this.filterManager = new PIXI.WebGLFilterManager(); // manages the filters + this.stencilManager = new PIXI.WebGLStencilManager(); + this.blendModeManager = new PIXI.WebGLBlendModeManager(); // TODO remove this.renderSession = {}; @@ -183,16 +137,49 @@ this.renderSession.renderer = this; this.renderSession.resolution = this.resolution; - gl.disable(gl.DEPTH_TEST); - gl.disable(gl.CULL_FACE); - gl.enable(gl.BLEND); + // time init the context.. + this.initContext(); - gl.colorMask(true, true, true, true); + this.mapBlendModes(); }; // constructor PIXI.WebGLRenderer.prototype.constructor = PIXI.WebGLRenderer; +PIXI.WebGLRenderer.prototype.initContext = function() +{ + var gl = this.view.getContext('webgl', this._contextOptions) || this.view.getContext('experimental-webgl', this._contextOptions); + this.gl = gl; + + if (!gl) { + // fail, not able to get a context + throw new Error('This browser does not support webGL. Try using the canvas renderer'); + } + + this.glContextId = gl.id = PIXI.WebGLRenderer.glContextId ++; + + PIXI.glContexts[this.glContextId] = gl; + + // set up the default pixi settings.. + gl.disable(gl.DEPTH_TEST); + gl.disable(gl.CULL_FACE); + gl.enable(gl.BLEND); + + // need to set the context... + this.shaderManager.setContext(gl); + this.spriteBatch.setContext(gl); + this.maskManager.setContext(gl); + this.filterManager.setContext(gl); + this.blendModeManager.setContext(gl); + this.stencilManager.setContext(gl); + + this.renderSession.gl = this.gl; + + // now resize and we are good to go! + this.resize(this.width, this.height); +}; + + /** * Renders the stage to its webGL view * @@ -218,6 +205,10 @@ stage.updateTransform(); + var gl = this.gl; + + // -- Does this need to be set every frame? -- // + // interaction if(stage._interactive) { @@ -225,13 +216,17 @@ if(!stage._interactiveEventsAdded) { stage._interactiveEventsAdded = true; - stage.interactionManager.setTarget( this ); + stage.interactionManager.setTarget(this); } } - - var gl = this.gl; - - // -- Does this need to be set every frame? -- // + else + { + if(stage._interactiveEventsAdded) + { + stage._interactiveEventsAdded = false; + stage.interactionManager.setTarget(this); + } + } gl.viewport(0, 0, this.width, this.height); @@ -250,46 +245,6 @@ gl.clear(gl.COLOR_BUFFER_BIT); this.renderDisplayObject( stage, this.projection ); - - // interaction - if(stage.interactive) - { - //need to add some events! - if(!stage._interactiveEventsAdded) - { - stage._interactiveEventsAdded = true; - stage.interactionManager.setTarget(this); - } - } - else - { - if(stage._interactiveEventsAdded) - { - stage._interactiveEventsAdded = false; - stage.interactionManager.setTarget(this); - } - } - - /* - //can simulate context loss in Chrome like so: - this.view.onmousedown = function(ev) { - console.dir(this.gl.getSupportedExtensions()); - var ext = ( - gl.getExtension("WEBGL_scompressed_texture_s3tc") - // gl.getExtension("WEBGL_compressed_texture_s3tc") || - // gl.getExtension("MOZ_WEBGL_compressed_texture_s3tc") || - // gl.getExtension("WEBKIT_WEBGL_compressed_texture_s3tc") - ); - console.dir(ext); - var loseCtx = this.gl.getExtension("WEBGL_lose_context"); - console.log("killing context"); - loseCtx.loseContext(); - setTimeout(function() { - console.log("restoring context..."); - loseCtx.restoreContext(); - }.bind(this), 1000); - }.bind(this); - */ }; /** @@ -401,6 +356,7 @@ this.contextLost = true; }; + /** * Handles a restored webgl context * @@ -411,59 +367,16 @@ PIXI.WebGLRenderer.prototype.handleContextRestored = function() { - //try 'experimental-webgl' - try { - this.gl = this.view.getContext('experimental-webgl', this.contextOptions); - } catch (e) { - //try 'webgl' - try { - this.gl = this.view.getContext('webgl', this.contextOptions); - } catch (e2) { - // fail, not able to get a context - throw new Error(' This browser does not support webGL. Try using the canvas renderer' + this); - } - } + this.initContext(); - PIXI.glContexts[this.glContextId] = null; - - var gl = this.gl; - this.glContextId = gl.id = PIXI.WebGLRenderer.glContextId++; - - PIXI.glContexts[this.glContextId] = gl; - - - - // need to set the context... - this.shaderManager.setContext(gl); - this.spriteBatch.setContext(gl); - // this.primitiveBatch.setContext(gl); - this.maskManager.setContext(gl); - this.filterManager.setContext(gl); - - - this.renderSession.gl = this.gl; - - gl.disable(gl.DEPTH_TEST); - gl.disable(gl.CULL_FACE); - - gl.enable(gl.BLEND); - gl.colorMask(true, true, true, true);//this.transparent); - - this.gl.viewport(0, 0, this.width, this.height); - + // empty all the ol gl textures as they are useless now for(var key in PIXI.TextureCache) { var texture = PIXI.TextureCache[key].baseTexture; texture._glTextures = []; } - - /** - * Whether the context was lost - * @property contextLost - * @type Boolean - */ + this.contextLost = false; - }; /** @@ -473,12 +386,9 @@ */ PIXI.WebGLRenderer.prototype.destroy = function() { - - // deal with losing context.. - // remove listeners - this.view.off('webglcontextlost', this.contextLostFunction); - this.view.off('webglcontextrestored', this.contextRestoredFunction); + this.view.off('webglcontextlost', this.contextLostBound); + this.view.off('webglcontextrestored', this.contextRestoredBound); PIXI.glContexts[this.glContextId] = null; @@ -500,4 +410,32 @@ this.renderSession = null; }; +PIXI.WebGLRenderer.prototype.mapBlendModes = function() +{ + var gl = this.gl; + + if(!PIXI.blendModesWebGL) + { + PIXI.blendModesWebGL = []; + + PIXI.blendModesWebGL[PIXI.blendModes.NORMAL] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; + PIXI.blendModesWebGL[PIXI.blendModes.ADD] = [gl.SRC_ALPHA, gl.DST_ALPHA]; + PIXI.blendModesWebGL[PIXI.blendModes.MULTIPLY] = [gl.DST_COLOR, gl.ONE_MINUS_SRC_ALPHA]; + PIXI.blendModesWebGL[PIXI.blendModes.SCREEN] = [gl.SRC_ALPHA, gl.ONE]; + PIXI.blendModesWebGL[PIXI.blendModes.OVERLAY] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; + PIXI.blendModesWebGL[PIXI.blendModes.DARKEN] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; + PIXI.blendModesWebGL[PIXI.blendModes.LIGHTEN] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; + PIXI.blendModesWebGL[PIXI.blendModes.COLOR_DODGE] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; + PIXI.blendModesWebGL[PIXI.blendModes.COLOR_BURN] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; + PIXI.blendModesWebGL[PIXI.blendModes.HARD_LIGHT] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; + PIXI.blendModesWebGL[PIXI.blendModes.SOFT_LIGHT] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; + PIXI.blendModesWebGL[PIXI.blendModes.DIFFERENCE] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; + PIXI.blendModesWebGL[PIXI.blendModes.EXCLUSION] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; + PIXI.blendModesWebGL[PIXI.blendModes.HUE] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; + PIXI.blendModesWebGL[PIXI.blendModes.SATURATION] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; + PIXI.blendModesWebGL[PIXI.blendModes.COLOR] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; + PIXI.blendModesWebGL[PIXI.blendModes.LUMINOSITY] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; + } +}; + PIXI.WebGLRenderer.glContextId = 0; diff --git a/src/pixi/renderers/webgl/utils/WebGLBlendModeManager.js b/src/pixi/renderers/webgl/utils/WebGLBlendModeManager.js index 653019f..c73728f 100644 --- a/src/pixi/renderers/webgl/utils/WebGLBlendModeManager.js +++ b/src/pixi/renderers/webgl/utils/WebGLBlendModeManager.js @@ -8,10 +8,14 @@ * @param gl {WebGLContext} the current WebGL drawing context * @private */ -PIXI.WebGLBlendModeManager = function(gl) +PIXI.WebGLBlendModeManager = function() +{ + this.currentBlendMode = 99999; +}; + +PIXI.WebGLBlendModeManager.prototype.setContext = function(gl) { this.gl = gl; - this.currentBlendMode = 99999; }; /** diff --git a/src/pixi/Pixi.js b/src/pixi/Pixi.js index 4cf4f3e..1eb1010 100644 --- a/src/pixi/Pixi.js +++ b/src/pixi/Pixi.js @@ -16,7 +16,7 @@ PIXI.CANVAS_RENDERER = 1; // useful for testing against if your lib is using pixi. -PIXI.VERSION = "v1.6.1"; +PIXI.VERSION = "v2.0.0"; // the various blend modes supported by pixi diff --git a/src/pixi/renderers/webgl/WebGLRenderer.js b/src/pixi/renderers/webgl/WebGLRenderer.js index e9e4658..c75bbb4 100644 --- a/src/pixi/renderers/webgl/WebGLRenderer.js +++ b/src/pixi/renderers/webgl/WebGLRenderer.js @@ -99,13 +99,13 @@ this.view = options.view || document.createElement( 'canvas' ); // deal with losing context.. - this.contextLostFunction = this.handleContextLost.bind(this); - this.contextRestoredFunction = this.handleContextRestored.bind(this); + this.contextLostBound = this.handleContextLost.bind(this); + this.contextRestoredBound = this.handleContextRestored.bind(this); - this.view.addEventListener('webglcontextlost', this.contextLostFunction, false); - this.view.addEventListener('webglcontextrestored', this.contextRestoredFunction, false); + this.view.addEventListener('webglcontextlost', this.contextLostBound, false); + this.view.addEventListener('webglcontextrestored', this.contextRestoredBound, false); - this.contextOptions = { + this._contextOptions = { alpha: this.transparent, antialias: options.antialias, // SPEED UP?? premultipliedAlpha:this.transparent && this.transparent !== 'notMultiplied', @@ -113,62 +113,16 @@ preserveDrawingBuffer: options.preserveDrawingBuffer }; - var gl = null; - - ['experimental-webgl', 'webgl'].forEach(function(name) { - try { - gl = gl || this.view.getContext(name, this.contextOptions); - } catch(e) {} - }, this); - - if (!gl) { - // fail, not able to get a context - throw new Error('This browser does not support webGL. Try using the canvas renderer' + this); - } - - this.gl = gl; - this.glContextId = gl.id = PIXI.WebGLRenderer.glContextId ++; - - PIXI.glContexts[this.glContextId] = gl; - - if(!PIXI.blendModesWebGL) - { - PIXI.blendModesWebGL = []; - - PIXI.blendModesWebGL[PIXI.blendModes.NORMAL] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; - PIXI.blendModesWebGL[PIXI.blendModes.ADD] = [gl.SRC_ALPHA, gl.DST_ALPHA]; - PIXI.blendModesWebGL[PIXI.blendModes.MULTIPLY] = [gl.DST_COLOR, gl.ONE_MINUS_SRC_ALPHA]; - PIXI.blendModesWebGL[PIXI.blendModes.SCREEN] = [gl.SRC_ALPHA, gl.ONE]; - PIXI.blendModesWebGL[PIXI.blendModes.OVERLAY] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; - PIXI.blendModesWebGL[PIXI.blendModes.DARKEN] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; - PIXI.blendModesWebGL[PIXI.blendModes.LIGHTEN] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; - PIXI.blendModesWebGL[PIXI.blendModes.COLOR_DODGE] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; - PIXI.blendModesWebGL[PIXI.blendModes.COLOR_BURN] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; - PIXI.blendModesWebGL[PIXI.blendModes.HARD_LIGHT] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; - PIXI.blendModesWebGL[PIXI.blendModes.SOFT_LIGHT] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; - PIXI.blendModesWebGL[PIXI.blendModes.DIFFERENCE] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; - PIXI.blendModesWebGL[PIXI.blendModes.EXCLUSION] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; - PIXI.blendModesWebGL[PIXI.blendModes.HUE] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; - PIXI.blendModesWebGL[PIXI.blendModes.SATURATION] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; - PIXI.blendModesWebGL[PIXI.blendModes.COLOR] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; - PIXI.blendModesWebGL[PIXI.blendModes.LUMINOSITY] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; - } - this.projection = new PIXI.Point(); - this.offset = new PIXI.Point(0, 0); - this.resize(width, height); - - this.contextLost = false; - // time to create the render managers! each one focuses on managine a state in webGL - this.shaderManager = new PIXI.WebGLShaderManager(gl); // deals with managing the shader programs and their attribs - this.spriteBatch = new PIXI.WebGLSpriteBatch(gl); // manages the rendering of sprites - this.maskManager = new PIXI.WebGLMaskManager(gl); // manages the masks using the stencil buffer - this.filterManager = new PIXI.WebGLFilterManager(gl, this.transparent); // manages the filters - this.stencilManager = new PIXI.WebGLStencilManager(gl); - this.blendModeManager = new PIXI.WebGLBlendModeManager(gl); + this.shaderManager = new PIXI.WebGLShaderManager(); // deals with managing the shader programs and their attribs + this.spriteBatch = new PIXI.WebGLSpriteBatch(); // manages the rendering of sprites + this.maskManager = new PIXI.WebGLMaskManager(); // manages the masks using the stencil buffer + this.filterManager = new PIXI.WebGLFilterManager(); // manages the filters + this.stencilManager = new PIXI.WebGLStencilManager(); + this.blendModeManager = new PIXI.WebGLBlendModeManager(); // TODO remove this.renderSession = {}; @@ -183,16 +137,49 @@ this.renderSession.renderer = this; this.renderSession.resolution = this.resolution; - gl.disable(gl.DEPTH_TEST); - gl.disable(gl.CULL_FACE); - gl.enable(gl.BLEND); + // time init the context.. + this.initContext(); - gl.colorMask(true, true, true, true); + this.mapBlendModes(); }; // constructor PIXI.WebGLRenderer.prototype.constructor = PIXI.WebGLRenderer; +PIXI.WebGLRenderer.prototype.initContext = function() +{ + var gl = this.view.getContext('webgl', this._contextOptions) || this.view.getContext('experimental-webgl', this._contextOptions); + this.gl = gl; + + if (!gl) { + // fail, not able to get a context + throw new Error('This browser does not support webGL. Try using the canvas renderer'); + } + + this.glContextId = gl.id = PIXI.WebGLRenderer.glContextId ++; + + PIXI.glContexts[this.glContextId] = gl; + + // set up the default pixi settings.. + gl.disable(gl.DEPTH_TEST); + gl.disable(gl.CULL_FACE); + gl.enable(gl.BLEND); + + // need to set the context... + this.shaderManager.setContext(gl); + this.spriteBatch.setContext(gl); + this.maskManager.setContext(gl); + this.filterManager.setContext(gl); + this.blendModeManager.setContext(gl); + this.stencilManager.setContext(gl); + + this.renderSession.gl = this.gl; + + // now resize and we are good to go! + this.resize(this.width, this.height); +}; + + /** * Renders the stage to its webGL view * @@ -218,6 +205,10 @@ stage.updateTransform(); + var gl = this.gl; + + // -- Does this need to be set every frame? -- // + // interaction if(stage._interactive) { @@ -225,13 +216,17 @@ if(!stage._interactiveEventsAdded) { stage._interactiveEventsAdded = true; - stage.interactionManager.setTarget( this ); + stage.interactionManager.setTarget(this); } } - - var gl = this.gl; - - // -- Does this need to be set every frame? -- // + else + { + if(stage._interactiveEventsAdded) + { + stage._interactiveEventsAdded = false; + stage.interactionManager.setTarget(this); + } + } gl.viewport(0, 0, this.width, this.height); @@ -250,46 +245,6 @@ gl.clear(gl.COLOR_BUFFER_BIT); this.renderDisplayObject( stage, this.projection ); - - // interaction - if(stage.interactive) - { - //need to add some events! - if(!stage._interactiveEventsAdded) - { - stage._interactiveEventsAdded = true; - stage.interactionManager.setTarget(this); - } - } - else - { - if(stage._interactiveEventsAdded) - { - stage._interactiveEventsAdded = false; - stage.interactionManager.setTarget(this); - } - } - - /* - //can simulate context loss in Chrome like so: - this.view.onmousedown = function(ev) { - console.dir(this.gl.getSupportedExtensions()); - var ext = ( - gl.getExtension("WEBGL_scompressed_texture_s3tc") - // gl.getExtension("WEBGL_compressed_texture_s3tc") || - // gl.getExtension("MOZ_WEBGL_compressed_texture_s3tc") || - // gl.getExtension("WEBKIT_WEBGL_compressed_texture_s3tc") - ); - console.dir(ext); - var loseCtx = this.gl.getExtension("WEBGL_lose_context"); - console.log("killing context"); - loseCtx.loseContext(); - setTimeout(function() { - console.log("restoring context..."); - loseCtx.restoreContext(); - }.bind(this), 1000); - }.bind(this); - */ }; /** @@ -401,6 +356,7 @@ this.contextLost = true; }; + /** * Handles a restored webgl context * @@ -411,59 +367,16 @@ PIXI.WebGLRenderer.prototype.handleContextRestored = function() { - //try 'experimental-webgl' - try { - this.gl = this.view.getContext('experimental-webgl', this.contextOptions); - } catch (e) { - //try 'webgl' - try { - this.gl = this.view.getContext('webgl', this.contextOptions); - } catch (e2) { - // fail, not able to get a context - throw new Error(' This browser does not support webGL. Try using the canvas renderer' + this); - } - } + this.initContext(); - PIXI.glContexts[this.glContextId] = null; - - var gl = this.gl; - this.glContextId = gl.id = PIXI.WebGLRenderer.glContextId++; - - PIXI.glContexts[this.glContextId] = gl; - - - - // need to set the context... - this.shaderManager.setContext(gl); - this.spriteBatch.setContext(gl); - // this.primitiveBatch.setContext(gl); - this.maskManager.setContext(gl); - this.filterManager.setContext(gl); - - - this.renderSession.gl = this.gl; - - gl.disable(gl.DEPTH_TEST); - gl.disable(gl.CULL_FACE); - - gl.enable(gl.BLEND); - gl.colorMask(true, true, true, true);//this.transparent); - - this.gl.viewport(0, 0, this.width, this.height); - + // empty all the ol gl textures as they are useless now for(var key in PIXI.TextureCache) { var texture = PIXI.TextureCache[key].baseTexture; texture._glTextures = []; } - - /** - * Whether the context was lost - * @property contextLost - * @type Boolean - */ + this.contextLost = false; - }; /** @@ -473,12 +386,9 @@ */ PIXI.WebGLRenderer.prototype.destroy = function() { - - // deal with losing context.. - // remove listeners - this.view.off('webglcontextlost', this.contextLostFunction); - this.view.off('webglcontextrestored', this.contextRestoredFunction); + this.view.off('webglcontextlost', this.contextLostBound); + this.view.off('webglcontextrestored', this.contextRestoredBound); PIXI.glContexts[this.glContextId] = null; @@ -500,4 +410,32 @@ this.renderSession = null; }; +PIXI.WebGLRenderer.prototype.mapBlendModes = function() +{ + var gl = this.gl; + + if(!PIXI.blendModesWebGL) + { + PIXI.blendModesWebGL = []; + + PIXI.blendModesWebGL[PIXI.blendModes.NORMAL] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; + PIXI.blendModesWebGL[PIXI.blendModes.ADD] = [gl.SRC_ALPHA, gl.DST_ALPHA]; + PIXI.blendModesWebGL[PIXI.blendModes.MULTIPLY] = [gl.DST_COLOR, gl.ONE_MINUS_SRC_ALPHA]; + PIXI.blendModesWebGL[PIXI.blendModes.SCREEN] = [gl.SRC_ALPHA, gl.ONE]; + PIXI.blendModesWebGL[PIXI.blendModes.OVERLAY] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; + PIXI.blendModesWebGL[PIXI.blendModes.DARKEN] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; + PIXI.blendModesWebGL[PIXI.blendModes.LIGHTEN] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; + PIXI.blendModesWebGL[PIXI.blendModes.COLOR_DODGE] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; + PIXI.blendModesWebGL[PIXI.blendModes.COLOR_BURN] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; + PIXI.blendModesWebGL[PIXI.blendModes.HARD_LIGHT] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; + PIXI.blendModesWebGL[PIXI.blendModes.SOFT_LIGHT] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; + PIXI.blendModesWebGL[PIXI.blendModes.DIFFERENCE] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; + PIXI.blendModesWebGL[PIXI.blendModes.EXCLUSION] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; + PIXI.blendModesWebGL[PIXI.blendModes.HUE] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; + PIXI.blendModesWebGL[PIXI.blendModes.SATURATION] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; + PIXI.blendModesWebGL[PIXI.blendModes.COLOR] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; + PIXI.blendModesWebGL[PIXI.blendModes.LUMINOSITY] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; + } +}; + PIXI.WebGLRenderer.glContextId = 0; diff --git a/src/pixi/renderers/webgl/utils/WebGLBlendModeManager.js b/src/pixi/renderers/webgl/utils/WebGLBlendModeManager.js index 653019f..c73728f 100644 --- a/src/pixi/renderers/webgl/utils/WebGLBlendModeManager.js +++ b/src/pixi/renderers/webgl/utils/WebGLBlendModeManager.js @@ -8,10 +8,14 @@ * @param gl {WebGLContext} the current WebGL drawing context * @private */ -PIXI.WebGLBlendModeManager = function(gl) +PIXI.WebGLBlendModeManager = function() +{ + this.currentBlendMode = 99999; +}; + +PIXI.WebGLBlendModeManager.prototype.setContext = function(gl) { this.gl = gl; - this.currentBlendMode = 99999; }; /** diff --git a/src/pixi/renderers/webgl/utils/WebGLFastSpriteBatch.js b/src/pixi/renderers/webgl/utils/WebGLFastSpriteBatch.js index e296251..0d08e47 100644 --- a/src/pixi/renderers/webgl/utils/WebGLFastSpriteBatch.js +++ b/src/pixi/renderers/webgl/utils/WebGLFastSpriteBatch.js @@ -8,7 +8,7 @@ * https://github.com/libgdx/libgdx/blob/master/gdx/src/com/badlogic/gdx/graphics/g2d/WebGLSpriteBatch.java */ -PIXI.WebGLFastSpriteBatch = function(gl) +PIXI.WebGLFastSpriteBatch = function() { @@ -53,7 +53,7 @@ this.matrix = null; - this.setContext(gl); + //this.setContext(gl); }; PIXI.WebGLFastSpriteBatch.prototype.setContext = function(gl) diff --git a/src/pixi/Pixi.js b/src/pixi/Pixi.js index 4cf4f3e..1eb1010 100644 --- a/src/pixi/Pixi.js +++ b/src/pixi/Pixi.js @@ -16,7 +16,7 @@ PIXI.CANVAS_RENDERER = 1; // useful for testing against if your lib is using pixi. -PIXI.VERSION = "v1.6.1"; +PIXI.VERSION = "v2.0.0"; // the various blend modes supported by pixi diff --git a/src/pixi/renderers/webgl/WebGLRenderer.js b/src/pixi/renderers/webgl/WebGLRenderer.js index e9e4658..c75bbb4 100644 --- a/src/pixi/renderers/webgl/WebGLRenderer.js +++ b/src/pixi/renderers/webgl/WebGLRenderer.js @@ -99,13 +99,13 @@ this.view = options.view || document.createElement( 'canvas' ); // deal with losing context.. - this.contextLostFunction = this.handleContextLost.bind(this); - this.contextRestoredFunction = this.handleContextRestored.bind(this); + this.contextLostBound = this.handleContextLost.bind(this); + this.contextRestoredBound = this.handleContextRestored.bind(this); - this.view.addEventListener('webglcontextlost', this.contextLostFunction, false); - this.view.addEventListener('webglcontextrestored', this.contextRestoredFunction, false); + this.view.addEventListener('webglcontextlost', this.contextLostBound, false); + this.view.addEventListener('webglcontextrestored', this.contextRestoredBound, false); - this.contextOptions = { + this._contextOptions = { alpha: this.transparent, antialias: options.antialias, // SPEED UP?? premultipliedAlpha:this.transparent && this.transparent !== 'notMultiplied', @@ -113,62 +113,16 @@ preserveDrawingBuffer: options.preserveDrawingBuffer }; - var gl = null; - - ['experimental-webgl', 'webgl'].forEach(function(name) { - try { - gl = gl || this.view.getContext(name, this.contextOptions); - } catch(e) {} - }, this); - - if (!gl) { - // fail, not able to get a context - throw new Error('This browser does not support webGL. Try using the canvas renderer' + this); - } - - this.gl = gl; - this.glContextId = gl.id = PIXI.WebGLRenderer.glContextId ++; - - PIXI.glContexts[this.glContextId] = gl; - - if(!PIXI.blendModesWebGL) - { - PIXI.blendModesWebGL = []; - - PIXI.blendModesWebGL[PIXI.blendModes.NORMAL] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; - PIXI.blendModesWebGL[PIXI.blendModes.ADD] = [gl.SRC_ALPHA, gl.DST_ALPHA]; - PIXI.blendModesWebGL[PIXI.blendModes.MULTIPLY] = [gl.DST_COLOR, gl.ONE_MINUS_SRC_ALPHA]; - PIXI.blendModesWebGL[PIXI.blendModes.SCREEN] = [gl.SRC_ALPHA, gl.ONE]; - PIXI.blendModesWebGL[PIXI.blendModes.OVERLAY] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; - PIXI.blendModesWebGL[PIXI.blendModes.DARKEN] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; - PIXI.blendModesWebGL[PIXI.blendModes.LIGHTEN] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; - PIXI.blendModesWebGL[PIXI.blendModes.COLOR_DODGE] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; - PIXI.blendModesWebGL[PIXI.blendModes.COLOR_BURN] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; - PIXI.blendModesWebGL[PIXI.blendModes.HARD_LIGHT] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; - PIXI.blendModesWebGL[PIXI.blendModes.SOFT_LIGHT] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; - PIXI.blendModesWebGL[PIXI.blendModes.DIFFERENCE] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; - PIXI.blendModesWebGL[PIXI.blendModes.EXCLUSION] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; - PIXI.blendModesWebGL[PIXI.blendModes.HUE] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; - PIXI.blendModesWebGL[PIXI.blendModes.SATURATION] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; - PIXI.blendModesWebGL[PIXI.blendModes.COLOR] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; - PIXI.blendModesWebGL[PIXI.blendModes.LUMINOSITY] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; - } - this.projection = new PIXI.Point(); - this.offset = new PIXI.Point(0, 0); - this.resize(width, height); - - this.contextLost = false; - // time to create the render managers! each one focuses on managine a state in webGL - this.shaderManager = new PIXI.WebGLShaderManager(gl); // deals with managing the shader programs and their attribs - this.spriteBatch = new PIXI.WebGLSpriteBatch(gl); // manages the rendering of sprites - this.maskManager = new PIXI.WebGLMaskManager(gl); // manages the masks using the stencil buffer - this.filterManager = new PIXI.WebGLFilterManager(gl, this.transparent); // manages the filters - this.stencilManager = new PIXI.WebGLStencilManager(gl); - this.blendModeManager = new PIXI.WebGLBlendModeManager(gl); + this.shaderManager = new PIXI.WebGLShaderManager(); // deals with managing the shader programs and their attribs + this.spriteBatch = new PIXI.WebGLSpriteBatch(); // manages the rendering of sprites + this.maskManager = new PIXI.WebGLMaskManager(); // manages the masks using the stencil buffer + this.filterManager = new PIXI.WebGLFilterManager(); // manages the filters + this.stencilManager = new PIXI.WebGLStencilManager(); + this.blendModeManager = new PIXI.WebGLBlendModeManager(); // TODO remove this.renderSession = {}; @@ -183,16 +137,49 @@ this.renderSession.renderer = this; this.renderSession.resolution = this.resolution; - gl.disable(gl.DEPTH_TEST); - gl.disable(gl.CULL_FACE); - gl.enable(gl.BLEND); + // time init the context.. + this.initContext(); - gl.colorMask(true, true, true, true); + this.mapBlendModes(); }; // constructor PIXI.WebGLRenderer.prototype.constructor = PIXI.WebGLRenderer; +PIXI.WebGLRenderer.prototype.initContext = function() +{ + var gl = this.view.getContext('webgl', this._contextOptions) || this.view.getContext('experimental-webgl', this._contextOptions); + this.gl = gl; + + if (!gl) { + // fail, not able to get a context + throw new Error('This browser does not support webGL. Try using the canvas renderer'); + } + + this.glContextId = gl.id = PIXI.WebGLRenderer.glContextId ++; + + PIXI.glContexts[this.glContextId] = gl; + + // set up the default pixi settings.. + gl.disable(gl.DEPTH_TEST); + gl.disable(gl.CULL_FACE); + gl.enable(gl.BLEND); + + // need to set the context... + this.shaderManager.setContext(gl); + this.spriteBatch.setContext(gl); + this.maskManager.setContext(gl); + this.filterManager.setContext(gl); + this.blendModeManager.setContext(gl); + this.stencilManager.setContext(gl); + + this.renderSession.gl = this.gl; + + // now resize and we are good to go! + this.resize(this.width, this.height); +}; + + /** * Renders the stage to its webGL view * @@ -218,6 +205,10 @@ stage.updateTransform(); + var gl = this.gl; + + // -- Does this need to be set every frame? -- // + // interaction if(stage._interactive) { @@ -225,13 +216,17 @@ if(!stage._interactiveEventsAdded) { stage._interactiveEventsAdded = true; - stage.interactionManager.setTarget( this ); + stage.interactionManager.setTarget(this); } } - - var gl = this.gl; - - // -- Does this need to be set every frame? -- // + else + { + if(stage._interactiveEventsAdded) + { + stage._interactiveEventsAdded = false; + stage.interactionManager.setTarget(this); + } + } gl.viewport(0, 0, this.width, this.height); @@ -250,46 +245,6 @@ gl.clear(gl.COLOR_BUFFER_BIT); this.renderDisplayObject( stage, this.projection ); - - // interaction - if(stage.interactive) - { - //need to add some events! - if(!stage._interactiveEventsAdded) - { - stage._interactiveEventsAdded = true; - stage.interactionManager.setTarget(this); - } - } - else - { - if(stage._interactiveEventsAdded) - { - stage._interactiveEventsAdded = false; - stage.interactionManager.setTarget(this); - } - } - - /* - //can simulate context loss in Chrome like so: - this.view.onmousedown = function(ev) { - console.dir(this.gl.getSupportedExtensions()); - var ext = ( - gl.getExtension("WEBGL_scompressed_texture_s3tc") - // gl.getExtension("WEBGL_compressed_texture_s3tc") || - // gl.getExtension("MOZ_WEBGL_compressed_texture_s3tc") || - // gl.getExtension("WEBKIT_WEBGL_compressed_texture_s3tc") - ); - console.dir(ext); - var loseCtx = this.gl.getExtension("WEBGL_lose_context"); - console.log("killing context"); - loseCtx.loseContext(); - setTimeout(function() { - console.log("restoring context..."); - loseCtx.restoreContext(); - }.bind(this), 1000); - }.bind(this); - */ }; /** @@ -401,6 +356,7 @@ this.contextLost = true; }; + /** * Handles a restored webgl context * @@ -411,59 +367,16 @@ PIXI.WebGLRenderer.prototype.handleContextRestored = function() { - //try 'experimental-webgl' - try { - this.gl = this.view.getContext('experimental-webgl', this.contextOptions); - } catch (e) { - //try 'webgl' - try { - this.gl = this.view.getContext('webgl', this.contextOptions); - } catch (e2) { - // fail, not able to get a context - throw new Error(' This browser does not support webGL. Try using the canvas renderer' + this); - } - } + this.initContext(); - PIXI.glContexts[this.glContextId] = null; - - var gl = this.gl; - this.glContextId = gl.id = PIXI.WebGLRenderer.glContextId++; - - PIXI.glContexts[this.glContextId] = gl; - - - - // need to set the context... - this.shaderManager.setContext(gl); - this.spriteBatch.setContext(gl); - // this.primitiveBatch.setContext(gl); - this.maskManager.setContext(gl); - this.filterManager.setContext(gl); - - - this.renderSession.gl = this.gl; - - gl.disable(gl.DEPTH_TEST); - gl.disable(gl.CULL_FACE); - - gl.enable(gl.BLEND); - gl.colorMask(true, true, true, true);//this.transparent); - - this.gl.viewport(0, 0, this.width, this.height); - + // empty all the ol gl textures as they are useless now for(var key in PIXI.TextureCache) { var texture = PIXI.TextureCache[key].baseTexture; texture._glTextures = []; } - - /** - * Whether the context was lost - * @property contextLost - * @type Boolean - */ + this.contextLost = false; - }; /** @@ -473,12 +386,9 @@ */ PIXI.WebGLRenderer.prototype.destroy = function() { - - // deal with losing context.. - // remove listeners - this.view.off('webglcontextlost', this.contextLostFunction); - this.view.off('webglcontextrestored', this.contextRestoredFunction); + this.view.off('webglcontextlost', this.contextLostBound); + this.view.off('webglcontextrestored', this.contextRestoredBound); PIXI.glContexts[this.glContextId] = null; @@ -500,4 +410,32 @@ this.renderSession = null; }; +PIXI.WebGLRenderer.prototype.mapBlendModes = function() +{ + var gl = this.gl; + + if(!PIXI.blendModesWebGL) + { + PIXI.blendModesWebGL = []; + + PIXI.blendModesWebGL[PIXI.blendModes.NORMAL] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; + PIXI.blendModesWebGL[PIXI.blendModes.ADD] = [gl.SRC_ALPHA, gl.DST_ALPHA]; + PIXI.blendModesWebGL[PIXI.blendModes.MULTIPLY] = [gl.DST_COLOR, gl.ONE_MINUS_SRC_ALPHA]; + PIXI.blendModesWebGL[PIXI.blendModes.SCREEN] = [gl.SRC_ALPHA, gl.ONE]; + PIXI.blendModesWebGL[PIXI.blendModes.OVERLAY] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; + PIXI.blendModesWebGL[PIXI.blendModes.DARKEN] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; + PIXI.blendModesWebGL[PIXI.blendModes.LIGHTEN] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; + PIXI.blendModesWebGL[PIXI.blendModes.COLOR_DODGE] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; + PIXI.blendModesWebGL[PIXI.blendModes.COLOR_BURN] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; + PIXI.blendModesWebGL[PIXI.blendModes.HARD_LIGHT] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; + PIXI.blendModesWebGL[PIXI.blendModes.SOFT_LIGHT] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; + PIXI.blendModesWebGL[PIXI.blendModes.DIFFERENCE] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; + PIXI.blendModesWebGL[PIXI.blendModes.EXCLUSION] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; + PIXI.blendModesWebGL[PIXI.blendModes.HUE] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; + PIXI.blendModesWebGL[PIXI.blendModes.SATURATION] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; + PIXI.blendModesWebGL[PIXI.blendModes.COLOR] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; + PIXI.blendModesWebGL[PIXI.blendModes.LUMINOSITY] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; + } +}; + PIXI.WebGLRenderer.glContextId = 0; diff --git a/src/pixi/renderers/webgl/utils/WebGLBlendModeManager.js b/src/pixi/renderers/webgl/utils/WebGLBlendModeManager.js index 653019f..c73728f 100644 --- a/src/pixi/renderers/webgl/utils/WebGLBlendModeManager.js +++ b/src/pixi/renderers/webgl/utils/WebGLBlendModeManager.js @@ -8,10 +8,14 @@ * @param gl {WebGLContext} the current WebGL drawing context * @private */ -PIXI.WebGLBlendModeManager = function(gl) +PIXI.WebGLBlendModeManager = function() +{ + this.currentBlendMode = 99999; +}; + +PIXI.WebGLBlendModeManager.prototype.setContext = function(gl) { this.gl = gl; - this.currentBlendMode = 99999; }; /** diff --git a/src/pixi/renderers/webgl/utils/WebGLFastSpriteBatch.js b/src/pixi/renderers/webgl/utils/WebGLFastSpriteBatch.js index e296251..0d08e47 100644 --- a/src/pixi/renderers/webgl/utils/WebGLFastSpriteBatch.js +++ b/src/pixi/renderers/webgl/utils/WebGLFastSpriteBatch.js @@ -8,7 +8,7 @@ * https://github.com/libgdx/libgdx/blob/master/gdx/src/com/badlogic/gdx/graphics/g2d/WebGLSpriteBatch.java */ -PIXI.WebGLFastSpriteBatch = function(gl) +PIXI.WebGLFastSpriteBatch = function() { @@ -53,7 +53,7 @@ this.matrix = null; - this.setContext(gl); + //this.setContext(gl); }; PIXI.WebGLFastSpriteBatch.prototype.setContext = function(gl) diff --git a/src/pixi/renderers/webgl/utils/WebGLFilterManager.js b/src/pixi/renderers/webgl/utils/WebGLFilterManager.js index 7383072..278e7f4 100644 --- a/src/pixi/renderers/webgl/utils/WebGLFilterManager.js +++ b/src/pixi/renderers/webgl/utils/WebGLFilterManager.js @@ -6,19 +6,16 @@ * @class WebGLFilterManager * @constructor * @param gl {WebGLContext} the current WebGL drawing context -* @param transparent {Boolean} Whether or not the drawing context should be transparent * @private */ -PIXI.WebGLFilterManager = function(gl, transparent) +PIXI.WebGLFilterManager = function() { - this.transparent = transparent; - this.filterStack = []; this.offsetX = 0; this.offsetY = 0; - this.setContext(gl); + // this.setContext(gl); }; // API diff --git a/src/pixi/Pixi.js b/src/pixi/Pixi.js index 4cf4f3e..1eb1010 100644 --- a/src/pixi/Pixi.js +++ b/src/pixi/Pixi.js @@ -16,7 +16,7 @@ PIXI.CANVAS_RENDERER = 1; // useful for testing against if your lib is using pixi. -PIXI.VERSION = "v1.6.1"; +PIXI.VERSION = "v2.0.0"; // the various blend modes supported by pixi diff --git a/src/pixi/renderers/webgl/WebGLRenderer.js b/src/pixi/renderers/webgl/WebGLRenderer.js index e9e4658..c75bbb4 100644 --- a/src/pixi/renderers/webgl/WebGLRenderer.js +++ b/src/pixi/renderers/webgl/WebGLRenderer.js @@ -99,13 +99,13 @@ this.view = options.view || document.createElement( 'canvas' ); // deal with losing context.. - this.contextLostFunction = this.handleContextLost.bind(this); - this.contextRestoredFunction = this.handleContextRestored.bind(this); + this.contextLostBound = this.handleContextLost.bind(this); + this.contextRestoredBound = this.handleContextRestored.bind(this); - this.view.addEventListener('webglcontextlost', this.contextLostFunction, false); - this.view.addEventListener('webglcontextrestored', this.contextRestoredFunction, false); + this.view.addEventListener('webglcontextlost', this.contextLostBound, false); + this.view.addEventListener('webglcontextrestored', this.contextRestoredBound, false); - this.contextOptions = { + this._contextOptions = { alpha: this.transparent, antialias: options.antialias, // SPEED UP?? premultipliedAlpha:this.transparent && this.transparent !== 'notMultiplied', @@ -113,62 +113,16 @@ preserveDrawingBuffer: options.preserveDrawingBuffer }; - var gl = null; - - ['experimental-webgl', 'webgl'].forEach(function(name) { - try { - gl = gl || this.view.getContext(name, this.contextOptions); - } catch(e) {} - }, this); - - if (!gl) { - // fail, not able to get a context - throw new Error('This browser does not support webGL. Try using the canvas renderer' + this); - } - - this.gl = gl; - this.glContextId = gl.id = PIXI.WebGLRenderer.glContextId ++; - - PIXI.glContexts[this.glContextId] = gl; - - if(!PIXI.blendModesWebGL) - { - PIXI.blendModesWebGL = []; - - PIXI.blendModesWebGL[PIXI.blendModes.NORMAL] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; - PIXI.blendModesWebGL[PIXI.blendModes.ADD] = [gl.SRC_ALPHA, gl.DST_ALPHA]; - PIXI.blendModesWebGL[PIXI.blendModes.MULTIPLY] = [gl.DST_COLOR, gl.ONE_MINUS_SRC_ALPHA]; - PIXI.blendModesWebGL[PIXI.blendModes.SCREEN] = [gl.SRC_ALPHA, gl.ONE]; - PIXI.blendModesWebGL[PIXI.blendModes.OVERLAY] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; - PIXI.blendModesWebGL[PIXI.blendModes.DARKEN] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; - PIXI.blendModesWebGL[PIXI.blendModes.LIGHTEN] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; - PIXI.blendModesWebGL[PIXI.blendModes.COLOR_DODGE] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; - PIXI.blendModesWebGL[PIXI.blendModes.COLOR_BURN] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; - PIXI.blendModesWebGL[PIXI.blendModes.HARD_LIGHT] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; - PIXI.blendModesWebGL[PIXI.blendModes.SOFT_LIGHT] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; - PIXI.blendModesWebGL[PIXI.blendModes.DIFFERENCE] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; - PIXI.blendModesWebGL[PIXI.blendModes.EXCLUSION] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; - PIXI.blendModesWebGL[PIXI.blendModes.HUE] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; - PIXI.blendModesWebGL[PIXI.blendModes.SATURATION] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; - PIXI.blendModesWebGL[PIXI.blendModes.COLOR] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; - PIXI.blendModesWebGL[PIXI.blendModes.LUMINOSITY] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; - } - this.projection = new PIXI.Point(); - this.offset = new PIXI.Point(0, 0); - this.resize(width, height); - - this.contextLost = false; - // time to create the render managers! each one focuses on managine a state in webGL - this.shaderManager = new PIXI.WebGLShaderManager(gl); // deals with managing the shader programs and their attribs - this.spriteBatch = new PIXI.WebGLSpriteBatch(gl); // manages the rendering of sprites - this.maskManager = new PIXI.WebGLMaskManager(gl); // manages the masks using the stencil buffer - this.filterManager = new PIXI.WebGLFilterManager(gl, this.transparent); // manages the filters - this.stencilManager = new PIXI.WebGLStencilManager(gl); - this.blendModeManager = new PIXI.WebGLBlendModeManager(gl); + this.shaderManager = new PIXI.WebGLShaderManager(); // deals with managing the shader programs and their attribs + this.spriteBatch = new PIXI.WebGLSpriteBatch(); // manages the rendering of sprites + this.maskManager = new PIXI.WebGLMaskManager(); // manages the masks using the stencil buffer + this.filterManager = new PIXI.WebGLFilterManager(); // manages the filters + this.stencilManager = new PIXI.WebGLStencilManager(); + this.blendModeManager = new PIXI.WebGLBlendModeManager(); // TODO remove this.renderSession = {}; @@ -183,16 +137,49 @@ this.renderSession.renderer = this; this.renderSession.resolution = this.resolution; - gl.disable(gl.DEPTH_TEST); - gl.disable(gl.CULL_FACE); - gl.enable(gl.BLEND); + // time init the context.. + this.initContext(); - gl.colorMask(true, true, true, true); + this.mapBlendModes(); }; // constructor PIXI.WebGLRenderer.prototype.constructor = PIXI.WebGLRenderer; +PIXI.WebGLRenderer.prototype.initContext = function() +{ + var gl = this.view.getContext('webgl', this._contextOptions) || this.view.getContext('experimental-webgl', this._contextOptions); + this.gl = gl; + + if (!gl) { + // fail, not able to get a context + throw new Error('This browser does not support webGL. Try using the canvas renderer'); + } + + this.glContextId = gl.id = PIXI.WebGLRenderer.glContextId ++; + + PIXI.glContexts[this.glContextId] = gl; + + // set up the default pixi settings.. + gl.disable(gl.DEPTH_TEST); + gl.disable(gl.CULL_FACE); + gl.enable(gl.BLEND); + + // need to set the context... + this.shaderManager.setContext(gl); + this.spriteBatch.setContext(gl); + this.maskManager.setContext(gl); + this.filterManager.setContext(gl); + this.blendModeManager.setContext(gl); + this.stencilManager.setContext(gl); + + this.renderSession.gl = this.gl; + + // now resize and we are good to go! + this.resize(this.width, this.height); +}; + + /** * Renders the stage to its webGL view * @@ -218,6 +205,10 @@ stage.updateTransform(); + var gl = this.gl; + + // -- Does this need to be set every frame? -- // + // interaction if(stage._interactive) { @@ -225,13 +216,17 @@ if(!stage._interactiveEventsAdded) { stage._interactiveEventsAdded = true; - stage.interactionManager.setTarget( this ); + stage.interactionManager.setTarget(this); } } - - var gl = this.gl; - - // -- Does this need to be set every frame? -- // + else + { + if(stage._interactiveEventsAdded) + { + stage._interactiveEventsAdded = false; + stage.interactionManager.setTarget(this); + } + } gl.viewport(0, 0, this.width, this.height); @@ -250,46 +245,6 @@ gl.clear(gl.COLOR_BUFFER_BIT); this.renderDisplayObject( stage, this.projection ); - - // interaction - if(stage.interactive) - { - //need to add some events! - if(!stage._interactiveEventsAdded) - { - stage._interactiveEventsAdded = true; - stage.interactionManager.setTarget(this); - } - } - else - { - if(stage._interactiveEventsAdded) - { - stage._interactiveEventsAdded = false; - stage.interactionManager.setTarget(this); - } - } - - /* - //can simulate context loss in Chrome like so: - this.view.onmousedown = function(ev) { - console.dir(this.gl.getSupportedExtensions()); - var ext = ( - gl.getExtension("WEBGL_scompressed_texture_s3tc") - // gl.getExtension("WEBGL_compressed_texture_s3tc") || - // gl.getExtension("MOZ_WEBGL_compressed_texture_s3tc") || - // gl.getExtension("WEBKIT_WEBGL_compressed_texture_s3tc") - ); - console.dir(ext); - var loseCtx = this.gl.getExtension("WEBGL_lose_context"); - console.log("killing context"); - loseCtx.loseContext(); - setTimeout(function() { - console.log("restoring context..."); - loseCtx.restoreContext(); - }.bind(this), 1000); - }.bind(this); - */ }; /** @@ -401,6 +356,7 @@ this.contextLost = true; }; + /** * Handles a restored webgl context * @@ -411,59 +367,16 @@ PIXI.WebGLRenderer.prototype.handleContextRestored = function() { - //try 'experimental-webgl' - try { - this.gl = this.view.getContext('experimental-webgl', this.contextOptions); - } catch (e) { - //try 'webgl' - try { - this.gl = this.view.getContext('webgl', this.contextOptions); - } catch (e2) { - // fail, not able to get a context - throw new Error(' This browser does not support webGL. Try using the canvas renderer' + this); - } - } + this.initContext(); - PIXI.glContexts[this.glContextId] = null; - - var gl = this.gl; - this.glContextId = gl.id = PIXI.WebGLRenderer.glContextId++; - - PIXI.glContexts[this.glContextId] = gl; - - - - // need to set the context... - this.shaderManager.setContext(gl); - this.spriteBatch.setContext(gl); - // this.primitiveBatch.setContext(gl); - this.maskManager.setContext(gl); - this.filterManager.setContext(gl); - - - this.renderSession.gl = this.gl; - - gl.disable(gl.DEPTH_TEST); - gl.disable(gl.CULL_FACE); - - gl.enable(gl.BLEND); - gl.colorMask(true, true, true, true);//this.transparent); - - this.gl.viewport(0, 0, this.width, this.height); - + // empty all the ol gl textures as they are useless now for(var key in PIXI.TextureCache) { var texture = PIXI.TextureCache[key].baseTexture; texture._glTextures = []; } - - /** - * Whether the context was lost - * @property contextLost - * @type Boolean - */ + this.contextLost = false; - }; /** @@ -473,12 +386,9 @@ */ PIXI.WebGLRenderer.prototype.destroy = function() { - - // deal with losing context.. - // remove listeners - this.view.off('webglcontextlost', this.contextLostFunction); - this.view.off('webglcontextrestored', this.contextRestoredFunction); + this.view.off('webglcontextlost', this.contextLostBound); + this.view.off('webglcontextrestored', this.contextRestoredBound); PIXI.glContexts[this.glContextId] = null; @@ -500,4 +410,32 @@ this.renderSession = null; }; +PIXI.WebGLRenderer.prototype.mapBlendModes = function() +{ + var gl = this.gl; + + if(!PIXI.blendModesWebGL) + { + PIXI.blendModesWebGL = []; + + PIXI.blendModesWebGL[PIXI.blendModes.NORMAL] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; + PIXI.blendModesWebGL[PIXI.blendModes.ADD] = [gl.SRC_ALPHA, gl.DST_ALPHA]; + PIXI.blendModesWebGL[PIXI.blendModes.MULTIPLY] = [gl.DST_COLOR, gl.ONE_MINUS_SRC_ALPHA]; + PIXI.blendModesWebGL[PIXI.blendModes.SCREEN] = [gl.SRC_ALPHA, gl.ONE]; + PIXI.blendModesWebGL[PIXI.blendModes.OVERLAY] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; + PIXI.blendModesWebGL[PIXI.blendModes.DARKEN] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; + PIXI.blendModesWebGL[PIXI.blendModes.LIGHTEN] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; + PIXI.blendModesWebGL[PIXI.blendModes.COLOR_DODGE] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; + PIXI.blendModesWebGL[PIXI.blendModes.COLOR_BURN] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; + PIXI.blendModesWebGL[PIXI.blendModes.HARD_LIGHT] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; + PIXI.blendModesWebGL[PIXI.blendModes.SOFT_LIGHT] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; + PIXI.blendModesWebGL[PIXI.blendModes.DIFFERENCE] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; + PIXI.blendModesWebGL[PIXI.blendModes.EXCLUSION] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; + PIXI.blendModesWebGL[PIXI.blendModes.HUE] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; + PIXI.blendModesWebGL[PIXI.blendModes.SATURATION] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; + PIXI.blendModesWebGL[PIXI.blendModes.COLOR] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; + PIXI.blendModesWebGL[PIXI.blendModes.LUMINOSITY] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; + } +}; + PIXI.WebGLRenderer.glContextId = 0; diff --git a/src/pixi/renderers/webgl/utils/WebGLBlendModeManager.js b/src/pixi/renderers/webgl/utils/WebGLBlendModeManager.js index 653019f..c73728f 100644 --- a/src/pixi/renderers/webgl/utils/WebGLBlendModeManager.js +++ b/src/pixi/renderers/webgl/utils/WebGLBlendModeManager.js @@ -8,10 +8,14 @@ * @param gl {WebGLContext} the current WebGL drawing context * @private */ -PIXI.WebGLBlendModeManager = function(gl) +PIXI.WebGLBlendModeManager = function() +{ + this.currentBlendMode = 99999; +}; + +PIXI.WebGLBlendModeManager.prototype.setContext = function(gl) { this.gl = gl; - this.currentBlendMode = 99999; }; /** diff --git a/src/pixi/renderers/webgl/utils/WebGLFastSpriteBatch.js b/src/pixi/renderers/webgl/utils/WebGLFastSpriteBatch.js index e296251..0d08e47 100644 --- a/src/pixi/renderers/webgl/utils/WebGLFastSpriteBatch.js +++ b/src/pixi/renderers/webgl/utils/WebGLFastSpriteBatch.js @@ -8,7 +8,7 @@ * https://github.com/libgdx/libgdx/blob/master/gdx/src/com/badlogic/gdx/graphics/g2d/WebGLSpriteBatch.java */ -PIXI.WebGLFastSpriteBatch = function(gl) +PIXI.WebGLFastSpriteBatch = function() { @@ -53,7 +53,7 @@ this.matrix = null; - this.setContext(gl); + //this.setContext(gl); }; PIXI.WebGLFastSpriteBatch.prototype.setContext = function(gl) diff --git a/src/pixi/renderers/webgl/utils/WebGLFilterManager.js b/src/pixi/renderers/webgl/utils/WebGLFilterManager.js index 7383072..278e7f4 100644 --- a/src/pixi/renderers/webgl/utils/WebGLFilterManager.js +++ b/src/pixi/renderers/webgl/utils/WebGLFilterManager.js @@ -6,19 +6,16 @@ * @class WebGLFilterManager * @constructor * @param gl {WebGLContext} the current WebGL drawing context -* @param transparent {Boolean} Whether or not the drawing context should be transparent * @private */ -PIXI.WebGLFilterManager = function(gl, transparent) +PIXI.WebGLFilterManager = function() { - this.transparent = transparent; - this.filterStack = []; this.offsetX = 0; this.offsetY = 0; - this.setContext(gl); + // this.setContext(gl); }; // API diff --git a/src/pixi/renderers/webgl/utils/WebGLMaskManager.js b/src/pixi/renderers/webgl/utils/WebGLMaskManager.js index b40efaf..181f560 100644 --- a/src/pixi/renderers/webgl/utils/WebGLMaskManager.js +++ b/src/pixi/renderers/webgl/utils/WebGLMaskManager.js @@ -8,9 +8,9 @@ * @param gl {WebGLContext} the current WebGL drawing context * @private */ -PIXI.WebGLMaskManager = function(gl) +PIXI.WebGLMaskManager = function() { - this.setContext(gl); + //this.setContext(gl); }; /** diff --git a/src/pixi/Pixi.js b/src/pixi/Pixi.js index 4cf4f3e..1eb1010 100644 --- a/src/pixi/Pixi.js +++ b/src/pixi/Pixi.js @@ -16,7 +16,7 @@ PIXI.CANVAS_RENDERER = 1; // useful for testing against if your lib is using pixi. -PIXI.VERSION = "v1.6.1"; +PIXI.VERSION = "v2.0.0"; // the various blend modes supported by pixi diff --git a/src/pixi/renderers/webgl/WebGLRenderer.js b/src/pixi/renderers/webgl/WebGLRenderer.js index e9e4658..c75bbb4 100644 --- a/src/pixi/renderers/webgl/WebGLRenderer.js +++ b/src/pixi/renderers/webgl/WebGLRenderer.js @@ -99,13 +99,13 @@ this.view = options.view || document.createElement( 'canvas' ); // deal with losing context.. - this.contextLostFunction = this.handleContextLost.bind(this); - this.contextRestoredFunction = this.handleContextRestored.bind(this); + this.contextLostBound = this.handleContextLost.bind(this); + this.contextRestoredBound = this.handleContextRestored.bind(this); - this.view.addEventListener('webglcontextlost', this.contextLostFunction, false); - this.view.addEventListener('webglcontextrestored', this.contextRestoredFunction, false); + this.view.addEventListener('webglcontextlost', this.contextLostBound, false); + this.view.addEventListener('webglcontextrestored', this.contextRestoredBound, false); - this.contextOptions = { + this._contextOptions = { alpha: this.transparent, antialias: options.antialias, // SPEED UP?? premultipliedAlpha:this.transparent && this.transparent !== 'notMultiplied', @@ -113,62 +113,16 @@ preserveDrawingBuffer: options.preserveDrawingBuffer }; - var gl = null; - - ['experimental-webgl', 'webgl'].forEach(function(name) { - try { - gl = gl || this.view.getContext(name, this.contextOptions); - } catch(e) {} - }, this); - - if (!gl) { - // fail, not able to get a context - throw new Error('This browser does not support webGL. Try using the canvas renderer' + this); - } - - this.gl = gl; - this.glContextId = gl.id = PIXI.WebGLRenderer.glContextId ++; - - PIXI.glContexts[this.glContextId] = gl; - - if(!PIXI.blendModesWebGL) - { - PIXI.blendModesWebGL = []; - - PIXI.blendModesWebGL[PIXI.blendModes.NORMAL] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; - PIXI.blendModesWebGL[PIXI.blendModes.ADD] = [gl.SRC_ALPHA, gl.DST_ALPHA]; - PIXI.blendModesWebGL[PIXI.blendModes.MULTIPLY] = [gl.DST_COLOR, gl.ONE_MINUS_SRC_ALPHA]; - PIXI.blendModesWebGL[PIXI.blendModes.SCREEN] = [gl.SRC_ALPHA, gl.ONE]; - PIXI.blendModesWebGL[PIXI.blendModes.OVERLAY] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; - PIXI.blendModesWebGL[PIXI.blendModes.DARKEN] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; - PIXI.blendModesWebGL[PIXI.blendModes.LIGHTEN] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; - PIXI.blendModesWebGL[PIXI.blendModes.COLOR_DODGE] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; - PIXI.blendModesWebGL[PIXI.blendModes.COLOR_BURN] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; - PIXI.blendModesWebGL[PIXI.blendModes.HARD_LIGHT] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; - PIXI.blendModesWebGL[PIXI.blendModes.SOFT_LIGHT] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; - PIXI.blendModesWebGL[PIXI.blendModes.DIFFERENCE] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; - PIXI.blendModesWebGL[PIXI.blendModes.EXCLUSION] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; - PIXI.blendModesWebGL[PIXI.blendModes.HUE] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; - PIXI.blendModesWebGL[PIXI.blendModes.SATURATION] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; - PIXI.blendModesWebGL[PIXI.blendModes.COLOR] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; - PIXI.blendModesWebGL[PIXI.blendModes.LUMINOSITY] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; - } - this.projection = new PIXI.Point(); - this.offset = new PIXI.Point(0, 0); - this.resize(width, height); - - this.contextLost = false; - // time to create the render managers! each one focuses on managine a state in webGL - this.shaderManager = new PIXI.WebGLShaderManager(gl); // deals with managing the shader programs and their attribs - this.spriteBatch = new PIXI.WebGLSpriteBatch(gl); // manages the rendering of sprites - this.maskManager = new PIXI.WebGLMaskManager(gl); // manages the masks using the stencil buffer - this.filterManager = new PIXI.WebGLFilterManager(gl, this.transparent); // manages the filters - this.stencilManager = new PIXI.WebGLStencilManager(gl); - this.blendModeManager = new PIXI.WebGLBlendModeManager(gl); + this.shaderManager = new PIXI.WebGLShaderManager(); // deals with managing the shader programs and their attribs + this.spriteBatch = new PIXI.WebGLSpriteBatch(); // manages the rendering of sprites + this.maskManager = new PIXI.WebGLMaskManager(); // manages the masks using the stencil buffer + this.filterManager = new PIXI.WebGLFilterManager(); // manages the filters + this.stencilManager = new PIXI.WebGLStencilManager(); + this.blendModeManager = new PIXI.WebGLBlendModeManager(); // TODO remove this.renderSession = {}; @@ -183,16 +137,49 @@ this.renderSession.renderer = this; this.renderSession.resolution = this.resolution; - gl.disable(gl.DEPTH_TEST); - gl.disable(gl.CULL_FACE); - gl.enable(gl.BLEND); + // time init the context.. + this.initContext(); - gl.colorMask(true, true, true, true); + this.mapBlendModes(); }; // constructor PIXI.WebGLRenderer.prototype.constructor = PIXI.WebGLRenderer; +PIXI.WebGLRenderer.prototype.initContext = function() +{ + var gl = this.view.getContext('webgl', this._contextOptions) || this.view.getContext('experimental-webgl', this._contextOptions); + this.gl = gl; + + if (!gl) { + // fail, not able to get a context + throw new Error('This browser does not support webGL. Try using the canvas renderer'); + } + + this.glContextId = gl.id = PIXI.WebGLRenderer.glContextId ++; + + PIXI.glContexts[this.glContextId] = gl; + + // set up the default pixi settings.. + gl.disable(gl.DEPTH_TEST); + gl.disable(gl.CULL_FACE); + gl.enable(gl.BLEND); + + // need to set the context... + this.shaderManager.setContext(gl); + this.spriteBatch.setContext(gl); + this.maskManager.setContext(gl); + this.filterManager.setContext(gl); + this.blendModeManager.setContext(gl); + this.stencilManager.setContext(gl); + + this.renderSession.gl = this.gl; + + // now resize and we are good to go! + this.resize(this.width, this.height); +}; + + /** * Renders the stage to its webGL view * @@ -218,6 +205,10 @@ stage.updateTransform(); + var gl = this.gl; + + // -- Does this need to be set every frame? -- // + // interaction if(stage._interactive) { @@ -225,13 +216,17 @@ if(!stage._interactiveEventsAdded) { stage._interactiveEventsAdded = true; - stage.interactionManager.setTarget( this ); + stage.interactionManager.setTarget(this); } } - - var gl = this.gl; - - // -- Does this need to be set every frame? -- // + else + { + if(stage._interactiveEventsAdded) + { + stage._interactiveEventsAdded = false; + stage.interactionManager.setTarget(this); + } + } gl.viewport(0, 0, this.width, this.height); @@ -250,46 +245,6 @@ gl.clear(gl.COLOR_BUFFER_BIT); this.renderDisplayObject( stage, this.projection ); - - // interaction - if(stage.interactive) - { - //need to add some events! - if(!stage._interactiveEventsAdded) - { - stage._interactiveEventsAdded = true; - stage.interactionManager.setTarget(this); - } - } - else - { - if(stage._interactiveEventsAdded) - { - stage._interactiveEventsAdded = false; - stage.interactionManager.setTarget(this); - } - } - - /* - //can simulate context loss in Chrome like so: - this.view.onmousedown = function(ev) { - console.dir(this.gl.getSupportedExtensions()); - var ext = ( - gl.getExtension("WEBGL_scompressed_texture_s3tc") - // gl.getExtension("WEBGL_compressed_texture_s3tc") || - // gl.getExtension("MOZ_WEBGL_compressed_texture_s3tc") || - // gl.getExtension("WEBKIT_WEBGL_compressed_texture_s3tc") - ); - console.dir(ext); - var loseCtx = this.gl.getExtension("WEBGL_lose_context"); - console.log("killing context"); - loseCtx.loseContext(); - setTimeout(function() { - console.log("restoring context..."); - loseCtx.restoreContext(); - }.bind(this), 1000); - }.bind(this); - */ }; /** @@ -401,6 +356,7 @@ this.contextLost = true; }; + /** * Handles a restored webgl context * @@ -411,59 +367,16 @@ PIXI.WebGLRenderer.prototype.handleContextRestored = function() { - //try 'experimental-webgl' - try { - this.gl = this.view.getContext('experimental-webgl', this.contextOptions); - } catch (e) { - //try 'webgl' - try { - this.gl = this.view.getContext('webgl', this.contextOptions); - } catch (e2) { - // fail, not able to get a context - throw new Error(' This browser does not support webGL. Try using the canvas renderer' + this); - } - } + this.initContext(); - PIXI.glContexts[this.glContextId] = null; - - var gl = this.gl; - this.glContextId = gl.id = PIXI.WebGLRenderer.glContextId++; - - PIXI.glContexts[this.glContextId] = gl; - - - - // need to set the context... - this.shaderManager.setContext(gl); - this.spriteBatch.setContext(gl); - // this.primitiveBatch.setContext(gl); - this.maskManager.setContext(gl); - this.filterManager.setContext(gl); - - - this.renderSession.gl = this.gl; - - gl.disable(gl.DEPTH_TEST); - gl.disable(gl.CULL_FACE); - - gl.enable(gl.BLEND); - gl.colorMask(true, true, true, true);//this.transparent); - - this.gl.viewport(0, 0, this.width, this.height); - + // empty all the ol gl textures as they are useless now for(var key in PIXI.TextureCache) { var texture = PIXI.TextureCache[key].baseTexture; texture._glTextures = []; } - - /** - * Whether the context was lost - * @property contextLost - * @type Boolean - */ + this.contextLost = false; - }; /** @@ -473,12 +386,9 @@ */ PIXI.WebGLRenderer.prototype.destroy = function() { - - // deal with losing context.. - // remove listeners - this.view.off('webglcontextlost', this.contextLostFunction); - this.view.off('webglcontextrestored', this.contextRestoredFunction); + this.view.off('webglcontextlost', this.contextLostBound); + this.view.off('webglcontextrestored', this.contextRestoredBound); PIXI.glContexts[this.glContextId] = null; @@ -500,4 +410,32 @@ this.renderSession = null; }; +PIXI.WebGLRenderer.prototype.mapBlendModes = function() +{ + var gl = this.gl; + + if(!PIXI.blendModesWebGL) + { + PIXI.blendModesWebGL = []; + + PIXI.blendModesWebGL[PIXI.blendModes.NORMAL] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; + PIXI.blendModesWebGL[PIXI.blendModes.ADD] = [gl.SRC_ALPHA, gl.DST_ALPHA]; + PIXI.blendModesWebGL[PIXI.blendModes.MULTIPLY] = [gl.DST_COLOR, gl.ONE_MINUS_SRC_ALPHA]; + PIXI.blendModesWebGL[PIXI.blendModes.SCREEN] = [gl.SRC_ALPHA, gl.ONE]; + PIXI.blendModesWebGL[PIXI.blendModes.OVERLAY] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; + PIXI.blendModesWebGL[PIXI.blendModes.DARKEN] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; + PIXI.blendModesWebGL[PIXI.blendModes.LIGHTEN] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; + PIXI.blendModesWebGL[PIXI.blendModes.COLOR_DODGE] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; + PIXI.blendModesWebGL[PIXI.blendModes.COLOR_BURN] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; + PIXI.blendModesWebGL[PIXI.blendModes.HARD_LIGHT] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; + PIXI.blendModesWebGL[PIXI.blendModes.SOFT_LIGHT] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; + PIXI.blendModesWebGL[PIXI.blendModes.DIFFERENCE] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; + PIXI.blendModesWebGL[PIXI.blendModes.EXCLUSION] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; + PIXI.blendModesWebGL[PIXI.blendModes.HUE] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; + PIXI.blendModesWebGL[PIXI.blendModes.SATURATION] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; + PIXI.blendModesWebGL[PIXI.blendModes.COLOR] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; + PIXI.blendModesWebGL[PIXI.blendModes.LUMINOSITY] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; + } +}; + PIXI.WebGLRenderer.glContextId = 0; diff --git a/src/pixi/renderers/webgl/utils/WebGLBlendModeManager.js b/src/pixi/renderers/webgl/utils/WebGLBlendModeManager.js index 653019f..c73728f 100644 --- a/src/pixi/renderers/webgl/utils/WebGLBlendModeManager.js +++ b/src/pixi/renderers/webgl/utils/WebGLBlendModeManager.js @@ -8,10 +8,14 @@ * @param gl {WebGLContext} the current WebGL drawing context * @private */ -PIXI.WebGLBlendModeManager = function(gl) +PIXI.WebGLBlendModeManager = function() +{ + this.currentBlendMode = 99999; +}; + +PIXI.WebGLBlendModeManager.prototype.setContext = function(gl) { this.gl = gl; - this.currentBlendMode = 99999; }; /** diff --git a/src/pixi/renderers/webgl/utils/WebGLFastSpriteBatch.js b/src/pixi/renderers/webgl/utils/WebGLFastSpriteBatch.js index e296251..0d08e47 100644 --- a/src/pixi/renderers/webgl/utils/WebGLFastSpriteBatch.js +++ b/src/pixi/renderers/webgl/utils/WebGLFastSpriteBatch.js @@ -8,7 +8,7 @@ * https://github.com/libgdx/libgdx/blob/master/gdx/src/com/badlogic/gdx/graphics/g2d/WebGLSpriteBatch.java */ -PIXI.WebGLFastSpriteBatch = function(gl) +PIXI.WebGLFastSpriteBatch = function() { @@ -53,7 +53,7 @@ this.matrix = null; - this.setContext(gl); + //this.setContext(gl); }; PIXI.WebGLFastSpriteBatch.prototype.setContext = function(gl) diff --git a/src/pixi/renderers/webgl/utils/WebGLFilterManager.js b/src/pixi/renderers/webgl/utils/WebGLFilterManager.js index 7383072..278e7f4 100644 --- a/src/pixi/renderers/webgl/utils/WebGLFilterManager.js +++ b/src/pixi/renderers/webgl/utils/WebGLFilterManager.js @@ -6,19 +6,16 @@ * @class WebGLFilterManager * @constructor * @param gl {WebGLContext} the current WebGL drawing context -* @param transparent {Boolean} Whether or not the drawing context should be transparent * @private */ -PIXI.WebGLFilterManager = function(gl, transparent) +PIXI.WebGLFilterManager = function() { - this.transparent = transparent; - this.filterStack = []; this.offsetX = 0; this.offsetY = 0; - this.setContext(gl); + // this.setContext(gl); }; // API diff --git a/src/pixi/renderers/webgl/utils/WebGLMaskManager.js b/src/pixi/renderers/webgl/utils/WebGLMaskManager.js index b40efaf..181f560 100644 --- a/src/pixi/renderers/webgl/utils/WebGLMaskManager.js +++ b/src/pixi/renderers/webgl/utils/WebGLMaskManager.js @@ -8,9 +8,9 @@ * @param gl {WebGLContext} the current WebGL drawing context * @private */ -PIXI.WebGLMaskManager = function(gl) +PIXI.WebGLMaskManager = function() { - this.setContext(gl); + //this.setContext(gl); }; /** diff --git a/src/pixi/renderers/webgl/utils/WebGLShaderManager.js b/src/pixi/renderers/webgl/utils/WebGLShaderManager.js index 626ac21..d342e03 100644 --- a/src/pixi/renderers/webgl/utils/WebGLShaderManager.js +++ b/src/pixi/renderers/webgl/utils/WebGLShaderManager.js @@ -8,7 +8,7 @@ * @param gl {WebGLContext} the current WebGL drawing context * @private */ -PIXI.WebGLShaderManager = function(gl) +PIXI.WebGLShaderManager = function() { this.maxAttibs = 10; @@ -19,7 +19,7 @@ this.attribState[i] = false; } - this.setContext(gl); + //this.setContext(gl); // the final one is used for the rendering strips }; diff --git a/src/pixi/Pixi.js b/src/pixi/Pixi.js index 4cf4f3e..1eb1010 100644 --- a/src/pixi/Pixi.js +++ b/src/pixi/Pixi.js @@ -16,7 +16,7 @@ PIXI.CANVAS_RENDERER = 1; // useful for testing against if your lib is using pixi. -PIXI.VERSION = "v1.6.1"; +PIXI.VERSION = "v2.0.0"; // the various blend modes supported by pixi diff --git a/src/pixi/renderers/webgl/WebGLRenderer.js b/src/pixi/renderers/webgl/WebGLRenderer.js index e9e4658..c75bbb4 100644 --- a/src/pixi/renderers/webgl/WebGLRenderer.js +++ b/src/pixi/renderers/webgl/WebGLRenderer.js @@ -99,13 +99,13 @@ this.view = options.view || document.createElement( 'canvas' ); // deal with losing context.. - this.contextLostFunction = this.handleContextLost.bind(this); - this.contextRestoredFunction = this.handleContextRestored.bind(this); + this.contextLostBound = this.handleContextLost.bind(this); + this.contextRestoredBound = this.handleContextRestored.bind(this); - this.view.addEventListener('webglcontextlost', this.contextLostFunction, false); - this.view.addEventListener('webglcontextrestored', this.contextRestoredFunction, false); + this.view.addEventListener('webglcontextlost', this.contextLostBound, false); + this.view.addEventListener('webglcontextrestored', this.contextRestoredBound, false); - this.contextOptions = { + this._contextOptions = { alpha: this.transparent, antialias: options.antialias, // SPEED UP?? premultipliedAlpha:this.transparent && this.transparent !== 'notMultiplied', @@ -113,62 +113,16 @@ preserveDrawingBuffer: options.preserveDrawingBuffer }; - var gl = null; - - ['experimental-webgl', 'webgl'].forEach(function(name) { - try { - gl = gl || this.view.getContext(name, this.contextOptions); - } catch(e) {} - }, this); - - if (!gl) { - // fail, not able to get a context - throw new Error('This browser does not support webGL. Try using the canvas renderer' + this); - } - - this.gl = gl; - this.glContextId = gl.id = PIXI.WebGLRenderer.glContextId ++; - - PIXI.glContexts[this.glContextId] = gl; - - if(!PIXI.blendModesWebGL) - { - PIXI.blendModesWebGL = []; - - PIXI.blendModesWebGL[PIXI.blendModes.NORMAL] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; - PIXI.blendModesWebGL[PIXI.blendModes.ADD] = [gl.SRC_ALPHA, gl.DST_ALPHA]; - PIXI.blendModesWebGL[PIXI.blendModes.MULTIPLY] = [gl.DST_COLOR, gl.ONE_MINUS_SRC_ALPHA]; - PIXI.blendModesWebGL[PIXI.blendModes.SCREEN] = [gl.SRC_ALPHA, gl.ONE]; - PIXI.blendModesWebGL[PIXI.blendModes.OVERLAY] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; - PIXI.blendModesWebGL[PIXI.blendModes.DARKEN] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; - PIXI.blendModesWebGL[PIXI.blendModes.LIGHTEN] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; - PIXI.blendModesWebGL[PIXI.blendModes.COLOR_DODGE] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; - PIXI.blendModesWebGL[PIXI.blendModes.COLOR_BURN] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; - PIXI.blendModesWebGL[PIXI.blendModes.HARD_LIGHT] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; - PIXI.blendModesWebGL[PIXI.blendModes.SOFT_LIGHT] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; - PIXI.blendModesWebGL[PIXI.blendModes.DIFFERENCE] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; - PIXI.blendModesWebGL[PIXI.blendModes.EXCLUSION] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; - PIXI.blendModesWebGL[PIXI.blendModes.HUE] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; - PIXI.blendModesWebGL[PIXI.blendModes.SATURATION] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; - PIXI.blendModesWebGL[PIXI.blendModes.COLOR] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; - PIXI.blendModesWebGL[PIXI.blendModes.LUMINOSITY] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; - } - this.projection = new PIXI.Point(); - this.offset = new PIXI.Point(0, 0); - this.resize(width, height); - - this.contextLost = false; - // time to create the render managers! each one focuses on managine a state in webGL - this.shaderManager = new PIXI.WebGLShaderManager(gl); // deals with managing the shader programs and their attribs - this.spriteBatch = new PIXI.WebGLSpriteBatch(gl); // manages the rendering of sprites - this.maskManager = new PIXI.WebGLMaskManager(gl); // manages the masks using the stencil buffer - this.filterManager = new PIXI.WebGLFilterManager(gl, this.transparent); // manages the filters - this.stencilManager = new PIXI.WebGLStencilManager(gl); - this.blendModeManager = new PIXI.WebGLBlendModeManager(gl); + this.shaderManager = new PIXI.WebGLShaderManager(); // deals with managing the shader programs and their attribs + this.spriteBatch = new PIXI.WebGLSpriteBatch(); // manages the rendering of sprites + this.maskManager = new PIXI.WebGLMaskManager(); // manages the masks using the stencil buffer + this.filterManager = new PIXI.WebGLFilterManager(); // manages the filters + this.stencilManager = new PIXI.WebGLStencilManager(); + this.blendModeManager = new PIXI.WebGLBlendModeManager(); // TODO remove this.renderSession = {}; @@ -183,16 +137,49 @@ this.renderSession.renderer = this; this.renderSession.resolution = this.resolution; - gl.disable(gl.DEPTH_TEST); - gl.disable(gl.CULL_FACE); - gl.enable(gl.BLEND); + // time init the context.. + this.initContext(); - gl.colorMask(true, true, true, true); + this.mapBlendModes(); }; // constructor PIXI.WebGLRenderer.prototype.constructor = PIXI.WebGLRenderer; +PIXI.WebGLRenderer.prototype.initContext = function() +{ + var gl = this.view.getContext('webgl', this._contextOptions) || this.view.getContext('experimental-webgl', this._contextOptions); + this.gl = gl; + + if (!gl) { + // fail, not able to get a context + throw new Error('This browser does not support webGL. Try using the canvas renderer'); + } + + this.glContextId = gl.id = PIXI.WebGLRenderer.glContextId ++; + + PIXI.glContexts[this.glContextId] = gl; + + // set up the default pixi settings.. + gl.disable(gl.DEPTH_TEST); + gl.disable(gl.CULL_FACE); + gl.enable(gl.BLEND); + + // need to set the context... + this.shaderManager.setContext(gl); + this.spriteBatch.setContext(gl); + this.maskManager.setContext(gl); + this.filterManager.setContext(gl); + this.blendModeManager.setContext(gl); + this.stencilManager.setContext(gl); + + this.renderSession.gl = this.gl; + + // now resize and we are good to go! + this.resize(this.width, this.height); +}; + + /** * Renders the stage to its webGL view * @@ -218,6 +205,10 @@ stage.updateTransform(); + var gl = this.gl; + + // -- Does this need to be set every frame? -- // + // interaction if(stage._interactive) { @@ -225,13 +216,17 @@ if(!stage._interactiveEventsAdded) { stage._interactiveEventsAdded = true; - stage.interactionManager.setTarget( this ); + stage.interactionManager.setTarget(this); } } - - var gl = this.gl; - - // -- Does this need to be set every frame? -- // + else + { + if(stage._interactiveEventsAdded) + { + stage._interactiveEventsAdded = false; + stage.interactionManager.setTarget(this); + } + } gl.viewport(0, 0, this.width, this.height); @@ -250,46 +245,6 @@ gl.clear(gl.COLOR_BUFFER_BIT); this.renderDisplayObject( stage, this.projection ); - - // interaction - if(stage.interactive) - { - //need to add some events! - if(!stage._interactiveEventsAdded) - { - stage._interactiveEventsAdded = true; - stage.interactionManager.setTarget(this); - } - } - else - { - if(stage._interactiveEventsAdded) - { - stage._interactiveEventsAdded = false; - stage.interactionManager.setTarget(this); - } - } - - /* - //can simulate context loss in Chrome like so: - this.view.onmousedown = function(ev) { - console.dir(this.gl.getSupportedExtensions()); - var ext = ( - gl.getExtension("WEBGL_scompressed_texture_s3tc") - // gl.getExtension("WEBGL_compressed_texture_s3tc") || - // gl.getExtension("MOZ_WEBGL_compressed_texture_s3tc") || - // gl.getExtension("WEBKIT_WEBGL_compressed_texture_s3tc") - ); - console.dir(ext); - var loseCtx = this.gl.getExtension("WEBGL_lose_context"); - console.log("killing context"); - loseCtx.loseContext(); - setTimeout(function() { - console.log("restoring context..."); - loseCtx.restoreContext(); - }.bind(this), 1000); - }.bind(this); - */ }; /** @@ -401,6 +356,7 @@ this.contextLost = true; }; + /** * Handles a restored webgl context * @@ -411,59 +367,16 @@ PIXI.WebGLRenderer.prototype.handleContextRestored = function() { - //try 'experimental-webgl' - try { - this.gl = this.view.getContext('experimental-webgl', this.contextOptions); - } catch (e) { - //try 'webgl' - try { - this.gl = this.view.getContext('webgl', this.contextOptions); - } catch (e2) { - // fail, not able to get a context - throw new Error(' This browser does not support webGL. Try using the canvas renderer' + this); - } - } + this.initContext(); - PIXI.glContexts[this.glContextId] = null; - - var gl = this.gl; - this.glContextId = gl.id = PIXI.WebGLRenderer.glContextId++; - - PIXI.glContexts[this.glContextId] = gl; - - - - // need to set the context... - this.shaderManager.setContext(gl); - this.spriteBatch.setContext(gl); - // this.primitiveBatch.setContext(gl); - this.maskManager.setContext(gl); - this.filterManager.setContext(gl); - - - this.renderSession.gl = this.gl; - - gl.disable(gl.DEPTH_TEST); - gl.disable(gl.CULL_FACE); - - gl.enable(gl.BLEND); - gl.colorMask(true, true, true, true);//this.transparent); - - this.gl.viewport(0, 0, this.width, this.height); - + // empty all the ol gl textures as they are useless now for(var key in PIXI.TextureCache) { var texture = PIXI.TextureCache[key].baseTexture; texture._glTextures = []; } - - /** - * Whether the context was lost - * @property contextLost - * @type Boolean - */ + this.contextLost = false; - }; /** @@ -473,12 +386,9 @@ */ PIXI.WebGLRenderer.prototype.destroy = function() { - - // deal with losing context.. - // remove listeners - this.view.off('webglcontextlost', this.contextLostFunction); - this.view.off('webglcontextrestored', this.contextRestoredFunction); + this.view.off('webglcontextlost', this.contextLostBound); + this.view.off('webglcontextrestored', this.contextRestoredBound); PIXI.glContexts[this.glContextId] = null; @@ -500,4 +410,32 @@ this.renderSession = null; }; +PIXI.WebGLRenderer.prototype.mapBlendModes = function() +{ + var gl = this.gl; + + if(!PIXI.blendModesWebGL) + { + PIXI.blendModesWebGL = []; + + PIXI.blendModesWebGL[PIXI.blendModes.NORMAL] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; + PIXI.blendModesWebGL[PIXI.blendModes.ADD] = [gl.SRC_ALPHA, gl.DST_ALPHA]; + PIXI.blendModesWebGL[PIXI.blendModes.MULTIPLY] = [gl.DST_COLOR, gl.ONE_MINUS_SRC_ALPHA]; + PIXI.blendModesWebGL[PIXI.blendModes.SCREEN] = [gl.SRC_ALPHA, gl.ONE]; + PIXI.blendModesWebGL[PIXI.blendModes.OVERLAY] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; + PIXI.blendModesWebGL[PIXI.blendModes.DARKEN] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; + PIXI.blendModesWebGL[PIXI.blendModes.LIGHTEN] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; + PIXI.blendModesWebGL[PIXI.blendModes.COLOR_DODGE] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; + PIXI.blendModesWebGL[PIXI.blendModes.COLOR_BURN] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; + PIXI.blendModesWebGL[PIXI.blendModes.HARD_LIGHT] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; + PIXI.blendModesWebGL[PIXI.blendModes.SOFT_LIGHT] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; + PIXI.blendModesWebGL[PIXI.blendModes.DIFFERENCE] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; + PIXI.blendModesWebGL[PIXI.blendModes.EXCLUSION] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; + PIXI.blendModesWebGL[PIXI.blendModes.HUE] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; + PIXI.blendModesWebGL[PIXI.blendModes.SATURATION] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; + PIXI.blendModesWebGL[PIXI.blendModes.COLOR] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; + PIXI.blendModesWebGL[PIXI.blendModes.LUMINOSITY] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; + } +}; + PIXI.WebGLRenderer.glContextId = 0; diff --git a/src/pixi/renderers/webgl/utils/WebGLBlendModeManager.js b/src/pixi/renderers/webgl/utils/WebGLBlendModeManager.js index 653019f..c73728f 100644 --- a/src/pixi/renderers/webgl/utils/WebGLBlendModeManager.js +++ b/src/pixi/renderers/webgl/utils/WebGLBlendModeManager.js @@ -8,10 +8,14 @@ * @param gl {WebGLContext} the current WebGL drawing context * @private */ -PIXI.WebGLBlendModeManager = function(gl) +PIXI.WebGLBlendModeManager = function() +{ + this.currentBlendMode = 99999; +}; + +PIXI.WebGLBlendModeManager.prototype.setContext = function(gl) { this.gl = gl; - this.currentBlendMode = 99999; }; /** diff --git a/src/pixi/renderers/webgl/utils/WebGLFastSpriteBatch.js b/src/pixi/renderers/webgl/utils/WebGLFastSpriteBatch.js index e296251..0d08e47 100644 --- a/src/pixi/renderers/webgl/utils/WebGLFastSpriteBatch.js +++ b/src/pixi/renderers/webgl/utils/WebGLFastSpriteBatch.js @@ -8,7 +8,7 @@ * https://github.com/libgdx/libgdx/blob/master/gdx/src/com/badlogic/gdx/graphics/g2d/WebGLSpriteBatch.java */ -PIXI.WebGLFastSpriteBatch = function(gl) +PIXI.WebGLFastSpriteBatch = function() { @@ -53,7 +53,7 @@ this.matrix = null; - this.setContext(gl); + //this.setContext(gl); }; PIXI.WebGLFastSpriteBatch.prototype.setContext = function(gl) diff --git a/src/pixi/renderers/webgl/utils/WebGLFilterManager.js b/src/pixi/renderers/webgl/utils/WebGLFilterManager.js index 7383072..278e7f4 100644 --- a/src/pixi/renderers/webgl/utils/WebGLFilterManager.js +++ b/src/pixi/renderers/webgl/utils/WebGLFilterManager.js @@ -6,19 +6,16 @@ * @class WebGLFilterManager * @constructor * @param gl {WebGLContext} the current WebGL drawing context -* @param transparent {Boolean} Whether or not the drawing context should be transparent * @private */ -PIXI.WebGLFilterManager = function(gl, transparent) +PIXI.WebGLFilterManager = function() { - this.transparent = transparent; - this.filterStack = []; this.offsetX = 0; this.offsetY = 0; - this.setContext(gl); + // this.setContext(gl); }; // API diff --git a/src/pixi/renderers/webgl/utils/WebGLMaskManager.js b/src/pixi/renderers/webgl/utils/WebGLMaskManager.js index b40efaf..181f560 100644 --- a/src/pixi/renderers/webgl/utils/WebGLMaskManager.js +++ b/src/pixi/renderers/webgl/utils/WebGLMaskManager.js @@ -8,9 +8,9 @@ * @param gl {WebGLContext} the current WebGL drawing context * @private */ -PIXI.WebGLMaskManager = function(gl) +PIXI.WebGLMaskManager = function() { - this.setContext(gl); + //this.setContext(gl); }; /** diff --git a/src/pixi/renderers/webgl/utils/WebGLShaderManager.js b/src/pixi/renderers/webgl/utils/WebGLShaderManager.js index 626ac21..d342e03 100644 --- a/src/pixi/renderers/webgl/utils/WebGLShaderManager.js +++ b/src/pixi/renderers/webgl/utils/WebGLShaderManager.js @@ -8,7 +8,7 @@ * @param gl {WebGLContext} the current WebGL drawing context * @private */ -PIXI.WebGLShaderManager = function(gl) +PIXI.WebGLShaderManager = function() { this.maxAttibs = 10; @@ -19,7 +19,7 @@ this.attribState[i] = false; } - this.setContext(gl); + //this.setContext(gl); // the final one is used for the rendering strips }; diff --git a/src/pixi/renderers/webgl/utils/WebGLSpriteBatch.js b/src/pixi/renderers/webgl/utils/WebGLSpriteBatch.js index 585c9cd..5ec854c 100755 --- a/src/pixi/renderers/webgl/utils/WebGLSpriteBatch.js +++ b/src/pixi/renderers/webgl/utils/WebGLSpriteBatch.js @@ -16,7 +16,7 @@ * @param gl {WebGLContext} the current WebGL drawing context * */ -PIXI.WebGLSpriteBatch = function(gl) +PIXI.WebGLSpriteBatch = function() { /** @@ -75,7 +75,7 @@ this.currentBatchSize = 0; this.currentBaseTexture = null; - this.setContext(gl); +// this.setContext(gl); this.dirty = true; diff --git a/src/pixi/Pixi.js b/src/pixi/Pixi.js index 4cf4f3e..1eb1010 100644 --- a/src/pixi/Pixi.js +++ b/src/pixi/Pixi.js @@ -16,7 +16,7 @@ PIXI.CANVAS_RENDERER = 1; // useful for testing against if your lib is using pixi. -PIXI.VERSION = "v1.6.1"; +PIXI.VERSION = "v2.0.0"; // the various blend modes supported by pixi diff --git a/src/pixi/renderers/webgl/WebGLRenderer.js b/src/pixi/renderers/webgl/WebGLRenderer.js index e9e4658..c75bbb4 100644 --- a/src/pixi/renderers/webgl/WebGLRenderer.js +++ b/src/pixi/renderers/webgl/WebGLRenderer.js @@ -99,13 +99,13 @@ this.view = options.view || document.createElement( 'canvas' ); // deal with losing context.. - this.contextLostFunction = this.handleContextLost.bind(this); - this.contextRestoredFunction = this.handleContextRestored.bind(this); + this.contextLostBound = this.handleContextLost.bind(this); + this.contextRestoredBound = this.handleContextRestored.bind(this); - this.view.addEventListener('webglcontextlost', this.contextLostFunction, false); - this.view.addEventListener('webglcontextrestored', this.contextRestoredFunction, false); + this.view.addEventListener('webglcontextlost', this.contextLostBound, false); + this.view.addEventListener('webglcontextrestored', this.contextRestoredBound, false); - this.contextOptions = { + this._contextOptions = { alpha: this.transparent, antialias: options.antialias, // SPEED UP?? premultipliedAlpha:this.transparent && this.transparent !== 'notMultiplied', @@ -113,62 +113,16 @@ preserveDrawingBuffer: options.preserveDrawingBuffer }; - var gl = null; - - ['experimental-webgl', 'webgl'].forEach(function(name) { - try { - gl = gl || this.view.getContext(name, this.contextOptions); - } catch(e) {} - }, this); - - if (!gl) { - // fail, not able to get a context - throw new Error('This browser does not support webGL. Try using the canvas renderer' + this); - } - - this.gl = gl; - this.glContextId = gl.id = PIXI.WebGLRenderer.glContextId ++; - - PIXI.glContexts[this.glContextId] = gl; - - if(!PIXI.blendModesWebGL) - { - PIXI.blendModesWebGL = []; - - PIXI.blendModesWebGL[PIXI.blendModes.NORMAL] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; - PIXI.blendModesWebGL[PIXI.blendModes.ADD] = [gl.SRC_ALPHA, gl.DST_ALPHA]; - PIXI.blendModesWebGL[PIXI.blendModes.MULTIPLY] = [gl.DST_COLOR, gl.ONE_MINUS_SRC_ALPHA]; - PIXI.blendModesWebGL[PIXI.blendModes.SCREEN] = [gl.SRC_ALPHA, gl.ONE]; - PIXI.blendModesWebGL[PIXI.blendModes.OVERLAY] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; - PIXI.blendModesWebGL[PIXI.blendModes.DARKEN] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; - PIXI.blendModesWebGL[PIXI.blendModes.LIGHTEN] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; - PIXI.blendModesWebGL[PIXI.blendModes.COLOR_DODGE] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; - PIXI.blendModesWebGL[PIXI.blendModes.COLOR_BURN] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; - PIXI.blendModesWebGL[PIXI.blendModes.HARD_LIGHT] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; - PIXI.blendModesWebGL[PIXI.blendModes.SOFT_LIGHT] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; - PIXI.blendModesWebGL[PIXI.blendModes.DIFFERENCE] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; - PIXI.blendModesWebGL[PIXI.blendModes.EXCLUSION] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; - PIXI.blendModesWebGL[PIXI.blendModes.HUE] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; - PIXI.blendModesWebGL[PIXI.blendModes.SATURATION] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; - PIXI.blendModesWebGL[PIXI.blendModes.COLOR] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; - PIXI.blendModesWebGL[PIXI.blendModes.LUMINOSITY] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; - } - this.projection = new PIXI.Point(); - this.offset = new PIXI.Point(0, 0); - this.resize(width, height); - - this.contextLost = false; - // time to create the render managers! each one focuses on managine a state in webGL - this.shaderManager = new PIXI.WebGLShaderManager(gl); // deals with managing the shader programs and their attribs - this.spriteBatch = new PIXI.WebGLSpriteBatch(gl); // manages the rendering of sprites - this.maskManager = new PIXI.WebGLMaskManager(gl); // manages the masks using the stencil buffer - this.filterManager = new PIXI.WebGLFilterManager(gl, this.transparent); // manages the filters - this.stencilManager = new PIXI.WebGLStencilManager(gl); - this.blendModeManager = new PIXI.WebGLBlendModeManager(gl); + this.shaderManager = new PIXI.WebGLShaderManager(); // deals with managing the shader programs and their attribs + this.spriteBatch = new PIXI.WebGLSpriteBatch(); // manages the rendering of sprites + this.maskManager = new PIXI.WebGLMaskManager(); // manages the masks using the stencil buffer + this.filterManager = new PIXI.WebGLFilterManager(); // manages the filters + this.stencilManager = new PIXI.WebGLStencilManager(); + this.blendModeManager = new PIXI.WebGLBlendModeManager(); // TODO remove this.renderSession = {}; @@ -183,16 +137,49 @@ this.renderSession.renderer = this; this.renderSession.resolution = this.resolution; - gl.disable(gl.DEPTH_TEST); - gl.disable(gl.CULL_FACE); - gl.enable(gl.BLEND); + // time init the context.. + this.initContext(); - gl.colorMask(true, true, true, true); + this.mapBlendModes(); }; // constructor PIXI.WebGLRenderer.prototype.constructor = PIXI.WebGLRenderer; +PIXI.WebGLRenderer.prototype.initContext = function() +{ + var gl = this.view.getContext('webgl', this._contextOptions) || this.view.getContext('experimental-webgl', this._contextOptions); + this.gl = gl; + + if (!gl) { + // fail, not able to get a context + throw new Error('This browser does not support webGL. Try using the canvas renderer'); + } + + this.glContextId = gl.id = PIXI.WebGLRenderer.glContextId ++; + + PIXI.glContexts[this.glContextId] = gl; + + // set up the default pixi settings.. + gl.disable(gl.DEPTH_TEST); + gl.disable(gl.CULL_FACE); + gl.enable(gl.BLEND); + + // need to set the context... + this.shaderManager.setContext(gl); + this.spriteBatch.setContext(gl); + this.maskManager.setContext(gl); + this.filterManager.setContext(gl); + this.blendModeManager.setContext(gl); + this.stencilManager.setContext(gl); + + this.renderSession.gl = this.gl; + + // now resize and we are good to go! + this.resize(this.width, this.height); +}; + + /** * Renders the stage to its webGL view * @@ -218,6 +205,10 @@ stage.updateTransform(); + var gl = this.gl; + + // -- Does this need to be set every frame? -- // + // interaction if(stage._interactive) { @@ -225,13 +216,17 @@ if(!stage._interactiveEventsAdded) { stage._interactiveEventsAdded = true; - stage.interactionManager.setTarget( this ); + stage.interactionManager.setTarget(this); } } - - var gl = this.gl; - - // -- Does this need to be set every frame? -- // + else + { + if(stage._interactiveEventsAdded) + { + stage._interactiveEventsAdded = false; + stage.interactionManager.setTarget(this); + } + } gl.viewport(0, 0, this.width, this.height); @@ -250,46 +245,6 @@ gl.clear(gl.COLOR_BUFFER_BIT); this.renderDisplayObject( stage, this.projection ); - - // interaction - if(stage.interactive) - { - //need to add some events! - if(!stage._interactiveEventsAdded) - { - stage._interactiveEventsAdded = true; - stage.interactionManager.setTarget(this); - } - } - else - { - if(stage._interactiveEventsAdded) - { - stage._interactiveEventsAdded = false; - stage.interactionManager.setTarget(this); - } - } - - /* - //can simulate context loss in Chrome like so: - this.view.onmousedown = function(ev) { - console.dir(this.gl.getSupportedExtensions()); - var ext = ( - gl.getExtension("WEBGL_scompressed_texture_s3tc") - // gl.getExtension("WEBGL_compressed_texture_s3tc") || - // gl.getExtension("MOZ_WEBGL_compressed_texture_s3tc") || - // gl.getExtension("WEBKIT_WEBGL_compressed_texture_s3tc") - ); - console.dir(ext); - var loseCtx = this.gl.getExtension("WEBGL_lose_context"); - console.log("killing context"); - loseCtx.loseContext(); - setTimeout(function() { - console.log("restoring context..."); - loseCtx.restoreContext(); - }.bind(this), 1000); - }.bind(this); - */ }; /** @@ -401,6 +356,7 @@ this.contextLost = true; }; + /** * Handles a restored webgl context * @@ -411,59 +367,16 @@ PIXI.WebGLRenderer.prototype.handleContextRestored = function() { - //try 'experimental-webgl' - try { - this.gl = this.view.getContext('experimental-webgl', this.contextOptions); - } catch (e) { - //try 'webgl' - try { - this.gl = this.view.getContext('webgl', this.contextOptions); - } catch (e2) { - // fail, not able to get a context - throw new Error(' This browser does not support webGL. Try using the canvas renderer' + this); - } - } + this.initContext(); - PIXI.glContexts[this.glContextId] = null; - - var gl = this.gl; - this.glContextId = gl.id = PIXI.WebGLRenderer.glContextId++; - - PIXI.glContexts[this.glContextId] = gl; - - - - // need to set the context... - this.shaderManager.setContext(gl); - this.spriteBatch.setContext(gl); - // this.primitiveBatch.setContext(gl); - this.maskManager.setContext(gl); - this.filterManager.setContext(gl); - - - this.renderSession.gl = this.gl; - - gl.disable(gl.DEPTH_TEST); - gl.disable(gl.CULL_FACE); - - gl.enable(gl.BLEND); - gl.colorMask(true, true, true, true);//this.transparent); - - this.gl.viewport(0, 0, this.width, this.height); - + // empty all the ol gl textures as they are useless now for(var key in PIXI.TextureCache) { var texture = PIXI.TextureCache[key].baseTexture; texture._glTextures = []; } - - /** - * Whether the context was lost - * @property contextLost - * @type Boolean - */ + this.contextLost = false; - }; /** @@ -473,12 +386,9 @@ */ PIXI.WebGLRenderer.prototype.destroy = function() { - - // deal with losing context.. - // remove listeners - this.view.off('webglcontextlost', this.contextLostFunction); - this.view.off('webglcontextrestored', this.contextRestoredFunction); + this.view.off('webglcontextlost', this.contextLostBound); + this.view.off('webglcontextrestored', this.contextRestoredBound); PIXI.glContexts[this.glContextId] = null; @@ -500,4 +410,32 @@ this.renderSession = null; }; +PIXI.WebGLRenderer.prototype.mapBlendModes = function() +{ + var gl = this.gl; + + if(!PIXI.blendModesWebGL) + { + PIXI.blendModesWebGL = []; + + PIXI.blendModesWebGL[PIXI.blendModes.NORMAL] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; + PIXI.blendModesWebGL[PIXI.blendModes.ADD] = [gl.SRC_ALPHA, gl.DST_ALPHA]; + PIXI.blendModesWebGL[PIXI.blendModes.MULTIPLY] = [gl.DST_COLOR, gl.ONE_MINUS_SRC_ALPHA]; + PIXI.blendModesWebGL[PIXI.blendModes.SCREEN] = [gl.SRC_ALPHA, gl.ONE]; + PIXI.blendModesWebGL[PIXI.blendModes.OVERLAY] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; + PIXI.blendModesWebGL[PIXI.blendModes.DARKEN] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; + PIXI.blendModesWebGL[PIXI.blendModes.LIGHTEN] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; + PIXI.blendModesWebGL[PIXI.blendModes.COLOR_DODGE] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; + PIXI.blendModesWebGL[PIXI.blendModes.COLOR_BURN] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; + PIXI.blendModesWebGL[PIXI.blendModes.HARD_LIGHT] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; + PIXI.blendModesWebGL[PIXI.blendModes.SOFT_LIGHT] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; + PIXI.blendModesWebGL[PIXI.blendModes.DIFFERENCE] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; + PIXI.blendModesWebGL[PIXI.blendModes.EXCLUSION] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; + PIXI.blendModesWebGL[PIXI.blendModes.HUE] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; + PIXI.blendModesWebGL[PIXI.blendModes.SATURATION] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; + PIXI.blendModesWebGL[PIXI.blendModes.COLOR] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; + PIXI.blendModesWebGL[PIXI.blendModes.LUMINOSITY] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]; + } +}; + PIXI.WebGLRenderer.glContextId = 0; diff --git a/src/pixi/renderers/webgl/utils/WebGLBlendModeManager.js b/src/pixi/renderers/webgl/utils/WebGLBlendModeManager.js index 653019f..c73728f 100644 --- a/src/pixi/renderers/webgl/utils/WebGLBlendModeManager.js +++ b/src/pixi/renderers/webgl/utils/WebGLBlendModeManager.js @@ -8,10 +8,14 @@ * @param gl {WebGLContext} the current WebGL drawing context * @private */ -PIXI.WebGLBlendModeManager = function(gl) +PIXI.WebGLBlendModeManager = function() +{ + this.currentBlendMode = 99999; +}; + +PIXI.WebGLBlendModeManager.prototype.setContext = function(gl) { this.gl = gl; - this.currentBlendMode = 99999; }; /** diff --git a/src/pixi/renderers/webgl/utils/WebGLFastSpriteBatch.js b/src/pixi/renderers/webgl/utils/WebGLFastSpriteBatch.js index e296251..0d08e47 100644 --- a/src/pixi/renderers/webgl/utils/WebGLFastSpriteBatch.js +++ b/src/pixi/renderers/webgl/utils/WebGLFastSpriteBatch.js @@ -8,7 +8,7 @@ * https://github.com/libgdx/libgdx/blob/master/gdx/src/com/badlogic/gdx/graphics/g2d/WebGLSpriteBatch.java */ -PIXI.WebGLFastSpriteBatch = function(gl) +PIXI.WebGLFastSpriteBatch = function() { @@ -53,7 +53,7 @@ this.matrix = null; - this.setContext(gl); + //this.setContext(gl); }; PIXI.WebGLFastSpriteBatch.prototype.setContext = function(gl) diff --git a/src/pixi/renderers/webgl/utils/WebGLFilterManager.js b/src/pixi/renderers/webgl/utils/WebGLFilterManager.js index 7383072..278e7f4 100644 --- a/src/pixi/renderers/webgl/utils/WebGLFilterManager.js +++ b/src/pixi/renderers/webgl/utils/WebGLFilterManager.js @@ -6,19 +6,16 @@ * @class WebGLFilterManager * @constructor * @param gl {WebGLContext} the current WebGL drawing context -* @param transparent {Boolean} Whether or not the drawing context should be transparent * @private */ -PIXI.WebGLFilterManager = function(gl, transparent) +PIXI.WebGLFilterManager = function() { - this.transparent = transparent; - this.filterStack = []; this.offsetX = 0; this.offsetY = 0; - this.setContext(gl); + // this.setContext(gl); }; // API diff --git a/src/pixi/renderers/webgl/utils/WebGLMaskManager.js b/src/pixi/renderers/webgl/utils/WebGLMaskManager.js index b40efaf..181f560 100644 --- a/src/pixi/renderers/webgl/utils/WebGLMaskManager.js +++ b/src/pixi/renderers/webgl/utils/WebGLMaskManager.js @@ -8,9 +8,9 @@ * @param gl {WebGLContext} the current WebGL drawing context * @private */ -PIXI.WebGLMaskManager = function(gl) +PIXI.WebGLMaskManager = function() { - this.setContext(gl); + //this.setContext(gl); }; /** diff --git a/src/pixi/renderers/webgl/utils/WebGLShaderManager.js b/src/pixi/renderers/webgl/utils/WebGLShaderManager.js index 626ac21..d342e03 100644 --- a/src/pixi/renderers/webgl/utils/WebGLShaderManager.js +++ b/src/pixi/renderers/webgl/utils/WebGLShaderManager.js @@ -8,7 +8,7 @@ * @param gl {WebGLContext} the current WebGL drawing context * @private */ -PIXI.WebGLShaderManager = function(gl) +PIXI.WebGLShaderManager = function() { this.maxAttibs = 10; @@ -19,7 +19,7 @@ this.attribState[i] = false; } - this.setContext(gl); + //this.setContext(gl); // the final one is used for the rendering strips }; diff --git a/src/pixi/renderers/webgl/utils/WebGLSpriteBatch.js b/src/pixi/renderers/webgl/utils/WebGLSpriteBatch.js index 585c9cd..5ec854c 100755 --- a/src/pixi/renderers/webgl/utils/WebGLSpriteBatch.js +++ b/src/pixi/renderers/webgl/utils/WebGLSpriteBatch.js @@ -16,7 +16,7 @@ * @param gl {WebGLContext} the current WebGL drawing context * */ -PIXI.WebGLSpriteBatch = function(gl) +PIXI.WebGLSpriteBatch = function() { /** @@ -75,7 +75,7 @@ this.currentBatchSize = 0; this.currentBaseTexture = null; - this.setContext(gl); +// this.setContext(gl); this.dirty = true; diff --git a/src/pixi/renderers/webgl/utils/WebGLStencilManager.js b/src/pixi/renderers/webgl/utils/WebGLStencilManager.js index b7c6cb9..e707ce2 100644 --- a/src/pixi/renderers/webgl/utils/WebGLStencilManager.js +++ b/src/pixi/renderers/webgl/utils/WebGLStencilManager.js @@ -8,11 +8,11 @@ * @param gl {WebGLContext} the current WebGL drawing context * @private */ -PIXI.WebGLStencilManager = function(gl) +PIXI.WebGLStencilManager = function() { this.stencilStack = []; - this.setContext(gl); + //this.setContext(gl); this.reverse = true; this.count = 0;