diff --git a/src/pixi/InteractionData.js b/src/pixi/InteractionData.js index ea77370..fa84a6d 100644 --- a/src/pixi/InteractionData.js +++ b/src/pixi/InteractionData.js @@ -18,7 +18,6 @@ */ this.global = new PIXI.Point(); - /** * The target Sprite that was interacted with * diff --git a/src/pixi/InteractionData.js b/src/pixi/InteractionData.js index ea77370..fa84a6d 100644 --- a/src/pixi/InteractionData.js +++ b/src/pixi/InteractionData.js @@ -18,7 +18,6 @@ */ this.global = new PIXI.Point(); - /** * The target Sprite that was interacted with * diff --git a/src/pixi/InteractionManager.js b/src/pixi/InteractionManager.js index 685c386..71f320b 100644 --- a/src/pixi/InteractionManager.js +++ b/src/pixi/InteractionManager.js @@ -14,7 +14,7 @@ PIXI.InteractionManager = function(stage) { /** - * a reference to the stage + * A reference to the stage * * @property stage * @type Stage @@ -22,7 +22,7 @@ this.stage = stage; /** - * the mouse data + * The mouse data * * @property mouse * @type InteractionData @@ -30,18 +30,21 @@ this.mouse = new PIXI.InteractionData(); /** - * an object that stores current touches (InteractionData) by id reference + * An object that stores current touches (InteractionData) by id reference * * @property touches * @type Object */ this.touches = {}; - // helpers + /** + * @property tempPoint + * @type Point + * @private + */ this.tempPoint = new PIXI.Point(); /** - * * @property mouseoverEnabled * @type Boolean * @default @@ -49,7 +52,7 @@ this.mouseoverEnabled = true; /** - * tiny little interactiveData pool ! + * Tiny little interactiveData pool ! * * @property pool * @type Array @@ -61,7 +64,6 @@ * @property interactiveItems * @type Array * @private - * */ this.interactiveItems = []; @@ -73,23 +75,60 @@ */ this.interactionDOMElement = null; - //this will make it so that you dont have to call bind all the time + //this will make it so that you don't have to call bind all the time + + /** + * @property onMouseMove + * @type Function + */ this.onMouseMove = this.onMouseMove.bind( this ); + + /** + * @property onMouseDown + * @type Function + */ this.onMouseDown = this.onMouseDown.bind(this); + + /** + * @property onMouseOut + * @type Function + */ this.onMouseOut = this.onMouseOut.bind(this); + + /** + * @property onMouseUp + * @type Function + */ this.onMouseUp = this.onMouseUp.bind(this); + /** + * @property onTouchStart + * @type Function + */ this.onTouchStart = this.onTouchStart.bind(this); + + /** + * @property onTouchEnd + * @type Function + */ this.onTouchEnd = this.onTouchEnd.bind(this); + + /** + * @property onTouchMove + * @type Function + */ this.onTouchMove = this.onTouchMove.bind(this); + /** + * @property last + * @type Number + */ this.last = 0; /** * The css style of the cursor that is being used * @property currentCursorStyle * @type String - * */ this.currentCursorStyle = 'inherit'; @@ -97,10 +136,13 @@ * Is set to true when the mouse is moved out of the canvas * @property mouseOut * @type Boolean - * */ this.mouseOut = false; + /** + * @property resolution + * @type Number + */ this.resolution = 1; }; @@ -166,7 +208,6 @@ this.setTargetDomElement (target.view); }; - /** * Sets the DOM element which will receive mouse/touch events. This is useful for when you have other DOM * elements on top of the renderers Canvas element. With this you'll be able to delegate another DOM element @@ -201,7 +242,10 @@ window.addEventListener('mouseup', this.onMouseUp, true); }; - +/** + * @method removeEvents + * @private + */ PIXI.InteractionManager.prototype.removeEvents = function() { if (!this.interactionDOMElement) return; @@ -308,6 +352,10 @@ } }; +/** + * @method rebuildInteractiveGraph + * @private + */ PIXI.InteractionManager.prototype.rebuildInteractiveGraph = function() { this.dirty = false; @@ -427,10 +475,10 @@ }; /** - * Is called when the mouse button is moved out of the renderer element + * Is called when the mouse is moved out of the renderer element * * @method onMouseOut - * @param event {Event} The DOM event of a mouse button being moved out + * @param event {Event} The DOM event of a mouse being moved out * @private */ PIXI.InteractionManager.prototype.onMouseOut = function(event) diff --git a/src/pixi/InteractionData.js b/src/pixi/InteractionData.js index ea77370..fa84a6d 100644 --- a/src/pixi/InteractionData.js +++ b/src/pixi/InteractionData.js @@ -18,7 +18,6 @@ */ this.global = new PIXI.Point(); - /** * The target Sprite that was interacted with * diff --git a/src/pixi/InteractionManager.js b/src/pixi/InteractionManager.js index 685c386..71f320b 100644 --- a/src/pixi/InteractionManager.js +++ b/src/pixi/InteractionManager.js @@ -14,7 +14,7 @@ PIXI.InteractionManager = function(stage) { /** - * a reference to the stage + * A reference to the stage * * @property stage * @type Stage @@ -22,7 +22,7 @@ this.stage = stage; /** - * the mouse data + * The mouse data * * @property mouse * @type InteractionData @@ -30,18 +30,21 @@ this.mouse = new PIXI.InteractionData(); /** - * an object that stores current touches (InteractionData) by id reference + * An object that stores current touches (InteractionData) by id reference * * @property touches * @type Object */ this.touches = {}; - // helpers + /** + * @property tempPoint + * @type Point + * @private + */ this.tempPoint = new PIXI.Point(); /** - * * @property mouseoverEnabled * @type Boolean * @default @@ -49,7 +52,7 @@ this.mouseoverEnabled = true; /** - * tiny little interactiveData pool ! + * Tiny little interactiveData pool ! * * @property pool * @type Array @@ -61,7 +64,6 @@ * @property interactiveItems * @type Array * @private - * */ this.interactiveItems = []; @@ -73,23 +75,60 @@ */ this.interactionDOMElement = null; - //this will make it so that you dont have to call bind all the time + //this will make it so that you don't have to call bind all the time + + /** + * @property onMouseMove + * @type Function + */ this.onMouseMove = this.onMouseMove.bind( this ); + + /** + * @property onMouseDown + * @type Function + */ this.onMouseDown = this.onMouseDown.bind(this); + + /** + * @property onMouseOut + * @type Function + */ this.onMouseOut = this.onMouseOut.bind(this); + + /** + * @property onMouseUp + * @type Function + */ this.onMouseUp = this.onMouseUp.bind(this); + /** + * @property onTouchStart + * @type Function + */ this.onTouchStart = this.onTouchStart.bind(this); + + /** + * @property onTouchEnd + * @type Function + */ this.onTouchEnd = this.onTouchEnd.bind(this); + + /** + * @property onTouchMove + * @type Function + */ this.onTouchMove = this.onTouchMove.bind(this); + /** + * @property last + * @type Number + */ this.last = 0; /** * The css style of the cursor that is being used * @property currentCursorStyle * @type String - * */ this.currentCursorStyle = 'inherit'; @@ -97,10 +136,13 @@ * Is set to true when the mouse is moved out of the canvas * @property mouseOut * @type Boolean - * */ this.mouseOut = false; + /** + * @property resolution + * @type Number + */ this.resolution = 1; }; @@ -166,7 +208,6 @@ this.setTargetDomElement (target.view); }; - /** * Sets the DOM element which will receive mouse/touch events. This is useful for when you have other DOM * elements on top of the renderers Canvas element. With this you'll be able to delegate another DOM element @@ -201,7 +242,10 @@ window.addEventListener('mouseup', this.onMouseUp, true); }; - +/** + * @method removeEvents + * @private + */ PIXI.InteractionManager.prototype.removeEvents = function() { if (!this.interactionDOMElement) return; @@ -308,6 +352,10 @@ } }; +/** + * @method rebuildInteractiveGraph + * @private + */ PIXI.InteractionManager.prototype.rebuildInteractiveGraph = function() { this.dirty = false; @@ -427,10 +475,10 @@ }; /** - * Is called when the mouse button is moved out of the renderer element + * Is called when the mouse is moved out of the renderer element * * @method onMouseOut - * @param event {Event} The DOM event of a mouse button being moved out + * @param event {Event} The DOM event of a mouse being moved out * @private */ PIXI.InteractionManager.prototype.onMouseOut = function(event) diff --git a/src/pixi/renderers/webgl/WebGLRenderer.js b/src/pixi/renderers/webgl/WebGLRenderer.js index 968fd3d..422896f 100644 --- a/src/pixi/renderers/webgl/WebGLRenderer.js +++ b/src/pixi/renderers/webgl/WebGLRenderer.js @@ -5,23 +5,21 @@ PIXI.glContexts = []; // this is where we store the webGL contexts for easy access. /** - * the WebGLRenderer draws the stage and all its content onto a webGL enabled canvas. This renderer - * should be used for browsers that support webGL. This Render works by automatically managing webGLBatch's. - * So no need for Sprite Batch's or Sprite Cloud's - * Dont forget to add the view to your DOM or you will not see anything :) + * The WebGLRenderer draws the stage and all its content onto a webGL enabled canvas. This renderer + * should be used for browsers that support webGL. This Render works by automatically managing webGLBatchs. + * So no need for Sprite Batches or Sprite Clouds. + * Don't forget to add the view to your DOM or you will not see anything :) * * @class WebGLRenderer * @constructor * @param [width=0] {Number} the width of the canvas view * @param [height=0] {Number} the height of the canvas view - * * @param [options] {Object} The optional renderer parameters * @param [options.view] {HTMLCanvasElement} the canvas to use as a view, optional * @param [options.transparent=false] {Boolean} If the render view is transparent, default false * @param [options.antialias=false] {Boolean} sets antialias (only applicable in chrome at the moment) * @param [options.preserveDrawingBuffer=false] {Boolean} enables drawing buffer preservation, enable this if you need to call toDataUrl on the webgl context * @param [options.resolution=1] {Number} the resolution of the renderer retina would be 2 - * */ PIXI.WebGLRenderer = function(width, height, options) { @@ -37,13 +35,16 @@ options = PIXI.defaultRenderOptions; } - if(!PIXI.defaultRenderer) { PIXI.sayHello('webGL'); PIXI.defaultRenderer = this; } + /** + * @property type + * @type Number + */ this.type = PIXI.WEBGL_RENDERER; /** @@ -56,6 +57,7 @@ this.resolution = options.resolution; // do a catch.. only 1 webGL renderer.. + /** * Whether the render view is transparent * @@ -99,12 +101,27 @@ this.view = options.view || document.createElement( 'canvas' ); // deal with losing context.. + + /** + * @property contextLostBound + * @type Function + */ this.contextLostBound = this.handleContextLost.bind(this); + + /** + * @property contextRestoredBound + * @type Function + */ this.contextRestoredBound = this.handleContextRestored.bind(this); this.view.addEventListener('webglcontextlost', this.contextLostBound, false); this.view.addEventListener('webglcontextrestored', this.contextRestoredBound, false); + /** + * @property _contextOptions + * @type Object + * @private + */ this._contextOptions = { alpha: this.transparent, antialias: options.antialias, // SPEED UP?? @@ -113,18 +130,67 @@ preserveDrawingBuffer: options.preserveDrawingBuffer }; + /** + * @property projection + * @type Point + */ this.projection = new PIXI.Point(); + + /** + * @property offset + * @type Point + */ this.offset = new PIXI.Point(0, 0); - // time to create the render managers! each one focuses on managine a state in webGL - 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(); // manages the stencil buffer - this.blendModeManager = new PIXI.WebGLBlendModeManager(); // manages the blendModes + // time to create the render managers! each one focuses on managing a state in webGL - // TODO remove + /** + * Deals with managing the shader programs and their attribs + * @property shaderManager + * @type WebGLShaderManager + */ + this.shaderManager = new PIXI.WebGLShaderManager(); + + /** + * Manages the rendering of sprites + * @property spriteBatch + * @type WebGLSpriteBatch + */ + this.spriteBatch = new PIXI.WebGLSpriteBatch(); + + /** + * Manages the masks using the stencil buffer + * @property maskManager + * @type WebGLMaskManager + */ + this.maskManager = new PIXI.WebGLMaskManager(); + + /** + * Manages the filters + * @property filterManager + * @type WebGLFilterManager + */ + this.filterManager = new PIXI.WebGLFilterManager(); + + /** + * Manages the stencil buffer + * @property stencilManager + * @type WebGLStencilManager + */ + this.stencilManager = new PIXI.WebGLStencilManager(); + + /** + * Manages the blendModes + * @property blendModeManager + * @type WebGLBlendModeManager + */ + this.blendModeManager = new PIXI.WebGLBlendModeManager(); + + /** + * TODO remove + * @property renderSession + * @type Object + */ this.renderSession = {}; this.renderSession.gl = this.gl; this.renderSession.drawCount = 0; @@ -147,6 +213,9 @@ // constructor PIXI.WebGLRenderer.prototype.constructor = PIXI.WebGLRenderer; +/** +* @method initContext +*/ PIXI.WebGLRenderer.prototype.initContext = function() { var gl = this.view.getContext('webgl', this._contextOptions) || this.view.getContext('experimental-webgl', this._contextOptions); @@ -180,7 +249,6 @@ this.resize(this.width, this.height); }; - /** * Renders the stage to its webGL view * @@ -205,9 +273,7 @@ // update the scene graph stage.updateTransform(); - var gl = this.gl; - // interaction if(stage._interactive) @@ -249,9 +315,9 @@ }; /** - * Renders a display Object + * Renders a Display Object. * - * @method renderDIsplayObject + * @method renderDisplayObject * @param displayObject {DisplayObject} The DisplayObject to render * @param projection {Point} The projection * @param buffer {Array} a standard WebGL buffer @@ -283,7 +349,7 @@ }; /** - * resizes the webGL view to the specified width and height + * Resizes the webGL view to the specified width and height. * * @method resize * @param width {Number} the new width of the webGL view @@ -297,10 +363,6 @@ this.view.width = this.width; this.view.height = this.height; - // this.view.style.width = width + 'px'; - // this.view.style.height = height + 'px'; - - // console.log(this.width / this.resolution) this.gl.viewport(0, 0, this.width, this.height); this.projection.x = this.width / 2 / this.resolution; @@ -308,10 +370,10 @@ }; /** - * Updates and Creates a WebGL texture for the renderers context + * Updates and Creates a WebGL texture for the renderers context. * * @method updateTexture - * @param texture {Texture} the texture to render + * @param texture {Texture} the texture to update */ PIXI.WebGLRenderer.prototype.updateTexture = function(texture) { @@ -411,6 +473,11 @@ this.renderSession = null; }; +/** + * Maps Pixi blend modes to WebGL blend modes. + * + * @method mapBlendModes + */ PIXI.WebGLRenderer.prototype.mapBlendModes = function() { var gl = this.gl; diff --git a/src/pixi/InteractionData.js b/src/pixi/InteractionData.js index ea77370..fa84a6d 100644 --- a/src/pixi/InteractionData.js +++ b/src/pixi/InteractionData.js @@ -18,7 +18,6 @@ */ this.global = new PIXI.Point(); - /** * The target Sprite that was interacted with * diff --git a/src/pixi/InteractionManager.js b/src/pixi/InteractionManager.js index 685c386..71f320b 100644 --- a/src/pixi/InteractionManager.js +++ b/src/pixi/InteractionManager.js @@ -14,7 +14,7 @@ PIXI.InteractionManager = function(stage) { /** - * a reference to the stage + * A reference to the stage * * @property stage * @type Stage @@ -22,7 +22,7 @@ this.stage = stage; /** - * the mouse data + * The mouse data * * @property mouse * @type InteractionData @@ -30,18 +30,21 @@ this.mouse = new PIXI.InteractionData(); /** - * an object that stores current touches (InteractionData) by id reference + * An object that stores current touches (InteractionData) by id reference * * @property touches * @type Object */ this.touches = {}; - // helpers + /** + * @property tempPoint + * @type Point + * @private + */ this.tempPoint = new PIXI.Point(); /** - * * @property mouseoverEnabled * @type Boolean * @default @@ -49,7 +52,7 @@ this.mouseoverEnabled = true; /** - * tiny little interactiveData pool ! + * Tiny little interactiveData pool ! * * @property pool * @type Array @@ -61,7 +64,6 @@ * @property interactiveItems * @type Array * @private - * */ this.interactiveItems = []; @@ -73,23 +75,60 @@ */ this.interactionDOMElement = null; - //this will make it so that you dont have to call bind all the time + //this will make it so that you don't have to call bind all the time + + /** + * @property onMouseMove + * @type Function + */ this.onMouseMove = this.onMouseMove.bind( this ); + + /** + * @property onMouseDown + * @type Function + */ this.onMouseDown = this.onMouseDown.bind(this); + + /** + * @property onMouseOut + * @type Function + */ this.onMouseOut = this.onMouseOut.bind(this); + + /** + * @property onMouseUp + * @type Function + */ this.onMouseUp = this.onMouseUp.bind(this); + /** + * @property onTouchStart + * @type Function + */ this.onTouchStart = this.onTouchStart.bind(this); + + /** + * @property onTouchEnd + * @type Function + */ this.onTouchEnd = this.onTouchEnd.bind(this); + + /** + * @property onTouchMove + * @type Function + */ this.onTouchMove = this.onTouchMove.bind(this); + /** + * @property last + * @type Number + */ this.last = 0; /** * The css style of the cursor that is being used * @property currentCursorStyle * @type String - * */ this.currentCursorStyle = 'inherit'; @@ -97,10 +136,13 @@ * Is set to true when the mouse is moved out of the canvas * @property mouseOut * @type Boolean - * */ this.mouseOut = false; + /** + * @property resolution + * @type Number + */ this.resolution = 1; }; @@ -166,7 +208,6 @@ this.setTargetDomElement (target.view); }; - /** * Sets the DOM element which will receive mouse/touch events. This is useful for when you have other DOM * elements on top of the renderers Canvas element. With this you'll be able to delegate another DOM element @@ -201,7 +242,10 @@ window.addEventListener('mouseup', this.onMouseUp, true); }; - +/** + * @method removeEvents + * @private + */ PIXI.InteractionManager.prototype.removeEvents = function() { if (!this.interactionDOMElement) return; @@ -308,6 +352,10 @@ } }; +/** + * @method rebuildInteractiveGraph + * @private + */ PIXI.InteractionManager.prototype.rebuildInteractiveGraph = function() { this.dirty = false; @@ -427,10 +475,10 @@ }; /** - * Is called when the mouse button is moved out of the renderer element + * Is called when the mouse is moved out of the renderer element * * @method onMouseOut - * @param event {Event} The DOM event of a mouse button being moved out + * @param event {Event} The DOM event of a mouse being moved out * @private */ PIXI.InteractionManager.prototype.onMouseOut = function(event) diff --git a/src/pixi/renderers/webgl/WebGLRenderer.js b/src/pixi/renderers/webgl/WebGLRenderer.js index 968fd3d..422896f 100644 --- a/src/pixi/renderers/webgl/WebGLRenderer.js +++ b/src/pixi/renderers/webgl/WebGLRenderer.js @@ -5,23 +5,21 @@ PIXI.glContexts = []; // this is where we store the webGL contexts for easy access. /** - * the WebGLRenderer draws the stage and all its content onto a webGL enabled canvas. This renderer - * should be used for browsers that support webGL. This Render works by automatically managing webGLBatch's. - * So no need for Sprite Batch's or Sprite Cloud's - * Dont forget to add the view to your DOM or you will not see anything :) + * The WebGLRenderer draws the stage and all its content onto a webGL enabled canvas. This renderer + * should be used for browsers that support webGL. This Render works by automatically managing webGLBatchs. + * So no need for Sprite Batches or Sprite Clouds. + * Don't forget to add the view to your DOM or you will not see anything :) * * @class WebGLRenderer * @constructor * @param [width=0] {Number} the width of the canvas view * @param [height=0] {Number} the height of the canvas view - * * @param [options] {Object} The optional renderer parameters * @param [options.view] {HTMLCanvasElement} the canvas to use as a view, optional * @param [options.transparent=false] {Boolean} If the render view is transparent, default false * @param [options.antialias=false] {Boolean} sets antialias (only applicable in chrome at the moment) * @param [options.preserveDrawingBuffer=false] {Boolean} enables drawing buffer preservation, enable this if you need to call toDataUrl on the webgl context * @param [options.resolution=1] {Number} the resolution of the renderer retina would be 2 - * */ PIXI.WebGLRenderer = function(width, height, options) { @@ -37,13 +35,16 @@ options = PIXI.defaultRenderOptions; } - if(!PIXI.defaultRenderer) { PIXI.sayHello('webGL'); PIXI.defaultRenderer = this; } + /** + * @property type + * @type Number + */ this.type = PIXI.WEBGL_RENDERER; /** @@ -56,6 +57,7 @@ this.resolution = options.resolution; // do a catch.. only 1 webGL renderer.. + /** * Whether the render view is transparent * @@ -99,12 +101,27 @@ this.view = options.view || document.createElement( 'canvas' ); // deal with losing context.. + + /** + * @property contextLostBound + * @type Function + */ this.contextLostBound = this.handleContextLost.bind(this); + + /** + * @property contextRestoredBound + * @type Function + */ this.contextRestoredBound = this.handleContextRestored.bind(this); this.view.addEventListener('webglcontextlost', this.contextLostBound, false); this.view.addEventListener('webglcontextrestored', this.contextRestoredBound, false); + /** + * @property _contextOptions + * @type Object + * @private + */ this._contextOptions = { alpha: this.transparent, antialias: options.antialias, // SPEED UP?? @@ -113,18 +130,67 @@ preserveDrawingBuffer: options.preserveDrawingBuffer }; + /** + * @property projection + * @type Point + */ this.projection = new PIXI.Point(); + + /** + * @property offset + * @type Point + */ this.offset = new PIXI.Point(0, 0); - // time to create the render managers! each one focuses on managine a state in webGL - 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(); // manages the stencil buffer - this.blendModeManager = new PIXI.WebGLBlendModeManager(); // manages the blendModes + // time to create the render managers! each one focuses on managing a state in webGL - // TODO remove + /** + * Deals with managing the shader programs and their attribs + * @property shaderManager + * @type WebGLShaderManager + */ + this.shaderManager = new PIXI.WebGLShaderManager(); + + /** + * Manages the rendering of sprites + * @property spriteBatch + * @type WebGLSpriteBatch + */ + this.spriteBatch = new PIXI.WebGLSpriteBatch(); + + /** + * Manages the masks using the stencil buffer + * @property maskManager + * @type WebGLMaskManager + */ + this.maskManager = new PIXI.WebGLMaskManager(); + + /** + * Manages the filters + * @property filterManager + * @type WebGLFilterManager + */ + this.filterManager = new PIXI.WebGLFilterManager(); + + /** + * Manages the stencil buffer + * @property stencilManager + * @type WebGLStencilManager + */ + this.stencilManager = new PIXI.WebGLStencilManager(); + + /** + * Manages the blendModes + * @property blendModeManager + * @type WebGLBlendModeManager + */ + this.blendModeManager = new PIXI.WebGLBlendModeManager(); + + /** + * TODO remove + * @property renderSession + * @type Object + */ this.renderSession = {}; this.renderSession.gl = this.gl; this.renderSession.drawCount = 0; @@ -147,6 +213,9 @@ // constructor PIXI.WebGLRenderer.prototype.constructor = PIXI.WebGLRenderer; +/** +* @method initContext +*/ PIXI.WebGLRenderer.prototype.initContext = function() { var gl = this.view.getContext('webgl', this._contextOptions) || this.view.getContext('experimental-webgl', this._contextOptions); @@ -180,7 +249,6 @@ this.resize(this.width, this.height); }; - /** * Renders the stage to its webGL view * @@ -205,9 +273,7 @@ // update the scene graph stage.updateTransform(); - var gl = this.gl; - // interaction if(stage._interactive) @@ -249,9 +315,9 @@ }; /** - * Renders a display Object + * Renders a Display Object. * - * @method renderDIsplayObject + * @method renderDisplayObject * @param displayObject {DisplayObject} The DisplayObject to render * @param projection {Point} The projection * @param buffer {Array} a standard WebGL buffer @@ -283,7 +349,7 @@ }; /** - * resizes the webGL view to the specified width and height + * Resizes the webGL view to the specified width and height. * * @method resize * @param width {Number} the new width of the webGL view @@ -297,10 +363,6 @@ this.view.width = this.width; this.view.height = this.height; - // this.view.style.width = width + 'px'; - // this.view.style.height = height + 'px'; - - // console.log(this.width / this.resolution) this.gl.viewport(0, 0, this.width, this.height); this.projection.x = this.width / 2 / this.resolution; @@ -308,10 +370,10 @@ }; /** - * Updates and Creates a WebGL texture for the renderers context + * Updates and Creates a WebGL texture for the renderers context. * * @method updateTexture - * @param texture {Texture} the texture to render + * @param texture {Texture} the texture to update */ PIXI.WebGLRenderer.prototype.updateTexture = function(texture) { @@ -411,6 +473,11 @@ this.renderSession = null; }; +/** + * Maps Pixi blend modes to WebGL blend modes. + * + * @method mapBlendModes + */ PIXI.WebGLRenderer.prototype.mapBlendModes = function() { var gl = this.gl; diff --git a/src/pixi/renderers/webgl/shaders/ComplexPrimitiveShader.js b/src/pixi/renderers/webgl/shaders/ComplexPrimitiveShader.js index daa8b64..79d038a 100644 --- a/src/pixi/renderers/webgl/shaders/ComplexPrimitiveShader.js +++ b/src/pixi/renderers/webgl/shaders/ComplexPrimitiveShader.js @@ -9,7 +9,13 @@ */ PIXI.ComplexPrimitiveShader = function(gl) { + /** + * @property _UID + * @type Number + * @private + */ this._UID = PIXI._UID++; + /** * @property gl * @type WebGLContext @@ -17,18 +23,20 @@ this.gl = gl; /** - * @property {any} program - The WebGL program. - */ + * The WebGL program. + * @property program + * @type {Any} + */ this.program = null; /** + * The fragment shader. * @property fragmentSrc * @type Array */ this.fragmentSrc = [ - 'precision mediump float;', - + 'precision mediump float;', 'varying vec4 vColor;', @@ -38,6 +46,7 @@ ]; /** + * The vertex shader. * @property vertexSrc * @type Array */ @@ -65,14 +74,15 @@ this.init(); }; +PIXI.ComplexPrimitiveShader.prototype.constructor = PIXI.ComplexPrimitiveShader; + /** -* Initialises the shader +* Initialises the shader. +* * @method init -* */ PIXI.ComplexPrimitiveShader.prototype.init = function() { - var gl = this.gl; var program = PIXI.compileProgram(gl, this.vertexSrc, this.fragmentSrc); @@ -84,7 +94,6 @@ this.tintColor = gl.getUniformLocation(program, 'tint'); this.color = gl.getUniformLocation(program, 'color'); - // get and store the attributes this.aVertexPosition = gl.getAttribLocation(program, 'aVertexPosition'); // this.colorAttribute = gl.getAttribLocation(program, 'aColor'); @@ -98,9 +107,9 @@ }; /** -* Destroys the shader +* Destroys the shader. +* * @method destroy -* */ PIXI.ComplexPrimitiveShader.prototype.destroy = function() { diff --git a/src/pixi/InteractionData.js b/src/pixi/InteractionData.js index ea77370..fa84a6d 100644 --- a/src/pixi/InteractionData.js +++ b/src/pixi/InteractionData.js @@ -18,7 +18,6 @@ */ this.global = new PIXI.Point(); - /** * The target Sprite that was interacted with * diff --git a/src/pixi/InteractionManager.js b/src/pixi/InteractionManager.js index 685c386..71f320b 100644 --- a/src/pixi/InteractionManager.js +++ b/src/pixi/InteractionManager.js @@ -14,7 +14,7 @@ PIXI.InteractionManager = function(stage) { /** - * a reference to the stage + * A reference to the stage * * @property stage * @type Stage @@ -22,7 +22,7 @@ this.stage = stage; /** - * the mouse data + * The mouse data * * @property mouse * @type InteractionData @@ -30,18 +30,21 @@ this.mouse = new PIXI.InteractionData(); /** - * an object that stores current touches (InteractionData) by id reference + * An object that stores current touches (InteractionData) by id reference * * @property touches * @type Object */ this.touches = {}; - // helpers + /** + * @property tempPoint + * @type Point + * @private + */ this.tempPoint = new PIXI.Point(); /** - * * @property mouseoverEnabled * @type Boolean * @default @@ -49,7 +52,7 @@ this.mouseoverEnabled = true; /** - * tiny little interactiveData pool ! + * Tiny little interactiveData pool ! * * @property pool * @type Array @@ -61,7 +64,6 @@ * @property interactiveItems * @type Array * @private - * */ this.interactiveItems = []; @@ -73,23 +75,60 @@ */ this.interactionDOMElement = null; - //this will make it so that you dont have to call bind all the time + //this will make it so that you don't have to call bind all the time + + /** + * @property onMouseMove + * @type Function + */ this.onMouseMove = this.onMouseMove.bind( this ); + + /** + * @property onMouseDown + * @type Function + */ this.onMouseDown = this.onMouseDown.bind(this); + + /** + * @property onMouseOut + * @type Function + */ this.onMouseOut = this.onMouseOut.bind(this); + + /** + * @property onMouseUp + * @type Function + */ this.onMouseUp = this.onMouseUp.bind(this); + /** + * @property onTouchStart + * @type Function + */ this.onTouchStart = this.onTouchStart.bind(this); + + /** + * @property onTouchEnd + * @type Function + */ this.onTouchEnd = this.onTouchEnd.bind(this); + + /** + * @property onTouchMove + * @type Function + */ this.onTouchMove = this.onTouchMove.bind(this); + /** + * @property last + * @type Number + */ this.last = 0; /** * The css style of the cursor that is being used * @property currentCursorStyle * @type String - * */ this.currentCursorStyle = 'inherit'; @@ -97,10 +136,13 @@ * Is set to true when the mouse is moved out of the canvas * @property mouseOut * @type Boolean - * */ this.mouseOut = false; + /** + * @property resolution + * @type Number + */ this.resolution = 1; }; @@ -166,7 +208,6 @@ this.setTargetDomElement (target.view); }; - /** * Sets the DOM element which will receive mouse/touch events. This is useful for when you have other DOM * elements on top of the renderers Canvas element. With this you'll be able to delegate another DOM element @@ -201,7 +242,10 @@ window.addEventListener('mouseup', this.onMouseUp, true); }; - +/** + * @method removeEvents + * @private + */ PIXI.InteractionManager.prototype.removeEvents = function() { if (!this.interactionDOMElement) return; @@ -308,6 +352,10 @@ } }; +/** + * @method rebuildInteractiveGraph + * @private + */ PIXI.InteractionManager.prototype.rebuildInteractiveGraph = function() { this.dirty = false; @@ -427,10 +475,10 @@ }; /** - * Is called when the mouse button is moved out of the renderer element + * Is called when the mouse is moved out of the renderer element * * @method onMouseOut - * @param event {Event} The DOM event of a mouse button being moved out + * @param event {Event} The DOM event of a mouse being moved out * @private */ PIXI.InteractionManager.prototype.onMouseOut = function(event) diff --git a/src/pixi/renderers/webgl/WebGLRenderer.js b/src/pixi/renderers/webgl/WebGLRenderer.js index 968fd3d..422896f 100644 --- a/src/pixi/renderers/webgl/WebGLRenderer.js +++ b/src/pixi/renderers/webgl/WebGLRenderer.js @@ -5,23 +5,21 @@ PIXI.glContexts = []; // this is where we store the webGL contexts for easy access. /** - * the WebGLRenderer draws the stage and all its content onto a webGL enabled canvas. This renderer - * should be used for browsers that support webGL. This Render works by automatically managing webGLBatch's. - * So no need for Sprite Batch's or Sprite Cloud's - * Dont forget to add the view to your DOM or you will not see anything :) + * The WebGLRenderer draws the stage and all its content onto a webGL enabled canvas. This renderer + * should be used for browsers that support webGL. This Render works by automatically managing webGLBatchs. + * So no need for Sprite Batches or Sprite Clouds. + * Don't forget to add the view to your DOM or you will not see anything :) * * @class WebGLRenderer * @constructor * @param [width=0] {Number} the width of the canvas view * @param [height=0] {Number} the height of the canvas view - * * @param [options] {Object} The optional renderer parameters * @param [options.view] {HTMLCanvasElement} the canvas to use as a view, optional * @param [options.transparent=false] {Boolean} If the render view is transparent, default false * @param [options.antialias=false] {Boolean} sets antialias (only applicable in chrome at the moment) * @param [options.preserveDrawingBuffer=false] {Boolean} enables drawing buffer preservation, enable this if you need to call toDataUrl on the webgl context * @param [options.resolution=1] {Number} the resolution of the renderer retina would be 2 - * */ PIXI.WebGLRenderer = function(width, height, options) { @@ -37,13 +35,16 @@ options = PIXI.defaultRenderOptions; } - if(!PIXI.defaultRenderer) { PIXI.sayHello('webGL'); PIXI.defaultRenderer = this; } + /** + * @property type + * @type Number + */ this.type = PIXI.WEBGL_RENDERER; /** @@ -56,6 +57,7 @@ this.resolution = options.resolution; // do a catch.. only 1 webGL renderer.. + /** * Whether the render view is transparent * @@ -99,12 +101,27 @@ this.view = options.view || document.createElement( 'canvas' ); // deal with losing context.. + + /** + * @property contextLostBound + * @type Function + */ this.contextLostBound = this.handleContextLost.bind(this); + + /** + * @property contextRestoredBound + * @type Function + */ this.contextRestoredBound = this.handleContextRestored.bind(this); this.view.addEventListener('webglcontextlost', this.contextLostBound, false); this.view.addEventListener('webglcontextrestored', this.contextRestoredBound, false); + /** + * @property _contextOptions + * @type Object + * @private + */ this._contextOptions = { alpha: this.transparent, antialias: options.antialias, // SPEED UP?? @@ -113,18 +130,67 @@ preserveDrawingBuffer: options.preserveDrawingBuffer }; + /** + * @property projection + * @type Point + */ this.projection = new PIXI.Point(); + + /** + * @property offset + * @type Point + */ this.offset = new PIXI.Point(0, 0); - // time to create the render managers! each one focuses on managine a state in webGL - 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(); // manages the stencil buffer - this.blendModeManager = new PIXI.WebGLBlendModeManager(); // manages the blendModes + // time to create the render managers! each one focuses on managing a state in webGL - // TODO remove + /** + * Deals with managing the shader programs and their attribs + * @property shaderManager + * @type WebGLShaderManager + */ + this.shaderManager = new PIXI.WebGLShaderManager(); + + /** + * Manages the rendering of sprites + * @property spriteBatch + * @type WebGLSpriteBatch + */ + this.spriteBatch = new PIXI.WebGLSpriteBatch(); + + /** + * Manages the masks using the stencil buffer + * @property maskManager + * @type WebGLMaskManager + */ + this.maskManager = new PIXI.WebGLMaskManager(); + + /** + * Manages the filters + * @property filterManager + * @type WebGLFilterManager + */ + this.filterManager = new PIXI.WebGLFilterManager(); + + /** + * Manages the stencil buffer + * @property stencilManager + * @type WebGLStencilManager + */ + this.stencilManager = new PIXI.WebGLStencilManager(); + + /** + * Manages the blendModes + * @property blendModeManager + * @type WebGLBlendModeManager + */ + this.blendModeManager = new PIXI.WebGLBlendModeManager(); + + /** + * TODO remove + * @property renderSession + * @type Object + */ this.renderSession = {}; this.renderSession.gl = this.gl; this.renderSession.drawCount = 0; @@ -147,6 +213,9 @@ // constructor PIXI.WebGLRenderer.prototype.constructor = PIXI.WebGLRenderer; +/** +* @method initContext +*/ PIXI.WebGLRenderer.prototype.initContext = function() { var gl = this.view.getContext('webgl', this._contextOptions) || this.view.getContext('experimental-webgl', this._contextOptions); @@ -180,7 +249,6 @@ this.resize(this.width, this.height); }; - /** * Renders the stage to its webGL view * @@ -205,9 +273,7 @@ // update the scene graph stage.updateTransform(); - var gl = this.gl; - // interaction if(stage._interactive) @@ -249,9 +315,9 @@ }; /** - * Renders a display Object + * Renders a Display Object. * - * @method renderDIsplayObject + * @method renderDisplayObject * @param displayObject {DisplayObject} The DisplayObject to render * @param projection {Point} The projection * @param buffer {Array} a standard WebGL buffer @@ -283,7 +349,7 @@ }; /** - * resizes the webGL view to the specified width and height + * Resizes the webGL view to the specified width and height. * * @method resize * @param width {Number} the new width of the webGL view @@ -297,10 +363,6 @@ this.view.width = this.width; this.view.height = this.height; - // this.view.style.width = width + 'px'; - // this.view.style.height = height + 'px'; - - // console.log(this.width / this.resolution) this.gl.viewport(0, 0, this.width, this.height); this.projection.x = this.width / 2 / this.resolution; @@ -308,10 +370,10 @@ }; /** - * Updates and Creates a WebGL texture for the renderers context + * Updates and Creates a WebGL texture for the renderers context. * * @method updateTexture - * @param texture {Texture} the texture to render + * @param texture {Texture} the texture to update */ PIXI.WebGLRenderer.prototype.updateTexture = function(texture) { @@ -411,6 +473,11 @@ this.renderSession = null; }; +/** + * Maps Pixi blend modes to WebGL blend modes. + * + * @method mapBlendModes + */ PIXI.WebGLRenderer.prototype.mapBlendModes = function() { var gl = this.gl; diff --git a/src/pixi/renderers/webgl/shaders/ComplexPrimitiveShader.js b/src/pixi/renderers/webgl/shaders/ComplexPrimitiveShader.js index daa8b64..79d038a 100644 --- a/src/pixi/renderers/webgl/shaders/ComplexPrimitiveShader.js +++ b/src/pixi/renderers/webgl/shaders/ComplexPrimitiveShader.js @@ -9,7 +9,13 @@ */ PIXI.ComplexPrimitiveShader = function(gl) { + /** + * @property _UID + * @type Number + * @private + */ this._UID = PIXI._UID++; + /** * @property gl * @type WebGLContext @@ -17,18 +23,20 @@ this.gl = gl; /** - * @property {any} program - The WebGL program. - */ + * The WebGL program. + * @property program + * @type {Any} + */ this.program = null; /** + * The fragment shader. * @property fragmentSrc * @type Array */ this.fragmentSrc = [ - 'precision mediump float;', - + 'precision mediump float;', 'varying vec4 vColor;', @@ -38,6 +46,7 @@ ]; /** + * The vertex shader. * @property vertexSrc * @type Array */ @@ -65,14 +74,15 @@ this.init(); }; +PIXI.ComplexPrimitiveShader.prototype.constructor = PIXI.ComplexPrimitiveShader; + /** -* Initialises the shader +* Initialises the shader. +* * @method init -* */ PIXI.ComplexPrimitiveShader.prototype.init = function() { - var gl = this.gl; var program = PIXI.compileProgram(gl, this.vertexSrc, this.fragmentSrc); @@ -84,7 +94,6 @@ this.tintColor = gl.getUniformLocation(program, 'tint'); this.color = gl.getUniformLocation(program, 'color'); - // get and store the attributes this.aVertexPosition = gl.getAttribLocation(program, 'aVertexPosition'); // this.colorAttribute = gl.getAttribLocation(program, 'aColor'); @@ -98,9 +107,9 @@ }; /** -* Destroys the shader +* Destroys the shader. +* * @method destroy -* */ PIXI.ComplexPrimitiveShader.prototype.destroy = function() { diff --git a/src/pixi/renderers/webgl/shaders/PixiFastShader.js b/src/pixi/renderers/webgl/shaders/PixiFastShader.js index 4fb3fe2..bb46419 100644 --- a/src/pixi/renderers/webgl/shaders/PixiFastShader.js +++ b/src/pixi/renderers/webgl/shaders/PixiFastShader.js @@ -1,6 +1,5 @@ /** * @author Mat Groves http://matgroves.com/ @Doormat23 - * @author Richard Davey http://www.photonstorm.com @photonstorm */ /** @@ -10,6 +9,11 @@ */ PIXI.PixiFastShader = function(gl) { + /** + * @property _UID + * @type Number + * @private + */ this._UID = PIXI._UID++; /** @@ -19,12 +23,16 @@ this.gl = gl; /** - * @property {any} program - The WebGL program. + * The WebGL program. + * @property program + * @type {Any} */ this.program = null; /** - * @property {array} fragmentSrc - The fragment shader. + * The fragment shader. + * @property fragmentSrc + * @type Array */ this.fragmentSrc = [ 'precision lowp float;', @@ -37,8 +45,10 @@ ]; /** - * @property {array} vertexSrc - The vertex shader - */ + * The vertex shader. + * @property vertexSrc + * @type Array + */ this.vertexSrc = [ 'attribute vec2 aVertexPosition;', 'attribute vec2 aPositionCoord;', @@ -69,24 +79,25 @@ '}' ]; - /** - * @property {number} textureCount - A local texture counter for multi-texture shaders. - */ + * A local texture counter for multi-texture shaders. + * @property textureCount + * @type Number + */ this.textureCount = 0; - this.init(); }; +PIXI.PixiFastShader.prototype.constructor = PIXI.PixiFastShader; + /** -* Initialises the shader +* Initialises the shader. +* * @method init -* */ PIXI.PixiFastShader.prototype.init = function() { - var gl = this.gl; var program = PIXI.compileProgram(gl, this.vertexSrc, this.fragmentSrc); @@ -111,8 +122,6 @@ this.aTextureCoord = gl.getAttribLocation(program, 'aTextureCoord'); this.colorAttribute = gl.getAttribLocation(program, 'aColor'); - - // Begin worst hack eva // // WHY??? ONLY on my chrome pixel the line above returns -1 when using filters? @@ -128,14 +137,13 @@ // End worst hack eva // - this.program = program; }; /** -* Destroys the shader +* Destroys the shader. +* * @method destroy -* */ PIXI.PixiFastShader.prototype.destroy = function() { diff --git a/src/pixi/InteractionData.js b/src/pixi/InteractionData.js index ea77370..fa84a6d 100644 --- a/src/pixi/InteractionData.js +++ b/src/pixi/InteractionData.js @@ -18,7 +18,6 @@ */ this.global = new PIXI.Point(); - /** * The target Sprite that was interacted with * diff --git a/src/pixi/InteractionManager.js b/src/pixi/InteractionManager.js index 685c386..71f320b 100644 --- a/src/pixi/InteractionManager.js +++ b/src/pixi/InteractionManager.js @@ -14,7 +14,7 @@ PIXI.InteractionManager = function(stage) { /** - * a reference to the stage + * A reference to the stage * * @property stage * @type Stage @@ -22,7 +22,7 @@ this.stage = stage; /** - * the mouse data + * The mouse data * * @property mouse * @type InteractionData @@ -30,18 +30,21 @@ this.mouse = new PIXI.InteractionData(); /** - * an object that stores current touches (InteractionData) by id reference + * An object that stores current touches (InteractionData) by id reference * * @property touches * @type Object */ this.touches = {}; - // helpers + /** + * @property tempPoint + * @type Point + * @private + */ this.tempPoint = new PIXI.Point(); /** - * * @property mouseoverEnabled * @type Boolean * @default @@ -49,7 +52,7 @@ this.mouseoverEnabled = true; /** - * tiny little interactiveData pool ! + * Tiny little interactiveData pool ! * * @property pool * @type Array @@ -61,7 +64,6 @@ * @property interactiveItems * @type Array * @private - * */ this.interactiveItems = []; @@ -73,23 +75,60 @@ */ this.interactionDOMElement = null; - //this will make it so that you dont have to call bind all the time + //this will make it so that you don't have to call bind all the time + + /** + * @property onMouseMove + * @type Function + */ this.onMouseMove = this.onMouseMove.bind( this ); + + /** + * @property onMouseDown + * @type Function + */ this.onMouseDown = this.onMouseDown.bind(this); + + /** + * @property onMouseOut + * @type Function + */ this.onMouseOut = this.onMouseOut.bind(this); + + /** + * @property onMouseUp + * @type Function + */ this.onMouseUp = this.onMouseUp.bind(this); + /** + * @property onTouchStart + * @type Function + */ this.onTouchStart = this.onTouchStart.bind(this); + + /** + * @property onTouchEnd + * @type Function + */ this.onTouchEnd = this.onTouchEnd.bind(this); + + /** + * @property onTouchMove + * @type Function + */ this.onTouchMove = this.onTouchMove.bind(this); + /** + * @property last + * @type Number + */ this.last = 0; /** * The css style of the cursor that is being used * @property currentCursorStyle * @type String - * */ this.currentCursorStyle = 'inherit'; @@ -97,10 +136,13 @@ * Is set to true when the mouse is moved out of the canvas * @property mouseOut * @type Boolean - * */ this.mouseOut = false; + /** + * @property resolution + * @type Number + */ this.resolution = 1; }; @@ -166,7 +208,6 @@ this.setTargetDomElement (target.view); }; - /** * Sets the DOM element which will receive mouse/touch events. This is useful for when you have other DOM * elements on top of the renderers Canvas element. With this you'll be able to delegate another DOM element @@ -201,7 +242,10 @@ window.addEventListener('mouseup', this.onMouseUp, true); }; - +/** + * @method removeEvents + * @private + */ PIXI.InteractionManager.prototype.removeEvents = function() { if (!this.interactionDOMElement) return; @@ -308,6 +352,10 @@ } }; +/** + * @method rebuildInteractiveGraph + * @private + */ PIXI.InteractionManager.prototype.rebuildInteractiveGraph = function() { this.dirty = false; @@ -427,10 +475,10 @@ }; /** - * Is called when the mouse button is moved out of the renderer element + * Is called when the mouse is moved out of the renderer element * * @method onMouseOut - * @param event {Event} The DOM event of a mouse button being moved out + * @param event {Event} The DOM event of a mouse being moved out * @private */ PIXI.InteractionManager.prototype.onMouseOut = function(event) diff --git a/src/pixi/renderers/webgl/WebGLRenderer.js b/src/pixi/renderers/webgl/WebGLRenderer.js index 968fd3d..422896f 100644 --- a/src/pixi/renderers/webgl/WebGLRenderer.js +++ b/src/pixi/renderers/webgl/WebGLRenderer.js @@ -5,23 +5,21 @@ PIXI.glContexts = []; // this is where we store the webGL contexts for easy access. /** - * the WebGLRenderer draws the stage and all its content onto a webGL enabled canvas. This renderer - * should be used for browsers that support webGL. This Render works by automatically managing webGLBatch's. - * So no need for Sprite Batch's or Sprite Cloud's - * Dont forget to add the view to your DOM or you will not see anything :) + * The WebGLRenderer draws the stage and all its content onto a webGL enabled canvas. This renderer + * should be used for browsers that support webGL. This Render works by automatically managing webGLBatchs. + * So no need for Sprite Batches or Sprite Clouds. + * Don't forget to add the view to your DOM or you will not see anything :) * * @class WebGLRenderer * @constructor * @param [width=0] {Number} the width of the canvas view * @param [height=0] {Number} the height of the canvas view - * * @param [options] {Object} The optional renderer parameters * @param [options.view] {HTMLCanvasElement} the canvas to use as a view, optional * @param [options.transparent=false] {Boolean} If the render view is transparent, default false * @param [options.antialias=false] {Boolean} sets antialias (only applicable in chrome at the moment) * @param [options.preserveDrawingBuffer=false] {Boolean} enables drawing buffer preservation, enable this if you need to call toDataUrl on the webgl context * @param [options.resolution=1] {Number} the resolution of the renderer retina would be 2 - * */ PIXI.WebGLRenderer = function(width, height, options) { @@ -37,13 +35,16 @@ options = PIXI.defaultRenderOptions; } - if(!PIXI.defaultRenderer) { PIXI.sayHello('webGL'); PIXI.defaultRenderer = this; } + /** + * @property type + * @type Number + */ this.type = PIXI.WEBGL_RENDERER; /** @@ -56,6 +57,7 @@ this.resolution = options.resolution; // do a catch.. only 1 webGL renderer.. + /** * Whether the render view is transparent * @@ -99,12 +101,27 @@ this.view = options.view || document.createElement( 'canvas' ); // deal with losing context.. + + /** + * @property contextLostBound + * @type Function + */ this.contextLostBound = this.handleContextLost.bind(this); + + /** + * @property contextRestoredBound + * @type Function + */ this.contextRestoredBound = this.handleContextRestored.bind(this); this.view.addEventListener('webglcontextlost', this.contextLostBound, false); this.view.addEventListener('webglcontextrestored', this.contextRestoredBound, false); + /** + * @property _contextOptions + * @type Object + * @private + */ this._contextOptions = { alpha: this.transparent, antialias: options.antialias, // SPEED UP?? @@ -113,18 +130,67 @@ preserveDrawingBuffer: options.preserveDrawingBuffer }; + /** + * @property projection + * @type Point + */ this.projection = new PIXI.Point(); + + /** + * @property offset + * @type Point + */ this.offset = new PIXI.Point(0, 0); - // time to create the render managers! each one focuses on managine a state in webGL - 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(); // manages the stencil buffer - this.blendModeManager = new PIXI.WebGLBlendModeManager(); // manages the blendModes + // time to create the render managers! each one focuses on managing a state in webGL - // TODO remove + /** + * Deals with managing the shader programs and their attribs + * @property shaderManager + * @type WebGLShaderManager + */ + this.shaderManager = new PIXI.WebGLShaderManager(); + + /** + * Manages the rendering of sprites + * @property spriteBatch + * @type WebGLSpriteBatch + */ + this.spriteBatch = new PIXI.WebGLSpriteBatch(); + + /** + * Manages the masks using the stencil buffer + * @property maskManager + * @type WebGLMaskManager + */ + this.maskManager = new PIXI.WebGLMaskManager(); + + /** + * Manages the filters + * @property filterManager + * @type WebGLFilterManager + */ + this.filterManager = new PIXI.WebGLFilterManager(); + + /** + * Manages the stencil buffer + * @property stencilManager + * @type WebGLStencilManager + */ + this.stencilManager = new PIXI.WebGLStencilManager(); + + /** + * Manages the blendModes + * @property blendModeManager + * @type WebGLBlendModeManager + */ + this.blendModeManager = new PIXI.WebGLBlendModeManager(); + + /** + * TODO remove + * @property renderSession + * @type Object + */ this.renderSession = {}; this.renderSession.gl = this.gl; this.renderSession.drawCount = 0; @@ -147,6 +213,9 @@ // constructor PIXI.WebGLRenderer.prototype.constructor = PIXI.WebGLRenderer; +/** +* @method initContext +*/ PIXI.WebGLRenderer.prototype.initContext = function() { var gl = this.view.getContext('webgl', this._contextOptions) || this.view.getContext('experimental-webgl', this._contextOptions); @@ -180,7 +249,6 @@ this.resize(this.width, this.height); }; - /** * Renders the stage to its webGL view * @@ -205,9 +273,7 @@ // update the scene graph stage.updateTransform(); - var gl = this.gl; - // interaction if(stage._interactive) @@ -249,9 +315,9 @@ }; /** - * Renders a display Object + * Renders a Display Object. * - * @method renderDIsplayObject + * @method renderDisplayObject * @param displayObject {DisplayObject} The DisplayObject to render * @param projection {Point} The projection * @param buffer {Array} a standard WebGL buffer @@ -283,7 +349,7 @@ }; /** - * resizes the webGL view to the specified width and height + * Resizes the webGL view to the specified width and height. * * @method resize * @param width {Number} the new width of the webGL view @@ -297,10 +363,6 @@ this.view.width = this.width; this.view.height = this.height; - // this.view.style.width = width + 'px'; - // this.view.style.height = height + 'px'; - - // console.log(this.width / this.resolution) this.gl.viewport(0, 0, this.width, this.height); this.projection.x = this.width / 2 / this.resolution; @@ -308,10 +370,10 @@ }; /** - * Updates and Creates a WebGL texture for the renderers context + * Updates and Creates a WebGL texture for the renderers context. * * @method updateTexture - * @param texture {Texture} the texture to render + * @param texture {Texture} the texture to update */ PIXI.WebGLRenderer.prototype.updateTexture = function(texture) { @@ -411,6 +473,11 @@ this.renderSession = null; }; +/** + * Maps Pixi blend modes to WebGL blend modes. + * + * @method mapBlendModes + */ PIXI.WebGLRenderer.prototype.mapBlendModes = function() { var gl = this.gl; diff --git a/src/pixi/renderers/webgl/shaders/ComplexPrimitiveShader.js b/src/pixi/renderers/webgl/shaders/ComplexPrimitiveShader.js index daa8b64..79d038a 100644 --- a/src/pixi/renderers/webgl/shaders/ComplexPrimitiveShader.js +++ b/src/pixi/renderers/webgl/shaders/ComplexPrimitiveShader.js @@ -9,7 +9,13 @@ */ PIXI.ComplexPrimitiveShader = function(gl) { + /** + * @property _UID + * @type Number + * @private + */ this._UID = PIXI._UID++; + /** * @property gl * @type WebGLContext @@ -17,18 +23,20 @@ this.gl = gl; /** - * @property {any} program - The WebGL program. - */ + * The WebGL program. + * @property program + * @type {Any} + */ this.program = null; /** + * The fragment shader. * @property fragmentSrc * @type Array */ this.fragmentSrc = [ - 'precision mediump float;', - + 'precision mediump float;', 'varying vec4 vColor;', @@ -38,6 +46,7 @@ ]; /** + * The vertex shader. * @property vertexSrc * @type Array */ @@ -65,14 +74,15 @@ this.init(); }; +PIXI.ComplexPrimitiveShader.prototype.constructor = PIXI.ComplexPrimitiveShader; + /** -* Initialises the shader +* Initialises the shader. +* * @method init -* */ PIXI.ComplexPrimitiveShader.prototype.init = function() { - var gl = this.gl; var program = PIXI.compileProgram(gl, this.vertexSrc, this.fragmentSrc); @@ -84,7 +94,6 @@ this.tintColor = gl.getUniformLocation(program, 'tint'); this.color = gl.getUniformLocation(program, 'color'); - // get and store the attributes this.aVertexPosition = gl.getAttribLocation(program, 'aVertexPosition'); // this.colorAttribute = gl.getAttribLocation(program, 'aColor'); @@ -98,9 +107,9 @@ }; /** -* Destroys the shader +* Destroys the shader. +* * @method destroy -* */ PIXI.ComplexPrimitiveShader.prototype.destroy = function() { diff --git a/src/pixi/renderers/webgl/shaders/PixiFastShader.js b/src/pixi/renderers/webgl/shaders/PixiFastShader.js index 4fb3fe2..bb46419 100644 --- a/src/pixi/renderers/webgl/shaders/PixiFastShader.js +++ b/src/pixi/renderers/webgl/shaders/PixiFastShader.js @@ -1,6 +1,5 @@ /** * @author Mat Groves http://matgroves.com/ @Doormat23 - * @author Richard Davey http://www.photonstorm.com @photonstorm */ /** @@ -10,6 +9,11 @@ */ PIXI.PixiFastShader = function(gl) { + /** + * @property _UID + * @type Number + * @private + */ this._UID = PIXI._UID++; /** @@ -19,12 +23,16 @@ this.gl = gl; /** - * @property {any} program - The WebGL program. + * The WebGL program. + * @property program + * @type {Any} */ this.program = null; /** - * @property {array} fragmentSrc - The fragment shader. + * The fragment shader. + * @property fragmentSrc + * @type Array */ this.fragmentSrc = [ 'precision lowp float;', @@ -37,8 +45,10 @@ ]; /** - * @property {array} vertexSrc - The vertex shader - */ + * The vertex shader. + * @property vertexSrc + * @type Array + */ this.vertexSrc = [ 'attribute vec2 aVertexPosition;', 'attribute vec2 aPositionCoord;', @@ -69,24 +79,25 @@ '}' ]; - /** - * @property {number} textureCount - A local texture counter for multi-texture shaders. - */ + * A local texture counter for multi-texture shaders. + * @property textureCount + * @type Number + */ this.textureCount = 0; - this.init(); }; +PIXI.PixiFastShader.prototype.constructor = PIXI.PixiFastShader; + /** -* Initialises the shader +* Initialises the shader. +* * @method init -* */ PIXI.PixiFastShader.prototype.init = function() { - var gl = this.gl; var program = PIXI.compileProgram(gl, this.vertexSrc, this.fragmentSrc); @@ -111,8 +122,6 @@ this.aTextureCoord = gl.getAttribLocation(program, 'aTextureCoord'); this.colorAttribute = gl.getAttribLocation(program, 'aColor'); - - // Begin worst hack eva // // WHY??? ONLY on my chrome pixel the line above returns -1 when using filters? @@ -128,14 +137,13 @@ // End worst hack eva // - this.program = program; }; /** -* Destroys the shader +* Destroys the shader. +* * @method destroy -* */ PIXI.PixiFastShader.prototype.destroy = function() { diff --git a/src/pixi/renderers/webgl/shaders/PixiShader.js b/src/pixi/renderers/webgl/shaders/PixiShader.js index d76ec03..725dce2 100644 --- a/src/pixi/renderers/webgl/shaders/PixiShader.js +++ b/src/pixi/renderers/webgl/shaders/PixiShader.js @@ -6,9 +6,15 @@ /** * @class PixiShader * @constructor +* @param gl {WebGLContext} the current WebGL drawing context */ PIXI.PixiShader = function(gl) { + /** + * @property _UID + * @type Number + * @private + */ this._UID = PIXI._UID++; /** @@ -18,13 +24,17 @@ this.gl = gl; /** - * @property {any} program - The WebGL program. - */ + * The WebGL program. + * @property program + * @type {Any} + */ this.program = null; /** - * @property {array} fragmentSrc - The fragment shader. - */ + * The fragment shader. + * @property fragmentSrc + * @type Array + */ this.fragmentSrc = [ 'precision lowp float;', 'varying vec2 vTextureCoord;', @@ -36,21 +46,44 @@ ]; /** - * @property {number} textureCount - A local texture counter for multi-texture shaders. - */ + * A local texture counter for multi-texture shaders. + * @property textureCount + * @type Number + */ this.textureCount = 0; + + /** + * A local flag + * @property firstRun + * @type Boolean + * @private + */ this.firstRun = true; + + /** + * A dirty flag + * @property dirty + * @type Boolean + */ this.dirty = true; + /** + * Uniform attributes cache. + * @property attributes + * @type Array + * @private + */ this.attributes = []; this.init(); }; +PIXI.PixiShader.prototype.constructor = PIXI.PixiShader; + /** -* Initialises the shader +* Initialises the shader. +* * @method init -* */ PIXI.PixiShader.prototype.init = function() { @@ -71,12 +104,11 @@ this.aTextureCoord = gl.getAttribLocation(program, 'aTextureCoord'); this.colorAttribute = gl.getAttribLocation(program, 'aColor'); - // Begin worst hack eva // // WHY??? ONLY on my chrome pixel the line above returns -1 when using filters? // maybe its something to do with the current state of the gl context. - // Im convinced this is a bug in the chrome browser as there is NO reason why this should be returning -1 especially as it only manifests on my chrome pixel + // I'm convinced this is a bug in the chrome browser as there is NO reason why this should be returning -1 especially as it only manifests on my chrome pixel // If theres any webGL people that know why could happen please help :) if(this.colorAttribute === -1) { @@ -101,6 +133,7 @@ /** * Initialises the shader uniform values. +* * Uniforms are specified in the GLSL_ES Specification: http://www.khronos.org/registry/webgl/specs/latest/1.0/ * http://www.khronos.org/registry/gles/specs/2.0/GLSL_ES_Specification_1.0.17.pdf * @@ -316,7 +349,8 @@ }; /** -* Destroys the shader +* Destroys the shader. +* * @method destroy */ PIXI.PixiShader.prototype.destroy = function() @@ -329,7 +363,8 @@ }; /** -* The Default Vertex shader source +* The Default Vertex shader source. +* * @property defaultVertexSrc * @type String */ diff --git a/src/pixi/InteractionData.js b/src/pixi/InteractionData.js index ea77370..fa84a6d 100644 --- a/src/pixi/InteractionData.js +++ b/src/pixi/InteractionData.js @@ -18,7 +18,6 @@ */ this.global = new PIXI.Point(); - /** * The target Sprite that was interacted with * diff --git a/src/pixi/InteractionManager.js b/src/pixi/InteractionManager.js index 685c386..71f320b 100644 --- a/src/pixi/InteractionManager.js +++ b/src/pixi/InteractionManager.js @@ -14,7 +14,7 @@ PIXI.InteractionManager = function(stage) { /** - * a reference to the stage + * A reference to the stage * * @property stage * @type Stage @@ -22,7 +22,7 @@ this.stage = stage; /** - * the mouse data + * The mouse data * * @property mouse * @type InteractionData @@ -30,18 +30,21 @@ this.mouse = new PIXI.InteractionData(); /** - * an object that stores current touches (InteractionData) by id reference + * An object that stores current touches (InteractionData) by id reference * * @property touches * @type Object */ this.touches = {}; - // helpers + /** + * @property tempPoint + * @type Point + * @private + */ this.tempPoint = new PIXI.Point(); /** - * * @property mouseoverEnabled * @type Boolean * @default @@ -49,7 +52,7 @@ this.mouseoverEnabled = true; /** - * tiny little interactiveData pool ! + * Tiny little interactiveData pool ! * * @property pool * @type Array @@ -61,7 +64,6 @@ * @property interactiveItems * @type Array * @private - * */ this.interactiveItems = []; @@ -73,23 +75,60 @@ */ this.interactionDOMElement = null; - //this will make it so that you dont have to call bind all the time + //this will make it so that you don't have to call bind all the time + + /** + * @property onMouseMove + * @type Function + */ this.onMouseMove = this.onMouseMove.bind( this ); + + /** + * @property onMouseDown + * @type Function + */ this.onMouseDown = this.onMouseDown.bind(this); + + /** + * @property onMouseOut + * @type Function + */ this.onMouseOut = this.onMouseOut.bind(this); + + /** + * @property onMouseUp + * @type Function + */ this.onMouseUp = this.onMouseUp.bind(this); + /** + * @property onTouchStart + * @type Function + */ this.onTouchStart = this.onTouchStart.bind(this); + + /** + * @property onTouchEnd + * @type Function + */ this.onTouchEnd = this.onTouchEnd.bind(this); + + /** + * @property onTouchMove + * @type Function + */ this.onTouchMove = this.onTouchMove.bind(this); + /** + * @property last + * @type Number + */ this.last = 0; /** * The css style of the cursor that is being used * @property currentCursorStyle * @type String - * */ this.currentCursorStyle = 'inherit'; @@ -97,10 +136,13 @@ * Is set to true when the mouse is moved out of the canvas * @property mouseOut * @type Boolean - * */ this.mouseOut = false; + /** + * @property resolution + * @type Number + */ this.resolution = 1; }; @@ -166,7 +208,6 @@ this.setTargetDomElement (target.view); }; - /** * Sets the DOM element which will receive mouse/touch events. This is useful for when you have other DOM * elements on top of the renderers Canvas element. With this you'll be able to delegate another DOM element @@ -201,7 +242,10 @@ window.addEventListener('mouseup', this.onMouseUp, true); }; - +/** + * @method removeEvents + * @private + */ PIXI.InteractionManager.prototype.removeEvents = function() { if (!this.interactionDOMElement) return; @@ -308,6 +352,10 @@ } }; +/** + * @method rebuildInteractiveGraph + * @private + */ PIXI.InteractionManager.prototype.rebuildInteractiveGraph = function() { this.dirty = false; @@ -427,10 +475,10 @@ }; /** - * Is called when the mouse button is moved out of the renderer element + * Is called when the mouse is moved out of the renderer element * * @method onMouseOut - * @param event {Event} The DOM event of a mouse button being moved out + * @param event {Event} The DOM event of a mouse being moved out * @private */ PIXI.InteractionManager.prototype.onMouseOut = function(event) diff --git a/src/pixi/renderers/webgl/WebGLRenderer.js b/src/pixi/renderers/webgl/WebGLRenderer.js index 968fd3d..422896f 100644 --- a/src/pixi/renderers/webgl/WebGLRenderer.js +++ b/src/pixi/renderers/webgl/WebGLRenderer.js @@ -5,23 +5,21 @@ PIXI.glContexts = []; // this is where we store the webGL contexts for easy access. /** - * the WebGLRenderer draws the stage and all its content onto a webGL enabled canvas. This renderer - * should be used for browsers that support webGL. This Render works by automatically managing webGLBatch's. - * So no need for Sprite Batch's or Sprite Cloud's - * Dont forget to add the view to your DOM or you will not see anything :) + * The WebGLRenderer draws the stage and all its content onto a webGL enabled canvas. This renderer + * should be used for browsers that support webGL. This Render works by automatically managing webGLBatchs. + * So no need for Sprite Batches or Sprite Clouds. + * Don't forget to add the view to your DOM or you will not see anything :) * * @class WebGLRenderer * @constructor * @param [width=0] {Number} the width of the canvas view * @param [height=0] {Number} the height of the canvas view - * * @param [options] {Object} The optional renderer parameters * @param [options.view] {HTMLCanvasElement} the canvas to use as a view, optional * @param [options.transparent=false] {Boolean} If the render view is transparent, default false * @param [options.antialias=false] {Boolean} sets antialias (only applicable in chrome at the moment) * @param [options.preserveDrawingBuffer=false] {Boolean} enables drawing buffer preservation, enable this if you need to call toDataUrl on the webgl context * @param [options.resolution=1] {Number} the resolution of the renderer retina would be 2 - * */ PIXI.WebGLRenderer = function(width, height, options) { @@ -37,13 +35,16 @@ options = PIXI.defaultRenderOptions; } - if(!PIXI.defaultRenderer) { PIXI.sayHello('webGL'); PIXI.defaultRenderer = this; } + /** + * @property type + * @type Number + */ this.type = PIXI.WEBGL_RENDERER; /** @@ -56,6 +57,7 @@ this.resolution = options.resolution; // do a catch.. only 1 webGL renderer.. + /** * Whether the render view is transparent * @@ -99,12 +101,27 @@ this.view = options.view || document.createElement( 'canvas' ); // deal with losing context.. + + /** + * @property contextLostBound + * @type Function + */ this.contextLostBound = this.handleContextLost.bind(this); + + /** + * @property contextRestoredBound + * @type Function + */ this.contextRestoredBound = this.handleContextRestored.bind(this); this.view.addEventListener('webglcontextlost', this.contextLostBound, false); this.view.addEventListener('webglcontextrestored', this.contextRestoredBound, false); + /** + * @property _contextOptions + * @type Object + * @private + */ this._contextOptions = { alpha: this.transparent, antialias: options.antialias, // SPEED UP?? @@ -113,18 +130,67 @@ preserveDrawingBuffer: options.preserveDrawingBuffer }; + /** + * @property projection + * @type Point + */ this.projection = new PIXI.Point(); + + /** + * @property offset + * @type Point + */ this.offset = new PIXI.Point(0, 0); - // time to create the render managers! each one focuses on managine a state in webGL - 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(); // manages the stencil buffer - this.blendModeManager = new PIXI.WebGLBlendModeManager(); // manages the blendModes + // time to create the render managers! each one focuses on managing a state in webGL - // TODO remove + /** + * Deals with managing the shader programs and their attribs + * @property shaderManager + * @type WebGLShaderManager + */ + this.shaderManager = new PIXI.WebGLShaderManager(); + + /** + * Manages the rendering of sprites + * @property spriteBatch + * @type WebGLSpriteBatch + */ + this.spriteBatch = new PIXI.WebGLSpriteBatch(); + + /** + * Manages the masks using the stencil buffer + * @property maskManager + * @type WebGLMaskManager + */ + this.maskManager = new PIXI.WebGLMaskManager(); + + /** + * Manages the filters + * @property filterManager + * @type WebGLFilterManager + */ + this.filterManager = new PIXI.WebGLFilterManager(); + + /** + * Manages the stencil buffer + * @property stencilManager + * @type WebGLStencilManager + */ + this.stencilManager = new PIXI.WebGLStencilManager(); + + /** + * Manages the blendModes + * @property blendModeManager + * @type WebGLBlendModeManager + */ + this.blendModeManager = new PIXI.WebGLBlendModeManager(); + + /** + * TODO remove + * @property renderSession + * @type Object + */ this.renderSession = {}; this.renderSession.gl = this.gl; this.renderSession.drawCount = 0; @@ -147,6 +213,9 @@ // constructor PIXI.WebGLRenderer.prototype.constructor = PIXI.WebGLRenderer; +/** +* @method initContext +*/ PIXI.WebGLRenderer.prototype.initContext = function() { var gl = this.view.getContext('webgl', this._contextOptions) || this.view.getContext('experimental-webgl', this._contextOptions); @@ -180,7 +249,6 @@ this.resize(this.width, this.height); }; - /** * Renders the stage to its webGL view * @@ -205,9 +273,7 @@ // update the scene graph stage.updateTransform(); - var gl = this.gl; - // interaction if(stage._interactive) @@ -249,9 +315,9 @@ }; /** - * Renders a display Object + * Renders a Display Object. * - * @method renderDIsplayObject + * @method renderDisplayObject * @param displayObject {DisplayObject} The DisplayObject to render * @param projection {Point} The projection * @param buffer {Array} a standard WebGL buffer @@ -283,7 +349,7 @@ }; /** - * resizes the webGL view to the specified width and height + * Resizes the webGL view to the specified width and height. * * @method resize * @param width {Number} the new width of the webGL view @@ -297,10 +363,6 @@ this.view.width = this.width; this.view.height = this.height; - // this.view.style.width = width + 'px'; - // this.view.style.height = height + 'px'; - - // console.log(this.width / this.resolution) this.gl.viewport(0, 0, this.width, this.height); this.projection.x = this.width / 2 / this.resolution; @@ -308,10 +370,10 @@ }; /** - * Updates and Creates a WebGL texture for the renderers context + * Updates and Creates a WebGL texture for the renderers context. * * @method updateTexture - * @param texture {Texture} the texture to render + * @param texture {Texture} the texture to update */ PIXI.WebGLRenderer.prototype.updateTexture = function(texture) { @@ -411,6 +473,11 @@ this.renderSession = null; }; +/** + * Maps Pixi blend modes to WebGL blend modes. + * + * @method mapBlendModes + */ PIXI.WebGLRenderer.prototype.mapBlendModes = function() { var gl = this.gl; diff --git a/src/pixi/renderers/webgl/shaders/ComplexPrimitiveShader.js b/src/pixi/renderers/webgl/shaders/ComplexPrimitiveShader.js index daa8b64..79d038a 100644 --- a/src/pixi/renderers/webgl/shaders/ComplexPrimitiveShader.js +++ b/src/pixi/renderers/webgl/shaders/ComplexPrimitiveShader.js @@ -9,7 +9,13 @@ */ PIXI.ComplexPrimitiveShader = function(gl) { + /** + * @property _UID + * @type Number + * @private + */ this._UID = PIXI._UID++; + /** * @property gl * @type WebGLContext @@ -17,18 +23,20 @@ this.gl = gl; /** - * @property {any} program - The WebGL program. - */ + * The WebGL program. + * @property program + * @type {Any} + */ this.program = null; /** + * The fragment shader. * @property fragmentSrc * @type Array */ this.fragmentSrc = [ - 'precision mediump float;', - + 'precision mediump float;', 'varying vec4 vColor;', @@ -38,6 +46,7 @@ ]; /** + * The vertex shader. * @property vertexSrc * @type Array */ @@ -65,14 +74,15 @@ this.init(); }; +PIXI.ComplexPrimitiveShader.prototype.constructor = PIXI.ComplexPrimitiveShader; + /** -* Initialises the shader +* Initialises the shader. +* * @method init -* */ PIXI.ComplexPrimitiveShader.prototype.init = function() { - var gl = this.gl; var program = PIXI.compileProgram(gl, this.vertexSrc, this.fragmentSrc); @@ -84,7 +94,6 @@ this.tintColor = gl.getUniformLocation(program, 'tint'); this.color = gl.getUniformLocation(program, 'color'); - // get and store the attributes this.aVertexPosition = gl.getAttribLocation(program, 'aVertexPosition'); // this.colorAttribute = gl.getAttribLocation(program, 'aColor'); @@ -98,9 +107,9 @@ }; /** -* Destroys the shader +* Destroys the shader. +* * @method destroy -* */ PIXI.ComplexPrimitiveShader.prototype.destroy = function() { diff --git a/src/pixi/renderers/webgl/shaders/PixiFastShader.js b/src/pixi/renderers/webgl/shaders/PixiFastShader.js index 4fb3fe2..bb46419 100644 --- a/src/pixi/renderers/webgl/shaders/PixiFastShader.js +++ b/src/pixi/renderers/webgl/shaders/PixiFastShader.js @@ -1,6 +1,5 @@ /** * @author Mat Groves http://matgroves.com/ @Doormat23 - * @author Richard Davey http://www.photonstorm.com @photonstorm */ /** @@ -10,6 +9,11 @@ */ PIXI.PixiFastShader = function(gl) { + /** + * @property _UID + * @type Number + * @private + */ this._UID = PIXI._UID++; /** @@ -19,12 +23,16 @@ this.gl = gl; /** - * @property {any} program - The WebGL program. + * The WebGL program. + * @property program + * @type {Any} */ this.program = null; /** - * @property {array} fragmentSrc - The fragment shader. + * The fragment shader. + * @property fragmentSrc + * @type Array */ this.fragmentSrc = [ 'precision lowp float;', @@ -37,8 +45,10 @@ ]; /** - * @property {array} vertexSrc - The vertex shader - */ + * The vertex shader. + * @property vertexSrc + * @type Array + */ this.vertexSrc = [ 'attribute vec2 aVertexPosition;', 'attribute vec2 aPositionCoord;', @@ -69,24 +79,25 @@ '}' ]; - /** - * @property {number} textureCount - A local texture counter for multi-texture shaders. - */ + * A local texture counter for multi-texture shaders. + * @property textureCount + * @type Number + */ this.textureCount = 0; - this.init(); }; +PIXI.PixiFastShader.prototype.constructor = PIXI.PixiFastShader; + /** -* Initialises the shader +* Initialises the shader. +* * @method init -* */ PIXI.PixiFastShader.prototype.init = function() { - var gl = this.gl; var program = PIXI.compileProgram(gl, this.vertexSrc, this.fragmentSrc); @@ -111,8 +122,6 @@ this.aTextureCoord = gl.getAttribLocation(program, 'aTextureCoord'); this.colorAttribute = gl.getAttribLocation(program, 'aColor'); - - // Begin worst hack eva // // WHY??? ONLY on my chrome pixel the line above returns -1 when using filters? @@ -128,14 +137,13 @@ // End worst hack eva // - this.program = program; }; /** -* Destroys the shader +* Destroys the shader. +* * @method destroy -* */ PIXI.PixiFastShader.prototype.destroy = function() { diff --git a/src/pixi/renderers/webgl/shaders/PixiShader.js b/src/pixi/renderers/webgl/shaders/PixiShader.js index d76ec03..725dce2 100644 --- a/src/pixi/renderers/webgl/shaders/PixiShader.js +++ b/src/pixi/renderers/webgl/shaders/PixiShader.js @@ -6,9 +6,15 @@ /** * @class PixiShader * @constructor +* @param gl {WebGLContext} the current WebGL drawing context */ PIXI.PixiShader = function(gl) { + /** + * @property _UID + * @type Number + * @private + */ this._UID = PIXI._UID++; /** @@ -18,13 +24,17 @@ this.gl = gl; /** - * @property {any} program - The WebGL program. - */ + * The WebGL program. + * @property program + * @type {Any} + */ this.program = null; /** - * @property {array} fragmentSrc - The fragment shader. - */ + * The fragment shader. + * @property fragmentSrc + * @type Array + */ this.fragmentSrc = [ 'precision lowp float;', 'varying vec2 vTextureCoord;', @@ -36,21 +46,44 @@ ]; /** - * @property {number} textureCount - A local texture counter for multi-texture shaders. - */ + * A local texture counter for multi-texture shaders. + * @property textureCount + * @type Number + */ this.textureCount = 0; + + /** + * A local flag + * @property firstRun + * @type Boolean + * @private + */ this.firstRun = true; + + /** + * A dirty flag + * @property dirty + * @type Boolean + */ this.dirty = true; + /** + * Uniform attributes cache. + * @property attributes + * @type Array + * @private + */ this.attributes = []; this.init(); }; +PIXI.PixiShader.prototype.constructor = PIXI.PixiShader; + /** -* Initialises the shader +* Initialises the shader. +* * @method init -* */ PIXI.PixiShader.prototype.init = function() { @@ -71,12 +104,11 @@ this.aTextureCoord = gl.getAttribLocation(program, 'aTextureCoord'); this.colorAttribute = gl.getAttribLocation(program, 'aColor'); - // Begin worst hack eva // // WHY??? ONLY on my chrome pixel the line above returns -1 when using filters? // maybe its something to do with the current state of the gl context. - // Im convinced this is a bug in the chrome browser as there is NO reason why this should be returning -1 especially as it only manifests on my chrome pixel + // I'm convinced this is a bug in the chrome browser as there is NO reason why this should be returning -1 especially as it only manifests on my chrome pixel // If theres any webGL people that know why could happen please help :) if(this.colorAttribute === -1) { @@ -101,6 +133,7 @@ /** * Initialises the shader uniform values. +* * Uniforms are specified in the GLSL_ES Specification: http://www.khronos.org/registry/webgl/specs/latest/1.0/ * http://www.khronos.org/registry/gles/specs/2.0/GLSL_ES_Specification_1.0.17.pdf * @@ -316,7 +349,8 @@ }; /** -* Destroys the shader +* Destroys the shader. +* * @method destroy */ PIXI.PixiShader.prototype.destroy = function() @@ -329,7 +363,8 @@ }; /** -* The Default Vertex shader source +* The Default Vertex shader source. +* * @property defaultVertexSrc * @type String */ diff --git a/src/pixi/renderers/webgl/shaders/PrimitiveShader.js b/src/pixi/renderers/webgl/shaders/PrimitiveShader.js index 3a82be2..0f6854c 100644 --- a/src/pixi/renderers/webgl/shaders/PrimitiveShader.js +++ b/src/pixi/renderers/webgl/shaders/PrimitiveShader.js @@ -9,6 +9,11 @@ */ PIXI.PrimitiveShader = function(gl) { + /** + * @property _UID + * @type Number + * @private + */ this._UID = PIXI._UID++; /** @@ -18,11 +23,14 @@ this.gl = gl; /** - * @property {any} program - The WebGL program. - */ + * The WebGL program. + * @property program + * @type {Any} + */ this.program = null; /** + * The fragment shader. * @property fragmentSrc * @type Array */ @@ -36,6 +44,7 @@ ]; /** + * The vertex shader. * @property vertexSrc * @type Array */ @@ -60,14 +69,15 @@ this.init(); }; +PIXI.PrimitiveShader.prototype.constructor = PIXI.PrimitiveShader; + /** -* Initialises the shader +* Initialises the shader. +* * @method init -* */ PIXI.PrimitiveShader.prototype.init = function() { - var gl = this.gl; var program = PIXI.compileProgram(gl, this.vertexSrc, this.fragmentSrc); @@ -78,7 +88,6 @@ this.offsetVector = gl.getUniformLocation(program, 'offsetVector'); this.tintColor = gl.getUniformLocation(program, 'tint'); - // get and store the attributes this.aVertexPosition = gl.getAttribLocation(program, 'aVertexPosition'); this.colorAttribute = gl.getAttribLocation(program, 'aColor'); @@ -92,9 +101,9 @@ }; /** -* Destroys the shader +* Destroys the shader. +* * @method destroy -* */ PIXI.PrimitiveShader.prototype.destroy = function() { diff --git a/src/pixi/InteractionData.js b/src/pixi/InteractionData.js index ea77370..fa84a6d 100644 --- a/src/pixi/InteractionData.js +++ b/src/pixi/InteractionData.js @@ -18,7 +18,6 @@ */ this.global = new PIXI.Point(); - /** * The target Sprite that was interacted with * diff --git a/src/pixi/InteractionManager.js b/src/pixi/InteractionManager.js index 685c386..71f320b 100644 --- a/src/pixi/InteractionManager.js +++ b/src/pixi/InteractionManager.js @@ -14,7 +14,7 @@ PIXI.InteractionManager = function(stage) { /** - * a reference to the stage + * A reference to the stage * * @property stage * @type Stage @@ -22,7 +22,7 @@ this.stage = stage; /** - * the mouse data + * The mouse data * * @property mouse * @type InteractionData @@ -30,18 +30,21 @@ this.mouse = new PIXI.InteractionData(); /** - * an object that stores current touches (InteractionData) by id reference + * An object that stores current touches (InteractionData) by id reference * * @property touches * @type Object */ this.touches = {}; - // helpers + /** + * @property tempPoint + * @type Point + * @private + */ this.tempPoint = new PIXI.Point(); /** - * * @property mouseoverEnabled * @type Boolean * @default @@ -49,7 +52,7 @@ this.mouseoverEnabled = true; /** - * tiny little interactiveData pool ! + * Tiny little interactiveData pool ! * * @property pool * @type Array @@ -61,7 +64,6 @@ * @property interactiveItems * @type Array * @private - * */ this.interactiveItems = []; @@ -73,23 +75,60 @@ */ this.interactionDOMElement = null; - //this will make it so that you dont have to call bind all the time + //this will make it so that you don't have to call bind all the time + + /** + * @property onMouseMove + * @type Function + */ this.onMouseMove = this.onMouseMove.bind( this ); + + /** + * @property onMouseDown + * @type Function + */ this.onMouseDown = this.onMouseDown.bind(this); + + /** + * @property onMouseOut + * @type Function + */ this.onMouseOut = this.onMouseOut.bind(this); + + /** + * @property onMouseUp + * @type Function + */ this.onMouseUp = this.onMouseUp.bind(this); + /** + * @property onTouchStart + * @type Function + */ this.onTouchStart = this.onTouchStart.bind(this); + + /** + * @property onTouchEnd + * @type Function + */ this.onTouchEnd = this.onTouchEnd.bind(this); + + /** + * @property onTouchMove + * @type Function + */ this.onTouchMove = this.onTouchMove.bind(this); + /** + * @property last + * @type Number + */ this.last = 0; /** * The css style of the cursor that is being used * @property currentCursorStyle * @type String - * */ this.currentCursorStyle = 'inherit'; @@ -97,10 +136,13 @@ * Is set to true when the mouse is moved out of the canvas * @property mouseOut * @type Boolean - * */ this.mouseOut = false; + /** + * @property resolution + * @type Number + */ this.resolution = 1; }; @@ -166,7 +208,6 @@ this.setTargetDomElement (target.view); }; - /** * Sets the DOM element which will receive mouse/touch events. This is useful for when you have other DOM * elements on top of the renderers Canvas element. With this you'll be able to delegate another DOM element @@ -201,7 +242,10 @@ window.addEventListener('mouseup', this.onMouseUp, true); }; - +/** + * @method removeEvents + * @private + */ PIXI.InteractionManager.prototype.removeEvents = function() { if (!this.interactionDOMElement) return; @@ -308,6 +352,10 @@ } }; +/** + * @method rebuildInteractiveGraph + * @private + */ PIXI.InteractionManager.prototype.rebuildInteractiveGraph = function() { this.dirty = false; @@ -427,10 +475,10 @@ }; /** - * Is called when the mouse button is moved out of the renderer element + * Is called when the mouse is moved out of the renderer element * * @method onMouseOut - * @param event {Event} The DOM event of a mouse button being moved out + * @param event {Event} The DOM event of a mouse being moved out * @private */ PIXI.InteractionManager.prototype.onMouseOut = function(event) diff --git a/src/pixi/renderers/webgl/WebGLRenderer.js b/src/pixi/renderers/webgl/WebGLRenderer.js index 968fd3d..422896f 100644 --- a/src/pixi/renderers/webgl/WebGLRenderer.js +++ b/src/pixi/renderers/webgl/WebGLRenderer.js @@ -5,23 +5,21 @@ PIXI.glContexts = []; // this is where we store the webGL contexts for easy access. /** - * the WebGLRenderer draws the stage and all its content onto a webGL enabled canvas. This renderer - * should be used for browsers that support webGL. This Render works by automatically managing webGLBatch's. - * So no need for Sprite Batch's or Sprite Cloud's - * Dont forget to add the view to your DOM or you will not see anything :) + * The WebGLRenderer draws the stage and all its content onto a webGL enabled canvas. This renderer + * should be used for browsers that support webGL. This Render works by automatically managing webGLBatchs. + * So no need for Sprite Batches or Sprite Clouds. + * Don't forget to add the view to your DOM or you will not see anything :) * * @class WebGLRenderer * @constructor * @param [width=0] {Number} the width of the canvas view * @param [height=0] {Number} the height of the canvas view - * * @param [options] {Object} The optional renderer parameters * @param [options.view] {HTMLCanvasElement} the canvas to use as a view, optional * @param [options.transparent=false] {Boolean} If the render view is transparent, default false * @param [options.antialias=false] {Boolean} sets antialias (only applicable in chrome at the moment) * @param [options.preserveDrawingBuffer=false] {Boolean} enables drawing buffer preservation, enable this if you need to call toDataUrl on the webgl context * @param [options.resolution=1] {Number} the resolution of the renderer retina would be 2 - * */ PIXI.WebGLRenderer = function(width, height, options) { @@ -37,13 +35,16 @@ options = PIXI.defaultRenderOptions; } - if(!PIXI.defaultRenderer) { PIXI.sayHello('webGL'); PIXI.defaultRenderer = this; } + /** + * @property type + * @type Number + */ this.type = PIXI.WEBGL_RENDERER; /** @@ -56,6 +57,7 @@ this.resolution = options.resolution; // do a catch.. only 1 webGL renderer.. + /** * Whether the render view is transparent * @@ -99,12 +101,27 @@ this.view = options.view || document.createElement( 'canvas' ); // deal with losing context.. + + /** + * @property contextLostBound + * @type Function + */ this.contextLostBound = this.handleContextLost.bind(this); + + /** + * @property contextRestoredBound + * @type Function + */ this.contextRestoredBound = this.handleContextRestored.bind(this); this.view.addEventListener('webglcontextlost', this.contextLostBound, false); this.view.addEventListener('webglcontextrestored', this.contextRestoredBound, false); + /** + * @property _contextOptions + * @type Object + * @private + */ this._contextOptions = { alpha: this.transparent, antialias: options.antialias, // SPEED UP?? @@ -113,18 +130,67 @@ preserveDrawingBuffer: options.preserveDrawingBuffer }; + /** + * @property projection + * @type Point + */ this.projection = new PIXI.Point(); + + /** + * @property offset + * @type Point + */ this.offset = new PIXI.Point(0, 0); - // time to create the render managers! each one focuses on managine a state in webGL - 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(); // manages the stencil buffer - this.blendModeManager = new PIXI.WebGLBlendModeManager(); // manages the blendModes + // time to create the render managers! each one focuses on managing a state in webGL - // TODO remove + /** + * Deals with managing the shader programs and their attribs + * @property shaderManager + * @type WebGLShaderManager + */ + this.shaderManager = new PIXI.WebGLShaderManager(); + + /** + * Manages the rendering of sprites + * @property spriteBatch + * @type WebGLSpriteBatch + */ + this.spriteBatch = new PIXI.WebGLSpriteBatch(); + + /** + * Manages the masks using the stencil buffer + * @property maskManager + * @type WebGLMaskManager + */ + this.maskManager = new PIXI.WebGLMaskManager(); + + /** + * Manages the filters + * @property filterManager + * @type WebGLFilterManager + */ + this.filterManager = new PIXI.WebGLFilterManager(); + + /** + * Manages the stencil buffer + * @property stencilManager + * @type WebGLStencilManager + */ + this.stencilManager = new PIXI.WebGLStencilManager(); + + /** + * Manages the blendModes + * @property blendModeManager + * @type WebGLBlendModeManager + */ + this.blendModeManager = new PIXI.WebGLBlendModeManager(); + + /** + * TODO remove + * @property renderSession + * @type Object + */ this.renderSession = {}; this.renderSession.gl = this.gl; this.renderSession.drawCount = 0; @@ -147,6 +213,9 @@ // constructor PIXI.WebGLRenderer.prototype.constructor = PIXI.WebGLRenderer; +/** +* @method initContext +*/ PIXI.WebGLRenderer.prototype.initContext = function() { var gl = this.view.getContext('webgl', this._contextOptions) || this.view.getContext('experimental-webgl', this._contextOptions); @@ -180,7 +249,6 @@ this.resize(this.width, this.height); }; - /** * Renders the stage to its webGL view * @@ -205,9 +273,7 @@ // update the scene graph stage.updateTransform(); - var gl = this.gl; - // interaction if(stage._interactive) @@ -249,9 +315,9 @@ }; /** - * Renders a display Object + * Renders a Display Object. * - * @method renderDIsplayObject + * @method renderDisplayObject * @param displayObject {DisplayObject} The DisplayObject to render * @param projection {Point} The projection * @param buffer {Array} a standard WebGL buffer @@ -283,7 +349,7 @@ }; /** - * resizes the webGL view to the specified width and height + * Resizes the webGL view to the specified width and height. * * @method resize * @param width {Number} the new width of the webGL view @@ -297,10 +363,6 @@ this.view.width = this.width; this.view.height = this.height; - // this.view.style.width = width + 'px'; - // this.view.style.height = height + 'px'; - - // console.log(this.width / this.resolution) this.gl.viewport(0, 0, this.width, this.height); this.projection.x = this.width / 2 / this.resolution; @@ -308,10 +370,10 @@ }; /** - * Updates and Creates a WebGL texture for the renderers context + * Updates and Creates a WebGL texture for the renderers context. * * @method updateTexture - * @param texture {Texture} the texture to render + * @param texture {Texture} the texture to update */ PIXI.WebGLRenderer.prototype.updateTexture = function(texture) { @@ -411,6 +473,11 @@ this.renderSession = null; }; +/** + * Maps Pixi blend modes to WebGL blend modes. + * + * @method mapBlendModes + */ PIXI.WebGLRenderer.prototype.mapBlendModes = function() { var gl = this.gl; diff --git a/src/pixi/renderers/webgl/shaders/ComplexPrimitiveShader.js b/src/pixi/renderers/webgl/shaders/ComplexPrimitiveShader.js index daa8b64..79d038a 100644 --- a/src/pixi/renderers/webgl/shaders/ComplexPrimitiveShader.js +++ b/src/pixi/renderers/webgl/shaders/ComplexPrimitiveShader.js @@ -9,7 +9,13 @@ */ PIXI.ComplexPrimitiveShader = function(gl) { + /** + * @property _UID + * @type Number + * @private + */ this._UID = PIXI._UID++; + /** * @property gl * @type WebGLContext @@ -17,18 +23,20 @@ this.gl = gl; /** - * @property {any} program - The WebGL program. - */ + * The WebGL program. + * @property program + * @type {Any} + */ this.program = null; /** + * The fragment shader. * @property fragmentSrc * @type Array */ this.fragmentSrc = [ - 'precision mediump float;', - + 'precision mediump float;', 'varying vec4 vColor;', @@ -38,6 +46,7 @@ ]; /** + * The vertex shader. * @property vertexSrc * @type Array */ @@ -65,14 +74,15 @@ this.init(); }; +PIXI.ComplexPrimitiveShader.prototype.constructor = PIXI.ComplexPrimitiveShader; + /** -* Initialises the shader +* Initialises the shader. +* * @method init -* */ PIXI.ComplexPrimitiveShader.prototype.init = function() { - var gl = this.gl; var program = PIXI.compileProgram(gl, this.vertexSrc, this.fragmentSrc); @@ -84,7 +94,6 @@ this.tintColor = gl.getUniformLocation(program, 'tint'); this.color = gl.getUniformLocation(program, 'color'); - // get and store the attributes this.aVertexPosition = gl.getAttribLocation(program, 'aVertexPosition'); // this.colorAttribute = gl.getAttribLocation(program, 'aColor'); @@ -98,9 +107,9 @@ }; /** -* Destroys the shader +* Destroys the shader. +* * @method destroy -* */ PIXI.ComplexPrimitiveShader.prototype.destroy = function() { diff --git a/src/pixi/renderers/webgl/shaders/PixiFastShader.js b/src/pixi/renderers/webgl/shaders/PixiFastShader.js index 4fb3fe2..bb46419 100644 --- a/src/pixi/renderers/webgl/shaders/PixiFastShader.js +++ b/src/pixi/renderers/webgl/shaders/PixiFastShader.js @@ -1,6 +1,5 @@ /** * @author Mat Groves http://matgroves.com/ @Doormat23 - * @author Richard Davey http://www.photonstorm.com @photonstorm */ /** @@ -10,6 +9,11 @@ */ PIXI.PixiFastShader = function(gl) { + /** + * @property _UID + * @type Number + * @private + */ this._UID = PIXI._UID++; /** @@ -19,12 +23,16 @@ this.gl = gl; /** - * @property {any} program - The WebGL program. + * The WebGL program. + * @property program + * @type {Any} */ this.program = null; /** - * @property {array} fragmentSrc - The fragment shader. + * The fragment shader. + * @property fragmentSrc + * @type Array */ this.fragmentSrc = [ 'precision lowp float;', @@ -37,8 +45,10 @@ ]; /** - * @property {array} vertexSrc - The vertex shader - */ + * The vertex shader. + * @property vertexSrc + * @type Array + */ this.vertexSrc = [ 'attribute vec2 aVertexPosition;', 'attribute vec2 aPositionCoord;', @@ -69,24 +79,25 @@ '}' ]; - /** - * @property {number} textureCount - A local texture counter for multi-texture shaders. - */ + * A local texture counter for multi-texture shaders. + * @property textureCount + * @type Number + */ this.textureCount = 0; - this.init(); }; +PIXI.PixiFastShader.prototype.constructor = PIXI.PixiFastShader; + /** -* Initialises the shader +* Initialises the shader. +* * @method init -* */ PIXI.PixiFastShader.prototype.init = function() { - var gl = this.gl; var program = PIXI.compileProgram(gl, this.vertexSrc, this.fragmentSrc); @@ -111,8 +122,6 @@ this.aTextureCoord = gl.getAttribLocation(program, 'aTextureCoord'); this.colorAttribute = gl.getAttribLocation(program, 'aColor'); - - // Begin worst hack eva // // WHY??? ONLY on my chrome pixel the line above returns -1 when using filters? @@ -128,14 +137,13 @@ // End worst hack eva // - this.program = program; }; /** -* Destroys the shader +* Destroys the shader. +* * @method destroy -* */ PIXI.PixiFastShader.prototype.destroy = function() { diff --git a/src/pixi/renderers/webgl/shaders/PixiShader.js b/src/pixi/renderers/webgl/shaders/PixiShader.js index d76ec03..725dce2 100644 --- a/src/pixi/renderers/webgl/shaders/PixiShader.js +++ b/src/pixi/renderers/webgl/shaders/PixiShader.js @@ -6,9 +6,15 @@ /** * @class PixiShader * @constructor +* @param gl {WebGLContext} the current WebGL drawing context */ PIXI.PixiShader = function(gl) { + /** + * @property _UID + * @type Number + * @private + */ this._UID = PIXI._UID++; /** @@ -18,13 +24,17 @@ this.gl = gl; /** - * @property {any} program - The WebGL program. - */ + * The WebGL program. + * @property program + * @type {Any} + */ this.program = null; /** - * @property {array} fragmentSrc - The fragment shader. - */ + * The fragment shader. + * @property fragmentSrc + * @type Array + */ this.fragmentSrc = [ 'precision lowp float;', 'varying vec2 vTextureCoord;', @@ -36,21 +46,44 @@ ]; /** - * @property {number} textureCount - A local texture counter for multi-texture shaders. - */ + * A local texture counter for multi-texture shaders. + * @property textureCount + * @type Number + */ this.textureCount = 0; + + /** + * A local flag + * @property firstRun + * @type Boolean + * @private + */ this.firstRun = true; + + /** + * A dirty flag + * @property dirty + * @type Boolean + */ this.dirty = true; + /** + * Uniform attributes cache. + * @property attributes + * @type Array + * @private + */ this.attributes = []; this.init(); }; +PIXI.PixiShader.prototype.constructor = PIXI.PixiShader; + /** -* Initialises the shader +* Initialises the shader. +* * @method init -* */ PIXI.PixiShader.prototype.init = function() { @@ -71,12 +104,11 @@ this.aTextureCoord = gl.getAttribLocation(program, 'aTextureCoord'); this.colorAttribute = gl.getAttribLocation(program, 'aColor'); - // Begin worst hack eva // // WHY??? ONLY on my chrome pixel the line above returns -1 when using filters? // maybe its something to do with the current state of the gl context. - // Im convinced this is a bug in the chrome browser as there is NO reason why this should be returning -1 especially as it only manifests on my chrome pixel + // I'm convinced this is a bug in the chrome browser as there is NO reason why this should be returning -1 especially as it only manifests on my chrome pixel // If theres any webGL people that know why could happen please help :) if(this.colorAttribute === -1) { @@ -101,6 +133,7 @@ /** * Initialises the shader uniform values. +* * Uniforms are specified in the GLSL_ES Specification: http://www.khronos.org/registry/webgl/specs/latest/1.0/ * http://www.khronos.org/registry/gles/specs/2.0/GLSL_ES_Specification_1.0.17.pdf * @@ -316,7 +349,8 @@ }; /** -* Destroys the shader +* Destroys the shader. +* * @method destroy */ PIXI.PixiShader.prototype.destroy = function() @@ -329,7 +363,8 @@ }; /** -* The Default Vertex shader source +* The Default Vertex shader source. +* * @property defaultVertexSrc * @type String */ diff --git a/src/pixi/renderers/webgl/shaders/PrimitiveShader.js b/src/pixi/renderers/webgl/shaders/PrimitiveShader.js index 3a82be2..0f6854c 100644 --- a/src/pixi/renderers/webgl/shaders/PrimitiveShader.js +++ b/src/pixi/renderers/webgl/shaders/PrimitiveShader.js @@ -9,6 +9,11 @@ */ PIXI.PrimitiveShader = function(gl) { + /** + * @property _UID + * @type Number + * @private + */ this._UID = PIXI._UID++; /** @@ -18,11 +23,14 @@ this.gl = gl; /** - * @property {any} program - The WebGL program. - */ + * The WebGL program. + * @property program + * @type {Any} + */ this.program = null; /** + * The fragment shader. * @property fragmentSrc * @type Array */ @@ -36,6 +44,7 @@ ]; /** + * The vertex shader. * @property vertexSrc * @type Array */ @@ -60,14 +69,15 @@ this.init(); }; +PIXI.PrimitiveShader.prototype.constructor = PIXI.PrimitiveShader; + /** -* Initialises the shader +* Initialises the shader. +* * @method init -* */ PIXI.PrimitiveShader.prototype.init = function() { - var gl = this.gl; var program = PIXI.compileProgram(gl, this.vertexSrc, this.fragmentSrc); @@ -78,7 +88,6 @@ this.offsetVector = gl.getUniformLocation(program, 'offsetVector'); this.tintColor = gl.getUniformLocation(program, 'tint'); - // get and store the attributes this.aVertexPosition = gl.getAttribLocation(program, 'aVertexPosition'); this.colorAttribute = gl.getAttribLocation(program, 'aColor'); @@ -92,9 +101,9 @@ }; /** -* Destroys the shader +* Destroys the shader. +* * @method destroy -* */ PIXI.PrimitiveShader.prototype.destroy = function() { diff --git a/src/pixi/renderers/webgl/shaders/StripShader.js b/src/pixi/renderers/webgl/shaders/StripShader.js index 11f13ad..8fefe51 100644 --- a/src/pixi/renderers/webgl/shaders/StripShader.js +++ b/src/pixi/renderers/webgl/shaders/StripShader.js @@ -2,20 +2,37 @@ * @author Mat Groves http://matgroves.com/ @Doormat23 */ - +/** +* @class StripShader +* @constructor +* @param gl {WebGLContext} the current WebGL drawing context +*/ PIXI.StripShader = function(gl) { + /** + * @property _UID + * @type Number + * @private + */ this._UID = PIXI._UID++; + /** + * @property gl + * @type WebGLContext + */ this.gl = gl; /** - * @property {any} program - The WebGL program. - */ + * The WebGL program. + * @property program + * @type {Any} + */ this.program = null; /** - * @property {array} fragmentSrc - The fragment shader. + * The fragment shader. + * @property fragmentSrc + * @type Array */ this.fragmentSrc = [ 'precision mediump float;', @@ -30,9 +47,11 @@ '}' ]; - /** - * @property {array} fragmentSrc - The fragment shader. - */ + /** + * The vertex shader. + * @property vertexSrc + * @type Array + */ this.vertexSrc = [ 'attribute vec2 aVertexPosition;', 'attribute vec2 aTextureCoord;', @@ -56,10 +75,12 @@ this.init(); }; +PIXI.StripShader.prototype.constructor = PIXI.StripShader; + /** -* Initialises the shader +* Initialises the shader. +* * @method init -* */ PIXI.StripShader.prototype.init = function() { @@ -88,9 +109,9 @@ }; /** -* Destroys the shader +* Destroys the shader. +* * @method destroy -* */ PIXI.StripShader.prototype.destroy = function() { diff --git a/src/pixi/InteractionData.js b/src/pixi/InteractionData.js index ea77370..fa84a6d 100644 --- a/src/pixi/InteractionData.js +++ b/src/pixi/InteractionData.js @@ -18,7 +18,6 @@ */ this.global = new PIXI.Point(); - /** * The target Sprite that was interacted with * diff --git a/src/pixi/InteractionManager.js b/src/pixi/InteractionManager.js index 685c386..71f320b 100644 --- a/src/pixi/InteractionManager.js +++ b/src/pixi/InteractionManager.js @@ -14,7 +14,7 @@ PIXI.InteractionManager = function(stage) { /** - * a reference to the stage + * A reference to the stage * * @property stage * @type Stage @@ -22,7 +22,7 @@ this.stage = stage; /** - * the mouse data + * The mouse data * * @property mouse * @type InteractionData @@ -30,18 +30,21 @@ this.mouse = new PIXI.InteractionData(); /** - * an object that stores current touches (InteractionData) by id reference + * An object that stores current touches (InteractionData) by id reference * * @property touches * @type Object */ this.touches = {}; - // helpers + /** + * @property tempPoint + * @type Point + * @private + */ this.tempPoint = new PIXI.Point(); /** - * * @property mouseoverEnabled * @type Boolean * @default @@ -49,7 +52,7 @@ this.mouseoverEnabled = true; /** - * tiny little interactiveData pool ! + * Tiny little interactiveData pool ! * * @property pool * @type Array @@ -61,7 +64,6 @@ * @property interactiveItems * @type Array * @private - * */ this.interactiveItems = []; @@ -73,23 +75,60 @@ */ this.interactionDOMElement = null; - //this will make it so that you dont have to call bind all the time + //this will make it so that you don't have to call bind all the time + + /** + * @property onMouseMove + * @type Function + */ this.onMouseMove = this.onMouseMove.bind( this ); + + /** + * @property onMouseDown + * @type Function + */ this.onMouseDown = this.onMouseDown.bind(this); + + /** + * @property onMouseOut + * @type Function + */ this.onMouseOut = this.onMouseOut.bind(this); + + /** + * @property onMouseUp + * @type Function + */ this.onMouseUp = this.onMouseUp.bind(this); + /** + * @property onTouchStart + * @type Function + */ this.onTouchStart = this.onTouchStart.bind(this); + + /** + * @property onTouchEnd + * @type Function + */ this.onTouchEnd = this.onTouchEnd.bind(this); + + /** + * @property onTouchMove + * @type Function + */ this.onTouchMove = this.onTouchMove.bind(this); + /** + * @property last + * @type Number + */ this.last = 0; /** * The css style of the cursor that is being used * @property currentCursorStyle * @type String - * */ this.currentCursorStyle = 'inherit'; @@ -97,10 +136,13 @@ * Is set to true when the mouse is moved out of the canvas * @property mouseOut * @type Boolean - * */ this.mouseOut = false; + /** + * @property resolution + * @type Number + */ this.resolution = 1; }; @@ -166,7 +208,6 @@ this.setTargetDomElement (target.view); }; - /** * Sets the DOM element which will receive mouse/touch events. This is useful for when you have other DOM * elements on top of the renderers Canvas element. With this you'll be able to delegate another DOM element @@ -201,7 +242,10 @@ window.addEventListener('mouseup', this.onMouseUp, true); }; - +/** + * @method removeEvents + * @private + */ PIXI.InteractionManager.prototype.removeEvents = function() { if (!this.interactionDOMElement) return; @@ -308,6 +352,10 @@ } }; +/** + * @method rebuildInteractiveGraph + * @private + */ PIXI.InteractionManager.prototype.rebuildInteractiveGraph = function() { this.dirty = false; @@ -427,10 +475,10 @@ }; /** - * Is called when the mouse button is moved out of the renderer element + * Is called when the mouse is moved out of the renderer element * * @method onMouseOut - * @param event {Event} The DOM event of a mouse button being moved out + * @param event {Event} The DOM event of a mouse being moved out * @private */ PIXI.InteractionManager.prototype.onMouseOut = function(event) diff --git a/src/pixi/renderers/webgl/WebGLRenderer.js b/src/pixi/renderers/webgl/WebGLRenderer.js index 968fd3d..422896f 100644 --- a/src/pixi/renderers/webgl/WebGLRenderer.js +++ b/src/pixi/renderers/webgl/WebGLRenderer.js @@ -5,23 +5,21 @@ PIXI.glContexts = []; // this is where we store the webGL contexts for easy access. /** - * the WebGLRenderer draws the stage and all its content onto a webGL enabled canvas. This renderer - * should be used for browsers that support webGL. This Render works by automatically managing webGLBatch's. - * So no need for Sprite Batch's or Sprite Cloud's - * Dont forget to add the view to your DOM or you will not see anything :) + * The WebGLRenderer draws the stage and all its content onto a webGL enabled canvas. This renderer + * should be used for browsers that support webGL. This Render works by automatically managing webGLBatchs. + * So no need for Sprite Batches or Sprite Clouds. + * Don't forget to add the view to your DOM or you will not see anything :) * * @class WebGLRenderer * @constructor * @param [width=0] {Number} the width of the canvas view * @param [height=0] {Number} the height of the canvas view - * * @param [options] {Object} The optional renderer parameters * @param [options.view] {HTMLCanvasElement} the canvas to use as a view, optional * @param [options.transparent=false] {Boolean} If the render view is transparent, default false * @param [options.antialias=false] {Boolean} sets antialias (only applicable in chrome at the moment) * @param [options.preserveDrawingBuffer=false] {Boolean} enables drawing buffer preservation, enable this if you need to call toDataUrl on the webgl context * @param [options.resolution=1] {Number} the resolution of the renderer retina would be 2 - * */ PIXI.WebGLRenderer = function(width, height, options) { @@ -37,13 +35,16 @@ options = PIXI.defaultRenderOptions; } - if(!PIXI.defaultRenderer) { PIXI.sayHello('webGL'); PIXI.defaultRenderer = this; } + /** + * @property type + * @type Number + */ this.type = PIXI.WEBGL_RENDERER; /** @@ -56,6 +57,7 @@ this.resolution = options.resolution; // do a catch.. only 1 webGL renderer.. + /** * Whether the render view is transparent * @@ -99,12 +101,27 @@ this.view = options.view || document.createElement( 'canvas' ); // deal with losing context.. + + /** + * @property contextLostBound + * @type Function + */ this.contextLostBound = this.handleContextLost.bind(this); + + /** + * @property contextRestoredBound + * @type Function + */ this.contextRestoredBound = this.handleContextRestored.bind(this); this.view.addEventListener('webglcontextlost', this.contextLostBound, false); this.view.addEventListener('webglcontextrestored', this.contextRestoredBound, false); + /** + * @property _contextOptions + * @type Object + * @private + */ this._contextOptions = { alpha: this.transparent, antialias: options.antialias, // SPEED UP?? @@ -113,18 +130,67 @@ preserveDrawingBuffer: options.preserveDrawingBuffer }; + /** + * @property projection + * @type Point + */ this.projection = new PIXI.Point(); + + /** + * @property offset + * @type Point + */ this.offset = new PIXI.Point(0, 0); - // time to create the render managers! each one focuses on managine a state in webGL - 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(); // manages the stencil buffer - this.blendModeManager = new PIXI.WebGLBlendModeManager(); // manages the blendModes + // time to create the render managers! each one focuses on managing a state in webGL - // TODO remove + /** + * Deals with managing the shader programs and their attribs + * @property shaderManager + * @type WebGLShaderManager + */ + this.shaderManager = new PIXI.WebGLShaderManager(); + + /** + * Manages the rendering of sprites + * @property spriteBatch + * @type WebGLSpriteBatch + */ + this.spriteBatch = new PIXI.WebGLSpriteBatch(); + + /** + * Manages the masks using the stencil buffer + * @property maskManager + * @type WebGLMaskManager + */ + this.maskManager = new PIXI.WebGLMaskManager(); + + /** + * Manages the filters + * @property filterManager + * @type WebGLFilterManager + */ + this.filterManager = new PIXI.WebGLFilterManager(); + + /** + * Manages the stencil buffer + * @property stencilManager + * @type WebGLStencilManager + */ + this.stencilManager = new PIXI.WebGLStencilManager(); + + /** + * Manages the blendModes + * @property blendModeManager + * @type WebGLBlendModeManager + */ + this.blendModeManager = new PIXI.WebGLBlendModeManager(); + + /** + * TODO remove + * @property renderSession + * @type Object + */ this.renderSession = {}; this.renderSession.gl = this.gl; this.renderSession.drawCount = 0; @@ -147,6 +213,9 @@ // constructor PIXI.WebGLRenderer.prototype.constructor = PIXI.WebGLRenderer; +/** +* @method initContext +*/ PIXI.WebGLRenderer.prototype.initContext = function() { var gl = this.view.getContext('webgl', this._contextOptions) || this.view.getContext('experimental-webgl', this._contextOptions); @@ -180,7 +249,6 @@ this.resize(this.width, this.height); }; - /** * Renders the stage to its webGL view * @@ -205,9 +273,7 @@ // update the scene graph stage.updateTransform(); - var gl = this.gl; - // interaction if(stage._interactive) @@ -249,9 +315,9 @@ }; /** - * Renders a display Object + * Renders a Display Object. * - * @method renderDIsplayObject + * @method renderDisplayObject * @param displayObject {DisplayObject} The DisplayObject to render * @param projection {Point} The projection * @param buffer {Array} a standard WebGL buffer @@ -283,7 +349,7 @@ }; /** - * resizes the webGL view to the specified width and height + * Resizes the webGL view to the specified width and height. * * @method resize * @param width {Number} the new width of the webGL view @@ -297,10 +363,6 @@ this.view.width = this.width; this.view.height = this.height; - // this.view.style.width = width + 'px'; - // this.view.style.height = height + 'px'; - - // console.log(this.width / this.resolution) this.gl.viewport(0, 0, this.width, this.height); this.projection.x = this.width / 2 / this.resolution; @@ -308,10 +370,10 @@ }; /** - * Updates and Creates a WebGL texture for the renderers context + * Updates and Creates a WebGL texture for the renderers context. * * @method updateTexture - * @param texture {Texture} the texture to render + * @param texture {Texture} the texture to update */ PIXI.WebGLRenderer.prototype.updateTexture = function(texture) { @@ -411,6 +473,11 @@ this.renderSession = null; }; +/** + * Maps Pixi blend modes to WebGL blend modes. + * + * @method mapBlendModes + */ PIXI.WebGLRenderer.prototype.mapBlendModes = function() { var gl = this.gl; diff --git a/src/pixi/renderers/webgl/shaders/ComplexPrimitiveShader.js b/src/pixi/renderers/webgl/shaders/ComplexPrimitiveShader.js index daa8b64..79d038a 100644 --- a/src/pixi/renderers/webgl/shaders/ComplexPrimitiveShader.js +++ b/src/pixi/renderers/webgl/shaders/ComplexPrimitiveShader.js @@ -9,7 +9,13 @@ */ PIXI.ComplexPrimitiveShader = function(gl) { + /** + * @property _UID + * @type Number + * @private + */ this._UID = PIXI._UID++; + /** * @property gl * @type WebGLContext @@ -17,18 +23,20 @@ this.gl = gl; /** - * @property {any} program - The WebGL program. - */ + * The WebGL program. + * @property program + * @type {Any} + */ this.program = null; /** + * The fragment shader. * @property fragmentSrc * @type Array */ this.fragmentSrc = [ - 'precision mediump float;', - + 'precision mediump float;', 'varying vec4 vColor;', @@ -38,6 +46,7 @@ ]; /** + * The vertex shader. * @property vertexSrc * @type Array */ @@ -65,14 +74,15 @@ this.init(); }; +PIXI.ComplexPrimitiveShader.prototype.constructor = PIXI.ComplexPrimitiveShader; + /** -* Initialises the shader +* Initialises the shader. +* * @method init -* */ PIXI.ComplexPrimitiveShader.prototype.init = function() { - var gl = this.gl; var program = PIXI.compileProgram(gl, this.vertexSrc, this.fragmentSrc); @@ -84,7 +94,6 @@ this.tintColor = gl.getUniformLocation(program, 'tint'); this.color = gl.getUniformLocation(program, 'color'); - // get and store the attributes this.aVertexPosition = gl.getAttribLocation(program, 'aVertexPosition'); // this.colorAttribute = gl.getAttribLocation(program, 'aColor'); @@ -98,9 +107,9 @@ }; /** -* Destroys the shader +* Destroys the shader. +* * @method destroy -* */ PIXI.ComplexPrimitiveShader.prototype.destroy = function() { diff --git a/src/pixi/renderers/webgl/shaders/PixiFastShader.js b/src/pixi/renderers/webgl/shaders/PixiFastShader.js index 4fb3fe2..bb46419 100644 --- a/src/pixi/renderers/webgl/shaders/PixiFastShader.js +++ b/src/pixi/renderers/webgl/shaders/PixiFastShader.js @@ -1,6 +1,5 @@ /** * @author Mat Groves http://matgroves.com/ @Doormat23 - * @author Richard Davey http://www.photonstorm.com @photonstorm */ /** @@ -10,6 +9,11 @@ */ PIXI.PixiFastShader = function(gl) { + /** + * @property _UID + * @type Number + * @private + */ this._UID = PIXI._UID++; /** @@ -19,12 +23,16 @@ this.gl = gl; /** - * @property {any} program - The WebGL program. + * The WebGL program. + * @property program + * @type {Any} */ this.program = null; /** - * @property {array} fragmentSrc - The fragment shader. + * The fragment shader. + * @property fragmentSrc + * @type Array */ this.fragmentSrc = [ 'precision lowp float;', @@ -37,8 +45,10 @@ ]; /** - * @property {array} vertexSrc - The vertex shader - */ + * The vertex shader. + * @property vertexSrc + * @type Array + */ this.vertexSrc = [ 'attribute vec2 aVertexPosition;', 'attribute vec2 aPositionCoord;', @@ -69,24 +79,25 @@ '}' ]; - /** - * @property {number} textureCount - A local texture counter for multi-texture shaders. - */ + * A local texture counter for multi-texture shaders. + * @property textureCount + * @type Number + */ this.textureCount = 0; - this.init(); }; +PIXI.PixiFastShader.prototype.constructor = PIXI.PixiFastShader; + /** -* Initialises the shader +* Initialises the shader. +* * @method init -* */ PIXI.PixiFastShader.prototype.init = function() { - var gl = this.gl; var program = PIXI.compileProgram(gl, this.vertexSrc, this.fragmentSrc); @@ -111,8 +122,6 @@ this.aTextureCoord = gl.getAttribLocation(program, 'aTextureCoord'); this.colorAttribute = gl.getAttribLocation(program, 'aColor'); - - // Begin worst hack eva // // WHY??? ONLY on my chrome pixel the line above returns -1 when using filters? @@ -128,14 +137,13 @@ // End worst hack eva // - this.program = program; }; /** -* Destroys the shader +* Destroys the shader. +* * @method destroy -* */ PIXI.PixiFastShader.prototype.destroy = function() { diff --git a/src/pixi/renderers/webgl/shaders/PixiShader.js b/src/pixi/renderers/webgl/shaders/PixiShader.js index d76ec03..725dce2 100644 --- a/src/pixi/renderers/webgl/shaders/PixiShader.js +++ b/src/pixi/renderers/webgl/shaders/PixiShader.js @@ -6,9 +6,15 @@ /** * @class PixiShader * @constructor +* @param gl {WebGLContext} the current WebGL drawing context */ PIXI.PixiShader = function(gl) { + /** + * @property _UID + * @type Number + * @private + */ this._UID = PIXI._UID++; /** @@ -18,13 +24,17 @@ this.gl = gl; /** - * @property {any} program - The WebGL program. - */ + * The WebGL program. + * @property program + * @type {Any} + */ this.program = null; /** - * @property {array} fragmentSrc - The fragment shader. - */ + * The fragment shader. + * @property fragmentSrc + * @type Array + */ this.fragmentSrc = [ 'precision lowp float;', 'varying vec2 vTextureCoord;', @@ -36,21 +46,44 @@ ]; /** - * @property {number} textureCount - A local texture counter for multi-texture shaders. - */ + * A local texture counter for multi-texture shaders. + * @property textureCount + * @type Number + */ this.textureCount = 0; + + /** + * A local flag + * @property firstRun + * @type Boolean + * @private + */ this.firstRun = true; + + /** + * A dirty flag + * @property dirty + * @type Boolean + */ this.dirty = true; + /** + * Uniform attributes cache. + * @property attributes + * @type Array + * @private + */ this.attributes = []; this.init(); }; +PIXI.PixiShader.prototype.constructor = PIXI.PixiShader; + /** -* Initialises the shader +* Initialises the shader. +* * @method init -* */ PIXI.PixiShader.prototype.init = function() { @@ -71,12 +104,11 @@ this.aTextureCoord = gl.getAttribLocation(program, 'aTextureCoord'); this.colorAttribute = gl.getAttribLocation(program, 'aColor'); - // Begin worst hack eva // // WHY??? ONLY on my chrome pixel the line above returns -1 when using filters? // maybe its something to do with the current state of the gl context. - // Im convinced this is a bug in the chrome browser as there is NO reason why this should be returning -1 especially as it only manifests on my chrome pixel + // I'm convinced this is a bug in the chrome browser as there is NO reason why this should be returning -1 especially as it only manifests on my chrome pixel // If theres any webGL people that know why could happen please help :) if(this.colorAttribute === -1) { @@ -101,6 +133,7 @@ /** * Initialises the shader uniform values. +* * Uniforms are specified in the GLSL_ES Specification: http://www.khronos.org/registry/webgl/specs/latest/1.0/ * http://www.khronos.org/registry/gles/specs/2.0/GLSL_ES_Specification_1.0.17.pdf * @@ -316,7 +349,8 @@ }; /** -* Destroys the shader +* Destroys the shader. +* * @method destroy */ PIXI.PixiShader.prototype.destroy = function() @@ -329,7 +363,8 @@ }; /** -* The Default Vertex shader source +* The Default Vertex shader source. +* * @property defaultVertexSrc * @type String */ diff --git a/src/pixi/renderers/webgl/shaders/PrimitiveShader.js b/src/pixi/renderers/webgl/shaders/PrimitiveShader.js index 3a82be2..0f6854c 100644 --- a/src/pixi/renderers/webgl/shaders/PrimitiveShader.js +++ b/src/pixi/renderers/webgl/shaders/PrimitiveShader.js @@ -9,6 +9,11 @@ */ PIXI.PrimitiveShader = function(gl) { + /** + * @property _UID + * @type Number + * @private + */ this._UID = PIXI._UID++; /** @@ -18,11 +23,14 @@ this.gl = gl; /** - * @property {any} program - The WebGL program. - */ + * The WebGL program. + * @property program + * @type {Any} + */ this.program = null; /** + * The fragment shader. * @property fragmentSrc * @type Array */ @@ -36,6 +44,7 @@ ]; /** + * The vertex shader. * @property vertexSrc * @type Array */ @@ -60,14 +69,15 @@ this.init(); }; +PIXI.PrimitiveShader.prototype.constructor = PIXI.PrimitiveShader; + /** -* Initialises the shader +* Initialises the shader. +* * @method init -* */ PIXI.PrimitiveShader.prototype.init = function() { - var gl = this.gl; var program = PIXI.compileProgram(gl, this.vertexSrc, this.fragmentSrc); @@ -78,7 +88,6 @@ this.offsetVector = gl.getUniformLocation(program, 'offsetVector'); this.tintColor = gl.getUniformLocation(program, 'tint'); - // get and store the attributes this.aVertexPosition = gl.getAttribLocation(program, 'aVertexPosition'); this.colorAttribute = gl.getAttribLocation(program, 'aColor'); @@ -92,9 +101,9 @@ }; /** -* Destroys the shader +* Destroys the shader. +* * @method destroy -* */ PIXI.PrimitiveShader.prototype.destroy = function() { diff --git a/src/pixi/renderers/webgl/shaders/StripShader.js b/src/pixi/renderers/webgl/shaders/StripShader.js index 11f13ad..8fefe51 100644 --- a/src/pixi/renderers/webgl/shaders/StripShader.js +++ b/src/pixi/renderers/webgl/shaders/StripShader.js @@ -2,20 +2,37 @@ * @author Mat Groves http://matgroves.com/ @Doormat23 */ - +/** +* @class StripShader +* @constructor +* @param gl {WebGLContext} the current WebGL drawing context +*/ PIXI.StripShader = function(gl) { + /** + * @property _UID + * @type Number + * @private + */ this._UID = PIXI._UID++; + /** + * @property gl + * @type WebGLContext + */ this.gl = gl; /** - * @property {any} program - The WebGL program. - */ + * The WebGL program. + * @property program + * @type {Any} + */ this.program = null; /** - * @property {array} fragmentSrc - The fragment shader. + * The fragment shader. + * @property fragmentSrc + * @type Array */ this.fragmentSrc = [ 'precision mediump float;', @@ -30,9 +47,11 @@ '}' ]; - /** - * @property {array} fragmentSrc - The fragment shader. - */ + /** + * The vertex shader. + * @property vertexSrc + * @type Array + */ this.vertexSrc = [ 'attribute vec2 aVertexPosition;', 'attribute vec2 aTextureCoord;', @@ -56,10 +75,12 @@ this.init(); }; +PIXI.StripShader.prototype.constructor = PIXI.StripShader; + /** -* Initialises the shader +* Initialises the shader. +* * @method init -* */ PIXI.StripShader.prototype.init = function() { @@ -88,9 +109,9 @@ }; /** -* Destroys the shader +* Destroys the shader. +* * @method destroy -* */ PIXI.StripShader.prototype.destroy = function() { diff --git a/src/pixi/renderers/webgl/utils/FilterTexture.js b/src/pixi/renderers/webgl/utils/FilterTexture.js index 9dada23..389acbe 100644 --- a/src/pixi/renderers/webgl/utils/FilterTexture.js +++ b/src/pixi/renderers/webgl/utils/FilterTexture.js @@ -9,7 +9,6 @@ * @param width {Number} the horizontal range of the filter * @param height {Number} the vertical range of the filter * @param scaleMode {Number} Should be one of the PIXI.scaleMode consts -* @private */ PIXI.FilterTexture = function(gl, width, height, scaleMode) { @@ -19,11 +18,24 @@ */ this.gl = gl; - // next time to create a frame buffer and texture + + /** + * @property frameBuffer + * @type Any + */ this.frameBuffer = gl.createFramebuffer(); + + /** + * @property texture + * @type Any + */ this.texture = gl.createTexture(); + /** + * @property scaleMode + * @type Number + */ scaleMode = scaleMode || PIXI.scaleModes.DEFAULT; gl.bindTexture(gl.TEXTURE_2D, this.texture); @@ -44,9 +56,11 @@ this.resize(width, height); }; +PIXI.FilterTexture.prototype.constructor = PIXI.FilterTexture; /** -* Clears the filter texture +* Clears the filter texture. +* * @method clear */ PIXI.FilterTexture.prototype.clear = function() @@ -75,14 +89,14 @@ gl.bindTexture(gl.TEXTURE_2D, this.texture); gl.texImage2D(gl.TEXTURE_2D, 0, gl.RGBA, width , height , 0, gl.RGBA, gl.UNSIGNED_BYTE, null); - // console.log( width, width ) // update the stencil buffer width and height gl.bindRenderbuffer(gl.RENDERBUFFER, this.renderBuffer); gl.renderbufferStorage(gl.RENDERBUFFER, gl.DEPTH_STENCIL, width , height ); }; /** -* Destroys the filter texture +* Destroys the filter texture. +* * @method destroy */ PIXI.FilterTexture.prototype.destroy = function() diff --git a/src/pixi/InteractionData.js b/src/pixi/InteractionData.js index ea77370..fa84a6d 100644 --- a/src/pixi/InteractionData.js +++ b/src/pixi/InteractionData.js @@ -18,7 +18,6 @@ */ this.global = new PIXI.Point(); - /** * The target Sprite that was interacted with * diff --git a/src/pixi/InteractionManager.js b/src/pixi/InteractionManager.js index 685c386..71f320b 100644 --- a/src/pixi/InteractionManager.js +++ b/src/pixi/InteractionManager.js @@ -14,7 +14,7 @@ PIXI.InteractionManager = function(stage) { /** - * a reference to the stage + * A reference to the stage * * @property stage * @type Stage @@ -22,7 +22,7 @@ this.stage = stage; /** - * the mouse data + * The mouse data * * @property mouse * @type InteractionData @@ -30,18 +30,21 @@ this.mouse = new PIXI.InteractionData(); /** - * an object that stores current touches (InteractionData) by id reference + * An object that stores current touches (InteractionData) by id reference * * @property touches * @type Object */ this.touches = {}; - // helpers + /** + * @property tempPoint + * @type Point + * @private + */ this.tempPoint = new PIXI.Point(); /** - * * @property mouseoverEnabled * @type Boolean * @default @@ -49,7 +52,7 @@ this.mouseoverEnabled = true; /** - * tiny little interactiveData pool ! + * Tiny little interactiveData pool ! * * @property pool * @type Array @@ -61,7 +64,6 @@ * @property interactiveItems * @type Array * @private - * */ this.interactiveItems = []; @@ -73,23 +75,60 @@ */ this.interactionDOMElement = null; - //this will make it so that you dont have to call bind all the time + //this will make it so that you don't have to call bind all the time + + /** + * @property onMouseMove + * @type Function + */ this.onMouseMove = this.onMouseMove.bind( this ); + + /** + * @property onMouseDown + * @type Function + */ this.onMouseDown = this.onMouseDown.bind(this); + + /** + * @property onMouseOut + * @type Function + */ this.onMouseOut = this.onMouseOut.bind(this); + + /** + * @property onMouseUp + * @type Function + */ this.onMouseUp = this.onMouseUp.bind(this); + /** + * @property onTouchStart + * @type Function + */ this.onTouchStart = this.onTouchStart.bind(this); + + /** + * @property onTouchEnd + * @type Function + */ this.onTouchEnd = this.onTouchEnd.bind(this); + + /** + * @property onTouchMove + * @type Function + */ this.onTouchMove = this.onTouchMove.bind(this); + /** + * @property last + * @type Number + */ this.last = 0; /** * The css style of the cursor that is being used * @property currentCursorStyle * @type String - * */ this.currentCursorStyle = 'inherit'; @@ -97,10 +136,13 @@ * Is set to true when the mouse is moved out of the canvas * @property mouseOut * @type Boolean - * */ this.mouseOut = false; + /** + * @property resolution + * @type Number + */ this.resolution = 1; }; @@ -166,7 +208,6 @@ this.setTargetDomElement (target.view); }; - /** * Sets the DOM element which will receive mouse/touch events. This is useful for when you have other DOM * elements on top of the renderers Canvas element. With this you'll be able to delegate another DOM element @@ -201,7 +242,10 @@ window.addEventListener('mouseup', this.onMouseUp, true); }; - +/** + * @method removeEvents + * @private + */ PIXI.InteractionManager.prototype.removeEvents = function() { if (!this.interactionDOMElement) return; @@ -308,6 +352,10 @@ } }; +/** + * @method rebuildInteractiveGraph + * @private + */ PIXI.InteractionManager.prototype.rebuildInteractiveGraph = function() { this.dirty = false; @@ -427,10 +475,10 @@ }; /** - * Is called when the mouse button is moved out of the renderer element + * Is called when the mouse is moved out of the renderer element * * @method onMouseOut - * @param event {Event} The DOM event of a mouse button being moved out + * @param event {Event} The DOM event of a mouse being moved out * @private */ PIXI.InteractionManager.prototype.onMouseOut = function(event) diff --git a/src/pixi/renderers/webgl/WebGLRenderer.js b/src/pixi/renderers/webgl/WebGLRenderer.js index 968fd3d..422896f 100644 --- a/src/pixi/renderers/webgl/WebGLRenderer.js +++ b/src/pixi/renderers/webgl/WebGLRenderer.js @@ -5,23 +5,21 @@ PIXI.glContexts = []; // this is where we store the webGL contexts for easy access. /** - * the WebGLRenderer draws the stage and all its content onto a webGL enabled canvas. This renderer - * should be used for browsers that support webGL. This Render works by automatically managing webGLBatch's. - * So no need for Sprite Batch's or Sprite Cloud's - * Dont forget to add the view to your DOM or you will not see anything :) + * The WebGLRenderer draws the stage and all its content onto a webGL enabled canvas. This renderer + * should be used for browsers that support webGL. This Render works by automatically managing webGLBatchs. + * So no need for Sprite Batches or Sprite Clouds. + * Don't forget to add the view to your DOM or you will not see anything :) * * @class WebGLRenderer * @constructor * @param [width=0] {Number} the width of the canvas view * @param [height=0] {Number} the height of the canvas view - * * @param [options] {Object} The optional renderer parameters * @param [options.view] {HTMLCanvasElement} the canvas to use as a view, optional * @param [options.transparent=false] {Boolean} If the render view is transparent, default false * @param [options.antialias=false] {Boolean} sets antialias (only applicable in chrome at the moment) * @param [options.preserveDrawingBuffer=false] {Boolean} enables drawing buffer preservation, enable this if you need to call toDataUrl on the webgl context * @param [options.resolution=1] {Number} the resolution of the renderer retina would be 2 - * */ PIXI.WebGLRenderer = function(width, height, options) { @@ -37,13 +35,16 @@ options = PIXI.defaultRenderOptions; } - if(!PIXI.defaultRenderer) { PIXI.sayHello('webGL'); PIXI.defaultRenderer = this; } + /** + * @property type + * @type Number + */ this.type = PIXI.WEBGL_RENDERER; /** @@ -56,6 +57,7 @@ this.resolution = options.resolution; // do a catch.. only 1 webGL renderer.. + /** * Whether the render view is transparent * @@ -99,12 +101,27 @@ this.view = options.view || document.createElement( 'canvas' ); // deal with losing context.. + + /** + * @property contextLostBound + * @type Function + */ this.contextLostBound = this.handleContextLost.bind(this); + + /** + * @property contextRestoredBound + * @type Function + */ this.contextRestoredBound = this.handleContextRestored.bind(this); this.view.addEventListener('webglcontextlost', this.contextLostBound, false); this.view.addEventListener('webglcontextrestored', this.contextRestoredBound, false); + /** + * @property _contextOptions + * @type Object + * @private + */ this._contextOptions = { alpha: this.transparent, antialias: options.antialias, // SPEED UP?? @@ -113,18 +130,67 @@ preserveDrawingBuffer: options.preserveDrawingBuffer }; + /** + * @property projection + * @type Point + */ this.projection = new PIXI.Point(); + + /** + * @property offset + * @type Point + */ this.offset = new PIXI.Point(0, 0); - // time to create the render managers! each one focuses on managine a state in webGL - 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(); // manages the stencil buffer - this.blendModeManager = new PIXI.WebGLBlendModeManager(); // manages the blendModes + // time to create the render managers! each one focuses on managing a state in webGL - // TODO remove + /** + * Deals with managing the shader programs and their attribs + * @property shaderManager + * @type WebGLShaderManager + */ + this.shaderManager = new PIXI.WebGLShaderManager(); + + /** + * Manages the rendering of sprites + * @property spriteBatch + * @type WebGLSpriteBatch + */ + this.spriteBatch = new PIXI.WebGLSpriteBatch(); + + /** + * Manages the masks using the stencil buffer + * @property maskManager + * @type WebGLMaskManager + */ + this.maskManager = new PIXI.WebGLMaskManager(); + + /** + * Manages the filters + * @property filterManager + * @type WebGLFilterManager + */ + this.filterManager = new PIXI.WebGLFilterManager(); + + /** + * Manages the stencil buffer + * @property stencilManager + * @type WebGLStencilManager + */ + this.stencilManager = new PIXI.WebGLStencilManager(); + + /** + * Manages the blendModes + * @property blendModeManager + * @type WebGLBlendModeManager + */ + this.blendModeManager = new PIXI.WebGLBlendModeManager(); + + /** + * TODO remove + * @property renderSession + * @type Object + */ this.renderSession = {}; this.renderSession.gl = this.gl; this.renderSession.drawCount = 0; @@ -147,6 +213,9 @@ // constructor PIXI.WebGLRenderer.prototype.constructor = PIXI.WebGLRenderer; +/** +* @method initContext +*/ PIXI.WebGLRenderer.prototype.initContext = function() { var gl = this.view.getContext('webgl', this._contextOptions) || this.view.getContext('experimental-webgl', this._contextOptions); @@ -180,7 +249,6 @@ this.resize(this.width, this.height); }; - /** * Renders the stage to its webGL view * @@ -205,9 +273,7 @@ // update the scene graph stage.updateTransform(); - var gl = this.gl; - // interaction if(stage._interactive) @@ -249,9 +315,9 @@ }; /** - * Renders a display Object + * Renders a Display Object. * - * @method renderDIsplayObject + * @method renderDisplayObject * @param displayObject {DisplayObject} The DisplayObject to render * @param projection {Point} The projection * @param buffer {Array} a standard WebGL buffer @@ -283,7 +349,7 @@ }; /** - * resizes the webGL view to the specified width and height + * Resizes the webGL view to the specified width and height. * * @method resize * @param width {Number} the new width of the webGL view @@ -297,10 +363,6 @@ this.view.width = this.width; this.view.height = this.height; - // this.view.style.width = width + 'px'; - // this.view.style.height = height + 'px'; - - // console.log(this.width / this.resolution) this.gl.viewport(0, 0, this.width, this.height); this.projection.x = this.width / 2 / this.resolution; @@ -308,10 +370,10 @@ }; /** - * Updates and Creates a WebGL texture for the renderers context + * Updates and Creates a WebGL texture for the renderers context. * * @method updateTexture - * @param texture {Texture} the texture to render + * @param texture {Texture} the texture to update */ PIXI.WebGLRenderer.prototype.updateTexture = function(texture) { @@ -411,6 +473,11 @@ this.renderSession = null; }; +/** + * Maps Pixi blend modes to WebGL blend modes. + * + * @method mapBlendModes + */ PIXI.WebGLRenderer.prototype.mapBlendModes = function() { var gl = this.gl; diff --git a/src/pixi/renderers/webgl/shaders/ComplexPrimitiveShader.js b/src/pixi/renderers/webgl/shaders/ComplexPrimitiveShader.js index daa8b64..79d038a 100644 --- a/src/pixi/renderers/webgl/shaders/ComplexPrimitiveShader.js +++ b/src/pixi/renderers/webgl/shaders/ComplexPrimitiveShader.js @@ -9,7 +9,13 @@ */ PIXI.ComplexPrimitiveShader = function(gl) { + /** + * @property _UID + * @type Number + * @private + */ this._UID = PIXI._UID++; + /** * @property gl * @type WebGLContext @@ -17,18 +23,20 @@ this.gl = gl; /** - * @property {any} program - The WebGL program. - */ + * The WebGL program. + * @property program + * @type {Any} + */ this.program = null; /** + * The fragment shader. * @property fragmentSrc * @type Array */ this.fragmentSrc = [ - 'precision mediump float;', - + 'precision mediump float;', 'varying vec4 vColor;', @@ -38,6 +46,7 @@ ]; /** + * The vertex shader. * @property vertexSrc * @type Array */ @@ -65,14 +74,15 @@ this.init(); }; +PIXI.ComplexPrimitiveShader.prototype.constructor = PIXI.ComplexPrimitiveShader; + /** -* Initialises the shader +* Initialises the shader. +* * @method init -* */ PIXI.ComplexPrimitiveShader.prototype.init = function() { - var gl = this.gl; var program = PIXI.compileProgram(gl, this.vertexSrc, this.fragmentSrc); @@ -84,7 +94,6 @@ this.tintColor = gl.getUniformLocation(program, 'tint'); this.color = gl.getUniformLocation(program, 'color'); - // get and store the attributes this.aVertexPosition = gl.getAttribLocation(program, 'aVertexPosition'); // this.colorAttribute = gl.getAttribLocation(program, 'aColor'); @@ -98,9 +107,9 @@ }; /** -* Destroys the shader +* Destroys the shader. +* * @method destroy -* */ PIXI.ComplexPrimitiveShader.prototype.destroy = function() { diff --git a/src/pixi/renderers/webgl/shaders/PixiFastShader.js b/src/pixi/renderers/webgl/shaders/PixiFastShader.js index 4fb3fe2..bb46419 100644 --- a/src/pixi/renderers/webgl/shaders/PixiFastShader.js +++ b/src/pixi/renderers/webgl/shaders/PixiFastShader.js @@ -1,6 +1,5 @@ /** * @author Mat Groves http://matgroves.com/ @Doormat23 - * @author Richard Davey http://www.photonstorm.com @photonstorm */ /** @@ -10,6 +9,11 @@ */ PIXI.PixiFastShader = function(gl) { + /** + * @property _UID + * @type Number + * @private + */ this._UID = PIXI._UID++; /** @@ -19,12 +23,16 @@ this.gl = gl; /** - * @property {any} program - The WebGL program. + * The WebGL program. + * @property program + * @type {Any} */ this.program = null; /** - * @property {array} fragmentSrc - The fragment shader. + * The fragment shader. + * @property fragmentSrc + * @type Array */ this.fragmentSrc = [ 'precision lowp float;', @@ -37,8 +45,10 @@ ]; /** - * @property {array} vertexSrc - The vertex shader - */ + * The vertex shader. + * @property vertexSrc + * @type Array + */ this.vertexSrc = [ 'attribute vec2 aVertexPosition;', 'attribute vec2 aPositionCoord;', @@ -69,24 +79,25 @@ '}' ]; - /** - * @property {number} textureCount - A local texture counter for multi-texture shaders. - */ + * A local texture counter for multi-texture shaders. + * @property textureCount + * @type Number + */ this.textureCount = 0; - this.init(); }; +PIXI.PixiFastShader.prototype.constructor = PIXI.PixiFastShader; + /** -* Initialises the shader +* Initialises the shader. +* * @method init -* */ PIXI.PixiFastShader.prototype.init = function() { - var gl = this.gl; var program = PIXI.compileProgram(gl, this.vertexSrc, this.fragmentSrc); @@ -111,8 +122,6 @@ this.aTextureCoord = gl.getAttribLocation(program, 'aTextureCoord'); this.colorAttribute = gl.getAttribLocation(program, 'aColor'); - - // Begin worst hack eva // // WHY??? ONLY on my chrome pixel the line above returns -1 when using filters? @@ -128,14 +137,13 @@ // End worst hack eva // - this.program = program; }; /** -* Destroys the shader +* Destroys the shader. +* * @method destroy -* */ PIXI.PixiFastShader.prototype.destroy = function() { diff --git a/src/pixi/renderers/webgl/shaders/PixiShader.js b/src/pixi/renderers/webgl/shaders/PixiShader.js index d76ec03..725dce2 100644 --- a/src/pixi/renderers/webgl/shaders/PixiShader.js +++ b/src/pixi/renderers/webgl/shaders/PixiShader.js @@ -6,9 +6,15 @@ /** * @class PixiShader * @constructor +* @param gl {WebGLContext} the current WebGL drawing context */ PIXI.PixiShader = function(gl) { + /** + * @property _UID + * @type Number + * @private + */ this._UID = PIXI._UID++; /** @@ -18,13 +24,17 @@ this.gl = gl; /** - * @property {any} program - The WebGL program. - */ + * The WebGL program. + * @property program + * @type {Any} + */ this.program = null; /** - * @property {array} fragmentSrc - The fragment shader. - */ + * The fragment shader. + * @property fragmentSrc + * @type Array + */ this.fragmentSrc = [ 'precision lowp float;', 'varying vec2 vTextureCoord;', @@ -36,21 +46,44 @@ ]; /** - * @property {number} textureCount - A local texture counter for multi-texture shaders. - */ + * A local texture counter for multi-texture shaders. + * @property textureCount + * @type Number + */ this.textureCount = 0; + + /** + * A local flag + * @property firstRun + * @type Boolean + * @private + */ this.firstRun = true; + + /** + * A dirty flag + * @property dirty + * @type Boolean + */ this.dirty = true; + /** + * Uniform attributes cache. + * @property attributes + * @type Array + * @private + */ this.attributes = []; this.init(); }; +PIXI.PixiShader.prototype.constructor = PIXI.PixiShader; + /** -* Initialises the shader +* Initialises the shader. +* * @method init -* */ PIXI.PixiShader.prototype.init = function() { @@ -71,12 +104,11 @@ this.aTextureCoord = gl.getAttribLocation(program, 'aTextureCoord'); this.colorAttribute = gl.getAttribLocation(program, 'aColor'); - // Begin worst hack eva // // WHY??? ONLY on my chrome pixel the line above returns -1 when using filters? // maybe its something to do with the current state of the gl context. - // Im convinced this is a bug in the chrome browser as there is NO reason why this should be returning -1 especially as it only manifests on my chrome pixel + // I'm convinced this is a bug in the chrome browser as there is NO reason why this should be returning -1 especially as it only manifests on my chrome pixel // If theres any webGL people that know why could happen please help :) if(this.colorAttribute === -1) { @@ -101,6 +133,7 @@ /** * Initialises the shader uniform values. +* * Uniforms are specified in the GLSL_ES Specification: http://www.khronos.org/registry/webgl/specs/latest/1.0/ * http://www.khronos.org/registry/gles/specs/2.0/GLSL_ES_Specification_1.0.17.pdf * @@ -316,7 +349,8 @@ }; /** -* Destroys the shader +* Destroys the shader. +* * @method destroy */ PIXI.PixiShader.prototype.destroy = function() @@ -329,7 +363,8 @@ }; /** -* The Default Vertex shader source +* The Default Vertex shader source. +* * @property defaultVertexSrc * @type String */ diff --git a/src/pixi/renderers/webgl/shaders/PrimitiveShader.js b/src/pixi/renderers/webgl/shaders/PrimitiveShader.js index 3a82be2..0f6854c 100644 --- a/src/pixi/renderers/webgl/shaders/PrimitiveShader.js +++ b/src/pixi/renderers/webgl/shaders/PrimitiveShader.js @@ -9,6 +9,11 @@ */ PIXI.PrimitiveShader = function(gl) { + /** + * @property _UID + * @type Number + * @private + */ this._UID = PIXI._UID++; /** @@ -18,11 +23,14 @@ this.gl = gl; /** - * @property {any} program - The WebGL program. - */ + * The WebGL program. + * @property program + * @type {Any} + */ this.program = null; /** + * The fragment shader. * @property fragmentSrc * @type Array */ @@ -36,6 +44,7 @@ ]; /** + * The vertex shader. * @property vertexSrc * @type Array */ @@ -60,14 +69,15 @@ this.init(); }; +PIXI.PrimitiveShader.prototype.constructor = PIXI.PrimitiveShader; + /** -* Initialises the shader +* Initialises the shader. +* * @method init -* */ PIXI.PrimitiveShader.prototype.init = function() { - var gl = this.gl; var program = PIXI.compileProgram(gl, this.vertexSrc, this.fragmentSrc); @@ -78,7 +88,6 @@ this.offsetVector = gl.getUniformLocation(program, 'offsetVector'); this.tintColor = gl.getUniformLocation(program, 'tint'); - // get and store the attributes this.aVertexPosition = gl.getAttribLocation(program, 'aVertexPosition'); this.colorAttribute = gl.getAttribLocation(program, 'aColor'); @@ -92,9 +101,9 @@ }; /** -* Destroys the shader +* Destroys the shader. +* * @method destroy -* */ PIXI.PrimitiveShader.prototype.destroy = function() { diff --git a/src/pixi/renderers/webgl/shaders/StripShader.js b/src/pixi/renderers/webgl/shaders/StripShader.js index 11f13ad..8fefe51 100644 --- a/src/pixi/renderers/webgl/shaders/StripShader.js +++ b/src/pixi/renderers/webgl/shaders/StripShader.js @@ -2,20 +2,37 @@ * @author Mat Groves http://matgroves.com/ @Doormat23 */ - +/** +* @class StripShader +* @constructor +* @param gl {WebGLContext} the current WebGL drawing context +*/ PIXI.StripShader = function(gl) { + /** + * @property _UID + * @type Number + * @private + */ this._UID = PIXI._UID++; + /** + * @property gl + * @type WebGLContext + */ this.gl = gl; /** - * @property {any} program - The WebGL program. - */ + * The WebGL program. + * @property program + * @type {Any} + */ this.program = null; /** - * @property {array} fragmentSrc - The fragment shader. + * The fragment shader. + * @property fragmentSrc + * @type Array */ this.fragmentSrc = [ 'precision mediump float;', @@ -30,9 +47,11 @@ '}' ]; - /** - * @property {array} fragmentSrc - The fragment shader. - */ + /** + * The vertex shader. + * @property vertexSrc + * @type Array + */ this.vertexSrc = [ 'attribute vec2 aVertexPosition;', 'attribute vec2 aTextureCoord;', @@ -56,10 +75,12 @@ this.init(); }; +PIXI.StripShader.prototype.constructor = PIXI.StripShader; + /** -* Initialises the shader +* Initialises the shader. +* * @method init -* */ PIXI.StripShader.prototype.init = function() { @@ -88,9 +109,9 @@ }; /** -* Destroys the shader +* Destroys the shader. +* * @method destroy -* */ PIXI.StripShader.prototype.destroy = function() { diff --git a/src/pixi/renderers/webgl/utils/FilterTexture.js b/src/pixi/renderers/webgl/utils/FilterTexture.js index 9dada23..389acbe 100644 --- a/src/pixi/renderers/webgl/utils/FilterTexture.js +++ b/src/pixi/renderers/webgl/utils/FilterTexture.js @@ -9,7 +9,6 @@ * @param width {Number} the horizontal range of the filter * @param height {Number} the vertical range of the filter * @param scaleMode {Number} Should be one of the PIXI.scaleMode consts -* @private */ PIXI.FilterTexture = function(gl, width, height, scaleMode) { @@ -19,11 +18,24 @@ */ this.gl = gl; - // next time to create a frame buffer and texture + + /** + * @property frameBuffer + * @type Any + */ this.frameBuffer = gl.createFramebuffer(); + + /** + * @property texture + * @type Any + */ this.texture = gl.createTexture(); + /** + * @property scaleMode + * @type Number + */ scaleMode = scaleMode || PIXI.scaleModes.DEFAULT; gl.bindTexture(gl.TEXTURE_2D, this.texture); @@ -44,9 +56,11 @@ this.resize(width, height); }; +PIXI.FilterTexture.prototype.constructor = PIXI.FilterTexture; /** -* Clears the filter texture +* Clears the filter texture. +* * @method clear */ PIXI.FilterTexture.prototype.clear = function() @@ -75,14 +89,14 @@ gl.bindTexture(gl.TEXTURE_2D, this.texture); gl.texImage2D(gl.TEXTURE_2D, 0, gl.RGBA, width , height , 0, gl.RGBA, gl.UNSIGNED_BYTE, null); - // console.log( width, width ) // update the stencil buffer width and height gl.bindRenderbuffer(gl.RENDERBUFFER, this.renderBuffer); gl.renderbufferStorage(gl.RENDERBUFFER, gl.DEPTH_STENCIL, width , height ); }; /** -* Destroys the filter texture +* Destroys the filter texture. +* * @method destroy */ PIXI.FilterTexture.prototype.destroy = function() diff --git a/src/pixi/renderers/webgl/utils/WebGLBlendModeManager.js b/src/pixi/renderers/webgl/utils/WebGLBlendModeManager.js index c73728f..3de0ec9 100644 --- a/src/pixi/renderers/webgl/utils/WebGLBlendModeManager.js +++ b/src/pixi/renderers/webgl/utils/WebGLBlendModeManager.js @@ -3,31 +3,42 @@ */ /** -* @class WebGLMaskManager +* @class WebGLBlendModeManager * @constructor * @param gl {WebGLContext} the current WebGL drawing context -* @private */ PIXI.WebGLBlendModeManager = function() { + /** + * @property currentBlendMode + * @type Number + */ this.currentBlendMode = 99999; }; +PIXI.WebGLBlendModeManager.prototype.constructor = PIXI.WebGLBlendModeManager; + +/** + * Sets the WebGL Context. + * + * @method setContext + * @param gl {WebGLContext} the current WebGL drawing context + */ PIXI.WebGLBlendModeManager.prototype.setContext = function(gl) { this.gl = gl; }; /** -* Sets-up the given blendMode from WebGL's point of view +* Sets-up the given blendMode from WebGL's point of view. +* * @method setBlendMode -* * @param blendMode {Number} the blendMode, should be a Pixi const, such as PIXI.BlendModes.ADD */ PIXI.WebGLBlendModeManager.prototype.setBlendMode = function(blendMode) { if(this.currentBlendMode === blendMode)return false; - // console.log("SWAP!") + this.currentBlendMode = blendMode; var blendModeWebGL = PIXI.blendModesWebGL[this.currentBlendMode]; @@ -36,7 +47,12 @@ return true; }; +/** +* Destroys this object. +* +* @method destroy +*/ PIXI.WebGLBlendModeManager.prototype.destroy = function() { this.gl = null; -}; \ No newline at end of file +}; diff --git a/src/pixi/InteractionData.js b/src/pixi/InteractionData.js index ea77370..fa84a6d 100644 --- a/src/pixi/InteractionData.js +++ b/src/pixi/InteractionData.js @@ -18,7 +18,6 @@ */ this.global = new PIXI.Point(); - /** * The target Sprite that was interacted with * diff --git a/src/pixi/InteractionManager.js b/src/pixi/InteractionManager.js index 685c386..71f320b 100644 --- a/src/pixi/InteractionManager.js +++ b/src/pixi/InteractionManager.js @@ -14,7 +14,7 @@ PIXI.InteractionManager = function(stage) { /** - * a reference to the stage + * A reference to the stage * * @property stage * @type Stage @@ -22,7 +22,7 @@ this.stage = stage; /** - * the mouse data + * The mouse data * * @property mouse * @type InteractionData @@ -30,18 +30,21 @@ this.mouse = new PIXI.InteractionData(); /** - * an object that stores current touches (InteractionData) by id reference + * An object that stores current touches (InteractionData) by id reference * * @property touches * @type Object */ this.touches = {}; - // helpers + /** + * @property tempPoint + * @type Point + * @private + */ this.tempPoint = new PIXI.Point(); /** - * * @property mouseoverEnabled * @type Boolean * @default @@ -49,7 +52,7 @@ this.mouseoverEnabled = true; /** - * tiny little interactiveData pool ! + * Tiny little interactiveData pool ! * * @property pool * @type Array @@ -61,7 +64,6 @@ * @property interactiveItems * @type Array * @private - * */ this.interactiveItems = []; @@ -73,23 +75,60 @@ */ this.interactionDOMElement = null; - //this will make it so that you dont have to call bind all the time + //this will make it so that you don't have to call bind all the time + + /** + * @property onMouseMove + * @type Function + */ this.onMouseMove = this.onMouseMove.bind( this ); + + /** + * @property onMouseDown + * @type Function + */ this.onMouseDown = this.onMouseDown.bind(this); + + /** + * @property onMouseOut + * @type Function + */ this.onMouseOut = this.onMouseOut.bind(this); + + /** + * @property onMouseUp + * @type Function + */ this.onMouseUp = this.onMouseUp.bind(this); + /** + * @property onTouchStart + * @type Function + */ this.onTouchStart = this.onTouchStart.bind(this); + + /** + * @property onTouchEnd + * @type Function + */ this.onTouchEnd = this.onTouchEnd.bind(this); + + /** + * @property onTouchMove + * @type Function + */ this.onTouchMove = this.onTouchMove.bind(this); + /** + * @property last + * @type Number + */ this.last = 0; /** * The css style of the cursor that is being used * @property currentCursorStyle * @type String - * */ this.currentCursorStyle = 'inherit'; @@ -97,10 +136,13 @@ * Is set to true when the mouse is moved out of the canvas * @property mouseOut * @type Boolean - * */ this.mouseOut = false; + /** + * @property resolution + * @type Number + */ this.resolution = 1; }; @@ -166,7 +208,6 @@ this.setTargetDomElement (target.view); }; - /** * Sets the DOM element which will receive mouse/touch events. This is useful for when you have other DOM * elements on top of the renderers Canvas element. With this you'll be able to delegate another DOM element @@ -201,7 +242,10 @@ window.addEventListener('mouseup', this.onMouseUp, true); }; - +/** + * @method removeEvents + * @private + */ PIXI.InteractionManager.prototype.removeEvents = function() { if (!this.interactionDOMElement) return; @@ -308,6 +352,10 @@ } }; +/** + * @method rebuildInteractiveGraph + * @private + */ PIXI.InteractionManager.prototype.rebuildInteractiveGraph = function() { this.dirty = false; @@ -427,10 +475,10 @@ }; /** - * Is called when the mouse button is moved out of the renderer element + * Is called when the mouse is moved out of the renderer element * * @method onMouseOut - * @param event {Event} The DOM event of a mouse button being moved out + * @param event {Event} The DOM event of a mouse being moved out * @private */ PIXI.InteractionManager.prototype.onMouseOut = function(event) diff --git a/src/pixi/renderers/webgl/WebGLRenderer.js b/src/pixi/renderers/webgl/WebGLRenderer.js index 968fd3d..422896f 100644 --- a/src/pixi/renderers/webgl/WebGLRenderer.js +++ b/src/pixi/renderers/webgl/WebGLRenderer.js @@ -5,23 +5,21 @@ PIXI.glContexts = []; // this is where we store the webGL contexts for easy access. /** - * the WebGLRenderer draws the stage and all its content onto a webGL enabled canvas. This renderer - * should be used for browsers that support webGL. This Render works by automatically managing webGLBatch's. - * So no need for Sprite Batch's or Sprite Cloud's - * Dont forget to add the view to your DOM or you will not see anything :) + * The WebGLRenderer draws the stage and all its content onto a webGL enabled canvas. This renderer + * should be used for browsers that support webGL. This Render works by automatically managing webGLBatchs. + * So no need for Sprite Batches or Sprite Clouds. + * Don't forget to add the view to your DOM or you will not see anything :) * * @class WebGLRenderer * @constructor * @param [width=0] {Number} the width of the canvas view * @param [height=0] {Number} the height of the canvas view - * * @param [options] {Object} The optional renderer parameters * @param [options.view] {HTMLCanvasElement} the canvas to use as a view, optional * @param [options.transparent=false] {Boolean} If the render view is transparent, default false * @param [options.antialias=false] {Boolean} sets antialias (only applicable in chrome at the moment) * @param [options.preserveDrawingBuffer=false] {Boolean} enables drawing buffer preservation, enable this if you need to call toDataUrl on the webgl context * @param [options.resolution=1] {Number} the resolution of the renderer retina would be 2 - * */ PIXI.WebGLRenderer = function(width, height, options) { @@ -37,13 +35,16 @@ options = PIXI.defaultRenderOptions; } - if(!PIXI.defaultRenderer) { PIXI.sayHello('webGL'); PIXI.defaultRenderer = this; } + /** + * @property type + * @type Number + */ this.type = PIXI.WEBGL_RENDERER; /** @@ -56,6 +57,7 @@ this.resolution = options.resolution; // do a catch.. only 1 webGL renderer.. + /** * Whether the render view is transparent * @@ -99,12 +101,27 @@ this.view = options.view || document.createElement( 'canvas' ); // deal with losing context.. + + /** + * @property contextLostBound + * @type Function + */ this.contextLostBound = this.handleContextLost.bind(this); + + /** + * @property contextRestoredBound + * @type Function + */ this.contextRestoredBound = this.handleContextRestored.bind(this); this.view.addEventListener('webglcontextlost', this.contextLostBound, false); this.view.addEventListener('webglcontextrestored', this.contextRestoredBound, false); + /** + * @property _contextOptions + * @type Object + * @private + */ this._contextOptions = { alpha: this.transparent, antialias: options.antialias, // SPEED UP?? @@ -113,18 +130,67 @@ preserveDrawingBuffer: options.preserveDrawingBuffer }; + /** + * @property projection + * @type Point + */ this.projection = new PIXI.Point(); + + /** + * @property offset + * @type Point + */ this.offset = new PIXI.Point(0, 0); - // time to create the render managers! each one focuses on managine a state in webGL - 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(); // manages the stencil buffer - this.blendModeManager = new PIXI.WebGLBlendModeManager(); // manages the blendModes + // time to create the render managers! each one focuses on managing a state in webGL - // TODO remove + /** + * Deals with managing the shader programs and their attribs + * @property shaderManager + * @type WebGLShaderManager + */ + this.shaderManager = new PIXI.WebGLShaderManager(); + + /** + * Manages the rendering of sprites + * @property spriteBatch + * @type WebGLSpriteBatch + */ + this.spriteBatch = new PIXI.WebGLSpriteBatch(); + + /** + * Manages the masks using the stencil buffer + * @property maskManager + * @type WebGLMaskManager + */ + this.maskManager = new PIXI.WebGLMaskManager(); + + /** + * Manages the filters + * @property filterManager + * @type WebGLFilterManager + */ + this.filterManager = new PIXI.WebGLFilterManager(); + + /** + * Manages the stencil buffer + * @property stencilManager + * @type WebGLStencilManager + */ + this.stencilManager = new PIXI.WebGLStencilManager(); + + /** + * Manages the blendModes + * @property blendModeManager + * @type WebGLBlendModeManager + */ + this.blendModeManager = new PIXI.WebGLBlendModeManager(); + + /** + * TODO remove + * @property renderSession + * @type Object + */ this.renderSession = {}; this.renderSession.gl = this.gl; this.renderSession.drawCount = 0; @@ -147,6 +213,9 @@ // constructor PIXI.WebGLRenderer.prototype.constructor = PIXI.WebGLRenderer; +/** +* @method initContext +*/ PIXI.WebGLRenderer.prototype.initContext = function() { var gl = this.view.getContext('webgl', this._contextOptions) || this.view.getContext('experimental-webgl', this._contextOptions); @@ -180,7 +249,6 @@ this.resize(this.width, this.height); }; - /** * Renders the stage to its webGL view * @@ -205,9 +273,7 @@ // update the scene graph stage.updateTransform(); - var gl = this.gl; - // interaction if(stage._interactive) @@ -249,9 +315,9 @@ }; /** - * Renders a display Object + * Renders a Display Object. * - * @method renderDIsplayObject + * @method renderDisplayObject * @param displayObject {DisplayObject} The DisplayObject to render * @param projection {Point} The projection * @param buffer {Array} a standard WebGL buffer @@ -283,7 +349,7 @@ }; /** - * resizes the webGL view to the specified width and height + * Resizes the webGL view to the specified width and height. * * @method resize * @param width {Number} the new width of the webGL view @@ -297,10 +363,6 @@ this.view.width = this.width; this.view.height = this.height; - // this.view.style.width = width + 'px'; - // this.view.style.height = height + 'px'; - - // console.log(this.width / this.resolution) this.gl.viewport(0, 0, this.width, this.height); this.projection.x = this.width / 2 / this.resolution; @@ -308,10 +370,10 @@ }; /** - * Updates and Creates a WebGL texture for the renderers context + * Updates and Creates a WebGL texture for the renderers context. * * @method updateTexture - * @param texture {Texture} the texture to render + * @param texture {Texture} the texture to update */ PIXI.WebGLRenderer.prototype.updateTexture = function(texture) { @@ -411,6 +473,11 @@ this.renderSession = null; }; +/** + * Maps Pixi blend modes to WebGL blend modes. + * + * @method mapBlendModes + */ PIXI.WebGLRenderer.prototype.mapBlendModes = function() { var gl = this.gl; diff --git a/src/pixi/renderers/webgl/shaders/ComplexPrimitiveShader.js b/src/pixi/renderers/webgl/shaders/ComplexPrimitiveShader.js index daa8b64..79d038a 100644 --- a/src/pixi/renderers/webgl/shaders/ComplexPrimitiveShader.js +++ b/src/pixi/renderers/webgl/shaders/ComplexPrimitiveShader.js @@ -9,7 +9,13 @@ */ PIXI.ComplexPrimitiveShader = function(gl) { + /** + * @property _UID + * @type Number + * @private + */ this._UID = PIXI._UID++; + /** * @property gl * @type WebGLContext @@ -17,18 +23,20 @@ this.gl = gl; /** - * @property {any} program - The WebGL program. - */ + * The WebGL program. + * @property program + * @type {Any} + */ this.program = null; /** + * The fragment shader. * @property fragmentSrc * @type Array */ this.fragmentSrc = [ - 'precision mediump float;', - + 'precision mediump float;', 'varying vec4 vColor;', @@ -38,6 +46,7 @@ ]; /** + * The vertex shader. * @property vertexSrc * @type Array */ @@ -65,14 +74,15 @@ this.init(); }; +PIXI.ComplexPrimitiveShader.prototype.constructor = PIXI.ComplexPrimitiveShader; + /** -* Initialises the shader +* Initialises the shader. +* * @method init -* */ PIXI.ComplexPrimitiveShader.prototype.init = function() { - var gl = this.gl; var program = PIXI.compileProgram(gl, this.vertexSrc, this.fragmentSrc); @@ -84,7 +94,6 @@ this.tintColor = gl.getUniformLocation(program, 'tint'); this.color = gl.getUniformLocation(program, 'color'); - // get and store the attributes this.aVertexPosition = gl.getAttribLocation(program, 'aVertexPosition'); // this.colorAttribute = gl.getAttribLocation(program, 'aColor'); @@ -98,9 +107,9 @@ }; /** -* Destroys the shader +* Destroys the shader. +* * @method destroy -* */ PIXI.ComplexPrimitiveShader.prototype.destroy = function() { diff --git a/src/pixi/renderers/webgl/shaders/PixiFastShader.js b/src/pixi/renderers/webgl/shaders/PixiFastShader.js index 4fb3fe2..bb46419 100644 --- a/src/pixi/renderers/webgl/shaders/PixiFastShader.js +++ b/src/pixi/renderers/webgl/shaders/PixiFastShader.js @@ -1,6 +1,5 @@ /** * @author Mat Groves http://matgroves.com/ @Doormat23 - * @author Richard Davey http://www.photonstorm.com @photonstorm */ /** @@ -10,6 +9,11 @@ */ PIXI.PixiFastShader = function(gl) { + /** + * @property _UID + * @type Number + * @private + */ this._UID = PIXI._UID++; /** @@ -19,12 +23,16 @@ this.gl = gl; /** - * @property {any} program - The WebGL program. + * The WebGL program. + * @property program + * @type {Any} */ this.program = null; /** - * @property {array} fragmentSrc - The fragment shader. + * The fragment shader. + * @property fragmentSrc + * @type Array */ this.fragmentSrc = [ 'precision lowp float;', @@ -37,8 +45,10 @@ ]; /** - * @property {array} vertexSrc - The vertex shader - */ + * The vertex shader. + * @property vertexSrc + * @type Array + */ this.vertexSrc = [ 'attribute vec2 aVertexPosition;', 'attribute vec2 aPositionCoord;', @@ -69,24 +79,25 @@ '}' ]; - /** - * @property {number} textureCount - A local texture counter for multi-texture shaders. - */ + * A local texture counter for multi-texture shaders. + * @property textureCount + * @type Number + */ this.textureCount = 0; - this.init(); }; +PIXI.PixiFastShader.prototype.constructor = PIXI.PixiFastShader; + /** -* Initialises the shader +* Initialises the shader. +* * @method init -* */ PIXI.PixiFastShader.prototype.init = function() { - var gl = this.gl; var program = PIXI.compileProgram(gl, this.vertexSrc, this.fragmentSrc); @@ -111,8 +122,6 @@ this.aTextureCoord = gl.getAttribLocation(program, 'aTextureCoord'); this.colorAttribute = gl.getAttribLocation(program, 'aColor'); - - // Begin worst hack eva // // WHY??? ONLY on my chrome pixel the line above returns -1 when using filters? @@ -128,14 +137,13 @@ // End worst hack eva // - this.program = program; }; /** -* Destroys the shader +* Destroys the shader. +* * @method destroy -* */ PIXI.PixiFastShader.prototype.destroy = function() { diff --git a/src/pixi/renderers/webgl/shaders/PixiShader.js b/src/pixi/renderers/webgl/shaders/PixiShader.js index d76ec03..725dce2 100644 --- a/src/pixi/renderers/webgl/shaders/PixiShader.js +++ b/src/pixi/renderers/webgl/shaders/PixiShader.js @@ -6,9 +6,15 @@ /** * @class PixiShader * @constructor +* @param gl {WebGLContext} the current WebGL drawing context */ PIXI.PixiShader = function(gl) { + /** + * @property _UID + * @type Number + * @private + */ this._UID = PIXI._UID++; /** @@ -18,13 +24,17 @@ this.gl = gl; /** - * @property {any} program - The WebGL program. - */ + * The WebGL program. + * @property program + * @type {Any} + */ this.program = null; /** - * @property {array} fragmentSrc - The fragment shader. - */ + * The fragment shader. + * @property fragmentSrc + * @type Array + */ this.fragmentSrc = [ 'precision lowp float;', 'varying vec2 vTextureCoord;', @@ -36,21 +46,44 @@ ]; /** - * @property {number} textureCount - A local texture counter for multi-texture shaders. - */ + * A local texture counter for multi-texture shaders. + * @property textureCount + * @type Number + */ this.textureCount = 0; + + /** + * A local flag + * @property firstRun + * @type Boolean + * @private + */ this.firstRun = true; + + /** + * A dirty flag + * @property dirty + * @type Boolean + */ this.dirty = true; + /** + * Uniform attributes cache. + * @property attributes + * @type Array + * @private + */ this.attributes = []; this.init(); }; +PIXI.PixiShader.prototype.constructor = PIXI.PixiShader; + /** -* Initialises the shader +* Initialises the shader. +* * @method init -* */ PIXI.PixiShader.prototype.init = function() { @@ -71,12 +104,11 @@ this.aTextureCoord = gl.getAttribLocation(program, 'aTextureCoord'); this.colorAttribute = gl.getAttribLocation(program, 'aColor'); - // Begin worst hack eva // // WHY??? ONLY on my chrome pixel the line above returns -1 when using filters? // maybe its something to do with the current state of the gl context. - // Im convinced this is a bug in the chrome browser as there is NO reason why this should be returning -1 especially as it only manifests on my chrome pixel + // I'm convinced this is a bug in the chrome browser as there is NO reason why this should be returning -1 especially as it only manifests on my chrome pixel // If theres any webGL people that know why could happen please help :) if(this.colorAttribute === -1) { @@ -101,6 +133,7 @@ /** * Initialises the shader uniform values. +* * Uniforms are specified in the GLSL_ES Specification: http://www.khronos.org/registry/webgl/specs/latest/1.0/ * http://www.khronos.org/registry/gles/specs/2.0/GLSL_ES_Specification_1.0.17.pdf * @@ -316,7 +349,8 @@ }; /** -* Destroys the shader +* Destroys the shader. +* * @method destroy */ PIXI.PixiShader.prototype.destroy = function() @@ -329,7 +363,8 @@ }; /** -* The Default Vertex shader source +* The Default Vertex shader source. +* * @property defaultVertexSrc * @type String */ diff --git a/src/pixi/renderers/webgl/shaders/PrimitiveShader.js b/src/pixi/renderers/webgl/shaders/PrimitiveShader.js index 3a82be2..0f6854c 100644 --- a/src/pixi/renderers/webgl/shaders/PrimitiveShader.js +++ b/src/pixi/renderers/webgl/shaders/PrimitiveShader.js @@ -9,6 +9,11 @@ */ PIXI.PrimitiveShader = function(gl) { + /** + * @property _UID + * @type Number + * @private + */ this._UID = PIXI._UID++; /** @@ -18,11 +23,14 @@ this.gl = gl; /** - * @property {any} program - The WebGL program. - */ + * The WebGL program. + * @property program + * @type {Any} + */ this.program = null; /** + * The fragment shader. * @property fragmentSrc * @type Array */ @@ -36,6 +44,7 @@ ]; /** + * The vertex shader. * @property vertexSrc * @type Array */ @@ -60,14 +69,15 @@ this.init(); }; +PIXI.PrimitiveShader.prototype.constructor = PIXI.PrimitiveShader; + /** -* Initialises the shader +* Initialises the shader. +* * @method init -* */ PIXI.PrimitiveShader.prototype.init = function() { - var gl = this.gl; var program = PIXI.compileProgram(gl, this.vertexSrc, this.fragmentSrc); @@ -78,7 +88,6 @@ this.offsetVector = gl.getUniformLocation(program, 'offsetVector'); this.tintColor = gl.getUniformLocation(program, 'tint'); - // get and store the attributes this.aVertexPosition = gl.getAttribLocation(program, 'aVertexPosition'); this.colorAttribute = gl.getAttribLocation(program, 'aColor'); @@ -92,9 +101,9 @@ }; /** -* Destroys the shader +* Destroys the shader. +* * @method destroy -* */ PIXI.PrimitiveShader.prototype.destroy = function() { diff --git a/src/pixi/renderers/webgl/shaders/StripShader.js b/src/pixi/renderers/webgl/shaders/StripShader.js index 11f13ad..8fefe51 100644 --- a/src/pixi/renderers/webgl/shaders/StripShader.js +++ b/src/pixi/renderers/webgl/shaders/StripShader.js @@ -2,20 +2,37 @@ * @author Mat Groves http://matgroves.com/ @Doormat23 */ - +/** +* @class StripShader +* @constructor +* @param gl {WebGLContext} the current WebGL drawing context +*/ PIXI.StripShader = function(gl) { + /** + * @property _UID + * @type Number + * @private + */ this._UID = PIXI._UID++; + /** + * @property gl + * @type WebGLContext + */ this.gl = gl; /** - * @property {any} program - The WebGL program. - */ + * The WebGL program. + * @property program + * @type {Any} + */ this.program = null; /** - * @property {array} fragmentSrc - The fragment shader. + * The fragment shader. + * @property fragmentSrc + * @type Array */ this.fragmentSrc = [ 'precision mediump float;', @@ -30,9 +47,11 @@ '}' ]; - /** - * @property {array} fragmentSrc - The fragment shader. - */ + /** + * The vertex shader. + * @property vertexSrc + * @type Array + */ this.vertexSrc = [ 'attribute vec2 aVertexPosition;', 'attribute vec2 aTextureCoord;', @@ -56,10 +75,12 @@ this.init(); }; +PIXI.StripShader.prototype.constructor = PIXI.StripShader; + /** -* Initialises the shader +* Initialises the shader. +* * @method init -* */ PIXI.StripShader.prototype.init = function() { @@ -88,9 +109,9 @@ }; /** -* Destroys the shader +* Destroys the shader. +* * @method destroy -* */ PIXI.StripShader.prototype.destroy = function() { diff --git a/src/pixi/renderers/webgl/utils/FilterTexture.js b/src/pixi/renderers/webgl/utils/FilterTexture.js index 9dada23..389acbe 100644 --- a/src/pixi/renderers/webgl/utils/FilterTexture.js +++ b/src/pixi/renderers/webgl/utils/FilterTexture.js @@ -9,7 +9,6 @@ * @param width {Number} the horizontal range of the filter * @param height {Number} the vertical range of the filter * @param scaleMode {Number} Should be one of the PIXI.scaleMode consts -* @private */ PIXI.FilterTexture = function(gl, width, height, scaleMode) { @@ -19,11 +18,24 @@ */ this.gl = gl; - // next time to create a frame buffer and texture + + /** + * @property frameBuffer + * @type Any + */ this.frameBuffer = gl.createFramebuffer(); + + /** + * @property texture + * @type Any + */ this.texture = gl.createTexture(); + /** + * @property scaleMode + * @type Number + */ scaleMode = scaleMode || PIXI.scaleModes.DEFAULT; gl.bindTexture(gl.TEXTURE_2D, this.texture); @@ -44,9 +56,11 @@ this.resize(width, height); }; +PIXI.FilterTexture.prototype.constructor = PIXI.FilterTexture; /** -* Clears the filter texture +* Clears the filter texture. +* * @method clear */ PIXI.FilterTexture.prototype.clear = function() @@ -75,14 +89,14 @@ gl.bindTexture(gl.TEXTURE_2D, this.texture); gl.texImage2D(gl.TEXTURE_2D, 0, gl.RGBA, width , height , 0, gl.RGBA, gl.UNSIGNED_BYTE, null); - // console.log( width, width ) // update the stencil buffer width and height gl.bindRenderbuffer(gl.RENDERBUFFER, this.renderBuffer); gl.renderbufferStorage(gl.RENDERBUFFER, gl.DEPTH_STENCIL, width , height ); }; /** -* Destroys the filter texture +* Destroys the filter texture. +* * @method destroy */ PIXI.FilterTexture.prototype.destroy = function() diff --git a/src/pixi/renderers/webgl/utils/WebGLBlendModeManager.js b/src/pixi/renderers/webgl/utils/WebGLBlendModeManager.js index c73728f..3de0ec9 100644 --- a/src/pixi/renderers/webgl/utils/WebGLBlendModeManager.js +++ b/src/pixi/renderers/webgl/utils/WebGLBlendModeManager.js @@ -3,31 +3,42 @@ */ /** -* @class WebGLMaskManager +* @class WebGLBlendModeManager * @constructor * @param gl {WebGLContext} the current WebGL drawing context -* @private */ PIXI.WebGLBlendModeManager = function() { + /** + * @property currentBlendMode + * @type Number + */ this.currentBlendMode = 99999; }; +PIXI.WebGLBlendModeManager.prototype.constructor = PIXI.WebGLBlendModeManager; + +/** + * Sets the WebGL Context. + * + * @method setContext + * @param gl {WebGLContext} the current WebGL drawing context + */ PIXI.WebGLBlendModeManager.prototype.setContext = function(gl) { this.gl = gl; }; /** -* Sets-up the given blendMode from WebGL's point of view +* Sets-up the given blendMode from WebGL's point of view. +* * @method setBlendMode -* * @param blendMode {Number} the blendMode, should be a Pixi const, such as PIXI.BlendModes.ADD */ PIXI.WebGLBlendModeManager.prototype.setBlendMode = function(blendMode) { if(this.currentBlendMode === blendMode)return false; - // console.log("SWAP!") + this.currentBlendMode = blendMode; var blendModeWebGL = PIXI.blendModesWebGL[this.currentBlendMode]; @@ -36,7 +47,12 @@ return true; }; +/** +* Destroys this object. +* +* @method destroy +*/ PIXI.WebGLBlendModeManager.prototype.destroy = function() { this.gl = null; -}; \ No newline at end of file +}; diff --git a/src/pixi/renderers/webgl/utils/WebGLFastSpriteBatch.js b/src/pixi/renderers/webgl/utils/WebGLFastSpriteBatch.js index 0d08e47..0bdbbe4 100644 --- a/src/pixi/renderers/webgl/utils/WebGLFastSpriteBatch.js +++ b/src/pixi/renderers/webgl/utils/WebGLFastSpriteBatch.js @@ -8,27 +8,66 @@ * https://github.com/libgdx/libgdx/blob/master/gdx/src/com/badlogic/gdx/graphics/g2d/WebGLSpriteBatch.java */ +/** +* @class WebGLFastSpriteBatch +* @constructor +*/ PIXI.WebGLFastSpriteBatch = function() { - - + /** + * @property vertSize + * @type Number + */ this.vertSize = 10; + + /** + * @property maxSize + * @type Number + */ this.maxSize = 6000;//Math.pow(2, 16) / this.vertSize; + + /** + * @property size + * @type Number + */ this.size = this.maxSize; //the total number of floats in our batch var numVerts = this.size * 4 * this.vertSize; + //the total number of indices in our batch var numIndices = this.maxSize * 6; - //vertex data + /** + * Vertex data + * @property vertices + * @type Float32Array + */ this.vertices = new Float32Array(numVerts); - //index data + + /** + * Index data + * @property indices + * @type Uint16Array + */ this.indices = new Uint16Array(numIndices); + /** + * @property vertexBuffer + * @type Object + */ this.vertexBuffer = null; + + /** + * @property indexBuffer + * @type Object + */ this.indexBuffer = null; + /** + * @property lastIndexCount + * @type Number + */ this.lastIndexCount = 0; for (var i=0, j=0; i < numIndices; i += 6, j += 4) @@ -41,21 +80,58 @@ this.indices[i + 5] = j + 3; } + /** + * @property drawing + * @type Boolean + */ this.drawing = false; + + /** + * @property currentBatchSize + * @type Number + */ this.currentBatchSize = 0; + + /** + * @property currentBaseTexture + * @type BaseTexture + */ this.currentBaseTexture = null; + /** + * @property currentBlendMode + * @type Number + */ this.currentBlendMode = 0; + + /** + * @property renderSession + * @type Object + */ this.renderSession = null; - + /** + * @property shader + * @type Object + */ this.shader = null; + /** + * @property matrix + * @type Matrix + */ this.matrix = null; - //this.setContext(gl); }; +PIXI.WebGLFastSpriteBatch.prototype.constructor = PIXI.WebGLFastSpriteBatch; + +/** + * Sets the WebGL Context. + * + * @method setContext + * @param gl {WebGLContext} the current WebGL drawing context + */ PIXI.WebGLFastSpriteBatch.prototype.setContext = function(gl) { this.gl = gl; @@ -66,7 +142,6 @@ // 65535 is max index, so 65535 / 6 = 10922. - //upload the index data gl.bindBuffer(gl.ELEMENT_ARRAY_BUFFER, this.indexBuffer); gl.bufferData(gl.ELEMENT_ARRAY_BUFFER, this.indices, gl.STATIC_DRAW); @@ -75,6 +150,11 @@ gl.bufferData(gl.ARRAY_BUFFER, this.vertices, gl.DYNAMIC_DRAW); }; +/** + * @method begin + * @param spriteBatch {WebGLSpriteBatch} + * @param renderSession {Object} + */ PIXI.WebGLFastSpriteBatch.prototype.begin = function(spriteBatch, renderSession) { this.renderSession = renderSession; @@ -85,15 +165,20 @@ this.start(); }; +/** + * @method end + */ PIXI.WebGLFastSpriteBatch.prototype.end = function() { this.flush(); }; - +/** + * @method render + * @param spriteBatch {WebGLSpriteBatch} + */ PIXI.WebGLFastSpriteBatch.prototype.render = function(spriteBatch) { - var children = spriteBatch.children; var sprite = children[0]; @@ -119,6 +204,10 @@ this.flush(); }; +/** + * @method renderSprite + * @param sprite {Sprite} + */ PIXI.WebGLFastSpriteBatch.prototype.renderSprite = function(sprite) { //sprite = children[i]; @@ -137,7 +226,6 @@ uvs = sprite.texture._uvs; - width = sprite.texture.frame.width; height = sprite.texture.frame.height; @@ -257,9 +345,11 @@ } }; +/** + * @method flush + */ PIXI.WebGLFastSpriteBatch.prototype.flush = function() { - // If the batch is length 0 then return as there is nothing to draw if (this.currentBatchSize===0)return; @@ -272,7 +362,6 @@ gl.bindTexture(gl.TEXTURE_2D, this.currentBaseTexture._glTextures[gl.id]); // upload the verts to the buffer - if(this.currentBatchSize > ( this.size * 0.5 ) ) { @@ -285,7 +374,6 @@ gl.bufferSubData(gl.ARRAY_BUFFER, 0, view); } - // now draw those suckas! gl.drawElements(gl.TRIANGLES, this.currentBatchSize * 6, gl.UNSIGNED_SHORT, 0); @@ -297,11 +385,17 @@ }; +/** + * @method stop + */ PIXI.WebGLFastSpriteBatch.prototype.stop = function() { this.flush(); }; +/** + * @method start + */ PIXI.WebGLFastSpriteBatch.prototype.start = function() { var gl = this.gl; @@ -329,8 +423,5 @@ gl.vertexAttribPointer(this.shader.aRotation, 1, gl.FLOAT, false, stride, 6 * 4); gl.vertexAttribPointer(this.shader.aTextureCoord, 2, gl.FLOAT, false, stride, 7 * 4); gl.vertexAttribPointer(this.shader.colorAttribute, 1, gl.FLOAT, false, stride, 9 * 4); - }; - - diff --git a/src/pixi/InteractionData.js b/src/pixi/InteractionData.js index ea77370..fa84a6d 100644 --- a/src/pixi/InteractionData.js +++ b/src/pixi/InteractionData.js @@ -18,7 +18,6 @@ */ this.global = new PIXI.Point(); - /** * The target Sprite that was interacted with * diff --git a/src/pixi/InteractionManager.js b/src/pixi/InteractionManager.js index 685c386..71f320b 100644 --- a/src/pixi/InteractionManager.js +++ b/src/pixi/InteractionManager.js @@ -14,7 +14,7 @@ PIXI.InteractionManager = function(stage) { /** - * a reference to the stage + * A reference to the stage * * @property stage * @type Stage @@ -22,7 +22,7 @@ this.stage = stage; /** - * the mouse data + * The mouse data * * @property mouse * @type InteractionData @@ -30,18 +30,21 @@ this.mouse = new PIXI.InteractionData(); /** - * an object that stores current touches (InteractionData) by id reference + * An object that stores current touches (InteractionData) by id reference * * @property touches * @type Object */ this.touches = {}; - // helpers + /** + * @property tempPoint + * @type Point + * @private + */ this.tempPoint = new PIXI.Point(); /** - * * @property mouseoverEnabled * @type Boolean * @default @@ -49,7 +52,7 @@ this.mouseoverEnabled = true; /** - * tiny little interactiveData pool ! + * Tiny little interactiveData pool ! * * @property pool * @type Array @@ -61,7 +64,6 @@ * @property interactiveItems * @type Array * @private - * */ this.interactiveItems = []; @@ -73,23 +75,60 @@ */ this.interactionDOMElement = null; - //this will make it so that you dont have to call bind all the time + //this will make it so that you don't have to call bind all the time + + /** + * @property onMouseMove + * @type Function + */ this.onMouseMove = this.onMouseMove.bind( this ); + + /** + * @property onMouseDown + * @type Function + */ this.onMouseDown = this.onMouseDown.bind(this); + + /** + * @property onMouseOut + * @type Function + */ this.onMouseOut = this.onMouseOut.bind(this); + + /** + * @property onMouseUp + * @type Function + */ this.onMouseUp = this.onMouseUp.bind(this); + /** + * @property onTouchStart + * @type Function + */ this.onTouchStart = this.onTouchStart.bind(this); + + /** + * @property onTouchEnd + * @type Function + */ this.onTouchEnd = this.onTouchEnd.bind(this); + + /** + * @property onTouchMove + * @type Function + */ this.onTouchMove = this.onTouchMove.bind(this); + /** + * @property last + * @type Number + */ this.last = 0; /** * The css style of the cursor that is being used * @property currentCursorStyle * @type String - * */ this.currentCursorStyle = 'inherit'; @@ -97,10 +136,13 @@ * Is set to true when the mouse is moved out of the canvas * @property mouseOut * @type Boolean - * */ this.mouseOut = false; + /** + * @property resolution + * @type Number + */ this.resolution = 1; }; @@ -166,7 +208,6 @@ this.setTargetDomElement (target.view); }; - /** * Sets the DOM element which will receive mouse/touch events. This is useful for when you have other DOM * elements on top of the renderers Canvas element. With this you'll be able to delegate another DOM element @@ -201,7 +242,10 @@ window.addEventListener('mouseup', this.onMouseUp, true); }; - +/** + * @method removeEvents + * @private + */ PIXI.InteractionManager.prototype.removeEvents = function() { if (!this.interactionDOMElement) return; @@ -308,6 +352,10 @@ } }; +/** + * @method rebuildInteractiveGraph + * @private + */ PIXI.InteractionManager.prototype.rebuildInteractiveGraph = function() { this.dirty = false; @@ -427,10 +475,10 @@ }; /** - * Is called when the mouse button is moved out of the renderer element + * Is called when the mouse is moved out of the renderer element * * @method onMouseOut - * @param event {Event} The DOM event of a mouse button being moved out + * @param event {Event} The DOM event of a mouse being moved out * @private */ PIXI.InteractionManager.prototype.onMouseOut = function(event) diff --git a/src/pixi/renderers/webgl/WebGLRenderer.js b/src/pixi/renderers/webgl/WebGLRenderer.js index 968fd3d..422896f 100644 --- a/src/pixi/renderers/webgl/WebGLRenderer.js +++ b/src/pixi/renderers/webgl/WebGLRenderer.js @@ -5,23 +5,21 @@ PIXI.glContexts = []; // this is where we store the webGL contexts for easy access. /** - * the WebGLRenderer draws the stage and all its content onto a webGL enabled canvas. This renderer - * should be used for browsers that support webGL. This Render works by automatically managing webGLBatch's. - * So no need for Sprite Batch's or Sprite Cloud's - * Dont forget to add the view to your DOM or you will not see anything :) + * The WebGLRenderer draws the stage and all its content onto a webGL enabled canvas. This renderer + * should be used for browsers that support webGL. This Render works by automatically managing webGLBatchs. + * So no need for Sprite Batches or Sprite Clouds. + * Don't forget to add the view to your DOM or you will not see anything :) * * @class WebGLRenderer * @constructor * @param [width=0] {Number} the width of the canvas view * @param [height=0] {Number} the height of the canvas view - * * @param [options] {Object} The optional renderer parameters * @param [options.view] {HTMLCanvasElement} the canvas to use as a view, optional * @param [options.transparent=false] {Boolean} If the render view is transparent, default false * @param [options.antialias=false] {Boolean} sets antialias (only applicable in chrome at the moment) * @param [options.preserveDrawingBuffer=false] {Boolean} enables drawing buffer preservation, enable this if you need to call toDataUrl on the webgl context * @param [options.resolution=1] {Number} the resolution of the renderer retina would be 2 - * */ PIXI.WebGLRenderer = function(width, height, options) { @@ -37,13 +35,16 @@ options = PIXI.defaultRenderOptions; } - if(!PIXI.defaultRenderer) { PIXI.sayHello('webGL'); PIXI.defaultRenderer = this; } + /** + * @property type + * @type Number + */ this.type = PIXI.WEBGL_RENDERER; /** @@ -56,6 +57,7 @@ this.resolution = options.resolution; // do a catch.. only 1 webGL renderer.. + /** * Whether the render view is transparent * @@ -99,12 +101,27 @@ this.view = options.view || document.createElement( 'canvas' ); // deal with losing context.. + + /** + * @property contextLostBound + * @type Function + */ this.contextLostBound = this.handleContextLost.bind(this); + + /** + * @property contextRestoredBound + * @type Function + */ this.contextRestoredBound = this.handleContextRestored.bind(this); this.view.addEventListener('webglcontextlost', this.contextLostBound, false); this.view.addEventListener('webglcontextrestored', this.contextRestoredBound, false); + /** + * @property _contextOptions + * @type Object + * @private + */ this._contextOptions = { alpha: this.transparent, antialias: options.antialias, // SPEED UP?? @@ -113,18 +130,67 @@ preserveDrawingBuffer: options.preserveDrawingBuffer }; + /** + * @property projection + * @type Point + */ this.projection = new PIXI.Point(); + + /** + * @property offset + * @type Point + */ this.offset = new PIXI.Point(0, 0); - // time to create the render managers! each one focuses on managine a state in webGL - 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(); // manages the stencil buffer - this.blendModeManager = new PIXI.WebGLBlendModeManager(); // manages the blendModes + // time to create the render managers! each one focuses on managing a state in webGL - // TODO remove + /** + * Deals with managing the shader programs and their attribs + * @property shaderManager + * @type WebGLShaderManager + */ + this.shaderManager = new PIXI.WebGLShaderManager(); + + /** + * Manages the rendering of sprites + * @property spriteBatch + * @type WebGLSpriteBatch + */ + this.spriteBatch = new PIXI.WebGLSpriteBatch(); + + /** + * Manages the masks using the stencil buffer + * @property maskManager + * @type WebGLMaskManager + */ + this.maskManager = new PIXI.WebGLMaskManager(); + + /** + * Manages the filters + * @property filterManager + * @type WebGLFilterManager + */ + this.filterManager = new PIXI.WebGLFilterManager(); + + /** + * Manages the stencil buffer + * @property stencilManager + * @type WebGLStencilManager + */ + this.stencilManager = new PIXI.WebGLStencilManager(); + + /** + * Manages the blendModes + * @property blendModeManager + * @type WebGLBlendModeManager + */ + this.blendModeManager = new PIXI.WebGLBlendModeManager(); + + /** + * TODO remove + * @property renderSession + * @type Object + */ this.renderSession = {}; this.renderSession.gl = this.gl; this.renderSession.drawCount = 0; @@ -147,6 +213,9 @@ // constructor PIXI.WebGLRenderer.prototype.constructor = PIXI.WebGLRenderer; +/** +* @method initContext +*/ PIXI.WebGLRenderer.prototype.initContext = function() { var gl = this.view.getContext('webgl', this._contextOptions) || this.view.getContext('experimental-webgl', this._contextOptions); @@ -180,7 +249,6 @@ this.resize(this.width, this.height); }; - /** * Renders the stage to its webGL view * @@ -205,9 +273,7 @@ // update the scene graph stage.updateTransform(); - var gl = this.gl; - // interaction if(stage._interactive) @@ -249,9 +315,9 @@ }; /** - * Renders a display Object + * Renders a Display Object. * - * @method renderDIsplayObject + * @method renderDisplayObject * @param displayObject {DisplayObject} The DisplayObject to render * @param projection {Point} The projection * @param buffer {Array} a standard WebGL buffer @@ -283,7 +349,7 @@ }; /** - * resizes the webGL view to the specified width and height + * Resizes the webGL view to the specified width and height. * * @method resize * @param width {Number} the new width of the webGL view @@ -297,10 +363,6 @@ this.view.width = this.width; this.view.height = this.height; - // this.view.style.width = width + 'px'; - // this.view.style.height = height + 'px'; - - // console.log(this.width / this.resolution) this.gl.viewport(0, 0, this.width, this.height); this.projection.x = this.width / 2 / this.resolution; @@ -308,10 +370,10 @@ }; /** - * Updates and Creates a WebGL texture for the renderers context + * Updates and Creates a WebGL texture for the renderers context. * * @method updateTexture - * @param texture {Texture} the texture to render + * @param texture {Texture} the texture to update */ PIXI.WebGLRenderer.prototype.updateTexture = function(texture) { @@ -411,6 +473,11 @@ this.renderSession = null; }; +/** + * Maps Pixi blend modes to WebGL blend modes. + * + * @method mapBlendModes + */ PIXI.WebGLRenderer.prototype.mapBlendModes = function() { var gl = this.gl; diff --git a/src/pixi/renderers/webgl/shaders/ComplexPrimitiveShader.js b/src/pixi/renderers/webgl/shaders/ComplexPrimitiveShader.js index daa8b64..79d038a 100644 --- a/src/pixi/renderers/webgl/shaders/ComplexPrimitiveShader.js +++ b/src/pixi/renderers/webgl/shaders/ComplexPrimitiveShader.js @@ -9,7 +9,13 @@ */ PIXI.ComplexPrimitiveShader = function(gl) { + /** + * @property _UID + * @type Number + * @private + */ this._UID = PIXI._UID++; + /** * @property gl * @type WebGLContext @@ -17,18 +23,20 @@ this.gl = gl; /** - * @property {any} program - The WebGL program. - */ + * The WebGL program. + * @property program + * @type {Any} + */ this.program = null; /** + * The fragment shader. * @property fragmentSrc * @type Array */ this.fragmentSrc = [ - 'precision mediump float;', - + 'precision mediump float;', 'varying vec4 vColor;', @@ -38,6 +46,7 @@ ]; /** + * The vertex shader. * @property vertexSrc * @type Array */ @@ -65,14 +74,15 @@ this.init(); }; +PIXI.ComplexPrimitiveShader.prototype.constructor = PIXI.ComplexPrimitiveShader; + /** -* Initialises the shader +* Initialises the shader. +* * @method init -* */ PIXI.ComplexPrimitiveShader.prototype.init = function() { - var gl = this.gl; var program = PIXI.compileProgram(gl, this.vertexSrc, this.fragmentSrc); @@ -84,7 +94,6 @@ this.tintColor = gl.getUniformLocation(program, 'tint'); this.color = gl.getUniformLocation(program, 'color'); - // get and store the attributes this.aVertexPosition = gl.getAttribLocation(program, 'aVertexPosition'); // this.colorAttribute = gl.getAttribLocation(program, 'aColor'); @@ -98,9 +107,9 @@ }; /** -* Destroys the shader +* Destroys the shader. +* * @method destroy -* */ PIXI.ComplexPrimitiveShader.prototype.destroy = function() { diff --git a/src/pixi/renderers/webgl/shaders/PixiFastShader.js b/src/pixi/renderers/webgl/shaders/PixiFastShader.js index 4fb3fe2..bb46419 100644 --- a/src/pixi/renderers/webgl/shaders/PixiFastShader.js +++ b/src/pixi/renderers/webgl/shaders/PixiFastShader.js @@ -1,6 +1,5 @@ /** * @author Mat Groves http://matgroves.com/ @Doormat23 - * @author Richard Davey http://www.photonstorm.com @photonstorm */ /** @@ -10,6 +9,11 @@ */ PIXI.PixiFastShader = function(gl) { + /** + * @property _UID + * @type Number + * @private + */ this._UID = PIXI._UID++; /** @@ -19,12 +23,16 @@ this.gl = gl; /** - * @property {any} program - The WebGL program. + * The WebGL program. + * @property program + * @type {Any} */ this.program = null; /** - * @property {array} fragmentSrc - The fragment shader. + * The fragment shader. + * @property fragmentSrc + * @type Array */ this.fragmentSrc = [ 'precision lowp float;', @@ -37,8 +45,10 @@ ]; /** - * @property {array} vertexSrc - The vertex shader - */ + * The vertex shader. + * @property vertexSrc + * @type Array + */ this.vertexSrc = [ 'attribute vec2 aVertexPosition;', 'attribute vec2 aPositionCoord;', @@ -69,24 +79,25 @@ '}' ]; - /** - * @property {number} textureCount - A local texture counter for multi-texture shaders. - */ + * A local texture counter for multi-texture shaders. + * @property textureCount + * @type Number + */ this.textureCount = 0; - this.init(); }; +PIXI.PixiFastShader.prototype.constructor = PIXI.PixiFastShader; + /** -* Initialises the shader +* Initialises the shader. +* * @method init -* */ PIXI.PixiFastShader.prototype.init = function() { - var gl = this.gl; var program = PIXI.compileProgram(gl, this.vertexSrc, this.fragmentSrc); @@ -111,8 +122,6 @@ this.aTextureCoord = gl.getAttribLocation(program, 'aTextureCoord'); this.colorAttribute = gl.getAttribLocation(program, 'aColor'); - - // Begin worst hack eva // // WHY??? ONLY on my chrome pixel the line above returns -1 when using filters? @@ -128,14 +137,13 @@ // End worst hack eva // - this.program = program; }; /** -* Destroys the shader +* Destroys the shader. +* * @method destroy -* */ PIXI.PixiFastShader.prototype.destroy = function() { diff --git a/src/pixi/renderers/webgl/shaders/PixiShader.js b/src/pixi/renderers/webgl/shaders/PixiShader.js index d76ec03..725dce2 100644 --- a/src/pixi/renderers/webgl/shaders/PixiShader.js +++ b/src/pixi/renderers/webgl/shaders/PixiShader.js @@ -6,9 +6,15 @@ /** * @class PixiShader * @constructor +* @param gl {WebGLContext} the current WebGL drawing context */ PIXI.PixiShader = function(gl) { + /** + * @property _UID + * @type Number + * @private + */ this._UID = PIXI._UID++; /** @@ -18,13 +24,17 @@ this.gl = gl; /** - * @property {any} program - The WebGL program. - */ + * The WebGL program. + * @property program + * @type {Any} + */ this.program = null; /** - * @property {array} fragmentSrc - The fragment shader. - */ + * The fragment shader. + * @property fragmentSrc + * @type Array + */ this.fragmentSrc = [ 'precision lowp float;', 'varying vec2 vTextureCoord;', @@ -36,21 +46,44 @@ ]; /** - * @property {number} textureCount - A local texture counter for multi-texture shaders. - */ + * A local texture counter for multi-texture shaders. + * @property textureCount + * @type Number + */ this.textureCount = 0; + + /** + * A local flag + * @property firstRun + * @type Boolean + * @private + */ this.firstRun = true; + + /** + * A dirty flag + * @property dirty + * @type Boolean + */ this.dirty = true; + /** + * Uniform attributes cache. + * @property attributes + * @type Array + * @private + */ this.attributes = []; this.init(); }; +PIXI.PixiShader.prototype.constructor = PIXI.PixiShader; + /** -* Initialises the shader +* Initialises the shader. +* * @method init -* */ PIXI.PixiShader.prototype.init = function() { @@ -71,12 +104,11 @@ this.aTextureCoord = gl.getAttribLocation(program, 'aTextureCoord'); this.colorAttribute = gl.getAttribLocation(program, 'aColor'); - // Begin worst hack eva // // WHY??? ONLY on my chrome pixel the line above returns -1 when using filters? // maybe its something to do with the current state of the gl context. - // Im convinced this is a bug in the chrome browser as there is NO reason why this should be returning -1 especially as it only manifests on my chrome pixel + // I'm convinced this is a bug in the chrome browser as there is NO reason why this should be returning -1 especially as it only manifests on my chrome pixel // If theres any webGL people that know why could happen please help :) if(this.colorAttribute === -1) { @@ -101,6 +133,7 @@ /** * Initialises the shader uniform values. +* * Uniforms are specified in the GLSL_ES Specification: http://www.khronos.org/registry/webgl/specs/latest/1.0/ * http://www.khronos.org/registry/gles/specs/2.0/GLSL_ES_Specification_1.0.17.pdf * @@ -316,7 +349,8 @@ }; /** -* Destroys the shader +* Destroys the shader. +* * @method destroy */ PIXI.PixiShader.prototype.destroy = function() @@ -329,7 +363,8 @@ }; /** -* The Default Vertex shader source +* The Default Vertex shader source. +* * @property defaultVertexSrc * @type String */ diff --git a/src/pixi/renderers/webgl/shaders/PrimitiveShader.js b/src/pixi/renderers/webgl/shaders/PrimitiveShader.js index 3a82be2..0f6854c 100644 --- a/src/pixi/renderers/webgl/shaders/PrimitiveShader.js +++ b/src/pixi/renderers/webgl/shaders/PrimitiveShader.js @@ -9,6 +9,11 @@ */ PIXI.PrimitiveShader = function(gl) { + /** + * @property _UID + * @type Number + * @private + */ this._UID = PIXI._UID++; /** @@ -18,11 +23,14 @@ this.gl = gl; /** - * @property {any} program - The WebGL program. - */ + * The WebGL program. + * @property program + * @type {Any} + */ this.program = null; /** + * The fragment shader. * @property fragmentSrc * @type Array */ @@ -36,6 +44,7 @@ ]; /** + * The vertex shader. * @property vertexSrc * @type Array */ @@ -60,14 +69,15 @@ this.init(); }; +PIXI.PrimitiveShader.prototype.constructor = PIXI.PrimitiveShader; + /** -* Initialises the shader +* Initialises the shader. +* * @method init -* */ PIXI.PrimitiveShader.prototype.init = function() { - var gl = this.gl; var program = PIXI.compileProgram(gl, this.vertexSrc, this.fragmentSrc); @@ -78,7 +88,6 @@ this.offsetVector = gl.getUniformLocation(program, 'offsetVector'); this.tintColor = gl.getUniformLocation(program, 'tint'); - // get and store the attributes this.aVertexPosition = gl.getAttribLocation(program, 'aVertexPosition'); this.colorAttribute = gl.getAttribLocation(program, 'aColor'); @@ -92,9 +101,9 @@ }; /** -* Destroys the shader +* Destroys the shader. +* * @method destroy -* */ PIXI.PrimitiveShader.prototype.destroy = function() { diff --git a/src/pixi/renderers/webgl/shaders/StripShader.js b/src/pixi/renderers/webgl/shaders/StripShader.js index 11f13ad..8fefe51 100644 --- a/src/pixi/renderers/webgl/shaders/StripShader.js +++ b/src/pixi/renderers/webgl/shaders/StripShader.js @@ -2,20 +2,37 @@ * @author Mat Groves http://matgroves.com/ @Doormat23 */ - +/** +* @class StripShader +* @constructor +* @param gl {WebGLContext} the current WebGL drawing context +*/ PIXI.StripShader = function(gl) { + /** + * @property _UID + * @type Number + * @private + */ this._UID = PIXI._UID++; + /** + * @property gl + * @type WebGLContext + */ this.gl = gl; /** - * @property {any} program - The WebGL program. - */ + * The WebGL program. + * @property program + * @type {Any} + */ this.program = null; /** - * @property {array} fragmentSrc - The fragment shader. + * The fragment shader. + * @property fragmentSrc + * @type Array */ this.fragmentSrc = [ 'precision mediump float;', @@ -30,9 +47,11 @@ '}' ]; - /** - * @property {array} fragmentSrc - The fragment shader. - */ + /** + * The vertex shader. + * @property vertexSrc + * @type Array + */ this.vertexSrc = [ 'attribute vec2 aVertexPosition;', 'attribute vec2 aTextureCoord;', @@ -56,10 +75,12 @@ this.init(); }; +PIXI.StripShader.prototype.constructor = PIXI.StripShader; + /** -* Initialises the shader +* Initialises the shader. +* * @method init -* */ PIXI.StripShader.prototype.init = function() { @@ -88,9 +109,9 @@ }; /** -* Destroys the shader +* Destroys the shader. +* * @method destroy -* */ PIXI.StripShader.prototype.destroy = function() { diff --git a/src/pixi/renderers/webgl/utils/FilterTexture.js b/src/pixi/renderers/webgl/utils/FilterTexture.js index 9dada23..389acbe 100644 --- a/src/pixi/renderers/webgl/utils/FilterTexture.js +++ b/src/pixi/renderers/webgl/utils/FilterTexture.js @@ -9,7 +9,6 @@ * @param width {Number} the horizontal range of the filter * @param height {Number} the vertical range of the filter * @param scaleMode {Number} Should be one of the PIXI.scaleMode consts -* @private */ PIXI.FilterTexture = function(gl, width, height, scaleMode) { @@ -19,11 +18,24 @@ */ this.gl = gl; - // next time to create a frame buffer and texture + + /** + * @property frameBuffer + * @type Any + */ this.frameBuffer = gl.createFramebuffer(); + + /** + * @property texture + * @type Any + */ this.texture = gl.createTexture(); + /** + * @property scaleMode + * @type Number + */ scaleMode = scaleMode || PIXI.scaleModes.DEFAULT; gl.bindTexture(gl.TEXTURE_2D, this.texture); @@ -44,9 +56,11 @@ this.resize(width, height); }; +PIXI.FilterTexture.prototype.constructor = PIXI.FilterTexture; /** -* Clears the filter texture +* Clears the filter texture. +* * @method clear */ PIXI.FilterTexture.prototype.clear = function() @@ -75,14 +89,14 @@ gl.bindTexture(gl.TEXTURE_2D, this.texture); gl.texImage2D(gl.TEXTURE_2D, 0, gl.RGBA, width , height , 0, gl.RGBA, gl.UNSIGNED_BYTE, null); - // console.log( width, width ) // update the stencil buffer width and height gl.bindRenderbuffer(gl.RENDERBUFFER, this.renderBuffer); gl.renderbufferStorage(gl.RENDERBUFFER, gl.DEPTH_STENCIL, width , height ); }; /** -* Destroys the filter texture +* Destroys the filter texture. +* * @method destroy */ PIXI.FilterTexture.prototype.destroy = function() diff --git a/src/pixi/renderers/webgl/utils/WebGLBlendModeManager.js b/src/pixi/renderers/webgl/utils/WebGLBlendModeManager.js index c73728f..3de0ec9 100644 --- a/src/pixi/renderers/webgl/utils/WebGLBlendModeManager.js +++ b/src/pixi/renderers/webgl/utils/WebGLBlendModeManager.js @@ -3,31 +3,42 @@ */ /** -* @class WebGLMaskManager +* @class WebGLBlendModeManager * @constructor * @param gl {WebGLContext} the current WebGL drawing context -* @private */ PIXI.WebGLBlendModeManager = function() { + /** + * @property currentBlendMode + * @type Number + */ this.currentBlendMode = 99999; }; +PIXI.WebGLBlendModeManager.prototype.constructor = PIXI.WebGLBlendModeManager; + +/** + * Sets the WebGL Context. + * + * @method setContext + * @param gl {WebGLContext} the current WebGL drawing context + */ PIXI.WebGLBlendModeManager.prototype.setContext = function(gl) { this.gl = gl; }; /** -* Sets-up the given blendMode from WebGL's point of view +* Sets-up the given blendMode from WebGL's point of view. +* * @method setBlendMode -* * @param blendMode {Number} the blendMode, should be a Pixi const, such as PIXI.BlendModes.ADD */ PIXI.WebGLBlendModeManager.prototype.setBlendMode = function(blendMode) { if(this.currentBlendMode === blendMode)return false; - // console.log("SWAP!") + this.currentBlendMode = blendMode; var blendModeWebGL = PIXI.blendModesWebGL[this.currentBlendMode]; @@ -36,7 +47,12 @@ return true; }; +/** +* Destroys this object. +* +* @method destroy +*/ PIXI.WebGLBlendModeManager.prototype.destroy = function() { this.gl = null; -}; \ No newline at end of file +}; diff --git a/src/pixi/renderers/webgl/utils/WebGLFastSpriteBatch.js b/src/pixi/renderers/webgl/utils/WebGLFastSpriteBatch.js index 0d08e47..0bdbbe4 100644 --- a/src/pixi/renderers/webgl/utils/WebGLFastSpriteBatch.js +++ b/src/pixi/renderers/webgl/utils/WebGLFastSpriteBatch.js @@ -8,27 +8,66 @@ * https://github.com/libgdx/libgdx/blob/master/gdx/src/com/badlogic/gdx/graphics/g2d/WebGLSpriteBatch.java */ +/** +* @class WebGLFastSpriteBatch +* @constructor +*/ PIXI.WebGLFastSpriteBatch = function() { - - + /** + * @property vertSize + * @type Number + */ this.vertSize = 10; + + /** + * @property maxSize + * @type Number + */ this.maxSize = 6000;//Math.pow(2, 16) / this.vertSize; + + /** + * @property size + * @type Number + */ this.size = this.maxSize; //the total number of floats in our batch var numVerts = this.size * 4 * this.vertSize; + //the total number of indices in our batch var numIndices = this.maxSize * 6; - //vertex data + /** + * Vertex data + * @property vertices + * @type Float32Array + */ this.vertices = new Float32Array(numVerts); - //index data + + /** + * Index data + * @property indices + * @type Uint16Array + */ this.indices = new Uint16Array(numIndices); + /** + * @property vertexBuffer + * @type Object + */ this.vertexBuffer = null; + + /** + * @property indexBuffer + * @type Object + */ this.indexBuffer = null; + /** + * @property lastIndexCount + * @type Number + */ this.lastIndexCount = 0; for (var i=0, j=0; i < numIndices; i += 6, j += 4) @@ -41,21 +80,58 @@ this.indices[i + 5] = j + 3; } + /** + * @property drawing + * @type Boolean + */ this.drawing = false; + + /** + * @property currentBatchSize + * @type Number + */ this.currentBatchSize = 0; + + /** + * @property currentBaseTexture + * @type BaseTexture + */ this.currentBaseTexture = null; + /** + * @property currentBlendMode + * @type Number + */ this.currentBlendMode = 0; + + /** + * @property renderSession + * @type Object + */ this.renderSession = null; - + /** + * @property shader + * @type Object + */ this.shader = null; + /** + * @property matrix + * @type Matrix + */ this.matrix = null; - //this.setContext(gl); }; +PIXI.WebGLFastSpriteBatch.prototype.constructor = PIXI.WebGLFastSpriteBatch; + +/** + * Sets the WebGL Context. + * + * @method setContext + * @param gl {WebGLContext} the current WebGL drawing context + */ PIXI.WebGLFastSpriteBatch.prototype.setContext = function(gl) { this.gl = gl; @@ -66,7 +142,6 @@ // 65535 is max index, so 65535 / 6 = 10922. - //upload the index data gl.bindBuffer(gl.ELEMENT_ARRAY_BUFFER, this.indexBuffer); gl.bufferData(gl.ELEMENT_ARRAY_BUFFER, this.indices, gl.STATIC_DRAW); @@ -75,6 +150,11 @@ gl.bufferData(gl.ARRAY_BUFFER, this.vertices, gl.DYNAMIC_DRAW); }; +/** + * @method begin + * @param spriteBatch {WebGLSpriteBatch} + * @param renderSession {Object} + */ PIXI.WebGLFastSpriteBatch.prototype.begin = function(spriteBatch, renderSession) { this.renderSession = renderSession; @@ -85,15 +165,20 @@ this.start(); }; +/** + * @method end + */ PIXI.WebGLFastSpriteBatch.prototype.end = function() { this.flush(); }; - +/** + * @method render + * @param spriteBatch {WebGLSpriteBatch} + */ PIXI.WebGLFastSpriteBatch.prototype.render = function(spriteBatch) { - var children = spriteBatch.children; var sprite = children[0]; @@ -119,6 +204,10 @@ this.flush(); }; +/** + * @method renderSprite + * @param sprite {Sprite} + */ PIXI.WebGLFastSpriteBatch.prototype.renderSprite = function(sprite) { //sprite = children[i]; @@ -137,7 +226,6 @@ uvs = sprite.texture._uvs; - width = sprite.texture.frame.width; height = sprite.texture.frame.height; @@ -257,9 +345,11 @@ } }; +/** + * @method flush + */ PIXI.WebGLFastSpriteBatch.prototype.flush = function() { - // If the batch is length 0 then return as there is nothing to draw if (this.currentBatchSize===0)return; @@ -272,7 +362,6 @@ gl.bindTexture(gl.TEXTURE_2D, this.currentBaseTexture._glTextures[gl.id]); // upload the verts to the buffer - if(this.currentBatchSize > ( this.size * 0.5 ) ) { @@ -285,7 +374,6 @@ gl.bufferSubData(gl.ARRAY_BUFFER, 0, view); } - // now draw those suckas! gl.drawElements(gl.TRIANGLES, this.currentBatchSize * 6, gl.UNSIGNED_SHORT, 0); @@ -297,11 +385,17 @@ }; +/** + * @method stop + */ PIXI.WebGLFastSpriteBatch.prototype.stop = function() { this.flush(); }; +/** + * @method start + */ PIXI.WebGLFastSpriteBatch.prototype.start = function() { var gl = this.gl; @@ -329,8 +423,5 @@ gl.vertexAttribPointer(this.shader.aRotation, 1, gl.FLOAT, false, stride, 6 * 4); gl.vertexAttribPointer(this.shader.aTextureCoord, 2, gl.FLOAT, false, stride, 7 * 4); gl.vertexAttribPointer(this.shader.colorAttribute, 1, gl.FLOAT, false, stride, 9 * 4); - }; - - diff --git a/src/pixi/renderers/webgl/utils/WebGLFilterManager.js b/src/pixi/renderers/webgl/utils/WebGLFilterManager.js index 9bb9195..359a834 100644 --- a/src/pixi/renderers/webgl/utils/WebGLFilterManager.js +++ b/src/pixi/renderers/webgl/utils/WebGLFilterManager.js @@ -5,22 +5,33 @@ /** * @class WebGLFilterManager * @constructor -* @param gl {WebGLContext} the current WebGL drawing context -* @private */ PIXI.WebGLFilterManager = function() { + /** + * @property filterStack + * @type Array + */ this.filterStack = []; + /** + * @property offsetX + * @type Number + */ this.offsetX = 0; - this.offsetY = 0; - // this.setContext(gl); + /** + * @property offsetY + * @type Number + */ + this.offsetY = 0; }; -// API +PIXI.WebGLFilterManager.prototype.constructor = PIXI.WebGLFilterManager; + /** -* Initialises the context and the properties +* Initialises the context and the properties. +* * @method setContext * @param gl {WebGLContext} the current WebGL drawing context */ @@ -33,7 +44,6 @@ }; /** -* * @method begin * @param renderSession {RenderSession} * @param buffer {ArrayBuffer} @@ -44,14 +54,14 @@ this.defaultShader = renderSession.shaderManager.defaultShader; var projection = this.renderSession.projection; - // console.log(this.width) this.width = projection.x * 2; this.height = -projection.y * 2; this.buffer = buffer; }; /** -* Applies the filter and adds it to the current filter stack +* Applies the filter and adds it to the current filter stack. +* * @method pushFilter * @param filterBlock {Object} the filter that will be pushed to the current filter stack */ @@ -64,7 +74,6 @@ filterBlock._filterArea = filterBlock.target.filterArea || filterBlock.target.getBounds(); - // filter program // OPTIMISATION - the first filter is free if its a simple color change? this.filterStack.push(filterBlock); @@ -126,9 +135,9 @@ }; - /** -* Removes the last filter from the filter stack and doesn't return it +* Removes the last filter from the filter stack and doesn't return it. +* * @method popFilter */ PIXI.WebGLFilterManager.prototype.popFilter = function() @@ -211,7 +220,6 @@ this.offsetX -= filterArea.x; this.offsetY -= filterArea.y; - var sizeX = this.width; var sizeY = this.height; @@ -239,9 +247,7 @@ buffer = currentFilter._glFilterTexture.frameBuffer; } - - - // TODO need toremove thease global elements.. + // TODO need to remove these global elements.. projection.x = sizeX/2; projection.y = -sizeY/2; @@ -280,10 +286,6 @@ gl.bufferSubData(gl.ARRAY_BUFFER, 0, this.uvArray); - //console.log(this.vertexArray) - //console.log(this.uvArray) - //console.log(sizeX + " : " + sizeY) - gl.viewport(0, 0, sizeX, sizeY); // bind the buffer @@ -300,9 +302,9 @@ this.applyFilterPass(filter, filterArea, sizeX, sizeY); // now restore the regular shader.. should happen automatically now.. - // this.renderSession.shaderManager.setShader(this.defaultShader); - // gl.uniform2f(this.defaultShader.projectionVector, sizeX/2, -sizeY/2); - // gl.uniform2f(this.defaultShader.offsetVector, -offsetX, -offsetY); + // this.renderSession.shaderManager.setShader(this.defaultShader); + // gl.uniform2f(this.defaultShader.projectionVector, sizeX/2, -sizeY/2); + // gl.uniform2f(this.defaultShader.offsetVector, -offsetX, -offsetY); // return the texture to the pool this.texturePool.push(texture); @@ -311,7 +313,8 @@ /** -* Applies the filter to the specified area +* Applies the filter to the specified area. +* * @method applyFilterPass * @param filter {AbstractFilter} the filter that needs to be applied * @param filterArea {texture} TODO - might need an update @@ -351,7 +354,6 @@ filter.uniforms.dimensions.value[3] = this.vertexArray[5];//filterArea.height; } - // console.log(this.uvArray ) shader.syncUniforms(); gl.bindBuffer(gl.ARRAY_BUFFER, this.vertexBuffer); @@ -372,7 +374,8 @@ }; /** -* Initialises the shader buffers +* Initialises the shader buffers. +* * @method initShaderBuffers */ PIXI.WebGLFilterManager.prototype.initShaderBuffers = function() @@ -385,7 +388,6 @@ this.colorBuffer = gl.createBuffer(); this.indexBuffer = gl.createBuffer(); - // bind and upload the vertexs.. // keep a reference to the vertexFloatData.. this.vertexArray = new Float32Array([0.0, 0.0, @@ -394,11 +396,7 @@ 1.0, 1.0]); gl.bindBuffer(gl.ARRAY_BUFFER, this.vertexBuffer); - gl.bufferData( - gl.ARRAY_BUFFER, - this.vertexArray, - gl.STATIC_DRAW); - + gl.bufferData(gl.ARRAY_BUFFER, this.vertexArray, gl.STATIC_DRAW); // bind and upload the uv buffer this.uvArray = new Float32Array([0.0, 0.0, @@ -407,10 +405,7 @@ 1.0, 1.0]); gl.bindBuffer(gl.ARRAY_BUFFER, this.uvBuffer); - gl.bufferData( - gl.ARRAY_BUFFER, - this.uvArray, - gl.STATIC_DRAW); + gl.bufferData(gl.ARRAY_BUFFER, this.uvArray, gl.STATIC_DRAW); this.colorArray = new Float32Array([1.0, 0xFFFFFF, 1.0, 0xFFFFFF, @@ -418,21 +413,17 @@ 1.0, 0xFFFFFF]); gl.bindBuffer(gl.ARRAY_BUFFER, this.colorBuffer); - gl.bufferData( - gl.ARRAY_BUFFER, - this.colorArray, - gl.STATIC_DRAW); + gl.bufferData(gl.ARRAY_BUFFER, this.colorArray, gl.STATIC_DRAW); // bind and upload the index gl.bindBuffer(gl.ELEMENT_ARRAY_BUFFER, this.indexBuffer); - gl.bufferData( - gl.ELEMENT_ARRAY_BUFFER, - new Uint16Array([0, 1, 2, 1, 3, 2]), - gl.STATIC_DRAW); + gl.bufferData(gl.ELEMENT_ARRAY_BUFFER, new Uint16Array([0, 1, 2, 1, 3, 2]), gl.STATIC_DRAW); + }; /** -* Destroys the filter and removes it from the filter stack +* Destroys the filter and removes it from the filter stack. +* * @method destroy */ PIXI.WebGLFilterManager.prototype.destroy = function() diff --git a/src/pixi/InteractionData.js b/src/pixi/InteractionData.js index ea77370..fa84a6d 100644 --- a/src/pixi/InteractionData.js +++ b/src/pixi/InteractionData.js @@ -18,7 +18,6 @@ */ this.global = new PIXI.Point(); - /** * The target Sprite that was interacted with * diff --git a/src/pixi/InteractionManager.js b/src/pixi/InteractionManager.js index 685c386..71f320b 100644 --- a/src/pixi/InteractionManager.js +++ b/src/pixi/InteractionManager.js @@ -14,7 +14,7 @@ PIXI.InteractionManager = function(stage) { /** - * a reference to the stage + * A reference to the stage * * @property stage * @type Stage @@ -22,7 +22,7 @@ this.stage = stage; /** - * the mouse data + * The mouse data * * @property mouse * @type InteractionData @@ -30,18 +30,21 @@ this.mouse = new PIXI.InteractionData(); /** - * an object that stores current touches (InteractionData) by id reference + * An object that stores current touches (InteractionData) by id reference * * @property touches * @type Object */ this.touches = {}; - // helpers + /** + * @property tempPoint + * @type Point + * @private + */ this.tempPoint = new PIXI.Point(); /** - * * @property mouseoverEnabled * @type Boolean * @default @@ -49,7 +52,7 @@ this.mouseoverEnabled = true; /** - * tiny little interactiveData pool ! + * Tiny little interactiveData pool ! * * @property pool * @type Array @@ -61,7 +64,6 @@ * @property interactiveItems * @type Array * @private - * */ this.interactiveItems = []; @@ -73,23 +75,60 @@ */ this.interactionDOMElement = null; - //this will make it so that you dont have to call bind all the time + //this will make it so that you don't have to call bind all the time + + /** + * @property onMouseMove + * @type Function + */ this.onMouseMove = this.onMouseMove.bind( this ); + + /** + * @property onMouseDown + * @type Function + */ this.onMouseDown = this.onMouseDown.bind(this); + + /** + * @property onMouseOut + * @type Function + */ this.onMouseOut = this.onMouseOut.bind(this); + + /** + * @property onMouseUp + * @type Function + */ this.onMouseUp = this.onMouseUp.bind(this); + /** + * @property onTouchStart + * @type Function + */ this.onTouchStart = this.onTouchStart.bind(this); + + /** + * @property onTouchEnd + * @type Function + */ this.onTouchEnd = this.onTouchEnd.bind(this); + + /** + * @property onTouchMove + * @type Function + */ this.onTouchMove = this.onTouchMove.bind(this); + /** + * @property last + * @type Number + */ this.last = 0; /** * The css style of the cursor that is being used * @property currentCursorStyle * @type String - * */ this.currentCursorStyle = 'inherit'; @@ -97,10 +136,13 @@ * Is set to true when the mouse is moved out of the canvas * @property mouseOut * @type Boolean - * */ this.mouseOut = false; + /** + * @property resolution + * @type Number + */ this.resolution = 1; }; @@ -166,7 +208,6 @@ this.setTargetDomElement (target.view); }; - /** * Sets the DOM element which will receive mouse/touch events. This is useful for when you have other DOM * elements on top of the renderers Canvas element. With this you'll be able to delegate another DOM element @@ -201,7 +242,10 @@ window.addEventListener('mouseup', this.onMouseUp, true); }; - +/** + * @method removeEvents + * @private + */ PIXI.InteractionManager.prototype.removeEvents = function() { if (!this.interactionDOMElement) return; @@ -308,6 +352,10 @@ } }; +/** + * @method rebuildInteractiveGraph + * @private + */ PIXI.InteractionManager.prototype.rebuildInteractiveGraph = function() { this.dirty = false; @@ -427,10 +475,10 @@ }; /** - * Is called when the mouse button is moved out of the renderer element + * Is called when the mouse is moved out of the renderer element * * @method onMouseOut - * @param event {Event} The DOM event of a mouse button being moved out + * @param event {Event} The DOM event of a mouse being moved out * @private */ PIXI.InteractionManager.prototype.onMouseOut = function(event) diff --git a/src/pixi/renderers/webgl/WebGLRenderer.js b/src/pixi/renderers/webgl/WebGLRenderer.js index 968fd3d..422896f 100644 --- a/src/pixi/renderers/webgl/WebGLRenderer.js +++ b/src/pixi/renderers/webgl/WebGLRenderer.js @@ -5,23 +5,21 @@ PIXI.glContexts = []; // this is where we store the webGL contexts for easy access. /** - * the WebGLRenderer draws the stage and all its content onto a webGL enabled canvas. This renderer - * should be used for browsers that support webGL. This Render works by automatically managing webGLBatch's. - * So no need for Sprite Batch's or Sprite Cloud's - * Dont forget to add the view to your DOM or you will not see anything :) + * The WebGLRenderer draws the stage and all its content onto a webGL enabled canvas. This renderer + * should be used for browsers that support webGL. This Render works by automatically managing webGLBatchs. + * So no need for Sprite Batches or Sprite Clouds. + * Don't forget to add the view to your DOM or you will not see anything :) * * @class WebGLRenderer * @constructor * @param [width=0] {Number} the width of the canvas view * @param [height=0] {Number} the height of the canvas view - * * @param [options] {Object} The optional renderer parameters * @param [options.view] {HTMLCanvasElement} the canvas to use as a view, optional * @param [options.transparent=false] {Boolean} If the render view is transparent, default false * @param [options.antialias=false] {Boolean} sets antialias (only applicable in chrome at the moment) * @param [options.preserveDrawingBuffer=false] {Boolean} enables drawing buffer preservation, enable this if you need to call toDataUrl on the webgl context * @param [options.resolution=1] {Number} the resolution of the renderer retina would be 2 - * */ PIXI.WebGLRenderer = function(width, height, options) { @@ -37,13 +35,16 @@ options = PIXI.defaultRenderOptions; } - if(!PIXI.defaultRenderer) { PIXI.sayHello('webGL'); PIXI.defaultRenderer = this; } + /** + * @property type + * @type Number + */ this.type = PIXI.WEBGL_RENDERER; /** @@ -56,6 +57,7 @@ this.resolution = options.resolution; // do a catch.. only 1 webGL renderer.. + /** * Whether the render view is transparent * @@ -99,12 +101,27 @@ this.view = options.view || document.createElement( 'canvas' ); // deal with losing context.. + + /** + * @property contextLostBound + * @type Function + */ this.contextLostBound = this.handleContextLost.bind(this); + + /** + * @property contextRestoredBound + * @type Function + */ this.contextRestoredBound = this.handleContextRestored.bind(this); this.view.addEventListener('webglcontextlost', this.contextLostBound, false); this.view.addEventListener('webglcontextrestored', this.contextRestoredBound, false); + /** + * @property _contextOptions + * @type Object + * @private + */ this._contextOptions = { alpha: this.transparent, antialias: options.antialias, // SPEED UP?? @@ -113,18 +130,67 @@ preserveDrawingBuffer: options.preserveDrawingBuffer }; + /** + * @property projection + * @type Point + */ this.projection = new PIXI.Point(); + + /** + * @property offset + * @type Point + */ this.offset = new PIXI.Point(0, 0); - // time to create the render managers! each one focuses on managine a state in webGL - 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(); // manages the stencil buffer - this.blendModeManager = new PIXI.WebGLBlendModeManager(); // manages the blendModes + // time to create the render managers! each one focuses on managing a state in webGL - // TODO remove + /** + * Deals with managing the shader programs and their attribs + * @property shaderManager + * @type WebGLShaderManager + */ + this.shaderManager = new PIXI.WebGLShaderManager(); + + /** + * Manages the rendering of sprites + * @property spriteBatch + * @type WebGLSpriteBatch + */ + this.spriteBatch = new PIXI.WebGLSpriteBatch(); + + /** + * Manages the masks using the stencil buffer + * @property maskManager + * @type WebGLMaskManager + */ + this.maskManager = new PIXI.WebGLMaskManager(); + + /** + * Manages the filters + * @property filterManager + * @type WebGLFilterManager + */ + this.filterManager = new PIXI.WebGLFilterManager(); + + /** + * Manages the stencil buffer + * @property stencilManager + * @type WebGLStencilManager + */ + this.stencilManager = new PIXI.WebGLStencilManager(); + + /** + * Manages the blendModes + * @property blendModeManager + * @type WebGLBlendModeManager + */ + this.blendModeManager = new PIXI.WebGLBlendModeManager(); + + /** + * TODO remove + * @property renderSession + * @type Object + */ this.renderSession = {}; this.renderSession.gl = this.gl; this.renderSession.drawCount = 0; @@ -147,6 +213,9 @@ // constructor PIXI.WebGLRenderer.prototype.constructor = PIXI.WebGLRenderer; +/** +* @method initContext +*/ PIXI.WebGLRenderer.prototype.initContext = function() { var gl = this.view.getContext('webgl', this._contextOptions) || this.view.getContext('experimental-webgl', this._contextOptions); @@ -180,7 +249,6 @@ this.resize(this.width, this.height); }; - /** * Renders the stage to its webGL view * @@ -205,9 +273,7 @@ // update the scene graph stage.updateTransform(); - var gl = this.gl; - // interaction if(stage._interactive) @@ -249,9 +315,9 @@ }; /** - * Renders a display Object + * Renders a Display Object. * - * @method renderDIsplayObject + * @method renderDisplayObject * @param displayObject {DisplayObject} The DisplayObject to render * @param projection {Point} The projection * @param buffer {Array} a standard WebGL buffer @@ -283,7 +349,7 @@ }; /** - * resizes the webGL view to the specified width and height + * Resizes the webGL view to the specified width and height. * * @method resize * @param width {Number} the new width of the webGL view @@ -297,10 +363,6 @@ this.view.width = this.width; this.view.height = this.height; - // this.view.style.width = width + 'px'; - // this.view.style.height = height + 'px'; - - // console.log(this.width / this.resolution) this.gl.viewport(0, 0, this.width, this.height); this.projection.x = this.width / 2 / this.resolution; @@ -308,10 +370,10 @@ }; /** - * Updates and Creates a WebGL texture for the renderers context + * Updates and Creates a WebGL texture for the renderers context. * * @method updateTexture - * @param texture {Texture} the texture to render + * @param texture {Texture} the texture to update */ PIXI.WebGLRenderer.prototype.updateTexture = function(texture) { @@ -411,6 +473,11 @@ this.renderSession = null; }; +/** + * Maps Pixi blend modes to WebGL blend modes. + * + * @method mapBlendModes + */ PIXI.WebGLRenderer.prototype.mapBlendModes = function() { var gl = this.gl; diff --git a/src/pixi/renderers/webgl/shaders/ComplexPrimitiveShader.js b/src/pixi/renderers/webgl/shaders/ComplexPrimitiveShader.js index daa8b64..79d038a 100644 --- a/src/pixi/renderers/webgl/shaders/ComplexPrimitiveShader.js +++ b/src/pixi/renderers/webgl/shaders/ComplexPrimitiveShader.js @@ -9,7 +9,13 @@ */ PIXI.ComplexPrimitiveShader = function(gl) { + /** + * @property _UID + * @type Number + * @private + */ this._UID = PIXI._UID++; + /** * @property gl * @type WebGLContext @@ -17,18 +23,20 @@ this.gl = gl; /** - * @property {any} program - The WebGL program. - */ + * The WebGL program. + * @property program + * @type {Any} + */ this.program = null; /** + * The fragment shader. * @property fragmentSrc * @type Array */ this.fragmentSrc = [ - 'precision mediump float;', - + 'precision mediump float;', 'varying vec4 vColor;', @@ -38,6 +46,7 @@ ]; /** + * The vertex shader. * @property vertexSrc * @type Array */ @@ -65,14 +74,15 @@ this.init(); }; +PIXI.ComplexPrimitiveShader.prototype.constructor = PIXI.ComplexPrimitiveShader; + /** -* Initialises the shader +* Initialises the shader. +* * @method init -* */ PIXI.ComplexPrimitiveShader.prototype.init = function() { - var gl = this.gl; var program = PIXI.compileProgram(gl, this.vertexSrc, this.fragmentSrc); @@ -84,7 +94,6 @@ this.tintColor = gl.getUniformLocation(program, 'tint'); this.color = gl.getUniformLocation(program, 'color'); - // get and store the attributes this.aVertexPosition = gl.getAttribLocation(program, 'aVertexPosition'); // this.colorAttribute = gl.getAttribLocation(program, 'aColor'); @@ -98,9 +107,9 @@ }; /** -* Destroys the shader +* Destroys the shader. +* * @method destroy -* */ PIXI.ComplexPrimitiveShader.prototype.destroy = function() { diff --git a/src/pixi/renderers/webgl/shaders/PixiFastShader.js b/src/pixi/renderers/webgl/shaders/PixiFastShader.js index 4fb3fe2..bb46419 100644 --- a/src/pixi/renderers/webgl/shaders/PixiFastShader.js +++ b/src/pixi/renderers/webgl/shaders/PixiFastShader.js @@ -1,6 +1,5 @@ /** * @author Mat Groves http://matgroves.com/ @Doormat23 - * @author Richard Davey http://www.photonstorm.com @photonstorm */ /** @@ -10,6 +9,11 @@ */ PIXI.PixiFastShader = function(gl) { + /** + * @property _UID + * @type Number + * @private + */ this._UID = PIXI._UID++; /** @@ -19,12 +23,16 @@ this.gl = gl; /** - * @property {any} program - The WebGL program. + * The WebGL program. + * @property program + * @type {Any} */ this.program = null; /** - * @property {array} fragmentSrc - The fragment shader. + * The fragment shader. + * @property fragmentSrc + * @type Array */ this.fragmentSrc = [ 'precision lowp float;', @@ -37,8 +45,10 @@ ]; /** - * @property {array} vertexSrc - The vertex shader - */ + * The vertex shader. + * @property vertexSrc + * @type Array + */ this.vertexSrc = [ 'attribute vec2 aVertexPosition;', 'attribute vec2 aPositionCoord;', @@ -69,24 +79,25 @@ '}' ]; - /** - * @property {number} textureCount - A local texture counter for multi-texture shaders. - */ + * A local texture counter for multi-texture shaders. + * @property textureCount + * @type Number + */ this.textureCount = 0; - this.init(); }; +PIXI.PixiFastShader.prototype.constructor = PIXI.PixiFastShader; + /** -* Initialises the shader +* Initialises the shader. +* * @method init -* */ PIXI.PixiFastShader.prototype.init = function() { - var gl = this.gl; var program = PIXI.compileProgram(gl, this.vertexSrc, this.fragmentSrc); @@ -111,8 +122,6 @@ this.aTextureCoord = gl.getAttribLocation(program, 'aTextureCoord'); this.colorAttribute = gl.getAttribLocation(program, 'aColor'); - - // Begin worst hack eva // // WHY??? ONLY on my chrome pixel the line above returns -1 when using filters? @@ -128,14 +137,13 @@ // End worst hack eva // - this.program = program; }; /** -* Destroys the shader +* Destroys the shader. +* * @method destroy -* */ PIXI.PixiFastShader.prototype.destroy = function() { diff --git a/src/pixi/renderers/webgl/shaders/PixiShader.js b/src/pixi/renderers/webgl/shaders/PixiShader.js index d76ec03..725dce2 100644 --- a/src/pixi/renderers/webgl/shaders/PixiShader.js +++ b/src/pixi/renderers/webgl/shaders/PixiShader.js @@ -6,9 +6,15 @@ /** * @class PixiShader * @constructor +* @param gl {WebGLContext} the current WebGL drawing context */ PIXI.PixiShader = function(gl) { + /** + * @property _UID + * @type Number + * @private + */ this._UID = PIXI._UID++; /** @@ -18,13 +24,17 @@ this.gl = gl; /** - * @property {any} program - The WebGL program. - */ + * The WebGL program. + * @property program + * @type {Any} + */ this.program = null; /** - * @property {array} fragmentSrc - The fragment shader. - */ + * The fragment shader. + * @property fragmentSrc + * @type Array + */ this.fragmentSrc = [ 'precision lowp float;', 'varying vec2 vTextureCoord;', @@ -36,21 +46,44 @@ ]; /** - * @property {number} textureCount - A local texture counter for multi-texture shaders. - */ + * A local texture counter for multi-texture shaders. + * @property textureCount + * @type Number + */ this.textureCount = 0; + + /** + * A local flag + * @property firstRun + * @type Boolean + * @private + */ this.firstRun = true; + + /** + * A dirty flag + * @property dirty + * @type Boolean + */ this.dirty = true; + /** + * Uniform attributes cache. + * @property attributes + * @type Array + * @private + */ this.attributes = []; this.init(); }; +PIXI.PixiShader.prototype.constructor = PIXI.PixiShader; + /** -* Initialises the shader +* Initialises the shader. +* * @method init -* */ PIXI.PixiShader.prototype.init = function() { @@ -71,12 +104,11 @@ this.aTextureCoord = gl.getAttribLocation(program, 'aTextureCoord'); this.colorAttribute = gl.getAttribLocation(program, 'aColor'); - // Begin worst hack eva // // WHY??? ONLY on my chrome pixel the line above returns -1 when using filters? // maybe its something to do with the current state of the gl context. - // Im convinced this is a bug in the chrome browser as there is NO reason why this should be returning -1 especially as it only manifests on my chrome pixel + // I'm convinced this is a bug in the chrome browser as there is NO reason why this should be returning -1 especially as it only manifests on my chrome pixel // If theres any webGL people that know why could happen please help :) if(this.colorAttribute === -1) { @@ -101,6 +133,7 @@ /** * Initialises the shader uniform values. +* * Uniforms are specified in the GLSL_ES Specification: http://www.khronos.org/registry/webgl/specs/latest/1.0/ * http://www.khronos.org/registry/gles/specs/2.0/GLSL_ES_Specification_1.0.17.pdf * @@ -316,7 +349,8 @@ }; /** -* Destroys the shader +* Destroys the shader. +* * @method destroy */ PIXI.PixiShader.prototype.destroy = function() @@ -329,7 +363,8 @@ }; /** -* The Default Vertex shader source +* The Default Vertex shader source. +* * @property defaultVertexSrc * @type String */ diff --git a/src/pixi/renderers/webgl/shaders/PrimitiveShader.js b/src/pixi/renderers/webgl/shaders/PrimitiveShader.js index 3a82be2..0f6854c 100644 --- a/src/pixi/renderers/webgl/shaders/PrimitiveShader.js +++ b/src/pixi/renderers/webgl/shaders/PrimitiveShader.js @@ -9,6 +9,11 @@ */ PIXI.PrimitiveShader = function(gl) { + /** + * @property _UID + * @type Number + * @private + */ this._UID = PIXI._UID++; /** @@ -18,11 +23,14 @@ this.gl = gl; /** - * @property {any} program - The WebGL program. - */ + * The WebGL program. + * @property program + * @type {Any} + */ this.program = null; /** + * The fragment shader. * @property fragmentSrc * @type Array */ @@ -36,6 +44,7 @@ ]; /** + * The vertex shader. * @property vertexSrc * @type Array */ @@ -60,14 +69,15 @@ this.init(); }; +PIXI.PrimitiveShader.prototype.constructor = PIXI.PrimitiveShader; + /** -* Initialises the shader +* Initialises the shader. +* * @method init -* */ PIXI.PrimitiveShader.prototype.init = function() { - var gl = this.gl; var program = PIXI.compileProgram(gl, this.vertexSrc, this.fragmentSrc); @@ -78,7 +88,6 @@ this.offsetVector = gl.getUniformLocation(program, 'offsetVector'); this.tintColor = gl.getUniformLocation(program, 'tint'); - // get and store the attributes this.aVertexPosition = gl.getAttribLocation(program, 'aVertexPosition'); this.colorAttribute = gl.getAttribLocation(program, 'aColor'); @@ -92,9 +101,9 @@ }; /** -* Destroys the shader +* Destroys the shader. +* * @method destroy -* */ PIXI.PrimitiveShader.prototype.destroy = function() { diff --git a/src/pixi/renderers/webgl/shaders/StripShader.js b/src/pixi/renderers/webgl/shaders/StripShader.js index 11f13ad..8fefe51 100644 --- a/src/pixi/renderers/webgl/shaders/StripShader.js +++ b/src/pixi/renderers/webgl/shaders/StripShader.js @@ -2,20 +2,37 @@ * @author Mat Groves http://matgroves.com/ @Doormat23 */ - +/** +* @class StripShader +* @constructor +* @param gl {WebGLContext} the current WebGL drawing context +*/ PIXI.StripShader = function(gl) { + /** + * @property _UID + * @type Number + * @private + */ this._UID = PIXI._UID++; + /** + * @property gl + * @type WebGLContext + */ this.gl = gl; /** - * @property {any} program - The WebGL program. - */ + * The WebGL program. + * @property program + * @type {Any} + */ this.program = null; /** - * @property {array} fragmentSrc - The fragment shader. + * The fragment shader. + * @property fragmentSrc + * @type Array */ this.fragmentSrc = [ 'precision mediump float;', @@ -30,9 +47,11 @@ '}' ]; - /** - * @property {array} fragmentSrc - The fragment shader. - */ + /** + * The vertex shader. + * @property vertexSrc + * @type Array + */ this.vertexSrc = [ 'attribute vec2 aVertexPosition;', 'attribute vec2 aTextureCoord;', @@ -56,10 +75,12 @@ this.init(); }; +PIXI.StripShader.prototype.constructor = PIXI.StripShader; + /** -* Initialises the shader +* Initialises the shader. +* * @method init -* */ PIXI.StripShader.prototype.init = function() { @@ -88,9 +109,9 @@ }; /** -* Destroys the shader +* Destroys the shader. +* * @method destroy -* */ PIXI.StripShader.prototype.destroy = function() { diff --git a/src/pixi/renderers/webgl/utils/FilterTexture.js b/src/pixi/renderers/webgl/utils/FilterTexture.js index 9dada23..389acbe 100644 --- a/src/pixi/renderers/webgl/utils/FilterTexture.js +++ b/src/pixi/renderers/webgl/utils/FilterTexture.js @@ -9,7 +9,6 @@ * @param width {Number} the horizontal range of the filter * @param height {Number} the vertical range of the filter * @param scaleMode {Number} Should be one of the PIXI.scaleMode consts -* @private */ PIXI.FilterTexture = function(gl, width, height, scaleMode) { @@ -19,11 +18,24 @@ */ this.gl = gl; - // next time to create a frame buffer and texture + + /** + * @property frameBuffer + * @type Any + */ this.frameBuffer = gl.createFramebuffer(); + + /** + * @property texture + * @type Any + */ this.texture = gl.createTexture(); + /** + * @property scaleMode + * @type Number + */ scaleMode = scaleMode || PIXI.scaleModes.DEFAULT; gl.bindTexture(gl.TEXTURE_2D, this.texture); @@ -44,9 +56,11 @@ this.resize(width, height); }; +PIXI.FilterTexture.prototype.constructor = PIXI.FilterTexture; /** -* Clears the filter texture +* Clears the filter texture. +* * @method clear */ PIXI.FilterTexture.prototype.clear = function() @@ -75,14 +89,14 @@ gl.bindTexture(gl.TEXTURE_2D, this.texture); gl.texImage2D(gl.TEXTURE_2D, 0, gl.RGBA, width , height , 0, gl.RGBA, gl.UNSIGNED_BYTE, null); - // console.log( width, width ) // update the stencil buffer width and height gl.bindRenderbuffer(gl.RENDERBUFFER, this.renderBuffer); gl.renderbufferStorage(gl.RENDERBUFFER, gl.DEPTH_STENCIL, width , height ); }; /** -* Destroys the filter texture +* Destroys the filter texture. +* * @method destroy */ PIXI.FilterTexture.prototype.destroy = function() diff --git a/src/pixi/renderers/webgl/utils/WebGLBlendModeManager.js b/src/pixi/renderers/webgl/utils/WebGLBlendModeManager.js index c73728f..3de0ec9 100644 --- a/src/pixi/renderers/webgl/utils/WebGLBlendModeManager.js +++ b/src/pixi/renderers/webgl/utils/WebGLBlendModeManager.js @@ -3,31 +3,42 @@ */ /** -* @class WebGLMaskManager +* @class WebGLBlendModeManager * @constructor * @param gl {WebGLContext} the current WebGL drawing context -* @private */ PIXI.WebGLBlendModeManager = function() { + /** + * @property currentBlendMode + * @type Number + */ this.currentBlendMode = 99999; }; +PIXI.WebGLBlendModeManager.prototype.constructor = PIXI.WebGLBlendModeManager; + +/** + * Sets the WebGL Context. + * + * @method setContext + * @param gl {WebGLContext} the current WebGL drawing context + */ PIXI.WebGLBlendModeManager.prototype.setContext = function(gl) { this.gl = gl; }; /** -* Sets-up the given blendMode from WebGL's point of view +* Sets-up the given blendMode from WebGL's point of view. +* * @method setBlendMode -* * @param blendMode {Number} the blendMode, should be a Pixi const, such as PIXI.BlendModes.ADD */ PIXI.WebGLBlendModeManager.prototype.setBlendMode = function(blendMode) { if(this.currentBlendMode === blendMode)return false; - // console.log("SWAP!") + this.currentBlendMode = blendMode; var blendModeWebGL = PIXI.blendModesWebGL[this.currentBlendMode]; @@ -36,7 +47,12 @@ return true; }; +/** +* Destroys this object. +* +* @method destroy +*/ PIXI.WebGLBlendModeManager.prototype.destroy = function() { this.gl = null; -}; \ No newline at end of file +}; diff --git a/src/pixi/renderers/webgl/utils/WebGLFastSpriteBatch.js b/src/pixi/renderers/webgl/utils/WebGLFastSpriteBatch.js index 0d08e47..0bdbbe4 100644 --- a/src/pixi/renderers/webgl/utils/WebGLFastSpriteBatch.js +++ b/src/pixi/renderers/webgl/utils/WebGLFastSpriteBatch.js @@ -8,27 +8,66 @@ * https://github.com/libgdx/libgdx/blob/master/gdx/src/com/badlogic/gdx/graphics/g2d/WebGLSpriteBatch.java */ +/** +* @class WebGLFastSpriteBatch +* @constructor +*/ PIXI.WebGLFastSpriteBatch = function() { - - + /** + * @property vertSize + * @type Number + */ this.vertSize = 10; + + /** + * @property maxSize + * @type Number + */ this.maxSize = 6000;//Math.pow(2, 16) / this.vertSize; + + /** + * @property size + * @type Number + */ this.size = this.maxSize; //the total number of floats in our batch var numVerts = this.size * 4 * this.vertSize; + //the total number of indices in our batch var numIndices = this.maxSize * 6; - //vertex data + /** + * Vertex data + * @property vertices + * @type Float32Array + */ this.vertices = new Float32Array(numVerts); - //index data + + /** + * Index data + * @property indices + * @type Uint16Array + */ this.indices = new Uint16Array(numIndices); + /** + * @property vertexBuffer + * @type Object + */ this.vertexBuffer = null; + + /** + * @property indexBuffer + * @type Object + */ this.indexBuffer = null; + /** + * @property lastIndexCount + * @type Number + */ this.lastIndexCount = 0; for (var i=0, j=0; i < numIndices; i += 6, j += 4) @@ -41,21 +80,58 @@ this.indices[i + 5] = j + 3; } + /** + * @property drawing + * @type Boolean + */ this.drawing = false; + + /** + * @property currentBatchSize + * @type Number + */ this.currentBatchSize = 0; + + /** + * @property currentBaseTexture + * @type BaseTexture + */ this.currentBaseTexture = null; + /** + * @property currentBlendMode + * @type Number + */ this.currentBlendMode = 0; + + /** + * @property renderSession + * @type Object + */ this.renderSession = null; - + /** + * @property shader + * @type Object + */ this.shader = null; + /** + * @property matrix + * @type Matrix + */ this.matrix = null; - //this.setContext(gl); }; +PIXI.WebGLFastSpriteBatch.prototype.constructor = PIXI.WebGLFastSpriteBatch; + +/** + * Sets the WebGL Context. + * + * @method setContext + * @param gl {WebGLContext} the current WebGL drawing context + */ PIXI.WebGLFastSpriteBatch.prototype.setContext = function(gl) { this.gl = gl; @@ -66,7 +142,6 @@ // 65535 is max index, so 65535 / 6 = 10922. - //upload the index data gl.bindBuffer(gl.ELEMENT_ARRAY_BUFFER, this.indexBuffer); gl.bufferData(gl.ELEMENT_ARRAY_BUFFER, this.indices, gl.STATIC_DRAW); @@ -75,6 +150,11 @@ gl.bufferData(gl.ARRAY_BUFFER, this.vertices, gl.DYNAMIC_DRAW); }; +/** + * @method begin + * @param spriteBatch {WebGLSpriteBatch} + * @param renderSession {Object} + */ PIXI.WebGLFastSpriteBatch.prototype.begin = function(spriteBatch, renderSession) { this.renderSession = renderSession; @@ -85,15 +165,20 @@ this.start(); }; +/** + * @method end + */ PIXI.WebGLFastSpriteBatch.prototype.end = function() { this.flush(); }; - +/** + * @method render + * @param spriteBatch {WebGLSpriteBatch} + */ PIXI.WebGLFastSpriteBatch.prototype.render = function(spriteBatch) { - var children = spriteBatch.children; var sprite = children[0]; @@ -119,6 +204,10 @@ this.flush(); }; +/** + * @method renderSprite + * @param sprite {Sprite} + */ PIXI.WebGLFastSpriteBatch.prototype.renderSprite = function(sprite) { //sprite = children[i]; @@ -137,7 +226,6 @@ uvs = sprite.texture._uvs; - width = sprite.texture.frame.width; height = sprite.texture.frame.height; @@ -257,9 +345,11 @@ } }; +/** + * @method flush + */ PIXI.WebGLFastSpriteBatch.prototype.flush = function() { - // If the batch is length 0 then return as there is nothing to draw if (this.currentBatchSize===0)return; @@ -272,7 +362,6 @@ gl.bindTexture(gl.TEXTURE_2D, this.currentBaseTexture._glTextures[gl.id]); // upload the verts to the buffer - if(this.currentBatchSize > ( this.size * 0.5 ) ) { @@ -285,7 +374,6 @@ gl.bufferSubData(gl.ARRAY_BUFFER, 0, view); } - // now draw those suckas! gl.drawElements(gl.TRIANGLES, this.currentBatchSize * 6, gl.UNSIGNED_SHORT, 0); @@ -297,11 +385,17 @@ }; +/** + * @method stop + */ PIXI.WebGLFastSpriteBatch.prototype.stop = function() { this.flush(); }; +/** + * @method start + */ PIXI.WebGLFastSpriteBatch.prototype.start = function() { var gl = this.gl; @@ -329,8 +423,5 @@ gl.vertexAttribPointer(this.shader.aRotation, 1, gl.FLOAT, false, stride, 6 * 4); gl.vertexAttribPointer(this.shader.aTextureCoord, 2, gl.FLOAT, false, stride, 7 * 4); gl.vertexAttribPointer(this.shader.colorAttribute, 1, gl.FLOAT, false, stride, 9 * 4); - }; - - diff --git a/src/pixi/renderers/webgl/utils/WebGLFilterManager.js b/src/pixi/renderers/webgl/utils/WebGLFilterManager.js index 9bb9195..359a834 100644 --- a/src/pixi/renderers/webgl/utils/WebGLFilterManager.js +++ b/src/pixi/renderers/webgl/utils/WebGLFilterManager.js @@ -5,22 +5,33 @@ /** * @class WebGLFilterManager * @constructor -* @param gl {WebGLContext} the current WebGL drawing context -* @private */ PIXI.WebGLFilterManager = function() { + /** + * @property filterStack + * @type Array + */ this.filterStack = []; + /** + * @property offsetX + * @type Number + */ this.offsetX = 0; - this.offsetY = 0; - // this.setContext(gl); + /** + * @property offsetY + * @type Number + */ + this.offsetY = 0; }; -// API +PIXI.WebGLFilterManager.prototype.constructor = PIXI.WebGLFilterManager; + /** -* Initialises the context and the properties +* Initialises the context and the properties. +* * @method setContext * @param gl {WebGLContext} the current WebGL drawing context */ @@ -33,7 +44,6 @@ }; /** -* * @method begin * @param renderSession {RenderSession} * @param buffer {ArrayBuffer} @@ -44,14 +54,14 @@ this.defaultShader = renderSession.shaderManager.defaultShader; var projection = this.renderSession.projection; - // console.log(this.width) this.width = projection.x * 2; this.height = -projection.y * 2; this.buffer = buffer; }; /** -* Applies the filter and adds it to the current filter stack +* Applies the filter and adds it to the current filter stack. +* * @method pushFilter * @param filterBlock {Object} the filter that will be pushed to the current filter stack */ @@ -64,7 +74,6 @@ filterBlock._filterArea = filterBlock.target.filterArea || filterBlock.target.getBounds(); - // filter program // OPTIMISATION - the first filter is free if its a simple color change? this.filterStack.push(filterBlock); @@ -126,9 +135,9 @@ }; - /** -* Removes the last filter from the filter stack and doesn't return it +* Removes the last filter from the filter stack and doesn't return it. +* * @method popFilter */ PIXI.WebGLFilterManager.prototype.popFilter = function() @@ -211,7 +220,6 @@ this.offsetX -= filterArea.x; this.offsetY -= filterArea.y; - var sizeX = this.width; var sizeY = this.height; @@ -239,9 +247,7 @@ buffer = currentFilter._glFilterTexture.frameBuffer; } - - - // TODO need toremove thease global elements.. + // TODO need to remove these global elements.. projection.x = sizeX/2; projection.y = -sizeY/2; @@ -280,10 +286,6 @@ gl.bufferSubData(gl.ARRAY_BUFFER, 0, this.uvArray); - //console.log(this.vertexArray) - //console.log(this.uvArray) - //console.log(sizeX + " : " + sizeY) - gl.viewport(0, 0, sizeX, sizeY); // bind the buffer @@ -300,9 +302,9 @@ this.applyFilterPass(filter, filterArea, sizeX, sizeY); // now restore the regular shader.. should happen automatically now.. - // this.renderSession.shaderManager.setShader(this.defaultShader); - // gl.uniform2f(this.defaultShader.projectionVector, sizeX/2, -sizeY/2); - // gl.uniform2f(this.defaultShader.offsetVector, -offsetX, -offsetY); + // this.renderSession.shaderManager.setShader(this.defaultShader); + // gl.uniform2f(this.defaultShader.projectionVector, sizeX/2, -sizeY/2); + // gl.uniform2f(this.defaultShader.offsetVector, -offsetX, -offsetY); // return the texture to the pool this.texturePool.push(texture); @@ -311,7 +313,8 @@ /** -* Applies the filter to the specified area +* Applies the filter to the specified area. +* * @method applyFilterPass * @param filter {AbstractFilter} the filter that needs to be applied * @param filterArea {texture} TODO - might need an update @@ -351,7 +354,6 @@ filter.uniforms.dimensions.value[3] = this.vertexArray[5];//filterArea.height; } - // console.log(this.uvArray ) shader.syncUniforms(); gl.bindBuffer(gl.ARRAY_BUFFER, this.vertexBuffer); @@ -372,7 +374,8 @@ }; /** -* Initialises the shader buffers +* Initialises the shader buffers. +* * @method initShaderBuffers */ PIXI.WebGLFilterManager.prototype.initShaderBuffers = function() @@ -385,7 +388,6 @@ this.colorBuffer = gl.createBuffer(); this.indexBuffer = gl.createBuffer(); - // bind and upload the vertexs.. // keep a reference to the vertexFloatData.. this.vertexArray = new Float32Array([0.0, 0.0, @@ -394,11 +396,7 @@ 1.0, 1.0]); gl.bindBuffer(gl.ARRAY_BUFFER, this.vertexBuffer); - gl.bufferData( - gl.ARRAY_BUFFER, - this.vertexArray, - gl.STATIC_DRAW); - + gl.bufferData(gl.ARRAY_BUFFER, this.vertexArray, gl.STATIC_DRAW); // bind and upload the uv buffer this.uvArray = new Float32Array([0.0, 0.0, @@ -407,10 +405,7 @@ 1.0, 1.0]); gl.bindBuffer(gl.ARRAY_BUFFER, this.uvBuffer); - gl.bufferData( - gl.ARRAY_BUFFER, - this.uvArray, - gl.STATIC_DRAW); + gl.bufferData(gl.ARRAY_BUFFER, this.uvArray, gl.STATIC_DRAW); this.colorArray = new Float32Array([1.0, 0xFFFFFF, 1.0, 0xFFFFFF, @@ -418,21 +413,17 @@ 1.0, 0xFFFFFF]); gl.bindBuffer(gl.ARRAY_BUFFER, this.colorBuffer); - gl.bufferData( - gl.ARRAY_BUFFER, - this.colorArray, - gl.STATIC_DRAW); + gl.bufferData(gl.ARRAY_BUFFER, this.colorArray, gl.STATIC_DRAW); // bind and upload the index gl.bindBuffer(gl.ELEMENT_ARRAY_BUFFER, this.indexBuffer); - gl.bufferData( - gl.ELEMENT_ARRAY_BUFFER, - new Uint16Array([0, 1, 2, 1, 3, 2]), - gl.STATIC_DRAW); + gl.bufferData(gl.ELEMENT_ARRAY_BUFFER, new Uint16Array([0, 1, 2, 1, 3, 2]), gl.STATIC_DRAW); + }; /** -* Destroys the filter and removes it from the filter stack +* Destroys the filter and removes it from the filter stack. +* * @method destroy */ PIXI.WebGLFilterManager.prototype.destroy = function() diff --git a/src/pixi/renderers/webgl/utils/WebGLGraphics.js b/src/pixi/renderers/webgl/utils/WebGLGraphics.js index 4de401d..9ea5a53 100644 --- a/src/pixi/renderers/webgl/utils/WebGLGraphics.js +++ b/src/pixi/renderers/webgl/utils/WebGLGraphics.js @@ -11,7 +11,6 @@ */ PIXI.WebGLGraphics = function() { - }; /** @@ -120,7 +119,6 @@ webGL.data = []; webGL.lastIndex = 0; } - var webGLData; @@ -131,8 +129,6 @@ { var data = graphics.graphicsData[i]; - - if(data.type === PIXI.Graphics.POLY) { // need to add the points the the graphics object.. @@ -189,7 +185,6 @@ } } - webGL.lastIndex++; } @@ -201,7 +196,13 @@ } }; - +/** + * @static + * @private + * @method switchMode + * @param webGL {WebGLContext} + * @param type {Number} + */ PIXI.WebGLGraphics.switchMode = function(webGL, type) { var webGLData; @@ -308,7 +309,6 @@ */ PIXI.WebGLGraphics.buildRoundedRectangle = function(graphicsData, webGLData) { - var points = graphicsData.points; var x = points[0]; var y = points[1]; @@ -316,7 +316,6 @@ var height = points[3]; var radius = points[4]; - var recPoints = []; recPoints.push(x, y + radius); recPoints = recPoints.concat(PIXI.WebGLGraphics.quadraticBezierCurve(x, y + height - radius, x, y + height, x + radius, y + height)); @@ -324,7 +323,6 @@ recPoints = recPoints.concat(PIXI.WebGLGraphics.quadraticBezierCurve(x + width, y + radius, x + width, y, x + width - radius, y)); recPoints = recPoints.concat(PIXI.WebGLGraphics.quadraticBezierCurve(x + radius, y, x, y, x, y + radius)); - if (graphicsData.fill) { var color = PIXI.hex2rgb(graphicsData.fillColor); var alpha = graphicsData.fillAlpha; @@ -368,8 +366,8 @@ }; /** - * Calcul the points for a quadratic bezier curve. (helper function..) - * Based on : https://stackoverflow.com/questions/785097/how-do-i-implement-a-bezier-curve-in-c + * Calculate the points for a quadratic bezier curve. (helper function..) + * Based on: https://stackoverflow.com/questions/785097/how-do-i-implement-a-bezier-curve-in-c * * @static * @private @@ -383,6 +381,7 @@ * @return {Array} */ PIXI.WebGLGraphics.quadraticBezierCurve = function(fromX, fromY, cpX, cpY, toX, toY) { + var xa, ya, xb, @@ -718,13 +717,12 @@ * * @static * @private - * @method buildPoly + * @method buildComplexPoly * @param graphicsData {Graphics} The graphics object containing all the necessary properties * @param webGLData {Object} */ PIXI.WebGLGraphics.buildComplexPoly = function(graphicsData, webGLData) { - //TODO - no need to copy this as it gets turned into a FLoat32Array anyways.. var points = graphicsData.points.slice(); if(points.length < 6)return; @@ -776,6 +774,15 @@ }; +/** + * Builds a polygon to draw + * + * @static + * @private + * @method buildPoly + * @param graphicsData {Graphics} The graphics object containing all the necessary properties + * @param webGLData {Object} + */ PIXI.WebGLGraphics.buildPoly = function(graphicsData, webGLData) { var points = graphicsData.points; @@ -818,6 +825,11 @@ PIXI.WebGLGraphics.graphicsDataPool = []; +/** + * @class WebGLGraphicsData + * @private + * @static + */ PIXI.WebGLGraphicsData = function(gl) { this.gl = gl; @@ -834,6 +846,9 @@ this.dirty = true; }; +/** + * @method reset + */ PIXI.WebGLGraphicsData.prototype.reset = function() { this.points = []; @@ -841,6 +856,9 @@ this.lastIndex = 0; }; +/** + * @method upload + */ PIXI.WebGLGraphicsData.prototype.upload = function() { var gl = this.gl; diff --git a/src/pixi/InteractionData.js b/src/pixi/InteractionData.js index ea77370..fa84a6d 100644 --- a/src/pixi/InteractionData.js +++ b/src/pixi/InteractionData.js @@ -18,7 +18,6 @@ */ this.global = new PIXI.Point(); - /** * The target Sprite that was interacted with * diff --git a/src/pixi/InteractionManager.js b/src/pixi/InteractionManager.js index 685c386..71f320b 100644 --- a/src/pixi/InteractionManager.js +++ b/src/pixi/InteractionManager.js @@ -14,7 +14,7 @@ PIXI.InteractionManager = function(stage) { /** - * a reference to the stage + * A reference to the stage * * @property stage * @type Stage @@ -22,7 +22,7 @@ this.stage = stage; /** - * the mouse data + * The mouse data * * @property mouse * @type InteractionData @@ -30,18 +30,21 @@ this.mouse = new PIXI.InteractionData(); /** - * an object that stores current touches (InteractionData) by id reference + * An object that stores current touches (InteractionData) by id reference * * @property touches * @type Object */ this.touches = {}; - // helpers + /** + * @property tempPoint + * @type Point + * @private + */ this.tempPoint = new PIXI.Point(); /** - * * @property mouseoverEnabled * @type Boolean * @default @@ -49,7 +52,7 @@ this.mouseoverEnabled = true; /** - * tiny little interactiveData pool ! + * Tiny little interactiveData pool ! * * @property pool * @type Array @@ -61,7 +64,6 @@ * @property interactiveItems * @type Array * @private - * */ this.interactiveItems = []; @@ -73,23 +75,60 @@ */ this.interactionDOMElement = null; - //this will make it so that you dont have to call bind all the time + //this will make it so that you don't have to call bind all the time + + /** + * @property onMouseMove + * @type Function + */ this.onMouseMove = this.onMouseMove.bind( this ); + + /** + * @property onMouseDown + * @type Function + */ this.onMouseDown = this.onMouseDown.bind(this); + + /** + * @property onMouseOut + * @type Function + */ this.onMouseOut = this.onMouseOut.bind(this); + + /** + * @property onMouseUp + * @type Function + */ this.onMouseUp = this.onMouseUp.bind(this); + /** + * @property onTouchStart + * @type Function + */ this.onTouchStart = this.onTouchStart.bind(this); + + /** + * @property onTouchEnd + * @type Function + */ this.onTouchEnd = this.onTouchEnd.bind(this); + + /** + * @property onTouchMove + * @type Function + */ this.onTouchMove = this.onTouchMove.bind(this); + /** + * @property last + * @type Number + */ this.last = 0; /** * The css style of the cursor that is being used * @property currentCursorStyle * @type String - * */ this.currentCursorStyle = 'inherit'; @@ -97,10 +136,13 @@ * Is set to true when the mouse is moved out of the canvas * @property mouseOut * @type Boolean - * */ this.mouseOut = false; + /** + * @property resolution + * @type Number + */ this.resolution = 1; }; @@ -166,7 +208,6 @@ this.setTargetDomElement (target.view); }; - /** * Sets the DOM element which will receive mouse/touch events. This is useful for when you have other DOM * elements on top of the renderers Canvas element. With this you'll be able to delegate another DOM element @@ -201,7 +242,10 @@ window.addEventListener('mouseup', this.onMouseUp, true); }; - +/** + * @method removeEvents + * @private + */ PIXI.InteractionManager.prototype.removeEvents = function() { if (!this.interactionDOMElement) return; @@ -308,6 +352,10 @@ } }; +/** + * @method rebuildInteractiveGraph + * @private + */ PIXI.InteractionManager.prototype.rebuildInteractiveGraph = function() { this.dirty = false; @@ -427,10 +475,10 @@ }; /** - * Is called when the mouse button is moved out of the renderer element + * Is called when the mouse is moved out of the renderer element * * @method onMouseOut - * @param event {Event} The DOM event of a mouse button being moved out + * @param event {Event} The DOM event of a mouse being moved out * @private */ PIXI.InteractionManager.prototype.onMouseOut = function(event) diff --git a/src/pixi/renderers/webgl/WebGLRenderer.js b/src/pixi/renderers/webgl/WebGLRenderer.js index 968fd3d..422896f 100644 --- a/src/pixi/renderers/webgl/WebGLRenderer.js +++ b/src/pixi/renderers/webgl/WebGLRenderer.js @@ -5,23 +5,21 @@ PIXI.glContexts = []; // this is where we store the webGL contexts for easy access. /** - * the WebGLRenderer draws the stage and all its content onto a webGL enabled canvas. This renderer - * should be used for browsers that support webGL. This Render works by automatically managing webGLBatch's. - * So no need for Sprite Batch's or Sprite Cloud's - * Dont forget to add the view to your DOM or you will not see anything :) + * The WebGLRenderer draws the stage and all its content onto a webGL enabled canvas. This renderer + * should be used for browsers that support webGL. This Render works by automatically managing webGLBatchs. + * So no need for Sprite Batches or Sprite Clouds. + * Don't forget to add the view to your DOM or you will not see anything :) * * @class WebGLRenderer * @constructor * @param [width=0] {Number} the width of the canvas view * @param [height=0] {Number} the height of the canvas view - * * @param [options] {Object} The optional renderer parameters * @param [options.view] {HTMLCanvasElement} the canvas to use as a view, optional * @param [options.transparent=false] {Boolean} If the render view is transparent, default false * @param [options.antialias=false] {Boolean} sets antialias (only applicable in chrome at the moment) * @param [options.preserveDrawingBuffer=false] {Boolean} enables drawing buffer preservation, enable this if you need to call toDataUrl on the webgl context * @param [options.resolution=1] {Number} the resolution of the renderer retina would be 2 - * */ PIXI.WebGLRenderer = function(width, height, options) { @@ -37,13 +35,16 @@ options = PIXI.defaultRenderOptions; } - if(!PIXI.defaultRenderer) { PIXI.sayHello('webGL'); PIXI.defaultRenderer = this; } + /** + * @property type + * @type Number + */ this.type = PIXI.WEBGL_RENDERER; /** @@ -56,6 +57,7 @@ this.resolution = options.resolution; // do a catch.. only 1 webGL renderer.. + /** * Whether the render view is transparent * @@ -99,12 +101,27 @@ this.view = options.view || document.createElement( 'canvas' ); // deal with losing context.. + + /** + * @property contextLostBound + * @type Function + */ this.contextLostBound = this.handleContextLost.bind(this); + + /** + * @property contextRestoredBound + * @type Function + */ this.contextRestoredBound = this.handleContextRestored.bind(this); this.view.addEventListener('webglcontextlost', this.contextLostBound, false); this.view.addEventListener('webglcontextrestored', this.contextRestoredBound, false); + /** + * @property _contextOptions + * @type Object + * @private + */ this._contextOptions = { alpha: this.transparent, antialias: options.antialias, // SPEED UP?? @@ -113,18 +130,67 @@ preserveDrawingBuffer: options.preserveDrawingBuffer }; + /** + * @property projection + * @type Point + */ this.projection = new PIXI.Point(); + + /** + * @property offset + * @type Point + */ this.offset = new PIXI.Point(0, 0); - // time to create the render managers! each one focuses on managine a state in webGL - 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(); // manages the stencil buffer - this.blendModeManager = new PIXI.WebGLBlendModeManager(); // manages the blendModes + // time to create the render managers! each one focuses on managing a state in webGL - // TODO remove + /** + * Deals with managing the shader programs and their attribs + * @property shaderManager + * @type WebGLShaderManager + */ + this.shaderManager = new PIXI.WebGLShaderManager(); + + /** + * Manages the rendering of sprites + * @property spriteBatch + * @type WebGLSpriteBatch + */ + this.spriteBatch = new PIXI.WebGLSpriteBatch(); + + /** + * Manages the masks using the stencil buffer + * @property maskManager + * @type WebGLMaskManager + */ + this.maskManager = new PIXI.WebGLMaskManager(); + + /** + * Manages the filters + * @property filterManager + * @type WebGLFilterManager + */ + this.filterManager = new PIXI.WebGLFilterManager(); + + /** + * Manages the stencil buffer + * @property stencilManager + * @type WebGLStencilManager + */ + this.stencilManager = new PIXI.WebGLStencilManager(); + + /** + * Manages the blendModes + * @property blendModeManager + * @type WebGLBlendModeManager + */ + this.blendModeManager = new PIXI.WebGLBlendModeManager(); + + /** + * TODO remove + * @property renderSession + * @type Object + */ this.renderSession = {}; this.renderSession.gl = this.gl; this.renderSession.drawCount = 0; @@ -147,6 +213,9 @@ // constructor PIXI.WebGLRenderer.prototype.constructor = PIXI.WebGLRenderer; +/** +* @method initContext +*/ PIXI.WebGLRenderer.prototype.initContext = function() { var gl = this.view.getContext('webgl', this._contextOptions) || this.view.getContext('experimental-webgl', this._contextOptions); @@ -180,7 +249,6 @@ this.resize(this.width, this.height); }; - /** * Renders the stage to its webGL view * @@ -205,9 +273,7 @@ // update the scene graph stage.updateTransform(); - var gl = this.gl; - // interaction if(stage._interactive) @@ -249,9 +315,9 @@ }; /** - * Renders a display Object + * Renders a Display Object. * - * @method renderDIsplayObject + * @method renderDisplayObject * @param displayObject {DisplayObject} The DisplayObject to render * @param projection {Point} The projection * @param buffer {Array} a standard WebGL buffer @@ -283,7 +349,7 @@ }; /** - * resizes the webGL view to the specified width and height + * Resizes the webGL view to the specified width and height. * * @method resize * @param width {Number} the new width of the webGL view @@ -297,10 +363,6 @@ this.view.width = this.width; this.view.height = this.height; - // this.view.style.width = width + 'px'; - // this.view.style.height = height + 'px'; - - // console.log(this.width / this.resolution) this.gl.viewport(0, 0, this.width, this.height); this.projection.x = this.width / 2 / this.resolution; @@ -308,10 +370,10 @@ }; /** - * Updates and Creates a WebGL texture for the renderers context + * Updates and Creates a WebGL texture for the renderers context. * * @method updateTexture - * @param texture {Texture} the texture to render + * @param texture {Texture} the texture to update */ PIXI.WebGLRenderer.prototype.updateTexture = function(texture) { @@ -411,6 +473,11 @@ this.renderSession = null; }; +/** + * Maps Pixi blend modes to WebGL blend modes. + * + * @method mapBlendModes + */ PIXI.WebGLRenderer.prototype.mapBlendModes = function() { var gl = this.gl; diff --git a/src/pixi/renderers/webgl/shaders/ComplexPrimitiveShader.js b/src/pixi/renderers/webgl/shaders/ComplexPrimitiveShader.js index daa8b64..79d038a 100644 --- a/src/pixi/renderers/webgl/shaders/ComplexPrimitiveShader.js +++ b/src/pixi/renderers/webgl/shaders/ComplexPrimitiveShader.js @@ -9,7 +9,13 @@ */ PIXI.ComplexPrimitiveShader = function(gl) { + /** + * @property _UID + * @type Number + * @private + */ this._UID = PIXI._UID++; + /** * @property gl * @type WebGLContext @@ -17,18 +23,20 @@ this.gl = gl; /** - * @property {any} program - The WebGL program. - */ + * The WebGL program. + * @property program + * @type {Any} + */ this.program = null; /** + * The fragment shader. * @property fragmentSrc * @type Array */ this.fragmentSrc = [ - 'precision mediump float;', - + 'precision mediump float;', 'varying vec4 vColor;', @@ -38,6 +46,7 @@ ]; /** + * The vertex shader. * @property vertexSrc * @type Array */ @@ -65,14 +74,15 @@ this.init(); }; +PIXI.ComplexPrimitiveShader.prototype.constructor = PIXI.ComplexPrimitiveShader; + /** -* Initialises the shader +* Initialises the shader. +* * @method init -* */ PIXI.ComplexPrimitiveShader.prototype.init = function() { - var gl = this.gl; var program = PIXI.compileProgram(gl, this.vertexSrc, this.fragmentSrc); @@ -84,7 +94,6 @@ this.tintColor = gl.getUniformLocation(program, 'tint'); this.color = gl.getUniformLocation(program, 'color'); - // get and store the attributes this.aVertexPosition = gl.getAttribLocation(program, 'aVertexPosition'); // this.colorAttribute = gl.getAttribLocation(program, 'aColor'); @@ -98,9 +107,9 @@ }; /** -* Destroys the shader +* Destroys the shader. +* * @method destroy -* */ PIXI.ComplexPrimitiveShader.prototype.destroy = function() { diff --git a/src/pixi/renderers/webgl/shaders/PixiFastShader.js b/src/pixi/renderers/webgl/shaders/PixiFastShader.js index 4fb3fe2..bb46419 100644 --- a/src/pixi/renderers/webgl/shaders/PixiFastShader.js +++ b/src/pixi/renderers/webgl/shaders/PixiFastShader.js @@ -1,6 +1,5 @@ /** * @author Mat Groves http://matgroves.com/ @Doormat23 - * @author Richard Davey http://www.photonstorm.com @photonstorm */ /** @@ -10,6 +9,11 @@ */ PIXI.PixiFastShader = function(gl) { + /** + * @property _UID + * @type Number + * @private + */ this._UID = PIXI._UID++; /** @@ -19,12 +23,16 @@ this.gl = gl; /** - * @property {any} program - The WebGL program. + * The WebGL program. + * @property program + * @type {Any} */ this.program = null; /** - * @property {array} fragmentSrc - The fragment shader. + * The fragment shader. + * @property fragmentSrc + * @type Array */ this.fragmentSrc = [ 'precision lowp float;', @@ -37,8 +45,10 @@ ]; /** - * @property {array} vertexSrc - The vertex shader - */ + * The vertex shader. + * @property vertexSrc + * @type Array + */ this.vertexSrc = [ 'attribute vec2 aVertexPosition;', 'attribute vec2 aPositionCoord;', @@ -69,24 +79,25 @@ '}' ]; - /** - * @property {number} textureCount - A local texture counter for multi-texture shaders. - */ + * A local texture counter for multi-texture shaders. + * @property textureCount + * @type Number + */ this.textureCount = 0; - this.init(); }; +PIXI.PixiFastShader.prototype.constructor = PIXI.PixiFastShader; + /** -* Initialises the shader +* Initialises the shader. +* * @method init -* */ PIXI.PixiFastShader.prototype.init = function() { - var gl = this.gl; var program = PIXI.compileProgram(gl, this.vertexSrc, this.fragmentSrc); @@ -111,8 +122,6 @@ this.aTextureCoord = gl.getAttribLocation(program, 'aTextureCoord'); this.colorAttribute = gl.getAttribLocation(program, 'aColor'); - - // Begin worst hack eva // // WHY??? ONLY on my chrome pixel the line above returns -1 when using filters? @@ -128,14 +137,13 @@ // End worst hack eva // - this.program = program; }; /** -* Destroys the shader +* Destroys the shader. +* * @method destroy -* */ PIXI.PixiFastShader.prototype.destroy = function() { diff --git a/src/pixi/renderers/webgl/shaders/PixiShader.js b/src/pixi/renderers/webgl/shaders/PixiShader.js index d76ec03..725dce2 100644 --- a/src/pixi/renderers/webgl/shaders/PixiShader.js +++ b/src/pixi/renderers/webgl/shaders/PixiShader.js @@ -6,9 +6,15 @@ /** * @class PixiShader * @constructor +* @param gl {WebGLContext} the current WebGL drawing context */ PIXI.PixiShader = function(gl) { + /** + * @property _UID + * @type Number + * @private + */ this._UID = PIXI._UID++; /** @@ -18,13 +24,17 @@ this.gl = gl; /** - * @property {any} program - The WebGL program. - */ + * The WebGL program. + * @property program + * @type {Any} + */ this.program = null; /** - * @property {array} fragmentSrc - The fragment shader. - */ + * The fragment shader. + * @property fragmentSrc + * @type Array + */ this.fragmentSrc = [ 'precision lowp float;', 'varying vec2 vTextureCoord;', @@ -36,21 +46,44 @@ ]; /** - * @property {number} textureCount - A local texture counter for multi-texture shaders. - */ + * A local texture counter for multi-texture shaders. + * @property textureCount + * @type Number + */ this.textureCount = 0; + + /** + * A local flag + * @property firstRun + * @type Boolean + * @private + */ this.firstRun = true; + + /** + * A dirty flag + * @property dirty + * @type Boolean + */ this.dirty = true; + /** + * Uniform attributes cache. + * @property attributes + * @type Array + * @private + */ this.attributes = []; this.init(); }; +PIXI.PixiShader.prototype.constructor = PIXI.PixiShader; + /** -* Initialises the shader +* Initialises the shader. +* * @method init -* */ PIXI.PixiShader.prototype.init = function() { @@ -71,12 +104,11 @@ this.aTextureCoord = gl.getAttribLocation(program, 'aTextureCoord'); this.colorAttribute = gl.getAttribLocation(program, 'aColor'); - // Begin worst hack eva // // WHY??? ONLY on my chrome pixel the line above returns -1 when using filters? // maybe its something to do with the current state of the gl context. - // Im convinced this is a bug in the chrome browser as there is NO reason why this should be returning -1 especially as it only manifests on my chrome pixel + // I'm convinced this is a bug in the chrome browser as there is NO reason why this should be returning -1 especially as it only manifests on my chrome pixel // If theres any webGL people that know why could happen please help :) if(this.colorAttribute === -1) { @@ -101,6 +133,7 @@ /** * Initialises the shader uniform values. +* * Uniforms are specified in the GLSL_ES Specification: http://www.khronos.org/registry/webgl/specs/latest/1.0/ * http://www.khronos.org/registry/gles/specs/2.0/GLSL_ES_Specification_1.0.17.pdf * @@ -316,7 +349,8 @@ }; /** -* Destroys the shader +* Destroys the shader. +* * @method destroy */ PIXI.PixiShader.prototype.destroy = function() @@ -329,7 +363,8 @@ }; /** -* The Default Vertex shader source +* The Default Vertex shader source. +* * @property defaultVertexSrc * @type String */ diff --git a/src/pixi/renderers/webgl/shaders/PrimitiveShader.js b/src/pixi/renderers/webgl/shaders/PrimitiveShader.js index 3a82be2..0f6854c 100644 --- a/src/pixi/renderers/webgl/shaders/PrimitiveShader.js +++ b/src/pixi/renderers/webgl/shaders/PrimitiveShader.js @@ -9,6 +9,11 @@ */ PIXI.PrimitiveShader = function(gl) { + /** + * @property _UID + * @type Number + * @private + */ this._UID = PIXI._UID++; /** @@ -18,11 +23,14 @@ this.gl = gl; /** - * @property {any} program - The WebGL program. - */ + * The WebGL program. + * @property program + * @type {Any} + */ this.program = null; /** + * The fragment shader. * @property fragmentSrc * @type Array */ @@ -36,6 +44,7 @@ ]; /** + * The vertex shader. * @property vertexSrc * @type Array */ @@ -60,14 +69,15 @@ this.init(); }; +PIXI.PrimitiveShader.prototype.constructor = PIXI.PrimitiveShader; + /** -* Initialises the shader +* Initialises the shader. +* * @method init -* */ PIXI.PrimitiveShader.prototype.init = function() { - var gl = this.gl; var program = PIXI.compileProgram(gl, this.vertexSrc, this.fragmentSrc); @@ -78,7 +88,6 @@ this.offsetVector = gl.getUniformLocation(program, 'offsetVector'); this.tintColor = gl.getUniformLocation(program, 'tint'); - // get and store the attributes this.aVertexPosition = gl.getAttribLocation(program, 'aVertexPosition'); this.colorAttribute = gl.getAttribLocation(program, 'aColor'); @@ -92,9 +101,9 @@ }; /** -* Destroys the shader +* Destroys the shader. +* * @method destroy -* */ PIXI.PrimitiveShader.prototype.destroy = function() { diff --git a/src/pixi/renderers/webgl/shaders/StripShader.js b/src/pixi/renderers/webgl/shaders/StripShader.js index 11f13ad..8fefe51 100644 --- a/src/pixi/renderers/webgl/shaders/StripShader.js +++ b/src/pixi/renderers/webgl/shaders/StripShader.js @@ -2,20 +2,37 @@ * @author Mat Groves http://matgroves.com/ @Doormat23 */ - +/** +* @class StripShader +* @constructor +* @param gl {WebGLContext} the current WebGL drawing context +*/ PIXI.StripShader = function(gl) { + /** + * @property _UID + * @type Number + * @private + */ this._UID = PIXI._UID++; + /** + * @property gl + * @type WebGLContext + */ this.gl = gl; /** - * @property {any} program - The WebGL program. - */ + * The WebGL program. + * @property program + * @type {Any} + */ this.program = null; /** - * @property {array} fragmentSrc - The fragment shader. + * The fragment shader. + * @property fragmentSrc + * @type Array */ this.fragmentSrc = [ 'precision mediump float;', @@ -30,9 +47,11 @@ '}' ]; - /** - * @property {array} fragmentSrc - The fragment shader. - */ + /** + * The vertex shader. + * @property vertexSrc + * @type Array + */ this.vertexSrc = [ 'attribute vec2 aVertexPosition;', 'attribute vec2 aTextureCoord;', @@ -56,10 +75,12 @@ this.init(); }; +PIXI.StripShader.prototype.constructor = PIXI.StripShader; + /** -* Initialises the shader +* Initialises the shader. +* * @method init -* */ PIXI.StripShader.prototype.init = function() { @@ -88,9 +109,9 @@ }; /** -* Destroys the shader +* Destroys the shader. +* * @method destroy -* */ PIXI.StripShader.prototype.destroy = function() { diff --git a/src/pixi/renderers/webgl/utils/FilterTexture.js b/src/pixi/renderers/webgl/utils/FilterTexture.js index 9dada23..389acbe 100644 --- a/src/pixi/renderers/webgl/utils/FilterTexture.js +++ b/src/pixi/renderers/webgl/utils/FilterTexture.js @@ -9,7 +9,6 @@ * @param width {Number} the horizontal range of the filter * @param height {Number} the vertical range of the filter * @param scaleMode {Number} Should be one of the PIXI.scaleMode consts -* @private */ PIXI.FilterTexture = function(gl, width, height, scaleMode) { @@ -19,11 +18,24 @@ */ this.gl = gl; - // next time to create a frame buffer and texture + + /** + * @property frameBuffer + * @type Any + */ this.frameBuffer = gl.createFramebuffer(); + + /** + * @property texture + * @type Any + */ this.texture = gl.createTexture(); + /** + * @property scaleMode + * @type Number + */ scaleMode = scaleMode || PIXI.scaleModes.DEFAULT; gl.bindTexture(gl.TEXTURE_2D, this.texture); @@ -44,9 +56,11 @@ this.resize(width, height); }; +PIXI.FilterTexture.prototype.constructor = PIXI.FilterTexture; /** -* Clears the filter texture +* Clears the filter texture. +* * @method clear */ PIXI.FilterTexture.prototype.clear = function() @@ -75,14 +89,14 @@ gl.bindTexture(gl.TEXTURE_2D, this.texture); gl.texImage2D(gl.TEXTURE_2D, 0, gl.RGBA, width , height , 0, gl.RGBA, gl.UNSIGNED_BYTE, null); - // console.log( width, width ) // update the stencil buffer width and height gl.bindRenderbuffer(gl.RENDERBUFFER, this.renderBuffer); gl.renderbufferStorage(gl.RENDERBUFFER, gl.DEPTH_STENCIL, width , height ); }; /** -* Destroys the filter texture +* Destroys the filter texture. +* * @method destroy */ PIXI.FilterTexture.prototype.destroy = function() diff --git a/src/pixi/renderers/webgl/utils/WebGLBlendModeManager.js b/src/pixi/renderers/webgl/utils/WebGLBlendModeManager.js index c73728f..3de0ec9 100644 --- a/src/pixi/renderers/webgl/utils/WebGLBlendModeManager.js +++ b/src/pixi/renderers/webgl/utils/WebGLBlendModeManager.js @@ -3,31 +3,42 @@ */ /** -* @class WebGLMaskManager +* @class WebGLBlendModeManager * @constructor * @param gl {WebGLContext} the current WebGL drawing context -* @private */ PIXI.WebGLBlendModeManager = function() { + /** + * @property currentBlendMode + * @type Number + */ this.currentBlendMode = 99999; }; +PIXI.WebGLBlendModeManager.prototype.constructor = PIXI.WebGLBlendModeManager; + +/** + * Sets the WebGL Context. + * + * @method setContext + * @param gl {WebGLContext} the current WebGL drawing context + */ PIXI.WebGLBlendModeManager.prototype.setContext = function(gl) { this.gl = gl; }; /** -* Sets-up the given blendMode from WebGL's point of view +* Sets-up the given blendMode from WebGL's point of view. +* * @method setBlendMode -* * @param blendMode {Number} the blendMode, should be a Pixi const, such as PIXI.BlendModes.ADD */ PIXI.WebGLBlendModeManager.prototype.setBlendMode = function(blendMode) { if(this.currentBlendMode === blendMode)return false; - // console.log("SWAP!") + this.currentBlendMode = blendMode; var blendModeWebGL = PIXI.blendModesWebGL[this.currentBlendMode]; @@ -36,7 +47,12 @@ return true; }; +/** +* Destroys this object. +* +* @method destroy +*/ PIXI.WebGLBlendModeManager.prototype.destroy = function() { this.gl = null; -}; \ No newline at end of file +}; diff --git a/src/pixi/renderers/webgl/utils/WebGLFastSpriteBatch.js b/src/pixi/renderers/webgl/utils/WebGLFastSpriteBatch.js index 0d08e47..0bdbbe4 100644 --- a/src/pixi/renderers/webgl/utils/WebGLFastSpriteBatch.js +++ b/src/pixi/renderers/webgl/utils/WebGLFastSpriteBatch.js @@ -8,27 +8,66 @@ * https://github.com/libgdx/libgdx/blob/master/gdx/src/com/badlogic/gdx/graphics/g2d/WebGLSpriteBatch.java */ +/** +* @class WebGLFastSpriteBatch +* @constructor +*/ PIXI.WebGLFastSpriteBatch = function() { - - + /** + * @property vertSize + * @type Number + */ this.vertSize = 10; + + /** + * @property maxSize + * @type Number + */ this.maxSize = 6000;//Math.pow(2, 16) / this.vertSize; + + /** + * @property size + * @type Number + */ this.size = this.maxSize; //the total number of floats in our batch var numVerts = this.size * 4 * this.vertSize; + //the total number of indices in our batch var numIndices = this.maxSize * 6; - //vertex data + /** + * Vertex data + * @property vertices + * @type Float32Array + */ this.vertices = new Float32Array(numVerts); - //index data + + /** + * Index data + * @property indices + * @type Uint16Array + */ this.indices = new Uint16Array(numIndices); + /** + * @property vertexBuffer + * @type Object + */ this.vertexBuffer = null; + + /** + * @property indexBuffer + * @type Object + */ this.indexBuffer = null; + /** + * @property lastIndexCount + * @type Number + */ this.lastIndexCount = 0; for (var i=0, j=0; i < numIndices; i += 6, j += 4) @@ -41,21 +80,58 @@ this.indices[i + 5] = j + 3; } + /** + * @property drawing + * @type Boolean + */ this.drawing = false; + + /** + * @property currentBatchSize + * @type Number + */ this.currentBatchSize = 0; + + /** + * @property currentBaseTexture + * @type BaseTexture + */ this.currentBaseTexture = null; + /** + * @property currentBlendMode + * @type Number + */ this.currentBlendMode = 0; + + /** + * @property renderSession + * @type Object + */ this.renderSession = null; - + /** + * @property shader + * @type Object + */ this.shader = null; + /** + * @property matrix + * @type Matrix + */ this.matrix = null; - //this.setContext(gl); }; +PIXI.WebGLFastSpriteBatch.prototype.constructor = PIXI.WebGLFastSpriteBatch; + +/** + * Sets the WebGL Context. + * + * @method setContext + * @param gl {WebGLContext} the current WebGL drawing context + */ PIXI.WebGLFastSpriteBatch.prototype.setContext = function(gl) { this.gl = gl; @@ -66,7 +142,6 @@ // 65535 is max index, so 65535 / 6 = 10922. - //upload the index data gl.bindBuffer(gl.ELEMENT_ARRAY_BUFFER, this.indexBuffer); gl.bufferData(gl.ELEMENT_ARRAY_BUFFER, this.indices, gl.STATIC_DRAW); @@ -75,6 +150,11 @@ gl.bufferData(gl.ARRAY_BUFFER, this.vertices, gl.DYNAMIC_DRAW); }; +/** + * @method begin + * @param spriteBatch {WebGLSpriteBatch} + * @param renderSession {Object} + */ PIXI.WebGLFastSpriteBatch.prototype.begin = function(spriteBatch, renderSession) { this.renderSession = renderSession; @@ -85,15 +165,20 @@ this.start(); }; +/** + * @method end + */ PIXI.WebGLFastSpriteBatch.prototype.end = function() { this.flush(); }; - +/** + * @method render + * @param spriteBatch {WebGLSpriteBatch} + */ PIXI.WebGLFastSpriteBatch.prototype.render = function(spriteBatch) { - var children = spriteBatch.children; var sprite = children[0]; @@ -119,6 +204,10 @@ this.flush(); }; +/** + * @method renderSprite + * @param sprite {Sprite} + */ PIXI.WebGLFastSpriteBatch.prototype.renderSprite = function(sprite) { //sprite = children[i]; @@ -137,7 +226,6 @@ uvs = sprite.texture._uvs; - width = sprite.texture.frame.width; height = sprite.texture.frame.height; @@ -257,9 +345,11 @@ } }; +/** + * @method flush + */ PIXI.WebGLFastSpriteBatch.prototype.flush = function() { - // If the batch is length 0 then return as there is nothing to draw if (this.currentBatchSize===0)return; @@ -272,7 +362,6 @@ gl.bindTexture(gl.TEXTURE_2D, this.currentBaseTexture._glTextures[gl.id]); // upload the verts to the buffer - if(this.currentBatchSize > ( this.size * 0.5 ) ) { @@ -285,7 +374,6 @@ gl.bufferSubData(gl.ARRAY_BUFFER, 0, view); } - // now draw those suckas! gl.drawElements(gl.TRIANGLES, this.currentBatchSize * 6, gl.UNSIGNED_SHORT, 0); @@ -297,11 +385,17 @@ }; +/** + * @method stop + */ PIXI.WebGLFastSpriteBatch.prototype.stop = function() { this.flush(); }; +/** + * @method start + */ PIXI.WebGLFastSpriteBatch.prototype.start = function() { var gl = this.gl; @@ -329,8 +423,5 @@ gl.vertexAttribPointer(this.shader.aRotation, 1, gl.FLOAT, false, stride, 6 * 4); gl.vertexAttribPointer(this.shader.aTextureCoord, 2, gl.FLOAT, false, stride, 7 * 4); gl.vertexAttribPointer(this.shader.colorAttribute, 1, gl.FLOAT, false, stride, 9 * 4); - }; - - diff --git a/src/pixi/renderers/webgl/utils/WebGLFilterManager.js b/src/pixi/renderers/webgl/utils/WebGLFilterManager.js index 9bb9195..359a834 100644 --- a/src/pixi/renderers/webgl/utils/WebGLFilterManager.js +++ b/src/pixi/renderers/webgl/utils/WebGLFilterManager.js @@ -5,22 +5,33 @@ /** * @class WebGLFilterManager * @constructor -* @param gl {WebGLContext} the current WebGL drawing context -* @private */ PIXI.WebGLFilterManager = function() { + /** + * @property filterStack + * @type Array + */ this.filterStack = []; + /** + * @property offsetX + * @type Number + */ this.offsetX = 0; - this.offsetY = 0; - // this.setContext(gl); + /** + * @property offsetY + * @type Number + */ + this.offsetY = 0; }; -// API +PIXI.WebGLFilterManager.prototype.constructor = PIXI.WebGLFilterManager; + /** -* Initialises the context and the properties +* Initialises the context and the properties. +* * @method setContext * @param gl {WebGLContext} the current WebGL drawing context */ @@ -33,7 +44,6 @@ }; /** -* * @method begin * @param renderSession {RenderSession} * @param buffer {ArrayBuffer} @@ -44,14 +54,14 @@ this.defaultShader = renderSession.shaderManager.defaultShader; var projection = this.renderSession.projection; - // console.log(this.width) this.width = projection.x * 2; this.height = -projection.y * 2; this.buffer = buffer; }; /** -* Applies the filter and adds it to the current filter stack +* Applies the filter and adds it to the current filter stack. +* * @method pushFilter * @param filterBlock {Object} the filter that will be pushed to the current filter stack */ @@ -64,7 +74,6 @@ filterBlock._filterArea = filterBlock.target.filterArea || filterBlock.target.getBounds(); - // filter program // OPTIMISATION - the first filter is free if its a simple color change? this.filterStack.push(filterBlock); @@ -126,9 +135,9 @@ }; - /** -* Removes the last filter from the filter stack and doesn't return it +* Removes the last filter from the filter stack and doesn't return it. +* * @method popFilter */ PIXI.WebGLFilterManager.prototype.popFilter = function() @@ -211,7 +220,6 @@ this.offsetX -= filterArea.x; this.offsetY -= filterArea.y; - var sizeX = this.width; var sizeY = this.height; @@ -239,9 +247,7 @@ buffer = currentFilter._glFilterTexture.frameBuffer; } - - - // TODO need toremove thease global elements.. + // TODO need to remove these global elements.. projection.x = sizeX/2; projection.y = -sizeY/2; @@ -280,10 +286,6 @@ gl.bufferSubData(gl.ARRAY_BUFFER, 0, this.uvArray); - //console.log(this.vertexArray) - //console.log(this.uvArray) - //console.log(sizeX + " : " + sizeY) - gl.viewport(0, 0, sizeX, sizeY); // bind the buffer @@ -300,9 +302,9 @@ this.applyFilterPass(filter, filterArea, sizeX, sizeY); // now restore the regular shader.. should happen automatically now.. - // this.renderSession.shaderManager.setShader(this.defaultShader); - // gl.uniform2f(this.defaultShader.projectionVector, sizeX/2, -sizeY/2); - // gl.uniform2f(this.defaultShader.offsetVector, -offsetX, -offsetY); + // this.renderSession.shaderManager.setShader(this.defaultShader); + // gl.uniform2f(this.defaultShader.projectionVector, sizeX/2, -sizeY/2); + // gl.uniform2f(this.defaultShader.offsetVector, -offsetX, -offsetY); // return the texture to the pool this.texturePool.push(texture); @@ -311,7 +313,8 @@ /** -* Applies the filter to the specified area +* Applies the filter to the specified area. +* * @method applyFilterPass * @param filter {AbstractFilter} the filter that needs to be applied * @param filterArea {texture} TODO - might need an update @@ -351,7 +354,6 @@ filter.uniforms.dimensions.value[3] = this.vertexArray[5];//filterArea.height; } - // console.log(this.uvArray ) shader.syncUniforms(); gl.bindBuffer(gl.ARRAY_BUFFER, this.vertexBuffer); @@ -372,7 +374,8 @@ }; /** -* Initialises the shader buffers +* Initialises the shader buffers. +* * @method initShaderBuffers */ PIXI.WebGLFilterManager.prototype.initShaderBuffers = function() @@ -385,7 +388,6 @@ this.colorBuffer = gl.createBuffer(); this.indexBuffer = gl.createBuffer(); - // bind and upload the vertexs.. // keep a reference to the vertexFloatData.. this.vertexArray = new Float32Array([0.0, 0.0, @@ -394,11 +396,7 @@ 1.0, 1.0]); gl.bindBuffer(gl.ARRAY_BUFFER, this.vertexBuffer); - gl.bufferData( - gl.ARRAY_BUFFER, - this.vertexArray, - gl.STATIC_DRAW); - + gl.bufferData(gl.ARRAY_BUFFER, this.vertexArray, gl.STATIC_DRAW); // bind and upload the uv buffer this.uvArray = new Float32Array([0.0, 0.0, @@ -407,10 +405,7 @@ 1.0, 1.0]); gl.bindBuffer(gl.ARRAY_BUFFER, this.uvBuffer); - gl.bufferData( - gl.ARRAY_BUFFER, - this.uvArray, - gl.STATIC_DRAW); + gl.bufferData(gl.ARRAY_BUFFER, this.uvArray, gl.STATIC_DRAW); this.colorArray = new Float32Array([1.0, 0xFFFFFF, 1.0, 0xFFFFFF, @@ -418,21 +413,17 @@ 1.0, 0xFFFFFF]); gl.bindBuffer(gl.ARRAY_BUFFER, this.colorBuffer); - gl.bufferData( - gl.ARRAY_BUFFER, - this.colorArray, - gl.STATIC_DRAW); + gl.bufferData(gl.ARRAY_BUFFER, this.colorArray, gl.STATIC_DRAW); // bind and upload the index gl.bindBuffer(gl.ELEMENT_ARRAY_BUFFER, this.indexBuffer); - gl.bufferData( - gl.ELEMENT_ARRAY_BUFFER, - new Uint16Array([0, 1, 2, 1, 3, 2]), - gl.STATIC_DRAW); + gl.bufferData(gl.ELEMENT_ARRAY_BUFFER, new Uint16Array([0, 1, 2, 1, 3, 2]), gl.STATIC_DRAW); + }; /** -* Destroys the filter and removes it from the filter stack +* Destroys the filter and removes it from the filter stack. +* * @method destroy */ PIXI.WebGLFilterManager.prototype.destroy = function() diff --git a/src/pixi/renderers/webgl/utils/WebGLGraphics.js b/src/pixi/renderers/webgl/utils/WebGLGraphics.js index 4de401d..9ea5a53 100644 --- a/src/pixi/renderers/webgl/utils/WebGLGraphics.js +++ b/src/pixi/renderers/webgl/utils/WebGLGraphics.js @@ -11,7 +11,6 @@ */ PIXI.WebGLGraphics = function() { - }; /** @@ -120,7 +119,6 @@ webGL.data = []; webGL.lastIndex = 0; } - var webGLData; @@ -131,8 +129,6 @@ { var data = graphics.graphicsData[i]; - - if(data.type === PIXI.Graphics.POLY) { // need to add the points the the graphics object.. @@ -189,7 +185,6 @@ } } - webGL.lastIndex++; } @@ -201,7 +196,13 @@ } }; - +/** + * @static + * @private + * @method switchMode + * @param webGL {WebGLContext} + * @param type {Number} + */ PIXI.WebGLGraphics.switchMode = function(webGL, type) { var webGLData; @@ -308,7 +309,6 @@ */ PIXI.WebGLGraphics.buildRoundedRectangle = function(graphicsData, webGLData) { - var points = graphicsData.points; var x = points[0]; var y = points[1]; @@ -316,7 +316,6 @@ var height = points[3]; var radius = points[4]; - var recPoints = []; recPoints.push(x, y + radius); recPoints = recPoints.concat(PIXI.WebGLGraphics.quadraticBezierCurve(x, y + height - radius, x, y + height, x + radius, y + height)); @@ -324,7 +323,6 @@ recPoints = recPoints.concat(PIXI.WebGLGraphics.quadraticBezierCurve(x + width, y + radius, x + width, y, x + width - radius, y)); recPoints = recPoints.concat(PIXI.WebGLGraphics.quadraticBezierCurve(x + radius, y, x, y, x, y + radius)); - if (graphicsData.fill) { var color = PIXI.hex2rgb(graphicsData.fillColor); var alpha = graphicsData.fillAlpha; @@ -368,8 +366,8 @@ }; /** - * Calcul the points for a quadratic bezier curve. (helper function..) - * Based on : https://stackoverflow.com/questions/785097/how-do-i-implement-a-bezier-curve-in-c + * Calculate the points for a quadratic bezier curve. (helper function..) + * Based on: https://stackoverflow.com/questions/785097/how-do-i-implement-a-bezier-curve-in-c * * @static * @private @@ -383,6 +381,7 @@ * @return {Array} */ PIXI.WebGLGraphics.quadraticBezierCurve = function(fromX, fromY, cpX, cpY, toX, toY) { + var xa, ya, xb, @@ -718,13 +717,12 @@ * * @static * @private - * @method buildPoly + * @method buildComplexPoly * @param graphicsData {Graphics} The graphics object containing all the necessary properties * @param webGLData {Object} */ PIXI.WebGLGraphics.buildComplexPoly = function(graphicsData, webGLData) { - //TODO - no need to copy this as it gets turned into a FLoat32Array anyways.. var points = graphicsData.points.slice(); if(points.length < 6)return; @@ -776,6 +774,15 @@ }; +/** + * Builds a polygon to draw + * + * @static + * @private + * @method buildPoly + * @param graphicsData {Graphics} The graphics object containing all the necessary properties + * @param webGLData {Object} + */ PIXI.WebGLGraphics.buildPoly = function(graphicsData, webGLData) { var points = graphicsData.points; @@ -818,6 +825,11 @@ PIXI.WebGLGraphics.graphicsDataPool = []; +/** + * @class WebGLGraphicsData + * @private + * @static + */ PIXI.WebGLGraphicsData = function(gl) { this.gl = gl; @@ -834,6 +846,9 @@ this.dirty = true; }; +/** + * @method reset + */ PIXI.WebGLGraphicsData.prototype.reset = function() { this.points = []; @@ -841,6 +856,9 @@ this.lastIndex = 0; }; +/** + * @method upload + */ PIXI.WebGLGraphicsData.prototype.upload = function() { var gl = this.gl; diff --git a/src/pixi/renderers/webgl/utils/WebGLMaskManager.js b/src/pixi/renderers/webgl/utils/WebGLMaskManager.js index 181f560..607d5dd 100644 --- a/src/pixi/renderers/webgl/utils/WebGLMaskManager.js +++ b/src/pixi/renderers/webgl/utils/WebGLMaskManager.js @@ -5,16 +5,17 @@ /** * @class WebGLMaskManager * @constructor -* @param gl {WebGLContext} the current WebGL drawing context * @private */ PIXI.WebGLMaskManager = function() { - //this.setContext(gl); }; +PIXI.WebGLMaskManager.prototype.constructor = PIXI.WebGLMaskManager; + /** -* Sets the drawing context to the one given in parameter +* Sets the drawing context to the one given in parameter. +* * @method setContext * @param gl {WebGLContext} the current WebGL drawing context */ @@ -24,10 +25,11 @@ }; /** -* Applies the Mask and adds it to the current filter stack +* Applies the Mask and adds it to the current filter stack. +* * @method pushMask * @param maskData {Array} -* @param renderSession {RenderSession} +* @param renderSession {Object} */ PIXI.WebGLMaskManager.prototype.pushMask = function(maskData, renderSession) { @@ -44,10 +46,11 @@ }; /** -* Removes the last filter from the filter stack and doesn't return it +* Removes the last filter from the filter stack and doesn't return it. +* * @method popMask -* -* @param renderSession {RenderSession} an object containing all the useful parameters +* @param maskData {Array} +* @param renderSession {Object} an object containing all the useful parameters */ PIXI.WebGLMaskManager.prototype.popMask = function(maskData, renderSession) { @@ -55,9 +58,9 @@ renderSession.stencilManager.popStencil(maskData, maskData._webGL[gl.id].data[0], renderSession); }; - /** -* Destroys the mask stack +* Destroys the mask stack. +* * @method destroy */ PIXI.WebGLMaskManager.prototype.destroy = function() diff --git a/src/pixi/InteractionData.js b/src/pixi/InteractionData.js index ea77370..fa84a6d 100644 --- a/src/pixi/InteractionData.js +++ b/src/pixi/InteractionData.js @@ -18,7 +18,6 @@ */ this.global = new PIXI.Point(); - /** * The target Sprite that was interacted with * diff --git a/src/pixi/InteractionManager.js b/src/pixi/InteractionManager.js index 685c386..71f320b 100644 --- a/src/pixi/InteractionManager.js +++ b/src/pixi/InteractionManager.js @@ -14,7 +14,7 @@ PIXI.InteractionManager = function(stage) { /** - * a reference to the stage + * A reference to the stage * * @property stage * @type Stage @@ -22,7 +22,7 @@ this.stage = stage; /** - * the mouse data + * The mouse data * * @property mouse * @type InteractionData @@ -30,18 +30,21 @@ this.mouse = new PIXI.InteractionData(); /** - * an object that stores current touches (InteractionData) by id reference + * An object that stores current touches (InteractionData) by id reference * * @property touches * @type Object */ this.touches = {}; - // helpers + /** + * @property tempPoint + * @type Point + * @private + */ this.tempPoint = new PIXI.Point(); /** - * * @property mouseoverEnabled * @type Boolean * @default @@ -49,7 +52,7 @@ this.mouseoverEnabled = true; /** - * tiny little interactiveData pool ! + * Tiny little interactiveData pool ! * * @property pool * @type Array @@ -61,7 +64,6 @@ * @property interactiveItems * @type Array * @private - * */ this.interactiveItems = []; @@ -73,23 +75,60 @@ */ this.interactionDOMElement = null; - //this will make it so that you dont have to call bind all the time + //this will make it so that you don't have to call bind all the time + + /** + * @property onMouseMove + * @type Function + */ this.onMouseMove = this.onMouseMove.bind( this ); + + /** + * @property onMouseDown + * @type Function + */ this.onMouseDown = this.onMouseDown.bind(this); + + /** + * @property onMouseOut + * @type Function + */ this.onMouseOut = this.onMouseOut.bind(this); + + /** + * @property onMouseUp + * @type Function + */ this.onMouseUp = this.onMouseUp.bind(this); + /** + * @property onTouchStart + * @type Function + */ this.onTouchStart = this.onTouchStart.bind(this); + + /** + * @property onTouchEnd + * @type Function + */ this.onTouchEnd = this.onTouchEnd.bind(this); + + /** + * @property onTouchMove + * @type Function + */ this.onTouchMove = this.onTouchMove.bind(this); + /** + * @property last + * @type Number + */ this.last = 0; /** * The css style of the cursor that is being used * @property currentCursorStyle * @type String - * */ this.currentCursorStyle = 'inherit'; @@ -97,10 +136,13 @@ * Is set to true when the mouse is moved out of the canvas * @property mouseOut * @type Boolean - * */ this.mouseOut = false; + /** + * @property resolution + * @type Number + */ this.resolution = 1; }; @@ -166,7 +208,6 @@ this.setTargetDomElement (target.view); }; - /** * Sets the DOM element which will receive mouse/touch events. This is useful for when you have other DOM * elements on top of the renderers Canvas element. With this you'll be able to delegate another DOM element @@ -201,7 +242,10 @@ window.addEventListener('mouseup', this.onMouseUp, true); }; - +/** + * @method removeEvents + * @private + */ PIXI.InteractionManager.prototype.removeEvents = function() { if (!this.interactionDOMElement) return; @@ -308,6 +352,10 @@ } }; +/** + * @method rebuildInteractiveGraph + * @private + */ PIXI.InteractionManager.prototype.rebuildInteractiveGraph = function() { this.dirty = false; @@ -427,10 +475,10 @@ }; /** - * Is called when the mouse button is moved out of the renderer element + * Is called when the mouse is moved out of the renderer element * * @method onMouseOut - * @param event {Event} The DOM event of a mouse button being moved out + * @param event {Event} The DOM event of a mouse being moved out * @private */ PIXI.InteractionManager.prototype.onMouseOut = function(event) diff --git a/src/pixi/renderers/webgl/WebGLRenderer.js b/src/pixi/renderers/webgl/WebGLRenderer.js index 968fd3d..422896f 100644 --- a/src/pixi/renderers/webgl/WebGLRenderer.js +++ b/src/pixi/renderers/webgl/WebGLRenderer.js @@ -5,23 +5,21 @@ PIXI.glContexts = []; // this is where we store the webGL contexts for easy access. /** - * the WebGLRenderer draws the stage and all its content onto a webGL enabled canvas. This renderer - * should be used for browsers that support webGL. This Render works by automatically managing webGLBatch's. - * So no need for Sprite Batch's or Sprite Cloud's - * Dont forget to add the view to your DOM or you will not see anything :) + * The WebGLRenderer draws the stage and all its content onto a webGL enabled canvas. This renderer + * should be used for browsers that support webGL. This Render works by automatically managing webGLBatchs. + * So no need for Sprite Batches or Sprite Clouds. + * Don't forget to add the view to your DOM or you will not see anything :) * * @class WebGLRenderer * @constructor * @param [width=0] {Number} the width of the canvas view * @param [height=0] {Number} the height of the canvas view - * * @param [options] {Object} The optional renderer parameters * @param [options.view] {HTMLCanvasElement} the canvas to use as a view, optional * @param [options.transparent=false] {Boolean} If the render view is transparent, default false * @param [options.antialias=false] {Boolean} sets antialias (only applicable in chrome at the moment) * @param [options.preserveDrawingBuffer=false] {Boolean} enables drawing buffer preservation, enable this if you need to call toDataUrl on the webgl context * @param [options.resolution=1] {Number} the resolution of the renderer retina would be 2 - * */ PIXI.WebGLRenderer = function(width, height, options) { @@ -37,13 +35,16 @@ options = PIXI.defaultRenderOptions; } - if(!PIXI.defaultRenderer) { PIXI.sayHello('webGL'); PIXI.defaultRenderer = this; } + /** + * @property type + * @type Number + */ this.type = PIXI.WEBGL_RENDERER; /** @@ -56,6 +57,7 @@ this.resolution = options.resolution; // do a catch.. only 1 webGL renderer.. + /** * Whether the render view is transparent * @@ -99,12 +101,27 @@ this.view = options.view || document.createElement( 'canvas' ); // deal with losing context.. + + /** + * @property contextLostBound + * @type Function + */ this.contextLostBound = this.handleContextLost.bind(this); + + /** + * @property contextRestoredBound + * @type Function + */ this.contextRestoredBound = this.handleContextRestored.bind(this); this.view.addEventListener('webglcontextlost', this.contextLostBound, false); this.view.addEventListener('webglcontextrestored', this.contextRestoredBound, false); + /** + * @property _contextOptions + * @type Object + * @private + */ this._contextOptions = { alpha: this.transparent, antialias: options.antialias, // SPEED UP?? @@ -113,18 +130,67 @@ preserveDrawingBuffer: options.preserveDrawingBuffer }; + /** + * @property projection + * @type Point + */ this.projection = new PIXI.Point(); + + /** + * @property offset + * @type Point + */ this.offset = new PIXI.Point(0, 0); - // time to create the render managers! each one focuses on managine a state in webGL - 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(); // manages the stencil buffer - this.blendModeManager = new PIXI.WebGLBlendModeManager(); // manages the blendModes + // time to create the render managers! each one focuses on managing a state in webGL - // TODO remove + /** + * Deals with managing the shader programs and their attribs + * @property shaderManager + * @type WebGLShaderManager + */ + this.shaderManager = new PIXI.WebGLShaderManager(); + + /** + * Manages the rendering of sprites + * @property spriteBatch + * @type WebGLSpriteBatch + */ + this.spriteBatch = new PIXI.WebGLSpriteBatch(); + + /** + * Manages the masks using the stencil buffer + * @property maskManager + * @type WebGLMaskManager + */ + this.maskManager = new PIXI.WebGLMaskManager(); + + /** + * Manages the filters + * @property filterManager + * @type WebGLFilterManager + */ + this.filterManager = new PIXI.WebGLFilterManager(); + + /** + * Manages the stencil buffer + * @property stencilManager + * @type WebGLStencilManager + */ + this.stencilManager = new PIXI.WebGLStencilManager(); + + /** + * Manages the blendModes + * @property blendModeManager + * @type WebGLBlendModeManager + */ + this.blendModeManager = new PIXI.WebGLBlendModeManager(); + + /** + * TODO remove + * @property renderSession + * @type Object + */ this.renderSession = {}; this.renderSession.gl = this.gl; this.renderSession.drawCount = 0; @@ -147,6 +213,9 @@ // constructor PIXI.WebGLRenderer.prototype.constructor = PIXI.WebGLRenderer; +/** +* @method initContext +*/ PIXI.WebGLRenderer.prototype.initContext = function() { var gl = this.view.getContext('webgl', this._contextOptions) || this.view.getContext('experimental-webgl', this._contextOptions); @@ -180,7 +249,6 @@ this.resize(this.width, this.height); }; - /** * Renders the stage to its webGL view * @@ -205,9 +273,7 @@ // update the scene graph stage.updateTransform(); - var gl = this.gl; - // interaction if(stage._interactive) @@ -249,9 +315,9 @@ }; /** - * Renders a display Object + * Renders a Display Object. * - * @method renderDIsplayObject + * @method renderDisplayObject * @param displayObject {DisplayObject} The DisplayObject to render * @param projection {Point} The projection * @param buffer {Array} a standard WebGL buffer @@ -283,7 +349,7 @@ }; /** - * resizes the webGL view to the specified width and height + * Resizes the webGL view to the specified width and height. * * @method resize * @param width {Number} the new width of the webGL view @@ -297,10 +363,6 @@ this.view.width = this.width; this.view.height = this.height; - // this.view.style.width = width + 'px'; - // this.view.style.height = height + 'px'; - - // console.log(this.width / this.resolution) this.gl.viewport(0, 0, this.width, this.height); this.projection.x = this.width / 2 / this.resolution; @@ -308,10 +370,10 @@ }; /** - * Updates and Creates a WebGL texture for the renderers context + * Updates and Creates a WebGL texture for the renderers context. * * @method updateTexture - * @param texture {Texture} the texture to render + * @param texture {Texture} the texture to update */ PIXI.WebGLRenderer.prototype.updateTexture = function(texture) { @@ -411,6 +473,11 @@ this.renderSession = null; }; +/** + * Maps Pixi blend modes to WebGL blend modes. + * + * @method mapBlendModes + */ PIXI.WebGLRenderer.prototype.mapBlendModes = function() { var gl = this.gl; diff --git a/src/pixi/renderers/webgl/shaders/ComplexPrimitiveShader.js b/src/pixi/renderers/webgl/shaders/ComplexPrimitiveShader.js index daa8b64..79d038a 100644 --- a/src/pixi/renderers/webgl/shaders/ComplexPrimitiveShader.js +++ b/src/pixi/renderers/webgl/shaders/ComplexPrimitiveShader.js @@ -9,7 +9,13 @@ */ PIXI.ComplexPrimitiveShader = function(gl) { + /** + * @property _UID + * @type Number + * @private + */ this._UID = PIXI._UID++; + /** * @property gl * @type WebGLContext @@ -17,18 +23,20 @@ this.gl = gl; /** - * @property {any} program - The WebGL program. - */ + * The WebGL program. + * @property program + * @type {Any} + */ this.program = null; /** + * The fragment shader. * @property fragmentSrc * @type Array */ this.fragmentSrc = [ - 'precision mediump float;', - + 'precision mediump float;', 'varying vec4 vColor;', @@ -38,6 +46,7 @@ ]; /** + * The vertex shader. * @property vertexSrc * @type Array */ @@ -65,14 +74,15 @@ this.init(); }; +PIXI.ComplexPrimitiveShader.prototype.constructor = PIXI.ComplexPrimitiveShader; + /** -* Initialises the shader +* Initialises the shader. +* * @method init -* */ PIXI.ComplexPrimitiveShader.prototype.init = function() { - var gl = this.gl; var program = PIXI.compileProgram(gl, this.vertexSrc, this.fragmentSrc); @@ -84,7 +94,6 @@ this.tintColor = gl.getUniformLocation(program, 'tint'); this.color = gl.getUniformLocation(program, 'color'); - // get and store the attributes this.aVertexPosition = gl.getAttribLocation(program, 'aVertexPosition'); // this.colorAttribute = gl.getAttribLocation(program, 'aColor'); @@ -98,9 +107,9 @@ }; /** -* Destroys the shader +* Destroys the shader. +* * @method destroy -* */ PIXI.ComplexPrimitiveShader.prototype.destroy = function() { diff --git a/src/pixi/renderers/webgl/shaders/PixiFastShader.js b/src/pixi/renderers/webgl/shaders/PixiFastShader.js index 4fb3fe2..bb46419 100644 --- a/src/pixi/renderers/webgl/shaders/PixiFastShader.js +++ b/src/pixi/renderers/webgl/shaders/PixiFastShader.js @@ -1,6 +1,5 @@ /** * @author Mat Groves http://matgroves.com/ @Doormat23 - * @author Richard Davey http://www.photonstorm.com @photonstorm */ /** @@ -10,6 +9,11 @@ */ PIXI.PixiFastShader = function(gl) { + /** + * @property _UID + * @type Number + * @private + */ this._UID = PIXI._UID++; /** @@ -19,12 +23,16 @@ this.gl = gl; /** - * @property {any} program - The WebGL program. + * The WebGL program. + * @property program + * @type {Any} */ this.program = null; /** - * @property {array} fragmentSrc - The fragment shader. + * The fragment shader. + * @property fragmentSrc + * @type Array */ this.fragmentSrc = [ 'precision lowp float;', @@ -37,8 +45,10 @@ ]; /** - * @property {array} vertexSrc - The vertex shader - */ + * The vertex shader. + * @property vertexSrc + * @type Array + */ this.vertexSrc = [ 'attribute vec2 aVertexPosition;', 'attribute vec2 aPositionCoord;', @@ -69,24 +79,25 @@ '}' ]; - /** - * @property {number} textureCount - A local texture counter for multi-texture shaders. - */ + * A local texture counter for multi-texture shaders. + * @property textureCount + * @type Number + */ this.textureCount = 0; - this.init(); }; +PIXI.PixiFastShader.prototype.constructor = PIXI.PixiFastShader; + /** -* Initialises the shader +* Initialises the shader. +* * @method init -* */ PIXI.PixiFastShader.prototype.init = function() { - var gl = this.gl; var program = PIXI.compileProgram(gl, this.vertexSrc, this.fragmentSrc); @@ -111,8 +122,6 @@ this.aTextureCoord = gl.getAttribLocation(program, 'aTextureCoord'); this.colorAttribute = gl.getAttribLocation(program, 'aColor'); - - // Begin worst hack eva // // WHY??? ONLY on my chrome pixel the line above returns -1 when using filters? @@ -128,14 +137,13 @@ // End worst hack eva // - this.program = program; }; /** -* Destroys the shader +* Destroys the shader. +* * @method destroy -* */ PIXI.PixiFastShader.prototype.destroy = function() { diff --git a/src/pixi/renderers/webgl/shaders/PixiShader.js b/src/pixi/renderers/webgl/shaders/PixiShader.js index d76ec03..725dce2 100644 --- a/src/pixi/renderers/webgl/shaders/PixiShader.js +++ b/src/pixi/renderers/webgl/shaders/PixiShader.js @@ -6,9 +6,15 @@ /** * @class PixiShader * @constructor +* @param gl {WebGLContext} the current WebGL drawing context */ PIXI.PixiShader = function(gl) { + /** + * @property _UID + * @type Number + * @private + */ this._UID = PIXI._UID++; /** @@ -18,13 +24,17 @@ this.gl = gl; /** - * @property {any} program - The WebGL program. - */ + * The WebGL program. + * @property program + * @type {Any} + */ this.program = null; /** - * @property {array} fragmentSrc - The fragment shader. - */ + * The fragment shader. + * @property fragmentSrc + * @type Array + */ this.fragmentSrc = [ 'precision lowp float;', 'varying vec2 vTextureCoord;', @@ -36,21 +46,44 @@ ]; /** - * @property {number} textureCount - A local texture counter for multi-texture shaders. - */ + * A local texture counter for multi-texture shaders. + * @property textureCount + * @type Number + */ this.textureCount = 0; + + /** + * A local flag + * @property firstRun + * @type Boolean + * @private + */ this.firstRun = true; + + /** + * A dirty flag + * @property dirty + * @type Boolean + */ this.dirty = true; + /** + * Uniform attributes cache. + * @property attributes + * @type Array + * @private + */ this.attributes = []; this.init(); }; +PIXI.PixiShader.prototype.constructor = PIXI.PixiShader; + /** -* Initialises the shader +* Initialises the shader. +* * @method init -* */ PIXI.PixiShader.prototype.init = function() { @@ -71,12 +104,11 @@ this.aTextureCoord = gl.getAttribLocation(program, 'aTextureCoord'); this.colorAttribute = gl.getAttribLocation(program, 'aColor'); - // Begin worst hack eva // // WHY??? ONLY on my chrome pixel the line above returns -1 when using filters? // maybe its something to do with the current state of the gl context. - // Im convinced this is a bug in the chrome browser as there is NO reason why this should be returning -1 especially as it only manifests on my chrome pixel + // I'm convinced this is a bug in the chrome browser as there is NO reason why this should be returning -1 especially as it only manifests on my chrome pixel // If theres any webGL people that know why could happen please help :) if(this.colorAttribute === -1) { @@ -101,6 +133,7 @@ /** * Initialises the shader uniform values. +* * Uniforms are specified in the GLSL_ES Specification: http://www.khronos.org/registry/webgl/specs/latest/1.0/ * http://www.khronos.org/registry/gles/specs/2.0/GLSL_ES_Specification_1.0.17.pdf * @@ -316,7 +349,8 @@ }; /** -* Destroys the shader +* Destroys the shader. +* * @method destroy */ PIXI.PixiShader.prototype.destroy = function() @@ -329,7 +363,8 @@ }; /** -* The Default Vertex shader source +* The Default Vertex shader source. +* * @property defaultVertexSrc * @type String */ diff --git a/src/pixi/renderers/webgl/shaders/PrimitiveShader.js b/src/pixi/renderers/webgl/shaders/PrimitiveShader.js index 3a82be2..0f6854c 100644 --- a/src/pixi/renderers/webgl/shaders/PrimitiveShader.js +++ b/src/pixi/renderers/webgl/shaders/PrimitiveShader.js @@ -9,6 +9,11 @@ */ PIXI.PrimitiveShader = function(gl) { + /** + * @property _UID + * @type Number + * @private + */ this._UID = PIXI._UID++; /** @@ -18,11 +23,14 @@ this.gl = gl; /** - * @property {any} program - The WebGL program. - */ + * The WebGL program. + * @property program + * @type {Any} + */ this.program = null; /** + * The fragment shader. * @property fragmentSrc * @type Array */ @@ -36,6 +44,7 @@ ]; /** + * The vertex shader. * @property vertexSrc * @type Array */ @@ -60,14 +69,15 @@ this.init(); }; +PIXI.PrimitiveShader.prototype.constructor = PIXI.PrimitiveShader; + /** -* Initialises the shader +* Initialises the shader. +* * @method init -* */ PIXI.PrimitiveShader.prototype.init = function() { - var gl = this.gl; var program = PIXI.compileProgram(gl, this.vertexSrc, this.fragmentSrc); @@ -78,7 +88,6 @@ this.offsetVector = gl.getUniformLocation(program, 'offsetVector'); this.tintColor = gl.getUniformLocation(program, 'tint'); - // get and store the attributes this.aVertexPosition = gl.getAttribLocation(program, 'aVertexPosition'); this.colorAttribute = gl.getAttribLocation(program, 'aColor'); @@ -92,9 +101,9 @@ }; /** -* Destroys the shader +* Destroys the shader. +* * @method destroy -* */ PIXI.PrimitiveShader.prototype.destroy = function() { diff --git a/src/pixi/renderers/webgl/shaders/StripShader.js b/src/pixi/renderers/webgl/shaders/StripShader.js index 11f13ad..8fefe51 100644 --- a/src/pixi/renderers/webgl/shaders/StripShader.js +++ b/src/pixi/renderers/webgl/shaders/StripShader.js @@ -2,20 +2,37 @@ * @author Mat Groves http://matgroves.com/ @Doormat23 */ - +/** +* @class StripShader +* @constructor +* @param gl {WebGLContext} the current WebGL drawing context +*/ PIXI.StripShader = function(gl) { + /** + * @property _UID + * @type Number + * @private + */ this._UID = PIXI._UID++; + /** + * @property gl + * @type WebGLContext + */ this.gl = gl; /** - * @property {any} program - The WebGL program. - */ + * The WebGL program. + * @property program + * @type {Any} + */ this.program = null; /** - * @property {array} fragmentSrc - The fragment shader. + * The fragment shader. + * @property fragmentSrc + * @type Array */ this.fragmentSrc = [ 'precision mediump float;', @@ -30,9 +47,11 @@ '}' ]; - /** - * @property {array} fragmentSrc - The fragment shader. - */ + /** + * The vertex shader. + * @property vertexSrc + * @type Array + */ this.vertexSrc = [ 'attribute vec2 aVertexPosition;', 'attribute vec2 aTextureCoord;', @@ -56,10 +75,12 @@ this.init(); }; +PIXI.StripShader.prototype.constructor = PIXI.StripShader; + /** -* Initialises the shader +* Initialises the shader. +* * @method init -* */ PIXI.StripShader.prototype.init = function() { @@ -88,9 +109,9 @@ }; /** -* Destroys the shader +* Destroys the shader. +* * @method destroy -* */ PIXI.StripShader.prototype.destroy = function() { diff --git a/src/pixi/renderers/webgl/utils/FilterTexture.js b/src/pixi/renderers/webgl/utils/FilterTexture.js index 9dada23..389acbe 100644 --- a/src/pixi/renderers/webgl/utils/FilterTexture.js +++ b/src/pixi/renderers/webgl/utils/FilterTexture.js @@ -9,7 +9,6 @@ * @param width {Number} the horizontal range of the filter * @param height {Number} the vertical range of the filter * @param scaleMode {Number} Should be one of the PIXI.scaleMode consts -* @private */ PIXI.FilterTexture = function(gl, width, height, scaleMode) { @@ -19,11 +18,24 @@ */ this.gl = gl; - // next time to create a frame buffer and texture + + /** + * @property frameBuffer + * @type Any + */ this.frameBuffer = gl.createFramebuffer(); + + /** + * @property texture + * @type Any + */ this.texture = gl.createTexture(); + /** + * @property scaleMode + * @type Number + */ scaleMode = scaleMode || PIXI.scaleModes.DEFAULT; gl.bindTexture(gl.TEXTURE_2D, this.texture); @@ -44,9 +56,11 @@ this.resize(width, height); }; +PIXI.FilterTexture.prototype.constructor = PIXI.FilterTexture; /** -* Clears the filter texture +* Clears the filter texture. +* * @method clear */ PIXI.FilterTexture.prototype.clear = function() @@ -75,14 +89,14 @@ gl.bindTexture(gl.TEXTURE_2D, this.texture); gl.texImage2D(gl.TEXTURE_2D, 0, gl.RGBA, width , height , 0, gl.RGBA, gl.UNSIGNED_BYTE, null); - // console.log( width, width ) // update the stencil buffer width and height gl.bindRenderbuffer(gl.RENDERBUFFER, this.renderBuffer); gl.renderbufferStorage(gl.RENDERBUFFER, gl.DEPTH_STENCIL, width , height ); }; /** -* Destroys the filter texture +* Destroys the filter texture. +* * @method destroy */ PIXI.FilterTexture.prototype.destroy = function() diff --git a/src/pixi/renderers/webgl/utils/WebGLBlendModeManager.js b/src/pixi/renderers/webgl/utils/WebGLBlendModeManager.js index c73728f..3de0ec9 100644 --- a/src/pixi/renderers/webgl/utils/WebGLBlendModeManager.js +++ b/src/pixi/renderers/webgl/utils/WebGLBlendModeManager.js @@ -3,31 +3,42 @@ */ /** -* @class WebGLMaskManager +* @class WebGLBlendModeManager * @constructor * @param gl {WebGLContext} the current WebGL drawing context -* @private */ PIXI.WebGLBlendModeManager = function() { + /** + * @property currentBlendMode + * @type Number + */ this.currentBlendMode = 99999; }; +PIXI.WebGLBlendModeManager.prototype.constructor = PIXI.WebGLBlendModeManager; + +/** + * Sets the WebGL Context. + * + * @method setContext + * @param gl {WebGLContext} the current WebGL drawing context + */ PIXI.WebGLBlendModeManager.prototype.setContext = function(gl) { this.gl = gl; }; /** -* Sets-up the given blendMode from WebGL's point of view +* Sets-up the given blendMode from WebGL's point of view. +* * @method setBlendMode -* * @param blendMode {Number} the blendMode, should be a Pixi const, such as PIXI.BlendModes.ADD */ PIXI.WebGLBlendModeManager.prototype.setBlendMode = function(blendMode) { if(this.currentBlendMode === blendMode)return false; - // console.log("SWAP!") + this.currentBlendMode = blendMode; var blendModeWebGL = PIXI.blendModesWebGL[this.currentBlendMode]; @@ -36,7 +47,12 @@ return true; }; +/** +* Destroys this object. +* +* @method destroy +*/ PIXI.WebGLBlendModeManager.prototype.destroy = function() { this.gl = null; -}; \ No newline at end of file +}; diff --git a/src/pixi/renderers/webgl/utils/WebGLFastSpriteBatch.js b/src/pixi/renderers/webgl/utils/WebGLFastSpriteBatch.js index 0d08e47..0bdbbe4 100644 --- a/src/pixi/renderers/webgl/utils/WebGLFastSpriteBatch.js +++ b/src/pixi/renderers/webgl/utils/WebGLFastSpriteBatch.js @@ -8,27 +8,66 @@ * https://github.com/libgdx/libgdx/blob/master/gdx/src/com/badlogic/gdx/graphics/g2d/WebGLSpriteBatch.java */ +/** +* @class WebGLFastSpriteBatch +* @constructor +*/ PIXI.WebGLFastSpriteBatch = function() { - - + /** + * @property vertSize + * @type Number + */ this.vertSize = 10; + + /** + * @property maxSize + * @type Number + */ this.maxSize = 6000;//Math.pow(2, 16) / this.vertSize; + + /** + * @property size + * @type Number + */ this.size = this.maxSize; //the total number of floats in our batch var numVerts = this.size * 4 * this.vertSize; + //the total number of indices in our batch var numIndices = this.maxSize * 6; - //vertex data + /** + * Vertex data + * @property vertices + * @type Float32Array + */ this.vertices = new Float32Array(numVerts); - //index data + + /** + * Index data + * @property indices + * @type Uint16Array + */ this.indices = new Uint16Array(numIndices); + /** + * @property vertexBuffer + * @type Object + */ this.vertexBuffer = null; + + /** + * @property indexBuffer + * @type Object + */ this.indexBuffer = null; + /** + * @property lastIndexCount + * @type Number + */ this.lastIndexCount = 0; for (var i=0, j=0; i < numIndices; i += 6, j += 4) @@ -41,21 +80,58 @@ this.indices[i + 5] = j + 3; } + /** + * @property drawing + * @type Boolean + */ this.drawing = false; + + /** + * @property currentBatchSize + * @type Number + */ this.currentBatchSize = 0; + + /** + * @property currentBaseTexture + * @type BaseTexture + */ this.currentBaseTexture = null; + /** + * @property currentBlendMode + * @type Number + */ this.currentBlendMode = 0; + + /** + * @property renderSession + * @type Object + */ this.renderSession = null; - + /** + * @property shader + * @type Object + */ this.shader = null; + /** + * @property matrix + * @type Matrix + */ this.matrix = null; - //this.setContext(gl); }; +PIXI.WebGLFastSpriteBatch.prototype.constructor = PIXI.WebGLFastSpriteBatch; + +/** + * Sets the WebGL Context. + * + * @method setContext + * @param gl {WebGLContext} the current WebGL drawing context + */ PIXI.WebGLFastSpriteBatch.prototype.setContext = function(gl) { this.gl = gl; @@ -66,7 +142,6 @@ // 65535 is max index, so 65535 / 6 = 10922. - //upload the index data gl.bindBuffer(gl.ELEMENT_ARRAY_BUFFER, this.indexBuffer); gl.bufferData(gl.ELEMENT_ARRAY_BUFFER, this.indices, gl.STATIC_DRAW); @@ -75,6 +150,11 @@ gl.bufferData(gl.ARRAY_BUFFER, this.vertices, gl.DYNAMIC_DRAW); }; +/** + * @method begin + * @param spriteBatch {WebGLSpriteBatch} + * @param renderSession {Object} + */ PIXI.WebGLFastSpriteBatch.prototype.begin = function(spriteBatch, renderSession) { this.renderSession = renderSession; @@ -85,15 +165,20 @@ this.start(); }; +/** + * @method end + */ PIXI.WebGLFastSpriteBatch.prototype.end = function() { this.flush(); }; - +/** + * @method render + * @param spriteBatch {WebGLSpriteBatch} + */ PIXI.WebGLFastSpriteBatch.prototype.render = function(spriteBatch) { - var children = spriteBatch.children; var sprite = children[0]; @@ -119,6 +204,10 @@ this.flush(); }; +/** + * @method renderSprite + * @param sprite {Sprite} + */ PIXI.WebGLFastSpriteBatch.prototype.renderSprite = function(sprite) { //sprite = children[i]; @@ -137,7 +226,6 @@ uvs = sprite.texture._uvs; - width = sprite.texture.frame.width; height = sprite.texture.frame.height; @@ -257,9 +345,11 @@ } }; +/** + * @method flush + */ PIXI.WebGLFastSpriteBatch.prototype.flush = function() { - // If the batch is length 0 then return as there is nothing to draw if (this.currentBatchSize===0)return; @@ -272,7 +362,6 @@ gl.bindTexture(gl.TEXTURE_2D, this.currentBaseTexture._glTextures[gl.id]); // upload the verts to the buffer - if(this.currentBatchSize > ( this.size * 0.5 ) ) { @@ -285,7 +374,6 @@ gl.bufferSubData(gl.ARRAY_BUFFER, 0, view); } - // now draw those suckas! gl.drawElements(gl.TRIANGLES, this.currentBatchSize * 6, gl.UNSIGNED_SHORT, 0); @@ -297,11 +385,17 @@ }; +/** + * @method stop + */ PIXI.WebGLFastSpriteBatch.prototype.stop = function() { this.flush(); }; +/** + * @method start + */ PIXI.WebGLFastSpriteBatch.prototype.start = function() { var gl = this.gl; @@ -329,8 +423,5 @@ gl.vertexAttribPointer(this.shader.aRotation, 1, gl.FLOAT, false, stride, 6 * 4); gl.vertexAttribPointer(this.shader.aTextureCoord, 2, gl.FLOAT, false, stride, 7 * 4); gl.vertexAttribPointer(this.shader.colorAttribute, 1, gl.FLOAT, false, stride, 9 * 4); - }; - - diff --git a/src/pixi/renderers/webgl/utils/WebGLFilterManager.js b/src/pixi/renderers/webgl/utils/WebGLFilterManager.js index 9bb9195..359a834 100644 --- a/src/pixi/renderers/webgl/utils/WebGLFilterManager.js +++ b/src/pixi/renderers/webgl/utils/WebGLFilterManager.js @@ -5,22 +5,33 @@ /** * @class WebGLFilterManager * @constructor -* @param gl {WebGLContext} the current WebGL drawing context -* @private */ PIXI.WebGLFilterManager = function() { + /** + * @property filterStack + * @type Array + */ this.filterStack = []; + /** + * @property offsetX + * @type Number + */ this.offsetX = 0; - this.offsetY = 0; - // this.setContext(gl); + /** + * @property offsetY + * @type Number + */ + this.offsetY = 0; }; -// API +PIXI.WebGLFilterManager.prototype.constructor = PIXI.WebGLFilterManager; + /** -* Initialises the context and the properties +* Initialises the context and the properties. +* * @method setContext * @param gl {WebGLContext} the current WebGL drawing context */ @@ -33,7 +44,6 @@ }; /** -* * @method begin * @param renderSession {RenderSession} * @param buffer {ArrayBuffer} @@ -44,14 +54,14 @@ this.defaultShader = renderSession.shaderManager.defaultShader; var projection = this.renderSession.projection; - // console.log(this.width) this.width = projection.x * 2; this.height = -projection.y * 2; this.buffer = buffer; }; /** -* Applies the filter and adds it to the current filter stack +* Applies the filter and adds it to the current filter stack. +* * @method pushFilter * @param filterBlock {Object} the filter that will be pushed to the current filter stack */ @@ -64,7 +74,6 @@ filterBlock._filterArea = filterBlock.target.filterArea || filterBlock.target.getBounds(); - // filter program // OPTIMISATION - the first filter is free if its a simple color change? this.filterStack.push(filterBlock); @@ -126,9 +135,9 @@ }; - /** -* Removes the last filter from the filter stack and doesn't return it +* Removes the last filter from the filter stack and doesn't return it. +* * @method popFilter */ PIXI.WebGLFilterManager.prototype.popFilter = function() @@ -211,7 +220,6 @@ this.offsetX -= filterArea.x; this.offsetY -= filterArea.y; - var sizeX = this.width; var sizeY = this.height; @@ -239,9 +247,7 @@ buffer = currentFilter._glFilterTexture.frameBuffer; } - - - // TODO need toremove thease global elements.. + // TODO need to remove these global elements.. projection.x = sizeX/2; projection.y = -sizeY/2; @@ -280,10 +286,6 @@ gl.bufferSubData(gl.ARRAY_BUFFER, 0, this.uvArray); - //console.log(this.vertexArray) - //console.log(this.uvArray) - //console.log(sizeX + " : " + sizeY) - gl.viewport(0, 0, sizeX, sizeY); // bind the buffer @@ -300,9 +302,9 @@ this.applyFilterPass(filter, filterArea, sizeX, sizeY); // now restore the regular shader.. should happen automatically now.. - // this.renderSession.shaderManager.setShader(this.defaultShader); - // gl.uniform2f(this.defaultShader.projectionVector, sizeX/2, -sizeY/2); - // gl.uniform2f(this.defaultShader.offsetVector, -offsetX, -offsetY); + // this.renderSession.shaderManager.setShader(this.defaultShader); + // gl.uniform2f(this.defaultShader.projectionVector, sizeX/2, -sizeY/2); + // gl.uniform2f(this.defaultShader.offsetVector, -offsetX, -offsetY); // return the texture to the pool this.texturePool.push(texture); @@ -311,7 +313,8 @@ /** -* Applies the filter to the specified area +* Applies the filter to the specified area. +* * @method applyFilterPass * @param filter {AbstractFilter} the filter that needs to be applied * @param filterArea {texture} TODO - might need an update @@ -351,7 +354,6 @@ filter.uniforms.dimensions.value[3] = this.vertexArray[5];//filterArea.height; } - // console.log(this.uvArray ) shader.syncUniforms(); gl.bindBuffer(gl.ARRAY_BUFFER, this.vertexBuffer); @@ -372,7 +374,8 @@ }; /** -* Initialises the shader buffers +* Initialises the shader buffers. +* * @method initShaderBuffers */ PIXI.WebGLFilterManager.prototype.initShaderBuffers = function() @@ -385,7 +388,6 @@ this.colorBuffer = gl.createBuffer(); this.indexBuffer = gl.createBuffer(); - // bind and upload the vertexs.. // keep a reference to the vertexFloatData.. this.vertexArray = new Float32Array([0.0, 0.0, @@ -394,11 +396,7 @@ 1.0, 1.0]); gl.bindBuffer(gl.ARRAY_BUFFER, this.vertexBuffer); - gl.bufferData( - gl.ARRAY_BUFFER, - this.vertexArray, - gl.STATIC_DRAW); - + gl.bufferData(gl.ARRAY_BUFFER, this.vertexArray, gl.STATIC_DRAW); // bind and upload the uv buffer this.uvArray = new Float32Array([0.0, 0.0, @@ -407,10 +405,7 @@ 1.0, 1.0]); gl.bindBuffer(gl.ARRAY_BUFFER, this.uvBuffer); - gl.bufferData( - gl.ARRAY_BUFFER, - this.uvArray, - gl.STATIC_DRAW); + gl.bufferData(gl.ARRAY_BUFFER, this.uvArray, gl.STATIC_DRAW); this.colorArray = new Float32Array([1.0, 0xFFFFFF, 1.0, 0xFFFFFF, @@ -418,21 +413,17 @@ 1.0, 0xFFFFFF]); gl.bindBuffer(gl.ARRAY_BUFFER, this.colorBuffer); - gl.bufferData( - gl.ARRAY_BUFFER, - this.colorArray, - gl.STATIC_DRAW); + gl.bufferData(gl.ARRAY_BUFFER, this.colorArray, gl.STATIC_DRAW); // bind and upload the index gl.bindBuffer(gl.ELEMENT_ARRAY_BUFFER, this.indexBuffer); - gl.bufferData( - gl.ELEMENT_ARRAY_BUFFER, - new Uint16Array([0, 1, 2, 1, 3, 2]), - gl.STATIC_DRAW); + gl.bufferData(gl.ELEMENT_ARRAY_BUFFER, new Uint16Array([0, 1, 2, 1, 3, 2]), gl.STATIC_DRAW); + }; /** -* Destroys the filter and removes it from the filter stack +* Destroys the filter and removes it from the filter stack. +* * @method destroy */ PIXI.WebGLFilterManager.prototype.destroy = function() diff --git a/src/pixi/renderers/webgl/utils/WebGLGraphics.js b/src/pixi/renderers/webgl/utils/WebGLGraphics.js index 4de401d..9ea5a53 100644 --- a/src/pixi/renderers/webgl/utils/WebGLGraphics.js +++ b/src/pixi/renderers/webgl/utils/WebGLGraphics.js @@ -11,7 +11,6 @@ */ PIXI.WebGLGraphics = function() { - }; /** @@ -120,7 +119,6 @@ webGL.data = []; webGL.lastIndex = 0; } - var webGLData; @@ -131,8 +129,6 @@ { var data = graphics.graphicsData[i]; - - if(data.type === PIXI.Graphics.POLY) { // need to add the points the the graphics object.. @@ -189,7 +185,6 @@ } } - webGL.lastIndex++; } @@ -201,7 +196,13 @@ } }; - +/** + * @static + * @private + * @method switchMode + * @param webGL {WebGLContext} + * @param type {Number} + */ PIXI.WebGLGraphics.switchMode = function(webGL, type) { var webGLData; @@ -308,7 +309,6 @@ */ PIXI.WebGLGraphics.buildRoundedRectangle = function(graphicsData, webGLData) { - var points = graphicsData.points; var x = points[0]; var y = points[1]; @@ -316,7 +316,6 @@ var height = points[3]; var radius = points[4]; - var recPoints = []; recPoints.push(x, y + radius); recPoints = recPoints.concat(PIXI.WebGLGraphics.quadraticBezierCurve(x, y + height - radius, x, y + height, x + radius, y + height)); @@ -324,7 +323,6 @@ recPoints = recPoints.concat(PIXI.WebGLGraphics.quadraticBezierCurve(x + width, y + radius, x + width, y, x + width - radius, y)); recPoints = recPoints.concat(PIXI.WebGLGraphics.quadraticBezierCurve(x + radius, y, x, y, x, y + radius)); - if (graphicsData.fill) { var color = PIXI.hex2rgb(graphicsData.fillColor); var alpha = graphicsData.fillAlpha; @@ -368,8 +366,8 @@ }; /** - * Calcul the points for a quadratic bezier curve. (helper function..) - * Based on : https://stackoverflow.com/questions/785097/how-do-i-implement-a-bezier-curve-in-c + * Calculate the points for a quadratic bezier curve. (helper function..) + * Based on: https://stackoverflow.com/questions/785097/how-do-i-implement-a-bezier-curve-in-c * * @static * @private @@ -383,6 +381,7 @@ * @return {Array} */ PIXI.WebGLGraphics.quadraticBezierCurve = function(fromX, fromY, cpX, cpY, toX, toY) { + var xa, ya, xb, @@ -718,13 +717,12 @@ * * @static * @private - * @method buildPoly + * @method buildComplexPoly * @param graphicsData {Graphics} The graphics object containing all the necessary properties * @param webGLData {Object} */ PIXI.WebGLGraphics.buildComplexPoly = function(graphicsData, webGLData) { - //TODO - no need to copy this as it gets turned into a FLoat32Array anyways.. var points = graphicsData.points.slice(); if(points.length < 6)return; @@ -776,6 +774,15 @@ }; +/** + * Builds a polygon to draw + * + * @static + * @private + * @method buildPoly + * @param graphicsData {Graphics} The graphics object containing all the necessary properties + * @param webGLData {Object} + */ PIXI.WebGLGraphics.buildPoly = function(graphicsData, webGLData) { var points = graphicsData.points; @@ -818,6 +825,11 @@ PIXI.WebGLGraphics.graphicsDataPool = []; +/** + * @class WebGLGraphicsData + * @private + * @static + */ PIXI.WebGLGraphicsData = function(gl) { this.gl = gl; @@ -834,6 +846,9 @@ this.dirty = true; }; +/** + * @method reset + */ PIXI.WebGLGraphicsData.prototype.reset = function() { this.points = []; @@ -841,6 +856,9 @@ this.lastIndex = 0; }; +/** + * @method upload + */ PIXI.WebGLGraphicsData.prototype.upload = function() { var gl = this.gl; diff --git a/src/pixi/renderers/webgl/utils/WebGLMaskManager.js b/src/pixi/renderers/webgl/utils/WebGLMaskManager.js index 181f560..607d5dd 100644 --- a/src/pixi/renderers/webgl/utils/WebGLMaskManager.js +++ b/src/pixi/renderers/webgl/utils/WebGLMaskManager.js @@ -5,16 +5,17 @@ /** * @class WebGLMaskManager * @constructor -* @param gl {WebGLContext} the current WebGL drawing context * @private */ PIXI.WebGLMaskManager = function() { - //this.setContext(gl); }; +PIXI.WebGLMaskManager.prototype.constructor = PIXI.WebGLMaskManager; + /** -* Sets the drawing context to the one given in parameter +* Sets the drawing context to the one given in parameter. +* * @method setContext * @param gl {WebGLContext} the current WebGL drawing context */ @@ -24,10 +25,11 @@ }; /** -* Applies the Mask and adds it to the current filter stack +* Applies the Mask and adds it to the current filter stack. +* * @method pushMask * @param maskData {Array} -* @param renderSession {RenderSession} +* @param renderSession {Object} */ PIXI.WebGLMaskManager.prototype.pushMask = function(maskData, renderSession) { @@ -44,10 +46,11 @@ }; /** -* Removes the last filter from the filter stack and doesn't return it +* Removes the last filter from the filter stack and doesn't return it. +* * @method popMask -* -* @param renderSession {RenderSession} an object containing all the useful parameters +* @param maskData {Array} +* @param renderSession {Object} an object containing all the useful parameters */ PIXI.WebGLMaskManager.prototype.popMask = function(maskData, renderSession) { @@ -55,9 +58,9 @@ renderSession.stencilManager.popStencil(maskData, maskData._webGL[gl.id].data[0], renderSession); }; - /** -* Destroys the mask stack +* Destroys the mask stack. +* * @method destroy */ PIXI.WebGLMaskManager.prototype.destroy = function() diff --git a/src/pixi/renderers/webgl/utils/WebGLShaderManager.js b/src/pixi/renderers/webgl/utils/WebGLShaderManager.js index b597698..a15974e 100644 --- a/src/pixi/renderers/webgl/utils/WebGLShaderManager.js +++ b/src/pixi/renderers/webgl/utils/WebGLShaderManager.js @@ -5,38 +5,54 @@ /** * @class WebGLShaderManager * @constructor -* @param gl {WebGLContext} the current WebGL drawing context * @private */ PIXI.WebGLShaderManager = function() { - + /** + * @property maxAttibs + * @type Number + */ this.maxAttibs = 10; + + /** + * @property attribState + * @type Array + */ this.attribState = []; + + /** + * @property tempAttribState + * @type Array + */ this.tempAttribState = []; - for (var i = 0; i < this.maxAttibs; i++) { + for (var i = 0; i < this.maxAttibs; i++) + { this.attribState[i] = false; } + /** + * @property stack + * @type Array + */ this.stack = []; - - //this.setContext(gl); - // the final one is used for the rendering strips + }; +PIXI.WebGLShaderManager.prototype.constructor = PIXI.WebGLShaderManager; /** -* Initialises the context and the properties +* Initialises the context and the properties. +* * @method setContext * @param gl {WebGLContext} the current WebGL drawing context -* @param transparent {Boolean} Whether or not the drawing context should be transparent */ PIXI.WebGLShaderManager.prototype.setContext = function(gl) { this.gl = gl; - // the next one is used for rendering primatives + // the next one is used for rendering primitives this.primitiveShader = new PIXI.PrimitiveShader(gl); // the next one is used for rendering triangle strips @@ -53,16 +69,15 @@ this.setShader(this.defaultShader); }; - /** -* Takes the attributes given in parameters +* Takes the attributes given in parameters. +* * @method setAttribs * @param attribs {Array} attribs */ PIXI.WebGLShaderManager.prototype.setAttribs = function(attribs) { // reset temp state - var i; for (i = 0; i < this.tempAttribState.length; i++) @@ -97,6 +112,12 @@ } }; +/** +* Sets the current shader. +* +* @method setShader +* @param shader {Any} +*/ PIXI.WebGLShaderManager.prototype.setShader = function(shader) { if(this._currentId === shader._UID)return false; @@ -112,7 +133,8 @@ }; /** -* Destroys +* Destroys this object. +* * @method destroy */ PIXI.WebGLShaderManager.prototype.destroy = function() @@ -133,4 +155,3 @@ this.gl = null; }; - diff --git a/src/pixi/InteractionData.js b/src/pixi/InteractionData.js index ea77370..fa84a6d 100644 --- a/src/pixi/InteractionData.js +++ b/src/pixi/InteractionData.js @@ -18,7 +18,6 @@ */ this.global = new PIXI.Point(); - /** * The target Sprite that was interacted with * diff --git a/src/pixi/InteractionManager.js b/src/pixi/InteractionManager.js index 685c386..71f320b 100644 --- a/src/pixi/InteractionManager.js +++ b/src/pixi/InteractionManager.js @@ -14,7 +14,7 @@ PIXI.InteractionManager = function(stage) { /** - * a reference to the stage + * A reference to the stage * * @property stage * @type Stage @@ -22,7 +22,7 @@ this.stage = stage; /** - * the mouse data + * The mouse data * * @property mouse * @type InteractionData @@ -30,18 +30,21 @@ this.mouse = new PIXI.InteractionData(); /** - * an object that stores current touches (InteractionData) by id reference + * An object that stores current touches (InteractionData) by id reference * * @property touches * @type Object */ this.touches = {}; - // helpers + /** + * @property tempPoint + * @type Point + * @private + */ this.tempPoint = new PIXI.Point(); /** - * * @property mouseoverEnabled * @type Boolean * @default @@ -49,7 +52,7 @@ this.mouseoverEnabled = true; /** - * tiny little interactiveData pool ! + * Tiny little interactiveData pool ! * * @property pool * @type Array @@ -61,7 +64,6 @@ * @property interactiveItems * @type Array * @private - * */ this.interactiveItems = []; @@ -73,23 +75,60 @@ */ this.interactionDOMElement = null; - //this will make it so that you dont have to call bind all the time + //this will make it so that you don't have to call bind all the time + + /** + * @property onMouseMove + * @type Function + */ this.onMouseMove = this.onMouseMove.bind( this ); + + /** + * @property onMouseDown + * @type Function + */ this.onMouseDown = this.onMouseDown.bind(this); + + /** + * @property onMouseOut + * @type Function + */ this.onMouseOut = this.onMouseOut.bind(this); + + /** + * @property onMouseUp + * @type Function + */ this.onMouseUp = this.onMouseUp.bind(this); + /** + * @property onTouchStart + * @type Function + */ this.onTouchStart = this.onTouchStart.bind(this); + + /** + * @property onTouchEnd + * @type Function + */ this.onTouchEnd = this.onTouchEnd.bind(this); + + /** + * @property onTouchMove + * @type Function + */ this.onTouchMove = this.onTouchMove.bind(this); + /** + * @property last + * @type Number + */ this.last = 0; /** * The css style of the cursor that is being used * @property currentCursorStyle * @type String - * */ this.currentCursorStyle = 'inherit'; @@ -97,10 +136,13 @@ * Is set to true when the mouse is moved out of the canvas * @property mouseOut * @type Boolean - * */ this.mouseOut = false; + /** + * @property resolution + * @type Number + */ this.resolution = 1; }; @@ -166,7 +208,6 @@ this.setTargetDomElement (target.view); }; - /** * Sets the DOM element which will receive mouse/touch events. This is useful for when you have other DOM * elements on top of the renderers Canvas element. With this you'll be able to delegate another DOM element @@ -201,7 +242,10 @@ window.addEventListener('mouseup', this.onMouseUp, true); }; - +/** + * @method removeEvents + * @private + */ PIXI.InteractionManager.prototype.removeEvents = function() { if (!this.interactionDOMElement) return; @@ -308,6 +352,10 @@ } }; +/** + * @method rebuildInteractiveGraph + * @private + */ PIXI.InteractionManager.prototype.rebuildInteractiveGraph = function() { this.dirty = false; @@ -427,10 +475,10 @@ }; /** - * Is called when the mouse button is moved out of the renderer element + * Is called when the mouse is moved out of the renderer element * * @method onMouseOut - * @param event {Event} The DOM event of a mouse button being moved out + * @param event {Event} The DOM event of a mouse being moved out * @private */ PIXI.InteractionManager.prototype.onMouseOut = function(event) diff --git a/src/pixi/renderers/webgl/WebGLRenderer.js b/src/pixi/renderers/webgl/WebGLRenderer.js index 968fd3d..422896f 100644 --- a/src/pixi/renderers/webgl/WebGLRenderer.js +++ b/src/pixi/renderers/webgl/WebGLRenderer.js @@ -5,23 +5,21 @@ PIXI.glContexts = []; // this is where we store the webGL contexts for easy access. /** - * the WebGLRenderer draws the stage and all its content onto a webGL enabled canvas. This renderer - * should be used for browsers that support webGL. This Render works by automatically managing webGLBatch's. - * So no need for Sprite Batch's or Sprite Cloud's - * Dont forget to add the view to your DOM or you will not see anything :) + * The WebGLRenderer draws the stage and all its content onto a webGL enabled canvas. This renderer + * should be used for browsers that support webGL. This Render works by automatically managing webGLBatchs. + * So no need for Sprite Batches or Sprite Clouds. + * Don't forget to add the view to your DOM or you will not see anything :) * * @class WebGLRenderer * @constructor * @param [width=0] {Number} the width of the canvas view * @param [height=0] {Number} the height of the canvas view - * * @param [options] {Object} The optional renderer parameters * @param [options.view] {HTMLCanvasElement} the canvas to use as a view, optional * @param [options.transparent=false] {Boolean} If the render view is transparent, default false * @param [options.antialias=false] {Boolean} sets antialias (only applicable in chrome at the moment) * @param [options.preserveDrawingBuffer=false] {Boolean} enables drawing buffer preservation, enable this if you need to call toDataUrl on the webgl context * @param [options.resolution=1] {Number} the resolution of the renderer retina would be 2 - * */ PIXI.WebGLRenderer = function(width, height, options) { @@ -37,13 +35,16 @@ options = PIXI.defaultRenderOptions; } - if(!PIXI.defaultRenderer) { PIXI.sayHello('webGL'); PIXI.defaultRenderer = this; } + /** + * @property type + * @type Number + */ this.type = PIXI.WEBGL_RENDERER; /** @@ -56,6 +57,7 @@ this.resolution = options.resolution; // do a catch.. only 1 webGL renderer.. + /** * Whether the render view is transparent * @@ -99,12 +101,27 @@ this.view = options.view || document.createElement( 'canvas' ); // deal with losing context.. + + /** + * @property contextLostBound + * @type Function + */ this.contextLostBound = this.handleContextLost.bind(this); + + /** + * @property contextRestoredBound + * @type Function + */ this.contextRestoredBound = this.handleContextRestored.bind(this); this.view.addEventListener('webglcontextlost', this.contextLostBound, false); this.view.addEventListener('webglcontextrestored', this.contextRestoredBound, false); + /** + * @property _contextOptions + * @type Object + * @private + */ this._contextOptions = { alpha: this.transparent, antialias: options.antialias, // SPEED UP?? @@ -113,18 +130,67 @@ preserveDrawingBuffer: options.preserveDrawingBuffer }; + /** + * @property projection + * @type Point + */ this.projection = new PIXI.Point(); + + /** + * @property offset + * @type Point + */ this.offset = new PIXI.Point(0, 0); - // time to create the render managers! each one focuses on managine a state in webGL - 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(); // manages the stencil buffer - this.blendModeManager = new PIXI.WebGLBlendModeManager(); // manages the blendModes + // time to create the render managers! each one focuses on managing a state in webGL - // TODO remove + /** + * Deals with managing the shader programs and their attribs + * @property shaderManager + * @type WebGLShaderManager + */ + this.shaderManager = new PIXI.WebGLShaderManager(); + + /** + * Manages the rendering of sprites + * @property spriteBatch + * @type WebGLSpriteBatch + */ + this.spriteBatch = new PIXI.WebGLSpriteBatch(); + + /** + * Manages the masks using the stencil buffer + * @property maskManager + * @type WebGLMaskManager + */ + this.maskManager = new PIXI.WebGLMaskManager(); + + /** + * Manages the filters + * @property filterManager + * @type WebGLFilterManager + */ + this.filterManager = new PIXI.WebGLFilterManager(); + + /** + * Manages the stencil buffer + * @property stencilManager + * @type WebGLStencilManager + */ + this.stencilManager = new PIXI.WebGLStencilManager(); + + /** + * Manages the blendModes + * @property blendModeManager + * @type WebGLBlendModeManager + */ + this.blendModeManager = new PIXI.WebGLBlendModeManager(); + + /** + * TODO remove + * @property renderSession + * @type Object + */ this.renderSession = {}; this.renderSession.gl = this.gl; this.renderSession.drawCount = 0; @@ -147,6 +213,9 @@ // constructor PIXI.WebGLRenderer.prototype.constructor = PIXI.WebGLRenderer; +/** +* @method initContext +*/ PIXI.WebGLRenderer.prototype.initContext = function() { var gl = this.view.getContext('webgl', this._contextOptions) || this.view.getContext('experimental-webgl', this._contextOptions); @@ -180,7 +249,6 @@ this.resize(this.width, this.height); }; - /** * Renders the stage to its webGL view * @@ -205,9 +273,7 @@ // update the scene graph stage.updateTransform(); - var gl = this.gl; - // interaction if(stage._interactive) @@ -249,9 +315,9 @@ }; /** - * Renders a display Object + * Renders a Display Object. * - * @method renderDIsplayObject + * @method renderDisplayObject * @param displayObject {DisplayObject} The DisplayObject to render * @param projection {Point} The projection * @param buffer {Array} a standard WebGL buffer @@ -283,7 +349,7 @@ }; /** - * resizes the webGL view to the specified width and height + * Resizes the webGL view to the specified width and height. * * @method resize * @param width {Number} the new width of the webGL view @@ -297,10 +363,6 @@ this.view.width = this.width; this.view.height = this.height; - // this.view.style.width = width + 'px'; - // this.view.style.height = height + 'px'; - - // console.log(this.width / this.resolution) this.gl.viewport(0, 0, this.width, this.height); this.projection.x = this.width / 2 / this.resolution; @@ -308,10 +370,10 @@ }; /** - * Updates and Creates a WebGL texture for the renderers context + * Updates and Creates a WebGL texture for the renderers context. * * @method updateTexture - * @param texture {Texture} the texture to render + * @param texture {Texture} the texture to update */ PIXI.WebGLRenderer.prototype.updateTexture = function(texture) { @@ -411,6 +473,11 @@ this.renderSession = null; }; +/** + * Maps Pixi blend modes to WebGL blend modes. + * + * @method mapBlendModes + */ PIXI.WebGLRenderer.prototype.mapBlendModes = function() { var gl = this.gl; diff --git a/src/pixi/renderers/webgl/shaders/ComplexPrimitiveShader.js b/src/pixi/renderers/webgl/shaders/ComplexPrimitiveShader.js index daa8b64..79d038a 100644 --- a/src/pixi/renderers/webgl/shaders/ComplexPrimitiveShader.js +++ b/src/pixi/renderers/webgl/shaders/ComplexPrimitiveShader.js @@ -9,7 +9,13 @@ */ PIXI.ComplexPrimitiveShader = function(gl) { + /** + * @property _UID + * @type Number + * @private + */ this._UID = PIXI._UID++; + /** * @property gl * @type WebGLContext @@ -17,18 +23,20 @@ this.gl = gl; /** - * @property {any} program - The WebGL program. - */ + * The WebGL program. + * @property program + * @type {Any} + */ this.program = null; /** + * The fragment shader. * @property fragmentSrc * @type Array */ this.fragmentSrc = [ - 'precision mediump float;', - + 'precision mediump float;', 'varying vec4 vColor;', @@ -38,6 +46,7 @@ ]; /** + * The vertex shader. * @property vertexSrc * @type Array */ @@ -65,14 +74,15 @@ this.init(); }; +PIXI.ComplexPrimitiveShader.prototype.constructor = PIXI.ComplexPrimitiveShader; + /** -* Initialises the shader +* Initialises the shader. +* * @method init -* */ PIXI.ComplexPrimitiveShader.prototype.init = function() { - var gl = this.gl; var program = PIXI.compileProgram(gl, this.vertexSrc, this.fragmentSrc); @@ -84,7 +94,6 @@ this.tintColor = gl.getUniformLocation(program, 'tint'); this.color = gl.getUniformLocation(program, 'color'); - // get and store the attributes this.aVertexPosition = gl.getAttribLocation(program, 'aVertexPosition'); // this.colorAttribute = gl.getAttribLocation(program, 'aColor'); @@ -98,9 +107,9 @@ }; /** -* Destroys the shader +* Destroys the shader. +* * @method destroy -* */ PIXI.ComplexPrimitiveShader.prototype.destroy = function() { diff --git a/src/pixi/renderers/webgl/shaders/PixiFastShader.js b/src/pixi/renderers/webgl/shaders/PixiFastShader.js index 4fb3fe2..bb46419 100644 --- a/src/pixi/renderers/webgl/shaders/PixiFastShader.js +++ b/src/pixi/renderers/webgl/shaders/PixiFastShader.js @@ -1,6 +1,5 @@ /** * @author Mat Groves http://matgroves.com/ @Doormat23 - * @author Richard Davey http://www.photonstorm.com @photonstorm */ /** @@ -10,6 +9,11 @@ */ PIXI.PixiFastShader = function(gl) { + /** + * @property _UID + * @type Number + * @private + */ this._UID = PIXI._UID++; /** @@ -19,12 +23,16 @@ this.gl = gl; /** - * @property {any} program - The WebGL program. + * The WebGL program. + * @property program + * @type {Any} */ this.program = null; /** - * @property {array} fragmentSrc - The fragment shader. + * The fragment shader. + * @property fragmentSrc + * @type Array */ this.fragmentSrc = [ 'precision lowp float;', @@ -37,8 +45,10 @@ ]; /** - * @property {array} vertexSrc - The vertex shader - */ + * The vertex shader. + * @property vertexSrc + * @type Array + */ this.vertexSrc = [ 'attribute vec2 aVertexPosition;', 'attribute vec2 aPositionCoord;', @@ -69,24 +79,25 @@ '}' ]; - /** - * @property {number} textureCount - A local texture counter for multi-texture shaders. - */ + * A local texture counter for multi-texture shaders. + * @property textureCount + * @type Number + */ this.textureCount = 0; - this.init(); }; +PIXI.PixiFastShader.prototype.constructor = PIXI.PixiFastShader; + /** -* Initialises the shader +* Initialises the shader. +* * @method init -* */ PIXI.PixiFastShader.prototype.init = function() { - var gl = this.gl; var program = PIXI.compileProgram(gl, this.vertexSrc, this.fragmentSrc); @@ -111,8 +122,6 @@ this.aTextureCoord = gl.getAttribLocation(program, 'aTextureCoord'); this.colorAttribute = gl.getAttribLocation(program, 'aColor'); - - // Begin worst hack eva // // WHY??? ONLY on my chrome pixel the line above returns -1 when using filters? @@ -128,14 +137,13 @@ // End worst hack eva // - this.program = program; }; /** -* Destroys the shader +* Destroys the shader. +* * @method destroy -* */ PIXI.PixiFastShader.prototype.destroy = function() { diff --git a/src/pixi/renderers/webgl/shaders/PixiShader.js b/src/pixi/renderers/webgl/shaders/PixiShader.js index d76ec03..725dce2 100644 --- a/src/pixi/renderers/webgl/shaders/PixiShader.js +++ b/src/pixi/renderers/webgl/shaders/PixiShader.js @@ -6,9 +6,15 @@ /** * @class PixiShader * @constructor +* @param gl {WebGLContext} the current WebGL drawing context */ PIXI.PixiShader = function(gl) { + /** + * @property _UID + * @type Number + * @private + */ this._UID = PIXI._UID++; /** @@ -18,13 +24,17 @@ this.gl = gl; /** - * @property {any} program - The WebGL program. - */ + * The WebGL program. + * @property program + * @type {Any} + */ this.program = null; /** - * @property {array} fragmentSrc - The fragment shader. - */ + * The fragment shader. + * @property fragmentSrc + * @type Array + */ this.fragmentSrc = [ 'precision lowp float;', 'varying vec2 vTextureCoord;', @@ -36,21 +46,44 @@ ]; /** - * @property {number} textureCount - A local texture counter for multi-texture shaders. - */ + * A local texture counter for multi-texture shaders. + * @property textureCount + * @type Number + */ this.textureCount = 0; + + /** + * A local flag + * @property firstRun + * @type Boolean + * @private + */ this.firstRun = true; + + /** + * A dirty flag + * @property dirty + * @type Boolean + */ this.dirty = true; + /** + * Uniform attributes cache. + * @property attributes + * @type Array + * @private + */ this.attributes = []; this.init(); }; +PIXI.PixiShader.prototype.constructor = PIXI.PixiShader; + /** -* Initialises the shader +* Initialises the shader. +* * @method init -* */ PIXI.PixiShader.prototype.init = function() { @@ -71,12 +104,11 @@ this.aTextureCoord = gl.getAttribLocation(program, 'aTextureCoord'); this.colorAttribute = gl.getAttribLocation(program, 'aColor'); - // Begin worst hack eva // // WHY??? ONLY on my chrome pixel the line above returns -1 when using filters? // maybe its something to do with the current state of the gl context. - // Im convinced this is a bug in the chrome browser as there is NO reason why this should be returning -1 especially as it only manifests on my chrome pixel + // I'm convinced this is a bug in the chrome browser as there is NO reason why this should be returning -1 especially as it only manifests on my chrome pixel // If theres any webGL people that know why could happen please help :) if(this.colorAttribute === -1) { @@ -101,6 +133,7 @@ /** * Initialises the shader uniform values. +* * Uniforms are specified in the GLSL_ES Specification: http://www.khronos.org/registry/webgl/specs/latest/1.0/ * http://www.khronos.org/registry/gles/specs/2.0/GLSL_ES_Specification_1.0.17.pdf * @@ -316,7 +349,8 @@ }; /** -* Destroys the shader +* Destroys the shader. +* * @method destroy */ PIXI.PixiShader.prototype.destroy = function() @@ -329,7 +363,8 @@ }; /** -* The Default Vertex shader source +* The Default Vertex shader source. +* * @property defaultVertexSrc * @type String */ diff --git a/src/pixi/renderers/webgl/shaders/PrimitiveShader.js b/src/pixi/renderers/webgl/shaders/PrimitiveShader.js index 3a82be2..0f6854c 100644 --- a/src/pixi/renderers/webgl/shaders/PrimitiveShader.js +++ b/src/pixi/renderers/webgl/shaders/PrimitiveShader.js @@ -9,6 +9,11 @@ */ PIXI.PrimitiveShader = function(gl) { + /** + * @property _UID + * @type Number + * @private + */ this._UID = PIXI._UID++; /** @@ -18,11 +23,14 @@ this.gl = gl; /** - * @property {any} program - The WebGL program. - */ + * The WebGL program. + * @property program + * @type {Any} + */ this.program = null; /** + * The fragment shader. * @property fragmentSrc * @type Array */ @@ -36,6 +44,7 @@ ]; /** + * The vertex shader. * @property vertexSrc * @type Array */ @@ -60,14 +69,15 @@ this.init(); }; +PIXI.PrimitiveShader.prototype.constructor = PIXI.PrimitiveShader; + /** -* Initialises the shader +* Initialises the shader. +* * @method init -* */ PIXI.PrimitiveShader.prototype.init = function() { - var gl = this.gl; var program = PIXI.compileProgram(gl, this.vertexSrc, this.fragmentSrc); @@ -78,7 +88,6 @@ this.offsetVector = gl.getUniformLocation(program, 'offsetVector'); this.tintColor = gl.getUniformLocation(program, 'tint'); - // get and store the attributes this.aVertexPosition = gl.getAttribLocation(program, 'aVertexPosition'); this.colorAttribute = gl.getAttribLocation(program, 'aColor'); @@ -92,9 +101,9 @@ }; /** -* Destroys the shader +* Destroys the shader. +* * @method destroy -* */ PIXI.PrimitiveShader.prototype.destroy = function() { diff --git a/src/pixi/renderers/webgl/shaders/StripShader.js b/src/pixi/renderers/webgl/shaders/StripShader.js index 11f13ad..8fefe51 100644 --- a/src/pixi/renderers/webgl/shaders/StripShader.js +++ b/src/pixi/renderers/webgl/shaders/StripShader.js @@ -2,20 +2,37 @@ * @author Mat Groves http://matgroves.com/ @Doormat23 */ - +/** +* @class StripShader +* @constructor +* @param gl {WebGLContext} the current WebGL drawing context +*/ PIXI.StripShader = function(gl) { + /** + * @property _UID + * @type Number + * @private + */ this._UID = PIXI._UID++; + /** + * @property gl + * @type WebGLContext + */ this.gl = gl; /** - * @property {any} program - The WebGL program. - */ + * The WebGL program. + * @property program + * @type {Any} + */ this.program = null; /** - * @property {array} fragmentSrc - The fragment shader. + * The fragment shader. + * @property fragmentSrc + * @type Array */ this.fragmentSrc = [ 'precision mediump float;', @@ -30,9 +47,11 @@ '}' ]; - /** - * @property {array} fragmentSrc - The fragment shader. - */ + /** + * The vertex shader. + * @property vertexSrc + * @type Array + */ this.vertexSrc = [ 'attribute vec2 aVertexPosition;', 'attribute vec2 aTextureCoord;', @@ -56,10 +75,12 @@ this.init(); }; +PIXI.StripShader.prototype.constructor = PIXI.StripShader; + /** -* Initialises the shader +* Initialises the shader. +* * @method init -* */ PIXI.StripShader.prototype.init = function() { @@ -88,9 +109,9 @@ }; /** -* Destroys the shader +* Destroys the shader. +* * @method destroy -* */ PIXI.StripShader.prototype.destroy = function() { diff --git a/src/pixi/renderers/webgl/utils/FilterTexture.js b/src/pixi/renderers/webgl/utils/FilterTexture.js index 9dada23..389acbe 100644 --- a/src/pixi/renderers/webgl/utils/FilterTexture.js +++ b/src/pixi/renderers/webgl/utils/FilterTexture.js @@ -9,7 +9,6 @@ * @param width {Number} the horizontal range of the filter * @param height {Number} the vertical range of the filter * @param scaleMode {Number} Should be one of the PIXI.scaleMode consts -* @private */ PIXI.FilterTexture = function(gl, width, height, scaleMode) { @@ -19,11 +18,24 @@ */ this.gl = gl; - // next time to create a frame buffer and texture + + /** + * @property frameBuffer + * @type Any + */ this.frameBuffer = gl.createFramebuffer(); + + /** + * @property texture + * @type Any + */ this.texture = gl.createTexture(); + /** + * @property scaleMode + * @type Number + */ scaleMode = scaleMode || PIXI.scaleModes.DEFAULT; gl.bindTexture(gl.TEXTURE_2D, this.texture); @@ -44,9 +56,11 @@ this.resize(width, height); }; +PIXI.FilterTexture.prototype.constructor = PIXI.FilterTexture; /** -* Clears the filter texture +* Clears the filter texture. +* * @method clear */ PIXI.FilterTexture.prototype.clear = function() @@ -75,14 +89,14 @@ gl.bindTexture(gl.TEXTURE_2D, this.texture); gl.texImage2D(gl.TEXTURE_2D, 0, gl.RGBA, width , height , 0, gl.RGBA, gl.UNSIGNED_BYTE, null); - // console.log( width, width ) // update the stencil buffer width and height gl.bindRenderbuffer(gl.RENDERBUFFER, this.renderBuffer); gl.renderbufferStorage(gl.RENDERBUFFER, gl.DEPTH_STENCIL, width , height ); }; /** -* Destroys the filter texture +* Destroys the filter texture. +* * @method destroy */ PIXI.FilterTexture.prototype.destroy = function() diff --git a/src/pixi/renderers/webgl/utils/WebGLBlendModeManager.js b/src/pixi/renderers/webgl/utils/WebGLBlendModeManager.js index c73728f..3de0ec9 100644 --- a/src/pixi/renderers/webgl/utils/WebGLBlendModeManager.js +++ b/src/pixi/renderers/webgl/utils/WebGLBlendModeManager.js @@ -3,31 +3,42 @@ */ /** -* @class WebGLMaskManager +* @class WebGLBlendModeManager * @constructor * @param gl {WebGLContext} the current WebGL drawing context -* @private */ PIXI.WebGLBlendModeManager = function() { + /** + * @property currentBlendMode + * @type Number + */ this.currentBlendMode = 99999; }; +PIXI.WebGLBlendModeManager.prototype.constructor = PIXI.WebGLBlendModeManager; + +/** + * Sets the WebGL Context. + * + * @method setContext + * @param gl {WebGLContext} the current WebGL drawing context + */ PIXI.WebGLBlendModeManager.prototype.setContext = function(gl) { this.gl = gl; }; /** -* Sets-up the given blendMode from WebGL's point of view +* Sets-up the given blendMode from WebGL's point of view. +* * @method setBlendMode -* * @param blendMode {Number} the blendMode, should be a Pixi const, such as PIXI.BlendModes.ADD */ PIXI.WebGLBlendModeManager.prototype.setBlendMode = function(blendMode) { if(this.currentBlendMode === blendMode)return false; - // console.log("SWAP!") + this.currentBlendMode = blendMode; var blendModeWebGL = PIXI.blendModesWebGL[this.currentBlendMode]; @@ -36,7 +47,12 @@ return true; }; +/** +* Destroys this object. +* +* @method destroy +*/ PIXI.WebGLBlendModeManager.prototype.destroy = function() { this.gl = null; -}; \ No newline at end of file +}; diff --git a/src/pixi/renderers/webgl/utils/WebGLFastSpriteBatch.js b/src/pixi/renderers/webgl/utils/WebGLFastSpriteBatch.js index 0d08e47..0bdbbe4 100644 --- a/src/pixi/renderers/webgl/utils/WebGLFastSpriteBatch.js +++ b/src/pixi/renderers/webgl/utils/WebGLFastSpriteBatch.js @@ -8,27 +8,66 @@ * https://github.com/libgdx/libgdx/blob/master/gdx/src/com/badlogic/gdx/graphics/g2d/WebGLSpriteBatch.java */ +/** +* @class WebGLFastSpriteBatch +* @constructor +*/ PIXI.WebGLFastSpriteBatch = function() { - - + /** + * @property vertSize + * @type Number + */ this.vertSize = 10; + + /** + * @property maxSize + * @type Number + */ this.maxSize = 6000;//Math.pow(2, 16) / this.vertSize; + + /** + * @property size + * @type Number + */ this.size = this.maxSize; //the total number of floats in our batch var numVerts = this.size * 4 * this.vertSize; + //the total number of indices in our batch var numIndices = this.maxSize * 6; - //vertex data + /** + * Vertex data + * @property vertices + * @type Float32Array + */ this.vertices = new Float32Array(numVerts); - //index data + + /** + * Index data + * @property indices + * @type Uint16Array + */ this.indices = new Uint16Array(numIndices); + /** + * @property vertexBuffer + * @type Object + */ this.vertexBuffer = null; + + /** + * @property indexBuffer + * @type Object + */ this.indexBuffer = null; + /** + * @property lastIndexCount + * @type Number + */ this.lastIndexCount = 0; for (var i=0, j=0; i < numIndices; i += 6, j += 4) @@ -41,21 +80,58 @@ this.indices[i + 5] = j + 3; } + /** + * @property drawing + * @type Boolean + */ this.drawing = false; + + /** + * @property currentBatchSize + * @type Number + */ this.currentBatchSize = 0; + + /** + * @property currentBaseTexture + * @type BaseTexture + */ this.currentBaseTexture = null; + /** + * @property currentBlendMode + * @type Number + */ this.currentBlendMode = 0; + + /** + * @property renderSession + * @type Object + */ this.renderSession = null; - + /** + * @property shader + * @type Object + */ this.shader = null; + /** + * @property matrix + * @type Matrix + */ this.matrix = null; - //this.setContext(gl); }; +PIXI.WebGLFastSpriteBatch.prototype.constructor = PIXI.WebGLFastSpriteBatch; + +/** + * Sets the WebGL Context. + * + * @method setContext + * @param gl {WebGLContext} the current WebGL drawing context + */ PIXI.WebGLFastSpriteBatch.prototype.setContext = function(gl) { this.gl = gl; @@ -66,7 +142,6 @@ // 65535 is max index, so 65535 / 6 = 10922. - //upload the index data gl.bindBuffer(gl.ELEMENT_ARRAY_BUFFER, this.indexBuffer); gl.bufferData(gl.ELEMENT_ARRAY_BUFFER, this.indices, gl.STATIC_DRAW); @@ -75,6 +150,11 @@ gl.bufferData(gl.ARRAY_BUFFER, this.vertices, gl.DYNAMIC_DRAW); }; +/** + * @method begin + * @param spriteBatch {WebGLSpriteBatch} + * @param renderSession {Object} + */ PIXI.WebGLFastSpriteBatch.prototype.begin = function(spriteBatch, renderSession) { this.renderSession = renderSession; @@ -85,15 +165,20 @@ this.start(); }; +/** + * @method end + */ PIXI.WebGLFastSpriteBatch.prototype.end = function() { this.flush(); }; - +/** + * @method render + * @param spriteBatch {WebGLSpriteBatch} + */ PIXI.WebGLFastSpriteBatch.prototype.render = function(spriteBatch) { - var children = spriteBatch.children; var sprite = children[0]; @@ -119,6 +204,10 @@ this.flush(); }; +/** + * @method renderSprite + * @param sprite {Sprite} + */ PIXI.WebGLFastSpriteBatch.prototype.renderSprite = function(sprite) { //sprite = children[i]; @@ -137,7 +226,6 @@ uvs = sprite.texture._uvs; - width = sprite.texture.frame.width; height = sprite.texture.frame.height; @@ -257,9 +345,11 @@ } }; +/** + * @method flush + */ PIXI.WebGLFastSpriteBatch.prototype.flush = function() { - // If the batch is length 0 then return as there is nothing to draw if (this.currentBatchSize===0)return; @@ -272,7 +362,6 @@ gl.bindTexture(gl.TEXTURE_2D, this.currentBaseTexture._glTextures[gl.id]); // upload the verts to the buffer - if(this.currentBatchSize > ( this.size * 0.5 ) ) { @@ -285,7 +374,6 @@ gl.bufferSubData(gl.ARRAY_BUFFER, 0, view); } - // now draw those suckas! gl.drawElements(gl.TRIANGLES, this.currentBatchSize * 6, gl.UNSIGNED_SHORT, 0); @@ -297,11 +385,17 @@ }; +/** + * @method stop + */ PIXI.WebGLFastSpriteBatch.prototype.stop = function() { this.flush(); }; +/** + * @method start + */ PIXI.WebGLFastSpriteBatch.prototype.start = function() { var gl = this.gl; @@ -329,8 +423,5 @@ gl.vertexAttribPointer(this.shader.aRotation, 1, gl.FLOAT, false, stride, 6 * 4); gl.vertexAttribPointer(this.shader.aTextureCoord, 2, gl.FLOAT, false, stride, 7 * 4); gl.vertexAttribPointer(this.shader.colorAttribute, 1, gl.FLOAT, false, stride, 9 * 4); - }; - - diff --git a/src/pixi/renderers/webgl/utils/WebGLFilterManager.js b/src/pixi/renderers/webgl/utils/WebGLFilterManager.js index 9bb9195..359a834 100644 --- a/src/pixi/renderers/webgl/utils/WebGLFilterManager.js +++ b/src/pixi/renderers/webgl/utils/WebGLFilterManager.js @@ -5,22 +5,33 @@ /** * @class WebGLFilterManager * @constructor -* @param gl {WebGLContext} the current WebGL drawing context -* @private */ PIXI.WebGLFilterManager = function() { + /** + * @property filterStack + * @type Array + */ this.filterStack = []; + /** + * @property offsetX + * @type Number + */ this.offsetX = 0; - this.offsetY = 0; - // this.setContext(gl); + /** + * @property offsetY + * @type Number + */ + this.offsetY = 0; }; -// API +PIXI.WebGLFilterManager.prototype.constructor = PIXI.WebGLFilterManager; + /** -* Initialises the context and the properties +* Initialises the context and the properties. +* * @method setContext * @param gl {WebGLContext} the current WebGL drawing context */ @@ -33,7 +44,6 @@ }; /** -* * @method begin * @param renderSession {RenderSession} * @param buffer {ArrayBuffer} @@ -44,14 +54,14 @@ this.defaultShader = renderSession.shaderManager.defaultShader; var projection = this.renderSession.projection; - // console.log(this.width) this.width = projection.x * 2; this.height = -projection.y * 2; this.buffer = buffer; }; /** -* Applies the filter and adds it to the current filter stack +* Applies the filter and adds it to the current filter stack. +* * @method pushFilter * @param filterBlock {Object} the filter that will be pushed to the current filter stack */ @@ -64,7 +74,6 @@ filterBlock._filterArea = filterBlock.target.filterArea || filterBlock.target.getBounds(); - // filter program // OPTIMISATION - the first filter is free if its a simple color change? this.filterStack.push(filterBlock); @@ -126,9 +135,9 @@ }; - /** -* Removes the last filter from the filter stack and doesn't return it +* Removes the last filter from the filter stack and doesn't return it. +* * @method popFilter */ PIXI.WebGLFilterManager.prototype.popFilter = function() @@ -211,7 +220,6 @@ this.offsetX -= filterArea.x; this.offsetY -= filterArea.y; - var sizeX = this.width; var sizeY = this.height; @@ -239,9 +247,7 @@ buffer = currentFilter._glFilterTexture.frameBuffer; } - - - // TODO need toremove thease global elements.. + // TODO need to remove these global elements.. projection.x = sizeX/2; projection.y = -sizeY/2; @@ -280,10 +286,6 @@ gl.bufferSubData(gl.ARRAY_BUFFER, 0, this.uvArray); - //console.log(this.vertexArray) - //console.log(this.uvArray) - //console.log(sizeX + " : " + sizeY) - gl.viewport(0, 0, sizeX, sizeY); // bind the buffer @@ -300,9 +302,9 @@ this.applyFilterPass(filter, filterArea, sizeX, sizeY); // now restore the regular shader.. should happen automatically now.. - // this.renderSession.shaderManager.setShader(this.defaultShader); - // gl.uniform2f(this.defaultShader.projectionVector, sizeX/2, -sizeY/2); - // gl.uniform2f(this.defaultShader.offsetVector, -offsetX, -offsetY); + // this.renderSession.shaderManager.setShader(this.defaultShader); + // gl.uniform2f(this.defaultShader.projectionVector, sizeX/2, -sizeY/2); + // gl.uniform2f(this.defaultShader.offsetVector, -offsetX, -offsetY); // return the texture to the pool this.texturePool.push(texture); @@ -311,7 +313,8 @@ /** -* Applies the filter to the specified area +* Applies the filter to the specified area. +* * @method applyFilterPass * @param filter {AbstractFilter} the filter that needs to be applied * @param filterArea {texture} TODO - might need an update @@ -351,7 +354,6 @@ filter.uniforms.dimensions.value[3] = this.vertexArray[5];//filterArea.height; } - // console.log(this.uvArray ) shader.syncUniforms(); gl.bindBuffer(gl.ARRAY_BUFFER, this.vertexBuffer); @@ -372,7 +374,8 @@ }; /** -* Initialises the shader buffers +* Initialises the shader buffers. +* * @method initShaderBuffers */ PIXI.WebGLFilterManager.prototype.initShaderBuffers = function() @@ -385,7 +388,6 @@ this.colorBuffer = gl.createBuffer(); this.indexBuffer = gl.createBuffer(); - // bind and upload the vertexs.. // keep a reference to the vertexFloatData.. this.vertexArray = new Float32Array([0.0, 0.0, @@ -394,11 +396,7 @@ 1.0, 1.0]); gl.bindBuffer(gl.ARRAY_BUFFER, this.vertexBuffer); - gl.bufferData( - gl.ARRAY_BUFFER, - this.vertexArray, - gl.STATIC_DRAW); - + gl.bufferData(gl.ARRAY_BUFFER, this.vertexArray, gl.STATIC_DRAW); // bind and upload the uv buffer this.uvArray = new Float32Array([0.0, 0.0, @@ -407,10 +405,7 @@ 1.0, 1.0]); gl.bindBuffer(gl.ARRAY_BUFFER, this.uvBuffer); - gl.bufferData( - gl.ARRAY_BUFFER, - this.uvArray, - gl.STATIC_DRAW); + gl.bufferData(gl.ARRAY_BUFFER, this.uvArray, gl.STATIC_DRAW); this.colorArray = new Float32Array([1.0, 0xFFFFFF, 1.0, 0xFFFFFF, @@ -418,21 +413,17 @@ 1.0, 0xFFFFFF]); gl.bindBuffer(gl.ARRAY_BUFFER, this.colorBuffer); - gl.bufferData( - gl.ARRAY_BUFFER, - this.colorArray, - gl.STATIC_DRAW); + gl.bufferData(gl.ARRAY_BUFFER, this.colorArray, gl.STATIC_DRAW); // bind and upload the index gl.bindBuffer(gl.ELEMENT_ARRAY_BUFFER, this.indexBuffer); - gl.bufferData( - gl.ELEMENT_ARRAY_BUFFER, - new Uint16Array([0, 1, 2, 1, 3, 2]), - gl.STATIC_DRAW); + gl.bufferData(gl.ELEMENT_ARRAY_BUFFER, new Uint16Array([0, 1, 2, 1, 3, 2]), gl.STATIC_DRAW); + }; /** -* Destroys the filter and removes it from the filter stack +* Destroys the filter and removes it from the filter stack. +* * @method destroy */ PIXI.WebGLFilterManager.prototype.destroy = function() diff --git a/src/pixi/renderers/webgl/utils/WebGLGraphics.js b/src/pixi/renderers/webgl/utils/WebGLGraphics.js index 4de401d..9ea5a53 100644 --- a/src/pixi/renderers/webgl/utils/WebGLGraphics.js +++ b/src/pixi/renderers/webgl/utils/WebGLGraphics.js @@ -11,7 +11,6 @@ */ PIXI.WebGLGraphics = function() { - }; /** @@ -120,7 +119,6 @@ webGL.data = []; webGL.lastIndex = 0; } - var webGLData; @@ -131,8 +129,6 @@ { var data = graphics.graphicsData[i]; - - if(data.type === PIXI.Graphics.POLY) { // need to add the points the the graphics object.. @@ -189,7 +185,6 @@ } } - webGL.lastIndex++; } @@ -201,7 +196,13 @@ } }; - +/** + * @static + * @private + * @method switchMode + * @param webGL {WebGLContext} + * @param type {Number} + */ PIXI.WebGLGraphics.switchMode = function(webGL, type) { var webGLData; @@ -308,7 +309,6 @@ */ PIXI.WebGLGraphics.buildRoundedRectangle = function(graphicsData, webGLData) { - var points = graphicsData.points; var x = points[0]; var y = points[1]; @@ -316,7 +316,6 @@ var height = points[3]; var radius = points[4]; - var recPoints = []; recPoints.push(x, y + radius); recPoints = recPoints.concat(PIXI.WebGLGraphics.quadraticBezierCurve(x, y + height - radius, x, y + height, x + radius, y + height)); @@ -324,7 +323,6 @@ recPoints = recPoints.concat(PIXI.WebGLGraphics.quadraticBezierCurve(x + width, y + radius, x + width, y, x + width - radius, y)); recPoints = recPoints.concat(PIXI.WebGLGraphics.quadraticBezierCurve(x + radius, y, x, y, x, y + radius)); - if (graphicsData.fill) { var color = PIXI.hex2rgb(graphicsData.fillColor); var alpha = graphicsData.fillAlpha; @@ -368,8 +366,8 @@ }; /** - * Calcul the points for a quadratic bezier curve. (helper function..) - * Based on : https://stackoverflow.com/questions/785097/how-do-i-implement-a-bezier-curve-in-c + * Calculate the points for a quadratic bezier curve. (helper function..) + * Based on: https://stackoverflow.com/questions/785097/how-do-i-implement-a-bezier-curve-in-c * * @static * @private @@ -383,6 +381,7 @@ * @return {Array} */ PIXI.WebGLGraphics.quadraticBezierCurve = function(fromX, fromY, cpX, cpY, toX, toY) { + var xa, ya, xb, @@ -718,13 +717,12 @@ * * @static * @private - * @method buildPoly + * @method buildComplexPoly * @param graphicsData {Graphics} The graphics object containing all the necessary properties * @param webGLData {Object} */ PIXI.WebGLGraphics.buildComplexPoly = function(graphicsData, webGLData) { - //TODO - no need to copy this as it gets turned into a FLoat32Array anyways.. var points = graphicsData.points.slice(); if(points.length < 6)return; @@ -776,6 +774,15 @@ }; +/** + * Builds a polygon to draw + * + * @static + * @private + * @method buildPoly + * @param graphicsData {Graphics} The graphics object containing all the necessary properties + * @param webGLData {Object} + */ PIXI.WebGLGraphics.buildPoly = function(graphicsData, webGLData) { var points = graphicsData.points; @@ -818,6 +825,11 @@ PIXI.WebGLGraphics.graphicsDataPool = []; +/** + * @class WebGLGraphicsData + * @private + * @static + */ PIXI.WebGLGraphicsData = function(gl) { this.gl = gl; @@ -834,6 +846,9 @@ this.dirty = true; }; +/** + * @method reset + */ PIXI.WebGLGraphicsData.prototype.reset = function() { this.points = []; @@ -841,6 +856,9 @@ this.lastIndex = 0; }; +/** + * @method upload + */ PIXI.WebGLGraphicsData.prototype.upload = function() { var gl = this.gl; diff --git a/src/pixi/renderers/webgl/utils/WebGLMaskManager.js b/src/pixi/renderers/webgl/utils/WebGLMaskManager.js index 181f560..607d5dd 100644 --- a/src/pixi/renderers/webgl/utils/WebGLMaskManager.js +++ b/src/pixi/renderers/webgl/utils/WebGLMaskManager.js @@ -5,16 +5,17 @@ /** * @class WebGLMaskManager * @constructor -* @param gl {WebGLContext} the current WebGL drawing context * @private */ PIXI.WebGLMaskManager = function() { - //this.setContext(gl); }; +PIXI.WebGLMaskManager.prototype.constructor = PIXI.WebGLMaskManager; + /** -* Sets the drawing context to the one given in parameter +* Sets the drawing context to the one given in parameter. +* * @method setContext * @param gl {WebGLContext} the current WebGL drawing context */ @@ -24,10 +25,11 @@ }; /** -* Applies the Mask and adds it to the current filter stack +* Applies the Mask and adds it to the current filter stack. +* * @method pushMask * @param maskData {Array} -* @param renderSession {RenderSession} +* @param renderSession {Object} */ PIXI.WebGLMaskManager.prototype.pushMask = function(maskData, renderSession) { @@ -44,10 +46,11 @@ }; /** -* Removes the last filter from the filter stack and doesn't return it +* Removes the last filter from the filter stack and doesn't return it. +* * @method popMask -* -* @param renderSession {RenderSession} an object containing all the useful parameters +* @param maskData {Array} +* @param renderSession {Object} an object containing all the useful parameters */ PIXI.WebGLMaskManager.prototype.popMask = function(maskData, renderSession) { @@ -55,9 +58,9 @@ renderSession.stencilManager.popStencil(maskData, maskData._webGL[gl.id].data[0], renderSession); }; - /** -* Destroys the mask stack +* Destroys the mask stack. +* * @method destroy */ PIXI.WebGLMaskManager.prototype.destroy = function() diff --git a/src/pixi/renderers/webgl/utils/WebGLShaderManager.js b/src/pixi/renderers/webgl/utils/WebGLShaderManager.js index b597698..a15974e 100644 --- a/src/pixi/renderers/webgl/utils/WebGLShaderManager.js +++ b/src/pixi/renderers/webgl/utils/WebGLShaderManager.js @@ -5,38 +5,54 @@ /** * @class WebGLShaderManager * @constructor -* @param gl {WebGLContext} the current WebGL drawing context * @private */ PIXI.WebGLShaderManager = function() { - + /** + * @property maxAttibs + * @type Number + */ this.maxAttibs = 10; + + /** + * @property attribState + * @type Array + */ this.attribState = []; + + /** + * @property tempAttribState + * @type Array + */ this.tempAttribState = []; - for (var i = 0; i < this.maxAttibs; i++) { + for (var i = 0; i < this.maxAttibs; i++) + { this.attribState[i] = false; } + /** + * @property stack + * @type Array + */ this.stack = []; - - //this.setContext(gl); - // the final one is used for the rendering strips + }; +PIXI.WebGLShaderManager.prototype.constructor = PIXI.WebGLShaderManager; /** -* Initialises the context and the properties +* Initialises the context and the properties. +* * @method setContext * @param gl {WebGLContext} the current WebGL drawing context -* @param transparent {Boolean} Whether or not the drawing context should be transparent */ PIXI.WebGLShaderManager.prototype.setContext = function(gl) { this.gl = gl; - // the next one is used for rendering primatives + // the next one is used for rendering primitives this.primitiveShader = new PIXI.PrimitiveShader(gl); // the next one is used for rendering triangle strips @@ -53,16 +69,15 @@ this.setShader(this.defaultShader); }; - /** -* Takes the attributes given in parameters +* Takes the attributes given in parameters. +* * @method setAttribs * @param attribs {Array} attribs */ PIXI.WebGLShaderManager.prototype.setAttribs = function(attribs) { // reset temp state - var i; for (i = 0; i < this.tempAttribState.length; i++) @@ -97,6 +112,12 @@ } }; +/** +* Sets the current shader. +* +* @method setShader +* @param shader {Any} +*/ PIXI.WebGLShaderManager.prototype.setShader = function(shader) { if(this._currentId === shader._UID)return false; @@ -112,7 +133,8 @@ }; /** -* Destroys +* Destroys this object. +* * @method destroy */ PIXI.WebGLShaderManager.prototype.destroy = function() @@ -133,4 +155,3 @@ this.gl = null; }; - diff --git a/src/pixi/renderers/webgl/utils/WebGLShaderUtils.js b/src/pixi/renderers/webgl/utils/WebGLShaderUtils.js index f6cc024..88461d1 100644 --- a/src/pixi/renderers/webgl/utils/WebGLShaderUtils.js +++ b/src/pixi/renderers/webgl/utils/WebGLShaderUtils.js @@ -2,27 +2,44 @@ * @author Mat Groves http://matgroves.com/ @Doormat23 */ -// TODO Alvin and Mat -// Should we eventually create a Utils class ? -// Or just move this file to the pixi.js file ? +/** +* @method initDefaultShaders +* @private +*/ PIXI.initDefaultShaders = function() { - - // PIXI.stripShader = new PIXI.StripShader(); -// PIXI.stripShader.init(); - }; +/** +* @method CompileVertexShader +* @param gl {WebGLContext} the current WebGL drawing context +* @param shaderSrc {Array} +* @return {Any} +*/ PIXI.CompileVertexShader = function(gl, shaderSrc) { return PIXI._CompileShader(gl, shaderSrc, gl.VERTEX_SHADER); }; +/** +* @method CompileFragmentShader +* @param gl {WebGLContext} the current WebGL drawing context +* @param shaderSrc {Array} +* @return {Any} +*/ PIXI.CompileFragmentShader = function(gl, shaderSrc) { return PIXI._CompileShader(gl, shaderSrc, gl.FRAGMENT_SHADER); }; +/** +* @method _CompileShader +* @private +* @param gl {WebGLContext} the current WebGL drawing context +* @param shaderSrc {Array} +* @param shaderType {Number} +* @return {Any} +*/ PIXI._CompileShader = function(gl, shaderSrc, shaderType) { var src = shaderSrc.join("\n"); @@ -30,14 +47,22 @@ gl.shaderSource(shader, src); gl.compileShader(shader); - if (!gl.getShaderParameter(shader, gl.COMPILE_STATUS)) { - window.console.log(gl.getShaderInfoLog(shader)); + if (!gl.getShaderParameter(shader, gl.COMPILE_STATUS)) + { + console.log(gl.getShaderInfoLog(shader)); return null; } return shader; }; +/** +* @method compileProgram +* @param gl {WebGLContext} the current WebGL drawing context +* @param vertexSrc {Array} +* @param fragmentSrc {Array} +* @return {Any} +*/ PIXI.compileProgram = function(gl, vertexSrc, fragmentSrc) { var fragmentShader = PIXI.CompileFragmentShader(gl, fragmentSrc); @@ -49,8 +74,9 @@ gl.attachShader(shaderProgram, fragmentShader); gl.linkProgram(shaderProgram); - if (!gl.getProgramParameter(shaderProgram, gl.LINK_STATUS)) { - window.console.log("Could not initialise shaders"); + if (!gl.getProgramParameter(shaderProgram, gl.LINK_STATUS)) + { + console.log("Could not initialise shaders"); } return shaderProgram; diff --git a/src/pixi/InteractionData.js b/src/pixi/InteractionData.js index ea77370..fa84a6d 100644 --- a/src/pixi/InteractionData.js +++ b/src/pixi/InteractionData.js @@ -18,7 +18,6 @@ */ this.global = new PIXI.Point(); - /** * The target Sprite that was interacted with * diff --git a/src/pixi/InteractionManager.js b/src/pixi/InteractionManager.js index 685c386..71f320b 100644 --- a/src/pixi/InteractionManager.js +++ b/src/pixi/InteractionManager.js @@ -14,7 +14,7 @@ PIXI.InteractionManager = function(stage) { /** - * a reference to the stage + * A reference to the stage * * @property stage * @type Stage @@ -22,7 +22,7 @@ this.stage = stage; /** - * the mouse data + * The mouse data * * @property mouse * @type InteractionData @@ -30,18 +30,21 @@ this.mouse = new PIXI.InteractionData(); /** - * an object that stores current touches (InteractionData) by id reference + * An object that stores current touches (InteractionData) by id reference * * @property touches * @type Object */ this.touches = {}; - // helpers + /** + * @property tempPoint + * @type Point + * @private + */ this.tempPoint = new PIXI.Point(); /** - * * @property mouseoverEnabled * @type Boolean * @default @@ -49,7 +52,7 @@ this.mouseoverEnabled = true; /** - * tiny little interactiveData pool ! + * Tiny little interactiveData pool ! * * @property pool * @type Array @@ -61,7 +64,6 @@ * @property interactiveItems * @type Array * @private - * */ this.interactiveItems = []; @@ -73,23 +75,60 @@ */ this.interactionDOMElement = null; - //this will make it so that you dont have to call bind all the time + //this will make it so that you don't have to call bind all the time + + /** + * @property onMouseMove + * @type Function + */ this.onMouseMove = this.onMouseMove.bind( this ); + + /** + * @property onMouseDown + * @type Function + */ this.onMouseDown = this.onMouseDown.bind(this); + + /** + * @property onMouseOut + * @type Function + */ this.onMouseOut = this.onMouseOut.bind(this); + + /** + * @property onMouseUp + * @type Function + */ this.onMouseUp = this.onMouseUp.bind(this); + /** + * @property onTouchStart + * @type Function + */ this.onTouchStart = this.onTouchStart.bind(this); + + /** + * @property onTouchEnd + * @type Function + */ this.onTouchEnd = this.onTouchEnd.bind(this); + + /** + * @property onTouchMove + * @type Function + */ this.onTouchMove = this.onTouchMove.bind(this); + /** + * @property last + * @type Number + */ this.last = 0; /** * The css style of the cursor that is being used * @property currentCursorStyle * @type String - * */ this.currentCursorStyle = 'inherit'; @@ -97,10 +136,13 @@ * Is set to true when the mouse is moved out of the canvas * @property mouseOut * @type Boolean - * */ this.mouseOut = false; + /** + * @property resolution + * @type Number + */ this.resolution = 1; }; @@ -166,7 +208,6 @@ this.setTargetDomElement (target.view); }; - /** * Sets the DOM element which will receive mouse/touch events. This is useful for when you have other DOM * elements on top of the renderers Canvas element. With this you'll be able to delegate another DOM element @@ -201,7 +242,10 @@ window.addEventListener('mouseup', this.onMouseUp, true); }; - +/** + * @method removeEvents + * @private + */ PIXI.InteractionManager.prototype.removeEvents = function() { if (!this.interactionDOMElement) return; @@ -308,6 +352,10 @@ } }; +/** + * @method rebuildInteractiveGraph + * @private + */ PIXI.InteractionManager.prototype.rebuildInteractiveGraph = function() { this.dirty = false; @@ -427,10 +475,10 @@ }; /** - * Is called when the mouse button is moved out of the renderer element + * Is called when the mouse is moved out of the renderer element * * @method onMouseOut - * @param event {Event} The DOM event of a mouse button being moved out + * @param event {Event} The DOM event of a mouse being moved out * @private */ PIXI.InteractionManager.prototype.onMouseOut = function(event) diff --git a/src/pixi/renderers/webgl/WebGLRenderer.js b/src/pixi/renderers/webgl/WebGLRenderer.js index 968fd3d..422896f 100644 --- a/src/pixi/renderers/webgl/WebGLRenderer.js +++ b/src/pixi/renderers/webgl/WebGLRenderer.js @@ -5,23 +5,21 @@ PIXI.glContexts = []; // this is where we store the webGL contexts for easy access. /** - * the WebGLRenderer draws the stage and all its content onto a webGL enabled canvas. This renderer - * should be used for browsers that support webGL. This Render works by automatically managing webGLBatch's. - * So no need for Sprite Batch's or Sprite Cloud's - * Dont forget to add the view to your DOM or you will not see anything :) + * The WebGLRenderer draws the stage and all its content onto a webGL enabled canvas. This renderer + * should be used for browsers that support webGL. This Render works by automatically managing webGLBatchs. + * So no need for Sprite Batches or Sprite Clouds. + * Don't forget to add the view to your DOM or you will not see anything :) * * @class WebGLRenderer * @constructor * @param [width=0] {Number} the width of the canvas view * @param [height=0] {Number} the height of the canvas view - * * @param [options] {Object} The optional renderer parameters * @param [options.view] {HTMLCanvasElement} the canvas to use as a view, optional * @param [options.transparent=false] {Boolean} If the render view is transparent, default false * @param [options.antialias=false] {Boolean} sets antialias (only applicable in chrome at the moment) * @param [options.preserveDrawingBuffer=false] {Boolean} enables drawing buffer preservation, enable this if you need to call toDataUrl on the webgl context * @param [options.resolution=1] {Number} the resolution of the renderer retina would be 2 - * */ PIXI.WebGLRenderer = function(width, height, options) { @@ -37,13 +35,16 @@ options = PIXI.defaultRenderOptions; } - if(!PIXI.defaultRenderer) { PIXI.sayHello('webGL'); PIXI.defaultRenderer = this; } + /** + * @property type + * @type Number + */ this.type = PIXI.WEBGL_RENDERER; /** @@ -56,6 +57,7 @@ this.resolution = options.resolution; // do a catch.. only 1 webGL renderer.. + /** * Whether the render view is transparent * @@ -99,12 +101,27 @@ this.view = options.view || document.createElement( 'canvas' ); // deal with losing context.. + + /** + * @property contextLostBound + * @type Function + */ this.contextLostBound = this.handleContextLost.bind(this); + + /** + * @property contextRestoredBound + * @type Function + */ this.contextRestoredBound = this.handleContextRestored.bind(this); this.view.addEventListener('webglcontextlost', this.contextLostBound, false); this.view.addEventListener('webglcontextrestored', this.contextRestoredBound, false); + /** + * @property _contextOptions + * @type Object + * @private + */ this._contextOptions = { alpha: this.transparent, antialias: options.antialias, // SPEED UP?? @@ -113,18 +130,67 @@ preserveDrawingBuffer: options.preserveDrawingBuffer }; + /** + * @property projection + * @type Point + */ this.projection = new PIXI.Point(); + + /** + * @property offset + * @type Point + */ this.offset = new PIXI.Point(0, 0); - // time to create the render managers! each one focuses on managine a state in webGL - 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(); // manages the stencil buffer - this.blendModeManager = new PIXI.WebGLBlendModeManager(); // manages the blendModes + // time to create the render managers! each one focuses on managing a state in webGL - // TODO remove + /** + * Deals with managing the shader programs and their attribs + * @property shaderManager + * @type WebGLShaderManager + */ + this.shaderManager = new PIXI.WebGLShaderManager(); + + /** + * Manages the rendering of sprites + * @property spriteBatch + * @type WebGLSpriteBatch + */ + this.spriteBatch = new PIXI.WebGLSpriteBatch(); + + /** + * Manages the masks using the stencil buffer + * @property maskManager + * @type WebGLMaskManager + */ + this.maskManager = new PIXI.WebGLMaskManager(); + + /** + * Manages the filters + * @property filterManager + * @type WebGLFilterManager + */ + this.filterManager = new PIXI.WebGLFilterManager(); + + /** + * Manages the stencil buffer + * @property stencilManager + * @type WebGLStencilManager + */ + this.stencilManager = new PIXI.WebGLStencilManager(); + + /** + * Manages the blendModes + * @property blendModeManager + * @type WebGLBlendModeManager + */ + this.blendModeManager = new PIXI.WebGLBlendModeManager(); + + /** + * TODO remove + * @property renderSession + * @type Object + */ this.renderSession = {}; this.renderSession.gl = this.gl; this.renderSession.drawCount = 0; @@ -147,6 +213,9 @@ // constructor PIXI.WebGLRenderer.prototype.constructor = PIXI.WebGLRenderer; +/** +* @method initContext +*/ PIXI.WebGLRenderer.prototype.initContext = function() { var gl = this.view.getContext('webgl', this._contextOptions) || this.view.getContext('experimental-webgl', this._contextOptions); @@ -180,7 +249,6 @@ this.resize(this.width, this.height); }; - /** * Renders the stage to its webGL view * @@ -205,9 +273,7 @@ // update the scene graph stage.updateTransform(); - var gl = this.gl; - // interaction if(stage._interactive) @@ -249,9 +315,9 @@ }; /** - * Renders a display Object + * Renders a Display Object. * - * @method renderDIsplayObject + * @method renderDisplayObject * @param displayObject {DisplayObject} The DisplayObject to render * @param projection {Point} The projection * @param buffer {Array} a standard WebGL buffer @@ -283,7 +349,7 @@ }; /** - * resizes the webGL view to the specified width and height + * Resizes the webGL view to the specified width and height. * * @method resize * @param width {Number} the new width of the webGL view @@ -297,10 +363,6 @@ this.view.width = this.width; this.view.height = this.height; - // this.view.style.width = width + 'px'; - // this.view.style.height = height + 'px'; - - // console.log(this.width / this.resolution) this.gl.viewport(0, 0, this.width, this.height); this.projection.x = this.width / 2 / this.resolution; @@ -308,10 +370,10 @@ }; /** - * Updates and Creates a WebGL texture for the renderers context + * Updates and Creates a WebGL texture for the renderers context. * * @method updateTexture - * @param texture {Texture} the texture to render + * @param texture {Texture} the texture to update */ PIXI.WebGLRenderer.prototype.updateTexture = function(texture) { @@ -411,6 +473,11 @@ this.renderSession = null; }; +/** + * Maps Pixi blend modes to WebGL blend modes. + * + * @method mapBlendModes + */ PIXI.WebGLRenderer.prototype.mapBlendModes = function() { var gl = this.gl; diff --git a/src/pixi/renderers/webgl/shaders/ComplexPrimitiveShader.js b/src/pixi/renderers/webgl/shaders/ComplexPrimitiveShader.js index daa8b64..79d038a 100644 --- a/src/pixi/renderers/webgl/shaders/ComplexPrimitiveShader.js +++ b/src/pixi/renderers/webgl/shaders/ComplexPrimitiveShader.js @@ -9,7 +9,13 @@ */ PIXI.ComplexPrimitiveShader = function(gl) { + /** + * @property _UID + * @type Number + * @private + */ this._UID = PIXI._UID++; + /** * @property gl * @type WebGLContext @@ -17,18 +23,20 @@ this.gl = gl; /** - * @property {any} program - The WebGL program. - */ + * The WebGL program. + * @property program + * @type {Any} + */ this.program = null; /** + * The fragment shader. * @property fragmentSrc * @type Array */ this.fragmentSrc = [ - 'precision mediump float;', - + 'precision mediump float;', 'varying vec4 vColor;', @@ -38,6 +46,7 @@ ]; /** + * The vertex shader. * @property vertexSrc * @type Array */ @@ -65,14 +74,15 @@ this.init(); }; +PIXI.ComplexPrimitiveShader.prototype.constructor = PIXI.ComplexPrimitiveShader; + /** -* Initialises the shader +* Initialises the shader. +* * @method init -* */ PIXI.ComplexPrimitiveShader.prototype.init = function() { - var gl = this.gl; var program = PIXI.compileProgram(gl, this.vertexSrc, this.fragmentSrc); @@ -84,7 +94,6 @@ this.tintColor = gl.getUniformLocation(program, 'tint'); this.color = gl.getUniformLocation(program, 'color'); - // get and store the attributes this.aVertexPosition = gl.getAttribLocation(program, 'aVertexPosition'); // this.colorAttribute = gl.getAttribLocation(program, 'aColor'); @@ -98,9 +107,9 @@ }; /** -* Destroys the shader +* Destroys the shader. +* * @method destroy -* */ PIXI.ComplexPrimitiveShader.prototype.destroy = function() { diff --git a/src/pixi/renderers/webgl/shaders/PixiFastShader.js b/src/pixi/renderers/webgl/shaders/PixiFastShader.js index 4fb3fe2..bb46419 100644 --- a/src/pixi/renderers/webgl/shaders/PixiFastShader.js +++ b/src/pixi/renderers/webgl/shaders/PixiFastShader.js @@ -1,6 +1,5 @@ /** * @author Mat Groves http://matgroves.com/ @Doormat23 - * @author Richard Davey http://www.photonstorm.com @photonstorm */ /** @@ -10,6 +9,11 @@ */ PIXI.PixiFastShader = function(gl) { + /** + * @property _UID + * @type Number + * @private + */ this._UID = PIXI._UID++; /** @@ -19,12 +23,16 @@ this.gl = gl; /** - * @property {any} program - The WebGL program. + * The WebGL program. + * @property program + * @type {Any} */ this.program = null; /** - * @property {array} fragmentSrc - The fragment shader. + * The fragment shader. + * @property fragmentSrc + * @type Array */ this.fragmentSrc = [ 'precision lowp float;', @@ -37,8 +45,10 @@ ]; /** - * @property {array} vertexSrc - The vertex shader - */ + * The vertex shader. + * @property vertexSrc + * @type Array + */ this.vertexSrc = [ 'attribute vec2 aVertexPosition;', 'attribute vec2 aPositionCoord;', @@ -69,24 +79,25 @@ '}' ]; - /** - * @property {number} textureCount - A local texture counter for multi-texture shaders. - */ + * A local texture counter for multi-texture shaders. + * @property textureCount + * @type Number + */ this.textureCount = 0; - this.init(); }; +PIXI.PixiFastShader.prototype.constructor = PIXI.PixiFastShader; + /** -* Initialises the shader +* Initialises the shader. +* * @method init -* */ PIXI.PixiFastShader.prototype.init = function() { - var gl = this.gl; var program = PIXI.compileProgram(gl, this.vertexSrc, this.fragmentSrc); @@ -111,8 +122,6 @@ this.aTextureCoord = gl.getAttribLocation(program, 'aTextureCoord'); this.colorAttribute = gl.getAttribLocation(program, 'aColor'); - - // Begin worst hack eva // // WHY??? ONLY on my chrome pixel the line above returns -1 when using filters? @@ -128,14 +137,13 @@ // End worst hack eva // - this.program = program; }; /** -* Destroys the shader +* Destroys the shader. +* * @method destroy -* */ PIXI.PixiFastShader.prototype.destroy = function() { diff --git a/src/pixi/renderers/webgl/shaders/PixiShader.js b/src/pixi/renderers/webgl/shaders/PixiShader.js index d76ec03..725dce2 100644 --- a/src/pixi/renderers/webgl/shaders/PixiShader.js +++ b/src/pixi/renderers/webgl/shaders/PixiShader.js @@ -6,9 +6,15 @@ /** * @class PixiShader * @constructor +* @param gl {WebGLContext} the current WebGL drawing context */ PIXI.PixiShader = function(gl) { + /** + * @property _UID + * @type Number + * @private + */ this._UID = PIXI._UID++; /** @@ -18,13 +24,17 @@ this.gl = gl; /** - * @property {any} program - The WebGL program. - */ + * The WebGL program. + * @property program + * @type {Any} + */ this.program = null; /** - * @property {array} fragmentSrc - The fragment shader. - */ + * The fragment shader. + * @property fragmentSrc + * @type Array + */ this.fragmentSrc = [ 'precision lowp float;', 'varying vec2 vTextureCoord;', @@ -36,21 +46,44 @@ ]; /** - * @property {number} textureCount - A local texture counter for multi-texture shaders. - */ + * A local texture counter for multi-texture shaders. + * @property textureCount + * @type Number + */ this.textureCount = 0; + + /** + * A local flag + * @property firstRun + * @type Boolean + * @private + */ this.firstRun = true; + + /** + * A dirty flag + * @property dirty + * @type Boolean + */ this.dirty = true; + /** + * Uniform attributes cache. + * @property attributes + * @type Array + * @private + */ this.attributes = []; this.init(); }; +PIXI.PixiShader.prototype.constructor = PIXI.PixiShader; + /** -* Initialises the shader +* Initialises the shader. +* * @method init -* */ PIXI.PixiShader.prototype.init = function() { @@ -71,12 +104,11 @@ this.aTextureCoord = gl.getAttribLocation(program, 'aTextureCoord'); this.colorAttribute = gl.getAttribLocation(program, 'aColor'); - // Begin worst hack eva // // WHY??? ONLY on my chrome pixel the line above returns -1 when using filters? // maybe its something to do with the current state of the gl context. - // Im convinced this is a bug in the chrome browser as there is NO reason why this should be returning -1 especially as it only manifests on my chrome pixel + // I'm convinced this is a bug in the chrome browser as there is NO reason why this should be returning -1 especially as it only manifests on my chrome pixel // If theres any webGL people that know why could happen please help :) if(this.colorAttribute === -1) { @@ -101,6 +133,7 @@ /** * Initialises the shader uniform values. +* * Uniforms are specified in the GLSL_ES Specification: http://www.khronos.org/registry/webgl/specs/latest/1.0/ * http://www.khronos.org/registry/gles/specs/2.0/GLSL_ES_Specification_1.0.17.pdf * @@ -316,7 +349,8 @@ }; /** -* Destroys the shader +* Destroys the shader. +* * @method destroy */ PIXI.PixiShader.prototype.destroy = function() @@ -329,7 +363,8 @@ }; /** -* The Default Vertex shader source +* The Default Vertex shader source. +* * @property defaultVertexSrc * @type String */ diff --git a/src/pixi/renderers/webgl/shaders/PrimitiveShader.js b/src/pixi/renderers/webgl/shaders/PrimitiveShader.js index 3a82be2..0f6854c 100644 --- a/src/pixi/renderers/webgl/shaders/PrimitiveShader.js +++ b/src/pixi/renderers/webgl/shaders/PrimitiveShader.js @@ -9,6 +9,11 @@ */ PIXI.PrimitiveShader = function(gl) { + /** + * @property _UID + * @type Number + * @private + */ this._UID = PIXI._UID++; /** @@ -18,11 +23,14 @@ this.gl = gl; /** - * @property {any} program - The WebGL program. - */ + * The WebGL program. + * @property program + * @type {Any} + */ this.program = null; /** + * The fragment shader. * @property fragmentSrc * @type Array */ @@ -36,6 +44,7 @@ ]; /** + * The vertex shader. * @property vertexSrc * @type Array */ @@ -60,14 +69,15 @@ this.init(); }; +PIXI.PrimitiveShader.prototype.constructor = PIXI.PrimitiveShader; + /** -* Initialises the shader +* Initialises the shader. +* * @method init -* */ PIXI.PrimitiveShader.prototype.init = function() { - var gl = this.gl; var program = PIXI.compileProgram(gl, this.vertexSrc, this.fragmentSrc); @@ -78,7 +88,6 @@ this.offsetVector = gl.getUniformLocation(program, 'offsetVector'); this.tintColor = gl.getUniformLocation(program, 'tint'); - // get and store the attributes this.aVertexPosition = gl.getAttribLocation(program, 'aVertexPosition'); this.colorAttribute = gl.getAttribLocation(program, 'aColor'); @@ -92,9 +101,9 @@ }; /** -* Destroys the shader +* Destroys the shader. +* * @method destroy -* */ PIXI.PrimitiveShader.prototype.destroy = function() { diff --git a/src/pixi/renderers/webgl/shaders/StripShader.js b/src/pixi/renderers/webgl/shaders/StripShader.js index 11f13ad..8fefe51 100644 --- a/src/pixi/renderers/webgl/shaders/StripShader.js +++ b/src/pixi/renderers/webgl/shaders/StripShader.js @@ -2,20 +2,37 @@ * @author Mat Groves http://matgroves.com/ @Doormat23 */ - +/** +* @class StripShader +* @constructor +* @param gl {WebGLContext} the current WebGL drawing context +*/ PIXI.StripShader = function(gl) { + /** + * @property _UID + * @type Number + * @private + */ this._UID = PIXI._UID++; + /** + * @property gl + * @type WebGLContext + */ this.gl = gl; /** - * @property {any} program - The WebGL program. - */ + * The WebGL program. + * @property program + * @type {Any} + */ this.program = null; /** - * @property {array} fragmentSrc - The fragment shader. + * The fragment shader. + * @property fragmentSrc + * @type Array */ this.fragmentSrc = [ 'precision mediump float;', @@ -30,9 +47,11 @@ '}' ]; - /** - * @property {array} fragmentSrc - The fragment shader. - */ + /** + * The vertex shader. + * @property vertexSrc + * @type Array + */ this.vertexSrc = [ 'attribute vec2 aVertexPosition;', 'attribute vec2 aTextureCoord;', @@ -56,10 +75,12 @@ this.init(); }; +PIXI.StripShader.prototype.constructor = PIXI.StripShader; + /** -* Initialises the shader +* Initialises the shader. +* * @method init -* */ PIXI.StripShader.prototype.init = function() { @@ -88,9 +109,9 @@ }; /** -* Destroys the shader +* Destroys the shader. +* * @method destroy -* */ PIXI.StripShader.prototype.destroy = function() { diff --git a/src/pixi/renderers/webgl/utils/FilterTexture.js b/src/pixi/renderers/webgl/utils/FilterTexture.js index 9dada23..389acbe 100644 --- a/src/pixi/renderers/webgl/utils/FilterTexture.js +++ b/src/pixi/renderers/webgl/utils/FilterTexture.js @@ -9,7 +9,6 @@ * @param width {Number} the horizontal range of the filter * @param height {Number} the vertical range of the filter * @param scaleMode {Number} Should be one of the PIXI.scaleMode consts -* @private */ PIXI.FilterTexture = function(gl, width, height, scaleMode) { @@ -19,11 +18,24 @@ */ this.gl = gl; - // next time to create a frame buffer and texture + + /** + * @property frameBuffer + * @type Any + */ this.frameBuffer = gl.createFramebuffer(); + + /** + * @property texture + * @type Any + */ this.texture = gl.createTexture(); + /** + * @property scaleMode + * @type Number + */ scaleMode = scaleMode || PIXI.scaleModes.DEFAULT; gl.bindTexture(gl.TEXTURE_2D, this.texture); @@ -44,9 +56,11 @@ this.resize(width, height); }; +PIXI.FilterTexture.prototype.constructor = PIXI.FilterTexture; /** -* Clears the filter texture +* Clears the filter texture. +* * @method clear */ PIXI.FilterTexture.prototype.clear = function() @@ -75,14 +89,14 @@ gl.bindTexture(gl.TEXTURE_2D, this.texture); gl.texImage2D(gl.TEXTURE_2D, 0, gl.RGBA, width , height , 0, gl.RGBA, gl.UNSIGNED_BYTE, null); - // console.log( width, width ) // update the stencil buffer width and height gl.bindRenderbuffer(gl.RENDERBUFFER, this.renderBuffer); gl.renderbufferStorage(gl.RENDERBUFFER, gl.DEPTH_STENCIL, width , height ); }; /** -* Destroys the filter texture +* Destroys the filter texture. +* * @method destroy */ PIXI.FilterTexture.prototype.destroy = function() diff --git a/src/pixi/renderers/webgl/utils/WebGLBlendModeManager.js b/src/pixi/renderers/webgl/utils/WebGLBlendModeManager.js index c73728f..3de0ec9 100644 --- a/src/pixi/renderers/webgl/utils/WebGLBlendModeManager.js +++ b/src/pixi/renderers/webgl/utils/WebGLBlendModeManager.js @@ -3,31 +3,42 @@ */ /** -* @class WebGLMaskManager +* @class WebGLBlendModeManager * @constructor * @param gl {WebGLContext} the current WebGL drawing context -* @private */ PIXI.WebGLBlendModeManager = function() { + /** + * @property currentBlendMode + * @type Number + */ this.currentBlendMode = 99999; }; +PIXI.WebGLBlendModeManager.prototype.constructor = PIXI.WebGLBlendModeManager; + +/** + * Sets the WebGL Context. + * + * @method setContext + * @param gl {WebGLContext} the current WebGL drawing context + */ PIXI.WebGLBlendModeManager.prototype.setContext = function(gl) { this.gl = gl; }; /** -* Sets-up the given blendMode from WebGL's point of view +* Sets-up the given blendMode from WebGL's point of view. +* * @method setBlendMode -* * @param blendMode {Number} the blendMode, should be a Pixi const, such as PIXI.BlendModes.ADD */ PIXI.WebGLBlendModeManager.prototype.setBlendMode = function(blendMode) { if(this.currentBlendMode === blendMode)return false; - // console.log("SWAP!") + this.currentBlendMode = blendMode; var blendModeWebGL = PIXI.blendModesWebGL[this.currentBlendMode]; @@ -36,7 +47,12 @@ return true; }; +/** +* Destroys this object. +* +* @method destroy +*/ PIXI.WebGLBlendModeManager.prototype.destroy = function() { this.gl = null; -}; \ No newline at end of file +}; diff --git a/src/pixi/renderers/webgl/utils/WebGLFastSpriteBatch.js b/src/pixi/renderers/webgl/utils/WebGLFastSpriteBatch.js index 0d08e47..0bdbbe4 100644 --- a/src/pixi/renderers/webgl/utils/WebGLFastSpriteBatch.js +++ b/src/pixi/renderers/webgl/utils/WebGLFastSpriteBatch.js @@ -8,27 +8,66 @@ * https://github.com/libgdx/libgdx/blob/master/gdx/src/com/badlogic/gdx/graphics/g2d/WebGLSpriteBatch.java */ +/** +* @class WebGLFastSpriteBatch +* @constructor +*/ PIXI.WebGLFastSpriteBatch = function() { - - + /** + * @property vertSize + * @type Number + */ this.vertSize = 10; + + /** + * @property maxSize + * @type Number + */ this.maxSize = 6000;//Math.pow(2, 16) / this.vertSize; + + /** + * @property size + * @type Number + */ this.size = this.maxSize; //the total number of floats in our batch var numVerts = this.size * 4 * this.vertSize; + //the total number of indices in our batch var numIndices = this.maxSize * 6; - //vertex data + /** + * Vertex data + * @property vertices + * @type Float32Array + */ this.vertices = new Float32Array(numVerts); - //index data + + /** + * Index data + * @property indices + * @type Uint16Array + */ this.indices = new Uint16Array(numIndices); + /** + * @property vertexBuffer + * @type Object + */ this.vertexBuffer = null; + + /** + * @property indexBuffer + * @type Object + */ this.indexBuffer = null; + /** + * @property lastIndexCount + * @type Number + */ this.lastIndexCount = 0; for (var i=0, j=0; i < numIndices; i += 6, j += 4) @@ -41,21 +80,58 @@ this.indices[i + 5] = j + 3; } + /** + * @property drawing + * @type Boolean + */ this.drawing = false; + + /** + * @property currentBatchSize + * @type Number + */ this.currentBatchSize = 0; + + /** + * @property currentBaseTexture + * @type BaseTexture + */ this.currentBaseTexture = null; + /** + * @property currentBlendMode + * @type Number + */ this.currentBlendMode = 0; + + /** + * @property renderSession + * @type Object + */ this.renderSession = null; - + /** + * @property shader + * @type Object + */ this.shader = null; + /** + * @property matrix + * @type Matrix + */ this.matrix = null; - //this.setContext(gl); }; +PIXI.WebGLFastSpriteBatch.prototype.constructor = PIXI.WebGLFastSpriteBatch; + +/** + * Sets the WebGL Context. + * + * @method setContext + * @param gl {WebGLContext} the current WebGL drawing context + */ PIXI.WebGLFastSpriteBatch.prototype.setContext = function(gl) { this.gl = gl; @@ -66,7 +142,6 @@ // 65535 is max index, so 65535 / 6 = 10922. - //upload the index data gl.bindBuffer(gl.ELEMENT_ARRAY_BUFFER, this.indexBuffer); gl.bufferData(gl.ELEMENT_ARRAY_BUFFER, this.indices, gl.STATIC_DRAW); @@ -75,6 +150,11 @@ gl.bufferData(gl.ARRAY_BUFFER, this.vertices, gl.DYNAMIC_DRAW); }; +/** + * @method begin + * @param spriteBatch {WebGLSpriteBatch} + * @param renderSession {Object} + */ PIXI.WebGLFastSpriteBatch.prototype.begin = function(spriteBatch, renderSession) { this.renderSession = renderSession; @@ -85,15 +165,20 @@ this.start(); }; +/** + * @method end + */ PIXI.WebGLFastSpriteBatch.prototype.end = function() { this.flush(); }; - +/** + * @method render + * @param spriteBatch {WebGLSpriteBatch} + */ PIXI.WebGLFastSpriteBatch.prototype.render = function(spriteBatch) { - var children = spriteBatch.children; var sprite = children[0]; @@ -119,6 +204,10 @@ this.flush(); }; +/** + * @method renderSprite + * @param sprite {Sprite} + */ PIXI.WebGLFastSpriteBatch.prototype.renderSprite = function(sprite) { //sprite = children[i]; @@ -137,7 +226,6 @@ uvs = sprite.texture._uvs; - width = sprite.texture.frame.width; height = sprite.texture.frame.height; @@ -257,9 +345,11 @@ } }; +/** + * @method flush + */ PIXI.WebGLFastSpriteBatch.prototype.flush = function() { - // If the batch is length 0 then return as there is nothing to draw if (this.currentBatchSize===0)return; @@ -272,7 +362,6 @@ gl.bindTexture(gl.TEXTURE_2D, this.currentBaseTexture._glTextures[gl.id]); // upload the verts to the buffer - if(this.currentBatchSize > ( this.size * 0.5 ) ) { @@ -285,7 +374,6 @@ gl.bufferSubData(gl.ARRAY_BUFFER, 0, view); } - // now draw those suckas! gl.drawElements(gl.TRIANGLES, this.currentBatchSize * 6, gl.UNSIGNED_SHORT, 0); @@ -297,11 +385,17 @@ }; +/** + * @method stop + */ PIXI.WebGLFastSpriteBatch.prototype.stop = function() { this.flush(); }; +/** + * @method start + */ PIXI.WebGLFastSpriteBatch.prototype.start = function() { var gl = this.gl; @@ -329,8 +423,5 @@ gl.vertexAttribPointer(this.shader.aRotation, 1, gl.FLOAT, false, stride, 6 * 4); gl.vertexAttribPointer(this.shader.aTextureCoord, 2, gl.FLOAT, false, stride, 7 * 4); gl.vertexAttribPointer(this.shader.colorAttribute, 1, gl.FLOAT, false, stride, 9 * 4); - }; - - diff --git a/src/pixi/renderers/webgl/utils/WebGLFilterManager.js b/src/pixi/renderers/webgl/utils/WebGLFilterManager.js index 9bb9195..359a834 100644 --- a/src/pixi/renderers/webgl/utils/WebGLFilterManager.js +++ b/src/pixi/renderers/webgl/utils/WebGLFilterManager.js @@ -5,22 +5,33 @@ /** * @class WebGLFilterManager * @constructor -* @param gl {WebGLContext} the current WebGL drawing context -* @private */ PIXI.WebGLFilterManager = function() { + /** + * @property filterStack + * @type Array + */ this.filterStack = []; + /** + * @property offsetX + * @type Number + */ this.offsetX = 0; - this.offsetY = 0; - // this.setContext(gl); + /** + * @property offsetY + * @type Number + */ + this.offsetY = 0; }; -// API +PIXI.WebGLFilterManager.prototype.constructor = PIXI.WebGLFilterManager; + /** -* Initialises the context and the properties +* Initialises the context and the properties. +* * @method setContext * @param gl {WebGLContext} the current WebGL drawing context */ @@ -33,7 +44,6 @@ }; /** -* * @method begin * @param renderSession {RenderSession} * @param buffer {ArrayBuffer} @@ -44,14 +54,14 @@ this.defaultShader = renderSession.shaderManager.defaultShader; var projection = this.renderSession.projection; - // console.log(this.width) this.width = projection.x * 2; this.height = -projection.y * 2; this.buffer = buffer; }; /** -* Applies the filter and adds it to the current filter stack +* Applies the filter and adds it to the current filter stack. +* * @method pushFilter * @param filterBlock {Object} the filter that will be pushed to the current filter stack */ @@ -64,7 +74,6 @@ filterBlock._filterArea = filterBlock.target.filterArea || filterBlock.target.getBounds(); - // filter program // OPTIMISATION - the first filter is free if its a simple color change? this.filterStack.push(filterBlock); @@ -126,9 +135,9 @@ }; - /** -* Removes the last filter from the filter stack and doesn't return it +* Removes the last filter from the filter stack and doesn't return it. +* * @method popFilter */ PIXI.WebGLFilterManager.prototype.popFilter = function() @@ -211,7 +220,6 @@ this.offsetX -= filterArea.x; this.offsetY -= filterArea.y; - var sizeX = this.width; var sizeY = this.height; @@ -239,9 +247,7 @@ buffer = currentFilter._glFilterTexture.frameBuffer; } - - - // TODO need toremove thease global elements.. + // TODO need to remove these global elements.. projection.x = sizeX/2; projection.y = -sizeY/2; @@ -280,10 +286,6 @@ gl.bufferSubData(gl.ARRAY_BUFFER, 0, this.uvArray); - //console.log(this.vertexArray) - //console.log(this.uvArray) - //console.log(sizeX + " : " + sizeY) - gl.viewport(0, 0, sizeX, sizeY); // bind the buffer @@ -300,9 +302,9 @@ this.applyFilterPass(filter, filterArea, sizeX, sizeY); // now restore the regular shader.. should happen automatically now.. - // this.renderSession.shaderManager.setShader(this.defaultShader); - // gl.uniform2f(this.defaultShader.projectionVector, sizeX/2, -sizeY/2); - // gl.uniform2f(this.defaultShader.offsetVector, -offsetX, -offsetY); + // this.renderSession.shaderManager.setShader(this.defaultShader); + // gl.uniform2f(this.defaultShader.projectionVector, sizeX/2, -sizeY/2); + // gl.uniform2f(this.defaultShader.offsetVector, -offsetX, -offsetY); // return the texture to the pool this.texturePool.push(texture); @@ -311,7 +313,8 @@ /** -* Applies the filter to the specified area +* Applies the filter to the specified area. +* * @method applyFilterPass * @param filter {AbstractFilter} the filter that needs to be applied * @param filterArea {texture} TODO - might need an update @@ -351,7 +354,6 @@ filter.uniforms.dimensions.value[3] = this.vertexArray[5];//filterArea.height; } - // console.log(this.uvArray ) shader.syncUniforms(); gl.bindBuffer(gl.ARRAY_BUFFER, this.vertexBuffer); @@ -372,7 +374,8 @@ }; /** -* Initialises the shader buffers +* Initialises the shader buffers. +* * @method initShaderBuffers */ PIXI.WebGLFilterManager.prototype.initShaderBuffers = function() @@ -385,7 +388,6 @@ this.colorBuffer = gl.createBuffer(); this.indexBuffer = gl.createBuffer(); - // bind and upload the vertexs.. // keep a reference to the vertexFloatData.. this.vertexArray = new Float32Array([0.0, 0.0, @@ -394,11 +396,7 @@ 1.0, 1.0]); gl.bindBuffer(gl.ARRAY_BUFFER, this.vertexBuffer); - gl.bufferData( - gl.ARRAY_BUFFER, - this.vertexArray, - gl.STATIC_DRAW); - + gl.bufferData(gl.ARRAY_BUFFER, this.vertexArray, gl.STATIC_DRAW); // bind and upload the uv buffer this.uvArray = new Float32Array([0.0, 0.0, @@ -407,10 +405,7 @@ 1.0, 1.0]); gl.bindBuffer(gl.ARRAY_BUFFER, this.uvBuffer); - gl.bufferData( - gl.ARRAY_BUFFER, - this.uvArray, - gl.STATIC_DRAW); + gl.bufferData(gl.ARRAY_BUFFER, this.uvArray, gl.STATIC_DRAW); this.colorArray = new Float32Array([1.0, 0xFFFFFF, 1.0, 0xFFFFFF, @@ -418,21 +413,17 @@ 1.0, 0xFFFFFF]); gl.bindBuffer(gl.ARRAY_BUFFER, this.colorBuffer); - gl.bufferData( - gl.ARRAY_BUFFER, - this.colorArray, - gl.STATIC_DRAW); + gl.bufferData(gl.ARRAY_BUFFER, this.colorArray, gl.STATIC_DRAW); // bind and upload the index gl.bindBuffer(gl.ELEMENT_ARRAY_BUFFER, this.indexBuffer); - gl.bufferData( - gl.ELEMENT_ARRAY_BUFFER, - new Uint16Array([0, 1, 2, 1, 3, 2]), - gl.STATIC_DRAW); + gl.bufferData(gl.ELEMENT_ARRAY_BUFFER, new Uint16Array([0, 1, 2, 1, 3, 2]), gl.STATIC_DRAW); + }; /** -* Destroys the filter and removes it from the filter stack +* Destroys the filter and removes it from the filter stack. +* * @method destroy */ PIXI.WebGLFilterManager.prototype.destroy = function() diff --git a/src/pixi/renderers/webgl/utils/WebGLGraphics.js b/src/pixi/renderers/webgl/utils/WebGLGraphics.js index 4de401d..9ea5a53 100644 --- a/src/pixi/renderers/webgl/utils/WebGLGraphics.js +++ b/src/pixi/renderers/webgl/utils/WebGLGraphics.js @@ -11,7 +11,6 @@ */ PIXI.WebGLGraphics = function() { - }; /** @@ -120,7 +119,6 @@ webGL.data = []; webGL.lastIndex = 0; } - var webGLData; @@ -131,8 +129,6 @@ { var data = graphics.graphicsData[i]; - - if(data.type === PIXI.Graphics.POLY) { // need to add the points the the graphics object.. @@ -189,7 +185,6 @@ } } - webGL.lastIndex++; } @@ -201,7 +196,13 @@ } }; - +/** + * @static + * @private + * @method switchMode + * @param webGL {WebGLContext} + * @param type {Number} + */ PIXI.WebGLGraphics.switchMode = function(webGL, type) { var webGLData; @@ -308,7 +309,6 @@ */ PIXI.WebGLGraphics.buildRoundedRectangle = function(graphicsData, webGLData) { - var points = graphicsData.points; var x = points[0]; var y = points[1]; @@ -316,7 +316,6 @@ var height = points[3]; var radius = points[4]; - var recPoints = []; recPoints.push(x, y + radius); recPoints = recPoints.concat(PIXI.WebGLGraphics.quadraticBezierCurve(x, y + height - radius, x, y + height, x + radius, y + height)); @@ -324,7 +323,6 @@ recPoints = recPoints.concat(PIXI.WebGLGraphics.quadraticBezierCurve(x + width, y + radius, x + width, y, x + width - radius, y)); recPoints = recPoints.concat(PIXI.WebGLGraphics.quadraticBezierCurve(x + radius, y, x, y, x, y + radius)); - if (graphicsData.fill) { var color = PIXI.hex2rgb(graphicsData.fillColor); var alpha = graphicsData.fillAlpha; @@ -368,8 +366,8 @@ }; /** - * Calcul the points for a quadratic bezier curve. (helper function..) - * Based on : https://stackoverflow.com/questions/785097/how-do-i-implement-a-bezier-curve-in-c + * Calculate the points for a quadratic bezier curve. (helper function..) + * Based on: https://stackoverflow.com/questions/785097/how-do-i-implement-a-bezier-curve-in-c * * @static * @private @@ -383,6 +381,7 @@ * @return {Array} */ PIXI.WebGLGraphics.quadraticBezierCurve = function(fromX, fromY, cpX, cpY, toX, toY) { + var xa, ya, xb, @@ -718,13 +717,12 @@ * * @static * @private - * @method buildPoly + * @method buildComplexPoly * @param graphicsData {Graphics} The graphics object containing all the necessary properties * @param webGLData {Object} */ PIXI.WebGLGraphics.buildComplexPoly = function(graphicsData, webGLData) { - //TODO - no need to copy this as it gets turned into a FLoat32Array anyways.. var points = graphicsData.points.slice(); if(points.length < 6)return; @@ -776,6 +774,15 @@ }; +/** + * Builds a polygon to draw + * + * @static + * @private + * @method buildPoly + * @param graphicsData {Graphics} The graphics object containing all the necessary properties + * @param webGLData {Object} + */ PIXI.WebGLGraphics.buildPoly = function(graphicsData, webGLData) { var points = graphicsData.points; @@ -818,6 +825,11 @@ PIXI.WebGLGraphics.graphicsDataPool = []; +/** + * @class WebGLGraphicsData + * @private + * @static + */ PIXI.WebGLGraphicsData = function(gl) { this.gl = gl; @@ -834,6 +846,9 @@ this.dirty = true; }; +/** + * @method reset + */ PIXI.WebGLGraphicsData.prototype.reset = function() { this.points = []; @@ -841,6 +856,9 @@ this.lastIndex = 0; }; +/** + * @method upload + */ PIXI.WebGLGraphicsData.prototype.upload = function() { var gl = this.gl; diff --git a/src/pixi/renderers/webgl/utils/WebGLMaskManager.js b/src/pixi/renderers/webgl/utils/WebGLMaskManager.js index 181f560..607d5dd 100644 --- a/src/pixi/renderers/webgl/utils/WebGLMaskManager.js +++ b/src/pixi/renderers/webgl/utils/WebGLMaskManager.js @@ -5,16 +5,17 @@ /** * @class WebGLMaskManager * @constructor -* @param gl {WebGLContext} the current WebGL drawing context * @private */ PIXI.WebGLMaskManager = function() { - //this.setContext(gl); }; +PIXI.WebGLMaskManager.prototype.constructor = PIXI.WebGLMaskManager; + /** -* Sets the drawing context to the one given in parameter +* Sets the drawing context to the one given in parameter. +* * @method setContext * @param gl {WebGLContext} the current WebGL drawing context */ @@ -24,10 +25,11 @@ }; /** -* Applies the Mask and adds it to the current filter stack +* Applies the Mask and adds it to the current filter stack. +* * @method pushMask * @param maskData {Array} -* @param renderSession {RenderSession} +* @param renderSession {Object} */ PIXI.WebGLMaskManager.prototype.pushMask = function(maskData, renderSession) { @@ -44,10 +46,11 @@ }; /** -* Removes the last filter from the filter stack and doesn't return it +* Removes the last filter from the filter stack and doesn't return it. +* * @method popMask -* -* @param renderSession {RenderSession} an object containing all the useful parameters +* @param maskData {Array} +* @param renderSession {Object} an object containing all the useful parameters */ PIXI.WebGLMaskManager.prototype.popMask = function(maskData, renderSession) { @@ -55,9 +58,9 @@ renderSession.stencilManager.popStencil(maskData, maskData._webGL[gl.id].data[0], renderSession); }; - /** -* Destroys the mask stack +* Destroys the mask stack. +* * @method destroy */ PIXI.WebGLMaskManager.prototype.destroy = function() diff --git a/src/pixi/renderers/webgl/utils/WebGLShaderManager.js b/src/pixi/renderers/webgl/utils/WebGLShaderManager.js index b597698..a15974e 100644 --- a/src/pixi/renderers/webgl/utils/WebGLShaderManager.js +++ b/src/pixi/renderers/webgl/utils/WebGLShaderManager.js @@ -5,38 +5,54 @@ /** * @class WebGLShaderManager * @constructor -* @param gl {WebGLContext} the current WebGL drawing context * @private */ PIXI.WebGLShaderManager = function() { - + /** + * @property maxAttibs + * @type Number + */ this.maxAttibs = 10; + + /** + * @property attribState + * @type Array + */ this.attribState = []; + + /** + * @property tempAttribState + * @type Array + */ this.tempAttribState = []; - for (var i = 0; i < this.maxAttibs; i++) { + for (var i = 0; i < this.maxAttibs; i++) + { this.attribState[i] = false; } + /** + * @property stack + * @type Array + */ this.stack = []; - - //this.setContext(gl); - // the final one is used for the rendering strips + }; +PIXI.WebGLShaderManager.prototype.constructor = PIXI.WebGLShaderManager; /** -* Initialises the context and the properties +* Initialises the context and the properties. +* * @method setContext * @param gl {WebGLContext} the current WebGL drawing context -* @param transparent {Boolean} Whether or not the drawing context should be transparent */ PIXI.WebGLShaderManager.prototype.setContext = function(gl) { this.gl = gl; - // the next one is used for rendering primatives + // the next one is used for rendering primitives this.primitiveShader = new PIXI.PrimitiveShader(gl); // the next one is used for rendering triangle strips @@ -53,16 +69,15 @@ this.setShader(this.defaultShader); }; - /** -* Takes the attributes given in parameters +* Takes the attributes given in parameters. +* * @method setAttribs * @param attribs {Array} attribs */ PIXI.WebGLShaderManager.prototype.setAttribs = function(attribs) { // reset temp state - var i; for (i = 0; i < this.tempAttribState.length; i++) @@ -97,6 +112,12 @@ } }; +/** +* Sets the current shader. +* +* @method setShader +* @param shader {Any} +*/ PIXI.WebGLShaderManager.prototype.setShader = function(shader) { if(this._currentId === shader._UID)return false; @@ -112,7 +133,8 @@ }; /** -* Destroys +* Destroys this object. +* * @method destroy */ PIXI.WebGLShaderManager.prototype.destroy = function() @@ -133,4 +155,3 @@ this.gl = null; }; - diff --git a/src/pixi/renderers/webgl/utils/WebGLShaderUtils.js b/src/pixi/renderers/webgl/utils/WebGLShaderUtils.js index f6cc024..88461d1 100644 --- a/src/pixi/renderers/webgl/utils/WebGLShaderUtils.js +++ b/src/pixi/renderers/webgl/utils/WebGLShaderUtils.js @@ -2,27 +2,44 @@ * @author Mat Groves http://matgroves.com/ @Doormat23 */ -// TODO Alvin and Mat -// Should we eventually create a Utils class ? -// Or just move this file to the pixi.js file ? +/** +* @method initDefaultShaders +* @private +*/ PIXI.initDefaultShaders = function() { - - // PIXI.stripShader = new PIXI.StripShader(); -// PIXI.stripShader.init(); - }; +/** +* @method CompileVertexShader +* @param gl {WebGLContext} the current WebGL drawing context +* @param shaderSrc {Array} +* @return {Any} +*/ PIXI.CompileVertexShader = function(gl, shaderSrc) { return PIXI._CompileShader(gl, shaderSrc, gl.VERTEX_SHADER); }; +/** +* @method CompileFragmentShader +* @param gl {WebGLContext} the current WebGL drawing context +* @param shaderSrc {Array} +* @return {Any} +*/ PIXI.CompileFragmentShader = function(gl, shaderSrc) { return PIXI._CompileShader(gl, shaderSrc, gl.FRAGMENT_SHADER); }; +/** +* @method _CompileShader +* @private +* @param gl {WebGLContext} the current WebGL drawing context +* @param shaderSrc {Array} +* @param shaderType {Number} +* @return {Any} +*/ PIXI._CompileShader = function(gl, shaderSrc, shaderType) { var src = shaderSrc.join("\n"); @@ -30,14 +47,22 @@ gl.shaderSource(shader, src); gl.compileShader(shader); - if (!gl.getShaderParameter(shader, gl.COMPILE_STATUS)) { - window.console.log(gl.getShaderInfoLog(shader)); + if (!gl.getShaderParameter(shader, gl.COMPILE_STATUS)) + { + console.log(gl.getShaderInfoLog(shader)); return null; } return shader; }; +/** +* @method compileProgram +* @param gl {WebGLContext} the current WebGL drawing context +* @param vertexSrc {Array} +* @param fragmentSrc {Array} +* @return {Any} +*/ PIXI.compileProgram = function(gl, vertexSrc, fragmentSrc) { var fragmentShader = PIXI.CompileFragmentShader(gl, fragmentSrc); @@ -49,8 +74,9 @@ gl.attachShader(shaderProgram, fragmentShader); gl.linkProgram(shaderProgram); - if (!gl.getProgramParameter(shaderProgram, gl.LINK_STATUS)) { - window.console.log("Could not initialise shaders"); + if (!gl.getProgramParameter(shaderProgram, gl.LINK_STATUS)) + { + console.log("Could not initialise shaders"); } return shaderProgram; diff --git a/src/pixi/renderers/webgl/utils/WebGLSpriteBatch.js b/src/pixi/renderers/webgl/utils/WebGLSpriteBatch.js index 4d59c80..f8a4bd7 100755 --- a/src/pixi/renderers/webgl/utils/WebGLSpriteBatch.js +++ b/src/pixi/renderers/webgl/utils/WebGLSpriteBatch.js @@ -13,15 +13,10 @@ * @class WebGLSpriteBatch * @private * @constructor - * @param gl {WebGLContext} the current WebGL drawing context - * */ PIXI.WebGLSpriteBatch = function() { - /** - * - * * @property vertSize * @type Number */ @@ -47,7 +42,6 @@ */ this.vertices = new Float32Array(numVerts); - //index data /** * Holds the indices * @@ -56,6 +50,10 @@ */ this.indices = new Uint16Array(numIndices); + /** + * @property lastIndexCount + * @type Number + */ this.lastIndexCount = 0; for (var i=0, j=0; i < numIndices; i += 6, j += 4) @@ -68,20 +66,58 @@ this.indices[i + 5] = j + 3; } - + /** + * @property drawing + * @type Boolean + */ this.drawing = false; - this.currentBatchSize = 0; - this.currentBaseTexture = null; - -// this.setContext(gl); + /** + * @property currentBatchSize + * @type Number + */ + this.currentBatchSize = 0; + + /** + * @property currentBaseTexture + * @type BaseTexture + */ + this.currentBaseTexture = null; + + /** + * @property dirty + * @type Boolean + */ this.dirty = true; + /** + * @property textures + * @type Array + */ this.textures = []; + + /** + * @property blendModes + * @type Array + */ this.blendModes = []; + + /** + * @property shaders + * @type Array + */ this.shaders = []; + + /** + * @property sprites + * @type Array + */ this.sprites = []; + /** + * @property defaultShader + * @type AbstractFilter + */ this.defaultShader = new PIXI.AbstractFilter([ 'precision lowp float;', 'varying vec2 vTextureCoord;', @@ -94,9 +130,7 @@ }; /** -* * @method setContext -* * @param gl {WebGLContext} the current WebGL drawing context */ PIXI.WebGLSpriteBatch.prototype.setContext = function(gl) @@ -109,7 +143,6 @@ // 65535 is max index, so 65535 / 6 = 10922. - //upload the index data gl.bindBuffer(gl.ELEMENT_ARRAY_BUFFER, this.indexBuffer); gl.bufferData(gl.ELEMENT_ARRAY_BUFFER, this.indices, gl.STATIC_DRAW); @@ -125,15 +158,12 @@ shader.uniforms = {}; shader.init(); - this.defaultShader.shaders[gl.id] = shader; }; /** -* * @method begin -* -* @param renderSession {RenderSession} the RenderSession +* @param renderSession {Object} The RenderSession object */ PIXI.WebGLSpriteBatch.prototype.begin = function(renderSession) { @@ -144,9 +174,7 @@ }; /** -* * @method end -* */ PIXI.WebGLSpriteBatch.prototype.end = function() { @@ -154,16 +182,13 @@ }; /** -* * @method render -* * @param sprite {Sprite} the sprite to render when using this spritebatch */ PIXI.WebGLSpriteBatch.prototype.render = function(sprite) { var texture = sprite.texture; - //TODO set blend modes.. // check texture.. if(this.currentBatchSize >= this.size) @@ -270,9 +295,9 @@ }; /** -* Renders a tilingSprite using the spriteBatch -* @method renderTilingSprite +* Renders a TilingSprite using the spriteBatch. * +* @method renderTilingSprite * @param sprite {TilingSprite} the tilingSprite to render */ PIXI.WebGLSpriteBatch.prototype.renderTilingSprite = function(tilingSprite) @@ -390,12 +415,10 @@ this.sprites[this.currentBatchSize++] = tilingSprite; }; - /** -* Renders the content and empties the current batch +* Renders the content and empties the current batch. * * @method flush -* */ PIXI.WebGLSpriteBatch.prototype.flush = function() { @@ -516,6 +539,12 @@ this.currentBatchSize = 0; }; +/** +* @method renderBatch +* @param texture {Texture} +* @param size {Number} +* @param startIndex {Number} +*/ PIXI.WebGLSpriteBatch.prototype.renderBatch = function(texture, size, startIndex) { if(size === 0)return; @@ -532,7 +561,6 @@ // bind the current texture gl.bindTexture(gl.TEXTURE_2D, texture._glTextures[gl.id]); } - // now draw those suckas! gl.drawElements(gl.TRIANGLES, size * 6, gl.UNSIGNED_SHORT, startIndex * 6 * 2); @@ -541,11 +569,8 @@ this.renderSession.drawCount++; }; - /** -* * @method stop -* */ PIXI.WebGLSpriteBatch.prototype.stop = function() { @@ -554,9 +579,7 @@ }; /** -* * @method start -* */ PIXI.WebGLSpriteBatch.prototype.start = function() { @@ -564,12 +587,12 @@ }; /** -* Destroys the SpriteBatch +* Destroys the SpriteBatch. +* * @method destroy */ PIXI.WebGLSpriteBatch.prototype.destroy = function() { - this.vertices = null; this.indices = null; diff --git a/src/pixi/InteractionData.js b/src/pixi/InteractionData.js index ea77370..fa84a6d 100644 --- a/src/pixi/InteractionData.js +++ b/src/pixi/InteractionData.js @@ -18,7 +18,6 @@ */ this.global = new PIXI.Point(); - /** * The target Sprite that was interacted with * diff --git a/src/pixi/InteractionManager.js b/src/pixi/InteractionManager.js index 685c386..71f320b 100644 --- a/src/pixi/InteractionManager.js +++ b/src/pixi/InteractionManager.js @@ -14,7 +14,7 @@ PIXI.InteractionManager = function(stage) { /** - * a reference to the stage + * A reference to the stage * * @property stage * @type Stage @@ -22,7 +22,7 @@ this.stage = stage; /** - * the mouse data + * The mouse data * * @property mouse * @type InteractionData @@ -30,18 +30,21 @@ this.mouse = new PIXI.InteractionData(); /** - * an object that stores current touches (InteractionData) by id reference + * An object that stores current touches (InteractionData) by id reference * * @property touches * @type Object */ this.touches = {}; - // helpers + /** + * @property tempPoint + * @type Point + * @private + */ this.tempPoint = new PIXI.Point(); /** - * * @property mouseoverEnabled * @type Boolean * @default @@ -49,7 +52,7 @@ this.mouseoverEnabled = true; /** - * tiny little interactiveData pool ! + * Tiny little interactiveData pool ! * * @property pool * @type Array @@ -61,7 +64,6 @@ * @property interactiveItems * @type Array * @private - * */ this.interactiveItems = []; @@ -73,23 +75,60 @@ */ this.interactionDOMElement = null; - //this will make it so that you dont have to call bind all the time + //this will make it so that you don't have to call bind all the time + + /** + * @property onMouseMove + * @type Function + */ this.onMouseMove = this.onMouseMove.bind( this ); + + /** + * @property onMouseDown + * @type Function + */ this.onMouseDown = this.onMouseDown.bind(this); + + /** + * @property onMouseOut + * @type Function + */ this.onMouseOut = this.onMouseOut.bind(this); + + /** + * @property onMouseUp + * @type Function + */ this.onMouseUp = this.onMouseUp.bind(this); + /** + * @property onTouchStart + * @type Function + */ this.onTouchStart = this.onTouchStart.bind(this); + + /** + * @property onTouchEnd + * @type Function + */ this.onTouchEnd = this.onTouchEnd.bind(this); + + /** + * @property onTouchMove + * @type Function + */ this.onTouchMove = this.onTouchMove.bind(this); + /** + * @property last + * @type Number + */ this.last = 0; /** * The css style of the cursor that is being used * @property currentCursorStyle * @type String - * */ this.currentCursorStyle = 'inherit'; @@ -97,10 +136,13 @@ * Is set to true when the mouse is moved out of the canvas * @property mouseOut * @type Boolean - * */ this.mouseOut = false; + /** + * @property resolution + * @type Number + */ this.resolution = 1; }; @@ -166,7 +208,6 @@ this.setTargetDomElement (target.view); }; - /** * Sets the DOM element which will receive mouse/touch events. This is useful for when you have other DOM * elements on top of the renderers Canvas element. With this you'll be able to delegate another DOM element @@ -201,7 +242,10 @@ window.addEventListener('mouseup', this.onMouseUp, true); }; - +/** + * @method removeEvents + * @private + */ PIXI.InteractionManager.prototype.removeEvents = function() { if (!this.interactionDOMElement) return; @@ -308,6 +352,10 @@ } }; +/** + * @method rebuildInteractiveGraph + * @private + */ PIXI.InteractionManager.prototype.rebuildInteractiveGraph = function() { this.dirty = false; @@ -427,10 +475,10 @@ }; /** - * Is called when the mouse button is moved out of the renderer element + * Is called when the mouse is moved out of the renderer element * * @method onMouseOut - * @param event {Event} The DOM event of a mouse button being moved out + * @param event {Event} The DOM event of a mouse being moved out * @private */ PIXI.InteractionManager.prototype.onMouseOut = function(event) diff --git a/src/pixi/renderers/webgl/WebGLRenderer.js b/src/pixi/renderers/webgl/WebGLRenderer.js index 968fd3d..422896f 100644 --- a/src/pixi/renderers/webgl/WebGLRenderer.js +++ b/src/pixi/renderers/webgl/WebGLRenderer.js @@ -5,23 +5,21 @@ PIXI.glContexts = []; // this is where we store the webGL contexts for easy access. /** - * the WebGLRenderer draws the stage and all its content onto a webGL enabled canvas. This renderer - * should be used for browsers that support webGL. This Render works by automatically managing webGLBatch's. - * So no need for Sprite Batch's or Sprite Cloud's - * Dont forget to add the view to your DOM or you will not see anything :) + * The WebGLRenderer draws the stage and all its content onto a webGL enabled canvas. This renderer + * should be used for browsers that support webGL. This Render works by automatically managing webGLBatchs. + * So no need for Sprite Batches or Sprite Clouds. + * Don't forget to add the view to your DOM or you will not see anything :) * * @class WebGLRenderer * @constructor * @param [width=0] {Number} the width of the canvas view * @param [height=0] {Number} the height of the canvas view - * * @param [options] {Object} The optional renderer parameters * @param [options.view] {HTMLCanvasElement} the canvas to use as a view, optional * @param [options.transparent=false] {Boolean} If the render view is transparent, default false * @param [options.antialias=false] {Boolean} sets antialias (only applicable in chrome at the moment) * @param [options.preserveDrawingBuffer=false] {Boolean} enables drawing buffer preservation, enable this if you need to call toDataUrl on the webgl context * @param [options.resolution=1] {Number} the resolution of the renderer retina would be 2 - * */ PIXI.WebGLRenderer = function(width, height, options) { @@ -37,13 +35,16 @@ options = PIXI.defaultRenderOptions; } - if(!PIXI.defaultRenderer) { PIXI.sayHello('webGL'); PIXI.defaultRenderer = this; } + /** + * @property type + * @type Number + */ this.type = PIXI.WEBGL_RENDERER; /** @@ -56,6 +57,7 @@ this.resolution = options.resolution; // do a catch.. only 1 webGL renderer.. + /** * Whether the render view is transparent * @@ -99,12 +101,27 @@ this.view = options.view || document.createElement( 'canvas' ); // deal with losing context.. + + /** + * @property contextLostBound + * @type Function + */ this.contextLostBound = this.handleContextLost.bind(this); + + /** + * @property contextRestoredBound + * @type Function + */ this.contextRestoredBound = this.handleContextRestored.bind(this); this.view.addEventListener('webglcontextlost', this.contextLostBound, false); this.view.addEventListener('webglcontextrestored', this.contextRestoredBound, false); + /** + * @property _contextOptions + * @type Object + * @private + */ this._contextOptions = { alpha: this.transparent, antialias: options.antialias, // SPEED UP?? @@ -113,18 +130,67 @@ preserveDrawingBuffer: options.preserveDrawingBuffer }; + /** + * @property projection + * @type Point + */ this.projection = new PIXI.Point(); + + /** + * @property offset + * @type Point + */ this.offset = new PIXI.Point(0, 0); - // time to create the render managers! each one focuses on managine a state in webGL - 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(); // manages the stencil buffer - this.blendModeManager = new PIXI.WebGLBlendModeManager(); // manages the blendModes + // time to create the render managers! each one focuses on managing a state in webGL - // TODO remove + /** + * Deals with managing the shader programs and their attribs + * @property shaderManager + * @type WebGLShaderManager + */ + this.shaderManager = new PIXI.WebGLShaderManager(); + + /** + * Manages the rendering of sprites + * @property spriteBatch + * @type WebGLSpriteBatch + */ + this.spriteBatch = new PIXI.WebGLSpriteBatch(); + + /** + * Manages the masks using the stencil buffer + * @property maskManager + * @type WebGLMaskManager + */ + this.maskManager = new PIXI.WebGLMaskManager(); + + /** + * Manages the filters + * @property filterManager + * @type WebGLFilterManager + */ + this.filterManager = new PIXI.WebGLFilterManager(); + + /** + * Manages the stencil buffer + * @property stencilManager + * @type WebGLStencilManager + */ + this.stencilManager = new PIXI.WebGLStencilManager(); + + /** + * Manages the blendModes + * @property blendModeManager + * @type WebGLBlendModeManager + */ + this.blendModeManager = new PIXI.WebGLBlendModeManager(); + + /** + * TODO remove + * @property renderSession + * @type Object + */ this.renderSession = {}; this.renderSession.gl = this.gl; this.renderSession.drawCount = 0; @@ -147,6 +213,9 @@ // constructor PIXI.WebGLRenderer.prototype.constructor = PIXI.WebGLRenderer; +/** +* @method initContext +*/ PIXI.WebGLRenderer.prototype.initContext = function() { var gl = this.view.getContext('webgl', this._contextOptions) || this.view.getContext('experimental-webgl', this._contextOptions); @@ -180,7 +249,6 @@ this.resize(this.width, this.height); }; - /** * Renders the stage to its webGL view * @@ -205,9 +273,7 @@ // update the scene graph stage.updateTransform(); - var gl = this.gl; - // interaction if(stage._interactive) @@ -249,9 +315,9 @@ }; /** - * Renders a display Object + * Renders a Display Object. * - * @method renderDIsplayObject + * @method renderDisplayObject * @param displayObject {DisplayObject} The DisplayObject to render * @param projection {Point} The projection * @param buffer {Array} a standard WebGL buffer @@ -283,7 +349,7 @@ }; /** - * resizes the webGL view to the specified width and height + * Resizes the webGL view to the specified width and height. * * @method resize * @param width {Number} the new width of the webGL view @@ -297,10 +363,6 @@ this.view.width = this.width; this.view.height = this.height; - // this.view.style.width = width + 'px'; - // this.view.style.height = height + 'px'; - - // console.log(this.width / this.resolution) this.gl.viewport(0, 0, this.width, this.height); this.projection.x = this.width / 2 / this.resolution; @@ -308,10 +370,10 @@ }; /** - * Updates and Creates a WebGL texture for the renderers context + * Updates and Creates a WebGL texture for the renderers context. * * @method updateTexture - * @param texture {Texture} the texture to render + * @param texture {Texture} the texture to update */ PIXI.WebGLRenderer.prototype.updateTexture = function(texture) { @@ -411,6 +473,11 @@ this.renderSession = null; }; +/** + * Maps Pixi blend modes to WebGL blend modes. + * + * @method mapBlendModes + */ PIXI.WebGLRenderer.prototype.mapBlendModes = function() { var gl = this.gl; diff --git a/src/pixi/renderers/webgl/shaders/ComplexPrimitiveShader.js b/src/pixi/renderers/webgl/shaders/ComplexPrimitiveShader.js index daa8b64..79d038a 100644 --- a/src/pixi/renderers/webgl/shaders/ComplexPrimitiveShader.js +++ b/src/pixi/renderers/webgl/shaders/ComplexPrimitiveShader.js @@ -9,7 +9,13 @@ */ PIXI.ComplexPrimitiveShader = function(gl) { + /** + * @property _UID + * @type Number + * @private + */ this._UID = PIXI._UID++; + /** * @property gl * @type WebGLContext @@ -17,18 +23,20 @@ this.gl = gl; /** - * @property {any} program - The WebGL program. - */ + * The WebGL program. + * @property program + * @type {Any} + */ this.program = null; /** + * The fragment shader. * @property fragmentSrc * @type Array */ this.fragmentSrc = [ - 'precision mediump float;', - + 'precision mediump float;', 'varying vec4 vColor;', @@ -38,6 +46,7 @@ ]; /** + * The vertex shader. * @property vertexSrc * @type Array */ @@ -65,14 +74,15 @@ this.init(); }; +PIXI.ComplexPrimitiveShader.prototype.constructor = PIXI.ComplexPrimitiveShader; + /** -* Initialises the shader +* Initialises the shader. +* * @method init -* */ PIXI.ComplexPrimitiveShader.prototype.init = function() { - var gl = this.gl; var program = PIXI.compileProgram(gl, this.vertexSrc, this.fragmentSrc); @@ -84,7 +94,6 @@ this.tintColor = gl.getUniformLocation(program, 'tint'); this.color = gl.getUniformLocation(program, 'color'); - // get and store the attributes this.aVertexPosition = gl.getAttribLocation(program, 'aVertexPosition'); // this.colorAttribute = gl.getAttribLocation(program, 'aColor'); @@ -98,9 +107,9 @@ }; /** -* Destroys the shader +* Destroys the shader. +* * @method destroy -* */ PIXI.ComplexPrimitiveShader.prototype.destroy = function() { diff --git a/src/pixi/renderers/webgl/shaders/PixiFastShader.js b/src/pixi/renderers/webgl/shaders/PixiFastShader.js index 4fb3fe2..bb46419 100644 --- a/src/pixi/renderers/webgl/shaders/PixiFastShader.js +++ b/src/pixi/renderers/webgl/shaders/PixiFastShader.js @@ -1,6 +1,5 @@ /** * @author Mat Groves http://matgroves.com/ @Doormat23 - * @author Richard Davey http://www.photonstorm.com @photonstorm */ /** @@ -10,6 +9,11 @@ */ PIXI.PixiFastShader = function(gl) { + /** + * @property _UID + * @type Number + * @private + */ this._UID = PIXI._UID++; /** @@ -19,12 +23,16 @@ this.gl = gl; /** - * @property {any} program - The WebGL program. + * The WebGL program. + * @property program + * @type {Any} */ this.program = null; /** - * @property {array} fragmentSrc - The fragment shader. + * The fragment shader. + * @property fragmentSrc + * @type Array */ this.fragmentSrc = [ 'precision lowp float;', @@ -37,8 +45,10 @@ ]; /** - * @property {array} vertexSrc - The vertex shader - */ + * The vertex shader. + * @property vertexSrc + * @type Array + */ this.vertexSrc = [ 'attribute vec2 aVertexPosition;', 'attribute vec2 aPositionCoord;', @@ -69,24 +79,25 @@ '}' ]; - /** - * @property {number} textureCount - A local texture counter for multi-texture shaders. - */ + * A local texture counter for multi-texture shaders. + * @property textureCount + * @type Number + */ this.textureCount = 0; - this.init(); }; +PIXI.PixiFastShader.prototype.constructor = PIXI.PixiFastShader; + /** -* Initialises the shader +* Initialises the shader. +* * @method init -* */ PIXI.PixiFastShader.prototype.init = function() { - var gl = this.gl; var program = PIXI.compileProgram(gl, this.vertexSrc, this.fragmentSrc); @@ -111,8 +122,6 @@ this.aTextureCoord = gl.getAttribLocation(program, 'aTextureCoord'); this.colorAttribute = gl.getAttribLocation(program, 'aColor'); - - // Begin worst hack eva // // WHY??? ONLY on my chrome pixel the line above returns -1 when using filters? @@ -128,14 +137,13 @@ // End worst hack eva // - this.program = program; }; /** -* Destroys the shader +* Destroys the shader. +* * @method destroy -* */ PIXI.PixiFastShader.prototype.destroy = function() { diff --git a/src/pixi/renderers/webgl/shaders/PixiShader.js b/src/pixi/renderers/webgl/shaders/PixiShader.js index d76ec03..725dce2 100644 --- a/src/pixi/renderers/webgl/shaders/PixiShader.js +++ b/src/pixi/renderers/webgl/shaders/PixiShader.js @@ -6,9 +6,15 @@ /** * @class PixiShader * @constructor +* @param gl {WebGLContext} the current WebGL drawing context */ PIXI.PixiShader = function(gl) { + /** + * @property _UID + * @type Number + * @private + */ this._UID = PIXI._UID++; /** @@ -18,13 +24,17 @@ this.gl = gl; /** - * @property {any} program - The WebGL program. - */ + * The WebGL program. + * @property program + * @type {Any} + */ this.program = null; /** - * @property {array} fragmentSrc - The fragment shader. - */ + * The fragment shader. + * @property fragmentSrc + * @type Array + */ this.fragmentSrc = [ 'precision lowp float;', 'varying vec2 vTextureCoord;', @@ -36,21 +46,44 @@ ]; /** - * @property {number} textureCount - A local texture counter for multi-texture shaders. - */ + * A local texture counter for multi-texture shaders. + * @property textureCount + * @type Number + */ this.textureCount = 0; + + /** + * A local flag + * @property firstRun + * @type Boolean + * @private + */ this.firstRun = true; + + /** + * A dirty flag + * @property dirty + * @type Boolean + */ this.dirty = true; + /** + * Uniform attributes cache. + * @property attributes + * @type Array + * @private + */ this.attributes = []; this.init(); }; +PIXI.PixiShader.prototype.constructor = PIXI.PixiShader; + /** -* Initialises the shader +* Initialises the shader. +* * @method init -* */ PIXI.PixiShader.prototype.init = function() { @@ -71,12 +104,11 @@ this.aTextureCoord = gl.getAttribLocation(program, 'aTextureCoord'); this.colorAttribute = gl.getAttribLocation(program, 'aColor'); - // Begin worst hack eva // // WHY??? ONLY on my chrome pixel the line above returns -1 when using filters? // maybe its something to do with the current state of the gl context. - // Im convinced this is a bug in the chrome browser as there is NO reason why this should be returning -1 especially as it only manifests on my chrome pixel + // I'm convinced this is a bug in the chrome browser as there is NO reason why this should be returning -1 especially as it only manifests on my chrome pixel // If theres any webGL people that know why could happen please help :) if(this.colorAttribute === -1) { @@ -101,6 +133,7 @@ /** * Initialises the shader uniform values. +* * Uniforms are specified in the GLSL_ES Specification: http://www.khronos.org/registry/webgl/specs/latest/1.0/ * http://www.khronos.org/registry/gles/specs/2.0/GLSL_ES_Specification_1.0.17.pdf * @@ -316,7 +349,8 @@ }; /** -* Destroys the shader +* Destroys the shader. +* * @method destroy */ PIXI.PixiShader.prototype.destroy = function() @@ -329,7 +363,8 @@ }; /** -* The Default Vertex shader source +* The Default Vertex shader source. +* * @property defaultVertexSrc * @type String */ diff --git a/src/pixi/renderers/webgl/shaders/PrimitiveShader.js b/src/pixi/renderers/webgl/shaders/PrimitiveShader.js index 3a82be2..0f6854c 100644 --- a/src/pixi/renderers/webgl/shaders/PrimitiveShader.js +++ b/src/pixi/renderers/webgl/shaders/PrimitiveShader.js @@ -9,6 +9,11 @@ */ PIXI.PrimitiveShader = function(gl) { + /** + * @property _UID + * @type Number + * @private + */ this._UID = PIXI._UID++; /** @@ -18,11 +23,14 @@ this.gl = gl; /** - * @property {any} program - The WebGL program. - */ + * The WebGL program. + * @property program + * @type {Any} + */ this.program = null; /** + * The fragment shader. * @property fragmentSrc * @type Array */ @@ -36,6 +44,7 @@ ]; /** + * The vertex shader. * @property vertexSrc * @type Array */ @@ -60,14 +69,15 @@ this.init(); }; +PIXI.PrimitiveShader.prototype.constructor = PIXI.PrimitiveShader; + /** -* Initialises the shader +* Initialises the shader. +* * @method init -* */ PIXI.PrimitiveShader.prototype.init = function() { - var gl = this.gl; var program = PIXI.compileProgram(gl, this.vertexSrc, this.fragmentSrc); @@ -78,7 +88,6 @@ this.offsetVector = gl.getUniformLocation(program, 'offsetVector'); this.tintColor = gl.getUniformLocation(program, 'tint'); - // get and store the attributes this.aVertexPosition = gl.getAttribLocation(program, 'aVertexPosition'); this.colorAttribute = gl.getAttribLocation(program, 'aColor'); @@ -92,9 +101,9 @@ }; /** -* Destroys the shader +* Destroys the shader. +* * @method destroy -* */ PIXI.PrimitiveShader.prototype.destroy = function() { diff --git a/src/pixi/renderers/webgl/shaders/StripShader.js b/src/pixi/renderers/webgl/shaders/StripShader.js index 11f13ad..8fefe51 100644 --- a/src/pixi/renderers/webgl/shaders/StripShader.js +++ b/src/pixi/renderers/webgl/shaders/StripShader.js @@ -2,20 +2,37 @@ * @author Mat Groves http://matgroves.com/ @Doormat23 */ - +/** +* @class StripShader +* @constructor +* @param gl {WebGLContext} the current WebGL drawing context +*/ PIXI.StripShader = function(gl) { + /** + * @property _UID + * @type Number + * @private + */ this._UID = PIXI._UID++; + /** + * @property gl + * @type WebGLContext + */ this.gl = gl; /** - * @property {any} program - The WebGL program. - */ + * The WebGL program. + * @property program + * @type {Any} + */ this.program = null; /** - * @property {array} fragmentSrc - The fragment shader. + * The fragment shader. + * @property fragmentSrc + * @type Array */ this.fragmentSrc = [ 'precision mediump float;', @@ -30,9 +47,11 @@ '}' ]; - /** - * @property {array} fragmentSrc - The fragment shader. - */ + /** + * The vertex shader. + * @property vertexSrc + * @type Array + */ this.vertexSrc = [ 'attribute vec2 aVertexPosition;', 'attribute vec2 aTextureCoord;', @@ -56,10 +75,12 @@ this.init(); }; +PIXI.StripShader.prototype.constructor = PIXI.StripShader; + /** -* Initialises the shader +* Initialises the shader. +* * @method init -* */ PIXI.StripShader.prototype.init = function() { @@ -88,9 +109,9 @@ }; /** -* Destroys the shader +* Destroys the shader. +* * @method destroy -* */ PIXI.StripShader.prototype.destroy = function() { diff --git a/src/pixi/renderers/webgl/utils/FilterTexture.js b/src/pixi/renderers/webgl/utils/FilterTexture.js index 9dada23..389acbe 100644 --- a/src/pixi/renderers/webgl/utils/FilterTexture.js +++ b/src/pixi/renderers/webgl/utils/FilterTexture.js @@ -9,7 +9,6 @@ * @param width {Number} the horizontal range of the filter * @param height {Number} the vertical range of the filter * @param scaleMode {Number} Should be one of the PIXI.scaleMode consts -* @private */ PIXI.FilterTexture = function(gl, width, height, scaleMode) { @@ -19,11 +18,24 @@ */ this.gl = gl; - // next time to create a frame buffer and texture + + /** + * @property frameBuffer + * @type Any + */ this.frameBuffer = gl.createFramebuffer(); + + /** + * @property texture + * @type Any + */ this.texture = gl.createTexture(); + /** + * @property scaleMode + * @type Number + */ scaleMode = scaleMode || PIXI.scaleModes.DEFAULT; gl.bindTexture(gl.TEXTURE_2D, this.texture); @@ -44,9 +56,11 @@ this.resize(width, height); }; +PIXI.FilterTexture.prototype.constructor = PIXI.FilterTexture; /** -* Clears the filter texture +* Clears the filter texture. +* * @method clear */ PIXI.FilterTexture.prototype.clear = function() @@ -75,14 +89,14 @@ gl.bindTexture(gl.TEXTURE_2D, this.texture); gl.texImage2D(gl.TEXTURE_2D, 0, gl.RGBA, width , height , 0, gl.RGBA, gl.UNSIGNED_BYTE, null); - // console.log( width, width ) // update the stencil buffer width and height gl.bindRenderbuffer(gl.RENDERBUFFER, this.renderBuffer); gl.renderbufferStorage(gl.RENDERBUFFER, gl.DEPTH_STENCIL, width , height ); }; /** -* Destroys the filter texture +* Destroys the filter texture. +* * @method destroy */ PIXI.FilterTexture.prototype.destroy = function() diff --git a/src/pixi/renderers/webgl/utils/WebGLBlendModeManager.js b/src/pixi/renderers/webgl/utils/WebGLBlendModeManager.js index c73728f..3de0ec9 100644 --- a/src/pixi/renderers/webgl/utils/WebGLBlendModeManager.js +++ b/src/pixi/renderers/webgl/utils/WebGLBlendModeManager.js @@ -3,31 +3,42 @@ */ /** -* @class WebGLMaskManager +* @class WebGLBlendModeManager * @constructor * @param gl {WebGLContext} the current WebGL drawing context -* @private */ PIXI.WebGLBlendModeManager = function() { + /** + * @property currentBlendMode + * @type Number + */ this.currentBlendMode = 99999; }; +PIXI.WebGLBlendModeManager.prototype.constructor = PIXI.WebGLBlendModeManager; + +/** + * Sets the WebGL Context. + * + * @method setContext + * @param gl {WebGLContext} the current WebGL drawing context + */ PIXI.WebGLBlendModeManager.prototype.setContext = function(gl) { this.gl = gl; }; /** -* Sets-up the given blendMode from WebGL's point of view +* Sets-up the given blendMode from WebGL's point of view. +* * @method setBlendMode -* * @param blendMode {Number} the blendMode, should be a Pixi const, such as PIXI.BlendModes.ADD */ PIXI.WebGLBlendModeManager.prototype.setBlendMode = function(blendMode) { if(this.currentBlendMode === blendMode)return false; - // console.log("SWAP!") + this.currentBlendMode = blendMode; var blendModeWebGL = PIXI.blendModesWebGL[this.currentBlendMode]; @@ -36,7 +47,12 @@ return true; }; +/** +* Destroys this object. +* +* @method destroy +*/ PIXI.WebGLBlendModeManager.prototype.destroy = function() { this.gl = null; -}; \ No newline at end of file +}; diff --git a/src/pixi/renderers/webgl/utils/WebGLFastSpriteBatch.js b/src/pixi/renderers/webgl/utils/WebGLFastSpriteBatch.js index 0d08e47..0bdbbe4 100644 --- a/src/pixi/renderers/webgl/utils/WebGLFastSpriteBatch.js +++ b/src/pixi/renderers/webgl/utils/WebGLFastSpriteBatch.js @@ -8,27 +8,66 @@ * https://github.com/libgdx/libgdx/blob/master/gdx/src/com/badlogic/gdx/graphics/g2d/WebGLSpriteBatch.java */ +/** +* @class WebGLFastSpriteBatch +* @constructor +*/ PIXI.WebGLFastSpriteBatch = function() { - - + /** + * @property vertSize + * @type Number + */ this.vertSize = 10; + + /** + * @property maxSize + * @type Number + */ this.maxSize = 6000;//Math.pow(2, 16) / this.vertSize; + + /** + * @property size + * @type Number + */ this.size = this.maxSize; //the total number of floats in our batch var numVerts = this.size * 4 * this.vertSize; + //the total number of indices in our batch var numIndices = this.maxSize * 6; - //vertex data + /** + * Vertex data + * @property vertices + * @type Float32Array + */ this.vertices = new Float32Array(numVerts); - //index data + + /** + * Index data + * @property indices + * @type Uint16Array + */ this.indices = new Uint16Array(numIndices); + /** + * @property vertexBuffer + * @type Object + */ this.vertexBuffer = null; + + /** + * @property indexBuffer + * @type Object + */ this.indexBuffer = null; + /** + * @property lastIndexCount + * @type Number + */ this.lastIndexCount = 0; for (var i=0, j=0; i < numIndices; i += 6, j += 4) @@ -41,21 +80,58 @@ this.indices[i + 5] = j + 3; } + /** + * @property drawing + * @type Boolean + */ this.drawing = false; + + /** + * @property currentBatchSize + * @type Number + */ this.currentBatchSize = 0; + + /** + * @property currentBaseTexture + * @type BaseTexture + */ this.currentBaseTexture = null; + /** + * @property currentBlendMode + * @type Number + */ this.currentBlendMode = 0; + + /** + * @property renderSession + * @type Object + */ this.renderSession = null; - + /** + * @property shader + * @type Object + */ this.shader = null; + /** + * @property matrix + * @type Matrix + */ this.matrix = null; - //this.setContext(gl); }; +PIXI.WebGLFastSpriteBatch.prototype.constructor = PIXI.WebGLFastSpriteBatch; + +/** + * Sets the WebGL Context. + * + * @method setContext + * @param gl {WebGLContext} the current WebGL drawing context + */ PIXI.WebGLFastSpriteBatch.prototype.setContext = function(gl) { this.gl = gl; @@ -66,7 +142,6 @@ // 65535 is max index, so 65535 / 6 = 10922. - //upload the index data gl.bindBuffer(gl.ELEMENT_ARRAY_BUFFER, this.indexBuffer); gl.bufferData(gl.ELEMENT_ARRAY_BUFFER, this.indices, gl.STATIC_DRAW); @@ -75,6 +150,11 @@ gl.bufferData(gl.ARRAY_BUFFER, this.vertices, gl.DYNAMIC_DRAW); }; +/** + * @method begin + * @param spriteBatch {WebGLSpriteBatch} + * @param renderSession {Object} + */ PIXI.WebGLFastSpriteBatch.prototype.begin = function(spriteBatch, renderSession) { this.renderSession = renderSession; @@ -85,15 +165,20 @@ this.start(); }; +/** + * @method end + */ PIXI.WebGLFastSpriteBatch.prototype.end = function() { this.flush(); }; - +/** + * @method render + * @param spriteBatch {WebGLSpriteBatch} + */ PIXI.WebGLFastSpriteBatch.prototype.render = function(spriteBatch) { - var children = spriteBatch.children; var sprite = children[0]; @@ -119,6 +204,10 @@ this.flush(); }; +/** + * @method renderSprite + * @param sprite {Sprite} + */ PIXI.WebGLFastSpriteBatch.prototype.renderSprite = function(sprite) { //sprite = children[i]; @@ -137,7 +226,6 @@ uvs = sprite.texture._uvs; - width = sprite.texture.frame.width; height = sprite.texture.frame.height; @@ -257,9 +345,11 @@ } }; +/** + * @method flush + */ PIXI.WebGLFastSpriteBatch.prototype.flush = function() { - // If the batch is length 0 then return as there is nothing to draw if (this.currentBatchSize===0)return; @@ -272,7 +362,6 @@ gl.bindTexture(gl.TEXTURE_2D, this.currentBaseTexture._glTextures[gl.id]); // upload the verts to the buffer - if(this.currentBatchSize > ( this.size * 0.5 ) ) { @@ -285,7 +374,6 @@ gl.bufferSubData(gl.ARRAY_BUFFER, 0, view); } - // now draw those suckas! gl.drawElements(gl.TRIANGLES, this.currentBatchSize * 6, gl.UNSIGNED_SHORT, 0); @@ -297,11 +385,17 @@ }; +/** + * @method stop + */ PIXI.WebGLFastSpriteBatch.prototype.stop = function() { this.flush(); }; +/** + * @method start + */ PIXI.WebGLFastSpriteBatch.prototype.start = function() { var gl = this.gl; @@ -329,8 +423,5 @@ gl.vertexAttribPointer(this.shader.aRotation, 1, gl.FLOAT, false, stride, 6 * 4); gl.vertexAttribPointer(this.shader.aTextureCoord, 2, gl.FLOAT, false, stride, 7 * 4); gl.vertexAttribPointer(this.shader.colorAttribute, 1, gl.FLOAT, false, stride, 9 * 4); - }; - - diff --git a/src/pixi/renderers/webgl/utils/WebGLFilterManager.js b/src/pixi/renderers/webgl/utils/WebGLFilterManager.js index 9bb9195..359a834 100644 --- a/src/pixi/renderers/webgl/utils/WebGLFilterManager.js +++ b/src/pixi/renderers/webgl/utils/WebGLFilterManager.js @@ -5,22 +5,33 @@ /** * @class WebGLFilterManager * @constructor -* @param gl {WebGLContext} the current WebGL drawing context -* @private */ PIXI.WebGLFilterManager = function() { + /** + * @property filterStack + * @type Array + */ this.filterStack = []; + /** + * @property offsetX + * @type Number + */ this.offsetX = 0; - this.offsetY = 0; - // this.setContext(gl); + /** + * @property offsetY + * @type Number + */ + this.offsetY = 0; }; -// API +PIXI.WebGLFilterManager.prototype.constructor = PIXI.WebGLFilterManager; + /** -* Initialises the context and the properties +* Initialises the context and the properties. +* * @method setContext * @param gl {WebGLContext} the current WebGL drawing context */ @@ -33,7 +44,6 @@ }; /** -* * @method begin * @param renderSession {RenderSession} * @param buffer {ArrayBuffer} @@ -44,14 +54,14 @@ this.defaultShader = renderSession.shaderManager.defaultShader; var projection = this.renderSession.projection; - // console.log(this.width) this.width = projection.x * 2; this.height = -projection.y * 2; this.buffer = buffer; }; /** -* Applies the filter and adds it to the current filter stack +* Applies the filter and adds it to the current filter stack. +* * @method pushFilter * @param filterBlock {Object} the filter that will be pushed to the current filter stack */ @@ -64,7 +74,6 @@ filterBlock._filterArea = filterBlock.target.filterArea || filterBlock.target.getBounds(); - // filter program // OPTIMISATION - the first filter is free if its a simple color change? this.filterStack.push(filterBlock); @@ -126,9 +135,9 @@ }; - /** -* Removes the last filter from the filter stack and doesn't return it +* Removes the last filter from the filter stack and doesn't return it. +* * @method popFilter */ PIXI.WebGLFilterManager.prototype.popFilter = function() @@ -211,7 +220,6 @@ this.offsetX -= filterArea.x; this.offsetY -= filterArea.y; - var sizeX = this.width; var sizeY = this.height; @@ -239,9 +247,7 @@ buffer = currentFilter._glFilterTexture.frameBuffer; } - - - // TODO need toremove thease global elements.. + // TODO need to remove these global elements.. projection.x = sizeX/2; projection.y = -sizeY/2; @@ -280,10 +286,6 @@ gl.bufferSubData(gl.ARRAY_BUFFER, 0, this.uvArray); - //console.log(this.vertexArray) - //console.log(this.uvArray) - //console.log(sizeX + " : " + sizeY) - gl.viewport(0, 0, sizeX, sizeY); // bind the buffer @@ -300,9 +302,9 @@ this.applyFilterPass(filter, filterArea, sizeX, sizeY); // now restore the regular shader.. should happen automatically now.. - // this.renderSession.shaderManager.setShader(this.defaultShader); - // gl.uniform2f(this.defaultShader.projectionVector, sizeX/2, -sizeY/2); - // gl.uniform2f(this.defaultShader.offsetVector, -offsetX, -offsetY); + // this.renderSession.shaderManager.setShader(this.defaultShader); + // gl.uniform2f(this.defaultShader.projectionVector, sizeX/2, -sizeY/2); + // gl.uniform2f(this.defaultShader.offsetVector, -offsetX, -offsetY); // return the texture to the pool this.texturePool.push(texture); @@ -311,7 +313,8 @@ /** -* Applies the filter to the specified area +* Applies the filter to the specified area. +* * @method applyFilterPass * @param filter {AbstractFilter} the filter that needs to be applied * @param filterArea {texture} TODO - might need an update @@ -351,7 +354,6 @@ filter.uniforms.dimensions.value[3] = this.vertexArray[5];//filterArea.height; } - // console.log(this.uvArray ) shader.syncUniforms(); gl.bindBuffer(gl.ARRAY_BUFFER, this.vertexBuffer); @@ -372,7 +374,8 @@ }; /** -* Initialises the shader buffers +* Initialises the shader buffers. +* * @method initShaderBuffers */ PIXI.WebGLFilterManager.prototype.initShaderBuffers = function() @@ -385,7 +388,6 @@ this.colorBuffer = gl.createBuffer(); this.indexBuffer = gl.createBuffer(); - // bind and upload the vertexs.. // keep a reference to the vertexFloatData.. this.vertexArray = new Float32Array([0.0, 0.0, @@ -394,11 +396,7 @@ 1.0, 1.0]); gl.bindBuffer(gl.ARRAY_BUFFER, this.vertexBuffer); - gl.bufferData( - gl.ARRAY_BUFFER, - this.vertexArray, - gl.STATIC_DRAW); - + gl.bufferData(gl.ARRAY_BUFFER, this.vertexArray, gl.STATIC_DRAW); // bind and upload the uv buffer this.uvArray = new Float32Array([0.0, 0.0, @@ -407,10 +405,7 @@ 1.0, 1.0]); gl.bindBuffer(gl.ARRAY_BUFFER, this.uvBuffer); - gl.bufferData( - gl.ARRAY_BUFFER, - this.uvArray, - gl.STATIC_DRAW); + gl.bufferData(gl.ARRAY_BUFFER, this.uvArray, gl.STATIC_DRAW); this.colorArray = new Float32Array([1.0, 0xFFFFFF, 1.0, 0xFFFFFF, @@ -418,21 +413,17 @@ 1.0, 0xFFFFFF]); gl.bindBuffer(gl.ARRAY_BUFFER, this.colorBuffer); - gl.bufferData( - gl.ARRAY_BUFFER, - this.colorArray, - gl.STATIC_DRAW); + gl.bufferData(gl.ARRAY_BUFFER, this.colorArray, gl.STATIC_DRAW); // bind and upload the index gl.bindBuffer(gl.ELEMENT_ARRAY_BUFFER, this.indexBuffer); - gl.bufferData( - gl.ELEMENT_ARRAY_BUFFER, - new Uint16Array([0, 1, 2, 1, 3, 2]), - gl.STATIC_DRAW); + gl.bufferData(gl.ELEMENT_ARRAY_BUFFER, new Uint16Array([0, 1, 2, 1, 3, 2]), gl.STATIC_DRAW); + }; /** -* Destroys the filter and removes it from the filter stack +* Destroys the filter and removes it from the filter stack. +* * @method destroy */ PIXI.WebGLFilterManager.prototype.destroy = function() diff --git a/src/pixi/renderers/webgl/utils/WebGLGraphics.js b/src/pixi/renderers/webgl/utils/WebGLGraphics.js index 4de401d..9ea5a53 100644 --- a/src/pixi/renderers/webgl/utils/WebGLGraphics.js +++ b/src/pixi/renderers/webgl/utils/WebGLGraphics.js @@ -11,7 +11,6 @@ */ PIXI.WebGLGraphics = function() { - }; /** @@ -120,7 +119,6 @@ webGL.data = []; webGL.lastIndex = 0; } - var webGLData; @@ -131,8 +129,6 @@ { var data = graphics.graphicsData[i]; - - if(data.type === PIXI.Graphics.POLY) { // need to add the points the the graphics object.. @@ -189,7 +185,6 @@ } } - webGL.lastIndex++; } @@ -201,7 +196,13 @@ } }; - +/** + * @static + * @private + * @method switchMode + * @param webGL {WebGLContext} + * @param type {Number} + */ PIXI.WebGLGraphics.switchMode = function(webGL, type) { var webGLData; @@ -308,7 +309,6 @@ */ PIXI.WebGLGraphics.buildRoundedRectangle = function(graphicsData, webGLData) { - var points = graphicsData.points; var x = points[0]; var y = points[1]; @@ -316,7 +316,6 @@ var height = points[3]; var radius = points[4]; - var recPoints = []; recPoints.push(x, y + radius); recPoints = recPoints.concat(PIXI.WebGLGraphics.quadraticBezierCurve(x, y + height - radius, x, y + height, x + radius, y + height)); @@ -324,7 +323,6 @@ recPoints = recPoints.concat(PIXI.WebGLGraphics.quadraticBezierCurve(x + width, y + radius, x + width, y, x + width - radius, y)); recPoints = recPoints.concat(PIXI.WebGLGraphics.quadraticBezierCurve(x + radius, y, x, y, x, y + radius)); - if (graphicsData.fill) { var color = PIXI.hex2rgb(graphicsData.fillColor); var alpha = graphicsData.fillAlpha; @@ -368,8 +366,8 @@ }; /** - * Calcul the points for a quadratic bezier curve. (helper function..) - * Based on : https://stackoverflow.com/questions/785097/how-do-i-implement-a-bezier-curve-in-c + * Calculate the points for a quadratic bezier curve. (helper function..) + * Based on: https://stackoverflow.com/questions/785097/how-do-i-implement-a-bezier-curve-in-c * * @static * @private @@ -383,6 +381,7 @@ * @return {Array} */ PIXI.WebGLGraphics.quadraticBezierCurve = function(fromX, fromY, cpX, cpY, toX, toY) { + var xa, ya, xb, @@ -718,13 +717,12 @@ * * @static * @private - * @method buildPoly + * @method buildComplexPoly * @param graphicsData {Graphics} The graphics object containing all the necessary properties * @param webGLData {Object} */ PIXI.WebGLGraphics.buildComplexPoly = function(graphicsData, webGLData) { - //TODO - no need to copy this as it gets turned into a FLoat32Array anyways.. var points = graphicsData.points.slice(); if(points.length < 6)return; @@ -776,6 +774,15 @@ }; +/** + * Builds a polygon to draw + * + * @static + * @private + * @method buildPoly + * @param graphicsData {Graphics} The graphics object containing all the necessary properties + * @param webGLData {Object} + */ PIXI.WebGLGraphics.buildPoly = function(graphicsData, webGLData) { var points = graphicsData.points; @@ -818,6 +825,11 @@ PIXI.WebGLGraphics.graphicsDataPool = []; +/** + * @class WebGLGraphicsData + * @private + * @static + */ PIXI.WebGLGraphicsData = function(gl) { this.gl = gl; @@ -834,6 +846,9 @@ this.dirty = true; }; +/** + * @method reset + */ PIXI.WebGLGraphicsData.prototype.reset = function() { this.points = []; @@ -841,6 +856,9 @@ this.lastIndex = 0; }; +/** + * @method upload + */ PIXI.WebGLGraphicsData.prototype.upload = function() { var gl = this.gl; diff --git a/src/pixi/renderers/webgl/utils/WebGLMaskManager.js b/src/pixi/renderers/webgl/utils/WebGLMaskManager.js index 181f560..607d5dd 100644 --- a/src/pixi/renderers/webgl/utils/WebGLMaskManager.js +++ b/src/pixi/renderers/webgl/utils/WebGLMaskManager.js @@ -5,16 +5,17 @@ /** * @class WebGLMaskManager * @constructor -* @param gl {WebGLContext} the current WebGL drawing context * @private */ PIXI.WebGLMaskManager = function() { - //this.setContext(gl); }; +PIXI.WebGLMaskManager.prototype.constructor = PIXI.WebGLMaskManager; + /** -* Sets the drawing context to the one given in parameter +* Sets the drawing context to the one given in parameter. +* * @method setContext * @param gl {WebGLContext} the current WebGL drawing context */ @@ -24,10 +25,11 @@ }; /** -* Applies the Mask and adds it to the current filter stack +* Applies the Mask and adds it to the current filter stack. +* * @method pushMask * @param maskData {Array} -* @param renderSession {RenderSession} +* @param renderSession {Object} */ PIXI.WebGLMaskManager.prototype.pushMask = function(maskData, renderSession) { @@ -44,10 +46,11 @@ }; /** -* Removes the last filter from the filter stack and doesn't return it +* Removes the last filter from the filter stack and doesn't return it. +* * @method popMask -* -* @param renderSession {RenderSession} an object containing all the useful parameters +* @param maskData {Array} +* @param renderSession {Object} an object containing all the useful parameters */ PIXI.WebGLMaskManager.prototype.popMask = function(maskData, renderSession) { @@ -55,9 +58,9 @@ renderSession.stencilManager.popStencil(maskData, maskData._webGL[gl.id].data[0], renderSession); }; - /** -* Destroys the mask stack +* Destroys the mask stack. +* * @method destroy */ PIXI.WebGLMaskManager.prototype.destroy = function() diff --git a/src/pixi/renderers/webgl/utils/WebGLShaderManager.js b/src/pixi/renderers/webgl/utils/WebGLShaderManager.js index b597698..a15974e 100644 --- a/src/pixi/renderers/webgl/utils/WebGLShaderManager.js +++ b/src/pixi/renderers/webgl/utils/WebGLShaderManager.js @@ -5,38 +5,54 @@ /** * @class WebGLShaderManager * @constructor -* @param gl {WebGLContext} the current WebGL drawing context * @private */ PIXI.WebGLShaderManager = function() { - + /** + * @property maxAttibs + * @type Number + */ this.maxAttibs = 10; + + /** + * @property attribState + * @type Array + */ this.attribState = []; + + /** + * @property tempAttribState + * @type Array + */ this.tempAttribState = []; - for (var i = 0; i < this.maxAttibs; i++) { + for (var i = 0; i < this.maxAttibs; i++) + { this.attribState[i] = false; } + /** + * @property stack + * @type Array + */ this.stack = []; - - //this.setContext(gl); - // the final one is used for the rendering strips + }; +PIXI.WebGLShaderManager.prototype.constructor = PIXI.WebGLShaderManager; /** -* Initialises the context and the properties +* Initialises the context and the properties. +* * @method setContext * @param gl {WebGLContext} the current WebGL drawing context -* @param transparent {Boolean} Whether or not the drawing context should be transparent */ PIXI.WebGLShaderManager.prototype.setContext = function(gl) { this.gl = gl; - // the next one is used for rendering primatives + // the next one is used for rendering primitives this.primitiveShader = new PIXI.PrimitiveShader(gl); // the next one is used for rendering triangle strips @@ -53,16 +69,15 @@ this.setShader(this.defaultShader); }; - /** -* Takes the attributes given in parameters +* Takes the attributes given in parameters. +* * @method setAttribs * @param attribs {Array} attribs */ PIXI.WebGLShaderManager.prototype.setAttribs = function(attribs) { // reset temp state - var i; for (i = 0; i < this.tempAttribState.length; i++) @@ -97,6 +112,12 @@ } }; +/** +* Sets the current shader. +* +* @method setShader +* @param shader {Any} +*/ PIXI.WebGLShaderManager.prototype.setShader = function(shader) { if(this._currentId === shader._UID)return false; @@ -112,7 +133,8 @@ }; /** -* Destroys +* Destroys this object. +* * @method destroy */ PIXI.WebGLShaderManager.prototype.destroy = function() @@ -133,4 +155,3 @@ this.gl = null; }; - diff --git a/src/pixi/renderers/webgl/utils/WebGLShaderUtils.js b/src/pixi/renderers/webgl/utils/WebGLShaderUtils.js index f6cc024..88461d1 100644 --- a/src/pixi/renderers/webgl/utils/WebGLShaderUtils.js +++ b/src/pixi/renderers/webgl/utils/WebGLShaderUtils.js @@ -2,27 +2,44 @@ * @author Mat Groves http://matgroves.com/ @Doormat23 */ -// TODO Alvin and Mat -// Should we eventually create a Utils class ? -// Or just move this file to the pixi.js file ? +/** +* @method initDefaultShaders +* @private +*/ PIXI.initDefaultShaders = function() { - - // PIXI.stripShader = new PIXI.StripShader(); -// PIXI.stripShader.init(); - }; +/** +* @method CompileVertexShader +* @param gl {WebGLContext} the current WebGL drawing context +* @param shaderSrc {Array} +* @return {Any} +*/ PIXI.CompileVertexShader = function(gl, shaderSrc) { return PIXI._CompileShader(gl, shaderSrc, gl.VERTEX_SHADER); }; +/** +* @method CompileFragmentShader +* @param gl {WebGLContext} the current WebGL drawing context +* @param shaderSrc {Array} +* @return {Any} +*/ PIXI.CompileFragmentShader = function(gl, shaderSrc) { return PIXI._CompileShader(gl, shaderSrc, gl.FRAGMENT_SHADER); }; +/** +* @method _CompileShader +* @private +* @param gl {WebGLContext} the current WebGL drawing context +* @param shaderSrc {Array} +* @param shaderType {Number} +* @return {Any} +*/ PIXI._CompileShader = function(gl, shaderSrc, shaderType) { var src = shaderSrc.join("\n"); @@ -30,14 +47,22 @@ gl.shaderSource(shader, src); gl.compileShader(shader); - if (!gl.getShaderParameter(shader, gl.COMPILE_STATUS)) { - window.console.log(gl.getShaderInfoLog(shader)); + if (!gl.getShaderParameter(shader, gl.COMPILE_STATUS)) + { + console.log(gl.getShaderInfoLog(shader)); return null; } return shader; }; +/** +* @method compileProgram +* @param gl {WebGLContext} the current WebGL drawing context +* @param vertexSrc {Array} +* @param fragmentSrc {Array} +* @return {Any} +*/ PIXI.compileProgram = function(gl, vertexSrc, fragmentSrc) { var fragmentShader = PIXI.CompileFragmentShader(gl, fragmentSrc); @@ -49,8 +74,9 @@ gl.attachShader(shaderProgram, fragmentShader); gl.linkProgram(shaderProgram); - if (!gl.getProgramParameter(shaderProgram, gl.LINK_STATUS)) { - window.console.log("Could not initialise shaders"); + if (!gl.getProgramParameter(shaderProgram, gl.LINK_STATUS)) + { + console.log("Could not initialise shaders"); } return shaderProgram; diff --git a/src/pixi/renderers/webgl/utils/WebGLSpriteBatch.js b/src/pixi/renderers/webgl/utils/WebGLSpriteBatch.js index 4d59c80..f8a4bd7 100755 --- a/src/pixi/renderers/webgl/utils/WebGLSpriteBatch.js +++ b/src/pixi/renderers/webgl/utils/WebGLSpriteBatch.js @@ -13,15 +13,10 @@ * @class WebGLSpriteBatch * @private * @constructor - * @param gl {WebGLContext} the current WebGL drawing context - * */ PIXI.WebGLSpriteBatch = function() { - /** - * - * * @property vertSize * @type Number */ @@ -47,7 +42,6 @@ */ this.vertices = new Float32Array(numVerts); - //index data /** * Holds the indices * @@ -56,6 +50,10 @@ */ this.indices = new Uint16Array(numIndices); + /** + * @property lastIndexCount + * @type Number + */ this.lastIndexCount = 0; for (var i=0, j=0; i < numIndices; i += 6, j += 4) @@ -68,20 +66,58 @@ this.indices[i + 5] = j + 3; } - + /** + * @property drawing + * @type Boolean + */ this.drawing = false; - this.currentBatchSize = 0; - this.currentBaseTexture = null; - -// this.setContext(gl); + /** + * @property currentBatchSize + * @type Number + */ + this.currentBatchSize = 0; + + /** + * @property currentBaseTexture + * @type BaseTexture + */ + this.currentBaseTexture = null; + + /** + * @property dirty + * @type Boolean + */ this.dirty = true; + /** + * @property textures + * @type Array + */ this.textures = []; + + /** + * @property blendModes + * @type Array + */ this.blendModes = []; + + /** + * @property shaders + * @type Array + */ this.shaders = []; + + /** + * @property sprites + * @type Array + */ this.sprites = []; + /** + * @property defaultShader + * @type AbstractFilter + */ this.defaultShader = new PIXI.AbstractFilter([ 'precision lowp float;', 'varying vec2 vTextureCoord;', @@ -94,9 +130,7 @@ }; /** -* * @method setContext -* * @param gl {WebGLContext} the current WebGL drawing context */ PIXI.WebGLSpriteBatch.prototype.setContext = function(gl) @@ -109,7 +143,6 @@ // 65535 is max index, so 65535 / 6 = 10922. - //upload the index data gl.bindBuffer(gl.ELEMENT_ARRAY_BUFFER, this.indexBuffer); gl.bufferData(gl.ELEMENT_ARRAY_BUFFER, this.indices, gl.STATIC_DRAW); @@ -125,15 +158,12 @@ shader.uniforms = {}; shader.init(); - this.defaultShader.shaders[gl.id] = shader; }; /** -* * @method begin -* -* @param renderSession {RenderSession} the RenderSession +* @param renderSession {Object} The RenderSession object */ PIXI.WebGLSpriteBatch.prototype.begin = function(renderSession) { @@ -144,9 +174,7 @@ }; /** -* * @method end -* */ PIXI.WebGLSpriteBatch.prototype.end = function() { @@ -154,16 +182,13 @@ }; /** -* * @method render -* * @param sprite {Sprite} the sprite to render when using this spritebatch */ PIXI.WebGLSpriteBatch.prototype.render = function(sprite) { var texture = sprite.texture; - //TODO set blend modes.. // check texture.. if(this.currentBatchSize >= this.size) @@ -270,9 +295,9 @@ }; /** -* Renders a tilingSprite using the spriteBatch -* @method renderTilingSprite +* Renders a TilingSprite using the spriteBatch. * +* @method renderTilingSprite * @param sprite {TilingSprite} the tilingSprite to render */ PIXI.WebGLSpriteBatch.prototype.renderTilingSprite = function(tilingSprite) @@ -390,12 +415,10 @@ this.sprites[this.currentBatchSize++] = tilingSprite; }; - /** -* Renders the content and empties the current batch +* Renders the content and empties the current batch. * * @method flush -* */ PIXI.WebGLSpriteBatch.prototype.flush = function() { @@ -516,6 +539,12 @@ this.currentBatchSize = 0; }; +/** +* @method renderBatch +* @param texture {Texture} +* @param size {Number} +* @param startIndex {Number} +*/ PIXI.WebGLSpriteBatch.prototype.renderBatch = function(texture, size, startIndex) { if(size === 0)return; @@ -532,7 +561,6 @@ // bind the current texture gl.bindTexture(gl.TEXTURE_2D, texture._glTextures[gl.id]); } - // now draw those suckas! gl.drawElements(gl.TRIANGLES, size * 6, gl.UNSIGNED_SHORT, startIndex * 6 * 2); @@ -541,11 +569,8 @@ this.renderSession.drawCount++; }; - /** -* * @method stop -* */ PIXI.WebGLSpriteBatch.prototype.stop = function() { @@ -554,9 +579,7 @@ }; /** -* * @method start -* */ PIXI.WebGLSpriteBatch.prototype.start = function() { @@ -564,12 +587,12 @@ }; /** -* Destroys the SpriteBatch +* Destroys the SpriteBatch. +* * @method destroy */ PIXI.WebGLSpriteBatch.prototype.destroy = function() { - this.vertices = null; this.indices = null; diff --git a/src/pixi/renderers/webgl/utils/WebGLStencilManager.js b/src/pixi/renderers/webgl/utils/WebGLStencilManager.js index f841e6f..367d7dc 100644 --- a/src/pixi/renderers/webgl/utils/WebGLStencilManager.js +++ b/src/pixi/renderers/webgl/utils/WebGLStencilManager.js @@ -5,21 +5,18 @@ /** * @class WebGLStencilManager * @constructor -* @param gl {WebGLContext} the current WebGL drawing context * @private */ PIXI.WebGLStencilManager = function() { - this.stencilStack = []; - //this.setContext(gl); this.reverse = true; this.count = 0; - }; /** -* Sets the drawing context to the one given in parameter +* Sets the drawing context to the one given in parameter. +* * @method setContext * @param gl {WebGLContext} the current WebGL drawing context */ @@ -29,10 +26,12 @@ }; /** -* Applies the Mask and adds it to the current filter stack +* Applies the Mask and adds it to the current filter stack. +* * @method pushMask -* @param maskData {Array} -* @param renderSession {RenderSession} +* @param graphics {Graphics} +* @param webGLData {Array} +* @param renderSession {Object} */ PIXI.WebGLStencilManager.prototype.pushStencil = function(graphics, webGLData, renderSession) { @@ -60,7 +59,6 @@ if(webGLData.mode === 1) { - gl.drawElements(gl.TRIANGLE_FAN, webGLData.indices.length - 4, gl.UNSIGNED_SHORT, 0 ); if(this.reverse) @@ -119,7 +117,14 @@ this.count++; }; -//TODO this does not belong here! +/** + * TODO this does not belong here! + * + * @method bindGraphics + * @param graphics {Graphics} + * @param webGLData {Array} + * @param renderSession {Object} + */ PIXI.WebGLStencilManager.prototype.bindGraphics = function(graphics, webGLData, renderSession) { //if(this._currentGraphics === graphics)return; @@ -182,6 +187,12 @@ } }; +/** + * @method popStencil + * @param graphics {Graphics} + * @param webGLData {Array} + * @param renderSession {Object} + */ PIXI.WebGLStencilManager.prototype.popStencil = function(graphics, webGLData, renderSession) { var gl = this.gl; @@ -272,7 +283,8 @@ }; /** -* Destroys the mask stack +* Destroys the mask stack. +* * @method destroy */ PIXI.WebGLStencilManager.prototype.destroy = function() diff --git a/src/pixi/InteractionData.js b/src/pixi/InteractionData.js index ea77370..fa84a6d 100644 --- a/src/pixi/InteractionData.js +++ b/src/pixi/InteractionData.js @@ -18,7 +18,6 @@ */ this.global = new PIXI.Point(); - /** * The target Sprite that was interacted with * diff --git a/src/pixi/InteractionManager.js b/src/pixi/InteractionManager.js index 685c386..71f320b 100644 --- a/src/pixi/InteractionManager.js +++ b/src/pixi/InteractionManager.js @@ -14,7 +14,7 @@ PIXI.InteractionManager = function(stage) { /** - * a reference to the stage + * A reference to the stage * * @property stage * @type Stage @@ -22,7 +22,7 @@ this.stage = stage; /** - * the mouse data + * The mouse data * * @property mouse * @type InteractionData @@ -30,18 +30,21 @@ this.mouse = new PIXI.InteractionData(); /** - * an object that stores current touches (InteractionData) by id reference + * An object that stores current touches (InteractionData) by id reference * * @property touches * @type Object */ this.touches = {}; - // helpers + /** + * @property tempPoint + * @type Point + * @private + */ this.tempPoint = new PIXI.Point(); /** - * * @property mouseoverEnabled * @type Boolean * @default @@ -49,7 +52,7 @@ this.mouseoverEnabled = true; /** - * tiny little interactiveData pool ! + * Tiny little interactiveData pool ! * * @property pool * @type Array @@ -61,7 +64,6 @@ * @property interactiveItems * @type Array * @private - * */ this.interactiveItems = []; @@ -73,23 +75,60 @@ */ this.interactionDOMElement = null; - //this will make it so that you dont have to call bind all the time + //this will make it so that you don't have to call bind all the time + + /** + * @property onMouseMove + * @type Function + */ this.onMouseMove = this.onMouseMove.bind( this ); + + /** + * @property onMouseDown + * @type Function + */ this.onMouseDown = this.onMouseDown.bind(this); + + /** + * @property onMouseOut + * @type Function + */ this.onMouseOut = this.onMouseOut.bind(this); + + /** + * @property onMouseUp + * @type Function + */ this.onMouseUp = this.onMouseUp.bind(this); + /** + * @property onTouchStart + * @type Function + */ this.onTouchStart = this.onTouchStart.bind(this); + + /** + * @property onTouchEnd + * @type Function + */ this.onTouchEnd = this.onTouchEnd.bind(this); + + /** + * @property onTouchMove + * @type Function + */ this.onTouchMove = this.onTouchMove.bind(this); + /** + * @property last + * @type Number + */ this.last = 0; /** * The css style of the cursor that is being used * @property currentCursorStyle * @type String - * */ this.currentCursorStyle = 'inherit'; @@ -97,10 +136,13 @@ * Is set to true when the mouse is moved out of the canvas * @property mouseOut * @type Boolean - * */ this.mouseOut = false; + /** + * @property resolution + * @type Number + */ this.resolution = 1; }; @@ -166,7 +208,6 @@ this.setTargetDomElement (target.view); }; - /** * Sets the DOM element which will receive mouse/touch events. This is useful for when you have other DOM * elements on top of the renderers Canvas element. With this you'll be able to delegate another DOM element @@ -201,7 +242,10 @@ window.addEventListener('mouseup', this.onMouseUp, true); }; - +/** + * @method removeEvents + * @private + */ PIXI.InteractionManager.prototype.removeEvents = function() { if (!this.interactionDOMElement) return; @@ -308,6 +352,10 @@ } }; +/** + * @method rebuildInteractiveGraph + * @private + */ PIXI.InteractionManager.prototype.rebuildInteractiveGraph = function() { this.dirty = false; @@ -427,10 +475,10 @@ }; /** - * Is called when the mouse button is moved out of the renderer element + * Is called when the mouse is moved out of the renderer element * * @method onMouseOut - * @param event {Event} The DOM event of a mouse button being moved out + * @param event {Event} The DOM event of a mouse being moved out * @private */ PIXI.InteractionManager.prototype.onMouseOut = function(event) diff --git a/src/pixi/renderers/webgl/WebGLRenderer.js b/src/pixi/renderers/webgl/WebGLRenderer.js index 968fd3d..422896f 100644 --- a/src/pixi/renderers/webgl/WebGLRenderer.js +++ b/src/pixi/renderers/webgl/WebGLRenderer.js @@ -5,23 +5,21 @@ PIXI.glContexts = []; // this is where we store the webGL contexts for easy access. /** - * the WebGLRenderer draws the stage and all its content onto a webGL enabled canvas. This renderer - * should be used for browsers that support webGL. This Render works by automatically managing webGLBatch's. - * So no need for Sprite Batch's or Sprite Cloud's - * Dont forget to add the view to your DOM or you will not see anything :) + * The WebGLRenderer draws the stage and all its content onto a webGL enabled canvas. This renderer + * should be used for browsers that support webGL. This Render works by automatically managing webGLBatchs. + * So no need for Sprite Batches or Sprite Clouds. + * Don't forget to add the view to your DOM or you will not see anything :) * * @class WebGLRenderer * @constructor * @param [width=0] {Number} the width of the canvas view * @param [height=0] {Number} the height of the canvas view - * * @param [options] {Object} The optional renderer parameters * @param [options.view] {HTMLCanvasElement} the canvas to use as a view, optional * @param [options.transparent=false] {Boolean} If the render view is transparent, default false * @param [options.antialias=false] {Boolean} sets antialias (only applicable in chrome at the moment) * @param [options.preserveDrawingBuffer=false] {Boolean} enables drawing buffer preservation, enable this if you need to call toDataUrl on the webgl context * @param [options.resolution=1] {Number} the resolution of the renderer retina would be 2 - * */ PIXI.WebGLRenderer = function(width, height, options) { @@ -37,13 +35,16 @@ options = PIXI.defaultRenderOptions; } - if(!PIXI.defaultRenderer) { PIXI.sayHello('webGL'); PIXI.defaultRenderer = this; } + /** + * @property type + * @type Number + */ this.type = PIXI.WEBGL_RENDERER; /** @@ -56,6 +57,7 @@ this.resolution = options.resolution; // do a catch.. only 1 webGL renderer.. + /** * Whether the render view is transparent * @@ -99,12 +101,27 @@ this.view = options.view || document.createElement( 'canvas' ); // deal with losing context.. + + /** + * @property contextLostBound + * @type Function + */ this.contextLostBound = this.handleContextLost.bind(this); + + /** + * @property contextRestoredBound + * @type Function + */ this.contextRestoredBound = this.handleContextRestored.bind(this); this.view.addEventListener('webglcontextlost', this.contextLostBound, false); this.view.addEventListener('webglcontextrestored', this.contextRestoredBound, false); + /** + * @property _contextOptions + * @type Object + * @private + */ this._contextOptions = { alpha: this.transparent, antialias: options.antialias, // SPEED UP?? @@ -113,18 +130,67 @@ preserveDrawingBuffer: options.preserveDrawingBuffer }; + /** + * @property projection + * @type Point + */ this.projection = new PIXI.Point(); + + /** + * @property offset + * @type Point + */ this.offset = new PIXI.Point(0, 0); - // time to create the render managers! each one focuses on managine a state in webGL - 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(); // manages the stencil buffer - this.blendModeManager = new PIXI.WebGLBlendModeManager(); // manages the blendModes + // time to create the render managers! each one focuses on managing a state in webGL - // TODO remove + /** + * Deals with managing the shader programs and their attribs + * @property shaderManager + * @type WebGLShaderManager + */ + this.shaderManager = new PIXI.WebGLShaderManager(); + + /** + * Manages the rendering of sprites + * @property spriteBatch + * @type WebGLSpriteBatch + */ + this.spriteBatch = new PIXI.WebGLSpriteBatch(); + + /** + * Manages the masks using the stencil buffer + * @property maskManager + * @type WebGLMaskManager + */ + this.maskManager = new PIXI.WebGLMaskManager(); + + /** + * Manages the filters + * @property filterManager + * @type WebGLFilterManager + */ + this.filterManager = new PIXI.WebGLFilterManager(); + + /** + * Manages the stencil buffer + * @property stencilManager + * @type WebGLStencilManager + */ + this.stencilManager = new PIXI.WebGLStencilManager(); + + /** + * Manages the blendModes + * @property blendModeManager + * @type WebGLBlendModeManager + */ + this.blendModeManager = new PIXI.WebGLBlendModeManager(); + + /** + * TODO remove + * @property renderSession + * @type Object + */ this.renderSession = {}; this.renderSession.gl = this.gl; this.renderSession.drawCount = 0; @@ -147,6 +213,9 @@ // constructor PIXI.WebGLRenderer.prototype.constructor = PIXI.WebGLRenderer; +/** +* @method initContext +*/ PIXI.WebGLRenderer.prototype.initContext = function() { var gl = this.view.getContext('webgl', this._contextOptions) || this.view.getContext('experimental-webgl', this._contextOptions); @@ -180,7 +249,6 @@ this.resize(this.width, this.height); }; - /** * Renders the stage to its webGL view * @@ -205,9 +273,7 @@ // update the scene graph stage.updateTransform(); - var gl = this.gl; - // interaction if(stage._interactive) @@ -249,9 +315,9 @@ }; /** - * Renders a display Object + * Renders a Display Object. * - * @method renderDIsplayObject + * @method renderDisplayObject * @param displayObject {DisplayObject} The DisplayObject to render * @param projection {Point} The projection * @param buffer {Array} a standard WebGL buffer @@ -283,7 +349,7 @@ }; /** - * resizes the webGL view to the specified width and height + * Resizes the webGL view to the specified width and height. * * @method resize * @param width {Number} the new width of the webGL view @@ -297,10 +363,6 @@ this.view.width = this.width; this.view.height = this.height; - // this.view.style.width = width + 'px'; - // this.view.style.height = height + 'px'; - - // console.log(this.width / this.resolution) this.gl.viewport(0, 0, this.width, this.height); this.projection.x = this.width / 2 / this.resolution; @@ -308,10 +370,10 @@ }; /** - * Updates and Creates a WebGL texture for the renderers context + * Updates and Creates a WebGL texture for the renderers context. * * @method updateTexture - * @param texture {Texture} the texture to render + * @param texture {Texture} the texture to update */ PIXI.WebGLRenderer.prototype.updateTexture = function(texture) { @@ -411,6 +473,11 @@ this.renderSession = null; }; +/** + * Maps Pixi blend modes to WebGL blend modes. + * + * @method mapBlendModes + */ PIXI.WebGLRenderer.prototype.mapBlendModes = function() { var gl = this.gl; diff --git a/src/pixi/renderers/webgl/shaders/ComplexPrimitiveShader.js b/src/pixi/renderers/webgl/shaders/ComplexPrimitiveShader.js index daa8b64..79d038a 100644 --- a/src/pixi/renderers/webgl/shaders/ComplexPrimitiveShader.js +++ b/src/pixi/renderers/webgl/shaders/ComplexPrimitiveShader.js @@ -9,7 +9,13 @@ */ PIXI.ComplexPrimitiveShader = function(gl) { + /** + * @property _UID + * @type Number + * @private + */ this._UID = PIXI._UID++; + /** * @property gl * @type WebGLContext @@ -17,18 +23,20 @@ this.gl = gl; /** - * @property {any} program - The WebGL program. - */ + * The WebGL program. + * @property program + * @type {Any} + */ this.program = null; /** + * The fragment shader. * @property fragmentSrc * @type Array */ this.fragmentSrc = [ - 'precision mediump float;', - + 'precision mediump float;', 'varying vec4 vColor;', @@ -38,6 +46,7 @@ ]; /** + * The vertex shader. * @property vertexSrc * @type Array */ @@ -65,14 +74,15 @@ this.init(); }; +PIXI.ComplexPrimitiveShader.prototype.constructor = PIXI.ComplexPrimitiveShader; + /** -* Initialises the shader +* Initialises the shader. +* * @method init -* */ PIXI.ComplexPrimitiveShader.prototype.init = function() { - var gl = this.gl; var program = PIXI.compileProgram(gl, this.vertexSrc, this.fragmentSrc); @@ -84,7 +94,6 @@ this.tintColor = gl.getUniformLocation(program, 'tint'); this.color = gl.getUniformLocation(program, 'color'); - // get and store the attributes this.aVertexPosition = gl.getAttribLocation(program, 'aVertexPosition'); // this.colorAttribute = gl.getAttribLocation(program, 'aColor'); @@ -98,9 +107,9 @@ }; /** -* Destroys the shader +* Destroys the shader. +* * @method destroy -* */ PIXI.ComplexPrimitiveShader.prototype.destroy = function() { diff --git a/src/pixi/renderers/webgl/shaders/PixiFastShader.js b/src/pixi/renderers/webgl/shaders/PixiFastShader.js index 4fb3fe2..bb46419 100644 --- a/src/pixi/renderers/webgl/shaders/PixiFastShader.js +++ b/src/pixi/renderers/webgl/shaders/PixiFastShader.js @@ -1,6 +1,5 @@ /** * @author Mat Groves http://matgroves.com/ @Doormat23 - * @author Richard Davey http://www.photonstorm.com @photonstorm */ /** @@ -10,6 +9,11 @@ */ PIXI.PixiFastShader = function(gl) { + /** + * @property _UID + * @type Number + * @private + */ this._UID = PIXI._UID++; /** @@ -19,12 +23,16 @@ this.gl = gl; /** - * @property {any} program - The WebGL program. + * The WebGL program. + * @property program + * @type {Any} */ this.program = null; /** - * @property {array} fragmentSrc - The fragment shader. + * The fragment shader. + * @property fragmentSrc + * @type Array */ this.fragmentSrc = [ 'precision lowp float;', @@ -37,8 +45,10 @@ ]; /** - * @property {array} vertexSrc - The vertex shader - */ + * The vertex shader. + * @property vertexSrc + * @type Array + */ this.vertexSrc = [ 'attribute vec2 aVertexPosition;', 'attribute vec2 aPositionCoord;', @@ -69,24 +79,25 @@ '}' ]; - /** - * @property {number} textureCount - A local texture counter for multi-texture shaders. - */ + * A local texture counter for multi-texture shaders. + * @property textureCount + * @type Number + */ this.textureCount = 0; - this.init(); }; +PIXI.PixiFastShader.prototype.constructor = PIXI.PixiFastShader; + /** -* Initialises the shader +* Initialises the shader. +* * @method init -* */ PIXI.PixiFastShader.prototype.init = function() { - var gl = this.gl; var program = PIXI.compileProgram(gl, this.vertexSrc, this.fragmentSrc); @@ -111,8 +122,6 @@ this.aTextureCoord = gl.getAttribLocation(program, 'aTextureCoord'); this.colorAttribute = gl.getAttribLocation(program, 'aColor'); - - // Begin worst hack eva // // WHY??? ONLY on my chrome pixel the line above returns -1 when using filters? @@ -128,14 +137,13 @@ // End worst hack eva // - this.program = program; }; /** -* Destroys the shader +* Destroys the shader. +* * @method destroy -* */ PIXI.PixiFastShader.prototype.destroy = function() { diff --git a/src/pixi/renderers/webgl/shaders/PixiShader.js b/src/pixi/renderers/webgl/shaders/PixiShader.js index d76ec03..725dce2 100644 --- a/src/pixi/renderers/webgl/shaders/PixiShader.js +++ b/src/pixi/renderers/webgl/shaders/PixiShader.js @@ -6,9 +6,15 @@ /** * @class PixiShader * @constructor +* @param gl {WebGLContext} the current WebGL drawing context */ PIXI.PixiShader = function(gl) { + /** + * @property _UID + * @type Number + * @private + */ this._UID = PIXI._UID++; /** @@ -18,13 +24,17 @@ this.gl = gl; /** - * @property {any} program - The WebGL program. - */ + * The WebGL program. + * @property program + * @type {Any} + */ this.program = null; /** - * @property {array} fragmentSrc - The fragment shader. - */ + * The fragment shader. + * @property fragmentSrc + * @type Array + */ this.fragmentSrc = [ 'precision lowp float;', 'varying vec2 vTextureCoord;', @@ -36,21 +46,44 @@ ]; /** - * @property {number} textureCount - A local texture counter for multi-texture shaders. - */ + * A local texture counter for multi-texture shaders. + * @property textureCount + * @type Number + */ this.textureCount = 0; + + /** + * A local flag + * @property firstRun + * @type Boolean + * @private + */ this.firstRun = true; + + /** + * A dirty flag + * @property dirty + * @type Boolean + */ this.dirty = true; + /** + * Uniform attributes cache. + * @property attributes + * @type Array + * @private + */ this.attributes = []; this.init(); }; +PIXI.PixiShader.prototype.constructor = PIXI.PixiShader; + /** -* Initialises the shader +* Initialises the shader. +* * @method init -* */ PIXI.PixiShader.prototype.init = function() { @@ -71,12 +104,11 @@ this.aTextureCoord = gl.getAttribLocation(program, 'aTextureCoord'); this.colorAttribute = gl.getAttribLocation(program, 'aColor'); - // Begin worst hack eva // // WHY??? ONLY on my chrome pixel the line above returns -1 when using filters? // maybe its something to do with the current state of the gl context. - // Im convinced this is a bug in the chrome browser as there is NO reason why this should be returning -1 especially as it only manifests on my chrome pixel + // I'm convinced this is a bug in the chrome browser as there is NO reason why this should be returning -1 especially as it only manifests on my chrome pixel // If theres any webGL people that know why could happen please help :) if(this.colorAttribute === -1) { @@ -101,6 +133,7 @@ /** * Initialises the shader uniform values. +* * Uniforms are specified in the GLSL_ES Specification: http://www.khronos.org/registry/webgl/specs/latest/1.0/ * http://www.khronos.org/registry/gles/specs/2.0/GLSL_ES_Specification_1.0.17.pdf * @@ -316,7 +349,8 @@ }; /** -* Destroys the shader +* Destroys the shader. +* * @method destroy */ PIXI.PixiShader.prototype.destroy = function() @@ -329,7 +363,8 @@ }; /** -* The Default Vertex shader source +* The Default Vertex shader source. +* * @property defaultVertexSrc * @type String */ diff --git a/src/pixi/renderers/webgl/shaders/PrimitiveShader.js b/src/pixi/renderers/webgl/shaders/PrimitiveShader.js index 3a82be2..0f6854c 100644 --- a/src/pixi/renderers/webgl/shaders/PrimitiveShader.js +++ b/src/pixi/renderers/webgl/shaders/PrimitiveShader.js @@ -9,6 +9,11 @@ */ PIXI.PrimitiveShader = function(gl) { + /** + * @property _UID + * @type Number + * @private + */ this._UID = PIXI._UID++; /** @@ -18,11 +23,14 @@ this.gl = gl; /** - * @property {any} program - The WebGL program. - */ + * The WebGL program. + * @property program + * @type {Any} + */ this.program = null; /** + * The fragment shader. * @property fragmentSrc * @type Array */ @@ -36,6 +44,7 @@ ]; /** + * The vertex shader. * @property vertexSrc * @type Array */ @@ -60,14 +69,15 @@ this.init(); }; +PIXI.PrimitiveShader.prototype.constructor = PIXI.PrimitiveShader; + /** -* Initialises the shader +* Initialises the shader. +* * @method init -* */ PIXI.PrimitiveShader.prototype.init = function() { - var gl = this.gl; var program = PIXI.compileProgram(gl, this.vertexSrc, this.fragmentSrc); @@ -78,7 +88,6 @@ this.offsetVector = gl.getUniformLocation(program, 'offsetVector'); this.tintColor = gl.getUniformLocation(program, 'tint'); - // get and store the attributes this.aVertexPosition = gl.getAttribLocation(program, 'aVertexPosition'); this.colorAttribute = gl.getAttribLocation(program, 'aColor'); @@ -92,9 +101,9 @@ }; /** -* Destroys the shader +* Destroys the shader. +* * @method destroy -* */ PIXI.PrimitiveShader.prototype.destroy = function() { diff --git a/src/pixi/renderers/webgl/shaders/StripShader.js b/src/pixi/renderers/webgl/shaders/StripShader.js index 11f13ad..8fefe51 100644 --- a/src/pixi/renderers/webgl/shaders/StripShader.js +++ b/src/pixi/renderers/webgl/shaders/StripShader.js @@ -2,20 +2,37 @@ * @author Mat Groves http://matgroves.com/ @Doormat23 */ - +/** +* @class StripShader +* @constructor +* @param gl {WebGLContext} the current WebGL drawing context +*/ PIXI.StripShader = function(gl) { + /** + * @property _UID + * @type Number + * @private + */ this._UID = PIXI._UID++; + /** + * @property gl + * @type WebGLContext + */ this.gl = gl; /** - * @property {any} program - The WebGL program. - */ + * The WebGL program. + * @property program + * @type {Any} + */ this.program = null; /** - * @property {array} fragmentSrc - The fragment shader. + * The fragment shader. + * @property fragmentSrc + * @type Array */ this.fragmentSrc = [ 'precision mediump float;', @@ -30,9 +47,11 @@ '}' ]; - /** - * @property {array} fragmentSrc - The fragment shader. - */ + /** + * The vertex shader. + * @property vertexSrc + * @type Array + */ this.vertexSrc = [ 'attribute vec2 aVertexPosition;', 'attribute vec2 aTextureCoord;', @@ -56,10 +75,12 @@ this.init(); }; +PIXI.StripShader.prototype.constructor = PIXI.StripShader; + /** -* Initialises the shader +* Initialises the shader. +* * @method init -* */ PIXI.StripShader.prototype.init = function() { @@ -88,9 +109,9 @@ }; /** -* Destroys the shader +* Destroys the shader. +* * @method destroy -* */ PIXI.StripShader.prototype.destroy = function() { diff --git a/src/pixi/renderers/webgl/utils/FilterTexture.js b/src/pixi/renderers/webgl/utils/FilterTexture.js index 9dada23..389acbe 100644 --- a/src/pixi/renderers/webgl/utils/FilterTexture.js +++ b/src/pixi/renderers/webgl/utils/FilterTexture.js @@ -9,7 +9,6 @@ * @param width {Number} the horizontal range of the filter * @param height {Number} the vertical range of the filter * @param scaleMode {Number} Should be one of the PIXI.scaleMode consts -* @private */ PIXI.FilterTexture = function(gl, width, height, scaleMode) { @@ -19,11 +18,24 @@ */ this.gl = gl; - // next time to create a frame buffer and texture + + /** + * @property frameBuffer + * @type Any + */ this.frameBuffer = gl.createFramebuffer(); + + /** + * @property texture + * @type Any + */ this.texture = gl.createTexture(); + /** + * @property scaleMode + * @type Number + */ scaleMode = scaleMode || PIXI.scaleModes.DEFAULT; gl.bindTexture(gl.TEXTURE_2D, this.texture); @@ -44,9 +56,11 @@ this.resize(width, height); }; +PIXI.FilterTexture.prototype.constructor = PIXI.FilterTexture; /** -* Clears the filter texture +* Clears the filter texture. +* * @method clear */ PIXI.FilterTexture.prototype.clear = function() @@ -75,14 +89,14 @@ gl.bindTexture(gl.TEXTURE_2D, this.texture); gl.texImage2D(gl.TEXTURE_2D, 0, gl.RGBA, width , height , 0, gl.RGBA, gl.UNSIGNED_BYTE, null); - // console.log( width, width ) // update the stencil buffer width and height gl.bindRenderbuffer(gl.RENDERBUFFER, this.renderBuffer); gl.renderbufferStorage(gl.RENDERBUFFER, gl.DEPTH_STENCIL, width , height ); }; /** -* Destroys the filter texture +* Destroys the filter texture. +* * @method destroy */ PIXI.FilterTexture.prototype.destroy = function() diff --git a/src/pixi/renderers/webgl/utils/WebGLBlendModeManager.js b/src/pixi/renderers/webgl/utils/WebGLBlendModeManager.js index c73728f..3de0ec9 100644 --- a/src/pixi/renderers/webgl/utils/WebGLBlendModeManager.js +++ b/src/pixi/renderers/webgl/utils/WebGLBlendModeManager.js @@ -3,31 +3,42 @@ */ /** -* @class WebGLMaskManager +* @class WebGLBlendModeManager * @constructor * @param gl {WebGLContext} the current WebGL drawing context -* @private */ PIXI.WebGLBlendModeManager = function() { + /** + * @property currentBlendMode + * @type Number + */ this.currentBlendMode = 99999; }; +PIXI.WebGLBlendModeManager.prototype.constructor = PIXI.WebGLBlendModeManager; + +/** + * Sets the WebGL Context. + * + * @method setContext + * @param gl {WebGLContext} the current WebGL drawing context + */ PIXI.WebGLBlendModeManager.prototype.setContext = function(gl) { this.gl = gl; }; /** -* Sets-up the given blendMode from WebGL's point of view +* Sets-up the given blendMode from WebGL's point of view. +* * @method setBlendMode -* * @param blendMode {Number} the blendMode, should be a Pixi const, such as PIXI.BlendModes.ADD */ PIXI.WebGLBlendModeManager.prototype.setBlendMode = function(blendMode) { if(this.currentBlendMode === blendMode)return false; - // console.log("SWAP!") + this.currentBlendMode = blendMode; var blendModeWebGL = PIXI.blendModesWebGL[this.currentBlendMode]; @@ -36,7 +47,12 @@ return true; }; +/** +* Destroys this object. +* +* @method destroy +*/ PIXI.WebGLBlendModeManager.prototype.destroy = function() { this.gl = null; -}; \ No newline at end of file +}; diff --git a/src/pixi/renderers/webgl/utils/WebGLFastSpriteBatch.js b/src/pixi/renderers/webgl/utils/WebGLFastSpriteBatch.js index 0d08e47..0bdbbe4 100644 --- a/src/pixi/renderers/webgl/utils/WebGLFastSpriteBatch.js +++ b/src/pixi/renderers/webgl/utils/WebGLFastSpriteBatch.js @@ -8,27 +8,66 @@ * https://github.com/libgdx/libgdx/blob/master/gdx/src/com/badlogic/gdx/graphics/g2d/WebGLSpriteBatch.java */ +/** +* @class WebGLFastSpriteBatch +* @constructor +*/ PIXI.WebGLFastSpriteBatch = function() { - - + /** + * @property vertSize + * @type Number + */ this.vertSize = 10; + + /** + * @property maxSize + * @type Number + */ this.maxSize = 6000;//Math.pow(2, 16) / this.vertSize; + + /** + * @property size + * @type Number + */ this.size = this.maxSize; //the total number of floats in our batch var numVerts = this.size * 4 * this.vertSize; + //the total number of indices in our batch var numIndices = this.maxSize * 6; - //vertex data + /** + * Vertex data + * @property vertices + * @type Float32Array + */ this.vertices = new Float32Array(numVerts); - //index data + + /** + * Index data + * @property indices + * @type Uint16Array + */ this.indices = new Uint16Array(numIndices); + /** + * @property vertexBuffer + * @type Object + */ this.vertexBuffer = null; + + /** + * @property indexBuffer + * @type Object + */ this.indexBuffer = null; + /** + * @property lastIndexCount + * @type Number + */ this.lastIndexCount = 0; for (var i=0, j=0; i < numIndices; i += 6, j += 4) @@ -41,21 +80,58 @@ this.indices[i + 5] = j + 3; } + /** + * @property drawing + * @type Boolean + */ this.drawing = false; + + /** + * @property currentBatchSize + * @type Number + */ this.currentBatchSize = 0; + + /** + * @property currentBaseTexture + * @type BaseTexture + */ this.currentBaseTexture = null; + /** + * @property currentBlendMode + * @type Number + */ this.currentBlendMode = 0; + + /** + * @property renderSession + * @type Object + */ this.renderSession = null; - + /** + * @property shader + * @type Object + */ this.shader = null; + /** + * @property matrix + * @type Matrix + */ this.matrix = null; - //this.setContext(gl); }; +PIXI.WebGLFastSpriteBatch.prototype.constructor = PIXI.WebGLFastSpriteBatch; + +/** + * Sets the WebGL Context. + * + * @method setContext + * @param gl {WebGLContext} the current WebGL drawing context + */ PIXI.WebGLFastSpriteBatch.prototype.setContext = function(gl) { this.gl = gl; @@ -66,7 +142,6 @@ // 65535 is max index, so 65535 / 6 = 10922. - //upload the index data gl.bindBuffer(gl.ELEMENT_ARRAY_BUFFER, this.indexBuffer); gl.bufferData(gl.ELEMENT_ARRAY_BUFFER, this.indices, gl.STATIC_DRAW); @@ -75,6 +150,11 @@ gl.bufferData(gl.ARRAY_BUFFER, this.vertices, gl.DYNAMIC_DRAW); }; +/** + * @method begin + * @param spriteBatch {WebGLSpriteBatch} + * @param renderSession {Object} + */ PIXI.WebGLFastSpriteBatch.prototype.begin = function(spriteBatch, renderSession) { this.renderSession = renderSession; @@ -85,15 +165,20 @@ this.start(); }; +/** + * @method end + */ PIXI.WebGLFastSpriteBatch.prototype.end = function() { this.flush(); }; - +/** + * @method render + * @param spriteBatch {WebGLSpriteBatch} + */ PIXI.WebGLFastSpriteBatch.prototype.render = function(spriteBatch) { - var children = spriteBatch.children; var sprite = children[0]; @@ -119,6 +204,10 @@ this.flush(); }; +/** + * @method renderSprite + * @param sprite {Sprite} + */ PIXI.WebGLFastSpriteBatch.prototype.renderSprite = function(sprite) { //sprite = children[i]; @@ -137,7 +226,6 @@ uvs = sprite.texture._uvs; - width = sprite.texture.frame.width; height = sprite.texture.frame.height; @@ -257,9 +345,11 @@ } }; +/** + * @method flush + */ PIXI.WebGLFastSpriteBatch.prototype.flush = function() { - // If the batch is length 0 then return as there is nothing to draw if (this.currentBatchSize===0)return; @@ -272,7 +362,6 @@ gl.bindTexture(gl.TEXTURE_2D, this.currentBaseTexture._glTextures[gl.id]); // upload the verts to the buffer - if(this.currentBatchSize > ( this.size * 0.5 ) ) { @@ -285,7 +374,6 @@ gl.bufferSubData(gl.ARRAY_BUFFER, 0, view); } - // now draw those suckas! gl.drawElements(gl.TRIANGLES, this.currentBatchSize * 6, gl.UNSIGNED_SHORT, 0); @@ -297,11 +385,17 @@ }; +/** + * @method stop + */ PIXI.WebGLFastSpriteBatch.prototype.stop = function() { this.flush(); }; +/** + * @method start + */ PIXI.WebGLFastSpriteBatch.prototype.start = function() { var gl = this.gl; @@ -329,8 +423,5 @@ gl.vertexAttribPointer(this.shader.aRotation, 1, gl.FLOAT, false, stride, 6 * 4); gl.vertexAttribPointer(this.shader.aTextureCoord, 2, gl.FLOAT, false, stride, 7 * 4); gl.vertexAttribPointer(this.shader.colorAttribute, 1, gl.FLOAT, false, stride, 9 * 4); - }; - - diff --git a/src/pixi/renderers/webgl/utils/WebGLFilterManager.js b/src/pixi/renderers/webgl/utils/WebGLFilterManager.js index 9bb9195..359a834 100644 --- a/src/pixi/renderers/webgl/utils/WebGLFilterManager.js +++ b/src/pixi/renderers/webgl/utils/WebGLFilterManager.js @@ -5,22 +5,33 @@ /** * @class WebGLFilterManager * @constructor -* @param gl {WebGLContext} the current WebGL drawing context -* @private */ PIXI.WebGLFilterManager = function() { + /** + * @property filterStack + * @type Array + */ this.filterStack = []; + /** + * @property offsetX + * @type Number + */ this.offsetX = 0; - this.offsetY = 0; - // this.setContext(gl); + /** + * @property offsetY + * @type Number + */ + this.offsetY = 0; }; -// API +PIXI.WebGLFilterManager.prototype.constructor = PIXI.WebGLFilterManager; + /** -* Initialises the context and the properties +* Initialises the context and the properties. +* * @method setContext * @param gl {WebGLContext} the current WebGL drawing context */ @@ -33,7 +44,6 @@ }; /** -* * @method begin * @param renderSession {RenderSession} * @param buffer {ArrayBuffer} @@ -44,14 +54,14 @@ this.defaultShader = renderSession.shaderManager.defaultShader; var projection = this.renderSession.projection; - // console.log(this.width) this.width = projection.x * 2; this.height = -projection.y * 2; this.buffer = buffer; }; /** -* Applies the filter and adds it to the current filter stack +* Applies the filter and adds it to the current filter stack. +* * @method pushFilter * @param filterBlock {Object} the filter that will be pushed to the current filter stack */ @@ -64,7 +74,6 @@ filterBlock._filterArea = filterBlock.target.filterArea || filterBlock.target.getBounds(); - // filter program // OPTIMISATION - the first filter is free if its a simple color change? this.filterStack.push(filterBlock); @@ -126,9 +135,9 @@ }; - /** -* Removes the last filter from the filter stack and doesn't return it +* Removes the last filter from the filter stack and doesn't return it. +* * @method popFilter */ PIXI.WebGLFilterManager.prototype.popFilter = function() @@ -211,7 +220,6 @@ this.offsetX -= filterArea.x; this.offsetY -= filterArea.y; - var sizeX = this.width; var sizeY = this.height; @@ -239,9 +247,7 @@ buffer = currentFilter._glFilterTexture.frameBuffer; } - - - // TODO need toremove thease global elements.. + // TODO need to remove these global elements.. projection.x = sizeX/2; projection.y = -sizeY/2; @@ -280,10 +286,6 @@ gl.bufferSubData(gl.ARRAY_BUFFER, 0, this.uvArray); - //console.log(this.vertexArray) - //console.log(this.uvArray) - //console.log(sizeX + " : " + sizeY) - gl.viewport(0, 0, sizeX, sizeY); // bind the buffer @@ -300,9 +302,9 @@ this.applyFilterPass(filter, filterArea, sizeX, sizeY); // now restore the regular shader.. should happen automatically now.. - // this.renderSession.shaderManager.setShader(this.defaultShader); - // gl.uniform2f(this.defaultShader.projectionVector, sizeX/2, -sizeY/2); - // gl.uniform2f(this.defaultShader.offsetVector, -offsetX, -offsetY); + // this.renderSession.shaderManager.setShader(this.defaultShader); + // gl.uniform2f(this.defaultShader.projectionVector, sizeX/2, -sizeY/2); + // gl.uniform2f(this.defaultShader.offsetVector, -offsetX, -offsetY); // return the texture to the pool this.texturePool.push(texture); @@ -311,7 +313,8 @@ /** -* Applies the filter to the specified area +* Applies the filter to the specified area. +* * @method applyFilterPass * @param filter {AbstractFilter} the filter that needs to be applied * @param filterArea {texture} TODO - might need an update @@ -351,7 +354,6 @@ filter.uniforms.dimensions.value[3] = this.vertexArray[5];//filterArea.height; } - // console.log(this.uvArray ) shader.syncUniforms(); gl.bindBuffer(gl.ARRAY_BUFFER, this.vertexBuffer); @@ -372,7 +374,8 @@ }; /** -* Initialises the shader buffers +* Initialises the shader buffers. +* * @method initShaderBuffers */ PIXI.WebGLFilterManager.prototype.initShaderBuffers = function() @@ -385,7 +388,6 @@ this.colorBuffer = gl.createBuffer(); this.indexBuffer = gl.createBuffer(); - // bind and upload the vertexs.. // keep a reference to the vertexFloatData.. this.vertexArray = new Float32Array([0.0, 0.0, @@ -394,11 +396,7 @@ 1.0, 1.0]); gl.bindBuffer(gl.ARRAY_BUFFER, this.vertexBuffer); - gl.bufferData( - gl.ARRAY_BUFFER, - this.vertexArray, - gl.STATIC_DRAW); - + gl.bufferData(gl.ARRAY_BUFFER, this.vertexArray, gl.STATIC_DRAW); // bind and upload the uv buffer this.uvArray = new Float32Array([0.0, 0.0, @@ -407,10 +405,7 @@ 1.0, 1.0]); gl.bindBuffer(gl.ARRAY_BUFFER, this.uvBuffer); - gl.bufferData( - gl.ARRAY_BUFFER, - this.uvArray, - gl.STATIC_DRAW); + gl.bufferData(gl.ARRAY_BUFFER, this.uvArray, gl.STATIC_DRAW); this.colorArray = new Float32Array([1.0, 0xFFFFFF, 1.0, 0xFFFFFF, @@ -418,21 +413,17 @@ 1.0, 0xFFFFFF]); gl.bindBuffer(gl.ARRAY_BUFFER, this.colorBuffer); - gl.bufferData( - gl.ARRAY_BUFFER, - this.colorArray, - gl.STATIC_DRAW); + gl.bufferData(gl.ARRAY_BUFFER, this.colorArray, gl.STATIC_DRAW); // bind and upload the index gl.bindBuffer(gl.ELEMENT_ARRAY_BUFFER, this.indexBuffer); - gl.bufferData( - gl.ELEMENT_ARRAY_BUFFER, - new Uint16Array([0, 1, 2, 1, 3, 2]), - gl.STATIC_DRAW); + gl.bufferData(gl.ELEMENT_ARRAY_BUFFER, new Uint16Array([0, 1, 2, 1, 3, 2]), gl.STATIC_DRAW); + }; /** -* Destroys the filter and removes it from the filter stack +* Destroys the filter and removes it from the filter stack. +* * @method destroy */ PIXI.WebGLFilterManager.prototype.destroy = function() diff --git a/src/pixi/renderers/webgl/utils/WebGLGraphics.js b/src/pixi/renderers/webgl/utils/WebGLGraphics.js index 4de401d..9ea5a53 100644 --- a/src/pixi/renderers/webgl/utils/WebGLGraphics.js +++ b/src/pixi/renderers/webgl/utils/WebGLGraphics.js @@ -11,7 +11,6 @@ */ PIXI.WebGLGraphics = function() { - }; /** @@ -120,7 +119,6 @@ webGL.data = []; webGL.lastIndex = 0; } - var webGLData; @@ -131,8 +129,6 @@ { var data = graphics.graphicsData[i]; - - if(data.type === PIXI.Graphics.POLY) { // need to add the points the the graphics object.. @@ -189,7 +185,6 @@ } } - webGL.lastIndex++; } @@ -201,7 +196,13 @@ } }; - +/** + * @static + * @private + * @method switchMode + * @param webGL {WebGLContext} + * @param type {Number} + */ PIXI.WebGLGraphics.switchMode = function(webGL, type) { var webGLData; @@ -308,7 +309,6 @@ */ PIXI.WebGLGraphics.buildRoundedRectangle = function(graphicsData, webGLData) { - var points = graphicsData.points; var x = points[0]; var y = points[1]; @@ -316,7 +316,6 @@ var height = points[3]; var radius = points[4]; - var recPoints = []; recPoints.push(x, y + radius); recPoints = recPoints.concat(PIXI.WebGLGraphics.quadraticBezierCurve(x, y + height - radius, x, y + height, x + radius, y + height)); @@ -324,7 +323,6 @@ recPoints = recPoints.concat(PIXI.WebGLGraphics.quadraticBezierCurve(x + width, y + radius, x + width, y, x + width - radius, y)); recPoints = recPoints.concat(PIXI.WebGLGraphics.quadraticBezierCurve(x + radius, y, x, y, x, y + radius)); - if (graphicsData.fill) { var color = PIXI.hex2rgb(graphicsData.fillColor); var alpha = graphicsData.fillAlpha; @@ -368,8 +366,8 @@ }; /** - * Calcul the points for a quadratic bezier curve. (helper function..) - * Based on : https://stackoverflow.com/questions/785097/how-do-i-implement-a-bezier-curve-in-c + * Calculate the points for a quadratic bezier curve. (helper function..) + * Based on: https://stackoverflow.com/questions/785097/how-do-i-implement-a-bezier-curve-in-c * * @static * @private @@ -383,6 +381,7 @@ * @return {Array} */ PIXI.WebGLGraphics.quadraticBezierCurve = function(fromX, fromY, cpX, cpY, toX, toY) { + var xa, ya, xb, @@ -718,13 +717,12 @@ * * @static * @private - * @method buildPoly + * @method buildComplexPoly * @param graphicsData {Graphics} The graphics object containing all the necessary properties * @param webGLData {Object} */ PIXI.WebGLGraphics.buildComplexPoly = function(graphicsData, webGLData) { - //TODO - no need to copy this as it gets turned into a FLoat32Array anyways.. var points = graphicsData.points.slice(); if(points.length < 6)return; @@ -776,6 +774,15 @@ }; +/** + * Builds a polygon to draw + * + * @static + * @private + * @method buildPoly + * @param graphicsData {Graphics} The graphics object containing all the necessary properties + * @param webGLData {Object} + */ PIXI.WebGLGraphics.buildPoly = function(graphicsData, webGLData) { var points = graphicsData.points; @@ -818,6 +825,11 @@ PIXI.WebGLGraphics.graphicsDataPool = []; +/** + * @class WebGLGraphicsData + * @private + * @static + */ PIXI.WebGLGraphicsData = function(gl) { this.gl = gl; @@ -834,6 +846,9 @@ this.dirty = true; }; +/** + * @method reset + */ PIXI.WebGLGraphicsData.prototype.reset = function() { this.points = []; @@ -841,6 +856,9 @@ this.lastIndex = 0; }; +/** + * @method upload + */ PIXI.WebGLGraphicsData.prototype.upload = function() { var gl = this.gl; diff --git a/src/pixi/renderers/webgl/utils/WebGLMaskManager.js b/src/pixi/renderers/webgl/utils/WebGLMaskManager.js index 181f560..607d5dd 100644 --- a/src/pixi/renderers/webgl/utils/WebGLMaskManager.js +++ b/src/pixi/renderers/webgl/utils/WebGLMaskManager.js @@ -5,16 +5,17 @@ /** * @class WebGLMaskManager * @constructor -* @param gl {WebGLContext} the current WebGL drawing context * @private */ PIXI.WebGLMaskManager = function() { - //this.setContext(gl); }; +PIXI.WebGLMaskManager.prototype.constructor = PIXI.WebGLMaskManager; + /** -* Sets the drawing context to the one given in parameter +* Sets the drawing context to the one given in parameter. +* * @method setContext * @param gl {WebGLContext} the current WebGL drawing context */ @@ -24,10 +25,11 @@ }; /** -* Applies the Mask and adds it to the current filter stack +* Applies the Mask and adds it to the current filter stack. +* * @method pushMask * @param maskData {Array} -* @param renderSession {RenderSession} +* @param renderSession {Object} */ PIXI.WebGLMaskManager.prototype.pushMask = function(maskData, renderSession) { @@ -44,10 +46,11 @@ }; /** -* Removes the last filter from the filter stack and doesn't return it +* Removes the last filter from the filter stack and doesn't return it. +* * @method popMask -* -* @param renderSession {RenderSession} an object containing all the useful parameters +* @param maskData {Array} +* @param renderSession {Object} an object containing all the useful parameters */ PIXI.WebGLMaskManager.prototype.popMask = function(maskData, renderSession) { @@ -55,9 +58,9 @@ renderSession.stencilManager.popStencil(maskData, maskData._webGL[gl.id].data[0], renderSession); }; - /** -* Destroys the mask stack +* Destroys the mask stack. +* * @method destroy */ PIXI.WebGLMaskManager.prototype.destroy = function() diff --git a/src/pixi/renderers/webgl/utils/WebGLShaderManager.js b/src/pixi/renderers/webgl/utils/WebGLShaderManager.js index b597698..a15974e 100644 --- a/src/pixi/renderers/webgl/utils/WebGLShaderManager.js +++ b/src/pixi/renderers/webgl/utils/WebGLShaderManager.js @@ -5,38 +5,54 @@ /** * @class WebGLShaderManager * @constructor -* @param gl {WebGLContext} the current WebGL drawing context * @private */ PIXI.WebGLShaderManager = function() { - + /** + * @property maxAttibs + * @type Number + */ this.maxAttibs = 10; + + /** + * @property attribState + * @type Array + */ this.attribState = []; + + /** + * @property tempAttribState + * @type Array + */ this.tempAttribState = []; - for (var i = 0; i < this.maxAttibs; i++) { + for (var i = 0; i < this.maxAttibs; i++) + { this.attribState[i] = false; } + /** + * @property stack + * @type Array + */ this.stack = []; - - //this.setContext(gl); - // the final one is used for the rendering strips + }; +PIXI.WebGLShaderManager.prototype.constructor = PIXI.WebGLShaderManager; /** -* Initialises the context and the properties +* Initialises the context and the properties. +* * @method setContext * @param gl {WebGLContext} the current WebGL drawing context -* @param transparent {Boolean} Whether or not the drawing context should be transparent */ PIXI.WebGLShaderManager.prototype.setContext = function(gl) { this.gl = gl; - // the next one is used for rendering primatives + // the next one is used for rendering primitives this.primitiveShader = new PIXI.PrimitiveShader(gl); // the next one is used for rendering triangle strips @@ -53,16 +69,15 @@ this.setShader(this.defaultShader); }; - /** -* Takes the attributes given in parameters +* Takes the attributes given in parameters. +* * @method setAttribs * @param attribs {Array} attribs */ PIXI.WebGLShaderManager.prototype.setAttribs = function(attribs) { // reset temp state - var i; for (i = 0; i < this.tempAttribState.length; i++) @@ -97,6 +112,12 @@ } }; +/** +* Sets the current shader. +* +* @method setShader +* @param shader {Any} +*/ PIXI.WebGLShaderManager.prototype.setShader = function(shader) { if(this._currentId === shader._UID)return false; @@ -112,7 +133,8 @@ }; /** -* Destroys +* Destroys this object. +* * @method destroy */ PIXI.WebGLShaderManager.prototype.destroy = function() @@ -133,4 +155,3 @@ this.gl = null; }; - diff --git a/src/pixi/renderers/webgl/utils/WebGLShaderUtils.js b/src/pixi/renderers/webgl/utils/WebGLShaderUtils.js index f6cc024..88461d1 100644 --- a/src/pixi/renderers/webgl/utils/WebGLShaderUtils.js +++ b/src/pixi/renderers/webgl/utils/WebGLShaderUtils.js @@ -2,27 +2,44 @@ * @author Mat Groves http://matgroves.com/ @Doormat23 */ -// TODO Alvin and Mat -// Should we eventually create a Utils class ? -// Or just move this file to the pixi.js file ? +/** +* @method initDefaultShaders +* @private +*/ PIXI.initDefaultShaders = function() { - - // PIXI.stripShader = new PIXI.StripShader(); -// PIXI.stripShader.init(); - }; +/** +* @method CompileVertexShader +* @param gl {WebGLContext} the current WebGL drawing context +* @param shaderSrc {Array} +* @return {Any} +*/ PIXI.CompileVertexShader = function(gl, shaderSrc) { return PIXI._CompileShader(gl, shaderSrc, gl.VERTEX_SHADER); }; +/** +* @method CompileFragmentShader +* @param gl {WebGLContext} the current WebGL drawing context +* @param shaderSrc {Array} +* @return {Any} +*/ PIXI.CompileFragmentShader = function(gl, shaderSrc) { return PIXI._CompileShader(gl, shaderSrc, gl.FRAGMENT_SHADER); }; +/** +* @method _CompileShader +* @private +* @param gl {WebGLContext} the current WebGL drawing context +* @param shaderSrc {Array} +* @param shaderType {Number} +* @return {Any} +*/ PIXI._CompileShader = function(gl, shaderSrc, shaderType) { var src = shaderSrc.join("\n"); @@ -30,14 +47,22 @@ gl.shaderSource(shader, src); gl.compileShader(shader); - if (!gl.getShaderParameter(shader, gl.COMPILE_STATUS)) { - window.console.log(gl.getShaderInfoLog(shader)); + if (!gl.getShaderParameter(shader, gl.COMPILE_STATUS)) + { + console.log(gl.getShaderInfoLog(shader)); return null; } return shader; }; +/** +* @method compileProgram +* @param gl {WebGLContext} the current WebGL drawing context +* @param vertexSrc {Array} +* @param fragmentSrc {Array} +* @return {Any} +*/ PIXI.compileProgram = function(gl, vertexSrc, fragmentSrc) { var fragmentShader = PIXI.CompileFragmentShader(gl, fragmentSrc); @@ -49,8 +74,9 @@ gl.attachShader(shaderProgram, fragmentShader); gl.linkProgram(shaderProgram); - if (!gl.getProgramParameter(shaderProgram, gl.LINK_STATUS)) { - window.console.log("Could not initialise shaders"); + if (!gl.getProgramParameter(shaderProgram, gl.LINK_STATUS)) + { + console.log("Could not initialise shaders"); } return shaderProgram; diff --git a/src/pixi/renderers/webgl/utils/WebGLSpriteBatch.js b/src/pixi/renderers/webgl/utils/WebGLSpriteBatch.js index 4d59c80..f8a4bd7 100755 --- a/src/pixi/renderers/webgl/utils/WebGLSpriteBatch.js +++ b/src/pixi/renderers/webgl/utils/WebGLSpriteBatch.js @@ -13,15 +13,10 @@ * @class WebGLSpriteBatch * @private * @constructor - * @param gl {WebGLContext} the current WebGL drawing context - * */ PIXI.WebGLSpriteBatch = function() { - /** - * - * * @property vertSize * @type Number */ @@ -47,7 +42,6 @@ */ this.vertices = new Float32Array(numVerts); - //index data /** * Holds the indices * @@ -56,6 +50,10 @@ */ this.indices = new Uint16Array(numIndices); + /** + * @property lastIndexCount + * @type Number + */ this.lastIndexCount = 0; for (var i=0, j=0; i < numIndices; i += 6, j += 4) @@ -68,20 +66,58 @@ this.indices[i + 5] = j + 3; } - + /** + * @property drawing + * @type Boolean + */ this.drawing = false; - this.currentBatchSize = 0; - this.currentBaseTexture = null; - -// this.setContext(gl); + /** + * @property currentBatchSize + * @type Number + */ + this.currentBatchSize = 0; + + /** + * @property currentBaseTexture + * @type BaseTexture + */ + this.currentBaseTexture = null; + + /** + * @property dirty + * @type Boolean + */ this.dirty = true; + /** + * @property textures + * @type Array + */ this.textures = []; + + /** + * @property blendModes + * @type Array + */ this.blendModes = []; + + /** + * @property shaders + * @type Array + */ this.shaders = []; + + /** + * @property sprites + * @type Array + */ this.sprites = []; + /** + * @property defaultShader + * @type AbstractFilter + */ this.defaultShader = new PIXI.AbstractFilter([ 'precision lowp float;', 'varying vec2 vTextureCoord;', @@ -94,9 +130,7 @@ }; /** -* * @method setContext -* * @param gl {WebGLContext} the current WebGL drawing context */ PIXI.WebGLSpriteBatch.prototype.setContext = function(gl) @@ -109,7 +143,6 @@ // 65535 is max index, so 65535 / 6 = 10922. - //upload the index data gl.bindBuffer(gl.ELEMENT_ARRAY_BUFFER, this.indexBuffer); gl.bufferData(gl.ELEMENT_ARRAY_BUFFER, this.indices, gl.STATIC_DRAW); @@ -125,15 +158,12 @@ shader.uniforms = {}; shader.init(); - this.defaultShader.shaders[gl.id] = shader; }; /** -* * @method begin -* -* @param renderSession {RenderSession} the RenderSession +* @param renderSession {Object} The RenderSession object */ PIXI.WebGLSpriteBatch.prototype.begin = function(renderSession) { @@ -144,9 +174,7 @@ }; /** -* * @method end -* */ PIXI.WebGLSpriteBatch.prototype.end = function() { @@ -154,16 +182,13 @@ }; /** -* * @method render -* * @param sprite {Sprite} the sprite to render when using this spritebatch */ PIXI.WebGLSpriteBatch.prototype.render = function(sprite) { var texture = sprite.texture; - //TODO set blend modes.. // check texture.. if(this.currentBatchSize >= this.size) @@ -270,9 +295,9 @@ }; /** -* Renders a tilingSprite using the spriteBatch -* @method renderTilingSprite +* Renders a TilingSprite using the spriteBatch. * +* @method renderTilingSprite * @param sprite {TilingSprite} the tilingSprite to render */ PIXI.WebGLSpriteBatch.prototype.renderTilingSprite = function(tilingSprite) @@ -390,12 +415,10 @@ this.sprites[this.currentBatchSize++] = tilingSprite; }; - /** -* Renders the content and empties the current batch +* Renders the content and empties the current batch. * * @method flush -* */ PIXI.WebGLSpriteBatch.prototype.flush = function() { @@ -516,6 +539,12 @@ this.currentBatchSize = 0; }; +/** +* @method renderBatch +* @param texture {Texture} +* @param size {Number} +* @param startIndex {Number} +*/ PIXI.WebGLSpriteBatch.prototype.renderBatch = function(texture, size, startIndex) { if(size === 0)return; @@ -532,7 +561,6 @@ // bind the current texture gl.bindTexture(gl.TEXTURE_2D, texture._glTextures[gl.id]); } - // now draw those suckas! gl.drawElements(gl.TRIANGLES, size * 6, gl.UNSIGNED_SHORT, startIndex * 6 * 2); @@ -541,11 +569,8 @@ this.renderSession.drawCount++; }; - /** -* * @method stop -* */ PIXI.WebGLSpriteBatch.prototype.stop = function() { @@ -554,9 +579,7 @@ }; /** -* * @method start -* */ PIXI.WebGLSpriteBatch.prototype.start = function() { @@ -564,12 +587,12 @@ }; /** -* Destroys the SpriteBatch +* Destroys the SpriteBatch. +* * @method destroy */ PIXI.WebGLSpriteBatch.prototype.destroy = function() { - this.vertices = null; this.indices = null; diff --git a/src/pixi/renderers/webgl/utils/WebGLStencilManager.js b/src/pixi/renderers/webgl/utils/WebGLStencilManager.js index f841e6f..367d7dc 100644 --- a/src/pixi/renderers/webgl/utils/WebGLStencilManager.js +++ b/src/pixi/renderers/webgl/utils/WebGLStencilManager.js @@ -5,21 +5,18 @@ /** * @class WebGLStencilManager * @constructor -* @param gl {WebGLContext} the current WebGL drawing context * @private */ PIXI.WebGLStencilManager = function() { - this.stencilStack = []; - //this.setContext(gl); this.reverse = true; this.count = 0; - }; /** -* Sets the drawing context to the one given in parameter +* Sets the drawing context to the one given in parameter. +* * @method setContext * @param gl {WebGLContext} the current WebGL drawing context */ @@ -29,10 +26,12 @@ }; /** -* Applies the Mask and adds it to the current filter stack +* Applies the Mask and adds it to the current filter stack. +* * @method pushMask -* @param maskData {Array} -* @param renderSession {RenderSession} +* @param graphics {Graphics} +* @param webGLData {Array} +* @param renderSession {Object} */ PIXI.WebGLStencilManager.prototype.pushStencil = function(graphics, webGLData, renderSession) { @@ -60,7 +59,6 @@ if(webGLData.mode === 1) { - gl.drawElements(gl.TRIANGLE_FAN, webGLData.indices.length - 4, gl.UNSIGNED_SHORT, 0 ); if(this.reverse) @@ -119,7 +117,14 @@ this.count++; }; -//TODO this does not belong here! +/** + * TODO this does not belong here! + * + * @method bindGraphics + * @param graphics {Graphics} + * @param webGLData {Array} + * @param renderSession {Object} + */ PIXI.WebGLStencilManager.prototype.bindGraphics = function(graphics, webGLData, renderSession) { //if(this._currentGraphics === graphics)return; @@ -182,6 +187,12 @@ } }; +/** + * @method popStencil + * @param graphics {Graphics} + * @param webGLData {Array} + * @param renderSession {Object} + */ PIXI.WebGLStencilManager.prototype.popStencil = function(graphics, webGLData, renderSession) { var gl = this.gl; @@ -272,7 +283,8 @@ }; /** -* Destroys the mask stack +* Destroys the mask stack. +* * @method destroy */ PIXI.WebGLStencilManager.prototype.destroy = function() diff --git a/src/pixi/utils/Detector.js b/src/pixi/utils/Detector.js index c0bd1ed..33a97a9 100644 --- a/src/pixi/utils/Detector.js +++ b/src/pixi/utils/Detector.js @@ -44,9 +44,10 @@ /** * This helper function will automatically detect which renderer you should be using. * This function is very similar to the autoDetectRenderer function except that is will return a canvas renderer for android. - * Even thought both android chrome suports webGL the canvas implementation perform better at the time of writing. - * This function will likely change and update as webGL performance imporoves on thease devices. - * @class getRecommendedRenderer + * Even thought both android chrome supports webGL the canvas implementation perform better at the time of writing. + * This function will likely change and update as webGL performance improves on these devices. + * + * @class autoDetectRecommendedRenderer * @static * @param width=800 {Number} the width of the renderers view * @param height=600 {Number} the height of the renderers view diff --git a/src/pixi/InteractionData.js b/src/pixi/InteractionData.js index ea77370..fa84a6d 100644 --- a/src/pixi/InteractionData.js +++ b/src/pixi/InteractionData.js @@ -18,7 +18,6 @@ */ this.global = new PIXI.Point(); - /** * The target Sprite that was interacted with * diff --git a/src/pixi/InteractionManager.js b/src/pixi/InteractionManager.js index 685c386..71f320b 100644 --- a/src/pixi/InteractionManager.js +++ b/src/pixi/InteractionManager.js @@ -14,7 +14,7 @@ PIXI.InteractionManager = function(stage) { /** - * a reference to the stage + * A reference to the stage * * @property stage * @type Stage @@ -22,7 +22,7 @@ this.stage = stage; /** - * the mouse data + * The mouse data * * @property mouse * @type InteractionData @@ -30,18 +30,21 @@ this.mouse = new PIXI.InteractionData(); /** - * an object that stores current touches (InteractionData) by id reference + * An object that stores current touches (InteractionData) by id reference * * @property touches * @type Object */ this.touches = {}; - // helpers + /** + * @property tempPoint + * @type Point + * @private + */ this.tempPoint = new PIXI.Point(); /** - * * @property mouseoverEnabled * @type Boolean * @default @@ -49,7 +52,7 @@ this.mouseoverEnabled = true; /** - * tiny little interactiveData pool ! + * Tiny little interactiveData pool ! * * @property pool * @type Array @@ -61,7 +64,6 @@ * @property interactiveItems * @type Array * @private - * */ this.interactiveItems = []; @@ -73,23 +75,60 @@ */ this.interactionDOMElement = null; - //this will make it so that you dont have to call bind all the time + //this will make it so that you don't have to call bind all the time + + /** + * @property onMouseMove + * @type Function + */ this.onMouseMove = this.onMouseMove.bind( this ); + + /** + * @property onMouseDown + * @type Function + */ this.onMouseDown = this.onMouseDown.bind(this); + + /** + * @property onMouseOut + * @type Function + */ this.onMouseOut = this.onMouseOut.bind(this); + + /** + * @property onMouseUp + * @type Function + */ this.onMouseUp = this.onMouseUp.bind(this); + /** + * @property onTouchStart + * @type Function + */ this.onTouchStart = this.onTouchStart.bind(this); + + /** + * @property onTouchEnd + * @type Function + */ this.onTouchEnd = this.onTouchEnd.bind(this); + + /** + * @property onTouchMove + * @type Function + */ this.onTouchMove = this.onTouchMove.bind(this); + /** + * @property last + * @type Number + */ this.last = 0; /** * The css style of the cursor that is being used * @property currentCursorStyle * @type String - * */ this.currentCursorStyle = 'inherit'; @@ -97,10 +136,13 @@ * Is set to true when the mouse is moved out of the canvas * @property mouseOut * @type Boolean - * */ this.mouseOut = false; + /** + * @property resolution + * @type Number + */ this.resolution = 1; }; @@ -166,7 +208,6 @@ this.setTargetDomElement (target.view); }; - /** * Sets the DOM element which will receive mouse/touch events. This is useful for when you have other DOM * elements on top of the renderers Canvas element. With this you'll be able to delegate another DOM element @@ -201,7 +242,10 @@ window.addEventListener('mouseup', this.onMouseUp, true); }; - +/** + * @method removeEvents + * @private + */ PIXI.InteractionManager.prototype.removeEvents = function() { if (!this.interactionDOMElement) return; @@ -308,6 +352,10 @@ } }; +/** + * @method rebuildInteractiveGraph + * @private + */ PIXI.InteractionManager.prototype.rebuildInteractiveGraph = function() { this.dirty = false; @@ -427,10 +475,10 @@ }; /** - * Is called when the mouse button is moved out of the renderer element + * Is called when the mouse is moved out of the renderer element * * @method onMouseOut - * @param event {Event} The DOM event of a mouse button being moved out + * @param event {Event} The DOM event of a mouse being moved out * @private */ PIXI.InteractionManager.prototype.onMouseOut = function(event) diff --git a/src/pixi/renderers/webgl/WebGLRenderer.js b/src/pixi/renderers/webgl/WebGLRenderer.js index 968fd3d..422896f 100644 --- a/src/pixi/renderers/webgl/WebGLRenderer.js +++ b/src/pixi/renderers/webgl/WebGLRenderer.js @@ -5,23 +5,21 @@ PIXI.glContexts = []; // this is where we store the webGL contexts for easy access. /** - * the WebGLRenderer draws the stage and all its content onto a webGL enabled canvas. This renderer - * should be used for browsers that support webGL. This Render works by automatically managing webGLBatch's. - * So no need for Sprite Batch's or Sprite Cloud's - * Dont forget to add the view to your DOM or you will not see anything :) + * The WebGLRenderer draws the stage and all its content onto a webGL enabled canvas. This renderer + * should be used for browsers that support webGL. This Render works by automatically managing webGLBatchs. + * So no need for Sprite Batches or Sprite Clouds. + * Don't forget to add the view to your DOM or you will not see anything :) * * @class WebGLRenderer * @constructor * @param [width=0] {Number} the width of the canvas view * @param [height=0] {Number} the height of the canvas view - * * @param [options] {Object} The optional renderer parameters * @param [options.view] {HTMLCanvasElement} the canvas to use as a view, optional * @param [options.transparent=false] {Boolean} If the render view is transparent, default false * @param [options.antialias=false] {Boolean} sets antialias (only applicable in chrome at the moment) * @param [options.preserveDrawingBuffer=false] {Boolean} enables drawing buffer preservation, enable this if you need to call toDataUrl on the webgl context * @param [options.resolution=1] {Number} the resolution of the renderer retina would be 2 - * */ PIXI.WebGLRenderer = function(width, height, options) { @@ -37,13 +35,16 @@ options = PIXI.defaultRenderOptions; } - if(!PIXI.defaultRenderer) { PIXI.sayHello('webGL'); PIXI.defaultRenderer = this; } + /** + * @property type + * @type Number + */ this.type = PIXI.WEBGL_RENDERER; /** @@ -56,6 +57,7 @@ this.resolution = options.resolution; // do a catch.. only 1 webGL renderer.. + /** * Whether the render view is transparent * @@ -99,12 +101,27 @@ this.view = options.view || document.createElement( 'canvas' ); // deal with losing context.. + + /** + * @property contextLostBound + * @type Function + */ this.contextLostBound = this.handleContextLost.bind(this); + + /** + * @property contextRestoredBound + * @type Function + */ this.contextRestoredBound = this.handleContextRestored.bind(this); this.view.addEventListener('webglcontextlost', this.contextLostBound, false); this.view.addEventListener('webglcontextrestored', this.contextRestoredBound, false); + /** + * @property _contextOptions + * @type Object + * @private + */ this._contextOptions = { alpha: this.transparent, antialias: options.antialias, // SPEED UP?? @@ -113,18 +130,67 @@ preserveDrawingBuffer: options.preserveDrawingBuffer }; + /** + * @property projection + * @type Point + */ this.projection = new PIXI.Point(); + + /** + * @property offset + * @type Point + */ this.offset = new PIXI.Point(0, 0); - // time to create the render managers! each one focuses on managine a state in webGL - 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(); // manages the stencil buffer - this.blendModeManager = new PIXI.WebGLBlendModeManager(); // manages the blendModes + // time to create the render managers! each one focuses on managing a state in webGL - // TODO remove + /** + * Deals with managing the shader programs and their attribs + * @property shaderManager + * @type WebGLShaderManager + */ + this.shaderManager = new PIXI.WebGLShaderManager(); + + /** + * Manages the rendering of sprites + * @property spriteBatch + * @type WebGLSpriteBatch + */ + this.spriteBatch = new PIXI.WebGLSpriteBatch(); + + /** + * Manages the masks using the stencil buffer + * @property maskManager + * @type WebGLMaskManager + */ + this.maskManager = new PIXI.WebGLMaskManager(); + + /** + * Manages the filters + * @property filterManager + * @type WebGLFilterManager + */ + this.filterManager = new PIXI.WebGLFilterManager(); + + /** + * Manages the stencil buffer + * @property stencilManager + * @type WebGLStencilManager + */ + this.stencilManager = new PIXI.WebGLStencilManager(); + + /** + * Manages the blendModes + * @property blendModeManager + * @type WebGLBlendModeManager + */ + this.blendModeManager = new PIXI.WebGLBlendModeManager(); + + /** + * TODO remove + * @property renderSession + * @type Object + */ this.renderSession = {}; this.renderSession.gl = this.gl; this.renderSession.drawCount = 0; @@ -147,6 +213,9 @@ // constructor PIXI.WebGLRenderer.prototype.constructor = PIXI.WebGLRenderer; +/** +* @method initContext +*/ PIXI.WebGLRenderer.prototype.initContext = function() { var gl = this.view.getContext('webgl', this._contextOptions) || this.view.getContext('experimental-webgl', this._contextOptions); @@ -180,7 +249,6 @@ this.resize(this.width, this.height); }; - /** * Renders the stage to its webGL view * @@ -205,9 +273,7 @@ // update the scene graph stage.updateTransform(); - var gl = this.gl; - // interaction if(stage._interactive) @@ -249,9 +315,9 @@ }; /** - * Renders a display Object + * Renders a Display Object. * - * @method renderDIsplayObject + * @method renderDisplayObject * @param displayObject {DisplayObject} The DisplayObject to render * @param projection {Point} The projection * @param buffer {Array} a standard WebGL buffer @@ -283,7 +349,7 @@ }; /** - * resizes the webGL view to the specified width and height + * Resizes the webGL view to the specified width and height. * * @method resize * @param width {Number} the new width of the webGL view @@ -297,10 +363,6 @@ this.view.width = this.width; this.view.height = this.height; - // this.view.style.width = width + 'px'; - // this.view.style.height = height + 'px'; - - // console.log(this.width / this.resolution) this.gl.viewport(0, 0, this.width, this.height); this.projection.x = this.width / 2 / this.resolution; @@ -308,10 +370,10 @@ }; /** - * Updates and Creates a WebGL texture for the renderers context + * Updates and Creates a WebGL texture for the renderers context. * * @method updateTexture - * @param texture {Texture} the texture to render + * @param texture {Texture} the texture to update */ PIXI.WebGLRenderer.prototype.updateTexture = function(texture) { @@ -411,6 +473,11 @@ this.renderSession = null; }; +/** + * Maps Pixi blend modes to WebGL blend modes. + * + * @method mapBlendModes + */ PIXI.WebGLRenderer.prototype.mapBlendModes = function() { var gl = this.gl; diff --git a/src/pixi/renderers/webgl/shaders/ComplexPrimitiveShader.js b/src/pixi/renderers/webgl/shaders/ComplexPrimitiveShader.js index daa8b64..79d038a 100644 --- a/src/pixi/renderers/webgl/shaders/ComplexPrimitiveShader.js +++ b/src/pixi/renderers/webgl/shaders/ComplexPrimitiveShader.js @@ -9,7 +9,13 @@ */ PIXI.ComplexPrimitiveShader = function(gl) { + /** + * @property _UID + * @type Number + * @private + */ this._UID = PIXI._UID++; + /** * @property gl * @type WebGLContext @@ -17,18 +23,20 @@ this.gl = gl; /** - * @property {any} program - The WebGL program. - */ + * The WebGL program. + * @property program + * @type {Any} + */ this.program = null; /** + * The fragment shader. * @property fragmentSrc * @type Array */ this.fragmentSrc = [ - 'precision mediump float;', - + 'precision mediump float;', 'varying vec4 vColor;', @@ -38,6 +46,7 @@ ]; /** + * The vertex shader. * @property vertexSrc * @type Array */ @@ -65,14 +74,15 @@ this.init(); }; +PIXI.ComplexPrimitiveShader.prototype.constructor = PIXI.ComplexPrimitiveShader; + /** -* Initialises the shader +* Initialises the shader. +* * @method init -* */ PIXI.ComplexPrimitiveShader.prototype.init = function() { - var gl = this.gl; var program = PIXI.compileProgram(gl, this.vertexSrc, this.fragmentSrc); @@ -84,7 +94,6 @@ this.tintColor = gl.getUniformLocation(program, 'tint'); this.color = gl.getUniformLocation(program, 'color'); - // get and store the attributes this.aVertexPosition = gl.getAttribLocation(program, 'aVertexPosition'); // this.colorAttribute = gl.getAttribLocation(program, 'aColor'); @@ -98,9 +107,9 @@ }; /** -* Destroys the shader +* Destroys the shader. +* * @method destroy -* */ PIXI.ComplexPrimitiveShader.prototype.destroy = function() { diff --git a/src/pixi/renderers/webgl/shaders/PixiFastShader.js b/src/pixi/renderers/webgl/shaders/PixiFastShader.js index 4fb3fe2..bb46419 100644 --- a/src/pixi/renderers/webgl/shaders/PixiFastShader.js +++ b/src/pixi/renderers/webgl/shaders/PixiFastShader.js @@ -1,6 +1,5 @@ /** * @author Mat Groves http://matgroves.com/ @Doormat23 - * @author Richard Davey http://www.photonstorm.com @photonstorm */ /** @@ -10,6 +9,11 @@ */ PIXI.PixiFastShader = function(gl) { + /** + * @property _UID + * @type Number + * @private + */ this._UID = PIXI._UID++; /** @@ -19,12 +23,16 @@ this.gl = gl; /** - * @property {any} program - The WebGL program. + * The WebGL program. + * @property program + * @type {Any} */ this.program = null; /** - * @property {array} fragmentSrc - The fragment shader. + * The fragment shader. + * @property fragmentSrc + * @type Array */ this.fragmentSrc = [ 'precision lowp float;', @@ -37,8 +45,10 @@ ]; /** - * @property {array} vertexSrc - The vertex shader - */ + * The vertex shader. + * @property vertexSrc + * @type Array + */ this.vertexSrc = [ 'attribute vec2 aVertexPosition;', 'attribute vec2 aPositionCoord;', @@ -69,24 +79,25 @@ '}' ]; - /** - * @property {number} textureCount - A local texture counter for multi-texture shaders. - */ + * A local texture counter for multi-texture shaders. + * @property textureCount + * @type Number + */ this.textureCount = 0; - this.init(); }; +PIXI.PixiFastShader.prototype.constructor = PIXI.PixiFastShader; + /** -* Initialises the shader +* Initialises the shader. +* * @method init -* */ PIXI.PixiFastShader.prototype.init = function() { - var gl = this.gl; var program = PIXI.compileProgram(gl, this.vertexSrc, this.fragmentSrc); @@ -111,8 +122,6 @@ this.aTextureCoord = gl.getAttribLocation(program, 'aTextureCoord'); this.colorAttribute = gl.getAttribLocation(program, 'aColor'); - - // Begin worst hack eva // // WHY??? ONLY on my chrome pixel the line above returns -1 when using filters? @@ -128,14 +137,13 @@ // End worst hack eva // - this.program = program; }; /** -* Destroys the shader +* Destroys the shader. +* * @method destroy -* */ PIXI.PixiFastShader.prototype.destroy = function() { diff --git a/src/pixi/renderers/webgl/shaders/PixiShader.js b/src/pixi/renderers/webgl/shaders/PixiShader.js index d76ec03..725dce2 100644 --- a/src/pixi/renderers/webgl/shaders/PixiShader.js +++ b/src/pixi/renderers/webgl/shaders/PixiShader.js @@ -6,9 +6,15 @@ /** * @class PixiShader * @constructor +* @param gl {WebGLContext} the current WebGL drawing context */ PIXI.PixiShader = function(gl) { + /** + * @property _UID + * @type Number + * @private + */ this._UID = PIXI._UID++; /** @@ -18,13 +24,17 @@ this.gl = gl; /** - * @property {any} program - The WebGL program. - */ + * The WebGL program. + * @property program + * @type {Any} + */ this.program = null; /** - * @property {array} fragmentSrc - The fragment shader. - */ + * The fragment shader. + * @property fragmentSrc + * @type Array + */ this.fragmentSrc = [ 'precision lowp float;', 'varying vec2 vTextureCoord;', @@ -36,21 +46,44 @@ ]; /** - * @property {number} textureCount - A local texture counter for multi-texture shaders. - */ + * A local texture counter for multi-texture shaders. + * @property textureCount + * @type Number + */ this.textureCount = 0; + + /** + * A local flag + * @property firstRun + * @type Boolean + * @private + */ this.firstRun = true; + + /** + * A dirty flag + * @property dirty + * @type Boolean + */ this.dirty = true; + /** + * Uniform attributes cache. + * @property attributes + * @type Array + * @private + */ this.attributes = []; this.init(); }; +PIXI.PixiShader.prototype.constructor = PIXI.PixiShader; + /** -* Initialises the shader +* Initialises the shader. +* * @method init -* */ PIXI.PixiShader.prototype.init = function() { @@ -71,12 +104,11 @@ this.aTextureCoord = gl.getAttribLocation(program, 'aTextureCoord'); this.colorAttribute = gl.getAttribLocation(program, 'aColor'); - // Begin worst hack eva // // WHY??? ONLY on my chrome pixel the line above returns -1 when using filters? // maybe its something to do with the current state of the gl context. - // Im convinced this is a bug in the chrome browser as there is NO reason why this should be returning -1 especially as it only manifests on my chrome pixel + // I'm convinced this is a bug in the chrome browser as there is NO reason why this should be returning -1 especially as it only manifests on my chrome pixel // If theres any webGL people that know why could happen please help :) if(this.colorAttribute === -1) { @@ -101,6 +133,7 @@ /** * Initialises the shader uniform values. +* * Uniforms are specified in the GLSL_ES Specification: http://www.khronos.org/registry/webgl/specs/latest/1.0/ * http://www.khronos.org/registry/gles/specs/2.0/GLSL_ES_Specification_1.0.17.pdf * @@ -316,7 +349,8 @@ }; /** -* Destroys the shader +* Destroys the shader. +* * @method destroy */ PIXI.PixiShader.prototype.destroy = function() @@ -329,7 +363,8 @@ }; /** -* The Default Vertex shader source +* The Default Vertex shader source. +* * @property defaultVertexSrc * @type String */ diff --git a/src/pixi/renderers/webgl/shaders/PrimitiveShader.js b/src/pixi/renderers/webgl/shaders/PrimitiveShader.js index 3a82be2..0f6854c 100644 --- a/src/pixi/renderers/webgl/shaders/PrimitiveShader.js +++ b/src/pixi/renderers/webgl/shaders/PrimitiveShader.js @@ -9,6 +9,11 @@ */ PIXI.PrimitiveShader = function(gl) { + /** + * @property _UID + * @type Number + * @private + */ this._UID = PIXI._UID++; /** @@ -18,11 +23,14 @@ this.gl = gl; /** - * @property {any} program - The WebGL program. - */ + * The WebGL program. + * @property program + * @type {Any} + */ this.program = null; /** + * The fragment shader. * @property fragmentSrc * @type Array */ @@ -36,6 +44,7 @@ ]; /** + * The vertex shader. * @property vertexSrc * @type Array */ @@ -60,14 +69,15 @@ this.init(); }; +PIXI.PrimitiveShader.prototype.constructor = PIXI.PrimitiveShader; + /** -* Initialises the shader +* Initialises the shader. +* * @method init -* */ PIXI.PrimitiveShader.prototype.init = function() { - var gl = this.gl; var program = PIXI.compileProgram(gl, this.vertexSrc, this.fragmentSrc); @@ -78,7 +88,6 @@ this.offsetVector = gl.getUniformLocation(program, 'offsetVector'); this.tintColor = gl.getUniformLocation(program, 'tint'); - // get and store the attributes this.aVertexPosition = gl.getAttribLocation(program, 'aVertexPosition'); this.colorAttribute = gl.getAttribLocation(program, 'aColor'); @@ -92,9 +101,9 @@ }; /** -* Destroys the shader +* Destroys the shader. +* * @method destroy -* */ PIXI.PrimitiveShader.prototype.destroy = function() { diff --git a/src/pixi/renderers/webgl/shaders/StripShader.js b/src/pixi/renderers/webgl/shaders/StripShader.js index 11f13ad..8fefe51 100644 --- a/src/pixi/renderers/webgl/shaders/StripShader.js +++ b/src/pixi/renderers/webgl/shaders/StripShader.js @@ -2,20 +2,37 @@ * @author Mat Groves http://matgroves.com/ @Doormat23 */ - +/** +* @class StripShader +* @constructor +* @param gl {WebGLContext} the current WebGL drawing context +*/ PIXI.StripShader = function(gl) { + /** + * @property _UID + * @type Number + * @private + */ this._UID = PIXI._UID++; + /** + * @property gl + * @type WebGLContext + */ this.gl = gl; /** - * @property {any} program - The WebGL program. - */ + * The WebGL program. + * @property program + * @type {Any} + */ this.program = null; /** - * @property {array} fragmentSrc - The fragment shader. + * The fragment shader. + * @property fragmentSrc + * @type Array */ this.fragmentSrc = [ 'precision mediump float;', @@ -30,9 +47,11 @@ '}' ]; - /** - * @property {array} fragmentSrc - The fragment shader. - */ + /** + * The vertex shader. + * @property vertexSrc + * @type Array + */ this.vertexSrc = [ 'attribute vec2 aVertexPosition;', 'attribute vec2 aTextureCoord;', @@ -56,10 +75,12 @@ this.init(); }; +PIXI.StripShader.prototype.constructor = PIXI.StripShader; + /** -* Initialises the shader +* Initialises the shader. +* * @method init -* */ PIXI.StripShader.prototype.init = function() { @@ -88,9 +109,9 @@ }; /** -* Destroys the shader +* Destroys the shader. +* * @method destroy -* */ PIXI.StripShader.prototype.destroy = function() { diff --git a/src/pixi/renderers/webgl/utils/FilterTexture.js b/src/pixi/renderers/webgl/utils/FilterTexture.js index 9dada23..389acbe 100644 --- a/src/pixi/renderers/webgl/utils/FilterTexture.js +++ b/src/pixi/renderers/webgl/utils/FilterTexture.js @@ -9,7 +9,6 @@ * @param width {Number} the horizontal range of the filter * @param height {Number} the vertical range of the filter * @param scaleMode {Number} Should be one of the PIXI.scaleMode consts -* @private */ PIXI.FilterTexture = function(gl, width, height, scaleMode) { @@ -19,11 +18,24 @@ */ this.gl = gl; - // next time to create a frame buffer and texture + + /** + * @property frameBuffer + * @type Any + */ this.frameBuffer = gl.createFramebuffer(); + + /** + * @property texture + * @type Any + */ this.texture = gl.createTexture(); + /** + * @property scaleMode + * @type Number + */ scaleMode = scaleMode || PIXI.scaleModes.DEFAULT; gl.bindTexture(gl.TEXTURE_2D, this.texture); @@ -44,9 +56,11 @@ this.resize(width, height); }; +PIXI.FilterTexture.prototype.constructor = PIXI.FilterTexture; /** -* Clears the filter texture +* Clears the filter texture. +* * @method clear */ PIXI.FilterTexture.prototype.clear = function() @@ -75,14 +89,14 @@ gl.bindTexture(gl.TEXTURE_2D, this.texture); gl.texImage2D(gl.TEXTURE_2D, 0, gl.RGBA, width , height , 0, gl.RGBA, gl.UNSIGNED_BYTE, null); - // console.log( width, width ) // update the stencil buffer width and height gl.bindRenderbuffer(gl.RENDERBUFFER, this.renderBuffer); gl.renderbufferStorage(gl.RENDERBUFFER, gl.DEPTH_STENCIL, width , height ); }; /** -* Destroys the filter texture +* Destroys the filter texture. +* * @method destroy */ PIXI.FilterTexture.prototype.destroy = function() diff --git a/src/pixi/renderers/webgl/utils/WebGLBlendModeManager.js b/src/pixi/renderers/webgl/utils/WebGLBlendModeManager.js index c73728f..3de0ec9 100644 --- a/src/pixi/renderers/webgl/utils/WebGLBlendModeManager.js +++ b/src/pixi/renderers/webgl/utils/WebGLBlendModeManager.js @@ -3,31 +3,42 @@ */ /** -* @class WebGLMaskManager +* @class WebGLBlendModeManager * @constructor * @param gl {WebGLContext} the current WebGL drawing context -* @private */ PIXI.WebGLBlendModeManager = function() { + /** + * @property currentBlendMode + * @type Number + */ this.currentBlendMode = 99999; }; +PIXI.WebGLBlendModeManager.prototype.constructor = PIXI.WebGLBlendModeManager; + +/** + * Sets the WebGL Context. + * + * @method setContext + * @param gl {WebGLContext} the current WebGL drawing context + */ PIXI.WebGLBlendModeManager.prototype.setContext = function(gl) { this.gl = gl; }; /** -* Sets-up the given blendMode from WebGL's point of view +* Sets-up the given blendMode from WebGL's point of view. +* * @method setBlendMode -* * @param blendMode {Number} the blendMode, should be a Pixi const, such as PIXI.BlendModes.ADD */ PIXI.WebGLBlendModeManager.prototype.setBlendMode = function(blendMode) { if(this.currentBlendMode === blendMode)return false; - // console.log("SWAP!") + this.currentBlendMode = blendMode; var blendModeWebGL = PIXI.blendModesWebGL[this.currentBlendMode]; @@ -36,7 +47,12 @@ return true; }; +/** +* Destroys this object. +* +* @method destroy +*/ PIXI.WebGLBlendModeManager.prototype.destroy = function() { this.gl = null; -}; \ No newline at end of file +}; diff --git a/src/pixi/renderers/webgl/utils/WebGLFastSpriteBatch.js b/src/pixi/renderers/webgl/utils/WebGLFastSpriteBatch.js index 0d08e47..0bdbbe4 100644 --- a/src/pixi/renderers/webgl/utils/WebGLFastSpriteBatch.js +++ b/src/pixi/renderers/webgl/utils/WebGLFastSpriteBatch.js @@ -8,27 +8,66 @@ * https://github.com/libgdx/libgdx/blob/master/gdx/src/com/badlogic/gdx/graphics/g2d/WebGLSpriteBatch.java */ +/** +* @class WebGLFastSpriteBatch +* @constructor +*/ PIXI.WebGLFastSpriteBatch = function() { - - + /** + * @property vertSize + * @type Number + */ this.vertSize = 10; + + /** + * @property maxSize + * @type Number + */ this.maxSize = 6000;//Math.pow(2, 16) / this.vertSize; + + /** + * @property size + * @type Number + */ this.size = this.maxSize; //the total number of floats in our batch var numVerts = this.size * 4 * this.vertSize; + //the total number of indices in our batch var numIndices = this.maxSize * 6; - //vertex data + /** + * Vertex data + * @property vertices + * @type Float32Array + */ this.vertices = new Float32Array(numVerts); - //index data + + /** + * Index data + * @property indices + * @type Uint16Array + */ this.indices = new Uint16Array(numIndices); + /** + * @property vertexBuffer + * @type Object + */ this.vertexBuffer = null; + + /** + * @property indexBuffer + * @type Object + */ this.indexBuffer = null; + /** + * @property lastIndexCount + * @type Number + */ this.lastIndexCount = 0; for (var i=0, j=0; i < numIndices; i += 6, j += 4) @@ -41,21 +80,58 @@ this.indices[i + 5] = j + 3; } + /** + * @property drawing + * @type Boolean + */ this.drawing = false; + + /** + * @property currentBatchSize + * @type Number + */ this.currentBatchSize = 0; + + /** + * @property currentBaseTexture + * @type BaseTexture + */ this.currentBaseTexture = null; + /** + * @property currentBlendMode + * @type Number + */ this.currentBlendMode = 0; + + /** + * @property renderSession + * @type Object + */ this.renderSession = null; - + /** + * @property shader + * @type Object + */ this.shader = null; + /** + * @property matrix + * @type Matrix + */ this.matrix = null; - //this.setContext(gl); }; +PIXI.WebGLFastSpriteBatch.prototype.constructor = PIXI.WebGLFastSpriteBatch; + +/** + * Sets the WebGL Context. + * + * @method setContext + * @param gl {WebGLContext} the current WebGL drawing context + */ PIXI.WebGLFastSpriteBatch.prototype.setContext = function(gl) { this.gl = gl; @@ -66,7 +142,6 @@ // 65535 is max index, so 65535 / 6 = 10922. - //upload the index data gl.bindBuffer(gl.ELEMENT_ARRAY_BUFFER, this.indexBuffer); gl.bufferData(gl.ELEMENT_ARRAY_BUFFER, this.indices, gl.STATIC_DRAW); @@ -75,6 +150,11 @@ gl.bufferData(gl.ARRAY_BUFFER, this.vertices, gl.DYNAMIC_DRAW); }; +/** + * @method begin + * @param spriteBatch {WebGLSpriteBatch} + * @param renderSession {Object} + */ PIXI.WebGLFastSpriteBatch.prototype.begin = function(spriteBatch, renderSession) { this.renderSession = renderSession; @@ -85,15 +165,20 @@ this.start(); }; +/** + * @method end + */ PIXI.WebGLFastSpriteBatch.prototype.end = function() { this.flush(); }; - +/** + * @method render + * @param spriteBatch {WebGLSpriteBatch} + */ PIXI.WebGLFastSpriteBatch.prototype.render = function(spriteBatch) { - var children = spriteBatch.children; var sprite = children[0]; @@ -119,6 +204,10 @@ this.flush(); }; +/** + * @method renderSprite + * @param sprite {Sprite} + */ PIXI.WebGLFastSpriteBatch.prototype.renderSprite = function(sprite) { //sprite = children[i]; @@ -137,7 +226,6 @@ uvs = sprite.texture._uvs; - width = sprite.texture.frame.width; height = sprite.texture.frame.height; @@ -257,9 +345,11 @@ } }; +/** + * @method flush + */ PIXI.WebGLFastSpriteBatch.prototype.flush = function() { - // If the batch is length 0 then return as there is nothing to draw if (this.currentBatchSize===0)return; @@ -272,7 +362,6 @@ gl.bindTexture(gl.TEXTURE_2D, this.currentBaseTexture._glTextures[gl.id]); // upload the verts to the buffer - if(this.currentBatchSize > ( this.size * 0.5 ) ) { @@ -285,7 +374,6 @@ gl.bufferSubData(gl.ARRAY_BUFFER, 0, view); } - // now draw those suckas! gl.drawElements(gl.TRIANGLES, this.currentBatchSize * 6, gl.UNSIGNED_SHORT, 0); @@ -297,11 +385,17 @@ }; +/** + * @method stop + */ PIXI.WebGLFastSpriteBatch.prototype.stop = function() { this.flush(); }; +/** + * @method start + */ PIXI.WebGLFastSpriteBatch.prototype.start = function() { var gl = this.gl; @@ -329,8 +423,5 @@ gl.vertexAttribPointer(this.shader.aRotation, 1, gl.FLOAT, false, stride, 6 * 4); gl.vertexAttribPointer(this.shader.aTextureCoord, 2, gl.FLOAT, false, stride, 7 * 4); gl.vertexAttribPointer(this.shader.colorAttribute, 1, gl.FLOAT, false, stride, 9 * 4); - }; - - diff --git a/src/pixi/renderers/webgl/utils/WebGLFilterManager.js b/src/pixi/renderers/webgl/utils/WebGLFilterManager.js index 9bb9195..359a834 100644 --- a/src/pixi/renderers/webgl/utils/WebGLFilterManager.js +++ b/src/pixi/renderers/webgl/utils/WebGLFilterManager.js @@ -5,22 +5,33 @@ /** * @class WebGLFilterManager * @constructor -* @param gl {WebGLContext} the current WebGL drawing context -* @private */ PIXI.WebGLFilterManager = function() { + /** + * @property filterStack + * @type Array + */ this.filterStack = []; + /** + * @property offsetX + * @type Number + */ this.offsetX = 0; - this.offsetY = 0; - // this.setContext(gl); + /** + * @property offsetY + * @type Number + */ + this.offsetY = 0; }; -// API +PIXI.WebGLFilterManager.prototype.constructor = PIXI.WebGLFilterManager; + /** -* Initialises the context and the properties +* Initialises the context and the properties. +* * @method setContext * @param gl {WebGLContext} the current WebGL drawing context */ @@ -33,7 +44,6 @@ }; /** -* * @method begin * @param renderSession {RenderSession} * @param buffer {ArrayBuffer} @@ -44,14 +54,14 @@ this.defaultShader = renderSession.shaderManager.defaultShader; var projection = this.renderSession.projection; - // console.log(this.width) this.width = projection.x * 2; this.height = -projection.y * 2; this.buffer = buffer; }; /** -* Applies the filter and adds it to the current filter stack +* Applies the filter and adds it to the current filter stack. +* * @method pushFilter * @param filterBlock {Object} the filter that will be pushed to the current filter stack */ @@ -64,7 +74,6 @@ filterBlock._filterArea = filterBlock.target.filterArea || filterBlock.target.getBounds(); - // filter program // OPTIMISATION - the first filter is free if its a simple color change? this.filterStack.push(filterBlock); @@ -126,9 +135,9 @@ }; - /** -* Removes the last filter from the filter stack and doesn't return it +* Removes the last filter from the filter stack and doesn't return it. +* * @method popFilter */ PIXI.WebGLFilterManager.prototype.popFilter = function() @@ -211,7 +220,6 @@ this.offsetX -= filterArea.x; this.offsetY -= filterArea.y; - var sizeX = this.width; var sizeY = this.height; @@ -239,9 +247,7 @@ buffer = currentFilter._glFilterTexture.frameBuffer; } - - - // TODO need toremove thease global elements.. + // TODO need to remove these global elements.. projection.x = sizeX/2; projection.y = -sizeY/2; @@ -280,10 +286,6 @@ gl.bufferSubData(gl.ARRAY_BUFFER, 0, this.uvArray); - //console.log(this.vertexArray) - //console.log(this.uvArray) - //console.log(sizeX + " : " + sizeY) - gl.viewport(0, 0, sizeX, sizeY); // bind the buffer @@ -300,9 +302,9 @@ this.applyFilterPass(filter, filterArea, sizeX, sizeY); // now restore the regular shader.. should happen automatically now.. - // this.renderSession.shaderManager.setShader(this.defaultShader); - // gl.uniform2f(this.defaultShader.projectionVector, sizeX/2, -sizeY/2); - // gl.uniform2f(this.defaultShader.offsetVector, -offsetX, -offsetY); + // this.renderSession.shaderManager.setShader(this.defaultShader); + // gl.uniform2f(this.defaultShader.projectionVector, sizeX/2, -sizeY/2); + // gl.uniform2f(this.defaultShader.offsetVector, -offsetX, -offsetY); // return the texture to the pool this.texturePool.push(texture); @@ -311,7 +313,8 @@ /** -* Applies the filter to the specified area +* Applies the filter to the specified area. +* * @method applyFilterPass * @param filter {AbstractFilter} the filter that needs to be applied * @param filterArea {texture} TODO - might need an update @@ -351,7 +354,6 @@ filter.uniforms.dimensions.value[3] = this.vertexArray[5];//filterArea.height; } - // console.log(this.uvArray ) shader.syncUniforms(); gl.bindBuffer(gl.ARRAY_BUFFER, this.vertexBuffer); @@ -372,7 +374,8 @@ }; /** -* Initialises the shader buffers +* Initialises the shader buffers. +* * @method initShaderBuffers */ PIXI.WebGLFilterManager.prototype.initShaderBuffers = function() @@ -385,7 +388,6 @@ this.colorBuffer = gl.createBuffer(); this.indexBuffer = gl.createBuffer(); - // bind and upload the vertexs.. // keep a reference to the vertexFloatData.. this.vertexArray = new Float32Array([0.0, 0.0, @@ -394,11 +396,7 @@ 1.0, 1.0]); gl.bindBuffer(gl.ARRAY_BUFFER, this.vertexBuffer); - gl.bufferData( - gl.ARRAY_BUFFER, - this.vertexArray, - gl.STATIC_DRAW); - + gl.bufferData(gl.ARRAY_BUFFER, this.vertexArray, gl.STATIC_DRAW); // bind and upload the uv buffer this.uvArray = new Float32Array([0.0, 0.0, @@ -407,10 +405,7 @@ 1.0, 1.0]); gl.bindBuffer(gl.ARRAY_BUFFER, this.uvBuffer); - gl.bufferData( - gl.ARRAY_BUFFER, - this.uvArray, - gl.STATIC_DRAW); + gl.bufferData(gl.ARRAY_BUFFER, this.uvArray, gl.STATIC_DRAW); this.colorArray = new Float32Array([1.0, 0xFFFFFF, 1.0, 0xFFFFFF, @@ -418,21 +413,17 @@ 1.0, 0xFFFFFF]); gl.bindBuffer(gl.ARRAY_BUFFER, this.colorBuffer); - gl.bufferData( - gl.ARRAY_BUFFER, - this.colorArray, - gl.STATIC_DRAW); + gl.bufferData(gl.ARRAY_BUFFER, this.colorArray, gl.STATIC_DRAW); // bind and upload the index gl.bindBuffer(gl.ELEMENT_ARRAY_BUFFER, this.indexBuffer); - gl.bufferData( - gl.ELEMENT_ARRAY_BUFFER, - new Uint16Array([0, 1, 2, 1, 3, 2]), - gl.STATIC_DRAW); + gl.bufferData(gl.ELEMENT_ARRAY_BUFFER, new Uint16Array([0, 1, 2, 1, 3, 2]), gl.STATIC_DRAW); + }; /** -* Destroys the filter and removes it from the filter stack +* Destroys the filter and removes it from the filter stack. +* * @method destroy */ PIXI.WebGLFilterManager.prototype.destroy = function() diff --git a/src/pixi/renderers/webgl/utils/WebGLGraphics.js b/src/pixi/renderers/webgl/utils/WebGLGraphics.js index 4de401d..9ea5a53 100644 --- a/src/pixi/renderers/webgl/utils/WebGLGraphics.js +++ b/src/pixi/renderers/webgl/utils/WebGLGraphics.js @@ -11,7 +11,6 @@ */ PIXI.WebGLGraphics = function() { - }; /** @@ -120,7 +119,6 @@ webGL.data = []; webGL.lastIndex = 0; } - var webGLData; @@ -131,8 +129,6 @@ { var data = graphics.graphicsData[i]; - - if(data.type === PIXI.Graphics.POLY) { // need to add the points the the graphics object.. @@ -189,7 +185,6 @@ } } - webGL.lastIndex++; } @@ -201,7 +196,13 @@ } }; - +/** + * @static + * @private + * @method switchMode + * @param webGL {WebGLContext} + * @param type {Number} + */ PIXI.WebGLGraphics.switchMode = function(webGL, type) { var webGLData; @@ -308,7 +309,6 @@ */ PIXI.WebGLGraphics.buildRoundedRectangle = function(graphicsData, webGLData) { - var points = graphicsData.points; var x = points[0]; var y = points[1]; @@ -316,7 +316,6 @@ var height = points[3]; var radius = points[4]; - var recPoints = []; recPoints.push(x, y + radius); recPoints = recPoints.concat(PIXI.WebGLGraphics.quadraticBezierCurve(x, y + height - radius, x, y + height, x + radius, y + height)); @@ -324,7 +323,6 @@ recPoints = recPoints.concat(PIXI.WebGLGraphics.quadraticBezierCurve(x + width, y + radius, x + width, y, x + width - radius, y)); recPoints = recPoints.concat(PIXI.WebGLGraphics.quadraticBezierCurve(x + radius, y, x, y, x, y + radius)); - if (graphicsData.fill) { var color = PIXI.hex2rgb(graphicsData.fillColor); var alpha = graphicsData.fillAlpha; @@ -368,8 +366,8 @@ }; /** - * Calcul the points for a quadratic bezier curve. (helper function..) - * Based on : https://stackoverflow.com/questions/785097/how-do-i-implement-a-bezier-curve-in-c + * Calculate the points for a quadratic bezier curve. (helper function..) + * Based on: https://stackoverflow.com/questions/785097/how-do-i-implement-a-bezier-curve-in-c * * @static * @private @@ -383,6 +381,7 @@ * @return {Array} */ PIXI.WebGLGraphics.quadraticBezierCurve = function(fromX, fromY, cpX, cpY, toX, toY) { + var xa, ya, xb, @@ -718,13 +717,12 @@ * * @static * @private - * @method buildPoly + * @method buildComplexPoly * @param graphicsData {Graphics} The graphics object containing all the necessary properties * @param webGLData {Object} */ PIXI.WebGLGraphics.buildComplexPoly = function(graphicsData, webGLData) { - //TODO - no need to copy this as it gets turned into a FLoat32Array anyways.. var points = graphicsData.points.slice(); if(points.length < 6)return; @@ -776,6 +774,15 @@ }; +/** + * Builds a polygon to draw + * + * @static + * @private + * @method buildPoly + * @param graphicsData {Graphics} The graphics object containing all the necessary properties + * @param webGLData {Object} + */ PIXI.WebGLGraphics.buildPoly = function(graphicsData, webGLData) { var points = graphicsData.points; @@ -818,6 +825,11 @@ PIXI.WebGLGraphics.graphicsDataPool = []; +/** + * @class WebGLGraphicsData + * @private + * @static + */ PIXI.WebGLGraphicsData = function(gl) { this.gl = gl; @@ -834,6 +846,9 @@ this.dirty = true; }; +/** + * @method reset + */ PIXI.WebGLGraphicsData.prototype.reset = function() { this.points = []; @@ -841,6 +856,9 @@ this.lastIndex = 0; }; +/** + * @method upload + */ PIXI.WebGLGraphicsData.prototype.upload = function() { var gl = this.gl; diff --git a/src/pixi/renderers/webgl/utils/WebGLMaskManager.js b/src/pixi/renderers/webgl/utils/WebGLMaskManager.js index 181f560..607d5dd 100644 --- a/src/pixi/renderers/webgl/utils/WebGLMaskManager.js +++ b/src/pixi/renderers/webgl/utils/WebGLMaskManager.js @@ -5,16 +5,17 @@ /** * @class WebGLMaskManager * @constructor -* @param gl {WebGLContext} the current WebGL drawing context * @private */ PIXI.WebGLMaskManager = function() { - //this.setContext(gl); }; +PIXI.WebGLMaskManager.prototype.constructor = PIXI.WebGLMaskManager; + /** -* Sets the drawing context to the one given in parameter +* Sets the drawing context to the one given in parameter. +* * @method setContext * @param gl {WebGLContext} the current WebGL drawing context */ @@ -24,10 +25,11 @@ }; /** -* Applies the Mask and adds it to the current filter stack +* Applies the Mask and adds it to the current filter stack. +* * @method pushMask * @param maskData {Array} -* @param renderSession {RenderSession} +* @param renderSession {Object} */ PIXI.WebGLMaskManager.prototype.pushMask = function(maskData, renderSession) { @@ -44,10 +46,11 @@ }; /** -* Removes the last filter from the filter stack and doesn't return it +* Removes the last filter from the filter stack and doesn't return it. +* * @method popMask -* -* @param renderSession {RenderSession} an object containing all the useful parameters +* @param maskData {Array} +* @param renderSession {Object} an object containing all the useful parameters */ PIXI.WebGLMaskManager.prototype.popMask = function(maskData, renderSession) { @@ -55,9 +58,9 @@ renderSession.stencilManager.popStencil(maskData, maskData._webGL[gl.id].data[0], renderSession); }; - /** -* Destroys the mask stack +* Destroys the mask stack. +* * @method destroy */ PIXI.WebGLMaskManager.prototype.destroy = function() diff --git a/src/pixi/renderers/webgl/utils/WebGLShaderManager.js b/src/pixi/renderers/webgl/utils/WebGLShaderManager.js index b597698..a15974e 100644 --- a/src/pixi/renderers/webgl/utils/WebGLShaderManager.js +++ b/src/pixi/renderers/webgl/utils/WebGLShaderManager.js @@ -5,38 +5,54 @@ /** * @class WebGLShaderManager * @constructor -* @param gl {WebGLContext} the current WebGL drawing context * @private */ PIXI.WebGLShaderManager = function() { - + /** + * @property maxAttibs + * @type Number + */ this.maxAttibs = 10; + + /** + * @property attribState + * @type Array + */ this.attribState = []; + + /** + * @property tempAttribState + * @type Array + */ this.tempAttribState = []; - for (var i = 0; i < this.maxAttibs; i++) { + for (var i = 0; i < this.maxAttibs; i++) + { this.attribState[i] = false; } + /** + * @property stack + * @type Array + */ this.stack = []; - - //this.setContext(gl); - // the final one is used for the rendering strips + }; +PIXI.WebGLShaderManager.prototype.constructor = PIXI.WebGLShaderManager; /** -* Initialises the context and the properties +* Initialises the context and the properties. +* * @method setContext * @param gl {WebGLContext} the current WebGL drawing context -* @param transparent {Boolean} Whether or not the drawing context should be transparent */ PIXI.WebGLShaderManager.prototype.setContext = function(gl) { this.gl = gl; - // the next one is used for rendering primatives + // the next one is used for rendering primitives this.primitiveShader = new PIXI.PrimitiveShader(gl); // the next one is used for rendering triangle strips @@ -53,16 +69,15 @@ this.setShader(this.defaultShader); }; - /** -* Takes the attributes given in parameters +* Takes the attributes given in parameters. +* * @method setAttribs * @param attribs {Array} attribs */ PIXI.WebGLShaderManager.prototype.setAttribs = function(attribs) { // reset temp state - var i; for (i = 0; i < this.tempAttribState.length; i++) @@ -97,6 +112,12 @@ } }; +/** +* Sets the current shader. +* +* @method setShader +* @param shader {Any} +*/ PIXI.WebGLShaderManager.prototype.setShader = function(shader) { if(this._currentId === shader._UID)return false; @@ -112,7 +133,8 @@ }; /** -* Destroys +* Destroys this object. +* * @method destroy */ PIXI.WebGLShaderManager.prototype.destroy = function() @@ -133,4 +155,3 @@ this.gl = null; }; - diff --git a/src/pixi/renderers/webgl/utils/WebGLShaderUtils.js b/src/pixi/renderers/webgl/utils/WebGLShaderUtils.js index f6cc024..88461d1 100644 --- a/src/pixi/renderers/webgl/utils/WebGLShaderUtils.js +++ b/src/pixi/renderers/webgl/utils/WebGLShaderUtils.js @@ -2,27 +2,44 @@ * @author Mat Groves http://matgroves.com/ @Doormat23 */ -// TODO Alvin and Mat -// Should we eventually create a Utils class ? -// Or just move this file to the pixi.js file ? +/** +* @method initDefaultShaders +* @private +*/ PIXI.initDefaultShaders = function() { - - // PIXI.stripShader = new PIXI.StripShader(); -// PIXI.stripShader.init(); - }; +/** +* @method CompileVertexShader +* @param gl {WebGLContext} the current WebGL drawing context +* @param shaderSrc {Array} +* @return {Any} +*/ PIXI.CompileVertexShader = function(gl, shaderSrc) { return PIXI._CompileShader(gl, shaderSrc, gl.VERTEX_SHADER); }; +/** +* @method CompileFragmentShader +* @param gl {WebGLContext} the current WebGL drawing context +* @param shaderSrc {Array} +* @return {Any} +*/ PIXI.CompileFragmentShader = function(gl, shaderSrc) { return PIXI._CompileShader(gl, shaderSrc, gl.FRAGMENT_SHADER); }; +/** +* @method _CompileShader +* @private +* @param gl {WebGLContext} the current WebGL drawing context +* @param shaderSrc {Array} +* @param shaderType {Number} +* @return {Any} +*/ PIXI._CompileShader = function(gl, shaderSrc, shaderType) { var src = shaderSrc.join("\n"); @@ -30,14 +47,22 @@ gl.shaderSource(shader, src); gl.compileShader(shader); - if (!gl.getShaderParameter(shader, gl.COMPILE_STATUS)) { - window.console.log(gl.getShaderInfoLog(shader)); + if (!gl.getShaderParameter(shader, gl.COMPILE_STATUS)) + { + console.log(gl.getShaderInfoLog(shader)); return null; } return shader; }; +/** +* @method compileProgram +* @param gl {WebGLContext} the current WebGL drawing context +* @param vertexSrc {Array} +* @param fragmentSrc {Array} +* @return {Any} +*/ PIXI.compileProgram = function(gl, vertexSrc, fragmentSrc) { var fragmentShader = PIXI.CompileFragmentShader(gl, fragmentSrc); @@ -49,8 +74,9 @@ gl.attachShader(shaderProgram, fragmentShader); gl.linkProgram(shaderProgram); - if (!gl.getProgramParameter(shaderProgram, gl.LINK_STATUS)) { - window.console.log("Could not initialise shaders"); + if (!gl.getProgramParameter(shaderProgram, gl.LINK_STATUS)) + { + console.log("Could not initialise shaders"); } return shaderProgram; diff --git a/src/pixi/renderers/webgl/utils/WebGLSpriteBatch.js b/src/pixi/renderers/webgl/utils/WebGLSpriteBatch.js index 4d59c80..f8a4bd7 100755 --- a/src/pixi/renderers/webgl/utils/WebGLSpriteBatch.js +++ b/src/pixi/renderers/webgl/utils/WebGLSpriteBatch.js @@ -13,15 +13,10 @@ * @class WebGLSpriteBatch * @private * @constructor - * @param gl {WebGLContext} the current WebGL drawing context - * */ PIXI.WebGLSpriteBatch = function() { - /** - * - * * @property vertSize * @type Number */ @@ -47,7 +42,6 @@ */ this.vertices = new Float32Array(numVerts); - //index data /** * Holds the indices * @@ -56,6 +50,10 @@ */ this.indices = new Uint16Array(numIndices); + /** + * @property lastIndexCount + * @type Number + */ this.lastIndexCount = 0; for (var i=0, j=0; i < numIndices; i += 6, j += 4) @@ -68,20 +66,58 @@ this.indices[i + 5] = j + 3; } - + /** + * @property drawing + * @type Boolean + */ this.drawing = false; - this.currentBatchSize = 0; - this.currentBaseTexture = null; - -// this.setContext(gl); + /** + * @property currentBatchSize + * @type Number + */ + this.currentBatchSize = 0; + + /** + * @property currentBaseTexture + * @type BaseTexture + */ + this.currentBaseTexture = null; + + /** + * @property dirty + * @type Boolean + */ this.dirty = true; + /** + * @property textures + * @type Array + */ this.textures = []; + + /** + * @property blendModes + * @type Array + */ this.blendModes = []; + + /** + * @property shaders + * @type Array + */ this.shaders = []; + + /** + * @property sprites + * @type Array + */ this.sprites = []; + /** + * @property defaultShader + * @type AbstractFilter + */ this.defaultShader = new PIXI.AbstractFilter([ 'precision lowp float;', 'varying vec2 vTextureCoord;', @@ -94,9 +130,7 @@ }; /** -* * @method setContext -* * @param gl {WebGLContext} the current WebGL drawing context */ PIXI.WebGLSpriteBatch.prototype.setContext = function(gl) @@ -109,7 +143,6 @@ // 65535 is max index, so 65535 / 6 = 10922. - //upload the index data gl.bindBuffer(gl.ELEMENT_ARRAY_BUFFER, this.indexBuffer); gl.bufferData(gl.ELEMENT_ARRAY_BUFFER, this.indices, gl.STATIC_DRAW); @@ -125,15 +158,12 @@ shader.uniforms = {}; shader.init(); - this.defaultShader.shaders[gl.id] = shader; }; /** -* * @method begin -* -* @param renderSession {RenderSession} the RenderSession +* @param renderSession {Object} The RenderSession object */ PIXI.WebGLSpriteBatch.prototype.begin = function(renderSession) { @@ -144,9 +174,7 @@ }; /** -* * @method end -* */ PIXI.WebGLSpriteBatch.prototype.end = function() { @@ -154,16 +182,13 @@ }; /** -* * @method render -* * @param sprite {Sprite} the sprite to render when using this spritebatch */ PIXI.WebGLSpriteBatch.prototype.render = function(sprite) { var texture = sprite.texture; - //TODO set blend modes.. // check texture.. if(this.currentBatchSize >= this.size) @@ -270,9 +295,9 @@ }; /** -* Renders a tilingSprite using the spriteBatch -* @method renderTilingSprite +* Renders a TilingSprite using the spriteBatch. * +* @method renderTilingSprite * @param sprite {TilingSprite} the tilingSprite to render */ PIXI.WebGLSpriteBatch.prototype.renderTilingSprite = function(tilingSprite) @@ -390,12 +415,10 @@ this.sprites[this.currentBatchSize++] = tilingSprite; }; - /** -* Renders the content and empties the current batch +* Renders the content and empties the current batch. * * @method flush -* */ PIXI.WebGLSpriteBatch.prototype.flush = function() { @@ -516,6 +539,12 @@ this.currentBatchSize = 0; }; +/** +* @method renderBatch +* @param texture {Texture} +* @param size {Number} +* @param startIndex {Number} +*/ PIXI.WebGLSpriteBatch.prototype.renderBatch = function(texture, size, startIndex) { if(size === 0)return; @@ -532,7 +561,6 @@ // bind the current texture gl.bindTexture(gl.TEXTURE_2D, texture._glTextures[gl.id]); } - // now draw those suckas! gl.drawElements(gl.TRIANGLES, size * 6, gl.UNSIGNED_SHORT, startIndex * 6 * 2); @@ -541,11 +569,8 @@ this.renderSession.drawCount++; }; - /** -* * @method stop -* */ PIXI.WebGLSpriteBatch.prototype.stop = function() { @@ -554,9 +579,7 @@ }; /** -* * @method start -* */ PIXI.WebGLSpriteBatch.prototype.start = function() { @@ -564,12 +587,12 @@ }; /** -* Destroys the SpriteBatch +* Destroys the SpriteBatch. +* * @method destroy */ PIXI.WebGLSpriteBatch.prototype.destroy = function() { - this.vertices = null; this.indices = null; diff --git a/src/pixi/renderers/webgl/utils/WebGLStencilManager.js b/src/pixi/renderers/webgl/utils/WebGLStencilManager.js index f841e6f..367d7dc 100644 --- a/src/pixi/renderers/webgl/utils/WebGLStencilManager.js +++ b/src/pixi/renderers/webgl/utils/WebGLStencilManager.js @@ -5,21 +5,18 @@ /** * @class WebGLStencilManager * @constructor -* @param gl {WebGLContext} the current WebGL drawing context * @private */ PIXI.WebGLStencilManager = function() { - this.stencilStack = []; - //this.setContext(gl); this.reverse = true; this.count = 0; - }; /** -* Sets the drawing context to the one given in parameter +* Sets the drawing context to the one given in parameter. +* * @method setContext * @param gl {WebGLContext} the current WebGL drawing context */ @@ -29,10 +26,12 @@ }; /** -* Applies the Mask and adds it to the current filter stack +* Applies the Mask and adds it to the current filter stack. +* * @method pushMask -* @param maskData {Array} -* @param renderSession {RenderSession} +* @param graphics {Graphics} +* @param webGLData {Array} +* @param renderSession {Object} */ PIXI.WebGLStencilManager.prototype.pushStencil = function(graphics, webGLData, renderSession) { @@ -60,7 +59,6 @@ if(webGLData.mode === 1) { - gl.drawElements(gl.TRIANGLE_FAN, webGLData.indices.length - 4, gl.UNSIGNED_SHORT, 0 ); if(this.reverse) @@ -119,7 +117,14 @@ this.count++; }; -//TODO this does not belong here! +/** + * TODO this does not belong here! + * + * @method bindGraphics + * @param graphics {Graphics} + * @param webGLData {Array} + * @param renderSession {Object} + */ PIXI.WebGLStencilManager.prototype.bindGraphics = function(graphics, webGLData, renderSession) { //if(this._currentGraphics === graphics)return; @@ -182,6 +187,12 @@ } }; +/** + * @method popStencil + * @param graphics {Graphics} + * @param webGLData {Array} + * @param renderSession {Object} + */ PIXI.WebGLStencilManager.prototype.popStencil = function(graphics, webGLData, renderSession) { var gl = this.gl; @@ -272,7 +283,8 @@ }; /** -* Destroys the mask stack +* Destroys the mask stack. +* * @method destroy */ PIXI.WebGLStencilManager.prototype.destroy = function() diff --git a/src/pixi/utils/Detector.js b/src/pixi/utils/Detector.js index c0bd1ed..33a97a9 100644 --- a/src/pixi/utils/Detector.js +++ b/src/pixi/utils/Detector.js @@ -44,9 +44,10 @@ /** * This helper function will automatically detect which renderer you should be using. * This function is very similar to the autoDetectRenderer function except that is will return a canvas renderer for android. - * Even thought both android chrome suports webGL the canvas implementation perform better at the time of writing. - * This function will likely change and update as webGL performance imporoves on thease devices. - * @class getRecommendedRenderer + * Even thought both android chrome supports webGL the canvas implementation perform better at the time of writing. + * This function will likely change and update as webGL performance improves on these devices. + * + * @class autoDetectRecommendedRenderer * @static * @param width=800 {Number} the width of the renderers view * @param height=600 {Number} the height of the renderers view diff --git a/src/pixi/utils/EventTarget.js b/src/pixi/utils/EventTarget.js index 4e701d9..32536e3 100644 --- a/src/pixi/utils/EventTarget.js +++ b/src/pixi/utils/EventTarget.js @@ -4,7 +4,7 @@ */ /** - * Originally based on https://github.com/mrdoob/eventtarget.js/ from mr DOob. + * Originally based on https://github.com/mrdoob/eventtarget.js/ from mr Doob. * Currently takes inspiration from the nodejs EventEmitter, EventEmitter3, and smokesignals */ @@ -18,7 +18,7 @@ * PIXI.EventTarget.mixin(MyEmitter.prototype); * * var em = new MyEmitter(); - * em.emit('eventName', 'some data', 'some moar data', {}, null, ...); + * em.emit('eventName', 'some data', 'some more data', {}, null, ...); */ PIXI.EventTarget = { /** diff --git a/src/pixi/InteractionData.js b/src/pixi/InteractionData.js index ea77370..fa84a6d 100644 --- a/src/pixi/InteractionData.js +++ b/src/pixi/InteractionData.js @@ -18,7 +18,6 @@ */ this.global = new PIXI.Point(); - /** * The target Sprite that was interacted with * diff --git a/src/pixi/InteractionManager.js b/src/pixi/InteractionManager.js index 685c386..71f320b 100644 --- a/src/pixi/InteractionManager.js +++ b/src/pixi/InteractionManager.js @@ -14,7 +14,7 @@ PIXI.InteractionManager = function(stage) { /** - * a reference to the stage + * A reference to the stage * * @property stage * @type Stage @@ -22,7 +22,7 @@ this.stage = stage; /** - * the mouse data + * The mouse data * * @property mouse * @type InteractionData @@ -30,18 +30,21 @@ this.mouse = new PIXI.InteractionData(); /** - * an object that stores current touches (InteractionData) by id reference + * An object that stores current touches (InteractionData) by id reference * * @property touches * @type Object */ this.touches = {}; - // helpers + /** + * @property tempPoint + * @type Point + * @private + */ this.tempPoint = new PIXI.Point(); /** - * * @property mouseoverEnabled * @type Boolean * @default @@ -49,7 +52,7 @@ this.mouseoverEnabled = true; /** - * tiny little interactiveData pool ! + * Tiny little interactiveData pool ! * * @property pool * @type Array @@ -61,7 +64,6 @@ * @property interactiveItems * @type Array * @private - * */ this.interactiveItems = []; @@ -73,23 +75,60 @@ */ this.interactionDOMElement = null; - //this will make it so that you dont have to call bind all the time + //this will make it so that you don't have to call bind all the time + + /** + * @property onMouseMove + * @type Function + */ this.onMouseMove = this.onMouseMove.bind( this ); + + /** + * @property onMouseDown + * @type Function + */ this.onMouseDown = this.onMouseDown.bind(this); + + /** + * @property onMouseOut + * @type Function + */ this.onMouseOut = this.onMouseOut.bind(this); + + /** + * @property onMouseUp + * @type Function + */ this.onMouseUp = this.onMouseUp.bind(this); + /** + * @property onTouchStart + * @type Function + */ this.onTouchStart = this.onTouchStart.bind(this); + + /** + * @property onTouchEnd + * @type Function + */ this.onTouchEnd = this.onTouchEnd.bind(this); + + /** + * @property onTouchMove + * @type Function + */ this.onTouchMove = this.onTouchMove.bind(this); + /** + * @property last + * @type Number + */ this.last = 0; /** * The css style of the cursor that is being used * @property currentCursorStyle * @type String - * */ this.currentCursorStyle = 'inherit'; @@ -97,10 +136,13 @@ * Is set to true when the mouse is moved out of the canvas * @property mouseOut * @type Boolean - * */ this.mouseOut = false; + /** + * @property resolution + * @type Number + */ this.resolution = 1; }; @@ -166,7 +208,6 @@ this.setTargetDomElement (target.view); }; - /** * Sets the DOM element which will receive mouse/touch events. This is useful for when you have other DOM * elements on top of the renderers Canvas element. With this you'll be able to delegate another DOM element @@ -201,7 +242,10 @@ window.addEventListener('mouseup', this.onMouseUp, true); }; - +/** + * @method removeEvents + * @private + */ PIXI.InteractionManager.prototype.removeEvents = function() { if (!this.interactionDOMElement) return; @@ -308,6 +352,10 @@ } }; +/** + * @method rebuildInteractiveGraph + * @private + */ PIXI.InteractionManager.prototype.rebuildInteractiveGraph = function() { this.dirty = false; @@ -427,10 +475,10 @@ }; /** - * Is called when the mouse button is moved out of the renderer element + * Is called when the mouse is moved out of the renderer element * * @method onMouseOut - * @param event {Event} The DOM event of a mouse button being moved out + * @param event {Event} The DOM event of a mouse being moved out * @private */ PIXI.InteractionManager.prototype.onMouseOut = function(event) diff --git a/src/pixi/renderers/webgl/WebGLRenderer.js b/src/pixi/renderers/webgl/WebGLRenderer.js index 968fd3d..422896f 100644 --- a/src/pixi/renderers/webgl/WebGLRenderer.js +++ b/src/pixi/renderers/webgl/WebGLRenderer.js @@ -5,23 +5,21 @@ PIXI.glContexts = []; // this is where we store the webGL contexts for easy access. /** - * the WebGLRenderer draws the stage and all its content onto a webGL enabled canvas. This renderer - * should be used for browsers that support webGL. This Render works by automatically managing webGLBatch's. - * So no need for Sprite Batch's or Sprite Cloud's - * Dont forget to add the view to your DOM or you will not see anything :) + * The WebGLRenderer draws the stage and all its content onto a webGL enabled canvas. This renderer + * should be used for browsers that support webGL. This Render works by automatically managing webGLBatchs. + * So no need for Sprite Batches or Sprite Clouds. + * Don't forget to add the view to your DOM or you will not see anything :) * * @class WebGLRenderer * @constructor * @param [width=0] {Number} the width of the canvas view * @param [height=0] {Number} the height of the canvas view - * * @param [options] {Object} The optional renderer parameters * @param [options.view] {HTMLCanvasElement} the canvas to use as a view, optional * @param [options.transparent=false] {Boolean} If the render view is transparent, default false * @param [options.antialias=false] {Boolean} sets antialias (only applicable in chrome at the moment) * @param [options.preserveDrawingBuffer=false] {Boolean} enables drawing buffer preservation, enable this if you need to call toDataUrl on the webgl context * @param [options.resolution=1] {Number} the resolution of the renderer retina would be 2 - * */ PIXI.WebGLRenderer = function(width, height, options) { @@ -37,13 +35,16 @@ options = PIXI.defaultRenderOptions; } - if(!PIXI.defaultRenderer) { PIXI.sayHello('webGL'); PIXI.defaultRenderer = this; } + /** + * @property type + * @type Number + */ this.type = PIXI.WEBGL_RENDERER; /** @@ -56,6 +57,7 @@ this.resolution = options.resolution; // do a catch.. only 1 webGL renderer.. + /** * Whether the render view is transparent * @@ -99,12 +101,27 @@ this.view = options.view || document.createElement( 'canvas' ); // deal with losing context.. + + /** + * @property contextLostBound + * @type Function + */ this.contextLostBound = this.handleContextLost.bind(this); + + /** + * @property contextRestoredBound + * @type Function + */ this.contextRestoredBound = this.handleContextRestored.bind(this); this.view.addEventListener('webglcontextlost', this.contextLostBound, false); this.view.addEventListener('webglcontextrestored', this.contextRestoredBound, false); + /** + * @property _contextOptions + * @type Object + * @private + */ this._contextOptions = { alpha: this.transparent, antialias: options.antialias, // SPEED UP?? @@ -113,18 +130,67 @@ preserveDrawingBuffer: options.preserveDrawingBuffer }; + /** + * @property projection + * @type Point + */ this.projection = new PIXI.Point(); + + /** + * @property offset + * @type Point + */ this.offset = new PIXI.Point(0, 0); - // time to create the render managers! each one focuses on managine a state in webGL - 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(); // manages the stencil buffer - this.blendModeManager = new PIXI.WebGLBlendModeManager(); // manages the blendModes + // time to create the render managers! each one focuses on managing a state in webGL - // TODO remove + /** + * Deals with managing the shader programs and their attribs + * @property shaderManager + * @type WebGLShaderManager + */ + this.shaderManager = new PIXI.WebGLShaderManager(); + + /** + * Manages the rendering of sprites + * @property spriteBatch + * @type WebGLSpriteBatch + */ + this.spriteBatch = new PIXI.WebGLSpriteBatch(); + + /** + * Manages the masks using the stencil buffer + * @property maskManager + * @type WebGLMaskManager + */ + this.maskManager = new PIXI.WebGLMaskManager(); + + /** + * Manages the filters + * @property filterManager + * @type WebGLFilterManager + */ + this.filterManager = new PIXI.WebGLFilterManager(); + + /** + * Manages the stencil buffer + * @property stencilManager + * @type WebGLStencilManager + */ + this.stencilManager = new PIXI.WebGLStencilManager(); + + /** + * Manages the blendModes + * @property blendModeManager + * @type WebGLBlendModeManager + */ + this.blendModeManager = new PIXI.WebGLBlendModeManager(); + + /** + * TODO remove + * @property renderSession + * @type Object + */ this.renderSession = {}; this.renderSession.gl = this.gl; this.renderSession.drawCount = 0; @@ -147,6 +213,9 @@ // constructor PIXI.WebGLRenderer.prototype.constructor = PIXI.WebGLRenderer; +/** +* @method initContext +*/ PIXI.WebGLRenderer.prototype.initContext = function() { var gl = this.view.getContext('webgl', this._contextOptions) || this.view.getContext('experimental-webgl', this._contextOptions); @@ -180,7 +249,6 @@ this.resize(this.width, this.height); }; - /** * Renders the stage to its webGL view * @@ -205,9 +273,7 @@ // update the scene graph stage.updateTransform(); - var gl = this.gl; - // interaction if(stage._interactive) @@ -249,9 +315,9 @@ }; /** - * Renders a display Object + * Renders a Display Object. * - * @method renderDIsplayObject + * @method renderDisplayObject * @param displayObject {DisplayObject} The DisplayObject to render * @param projection {Point} The projection * @param buffer {Array} a standard WebGL buffer @@ -283,7 +349,7 @@ }; /** - * resizes the webGL view to the specified width and height + * Resizes the webGL view to the specified width and height. * * @method resize * @param width {Number} the new width of the webGL view @@ -297,10 +363,6 @@ this.view.width = this.width; this.view.height = this.height; - // this.view.style.width = width + 'px'; - // this.view.style.height = height + 'px'; - - // console.log(this.width / this.resolution) this.gl.viewport(0, 0, this.width, this.height); this.projection.x = this.width / 2 / this.resolution; @@ -308,10 +370,10 @@ }; /** - * Updates and Creates a WebGL texture for the renderers context + * Updates and Creates a WebGL texture for the renderers context. * * @method updateTexture - * @param texture {Texture} the texture to render + * @param texture {Texture} the texture to update */ PIXI.WebGLRenderer.prototype.updateTexture = function(texture) { @@ -411,6 +473,11 @@ this.renderSession = null; }; +/** + * Maps Pixi blend modes to WebGL blend modes. + * + * @method mapBlendModes + */ PIXI.WebGLRenderer.prototype.mapBlendModes = function() { var gl = this.gl; diff --git a/src/pixi/renderers/webgl/shaders/ComplexPrimitiveShader.js b/src/pixi/renderers/webgl/shaders/ComplexPrimitiveShader.js index daa8b64..79d038a 100644 --- a/src/pixi/renderers/webgl/shaders/ComplexPrimitiveShader.js +++ b/src/pixi/renderers/webgl/shaders/ComplexPrimitiveShader.js @@ -9,7 +9,13 @@ */ PIXI.ComplexPrimitiveShader = function(gl) { + /** + * @property _UID + * @type Number + * @private + */ this._UID = PIXI._UID++; + /** * @property gl * @type WebGLContext @@ -17,18 +23,20 @@ this.gl = gl; /** - * @property {any} program - The WebGL program. - */ + * The WebGL program. + * @property program + * @type {Any} + */ this.program = null; /** + * The fragment shader. * @property fragmentSrc * @type Array */ this.fragmentSrc = [ - 'precision mediump float;', - + 'precision mediump float;', 'varying vec4 vColor;', @@ -38,6 +46,7 @@ ]; /** + * The vertex shader. * @property vertexSrc * @type Array */ @@ -65,14 +74,15 @@ this.init(); }; +PIXI.ComplexPrimitiveShader.prototype.constructor = PIXI.ComplexPrimitiveShader; + /** -* Initialises the shader +* Initialises the shader. +* * @method init -* */ PIXI.ComplexPrimitiveShader.prototype.init = function() { - var gl = this.gl; var program = PIXI.compileProgram(gl, this.vertexSrc, this.fragmentSrc); @@ -84,7 +94,6 @@ this.tintColor = gl.getUniformLocation(program, 'tint'); this.color = gl.getUniformLocation(program, 'color'); - // get and store the attributes this.aVertexPosition = gl.getAttribLocation(program, 'aVertexPosition'); // this.colorAttribute = gl.getAttribLocation(program, 'aColor'); @@ -98,9 +107,9 @@ }; /** -* Destroys the shader +* Destroys the shader. +* * @method destroy -* */ PIXI.ComplexPrimitiveShader.prototype.destroy = function() { diff --git a/src/pixi/renderers/webgl/shaders/PixiFastShader.js b/src/pixi/renderers/webgl/shaders/PixiFastShader.js index 4fb3fe2..bb46419 100644 --- a/src/pixi/renderers/webgl/shaders/PixiFastShader.js +++ b/src/pixi/renderers/webgl/shaders/PixiFastShader.js @@ -1,6 +1,5 @@ /** * @author Mat Groves http://matgroves.com/ @Doormat23 - * @author Richard Davey http://www.photonstorm.com @photonstorm */ /** @@ -10,6 +9,11 @@ */ PIXI.PixiFastShader = function(gl) { + /** + * @property _UID + * @type Number + * @private + */ this._UID = PIXI._UID++; /** @@ -19,12 +23,16 @@ this.gl = gl; /** - * @property {any} program - The WebGL program. + * The WebGL program. + * @property program + * @type {Any} */ this.program = null; /** - * @property {array} fragmentSrc - The fragment shader. + * The fragment shader. + * @property fragmentSrc + * @type Array */ this.fragmentSrc = [ 'precision lowp float;', @@ -37,8 +45,10 @@ ]; /** - * @property {array} vertexSrc - The vertex shader - */ + * The vertex shader. + * @property vertexSrc + * @type Array + */ this.vertexSrc = [ 'attribute vec2 aVertexPosition;', 'attribute vec2 aPositionCoord;', @@ -69,24 +79,25 @@ '}' ]; - /** - * @property {number} textureCount - A local texture counter for multi-texture shaders. - */ + * A local texture counter for multi-texture shaders. + * @property textureCount + * @type Number + */ this.textureCount = 0; - this.init(); }; +PIXI.PixiFastShader.prototype.constructor = PIXI.PixiFastShader; + /** -* Initialises the shader +* Initialises the shader. +* * @method init -* */ PIXI.PixiFastShader.prototype.init = function() { - var gl = this.gl; var program = PIXI.compileProgram(gl, this.vertexSrc, this.fragmentSrc); @@ -111,8 +122,6 @@ this.aTextureCoord = gl.getAttribLocation(program, 'aTextureCoord'); this.colorAttribute = gl.getAttribLocation(program, 'aColor'); - - // Begin worst hack eva // // WHY??? ONLY on my chrome pixel the line above returns -1 when using filters? @@ -128,14 +137,13 @@ // End worst hack eva // - this.program = program; }; /** -* Destroys the shader +* Destroys the shader. +* * @method destroy -* */ PIXI.PixiFastShader.prototype.destroy = function() { diff --git a/src/pixi/renderers/webgl/shaders/PixiShader.js b/src/pixi/renderers/webgl/shaders/PixiShader.js index d76ec03..725dce2 100644 --- a/src/pixi/renderers/webgl/shaders/PixiShader.js +++ b/src/pixi/renderers/webgl/shaders/PixiShader.js @@ -6,9 +6,15 @@ /** * @class PixiShader * @constructor +* @param gl {WebGLContext} the current WebGL drawing context */ PIXI.PixiShader = function(gl) { + /** + * @property _UID + * @type Number + * @private + */ this._UID = PIXI._UID++; /** @@ -18,13 +24,17 @@ this.gl = gl; /** - * @property {any} program - The WebGL program. - */ + * The WebGL program. + * @property program + * @type {Any} + */ this.program = null; /** - * @property {array} fragmentSrc - The fragment shader. - */ + * The fragment shader. + * @property fragmentSrc + * @type Array + */ this.fragmentSrc = [ 'precision lowp float;', 'varying vec2 vTextureCoord;', @@ -36,21 +46,44 @@ ]; /** - * @property {number} textureCount - A local texture counter for multi-texture shaders. - */ + * A local texture counter for multi-texture shaders. + * @property textureCount + * @type Number + */ this.textureCount = 0; + + /** + * A local flag + * @property firstRun + * @type Boolean + * @private + */ this.firstRun = true; + + /** + * A dirty flag + * @property dirty + * @type Boolean + */ this.dirty = true; + /** + * Uniform attributes cache. + * @property attributes + * @type Array + * @private + */ this.attributes = []; this.init(); }; +PIXI.PixiShader.prototype.constructor = PIXI.PixiShader; + /** -* Initialises the shader +* Initialises the shader. +* * @method init -* */ PIXI.PixiShader.prototype.init = function() { @@ -71,12 +104,11 @@ this.aTextureCoord = gl.getAttribLocation(program, 'aTextureCoord'); this.colorAttribute = gl.getAttribLocation(program, 'aColor'); - // Begin worst hack eva // // WHY??? ONLY on my chrome pixel the line above returns -1 when using filters? // maybe its something to do with the current state of the gl context. - // Im convinced this is a bug in the chrome browser as there is NO reason why this should be returning -1 especially as it only manifests on my chrome pixel + // I'm convinced this is a bug in the chrome browser as there is NO reason why this should be returning -1 especially as it only manifests on my chrome pixel // If theres any webGL people that know why could happen please help :) if(this.colorAttribute === -1) { @@ -101,6 +133,7 @@ /** * Initialises the shader uniform values. +* * Uniforms are specified in the GLSL_ES Specification: http://www.khronos.org/registry/webgl/specs/latest/1.0/ * http://www.khronos.org/registry/gles/specs/2.0/GLSL_ES_Specification_1.0.17.pdf * @@ -316,7 +349,8 @@ }; /** -* Destroys the shader +* Destroys the shader. +* * @method destroy */ PIXI.PixiShader.prototype.destroy = function() @@ -329,7 +363,8 @@ }; /** -* The Default Vertex shader source +* The Default Vertex shader source. +* * @property defaultVertexSrc * @type String */ diff --git a/src/pixi/renderers/webgl/shaders/PrimitiveShader.js b/src/pixi/renderers/webgl/shaders/PrimitiveShader.js index 3a82be2..0f6854c 100644 --- a/src/pixi/renderers/webgl/shaders/PrimitiveShader.js +++ b/src/pixi/renderers/webgl/shaders/PrimitiveShader.js @@ -9,6 +9,11 @@ */ PIXI.PrimitiveShader = function(gl) { + /** + * @property _UID + * @type Number + * @private + */ this._UID = PIXI._UID++; /** @@ -18,11 +23,14 @@ this.gl = gl; /** - * @property {any} program - The WebGL program. - */ + * The WebGL program. + * @property program + * @type {Any} + */ this.program = null; /** + * The fragment shader. * @property fragmentSrc * @type Array */ @@ -36,6 +44,7 @@ ]; /** + * The vertex shader. * @property vertexSrc * @type Array */ @@ -60,14 +69,15 @@ this.init(); }; +PIXI.PrimitiveShader.prototype.constructor = PIXI.PrimitiveShader; + /** -* Initialises the shader +* Initialises the shader. +* * @method init -* */ PIXI.PrimitiveShader.prototype.init = function() { - var gl = this.gl; var program = PIXI.compileProgram(gl, this.vertexSrc, this.fragmentSrc); @@ -78,7 +88,6 @@ this.offsetVector = gl.getUniformLocation(program, 'offsetVector'); this.tintColor = gl.getUniformLocation(program, 'tint'); - // get and store the attributes this.aVertexPosition = gl.getAttribLocation(program, 'aVertexPosition'); this.colorAttribute = gl.getAttribLocation(program, 'aColor'); @@ -92,9 +101,9 @@ }; /** -* Destroys the shader +* Destroys the shader. +* * @method destroy -* */ PIXI.PrimitiveShader.prototype.destroy = function() { diff --git a/src/pixi/renderers/webgl/shaders/StripShader.js b/src/pixi/renderers/webgl/shaders/StripShader.js index 11f13ad..8fefe51 100644 --- a/src/pixi/renderers/webgl/shaders/StripShader.js +++ b/src/pixi/renderers/webgl/shaders/StripShader.js @@ -2,20 +2,37 @@ * @author Mat Groves http://matgroves.com/ @Doormat23 */ - +/** +* @class StripShader +* @constructor +* @param gl {WebGLContext} the current WebGL drawing context +*/ PIXI.StripShader = function(gl) { + /** + * @property _UID + * @type Number + * @private + */ this._UID = PIXI._UID++; + /** + * @property gl + * @type WebGLContext + */ this.gl = gl; /** - * @property {any} program - The WebGL program. - */ + * The WebGL program. + * @property program + * @type {Any} + */ this.program = null; /** - * @property {array} fragmentSrc - The fragment shader. + * The fragment shader. + * @property fragmentSrc + * @type Array */ this.fragmentSrc = [ 'precision mediump float;', @@ -30,9 +47,11 @@ '}' ]; - /** - * @property {array} fragmentSrc - The fragment shader. - */ + /** + * The vertex shader. + * @property vertexSrc + * @type Array + */ this.vertexSrc = [ 'attribute vec2 aVertexPosition;', 'attribute vec2 aTextureCoord;', @@ -56,10 +75,12 @@ this.init(); }; +PIXI.StripShader.prototype.constructor = PIXI.StripShader; + /** -* Initialises the shader +* Initialises the shader. +* * @method init -* */ PIXI.StripShader.prototype.init = function() { @@ -88,9 +109,9 @@ }; /** -* Destroys the shader +* Destroys the shader. +* * @method destroy -* */ PIXI.StripShader.prototype.destroy = function() { diff --git a/src/pixi/renderers/webgl/utils/FilterTexture.js b/src/pixi/renderers/webgl/utils/FilterTexture.js index 9dada23..389acbe 100644 --- a/src/pixi/renderers/webgl/utils/FilterTexture.js +++ b/src/pixi/renderers/webgl/utils/FilterTexture.js @@ -9,7 +9,6 @@ * @param width {Number} the horizontal range of the filter * @param height {Number} the vertical range of the filter * @param scaleMode {Number} Should be one of the PIXI.scaleMode consts -* @private */ PIXI.FilterTexture = function(gl, width, height, scaleMode) { @@ -19,11 +18,24 @@ */ this.gl = gl; - // next time to create a frame buffer and texture + + /** + * @property frameBuffer + * @type Any + */ this.frameBuffer = gl.createFramebuffer(); + + /** + * @property texture + * @type Any + */ this.texture = gl.createTexture(); + /** + * @property scaleMode + * @type Number + */ scaleMode = scaleMode || PIXI.scaleModes.DEFAULT; gl.bindTexture(gl.TEXTURE_2D, this.texture); @@ -44,9 +56,11 @@ this.resize(width, height); }; +PIXI.FilterTexture.prototype.constructor = PIXI.FilterTexture; /** -* Clears the filter texture +* Clears the filter texture. +* * @method clear */ PIXI.FilterTexture.prototype.clear = function() @@ -75,14 +89,14 @@ gl.bindTexture(gl.TEXTURE_2D, this.texture); gl.texImage2D(gl.TEXTURE_2D, 0, gl.RGBA, width , height , 0, gl.RGBA, gl.UNSIGNED_BYTE, null); - // console.log( width, width ) // update the stencil buffer width and height gl.bindRenderbuffer(gl.RENDERBUFFER, this.renderBuffer); gl.renderbufferStorage(gl.RENDERBUFFER, gl.DEPTH_STENCIL, width , height ); }; /** -* Destroys the filter texture +* Destroys the filter texture. +* * @method destroy */ PIXI.FilterTexture.prototype.destroy = function() diff --git a/src/pixi/renderers/webgl/utils/WebGLBlendModeManager.js b/src/pixi/renderers/webgl/utils/WebGLBlendModeManager.js index c73728f..3de0ec9 100644 --- a/src/pixi/renderers/webgl/utils/WebGLBlendModeManager.js +++ b/src/pixi/renderers/webgl/utils/WebGLBlendModeManager.js @@ -3,31 +3,42 @@ */ /** -* @class WebGLMaskManager +* @class WebGLBlendModeManager * @constructor * @param gl {WebGLContext} the current WebGL drawing context -* @private */ PIXI.WebGLBlendModeManager = function() { + /** + * @property currentBlendMode + * @type Number + */ this.currentBlendMode = 99999; }; +PIXI.WebGLBlendModeManager.prototype.constructor = PIXI.WebGLBlendModeManager; + +/** + * Sets the WebGL Context. + * + * @method setContext + * @param gl {WebGLContext} the current WebGL drawing context + */ PIXI.WebGLBlendModeManager.prototype.setContext = function(gl) { this.gl = gl; }; /** -* Sets-up the given blendMode from WebGL's point of view +* Sets-up the given blendMode from WebGL's point of view. +* * @method setBlendMode -* * @param blendMode {Number} the blendMode, should be a Pixi const, such as PIXI.BlendModes.ADD */ PIXI.WebGLBlendModeManager.prototype.setBlendMode = function(blendMode) { if(this.currentBlendMode === blendMode)return false; - // console.log("SWAP!") + this.currentBlendMode = blendMode; var blendModeWebGL = PIXI.blendModesWebGL[this.currentBlendMode]; @@ -36,7 +47,12 @@ return true; }; +/** +* Destroys this object. +* +* @method destroy +*/ PIXI.WebGLBlendModeManager.prototype.destroy = function() { this.gl = null; -}; \ No newline at end of file +}; diff --git a/src/pixi/renderers/webgl/utils/WebGLFastSpriteBatch.js b/src/pixi/renderers/webgl/utils/WebGLFastSpriteBatch.js index 0d08e47..0bdbbe4 100644 --- a/src/pixi/renderers/webgl/utils/WebGLFastSpriteBatch.js +++ b/src/pixi/renderers/webgl/utils/WebGLFastSpriteBatch.js @@ -8,27 +8,66 @@ * https://github.com/libgdx/libgdx/blob/master/gdx/src/com/badlogic/gdx/graphics/g2d/WebGLSpriteBatch.java */ +/** +* @class WebGLFastSpriteBatch +* @constructor +*/ PIXI.WebGLFastSpriteBatch = function() { - - + /** + * @property vertSize + * @type Number + */ this.vertSize = 10; + + /** + * @property maxSize + * @type Number + */ this.maxSize = 6000;//Math.pow(2, 16) / this.vertSize; + + /** + * @property size + * @type Number + */ this.size = this.maxSize; //the total number of floats in our batch var numVerts = this.size * 4 * this.vertSize; + //the total number of indices in our batch var numIndices = this.maxSize * 6; - //vertex data + /** + * Vertex data + * @property vertices + * @type Float32Array + */ this.vertices = new Float32Array(numVerts); - //index data + + /** + * Index data + * @property indices + * @type Uint16Array + */ this.indices = new Uint16Array(numIndices); + /** + * @property vertexBuffer + * @type Object + */ this.vertexBuffer = null; + + /** + * @property indexBuffer + * @type Object + */ this.indexBuffer = null; + /** + * @property lastIndexCount + * @type Number + */ this.lastIndexCount = 0; for (var i=0, j=0; i < numIndices; i += 6, j += 4) @@ -41,21 +80,58 @@ this.indices[i + 5] = j + 3; } + /** + * @property drawing + * @type Boolean + */ this.drawing = false; + + /** + * @property currentBatchSize + * @type Number + */ this.currentBatchSize = 0; + + /** + * @property currentBaseTexture + * @type BaseTexture + */ this.currentBaseTexture = null; + /** + * @property currentBlendMode + * @type Number + */ this.currentBlendMode = 0; + + /** + * @property renderSession + * @type Object + */ this.renderSession = null; - + /** + * @property shader + * @type Object + */ this.shader = null; + /** + * @property matrix + * @type Matrix + */ this.matrix = null; - //this.setContext(gl); }; +PIXI.WebGLFastSpriteBatch.prototype.constructor = PIXI.WebGLFastSpriteBatch; + +/** + * Sets the WebGL Context. + * + * @method setContext + * @param gl {WebGLContext} the current WebGL drawing context + */ PIXI.WebGLFastSpriteBatch.prototype.setContext = function(gl) { this.gl = gl; @@ -66,7 +142,6 @@ // 65535 is max index, so 65535 / 6 = 10922. - //upload the index data gl.bindBuffer(gl.ELEMENT_ARRAY_BUFFER, this.indexBuffer); gl.bufferData(gl.ELEMENT_ARRAY_BUFFER, this.indices, gl.STATIC_DRAW); @@ -75,6 +150,11 @@ gl.bufferData(gl.ARRAY_BUFFER, this.vertices, gl.DYNAMIC_DRAW); }; +/** + * @method begin + * @param spriteBatch {WebGLSpriteBatch} + * @param renderSession {Object} + */ PIXI.WebGLFastSpriteBatch.prototype.begin = function(spriteBatch, renderSession) { this.renderSession = renderSession; @@ -85,15 +165,20 @@ this.start(); }; +/** + * @method end + */ PIXI.WebGLFastSpriteBatch.prototype.end = function() { this.flush(); }; - +/** + * @method render + * @param spriteBatch {WebGLSpriteBatch} + */ PIXI.WebGLFastSpriteBatch.prototype.render = function(spriteBatch) { - var children = spriteBatch.children; var sprite = children[0]; @@ -119,6 +204,10 @@ this.flush(); }; +/** + * @method renderSprite + * @param sprite {Sprite} + */ PIXI.WebGLFastSpriteBatch.prototype.renderSprite = function(sprite) { //sprite = children[i]; @@ -137,7 +226,6 @@ uvs = sprite.texture._uvs; - width = sprite.texture.frame.width; height = sprite.texture.frame.height; @@ -257,9 +345,11 @@ } }; +/** + * @method flush + */ PIXI.WebGLFastSpriteBatch.prototype.flush = function() { - // If the batch is length 0 then return as there is nothing to draw if (this.currentBatchSize===0)return; @@ -272,7 +362,6 @@ gl.bindTexture(gl.TEXTURE_2D, this.currentBaseTexture._glTextures[gl.id]); // upload the verts to the buffer - if(this.currentBatchSize > ( this.size * 0.5 ) ) { @@ -285,7 +374,6 @@ gl.bufferSubData(gl.ARRAY_BUFFER, 0, view); } - // now draw those suckas! gl.drawElements(gl.TRIANGLES, this.currentBatchSize * 6, gl.UNSIGNED_SHORT, 0); @@ -297,11 +385,17 @@ }; +/** + * @method stop + */ PIXI.WebGLFastSpriteBatch.prototype.stop = function() { this.flush(); }; +/** + * @method start + */ PIXI.WebGLFastSpriteBatch.prototype.start = function() { var gl = this.gl; @@ -329,8 +423,5 @@ gl.vertexAttribPointer(this.shader.aRotation, 1, gl.FLOAT, false, stride, 6 * 4); gl.vertexAttribPointer(this.shader.aTextureCoord, 2, gl.FLOAT, false, stride, 7 * 4); gl.vertexAttribPointer(this.shader.colorAttribute, 1, gl.FLOAT, false, stride, 9 * 4); - }; - - diff --git a/src/pixi/renderers/webgl/utils/WebGLFilterManager.js b/src/pixi/renderers/webgl/utils/WebGLFilterManager.js index 9bb9195..359a834 100644 --- a/src/pixi/renderers/webgl/utils/WebGLFilterManager.js +++ b/src/pixi/renderers/webgl/utils/WebGLFilterManager.js @@ -5,22 +5,33 @@ /** * @class WebGLFilterManager * @constructor -* @param gl {WebGLContext} the current WebGL drawing context -* @private */ PIXI.WebGLFilterManager = function() { + /** + * @property filterStack + * @type Array + */ this.filterStack = []; + /** + * @property offsetX + * @type Number + */ this.offsetX = 0; - this.offsetY = 0; - // this.setContext(gl); + /** + * @property offsetY + * @type Number + */ + this.offsetY = 0; }; -// API +PIXI.WebGLFilterManager.prototype.constructor = PIXI.WebGLFilterManager; + /** -* Initialises the context and the properties +* Initialises the context and the properties. +* * @method setContext * @param gl {WebGLContext} the current WebGL drawing context */ @@ -33,7 +44,6 @@ }; /** -* * @method begin * @param renderSession {RenderSession} * @param buffer {ArrayBuffer} @@ -44,14 +54,14 @@ this.defaultShader = renderSession.shaderManager.defaultShader; var projection = this.renderSession.projection; - // console.log(this.width) this.width = projection.x * 2; this.height = -projection.y * 2; this.buffer = buffer; }; /** -* Applies the filter and adds it to the current filter stack +* Applies the filter and adds it to the current filter stack. +* * @method pushFilter * @param filterBlock {Object} the filter that will be pushed to the current filter stack */ @@ -64,7 +74,6 @@ filterBlock._filterArea = filterBlock.target.filterArea || filterBlock.target.getBounds(); - // filter program // OPTIMISATION - the first filter is free if its a simple color change? this.filterStack.push(filterBlock); @@ -126,9 +135,9 @@ }; - /** -* Removes the last filter from the filter stack and doesn't return it +* Removes the last filter from the filter stack and doesn't return it. +* * @method popFilter */ PIXI.WebGLFilterManager.prototype.popFilter = function() @@ -211,7 +220,6 @@ this.offsetX -= filterArea.x; this.offsetY -= filterArea.y; - var sizeX = this.width; var sizeY = this.height; @@ -239,9 +247,7 @@ buffer = currentFilter._glFilterTexture.frameBuffer; } - - - // TODO need toremove thease global elements.. + // TODO need to remove these global elements.. projection.x = sizeX/2; projection.y = -sizeY/2; @@ -280,10 +286,6 @@ gl.bufferSubData(gl.ARRAY_BUFFER, 0, this.uvArray); - //console.log(this.vertexArray) - //console.log(this.uvArray) - //console.log(sizeX + " : " + sizeY) - gl.viewport(0, 0, sizeX, sizeY); // bind the buffer @@ -300,9 +302,9 @@ this.applyFilterPass(filter, filterArea, sizeX, sizeY); // now restore the regular shader.. should happen automatically now.. - // this.renderSession.shaderManager.setShader(this.defaultShader); - // gl.uniform2f(this.defaultShader.projectionVector, sizeX/2, -sizeY/2); - // gl.uniform2f(this.defaultShader.offsetVector, -offsetX, -offsetY); + // this.renderSession.shaderManager.setShader(this.defaultShader); + // gl.uniform2f(this.defaultShader.projectionVector, sizeX/2, -sizeY/2); + // gl.uniform2f(this.defaultShader.offsetVector, -offsetX, -offsetY); // return the texture to the pool this.texturePool.push(texture); @@ -311,7 +313,8 @@ /** -* Applies the filter to the specified area +* Applies the filter to the specified area. +* * @method applyFilterPass * @param filter {AbstractFilter} the filter that needs to be applied * @param filterArea {texture} TODO - might need an update @@ -351,7 +354,6 @@ filter.uniforms.dimensions.value[3] = this.vertexArray[5];//filterArea.height; } - // console.log(this.uvArray ) shader.syncUniforms(); gl.bindBuffer(gl.ARRAY_BUFFER, this.vertexBuffer); @@ -372,7 +374,8 @@ }; /** -* Initialises the shader buffers +* Initialises the shader buffers. +* * @method initShaderBuffers */ PIXI.WebGLFilterManager.prototype.initShaderBuffers = function() @@ -385,7 +388,6 @@ this.colorBuffer = gl.createBuffer(); this.indexBuffer = gl.createBuffer(); - // bind and upload the vertexs.. // keep a reference to the vertexFloatData.. this.vertexArray = new Float32Array([0.0, 0.0, @@ -394,11 +396,7 @@ 1.0, 1.0]); gl.bindBuffer(gl.ARRAY_BUFFER, this.vertexBuffer); - gl.bufferData( - gl.ARRAY_BUFFER, - this.vertexArray, - gl.STATIC_DRAW); - + gl.bufferData(gl.ARRAY_BUFFER, this.vertexArray, gl.STATIC_DRAW); // bind and upload the uv buffer this.uvArray = new Float32Array([0.0, 0.0, @@ -407,10 +405,7 @@ 1.0, 1.0]); gl.bindBuffer(gl.ARRAY_BUFFER, this.uvBuffer); - gl.bufferData( - gl.ARRAY_BUFFER, - this.uvArray, - gl.STATIC_DRAW); + gl.bufferData(gl.ARRAY_BUFFER, this.uvArray, gl.STATIC_DRAW); this.colorArray = new Float32Array([1.0, 0xFFFFFF, 1.0, 0xFFFFFF, @@ -418,21 +413,17 @@ 1.0, 0xFFFFFF]); gl.bindBuffer(gl.ARRAY_BUFFER, this.colorBuffer); - gl.bufferData( - gl.ARRAY_BUFFER, - this.colorArray, - gl.STATIC_DRAW); + gl.bufferData(gl.ARRAY_BUFFER, this.colorArray, gl.STATIC_DRAW); // bind and upload the index gl.bindBuffer(gl.ELEMENT_ARRAY_BUFFER, this.indexBuffer); - gl.bufferData( - gl.ELEMENT_ARRAY_BUFFER, - new Uint16Array([0, 1, 2, 1, 3, 2]), - gl.STATIC_DRAW); + gl.bufferData(gl.ELEMENT_ARRAY_BUFFER, new Uint16Array([0, 1, 2, 1, 3, 2]), gl.STATIC_DRAW); + }; /** -* Destroys the filter and removes it from the filter stack +* Destroys the filter and removes it from the filter stack. +* * @method destroy */ PIXI.WebGLFilterManager.prototype.destroy = function() diff --git a/src/pixi/renderers/webgl/utils/WebGLGraphics.js b/src/pixi/renderers/webgl/utils/WebGLGraphics.js index 4de401d..9ea5a53 100644 --- a/src/pixi/renderers/webgl/utils/WebGLGraphics.js +++ b/src/pixi/renderers/webgl/utils/WebGLGraphics.js @@ -11,7 +11,6 @@ */ PIXI.WebGLGraphics = function() { - }; /** @@ -120,7 +119,6 @@ webGL.data = []; webGL.lastIndex = 0; } - var webGLData; @@ -131,8 +129,6 @@ { var data = graphics.graphicsData[i]; - - if(data.type === PIXI.Graphics.POLY) { // need to add the points the the graphics object.. @@ -189,7 +185,6 @@ } } - webGL.lastIndex++; } @@ -201,7 +196,13 @@ } }; - +/** + * @static + * @private + * @method switchMode + * @param webGL {WebGLContext} + * @param type {Number} + */ PIXI.WebGLGraphics.switchMode = function(webGL, type) { var webGLData; @@ -308,7 +309,6 @@ */ PIXI.WebGLGraphics.buildRoundedRectangle = function(graphicsData, webGLData) { - var points = graphicsData.points; var x = points[0]; var y = points[1]; @@ -316,7 +316,6 @@ var height = points[3]; var radius = points[4]; - var recPoints = []; recPoints.push(x, y + radius); recPoints = recPoints.concat(PIXI.WebGLGraphics.quadraticBezierCurve(x, y + height - radius, x, y + height, x + radius, y + height)); @@ -324,7 +323,6 @@ recPoints = recPoints.concat(PIXI.WebGLGraphics.quadraticBezierCurve(x + width, y + radius, x + width, y, x + width - radius, y)); recPoints = recPoints.concat(PIXI.WebGLGraphics.quadraticBezierCurve(x + radius, y, x, y, x, y + radius)); - if (graphicsData.fill) { var color = PIXI.hex2rgb(graphicsData.fillColor); var alpha = graphicsData.fillAlpha; @@ -368,8 +366,8 @@ }; /** - * Calcul the points for a quadratic bezier curve. (helper function..) - * Based on : https://stackoverflow.com/questions/785097/how-do-i-implement-a-bezier-curve-in-c + * Calculate the points for a quadratic bezier curve. (helper function..) + * Based on: https://stackoverflow.com/questions/785097/how-do-i-implement-a-bezier-curve-in-c * * @static * @private @@ -383,6 +381,7 @@ * @return {Array} */ PIXI.WebGLGraphics.quadraticBezierCurve = function(fromX, fromY, cpX, cpY, toX, toY) { + var xa, ya, xb, @@ -718,13 +717,12 @@ * * @static * @private - * @method buildPoly + * @method buildComplexPoly * @param graphicsData {Graphics} The graphics object containing all the necessary properties * @param webGLData {Object} */ PIXI.WebGLGraphics.buildComplexPoly = function(graphicsData, webGLData) { - //TODO - no need to copy this as it gets turned into a FLoat32Array anyways.. var points = graphicsData.points.slice(); if(points.length < 6)return; @@ -776,6 +774,15 @@ }; +/** + * Builds a polygon to draw + * + * @static + * @private + * @method buildPoly + * @param graphicsData {Graphics} The graphics object containing all the necessary properties + * @param webGLData {Object} + */ PIXI.WebGLGraphics.buildPoly = function(graphicsData, webGLData) { var points = graphicsData.points; @@ -818,6 +825,11 @@ PIXI.WebGLGraphics.graphicsDataPool = []; +/** + * @class WebGLGraphicsData + * @private + * @static + */ PIXI.WebGLGraphicsData = function(gl) { this.gl = gl; @@ -834,6 +846,9 @@ this.dirty = true; }; +/** + * @method reset + */ PIXI.WebGLGraphicsData.prototype.reset = function() { this.points = []; @@ -841,6 +856,9 @@ this.lastIndex = 0; }; +/** + * @method upload + */ PIXI.WebGLGraphicsData.prototype.upload = function() { var gl = this.gl; diff --git a/src/pixi/renderers/webgl/utils/WebGLMaskManager.js b/src/pixi/renderers/webgl/utils/WebGLMaskManager.js index 181f560..607d5dd 100644 --- a/src/pixi/renderers/webgl/utils/WebGLMaskManager.js +++ b/src/pixi/renderers/webgl/utils/WebGLMaskManager.js @@ -5,16 +5,17 @@ /** * @class WebGLMaskManager * @constructor -* @param gl {WebGLContext} the current WebGL drawing context * @private */ PIXI.WebGLMaskManager = function() { - //this.setContext(gl); }; +PIXI.WebGLMaskManager.prototype.constructor = PIXI.WebGLMaskManager; + /** -* Sets the drawing context to the one given in parameter +* Sets the drawing context to the one given in parameter. +* * @method setContext * @param gl {WebGLContext} the current WebGL drawing context */ @@ -24,10 +25,11 @@ }; /** -* Applies the Mask and adds it to the current filter stack +* Applies the Mask and adds it to the current filter stack. +* * @method pushMask * @param maskData {Array} -* @param renderSession {RenderSession} +* @param renderSession {Object} */ PIXI.WebGLMaskManager.prototype.pushMask = function(maskData, renderSession) { @@ -44,10 +46,11 @@ }; /** -* Removes the last filter from the filter stack and doesn't return it +* Removes the last filter from the filter stack and doesn't return it. +* * @method popMask -* -* @param renderSession {RenderSession} an object containing all the useful parameters +* @param maskData {Array} +* @param renderSession {Object} an object containing all the useful parameters */ PIXI.WebGLMaskManager.prototype.popMask = function(maskData, renderSession) { @@ -55,9 +58,9 @@ renderSession.stencilManager.popStencil(maskData, maskData._webGL[gl.id].data[0], renderSession); }; - /** -* Destroys the mask stack +* Destroys the mask stack. +* * @method destroy */ PIXI.WebGLMaskManager.prototype.destroy = function() diff --git a/src/pixi/renderers/webgl/utils/WebGLShaderManager.js b/src/pixi/renderers/webgl/utils/WebGLShaderManager.js index b597698..a15974e 100644 --- a/src/pixi/renderers/webgl/utils/WebGLShaderManager.js +++ b/src/pixi/renderers/webgl/utils/WebGLShaderManager.js @@ -5,38 +5,54 @@ /** * @class WebGLShaderManager * @constructor -* @param gl {WebGLContext} the current WebGL drawing context * @private */ PIXI.WebGLShaderManager = function() { - + /** + * @property maxAttibs + * @type Number + */ this.maxAttibs = 10; + + /** + * @property attribState + * @type Array + */ this.attribState = []; + + /** + * @property tempAttribState + * @type Array + */ this.tempAttribState = []; - for (var i = 0; i < this.maxAttibs; i++) { + for (var i = 0; i < this.maxAttibs; i++) + { this.attribState[i] = false; } + /** + * @property stack + * @type Array + */ this.stack = []; - - //this.setContext(gl); - // the final one is used for the rendering strips + }; +PIXI.WebGLShaderManager.prototype.constructor = PIXI.WebGLShaderManager; /** -* Initialises the context and the properties +* Initialises the context and the properties. +* * @method setContext * @param gl {WebGLContext} the current WebGL drawing context -* @param transparent {Boolean} Whether or not the drawing context should be transparent */ PIXI.WebGLShaderManager.prototype.setContext = function(gl) { this.gl = gl; - // the next one is used for rendering primatives + // the next one is used for rendering primitives this.primitiveShader = new PIXI.PrimitiveShader(gl); // the next one is used for rendering triangle strips @@ -53,16 +69,15 @@ this.setShader(this.defaultShader); }; - /** -* Takes the attributes given in parameters +* Takes the attributes given in parameters. +* * @method setAttribs * @param attribs {Array} attribs */ PIXI.WebGLShaderManager.prototype.setAttribs = function(attribs) { // reset temp state - var i; for (i = 0; i < this.tempAttribState.length; i++) @@ -97,6 +112,12 @@ } }; +/** +* Sets the current shader. +* +* @method setShader +* @param shader {Any} +*/ PIXI.WebGLShaderManager.prototype.setShader = function(shader) { if(this._currentId === shader._UID)return false; @@ -112,7 +133,8 @@ }; /** -* Destroys +* Destroys this object. +* * @method destroy */ PIXI.WebGLShaderManager.prototype.destroy = function() @@ -133,4 +155,3 @@ this.gl = null; }; - diff --git a/src/pixi/renderers/webgl/utils/WebGLShaderUtils.js b/src/pixi/renderers/webgl/utils/WebGLShaderUtils.js index f6cc024..88461d1 100644 --- a/src/pixi/renderers/webgl/utils/WebGLShaderUtils.js +++ b/src/pixi/renderers/webgl/utils/WebGLShaderUtils.js @@ -2,27 +2,44 @@ * @author Mat Groves http://matgroves.com/ @Doormat23 */ -// TODO Alvin and Mat -// Should we eventually create a Utils class ? -// Or just move this file to the pixi.js file ? +/** +* @method initDefaultShaders +* @private +*/ PIXI.initDefaultShaders = function() { - - // PIXI.stripShader = new PIXI.StripShader(); -// PIXI.stripShader.init(); - }; +/** +* @method CompileVertexShader +* @param gl {WebGLContext} the current WebGL drawing context +* @param shaderSrc {Array} +* @return {Any} +*/ PIXI.CompileVertexShader = function(gl, shaderSrc) { return PIXI._CompileShader(gl, shaderSrc, gl.VERTEX_SHADER); }; +/** +* @method CompileFragmentShader +* @param gl {WebGLContext} the current WebGL drawing context +* @param shaderSrc {Array} +* @return {Any} +*/ PIXI.CompileFragmentShader = function(gl, shaderSrc) { return PIXI._CompileShader(gl, shaderSrc, gl.FRAGMENT_SHADER); }; +/** +* @method _CompileShader +* @private +* @param gl {WebGLContext} the current WebGL drawing context +* @param shaderSrc {Array} +* @param shaderType {Number} +* @return {Any} +*/ PIXI._CompileShader = function(gl, shaderSrc, shaderType) { var src = shaderSrc.join("\n"); @@ -30,14 +47,22 @@ gl.shaderSource(shader, src); gl.compileShader(shader); - if (!gl.getShaderParameter(shader, gl.COMPILE_STATUS)) { - window.console.log(gl.getShaderInfoLog(shader)); + if (!gl.getShaderParameter(shader, gl.COMPILE_STATUS)) + { + console.log(gl.getShaderInfoLog(shader)); return null; } return shader; }; +/** +* @method compileProgram +* @param gl {WebGLContext} the current WebGL drawing context +* @param vertexSrc {Array} +* @param fragmentSrc {Array} +* @return {Any} +*/ PIXI.compileProgram = function(gl, vertexSrc, fragmentSrc) { var fragmentShader = PIXI.CompileFragmentShader(gl, fragmentSrc); @@ -49,8 +74,9 @@ gl.attachShader(shaderProgram, fragmentShader); gl.linkProgram(shaderProgram); - if (!gl.getProgramParameter(shaderProgram, gl.LINK_STATUS)) { - window.console.log("Could not initialise shaders"); + if (!gl.getProgramParameter(shaderProgram, gl.LINK_STATUS)) + { + console.log("Could not initialise shaders"); } return shaderProgram; diff --git a/src/pixi/renderers/webgl/utils/WebGLSpriteBatch.js b/src/pixi/renderers/webgl/utils/WebGLSpriteBatch.js index 4d59c80..f8a4bd7 100755 --- a/src/pixi/renderers/webgl/utils/WebGLSpriteBatch.js +++ b/src/pixi/renderers/webgl/utils/WebGLSpriteBatch.js @@ -13,15 +13,10 @@ * @class WebGLSpriteBatch * @private * @constructor - * @param gl {WebGLContext} the current WebGL drawing context - * */ PIXI.WebGLSpriteBatch = function() { - /** - * - * * @property vertSize * @type Number */ @@ -47,7 +42,6 @@ */ this.vertices = new Float32Array(numVerts); - //index data /** * Holds the indices * @@ -56,6 +50,10 @@ */ this.indices = new Uint16Array(numIndices); + /** + * @property lastIndexCount + * @type Number + */ this.lastIndexCount = 0; for (var i=0, j=0; i < numIndices; i += 6, j += 4) @@ -68,20 +66,58 @@ this.indices[i + 5] = j + 3; } - + /** + * @property drawing + * @type Boolean + */ this.drawing = false; - this.currentBatchSize = 0; - this.currentBaseTexture = null; - -// this.setContext(gl); + /** + * @property currentBatchSize + * @type Number + */ + this.currentBatchSize = 0; + + /** + * @property currentBaseTexture + * @type BaseTexture + */ + this.currentBaseTexture = null; + + /** + * @property dirty + * @type Boolean + */ this.dirty = true; + /** + * @property textures + * @type Array + */ this.textures = []; + + /** + * @property blendModes + * @type Array + */ this.blendModes = []; + + /** + * @property shaders + * @type Array + */ this.shaders = []; + + /** + * @property sprites + * @type Array + */ this.sprites = []; + /** + * @property defaultShader + * @type AbstractFilter + */ this.defaultShader = new PIXI.AbstractFilter([ 'precision lowp float;', 'varying vec2 vTextureCoord;', @@ -94,9 +130,7 @@ }; /** -* * @method setContext -* * @param gl {WebGLContext} the current WebGL drawing context */ PIXI.WebGLSpriteBatch.prototype.setContext = function(gl) @@ -109,7 +143,6 @@ // 65535 is max index, so 65535 / 6 = 10922. - //upload the index data gl.bindBuffer(gl.ELEMENT_ARRAY_BUFFER, this.indexBuffer); gl.bufferData(gl.ELEMENT_ARRAY_BUFFER, this.indices, gl.STATIC_DRAW); @@ -125,15 +158,12 @@ shader.uniforms = {}; shader.init(); - this.defaultShader.shaders[gl.id] = shader; }; /** -* * @method begin -* -* @param renderSession {RenderSession} the RenderSession +* @param renderSession {Object} The RenderSession object */ PIXI.WebGLSpriteBatch.prototype.begin = function(renderSession) { @@ -144,9 +174,7 @@ }; /** -* * @method end -* */ PIXI.WebGLSpriteBatch.prototype.end = function() { @@ -154,16 +182,13 @@ }; /** -* * @method render -* * @param sprite {Sprite} the sprite to render when using this spritebatch */ PIXI.WebGLSpriteBatch.prototype.render = function(sprite) { var texture = sprite.texture; - //TODO set blend modes.. // check texture.. if(this.currentBatchSize >= this.size) @@ -270,9 +295,9 @@ }; /** -* Renders a tilingSprite using the spriteBatch -* @method renderTilingSprite +* Renders a TilingSprite using the spriteBatch. * +* @method renderTilingSprite * @param sprite {TilingSprite} the tilingSprite to render */ PIXI.WebGLSpriteBatch.prototype.renderTilingSprite = function(tilingSprite) @@ -390,12 +415,10 @@ this.sprites[this.currentBatchSize++] = tilingSprite; }; - /** -* Renders the content and empties the current batch +* Renders the content and empties the current batch. * * @method flush -* */ PIXI.WebGLSpriteBatch.prototype.flush = function() { @@ -516,6 +539,12 @@ this.currentBatchSize = 0; }; +/** +* @method renderBatch +* @param texture {Texture} +* @param size {Number} +* @param startIndex {Number} +*/ PIXI.WebGLSpriteBatch.prototype.renderBatch = function(texture, size, startIndex) { if(size === 0)return; @@ -532,7 +561,6 @@ // bind the current texture gl.bindTexture(gl.TEXTURE_2D, texture._glTextures[gl.id]); } - // now draw those suckas! gl.drawElements(gl.TRIANGLES, size * 6, gl.UNSIGNED_SHORT, startIndex * 6 * 2); @@ -541,11 +569,8 @@ this.renderSession.drawCount++; }; - /** -* * @method stop -* */ PIXI.WebGLSpriteBatch.prototype.stop = function() { @@ -554,9 +579,7 @@ }; /** -* * @method start -* */ PIXI.WebGLSpriteBatch.prototype.start = function() { @@ -564,12 +587,12 @@ }; /** -* Destroys the SpriteBatch +* Destroys the SpriteBatch. +* * @method destroy */ PIXI.WebGLSpriteBatch.prototype.destroy = function() { - this.vertices = null; this.indices = null; diff --git a/src/pixi/renderers/webgl/utils/WebGLStencilManager.js b/src/pixi/renderers/webgl/utils/WebGLStencilManager.js index f841e6f..367d7dc 100644 --- a/src/pixi/renderers/webgl/utils/WebGLStencilManager.js +++ b/src/pixi/renderers/webgl/utils/WebGLStencilManager.js @@ -5,21 +5,18 @@ /** * @class WebGLStencilManager * @constructor -* @param gl {WebGLContext} the current WebGL drawing context * @private */ PIXI.WebGLStencilManager = function() { - this.stencilStack = []; - //this.setContext(gl); this.reverse = true; this.count = 0; - }; /** -* Sets the drawing context to the one given in parameter +* Sets the drawing context to the one given in parameter. +* * @method setContext * @param gl {WebGLContext} the current WebGL drawing context */ @@ -29,10 +26,12 @@ }; /** -* Applies the Mask and adds it to the current filter stack +* Applies the Mask and adds it to the current filter stack. +* * @method pushMask -* @param maskData {Array} -* @param renderSession {RenderSession} +* @param graphics {Graphics} +* @param webGLData {Array} +* @param renderSession {Object} */ PIXI.WebGLStencilManager.prototype.pushStencil = function(graphics, webGLData, renderSession) { @@ -60,7 +59,6 @@ if(webGLData.mode === 1) { - gl.drawElements(gl.TRIANGLE_FAN, webGLData.indices.length - 4, gl.UNSIGNED_SHORT, 0 ); if(this.reverse) @@ -119,7 +117,14 @@ this.count++; }; -//TODO this does not belong here! +/** + * TODO this does not belong here! + * + * @method bindGraphics + * @param graphics {Graphics} + * @param webGLData {Array} + * @param renderSession {Object} + */ PIXI.WebGLStencilManager.prototype.bindGraphics = function(graphics, webGLData, renderSession) { //if(this._currentGraphics === graphics)return; @@ -182,6 +187,12 @@ } }; +/** + * @method popStencil + * @param graphics {Graphics} + * @param webGLData {Array} + * @param renderSession {Object} + */ PIXI.WebGLStencilManager.prototype.popStencil = function(graphics, webGLData, renderSession) { var gl = this.gl; @@ -272,7 +283,8 @@ }; /** -* Destroys the mask stack +* Destroys the mask stack. +* * @method destroy */ PIXI.WebGLStencilManager.prototype.destroy = function() diff --git a/src/pixi/utils/Detector.js b/src/pixi/utils/Detector.js index c0bd1ed..33a97a9 100644 --- a/src/pixi/utils/Detector.js +++ b/src/pixi/utils/Detector.js @@ -44,9 +44,10 @@ /** * This helper function will automatically detect which renderer you should be using. * This function is very similar to the autoDetectRenderer function except that is will return a canvas renderer for android. - * Even thought both android chrome suports webGL the canvas implementation perform better at the time of writing. - * This function will likely change and update as webGL performance imporoves on thease devices. - * @class getRecommendedRenderer + * Even thought both android chrome supports webGL the canvas implementation perform better at the time of writing. + * This function will likely change and update as webGL performance improves on these devices. + * + * @class autoDetectRecommendedRenderer * @static * @param width=800 {Number} the width of the renderers view * @param height=600 {Number} the height of the renderers view diff --git a/src/pixi/utils/EventTarget.js b/src/pixi/utils/EventTarget.js index 4e701d9..32536e3 100644 --- a/src/pixi/utils/EventTarget.js +++ b/src/pixi/utils/EventTarget.js @@ -4,7 +4,7 @@ */ /** - * Originally based on https://github.com/mrdoob/eventtarget.js/ from mr DOob. + * Originally based on https://github.com/mrdoob/eventtarget.js/ from mr Doob. * Currently takes inspiration from the nodejs EventEmitter, EventEmitter3, and smokesignals */ @@ -18,7 +18,7 @@ * PIXI.EventTarget.mixin(MyEmitter.prototype); * * var em = new MyEmitter(); - * em.emit('eventName', 'some data', 'some moar data', {}, null, ...); + * em.emit('eventName', 'some data', 'some more data', {}, null, ...); */ PIXI.EventTarget = { /** diff --git a/src/pixi/utils/Polyk.js b/src/pixi/utils/Polyk.js index aaf3bdb..0e150b2 100644 --- a/src/pixi/utils/Polyk.js +++ b/src/pixi/utils/Polyk.js @@ -28,23 +28,21 @@ This is an amazing lib! - slightly modified by Mat Groves (matgroves.com); + Slightly modified by Mat Groves (matgroves.com); */ /** * Based on the Polyk library http://polyk.ivank.net released under MIT licence. * This is an amazing lib! - * slightly modified by Mat Groves (matgroves.com); + * Slightly modified by Mat Groves (matgroves.com); * @class PolyK - * */ PIXI.PolyK = {}; /** - * Triangulates shapes for webGL graphic fills + * Triangulates shapes for webGL graphic fills. * * @method Triangulate - * */ PIXI.PolyK.Triangulate = function(p) { @@ -132,6 +130,7 @@ * @param cx {Number} x coordinate of the c point of the triangle * @param cy {Number} y coordinate of the c point of the triangle * @private + * @return {Boolean} */ PIXI.PolyK._PointInTriangle = function(px, py, ax, ay, bx, by, cx, cy) { @@ -160,8 +159,8 @@ * Checks whether a shape is convex * * @method _convex - * * @private + * @return {Boolean} */ PIXI.PolyK._convex = function(ax, ay, bx, by, cx, cy, sign) { diff --git a/src/pixi/InteractionData.js b/src/pixi/InteractionData.js index ea77370..fa84a6d 100644 --- a/src/pixi/InteractionData.js +++ b/src/pixi/InteractionData.js @@ -18,7 +18,6 @@ */ this.global = new PIXI.Point(); - /** * The target Sprite that was interacted with * diff --git a/src/pixi/InteractionManager.js b/src/pixi/InteractionManager.js index 685c386..71f320b 100644 --- a/src/pixi/InteractionManager.js +++ b/src/pixi/InteractionManager.js @@ -14,7 +14,7 @@ PIXI.InteractionManager = function(stage) { /** - * a reference to the stage + * A reference to the stage * * @property stage * @type Stage @@ -22,7 +22,7 @@ this.stage = stage; /** - * the mouse data + * The mouse data * * @property mouse * @type InteractionData @@ -30,18 +30,21 @@ this.mouse = new PIXI.InteractionData(); /** - * an object that stores current touches (InteractionData) by id reference + * An object that stores current touches (InteractionData) by id reference * * @property touches * @type Object */ this.touches = {}; - // helpers + /** + * @property tempPoint + * @type Point + * @private + */ this.tempPoint = new PIXI.Point(); /** - * * @property mouseoverEnabled * @type Boolean * @default @@ -49,7 +52,7 @@ this.mouseoverEnabled = true; /** - * tiny little interactiveData pool ! + * Tiny little interactiveData pool ! * * @property pool * @type Array @@ -61,7 +64,6 @@ * @property interactiveItems * @type Array * @private - * */ this.interactiveItems = []; @@ -73,23 +75,60 @@ */ this.interactionDOMElement = null; - //this will make it so that you dont have to call bind all the time + //this will make it so that you don't have to call bind all the time + + /** + * @property onMouseMove + * @type Function + */ this.onMouseMove = this.onMouseMove.bind( this ); + + /** + * @property onMouseDown + * @type Function + */ this.onMouseDown = this.onMouseDown.bind(this); + + /** + * @property onMouseOut + * @type Function + */ this.onMouseOut = this.onMouseOut.bind(this); + + /** + * @property onMouseUp + * @type Function + */ this.onMouseUp = this.onMouseUp.bind(this); + /** + * @property onTouchStart + * @type Function + */ this.onTouchStart = this.onTouchStart.bind(this); + + /** + * @property onTouchEnd + * @type Function + */ this.onTouchEnd = this.onTouchEnd.bind(this); + + /** + * @property onTouchMove + * @type Function + */ this.onTouchMove = this.onTouchMove.bind(this); + /** + * @property last + * @type Number + */ this.last = 0; /** * The css style of the cursor that is being used * @property currentCursorStyle * @type String - * */ this.currentCursorStyle = 'inherit'; @@ -97,10 +136,13 @@ * Is set to true when the mouse is moved out of the canvas * @property mouseOut * @type Boolean - * */ this.mouseOut = false; + /** + * @property resolution + * @type Number + */ this.resolution = 1; }; @@ -166,7 +208,6 @@ this.setTargetDomElement (target.view); }; - /** * Sets the DOM element which will receive mouse/touch events. This is useful for when you have other DOM * elements on top of the renderers Canvas element. With this you'll be able to delegate another DOM element @@ -201,7 +242,10 @@ window.addEventListener('mouseup', this.onMouseUp, true); }; - +/** + * @method removeEvents + * @private + */ PIXI.InteractionManager.prototype.removeEvents = function() { if (!this.interactionDOMElement) return; @@ -308,6 +352,10 @@ } }; +/** + * @method rebuildInteractiveGraph + * @private + */ PIXI.InteractionManager.prototype.rebuildInteractiveGraph = function() { this.dirty = false; @@ -427,10 +475,10 @@ }; /** - * Is called when the mouse button is moved out of the renderer element + * Is called when the mouse is moved out of the renderer element * * @method onMouseOut - * @param event {Event} The DOM event of a mouse button being moved out + * @param event {Event} The DOM event of a mouse being moved out * @private */ PIXI.InteractionManager.prototype.onMouseOut = function(event) diff --git a/src/pixi/renderers/webgl/WebGLRenderer.js b/src/pixi/renderers/webgl/WebGLRenderer.js index 968fd3d..422896f 100644 --- a/src/pixi/renderers/webgl/WebGLRenderer.js +++ b/src/pixi/renderers/webgl/WebGLRenderer.js @@ -5,23 +5,21 @@ PIXI.glContexts = []; // this is where we store the webGL contexts for easy access. /** - * the WebGLRenderer draws the stage and all its content onto a webGL enabled canvas. This renderer - * should be used for browsers that support webGL. This Render works by automatically managing webGLBatch's. - * So no need for Sprite Batch's or Sprite Cloud's - * Dont forget to add the view to your DOM or you will not see anything :) + * The WebGLRenderer draws the stage and all its content onto a webGL enabled canvas. This renderer + * should be used for browsers that support webGL. This Render works by automatically managing webGLBatchs. + * So no need for Sprite Batches or Sprite Clouds. + * Don't forget to add the view to your DOM or you will not see anything :) * * @class WebGLRenderer * @constructor * @param [width=0] {Number} the width of the canvas view * @param [height=0] {Number} the height of the canvas view - * * @param [options] {Object} The optional renderer parameters * @param [options.view] {HTMLCanvasElement} the canvas to use as a view, optional * @param [options.transparent=false] {Boolean} If the render view is transparent, default false * @param [options.antialias=false] {Boolean} sets antialias (only applicable in chrome at the moment) * @param [options.preserveDrawingBuffer=false] {Boolean} enables drawing buffer preservation, enable this if you need to call toDataUrl on the webgl context * @param [options.resolution=1] {Number} the resolution of the renderer retina would be 2 - * */ PIXI.WebGLRenderer = function(width, height, options) { @@ -37,13 +35,16 @@ options = PIXI.defaultRenderOptions; } - if(!PIXI.defaultRenderer) { PIXI.sayHello('webGL'); PIXI.defaultRenderer = this; } + /** + * @property type + * @type Number + */ this.type = PIXI.WEBGL_RENDERER; /** @@ -56,6 +57,7 @@ this.resolution = options.resolution; // do a catch.. only 1 webGL renderer.. + /** * Whether the render view is transparent * @@ -99,12 +101,27 @@ this.view = options.view || document.createElement( 'canvas' ); // deal with losing context.. + + /** + * @property contextLostBound + * @type Function + */ this.contextLostBound = this.handleContextLost.bind(this); + + /** + * @property contextRestoredBound + * @type Function + */ this.contextRestoredBound = this.handleContextRestored.bind(this); this.view.addEventListener('webglcontextlost', this.contextLostBound, false); this.view.addEventListener('webglcontextrestored', this.contextRestoredBound, false); + /** + * @property _contextOptions + * @type Object + * @private + */ this._contextOptions = { alpha: this.transparent, antialias: options.antialias, // SPEED UP?? @@ -113,18 +130,67 @@ preserveDrawingBuffer: options.preserveDrawingBuffer }; + /** + * @property projection + * @type Point + */ this.projection = new PIXI.Point(); + + /** + * @property offset + * @type Point + */ this.offset = new PIXI.Point(0, 0); - // time to create the render managers! each one focuses on managine a state in webGL - 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(); // manages the stencil buffer - this.blendModeManager = new PIXI.WebGLBlendModeManager(); // manages the blendModes + // time to create the render managers! each one focuses on managing a state in webGL - // TODO remove + /** + * Deals with managing the shader programs and their attribs + * @property shaderManager + * @type WebGLShaderManager + */ + this.shaderManager = new PIXI.WebGLShaderManager(); + + /** + * Manages the rendering of sprites + * @property spriteBatch + * @type WebGLSpriteBatch + */ + this.spriteBatch = new PIXI.WebGLSpriteBatch(); + + /** + * Manages the masks using the stencil buffer + * @property maskManager + * @type WebGLMaskManager + */ + this.maskManager = new PIXI.WebGLMaskManager(); + + /** + * Manages the filters + * @property filterManager + * @type WebGLFilterManager + */ + this.filterManager = new PIXI.WebGLFilterManager(); + + /** + * Manages the stencil buffer + * @property stencilManager + * @type WebGLStencilManager + */ + this.stencilManager = new PIXI.WebGLStencilManager(); + + /** + * Manages the blendModes + * @property blendModeManager + * @type WebGLBlendModeManager + */ + this.blendModeManager = new PIXI.WebGLBlendModeManager(); + + /** + * TODO remove + * @property renderSession + * @type Object + */ this.renderSession = {}; this.renderSession.gl = this.gl; this.renderSession.drawCount = 0; @@ -147,6 +213,9 @@ // constructor PIXI.WebGLRenderer.prototype.constructor = PIXI.WebGLRenderer; +/** +* @method initContext +*/ PIXI.WebGLRenderer.prototype.initContext = function() { var gl = this.view.getContext('webgl', this._contextOptions) || this.view.getContext('experimental-webgl', this._contextOptions); @@ -180,7 +249,6 @@ this.resize(this.width, this.height); }; - /** * Renders the stage to its webGL view * @@ -205,9 +273,7 @@ // update the scene graph stage.updateTransform(); - var gl = this.gl; - // interaction if(stage._interactive) @@ -249,9 +315,9 @@ }; /** - * Renders a display Object + * Renders a Display Object. * - * @method renderDIsplayObject + * @method renderDisplayObject * @param displayObject {DisplayObject} The DisplayObject to render * @param projection {Point} The projection * @param buffer {Array} a standard WebGL buffer @@ -283,7 +349,7 @@ }; /** - * resizes the webGL view to the specified width and height + * Resizes the webGL view to the specified width and height. * * @method resize * @param width {Number} the new width of the webGL view @@ -297,10 +363,6 @@ this.view.width = this.width; this.view.height = this.height; - // this.view.style.width = width + 'px'; - // this.view.style.height = height + 'px'; - - // console.log(this.width / this.resolution) this.gl.viewport(0, 0, this.width, this.height); this.projection.x = this.width / 2 / this.resolution; @@ -308,10 +370,10 @@ }; /** - * Updates and Creates a WebGL texture for the renderers context + * Updates and Creates a WebGL texture for the renderers context. * * @method updateTexture - * @param texture {Texture} the texture to render + * @param texture {Texture} the texture to update */ PIXI.WebGLRenderer.prototype.updateTexture = function(texture) { @@ -411,6 +473,11 @@ this.renderSession = null; }; +/** + * Maps Pixi blend modes to WebGL blend modes. + * + * @method mapBlendModes + */ PIXI.WebGLRenderer.prototype.mapBlendModes = function() { var gl = this.gl; diff --git a/src/pixi/renderers/webgl/shaders/ComplexPrimitiveShader.js b/src/pixi/renderers/webgl/shaders/ComplexPrimitiveShader.js index daa8b64..79d038a 100644 --- a/src/pixi/renderers/webgl/shaders/ComplexPrimitiveShader.js +++ b/src/pixi/renderers/webgl/shaders/ComplexPrimitiveShader.js @@ -9,7 +9,13 @@ */ PIXI.ComplexPrimitiveShader = function(gl) { + /** + * @property _UID + * @type Number + * @private + */ this._UID = PIXI._UID++; + /** * @property gl * @type WebGLContext @@ -17,18 +23,20 @@ this.gl = gl; /** - * @property {any} program - The WebGL program. - */ + * The WebGL program. + * @property program + * @type {Any} + */ this.program = null; /** + * The fragment shader. * @property fragmentSrc * @type Array */ this.fragmentSrc = [ - 'precision mediump float;', - + 'precision mediump float;', 'varying vec4 vColor;', @@ -38,6 +46,7 @@ ]; /** + * The vertex shader. * @property vertexSrc * @type Array */ @@ -65,14 +74,15 @@ this.init(); }; +PIXI.ComplexPrimitiveShader.prototype.constructor = PIXI.ComplexPrimitiveShader; + /** -* Initialises the shader +* Initialises the shader. +* * @method init -* */ PIXI.ComplexPrimitiveShader.prototype.init = function() { - var gl = this.gl; var program = PIXI.compileProgram(gl, this.vertexSrc, this.fragmentSrc); @@ -84,7 +94,6 @@ this.tintColor = gl.getUniformLocation(program, 'tint'); this.color = gl.getUniformLocation(program, 'color'); - // get and store the attributes this.aVertexPosition = gl.getAttribLocation(program, 'aVertexPosition'); // this.colorAttribute = gl.getAttribLocation(program, 'aColor'); @@ -98,9 +107,9 @@ }; /** -* Destroys the shader +* Destroys the shader. +* * @method destroy -* */ PIXI.ComplexPrimitiveShader.prototype.destroy = function() { diff --git a/src/pixi/renderers/webgl/shaders/PixiFastShader.js b/src/pixi/renderers/webgl/shaders/PixiFastShader.js index 4fb3fe2..bb46419 100644 --- a/src/pixi/renderers/webgl/shaders/PixiFastShader.js +++ b/src/pixi/renderers/webgl/shaders/PixiFastShader.js @@ -1,6 +1,5 @@ /** * @author Mat Groves http://matgroves.com/ @Doormat23 - * @author Richard Davey http://www.photonstorm.com @photonstorm */ /** @@ -10,6 +9,11 @@ */ PIXI.PixiFastShader = function(gl) { + /** + * @property _UID + * @type Number + * @private + */ this._UID = PIXI._UID++; /** @@ -19,12 +23,16 @@ this.gl = gl; /** - * @property {any} program - The WebGL program. + * The WebGL program. + * @property program + * @type {Any} */ this.program = null; /** - * @property {array} fragmentSrc - The fragment shader. + * The fragment shader. + * @property fragmentSrc + * @type Array */ this.fragmentSrc = [ 'precision lowp float;', @@ -37,8 +45,10 @@ ]; /** - * @property {array} vertexSrc - The vertex shader - */ + * The vertex shader. + * @property vertexSrc + * @type Array + */ this.vertexSrc = [ 'attribute vec2 aVertexPosition;', 'attribute vec2 aPositionCoord;', @@ -69,24 +79,25 @@ '}' ]; - /** - * @property {number} textureCount - A local texture counter for multi-texture shaders. - */ + * A local texture counter for multi-texture shaders. + * @property textureCount + * @type Number + */ this.textureCount = 0; - this.init(); }; +PIXI.PixiFastShader.prototype.constructor = PIXI.PixiFastShader; + /** -* Initialises the shader +* Initialises the shader. +* * @method init -* */ PIXI.PixiFastShader.prototype.init = function() { - var gl = this.gl; var program = PIXI.compileProgram(gl, this.vertexSrc, this.fragmentSrc); @@ -111,8 +122,6 @@ this.aTextureCoord = gl.getAttribLocation(program, 'aTextureCoord'); this.colorAttribute = gl.getAttribLocation(program, 'aColor'); - - // Begin worst hack eva // // WHY??? ONLY on my chrome pixel the line above returns -1 when using filters? @@ -128,14 +137,13 @@ // End worst hack eva // - this.program = program; }; /** -* Destroys the shader +* Destroys the shader. +* * @method destroy -* */ PIXI.PixiFastShader.prototype.destroy = function() { diff --git a/src/pixi/renderers/webgl/shaders/PixiShader.js b/src/pixi/renderers/webgl/shaders/PixiShader.js index d76ec03..725dce2 100644 --- a/src/pixi/renderers/webgl/shaders/PixiShader.js +++ b/src/pixi/renderers/webgl/shaders/PixiShader.js @@ -6,9 +6,15 @@ /** * @class PixiShader * @constructor +* @param gl {WebGLContext} the current WebGL drawing context */ PIXI.PixiShader = function(gl) { + /** + * @property _UID + * @type Number + * @private + */ this._UID = PIXI._UID++; /** @@ -18,13 +24,17 @@ this.gl = gl; /** - * @property {any} program - The WebGL program. - */ + * The WebGL program. + * @property program + * @type {Any} + */ this.program = null; /** - * @property {array} fragmentSrc - The fragment shader. - */ + * The fragment shader. + * @property fragmentSrc + * @type Array + */ this.fragmentSrc = [ 'precision lowp float;', 'varying vec2 vTextureCoord;', @@ -36,21 +46,44 @@ ]; /** - * @property {number} textureCount - A local texture counter for multi-texture shaders. - */ + * A local texture counter for multi-texture shaders. + * @property textureCount + * @type Number + */ this.textureCount = 0; + + /** + * A local flag + * @property firstRun + * @type Boolean + * @private + */ this.firstRun = true; + + /** + * A dirty flag + * @property dirty + * @type Boolean + */ this.dirty = true; + /** + * Uniform attributes cache. + * @property attributes + * @type Array + * @private + */ this.attributes = []; this.init(); }; +PIXI.PixiShader.prototype.constructor = PIXI.PixiShader; + /** -* Initialises the shader +* Initialises the shader. +* * @method init -* */ PIXI.PixiShader.prototype.init = function() { @@ -71,12 +104,11 @@ this.aTextureCoord = gl.getAttribLocation(program, 'aTextureCoord'); this.colorAttribute = gl.getAttribLocation(program, 'aColor'); - // Begin worst hack eva // // WHY??? ONLY on my chrome pixel the line above returns -1 when using filters? // maybe its something to do with the current state of the gl context. - // Im convinced this is a bug in the chrome browser as there is NO reason why this should be returning -1 especially as it only manifests on my chrome pixel + // I'm convinced this is a bug in the chrome browser as there is NO reason why this should be returning -1 especially as it only manifests on my chrome pixel // If theres any webGL people that know why could happen please help :) if(this.colorAttribute === -1) { @@ -101,6 +133,7 @@ /** * Initialises the shader uniform values. +* * Uniforms are specified in the GLSL_ES Specification: http://www.khronos.org/registry/webgl/specs/latest/1.0/ * http://www.khronos.org/registry/gles/specs/2.0/GLSL_ES_Specification_1.0.17.pdf * @@ -316,7 +349,8 @@ }; /** -* Destroys the shader +* Destroys the shader. +* * @method destroy */ PIXI.PixiShader.prototype.destroy = function() @@ -329,7 +363,8 @@ }; /** -* The Default Vertex shader source +* The Default Vertex shader source. +* * @property defaultVertexSrc * @type String */ diff --git a/src/pixi/renderers/webgl/shaders/PrimitiveShader.js b/src/pixi/renderers/webgl/shaders/PrimitiveShader.js index 3a82be2..0f6854c 100644 --- a/src/pixi/renderers/webgl/shaders/PrimitiveShader.js +++ b/src/pixi/renderers/webgl/shaders/PrimitiveShader.js @@ -9,6 +9,11 @@ */ PIXI.PrimitiveShader = function(gl) { + /** + * @property _UID + * @type Number + * @private + */ this._UID = PIXI._UID++; /** @@ -18,11 +23,14 @@ this.gl = gl; /** - * @property {any} program - The WebGL program. - */ + * The WebGL program. + * @property program + * @type {Any} + */ this.program = null; /** + * The fragment shader. * @property fragmentSrc * @type Array */ @@ -36,6 +44,7 @@ ]; /** + * The vertex shader. * @property vertexSrc * @type Array */ @@ -60,14 +69,15 @@ this.init(); }; +PIXI.PrimitiveShader.prototype.constructor = PIXI.PrimitiveShader; + /** -* Initialises the shader +* Initialises the shader. +* * @method init -* */ PIXI.PrimitiveShader.prototype.init = function() { - var gl = this.gl; var program = PIXI.compileProgram(gl, this.vertexSrc, this.fragmentSrc); @@ -78,7 +88,6 @@ this.offsetVector = gl.getUniformLocation(program, 'offsetVector'); this.tintColor = gl.getUniformLocation(program, 'tint'); - // get and store the attributes this.aVertexPosition = gl.getAttribLocation(program, 'aVertexPosition'); this.colorAttribute = gl.getAttribLocation(program, 'aColor'); @@ -92,9 +101,9 @@ }; /** -* Destroys the shader +* Destroys the shader. +* * @method destroy -* */ PIXI.PrimitiveShader.prototype.destroy = function() { diff --git a/src/pixi/renderers/webgl/shaders/StripShader.js b/src/pixi/renderers/webgl/shaders/StripShader.js index 11f13ad..8fefe51 100644 --- a/src/pixi/renderers/webgl/shaders/StripShader.js +++ b/src/pixi/renderers/webgl/shaders/StripShader.js @@ -2,20 +2,37 @@ * @author Mat Groves http://matgroves.com/ @Doormat23 */ - +/** +* @class StripShader +* @constructor +* @param gl {WebGLContext} the current WebGL drawing context +*/ PIXI.StripShader = function(gl) { + /** + * @property _UID + * @type Number + * @private + */ this._UID = PIXI._UID++; + /** + * @property gl + * @type WebGLContext + */ this.gl = gl; /** - * @property {any} program - The WebGL program. - */ + * The WebGL program. + * @property program + * @type {Any} + */ this.program = null; /** - * @property {array} fragmentSrc - The fragment shader. + * The fragment shader. + * @property fragmentSrc + * @type Array */ this.fragmentSrc = [ 'precision mediump float;', @@ -30,9 +47,11 @@ '}' ]; - /** - * @property {array} fragmentSrc - The fragment shader. - */ + /** + * The vertex shader. + * @property vertexSrc + * @type Array + */ this.vertexSrc = [ 'attribute vec2 aVertexPosition;', 'attribute vec2 aTextureCoord;', @@ -56,10 +75,12 @@ this.init(); }; +PIXI.StripShader.prototype.constructor = PIXI.StripShader; + /** -* Initialises the shader +* Initialises the shader. +* * @method init -* */ PIXI.StripShader.prototype.init = function() { @@ -88,9 +109,9 @@ }; /** -* Destroys the shader +* Destroys the shader. +* * @method destroy -* */ PIXI.StripShader.prototype.destroy = function() { diff --git a/src/pixi/renderers/webgl/utils/FilterTexture.js b/src/pixi/renderers/webgl/utils/FilterTexture.js index 9dada23..389acbe 100644 --- a/src/pixi/renderers/webgl/utils/FilterTexture.js +++ b/src/pixi/renderers/webgl/utils/FilterTexture.js @@ -9,7 +9,6 @@ * @param width {Number} the horizontal range of the filter * @param height {Number} the vertical range of the filter * @param scaleMode {Number} Should be one of the PIXI.scaleMode consts -* @private */ PIXI.FilterTexture = function(gl, width, height, scaleMode) { @@ -19,11 +18,24 @@ */ this.gl = gl; - // next time to create a frame buffer and texture + + /** + * @property frameBuffer + * @type Any + */ this.frameBuffer = gl.createFramebuffer(); + + /** + * @property texture + * @type Any + */ this.texture = gl.createTexture(); + /** + * @property scaleMode + * @type Number + */ scaleMode = scaleMode || PIXI.scaleModes.DEFAULT; gl.bindTexture(gl.TEXTURE_2D, this.texture); @@ -44,9 +56,11 @@ this.resize(width, height); }; +PIXI.FilterTexture.prototype.constructor = PIXI.FilterTexture; /** -* Clears the filter texture +* Clears the filter texture. +* * @method clear */ PIXI.FilterTexture.prototype.clear = function() @@ -75,14 +89,14 @@ gl.bindTexture(gl.TEXTURE_2D, this.texture); gl.texImage2D(gl.TEXTURE_2D, 0, gl.RGBA, width , height , 0, gl.RGBA, gl.UNSIGNED_BYTE, null); - // console.log( width, width ) // update the stencil buffer width and height gl.bindRenderbuffer(gl.RENDERBUFFER, this.renderBuffer); gl.renderbufferStorage(gl.RENDERBUFFER, gl.DEPTH_STENCIL, width , height ); }; /** -* Destroys the filter texture +* Destroys the filter texture. +* * @method destroy */ PIXI.FilterTexture.prototype.destroy = function() diff --git a/src/pixi/renderers/webgl/utils/WebGLBlendModeManager.js b/src/pixi/renderers/webgl/utils/WebGLBlendModeManager.js index c73728f..3de0ec9 100644 --- a/src/pixi/renderers/webgl/utils/WebGLBlendModeManager.js +++ b/src/pixi/renderers/webgl/utils/WebGLBlendModeManager.js @@ -3,31 +3,42 @@ */ /** -* @class WebGLMaskManager +* @class WebGLBlendModeManager * @constructor * @param gl {WebGLContext} the current WebGL drawing context -* @private */ PIXI.WebGLBlendModeManager = function() { + /** + * @property currentBlendMode + * @type Number + */ this.currentBlendMode = 99999; }; +PIXI.WebGLBlendModeManager.prototype.constructor = PIXI.WebGLBlendModeManager; + +/** + * Sets the WebGL Context. + * + * @method setContext + * @param gl {WebGLContext} the current WebGL drawing context + */ PIXI.WebGLBlendModeManager.prototype.setContext = function(gl) { this.gl = gl; }; /** -* Sets-up the given blendMode from WebGL's point of view +* Sets-up the given blendMode from WebGL's point of view. +* * @method setBlendMode -* * @param blendMode {Number} the blendMode, should be a Pixi const, such as PIXI.BlendModes.ADD */ PIXI.WebGLBlendModeManager.prototype.setBlendMode = function(blendMode) { if(this.currentBlendMode === blendMode)return false; - // console.log("SWAP!") + this.currentBlendMode = blendMode; var blendModeWebGL = PIXI.blendModesWebGL[this.currentBlendMode]; @@ -36,7 +47,12 @@ return true; }; +/** +* Destroys this object. +* +* @method destroy +*/ PIXI.WebGLBlendModeManager.prototype.destroy = function() { this.gl = null; -}; \ No newline at end of file +}; diff --git a/src/pixi/renderers/webgl/utils/WebGLFastSpriteBatch.js b/src/pixi/renderers/webgl/utils/WebGLFastSpriteBatch.js index 0d08e47..0bdbbe4 100644 --- a/src/pixi/renderers/webgl/utils/WebGLFastSpriteBatch.js +++ b/src/pixi/renderers/webgl/utils/WebGLFastSpriteBatch.js @@ -8,27 +8,66 @@ * https://github.com/libgdx/libgdx/blob/master/gdx/src/com/badlogic/gdx/graphics/g2d/WebGLSpriteBatch.java */ +/** +* @class WebGLFastSpriteBatch +* @constructor +*/ PIXI.WebGLFastSpriteBatch = function() { - - + /** + * @property vertSize + * @type Number + */ this.vertSize = 10; + + /** + * @property maxSize + * @type Number + */ this.maxSize = 6000;//Math.pow(2, 16) / this.vertSize; + + /** + * @property size + * @type Number + */ this.size = this.maxSize; //the total number of floats in our batch var numVerts = this.size * 4 * this.vertSize; + //the total number of indices in our batch var numIndices = this.maxSize * 6; - //vertex data + /** + * Vertex data + * @property vertices + * @type Float32Array + */ this.vertices = new Float32Array(numVerts); - //index data + + /** + * Index data + * @property indices + * @type Uint16Array + */ this.indices = new Uint16Array(numIndices); + /** + * @property vertexBuffer + * @type Object + */ this.vertexBuffer = null; + + /** + * @property indexBuffer + * @type Object + */ this.indexBuffer = null; + /** + * @property lastIndexCount + * @type Number + */ this.lastIndexCount = 0; for (var i=0, j=0; i < numIndices; i += 6, j += 4) @@ -41,21 +80,58 @@ this.indices[i + 5] = j + 3; } + /** + * @property drawing + * @type Boolean + */ this.drawing = false; + + /** + * @property currentBatchSize + * @type Number + */ this.currentBatchSize = 0; + + /** + * @property currentBaseTexture + * @type BaseTexture + */ this.currentBaseTexture = null; + /** + * @property currentBlendMode + * @type Number + */ this.currentBlendMode = 0; + + /** + * @property renderSession + * @type Object + */ this.renderSession = null; - + /** + * @property shader + * @type Object + */ this.shader = null; + /** + * @property matrix + * @type Matrix + */ this.matrix = null; - //this.setContext(gl); }; +PIXI.WebGLFastSpriteBatch.prototype.constructor = PIXI.WebGLFastSpriteBatch; + +/** + * Sets the WebGL Context. + * + * @method setContext + * @param gl {WebGLContext} the current WebGL drawing context + */ PIXI.WebGLFastSpriteBatch.prototype.setContext = function(gl) { this.gl = gl; @@ -66,7 +142,6 @@ // 65535 is max index, so 65535 / 6 = 10922. - //upload the index data gl.bindBuffer(gl.ELEMENT_ARRAY_BUFFER, this.indexBuffer); gl.bufferData(gl.ELEMENT_ARRAY_BUFFER, this.indices, gl.STATIC_DRAW); @@ -75,6 +150,11 @@ gl.bufferData(gl.ARRAY_BUFFER, this.vertices, gl.DYNAMIC_DRAW); }; +/** + * @method begin + * @param spriteBatch {WebGLSpriteBatch} + * @param renderSession {Object} + */ PIXI.WebGLFastSpriteBatch.prototype.begin = function(spriteBatch, renderSession) { this.renderSession = renderSession; @@ -85,15 +165,20 @@ this.start(); }; +/** + * @method end + */ PIXI.WebGLFastSpriteBatch.prototype.end = function() { this.flush(); }; - +/** + * @method render + * @param spriteBatch {WebGLSpriteBatch} + */ PIXI.WebGLFastSpriteBatch.prototype.render = function(spriteBatch) { - var children = spriteBatch.children; var sprite = children[0]; @@ -119,6 +204,10 @@ this.flush(); }; +/** + * @method renderSprite + * @param sprite {Sprite} + */ PIXI.WebGLFastSpriteBatch.prototype.renderSprite = function(sprite) { //sprite = children[i]; @@ -137,7 +226,6 @@ uvs = sprite.texture._uvs; - width = sprite.texture.frame.width; height = sprite.texture.frame.height; @@ -257,9 +345,11 @@ } }; +/** + * @method flush + */ PIXI.WebGLFastSpriteBatch.prototype.flush = function() { - // If the batch is length 0 then return as there is nothing to draw if (this.currentBatchSize===0)return; @@ -272,7 +362,6 @@ gl.bindTexture(gl.TEXTURE_2D, this.currentBaseTexture._glTextures[gl.id]); // upload the verts to the buffer - if(this.currentBatchSize > ( this.size * 0.5 ) ) { @@ -285,7 +374,6 @@ gl.bufferSubData(gl.ARRAY_BUFFER, 0, view); } - // now draw those suckas! gl.drawElements(gl.TRIANGLES, this.currentBatchSize * 6, gl.UNSIGNED_SHORT, 0); @@ -297,11 +385,17 @@ }; +/** + * @method stop + */ PIXI.WebGLFastSpriteBatch.prototype.stop = function() { this.flush(); }; +/** + * @method start + */ PIXI.WebGLFastSpriteBatch.prototype.start = function() { var gl = this.gl; @@ -329,8 +423,5 @@ gl.vertexAttribPointer(this.shader.aRotation, 1, gl.FLOAT, false, stride, 6 * 4); gl.vertexAttribPointer(this.shader.aTextureCoord, 2, gl.FLOAT, false, stride, 7 * 4); gl.vertexAttribPointer(this.shader.colorAttribute, 1, gl.FLOAT, false, stride, 9 * 4); - }; - - diff --git a/src/pixi/renderers/webgl/utils/WebGLFilterManager.js b/src/pixi/renderers/webgl/utils/WebGLFilterManager.js index 9bb9195..359a834 100644 --- a/src/pixi/renderers/webgl/utils/WebGLFilterManager.js +++ b/src/pixi/renderers/webgl/utils/WebGLFilterManager.js @@ -5,22 +5,33 @@ /** * @class WebGLFilterManager * @constructor -* @param gl {WebGLContext} the current WebGL drawing context -* @private */ PIXI.WebGLFilterManager = function() { + /** + * @property filterStack + * @type Array + */ this.filterStack = []; + /** + * @property offsetX + * @type Number + */ this.offsetX = 0; - this.offsetY = 0; - // this.setContext(gl); + /** + * @property offsetY + * @type Number + */ + this.offsetY = 0; }; -// API +PIXI.WebGLFilterManager.prototype.constructor = PIXI.WebGLFilterManager; + /** -* Initialises the context and the properties +* Initialises the context and the properties. +* * @method setContext * @param gl {WebGLContext} the current WebGL drawing context */ @@ -33,7 +44,6 @@ }; /** -* * @method begin * @param renderSession {RenderSession} * @param buffer {ArrayBuffer} @@ -44,14 +54,14 @@ this.defaultShader = renderSession.shaderManager.defaultShader; var projection = this.renderSession.projection; - // console.log(this.width) this.width = projection.x * 2; this.height = -projection.y * 2; this.buffer = buffer; }; /** -* Applies the filter and adds it to the current filter stack +* Applies the filter and adds it to the current filter stack. +* * @method pushFilter * @param filterBlock {Object} the filter that will be pushed to the current filter stack */ @@ -64,7 +74,6 @@ filterBlock._filterArea = filterBlock.target.filterArea || filterBlock.target.getBounds(); - // filter program // OPTIMISATION - the first filter is free if its a simple color change? this.filterStack.push(filterBlock); @@ -126,9 +135,9 @@ }; - /** -* Removes the last filter from the filter stack and doesn't return it +* Removes the last filter from the filter stack and doesn't return it. +* * @method popFilter */ PIXI.WebGLFilterManager.prototype.popFilter = function() @@ -211,7 +220,6 @@ this.offsetX -= filterArea.x; this.offsetY -= filterArea.y; - var sizeX = this.width; var sizeY = this.height; @@ -239,9 +247,7 @@ buffer = currentFilter._glFilterTexture.frameBuffer; } - - - // TODO need toremove thease global elements.. + // TODO need to remove these global elements.. projection.x = sizeX/2; projection.y = -sizeY/2; @@ -280,10 +286,6 @@ gl.bufferSubData(gl.ARRAY_BUFFER, 0, this.uvArray); - //console.log(this.vertexArray) - //console.log(this.uvArray) - //console.log(sizeX + " : " + sizeY) - gl.viewport(0, 0, sizeX, sizeY); // bind the buffer @@ -300,9 +302,9 @@ this.applyFilterPass(filter, filterArea, sizeX, sizeY); // now restore the regular shader.. should happen automatically now.. - // this.renderSession.shaderManager.setShader(this.defaultShader); - // gl.uniform2f(this.defaultShader.projectionVector, sizeX/2, -sizeY/2); - // gl.uniform2f(this.defaultShader.offsetVector, -offsetX, -offsetY); + // this.renderSession.shaderManager.setShader(this.defaultShader); + // gl.uniform2f(this.defaultShader.projectionVector, sizeX/2, -sizeY/2); + // gl.uniform2f(this.defaultShader.offsetVector, -offsetX, -offsetY); // return the texture to the pool this.texturePool.push(texture); @@ -311,7 +313,8 @@ /** -* Applies the filter to the specified area +* Applies the filter to the specified area. +* * @method applyFilterPass * @param filter {AbstractFilter} the filter that needs to be applied * @param filterArea {texture} TODO - might need an update @@ -351,7 +354,6 @@ filter.uniforms.dimensions.value[3] = this.vertexArray[5];//filterArea.height; } - // console.log(this.uvArray ) shader.syncUniforms(); gl.bindBuffer(gl.ARRAY_BUFFER, this.vertexBuffer); @@ -372,7 +374,8 @@ }; /** -* Initialises the shader buffers +* Initialises the shader buffers. +* * @method initShaderBuffers */ PIXI.WebGLFilterManager.prototype.initShaderBuffers = function() @@ -385,7 +388,6 @@ this.colorBuffer = gl.createBuffer(); this.indexBuffer = gl.createBuffer(); - // bind and upload the vertexs.. // keep a reference to the vertexFloatData.. this.vertexArray = new Float32Array([0.0, 0.0, @@ -394,11 +396,7 @@ 1.0, 1.0]); gl.bindBuffer(gl.ARRAY_BUFFER, this.vertexBuffer); - gl.bufferData( - gl.ARRAY_BUFFER, - this.vertexArray, - gl.STATIC_DRAW); - + gl.bufferData(gl.ARRAY_BUFFER, this.vertexArray, gl.STATIC_DRAW); // bind and upload the uv buffer this.uvArray = new Float32Array([0.0, 0.0, @@ -407,10 +405,7 @@ 1.0, 1.0]); gl.bindBuffer(gl.ARRAY_BUFFER, this.uvBuffer); - gl.bufferData( - gl.ARRAY_BUFFER, - this.uvArray, - gl.STATIC_DRAW); + gl.bufferData(gl.ARRAY_BUFFER, this.uvArray, gl.STATIC_DRAW); this.colorArray = new Float32Array([1.0, 0xFFFFFF, 1.0, 0xFFFFFF, @@ -418,21 +413,17 @@ 1.0, 0xFFFFFF]); gl.bindBuffer(gl.ARRAY_BUFFER, this.colorBuffer); - gl.bufferData( - gl.ARRAY_BUFFER, - this.colorArray, - gl.STATIC_DRAW); + gl.bufferData(gl.ARRAY_BUFFER, this.colorArray, gl.STATIC_DRAW); // bind and upload the index gl.bindBuffer(gl.ELEMENT_ARRAY_BUFFER, this.indexBuffer); - gl.bufferData( - gl.ELEMENT_ARRAY_BUFFER, - new Uint16Array([0, 1, 2, 1, 3, 2]), - gl.STATIC_DRAW); + gl.bufferData(gl.ELEMENT_ARRAY_BUFFER, new Uint16Array([0, 1, 2, 1, 3, 2]), gl.STATIC_DRAW); + }; /** -* Destroys the filter and removes it from the filter stack +* Destroys the filter and removes it from the filter stack. +* * @method destroy */ PIXI.WebGLFilterManager.prototype.destroy = function() diff --git a/src/pixi/renderers/webgl/utils/WebGLGraphics.js b/src/pixi/renderers/webgl/utils/WebGLGraphics.js index 4de401d..9ea5a53 100644 --- a/src/pixi/renderers/webgl/utils/WebGLGraphics.js +++ b/src/pixi/renderers/webgl/utils/WebGLGraphics.js @@ -11,7 +11,6 @@ */ PIXI.WebGLGraphics = function() { - }; /** @@ -120,7 +119,6 @@ webGL.data = []; webGL.lastIndex = 0; } - var webGLData; @@ -131,8 +129,6 @@ { var data = graphics.graphicsData[i]; - - if(data.type === PIXI.Graphics.POLY) { // need to add the points the the graphics object.. @@ -189,7 +185,6 @@ } } - webGL.lastIndex++; } @@ -201,7 +196,13 @@ } }; - +/** + * @static + * @private + * @method switchMode + * @param webGL {WebGLContext} + * @param type {Number} + */ PIXI.WebGLGraphics.switchMode = function(webGL, type) { var webGLData; @@ -308,7 +309,6 @@ */ PIXI.WebGLGraphics.buildRoundedRectangle = function(graphicsData, webGLData) { - var points = graphicsData.points; var x = points[0]; var y = points[1]; @@ -316,7 +316,6 @@ var height = points[3]; var radius = points[4]; - var recPoints = []; recPoints.push(x, y + radius); recPoints = recPoints.concat(PIXI.WebGLGraphics.quadraticBezierCurve(x, y + height - radius, x, y + height, x + radius, y + height)); @@ -324,7 +323,6 @@ recPoints = recPoints.concat(PIXI.WebGLGraphics.quadraticBezierCurve(x + width, y + radius, x + width, y, x + width - radius, y)); recPoints = recPoints.concat(PIXI.WebGLGraphics.quadraticBezierCurve(x + radius, y, x, y, x, y + radius)); - if (graphicsData.fill) { var color = PIXI.hex2rgb(graphicsData.fillColor); var alpha = graphicsData.fillAlpha; @@ -368,8 +366,8 @@ }; /** - * Calcul the points for a quadratic bezier curve. (helper function..) - * Based on : https://stackoverflow.com/questions/785097/how-do-i-implement-a-bezier-curve-in-c + * Calculate the points for a quadratic bezier curve. (helper function..) + * Based on: https://stackoverflow.com/questions/785097/how-do-i-implement-a-bezier-curve-in-c * * @static * @private @@ -383,6 +381,7 @@ * @return {Array} */ PIXI.WebGLGraphics.quadraticBezierCurve = function(fromX, fromY, cpX, cpY, toX, toY) { + var xa, ya, xb, @@ -718,13 +717,12 @@ * * @static * @private - * @method buildPoly + * @method buildComplexPoly * @param graphicsData {Graphics} The graphics object containing all the necessary properties * @param webGLData {Object} */ PIXI.WebGLGraphics.buildComplexPoly = function(graphicsData, webGLData) { - //TODO - no need to copy this as it gets turned into a FLoat32Array anyways.. var points = graphicsData.points.slice(); if(points.length < 6)return; @@ -776,6 +774,15 @@ }; +/** + * Builds a polygon to draw + * + * @static + * @private + * @method buildPoly + * @param graphicsData {Graphics} The graphics object containing all the necessary properties + * @param webGLData {Object} + */ PIXI.WebGLGraphics.buildPoly = function(graphicsData, webGLData) { var points = graphicsData.points; @@ -818,6 +825,11 @@ PIXI.WebGLGraphics.graphicsDataPool = []; +/** + * @class WebGLGraphicsData + * @private + * @static + */ PIXI.WebGLGraphicsData = function(gl) { this.gl = gl; @@ -834,6 +846,9 @@ this.dirty = true; }; +/** + * @method reset + */ PIXI.WebGLGraphicsData.prototype.reset = function() { this.points = []; @@ -841,6 +856,9 @@ this.lastIndex = 0; }; +/** + * @method upload + */ PIXI.WebGLGraphicsData.prototype.upload = function() { var gl = this.gl; diff --git a/src/pixi/renderers/webgl/utils/WebGLMaskManager.js b/src/pixi/renderers/webgl/utils/WebGLMaskManager.js index 181f560..607d5dd 100644 --- a/src/pixi/renderers/webgl/utils/WebGLMaskManager.js +++ b/src/pixi/renderers/webgl/utils/WebGLMaskManager.js @@ -5,16 +5,17 @@ /** * @class WebGLMaskManager * @constructor -* @param gl {WebGLContext} the current WebGL drawing context * @private */ PIXI.WebGLMaskManager = function() { - //this.setContext(gl); }; +PIXI.WebGLMaskManager.prototype.constructor = PIXI.WebGLMaskManager; + /** -* Sets the drawing context to the one given in parameter +* Sets the drawing context to the one given in parameter. +* * @method setContext * @param gl {WebGLContext} the current WebGL drawing context */ @@ -24,10 +25,11 @@ }; /** -* Applies the Mask and adds it to the current filter stack +* Applies the Mask and adds it to the current filter stack. +* * @method pushMask * @param maskData {Array} -* @param renderSession {RenderSession} +* @param renderSession {Object} */ PIXI.WebGLMaskManager.prototype.pushMask = function(maskData, renderSession) { @@ -44,10 +46,11 @@ }; /** -* Removes the last filter from the filter stack and doesn't return it +* Removes the last filter from the filter stack and doesn't return it. +* * @method popMask -* -* @param renderSession {RenderSession} an object containing all the useful parameters +* @param maskData {Array} +* @param renderSession {Object} an object containing all the useful parameters */ PIXI.WebGLMaskManager.prototype.popMask = function(maskData, renderSession) { @@ -55,9 +58,9 @@ renderSession.stencilManager.popStencil(maskData, maskData._webGL[gl.id].data[0], renderSession); }; - /** -* Destroys the mask stack +* Destroys the mask stack. +* * @method destroy */ PIXI.WebGLMaskManager.prototype.destroy = function() diff --git a/src/pixi/renderers/webgl/utils/WebGLShaderManager.js b/src/pixi/renderers/webgl/utils/WebGLShaderManager.js index b597698..a15974e 100644 --- a/src/pixi/renderers/webgl/utils/WebGLShaderManager.js +++ b/src/pixi/renderers/webgl/utils/WebGLShaderManager.js @@ -5,38 +5,54 @@ /** * @class WebGLShaderManager * @constructor -* @param gl {WebGLContext} the current WebGL drawing context * @private */ PIXI.WebGLShaderManager = function() { - + /** + * @property maxAttibs + * @type Number + */ this.maxAttibs = 10; + + /** + * @property attribState + * @type Array + */ this.attribState = []; + + /** + * @property tempAttribState + * @type Array + */ this.tempAttribState = []; - for (var i = 0; i < this.maxAttibs; i++) { + for (var i = 0; i < this.maxAttibs; i++) + { this.attribState[i] = false; } + /** + * @property stack + * @type Array + */ this.stack = []; - - //this.setContext(gl); - // the final one is used for the rendering strips + }; +PIXI.WebGLShaderManager.prototype.constructor = PIXI.WebGLShaderManager; /** -* Initialises the context and the properties +* Initialises the context and the properties. +* * @method setContext * @param gl {WebGLContext} the current WebGL drawing context -* @param transparent {Boolean} Whether or not the drawing context should be transparent */ PIXI.WebGLShaderManager.prototype.setContext = function(gl) { this.gl = gl; - // the next one is used for rendering primatives + // the next one is used for rendering primitives this.primitiveShader = new PIXI.PrimitiveShader(gl); // the next one is used for rendering triangle strips @@ -53,16 +69,15 @@ this.setShader(this.defaultShader); }; - /** -* Takes the attributes given in parameters +* Takes the attributes given in parameters. +* * @method setAttribs * @param attribs {Array} attribs */ PIXI.WebGLShaderManager.prototype.setAttribs = function(attribs) { // reset temp state - var i; for (i = 0; i < this.tempAttribState.length; i++) @@ -97,6 +112,12 @@ } }; +/** +* Sets the current shader. +* +* @method setShader +* @param shader {Any} +*/ PIXI.WebGLShaderManager.prototype.setShader = function(shader) { if(this._currentId === shader._UID)return false; @@ -112,7 +133,8 @@ }; /** -* Destroys +* Destroys this object. +* * @method destroy */ PIXI.WebGLShaderManager.prototype.destroy = function() @@ -133,4 +155,3 @@ this.gl = null; }; - diff --git a/src/pixi/renderers/webgl/utils/WebGLShaderUtils.js b/src/pixi/renderers/webgl/utils/WebGLShaderUtils.js index f6cc024..88461d1 100644 --- a/src/pixi/renderers/webgl/utils/WebGLShaderUtils.js +++ b/src/pixi/renderers/webgl/utils/WebGLShaderUtils.js @@ -2,27 +2,44 @@ * @author Mat Groves http://matgroves.com/ @Doormat23 */ -// TODO Alvin and Mat -// Should we eventually create a Utils class ? -// Or just move this file to the pixi.js file ? +/** +* @method initDefaultShaders +* @private +*/ PIXI.initDefaultShaders = function() { - - // PIXI.stripShader = new PIXI.StripShader(); -// PIXI.stripShader.init(); - }; +/** +* @method CompileVertexShader +* @param gl {WebGLContext} the current WebGL drawing context +* @param shaderSrc {Array} +* @return {Any} +*/ PIXI.CompileVertexShader = function(gl, shaderSrc) { return PIXI._CompileShader(gl, shaderSrc, gl.VERTEX_SHADER); }; +/** +* @method CompileFragmentShader +* @param gl {WebGLContext} the current WebGL drawing context +* @param shaderSrc {Array} +* @return {Any} +*/ PIXI.CompileFragmentShader = function(gl, shaderSrc) { return PIXI._CompileShader(gl, shaderSrc, gl.FRAGMENT_SHADER); }; +/** +* @method _CompileShader +* @private +* @param gl {WebGLContext} the current WebGL drawing context +* @param shaderSrc {Array} +* @param shaderType {Number} +* @return {Any} +*/ PIXI._CompileShader = function(gl, shaderSrc, shaderType) { var src = shaderSrc.join("\n"); @@ -30,14 +47,22 @@ gl.shaderSource(shader, src); gl.compileShader(shader); - if (!gl.getShaderParameter(shader, gl.COMPILE_STATUS)) { - window.console.log(gl.getShaderInfoLog(shader)); + if (!gl.getShaderParameter(shader, gl.COMPILE_STATUS)) + { + console.log(gl.getShaderInfoLog(shader)); return null; } return shader; }; +/** +* @method compileProgram +* @param gl {WebGLContext} the current WebGL drawing context +* @param vertexSrc {Array} +* @param fragmentSrc {Array} +* @return {Any} +*/ PIXI.compileProgram = function(gl, vertexSrc, fragmentSrc) { var fragmentShader = PIXI.CompileFragmentShader(gl, fragmentSrc); @@ -49,8 +74,9 @@ gl.attachShader(shaderProgram, fragmentShader); gl.linkProgram(shaderProgram); - if (!gl.getProgramParameter(shaderProgram, gl.LINK_STATUS)) { - window.console.log("Could not initialise shaders"); + if (!gl.getProgramParameter(shaderProgram, gl.LINK_STATUS)) + { + console.log("Could not initialise shaders"); } return shaderProgram; diff --git a/src/pixi/renderers/webgl/utils/WebGLSpriteBatch.js b/src/pixi/renderers/webgl/utils/WebGLSpriteBatch.js index 4d59c80..f8a4bd7 100755 --- a/src/pixi/renderers/webgl/utils/WebGLSpriteBatch.js +++ b/src/pixi/renderers/webgl/utils/WebGLSpriteBatch.js @@ -13,15 +13,10 @@ * @class WebGLSpriteBatch * @private * @constructor - * @param gl {WebGLContext} the current WebGL drawing context - * */ PIXI.WebGLSpriteBatch = function() { - /** - * - * * @property vertSize * @type Number */ @@ -47,7 +42,6 @@ */ this.vertices = new Float32Array(numVerts); - //index data /** * Holds the indices * @@ -56,6 +50,10 @@ */ this.indices = new Uint16Array(numIndices); + /** + * @property lastIndexCount + * @type Number + */ this.lastIndexCount = 0; for (var i=0, j=0; i < numIndices; i += 6, j += 4) @@ -68,20 +66,58 @@ this.indices[i + 5] = j + 3; } - + /** + * @property drawing + * @type Boolean + */ this.drawing = false; - this.currentBatchSize = 0; - this.currentBaseTexture = null; - -// this.setContext(gl); + /** + * @property currentBatchSize + * @type Number + */ + this.currentBatchSize = 0; + + /** + * @property currentBaseTexture + * @type BaseTexture + */ + this.currentBaseTexture = null; + + /** + * @property dirty + * @type Boolean + */ this.dirty = true; + /** + * @property textures + * @type Array + */ this.textures = []; + + /** + * @property blendModes + * @type Array + */ this.blendModes = []; + + /** + * @property shaders + * @type Array + */ this.shaders = []; + + /** + * @property sprites + * @type Array + */ this.sprites = []; + /** + * @property defaultShader + * @type AbstractFilter + */ this.defaultShader = new PIXI.AbstractFilter([ 'precision lowp float;', 'varying vec2 vTextureCoord;', @@ -94,9 +130,7 @@ }; /** -* * @method setContext -* * @param gl {WebGLContext} the current WebGL drawing context */ PIXI.WebGLSpriteBatch.prototype.setContext = function(gl) @@ -109,7 +143,6 @@ // 65535 is max index, so 65535 / 6 = 10922. - //upload the index data gl.bindBuffer(gl.ELEMENT_ARRAY_BUFFER, this.indexBuffer); gl.bufferData(gl.ELEMENT_ARRAY_BUFFER, this.indices, gl.STATIC_DRAW); @@ -125,15 +158,12 @@ shader.uniforms = {}; shader.init(); - this.defaultShader.shaders[gl.id] = shader; }; /** -* * @method begin -* -* @param renderSession {RenderSession} the RenderSession +* @param renderSession {Object} The RenderSession object */ PIXI.WebGLSpriteBatch.prototype.begin = function(renderSession) { @@ -144,9 +174,7 @@ }; /** -* * @method end -* */ PIXI.WebGLSpriteBatch.prototype.end = function() { @@ -154,16 +182,13 @@ }; /** -* * @method render -* * @param sprite {Sprite} the sprite to render when using this spritebatch */ PIXI.WebGLSpriteBatch.prototype.render = function(sprite) { var texture = sprite.texture; - //TODO set blend modes.. // check texture.. if(this.currentBatchSize >= this.size) @@ -270,9 +295,9 @@ }; /** -* Renders a tilingSprite using the spriteBatch -* @method renderTilingSprite +* Renders a TilingSprite using the spriteBatch. * +* @method renderTilingSprite * @param sprite {TilingSprite} the tilingSprite to render */ PIXI.WebGLSpriteBatch.prototype.renderTilingSprite = function(tilingSprite) @@ -390,12 +415,10 @@ this.sprites[this.currentBatchSize++] = tilingSprite; }; - /** -* Renders the content and empties the current batch +* Renders the content and empties the current batch. * * @method flush -* */ PIXI.WebGLSpriteBatch.prototype.flush = function() { @@ -516,6 +539,12 @@ this.currentBatchSize = 0; }; +/** +* @method renderBatch +* @param texture {Texture} +* @param size {Number} +* @param startIndex {Number} +*/ PIXI.WebGLSpriteBatch.prototype.renderBatch = function(texture, size, startIndex) { if(size === 0)return; @@ -532,7 +561,6 @@ // bind the current texture gl.bindTexture(gl.TEXTURE_2D, texture._glTextures[gl.id]); } - // now draw those suckas! gl.drawElements(gl.TRIANGLES, size * 6, gl.UNSIGNED_SHORT, startIndex * 6 * 2); @@ -541,11 +569,8 @@ this.renderSession.drawCount++; }; - /** -* * @method stop -* */ PIXI.WebGLSpriteBatch.prototype.stop = function() { @@ -554,9 +579,7 @@ }; /** -* * @method start -* */ PIXI.WebGLSpriteBatch.prototype.start = function() { @@ -564,12 +587,12 @@ }; /** -* Destroys the SpriteBatch +* Destroys the SpriteBatch. +* * @method destroy */ PIXI.WebGLSpriteBatch.prototype.destroy = function() { - this.vertices = null; this.indices = null; diff --git a/src/pixi/renderers/webgl/utils/WebGLStencilManager.js b/src/pixi/renderers/webgl/utils/WebGLStencilManager.js index f841e6f..367d7dc 100644 --- a/src/pixi/renderers/webgl/utils/WebGLStencilManager.js +++ b/src/pixi/renderers/webgl/utils/WebGLStencilManager.js @@ -5,21 +5,18 @@ /** * @class WebGLStencilManager * @constructor -* @param gl {WebGLContext} the current WebGL drawing context * @private */ PIXI.WebGLStencilManager = function() { - this.stencilStack = []; - //this.setContext(gl); this.reverse = true; this.count = 0; - }; /** -* Sets the drawing context to the one given in parameter +* Sets the drawing context to the one given in parameter. +* * @method setContext * @param gl {WebGLContext} the current WebGL drawing context */ @@ -29,10 +26,12 @@ }; /** -* Applies the Mask and adds it to the current filter stack +* Applies the Mask and adds it to the current filter stack. +* * @method pushMask -* @param maskData {Array} -* @param renderSession {RenderSession} +* @param graphics {Graphics} +* @param webGLData {Array} +* @param renderSession {Object} */ PIXI.WebGLStencilManager.prototype.pushStencil = function(graphics, webGLData, renderSession) { @@ -60,7 +59,6 @@ if(webGLData.mode === 1) { - gl.drawElements(gl.TRIANGLE_FAN, webGLData.indices.length - 4, gl.UNSIGNED_SHORT, 0 ); if(this.reverse) @@ -119,7 +117,14 @@ this.count++; }; -//TODO this does not belong here! +/** + * TODO this does not belong here! + * + * @method bindGraphics + * @param graphics {Graphics} + * @param webGLData {Array} + * @param renderSession {Object} + */ PIXI.WebGLStencilManager.prototype.bindGraphics = function(graphics, webGLData, renderSession) { //if(this._currentGraphics === graphics)return; @@ -182,6 +187,12 @@ } }; +/** + * @method popStencil + * @param graphics {Graphics} + * @param webGLData {Array} + * @param renderSession {Object} + */ PIXI.WebGLStencilManager.prototype.popStencil = function(graphics, webGLData, renderSession) { var gl = this.gl; @@ -272,7 +283,8 @@ }; /** -* Destroys the mask stack +* Destroys the mask stack. +* * @method destroy */ PIXI.WebGLStencilManager.prototype.destroy = function() diff --git a/src/pixi/utils/Detector.js b/src/pixi/utils/Detector.js index c0bd1ed..33a97a9 100644 --- a/src/pixi/utils/Detector.js +++ b/src/pixi/utils/Detector.js @@ -44,9 +44,10 @@ /** * This helper function will automatically detect which renderer you should be using. * This function is very similar to the autoDetectRenderer function except that is will return a canvas renderer for android. - * Even thought both android chrome suports webGL the canvas implementation perform better at the time of writing. - * This function will likely change and update as webGL performance imporoves on thease devices. - * @class getRecommendedRenderer + * Even thought both android chrome supports webGL the canvas implementation perform better at the time of writing. + * This function will likely change and update as webGL performance improves on these devices. + * + * @class autoDetectRecommendedRenderer * @static * @param width=800 {Number} the width of the renderers view * @param height=600 {Number} the height of the renderers view diff --git a/src/pixi/utils/EventTarget.js b/src/pixi/utils/EventTarget.js index 4e701d9..32536e3 100644 --- a/src/pixi/utils/EventTarget.js +++ b/src/pixi/utils/EventTarget.js @@ -4,7 +4,7 @@ */ /** - * Originally based on https://github.com/mrdoob/eventtarget.js/ from mr DOob. + * Originally based on https://github.com/mrdoob/eventtarget.js/ from mr Doob. * Currently takes inspiration from the nodejs EventEmitter, EventEmitter3, and smokesignals */ @@ -18,7 +18,7 @@ * PIXI.EventTarget.mixin(MyEmitter.prototype); * * var em = new MyEmitter(); - * em.emit('eventName', 'some data', 'some moar data', {}, null, ...); + * em.emit('eventName', 'some data', 'some more data', {}, null, ...); */ PIXI.EventTarget = { /** diff --git a/src/pixi/utils/Polyk.js b/src/pixi/utils/Polyk.js index aaf3bdb..0e150b2 100644 --- a/src/pixi/utils/Polyk.js +++ b/src/pixi/utils/Polyk.js @@ -28,23 +28,21 @@ This is an amazing lib! - slightly modified by Mat Groves (matgroves.com); + Slightly modified by Mat Groves (matgroves.com); */ /** * Based on the Polyk library http://polyk.ivank.net released under MIT licence. * This is an amazing lib! - * slightly modified by Mat Groves (matgroves.com); + * Slightly modified by Mat Groves (matgroves.com); * @class PolyK - * */ PIXI.PolyK = {}; /** - * Triangulates shapes for webGL graphic fills + * Triangulates shapes for webGL graphic fills. * * @method Triangulate - * */ PIXI.PolyK.Triangulate = function(p) { @@ -132,6 +130,7 @@ * @param cx {Number} x coordinate of the c point of the triangle * @param cy {Number} y coordinate of the c point of the triangle * @private + * @return {Boolean} */ PIXI.PolyK._PointInTriangle = function(px, py, ax, ay, bx, by, cx, cy) { @@ -160,8 +159,8 @@ * Checks whether a shape is convex * * @method _convex - * * @private + * @return {Boolean} */ PIXI.PolyK._convex = function(ax, ay, bx, by, cx, cy, sign) { diff --git a/src/pixi/utils/Utils.js b/src/pixi/utils/Utils.js index 0ed9b16..439dbb5 100644 --- a/src/pixi/utils/Utils.js +++ b/src/pixi/utils/Utils.js @@ -16,6 +16,7 @@ * * @method requestAnimationFrame */ + /** * A polyfill for cancelAnimationFrame *