Dived into WebGLRenderer, fixes and docs

This commit is contained in:
alvinsight 2014-01-28 17:25:00 +00:00
parent 3c14d330bd
commit 57d7e373ec
23 changed files with 475 additions and 100 deletions

View file

@ -45,6 +45,7 @@ module.exports = function(grunt) {
'<%= dirs.src %>/renderers/webgl/utils/WebGLSpriteBatch.js', '<%= dirs.src %>/renderers/webgl/utils/WebGLSpriteBatch.js',
'<%= dirs.src %>/renderers/webgl/utils/WebGLFastSpriteBatch.js', '<%= dirs.src %>/renderers/webgl/utils/WebGLFastSpriteBatch.js',
'<%= dirs.src %>/renderers/webgl/utils/WebGLFilterManager.js', '<%= dirs.src %>/renderers/webgl/utils/WebGLFilterManager.js',
'<%= dirs.src %>/renderers/webgl/utils/FilterTexture.js',
'<%= dirs.src %>/renderers/canvas/utils/CanvasMaskManager.js', '<%= dirs.src %>/renderers/canvas/utils/CanvasMaskManager.js',
'<%= dirs.src %>/renderers/canvas/utils/CanvasTinter.js', '<%= dirs.src %>/renderers/canvas/utils/CanvasTinter.js',
'<%= dirs.src %>/renderers/canvas/CanvasRenderer.js', '<%= dirs.src %>/renderers/canvas/CanvasRenderer.js',
@ -86,7 +87,7 @@ module.exports = function(grunt) {
'/**', '/**',
' * @license', ' * @license',
' * <%= pkg.name %> - v<%= pkg.version %>', ' * <%= pkg.name %> - v<%= pkg.version %>',
' * Copyright (c) 2012, Mat Groves', ' * Copyright (c) 2012-2014, Mat Groves',
' * <%= pkg.homepage %>', ' * <%= pkg.homepage %>',
' *', ' *',
' * Compiled: <%= grunt.template.today("yyyy-mm-dd") %>', ' * Compiled: <%= grunt.template.today("yyyy-mm-dd") %>',

Binary file not shown.

Before

Width:  |  Height:  |  Size: 740 B

After

Width:  |  Height:  |  Size: 624 B

Before After
Before After

View file

@ -21,6 +21,13 @@ PIXI.SpriteBatch = function(texture)
PIXI.SpriteBatch.prototype = Object.create( PIXI.DisplayObjectContainer.prototype ); PIXI.SpriteBatch.prototype = Object.create( PIXI.DisplayObjectContainer.prototype );
PIXI.SpriteBatch.constructor = PIXI.SpriteBatch; PIXI.SpriteBatch.constructor = PIXI.SpriteBatch;
/*
* Initialises the spriteBatch
*
* @method initWebGL
* @param gl {WebGLContext} the current WebGL drawing context
*/
PIXI.SpriteBatch.prototype.initWebGL = function(gl) PIXI.SpriteBatch.prototype.initWebGL = function(gl)
{ {

View file

@ -11,7 +11,7 @@
* @param backgroundColor {Number} the background color of the stage, you have to pass this in is in hex format * @param backgroundColor {Number} the background color of the stage, you have to pass this in is in hex format
* like: 0xFFFFFF for white * like: 0xFFFFFF for white
* *
* @example Creating a stage is a mandatory process when you use Pixi, which is as simple as this : * Creating a stage is a mandatory process when you use Pixi, which is as simple as this :
* var stage = new PIXI.Stage(0xFFFFFF); * var stage = new PIXI.Stage(0xFFFFFF);
* where the parameter given is the background colour of the stage, in hex * where the parameter given is the background colour of the stage, in hex
* you will use this stage instance to add your sprites to it and therefore to the renderer * you will use this stage instance to add your sprites to it and therefore to the renderer

View file

@ -67,7 +67,7 @@ PIXI.BitmapFontLoader.prototype.constructor = PIXI.BitmapFontLoader;
*/ */
PIXI.BitmapFontLoader.prototype.load = function() PIXI.BitmapFontLoader.prototype.load = function()
{ {
this.ajaxRequest = new XMLHttpRequest(); this.ajaxRequest = new PIXI.ajaxRequest();
var scope = this; var scope = this;
this.ajaxRequest.onreadystatechange = function() this.ajaxRequest.onreadystatechange = function()
{ {
@ -80,7 +80,7 @@ PIXI.BitmapFontLoader.prototype.load = function()
}; };
/** /**
* Invoked when XML file is loaded, parses the data * Invoked when the XML file is loaded, parses the data
* *
* @method onXMLLoaded * @method onXMLLoaded
* @private * @private

View file

@ -102,7 +102,7 @@ PIXI.CanvasRenderer = function(width, height, view, transparent)
this.view = view || document.createElement( "canvas" ); this.view = view || document.createElement( "canvas" );
/** /**
* The canvas 2d context that everything is drawn to * The canvas 2d context that everything is drawn with
* @property context * @property context
* @type HTMLCanvasElement 2d Context * @type HTMLCanvasElement 2d Context
*/ */

View file

@ -6,19 +6,25 @@
/** /**
* @class PIXI.PixiFastShader * @class PIXI.PixiFastShader
* @constructor * @constructor
* @param gl {WebGLContext} the current WebGL drawing context
*/ */
PIXI.PixiFastShader = function(gl) PIXI.PixiFastShader = function(gl)
{ {
/**
* @property gl
* @type WebGLContext
*/
this.gl = gl; this.gl = gl;
/** /**
* @property {any} program - The WebGL program. * @property {any} program - The WebGL program.
*/ */
this.program = null; this.program = null;
/** /**
* @property {array} fragmentSrc - The fragment shader. * @property {array} fragmentSrc - The fragment shader.
*/ */
this.fragmentSrc = [ this.fragmentSrc = [
'precision lowp float;', 'precision lowp float;',
'varying vec2 vTextureCoord;', 'varying vec2 vTextureCoord;',
@ -29,6 +35,9 @@ PIXI.PixiFastShader = function(gl)
'}' '}'
]; ];
/**
* @property {array} vertexSrc - The vertex shader
*/
this.vertexSrc = [ this.vertexSrc = [
'attribute vec2 aVertexPosition;', 'attribute vec2 aVertexPosition;',
'attribute vec2 aPositionCoord;', 'attribute vec2 aPositionCoord;',
@ -70,7 +79,9 @@ PIXI.PixiFastShader = function(gl)
}; };
/** /**
* @method PIXI.PixiFastShader#init * Initialises the shader
* @method init
*
*/ */
PIXI.PixiFastShader.prototype.init = function() PIXI.PixiFastShader.prototype.init = function()
{ {
@ -120,6 +131,11 @@ PIXI.PixiFastShader.prototype.init = function()
this.program = program; this.program = program;
}; };
/**
* Destroys the shader
* @method destroy
*
*/
PIXI.PixiFastShader.prototype.destroy = function() PIXI.PixiFastShader.prototype.destroy = function()
{ {
this.gl.deleteProgram( this.program ); this.gl.deleteProgram( this.program );

View file

@ -9,6 +9,10 @@
*/ */
PIXI.PixiShader = function(gl) PIXI.PixiShader = function(gl)
{ {
/**
* @property gl
* @type WebGLContext
*/
this.gl = gl; this.gl = gl;
/** /**
@ -41,7 +45,9 @@ PIXI.PixiShader = function(gl)
}; };
/** /**
* @method PIXI.PixiShader#init * Initialises the shader
* @method init
*
*/ */
PIXI.PixiShader.prototype.init = function() PIXI.PixiShader.prototype.init = function()
{ {
@ -96,7 +102,7 @@ PIXI.PixiShader.prototype.init = function()
* Uniforms are specified in the GLSL_ES Specification: http://www.khronos.org/registry/webgl/specs/latest/1.0/ * 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 * http://www.khronos.org/registry/gles/specs/2.0/GLSL_ES_Specification_1.0.17.pdf
* *
* @method PIXI.PixiShader#initUniforms * @method initUniforms
*/ */
PIXI.PixiShader.prototype.initUniforms = function() PIXI.PixiShader.prototype.initUniforms = function()
{ {
@ -167,7 +173,7 @@ PIXI.PixiShader.prototype.initUniforms = function()
/** /**
* Initialises a Sampler2D uniform (which may only be available later on after initUniforms once the texture has loaded) * Initialises a Sampler2D uniform (which may only be available later on after initUniforms once the texture has loaded)
* *
* @method PIXI.PixiShader#initSampler2D * @method initSampler2D
*/ */
PIXI.PixiShader.prototype.initSampler2D = function(uniform) PIXI.PixiShader.prototype.initSampler2D = function(uniform)
{ {
@ -242,7 +248,7 @@ PIXI.PixiShader.prototype.initSampler2D = function(uniform)
/** /**
* Updates the shader uniform values. * Updates the shader uniform values.
* *
* @method PIXI.PixiShader#syncUniforms * @method syncUniforms
*/ */
PIXI.PixiShader.prototype.syncUniforms = function() PIXI.PixiShader.prototype.syncUniforms = function()
{ {
@ -297,6 +303,11 @@ PIXI.PixiShader.prototype.syncUniforms = function()
}; };
/**
* Destroys the shader
* @method destroy
*
*/
PIXI.PixiShader.prototype.destroy = function() PIXI.PixiShader.prototype.destroy = function()
{ {
this.gl.deleteProgram( this.program ); this.gl.deleteProgram( this.program );
@ -306,6 +317,11 @@ PIXI.PixiShader.prototype.destroy = function()
this.attributes = null; this.attributes = null;
}; };
/**
*
* @property defaultVertexSrc
* @type String
*/
PIXI.PixiShader.defaultVertexSrc = [ PIXI.PixiShader.defaultVertexSrc = [
'attribute vec2 aVertexPosition;', 'attribute vec2 aVertexPosition;',
'attribute vec2 aTextureCoord;', 'attribute vec2 aTextureCoord;',

View file

@ -2,14 +2,28 @@
* @author Mat Groves http://matgroves.com/ @Doormat23 * @author Mat Groves http://matgroves.com/ @Doormat23
*/ */
/**
* @class PrimitiveShader
* @constructor
* @param gl {WebGLContext} the current WebGL drawing context
*/
PIXI.PrimitiveShader = function(gl) PIXI.PrimitiveShader = function(gl)
{ {
/**
* @property gl
* @type WebGLContext
*/
this.gl = gl; this.gl = gl;
// the webGL program.. /**
* @property {any} program - The WebGL program.
*/
this.program = null; this.program = null;
/**
* @property fragmentSrc
* @type Array
*/
this.fragmentSrc = [ this.fragmentSrc = [
'precision mediump float;', 'precision mediump float;',
'varying vec4 vColor;', 'varying vec4 vColor;',
@ -19,6 +33,10 @@ PIXI.PrimitiveShader = function(gl)
'}' '}'
]; ];
/**
* @property vertexSrc
* @type Array
*/
this.vertexSrc = [ this.vertexSrc = [
'attribute vec2 aVertexPosition;', 'attribute vec2 aVertexPosition;',
'attribute vec4 aColor;', 'attribute vec4 aColor;',
@ -40,6 +58,11 @@ PIXI.PrimitiveShader = function(gl)
this.init(); this.init();
}; };
/**
* Initialises the shader
* @method init
*
*/
PIXI.PrimitiveShader.prototype.init = function() PIXI.PrimitiveShader.prototype.init = function()
{ {
@ -66,6 +89,11 @@ PIXI.PrimitiveShader.prototype.init = function()
this.program = program; this.program = program;
}; };
/**
* Destroys the shader
* @method destroy
*
*/
PIXI.PrimitiveShader.prototype.destroy = function() PIXI.PrimitiveShader.prototype.destroy = function()
{ {
this.gl.deleteProgram( this.program ); this.gl.deleteProgram( this.program );

View file

@ -5,9 +5,14 @@
PIXI.StripShader = function() PIXI.StripShader = function()
{ {
// the webGL program.. /**
* @property {any} program - The WebGL program.
*/
this.program = null; this.program = null;
/**
* @property {array} fragmentSrc - The fragment shader.
*/
this.fragmentSrc = [ this.fragmentSrc = [
'precision mediump float;', 'precision mediump float;',
'varying vec2 vTextureCoord;', 'varying vec2 vTextureCoord;',
@ -21,6 +26,9 @@ PIXI.StripShader = function()
'}' '}'
]; ];
/**
* @property {array} fragmentSrc - The fragment shader.
*/
this.vertexSrc = [ this.vertexSrc = [
'attribute vec2 aVertexPosition;', 'attribute vec2 aVertexPosition;',
'attribute vec2 aTextureCoord;', 'attribute vec2 aTextureCoord;',
@ -41,6 +49,11 @@ PIXI.StripShader = function()
]; ];
}; };
/**
* Initialises the shader
* @method init
*
*/
PIXI.StripShader.prototype.init = function() PIXI.StripShader.prototype.init = function()
{ {

View file

@ -0,0 +1,84 @@
/**
* @author Mat Groves http://matgroves.com/ @Doormat23
*/
/**
* @class FilterTexture
* @constructor
* @param gl {WebGLContext} the current WebGL drawing context
* @param width {Number} the horizontal range of the filter
* @param height {Number} the vertical range of the filter
* @private
*/
PIXI.FilterTexture = function(gl, width, height)
{
/**
* @property gl
* @type WebGLContext
*/
this.gl = gl;
// next time to create a frame buffer and texture
this.frameBuffer = gl.createFramebuffer();
this.texture = gl.createTexture();
gl.bindTexture(gl.TEXTURE_2D, this.texture);
gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MAG_FILTER, gl.LINEAR);
gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MIN_FILTER, gl.LINEAR);
gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_S, gl.CLAMP_TO_EDGE);
gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_T, gl.CLAMP_TO_EDGE);
gl.bindFramebuffer(gl.FRAMEBUFFER, this.framebuffer );
gl.bindFramebuffer(gl.FRAMEBUFFER, this.frameBuffer );
gl.framebufferTexture2D(gl.FRAMEBUFFER, gl.COLOR_ATTACHMENT0, gl.TEXTURE_2D, this.texture, 0);
this.resize(width, height);
};
/**
* Clears the filter texture
* @method clear
*/
PIXI.FilterTexture.prototype.clear = function()
{
var gl = this.gl;
gl.clearColor(0,0,0, 0);
gl.clear(gl.COLOR_BUFFER_BIT);
};
/**
* Resizes the texture to the specified width and height
*
* @method resize
* @param width {Number} the new width of the texture
* @param height {Number} the new height of the texture
*/
PIXI.FilterTexture.prototype.resize = function(width, height)
{
if(this.width === width && this.height === height) return;
this.width = width;
this.height = height;
var gl = this.gl;
gl.bindTexture(gl.TEXTURE_2D, this.texture);
gl.texImage2D(gl.TEXTURE_2D, 0, gl.RGBA, width, height, 0, gl.RGBA, gl.UNSIGNED_BYTE, null);
};
/**
* Destroys the filter texture
* @method destroy
*/
PIXI.FilterTexture.prototype.destroy = function()
{
var gl = this.gl;
gl.deleteFramebuffer( this.frameBuffer );
gl.deleteTexture( this.texture );
this.frameBuffer = null;
this.texture = null;
};

View file

@ -2,7 +2,13 @@
* @author Mat Groves http://matgroves.com/ @Doormat23 * @author Mat Groves http://matgroves.com/ @Doormat23
*/ */
/**
* @class WebGLFilterManager
* @constructor
* @param gl {WebGLContext} the current WebGL drawing context
* @param transparent {Boolean} Whether or not the drawing context should be transparent
* @private
*/
PIXI.WebGLFilterManager = function(gl, transparent) PIXI.WebGLFilterManager = function(gl, transparent)
{ {
this.transparent = transparent; this.transparent = transparent;
@ -16,7 +22,11 @@ PIXI.WebGLFilterManager = function(gl, transparent)
}; };
// API // API
/**
* Initialises the context and the properties
* @method setContext
* @param gl {WebGLContext} the current WebGL drawing context
*/
PIXI.WebGLFilterManager.prototype.setContext = function(gl) PIXI.WebGLFilterManager.prototype.setContext = function(gl)
{ {
this.gl = gl; this.gl = gl;
@ -25,6 +35,12 @@ PIXI.WebGLFilterManager.prototype.setContext = function(gl)
this.initShaderBuffers(); this.initShaderBuffers();
}; };
/**
*
* @method begin
* @param renderSession {RenderSession}
* @param buffer {ArrayBuffer}
*/
PIXI.WebGLFilterManager.prototype.begin = function(renderSession, buffer) PIXI.WebGLFilterManager.prototype.begin = function(renderSession, buffer)
{ {
this.renderSession = renderSession; this.renderSession = renderSession;
@ -37,6 +53,11 @@ PIXI.WebGLFilterManager.prototype.begin = function(renderSession, buffer)
this.buffer = buffer; this.buffer = buffer;
}; };
/**
* Applies the filter and adds it to the current filter stack
* @method pushFilter
* @param filterBlock {Object} TODO-Alvin
*/
PIXI.WebGLFilterManager.prototype.pushFilter = function(filterBlock) PIXI.WebGLFilterManager.prototype.pushFilter = function(filterBlock)
{ {
var gl = this.gl; var gl = this.gl;
@ -118,6 +139,10 @@ PIXI.WebGLFilterManager.prototype.pushFilter = function(filterBlock)
}; };
/**
* Removes the last filter from the filter stack and doesn't return it
* @method popFilter
*/
PIXI.WebGLFilterManager.prototype.popFilter = function() PIXI.WebGLFilterManager.prototype.popFilter = function()
{ {
var gl = this.gl; var gl = this.gl;
@ -291,6 +316,15 @@ PIXI.WebGLFilterManager.prototype.popFilter = function()
filterBlock._glFilterTexture = null; filterBlock._glFilterTexture = null;
}; };
/**
* 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
* @param width {Number} the horizontal range of the filter
* @param height {Number} the vertical range of the filter
*/
PIXI.WebGLFilterManager.prototype.applyFilterPass = function(filter, filterArea, width, height) PIXI.WebGLFilterManager.prototype.applyFilterPass = function(filter, filterArea, width, height)
{ {
// use program // use program
@ -343,6 +377,10 @@ PIXI.WebGLFilterManager.prototype.applyFilterPass = function(filter, filterArea,
this.renderSession.drawCount++; this.renderSession.drawCount++;
}; };
/**
* Initialises the shader buffers
* @method initShaderBuffers
*/
PIXI.WebGLFilterManager.prototype.initShaderBuffers = function() PIXI.WebGLFilterManager.prototype.initShaderBuffers = function()
{ {
var gl = this.gl; var gl = this.gl;
@ -399,6 +437,10 @@ PIXI.WebGLFilterManager.prototype.initShaderBuffers = function()
gl.STATIC_DRAW); gl.STATIC_DRAW);
}; };
/**
* TODO-Alvin
* @method destroy
*/
PIXI.WebGLFilterManager.prototype.destroy = function() PIXI.WebGLFilterManager.prototype.destroy = function()
{ {
var gl = this.gl; var gl = this.gl;
@ -421,57 +463,3 @@ PIXI.WebGLFilterManager.prototype.destroy = function()
gl.deleteBuffer(this.colorBuffer); gl.deleteBuffer(this.colorBuffer);
gl.deleteBuffer(this.indexBuffer); gl.deleteBuffer(this.indexBuffer);
}; };
PIXI.FilterTexture = function(gl, width, height)
{
this.gl = gl;
// next time to create a frame buffer and texture
this.frameBuffer = gl.createFramebuffer();
this.texture = gl.createTexture();
gl.bindTexture(gl.TEXTURE_2D, this.texture);
gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MAG_FILTER, gl.LINEAR);
gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MIN_FILTER, gl.LINEAR);
gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_S, gl.CLAMP_TO_EDGE);
gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_T, gl.CLAMP_TO_EDGE);
gl.bindFramebuffer(gl.FRAMEBUFFER, this.framebuffer );
gl.bindFramebuffer(gl.FRAMEBUFFER, this.frameBuffer );
gl.framebufferTexture2D(gl.FRAMEBUFFER, gl.COLOR_ATTACHMENT0, gl.TEXTURE_2D, this.texture, 0);
this.resize(width, height);
};
PIXI.FilterTexture.prototype.clear = function()
{
var gl = this.gl;
gl.clearColor(0,0,0, 0);
gl.clear(gl.COLOR_BUFFER_BIT);
};
PIXI.FilterTexture.prototype.resize = function(width, height)
{
if(this.width === width && this.height === height) return;
this.width = width;
this.height = height;
var gl = this.gl;
gl.bindTexture(gl.TEXTURE_2D, this.texture);
gl.texImage2D(gl.TEXTURE_2D, 0, gl.RGBA, width, height, 0, gl.RGBA, gl.UNSIGNED_BYTE, null);
};
PIXI.FilterTexture.prototype.destroy = function()
{
var gl = this.gl;
gl.deleteFramebuffer( this.frameBuffer );
gl.deleteTexture( this.texture );
this.frameBuffer = null;
this.texture = null;
};

View file

@ -5,7 +5,9 @@
/** /**
* A set of functions used by the webGL renderer to draw the primitive graphics data * A set of functions used by the webGL renderer to draw the primitive graphics data
* *
* @class CanvasGraphics * @class WebGLGraphics
* @private
* @static
*/ */
PIXI.WebGLGraphics = function() PIXI.WebGLGraphics = function()
{ {
@ -19,7 +21,7 @@ PIXI.WebGLGraphics = function()
* @private * @private
* @method renderGraphics * @method renderGraphics
* @param graphics {Graphics} * @param graphics {Graphics}
* @param projection {Object} * @param renderSession {Object}
*/ */
PIXI.WebGLGraphics.renderGraphics = function(graphics, renderSession)//projection, offset) PIXI.WebGLGraphics.renderGraphics = function(graphics, renderSession)//projection, offset)
{ {
@ -91,7 +93,8 @@ PIXI.WebGLGraphics.renderGraphics = function(graphics, renderSession)//projectio
* @static * @static
* @private * @private
* @method updateGraphics * @method updateGraphics
* @param graphics {Graphics} * @param graphicsData {Graphics} The graphics object to update
* @param gl {WebGLContext} the current WebGL drawing context
*/ */
PIXI.WebGLGraphics.updateGraphics = function(graphics, gl) PIXI.WebGLGraphics.updateGraphics = function(graphics, gl)
{ {
@ -145,7 +148,7 @@ PIXI.WebGLGraphics.updateGraphics = function(graphics, gl)
* @static * @static
* @private * @private
* @method buildRectangle * @method buildRectangle
* @param graphics {Graphics} * @param graphicsData {Graphics} The graphics object to draw TODO-Alvin
* @param webGLData {Object} * @param webGLData {Object}
*/ */
PIXI.WebGLGraphics.buildRectangle = function(graphicsData, webGLData) PIXI.WebGLGraphics.buildRectangle = function(graphicsData, webGLData)
@ -214,7 +217,7 @@ PIXI.WebGLGraphics.buildRectangle = function(graphicsData, webGLData)
* @static * @static
* @private * @private
* @method buildCircle * @method buildCircle
* @param graphics {Graphics} * @param graphicsData {Graphics} The graphics object to draw
* @param webGLData {Object} * @param webGLData {Object}
*/ */
PIXI.WebGLGraphics.buildCircle = function(graphicsData, webGLData) PIXI.WebGLGraphics.buildCircle = function(graphicsData, webGLData)
@ -287,7 +290,7 @@ PIXI.WebGLGraphics.buildCircle = function(graphicsData, webGLData)
* @static * @static
* @private * @private
* @method buildLine * @method buildLine
* @param graphics {Graphics} * @param graphicsData {Graphics} The graphics object to draw TODO-Alvin
* @param webGLData {Object} * @param webGLData {Object}
*/ */
PIXI.WebGLGraphics.buildLine = function(graphicsData, webGLData) PIXI.WebGLGraphics.buildLine = function(graphicsData, webGLData)
@ -497,7 +500,7 @@ PIXI.WebGLGraphics.buildLine = function(graphicsData, webGLData)
* @static * @static
* @private * @private
* @method buildPoly * @method buildPoly
* @param graphics {Graphics} * @param graphicsData {Graphics} The graphics object to draw TODO-Alvin
* @param webGLData {Object} * @param webGLData {Object}
*/ */
PIXI.WebGLGraphics.buildPoly = function(graphicsData, webGLData) PIXI.WebGLGraphics.buildPoly = function(graphicsData, webGLData)

View file

@ -2,6 +2,13 @@
* @author Mat Groves http://matgroves.com/ @Doormat23 * @author Mat Groves http://matgroves.com/ @Doormat23
*/ */
/**
* @class WebGLMaskManager
* @constructor
* @param gl {WebGLContext} the current WebGL drawing context
* @private
*/
PIXI.WebGLMaskManager = function(gl) PIXI.WebGLMaskManager = function(gl)
{ {
this.maskStack = []; this.maskStack = [];
@ -10,11 +17,22 @@ PIXI.WebGLMaskManager = function(gl)
this.setContext(gl); this.setContext(gl);
}; };
/**
* Sets the drawing context to the one given in parameter
* @method setContext
* @param gl {WebGLContext} the current WebGL drawing context
*/
PIXI.WebGLMaskManager.prototype.setContext = function(gl) PIXI.WebGLMaskManager.prototype.setContext = function(gl)
{ {
this.gl = gl; this.gl = gl;
}; };
/**
* Applies the Mask and adds it to the current filter stack
* @method pushMask
* @param maskData {Array}
* @param renderSession {RenderSession}
*/
PIXI.WebGLMaskManager.prototype.pushMask = function(maskData, renderSession) PIXI.WebGLMaskManager.prototype.pushMask = function(maskData, renderSession)
{ {
var gl = this.gl; var gl = this.gl;
@ -39,6 +57,12 @@ PIXI.WebGLMaskManager.prototype.pushMask = function(maskData, renderSession)
gl.stencilOp(gl.KEEP,gl.KEEP,gl.KEEP); gl.stencilOp(gl.KEEP,gl.KEEP,gl.KEEP);
}; };
/**
* Removes the last filter from the filter stack and doesn't return it
* @method popMask
*
* @param renderSession {RenderSession} TODO-Alvin
*/
PIXI.WebGLMaskManager.prototype.popMask = function(renderSession) PIXI.WebGLMaskManager.prototype.popMask = function(renderSession)
{ {
var gl = this.gl; var gl = this.gl;
@ -62,6 +86,10 @@ PIXI.WebGLMaskManager.prototype.popMask = function(renderSession)
if(this.maskStack.length === 0)gl.disable(gl.STENCIL_TEST); if(this.maskStack.length === 0)gl.disable(gl.STENCIL_TEST);
}; };
/**
* TODO-Alvin
* @method destroy
*/
PIXI.WebGLMaskManager.prototype.destroy = function() PIXI.WebGLMaskManager.prototype.destroy = function()
{ {
this.maskStack = null; this.maskStack = null;

View file

@ -2,6 +2,12 @@
* @author Mat Groves http://matgroves.com/ @Doormat23 * @author Mat Groves http://matgroves.com/ @Doormat23
*/ */
/**
* @class WebGLShaderManager
* @constructor
* @param gl {WebGLContext} the current WebGL drawing context
* @private
*/
PIXI.WebGLShaderManager = function(gl) PIXI.WebGLShaderManager = function(gl)
{ {
@ -18,6 +24,13 @@ PIXI.WebGLShaderManager = function(gl)
//this.stripShader = new PIXI.StripShader(gl); //this.stripShader = new PIXI.StripShader(gl);
}; };
/**
* 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) PIXI.WebGLShaderManager.prototype.setContext = function(gl)
{ {
this.gl = gl; this.gl = gl;
@ -36,6 +49,11 @@ PIXI.WebGLShaderManager.prototype.setContext = function(gl)
}; };
/**
* Initialises the context and the properties
* @method setAttribs
* @param attribs {Array} TODO-Alvin
*/
PIXI.WebGLShaderManager.prototype.setAttribs = function(attribs) PIXI.WebGLShaderManager.prototype.setAttribs = function(attribs)
{ {
// reset temp state // reset temp state
@ -77,6 +95,11 @@ PIXI.WebGLShaderManager.prototype.setAttribs = function(attribs)
// console.log(this.tempAttribState) // console.log(this.tempAttribState)
}; };
/**
* TODO-Alvin
* @method activateShader
* @param shader {Object} the shader that is going to be activated
*/
PIXI.WebGLShaderManager.prototype.activateShader = function(shader) PIXI.WebGLShaderManager.prototype.activateShader = function(shader)
{ {
//if(this.currentShader == shader)return; //if(this.currentShader == shader)return;
@ -90,6 +113,10 @@ PIXI.WebGLShaderManager.prototype.activateShader = function(shader)
}; };
/**
* Triggers the primitive shader
* @method activatePrimitiveShader
*/
PIXI.WebGLShaderManager.prototype.activatePrimitiveShader = function() PIXI.WebGLShaderManager.prototype.activatePrimitiveShader = function()
{ {
var gl = this.gl; var gl = this.gl;
@ -100,6 +127,10 @@ PIXI.WebGLShaderManager.prototype.activatePrimitiveShader = function()
}; };
/**
* Disable the primitive shader
* @method deactivatePrimitiveShader
*/
PIXI.WebGLShaderManager.prototype.deactivatePrimitiveShader = function() PIXI.WebGLShaderManager.prototype.deactivatePrimitiveShader = function()
{ {
var gl = this.gl; var gl = this.gl;
@ -109,6 +140,10 @@ PIXI.WebGLShaderManager.prototype.deactivatePrimitiveShader = function()
this.setAttribs(this.defaultShader.attributes); this.setAttribs(this.defaultShader.attributes);
}; };
/**
* Destroys
* @method destroy
*/
PIXI.WebGLShaderManager.prototype.destroy = function() PIXI.WebGLShaderManager.prototype.destroy = function()
{ {
this.attribState = null; this.attribState = null;

View file

@ -8,11 +8,30 @@
* https://github.com/libgdx/libgdx/blob/master/gdx/src/com/badlogic/gdx/graphics/g2d/WebGLSpriteBatch.java * https://github.com/libgdx/libgdx/blob/master/gdx/src/com/badlogic/gdx/graphics/g2d/WebGLSpriteBatch.java
*/ */
/**
*
* @class WebGLSpriteBatch
* @private
* @constructor
* @param gl {WebGLContext} the current WebGL drawing context
*
*/
PIXI.WebGLSpriteBatch = function(gl) PIXI.WebGLSpriteBatch = function(gl)
{ {
/**
* TODO-Alvin
*
* @property vertSize
* @type Number
*/
this.vertSize = 6; this.vertSize = 6;
/**
* TODO-Alvin
* @property size
* @type Number
*/
this.size = 10000;//Math.pow(2, 16) / this.vertSize; this.size = 10000;//Math.pow(2, 16) / this.vertSize;
// console.log(this.size); // console.log(this.size);
@ -21,9 +40,23 @@ PIXI.WebGLSpriteBatch = function(gl)
//the total number of indices in our batch //the total number of indices in our batch
var numIndices = this.size * 6; var numIndices = this.size * 6;
//vertex data //vertex data
/**
* Holds the vertices
*
* @property vertices
* @type Float32Array
*/
this.vertices = new Float32Array(numVerts); this.vertices = new Float32Array(numVerts);
//index data //index data
/**
* Holds the indices
*
* @property indices
* @type Uint16Array
*/
this.indices = new Uint16Array(numIndices); this.indices = new Uint16Array(numIndices);
this.lastIndexCount = 0; this.lastIndexCount = 0;
@ -46,6 +79,12 @@ PIXI.WebGLSpriteBatch = function(gl)
this.setContext(gl); this.setContext(gl);
}; };
/**
*
* @method setContext
*
* @param gl {WebGLContext} the current WebGL drawing context
*/
PIXI.WebGLSpriteBatch.prototype.setContext = function(gl) PIXI.WebGLSpriteBatch.prototype.setContext = function(gl)
{ {
this.gl = gl; this.gl = gl;
@ -67,6 +106,12 @@ PIXI.WebGLSpriteBatch.prototype.setContext = function(gl)
this.currentBlendMode = 99999; this.currentBlendMode = 99999;
}; };
/**
*
* @method begin
*
* @param renderSession {RenderSession} the RenderSession
*/
PIXI.WebGLSpriteBatch.prototype.begin = function(renderSession) PIXI.WebGLSpriteBatch.prototype.begin = function(renderSession)
{ {
this.renderSession = renderSession; this.renderSession = renderSession;
@ -75,12 +120,22 @@ PIXI.WebGLSpriteBatch.prototype.begin = function(renderSession)
this.start(); this.start();
}; };
/**
*
* @method end
*
*/
PIXI.WebGLSpriteBatch.prototype.end = function() PIXI.WebGLSpriteBatch.prototype.end = function()
{ {
this.flush(); this.flush();
}; };
/**
*
* @method render
*
* @param sprite {Sprite} the sprite to render TODO-Alvin
*/
PIXI.WebGLSpriteBatch.prototype.render = function(sprite) PIXI.WebGLSpriteBatch.prototype.render = function(sprite)
{ {
// check texture.. // check texture..
@ -194,6 +249,12 @@ PIXI.WebGLSpriteBatch.prototype.render = function(sprite)
}; };
/**
*
* @method renderTilingSprite
*
* @param sprite {TilingSprite} the sprite to render TODO-Alvin
*/
PIXI.WebGLSpriteBatch.prototype.renderTilingSprite = function(tilingSprite) PIXI.WebGLSpriteBatch.prototype.renderTilingSprite = function(tilingSprite)
{ {
var texture = tilingSprite.tilingTexture; var texture = tilingSprite.tilingTexture;
@ -309,6 +370,13 @@ PIXI.WebGLSpriteBatch.prototype.renderTilingSprite = function(tilingSprite)
this.currentBatchSize++; this.currentBatchSize++;
}; };
/**
*
*
* @method flush TODO-Alvin
*
*/
PIXI.WebGLSpriteBatch.prototype.flush = function() PIXI.WebGLSpriteBatch.prototype.flush = function()
{ {
// If the batch is length 0 then return as there is nothing to draw // If the batch is length 0 then return as there is nothing to draw
@ -345,12 +413,21 @@ PIXI.WebGLSpriteBatch.prototype.flush = function()
this.renderSession.drawCount++; this.renderSession.drawCount++;
}; };
/**
*
* @method stop
*
*/
PIXI.WebGLSpriteBatch.prototype.stop = function() PIXI.WebGLSpriteBatch.prototype.stop = function()
{ {
this.flush(); this.flush();
}; };
/**
*
* @method start
*
*/
PIXI.WebGLSpriteBatch.prototype.start = function() PIXI.WebGLSpriteBatch.prototype.start = function()
{ {
var gl = this.gl; var gl = this.gl;
@ -379,6 +456,13 @@ PIXI.WebGLSpriteBatch.prototype.start = function()
} }
}; };
/**
*
* @method setBlendMode
*
* @param blendMode {Number} the blendMode, should be a Pixi const, such as PIXI.BlendModes.ADD
* TODO-Alvin
*/
PIXI.WebGLSpriteBatch.prototype.setBlendMode = function(blendMode) PIXI.WebGLSpriteBatch.prototype.setBlendMode = function(blendMode)
{ {
this.flush(); this.flush();
@ -389,6 +473,10 @@ PIXI.WebGLSpriteBatch.prototype.setBlendMode = function(blendMode)
this.gl.blendFunc(blendModeWebGL[0], blendModeWebGL[1]); this.gl.blendFunc(blendModeWebGL[0], blendModeWebGL[1]);
}; };
/**
* Destroys the SpriteBatch
* @method destroy
*/
PIXI.WebGLSpriteBatch.prototype.destroy = function() PIXI.WebGLSpriteBatch.prototype.destroy = function()
{ {

View file

@ -44,11 +44,11 @@ PIXI.BitmapText.prototype.setText = function(text)
/** /**
* Set the style of the text * Set the style of the text
* style.font {String} The size (optional) and bitmap font id (required) eq 'Arial' or '20px Arial' (must have loaded previously)
* [style.align='left'] {String} Alignment for multiline text ('left', 'center' or 'right'), does not affect single line text
* *
* @method setStyle * @method setStyle
* @param style {Object} The style parameters * @param style {Object} The style parameters, contained as properties of an object
* @param style.font {String} The size (optional) and bitmap font id (required) eq 'Arial' or '20px Arial' (must have loaded previously)
* @param [style.align='left'] {String} Alignment for multiline text ('left', 'center' or 'right'), does not affect single line text
*/ */
PIXI.BitmapText.prototype.setStyle = function(style) PIXI.BitmapText.prototype.setStyle = function(style)
{ {

View file

@ -20,8 +20,21 @@
*/ */
PIXI.Text = function(text, style) PIXI.Text = function(text, style)
{ {
/**
* The canvas element that everything is drawn to
*
* @property canvas
* @type HTMLCanvasElement
*/
this.canvas = document.createElement('canvas'); this.canvas = document.createElement('canvas');
/**
* The canvas 2d context that everything is drawn with
* @property context
* @type HTMLCanvasElement 2d Context
*/
this.context = this.canvas.getContext('2d'); this.context = this.canvas.getContext('2d');
PIXI.Sprite.call(this, PIXI.Texture.fromCanvas(this.canvas)); PIXI.Sprite.call(this, PIXI.Texture.fromCanvas(this.canvas));
this.setText(text); this.setText(text);
@ -167,6 +180,13 @@ PIXI.Text.prototype.updateTexture = function()
this.requiresUpdate = true; this.requiresUpdate = true;
}; };
/**
* Renders the object using the WebGL renderer
*
* @method _renderWebGL
* @param renderSession {RenderSession}
* @private
*/
PIXI.Text.prototype._renderWebGL = function(renderSession) PIXI.Text.prototype._renderWebGL = function(renderSession)
{ {
if(this.requiresUpdate) if(this.requiresUpdate)
@ -198,6 +218,7 @@ PIXI.Text.prototype.updateTransform = function()
/* /*
* http://stackoverflow.com/users/34441/ellisbben * http://stackoverflow.com/users/34441/ellisbben
* great solution to the problem! * great solution to the problem!
* returns the height of the given font
* *
* @method determineFontHeight * @method determineFontHeight
* @param fontStyle {Object} * @param fontStyle {Object}

View file

@ -15,6 +15,7 @@ PIXI.BaseTextureCacheIdGenerator = 0;
* @uses EventTarget * @uses EventTarget
* @constructor * @constructor
* @param source {String} the source object (image or canvas) * @param source {String} the source object (image or canvas)
* @param scaleMode {Number} Should be one of the PIXI.scaleMode consts
*/ */
PIXI.BaseTexture = function(source, scaleMode) PIXI.BaseTexture = function(source, scaleMode)
{ {

View file

@ -6,7 +6,8 @@
* This helper function will automatically detect which renderer you should be using. * This helper function will automatically detect which renderer you should be using.
* WebGL is the preferred renderer as it is a lot faster. If webGL is not supported by * WebGL is the preferred renderer as it is a lot faster. If webGL is not supported by
* the browser then this function will return a canvas renderer * the browser then this function will return a canvas renderer
* * @class autoDetectRenderer
* @static
* @param width=800 {Number} the width of the renderers view * @param width=800 {Number} the width of the renderers view
* @param height=600 {Number} the height of the renderers view * @param height=600 {Number} the height of the renderers view
* @param [view] {Canvas} the canvas to use as a view, optional * @param [view] {Canvas} the canvas to use as a view, optional

View file

@ -11,7 +11,7 @@
* Adds event emitter functionality to a class * Adds event emitter functionality to a class
* *
* @class EventTarget * @class EventTarget
* @example *
* function MyEmitter() { * function MyEmitter() {
* PIXI.EventTarget.call(this); //mixes in event target stuff * PIXI.EventTarget.call(this); //mixes in event target stuff
* } * }
@ -21,8 +21,21 @@
*/ */
PIXI.EventTarget = function () { PIXI.EventTarget = function () {
/**
* Holds all the listeners
*
* @property listeneners
* @type Object
*/
var listeners = {}; var listeners = {};
/**
* Adds a listener for a specific event
*
* @method addEventListener
* @param type {string} A string representing the event type to listen for.
* @param listener {function} The callback function that will be fired when the event occurs
*/
this.addEventListener = this.on = function ( type, listener ) { this.addEventListener = this.on = function ( type, listener ) {
@ -39,6 +52,12 @@ PIXI.EventTarget = function () {
}; };
/**
* Fires the event, ie pretends that the event has happened
*
* @method dispatchEvent
* @param event {Event} the event object
*/
this.dispatchEvent = this.emit = function ( event ) { this.dispatchEvent = this.emit = function ( event ) {
if ( !listeners[ event.type ] || !listeners[ event.type ].length ) { if ( !listeners[ event.type ] || !listeners[ event.type ].length ) {
@ -55,6 +74,13 @@ PIXI.EventTarget = function () {
}; };
/**
* Removes the specified listener that was assigned to the specified event type
*
* @method removeEventListener
* @param type {string} A string representing the event type which will have its listener removed
* @param listener {function} The callback function that was be fired when the event occured
*/
this.removeEventListener = this.off = function ( type, listener ) { this.removeEventListener = this.off = function ( type, listener ) {
var index = listeners[ type ].indexOf( listener ); var index = listeners[ type ].indexOf( listener );
@ -67,6 +93,12 @@ PIXI.EventTarget = function () {
}; };
/**
* Removes all the listeners that were active for the specified event type
*
* @method removeAllEventListeners
* @param type {string} A string representing the event type which will have all its listeners removed
*/
this.removeAllEventListeners = function( type ) { this.removeAllEventListeners = function( type ) {
var a = listeners[type]; var a = listeners[type];
if (a) if (a)

View file

@ -28,17 +28,23 @@
This is an amazing lib! 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);
* @class PolyK
*
*/
PIXI.PolyK = {}; PIXI.PolyK = {};
/** /**
* Triangulates shapes for webGL graphic fills * Triangulates shapes for webGL graphic fills
* *
* @method Triangulate * @method Triangulate
* @namespace PolyK *
* @constructor
*/ */
PIXI.PolyK.Triangulate = function(p) PIXI.PolyK.Triangulate = function(p)
{ {
@ -114,10 +120,17 @@ PIXI.PolyK.Triangulate = function(p)
}; };
/** /**
* Checks if a point is within a triangle * Checks whether a point is within a triangle
* *
* @class _PointInTriangle * @method _PointInTriangle
* @namespace PolyK * @param px {Number} x coordinate of the point to test
* @param py {Number} y coordinate of the point to test
* @param ax {Number} x coordinate of the a point of the triangle
* @param ay {Number} y coordinate of the a point of the triangle
* @param bx {Number} x coordinate of the b point of the triangle
* @param by {Number} y coordinate of the b point of the triangle
* @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 * @private
*/ */
PIXI.PolyK._PointInTriangle = function(px, py, ax, ay, bx, by, cx, cy) PIXI.PolyK._PointInTriangle = function(px, py, ax, ay, bx, by, cx, cy)
@ -144,10 +157,10 @@ PIXI.PolyK._PointInTriangle = function(px, py, ax, ay, bx, by, cx, cy)
}; };
/** /**
* Checks if a shape is convex * Checks whether a shape is convex
*
* @method _convex
* *
* @class _convex
* @namespace PolyK
* @private * @private
*/ */
PIXI.PolyK._convex = function(ax, ay, bx, by, cx, cy, sign) PIXI.PolyK._convex = function(ax, ay, bx, by, cx, cy, sign)

View file

@ -102,7 +102,7 @@ if (typeof Function.prototype.bind !== 'function') {
* @class AjaxRequest * @class AjaxRequest
* @constructor * @constructor
*/ */
PIXI.AjaxRequest = function AjaxRequest() PIXI.AjaxRequest = function()
{ {
var activexmodes = ['Msxml2.XMLHTTP.6.0', 'Msxml2.XMLHTTP.3.0', 'Microsoft.XMLHTTP']; //activeX versions to check for in IE var activexmodes = ['Msxml2.XMLHTTP.6.0', 'Msxml2.XMLHTTP.3.0', 'Microsoft.XMLHTTP']; //activeX versions to check for in IE