diff --git a/bin/pixi.dev.js b/bin/pixi.dev.js index 8558d80..45e6eba 100644 --- a/bin/pixi.dev.js +++ b/bin/pixi.dev.js @@ -1,10 +1,10 @@ /** * @license * pixi.js - v1.4.3 - * Copyright (c) 2012, Mat Groves + * Copyright (c) 2012-2014, Mat Groves * http://goodboydigital.com/ * - * Compiled: 2014-01-28 + * Compiled: 2014-01-30 * * pixi.js is licensed under the MIT License. * http://www.opensource.org/licenses/mit-license.php @@ -461,7 +461,7 @@ return (typeof Float32Array !== 'undefined') ? Float32Array : Array; }; -PIXI.Matrix = PIXI.determineMatrixArrayType(); +PIXI.Matrix2 = PIXI.determineMatrixArrayType(); /** @@ -482,7 +482,7 @@ */ PIXI.mat3.create = function() { - var matrix = new PIXI.Matrix(9); + var matrix = new PIXI.Matrix2(9); matrix[0] = 1; matrix[1] = 0; @@ -567,7 +567,7 @@ */ PIXI.mat3.clone = function(mat) { - var matrix = new PIXI.Matrix(9); + var matrix = new PIXI.Matrix2(9); matrix[0] = mat[0]; matrix[1] = mat[1]; @@ -666,7 +666,7 @@ */ PIXI.mat4.create = function() { - var matrix = new PIXI.Matrix(16); + var matrix = new PIXI.Matrix2(16); matrix[0] = 1; matrix[1] = 0; @@ -799,6 +799,64 @@ PIXI.identityMatrix = PIXI.mat3.create(); PIXI.tempMatrix = PIXI.mat3.create(); + +PIXI.Matrix = function() +{ + this.a = 1; + this.b = 0; + this.c = 0; + this.d = 1; + this.tx = 0; + this.ty = 0; + + +} + +PIXI.Matrix.prototype.fromArray = function(array) +{ + + this.a = array[0]; + this.b = array[1]; + this.c = array[3]; + this.d = array[4]; + this.tx = array[2]; + this.ty = array[5]; + +} + +PIXI.Matrix.prototype.toArray = function(transpose) +{ + if(!this.array)this.array = new Float32Array(9); + var array = this.array; + + if(transpose) + { + this.array[0] = this.a; + this.array[1] = this.c; + this.array[2] = 0; + this.array[3] = this.b; + this.array[4] = this.d; + this.array[5] = 0; + this.array[6] = this.tx; + this.array[7] = this.ty; + this.array[8] = 1; + } + else + { + this.array[0] = this.a; + this.array[1] = this.b; + this.array[2] = this.tx; + this.array[3] = this.c; + this.array[4] = this.d; + this.array[5] = this.ty; + this.array[6] = 0; + this.array[7] = 0; + this.array[8] = 1; + } + + return array;//[this.a, this.b, this.tx, this.c, this.d, this.ty, 0, 0, 1]; +} + /** * @author Mat Groves http://matgroves.com/ @Doormat23 */ @@ -940,7 +998,7 @@ * @readOnly * @private */ - this.worldTransform = PIXI.mat3.create(); //mat3.identity(); + this.worldTransform = new PIXI.Matrix()//PIXI.mat3.create(); //mat3.identity(); /** * [read-only] Current transform of the object locally @@ -950,7 +1008,7 @@ * @readOnly * @private */ - this.localTransform = PIXI.mat3.create(); //mat3.identity(); + this.localTransform = new PIXI.Matrix()//PIXI.mat3.create(); //mat3.identity(); /** * [NYI] Unknown @@ -1208,40 +1266,30 @@ this._cr = Math.cos(this.rotation); } - var localTransform = this.localTransform; - var parentTransform = this.parent.worldTransform; - var worldTransform = this.worldTransform; + // var localTransform = this.localTransform//.toArray(); + var parentTransform = this.parent.worldTransform//.toArray(); + var worldTransform = this.worldTransform//.toArray(); //console.log(localTransform) - localTransform[0] = this._cr * this.scale.x; - localTransform[1] = -this._sr * this.scale.y; - localTransform[3] = this._sr * this.scale.x; - localTransform[4] = this._cr * this.scale.y; - - // TODO --> do we even need a local matrix??? - var px = this.pivot.x; var py = this.pivot.y; - // Cache the matrix values (makes for huge speed increases!) - var a00 = localTransform[0], a01 = localTransform[1], a02 = this.position.x - localTransform[0] * px - py * localTransform[1], - a10 = localTransform[3], a11 = localTransform[4], a12 = this.position.y - localTransform[4] * py - px * localTransform[3], + var a00 = this._cr * this.scale.x, + a01 = -this._sr * this.scale.y, + a10 = this._sr * this.scale.x, + a11 = this._cr * this.scale.y, + a02 = this.position.x + a00 * px - py * a01, + a12 = this.position.y + a11 * py - px * a10, + b00 = parentTransform.a, b01 = parentTransform.b, b02 = parentTransform.tx, + b10 = parentTransform.c, b11 = parentTransform.d, b12 = parentTransform.ty; - b00 = parentTransform[0], b01 = parentTransform[1], b02 = parentTransform[2], - b10 = parentTransform[3], b11 = parentTransform[4], b12 = parentTransform[5]; + worldTransform.a = b00 * a00 + b01 * a10; + worldTransform.b = b00 * a01 + b01 * a11; + worldTransform.tx = b00 * a02 + b01 * a12 + b02; - localTransform[2] = a02; - localTransform[5] = a12; + worldTransform.c = b10 * a00 + b11 * a10; + worldTransform.d = b10 * a01 + b11 * a11; + worldTransform.ty = b10 * a02 + b11 * a12 + b12; - worldTransform[0] = b00 * a00 + b01 * a10; - worldTransform[1] = b00 * a01 + b01 * a11; - worldTransform[2] = b00 * a02 + b01 * a12 + b02; - - worldTransform[3] = b10 * a00 + b11 * a10; - worldTransform[4] = b10 * a01 + b11 * a11; - worldTransform[5] = b10 * a02 + b11 * a12 + b12; - - // because we are using affine transformation, we can optimise the matrix concatenation process.. wooo! - // mat3.multiply(this.localTransform, this.parent.worldTransform, this.worldTransform); this.worldAlpha = this.alpha * this.parent.worldAlpha; }; @@ -1316,6 +1364,36 @@ // this line is just here to pass jshinting :) renderSession = renderSession; }; + +/** + * The position of the displayObject on the x axis relative to the local coordinates of the parent. + * + * @property x + * @type Number + */ +Object.defineProperty(PIXI.DisplayObject.prototype, 'x', { + get: function() { + return this.position.x; + }, + set: function(value) { + this.position.x = value; + } +}); + +/** + * The position of the displayObject on the y axis relative to the local coordinates of the parent. + * + * @property y + * @type Number + */ +Object.defineProperty(PIXI.DisplayObject.prototype, 'y', { + get: function() { + return this.position.y; + }, + set: function(value) { + this.position.y = value; + } +}); /** * @author Mat Groves http://matgroves.com/ @Doormat23 */ @@ -1534,12 +1612,16 @@ var childMaxX; var childMaxY; + var childVisible = false; + for(var i=0,j=this.children.length; i childMaxY ? maxY : childMaxY; } + if(!childVisible) + return PIXI.EmptyRectangle; + var bounds = this._bounds; bounds.x = minX; @@ -1868,12 +1953,12 @@ var worldTransform = this.worldTransform; - var a = worldTransform[0]; - var b = worldTransform[3]; - var c = worldTransform[1]; - var d = worldTransform[4]; - var tx = worldTransform[2]; - var ty = worldTransform[5]; + var a = worldTransform.a; + var b = worldTransform.c; + var c = worldTransform.b; + var d = worldTransform.d; + var tx = worldTransform.tx; + var ty = worldTransform.ty; var x1 = a * w1 + c * h1 + tx; var y1 = d * h1 + b * w1 + ty; @@ -2029,7 +2114,7 @@ // allow for trimming - context.setTransform(transform[0], transform[3], transform[1], transform[4], transform[2], transform[5]); + context.setTransform(transform.a, transform.c, transform.b, transform.d, transform.tx, transform.ty); //if smoothingEnabled is supported and we need to change the smoothing property for this texture if(renderSession.smoothProperty && renderSession.scaleMode !== this.texture.baseTexture.scaleMode) { @@ -2169,6 +2254,13 @@ PIXI.SpriteBatch.prototype = Object.create( PIXI.DisplayObjectContainer.prototype ); PIXI.SpriteBatch.constructor = PIXI.SpriteBatch; + +/* + * Initialises the spriteBatch + * + * @method initWebGL + * @param gl {WebGLContext} the current WebGL drawing context + */ PIXI.SpriteBatch.prototype.initWebGL = function(gl) { @@ -2234,7 +2326,7 @@ // alow for trimming - context.setTransform(transform[0], transform[3], transform[1], transform[4], transform[2], transform[5]); + context.setTransform(transform.a, transform.c, transform.b, transform.d, transform.tx, transform.ty); context.save(); for (var i = 0; i < this.children.length; i++) { @@ -2264,7 +2356,7 @@ PIXI.DisplayObject.prototype.updateTransform.call(child); transform = child.localTransform; - context.setTransform(transform[0], transform[3], transform[1], transform[4], transform[2], transform[5]); + context.setTransform(transform.a, transform.c, transform.b, transform.d, transform.tx, transform.ty); context.drawImage(texture.baseTexture.source, frame.x, @@ -2484,8 +2576,21 @@ */ PIXI.Text = function(text, style) { + /** + * The canvas element that everything is drawn to + * + * @property canvas + * @type HTMLCanvasElement + */ 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'); + PIXI.Sprite.call(this, PIXI.Texture.fromCanvas(this.canvas)); this.setText(text); @@ -2631,6 +2736,13 @@ this.requiresUpdate = true; }; +/** +* Renders the object using the WebGL renderer +* +* @method _renderWebGL +* @param renderSession {RenderSession} +* @private +*/ PIXI.Text.prototype._renderWebGL = function(renderSession) { if(this.requiresUpdate) @@ -2662,6 +2774,7 @@ /* * http://stackoverflow.com/users/34441/ellisbben * great solution to the problem! + * returns the height of the given font * * @method determineFontHeight * @param fontStyle {Object} @@ -2798,11 +2911,11 @@ /** * 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 - * @param style {Object} The style parameters - * @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 + * @param style {Object} The style parameters, contained as properties of an object */ PIXI.BitmapText.prototype.setStyle = function(style) { @@ -3435,8 +3548,8 @@ var isSprite = (item instanceof PIXI.Sprite), worldTransform = item.worldTransform, - a00 = worldTransform[0], a01 = worldTransform[1], a02 = worldTransform[2], - a10 = worldTransform[3], a11 = worldTransform[4], a12 = worldTransform[5], + a00 = worldTransform.a, a01 = worldTransform.b, a02 = worldTransform.tx, + a10 = worldTransform.c, a11 = worldTransform.d, a12 = worldTransform.ty, id = 1 / (a00 * a11 + a01 * -a10), x = a11 * id * global.x + -a01 * id * global.y + (a12 * a01 - a02 * a11) * id, y = a00 * id * global.y + -a10 * id * global.x + (-a12 * a00 + a02 * a10) * id; @@ -3674,7 +3787,7 @@ * @param backgroundColor {Number} the background color of the stage, you have to pass this in is in hex format * 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); * 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 @@ -3693,7 +3806,7 @@ * @readOnly * @private */ - this.worldTransform = PIXI.mat3.create(); + this.worldTransform = new PIXI.Matrix()//PIXI.mat3.create(); /** * Whether or not the stage is interactive @@ -3901,7 +4014,7 @@ * @class AjaxRequest * @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 @@ -4008,7 +4121,7 @@ * Adds event emitter functionality to a class * * @class EventTarget - * @example + * * function MyEmitter() { * PIXI.EventTarget.call(this); //mixes in event target stuff * } @@ -4018,8 +4131,21 @@ */ PIXI.EventTarget = function () { + /** + * Holds all the listeners + * + * @property listeneners + * @type Object + */ 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 ) { @@ -4036,6 +4162,12 @@ }; + /** + * Fires the event, ie pretends that the event has happened + * + * @method dispatchEvent + * @param event {Event} the event object + */ this.dispatchEvent = this.emit = function ( event ) { if ( !listeners[ event.type ] || !listeners[ event.type ].length ) { @@ -4052,6 +4184,13 @@ }; + /** + * 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 ) { var index = listeners[ type ].indexOf( listener ); @@ -4064,6 +4203,12 @@ }; + /** + * 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 ) { var a = listeners[type]; if (a) @@ -4079,7 +4224,8 @@ * 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 * the browser then this function will return a canvas renderer - * + * @class autoDetectRenderer + * @static * @param width=800 {Number} the width 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 @@ -4149,17 +4295,23 @@ 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 = {}; /** * Triangulates shapes for webGL graphic fills * * @method Triangulate - * @namespace PolyK - * @constructor + * */ PIXI.PolyK.Triangulate = function(p) { @@ -4235,10 +4387,17 @@ }; /** - * Checks if a point is within a triangle + * Checks whether a point is within a triangle * - * @class _PointInTriangle - * @namespace PolyK + * @method _PointInTriangle + * @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 */ PIXI.PolyK._PointInTriangle = function(px, py, ax, ay, bx, by, cx, cy) @@ -4265,10 +4424,10 @@ }; /** - * Checks if a shape is convex + * Checks whether a shape is convex * - * @class _convex - * @namespace PolyK + * @method _convex + * * @private */ PIXI.PolyK._convex = function(ax, ay, bx, by, cx, cy, sign) @@ -4343,6 +4502,10 @@ */ PIXI.PixiShader = function(gl) { + /** + * @property gl + * @type WebGLContext + */ this.gl = gl; /** @@ -4375,7 +4538,9 @@ }; /** -* @method PIXI.PixiShader#init +* Initialises the shader +* @method init +* */ PIXI.PixiShader.prototype.init = function() { @@ -4430,7 +4595,7 @@ * 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 * -* @method PIXI.PixiShader#initUniforms +* @method initUniforms */ PIXI.PixiShader.prototype.initUniforms = function() { @@ -4501,7 +4666,7 @@ /** * 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) { @@ -4542,7 +4707,7 @@ wrapT = gl.REPEAT; } - gl.pixelStorei(gl.UNPACK_FLIP_Y_WEBGL, false); + gl.pixelStorei(gl.UNPACK_FLIP_Y_WEBGL, !!data.flipY); if (data.width) { @@ -4576,7 +4741,7 @@ /** * Updates the shader uniform values. * -* @method PIXI.PixiShader#syncUniforms +* @method syncUniforms */ PIXI.PixiShader.prototype.syncUniforms = function() { @@ -4631,6 +4796,11 @@ }; +/** +* Destroys the shader +* @method destroy +* +*/ PIXI.PixiShader.prototype.destroy = function() { this.gl.deleteProgram( this.program ); @@ -4640,6 +4810,11 @@ this.attributes = null; }; +/** +* +* @property defaultVertexSrc +* @type String +*/ PIXI.PixiShader.defaultVertexSrc = [ 'attribute vec2 aVertexPosition;', 'attribute vec2 aTextureCoord;', @@ -4673,19 +4848,25 @@ /** * @class PIXI.PixiFastShader * @constructor +* @param gl {WebGLContext} the current WebGL drawing context */ PIXI.PixiFastShader = function(gl) { + + /** + * @property gl + * @type WebGLContext + */ this.gl = gl; /** - * @property {any} program - The WebGL program. - */ + * @property {any} program - The WebGL program. + */ this.program = null; /** - * @property {array} fragmentSrc - The fragment shader. - */ + * @property {array} fragmentSrc - The fragment shader. + */ this.fragmentSrc = [ 'precision lowp float;', 'varying vec2 vTextureCoord;', @@ -4696,6 +4877,9 @@ '}' ]; + /** + * @property {array} vertexSrc - The vertex shader + */ this.vertexSrc = [ 'attribute vec2 aVertexPosition;', 'attribute vec2 aPositionCoord;', @@ -4737,7 +4921,9 @@ }; /** -* @method PIXI.PixiFastShader#init +* Initialises the shader +* @method init +* */ PIXI.PixiFastShader.prototype.init = function() { @@ -4787,6 +4973,11 @@ this.program = program; }; +/** +* Destroys the shader +* @method destroy +* +*/ PIXI.PixiFastShader.prototype.destroy = function() { this.gl.deleteProgram( this.program ); @@ -4803,9 +4994,14 @@ PIXI.StripShader = function() { - // the webGL program.. + /** + * @property {any} program - The WebGL program. + */ this.program = null; + /** + * @property {array} fragmentSrc - The fragment shader. + */ this.fragmentSrc = [ 'precision mediump float;', 'varying vec2 vTextureCoord;', @@ -4819,6 +5015,9 @@ '}' ]; + /** + * @property {array} fragmentSrc - The fragment shader. + */ this.vertexSrc = [ 'attribute vec2 aVertexPosition;', 'attribute vec2 aTextureCoord;', @@ -4839,6 +5038,11 @@ ]; }; +/** +* Initialises the shader +* @method init +* +*/ PIXI.StripShader.prototype.init = function() { @@ -4868,14 +5072,28 @@ * @author Mat Groves http://matgroves.com/ @Doormat23 */ - +/** +* @class PrimitiveShader +* @constructor +* @param gl {WebGLContext} the current WebGL drawing context +*/ PIXI.PrimitiveShader = function(gl) { + /** + * @property gl + * @type WebGLContext + */ this.gl = gl; - // the webGL program.. + /** + * @property {any} program - The WebGL program. + */ this.program = null; + /** + * @property fragmentSrc + * @type Array + */ this.fragmentSrc = [ 'precision mediump float;', 'varying vec4 vColor;', @@ -4885,6 +5103,10 @@ '}' ]; + /** + * @property vertexSrc + * @type Array + */ this.vertexSrc = [ 'attribute vec2 aVertexPosition;', 'attribute vec4 aColor;', @@ -4906,6 +5128,11 @@ this.init(); }; +/** +* Initialises the shader +* @method init +* +*/ PIXI.PrimitiveShader.prototype.init = function() { @@ -4932,6 +5159,11 @@ this.program = program; }; +/** +* Destroys the shader +* @method destroy +* +*/ PIXI.PrimitiveShader.prototype.destroy = function() { this.gl.deleteProgram( this.program ); @@ -4948,7 +5180,9 @@ /** * A set of functions used by the webGL renderer to draw the primitive graphics data * - * @class CanvasGraphics + * @class WebGLGraphics + * @private + * @static */ PIXI.WebGLGraphics = function() { @@ -4962,7 +5196,7 @@ * @private * @method renderGraphics * @param graphics {Graphics} - * @param projection {Object} + * @param renderSession {Object} */ PIXI.WebGLGraphics.renderGraphics = function(graphics, renderSession)//projection, offset) { @@ -4999,12 +5233,10 @@ // This could be speeded up for sure! // var m = PIXI.mat3.clone(graphics.worldTransform); - PIXI.mat3.transpose(graphics.worldTransform, PIXI.tempMatrix); - // set the matrix transform gl.blendFunc(gl.ONE, gl.ONE_MINUS_SRC_ALPHA); - gl.uniformMatrix3fv(shader.translationMatrix, false, PIXI.tempMatrix); + gl.uniformMatrix3fv(shader.translationMatrix, false, graphics.worldTransform.toArray(true)); gl.uniform2f(shader.projectionVector, projection.x, -projection.y); gl.uniform2f(shader.offsetVector, -offset.x, -offset.y); @@ -5034,7 +5266,8 @@ * @static * @private * @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) { @@ -5088,7 +5321,7 @@ * @static * @private * @method buildRectangle - * @param graphics {Graphics} + * @param graphicsData {Graphics} The graphics object to draw TODO-Alvin * @param webGLData {Object} */ PIXI.WebGLGraphics.buildRectangle = function(graphicsData, webGLData) @@ -5157,7 +5390,7 @@ * @static * @private * @method buildCircle - * @param graphics {Graphics} + * @param graphicsData {Graphics} The graphics object to draw * @param webGLData {Object} */ PIXI.WebGLGraphics.buildCircle = function(graphicsData, webGLData) @@ -5230,7 +5463,7 @@ * @static * @private * @method buildLine - * @param graphics {Graphics} + * @param graphicsData {Graphics} The graphics object to draw TODO-Alvin * @param webGLData {Object} */ PIXI.WebGLGraphics.buildLine = function(graphicsData, webGLData) @@ -5440,7 +5673,7 @@ * @static * @private * @method buildPoly - * @param graphics {Graphics} + * @param graphicsData {Graphics} The graphics object to draw TODO-Alvin * @param webGLData {Object} */ PIXI.WebGLGraphics.buildPoly = function(graphicsData, webGLData) @@ -6050,6 +6283,13 @@ * @author Mat Groves http://matgroves.com/ @Doormat23 */ + +/** +* @class WebGLMaskManager +* @constructor +* @param gl {WebGLContext} the current WebGL drawing context +* @private +*/ PIXI.WebGLMaskManager = function(gl) { this.maskStack = []; @@ -6058,11 +6298,22 @@ 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) { 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) { var gl = this.gl; @@ -6087,6 +6338,12 @@ 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) { var gl = this.gl; @@ -6110,6 +6367,10 @@ if(this.maskStack.length === 0)gl.disable(gl.STENCIL_TEST); }; +/** +* TODO-Alvin +* @method destroy +*/ PIXI.WebGLMaskManager.prototype.destroy = function() { this.maskStack = null; @@ -6119,6 +6380,12 @@ * @author Mat Groves http://matgroves.com/ @Doormat23 */ +/** +* @class WebGLShaderManager +* @constructor +* @param gl {WebGLContext} the current WebGL drawing context +* @private +*/ PIXI.WebGLShaderManager = function(gl) { @@ -6135,6 +6402,13 @@ //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) { this.gl = gl; @@ -6153,6 +6427,11 @@ }; +/** +* Initialises the context and the properties +* @method setAttribs +* @param attribs {Array} TODO-Alvin +*/ PIXI.WebGLShaderManager.prototype.setAttribs = function(attribs) { // reset temp state @@ -6194,6 +6473,11 @@ // 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) { //if(this.currentShader == shader)return; @@ -6207,6 +6491,10 @@ }; +/** +* Triggers the primitive shader +* @method activatePrimitiveShader +*/ PIXI.WebGLShaderManager.prototype.activatePrimitiveShader = function() { var gl = this.gl; @@ -6217,6 +6505,10 @@ }; +/** +* Disable the primitive shader +* @method deactivatePrimitiveShader +*/ PIXI.WebGLShaderManager.prototype.deactivatePrimitiveShader = function() { var gl = this.gl; @@ -6226,6 +6518,10 @@ this.setAttribs(this.defaultShader.attributes); }; +/** +* Destroys +* @method destroy +*/ PIXI.WebGLShaderManager.prototype.destroy = function() { this.attribState = null; @@ -6252,11 +6548,30 @@ * 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) { - + /** + * TODO-Alvin + * + * @property vertSize + * @type Number + */ this.vertSize = 6; + + /** + * TODO-Alvin + * @property size + * @type Number + */ this.size = 10000;//Math.pow(2, 16) / this.vertSize; // console.log(this.size); @@ -6265,9 +6580,23 @@ //the total number of indices in our batch var numIndices = this.size * 6; - //vertex data + //vertex data + + /** + * Holds the vertices + * + * @property vertices + * @type Float32Array + */ this.vertices = new Float32Array(numVerts); + //index data + /** + * Holds the indices + * + * @property indices + * @type Uint16Array + */ this.indices = new Uint16Array(numIndices); this.lastIndexCount = 0; @@ -6290,6 +6619,12 @@ this.setContext(gl); }; +/** +* +* @method setContext +* +* @param gl {WebGLContext} the current WebGL drawing context +*/ PIXI.WebGLSpriteBatch.prototype.setContext = function(gl) { this.gl = gl; @@ -6311,6 +6646,12 @@ this.currentBlendMode = 99999; }; +/** +* +* @method begin +* +* @param renderSession {RenderSession} the RenderSession +*/ PIXI.WebGLSpriteBatch.prototype.begin = function(renderSession) { this.renderSession = renderSession; @@ -6319,12 +6660,22 @@ this.start(); }; +/** +* +* @method end +* +*/ PIXI.WebGLSpriteBatch.prototype.end = function() { this.flush(); }; - +/** +* +* @method render +* +* @param sprite {Sprite} the sprite to render TODO-Alvin +*/ PIXI.WebGLSpriteBatch.prototype.render = function(sprite) { // check texture.. @@ -6383,21 +6734,21 @@ var index = this.currentBatchSize * 4 * this.vertSize; - var worldTransform = sprite.worldTransform; + var worldTransform = sprite.worldTransform;//.toArray(); - var a = worldTransform[0]; - var b = worldTransform[3]; - var c = worldTransform[1]; - var d = worldTransform[4]; - var tx = worldTransform[2]; - var ty = worldTransform[5]; + var a = worldTransform.a//[0]; + var b = worldTransform.c//[3]; + var c = worldTransform.b//[1]; + var d = worldTransform.d//[4]; + var tx = worldTransform.tx//[2]; + var ty = worldTransform.ty///[5]; // xy verticies[index++] = a * w1 + c * h1 + tx; verticies[index++] = d * h1 + b * w1 + ty; // uv - verticies[index++] = uvs[0]; - verticies[index++] = uvs[1]; + verticies[index++] = uvs.x0; + verticies[index++] = uvs.y0; // color verticies[index++] = alpha; verticies[index++] = tint; @@ -6406,8 +6757,8 @@ verticies[index++] = a * w0 + c * h1 + tx; verticies[index++] = d * h1 + b * w0 + ty; // uv - verticies[index++] = uvs[2]; - verticies[index++] = uvs[3]; + verticies[index++] = uvs.x1; + verticies[index++] = uvs.y1; // color verticies[index++] = alpha; verticies[index++] = tint; @@ -6416,8 +6767,8 @@ verticies[index++] = a * w0 + c * h0 + tx; verticies[index++] = d * h0 + b * w0 + ty; // uv - verticies[index++] = uvs[4]; - verticies[index++] = uvs[5]; + verticies[index++] = uvs.x2; + verticies[index++] = uvs.y2; // color verticies[index++] = alpha; verticies[index++] = tint; @@ -6426,18 +6777,24 @@ verticies[index++] = a * w1 + c * h0 + tx; verticies[index++] = d * h0 + b * w1 + ty; // uv - verticies[index++] = uvs[6]; - verticies[index++] = uvs[7]; + verticies[index++] = uvs.x3; + verticies[index++] = uvs.y3; // color verticies[index++] = alpha; verticies[index++] = tint; - + // increment the batchsize this.currentBatchSize++; }; +/** +* +* @method renderTilingSprite +* +* @param sprite {TilingSprite} the sprite to render TODO-Alvin +*/ PIXI.WebGLSpriteBatch.prototype.renderTilingSprite = function(tilingSprite) { var texture = tilingSprite.tilingTexture; @@ -6553,6 +6910,13 @@ this.currentBatchSize++; }; + +/** +* +* +* @method flush TODO-Alvin +* +*/ PIXI.WebGLSpriteBatch.prototype.flush = function() { // If the batch is length 0 then return as there is nothing to draw @@ -6589,12 +6953,21 @@ this.renderSession.drawCount++; }; - +/** +* +* @method stop +* +*/ PIXI.WebGLSpriteBatch.prototype.stop = function() { this.flush(); }; +/** +* +* @method start +* +*/ PIXI.WebGLSpriteBatch.prototype.start = function() { var gl = this.gl; @@ -6623,6 +6996,13 @@ } }; +/** +* +* @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) { this.flush(); @@ -6633,6 +7013,10 @@ this.gl.blendFunc(blendModeWebGL[0], blendModeWebGL[1]); }; +/** +* Destroys the SpriteBatch +* @method destroy +*/ PIXI.WebGLSpriteBatch.prototype.destroy = function() { @@ -6702,7 +7086,7 @@ this.shader = null; - this.tempMatrix = PIXI.mat3.create(); + this.matrix this.setContext(gl); }; @@ -6732,8 +7116,10 @@ { this.renderSession = renderSession; this.shader = this.renderSession.shaderManager.fastShader; - - PIXI.mat3.transpose(spriteBatch.worldTransform, this.tempMatrix); + + // PIXI.mat3.transpose(spriteBatch.worldTransform.toArray(), this.tempMatrix); + + this.matrix = spriteBatch.worldTransform.toArray(true) // console.log(this.tempMatrix) this.start(); @@ -6829,8 +7215,8 @@ verticies[index++] = sprite.rotation; // uv - verticies[index++] = uvs[0]; - verticies[index++] = uvs[1]; + verticies[index++] = uvs.x0; + verticies[index++] = uvs.y1; // color verticies[index++] = sprite.alpha; @@ -6850,8 +7236,8 @@ verticies[index++] = sprite.rotation; // uv - verticies[index++] = uvs[2]; - verticies[index++] = uvs[3]; + verticies[index++] = uvs.x1; + verticies[index++] = uvs.y1; // color verticies[index++] = sprite.alpha; @@ -6871,8 +7257,8 @@ verticies[index++] = sprite.rotation; // uv - verticies[index++] = uvs[4]; - verticies[index++] = uvs[5]; + verticies[index++] = uvs.x2; + verticies[index++] = uvs.y2; // color verticies[index++] = sprite.alpha; @@ -6894,8 +7280,8 @@ verticies[index++] = sprite.rotation; // uv - verticies[index++] = uvs[6]; - verticies[index++] = uvs[7]; + verticies[index++] = uvs.x3; + verticies[index++] = uvs.y3; // color verticies[index++] = sprite.alpha; @@ -6910,6 +7296,7 @@ PIXI.WebGLFastSpriteBatch.prototype.flush = function() { + // If the batch is length 0 then return as there is nothing to draw if (this.currentBatchSize===0)return; @@ -6968,7 +7355,7 @@ gl.uniform2f(this.shader.projectionVector, projection.x, projection.y); // set the matrix - gl.uniformMatrix3fv(this.shader.uMatrix, false, this.tempMatrix); + gl.uniformMatrix3fv(this.shader.uMatrix, false, this.matrix); // set the pointers var stride = this.vertSize * 4; @@ -7003,7 +7390,13 @@ * @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) { this.transparent = transparent; @@ -7017,7 +7410,11 @@ }; // API - +/** +* Initialises the context and the properties +* @method setContext +* @param gl {WebGLContext} the current WebGL drawing context +*/ PIXI.WebGLFilterManager.prototype.setContext = function(gl) { this.gl = gl; @@ -7026,6 +7423,12 @@ this.initShaderBuffers(); }; +/** +* +* @method begin +* @param renderSession {RenderSession} +* @param buffer {ArrayBuffer} +*/ PIXI.WebGLFilterManager.prototype.begin = function(renderSession, buffer) { this.renderSession = renderSession; @@ -7038,6 +7441,11 @@ 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) { var gl = this.gl; @@ -7119,6 +7527,10 @@ }; +/** +* Removes the last filter from the filter stack and doesn't return it +* @method popFilter +*/ PIXI.WebGLFilterManager.prototype.popFilter = function() { var gl = this.gl; @@ -7292,6 +7704,15 @@ 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) { // use program @@ -7344,6 +7765,10 @@ this.renderSession.drawCount++; }; +/** +* Initialises the shader buffers +* @method initShaderBuffers +*/ PIXI.WebGLFilterManager.prototype.initShaderBuffers = function() { var gl = this.gl; @@ -7400,6 +7825,10 @@ gl.STATIC_DRAW); }; +/** +* TODO-Alvin +* @method destroy +*/ PIXI.WebGLFilterManager.prototype.destroy = function() { var gl = this.gl; @@ -7422,9 +7851,24 @@ gl.deleteBuffer(this.colorBuffer); gl.deleteBuffer(this.indexBuffer); }; +/** + * @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 @@ -7444,6 +7888,11 @@ this.resize(width, height); }; + +/** +* Clears the filter texture +* @method clear +*/ PIXI.FilterTexture.prototype.clear = function() { var gl = this.gl; @@ -7452,6 +7901,13 @@ 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; @@ -7466,6 +7922,10 @@ }; +/** +* Destroys the filter texture +* @method destroy +*/ PIXI.FilterTexture.prototype.destroy = function() { var gl = this.gl; @@ -7476,7 +7936,6 @@ this.texture = null; }; - /** * @author Mat Groves * @@ -7509,7 +7968,7 @@ var cacheAlpha = maskData.alpha; var transform = maskData.worldTransform; - context.setTransform(transform[0], transform[3], transform[1], transform[4], transform[2], transform[5]); + context.setTransform(transform.a, transform.c, transform.b, transform.d, transform.tx, transform.ty); PIXI.CanvasGraphics.renderGraphicsMask(maskData, context); @@ -7876,7 +8335,7 @@ 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 * @type HTMLCanvasElement 2d Context */ @@ -7949,6 +8408,7 @@ { if(!this.transparent) { + this.context.globalAlpha = 1; this.context.fillStyle = stage.backgroundColorString; this.context.fillRect(0, 0, this.width, this.height); } @@ -8814,7 +9274,7 @@ context.globalCompositeOperation = PIXI.blendModesCanvas[renderSession.currentBlendMode]; } - context.setTransform(transform[0], transform[3], transform[1], transform[4], transform[2], transform[5]); + context.setTransform(transform.a, transform.c, transform.b, transform.d, transform.tx, transform.ty); PIXI.CanvasGraphics.renderGraphics(this, context); // simple render children! @@ -8842,12 +9302,12 @@ var worldTransform = this.worldTransform; - var a = worldTransform[0]; - var b = worldTransform[3]; - var c = worldTransform[1]; - var d = worldTransform[4]; - var tx = worldTransform[2]; - var ty = worldTransform[5]; + var a = worldTransform.a; + var b = worldTransform.c; + var c = worldTransform.b; + var d = worldTransform.d; + var tx = worldTransform.tx; + var ty = worldTransform.ty; var x1 = a * w1 + c * h1 + tx; var y1 = d * h1 + b * w1 + ty; @@ -9525,7 +9985,7 @@ // allow for trimming - context.setTransform(transform[0], transform[3], transform[1], transform[4], transform[2], transform[5]); + context.setTransform(transform.a, transform.c, transform.b, transform.d, transform.tx, transform.ty); if(!this.__tilePattern) @@ -9583,13 +10043,13 @@ var worldTransform = this.worldTransform; - var a = worldTransform[0]; - var b = worldTransform[3]; - var c = worldTransform[1]; - var d = worldTransform[4]; - var tx = worldTransform[2]; - var ty = worldTransform[5]; - + var a = worldTransform.a; + var b = worldTransform.c; + var c = worldTransform.b; + var d = worldTransform.d; + var tx = worldTransform.tx; + var ty = worldTransform.ty; + var x1 = a * w1 + c * h1 + tx; var y1 = d * h1 + b * w1 + ty; @@ -11189,6 +11649,7 @@ * @uses EventTarget * @constructor * @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) { @@ -11501,23 +11962,23 @@ PIXI.Texture.prototype._updateWebGLuvs = function() { - if(!this._uvs)this._uvs = new Float32Array(8); + if(!this._uvs)this._uvs = new PIXI.TextureUvs(); var frame = this.frame; var tw = this.baseTexture.width; var th = this.baseTexture.height; - this._uvs[0] = frame.x / tw; - this._uvs[1] = frame.y / th; + this._uvs.x0 = frame.x / tw; + this._uvs.y0 = frame.y / th; - this._uvs[2] = (frame.x + frame.width) / tw; - this._uvs[3] = frame.y / th; + this._uvs.x1 = (frame.x + frame.width) / tw; + this._uvs.y1 = frame.y / th; - this._uvs[4] = (frame.x + frame.width) / tw; - this._uvs[5] = (frame.y + frame.height) / th; + this._uvs.x2 = (frame.x + frame.width) / tw; + this._uvs.y2 = (frame.y + frame.height) / th; - this._uvs[6] = frame.x / tw; - this._uvs[7] = (frame.y + frame.height) / th; + this._uvs.x3 = frame.x / tw; + this._uvs.y3 = (frame.y + frame.height) / th; }; /** @@ -11608,6 +12069,28 @@ // this is more for webGL.. it contains updated frames.. PIXI.Texture.frameUpdates = []; +PIXI.TextureUvs = function() +{ + this.x0 = 0; + this.y0 = 0; + + this.x1 = 0; + this.y1 = 0; + + this.x2 = 0; + this.y2 = 0; + + this.x3 = 0; + this.y4 = 0; + + +} + + + + + + /** * @author Mat Groves http://matgroves.com/ @Doormat23 */ @@ -12606,7 +13089,7 @@ */ PIXI.BitmapFontLoader.prototype.load = function() { - this.ajaxRequest = new XMLHttpRequest(); + this.ajaxRequest = new PIXI.ajaxRequest(); var scope = this; this.ajaxRequest.onreadystatechange = function() { @@ -12619,7 +13102,7 @@ }; /** - * Invoked when XML file is loaded, parses the data + * Invoked when the XML file is loaded, parses the data * * @method onXMLLoaded * @private diff --git a/bin/pixi.dev.js b/bin/pixi.dev.js index 8558d80..45e6eba 100644 --- a/bin/pixi.dev.js +++ b/bin/pixi.dev.js @@ -1,10 +1,10 @@ /** * @license * pixi.js - v1.4.3 - * Copyright (c) 2012, Mat Groves + * Copyright (c) 2012-2014, Mat Groves * http://goodboydigital.com/ * - * Compiled: 2014-01-28 + * Compiled: 2014-01-30 * * pixi.js is licensed under the MIT License. * http://www.opensource.org/licenses/mit-license.php @@ -461,7 +461,7 @@ return (typeof Float32Array !== 'undefined') ? Float32Array : Array; }; -PIXI.Matrix = PIXI.determineMatrixArrayType(); +PIXI.Matrix2 = PIXI.determineMatrixArrayType(); /** @@ -482,7 +482,7 @@ */ PIXI.mat3.create = function() { - var matrix = new PIXI.Matrix(9); + var matrix = new PIXI.Matrix2(9); matrix[0] = 1; matrix[1] = 0; @@ -567,7 +567,7 @@ */ PIXI.mat3.clone = function(mat) { - var matrix = new PIXI.Matrix(9); + var matrix = new PIXI.Matrix2(9); matrix[0] = mat[0]; matrix[1] = mat[1]; @@ -666,7 +666,7 @@ */ PIXI.mat4.create = function() { - var matrix = new PIXI.Matrix(16); + var matrix = new PIXI.Matrix2(16); matrix[0] = 1; matrix[1] = 0; @@ -799,6 +799,64 @@ PIXI.identityMatrix = PIXI.mat3.create(); PIXI.tempMatrix = PIXI.mat3.create(); + +PIXI.Matrix = function() +{ + this.a = 1; + this.b = 0; + this.c = 0; + this.d = 1; + this.tx = 0; + this.ty = 0; + + +} + +PIXI.Matrix.prototype.fromArray = function(array) +{ + + this.a = array[0]; + this.b = array[1]; + this.c = array[3]; + this.d = array[4]; + this.tx = array[2]; + this.ty = array[5]; + +} + +PIXI.Matrix.prototype.toArray = function(transpose) +{ + if(!this.array)this.array = new Float32Array(9); + var array = this.array; + + if(transpose) + { + this.array[0] = this.a; + this.array[1] = this.c; + this.array[2] = 0; + this.array[3] = this.b; + this.array[4] = this.d; + this.array[5] = 0; + this.array[6] = this.tx; + this.array[7] = this.ty; + this.array[8] = 1; + } + else + { + this.array[0] = this.a; + this.array[1] = this.b; + this.array[2] = this.tx; + this.array[3] = this.c; + this.array[4] = this.d; + this.array[5] = this.ty; + this.array[6] = 0; + this.array[7] = 0; + this.array[8] = 1; + } + + return array;//[this.a, this.b, this.tx, this.c, this.d, this.ty, 0, 0, 1]; +} + /** * @author Mat Groves http://matgroves.com/ @Doormat23 */ @@ -940,7 +998,7 @@ * @readOnly * @private */ - this.worldTransform = PIXI.mat3.create(); //mat3.identity(); + this.worldTransform = new PIXI.Matrix()//PIXI.mat3.create(); //mat3.identity(); /** * [read-only] Current transform of the object locally @@ -950,7 +1008,7 @@ * @readOnly * @private */ - this.localTransform = PIXI.mat3.create(); //mat3.identity(); + this.localTransform = new PIXI.Matrix()//PIXI.mat3.create(); //mat3.identity(); /** * [NYI] Unknown @@ -1208,40 +1266,30 @@ this._cr = Math.cos(this.rotation); } - var localTransform = this.localTransform; - var parentTransform = this.parent.worldTransform; - var worldTransform = this.worldTransform; + // var localTransform = this.localTransform//.toArray(); + var parentTransform = this.parent.worldTransform//.toArray(); + var worldTransform = this.worldTransform//.toArray(); //console.log(localTransform) - localTransform[0] = this._cr * this.scale.x; - localTransform[1] = -this._sr * this.scale.y; - localTransform[3] = this._sr * this.scale.x; - localTransform[4] = this._cr * this.scale.y; - - // TODO --> do we even need a local matrix??? - var px = this.pivot.x; var py = this.pivot.y; - // Cache the matrix values (makes for huge speed increases!) - var a00 = localTransform[0], a01 = localTransform[1], a02 = this.position.x - localTransform[0] * px - py * localTransform[1], - a10 = localTransform[3], a11 = localTransform[4], a12 = this.position.y - localTransform[4] * py - px * localTransform[3], + var a00 = this._cr * this.scale.x, + a01 = -this._sr * this.scale.y, + a10 = this._sr * this.scale.x, + a11 = this._cr * this.scale.y, + a02 = this.position.x + a00 * px - py * a01, + a12 = this.position.y + a11 * py - px * a10, + b00 = parentTransform.a, b01 = parentTransform.b, b02 = parentTransform.tx, + b10 = parentTransform.c, b11 = parentTransform.d, b12 = parentTransform.ty; - b00 = parentTransform[0], b01 = parentTransform[1], b02 = parentTransform[2], - b10 = parentTransform[3], b11 = parentTransform[4], b12 = parentTransform[5]; + worldTransform.a = b00 * a00 + b01 * a10; + worldTransform.b = b00 * a01 + b01 * a11; + worldTransform.tx = b00 * a02 + b01 * a12 + b02; - localTransform[2] = a02; - localTransform[5] = a12; + worldTransform.c = b10 * a00 + b11 * a10; + worldTransform.d = b10 * a01 + b11 * a11; + worldTransform.ty = b10 * a02 + b11 * a12 + b12; - worldTransform[0] = b00 * a00 + b01 * a10; - worldTransform[1] = b00 * a01 + b01 * a11; - worldTransform[2] = b00 * a02 + b01 * a12 + b02; - - worldTransform[3] = b10 * a00 + b11 * a10; - worldTransform[4] = b10 * a01 + b11 * a11; - worldTransform[5] = b10 * a02 + b11 * a12 + b12; - - // because we are using affine transformation, we can optimise the matrix concatenation process.. wooo! - // mat3.multiply(this.localTransform, this.parent.worldTransform, this.worldTransform); this.worldAlpha = this.alpha * this.parent.worldAlpha; }; @@ -1316,6 +1364,36 @@ // this line is just here to pass jshinting :) renderSession = renderSession; }; + +/** + * The position of the displayObject on the x axis relative to the local coordinates of the parent. + * + * @property x + * @type Number + */ +Object.defineProperty(PIXI.DisplayObject.prototype, 'x', { + get: function() { + return this.position.x; + }, + set: function(value) { + this.position.x = value; + } +}); + +/** + * The position of the displayObject on the y axis relative to the local coordinates of the parent. + * + * @property y + * @type Number + */ +Object.defineProperty(PIXI.DisplayObject.prototype, 'y', { + get: function() { + return this.position.y; + }, + set: function(value) { + this.position.y = value; + } +}); /** * @author Mat Groves http://matgroves.com/ @Doormat23 */ @@ -1534,12 +1612,16 @@ var childMaxX; var childMaxY; + var childVisible = false; + for(var i=0,j=this.children.length; i childMaxY ? maxY : childMaxY; } + if(!childVisible) + return PIXI.EmptyRectangle; + var bounds = this._bounds; bounds.x = minX; @@ -1868,12 +1953,12 @@ var worldTransform = this.worldTransform; - var a = worldTransform[0]; - var b = worldTransform[3]; - var c = worldTransform[1]; - var d = worldTransform[4]; - var tx = worldTransform[2]; - var ty = worldTransform[5]; + var a = worldTransform.a; + var b = worldTransform.c; + var c = worldTransform.b; + var d = worldTransform.d; + var tx = worldTransform.tx; + var ty = worldTransform.ty; var x1 = a * w1 + c * h1 + tx; var y1 = d * h1 + b * w1 + ty; @@ -2029,7 +2114,7 @@ // allow for trimming - context.setTransform(transform[0], transform[3], transform[1], transform[4], transform[2], transform[5]); + context.setTransform(transform.a, transform.c, transform.b, transform.d, transform.tx, transform.ty); //if smoothingEnabled is supported and we need to change the smoothing property for this texture if(renderSession.smoothProperty && renderSession.scaleMode !== this.texture.baseTexture.scaleMode) { @@ -2169,6 +2254,13 @@ PIXI.SpriteBatch.prototype = Object.create( PIXI.DisplayObjectContainer.prototype ); PIXI.SpriteBatch.constructor = PIXI.SpriteBatch; + +/* + * Initialises the spriteBatch + * + * @method initWebGL + * @param gl {WebGLContext} the current WebGL drawing context + */ PIXI.SpriteBatch.prototype.initWebGL = function(gl) { @@ -2234,7 +2326,7 @@ // alow for trimming - context.setTransform(transform[0], transform[3], transform[1], transform[4], transform[2], transform[5]); + context.setTransform(transform.a, transform.c, transform.b, transform.d, transform.tx, transform.ty); context.save(); for (var i = 0; i < this.children.length; i++) { @@ -2264,7 +2356,7 @@ PIXI.DisplayObject.prototype.updateTransform.call(child); transform = child.localTransform; - context.setTransform(transform[0], transform[3], transform[1], transform[4], transform[2], transform[5]); + context.setTransform(transform.a, transform.c, transform.b, transform.d, transform.tx, transform.ty); context.drawImage(texture.baseTexture.source, frame.x, @@ -2484,8 +2576,21 @@ */ PIXI.Text = function(text, style) { + /** + * The canvas element that everything is drawn to + * + * @property canvas + * @type HTMLCanvasElement + */ 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'); + PIXI.Sprite.call(this, PIXI.Texture.fromCanvas(this.canvas)); this.setText(text); @@ -2631,6 +2736,13 @@ this.requiresUpdate = true; }; +/** +* Renders the object using the WebGL renderer +* +* @method _renderWebGL +* @param renderSession {RenderSession} +* @private +*/ PIXI.Text.prototype._renderWebGL = function(renderSession) { if(this.requiresUpdate) @@ -2662,6 +2774,7 @@ /* * http://stackoverflow.com/users/34441/ellisbben * great solution to the problem! + * returns the height of the given font * * @method determineFontHeight * @param fontStyle {Object} @@ -2798,11 +2911,11 @@ /** * 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 - * @param style {Object} The style parameters - * @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 + * @param style {Object} The style parameters, contained as properties of an object */ PIXI.BitmapText.prototype.setStyle = function(style) { @@ -3435,8 +3548,8 @@ var isSprite = (item instanceof PIXI.Sprite), worldTransform = item.worldTransform, - a00 = worldTransform[0], a01 = worldTransform[1], a02 = worldTransform[2], - a10 = worldTransform[3], a11 = worldTransform[4], a12 = worldTransform[5], + a00 = worldTransform.a, a01 = worldTransform.b, a02 = worldTransform.tx, + a10 = worldTransform.c, a11 = worldTransform.d, a12 = worldTransform.ty, id = 1 / (a00 * a11 + a01 * -a10), x = a11 * id * global.x + -a01 * id * global.y + (a12 * a01 - a02 * a11) * id, y = a00 * id * global.y + -a10 * id * global.x + (-a12 * a00 + a02 * a10) * id; @@ -3674,7 +3787,7 @@ * @param backgroundColor {Number} the background color of the stage, you have to pass this in is in hex format * 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); * 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 @@ -3693,7 +3806,7 @@ * @readOnly * @private */ - this.worldTransform = PIXI.mat3.create(); + this.worldTransform = new PIXI.Matrix()//PIXI.mat3.create(); /** * Whether or not the stage is interactive @@ -3901,7 +4014,7 @@ * @class AjaxRequest * @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 @@ -4008,7 +4121,7 @@ * Adds event emitter functionality to a class * * @class EventTarget - * @example + * * function MyEmitter() { * PIXI.EventTarget.call(this); //mixes in event target stuff * } @@ -4018,8 +4131,21 @@ */ PIXI.EventTarget = function () { + /** + * Holds all the listeners + * + * @property listeneners + * @type Object + */ 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 ) { @@ -4036,6 +4162,12 @@ }; + /** + * Fires the event, ie pretends that the event has happened + * + * @method dispatchEvent + * @param event {Event} the event object + */ this.dispatchEvent = this.emit = function ( event ) { if ( !listeners[ event.type ] || !listeners[ event.type ].length ) { @@ -4052,6 +4184,13 @@ }; + /** + * 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 ) { var index = listeners[ type ].indexOf( listener ); @@ -4064,6 +4203,12 @@ }; + /** + * 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 ) { var a = listeners[type]; if (a) @@ -4079,7 +4224,8 @@ * 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 * the browser then this function will return a canvas renderer - * + * @class autoDetectRenderer + * @static * @param width=800 {Number} the width 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 @@ -4149,17 +4295,23 @@ 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 = {}; /** * Triangulates shapes for webGL graphic fills * * @method Triangulate - * @namespace PolyK - * @constructor + * */ PIXI.PolyK.Triangulate = function(p) { @@ -4235,10 +4387,17 @@ }; /** - * Checks if a point is within a triangle + * Checks whether a point is within a triangle * - * @class _PointInTriangle - * @namespace PolyK + * @method _PointInTriangle + * @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 */ PIXI.PolyK._PointInTriangle = function(px, py, ax, ay, bx, by, cx, cy) @@ -4265,10 +4424,10 @@ }; /** - * Checks if a shape is convex + * Checks whether a shape is convex * - * @class _convex - * @namespace PolyK + * @method _convex + * * @private */ PIXI.PolyK._convex = function(ax, ay, bx, by, cx, cy, sign) @@ -4343,6 +4502,10 @@ */ PIXI.PixiShader = function(gl) { + /** + * @property gl + * @type WebGLContext + */ this.gl = gl; /** @@ -4375,7 +4538,9 @@ }; /** -* @method PIXI.PixiShader#init +* Initialises the shader +* @method init +* */ PIXI.PixiShader.prototype.init = function() { @@ -4430,7 +4595,7 @@ * 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 * -* @method PIXI.PixiShader#initUniforms +* @method initUniforms */ PIXI.PixiShader.prototype.initUniforms = function() { @@ -4501,7 +4666,7 @@ /** * 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) { @@ -4542,7 +4707,7 @@ wrapT = gl.REPEAT; } - gl.pixelStorei(gl.UNPACK_FLIP_Y_WEBGL, false); + gl.pixelStorei(gl.UNPACK_FLIP_Y_WEBGL, !!data.flipY); if (data.width) { @@ -4576,7 +4741,7 @@ /** * Updates the shader uniform values. * -* @method PIXI.PixiShader#syncUniforms +* @method syncUniforms */ PIXI.PixiShader.prototype.syncUniforms = function() { @@ -4631,6 +4796,11 @@ }; +/** +* Destroys the shader +* @method destroy +* +*/ PIXI.PixiShader.prototype.destroy = function() { this.gl.deleteProgram( this.program ); @@ -4640,6 +4810,11 @@ this.attributes = null; }; +/** +* +* @property defaultVertexSrc +* @type String +*/ PIXI.PixiShader.defaultVertexSrc = [ 'attribute vec2 aVertexPosition;', 'attribute vec2 aTextureCoord;', @@ -4673,19 +4848,25 @@ /** * @class PIXI.PixiFastShader * @constructor +* @param gl {WebGLContext} the current WebGL drawing context */ PIXI.PixiFastShader = function(gl) { + + /** + * @property gl + * @type WebGLContext + */ this.gl = gl; /** - * @property {any} program - The WebGL program. - */ + * @property {any} program - The WebGL program. + */ this.program = null; /** - * @property {array} fragmentSrc - The fragment shader. - */ + * @property {array} fragmentSrc - The fragment shader. + */ this.fragmentSrc = [ 'precision lowp float;', 'varying vec2 vTextureCoord;', @@ -4696,6 +4877,9 @@ '}' ]; + /** + * @property {array} vertexSrc - The vertex shader + */ this.vertexSrc = [ 'attribute vec2 aVertexPosition;', 'attribute vec2 aPositionCoord;', @@ -4737,7 +4921,9 @@ }; /** -* @method PIXI.PixiFastShader#init +* Initialises the shader +* @method init +* */ PIXI.PixiFastShader.prototype.init = function() { @@ -4787,6 +4973,11 @@ this.program = program; }; +/** +* Destroys the shader +* @method destroy +* +*/ PIXI.PixiFastShader.prototype.destroy = function() { this.gl.deleteProgram( this.program ); @@ -4803,9 +4994,14 @@ PIXI.StripShader = function() { - // the webGL program.. + /** + * @property {any} program - The WebGL program. + */ this.program = null; + /** + * @property {array} fragmentSrc - The fragment shader. + */ this.fragmentSrc = [ 'precision mediump float;', 'varying vec2 vTextureCoord;', @@ -4819,6 +5015,9 @@ '}' ]; + /** + * @property {array} fragmentSrc - The fragment shader. + */ this.vertexSrc = [ 'attribute vec2 aVertexPosition;', 'attribute vec2 aTextureCoord;', @@ -4839,6 +5038,11 @@ ]; }; +/** +* Initialises the shader +* @method init +* +*/ PIXI.StripShader.prototype.init = function() { @@ -4868,14 +5072,28 @@ * @author Mat Groves http://matgroves.com/ @Doormat23 */ - +/** +* @class PrimitiveShader +* @constructor +* @param gl {WebGLContext} the current WebGL drawing context +*/ PIXI.PrimitiveShader = function(gl) { + /** + * @property gl + * @type WebGLContext + */ this.gl = gl; - // the webGL program.. + /** + * @property {any} program - The WebGL program. + */ this.program = null; + /** + * @property fragmentSrc + * @type Array + */ this.fragmentSrc = [ 'precision mediump float;', 'varying vec4 vColor;', @@ -4885,6 +5103,10 @@ '}' ]; + /** + * @property vertexSrc + * @type Array + */ this.vertexSrc = [ 'attribute vec2 aVertexPosition;', 'attribute vec4 aColor;', @@ -4906,6 +5128,11 @@ this.init(); }; +/** +* Initialises the shader +* @method init +* +*/ PIXI.PrimitiveShader.prototype.init = function() { @@ -4932,6 +5159,11 @@ this.program = program; }; +/** +* Destroys the shader +* @method destroy +* +*/ PIXI.PrimitiveShader.prototype.destroy = function() { this.gl.deleteProgram( this.program ); @@ -4948,7 +5180,9 @@ /** * A set of functions used by the webGL renderer to draw the primitive graphics data * - * @class CanvasGraphics + * @class WebGLGraphics + * @private + * @static */ PIXI.WebGLGraphics = function() { @@ -4962,7 +5196,7 @@ * @private * @method renderGraphics * @param graphics {Graphics} - * @param projection {Object} + * @param renderSession {Object} */ PIXI.WebGLGraphics.renderGraphics = function(graphics, renderSession)//projection, offset) { @@ -4999,12 +5233,10 @@ // This could be speeded up for sure! // var m = PIXI.mat3.clone(graphics.worldTransform); - PIXI.mat3.transpose(graphics.worldTransform, PIXI.tempMatrix); - // set the matrix transform gl.blendFunc(gl.ONE, gl.ONE_MINUS_SRC_ALPHA); - gl.uniformMatrix3fv(shader.translationMatrix, false, PIXI.tempMatrix); + gl.uniformMatrix3fv(shader.translationMatrix, false, graphics.worldTransform.toArray(true)); gl.uniform2f(shader.projectionVector, projection.x, -projection.y); gl.uniform2f(shader.offsetVector, -offset.x, -offset.y); @@ -5034,7 +5266,8 @@ * @static * @private * @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) { @@ -5088,7 +5321,7 @@ * @static * @private * @method buildRectangle - * @param graphics {Graphics} + * @param graphicsData {Graphics} The graphics object to draw TODO-Alvin * @param webGLData {Object} */ PIXI.WebGLGraphics.buildRectangle = function(graphicsData, webGLData) @@ -5157,7 +5390,7 @@ * @static * @private * @method buildCircle - * @param graphics {Graphics} + * @param graphicsData {Graphics} The graphics object to draw * @param webGLData {Object} */ PIXI.WebGLGraphics.buildCircle = function(graphicsData, webGLData) @@ -5230,7 +5463,7 @@ * @static * @private * @method buildLine - * @param graphics {Graphics} + * @param graphicsData {Graphics} The graphics object to draw TODO-Alvin * @param webGLData {Object} */ PIXI.WebGLGraphics.buildLine = function(graphicsData, webGLData) @@ -5440,7 +5673,7 @@ * @static * @private * @method buildPoly - * @param graphics {Graphics} + * @param graphicsData {Graphics} The graphics object to draw TODO-Alvin * @param webGLData {Object} */ PIXI.WebGLGraphics.buildPoly = function(graphicsData, webGLData) @@ -6050,6 +6283,13 @@ * @author Mat Groves http://matgroves.com/ @Doormat23 */ + +/** +* @class WebGLMaskManager +* @constructor +* @param gl {WebGLContext} the current WebGL drawing context +* @private +*/ PIXI.WebGLMaskManager = function(gl) { this.maskStack = []; @@ -6058,11 +6298,22 @@ 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) { 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) { var gl = this.gl; @@ -6087,6 +6338,12 @@ 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) { var gl = this.gl; @@ -6110,6 +6367,10 @@ if(this.maskStack.length === 0)gl.disable(gl.STENCIL_TEST); }; +/** +* TODO-Alvin +* @method destroy +*/ PIXI.WebGLMaskManager.prototype.destroy = function() { this.maskStack = null; @@ -6119,6 +6380,12 @@ * @author Mat Groves http://matgroves.com/ @Doormat23 */ +/** +* @class WebGLShaderManager +* @constructor +* @param gl {WebGLContext} the current WebGL drawing context +* @private +*/ PIXI.WebGLShaderManager = function(gl) { @@ -6135,6 +6402,13 @@ //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) { this.gl = gl; @@ -6153,6 +6427,11 @@ }; +/** +* Initialises the context and the properties +* @method setAttribs +* @param attribs {Array} TODO-Alvin +*/ PIXI.WebGLShaderManager.prototype.setAttribs = function(attribs) { // reset temp state @@ -6194,6 +6473,11 @@ // 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) { //if(this.currentShader == shader)return; @@ -6207,6 +6491,10 @@ }; +/** +* Triggers the primitive shader +* @method activatePrimitiveShader +*/ PIXI.WebGLShaderManager.prototype.activatePrimitiveShader = function() { var gl = this.gl; @@ -6217,6 +6505,10 @@ }; +/** +* Disable the primitive shader +* @method deactivatePrimitiveShader +*/ PIXI.WebGLShaderManager.prototype.deactivatePrimitiveShader = function() { var gl = this.gl; @@ -6226,6 +6518,10 @@ this.setAttribs(this.defaultShader.attributes); }; +/** +* Destroys +* @method destroy +*/ PIXI.WebGLShaderManager.prototype.destroy = function() { this.attribState = null; @@ -6252,11 +6548,30 @@ * 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) { - + /** + * TODO-Alvin + * + * @property vertSize + * @type Number + */ this.vertSize = 6; + + /** + * TODO-Alvin + * @property size + * @type Number + */ this.size = 10000;//Math.pow(2, 16) / this.vertSize; // console.log(this.size); @@ -6265,9 +6580,23 @@ //the total number of indices in our batch var numIndices = this.size * 6; - //vertex data + //vertex data + + /** + * Holds the vertices + * + * @property vertices + * @type Float32Array + */ this.vertices = new Float32Array(numVerts); + //index data + /** + * Holds the indices + * + * @property indices + * @type Uint16Array + */ this.indices = new Uint16Array(numIndices); this.lastIndexCount = 0; @@ -6290,6 +6619,12 @@ this.setContext(gl); }; +/** +* +* @method setContext +* +* @param gl {WebGLContext} the current WebGL drawing context +*/ PIXI.WebGLSpriteBatch.prototype.setContext = function(gl) { this.gl = gl; @@ -6311,6 +6646,12 @@ this.currentBlendMode = 99999; }; +/** +* +* @method begin +* +* @param renderSession {RenderSession} the RenderSession +*/ PIXI.WebGLSpriteBatch.prototype.begin = function(renderSession) { this.renderSession = renderSession; @@ -6319,12 +6660,22 @@ this.start(); }; +/** +* +* @method end +* +*/ PIXI.WebGLSpriteBatch.prototype.end = function() { this.flush(); }; - +/** +* +* @method render +* +* @param sprite {Sprite} the sprite to render TODO-Alvin +*/ PIXI.WebGLSpriteBatch.prototype.render = function(sprite) { // check texture.. @@ -6383,21 +6734,21 @@ var index = this.currentBatchSize * 4 * this.vertSize; - var worldTransform = sprite.worldTransform; + var worldTransform = sprite.worldTransform;//.toArray(); - var a = worldTransform[0]; - var b = worldTransform[3]; - var c = worldTransform[1]; - var d = worldTransform[4]; - var tx = worldTransform[2]; - var ty = worldTransform[5]; + var a = worldTransform.a//[0]; + var b = worldTransform.c//[3]; + var c = worldTransform.b//[1]; + var d = worldTransform.d//[4]; + var tx = worldTransform.tx//[2]; + var ty = worldTransform.ty///[5]; // xy verticies[index++] = a * w1 + c * h1 + tx; verticies[index++] = d * h1 + b * w1 + ty; // uv - verticies[index++] = uvs[0]; - verticies[index++] = uvs[1]; + verticies[index++] = uvs.x0; + verticies[index++] = uvs.y0; // color verticies[index++] = alpha; verticies[index++] = tint; @@ -6406,8 +6757,8 @@ verticies[index++] = a * w0 + c * h1 + tx; verticies[index++] = d * h1 + b * w0 + ty; // uv - verticies[index++] = uvs[2]; - verticies[index++] = uvs[3]; + verticies[index++] = uvs.x1; + verticies[index++] = uvs.y1; // color verticies[index++] = alpha; verticies[index++] = tint; @@ -6416,8 +6767,8 @@ verticies[index++] = a * w0 + c * h0 + tx; verticies[index++] = d * h0 + b * w0 + ty; // uv - verticies[index++] = uvs[4]; - verticies[index++] = uvs[5]; + verticies[index++] = uvs.x2; + verticies[index++] = uvs.y2; // color verticies[index++] = alpha; verticies[index++] = tint; @@ -6426,18 +6777,24 @@ verticies[index++] = a * w1 + c * h0 + tx; verticies[index++] = d * h0 + b * w1 + ty; // uv - verticies[index++] = uvs[6]; - verticies[index++] = uvs[7]; + verticies[index++] = uvs.x3; + verticies[index++] = uvs.y3; // color verticies[index++] = alpha; verticies[index++] = tint; - + // increment the batchsize this.currentBatchSize++; }; +/** +* +* @method renderTilingSprite +* +* @param sprite {TilingSprite} the sprite to render TODO-Alvin +*/ PIXI.WebGLSpriteBatch.prototype.renderTilingSprite = function(tilingSprite) { var texture = tilingSprite.tilingTexture; @@ -6553,6 +6910,13 @@ this.currentBatchSize++; }; + +/** +* +* +* @method flush TODO-Alvin +* +*/ PIXI.WebGLSpriteBatch.prototype.flush = function() { // If the batch is length 0 then return as there is nothing to draw @@ -6589,12 +6953,21 @@ this.renderSession.drawCount++; }; - +/** +* +* @method stop +* +*/ PIXI.WebGLSpriteBatch.prototype.stop = function() { this.flush(); }; +/** +* +* @method start +* +*/ PIXI.WebGLSpriteBatch.prototype.start = function() { var gl = this.gl; @@ -6623,6 +6996,13 @@ } }; +/** +* +* @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) { this.flush(); @@ -6633,6 +7013,10 @@ this.gl.blendFunc(blendModeWebGL[0], blendModeWebGL[1]); }; +/** +* Destroys the SpriteBatch +* @method destroy +*/ PIXI.WebGLSpriteBatch.prototype.destroy = function() { @@ -6702,7 +7086,7 @@ this.shader = null; - this.tempMatrix = PIXI.mat3.create(); + this.matrix this.setContext(gl); }; @@ -6732,8 +7116,10 @@ { this.renderSession = renderSession; this.shader = this.renderSession.shaderManager.fastShader; - - PIXI.mat3.transpose(spriteBatch.worldTransform, this.tempMatrix); + + // PIXI.mat3.transpose(spriteBatch.worldTransform.toArray(), this.tempMatrix); + + this.matrix = spriteBatch.worldTransform.toArray(true) // console.log(this.tempMatrix) this.start(); @@ -6829,8 +7215,8 @@ verticies[index++] = sprite.rotation; // uv - verticies[index++] = uvs[0]; - verticies[index++] = uvs[1]; + verticies[index++] = uvs.x0; + verticies[index++] = uvs.y1; // color verticies[index++] = sprite.alpha; @@ -6850,8 +7236,8 @@ verticies[index++] = sprite.rotation; // uv - verticies[index++] = uvs[2]; - verticies[index++] = uvs[3]; + verticies[index++] = uvs.x1; + verticies[index++] = uvs.y1; // color verticies[index++] = sprite.alpha; @@ -6871,8 +7257,8 @@ verticies[index++] = sprite.rotation; // uv - verticies[index++] = uvs[4]; - verticies[index++] = uvs[5]; + verticies[index++] = uvs.x2; + verticies[index++] = uvs.y2; // color verticies[index++] = sprite.alpha; @@ -6894,8 +7280,8 @@ verticies[index++] = sprite.rotation; // uv - verticies[index++] = uvs[6]; - verticies[index++] = uvs[7]; + verticies[index++] = uvs.x3; + verticies[index++] = uvs.y3; // color verticies[index++] = sprite.alpha; @@ -6910,6 +7296,7 @@ PIXI.WebGLFastSpriteBatch.prototype.flush = function() { + // If the batch is length 0 then return as there is nothing to draw if (this.currentBatchSize===0)return; @@ -6968,7 +7355,7 @@ gl.uniform2f(this.shader.projectionVector, projection.x, projection.y); // set the matrix - gl.uniformMatrix3fv(this.shader.uMatrix, false, this.tempMatrix); + gl.uniformMatrix3fv(this.shader.uMatrix, false, this.matrix); // set the pointers var stride = this.vertSize * 4; @@ -7003,7 +7390,13 @@ * @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) { this.transparent = transparent; @@ -7017,7 +7410,11 @@ }; // API - +/** +* Initialises the context and the properties +* @method setContext +* @param gl {WebGLContext} the current WebGL drawing context +*/ PIXI.WebGLFilterManager.prototype.setContext = function(gl) { this.gl = gl; @@ -7026,6 +7423,12 @@ this.initShaderBuffers(); }; +/** +* +* @method begin +* @param renderSession {RenderSession} +* @param buffer {ArrayBuffer} +*/ PIXI.WebGLFilterManager.prototype.begin = function(renderSession, buffer) { this.renderSession = renderSession; @@ -7038,6 +7441,11 @@ 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) { var gl = this.gl; @@ -7119,6 +7527,10 @@ }; +/** +* Removes the last filter from the filter stack and doesn't return it +* @method popFilter +*/ PIXI.WebGLFilterManager.prototype.popFilter = function() { var gl = this.gl; @@ -7292,6 +7704,15 @@ 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) { // use program @@ -7344,6 +7765,10 @@ this.renderSession.drawCount++; }; +/** +* Initialises the shader buffers +* @method initShaderBuffers +*/ PIXI.WebGLFilterManager.prototype.initShaderBuffers = function() { var gl = this.gl; @@ -7400,6 +7825,10 @@ gl.STATIC_DRAW); }; +/** +* TODO-Alvin +* @method destroy +*/ PIXI.WebGLFilterManager.prototype.destroy = function() { var gl = this.gl; @@ -7422,9 +7851,24 @@ gl.deleteBuffer(this.colorBuffer); gl.deleteBuffer(this.indexBuffer); }; +/** + * @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 @@ -7444,6 +7888,11 @@ this.resize(width, height); }; + +/** +* Clears the filter texture +* @method clear +*/ PIXI.FilterTexture.prototype.clear = function() { var gl = this.gl; @@ -7452,6 +7901,13 @@ 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; @@ -7466,6 +7922,10 @@ }; +/** +* Destroys the filter texture +* @method destroy +*/ PIXI.FilterTexture.prototype.destroy = function() { var gl = this.gl; @@ -7476,7 +7936,6 @@ this.texture = null; }; - /** * @author Mat Groves * @@ -7509,7 +7968,7 @@ var cacheAlpha = maskData.alpha; var transform = maskData.worldTransform; - context.setTransform(transform[0], transform[3], transform[1], transform[4], transform[2], transform[5]); + context.setTransform(transform.a, transform.c, transform.b, transform.d, transform.tx, transform.ty); PIXI.CanvasGraphics.renderGraphicsMask(maskData, context); @@ -7876,7 +8335,7 @@ 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 * @type HTMLCanvasElement 2d Context */ @@ -7949,6 +8408,7 @@ { if(!this.transparent) { + this.context.globalAlpha = 1; this.context.fillStyle = stage.backgroundColorString; this.context.fillRect(0, 0, this.width, this.height); } @@ -8814,7 +9274,7 @@ context.globalCompositeOperation = PIXI.blendModesCanvas[renderSession.currentBlendMode]; } - context.setTransform(transform[0], transform[3], transform[1], transform[4], transform[2], transform[5]); + context.setTransform(transform.a, transform.c, transform.b, transform.d, transform.tx, transform.ty); PIXI.CanvasGraphics.renderGraphics(this, context); // simple render children! @@ -8842,12 +9302,12 @@ var worldTransform = this.worldTransform; - var a = worldTransform[0]; - var b = worldTransform[3]; - var c = worldTransform[1]; - var d = worldTransform[4]; - var tx = worldTransform[2]; - var ty = worldTransform[5]; + var a = worldTransform.a; + var b = worldTransform.c; + var c = worldTransform.b; + var d = worldTransform.d; + var tx = worldTransform.tx; + var ty = worldTransform.ty; var x1 = a * w1 + c * h1 + tx; var y1 = d * h1 + b * w1 + ty; @@ -9525,7 +9985,7 @@ // allow for trimming - context.setTransform(transform[0], transform[3], transform[1], transform[4], transform[2], transform[5]); + context.setTransform(transform.a, transform.c, transform.b, transform.d, transform.tx, transform.ty); if(!this.__tilePattern) @@ -9583,13 +10043,13 @@ var worldTransform = this.worldTransform; - var a = worldTransform[0]; - var b = worldTransform[3]; - var c = worldTransform[1]; - var d = worldTransform[4]; - var tx = worldTransform[2]; - var ty = worldTransform[5]; - + var a = worldTransform.a; + var b = worldTransform.c; + var c = worldTransform.b; + var d = worldTransform.d; + var tx = worldTransform.tx; + var ty = worldTransform.ty; + var x1 = a * w1 + c * h1 + tx; var y1 = d * h1 + b * w1 + ty; @@ -11189,6 +11649,7 @@ * @uses EventTarget * @constructor * @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) { @@ -11501,23 +11962,23 @@ PIXI.Texture.prototype._updateWebGLuvs = function() { - if(!this._uvs)this._uvs = new Float32Array(8); + if(!this._uvs)this._uvs = new PIXI.TextureUvs(); var frame = this.frame; var tw = this.baseTexture.width; var th = this.baseTexture.height; - this._uvs[0] = frame.x / tw; - this._uvs[1] = frame.y / th; + this._uvs.x0 = frame.x / tw; + this._uvs.y0 = frame.y / th; - this._uvs[2] = (frame.x + frame.width) / tw; - this._uvs[3] = frame.y / th; + this._uvs.x1 = (frame.x + frame.width) / tw; + this._uvs.y1 = frame.y / th; - this._uvs[4] = (frame.x + frame.width) / tw; - this._uvs[5] = (frame.y + frame.height) / th; + this._uvs.x2 = (frame.x + frame.width) / tw; + this._uvs.y2 = (frame.y + frame.height) / th; - this._uvs[6] = frame.x / tw; - this._uvs[7] = (frame.y + frame.height) / th; + this._uvs.x3 = frame.x / tw; + this._uvs.y3 = (frame.y + frame.height) / th; }; /** @@ -11608,6 +12069,28 @@ // this is more for webGL.. it contains updated frames.. PIXI.Texture.frameUpdates = []; +PIXI.TextureUvs = function() +{ + this.x0 = 0; + this.y0 = 0; + + this.x1 = 0; + this.y1 = 0; + + this.x2 = 0; + this.y2 = 0; + + this.x3 = 0; + this.y4 = 0; + + +} + + + + + + /** * @author Mat Groves http://matgroves.com/ @Doormat23 */ @@ -12606,7 +13089,7 @@ */ PIXI.BitmapFontLoader.prototype.load = function() { - this.ajaxRequest = new XMLHttpRequest(); + this.ajaxRequest = new PIXI.ajaxRequest(); var scope = this; this.ajaxRequest.onreadystatechange = function() { @@ -12619,7 +13102,7 @@ }; /** - * Invoked when XML file is loaded, parses the data + * Invoked when the XML file is loaded, parses the data * * @method onXMLLoaded * @private diff --git a/src/pixi/InteractionManager.js b/src/pixi/InteractionManager.js index a7072d6..98ac26c 100644 --- a/src/pixi/InteractionManager.js +++ b/src/pixi/InteractionManager.js @@ -454,8 +454,8 @@ var isSprite = (item instanceof PIXI.Sprite), worldTransform = item.worldTransform, - a00 = worldTransform[0], a01 = worldTransform[1], a02 = worldTransform[2], - a10 = worldTransform[3], a11 = worldTransform[4], a12 = worldTransform[5], + a00 = worldTransform.a, a01 = worldTransform.b, a02 = worldTransform.tx, + a10 = worldTransform.c, a11 = worldTransform.d, a12 = worldTransform.ty, id = 1 / (a00 * a11 + a01 * -a10), x = a11 * id * global.x + -a01 * id * global.y + (a12 * a01 - a02 * a11) * id, y = a00 * id * global.y + -a10 * id * global.x + (-a12 * a00 + a02 * a10) * id; diff --git a/bin/pixi.dev.js b/bin/pixi.dev.js index 8558d80..45e6eba 100644 --- a/bin/pixi.dev.js +++ b/bin/pixi.dev.js @@ -1,10 +1,10 @@ /** * @license * pixi.js - v1.4.3 - * Copyright (c) 2012, Mat Groves + * Copyright (c) 2012-2014, Mat Groves * http://goodboydigital.com/ * - * Compiled: 2014-01-28 + * Compiled: 2014-01-30 * * pixi.js is licensed under the MIT License. * http://www.opensource.org/licenses/mit-license.php @@ -461,7 +461,7 @@ return (typeof Float32Array !== 'undefined') ? Float32Array : Array; }; -PIXI.Matrix = PIXI.determineMatrixArrayType(); +PIXI.Matrix2 = PIXI.determineMatrixArrayType(); /** @@ -482,7 +482,7 @@ */ PIXI.mat3.create = function() { - var matrix = new PIXI.Matrix(9); + var matrix = new PIXI.Matrix2(9); matrix[0] = 1; matrix[1] = 0; @@ -567,7 +567,7 @@ */ PIXI.mat3.clone = function(mat) { - var matrix = new PIXI.Matrix(9); + var matrix = new PIXI.Matrix2(9); matrix[0] = mat[0]; matrix[1] = mat[1]; @@ -666,7 +666,7 @@ */ PIXI.mat4.create = function() { - var matrix = new PIXI.Matrix(16); + var matrix = new PIXI.Matrix2(16); matrix[0] = 1; matrix[1] = 0; @@ -799,6 +799,64 @@ PIXI.identityMatrix = PIXI.mat3.create(); PIXI.tempMatrix = PIXI.mat3.create(); + +PIXI.Matrix = function() +{ + this.a = 1; + this.b = 0; + this.c = 0; + this.d = 1; + this.tx = 0; + this.ty = 0; + + +} + +PIXI.Matrix.prototype.fromArray = function(array) +{ + + this.a = array[0]; + this.b = array[1]; + this.c = array[3]; + this.d = array[4]; + this.tx = array[2]; + this.ty = array[5]; + +} + +PIXI.Matrix.prototype.toArray = function(transpose) +{ + if(!this.array)this.array = new Float32Array(9); + var array = this.array; + + if(transpose) + { + this.array[0] = this.a; + this.array[1] = this.c; + this.array[2] = 0; + this.array[3] = this.b; + this.array[4] = this.d; + this.array[5] = 0; + this.array[6] = this.tx; + this.array[7] = this.ty; + this.array[8] = 1; + } + else + { + this.array[0] = this.a; + this.array[1] = this.b; + this.array[2] = this.tx; + this.array[3] = this.c; + this.array[4] = this.d; + this.array[5] = this.ty; + this.array[6] = 0; + this.array[7] = 0; + this.array[8] = 1; + } + + return array;//[this.a, this.b, this.tx, this.c, this.d, this.ty, 0, 0, 1]; +} + /** * @author Mat Groves http://matgroves.com/ @Doormat23 */ @@ -940,7 +998,7 @@ * @readOnly * @private */ - this.worldTransform = PIXI.mat3.create(); //mat3.identity(); + this.worldTransform = new PIXI.Matrix()//PIXI.mat3.create(); //mat3.identity(); /** * [read-only] Current transform of the object locally @@ -950,7 +1008,7 @@ * @readOnly * @private */ - this.localTransform = PIXI.mat3.create(); //mat3.identity(); + this.localTransform = new PIXI.Matrix()//PIXI.mat3.create(); //mat3.identity(); /** * [NYI] Unknown @@ -1208,40 +1266,30 @@ this._cr = Math.cos(this.rotation); } - var localTransform = this.localTransform; - var parentTransform = this.parent.worldTransform; - var worldTransform = this.worldTransform; + // var localTransform = this.localTransform//.toArray(); + var parentTransform = this.parent.worldTransform//.toArray(); + var worldTransform = this.worldTransform//.toArray(); //console.log(localTransform) - localTransform[0] = this._cr * this.scale.x; - localTransform[1] = -this._sr * this.scale.y; - localTransform[3] = this._sr * this.scale.x; - localTransform[4] = this._cr * this.scale.y; - - // TODO --> do we even need a local matrix??? - var px = this.pivot.x; var py = this.pivot.y; - // Cache the matrix values (makes for huge speed increases!) - var a00 = localTransform[0], a01 = localTransform[1], a02 = this.position.x - localTransform[0] * px - py * localTransform[1], - a10 = localTransform[3], a11 = localTransform[4], a12 = this.position.y - localTransform[4] * py - px * localTransform[3], + var a00 = this._cr * this.scale.x, + a01 = -this._sr * this.scale.y, + a10 = this._sr * this.scale.x, + a11 = this._cr * this.scale.y, + a02 = this.position.x + a00 * px - py * a01, + a12 = this.position.y + a11 * py - px * a10, + b00 = parentTransform.a, b01 = parentTransform.b, b02 = parentTransform.tx, + b10 = parentTransform.c, b11 = parentTransform.d, b12 = parentTransform.ty; - b00 = parentTransform[0], b01 = parentTransform[1], b02 = parentTransform[2], - b10 = parentTransform[3], b11 = parentTransform[4], b12 = parentTransform[5]; + worldTransform.a = b00 * a00 + b01 * a10; + worldTransform.b = b00 * a01 + b01 * a11; + worldTransform.tx = b00 * a02 + b01 * a12 + b02; - localTransform[2] = a02; - localTransform[5] = a12; + worldTransform.c = b10 * a00 + b11 * a10; + worldTransform.d = b10 * a01 + b11 * a11; + worldTransform.ty = b10 * a02 + b11 * a12 + b12; - worldTransform[0] = b00 * a00 + b01 * a10; - worldTransform[1] = b00 * a01 + b01 * a11; - worldTransform[2] = b00 * a02 + b01 * a12 + b02; - - worldTransform[3] = b10 * a00 + b11 * a10; - worldTransform[4] = b10 * a01 + b11 * a11; - worldTransform[5] = b10 * a02 + b11 * a12 + b12; - - // because we are using affine transformation, we can optimise the matrix concatenation process.. wooo! - // mat3.multiply(this.localTransform, this.parent.worldTransform, this.worldTransform); this.worldAlpha = this.alpha * this.parent.worldAlpha; }; @@ -1316,6 +1364,36 @@ // this line is just here to pass jshinting :) renderSession = renderSession; }; + +/** + * The position of the displayObject on the x axis relative to the local coordinates of the parent. + * + * @property x + * @type Number + */ +Object.defineProperty(PIXI.DisplayObject.prototype, 'x', { + get: function() { + return this.position.x; + }, + set: function(value) { + this.position.x = value; + } +}); + +/** + * The position of the displayObject on the y axis relative to the local coordinates of the parent. + * + * @property y + * @type Number + */ +Object.defineProperty(PIXI.DisplayObject.prototype, 'y', { + get: function() { + return this.position.y; + }, + set: function(value) { + this.position.y = value; + } +}); /** * @author Mat Groves http://matgroves.com/ @Doormat23 */ @@ -1534,12 +1612,16 @@ var childMaxX; var childMaxY; + var childVisible = false; + for(var i=0,j=this.children.length; i childMaxY ? maxY : childMaxY; } + if(!childVisible) + return PIXI.EmptyRectangle; + var bounds = this._bounds; bounds.x = minX; @@ -1868,12 +1953,12 @@ var worldTransform = this.worldTransform; - var a = worldTransform[0]; - var b = worldTransform[3]; - var c = worldTransform[1]; - var d = worldTransform[4]; - var tx = worldTransform[2]; - var ty = worldTransform[5]; + var a = worldTransform.a; + var b = worldTransform.c; + var c = worldTransform.b; + var d = worldTransform.d; + var tx = worldTransform.tx; + var ty = worldTransform.ty; var x1 = a * w1 + c * h1 + tx; var y1 = d * h1 + b * w1 + ty; @@ -2029,7 +2114,7 @@ // allow for trimming - context.setTransform(transform[0], transform[3], transform[1], transform[4], transform[2], transform[5]); + context.setTransform(transform.a, transform.c, transform.b, transform.d, transform.tx, transform.ty); //if smoothingEnabled is supported and we need to change the smoothing property for this texture if(renderSession.smoothProperty && renderSession.scaleMode !== this.texture.baseTexture.scaleMode) { @@ -2169,6 +2254,13 @@ PIXI.SpriteBatch.prototype = Object.create( PIXI.DisplayObjectContainer.prototype ); PIXI.SpriteBatch.constructor = PIXI.SpriteBatch; + +/* + * Initialises the spriteBatch + * + * @method initWebGL + * @param gl {WebGLContext} the current WebGL drawing context + */ PIXI.SpriteBatch.prototype.initWebGL = function(gl) { @@ -2234,7 +2326,7 @@ // alow for trimming - context.setTransform(transform[0], transform[3], transform[1], transform[4], transform[2], transform[5]); + context.setTransform(transform.a, transform.c, transform.b, transform.d, transform.tx, transform.ty); context.save(); for (var i = 0; i < this.children.length; i++) { @@ -2264,7 +2356,7 @@ PIXI.DisplayObject.prototype.updateTransform.call(child); transform = child.localTransform; - context.setTransform(transform[0], transform[3], transform[1], transform[4], transform[2], transform[5]); + context.setTransform(transform.a, transform.c, transform.b, transform.d, transform.tx, transform.ty); context.drawImage(texture.baseTexture.source, frame.x, @@ -2484,8 +2576,21 @@ */ PIXI.Text = function(text, style) { + /** + * The canvas element that everything is drawn to + * + * @property canvas + * @type HTMLCanvasElement + */ 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'); + PIXI.Sprite.call(this, PIXI.Texture.fromCanvas(this.canvas)); this.setText(text); @@ -2631,6 +2736,13 @@ this.requiresUpdate = true; }; +/** +* Renders the object using the WebGL renderer +* +* @method _renderWebGL +* @param renderSession {RenderSession} +* @private +*/ PIXI.Text.prototype._renderWebGL = function(renderSession) { if(this.requiresUpdate) @@ -2662,6 +2774,7 @@ /* * http://stackoverflow.com/users/34441/ellisbben * great solution to the problem! + * returns the height of the given font * * @method determineFontHeight * @param fontStyle {Object} @@ -2798,11 +2911,11 @@ /** * 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 - * @param style {Object} The style parameters - * @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 + * @param style {Object} The style parameters, contained as properties of an object */ PIXI.BitmapText.prototype.setStyle = function(style) { @@ -3435,8 +3548,8 @@ var isSprite = (item instanceof PIXI.Sprite), worldTransform = item.worldTransform, - a00 = worldTransform[0], a01 = worldTransform[1], a02 = worldTransform[2], - a10 = worldTransform[3], a11 = worldTransform[4], a12 = worldTransform[5], + a00 = worldTransform.a, a01 = worldTransform.b, a02 = worldTransform.tx, + a10 = worldTransform.c, a11 = worldTransform.d, a12 = worldTransform.ty, id = 1 / (a00 * a11 + a01 * -a10), x = a11 * id * global.x + -a01 * id * global.y + (a12 * a01 - a02 * a11) * id, y = a00 * id * global.y + -a10 * id * global.x + (-a12 * a00 + a02 * a10) * id; @@ -3674,7 +3787,7 @@ * @param backgroundColor {Number} the background color of the stage, you have to pass this in is in hex format * 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); * 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 @@ -3693,7 +3806,7 @@ * @readOnly * @private */ - this.worldTransform = PIXI.mat3.create(); + this.worldTransform = new PIXI.Matrix()//PIXI.mat3.create(); /** * Whether or not the stage is interactive @@ -3901,7 +4014,7 @@ * @class AjaxRequest * @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 @@ -4008,7 +4121,7 @@ * Adds event emitter functionality to a class * * @class EventTarget - * @example + * * function MyEmitter() { * PIXI.EventTarget.call(this); //mixes in event target stuff * } @@ -4018,8 +4131,21 @@ */ PIXI.EventTarget = function () { + /** + * Holds all the listeners + * + * @property listeneners + * @type Object + */ 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 ) { @@ -4036,6 +4162,12 @@ }; + /** + * Fires the event, ie pretends that the event has happened + * + * @method dispatchEvent + * @param event {Event} the event object + */ this.dispatchEvent = this.emit = function ( event ) { if ( !listeners[ event.type ] || !listeners[ event.type ].length ) { @@ -4052,6 +4184,13 @@ }; + /** + * 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 ) { var index = listeners[ type ].indexOf( listener ); @@ -4064,6 +4203,12 @@ }; + /** + * 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 ) { var a = listeners[type]; if (a) @@ -4079,7 +4224,8 @@ * 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 * the browser then this function will return a canvas renderer - * + * @class autoDetectRenderer + * @static * @param width=800 {Number} the width 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 @@ -4149,17 +4295,23 @@ 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 = {}; /** * Triangulates shapes for webGL graphic fills * * @method Triangulate - * @namespace PolyK - * @constructor + * */ PIXI.PolyK.Triangulate = function(p) { @@ -4235,10 +4387,17 @@ }; /** - * Checks if a point is within a triangle + * Checks whether a point is within a triangle * - * @class _PointInTriangle - * @namespace PolyK + * @method _PointInTriangle + * @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 */ PIXI.PolyK._PointInTriangle = function(px, py, ax, ay, bx, by, cx, cy) @@ -4265,10 +4424,10 @@ }; /** - * Checks if a shape is convex + * Checks whether a shape is convex * - * @class _convex - * @namespace PolyK + * @method _convex + * * @private */ PIXI.PolyK._convex = function(ax, ay, bx, by, cx, cy, sign) @@ -4343,6 +4502,10 @@ */ PIXI.PixiShader = function(gl) { + /** + * @property gl + * @type WebGLContext + */ this.gl = gl; /** @@ -4375,7 +4538,9 @@ }; /** -* @method PIXI.PixiShader#init +* Initialises the shader +* @method init +* */ PIXI.PixiShader.prototype.init = function() { @@ -4430,7 +4595,7 @@ * 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 * -* @method PIXI.PixiShader#initUniforms +* @method initUniforms */ PIXI.PixiShader.prototype.initUniforms = function() { @@ -4501,7 +4666,7 @@ /** * 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) { @@ -4542,7 +4707,7 @@ wrapT = gl.REPEAT; } - gl.pixelStorei(gl.UNPACK_FLIP_Y_WEBGL, false); + gl.pixelStorei(gl.UNPACK_FLIP_Y_WEBGL, !!data.flipY); if (data.width) { @@ -4576,7 +4741,7 @@ /** * Updates the shader uniform values. * -* @method PIXI.PixiShader#syncUniforms +* @method syncUniforms */ PIXI.PixiShader.prototype.syncUniforms = function() { @@ -4631,6 +4796,11 @@ }; +/** +* Destroys the shader +* @method destroy +* +*/ PIXI.PixiShader.prototype.destroy = function() { this.gl.deleteProgram( this.program ); @@ -4640,6 +4810,11 @@ this.attributes = null; }; +/** +* +* @property defaultVertexSrc +* @type String +*/ PIXI.PixiShader.defaultVertexSrc = [ 'attribute vec2 aVertexPosition;', 'attribute vec2 aTextureCoord;', @@ -4673,19 +4848,25 @@ /** * @class PIXI.PixiFastShader * @constructor +* @param gl {WebGLContext} the current WebGL drawing context */ PIXI.PixiFastShader = function(gl) { + + /** + * @property gl + * @type WebGLContext + */ this.gl = gl; /** - * @property {any} program - The WebGL program. - */ + * @property {any} program - The WebGL program. + */ this.program = null; /** - * @property {array} fragmentSrc - The fragment shader. - */ + * @property {array} fragmentSrc - The fragment shader. + */ this.fragmentSrc = [ 'precision lowp float;', 'varying vec2 vTextureCoord;', @@ -4696,6 +4877,9 @@ '}' ]; + /** + * @property {array} vertexSrc - The vertex shader + */ this.vertexSrc = [ 'attribute vec2 aVertexPosition;', 'attribute vec2 aPositionCoord;', @@ -4737,7 +4921,9 @@ }; /** -* @method PIXI.PixiFastShader#init +* Initialises the shader +* @method init +* */ PIXI.PixiFastShader.prototype.init = function() { @@ -4787,6 +4973,11 @@ this.program = program; }; +/** +* Destroys the shader +* @method destroy +* +*/ PIXI.PixiFastShader.prototype.destroy = function() { this.gl.deleteProgram( this.program ); @@ -4803,9 +4994,14 @@ PIXI.StripShader = function() { - // the webGL program.. + /** + * @property {any} program - The WebGL program. + */ this.program = null; + /** + * @property {array} fragmentSrc - The fragment shader. + */ this.fragmentSrc = [ 'precision mediump float;', 'varying vec2 vTextureCoord;', @@ -4819,6 +5015,9 @@ '}' ]; + /** + * @property {array} fragmentSrc - The fragment shader. + */ this.vertexSrc = [ 'attribute vec2 aVertexPosition;', 'attribute vec2 aTextureCoord;', @@ -4839,6 +5038,11 @@ ]; }; +/** +* Initialises the shader +* @method init +* +*/ PIXI.StripShader.prototype.init = function() { @@ -4868,14 +5072,28 @@ * @author Mat Groves http://matgroves.com/ @Doormat23 */ - +/** +* @class PrimitiveShader +* @constructor +* @param gl {WebGLContext} the current WebGL drawing context +*/ PIXI.PrimitiveShader = function(gl) { + /** + * @property gl + * @type WebGLContext + */ this.gl = gl; - // the webGL program.. + /** + * @property {any} program - The WebGL program. + */ this.program = null; + /** + * @property fragmentSrc + * @type Array + */ this.fragmentSrc = [ 'precision mediump float;', 'varying vec4 vColor;', @@ -4885,6 +5103,10 @@ '}' ]; + /** + * @property vertexSrc + * @type Array + */ this.vertexSrc = [ 'attribute vec2 aVertexPosition;', 'attribute vec4 aColor;', @@ -4906,6 +5128,11 @@ this.init(); }; +/** +* Initialises the shader +* @method init +* +*/ PIXI.PrimitiveShader.prototype.init = function() { @@ -4932,6 +5159,11 @@ this.program = program; }; +/** +* Destroys the shader +* @method destroy +* +*/ PIXI.PrimitiveShader.prototype.destroy = function() { this.gl.deleteProgram( this.program ); @@ -4948,7 +5180,9 @@ /** * A set of functions used by the webGL renderer to draw the primitive graphics data * - * @class CanvasGraphics + * @class WebGLGraphics + * @private + * @static */ PIXI.WebGLGraphics = function() { @@ -4962,7 +5196,7 @@ * @private * @method renderGraphics * @param graphics {Graphics} - * @param projection {Object} + * @param renderSession {Object} */ PIXI.WebGLGraphics.renderGraphics = function(graphics, renderSession)//projection, offset) { @@ -4999,12 +5233,10 @@ // This could be speeded up for sure! // var m = PIXI.mat3.clone(graphics.worldTransform); - PIXI.mat3.transpose(graphics.worldTransform, PIXI.tempMatrix); - // set the matrix transform gl.blendFunc(gl.ONE, gl.ONE_MINUS_SRC_ALPHA); - gl.uniformMatrix3fv(shader.translationMatrix, false, PIXI.tempMatrix); + gl.uniformMatrix3fv(shader.translationMatrix, false, graphics.worldTransform.toArray(true)); gl.uniform2f(shader.projectionVector, projection.x, -projection.y); gl.uniform2f(shader.offsetVector, -offset.x, -offset.y); @@ -5034,7 +5266,8 @@ * @static * @private * @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) { @@ -5088,7 +5321,7 @@ * @static * @private * @method buildRectangle - * @param graphics {Graphics} + * @param graphicsData {Graphics} The graphics object to draw TODO-Alvin * @param webGLData {Object} */ PIXI.WebGLGraphics.buildRectangle = function(graphicsData, webGLData) @@ -5157,7 +5390,7 @@ * @static * @private * @method buildCircle - * @param graphics {Graphics} + * @param graphicsData {Graphics} The graphics object to draw * @param webGLData {Object} */ PIXI.WebGLGraphics.buildCircle = function(graphicsData, webGLData) @@ -5230,7 +5463,7 @@ * @static * @private * @method buildLine - * @param graphics {Graphics} + * @param graphicsData {Graphics} The graphics object to draw TODO-Alvin * @param webGLData {Object} */ PIXI.WebGLGraphics.buildLine = function(graphicsData, webGLData) @@ -5440,7 +5673,7 @@ * @static * @private * @method buildPoly - * @param graphics {Graphics} + * @param graphicsData {Graphics} The graphics object to draw TODO-Alvin * @param webGLData {Object} */ PIXI.WebGLGraphics.buildPoly = function(graphicsData, webGLData) @@ -6050,6 +6283,13 @@ * @author Mat Groves http://matgroves.com/ @Doormat23 */ + +/** +* @class WebGLMaskManager +* @constructor +* @param gl {WebGLContext} the current WebGL drawing context +* @private +*/ PIXI.WebGLMaskManager = function(gl) { this.maskStack = []; @@ -6058,11 +6298,22 @@ 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) { 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) { var gl = this.gl; @@ -6087,6 +6338,12 @@ 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) { var gl = this.gl; @@ -6110,6 +6367,10 @@ if(this.maskStack.length === 0)gl.disable(gl.STENCIL_TEST); }; +/** +* TODO-Alvin +* @method destroy +*/ PIXI.WebGLMaskManager.prototype.destroy = function() { this.maskStack = null; @@ -6119,6 +6380,12 @@ * @author Mat Groves http://matgroves.com/ @Doormat23 */ +/** +* @class WebGLShaderManager +* @constructor +* @param gl {WebGLContext} the current WebGL drawing context +* @private +*/ PIXI.WebGLShaderManager = function(gl) { @@ -6135,6 +6402,13 @@ //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) { this.gl = gl; @@ -6153,6 +6427,11 @@ }; +/** +* Initialises the context and the properties +* @method setAttribs +* @param attribs {Array} TODO-Alvin +*/ PIXI.WebGLShaderManager.prototype.setAttribs = function(attribs) { // reset temp state @@ -6194,6 +6473,11 @@ // 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) { //if(this.currentShader == shader)return; @@ -6207,6 +6491,10 @@ }; +/** +* Triggers the primitive shader +* @method activatePrimitiveShader +*/ PIXI.WebGLShaderManager.prototype.activatePrimitiveShader = function() { var gl = this.gl; @@ -6217,6 +6505,10 @@ }; +/** +* Disable the primitive shader +* @method deactivatePrimitiveShader +*/ PIXI.WebGLShaderManager.prototype.deactivatePrimitiveShader = function() { var gl = this.gl; @@ -6226,6 +6518,10 @@ this.setAttribs(this.defaultShader.attributes); }; +/** +* Destroys +* @method destroy +*/ PIXI.WebGLShaderManager.prototype.destroy = function() { this.attribState = null; @@ -6252,11 +6548,30 @@ * 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) { - + /** + * TODO-Alvin + * + * @property vertSize + * @type Number + */ this.vertSize = 6; + + /** + * TODO-Alvin + * @property size + * @type Number + */ this.size = 10000;//Math.pow(2, 16) / this.vertSize; // console.log(this.size); @@ -6265,9 +6580,23 @@ //the total number of indices in our batch var numIndices = this.size * 6; - //vertex data + //vertex data + + /** + * Holds the vertices + * + * @property vertices + * @type Float32Array + */ this.vertices = new Float32Array(numVerts); + //index data + /** + * Holds the indices + * + * @property indices + * @type Uint16Array + */ this.indices = new Uint16Array(numIndices); this.lastIndexCount = 0; @@ -6290,6 +6619,12 @@ this.setContext(gl); }; +/** +* +* @method setContext +* +* @param gl {WebGLContext} the current WebGL drawing context +*/ PIXI.WebGLSpriteBatch.prototype.setContext = function(gl) { this.gl = gl; @@ -6311,6 +6646,12 @@ this.currentBlendMode = 99999; }; +/** +* +* @method begin +* +* @param renderSession {RenderSession} the RenderSession +*/ PIXI.WebGLSpriteBatch.prototype.begin = function(renderSession) { this.renderSession = renderSession; @@ -6319,12 +6660,22 @@ this.start(); }; +/** +* +* @method end +* +*/ PIXI.WebGLSpriteBatch.prototype.end = function() { this.flush(); }; - +/** +* +* @method render +* +* @param sprite {Sprite} the sprite to render TODO-Alvin +*/ PIXI.WebGLSpriteBatch.prototype.render = function(sprite) { // check texture.. @@ -6383,21 +6734,21 @@ var index = this.currentBatchSize * 4 * this.vertSize; - var worldTransform = sprite.worldTransform; + var worldTransform = sprite.worldTransform;//.toArray(); - var a = worldTransform[0]; - var b = worldTransform[3]; - var c = worldTransform[1]; - var d = worldTransform[4]; - var tx = worldTransform[2]; - var ty = worldTransform[5]; + var a = worldTransform.a//[0]; + var b = worldTransform.c//[3]; + var c = worldTransform.b//[1]; + var d = worldTransform.d//[4]; + var tx = worldTransform.tx//[2]; + var ty = worldTransform.ty///[5]; // xy verticies[index++] = a * w1 + c * h1 + tx; verticies[index++] = d * h1 + b * w1 + ty; // uv - verticies[index++] = uvs[0]; - verticies[index++] = uvs[1]; + verticies[index++] = uvs.x0; + verticies[index++] = uvs.y0; // color verticies[index++] = alpha; verticies[index++] = tint; @@ -6406,8 +6757,8 @@ verticies[index++] = a * w0 + c * h1 + tx; verticies[index++] = d * h1 + b * w0 + ty; // uv - verticies[index++] = uvs[2]; - verticies[index++] = uvs[3]; + verticies[index++] = uvs.x1; + verticies[index++] = uvs.y1; // color verticies[index++] = alpha; verticies[index++] = tint; @@ -6416,8 +6767,8 @@ verticies[index++] = a * w0 + c * h0 + tx; verticies[index++] = d * h0 + b * w0 + ty; // uv - verticies[index++] = uvs[4]; - verticies[index++] = uvs[5]; + verticies[index++] = uvs.x2; + verticies[index++] = uvs.y2; // color verticies[index++] = alpha; verticies[index++] = tint; @@ -6426,18 +6777,24 @@ verticies[index++] = a * w1 + c * h0 + tx; verticies[index++] = d * h0 + b * w1 + ty; // uv - verticies[index++] = uvs[6]; - verticies[index++] = uvs[7]; + verticies[index++] = uvs.x3; + verticies[index++] = uvs.y3; // color verticies[index++] = alpha; verticies[index++] = tint; - + // increment the batchsize this.currentBatchSize++; }; +/** +* +* @method renderTilingSprite +* +* @param sprite {TilingSprite} the sprite to render TODO-Alvin +*/ PIXI.WebGLSpriteBatch.prototype.renderTilingSprite = function(tilingSprite) { var texture = tilingSprite.tilingTexture; @@ -6553,6 +6910,13 @@ this.currentBatchSize++; }; + +/** +* +* +* @method flush TODO-Alvin +* +*/ PIXI.WebGLSpriteBatch.prototype.flush = function() { // If the batch is length 0 then return as there is nothing to draw @@ -6589,12 +6953,21 @@ this.renderSession.drawCount++; }; - +/** +* +* @method stop +* +*/ PIXI.WebGLSpriteBatch.prototype.stop = function() { this.flush(); }; +/** +* +* @method start +* +*/ PIXI.WebGLSpriteBatch.prototype.start = function() { var gl = this.gl; @@ -6623,6 +6996,13 @@ } }; +/** +* +* @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) { this.flush(); @@ -6633,6 +7013,10 @@ this.gl.blendFunc(blendModeWebGL[0], blendModeWebGL[1]); }; +/** +* Destroys the SpriteBatch +* @method destroy +*/ PIXI.WebGLSpriteBatch.prototype.destroy = function() { @@ -6702,7 +7086,7 @@ this.shader = null; - this.tempMatrix = PIXI.mat3.create(); + this.matrix this.setContext(gl); }; @@ -6732,8 +7116,10 @@ { this.renderSession = renderSession; this.shader = this.renderSession.shaderManager.fastShader; - - PIXI.mat3.transpose(spriteBatch.worldTransform, this.tempMatrix); + + // PIXI.mat3.transpose(spriteBatch.worldTransform.toArray(), this.tempMatrix); + + this.matrix = spriteBatch.worldTransform.toArray(true) // console.log(this.tempMatrix) this.start(); @@ -6829,8 +7215,8 @@ verticies[index++] = sprite.rotation; // uv - verticies[index++] = uvs[0]; - verticies[index++] = uvs[1]; + verticies[index++] = uvs.x0; + verticies[index++] = uvs.y1; // color verticies[index++] = sprite.alpha; @@ -6850,8 +7236,8 @@ verticies[index++] = sprite.rotation; // uv - verticies[index++] = uvs[2]; - verticies[index++] = uvs[3]; + verticies[index++] = uvs.x1; + verticies[index++] = uvs.y1; // color verticies[index++] = sprite.alpha; @@ -6871,8 +7257,8 @@ verticies[index++] = sprite.rotation; // uv - verticies[index++] = uvs[4]; - verticies[index++] = uvs[5]; + verticies[index++] = uvs.x2; + verticies[index++] = uvs.y2; // color verticies[index++] = sprite.alpha; @@ -6894,8 +7280,8 @@ verticies[index++] = sprite.rotation; // uv - verticies[index++] = uvs[6]; - verticies[index++] = uvs[7]; + verticies[index++] = uvs.x3; + verticies[index++] = uvs.y3; // color verticies[index++] = sprite.alpha; @@ -6910,6 +7296,7 @@ PIXI.WebGLFastSpriteBatch.prototype.flush = function() { + // If the batch is length 0 then return as there is nothing to draw if (this.currentBatchSize===0)return; @@ -6968,7 +7355,7 @@ gl.uniform2f(this.shader.projectionVector, projection.x, projection.y); // set the matrix - gl.uniformMatrix3fv(this.shader.uMatrix, false, this.tempMatrix); + gl.uniformMatrix3fv(this.shader.uMatrix, false, this.matrix); // set the pointers var stride = this.vertSize * 4; @@ -7003,7 +7390,13 @@ * @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) { this.transparent = transparent; @@ -7017,7 +7410,11 @@ }; // API - +/** +* Initialises the context and the properties +* @method setContext +* @param gl {WebGLContext} the current WebGL drawing context +*/ PIXI.WebGLFilterManager.prototype.setContext = function(gl) { this.gl = gl; @@ -7026,6 +7423,12 @@ this.initShaderBuffers(); }; +/** +* +* @method begin +* @param renderSession {RenderSession} +* @param buffer {ArrayBuffer} +*/ PIXI.WebGLFilterManager.prototype.begin = function(renderSession, buffer) { this.renderSession = renderSession; @@ -7038,6 +7441,11 @@ 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) { var gl = this.gl; @@ -7119,6 +7527,10 @@ }; +/** +* Removes the last filter from the filter stack and doesn't return it +* @method popFilter +*/ PIXI.WebGLFilterManager.prototype.popFilter = function() { var gl = this.gl; @@ -7292,6 +7704,15 @@ 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) { // use program @@ -7344,6 +7765,10 @@ this.renderSession.drawCount++; }; +/** +* Initialises the shader buffers +* @method initShaderBuffers +*/ PIXI.WebGLFilterManager.prototype.initShaderBuffers = function() { var gl = this.gl; @@ -7400,6 +7825,10 @@ gl.STATIC_DRAW); }; +/** +* TODO-Alvin +* @method destroy +*/ PIXI.WebGLFilterManager.prototype.destroy = function() { var gl = this.gl; @@ -7422,9 +7851,24 @@ gl.deleteBuffer(this.colorBuffer); gl.deleteBuffer(this.indexBuffer); }; +/** + * @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 @@ -7444,6 +7888,11 @@ this.resize(width, height); }; + +/** +* Clears the filter texture +* @method clear +*/ PIXI.FilterTexture.prototype.clear = function() { var gl = this.gl; @@ -7452,6 +7901,13 @@ 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; @@ -7466,6 +7922,10 @@ }; +/** +* Destroys the filter texture +* @method destroy +*/ PIXI.FilterTexture.prototype.destroy = function() { var gl = this.gl; @@ -7476,7 +7936,6 @@ this.texture = null; }; - /** * @author Mat Groves * @@ -7509,7 +7968,7 @@ var cacheAlpha = maskData.alpha; var transform = maskData.worldTransform; - context.setTransform(transform[0], transform[3], transform[1], transform[4], transform[2], transform[5]); + context.setTransform(transform.a, transform.c, transform.b, transform.d, transform.tx, transform.ty); PIXI.CanvasGraphics.renderGraphicsMask(maskData, context); @@ -7876,7 +8335,7 @@ 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 * @type HTMLCanvasElement 2d Context */ @@ -7949,6 +8408,7 @@ { if(!this.transparent) { + this.context.globalAlpha = 1; this.context.fillStyle = stage.backgroundColorString; this.context.fillRect(0, 0, this.width, this.height); } @@ -8814,7 +9274,7 @@ context.globalCompositeOperation = PIXI.blendModesCanvas[renderSession.currentBlendMode]; } - context.setTransform(transform[0], transform[3], transform[1], transform[4], transform[2], transform[5]); + context.setTransform(transform.a, transform.c, transform.b, transform.d, transform.tx, transform.ty); PIXI.CanvasGraphics.renderGraphics(this, context); // simple render children! @@ -8842,12 +9302,12 @@ var worldTransform = this.worldTransform; - var a = worldTransform[0]; - var b = worldTransform[3]; - var c = worldTransform[1]; - var d = worldTransform[4]; - var tx = worldTransform[2]; - var ty = worldTransform[5]; + var a = worldTransform.a; + var b = worldTransform.c; + var c = worldTransform.b; + var d = worldTransform.d; + var tx = worldTransform.tx; + var ty = worldTransform.ty; var x1 = a * w1 + c * h1 + tx; var y1 = d * h1 + b * w1 + ty; @@ -9525,7 +9985,7 @@ // allow for trimming - context.setTransform(transform[0], transform[3], transform[1], transform[4], transform[2], transform[5]); + context.setTransform(transform.a, transform.c, transform.b, transform.d, transform.tx, transform.ty); if(!this.__tilePattern) @@ -9583,13 +10043,13 @@ var worldTransform = this.worldTransform; - var a = worldTransform[0]; - var b = worldTransform[3]; - var c = worldTransform[1]; - var d = worldTransform[4]; - var tx = worldTransform[2]; - var ty = worldTransform[5]; - + var a = worldTransform.a; + var b = worldTransform.c; + var c = worldTransform.b; + var d = worldTransform.d; + var tx = worldTransform.tx; + var ty = worldTransform.ty; + var x1 = a * w1 + c * h1 + tx; var y1 = d * h1 + b * w1 + ty; @@ -11189,6 +11649,7 @@ * @uses EventTarget * @constructor * @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) { @@ -11501,23 +11962,23 @@ PIXI.Texture.prototype._updateWebGLuvs = function() { - if(!this._uvs)this._uvs = new Float32Array(8); + if(!this._uvs)this._uvs = new PIXI.TextureUvs(); var frame = this.frame; var tw = this.baseTexture.width; var th = this.baseTexture.height; - this._uvs[0] = frame.x / tw; - this._uvs[1] = frame.y / th; + this._uvs.x0 = frame.x / tw; + this._uvs.y0 = frame.y / th; - this._uvs[2] = (frame.x + frame.width) / tw; - this._uvs[3] = frame.y / th; + this._uvs.x1 = (frame.x + frame.width) / tw; + this._uvs.y1 = frame.y / th; - this._uvs[4] = (frame.x + frame.width) / tw; - this._uvs[5] = (frame.y + frame.height) / th; + this._uvs.x2 = (frame.x + frame.width) / tw; + this._uvs.y2 = (frame.y + frame.height) / th; - this._uvs[6] = frame.x / tw; - this._uvs[7] = (frame.y + frame.height) / th; + this._uvs.x3 = frame.x / tw; + this._uvs.y3 = (frame.y + frame.height) / th; }; /** @@ -11608,6 +12069,28 @@ // this is more for webGL.. it contains updated frames.. PIXI.Texture.frameUpdates = []; +PIXI.TextureUvs = function() +{ + this.x0 = 0; + this.y0 = 0; + + this.x1 = 0; + this.y1 = 0; + + this.x2 = 0; + this.y2 = 0; + + this.x3 = 0; + this.y4 = 0; + + +} + + + + + + /** * @author Mat Groves http://matgroves.com/ @Doormat23 */ @@ -12606,7 +13089,7 @@ */ PIXI.BitmapFontLoader.prototype.load = function() { - this.ajaxRequest = new XMLHttpRequest(); + this.ajaxRequest = new PIXI.ajaxRequest(); var scope = this; this.ajaxRequest.onreadystatechange = function() { @@ -12619,7 +13102,7 @@ }; /** - * Invoked when XML file is loaded, parses the data + * Invoked when the XML file is loaded, parses the data * * @method onXMLLoaded * @private diff --git a/src/pixi/InteractionManager.js b/src/pixi/InteractionManager.js index a7072d6..98ac26c 100644 --- a/src/pixi/InteractionManager.js +++ b/src/pixi/InteractionManager.js @@ -454,8 +454,8 @@ var isSprite = (item instanceof PIXI.Sprite), worldTransform = item.worldTransform, - a00 = worldTransform[0], a01 = worldTransform[1], a02 = worldTransform[2], - a10 = worldTransform[3], a11 = worldTransform[4], a12 = worldTransform[5], + a00 = worldTransform.a, a01 = worldTransform.b, a02 = worldTransform.tx, + a10 = worldTransform.c, a11 = worldTransform.d, a12 = worldTransform.ty, id = 1 / (a00 * a11 + a01 * -a10), x = a11 * id * global.x + -a01 * id * global.y + (a12 * a01 - a02 * a11) * id, y = a00 * id * global.y + -a10 * id * global.x + (-a12 * a00 + a02 * a10) * id; diff --git a/src/pixi/core/Matrix.js b/src/pixi/core/Matrix.js index b88735c..5c4c103 100644 --- a/src/pixi/core/Matrix.js +++ b/src/pixi/core/Matrix.js @@ -12,7 +12,7 @@ return (typeof Float32Array !== 'undefined') ? Float32Array : Array; }; -PIXI.Matrix = PIXI.determineMatrixArrayType(); +PIXI.Matrix2 = PIXI.determineMatrixArrayType(); /** @@ -33,7 +33,7 @@ */ PIXI.mat3.create = function() { - var matrix = new PIXI.Matrix(9); + var matrix = new PIXI.Matrix2(9); matrix[0] = 1; matrix[1] = 0; @@ -118,7 +118,7 @@ */ PIXI.mat3.clone = function(mat) { - var matrix = new PIXI.Matrix(9); + var matrix = new PIXI.Matrix2(9); matrix[0] = mat[0]; matrix[1] = mat[1]; @@ -217,7 +217,7 @@ */ PIXI.mat4.create = function() { - var matrix = new PIXI.Matrix(16); + var matrix = new PIXI.Matrix2(16); matrix[0] = 1; matrix[1] = 0; @@ -349,4 +349,61 @@ }; PIXI.identityMatrix = PIXI.mat3.create(); -PIXI.tempMatrix = PIXI.mat3.create(); \ No newline at end of file +PIXI.tempMatrix = PIXI.mat3.create(); + +PIXI.Matrix = function() +{ + this.a = 1; + this.b = 0; + this.c = 0; + this.d = 1; + this.tx = 0; + this.ty = 0; + + +} + +PIXI.Matrix.prototype.fromArray = function(array) +{ + + this.a = array[0]; + this.b = array[1]; + this.c = array[3]; + this.d = array[4]; + this.tx = array[2]; + this.ty = array[5]; + +} + +PIXI.Matrix.prototype.toArray = function(transpose) +{ + if(!this.array)this.array = new Float32Array(9); + var array = this.array; + + if(transpose) + { + this.array[0] = this.a; + this.array[1] = this.c; + this.array[2] = 0; + this.array[3] = this.b; + this.array[4] = this.d; + this.array[5] = 0; + this.array[6] = this.tx; + this.array[7] = this.ty; + this.array[8] = 1; + } + else + { + this.array[0] = this.a; + this.array[1] = this.b; + this.array[2] = this.tx; + this.array[3] = this.c; + this.array[4] = this.d; + this.array[5] = this.ty; + this.array[6] = 0; + this.array[7] = 0; + this.array[8] = 1; + } + + return array;//[this.a, this.b, this.tx, this.c, this.d, this.ty, 0, 0, 1]; +} diff --git a/bin/pixi.dev.js b/bin/pixi.dev.js index 8558d80..45e6eba 100644 --- a/bin/pixi.dev.js +++ b/bin/pixi.dev.js @@ -1,10 +1,10 @@ /** * @license * pixi.js - v1.4.3 - * Copyright (c) 2012, Mat Groves + * Copyright (c) 2012-2014, Mat Groves * http://goodboydigital.com/ * - * Compiled: 2014-01-28 + * Compiled: 2014-01-30 * * pixi.js is licensed under the MIT License. * http://www.opensource.org/licenses/mit-license.php @@ -461,7 +461,7 @@ return (typeof Float32Array !== 'undefined') ? Float32Array : Array; }; -PIXI.Matrix = PIXI.determineMatrixArrayType(); +PIXI.Matrix2 = PIXI.determineMatrixArrayType(); /** @@ -482,7 +482,7 @@ */ PIXI.mat3.create = function() { - var matrix = new PIXI.Matrix(9); + var matrix = new PIXI.Matrix2(9); matrix[0] = 1; matrix[1] = 0; @@ -567,7 +567,7 @@ */ PIXI.mat3.clone = function(mat) { - var matrix = new PIXI.Matrix(9); + var matrix = new PIXI.Matrix2(9); matrix[0] = mat[0]; matrix[1] = mat[1]; @@ -666,7 +666,7 @@ */ PIXI.mat4.create = function() { - var matrix = new PIXI.Matrix(16); + var matrix = new PIXI.Matrix2(16); matrix[0] = 1; matrix[1] = 0; @@ -799,6 +799,64 @@ PIXI.identityMatrix = PIXI.mat3.create(); PIXI.tempMatrix = PIXI.mat3.create(); + +PIXI.Matrix = function() +{ + this.a = 1; + this.b = 0; + this.c = 0; + this.d = 1; + this.tx = 0; + this.ty = 0; + + +} + +PIXI.Matrix.prototype.fromArray = function(array) +{ + + this.a = array[0]; + this.b = array[1]; + this.c = array[3]; + this.d = array[4]; + this.tx = array[2]; + this.ty = array[5]; + +} + +PIXI.Matrix.prototype.toArray = function(transpose) +{ + if(!this.array)this.array = new Float32Array(9); + var array = this.array; + + if(transpose) + { + this.array[0] = this.a; + this.array[1] = this.c; + this.array[2] = 0; + this.array[3] = this.b; + this.array[4] = this.d; + this.array[5] = 0; + this.array[6] = this.tx; + this.array[7] = this.ty; + this.array[8] = 1; + } + else + { + this.array[0] = this.a; + this.array[1] = this.b; + this.array[2] = this.tx; + this.array[3] = this.c; + this.array[4] = this.d; + this.array[5] = this.ty; + this.array[6] = 0; + this.array[7] = 0; + this.array[8] = 1; + } + + return array;//[this.a, this.b, this.tx, this.c, this.d, this.ty, 0, 0, 1]; +} + /** * @author Mat Groves http://matgroves.com/ @Doormat23 */ @@ -940,7 +998,7 @@ * @readOnly * @private */ - this.worldTransform = PIXI.mat3.create(); //mat3.identity(); + this.worldTransform = new PIXI.Matrix()//PIXI.mat3.create(); //mat3.identity(); /** * [read-only] Current transform of the object locally @@ -950,7 +1008,7 @@ * @readOnly * @private */ - this.localTransform = PIXI.mat3.create(); //mat3.identity(); + this.localTransform = new PIXI.Matrix()//PIXI.mat3.create(); //mat3.identity(); /** * [NYI] Unknown @@ -1208,40 +1266,30 @@ this._cr = Math.cos(this.rotation); } - var localTransform = this.localTransform; - var parentTransform = this.parent.worldTransform; - var worldTransform = this.worldTransform; + // var localTransform = this.localTransform//.toArray(); + var parentTransform = this.parent.worldTransform//.toArray(); + var worldTransform = this.worldTransform//.toArray(); //console.log(localTransform) - localTransform[0] = this._cr * this.scale.x; - localTransform[1] = -this._sr * this.scale.y; - localTransform[3] = this._sr * this.scale.x; - localTransform[4] = this._cr * this.scale.y; - - // TODO --> do we even need a local matrix??? - var px = this.pivot.x; var py = this.pivot.y; - // Cache the matrix values (makes for huge speed increases!) - var a00 = localTransform[0], a01 = localTransform[1], a02 = this.position.x - localTransform[0] * px - py * localTransform[1], - a10 = localTransform[3], a11 = localTransform[4], a12 = this.position.y - localTransform[4] * py - px * localTransform[3], + var a00 = this._cr * this.scale.x, + a01 = -this._sr * this.scale.y, + a10 = this._sr * this.scale.x, + a11 = this._cr * this.scale.y, + a02 = this.position.x + a00 * px - py * a01, + a12 = this.position.y + a11 * py - px * a10, + b00 = parentTransform.a, b01 = parentTransform.b, b02 = parentTransform.tx, + b10 = parentTransform.c, b11 = parentTransform.d, b12 = parentTransform.ty; - b00 = parentTransform[0], b01 = parentTransform[1], b02 = parentTransform[2], - b10 = parentTransform[3], b11 = parentTransform[4], b12 = parentTransform[5]; + worldTransform.a = b00 * a00 + b01 * a10; + worldTransform.b = b00 * a01 + b01 * a11; + worldTransform.tx = b00 * a02 + b01 * a12 + b02; - localTransform[2] = a02; - localTransform[5] = a12; + worldTransform.c = b10 * a00 + b11 * a10; + worldTransform.d = b10 * a01 + b11 * a11; + worldTransform.ty = b10 * a02 + b11 * a12 + b12; - worldTransform[0] = b00 * a00 + b01 * a10; - worldTransform[1] = b00 * a01 + b01 * a11; - worldTransform[2] = b00 * a02 + b01 * a12 + b02; - - worldTransform[3] = b10 * a00 + b11 * a10; - worldTransform[4] = b10 * a01 + b11 * a11; - worldTransform[5] = b10 * a02 + b11 * a12 + b12; - - // because we are using affine transformation, we can optimise the matrix concatenation process.. wooo! - // mat3.multiply(this.localTransform, this.parent.worldTransform, this.worldTransform); this.worldAlpha = this.alpha * this.parent.worldAlpha; }; @@ -1316,6 +1364,36 @@ // this line is just here to pass jshinting :) renderSession = renderSession; }; + +/** + * The position of the displayObject on the x axis relative to the local coordinates of the parent. + * + * @property x + * @type Number + */ +Object.defineProperty(PIXI.DisplayObject.prototype, 'x', { + get: function() { + return this.position.x; + }, + set: function(value) { + this.position.x = value; + } +}); + +/** + * The position of the displayObject on the y axis relative to the local coordinates of the parent. + * + * @property y + * @type Number + */ +Object.defineProperty(PIXI.DisplayObject.prototype, 'y', { + get: function() { + return this.position.y; + }, + set: function(value) { + this.position.y = value; + } +}); /** * @author Mat Groves http://matgroves.com/ @Doormat23 */ @@ -1534,12 +1612,16 @@ var childMaxX; var childMaxY; + var childVisible = false; + for(var i=0,j=this.children.length; i childMaxY ? maxY : childMaxY; } + if(!childVisible) + return PIXI.EmptyRectangle; + var bounds = this._bounds; bounds.x = minX; @@ -1868,12 +1953,12 @@ var worldTransform = this.worldTransform; - var a = worldTransform[0]; - var b = worldTransform[3]; - var c = worldTransform[1]; - var d = worldTransform[4]; - var tx = worldTransform[2]; - var ty = worldTransform[5]; + var a = worldTransform.a; + var b = worldTransform.c; + var c = worldTransform.b; + var d = worldTransform.d; + var tx = worldTransform.tx; + var ty = worldTransform.ty; var x1 = a * w1 + c * h1 + tx; var y1 = d * h1 + b * w1 + ty; @@ -2029,7 +2114,7 @@ // allow for trimming - context.setTransform(transform[0], transform[3], transform[1], transform[4], transform[2], transform[5]); + context.setTransform(transform.a, transform.c, transform.b, transform.d, transform.tx, transform.ty); //if smoothingEnabled is supported and we need to change the smoothing property for this texture if(renderSession.smoothProperty && renderSession.scaleMode !== this.texture.baseTexture.scaleMode) { @@ -2169,6 +2254,13 @@ PIXI.SpriteBatch.prototype = Object.create( PIXI.DisplayObjectContainer.prototype ); PIXI.SpriteBatch.constructor = PIXI.SpriteBatch; + +/* + * Initialises the spriteBatch + * + * @method initWebGL + * @param gl {WebGLContext} the current WebGL drawing context + */ PIXI.SpriteBatch.prototype.initWebGL = function(gl) { @@ -2234,7 +2326,7 @@ // alow for trimming - context.setTransform(transform[0], transform[3], transform[1], transform[4], transform[2], transform[5]); + context.setTransform(transform.a, transform.c, transform.b, transform.d, transform.tx, transform.ty); context.save(); for (var i = 0; i < this.children.length; i++) { @@ -2264,7 +2356,7 @@ PIXI.DisplayObject.prototype.updateTransform.call(child); transform = child.localTransform; - context.setTransform(transform[0], transform[3], transform[1], transform[4], transform[2], transform[5]); + context.setTransform(transform.a, transform.c, transform.b, transform.d, transform.tx, transform.ty); context.drawImage(texture.baseTexture.source, frame.x, @@ -2484,8 +2576,21 @@ */ PIXI.Text = function(text, style) { + /** + * The canvas element that everything is drawn to + * + * @property canvas + * @type HTMLCanvasElement + */ 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'); + PIXI.Sprite.call(this, PIXI.Texture.fromCanvas(this.canvas)); this.setText(text); @@ -2631,6 +2736,13 @@ this.requiresUpdate = true; }; +/** +* Renders the object using the WebGL renderer +* +* @method _renderWebGL +* @param renderSession {RenderSession} +* @private +*/ PIXI.Text.prototype._renderWebGL = function(renderSession) { if(this.requiresUpdate) @@ -2662,6 +2774,7 @@ /* * http://stackoverflow.com/users/34441/ellisbben * great solution to the problem! + * returns the height of the given font * * @method determineFontHeight * @param fontStyle {Object} @@ -2798,11 +2911,11 @@ /** * 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 - * @param style {Object} The style parameters - * @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 + * @param style {Object} The style parameters, contained as properties of an object */ PIXI.BitmapText.prototype.setStyle = function(style) { @@ -3435,8 +3548,8 @@ var isSprite = (item instanceof PIXI.Sprite), worldTransform = item.worldTransform, - a00 = worldTransform[0], a01 = worldTransform[1], a02 = worldTransform[2], - a10 = worldTransform[3], a11 = worldTransform[4], a12 = worldTransform[5], + a00 = worldTransform.a, a01 = worldTransform.b, a02 = worldTransform.tx, + a10 = worldTransform.c, a11 = worldTransform.d, a12 = worldTransform.ty, id = 1 / (a00 * a11 + a01 * -a10), x = a11 * id * global.x + -a01 * id * global.y + (a12 * a01 - a02 * a11) * id, y = a00 * id * global.y + -a10 * id * global.x + (-a12 * a00 + a02 * a10) * id; @@ -3674,7 +3787,7 @@ * @param backgroundColor {Number} the background color of the stage, you have to pass this in is in hex format * 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); * 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 @@ -3693,7 +3806,7 @@ * @readOnly * @private */ - this.worldTransform = PIXI.mat3.create(); + this.worldTransform = new PIXI.Matrix()//PIXI.mat3.create(); /** * Whether or not the stage is interactive @@ -3901,7 +4014,7 @@ * @class AjaxRequest * @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 @@ -4008,7 +4121,7 @@ * Adds event emitter functionality to a class * * @class EventTarget - * @example + * * function MyEmitter() { * PIXI.EventTarget.call(this); //mixes in event target stuff * } @@ -4018,8 +4131,21 @@ */ PIXI.EventTarget = function () { + /** + * Holds all the listeners + * + * @property listeneners + * @type Object + */ 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 ) { @@ -4036,6 +4162,12 @@ }; + /** + * Fires the event, ie pretends that the event has happened + * + * @method dispatchEvent + * @param event {Event} the event object + */ this.dispatchEvent = this.emit = function ( event ) { if ( !listeners[ event.type ] || !listeners[ event.type ].length ) { @@ -4052,6 +4184,13 @@ }; + /** + * 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 ) { var index = listeners[ type ].indexOf( listener ); @@ -4064,6 +4203,12 @@ }; + /** + * 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 ) { var a = listeners[type]; if (a) @@ -4079,7 +4224,8 @@ * 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 * the browser then this function will return a canvas renderer - * + * @class autoDetectRenderer + * @static * @param width=800 {Number} the width 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 @@ -4149,17 +4295,23 @@ 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 = {}; /** * Triangulates shapes for webGL graphic fills * * @method Triangulate - * @namespace PolyK - * @constructor + * */ PIXI.PolyK.Triangulate = function(p) { @@ -4235,10 +4387,17 @@ }; /** - * Checks if a point is within a triangle + * Checks whether a point is within a triangle * - * @class _PointInTriangle - * @namespace PolyK + * @method _PointInTriangle + * @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 */ PIXI.PolyK._PointInTriangle = function(px, py, ax, ay, bx, by, cx, cy) @@ -4265,10 +4424,10 @@ }; /** - * Checks if a shape is convex + * Checks whether a shape is convex * - * @class _convex - * @namespace PolyK + * @method _convex + * * @private */ PIXI.PolyK._convex = function(ax, ay, bx, by, cx, cy, sign) @@ -4343,6 +4502,10 @@ */ PIXI.PixiShader = function(gl) { + /** + * @property gl + * @type WebGLContext + */ this.gl = gl; /** @@ -4375,7 +4538,9 @@ }; /** -* @method PIXI.PixiShader#init +* Initialises the shader +* @method init +* */ PIXI.PixiShader.prototype.init = function() { @@ -4430,7 +4595,7 @@ * 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 * -* @method PIXI.PixiShader#initUniforms +* @method initUniforms */ PIXI.PixiShader.prototype.initUniforms = function() { @@ -4501,7 +4666,7 @@ /** * 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) { @@ -4542,7 +4707,7 @@ wrapT = gl.REPEAT; } - gl.pixelStorei(gl.UNPACK_FLIP_Y_WEBGL, false); + gl.pixelStorei(gl.UNPACK_FLIP_Y_WEBGL, !!data.flipY); if (data.width) { @@ -4576,7 +4741,7 @@ /** * Updates the shader uniform values. * -* @method PIXI.PixiShader#syncUniforms +* @method syncUniforms */ PIXI.PixiShader.prototype.syncUniforms = function() { @@ -4631,6 +4796,11 @@ }; +/** +* Destroys the shader +* @method destroy +* +*/ PIXI.PixiShader.prototype.destroy = function() { this.gl.deleteProgram( this.program ); @@ -4640,6 +4810,11 @@ this.attributes = null; }; +/** +* +* @property defaultVertexSrc +* @type String +*/ PIXI.PixiShader.defaultVertexSrc = [ 'attribute vec2 aVertexPosition;', 'attribute vec2 aTextureCoord;', @@ -4673,19 +4848,25 @@ /** * @class PIXI.PixiFastShader * @constructor +* @param gl {WebGLContext} the current WebGL drawing context */ PIXI.PixiFastShader = function(gl) { + + /** + * @property gl + * @type WebGLContext + */ this.gl = gl; /** - * @property {any} program - The WebGL program. - */ + * @property {any} program - The WebGL program. + */ this.program = null; /** - * @property {array} fragmentSrc - The fragment shader. - */ + * @property {array} fragmentSrc - The fragment shader. + */ this.fragmentSrc = [ 'precision lowp float;', 'varying vec2 vTextureCoord;', @@ -4696,6 +4877,9 @@ '}' ]; + /** + * @property {array} vertexSrc - The vertex shader + */ this.vertexSrc = [ 'attribute vec2 aVertexPosition;', 'attribute vec2 aPositionCoord;', @@ -4737,7 +4921,9 @@ }; /** -* @method PIXI.PixiFastShader#init +* Initialises the shader +* @method init +* */ PIXI.PixiFastShader.prototype.init = function() { @@ -4787,6 +4973,11 @@ this.program = program; }; +/** +* Destroys the shader +* @method destroy +* +*/ PIXI.PixiFastShader.prototype.destroy = function() { this.gl.deleteProgram( this.program ); @@ -4803,9 +4994,14 @@ PIXI.StripShader = function() { - // the webGL program.. + /** + * @property {any} program - The WebGL program. + */ this.program = null; + /** + * @property {array} fragmentSrc - The fragment shader. + */ this.fragmentSrc = [ 'precision mediump float;', 'varying vec2 vTextureCoord;', @@ -4819,6 +5015,9 @@ '}' ]; + /** + * @property {array} fragmentSrc - The fragment shader. + */ this.vertexSrc = [ 'attribute vec2 aVertexPosition;', 'attribute vec2 aTextureCoord;', @@ -4839,6 +5038,11 @@ ]; }; +/** +* Initialises the shader +* @method init +* +*/ PIXI.StripShader.prototype.init = function() { @@ -4868,14 +5072,28 @@ * @author Mat Groves http://matgroves.com/ @Doormat23 */ - +/** +* @class PrimitiveShader +* @constructor +* @param gl {WebGLContext} the current WebGL drawing context +*/ PIXI.PrimitiveShader = function(gl) { + /** + * @property gl + * @type WebGLContext + */ this.gl = gl; - // the webGL program.. + /** + * @property {any} program - The WebGL program. + */ this.program = null; + /** + * @property fragmentSrc + * @type Array + */ this.fragmentSrc = [ 'precision mediump float;', 'varying vec4 vColor;', @@ -4885,6 +5103,10 @@ '}' ]; + /** + * @property vertexSrc + * @type Array + */ this.vertexSrc = [ 'attribute vec2 aVertexPosition;', 'attribute vec4 aColor;', @@ -4906,6 +5128,11 @@ this.init(); }; +/** +* Initialises the shader +* @method init +* +*/ PIXI.PrimitiveShader.prototype.init = function() { @@ -4932,6 +5159,11 @@ this.program = program; }; +/** +* Destroys the shader +* @method destroy +* +*/ PIXI.PrimitiveShader.prototype.destroy = function() { this.gl.deleteProgram( this.program ); @@ -4948,7 +5180,9 @@ /** * A set of functions used by the webGL renderer to draw the primitive graphics data * - * @class CanvasGraphics + * @class WebGLGraphics + * @private + * @static */ PIXI.WebGLGraphics = function() { @@ -4962,7 +5196,7 @@ * @private * @method renderGraphics * @param graphics {Graphics} - * @param projection {Object} + * @param renderSession {Object} */ PIXI.WebGLGraphics.renderGraphics = function(graphics, renderSession)//projection, offset) { @@ -4999,12 +5233,10 @@ // This could be speeded up for sure! // var m = PIXI.mat3.clone(graphics.worldTransform); - PIXI.mat3.transpose(graphics.worldTransform, PIXI.tempMatrix); - // set the matrix transform gl.blendFunc(gl.ONE, gl.ONE_MINUS_SRC_ALPHA); - gl.uniformMatrix3fv(shader.translationMatrix, false, PIXI.tempMatrix); + gl.uniformMatrix3fv(shader.translationMatrix, false, graphics.worldTransform.toArray(true)); gl.uniform2f(shader.projectionVector, projection.x, -projection.y); gl.uniform2f(shader.offsetVector, -offset.x, -offset.y); @@ -5034,7 +5266,8 @@ * @static * @private * @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) { @@ -5088,7 +5321,7 @@ * @static * @private * @method buildRectangle - * @param graphics {Graphics} + * @param graphicsData {Graphics} The graphics object to draw TODO-Alvin * @param webGLData {Object} */ PIXI.WebGLGraphics.buildRectangle = function(graphicsData, webGLData) @@ -5157,7 +5390,7 @@ * @static * @private * @method buildCircle - * @param graphics {Graphics} + * @param graphicsData {Graphics} The graphics object to draw * @param webGLData {Object} */ PIXI.WebGLGraphics.buildCircle = function(graphicsData, webGLData) @@ -5230,7 +5463,7 @@ * @static * @private * @method buildLine - * @param graphics {Graphics} + * @param graphicsData {Graphics} The graphics object to draw TODO-Alvin * @param webGLData {Object} */ PIXI.WebGLGraphics.buildLine = function(graphicsData, webGLData) @@ -5440,7 +5673,7 @@ * @static * @private * @method buildPoly - * @param graphics {Graphics} + * @param graphicsData {Graphics} The graphics object to draw TODO-Alvin * @param webGLData {Object} */ PIXI.WebGLGraphics.buildPoly = function(graphicsData, webGLData) @@ -6050,6 +6283,13 @@ * @author Mat Groves http://matgroves.com/ @Doormat23 */ + +/** +* @class WebGLMaskManager +* @constructor +* @param gl {WebGLContext} the current WebGL drawing context +* @private +*/ PIXI.WebGLMaskManager = function(gl) { this.maskStack = []; @@ -6058,11 +6298,22 @@ 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) { 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) { var gl = this.gl; @@ -6087,6 +6338,12 @@ 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) { var gl = this.gl; @@ -6110,6 +6367,10 @@ if(this.maskStack.length === 0)gl.disable(gl.STENCIL_TEST); }; +/** +* TODO-Alvin +* @method destroy +*/ PIXI.WebGLMaskManager.prototype.destroy = function() { this.maskStack = null; @@ -6119,6 +6380,12 @@ * @author Mat Groves http://matgroves.com/ @Doormat23 */ +/** +* @class WebGLShaderManager +* @constructor +* @param gl {WebGLContext} the current WebGL drawing context +* @private +*/ PIXI.WebGLShaderManager = function(gl) { @@ -6135,6 +6402,13 @@ //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) { this.gl = gl; @@ -6153,6 +6427,11 @@ }; +/** +* Initialises the context and the properties +* @method setAttribs +* @param attribs {Array} TODO-Alvin +*/ PIXI.WebGLShaderManager.prototype.setAttribs = function(attribs) { // reset temp state @@ -6194,6 +6473,11 @@ // 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) { //if(this.currentShader == shader)return; @@ -6207,6 +6491,10 @@ }; +/** +* Triggers the primitive shader +* @method activatePrimitiveShader +*/ PIXI.WebGLShaderManager.prototype.activatePrimitiveShader = function() { var gl = this.gl; @@ -6217,6 +6505,10 @@ }; +/** +* Disable the primitive shader +* @method deactivatePrimitiveShader +*/ PIXI.WebGLShaderManager.prototype.deactivatePrimitiveShader = function() { var gl = this.gl; @@ -6226,6 +6518,10 @@ this.setAttribs(this.defaultShader.attributes); }; +/** +* Destroys +* @method destroy +*/ PIXI.WebGLShaderManager.prototype.destroy = function() { this.attribState = null; @@ -6252,11 +6548,30 @@ * 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) { - + /** + * TODO-Alvin + * + * @property vertSize + * @type Number + */ this.vertSize = 6; + + /** + * TODO-Alvin + * @property size + * @type Number + */ this.size = 10000;//Math.pow(2, 16) / this.vertSize; // console.log(this.size); @@ -6265,9 +6580,23 @@ //the total number of indices in our batch var numIndices = this.size * 6; - //vertex data + //vertex data + + /** + * Holds the vertices + * + * @property vertices + * @type Float32Array + */ this.vertices = new Float32Array(numVerts); + //index data + /** + * Holds the indices + * + * @property indices + * @type Uint16Array + */ this.indices = new Uint16Array(numIndices); this.lastIndexCount = 0; @@ -6290,6 +6619,12 @@ this.setContext(gl); }; +/** +* +* @method setContext +* +* @param gl {WebGLContext} the current WebGL drawing context +*/ PIXI.WebGLSpriteBatch.prototype.setContext = function(gl) { this.gl = gl; @@ -6311,6 +6646,12 @@ this.currentBlendMode = 99999; }; +/** +* +* @method begin +* +* @param renderSession {RenderSession} the RenderSession +*/ PIXI.WebGLSpriteBatch.prototype.begin = function(renderSession) { this.renderSession = renderSession; @@ -6319,12 +6660,22 @@ this.start(); }; +/** +* +* @method end +* +*/ PIXI.WebGLSpriteBatch.prototype.end = function() { this.flush(); }; - +/** +* +* @method render +* +* @param sprite {Sprite} the sprite to render TODO-Alvin +*/ PIXI.WebGLSpriteBatch.prototype.render = function(sprite) { // check texture.. @@ -6383,21 +6734,21 @@ var index = this.currentBatchSize * 4 * this.vertSize; - var worldTransform = sprite.worldTransform; + var worldTransform = sprite.worldTransform;//.toArray(); - var a = worldTransform[0]; - var b = worldTransform[3]; - var c = worldTransform[1]; - var d = worldTransform[4]; - var tx = worldTransform[2]; - var ty = worldTransform[5]; + var a = worldTransform.a//[0]; + var b = worldTransform.c//[3]; + var c = worldTransform.b//[1]; + var d = worldTransform.d//[4]; + var tx = worldTransform.tx//[2]; + var ty = worldTransform.ty///[5]; // xy verticies[index++] = a * w1 + c * h1 + tx; verticies[index++] = d * h1 + b * w1 + ty; // uv - verticies[index++] = uvs[0]; - verticies[index++] = uvs[1]; + verticies[index++] = uvs.x0; + verticies[index++] = uvs.y0; // color verticies[index++] = alpha; verticies[index++] = tint; @@ -6406,8 +6757,8 @@ verticies[index++] = a * w0 + c * h1 + tx; verticies[index++] = d * h1 + b * w0 + ty; // uv - verticies[index++] = uvs[2]; - verticies[index++] = uvs[3]; + verticies[index++] = uvs.x1; + verticies[index++] = uvs.y1; // color verticies[index++] = alpha; verticies[index++] = tint; @@ -6416,8 +6767,8 @@ verticies[index++] = a * w0 + c * h0 + tx; verticies[index++] = d * h0 + b * w0 + ty; // uv - verticies[index++] = uvs[4]; - verticies[index++] = uvs[5]; + verticies[index++] = uvs.x2; + verticies[index++] = uvs.y2; // color verticies[index++] = alpha; verticies[index++] = tint; @@ -6426,18 +6777,24 @@ verticies[index++] = a * w1 + c * h0 + tx; verticies[index++] = d * h0 + b * w1 + ty; // uv - verticies[index++] = uvs[6]; - verticies[index++] = uvs[7]; + verticies[index++] = uvs.x3; + verticies[index++] = uvs.y3; // color verticies[index++] = alpha; verticies[index++] = tint; - + // increment the batchsize this.currentBatchSize++; }; +/** +* +* @method renderTilingSprite +* +* @param sprite {TilingSprite} the sprite to render TODO-Alvin +*/ PIXI.WebGLSpriteBatch.prototype.renderTilingSprite = function(tilingSprite) { var texture = tilingSprite.tilingTexture; @@ -6553,6 +6910,13 @@ this.currentBatchSize++; }; + +/** +* +* +* @method flush TODO-Alvin +* +*/ PIXI.WebGLSpriteBatch.prototype.flush = function() { // If the batch is length 0 then return as there is nothing to draw @@ -6589,12 +6953,21 @@ this.renderSession.drawCount++; }; - +/** +* +* @method stop +* +*/ PIXI.WebGLSpriteBatch.prototype.stop = function() { this.flush(); }; +/** +* +* @method start +* +*/ PIXI.WebGLSpriteBatch.prototype.start = function() { var gl = this.gl; @@ -6623,6 +6996,13 @@ } }; +/** +* +* @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) { this.flush(); @@ -6633,6 +7013,10 @@ this.gl.blendFunc(blendModeWebGL[0], blendModeWebGL[1]); }; +/** +* Destroys the SpriteBatch +* @method destroy +*/ PIXI.WebGLSpriteBatch.prototype.destroy = function() { @@ -6702,7 +7086,7 @@ this.shader = null; - this.tempMatrix = PIXI.mat3.create(); + this.matrix this.setContext(gl); }; @@ -6732,8 +7116,10 @@ { this.renderSession = renderSession; this.shader = this.renderSession.shaderManager.fastShader; - - PIXI.mat3.transpose(spriteBatch.worldTransform, this.tempMatrix); + + // PIXI.mat3.transpose(spriteBatch.worldTransform.toArray(), this.tempMatrix); + + this.matrix = spriteBatch.worldTransform.toArray(true) // console.log(this.tempMatrix) this.start(); @@ -6829,8 +7215,8 @@ verticies[index++] = sprite.rotation; // uv - verticies[index++] = uvs[0]; - verticies[index++] = uvs[1]; + verticies[index++] = uvs.x0; + verticies[index++] = uvs.y1; // color verticies[index++] = sprite.alpha; @@ -6850,8 +7236,8 @@ verticies[index++] = sprite.rotation; // uv - verticies[index++] = uvs[2]; - verticies[index++] = uvs[3]; + verticies[index++] = uvs.x1; + verticies[index++] = uvs.y1; // color verticies[index++] = sprite.alpha; @@ -6871,8 +7257,8 @@ verticies[index++] = sprite.rotation; // uv - verticies[index++] = uvs[4]; - verticies[index++] = uvs[5]; + verticies[index++] = uvs.x2; + verticies[index++] = uvs.y2; // color verticies[index++] = sprite.alpha; @@ -6894,8 +7280,8 @@ verticies[index++] = sprite.rotation; // uv - verticies[index++] = uvs[6]; - verticies[index++] = uvs[7]; + verticies[index++] = uvs.x3; + verticies[index++] = uvs.y3; // color verticies[index++] = sprite.alpha; @@ -6910,6 +7296,7 @@ PIXI.WebGLFastSpriteBatch.prototype.flush = function() { + // If the batch is length 0 then return as there is nothing to draw if (this.currentBatchSize===0)return; @@ -6968,7 +7355,7 @@ gl.uniform2f(this.shader.projectionVector, projection.x, projection.y); // set the matrix - gl.uniformMatrix3fv(this.shader.uMatrix, false, this.tempMatrix); + gl.uniformMatrix3fv(this.shader.uMatrix, false, this.matrix); // set the pointers var stride = this.vertSize * 4; @@ -7003,7 +7390,13 @@ * @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) { this.transparent = transparent; @@ -7017,7 +7410,11 @@ }; // API - +/** +* Initialises the context and the properties +* @method setContext +* @param gl {WebGLContext} the current WebGL drawing context +*/ PIXI.WebGLFilterManager.prototype.setContext = function(gl) { this.gl = gl; @@ -7026,6 +7423,12 @@ this.initShaderBuffers(); }; +/** +* +* @method begin +* @param renderSession {RenderSession} +* @param buffer {ArrayBuffer} +*/ PIXI.WebGLFilterManager.prototype.begin = function(renderSession, buffer) { this.renderSession = renderSession; @@ -7038,6 +7441,11 @@ 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) { var gl = this.gl; @@ -7119,6 +7527,10 @@ }; +/** +* Removes the last filter from the filter stack and doesn't return it +* @method popFilter +*/ PIXI.WebGLFilterManager.prototype.popFilter = function() { var gl = this.gl; @@ -7292,6 +7704,15 @@ 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) { // use program @@ -7344,6 +7765,10 @@ this.renderSession.drawCount++; }; +/** +* Initialises the shader buffers +* @method initShaderBuffers +*/ PIXI.WebGLFilterManager.prototype.initShaderBuffers = function() { var gl = this.gl; @@ -7400,6 +7825,10 @@ gl.STATIC_DRAW); }; +/** +* TODO-Alvin +* @method destroy +*/ PIXI.WebGLFilterManager.prototype.destroy = function() { var gl = this.gl; @@ -7422,9 +7851,24 @@ gl.deleteBuffer(this.colorBuffer); gl.deleteBuffer(this.indexBuffer); }; +/** + * @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 @@ -7444,6 +7888,11 @@ this.resize(width, height); }; + +/** +* Clears the filter texture +* @method clear +*/ PIXI.FilterTexture.prototype.clear = function() { var gl = this.gl; @@ -7452,6 +7901,13 @@ 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; @@ -7466,6 +7922,10 @@ }; +/** +* Destroys the filter texture +* @method destroy +*/ PIXI.FilterTexture.prototype.destroy = function() { var gl = this.gl; @@ -7476,7 +7936,6 @@ this.texture = null; }; - /** * @author Mat Groves * @@ -7509,7 +7968,7 @@ var cacheAlpha = maskData.alpha; var transform = maskData.worldTransform; - context.setTransform(transform[0], transform[3], transform[1], transform[4], transform[2], transform[5]); + context.setTransform(transform.a, transform.c, transform.b, transform.d, transform.tx, transform.ty); PIXI.CanvasGraphics.renderGraphicsMask(maskData, context); @@ -7876,7 +8335,7 @@ 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 * @type HTMLCanvasElement 2d Context */ @@ -7949,6 +8408,7 @@ { if(!this.transparent) { + this.context.globalAlpha = 1; this.context.fillStyle = stage.backgroundColorString; this.context.fillRect(0, 0, this.width, this.height); } @@ -8814,7 +9274,7 @@ context.globalCompositeOperation = PIXI.blendModesCanvas[renderSession.currentBlendMode]; } - context.setTransform(transform[0], transform[3], transform[1], transform[4], transform[2], transform[5]); + context.setTransform(transform.a, transform.c, transform.b, transform.d, transform.tx, transform.ty); PIXI.CanvasGraphics.renderGraphics(this, context); // simple render children! @@ -8842,12 +9302,12 @@ var worldTransform = this.worldTransform; - var a = worldTransform[0]; - var b = worldTransform[3]; - var c = worldTransform[1]; - var d = worldTransform[4]; - var tx = worldTransform[2]; - var ty = worldTransform[5]; + var a = worldTransform.a; + var b = worldTransform.c; + var c = worldTransform.b; + var d = worldTransform.d; + var tx = worldTransform.tx; + var ty = worldTransform.ty; var x1 = a * w1 + c * h1 + tx; var y1 = d * h1 + b * w1 + ty; @@ -9525,7 +9985,7 @@ // allow for trimming - context.setTransform(transform[0], transform[3], transform[1], transform[4], transform[2], transform[5]); + context.setTransform(transform.a, transform.c, transform.b, transform.d, transform.tx, transform.ty); if(!this.__tilePattern) @@ -9583,13 +10043,13 @@ var worldTransform = this.worldTransform; - var a = worldTransform[0]; - var b = worldTransform[3]; - var c = worldTransform[1]; - var d = worldTransform[4]; - var tx = worldTransform[2]; - var ty = worldTransform[5]; - + var a = worldTransform.a; + var b = worldTransform.c; + var c = worldTransform.b; + var d = worldTransform.d; + var tx = worldTransform.tx; + var ty = worldTransform.ty; + var x1 = a * w1 + c * h1 + tx; var y1 = d * h1 + b * w1 + ty; @@ -11189,6 +11649,7 @@ * @uses EventTarget * @constructor * @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) { @@ -11501,23 +11962,23 @@ PIXI.Texture.prototype._updateWebGLuvs = function() { - if(!this._uvs)this._uvs = new Float32Array(8); + if(!this._uvs)this._uvs = new PIXI.TextureUvs(); var frame = this.frame; var tw = this.baseTexture.width; var th = this.baseTexture.height; - this._uvs[0] = frame.x / tw; - this._uvs[1] = frame.y / th; + this._uvs.x0 = frame.x / tw; + this._uvs.y0 = frame.y / th; - this._uvs[2] = (frame.x + frame.width) / tw; - this._uvs[3] = frame.y / th; + this._uvs.x1 = (frame.x + frame.width) / tw; + this._uvs.y1 = frame.y / th; - this._uvs[4] = (frame.x + frame.width) / tw; - this._uvs[5] = (frame.y + frame.height) / th; + this._uvs.x2 = (frame.x + frame.width) / tw; + this._uvs.y2 = (frame.y + frame.height) / th; - this._uvs[6] = frame.x / tw; - this._uvs[7] = (frame.y + frame.height) / th; + this._uvs.x3 = frame.x / tw; + this._uvs.y3 = (frame.y + frame.height) / th; }; /** @@ -11608,6 +12069,28 @@ // this is more for webGL.. it contains updated frames.. PIXI.Texture.frameUpdates = []; +PIXI.TextureUvs = function() +{ + this.x0 = 0; + this.y0 = 0; + + this.x1 = 0; + this.y1 = 0; + + this.x2 = 0; + this.y2 = 0; + + this.x3 = 0; + this.y4 = 0; + + +} + + + + + + /** * @author Mat Groves http://matgroves.com/ @Doormat23 */ @@ -12606,7 +13089,7 @@ */ PIXI.BitmapFontLoader.prototype.load = function() { - this.ajaxRequest = new XMLHttpRequest(); + this.ajaxRequest = new PIXI.ajaxRequest(); var scope = this; this.ajaxRequest.onreadystatechange = function() { @@ -12619,7 +13102,7 @@ }; /** - * Invoked when XML file is loaded, parses the data + * Invoked when the XML file is loaded, parses the data * * @method onXMLLoaded * @private diff --git a/src/pixi/InteractionManager.js b/src/pixi/InteractionManager.js index a7072d6..98ac26c 100644 --- a/src/pixi/InteractionManager.js +++ b/src/pixi/InteractionManager.js @@ -454,8 +454,8 @@ var isSprite = (item instanceof PIXI.Sprite), worldTransform = item.worldTransform, - a00 = worldTransform[0], a01 = worldTransform[1], a02 = worldTransform[2], - a10 = worldTransform[3], a11 = worldTransform[4], a12 = worldTransform[5], + a00 = worldTransform.a, a01 = worldTransform.b, a02 = worldTransform.tx, + a10 = worldTransform.c, a11 = worldTransform.d, a12 = worldTransform.ty, id = 1 / (a00 * a11 + a01 * -a10), x = a11 * id * global.x + -a01 * id * global.y + (a12 * a01 - a02 * a11) * id, y = a00 * id * global.y + -a10 * id * global.x + (-a12 * a00 + a02 * a10) * id; diff --git a/src/pixi/core/Matrix.js b/src/pixi/core/Matrix.js index b88735c..5c4c103 100644 --- a/src/pixi/core/Matrix.js +++ b/src/pixi/core/Matrix.js @@ -12,7 +12,7 @@ return (typeof Float32Array !== 'undefined') ? Float32Array : Array; }; -PIXI.Matrix = PIXI.determineMatrixArrayType(); +PIXI.Matrix2 = PIXI.determineMatrixArrayType(); /** @@ -33,7 +33,7 @@ */ PIXI.mat3.create = function() { - var matrix = new PIXI.Matrix(9); + var matrix = new PIXI.Matrix2(9); matrix[0] = 1; matrix[1] = 0; @@ -118,7 +118,7 @@ */ PIXI.mat3.clone = function(mat) { - var matrix = new PIXI.Matrix(9); + var matrix = new PIXI.Matrix2(9); matrix[0] = mat[0]; matrix[1] = mat[1]; @@ -217,7 +217,7 @@ */ PIXI.mat4.create = function() { - var matrix = new PIXI.Matrix(16); + var matrix = new PIXI.Matrix2(16); matrix[0] = 1; matrix[1] = 0; @@ -349,4 +349,61 @@ }; PIXI.identityMatrix = PIXI.mat3.create(); -PIXI.tempMatrix = PIXI.mat3.create(); \ No newline at end of file +PIXI.tempMatrix = PIXI.mat3.create(); + +PIXI.Matrix = function() +{ + this.a = 1; + this.b = 0; + this.c = 0; + this.d = 1; + this.tx = 0; + this.ty = 0; + + +} + +PIXI.Matrix.prototype.fromArray = function(array) +{ + + this.a = array[0]; + this.b = array[1]; + this.c = array[3]; + this.d = array[4]; + this.tx = array[2]; + this.ty = array[5]; + +} + +PIXI.Matrix.prototype.toArray = function(transpose) +{ + if(!this.array)this.array = new Float32Array(9); + var array = this.array; + + if(transpose) + { + this.array[0] = this.a; + this.array[1] = this.c; + this.array[2] = 0; + this.array[3] = this.b; + this.array[4] = this.d; + this.array[5] = 0; + this.array[6] = this.tx; + this.array[7] = this.ty; + this.array[8] = 1; + } + else + { + this.array[0] = this.a; + this.array[1] = this.b; + this.array[2] = this.tx; + this.array[3] = this.c; + this.array[4] = this.d; + this.array[5] = this.ty; + this.array[6] = 0; + this.array[7] = 0; + this.array[8] = 1; + } + + return array;//[this.a, this.b, this.tx, this.c, this.d, this.ty, 0, 0, 1]; +} diff --git a/src/pixi/display/DisplayObject.js b/src/pixi/display/DisplayObject.js index b6da1a6..32d34a9 100644 --- a/src/pixi/display/DisplayObject.js +++ b/src/pixi/display/DisplayObject.js @@ -139,7 +139,7 @@ * @readOnly * @private */ - this.worldTransform = PIXI.mat3.create(); //mat3.identity(); + this.worldTransform = new PIXI.Matrix()//PIXI.mat3.create(); //mat3.identity(); /** * [read-only] Current transform of the object locally @@ -149,7 +149,7 @@ * @readOnly * @private */ - this.localTransform = PIXI.mat3.create(); //mat3.identity(); + this.localTransform = new PIXI.Matrix()//PIXI.mat3.create(); //mat3.identity(); /** * [NYI] Unknown @@ -407,40 +407,30 @@ this._cr = Math.cos(this.rotation); } - var localTransform = this.localTransform; - var parentTransform = this.parent.worldTransform; - var worldTransform = this.worldTransform; + // var localTransform = this.localTransform//.toArray(); + var parentTransform = this.parent.worldTransform//.toArray(); + var worldTransform = this.worldTransform//.toArray(); //console.log(localTransform) - localTransform[0] = this._cr * this.scale.x; - localTransform[1] = -this._sr * this.scale.y; - localTransform[3] = this._sr * this.scale.x; - localTransform[4] = this._cr * this.scale.y; - - // TODO --> do we even need a local matrix??? - var px = this.pivot.x; var py = this.pivot.y; - // Cache the matrix values (makes for huge speed increases!) - var a00 = localTransform[0], a01 = localTransform[1], a02 = this.position.x - localTransform[0] * px - py * localTransform[1], - a10 = localTransform[3], a11 = localTransform[4], a12 = this.position.y - localTransform[4] * py - px * localTransform[3], + var a00 = this._cr * this.scale.x, + a01 = -this._sr * this.scale.y, + a10 = this._sr * this.scale.x, + a11 = this._cr * this.scale.y, + a02 = this.position.x + a00 * px - py * a01, + a12 = this.position.y + a11 * py - px * a10, + b00 = parentTransform.a, b01 = parentTransform.b, b02 = parentTransform.tx, + b10 = parentTransform.c, b11 = parentTransform.d, b12 = parentTransform.ty; - b00 = parentTransform[0], b01 = parentTransform[1], b02 = parentTransform[2], - b10 = parentTransform[3], b11 = parentTransform[4], b12 = parentTransform[5]; + worldTransform.a = b00 * a00 + b01 * a10; + worldTransform.b = b00 * a01 + b01 * a11; + worldTransform.tx = b00 * a02 + b01 * a12 + b02; - localTransform[2] = a02; - localTransform[5] = a12; + worldTransform.c = b10 * a00 + b11 * a10; + worldTransform.d = b10 * a01 + b11 * a11; + worldTransform.ty = b10 * a02 + b11 * a12 + b12; - worldTransform[0] = b00 * a00 + b01 * a10; - worldTransform[1] = b00 * a01 + b01 * a11; - worldTransform[2] = b00 * a02 + b01 * a12 + b02; - - worldTransform[3] = b10 * a00 + b11 * a10; - worldTransform[4] = b10 * a01 + b11 * a11; - worldTransform[5] = b10 * a02 + b11 * a12 + b12; - - // because we are using affine transformation, we can optimise the matrix concatenation process.. wooo! - // mat3.multiply(this.localTransform, this.parent.worldTransform, this.worldTransform); this.worldAlpha = this.alpha * this.parent.worldAlpha; }; diff --git a/bin/pixi.dev.js b/bin/pixi.dev.js index 8558d80..45e6eba 100644 --- a/bin/pixi.dev.js +++ b/bin/pixi.dev.js @@ -1,10 +1,10 @@ /** * @license * pixi.js - v1.4.3 - * Copyright (c) 2012, Mat Groves + * Copyright (c) 2012-2014, Mat Groves * http://goodboydigital.com/ * - * Compiled: 2014-01-28 + * Compiled: 2014-01-30 * * pixi.js is licensed under the MIT License. * http://www.opensource.org/licenses/mit-license.php @@ -461,7 +461,7 @@ return (typeof Float32Array !== 'undefined') ? Float32Array : Array; }; -PIXI.Matrix = PIXI.determineMatrixArrayType(); +PIXI.Matrix2 = PIXI.determineMatrixArrayType(); /** @@ -482,7 +482,7 @@ */ PIXI.mat3.create = function() { - var matrix = new PIXI.Matrix(9); + var matrix = new PIXI.Matrix2(9); matrix[0] = 1; matrix[1] = 0; @@ -567,7 +567,7 @@ */ PIXI.mat3.clone = function(mat) { - var matrix = new PIXI.Matrix(9); + var matrix = new PIXI.Matrix2(9); matrix[0] = mat[0]; matrix[1] = mat[1]; @@ -666,7 +666,7 @@ */ PIXI.mat4.create = function() { - var matrix = new PIXI.Matrix(16); + var matrix = new PIXI.Matrix2(16); matrix[0] = 1; matrix[1] = 0; @@ -799,6 +799,64 @@ PIXI.identityMatrix = PIXI.mat3.create(); PIXI.tempMatrix = PIXI.mat3.create(); + +PIXI.Matrix = function() +{ + this.a = 1; + this.b = 0; + this.c = 0; + this.d = 1; + this.tx = 0; + this.ty = 0; + + +} + +PIXI.Matrix.prototype.fromArray = function(array) +{ + + this.a = array[0]; + this.b = array[1]; + this.c = array[3]; + this.d = array[4]; + this.tx = array[2]; + this.ty = array[5]; + +} + +PIXI.Matrix.prototype.toArray = function(transpose) +{ + if(!this.array)this.array = new Float32Array(9); + var array = this.array; + + if(transpose) + { + this.array[0] = this.a; + this.array[1] = this.c; + this.array[2] = 0; + this.array[3] = this.b; + this.array[4] = this.d; + this.array[5] = 0; + this.array[6] = this.tx; + this.array[7] = this.ty; + this.array[8] = 1; + } + else + { + this.array[0] = this.a; + this.array[1] = this.b; + this.array[2] = this.tx; + this.array[3] = this.c; + this.array[4] = this.d; + this.array[5] = this.ty; + this.array[6] = 0; + this.array[7] = 0; + this.array[8] = 1; + } + + return array;//[this.a, this.b, this.tx, this.c, this.d, this.ty, 0, 0, 1]; +} + /** * @author Mat Groves http://matgroves.com/ @Doormat23 */ @@ -940,7 +998,7 @@ * @readOnly * @private */ - this.worldTransform = PIXI.mat3.create(); //mat3.identity(); + this.worldTransform = new PIXI.Matrix()//PIXI.mat3.create(); //mat3.identity(); /** * [read-only] Current transform of the object locally @@ -950,7 +1008,7 @@ * @readOnly * @private */ - this.localTransform = PIXI.mat3.create(); //mat3.identity(); + this.localTransform = new PIXI.Matrix()//PIXI.mat3.create(); //mat3.identity(); /** * [NYI] Unknown @@ -1208,40 +1266,30 @@ this._cr = Math.cos(this.rotation); } - var localTransform = this.localTransform; - var parentTransform = this.parent.worldTransform; - var worldTransform = this.worldTransform; + // var localTransform = this.localTransform//.toArray(); + var parentTransform = this.parent.worldTransform//.toArray(); + var worldTransform = this.worldTransform//.toArray(); //console.log(localTransform) - localTransform[0] = this._cr * this.scale.x; - localTransform[1] = -this._sr * this.scale.y; - localTransform[3] = this._sr * this.scale.x; - localTransform[4] = this._cr * this.scale.y; - - // TODO --> do we even need a local matrix??? - var px = this.pivot.x; var py = this.pivot.y; - // Cache the matrix values (makes for huge speed increases!) - var a00 = localTransform[0], a01 = localTransform[1], a02 = this.position.x - localTransform[0] * px - py * localTransform[1], - a10 = localTransform[3], a11 = localTransform[4], a12 = this.position.y - localTransform[4] * py - px * localTransform[3], + var a00 = this._cr * this.scale.x, + a01 = -this._sr * this.scale.y, + a10 = this._sr * this.scale.x, + a11 = this._cr * this.scale.y, + a02 = this.position.x + a00 * px - py * a01, + a12 = this.position.y + a11 * py - px * a10, + b00 = parentTransform.a, b01 = parentTransform.b, b02 = parentTransform.tx, + b10 = parentTransform.c, b11 = parentTransform.d, b12 = parentTransform.ty; - b00 = parentTransform[0], b01 = parentTransform[1], b02 = parentTransform[2], - b10 = parentTransform[3], b11 = parentTransform[4], b12 = parentTransform[5]; + worldTransform.a = b00 * a00 + b01 * a10; + worldTransform.b = b00 * a01 + b01 * a11; + worldTransform.tx = b00 * a02 + b01 * a12 + b02; - localTransform[2] = a02; - localTransform[5] = a12; + worldTransform.c = b10 * a00 + b11 * a10; + worldTransform.d = b10 * a01 + b11 * a11; + worldTransform.ty = b10 * a02 + b11 * a12 + b12; - worldTransform[0] = b00 * a00 + b01 * a10; - worldTransform[1] = b00 * a01 + b01 * a11; - worldTransform[2] = b00 * a02 + b01 * a12 + b02; - - worldTransform[3] = b10 * a00 + b11 * a10; - worldTransform[4] = b10 * a01 + b11 * a11; - worldTransform[5] = b10 * a02 + b11 * a12 + b12; - - // because we are using affine transformation, we can optimise the matrix concatenation process.. wooo! - // mat3.multiply(this.localTransform, this.parent.worldTransform, this.worldTransform); this.worldAlpha = this.alpha * this.parent.worldAlpha; }; @@ -1316,6 +1364,36 @@ // this line is just here to pass jshinting :) renderSession = renderSession; }; + +/** + * The position of the displayObject on the x axis relative to the local coordinates of the parent. + * + * @property x + * @type Number + */ +Object.defineProperty(PIXI.DisplayObject.prototype, 'x', { + get: function() { + return this.position.x; + }, + set: function(value) { + this.position.x = value; + } +}); + +/** + * The position of the displayObject on the y axis relative to the local coordinates of the parent. + * + * @property y + * @type Number + */ +Object.defineProperty(PIXI.DisplayObject.prototype, 'y', { + get: function() { + return this.position.y; + }, + set: function(value) { + this.position.y = value; + } +}); /** * @author Mat Groves http://matgroves.com/ @Doormat23 */ @@ -1534,12 +1612,16 @@ var childMaxX; var childMaxY; + var childVisible = false; + for(var i=0,j=this.children.length; i childMaxY ? maxY : childMaxY; } + if(!childVisible) + return PIXI.EmptyRectangle; + var bounds = this._bounds; bounds.x = minX; @@ -1868,12 +1953,12 @@ var worldTransform = this.worldTransform; - var a = worldTransform[0]; - var b = worldTransform[3]; - var c = worldTransform[1]; - var d = worldTransform[4]; - var tx = worldTransform[2]; - var ty = worldTransform[5]; + var a = worldTransform.a; + var b = worldTransform.c; + var c = worldTransform.b; + var d = worldTransform.d; + var tx = worldTransform.tx; + var ty = worldTransform.ty; var x1 = a * w1 + c * h1 + tx; var y1 = d * h1 + b * w1 + ty; @@ -2029,7 +2114,7 @@ // allow for trimming - context.setTransform(transform[0], transform[3], transform[1], transform[4], transform[2], transform[5]); + context.setTransform(transform.a, transform.c, transform.b, transform.d, transform.tx, transform.ty); //if smoothingEnabled is supported and we need to change the smoothing property for this texture if(renderSession.smoothProperty && renderSession.scaleMode !== this.texture.baseTexture.scaleMode) { @@ -2169,6 +2254,13 @@ PIXI.SpriteBatch.prototype = Object.create( PIXI.DisplayObjectContainer.prototype ); PIXI.SpriteBatch.constructor = PIXI.SpriteBatch; + +/* + * Initialises the spriteBatch + * + * @method initWebGL + * @param gl {WebGLContext} the current WebGL drawing context + */ PIXI.SpriteBatch.prototype.initWebGL = function(gl) { @@ -2234,7 +2326,7 @@ // alow for trimming - context.setTransform(transform[0], transform[3], transform[1], transform[4], transform[2], transform[5]); + context.setTransform(transform.a, transform.c, transform.b, transform.d, transform.tx, transform.ty); context.save(); for (var i = 0; i < this.children.length; i++) { @@ -2264,7 +2356,7 @@ PIXI.DisplayObject.prototype.updateTransform.call(child); transform = child.localTransform; - context.setTransform(transform[0], transform[3], transform[1], transform[4], transform[2], transform[5]); + context.setTransform(transform.a, transform.c, transform.b, transform.d, transform.tx, transform.ty); context.drawImage(texture.baseTexture.source, frame.x, @@ -2484,8 +2576,21 @@ */ PIXI.Text = function(text, style) { + /** + * The canvas element that everything is drawn to + * + * @property canvas + * @type HTMLCanvasElement + */ 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'); + PIXI.Sprite.call(this, PIXI.Texture.fromCanvas(this.canvas)); this.setText(text); @@ -2631,6 +2736,13 @@ this.requiresUpdate = true; }; +/** +* Renders the object using the WebGL renderer +* +* @method _renderWebGL +* @param renderSession {RenderSession} +* @private +*/ PIXI.Text.prototype._renderWebGL = function(renderSession) { if(this.requiresUpdate) @@ -2662,6 +2774,7 @@ /* * http://stackoverflow.com/users/34441/ellisbben * great solution to the problem! + * returns the height of the given font * * @method determineFontHeight * @param fontStyle {Object} @@ -2798,11 +2911,11 @@ /** * 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 - * @param style {Object} The style parameters - * @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 + * @param style {Object} The style parameters, contained as properties of an object */ PIXI.BitmapText.prototype.setStyle = function(style) { @@ -3435,8 +3548,8 @@ var isSprite = (item instanceof PIXI.Sprite), worldTransform = item.worldTransform, - a00 = worldTransform[0], a01 = worldTransform[1], a02 = worldTransform[2], - a10 = worldTransform[3], a11 = worldTransform[4], a12 = worldTransform[5], + a00 = worldTransform.a, a01 = worldTransform.b, a02 = worldTransform.tx, + a10 = worldTransform.c, a11 = worldTransform.d, a12 = worldTransform.ty, id = 1 / (a00 * a11 + a01 * -a10), x = a11 * id * global.x + -a01 * id * global.y + (a12 * a01 - a02 * a11) * id, y = a00 * id * global.y + -a10 * id * global.x + (-a12 * a00 + a02 * a10) * id; @@ -3674,7 +3787,7 @@ * @param backgroundColor {Number} the background color of the stage, you have to pass this in is in hex format * 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); * 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 @@ -3693,7 +3806,7 @@ * @readOnly * @private */ - this.worldTransform = PIXI.mat3.create(); + this.worldTransform = new PIXI.Matrix()//PIXI.mat3.create(); /** * Whether or not the stage is interactive @@ -3901,7 +4014,7 @@ * @class AjaxRequest * @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 @@ -4008,7 +4121,7 @@ * Adds event emitter functionality to a class * * @class EventTarget - * @example + * * function MyEmitter() { * PIXI.EventTarget.call(this); //mixes in event target stuff * } @@ -4018,8 +4131,21 @@ */ PIXI.EventTarget = function () { + /** + * Holds all the listeners + * + * @property listeneners + * @type Object + */ 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 ) { @@ -4036,6 +4162,12 @@ }; + /** + * Fires the event, ie pretends that the event has happened + * + * @method dispatchEvent + * @param event {Event} the event object + */ this.dispatchEvent = this.emit = function ( event ) { if ( !listeners[ event.type ] || !listeners[ event.type ].length ) { @@ -4052,6 +4184,13 @@ }; + /** + * 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 ) { var index = listeners[ type ].indexOf( listener ); @@ -4064,6 +4203,12 @@ }; + /** + * 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 ) { var a = listeners[type]; if (a) @@ -4079,7 +4224,8 @@ * 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 * the browser then this function will return a canvas renderer - * + * @class autoDetectRenderer + * @static * @param width=800 {Number} the width 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 @@ -4149,17 +4295,23 @@ 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 = {}; /** * Triangulates shapes for webGL graphic fills * * @method Triangulate - * @namespace PolyK - * @constructor + * */ PIXI.PolyK.Triangulate = function(p) { @@ -4235,10 +4387,17 @@ }; /** - * Checks if a point is within a triangle + * Checks whether a point is within a triangle * - * @class _PointInTriangle - * @namespace PolyK + * @method _PointInTriangle + * @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 */ PIXI.PolyK._PointInTriangle = function(px, py, ax, ay, bx, by, cx, cy) @@ -4265,10 +4424,10 @@ }; /** - * Checks if a shape is convex + * Checks whether a shape is convex * - * @class _convex - * @namespace PolyK + * @method _convex + * * @private */ PIXI.PolyK._convex = function(ax, ay, bx, by, cx, cy, sign) @@ -4343,6 +4502,10 @@ */ PIXI.PixiShader = function(gl) { + /** + * @property gl + * @type WebGLContext + */ this.gl = gl; /** @@ -4375,7 +4538,9 @@ }; /** -* @method PIXI.PixiShader#init +* Initialises the shader +* @method init +* */ PIXI.PixiShader.prototype.init = function() { @@ -4430,7 +4595,7 @@ * 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 * -* @method PIXI.PixiShader#initUniforms +* @method initUniforms */ PIXI.PixiShader.prototype.initUniforms = function() { @@ -4501,7 +4666,7 @@ /** * 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) { @@ -4542,7 +4707,7 @@ wrapT = gl.REPEAT; } - gl.pixelStorei(gl.UNPACK_FLIP_Y_WEBGL, false); + gl.pixelStorei(gl.UNPACK_FLIP_Y_WEBGL, !!data.flipY); if (data.width) { @@ -4576,7 +4741,7 @@ /** * Updates the shader uniform values. * -* @method PIXI.PixiShader#syncUniforms +* @method syncUniforms */ PIXI.PixiShader.prototype.syncUniforms = function() { @@ -4631,6 +4796,11 @@ }; +/** +* Destroys the shader +* @method destroy +* +*/ PIXI.PixiShader.prototype.destroy = function() { this.gl.deleteProgram( this.program ); @@ -4640,6 +4810,11 @@ this.attributes = null; }; +/** +* +* @property defaultVertexSrc +* @type String +*/ PIXI.PixiShader.defaultVertexSrc = [ 'attribute vec2 aVertexPosition;', 'attribute vec2 aTextureCoord;', @@ -4673,19 +4848,25 @@ /** * @class PIXI.PixiFastShader * @constructor +* @param gl {WebGLContext} the current WebGL drawing context */ PIXI.PixiFastShader = function(gl) { + + /** + * @property gl + * @type WebGLContext + */ this.gl = gl; /** - * @property {any} program - The WebGL program. - */ + * @property {any} program - The WebGL program. + */ this.program = null; /** - * @property {array} fragmentSrc - The fragment shader. - */ + * @property {array} fragmentSrc - The fragment shader. + */ this.fragmentSrc = [ 'precision lowp float;', 'varying vec2 vTextureCoord;', @@ -4696,6 +4877,9 @@ '}' ]; + /** + * @property {array} vertexSrc - The vertex shader + */ this.vertexSrc = [ 'attribute vec2 aVertexPosition;', 'attribute vec2 aPositionCoord;', @@ -4737,7 +4921,9 @@ }; /** -* @method PIXI.PixiFastShader#init +* Initialises the shader +* @method init +* */ PIXI.PixiFastShader.prototype.init = function() { @@ -4787,6 +4973,11 @@ this.program = program; }; +/** +* Destroys the shader +* @method destroy +* +*/ PIXI.PixiFastShader.prototype.destroy = function() { this.gl.deleteProgram( this.program ); @@ -4803,9 +4994,14 @@ PIXI.StripShader = function() { - // the webGL program.. + /** + * @property {any} program - The WebGL program. + */ this.program = null; + /** + * @property {array} fragmentSrc - The fragment shader. + */ this.fragmentSrc = [ 'precision mediump float;', 'varying vec2 vTextureCoord;', @@ -4819,6 +5015,9 @@ '}' ]; + /** + * @property {array} fragmentSrc - The fragment shader. + */ this.vertexSrc = [ 'attribute vec2 aVertexPosition;', 'attribute vec2 aTextureCoord;', @@ -4839,6 +5038,11 @@ ]; }; +/** +* Initialises the shader +* @method init +* +*/ PIXI.StripShader.prototype.init = function() { @@ -4868,14 +5072,28 @@ * @author Mat Groves http://matgroves.com/ @Doormat23 */ - +/** +* @class PrimitiveShader +* @constructor +* @param gl {WebGLContext} the current WebGL drawing context +*/ PIXI.PrimitiveShader = function(gl) { + /** + * @property gl + * @type WebGLContext + */ this.gl = gl; - // the webGL program.. + /** + * @property {any} program - The WebGL program. + */ this.program = null; + /** + * @property fragmentSrc + * @type Array + */ this.fragmentSrc = [ 'precision mediump float;', 'varying vec4 vColor;', @@ -4885,6 +5103,10 @@ '}' ]; + /** + * @property vertexSrc + * @type Array + */ this.vertexSrc = [ 'attribute vec2 aVertexPosition;', 'attribute vec4 aColor;', @@ -4906,6 +5128,11 @@ this.init(); }; +/** +* Initialises the shader +* @method init +* +*/ PIXI.PrimitiveShader.prototype.init = function() { @@ -4932,6 +5159,11 @@ this.program = program; }; +/** +* Destroys the shader +* @method destroy +* +*/ PIXI.PrimitiveShader.prototype.destroy = function() { this.gl.deleteProgram( this.program ); @@ -4948,7 +5180,9 @@ /** * A set of functions used by the webGL renderer to draw the primitive graphics data * - * @class CanvasGraphics + * @class WebGLGraphics + * @private + * @static */ PIXI.WebGLGraphics = function() { @@ -4962,7 +5196,7 @@ * @private * @method renderGraphics * @param graphics {Graphics} - * @param projection {Object} + * @param renderSession {Object} */ PIXI.WebGLGraphics.renderGraphics = function(graphics, renderSession)//projection, offset) { @@ -4999,12 +5233,10 @@ // This could be speeded up for sure! // var m = PIXI.mat3.clone(graphics.worldTransform); - PIXI.mat3.transpose(graphics.worldTransform, PIXI.tempMatrix); - // set the matrix transform gl.blendFunc(gl.ONE, gl.ONE_MINUS_SRC_ALPHA); - gl.uniformMatrix3fv(shader.translationMatrix, false, PIXI.tempMatrix); + gl.uniformMatrix3fv(shader.translationMatrix, false, graphics.worldTransform.toArray(true)); gl.uniform2f(shader.projectionVector, projection.x, -projection.y); gl.uniform2f(shader.offsetVector, -offset.x, -offset.y); @@ -5034,7 +5266,8 @@ * @static * @private * @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) { @@ -5088,7 +5321,7 @@ * @static * @private * @method buildRectangle - * @param graphics {Graphics} + * @param graphicsData {Graphics} The graphics object to draw TODO-Alvin * @param webGLData {Object} */ PIXI.WebGLGraphics.buildRectangle = function(graphicsData, webGLData) @@ -5157,7 +5390,7 @@ * @static * @private * @method buildCircle - * @param graphics {Graphics} + * @param graphicsData {Graphics} The graphics object to draw * @param webGLData {Object} */ PIXI.WebGLGraphics.buildCircle = function(graphicsData, webGLData) @@ -5230,7 +5463,7 @@ * @static * @private * @method buildLine - * @param graphics {Graphics} + * @param graphicsData {Graphics} The graphics object to draw TODO-Alvin * @param webGLData {Object} */ PIXI.WebGLGraphics.buildLine = function(graphicsData, webGLData) @@ -5440,7 +5673,7 @@ * @static * @private * @method buildPoly - * @param graphics {Graphics} + * @param graphicsData {Graphics} The graphics object to draw TODO-Alvin * @param webGLData {Object} */ PIXI.WebGLGraphics.buildPoly = function(graphicsData, webGLData) @@ -6050,6 +6283,13 @@ * @author Mat Groves http://matgroves.com/ @Doormat23 */ + +/** +* @class WebGLMaskManager +* @constructor +* @param gl {WebGLContext} the current WebGL drawing context +* @private +*/ PIXI.WebGLMaskManager = function(gl) { this.maskStack = []; @@ -6058,11 +6298,22 @@ 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) { 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) { var gl = this.gl; @@ -6087,6 +6338,12 @@ 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) { var gl = this.gl; @@ -6110,6 +6367,10 @@ if(this.maskStack.length === 0)gl.disable(gl.STENCIL_TEST); }; +/** +* TODO-Alvin +* @method destroy +*/ PIXI.WebGLMaskManager.prototype.destroy = function() { this.maskStack = null; @@ -6119,6 +6380,12 @@ * @author Mat Groves http://matgroves.com/ @Doormat23 */ +/** +* @class WebGLShaderManager +* @constructor +* @param gl {WebGLContext} the current WebGL drawing context +* @private +*/ PIXI.WebGLShaderManager = function(gl) { @@ -6135,6 +6402,13 @@ //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) { this.gl = gl; @@ -6153,6 +6427,11 @@ }; +/** +* Initialises the context and the properties +* @method setAttribs +* @param attribs {Array} TODO-Alvin +*/ PIXI.WebGLShaderManager.prototype.setAttribs = function(attribs) { // reset temp state @@ -6194,6 +6473,11 @@ // 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) { //if(this.currentShader == shader)return; @@ -6207,6 +6491,10 @@ }; +/** +* Triggers the primitive shader +* @method activatePrimitiveShader +*/ PIXI.WebGLShaderManager.prototype.activatePrimitiveShader = function() { var gl = this.gl; @@ -6217,6 +6505,10 @@ }; +/** +* Disable the primitive shader +* @method deactivatePrimitiveShader +*/ PIXI.WebGLShaderManager.prototype.deactivatePrimitiveShader = function() { var gl = this.gl; @@ -6226,6 +6518,10 @@ this.setAttribs(this.defaultShader.attributes); }; +/** +* Destroys +* @method destroy +*/ PIXI.WebGLShaderManager.prototype.destroy = function() { this.attribState = null; @@ -6252,11 +6548,30 @@ * 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) { - + /** + * TODO-Alvin + * + * @property vertSize + * @type Number + */ this.vertSize = 6; + + /** + * TODO-Alvin + * @property size + * @type Number + */ this.size = 10000;//Math.pow(2, 16) / this.vertSize; // console.log(this.size); @@ -6265,9 +6580,23 @@ //the total number of indices in our batch var numIndices = this.size * 6; - //vertex data + //vertex data + + /** + * Holds the vertices + * + * @property vertices + * @type Float32Array + */ this.vertices = new Float32Array(numVerts); + //index data + /** + * Holds the indices + * + * @property indices + * @type Uint16Array + */ this.indices = new Uint16Array(numIndices); this.lastIndexCount = 0; @@ -6290,6 +6619,12 @@ this.setContext(gl); }; +/** +* +* @method setContext +* +* @param gl {WebGLContext} the current WebGL drawing context +*/ PIXI.WebGLSpriteBatch.prototype.setContext = function(gl) { this.gl = gl; @@ -6311,6 +6646,12 @@ this.currentBlendMode = 99999; }; +/** +* +* @method begin +* +* @param renderSession {RenderSession} the RenderSession +*/ PIXI.WebGLSpriteBatch.prototype.begin = function(renderSession) { this.renderSession = renderSession; @@ -6319,12 +6660,22 @@ this.start(); }; +/** +* +* @method end +* +*/ PIXI.WebGLSpriteBatch.prototype.end = function() { this.flush(); }; - +/** +* +* @method render +* +* @param sprite {Sprite} the sprite to render TODO-Alvin +*/ PIXI.WebGLSpriteBatch.prototype.render = function(sprite) { // check texture.. @@ -6383,21 +6734,21 @@ var index = this.currentBatchSize * 4 * this.vertSize; - var worldTransform = sprite.worldTransform; + var worldTransform = sprite.worldTransform;//.toArray(); - var a = worldTransform[0]; - var b = worldTransform[3]; - var c = worldTransform[1]; - var d = worldTransform[4]; - var tx = worldTransform[2]; - var ty = worldTransform[5]; + var a = worldTransform.a//[0]; + var b = worldTransform.c//[3]; + var c = worldTransform.b//[1]; + var d = worldTransform.d//[4]; + var tx = worldTransform.tx//[2]; + var ty = worldTransform.ty///[5]; // xy verticies[index++] = a * w1 + c * h1 + tx; verticies[index++] = d * h1 + b * w1 + ty; // uv - verticies[index++] = uvs[0]; - verticies[index++] = uvs[1]; + verticies[index++] = uvs.x0; + verticies[index++] = uvs.y0; // color verticies[index++] = alpha; verticies[index++] = tint; @@ -6406,8 +6757,8 @@ verticies[index++] = a * w0 + c * h1 + tx; verticies[index++] = d * h1 + b * w0 + ty; // uv - verticies[index++] = uvs[2]; - verticies[index++] = uvs[3]; + verticies[index++] = uvs.x1; + verticies[index++] = uvs.y1; // color verticies[index++] = alpha; verticies[index++] = tint; @@ -6416,8 +6767,8 @@ verticies[index++] = a * w0 + c * h0 + tx; verticies[index++] = d * h0 + b * w0 + ty; // uv - verticies[index++] = uvs[4]; - verticies[index++] = uvs[5]; + verticies[index++] = uvs.x2; + verticies[index++] = uvs.y2; // color verticies[index++] = alpha; verticies[index++] = tint; @@ -6426,18 +6777,24 @@ verticies[index++] = a * w1 + c * h0 + tx; verticies[index++] = d * h0 + b * w1 + ty; // uv - verticies[index++] = uvs[6]; - verticies[index++] = uvs[7]; + verticies[index++] = uvs.x3; + verticies[index++] = uvs.y3; // color verticies[index++] = alpha; verticies[index++] = tint; - + // increment the batchsize this.currentBatchSize++; }; +/** +* +* @method renderTilingSprite +* +* @param sprite {TilingSprite} the sprite to render TODO-Alvin +*/ PIXI.WebGLSpriteBatch.prototype.renderTilingSprite = function(tilingSprite) { var texture = tilingSprite.tilingTexture; @@ -6553,6 +6910,13 @@ this.currentBatchSize++; }; + +/** +* +* +* @method flush TODO-Alvin +* +*/ PIXI.WebGLSpriteBatch.prototype.flush = function() { // If the batch is length 0 then return as there is nothing to draw @@ -6589,12 +6953,21 @@ this.renderSession.drawCount++; }; - +/** +* +* @method stop +* +*/ PIXI.WebGLSpriteBatch.prototype.stop = function() { this.flush(); }; +/** +* +* @method start +* +*/ PIXI.WebGLSpriteBatch.prototype.start = function() { var gl = this.gl; @@ -6623,6 +6996,13 @@ } }; +/** +* +* @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) { this.flush(); @@ -6633,6 +7013,10 @@ this.gl.blendFunc(blendModeWebGL[0], blendModeWebGL[1]); }; +/** +* Destroys the SpriteBatch +* @method destroy +*/ PIXI.WebGLSpriteBatch.prototype.destroy = function() { @@ -6702,7 +7086,7 @@ this.shader = null; - this.tempMatrix = PIXI.mat3.create(); + this.matrix this.setContext(gl); }; @@ -6732,8 +7116,10 @@ { this.renderSession = renderSession; this.shader = this.renderSession.shaderManager.fastShader; - - PIXI.mat3.transpose(spriteBatch.worldTransform, this.tempMatrix); + + // PIXI.mat3.transpose(spriteBatch.worldTransform.toArray(), this.tempMatrix); + + this.matrix = spriteBatch.worldTransform.toArray(true) // console.log(this.tempMatrix) this.start(); @@ -6829,8 +7215,8 @@ verticies[index++] = sprite.rotation; // uv - verticies[index++] = uvs[0]; - verticies[index++] = uvs[1]; + verticies[index++] = uvs.x0; + verticies[index++] = uvs.y1; // color verticies[index++] = sprite.alpha; @@ -6850,8 +7236,8 @@ verticies[index++] = sprite.rotation; // uv - verticies[index++] = uvs[2]; - verticies[index++] = uvs[3]; + verticies[index++] = uvs.x1; + verticies[index++] = uvs.y1; // color verticies[index++] = sprite.alpha; @@ -6871,8 +7257,8 @@ verticies[index++] = sprite.rotation; // uv - verticies[index++] = uvs[4]; - verticies[index++] = uvs[5]; + verticies[index++] = uvs.x2; + verticies[index++] = uvs.y2; // color verticies[index++] = sprite.alpha; @@ -6894,8 +7280,8 @@ verticies[index++] = sprite.rotation; // uv - verticies[index++] = uvs[6]; - verticies[index++] = uvs[7]; + verticies[index++] = uvs.x3; + verticies[index++] = uvs.y3; // color verticies[index++] = sprite.alpha; @@ -6910,6 +7296,7 @@ PIXI.WebGLFastSpriteBatch.prototype.flush = function() { + // If the batch is length 0 then return as there is nothing to draw if (this.currentBatchSize===0)return; @@ -6968,7 +7355,7 @@ gl.uniform2f(this.shader.projectionVector, projection.x, projection.y); // set the matrix - gl.uniformMatrix3fv(this.shader.uMatrix, false, this.tempMatrix); + gl.uniformMatrix3fv(this.shader.uMatrix, false, this.matrix); // set the pointers var stride = this.vertSize * 4; @@ -7003,7 +7390,13 @@ * @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) { this.transparent = transparent; @@ -7017,7 +7410,11 @@ }; // API - +/** +* Initialises the context and the properties +* @method setContext +* @param gl {WebGLContext} the current WebGL drawing context +*/ PIXI.WebGLFilterManager.prototype.setContext = function(gl) { this.gl = gl; @@ -7026,6 +7423,12 @@ this.initShaderBuffers(); }; +/** +* +* @method begin +* @param renderSession {RenderSession} +* @param buffer {ArrayBuffer} +*/ PIXI.WebGLFilterManager.prototype.begin = function(renderSession, buffer) { this.renderSession = renderSession; @@ -7038,6 +7441,11 @@ 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) { var gl = this.gl; @@ -7119,6 +7527,10 @@ }; +/** +* Removes the last filter from the filter stack and doesn't return it +* @method popFilter +*/ PIXI.WebGLFilterManager.prototype.popFilter = function() { var gl = this.gl; @@ -7292,6 +7704,15 @@ 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) { // use program @@ -7344,6 +7765,10 @@ this.renderSession.drawCount++; }; +/** +* Initialises the shader buffers +* @method initShaderBuffers +*/ PIXI.WebGLFilterManager.prototype.initShaderBuffers = function() { var gl = this.gl; @@ -7400,6 +7825,10 @@ gl.STATIC_DRAW); }; +/** +* TODO-Alvin +* @method destroy +*/ PIXI.WebGLFilterManager.prototype.destroy = function() { var gl = this.gl; @@ -7422,9 +7851,24 @@ gl.deleteBuffer(this.colorBuffer); gl.deleteBuffer(this.indexBuffer); }; +/** + * @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 @@ -7444,6 +7888,11 @@ this.resize(width, height); }; + +/** +* Clears the filter texture +* @method clear +*/ PIXI.FilterTexture.prototype.clear = function() { var gl = this.gl; @@ -7452,6 +7901,13 @@ 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; @@ -7466,6 +7922,10 @@ }; +/** +* Destroys the filter texture +* @method destroy +*/ PIXI.FilterTexture.prototype.destroy = function() { var gl = this.gl; @@ -7476,7 +7936,6 @@ this.texture = null; }; - /** * @author Mat Groves * @@ -7509,7 +7968,7 @@ var cacheAlpha = maskData.alpha; var transform = maskData.worldTransform; - context.setTransform(transform[0], transform[3], transform[1], transform[4], transform[2], transform[5]); + context.setTransform(transform.a, transform.c, transform.b, transform.d, transform.tx, transform.ty); PIXI.CanvasGraphics.renderGraphicsMask(maskData, context); @@ -7876,7 +8335,7 @@ 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 * @type HTMLCanvasElement 2d Context */ @@ -7949,6 +8408,7 @@ { if(!this.transparent) { + this.context.globalAlpha = 1; this.context.fillStyle = stage.backgroundColorString; this.context.fillRect(0, 0, this.width, this.height); } @@ -8814,7 +9274,7 @@ context.globalCompositeOperation = PIXI.blendModesCanvas[renderSession.currentBlendMode]; } - context.setTransform(transform[0], transform[3], transform[1], transform[4], transform[2], transform[5]); + context.setTransform(transform.a, transform.c, transform.b, transform.d, transform.tx, transform.ty); PIXI.CanvasGraphics.renderGraphics(this, context); // simple render children! @@ -8842,12 +9302,12 @@ var worldTransform = this.worldTransform; - var a = worldTransform[0]; - var b = worldTransform[3]; - var c = worldTransform[1]; - var d = worldTransform[4]; - var tx = worldTransform[2]; - var ty = worldTransform[5]; + var a = worldTransform.a; + var b = worldTransform.c; + var c = worldTransform.b; + var d = worldTransform.d; + var tx = worldTransform.tx; + var ty = worldTransform.ty; var x1 = a * w1 + c * h1 + tx; var y1 = d * h1 + b * w1 + ty; @@ -9525,7 +9985,7 @@ // allow for trimming - context.setTransform(transform[0], transform[3], transform[1], transform[4], transform[2], transform[5]); + context.setTransform(transform.a, transform.c, transform.b, transform.d, transform.tx, transform.ty); if(!this.__tilePattern) @@ -9583,13 +10043,13 @@ var worldTransform = this.worldTransform; - var a = worldTransform[0]; - var b = worldTransform[3]; - var c = worldTransform[1]; - var d = worldTransform[4]; - var tx = worldTransform[2]; - var ty = worldTransform[5]; - + var a = worldTransform.a; + var b = worldTransform.c; + var c = worldTransform.b; + var d = worldTransform.d; + var tx = worldTransform.tx; + var ty = worldTransform.ty; + var x1 = a * w1 + c * h1 + tx; var y1 = d * h1 + b * w1 + ty; @@ -11189,6 +11649,7 @@ * @uses EventTarget * @constructor * @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) { @@ -11501,23 +11962,23 @@ PIXI.Texture.prototype._updateWebGLuvs = function() { - if(!this._uvs)this._uvs = new Float32Array(8); + if(!this._uvs)this._uvs = new PIXI.TextureUvs(); var frame = this.frame; var tw = this.baseTexture.width; var th = this.baseTexture.height; - this._uvs[0] = frame.x / tw; - this._uvs[1] = frame.y / th; + this._uvs.x0 = frame.x / tw; + this._uvs.y0 = frame.y / th; - this._uvs[2] = (frame.x + frame.width) / tw; - this._uvs[3] = frame.y / th; + this._uvs.x1 = (frame.x + frame.width) / tw; + this._uvs.y1 = frame.y / th; - this._uvs[4] = (frame.x + frame.width) / tw; - this._uvs[5] = (frame.y + frame.height) / th; + this._uvs.x2 = (frame.x + frame.width) / tw; + this._uvs.y2 = (frame.y + frame.height) / th; - this._uvs[6] = frame.x / tw; - this._uvs[7] = (frame.y + frame.height) / th; + this._uvs.x3 = frame.x / tw; + this._uvs.y3 = (frame.y + frame.height) / th; }; /** @@ -11608,6 +12069,28 @@ // this is more for webGL.. it contains updated frames.. PIXI.Texture.frameUpdates = []; +PIXI.TextureUvs = function() +{ + this.x0 = 0; + this.y0 = 0; + + this.x1 = 0; + this.y1 = 0; + + this.x2 = 0; + this.y2 = 0; + + this.x3 = 0; + this.y4 = 0; + + +} + + + + + + /** * @author Mat Groves http://matgroves.com/ @Doormat23 */ @@ -12606,7 +13089,7 @@ */ PIXI.BitmapFontLoader.prototype.load = function() { - this.ajaxRequest = new XMLHttpRequest(); + this.ajaxRequest = new PIXI.ajaxRequest(); var scope = this; this.ajaxRequest.onreadystatechange = function() { @@ -12619,7 +13102,7 @@ }; /** - * Invoked when XML file is loaded, parses the data + * Invoked when the XML file is loaded, parses the data * * @method onXMLLoaded * @private diff --git a/src/pixi/InteractionManager.js b/src/pixi/InteractionManager.js index a7072d6..98ac26c 100644 --- a/src/pixi/InteractionManager.js +++ b/src/pixi/InteractionManager.js @@ -454,8 +454,8 @@ var isSprite = (item instanceof PIXI.Sprite), worldTransform = item.worldTransform, - a00 = worldTransform[0], a01 = worldTransform[1], a02 = worldTransform[2], - a10 = worldTransform[3], a11 = worldTransform[4], a12 = worldTransform[5], + a00 = worldTransform.a, a01 = worldTransform.b, a02 = worldTransform.tx, + a10 = worldTransform.c, a11 = worldTransform.d, a12 = worldTransform.ty, id = 1 / (a00 * a11 + a01 * -a10), x = a11 * id * global.x + -a01 * id * global.y + (a12 * a01 - a02 * a11) * id, y = a00 * id * global.y + -a10 * id * global.x + (-a12 * a00 + a02 * a10) * id; diff --git a/src/pixi/core/Matrix.js b/src/pixi/core/Matrix.js index b88735c..5c4c103 100644 --- a/src/pixi/core/Matrix.js +++ b/src/pixi/core/Matrix.js @@ -12,7 +12,7 @@ return (typeof Float32Array !== 'undefined') ? Float32Array : Array; }; -PIXI.Matrix = PIXI.determineMatrixArrayType(); +PIXI.Matrix2 = PIXI.determineMatrixArrayType(); /** @@ -33,7 +33,7 @@ */ PIXI.mat3.create = function() { - var matrix = new PIXI.Matrix(9); + var matrix = new PIXI.Matrix2(9); matrix[0] = 1; matrix[1] = 0; @@ -118,7 +118,7 @@ */ PIXI.mat3.clone = function(mat) { - var matrix = new PIXI.Matrix(9); + var matrix = new PIXI.Matrix2(9); matrix[0] = mat[0]; matrix[1] = mat[1]; @@ -217,7 +217,7 @@ */ PIXI.mat4.create = function() { - var matrix = new PIXI.Matrix(16); + var matrix = new PIXI.Matrix2(16); matrix[0] = 1; matrix[1] = 0; @@ -349,4 +349,61 @@ }; PIXI.identityMatrix = PIXI.mat3.create(); -PIXI.tempMatrix = PIXI.mat3.create(); \ No newline at end of file +PIXI.tempMatrix = PIXI.mat3.create(); + +PIXI.Matrix = function() +{ + this.a = 1; + this.b = 0; + this.c = 0; + this.d = 1; + this.tx = 0; + this.ty = 0; + + +} + +PIXI.Matrix.prototype.fromArray = function(array) +{ + + this.a = array[0]; + this.b = array[1]; + this.c = array[3]; + this.d = array[4]; + this.tx = array[2]; + this.ty = array[5]; + +} + +PIXI.Matrix.prototype.toArray = function(transpose) +{ + if(!this.array)this.array = new Float32Array(9); + var array = this.array; + + if(transpose) + { + this.array[0] = this.a; + this.array[1] = this.c; + this.array[2] = 0; + this.array[3] = this.b; + this.array[4] = this.d; + this.array[5] = 0; + this.array[6] = this.tx; + this.array[7] = this.ty; + this.array[8] = 1; + } + else + { + this.array[0] = this.a; + this.array[1] = this.b; + this.array[2] = this.tx; + this.array[3] = this.c; + this.array[4] = this.d; + this.array[5] = this.ty; + this.array[6] = 0; + this.array[7] = 0; + this.array[8] = 1; + } + + return array;//[this.a, this.b, this.tx, this.c, this.d, this.ty, 0, 0, 1]; +} diff --git a/src/pixi/display/DisplayObject.js b/src/pixi/display/DisplayObject.js index b6da1a6..32d34a9 100644 --- a/src/pixi/display/DisplayObject.js +++ b/src/pixi/display/DisplayObject.js @@ -139,7 +139,7 @@ * @readOnly * @private */ - this.worldTransform = PIXI.mat3.create(); //mat3.identity(); + this.worldTransform = new PIXI.Matrix()//PIXI.mat3.create(); //mat3.identity(); /** * [read-only] Current transform of the object locally @@ -149,7 +149,7 @@ * @readOnly * @private */ - this.localTransform = PIXI.mat3.create(); //mat3.identity(); + this.localTransform = new PIXI.Matrix()//PIXI.mat3.create(); //mat3.identity(); /** * [NYI] Unknown @@ -407,40 +407,30 @@ this._cr = Math.cos(this.rotation); } - var localTransform = this.localTransform; - var parentTransform = this.parent.worldTransform; - var worldTransform = this.worldTransform; + // var localTransform = this.localTransform//.toArray(); + var parentTransform = this.parent.worldTransform//.toArray(); + var worldTransform = this.worldTransform//.toArray(); //console.log(localTransform) - localTransform[0] = this._cr * this.scale.x; - localTransform[1] = -this._sr * this.scale.y; - localTransform[3] = this._sr * this.scale.x; - localTransform[4] = this._cr * this.scale.y; - - // TODO --> do we even need a local matrix??? - var px = this.pivot.x; var py = this.pivot.y; - // Cache the matrix values (makes for huge speed increases!) - var a00 = localTransform[0], a01 = localTransform[1], a02 = this.position.x - localTransform[0] * px - py * localTransform[1], - a10 = localTransform[3], a11 = localTransform[4], a12 = this.position.y - localTransform[4] * py - px * localTransform[3], + var a00 = this._cr * this.scale.x, + a01 = -this._sr * this.scale.y, + a10 = this._sr * this.scale.x, + a11 = this._cr * this.scale.y, + a02 = this.position.x + a00 * px - py * a01, + a12 = this.position.y + a11 * py - px * a10, + b00 = parentTransform.a, b01 = parentTransform.b, b02 = parentTransform.tx, + b10 = parentTransform.c, b11 = parentTransform.d, b12 = parentTransform.ty; - b00 = parentTransform[0], b01 = parentTransform[1], b02 = parentTransform[2], - b10 = parentTransform[3], b11 = parentTransform[4], b12 = parentTransform[5]; + worldTransform.a = b00 * a00 + b01 * a10; + worldTransform.b = b00 * a01 + b01 * a11; + worldTransform.tx = b00 * a02 + b01 * a12 + b02; - localTransform[2] = a02; - localTransform[5] = a12; + worldTransform.c = b10 * a00 + b11 * a10; + worldTransform.d = b10 * a01 + b11 * a11; + worldTransform.ty = b10 * a02 + b11 * a12 + b12; - worldTransform[0] = b00 * a00 + b01 * a10; - worldTransform[1] = b00 * a01 + b01 * a11; - worldTransform[2] = b00 * a02 + b01 * a12 + b02; - - worldTransform[3] = b10 * a00 + b11 * a10; - worldTransform[4] = b10 * a01 + b11 * a11; - worldTransform[5] = b10 * a02 + b11 * a12 + b12; - - // because we are using affine transformation, we can optimise the matrix concatenation process.. wooo! - // mat3.multiply(this.localTransform, this.parent.worldTransform, this.worldTransform); this.worldAlpha = this.alpha * this.parent.worldAlpha; }; diff --git a/src/pixi/display/Sprite.js b/src/pixi/display/Sprite.js index 9bc9cec..35b4235 100644 --- a/src/pixi/display/Sprite.js +++ b/src/pixi/display/Sprite.js @@ -184,12 +184,12 @@ var worldTransform = this.worldTransform; - var a = worldTransform[0]; - var b = worldTransform[3]; - var c = worldTransform[1]; - var d = worldTransform[4]; - var tx = worldTransform[2]; - var ty = worldTransform[5]; + var a = worldTransform.a; + var b = worldTransform.c; + var c = worldTransform.b; + var d = worldTransform.d; + var tx = worldTransform.tx; + var ty = worldTransform.ty; var x1 = a * w1 + c * h1 + tx; var y1 = d * h1 + b * w1 + ty; @@ -345,7 +345,7 @@ // allow for trimming - context.setTransform(transform[0], transform[3], transform[1], transform[4], transform[2], transform[5]); + context.setTransform(transform.a, transform.c, transform.b, transform.d, transform.tx, transform.ty); //if smoothingEnabled is supported and we need to change the smoothing property for this texture if(renderSession.smoothProperty && renderSession.scaleMode !== this.texture.baseTexture.scaleMode) { diff --git a/bin/pixi.dev.js b/bin/pixi.dev.js index 8558d80..45e6eba 100644 --- a/bin/pixi.dev.js +++ b/bin/pixi.dev.js @@ -1,10 +1,10 @@ /** * @license * pixi.js - v1.4.3 - * Copyright (c) 2012, Mat Groves + * Copyright (c) 2012-2014, Mat Groves * http://goodboydigital.com/ * - * Compiled: 2014-01-28 + * Compiled: 2014-01-30 * * pixi.js is licensed under the MIT License. * http://www.opensource.org/licenses/mit-license.php @@ -461,7 +461,7 @@ return (typeof Float32Array !== 'undefined') ? Float32Array : Array; }; -PIXI.Matrix = PIXI.determineMatrixArrayType(); +PIXI.Matrix2 = PIXI.determineMatrixArrayType(); /** @@ -482,7 +482,7 @@ */ PIXI.mat3.create = function() { - var matrix = new PIXI.Matrix(9); + var matrix = new PIXI.Matrix2(9); matrix[0] = 1; matrix[1] = 0; @@ -567,7 +567,7 @@ */ PIXI.mat3.clone = function(mat) { - var matrix = new PIXI.Matrix(9); + var matrix = new PIXI.Matrix2(9); matrix[0] = mat[0]; matrix[1] = mat[1]; @@ -666,7 +666,7 @@ */ PIXI.mat4.create = function() { - var matrix = new PIXI.Matrix(16); + var matrix = new PIXI.Matrix2(16); matrix[0] = 1; matrix[1] = 0; @@ -799,6 +799,64 @@ PIXI.identityMatrix = PIXI.mat3.create(); PIXI.tempMatrix = PIXI.mat3.create(); + +PIXI.Matrix = function() +{ + this.a = 1; + this.b = 0; + this.c = 0; + this.d = 1; + this.tx = 0; + this.ty = 0; + + +} + +PIXI.Matrix.prototype.fromArray = function(array) +{ + + this.a = array[0]; + this.b = array[1]; + this.c = array[3]; + this.d = array[4]; + this.tx = array[2]; + this.ty = array[5]; + +} + +PIXI.Matrix.prototype.toArray = function(transpose) +{ + if(!this.array)this.array = new Float32Array(9); + var array = this.array; + + if(transpose) + { + this.array[0] = this.a; + this.array[1] = this.c; + this.array[2] = 0; + this.array[3] = this.b; + this.array[4] = this.d; + this.array[5] = 0; + this.array[6] = this.tx; + this.array[7] = this.ty; + this.array[8] = 1; + } + else + { + this.array[0] = this.a; + this.array[1] = this.b; + this.array[2] = this.tx; + this.array[3] = this.c; + this.array[4] = this.d; + this.array[5] = this.ty; + this.array[6] = 0; + this.array[7] = 0; + this.array[8] = 1; + } + + return array;//[this.a, this.b, this.tx, this.c, this.d, this.ty, 0, 0, 1]; +} + /** * @author Mat Groves http://matgroves.com/ @Doormat23 */ @@ -940,7 +998,7 @@ * @readOnly * @private */ - this.worldTransform = PIXI.mat3.create(); //mat3.identity(); + this.worldTransform = new PIXI.Matrix()//PIXI.mat3.create(); //mat3.identity(); /** * [read-only] Current transform of the object locally @@ -950,7 +1008,7 @@ * @readOnly * @private */ - this.localTransform = PIXI.mat3.create(); //mat3.identity(); + this.localTransform = new PIXI.Matrix()//PIXI.mat3.create(); //mat3.identity(); /** * [NYI] Unknown @@ -1208,40 +1266,30 @@ this._cr = Math.cos(this.rotation); } - var localTransform = this.localTransform; - var parentTransform = this.parent.worldTransform; - var worldTransform = this.worldTransform; + // var localTransform = this.localTransform//.toArray(); + var parentTransform = this.parent.worldTransform//.toArray(); + var worldTransform = this.worldTransform//.toArray(); //console.log(localTransform) - localTransform[0] = this._cr * this.scale.x; - localTransform[1] = -this._sr * this.scale.y; - localTransform[3] = this._sr * this.scale.x; - localTransform[4] = this._cr * this.scale.y; - - // TODO --> do we even need a local matrix??? - var px = this.pivot.x; var py = this.pivot.y; - // Cache the matrix values (makes for huge speed increases!) - var a00 = localTransform[0], a01 = localTransform[1], a02 = this.position.x - localTransform[0] * px - py * localTransform[1], - a10 = localTransform[3], a11 = localTransform[4], a12 = this.position.y - localTransform[4] * py - px * localTransform[3], + var a00 = this._cr * this.scale.x, + a01 = -this._sr * this.scale.y, + a10 = this._sr * this.scale.x, + a11 = this._cr * this.scale.y, + a02 = this.position.x + a00 * px - py * a01, + a12 = this.position.y + a11 * py - px * a10, + b00 = parentTransform.a, b01 = parentTransform.b, b02 = parentTransform.tx, + b10 = parentTransform.c, b11 = parentTransform.d, b12 = parentTransform.ty; - b00 = parentTransform[0], b01 = parentTransform[1], b02 = parentTransform[2], - b10 = parentTransform[3], b11 = parentTransform[4], b12 = parentTransform[5]; + worldTransform.a = b00 * a00 + b01 * a10; + worldTransform.b = b00 * a01 + b01 * a11; + worldTransform.tx = b00 * a02 + b01 * a12 + b02; - localTransform[2] = a02; - localTransform[5] = a12; + worldTransform.c = b10 * a00 + b11 * a10; + worldTransform.d = b10 * a01 + b11 * a11; + worldTransform.ty = b10 * a02 + b11 * a12 + b12; - worldTransform[0] = b00 * a00 + b01 * a10; - worldTransform[1] = b00 * a01 + b01 * a11; - worldTransform[2] = b00 * a02 + b01 * a12 + b02; - - worldTransform[3] = b10 * a00 + b11 * a10; - worldTransform[4] = b10 * a01 + b11 * a11; - worldTransform[5] = b10 * a02 + b11 * a12 + b12; - - // because we are using affine transformation, we can optimise the matrix concatenation process.. wooo! - // mat3.multiply(this.localTransform, this.parent.worldTransform, this.worldTransform); this.worldAlpha = this.alpha * this.parent.worldAlpha; }; @@ -1316,6 +1364,36 @@ // this line is just here to pass jshinting :) renderSession = renderSession; }; + +/** + * The position of the displayObject on the x axis relative to the local coordinates of the parent. + * + * @property x + * @type Number + */ +Object.defineProperty(PIXI.DisplayObject.prototype, 'x', { + get: function() { + return this.position.x; + }, + set: function(value) { + this.position.x = value; + } +}); + +/** + * The position of the displayObject on the y axis relative to the local coordinates of the parent. + * + * @property y + * @type Number + */ +Object.defineProperty(PIXI.DisplayObject.prototype, 'y', { + get: function() { + return this.position.y; + }, + set: function(value) { + this.position.y = value; + } +}); /** * @author Mat Groves http://matgroves.com/ @Doormat23 */ @@ -1534,12 +1612,16 @@ var childMaxX; var childMaxY; + var childVisible = false; + for(var i=0,j=this.children.length; i childMaxY ? maxY : childMaxY; } + if(!childVisible) + return PIXI.EmptyRectangle; + var bounds = this._bounds; bounds.x = minX; @@ -1868,12 +1953,12 @@ var worldTransform = this.worldTransform; - var a = worldTransform[0]; - var b = worldTransform[3]; - var c = worldTransform[1]; - var d = worldTransform[4]; - var tx = worldTransform[2]; - var ty = worldTransform[5]; + var a = worldTransform.a; + var b = worldTransform.c; + var c = worldTransform.b; + var d = worldTransform.d; + var tx = worldTransform.tx; + var ty = worldTransform.ty; var x1 = a * w1 + c * h1 + tx; var y1 = d * h1 + b * w1 + ty; @@ -2029,7 +2114,7 @@ // allow for trimming - context.setTransform(transform[0], transform[3], transform[1], transform[4], transform[2], transform[5]); + context.setTransform(transform.a, transform.c, transform.b, transform.d, transform.tx, transform.ty); //if smoothingEnabled is supported and we need to change the smoothing property for this texture if(renderSession.smoothProperty && renderSession.scaleMode !== this.texture.baseTexture.scaleMode) { @@ -2169,6 +2254,13 @@ PIXI.SpriteBatch.prototype = Object.create( PIXI.DisplayObjectContainer.prototype ); PIXI.SpriteBatch.constructor = PIXI.SpriteBatch; + +/* + * Initialises the spriteBatch + * + * @method initWebGL + * @param gl {WebGLContext} the current WebGL drawing context + */ PIXI.SpriteBatch.prototype.initWebGL = function(gl) { @@ -2234,7 +2326,7 @@ // alow for trimming - context.setTransform(transform[0], transform[3], transform[1], transform[4], transform[2], transform[5]); + context.setTransform(transform.a, transform.c, transform.b, transform.d, transform.tx, transform.ty); context.save(); for (var i = 0; i < this.children.length; i++) { @@ -2264,7 +2356,7 @@ PIXI.DisplayObject.prototype.updateTransform.call(child); transform = child.localTransform; - context.setTransform(transform[0], transform[3], transform[1], transform[4], transform[2], transform[5]); + context.setTransform(transform.a, transform.c, transform.b, transform.d, transform.tx, transform.ty); context.drawImage(texture.baseTexture.source, frame.x, @@ -2484,8 +2576,21 @@ */ PIXI.Text = function(text, style) { + /** + * The canvas element that everything is drawn to + * + * @property canvas + * @type HTMLCanvasElement + */ 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'); + PIXI.Sprite.call(this, PIXI.Texture.fromCanvas(this.canvas)); this.setText(text); @@ -2631,6 +2736,13 @@ this.requiresUpdate = true; }; +/** +* Renders the object using the WebGL renderer +* +* @method _renderWebGL +* @param renderSession {RenderSession} +* @private +*/ PIXI.Text.prototype._renderWebGL = function(renderSession) { if(this.requiresUpdate) @@ -2662,6 +2774,7 @@ /* * http://stackoverflow.com/users/34441/ellisbben * great solution to the problem! + * returns the height of the given font * * @method determineFontHeight * @param fontStyle {Object} @@ -2798,11 +2911,11 @@ /** * 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 - * @param style {Object} The style parameters - * @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 + * @param style {Object} The style parameters, contained as properties of an object */ PIXI.BitmapText.prototype.setStyle = function(style) { @@ -3435,8 +3548,8 @@ var isSprite = (item instanceof PIXI.Sprite), worldTransform = item.worldTransform, - a00 = worldTransform[0], a01 = worldTransform[1], a02 = worldTransform[2], - a10 = worldTransform[3], a11 = worldTransform[4], a12 = worldTransform[5], + a00 = worldTransform.a, a01 = worldTransform.b, a02 = worldTransform.tx, + a10 = worldTransform.c, a11 = worldTransform.d, a12 = worldTransform.ty, id = 1 / (a00 * a11 + a01 * -a10), x = a11 * id * global.x + -a01 * id * global.y + (a12 * a01 - a02 * a11) * id, y = a00 * id * global.y + -a10 * id * global.x + (-a12 * a00 + a02 * a10) * id; @@ -3674,7 +3787,7 @@ * @param backgroundColor {Number} the background color of the stage, you have to pass this in is in hex format * 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); * 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 @@ -3693,7 +3806,7 @@ * @readOnly * @private */ - this.worldTransform = PIXI.mat3.create(); + this.worldTransform = new PIXI.Matrix()//PIXI.mat3.create(); /** * Whether or not the stage is interactive @@ -3901,7 +4014,7 @@ * @class AjaxRequest * @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 @@ -4008,7 +4121,7 @@ * Adds event emitter functionality to a class * * @class EventTarget - * @example + * * function MyEmitter() { * PIXI.EventTarget.call(this); //mixes in event target stuff * } @@ -4018,8 +4131,21 @@ */ PIXI.EventTarget = function () { + /** + * Holds all the listeners + * + * @property listeneners + * @type Object + */ 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 ) { @@ -4036,6 +4162,12 @@ }; + /** + * Fires the event, ie pretends that the event has happened + * + * @method dispatchEvent + * @param event {Event} the event object + */ this.dispatchEvent = this.emit = function ( event ) { if ( !listeners[ event.type ] || !listeners[ event.type ].length ) { @@ -4052,6 +4184,13 @@ }; + /** + * 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 ) { var index = listeners[ type ].indexOf( listener ); @@ -4064,6 +4203,12 @@ }; + /** + * 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 ) { var a = listeners[type]; if (a) @@ -4079,7 +4224,8 @@ * 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 * the browser then this function will return a canvas renderer - * + * @class autoDetectRenderer + * @static * @param width=800 {Number} the width 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 @@ -4149,17 +4295,23 @@ 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 = {}; /** * Triangulates shapes for webGL graphic fills * * @method Triangulate - * @namespace PolyK - * @constructor + * */ PIXI.PolyK.Triangulate = function(p) { @@ -4235,10 +4387,17 @@ }; /** - * Checks if a point is within a triangle + * Checks whether a point is within a triangle * - * @class _PointInTriangle - * @namespace PolyK + * @method _PointInTriangle + * @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 */ PIXI.PolyK._PointInTriangle = function(px, py, ax, ay, bx, by, cx, cy) @@ -4265,10 +4424,10 @@ }; /** - * Checks if a shape is convex + * Checks whether a shape is convex * - * @class _convex - * @namespace PolyK + * @method _convex + * * @private */ PIXI.PolyK._convex = function(ax, ay, bx, by, cx, cy, sign) @@ -4343,6 +4502,10 @@ */ PIXI.PixiShader = function(gl) { + /** + * @property gl + * @type WebGLContext + */ this.gl = gl; /** @@ -4375,7 +4538,9 @@ }; /** -* @method PIXI.PixiShader#init +* Initialises the shader +* @method init +* */ PIXI.PixiShader.prototype.init = function() { @@ -4430,7 +4595,7 @@ * 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 * -* @method PIXI.PixiShader#initUniforms +* @method initUniforms */ PIXI.PixiShader.prototype.initUniforms = function() { @@ -4501,7 +4666,7 @@ /** * 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) { @@ -4542,7 +4707,7 @@ wrapT = gl.REPEAT; } - gl.pixelStorei(gl.UNPACK_FLIP_Y_WEBGL, false); + gl.pixelStorei(gl.UNPACK_FLIP_Y_WEBGL, !!data.flipY); if (data.width) { @@ -4576,7 +4741,7 @@ /** * Updates the shader uniform values. * -* @method PIXI.PixiShader#syncUniforms +* @method syncUniforms */ PIXI.PixiShader.prototype.syncUniforms = function() { @@ -4631,6 +4796,11 @@ }; +/** +* Destroys the shader +* @method destroy +* +*/ PIXI.PixiShader.prototype.destroy = function() { this.gl.deleteProgram( this.program ); @@ -4640,6 +4810,11 @@ this.attributes = null; }; +/** +* +* @property defaultVertexSrc +* @type String +*/ PIXI.PixiShader.defaultVertexSrc = [ 'attribute vec2 aVertexPosition;', 'attribute vec2 aTextureCoord;', @@ -4673,19 +4848,25 @@ /** * @class PIXI.PixiFastShader * @constructor +* @param gl {WebGLContext} the current WebGL drawing context */ PIXI.PixiFastShader = function(gl) { + + /** + * @property gl + * @type WebGLContext + */ this.gl = gl; /** - * @property {any} program - The WebGL program. - */ + * @property {any} program - The WebGL program. + */ this.program = null; /** - * @property {array} fragmentSrc - The fragment shader. - */ + * @property {array} fragmentSrc - The fragment shader. + */ this.fragmentSrc = [ 'precision lowp float;', 'varying vec2 vTextureCoord;', @@ -4696,6 +4877,9 @@ '}' ]; + /** + * @property {array} vertexSrc - The vertex shader + */ this.vertexSrc = [ 'attribute vec2 aVertexPosition;', 'attribute vec2 aPositionCoord;', @@ -4737,7 +4921,9 @@ }; /** -* @method PIXI.PixiFastShader#init +* Initialises the shader +* @method init +* */ PIXI.PixiFastShader.prototype.init = function() { @@ -4787,6 +4973,11 @@ this.program = program; }; +/** +* Destroys the shader +* @method destroy +* +*/ PIXI.PixiFastShader.prototype.destroy = function() { this.gl.deleteProgram( this.program ); @@ -4803,9 +4994,14 @@ PIXI.StripShader = function() { - // the webGL program.. + /** + * @property {any} program - The WebGL program. + */ this.program = null; + /** + * @property {array} fragmentSrc - The fragment shader. + */ this.fragmentSrc = [ 'precision mediump float;', 'varying vec2 vTextureCoord;', @@ -4819,6 +5015,9 @@ '}' ]; + /** + * @property {array} fragmentSrc - The fragment shader. + */ this.vertexSrc = [ 'attribute vec2 aVertexPosition;', 'attribute vec2 aTextureCoord;', @@ -4839,6 +5038,11 @@ ]; }; +/** +* Initialises the shader +* @method init +* +*/ PIXI.StripShader.prototype.init = function() { @@ -4868,14 +5072,28 @@ * @author Mat Groves http://matgroves.com/ @Doormat23 */ - +/** +* @class PrimitiveShader +* @constructor +* @param gl {WebGLContext} the current WebGL drawing context +*/ PIXI.PrimitiveShader = function(gl) { + /** + * @property gl + * @type WebGLContext + */ this.gl = gl; - // the webGL program.. + /** + * @property {any} program - The WebGL program. + */ this.program = null; + /** + * @property fragmentSrc + * @type Array + */ this.fragmentSrc = [ 'precision mediump float;', 'varying vec4 vColor;', @@ -4885,6 +5103,10 @@ '}' ]; + /** + * @property vertexSrc + * @type Array + */ this.vertexSrc = [ 'attribute vec2 aVertexPosition;', 'attribute vec4 aColor;', @@ -4906,6 +5128,11 @@ this.init(); }; +/** +* Initialises the shader +* @method init +* +*/ PIXI.PrimitiveShader.prototype.init = function() { @@ -4932,6 +5159,11 @@ this.program = program; }; +/** +* Destroys the shader +* @method destroy +* +*/ PIXI.PrimitiveShader.prototype.destroy = function() { this.gl.deleteProgram( this.program ); @@ -4948,7 +5180,9 @@ /** * A set of functions used by the webGL renderer to draw the primitive graphics data * - * @class CanvasGraphics + * @class WebGLGraphics + * @private + * @static */ PIXI.WebGLGraphics = function() { @@ -4962,7 +5196,7 @@ * @private * @method renderGraphics * @param graphics {Graphics} - * @param projection {Object} + * @param renderSession {Object} */ PIXI.WebGLGraphics.renderGraphics = function(graphics, renderSession)//projection, offset) { @@ -4999,12 +5233,10 @@ // This could be speeded up for sure! // var m = PIXI.mat3.clone(graphics.worldTransform); - PIXI.mat3.transpose(graphics.worldTransform, PIXI.tempMatrix); - // set the matrix transform gl.blendFunc(gl.ONE, gl.ONE_MINUS_SRC_ALPHA); - gl.uniformMatrix3fv(shader.translationMatrix, false, PIXI.tempMatrix); + gl.uniformMatrix3fv(shader.translationMatrix, false, graphics.worldTransform.toArray(true)); gl.uniform2f(shader.projectionVector, projection.x, -projection.y); gl.uniform2f(shader.offsetVector, -offset.x, -offset.y); @@ -5034,7 +5266,8 @@ * @static * @private * @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) { @@ -5088,7 +5321,7 @@ * @static * @private * @method buildRectangle - * @param graphics {Graphics} + * @param graphicsData {Graphics} The graphics object to draw TODO-Alvin * @param webGLData {Object} */ PIXI.WebGLGraphics.buildRectangle = function(graphicsData, webGLData) @@ -5157,7 +5390,7 @@ * @static * @private * @method buildCircle - * @param graphics {Graphics} + * @param graphicsData {Graphics} The graphics object to draw * @param webGLData {Object} */ PIXI.WebGLGraphics.buildCircle = function(graphicsData, webGLData) @@ -5230,7 +5463,7 @@ * @static * @private * @method buildLine - * @param graphics {Graphics} + * @param graphicsData {Graphics} The graphics object to draw TODO-Alvin * @param webGLData {Object} */ PIXI.WebGLGraphics.buildLine = function(graphicsData, webGLData) @@ -5440,7 +5673,7 @@ * @static * @private * @method buildPoly - * @param graphics {Graphics} + * @param graphicsData {Graphics} The graphics object to draw TODO-Alvin * @param webGLData {Object} */ PIXI.WebGLGraphics.buildPoly = function(graphicsData, webGLData) @@ -6050,6 +6283,13 @@ * @author Mat Groves http://matgroves.com/ @Doormat23 */ + +/** +* @class WebGLMaskManager +* @constructor +* @param gl {WebGLContext} the current WebGL drawing context +* @private +*/ PIXI.WebGLMaskManager = function(gl) { this.maskStack = []; @@ -6058,11 +6298,22 @@ 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) { 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) { var gl = this.gl; @@ -6087,6 +6338,12 @@ 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) { var gl = this.gl; @@ -6110,6 +6367,10 @@ if(this.maskStack.length === 0)gl.disable(gl.STENCIL_TEST); }; +/** +* TODO-Alvin +* @method destroy +*/ PIXI.WebGLMaskManager.prototype.destroy = function() { this.maskStack = null; @@ -6119,6 +6380,12 @@ * @author Mat Groves http://matgroves.com/ @Doormat23 */ +/** +* @class WebGLShaderManager +* @constructor +* @param gl {WebGLContext} the current WebGL drawing context +* @private +*/ PIXI.WebGLShaderManager = function(gl) { @@ -6135,6 +6402,13 @@ //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) { this.gl = gl; @@ -6153,6 +6427,11 @@ }; +/** +* Initialises the context and the properties +* @method setAttribs +* @param attribs {Array} TODO-Alvin +*/ PIXI.WebGLShaderManager.prototype.setAttribs = function(attribs) { // reset temp state @@ -6194,6 +6473,11 @@ // 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) { //if(this.currentShader == shader)return; @@ -6207,6 +6491,10 @@ }; +/** +* Triggers the primitive shader +* @method activatePrimitiveShader +*/ PIXI.WebGLShaderManager.prototype.activatePrimitiveShader = function() { var gl = this.gl; @@ -6217,6 +6505,10 @@ }; +/** +* Disable the primitive shader +* @method deactivatePrimitiveShader +*/ PIXI.WebGLShaderManager.prototype.deactivatePrimitiveShader = function() { var gl = this.gl; @@ -6226,6 +6518,10 @@ this.setAttribs(this.defaultShader.attributes); }; +/** +* Destroys +* @method destroy +*/ PIXI.WebGLShaderManager.prototype.destroy = function() { this.attribState = null; @@ -6252,11 +6548,30 @@ * 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) { - + /** + * TODO-Alvin + * + * @property vertSize + * @type Number + */ this.vertSize = 6; + + /** + * TODO-Alvin + * @property size + * @type Number + */ this.size = 10000;//Math.pow(2, 16) / this.vertSize; // console.log(this.size); @@ -6265,9 +6580,23 @@ //the total number of indices in our batch var numIndices = this.size * 6; - //vertex data + //vertex data + + /** + * Holds the vertices + * + * @property vertices + * @type Float32Array + */ this.vertices = new Float32Array(numVerts); + //index data + /** + * Holds the indices + * + * @property indices + * @type Uint16Array + */ this.indices = new Uint16Array(numIndices); this.lastIndexCount = 0; @@ -6290,6 +6619,12 @@ this.setContext(gl); }; +/** +* +* @method setContext +* +* @param gl {WebGLContext} the current WebGL drawing context +*/ PIXI.WebGLSpriteBatch.prototype.setContext = function(gl) { this.gl = gl; @@ -6311,6 +6646,12 @@ this.currentBlendMode = 99999; }; +/** +* +* @method begin +* +* @param renderSession {RenderSession} the RenderSession +*/ PIXI.WebGLSpriteBatch.prototype.begin = function(renderSession) { this.renderSession = renderSession; @@ -6319,12 +6660,22 @@ this.start(); }; +/** +* +* @method end +* +*/ PIXI.WebGLSpriteBatch.prototype.end = function() { this.flush(); }; - +/** +* +* @method render +* +* @param sprite {Sprite} the sprite to render TODO-Alvin +*/ PIXI.WebGLSpriteBatch.prototype.render = function(sprite) { // check texture.. @@ -6383,21 +6734,21 @@ var index = this.currentBatchSize * 4 * this.vertSize; - var worldTransform = sprite.worldTransform; + var worldTransform = sprite.worldTransform;//.toArray(); - var a = worldTransform[0]; - var b = worldTransform[3]; - var c = worldTransform[1]; - var d = worldTransform[4]; - var tx = worldTransform[2]; - var ty = worldTransform[5]; + var a = worldTransform.a//[0]; + var b = worldTransform.c//[3]; + var c = worldTransform.b//[1]; + var d = worldTransform.d//[4]; + var tx = worldTransform.tx//[2]; + var ty = worldTransform.ty///[5]; // xy verticies[index++] = a * w1 + c * h1 + tx; verticies[index++] = d * h1 + b * w1 + ty; // uv - verticies[index++] = uvs[0]; - verticies[index++] = uvs[1]; + verticies[index++] = uvs.x0; + verticies[index++] = uvs.y0; // color verticies[index++] = alpha; verticies[index++] = tint; @@ -6406,8 +6757,8 @@ verticies[index++] = a * w0 + c * h1 + tx; verticies[index++] = d * h1 + b * w0 + ty; // uv - verticies[index++] = uvs[2]; - verticies[index++] = uvs[3]; + verticies[index++] = uvs.x1; + verticies[index++] = uvs.y1; // color verticies[index++] = alpha; verticies[index++] = tint; @@ -6416,8 +6767,8 @@ verticies[index++] = a * w0 + c * h0 + tx; verticies[index++] = d * h0 + b * w0 + ty; // uv - verticies[index++] = uvs[4]; - verticies[index++] = uvs[5]; + verticies[index++] = uvs.x2; + verticies[index++] = uvs.y2; // color verticies[index++] = alpha; verticies[index++] = tint; @@ -6426,18 +6777,24 @@ verticies[index++] = a * w1 + c * h0 + tx; verticies[index++] = d * h0 + b * w1 + ty; // uv - verticies[index++] = uvs[6]; - verticies[index++] = uvs[7]; + verticies[index++] = uvs.x3; + verticies[index++] = uvs.y3; // color verticies[index++] = alpha; verticies[index++] = tint; - + // increment the batchsize this.currentBatchSize++; }; +/** +* +* @method renderTilingSprite +* +* @param sprite {TilingSprite} the sprite to render TODO-Alvin +*/ PIXI.WebGLSpriteBatch.prototype.renderTilingSprite = function(tilingSprite) { var texture = tilingSprite.tilingTexture; @@ -6553,6 +6910,13 @@ this.currentBatchSize++; }; + +/** +* +* +* @method flush TODO-Alvin +* +*/ PIXI.WebGLSpriteBatch.prototype.flush = function() { // If the batch is length 0 then return as there is nothing to draw @@ -6589,12 +6953,21 @@ this.renderSession.drawCount++; }; - +/** +* +* @method stop +* +*/ PIXI.WebGLSpriteBatch.prototype.stop = function() { this.flush(); }; +/** +* +* @method start +* +*/ PIXI.WebGLSpriteBatch.prototype.start = function() { var gl = this.gl; @@ -6623,6 +6996,13 @@ } }; +/** +* +* @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) { this.flush(); @@ -6633,6 +7013,10 @@ this.gl.blendFunc(blendModeWebGL[0], blendModeWebGL[1]); }; +/** +* Destroys the SpriteBatch +* @method destroy +*/ PIXI.WebGLSpriteBatch.prototype.destroy = function() { @@ -6702,7 +7086,7 @@ this.shader = null; - this.tempMatrix = PIXI.mat3.create(); + this.matrix this.setContext(gl); }; @@ -6732,8 +7116,10 @@ { this.renderSession = renderSession; this.shader = this.renderSession.shaderManager.fastShader; - - PIXI.mat3.transpose(spriteBatch.worldTransform, this.tempMatrix); + + // PIXI.mat3.transpose(spriteBatch.worldTransform.toArray(), this.tempMatrix); + + this.matrix = spriteBatch.worldTransform.toArray(true) // console.log(this.tempMatrix) this.start(); @@ -6829,8 +7215,8 @@ verticies[index++] = sprite.rotation; // uv - verticies[index++] = uvs[0]; - verticies[index++] = uvs[1]; + verticies[index++] = uvs.x0; + verticies[index++] = uvs.y1; // color verticies[index++] = sprite.alpha; @@ -6850,8 +7236,8 @@ verticies[index++] = sprite.rotation; // uv - verticies[index++] = uvs[2]; - verticies[index++] = uvs[3]; + verticies[index++] = uvs.x1; + verticies[index++] = uvs.y1; // color verticies[index++] = sprite.alpha; @@ -6871,8 +7257,8 @@ verticies[index++] = sprite.rotation; // uv - verticies[index++] = uvs[4]; - verticies[index++] = uvs[5]; + verticies[index++] = uvs.x2; + verticies[index++] = uvs.y2; // color verticies[index++] = sprite.alpha; @@ -6894,8 +7280,8 @@ verticies[index++] = sprite.rotation; // uv - verticies[index++] = uvs[6]; - verticies[index++] = uvs[7]; + verticies[index++] = uvs.x3; + verticies[index++] = uvs.y3; // color verticies[index++] = sprite.alpha; @@ -6910,6 +7296,7 @@ PIXI.WebGLFastSpriteBatch.prototype.flush = function() { + // If the batch is length 0 then return as there is nothing to draw if (this.currentBatchSize===0)return; @@ -6968,7 +7355,7 @@ gl.uniform2f(this.shader.projectionVector, projection.x, projection.y); // set the matrix - gl.uniformMatrix3fv(this.shader.uMatrix, false, this.tempMatrix); + gl.uniformMatrix3fv(this.shader.uMatrix, false, this.matrix); // set the pointers var stride = this.vertSize * 4; @@ -7003,7 +7390,13 @@ * @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) { this.transparent = transparent; @@ -7017,7 +7410,11 @@ }; // API - +/** +* Initialises the context and the properties +* @method setContext +* @param gl {WebGLContext} the current WebGL drawing context +*/ PIXI.WebGLFilterManager.prototype.setContext = function(gl) { this.gl = gl; @@ -7026,6 +7423,12 @@ this.initShaderBuffers(); }; +/** +* +* @method begin +* @param renderSession {RenderSession} +* @param buffer {ArrayBuffer} +*/ PIXI.WebGLFilterManager.prototype.begin = function(renderSession, buffer) { this.renderSession = renderSession; @@ -7038,6 +7441,11 @@ 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) { var gl = this.gl; @@ -7119,6 +7527,10 @@ }; +/** +* Removes the last filter from the filter stack and doesn't return it +* @method popFilter +*/ PIXI.WebGLFilterManager.prototype.popFilter = function() { var gl = this.gl; @@ -7292,6 +7704,15 @@ 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) { // use program @@ -7344,6 +7765,10 @@ this.renderSession.drawCount++; }; +/** +* Initialises the shader buffers +* @method initShaderBuffers +*/ PIXI.WebGLFilterManager.prototype.initShaderBuffers = function() { var gl = this.gl; @@ -7400,6 +7825,10 @@ gl.STATIC_DRAW); }; +/** +* TODO-Alvin +* @method destroy +*/ PIXI.WebGLFilterManager.prototype.destroy = function() { var gl = this.gl; @@ -7422,9 +7851,24 @@ gl.deleteBuffer(this.colorBuffer); gl.deleteBuffer(this.indexBuffer); }; +/** + * @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 @@ -7444,6 +7888,11 @@ this.resize(width, height); }; + +/** +* Clears the filter texture +* @method clear +*/ PIXI.FilterTexture.prototype.clear = function() { var gl = this.gl; @@ -7452,6 +7901,13 @@ 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; @@ -7466,6 +7922,10 @@ }; +/** +* Destroys the filter texture +* @method destroy +*/ PIXI.FilterTexture.prototype.destroy = function() { var gl = this.gl; @@ -7476,7 +7936,6 @@ this.texture = null; }; - /** * @author Mat Groves * @@ -7509,7 +7968,7 @@ var cacheAlpha = maskData.alpha; var transform = maskData.worldTransform; - context.setTransform(transform[0], transform[3], transform[1], transform[4], transform[2], transform[5]); + context.setTransform(transform.a, transform.c, transform.b, transform.d, transform.tx, transform.ty); PIXI.CanvasGraphics.renderGraphicsMask(maskData, context); @@ -7876,7 +8335,7 @@ 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 * @type HTMLCanvasElement 2d Context */ @@ -7949,6 +8408,7 @@ { if(!this.transparent) { + this.context.globalAlpha = 1; this.context.fillStyle = stage.backgroundColorString; this.context.fillRect(0, 0, this.width, this.height); } @@ -8814,7 +9274,7 @@ context.globalCompositeOperation = PIXI.blendModesCanvas[renderSession.currentBlendMode]; } - context.setTransform(transform[0], transform[3], transform[1], transform[4], transform[2], transform[5]); + context.setTransform(transform.a, transform.c, transform.b, transform.d, transform.tx, transform.ty); PIXI.CanvasGraphics.renderGraphics(this, context); // simple render children! @@ -8842,12 +9302,12 @@ var worldTransform = this.worldTransform; - var a = worldTransform[0]; - var b = worldTransform[3]; - var c = worldTransform[1]; - var d = worldTransform[4]; - var tx = worldTransform[2]; - var ty = worldTransform[5]; + var a = worldTransform.a; + var b = worldTransform.c; + var c = worldTransform.b; + var d = worldTransform.d; + var tx = worldTransform.tx; + var ty = worldTransform.ty; var x1 = a * w1 + c * h1 + tx; var y1 = d * h1 + b * w1 + ty; @@ -9525,7 +9985,7 @@ // allow for trimming - context.setTransform(transform[0], transform[3], transform[1], transform[4], transform[2], transform[5]); + context.setTransform(transform.a, transform.c, transform.b, transform.d, transform.tx, transform.ty); if(!this.__tilePattern) @@ -9583,13 +10043,13 @@ var worldTransform = this.worldTransform; - var a = worldTransform[0]; - var b = worldTransform[3]; - var c = worldTransform[1]; - var d = worldTransform[4]; - var tx = worldTransform[2]; - var ty = worldTransform[5]; - + var a = worldTransform.a; + var b = worldTransform.c; + var c = worldTransform.b; + var d = worldTransform.d; + var tx = worldTransform.tx; + var ty = worldTransform.ty; + var x1 = a * w1 + c * h1 + tx; var y1 = d * h1 + b * w1 + ty; @@ -11189,6 +11649,7 @@ * @uses EventTarget * @constructor * @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) { @@ -11501,23 +11962,23 @@ PIXI.Texture.prototype._updateWebGLuvs = function() { - if(!this._uvs)this._uvs = new Float32Array(8); + if(!this._uvs)this._uvs = new PIXI.TextureUvs(); var frame = this.frame; var tw = this.baseTexture.width; var th = this.baseTexture.height; - this._uvs[0] = frame.x / tw; - this._uvs[1] = frame.y / th; + this._uvs.x0 = frame.x / tw; + this._uvs.y0 = frame.y / th; - this._uvs[2] = (frame.x + frame.width) / tw; - this._uvs[3] = frame.y / th; + this._uvs.x1 = (frame.x + frame.width) / tw; + this._uvs.y1 = frame.y / th; - this._uvs[4] = (frame.x + frame.width) / tw; - this._uvs[5] = (frame.y + frame.height) / th; + this._uvs.x2 = (frame.x + frame.width) / tw; + this._uvs.y2 = (frame.y + frame.height) / th; - this._uvs[6] = frame.x / tw; - this._uvs[7] = (frame.y + frame.height) / th; + this._uvs.x3 = frame.x / tw; + this._uvs.y3 = (frame.y + frame.height) / th; }; /** @@ -11608,6 +12069,28 @@ // this is more for webGL.. it contains updated frames.. PIXI.Texture.frameUpdates = []; +PIXI.TextureUvs = function() +{ + this.x0 = 0; + this.y0 = 0; + + this.x1 = 0; + this.y1 = 0; + + this.x2 = 0; + this.y2 = 0; + + this.x3 = 0; + this.y4 = 0; + + +} + + + + + + /** * @author Mat Groves http://matgroves.com/ @Doormat23 */ @@ -12606,7 +13089,7 @@ */ PIXI.BitmapFontLoader.prototype.load = function() { - this.ajaxRequest = new XMLHttpRequest(); + this.ajaxRequest = new PIXI.ajaxRequest(); var scope = this; this.ajaxRequest.onreadystatechange = function() { @@ -12619,7 +13102,7 @@ }; /** - * Invoked when XML file is loaded, parses the data + * Invoked when the XML file is loaded, parses the data * * @method onXMLLoaded * @private diff --git a/src/pixi/InteractionManager.js b/src/pixi/InteractionManager.js index a7072d6..98ac26c 100644 --- a/src/pixi/InteractionManager.js +++ b/src/pixi/InteractionManager.js @@ -454,8 +454,8 @@ var isSprite = (item instanceof PIXI.Sprite), worldTransform = item.worldTransform, - a00 = worldTransform[0], a01 = worldTransform[1], a02 = worldTransform[2], - a10 = worldTransform[3], a11 = worldTransform[4], a12 = worldTransform[5], + a00 = worldTransform.a, a01 = worldTransform.b, a02 = worldTransform.tx, + a10 = worldTransform.c, a11 = worldTransform.d, a12 = worldTransform.ty, id = 1 / (a00 * a11 + a01 * -a10), x = a11 * id * global.x + -a01 * id * global.y + (a12 * a01 - a02 * a11) * id, y = a00 * id * global.y + -a10 * id * global.x + (-a12 * a00 + a02 * a10) * id; diff --git a/src/pixi/core/Matrix.js b/src/pixi/core/Matrix.js index b88735c..5c4c103 100644 --- a/src/pixi/core/Matrix.js +++ b/src/pixi/core/Matrix.js @@ -12,7 +12,7 @@ return (typeof Float32Array !== 'undefined') ? Float32Array : Array; }; -PIXI.Matrix = PIXI.determineMatrixArrayType(); +PIXI.Matrix2 = PIXI.determineMatrixArrayType(); /** @@ -33,7 +33,7 @@ */ PIXI.mat3.create = function() { - var matrix = new PIXI.Matrix(9); + var matrix = new PIXI.Matrix2(9); matrix[0] = 1; matrix[1] = 0; @@ -118,7 +118,7 @@ */ PIXI.mat3.clone = function(mat) { - var matrix = new PIXI.Matrix(9); + var matrix = new PIXI.Matrix2(9); matrix[0] = mat[0]; matrix[1] = mat[1]; @@ -217,7 +217,7 @@ */ PIXI.mat4.create = function() { - var matrix = new PIXI.Matrix(16); + var matrix = new PIXI.Matrix2(16); matrix[0] = 1; matrix[1] = 0; @@ -349,4 +349,61 @@ }; PIXI.identityMatrix = PIXI.mat3.create(); -PIXI.tempMatrix = PIXI.mat3.create(); \ No newline at end of file +PIXI.tempMatrix = PIXI.mat3.create(); + +PIXI.Matrix = function() +{ + this.a = 1; + this.b = 0; + this.c = 0; + this.d = 1; + this.tx = 0; + this.ty = 0; + + +} + +PIXI.Matrix.prototype.fromArray = function(array) +{ + + this.a = array[0]; + this.b = array[1]; + this.c = array[3]; + this.d = array[4]; + this.tx = array[2]; + this.ty = array[5]; + +} + +PIXI.Matrix.prototype.toArray = function(transpose) +{ + if(!this.array)this.array = new Float32Array(9); + var array = this.array; + + if(transpose) + { + this.array[0] = this.a; + this.array[1] = this.c; + this.array[2] = 0; + this.array[3] = this.b; + this.array[4] = this.d; + this.array[5] = 0; + this.array[6] = this.tx; + this.array[7] = this.ty; + this.array[8] = 1; + } + else + { + this.array[0] = this.a; + this.array[1] = this.b; + this.array[2] = this.tx; + this.array[3] = this.c; + this.array[4] = this.d; + this.array[5] = this.ty; + this.array[6] = 0; + this.array[7] = 0; + this.array[8] = 1; + } + + return array;//[this.a, this.b, this.tx, this.c, this.d, this.ty, 0, 0, 1]; +} diff --git a/src/pixi/display/DisplayObject.js b/src/pixi/display/DisplayObject.js index b6da1a6..32d34a9 100644 --- a/src/pixi/display/DisplayObject.js +++ b/src/pixi/display/DisplayObject.js @@ -139,7 +139,7 @@ * @readOnly * @private */ - this.worldTransform = PIXI.mat3.create(); //mat3.identity(); + this.worldTransform = new PIXI.Matrix()//PIXI.mat3.create(); //mat3.identity(); /** * [read-only] Current transform of the object locally @@ -149,7 +149,7 @@ * @readOnly * @private */ - this.localTransform = PIXI.mat3.create(); //mat3.identity(); + this.localTransform = new PIXI.Matrix()//PIXI.mat3.create(); //mat3.identity(); /** * [NYI] Unknown @@ -407,40 +407,30 @@ this._cr = Math.cos(this.rotation); } - var localTransform = this.localTransform; - var parentTransform = this.parent.worldTransform; - var worldTransform = this.worldTransform; + // var localTransform = this.localTransform//.toArray(); + var parentTransform = this.parent.worldTransform//.toArray(); + var worldTransform = this.worldTransform//.toArray(); //console.log(localTransform) - localTransform[0] = this._cr * this.scale.x; - localTransform[1] = -this._sr * this.scale.y; - localTransform[3] = this._sr * this.scale.x; - localTransform[4] = this._cr * this.scale.y; - - // TODO --> do we even need a local matrix??? - var px = this.pivot.x; var py = this.pivot.y; - // Cache the matrix values (makes for huge speed increases!) - var a00 = localTransform[0], a01 = localTransform[1], a02 = this.position.x - localTransform[0] * px - py * localTransform[1], - a10 = localTransform[3], a11 = localTransform[4], a12 = this.position.y - localTransform[4] * py - px * localTransform[3], + var a00 = this._cr * this.scale.x, + a01 = -this._sr * this.scale.y, + a10 = this._sr * this.scale.x, + a11 = this._cr * this.scale.y, + a02 = this.position.x + a00 * px - py * a01, + a12 = this.position.y + a11 * py - px * a10, + b00 = parentTransform.a, b01 = parentTransform.b, b02 = parentTransform.tx, + b10 = parentTransform.c, b11 = parentTransform.d, b12 = parentTransform.ty; - b00 = parentTransform[0], b01 = parentTransform[1], b02 = parentTransform[2], - b10 = parentTransform[3], b11 = parentTransform[4], b12 = parentTransform[5]; + worldTransform.a = b00 * a00 + b01 * a10; + worldTransform.b = b00 * a01 + b01 * a11; + worldTransform.tx = b00 * a02 + b01 * a12 + b02; - localTransform[2] = a02; - localTransform[5] = a12; + worldTransform.c = b10 * a00 + b11 * a10; + worldTransform.d = b10 * a01 + b11 * a11; + worldTransform.ty = b10 * a02 + b11 * a12 + b12; - worldTransform[0] = b00 * a00 + b01 * a10; - worldTransform[1] = b00 * a01 + b01 * a11; - worldTransform[2] = b00 * a02 + b01 * a12 + b02; - - worldTransform[3] = b10 * a00 + b11 * a10; - worldTransform[4] = b10 * a01 + b11 * a11; - worldTransform[5] = b10 * a02 + b11 * a12 + b12; - - // because we are using affine transformation, we can optimise the matrix concatenation process.. wooo! - // mat3.multiply(this.localTransform, this.parent.worldTransform, this.worldTransform); this.worldAlpha = this.alpha * this.parent.worldAlpha; }; diff --git a/src/pixi/display/Sprite.js b/src/pixi/display/Sprite.js index 9bc9cec..35b4235 100644 --- a/src/pixi/display/Sprite.js +++ b/src/pixi/display/Sprite.js @@ -184,12 +184,12 @@ var worldTransform = this.worldTransform; - var a = worldTransform[0]; - var b = worldTransform[3]; - var c = worldTransform[1]; - var d = worldTransform[4]; - var tx = worldTransform[2]; - var ty = worldTransform[5]; + var a = worldTransform.a; + var b = worldTransform.c; + var c = worldTransform.b; + var d = worldTransform.d; + var tx = worldTransform.tx; + var ty = worldTransform.ty; var x1 = a * w1 + c * h1 + tx; var y1 = d * h1 + b * w1 + ty; @@ -345,7 +345,7 @@ // allow for trimming - context.setTransform(transform[0], transform[3], transform[1], transform[4], transform[2], transform[5]); + context.setTransform(transform.a, transform.c, transform.b, transform.d, transform.tx, transform.ty); //if smoothingEnabled is supported and we need to change the smoothing property for this texture if(renderSession.smoothProperty && renderSession.scaleMode !== this.texture.baseTexture.scaleMode) { diff --git a/src/pixi/display/SpriteBatch.js b/src/pixi/display/SpriteBatch.js index bfd3017..7526390 100644 --- a/src/pixi/display/SpriteBatch.js +++ b/src/pixi/display/SpriteBatch.js @@ -93,7 +93,7 @@ // alow for trimming - context.setTransform(transform[0], transform[3], transform[1], transform[4], transform[2], transform[5]); + context.setTransform(transform.a, transform.c, transform.b, transform.d, transform.tx, transform.ty); context.save(); for (var i = 0; i < this.children.length; i++) { @@ -123,7 +123,7 @@ PIXI.DisplayObject.prototype.updateTransform.call(child); transform = child.localTransform; - context.setTransform(transform[0], transform[3], transform[1], transform[4], transform[2], transform[5]); + context.setTransform(transform.a, transform.c, transform.b, transform.d, transform.tx, transform.ty); context.drawImage(texture.baseTexture.source, frame.x, diff --git a/bin/pixi.dev.js b/bin/pixi.dev.js index 8558d80..45e6eba 100644 --- a/bin/pixi.dev.js +++ b/bin/pixi.dev.js @@ -1,10 +1,10 @@ /** * @license * pixi.js - v1.4.3 - * Copyright (c) 2012, Mat Groves + * Copyright (c) 2012-2014, Mat Groves * http://goodboydigital.com/ * - * Compiled: 2014-01-28 + * Compiled: 2014-01-30 * * pixi.js is licensed under the MIT License. * http://www.opensource.org/licenses/mit-license.php @@ -461,7 +461,7 @@ return (typeof Float32Array !== 'undefined') ? Float32Array : Array; }; -PIXI.Matrix = PIXI.determineMatrixArrayType(); +PIXI.Matrix2 = PIXI.determineMatrixArrayType(); /** @@ -482,7 +482,7 @@ */ PIXI.mat3.create = function() { - var matrix = new PIXI.Matrix(9); + var matrix = new PIXI.Matrix2(9); matrix[0] = 1; matrix[1] = 0; @@ -567,7 +567,7 @@ */ PIXI.mat3.clone = function(mat) { - var matrix = new PIXI.Matrix(9); + var matrix = new PIXI.Matrix2(9); matrix[0] = mat[0]; matrix[1] = mat[1]; @@ -666,7 +666,7 @@ */ PIXI.mat4.create = function() { - var matrix = new PIXI.Matrix(16); + var matrix = new PIXI.Matrix2(16); matrix[0] = 1; matrix[1] = 0; @@ -799,6 +799,64 @@ PIXI.identityMatrix = PIXI.mat3.create(); PIXI.tempMatrix = PIXI.mat3.create(); + +PIXI.Matrix = function() +{ + this.a = 1; + this.b = 0; + this.c = 0; + this.d = 1; + this.tx = 0; + this.ty = 0; + + +} + +PIXI.Matrix.prototype.fromArray = function(array) +{ + + this.a = array[0]; + this.b = array[1]; + this.c = array[3]; + this.d = array[4]; + this.tx = array[2]; + this.ty = array[5]; + +} + +PIXI.Matrix.prototype.toArray = function(transpose) +{ + if(!this.array)this.array = new Float32Array(9); + var array = this.array; + + if(transpose) + { + this.array[0] = this.a; + this.array[1] = this.c; + this.array[2] = 0; + this.array[3] = this.b; + this.array[4] = this.d; + this.array[5] = 0; + this.array[6] = this.tx; + this.array[7] = this.ty; + this.array[8] = 1; + } + else + { + this.array[0] = this.a; + this.array[1] = this.b; + this.array[2] = this.tx; + this.array[3] = this.c; + this.array[4] = this.d; + this.array[5] = this.ty; + this.array[6] = 0; + this.array[7] = 0; + this.array[8] = 1; + } + + return array;//[this.a, this.b, this.tx, this.c, this.d, this.ty, 0, 0, 1]; +} + /** * @author Mat Groves http://matgroves.com/ @Doormat23 */ @@ -940,7 +998,7 @@ * @readOnly * @private */ - this.worldTransform = PIXI.mat3.create(); //mat3.identity(); + this.worldTransform = new PIXI.Matrix()//PIXI.mat3.create(); //mat3.identity(); /** * [read-only] Current transform of the object locally @@ -950,7 +1008,7 @@ * @readOnly * @private */ - this.localTransform = PIXI.mat3.create(); //mat3.identity(); + this.localTransform = new PIXI.Matrix()//PIXI.mat3.create(); //mat3.identity(); /** * [NYI] Unknown @@ -1208,40 +1266,30 @@ this._cr = Math.cos(this.rotation); } - var localTransform = this.localTransform; - var parentTransform = this.parent.worldTransform; - var worldTransform = this.worldTransform; + // var localTransform = this.localTransform//.toArray(); + var parentTransform = this.parent.worldTransform//.toArray(); + var worldTransform = this.worldTransform//.toArray(); //console.log(localTransform) - localTransform[0] = this._cr * this.scale.x; - localTransform[1] = -this._sr * this.scale.y; - localTransform[3] = this._sr * this.scale.x; - localTransform[4] = this._cr * this.scale.y; - - // TODO --> do we even need a local matrix??? - var px = this.pivot.x; var py = this.pivot.y; - // Cache the matrix values (makes for huge speed increases!) - var a00 = localTransform[0], a01 = localTransform[1], a02 = this.position.x - localTransform[0] * px - py * localTransform[1], - a10 = localTransform[3], a11 = localTransform[4], a12 = this.position.y - localTransform[4] * py - px * localTransform[3], + var a00 = this._cr * this.scale.x, + a01 = -this._sr * this.scale.y, + a10 = this._sr * this.scale.x, + a11 = this._cr * this.scale.y, + a02 = this.position.x + a00 * px - py * a01, + a12 = this.position.y + a11 * py - px * a10, + b00 = parentTransform.a, b01 = parentTransform.b, b02 = parentTransform.tx, + b10 = parentTransform.c, b11 = parentTransform.d, b12 = parentTransform.ty; - b00 = parentTransform[0], b01 = parentTransform[1], b02 = parentTransform[2], - b10 = parentTransform[3], b11 = parentTransform[4], b12 = parentTransform[5]; + worldTransform.a = b00 * a00 + b01 * a10; + worldTransform.b = b00 * a01 + b01 * a11; + worldTransform.tx = b00 * a02 + b01 * a12 + b02; - localTransform[2] = a02; - localTransform[5] = a12; + worldTransform.c = b10 * a00 + b11 * a10; + worldTransform.d = b10 * a01 + b11 * a11; + worldTransform.ty = b10 * a02 + b11 * a12 + b12; - worldTransform[0] = b00 * a00 + b01 * a10; - worldTransform[1] = b00 * a01 + b01 * a11; - worldTransform[2] = b00 * a02 + b01 * a12 + b02; - - worldTransform[3] = b10 * a00 + b11 * a10; - worldTransform[4] = b10 * a01 + b11 * a11; - worldTransform[5] = b10 * a02 + b11 * a12 + b12; - - // because we are using affine transformation, we can optimise the matrix concatenation process.. wooo! - // mat3.multiply(this.localTransform, this.parent.worldTransform, this.worldTransform); this.worldAlpha = this.alpha * this.parent.worldAlpha; }; @@ -1316,6 +1364,36 @@ // this line is just here to pass jshinting :) renderSession = renderSession; }; + +/** + * The position of the displayObject on the x axis relative to the local coordinates of the parent. + * + * @property x + * @type Number + */ +Object.defineProperty(PIXI.DisplayObject.prototype, 'x', { + get: function() { + return this.position.x; + }, + set: function(value) { + this.position.x = value; + } +}); + +/** + * The position of the displayObject on the y axis relative to the local coordinates of the parent. + * + * @property y + * @type Number + */ +Object.defineProperty(PIXI.DisplayObject.prototype, 'y', { + get: function() { + return this.position.y; + }, + set: function(value) { + this.position.y = value; + } +}); /** * @author Mat Groves http://matgroves.com/ @Doormat23 */ @@ -1534,12 +1612,16 @@ var childMaxX; var childMaxY; + var childVisible = false; + for(var i=0,j=this.children.length; i childMaxY ? maxY : childMaxY; } + if(!childVisible) + return PIXI.EmptyRectangle; + var bounds = this._bounds; bounds.x = minX; @@ -1868,12 +1953,12 @@ var worldTransform = this.worldTransform; - var a = worldTransform[0]; - var b = worldTransform[3]; - var c = worldTransform[1]; - var d = worldTransform[4]; - var tx = worldTransform[2]; - var ty = worldTransform[5]; + var a = worldTransform.a; + var b = worldTransform.c; + var c = worldTransform.b; + var d = worldTransform.d; + var tx = worldTransform.tx; + var ty = worldTransform.ty; var x1 = a * w1 + c * h1 + tx; var y1 = d * h1 + b * w1 + ty; @@ -2029,7 +2114,7 @@ // allow for trimming - context.setTransform(transform[0], transform[3], transform[1], transform[4], transform[2], transform[5]); + context.setTransform(transform.a, transform.c, transform.b, transform.d, transform.tx, transform.ty); //if smoothingEnabled is supported and we need to change the smoothing property for this texture if(renderSession.smoothProperty && renderSession.scaleMode !== this.texture.baseTexture.scaleMode) { @@ -2169,6 +2254,13 @@ PIXI.SpriteBatch.prototype = Object.create( PIXI.DisplayObjectContainer.prototype ); PIXI.SpriteBatch.constructor = PIXI.SpriteBatch; + +/* + * Initialises the spriteBatch + * + * @method initWebGL + * @param gl {WebGLContext} the current WebGL drawing context + */ PIXI.SpriteBatch.prototype.initWebGL = function(gl) { @@ -2234,7 +2326,7 @@ // alow for trimming - context.setTransform(transform[0], transform[3], transform[1], transform[4], transform[2], transform[5]); + context.setTransform(transform.a, transform.c, transform.b, transform.d, transform.tx, transform.ty); context.save(); for (var i = 0; i < this.children.length; i++) { @@ -2264,7 +2356,7 @@ PIXI.DisplayObject.prototype.updateTransform.call(child); transform = child.localTransform; - context.setTransform(transform[0], transform[3], transform[1], transform[4], transform[2], transform[5]); + context.setTransform(transform.a, transform.c, transform.b, transform.d, transform.tx, transform.ty); context.drawImage(texture.baseTexture.source, frame.x, @@ -2484,8 +2576,21 @@ */ PIXI.Text = function(text, style) { + /** + * The canvas element that everything is drawn to + * + * @property canvas + * @type HTMLCanvasElement + */ 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'); + PIXI.Sprite.call(this, PIXI.Texture.fromCanvas(this.canvas)); this.setText(text); @@ -2631,6 +2736,13 @@ this.requiresUpdate = true; }; +/** +* Renders the object using the WebGL renderer +* +* @method _renderWebGL +* @param renderSession {RenderSession} +* @private +*/ PIXI.Text.prototype._renderWebGL = function(renderSession) { if(this.requiresUpdate) @@ -2662,6 +2774,7 @@ /* * http://stackoverflow.com/users/34441/ellisbben * great solution to the problem! + * returns the height of the given font * * @method determineFontHeight * @param fontStyle {Object} @@ -2798,11 +2911,11 @@ /** * 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 - * @param style {Object} The style parameters - * @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 + * @param style {Object} The style parameters, contained as properties of an object */ PIXI.BitmapText.prototype.setStyle = function(style) { @@ -3435,8 +3548,8 @@ var isSprite = (item instanceof PIXI.Sprite), worldTransform = item.worldTransform, - a00 = worldTransform[0], a01 = worldTransform[1], a02 = worldTransform[2], - a10 = worldTransform[3], a11 = worldTransform[4], a12 = worldTransform[5], + a00 = worldTransform.a, a01 = worldTransform.b, a02 = worldTransform.tx, + a10 = worldTransform.c, a11 = worldTransform.d, a12 = worldTransform.ty, id = 1 / (a00 * a11 + a01 * -a10), x = a11 * id * global.x + -a01 * id * global.y + (a12 * a01 - a02 * a11) * id, y = a00 * id * global.y + -a10 * id * global.x + (-a12 * a00 + a02 * a10) * id; @@ -3674,7 +3787,7 @@ * @param backgroundColor {Number} the background color of the stage, you have to pass this in is in hex format * 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); * 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 @@ -3693,7 +3806,7 @@ * @readOnly * @private */ - this.worldTransform = PIXI.mat3.create(); + this.worldTransform = new PIXI.Matrix()//PIXI.mat3.create(); /** * Whether or not the stage is interactive @@ -3901,7 +4014,7 @@ * @class AjaxRequest * @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 @@ -4008,7 +4121,7 @@ * Adds event emitter functionality to a class * * @class EventTarget - * @example + * * function MyEmitter() { * PIXI.EventTarget.call(this); //mixes in event target stuff * } @@ -4018,8 +4131,21 @@ */ PIXI.EventTarget = function () { + /** + * Holds all the listeners + * + * @property listeneners + * @type Object + */ 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 ) { @@ -4036,6 +4162,12 @@ }; + /** + * Fires the event, ie pretends that the event has happened + * + * @method dispatchEvent + * @param event {Event} the event object + */ this.dispatchEvent = this.emit = function ( event ) { if ( !listeners[ event.type ] || !listeners[ event.type ].length ) { @@ -4052,6 +4184,13 @@ }; + /** + * 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 ) { var index = listeners[ type ].indexOf( listener ); @@ -4064,6 +4203,12 @@ }; + /** + * 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 ) { var a = listeners[type]; if (a) @@ -4079,7 +4224,8 @@ * 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 * the browser then this function will return a canvas renderer - * + * @class autoDetectRenderer + * @static * @param width=800 {Number} the width 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 @@ -4149,17 +4295,23 @@ 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 = {}; /** * Triangulates shapes for webGL graphic fills * * @method Triangulate - * @namespace PolyK - * @constructor + * */ PIXI.PolyK.Triangulate = function(p) { @@ -4235,10 +4387,17 @@ }; /** - * Checks if a point is within a triangle + * Checks whether a point is within a triangle * - * @class _PointInTriangle - * @namespace PolyK + * @method _PointInTriangle + * @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 */ PIXI.PolyK._PointInTriangle = function(px, py, ax, ay, bx, by, cx, cy) @@ -4265,10 +4424,10 @@ }; /** - * Checks if a shape is convex + * Checks whether a shape is convex * - * @class _convex - * @namespace PolyK + * @method _convex + * * @private */ PIXI.PolyK._convex = function(ax, ay, bx, by, cx, cy, sign) @@ -4343,6 +4502,10 @@ */ PIXI.PixiShader = function(gl) { + /** + * @property gl + * @type WebGLContext + */ this.gl = gl; /** @@ -4375,7 +4538,9 @@ }; /** -* @method PIXI.PixiShader#init +* Initialises the shader +* @method init +* */ PIXI.PixiShader.prototype.init = function() { @@ -4430,7 +4595,7 @@ * 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 * -* @method PIXI.PixiShader#initUniforms +* @method initUniforms */ PIXI.PixiShader.prototype.initUniforms = function() { @@ -4501,7 +4666,7 @@ /** * 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) { @@ -4542,7 +4707,7 @@ wrapT = gl.REPEAT; } - gl.pixelStorei(gl.UNPACK_FLIP_Y_WEBGL, false); + gl.pixelStorei(gl.UNPACK_FLIP_Y_WEBGL, !!data.flipY); if (data.width) { @@ -4576,7 +4741,7 @@ /** * Updates the shader uniform values. * -* @method PIXI.PixiShader#syncUniforms +* @method syncUniforms */ PIXI.PixiShader.prototype.syncUniforms = function() { @@ -4631,6 +4796,11 @@ }; +/** +* Destroys the shader +* @method destroy +* +*/ PIXI.PixiShader.prototype.destroy = function() { this.gl.deleteProgram( this.program ); @@ -4640,6 +4810,11 @@ this.attributes = null; }; +/** +* +* @property defaultVertexSrc +* @type String +*/ PIXI.PixiShader.defaultVertexSrc = [ 'attribute vec2 aVertexPosition;', 'attribute vec2 aTextureCoord;', @@ -4673,19 +4848,25 @@ /** * @class PIXI.PixiFastShader * @constructor +* @param gl {WebGLContext} the current WebGL drawing context */ PIXI.PixiFastShader = function(gl) { + + /** + * @property gl + * @type WebGLContext + */ this.gl = gl; /** - * @property {any} program - The WebGL program. - */ + * @property {any} program - The WebGL program. + */ this.program = null; /** - * @property {array} fragmentSrc - The fragment shader. - */ + * @property {array} fragmentSrc - The fragment shader. + */ this.fragmentSrc = [ 'precision lowp float;', 'varying vec2 vTextureCoord;', @@ -4696,6 +4877,9 @@ '}' ]; + /** + * @property {array} vertexSrc - The vertex shader + */ this.vertexSrc = [ 'attribute vec2 aVertexPosition;', 'attribute vec2 aPositionCoord;', @@ -4737,7 +4921,9 @@ }; /** -* @method PIXI.PixiFastShader#init +* Initialises the shader +* @method init +* */ PIXI.PixiFastShader.prototype.init = function() { @@ -4787,6 +4973,11 @@ this.program = program; }; +/** +* Destroys the shader +* @method destroy +* +*/ PIXI.PixiFastShader.prototype.destroy = function() { this.gl.deleteProgram( this.program ); @@ -4803,9 +4994,14 @@ PIXI.StripShader = function() { - // the webGL program.. + /** + * @property {any} program - The WebGL program. + */ this.program = null; + /** + * @property {array} fragmentSrc - The fragment shader. + */ this.fragmentSrc = [ 'precision mediump float;', 'varying vec2 vTextureCoord;', @@ -4819,6 +5015,9 @@ '}' ]; + /** + * @property {array} fragmentSrc - The fragment shader. + */ this.vertexSrc = [ 'attribute vec2 aVertexPosition;', 'attribute vec2 aTextureCoord;', @@ -4839,6 +5038,11 @@ ]; }; +/** +* Initialises the shader +* @method init +* +*/ PIXI.StripShader.prototype.init = function() { @@ -4868,14 +5072,28 @@ * @author Mat Groves http://matgroves.com/ @Doormat23 */ - +/** +* @class PrimitiveShader +* @constructor +* @param gl {WebGLContext} the current WebGL drawing context +*/ PIXI.PrimitiveShader = function(gl) { + /** + * @property gl + * @type WebGLContext + */ this.gl = gl; - // the webGL program.. + /** + * @property {any} program - The WebGL program. + */ this.program = null; + /** + * @property fragmentSrc + * @type Array + */ this.fragmentSrc = [ 'precision mediump float;', 'varying vec4 vColor;', @@ -4885,6 +5103,10 @@ '}' ]; + /** + * @property vertexSrc + * @type Array + */ this.vertexSrc = [ 'attribute vec2 aVertexPosition;', 'attribute vec4 aColor;', @@ -4906,6 +5128,11 @@ this.init(); }; +/** +* Initialises the shader +* @method init +* +*/ PIXI.PrimitiveShader.prototype.init = function() { @@ -4932,6 +5159,11 @@ this.program = program; }; +/** +* Destroys the shader +* @method destroy +* +*/ PIXI.PrimitiveShader.prototype.destroy = function() { this.gl.deleteProgram( this.program ); @@ -4948,7 +5180,9 @@ /** * A set of functions used by the webGL renderer to draw the primitive graphics data * - * @class CanvasGraphics + * @class WebGLGraphics + * @private + * @static */ PIXI.WebGLGraphics = function() { @@ -4962,7 +5196,7 @@ * @private * @method renderGraphics * @param graphics {Graphics} - * @param projection {Object} + * @param renderSession {Object} */ PIXI.WebGLGraphics.renderGraphics = function(graphics, renderSession)//projection, offset) { @@ -4999,12 +5233,10 @@ // This could be speeded up for sure! // var m = PIXI.mat3.clone(graphics.worldTransform); - PIXI.mat3.transpose(graphics.worldTransform, PIXI.tempMatrix); - // set the matrix transform gl.blendFunc(gl.ONE, gl.ONE_MINUS_SRC_ALPHA); - gl.uniformMatrix3fv(shader.translationMatrix, false, PIXI.tempMatrix); + gl.uniformMatrix3fv(shader.translationMatrix, false, graphics.worldTransform.toArray(true)); gl.uniform2f(shader.projectionVector, projection.x, -projection.y); gl.uniform2f(shader.offsetVector, -offset.x, -offset.y); @@ -5034,7 +5266,8 @@ * @static * @private * @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) { @@ -5088,7 +5321,7 @@ * @static * @private * @method buildRectangle - * @param graphics {Graphics} + * @param graphicsData {Graphics} The graphics object to draw TODO-Alvin * @param webGLData {Object} */ PIXI.WebGLGraphics.buildRectangle = function(graphicsData, webGLData) @@ -5157,7 +5390,7 @@ * @static * @private * @method buildCircle - * @param graphics {Graphics} + * @param graphicsData {Graphics} The graphics object to draw * @param webGLData {Object} */ PIXI.WebGLGraphics.buildCircle = function(graphicsData, webGLData) @@ -5230,7 +5463,7 @@ * @static * @private * @method buildLine - * @param graphics {Graphics} + * @param graphicsData {Graphics} The graphics object to draw TODO-Alvin * @param webGLData {Object} */ PIXI.WebGLGraphics.buildLine = function(graphicsData, webGLData) @@ -5440,7 +5673,7 @@ * @static * @private * @method buildPoly - * @param graphics {Graphics} + * @param graphicsData {Graphics} The graphics object to draw TODO-Alvin * @param webGLData {Object} */ PIXI.WebGLGraphics.buildPoly = function(graphicsData, webGLData) @@ -6050,6 +6283,13 @@ * @author Mat Groves http://matgroves.com/ @Doormat23 */ + +/** +* @class WebGLMaskManager +* @constructor +* @param gl {WebGLContext} the current WebGL drawing context +* @private +*/ PIXI.WebGLMaskManager = function(gl) { this.maskStack = []; @@ -6058,11 +6298,22 @@ 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) { 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) { var gl = this.gl; @@ -6087,6 +6338,12 @@ 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) { var gl = this.gl; @@ -6110,6 +6367,10 @@ if(this.maskStack.length === 0)gl.disable(gl.STENCIL_TEST); }; +/** +* TODO-Alvin +* @method destroy +*/ PIXI.WebGLMaskManager.prototype.destroy = function() { this.maskStack = null; @@ -6119,6 +6380,12 @@ * @author Mat Groves http://matgroves.com/ @Doormat23 */ +/** +* @class WebGLShaderManager +* @constructor +* @param gl {WebGLContext} the current WebGL drawing context +* @private +*/ PIXI.WebGLShaderManager = function(gl) { @@ -6135,6 +6402,13 @@ //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) { this.gl = gl; @@ -6153,6 +6427,11 @@ }; +/** +* Initialises the context and the properties +* @method setAttribs +* @param attribs {Array} TODO-Alvin +*/ PIXI.WebGLShaderManager.prototype.setAttribs = function(attribs) { // reset temp state @@ -6194,6 +6473,11 @@ // 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) { //if(this.currentShader == shader)return; @@ -6207,6 +6491,10 @@ }; +/** +* Triggers the primitive shader +* @method activatePrimitiveShader +*/ PIXI.WebGLShaderManager.prototype.activatePrimitiveShader = function() { var gl = this.gl; @@ -6217,6 +6505,10 @@ }; +/** +* Disable the primitive shader +* @method deactivatePrimitiveShader +*/ PIXI.WebGLShaderManager.prototype.deactivatePrimitiveShader = function() { var gl = this.gl; @@ -6226,6 +6518,10 @@ this.setAttribs(this.defaultShader.attributes); }; +/** +* Destroys +* @method destroy +*/ PIXI.WebGLShaderManager.prototype.destroy = function() { this.attribState = null; @@ -6252,11 +6548,30 @@ * 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) { - + /** + * TODO-Alvin + * + * @property vertSize + * @type Number + */ this.vertSize = 6; + + /** + * TODO-Alvin + * @property size + * @type Number + */ this.size = 10000;//Math.pow(2, 16) / this.vertSize; // console.log(this.size); @@ -6265,9 +6580,23 @@ //the total number of indices in our batch var numIndices = this.size * 6; - //vertex data + //vertex data + + /** + * Holds the vertices + * + * @property vertices + * @type Float32Array + */ this.vertices = new Float32Array(numVerts); + //index data + /** + * Holds the indices + * + * @property indices + * @type Uint16Array + */ this.indices = new Uint16Array(numIndices); this.lastIndexCount = 0; @@ -6290,6 +6619,12 @@ this.setContext(gl); }; +/** +* +* @method setContext +* +* @param gl {WebGLContext} the current WebGL drawing context +*/ PIXI.WebGLSpriteBatch.prototype.setContext = function(gl) { this.gl = gl; @@ -6311,6 +6646,12 @@ this.currentBlendMode = 99999; }; +/** +* +* @method begin +* +* @param renderSession {RenderSession} the RenderSession +*/ PIXI.WebGLSpriteBatch.prototype.begin = function(renderSession) { this.renderSession = renderSession; @@ -6319,12 +6660,22 @@ this.start(); }; +/** +* +* @method end +* +*/ PIXI.WebGLSpriteBatch.prototype.end = function() { this.flush(); }; - +/** +* +* @method render +* +* @param sprite {Sprite} the sprite to render TODO-Alvin +*/ PIXI.WebGLSpriteBatch.prototype.render = function(sprite) { // check texture.. @@ -6383,21 +6734,21 @@ var index = this.currentBatchSize * 4 * this.vertSize; - var worldTransform = sprite.worldTransform; + var worldTransform = sprite.worldTransform;//.toArray(); - var a = worldTransform[0]; - var b = worldTransform[3]; - var c = worldTransform[1]; - var d = worldTransform[4]; - var tx = worldTransform[2]; - var ty = worldTransform[5]; + var a = worldTransform.a//[0]; + var b = worldTransform.c//[3]; + var c = worldTransform.b//[1]; + var d = worldTransform.d//[4]; + var tx = worldTransform.tx//[2]; + var ty = worldTransform.ty///[5]; // xy verticies[index++] = a * w1 + c * h1 + tx; verticies[index++] = d * h1 + b * w1 + ty; // uv - verticies[index++] = uvs[0]; - verticies[index++] = uvs[1]; + verticies[index++] = uvs.x0; + verticies[index++] = uvs.y0; // color verticies[index++] = alpha; verticies[index++] = tint; @@ -6406,8 +6757,8 @@ verticies[index++] = a * w0 + c * h1 + tx; verticies[index++] = d * h1 + b * w0 + ty; // uv - verticies[index++] = uvs[2]; - verticies[index++] = uvs[3]; + verticies[index++] = uvs.x1; + verticies[index++] = uvs.y1; // color verticies[index++] = alpha; verticies[index++] = tint; @@ -6416,8 +6767,8 @@ verticies[index++] = a * w0 + c * h0 + tx; verticies[index++] = d * h0 + b * w0 + ty; // uv - verticies[index++] = uvs[4]; - verticies[index++] = uvs[5]; + verticies[index++] = uvs.x2; + verticies[index++] = uvs.y2; // color verticies[index++] = alpha; verticies[index++] = tint; @@ -6426,18 +6777,24 @@ verticies[index++] = a * w1 + c * h0 + tx; verticies[index++] = d * h0 + b * w1 + ty; // uv - verticies[index++] = uvs[6]; - verticies[index++] = uvs[7]; + verticies[index++] = uvs.x3; + verticies[index++] = uvs.y3; // color verticies[index++] = alpha; verticies[index++] = tint; - + // increment the batchsize this.currentBatchSize++; }; +/** +* +* @method renderTilingSprite +* +* @param sprite {TilingSprite} the sprite to render TODO-Alvin +*/ PIXI.WebGLSpriteBatch.prototype.renderTilingSprite = function(tilingSprite) { var texture = tilingSprite.tilingTexture; @@ -6553,6 +6910,13 @@ this.currentBatchSize++; }; + +/** +* +* +* @method flush TODO-Alvin +* +*/ PIXI.WebGLSpriteBatch.prototype.flush = function() { // If the batch is length 0 then return as there is nothing to draw @@ -6589,12 +6953,21 @@ this.renderSession.drawCount++; }; - +/** +* +* @method stop +* +*/ PIXI.WebGLSpriteBatch.prototype.stop = function() { this.flush(); }; +/** +* +* @method start +* +*/ PIXI.WebGLSpriteBatch.prototype.start = function() { var gl = this.gl; @@ -6623,6 +6996,13 @@ } }; +/** +* +* @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) { this.flush(); @@ -6633,6 +7013,10 @@ this.gl.blendFunc(blendModeWebGL[0], blendModeWebGL[1]); }; +/** +* Destroys the SpriteBatch +* @method destroy +*/ PIXI.WebGLSpriteBatch.prototype.destroy = function() { @@ -6702,7 +7086,7 @@ this.shader = null; - this.tempMatrix = PIXI.mat3.create(); + this.matrix this.setContext(gl); }; @@ -6732,8 +7116,10 @@ { this.renderSession = renderSession; this.shader = this.renderSession.shaderManager.fastShader; - - PIXI.mat3.transpose(spriteBatch.worldTransform, this.tempMatrix); + + // PIXI.mat3.transpose(spriteBatch.worldTransform.toArray(), this.tempMatrix); + + this.matrix = spriteBatch.worldTransform.toArray(true) // console.log(this.tempMatrix) this.start(); @@ -6829,8 +7215,8 @@ verticies[index++] = sprite.rotation; // uv - verticies[index++] = uvs[0]; - verticies[index++] = uvs[1]; + verticies[index++] = uvs.x0; + verticies[index++] = uvs.y1; // color verticies[index++] = sprite.alpha; @@ -6850,8 +7236,8 @@ verticies[index++] = sprite.rotation; // uv - verticies[index++] = uvs[2]; - verticies[index++] = uvs[3]; + verticies[index++] = uvs.x1; + verticies[index++] = uvs.y1; // color verticies[index++] = sprite.alpha; @@ -6871,8 +7257,8 @@ verticies[index++] = sprite.rotation; // uv - verticies[index++] = uvs[4]; - verticies[index++] = uvs[5]; + verticies[index++] = uvs.x2; + verticies[index++] = uvs.y2; // color verticies[index++] = sprite.alpha; @@ -6894,8 +7280,8 @@ verticies[index++] = sprite.rotation; // uv - verticies[index++] = uvs[6]; - verticies[index++] = uvs[7]; + verticies[index++] = uvs.x3; + verticies[index++] = uvs.y3; // color verticies[index++] = sprite.alpha; @@ -6910,6 +7296,7 @@ PIXI.WebGLFastSpriteBatch.prototype.flush = function() { + // If the batch is length 0 then return as there is nothing to draw if (this.currentBatchSize===0)return; @@ -6968,7 +7355,7 @@ gl.uniform2f(this.shader.projectionVector, projection.x, projection.y); // set the matrix - gl.uniformMatrix3fv(this.shader.uMatrix, false, this.tempMatrix); + gl.uniformMatrix3fv(this.shader.uMatrix, false, this.matrix); // set the pointers var stride = this.vertSize * 4; @@ -7003,7 +7390,13 @@ * @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) { this.transparent = transparent; @@ -7017,7 +7410,11 @@ }; // API - +/** +* Initialises the context and the properties +* @method setContext +* @param gl {WebGLContext} the current WebGL drawing context +*/ PIXI.WebGLFilterManager.prototype.setContext = function(gl) { this.gl = gl; @@ -7026,6 +7423,12 @@ this.initShaderBuffers(); }; +/** +* +* @method begin +* @param renderSession {RenderSession} +* @param buffer {ArrayBuffer} +*/ PIXI.WebGLFilterManager.prototype.begin = function(renderSession, buffer) { this.renderSession = renderSession; @@ -7038,6 +7441,11 @@ 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) { var gl = this.gl; @@ -7119,6 +7527,10 @@ }; +/** +* Removes the last filter from the filter stack and doesn't return it +* @method popFilter +*/ PIXI.WebGLFilterManager.prototype.popFilter = function() { var gl = this.gl; @@ -7292,6 +7704,15 @@ 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) { // use program @@ -7344,6 +7765,10 @@ this.renderSession.drawCount++; }; +/** +* Initialises the shader buffers +* @method initShaderBuffers +*/ PIXI.WebGLFilterManager.prototype.initShaderBuffers = function() { var gl = this.gl; @@ -7400,6 +7825,10 @@ gl.STATIC_DRAW); }; +/** +* TODO-Alvin +* @method destroy +*/ PIXI.WebGLFilterManager.prototype.destroy = function() { var gl = this.gl; @@ -7422,9 +7851,24 @@ gl.deleteBuffer(this.colorBuffer); gl.deleteBuffer(this.indexBuffer); }; +/** + * @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 @@ -7444,6 +7888,11 @@ this.resize(width, height); }; + +/** +* Clears the filter texture +* @method clear +*/ PIXI.FilterTexture.prototype.clear = function() { var gl = this.gl; @@ -7452,6 +7901,13 @@ 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; @@ -7466,6 +7922,10 @@ }; +/** +* Destroys the filter texture +* @method destroy +*/ PIXI.FilterTexture.prototype.destroy = function() { var gl = this.gl; @@ -7476,7 +7936,6 @@ this.texture = null; }; - /** * @author Mat Groves * @@ -7509,7 +7968,7 @@ var cacheAlpha = maskData.alpha; var transform = maskData.worldTransform; - context.setTransform(transform[0], transform[3], transform[1], transform[4], transform[2], transform[5]); + context.setTransform(transform.a, transform.c, transform.b, transform.d, transform.tx, transform.ty); PIXI.CanvasGraphics.renderGraphicsMask(maskData, context); @@ -7876,7 +8335,7 @@ 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 * @type HTMLCanvasElement 2d Context */ @@ -7949,6 +8408,7 @@ { if(!this.transparent) { + this.context.globalAlpha = 1; this.context.fillStyle = stage.backgroundColorString; this.context.fillRect(0, 0, this.width, this.height); } @@ -8814,7 +9274,7 @@ context.globalCompositeOperation = PIXI.blendModesCanvas[renderSession.currentBlendMode]; } - context.setTransform(transform[0], transform[3], transform[1], transform[4], transform[2], transform[5]); + context.setTransform(transform.a, transform.c, transform.b, transform.d, transform.tx, transform.ty); PIXI.CanvasGraphics.renderGraphics(this, context); // simple render children! @@ -8842,12 +9302,12 @@ var worldTransform = this.worldTransform; - var a = worldTransform[0]; - var b = worldTransform[3]; - var c = worldTransform[1]; - var d = worldTransform[4]; - var tx = worldTransform[2]; - var ty = worldTransform[5]; + var a = worldTransform.a; + var b = worldTransform.c; + var c = worldTransform.b; + var d = worldTransform.d; + var tx = worldTransform.tx; + var ty = worldTransform.ty; var x1 = a * w1 + c * h1 + tx; var y1 = d * h1 + b * w1 + ty; @@ -9525,7 +9985,7 @@ // allow for trimming - context.setTransform(transform[0], transform[3], transform[1], transform[4], transform[2], transform[5]); + context.setTransform(transform.a, transform.c, transform.b, transform.d, transform.tx, transform.ty); if(!this.__tilePattern) @@ -9583,13 +10043,13 @@ var worldTransform = this.worldTransform; - var a = worldTransform[0]; - var b = worldTransform[3]; - var c = worldTransform[1]; - var d = worldTransform[4]; - var tx = worldTransform[2]; - var ty = worldTransform[5]; - + var a = worldTransform.a; + var b = worldTransform.c; + var c = worldTransform.b; + var d = worldTransform.d; + var tx = worldTransform.tx; + var ty = worldTransform.ty; + var x1 = a * w1 + c * h1 + tx; var y1 = d * h1 + b * w1 + ty; @@ -11189,6 +11649,7 @@ * @uses EventTarget * @constructor * @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) { @@ -11501,23 +11962,23 @@ PIXI.Texture.prototype._updateWebGLuvs = function() { - if(!this._uvs)this._uvs = new Float32Array(8); + if(!this._uvs)this._uvs = new PIXI.TextureUvs(); var frame = this.frame; var tw = this.baseTexture.width; var th = this.baseTexture.height; - this._uvs[0] = frame.x / tw; - this._uvs[1] = frame.y / th; + this._uvs.x0 = frame.x / tw; + this._uvs.y0 = frame.y / th; - this._uvs[2] = (frame.x + frame.width) / tw; - this._uvs[3] = frame.y / th; + this._uvs.x1 = (frame.x + frame.width) / tw; + this._uvs.y1 = frame.y / th; - this._uvs[4] = (frame.x + frame.width) / tw; - this._uvs[5] = (frame.y + frame.height) / th; + this._uvs.x2 = (frame.x + frame.width) / tw; + this._uvs.y2 = (frame.y + frame.height) / th; - this._uvs[6] = frame.x / tw; - this._uvs[7] = (frame.y + frame.height) / th; + this._uvs.x3 = frame.x / tw; + this._uvs.y3 = (frame.y + frame.height) / th; }; /** @@ -11608,6 +12069,28 @@ // this is more for webGL.. it contains updated frames.. PIXI.Texture.frameUpdates = []; +PIXI.TextureUvs = function() +{ + this.x0 = 0; + this.y0 = 0; + + this.x1 = 0; + this.y1 = 0; + + this.x2 = 0; + this.y2 = 0; + + this.x3 = 0; + this.y4 = 0; + + +} + + + + + + /** * @author Mat Groves http://matgroves.com/ @Doormat23 */ @@ -12606,7 +13089,7 @@ */ PIXI.BitmapFontLoader.prototype.load = function() { - this.ajaxRequest = new XMLHttpRequest(); + this.ajaxRequest = new PIXI.ajaxRequest(); var scope = this; this.ajaxRequest.onreadystatechange = function() { @@ -12619,7 +13102,7 @@ }; /** - * Invoked when XML file is loaded, parses the data + * Invoked when the XML file is loaded, parses the data * * @method onXMLLoaded * @private diff --git a/src/pixi/InteractionManager.js b/src/pixi/InteractionManager.js index a7072d6..98ac26c 100644 --- a/src/pixi/InteractionManager.js +++ b/src/pixi/InteractionManager.js @@ -454,8 +454,8 @@ var isSprite = (item instanceof PIXI.Sprite), worldTransform = item.worldTransform, - a00 = worldTransform[0], a01 = worldTransform[1], a02 = worldTransform[2], - a10 = worldTransform[3], a11 = worldTransform[4], a12 = worldTransform[5], + a00 = worldTransform.a, a01 = worldTransform.b, a02 = worldTransform.tx, + a10 = worldTransform.c, a11 = worldTransform.d, a12 = worldTransform.ty, id = 1 / (a00 * a11 + a01 * -a10), x = a11 * id * global.x + -a01 * id * global.y + (a12 * a01 - a02 * a11) * id, y = a00 * id * global.y + -a10 * id * global.x + (-a12 * a00 + a02 * a10) * id; diff --git a/src/pixi/core/Matrix.js b/src/pixi/core/Matrix.js index b88735c..5c4c103 100644 --- a/src/pixi/core/Matrix.js +++ b/src/pixi/core/Matrix.js @@ -12,7 +12,7 @@ return (typeof Float32Array !== 'undefined') ? Float32Array : Array; }; -PIXI.Matrix = PIXI.determineMatrixArrayType(); +PIXI.Matrix2 = PIXI.determineMatrixArrayType(); /** @@ -33,7 +33,7 @@ */ PIXI.mat3.create = function() { - var matrix = new PIXI.Matrix(9); + var matrix = new PIXI.Matrix2(9); matrix[0] = 1; matrix[1] = 0; @@ -118,7 +118,7 @@ */ PIXI.mat3.clone = function(mat) { - var matrix = new PIXI.Matrix(9); + var matrix = new PIXI.Matrix2(9); matrix[0] = mat[0]; matrix[1] = mat[1]; @@ -217,7 +217,7 @@ */ PIXI.mat4.create = function() { - var matrix = new PIXI.Matrix(16); + var matrix = new PIXI.Matrix2(16); matrix[0] = 1; matrix[1] = 0; @@ -349,4 +349,61 @@ }; PIXI.identityMatrix = PIXI.mat3.create(); -PIXI.tempMatrix = PIXI.mat3.create(); \ No newline at end of file +PIXI.tempMatrix = PIXI.mat3.create(); + +PIXI.Matrix = function() +{ + this.a = 1; + this.b = 0; + this.c = 0; + this.d = 1; + this.tx = 0; + this.ty = 0; + + +} + +PIXI.Matrix.prototype.fromArray = function(array) +{ + + this.a = array[0]; + this.b = array[1]; + this.c = array[3]; + this.d = array[4]; + this.tx = array[2]; + this.ty = array[5]; + +} + +PIXI.Matrix.prototype.toArray = function(transpose) +{ + if(!this.array)this.array = new Float32Array(9); + var array = this.array; + + if(transpose) + { + this.array[0] = this.a; + this.array[1] = this.c; + this.array[2] = 0; + this.array[3] = this.b; + this.array[4] = this.d; + this.array[5] = 0; + this.array[6] = this.tx; + this.array[7] = this.ty; + this.array[8] = 1; + } + else + { + this.array[0] = this.a; + this.array[1] = this.b; + this.array[2] = this.tx; + this.array[3] = this.c; + this.array[4] = this.d; + this.array[5] = this.ty; + this.array[6] = 0; + this.array[7] = 0; + this.array[8] = 1; + } + + return array;//[this.a, this.b, this.tx, this.c, this.d, this.ty, 0, 0, 1]; +} diff --git a/src/pixi/display/DisplayObject.js b/src/pixi/display/DisplayObject.js index b6da1a6..32d34a9 100644 --- a/src/pixi/display/DisplayObject.js +++ b/src/pixi/display/DisplayObject.js @@ -139,7 +139,7 @@ * @readOnly * @private */ - this.worldTransform = PIXI.mat3.create(); //mat3.identity(); + this.worldTransform = new PIXI.Matrix()//PIXI.mat3.create(); //mat3.identity(); /** * [read-only] Current transform of the object locally @@ -149,7 +149,7 @@ * @readOnly * @private */ - this.localTransform = PIXI.mat3.create(); //mat3.identity(); + this.localTransform = new PIXI.Matrix()//PIXI.mat3.create(); //mat3.identity(); /** * [NYI] Unknown @@ -407,40 +407,30 @@ this._cr = Math.cos(this.rotation); } - var localTransform = this.localTransform; - var parentTransform = this.parent.worldTransform; - var worldTransform = this.worldTransform; + // var localTransform = this.localTransform//.toArray(); + var parentTransform = this.parent.worldTransform//.toArray(); + var worldTransform = this.worldTransform//.toArray(); //console.log(localTransform) - localTransform[0] = this._cr * this.scale.x; - localTransform[1] = -this._sr * this.scale.y; - localTransform[3] = this._sr * this.scale.x; - localTransform[4] = this._cr * this.scale.y; - - // TODO --> do we even need a local matrix??? - var px = this.pivot.x; var py = this.pivot.y; - // Cache the matrix values (makes for huge speed increases!) - var a00 = localTransform[0], a01 = localTransform[1], a02 = this.position.x - localTransform[0] * px - py * localTransform[1], - a10 = localTransform[3], a11 = localTransform[4], a12 = this.position.y - localTransform[4] * py - px * localTransform[3], + var a00 = this._cr * this.scale.x, + a01 = -this._sr * this.scale.y, + a10 = this._sr * this.scale.x, + a11 = this._cr * this.scale.y, + a02 = this.position.x + a00 * px - py * a01, + a12 = this.position.y + a11 * py - px * a10, + b00 = parentTransform.a, b01 = parentTransform.b, b02 = parentTransform.tx, + b10 = parentTransform.c, b11 = parentTransform.d, b12 = parentTransform.ty; - b00 = parentTransform[0], b01 = parentTransform[1], b02 = parentTransform[2], - b10 = parentTransform[3], b11 = parentTransform[4], b12 = parentTransform[5]; + worldTransform.a = b00 * a00 + b01 * a10; + worldTransform.b = b00 * a01 + b01 * a11; + worldTransform.tx = b00 * a02 + b01 * a12 + b02; - localTransform[2] = a02; - localTransform[5] = a12; + worldTransform.c = b10 * a00 + b11 * a10; + worldTransform.d = b10 * a01 + b11 * a11; + worldTransform.ty = b10 * a02 + b11 * a12 + b12; - worldTransform[0] = b00 * a00 + b01 * a10; - worldTransform[1] = b00 * a01 + b01 * a11; - worldTransform[2] = b00 * a02 + b01 * a12 + b02; - - worldTransform[3] = b10 * a00 + b11 * a10; - worldTransform[4] = b10 * a01 + b11 * a11; - worldTransform[5] = b10 * a02 + b11 * a12 + b12; - - // because we are using affine transformation, we can optimise the matrix concatenation process.. wooo! - // mat3.multiply(this.localTransform, this.parent.worldTransform, this.worldTransform); this.worldAlpha = this.alpha * this.parent.worldAlpha; }; diff --git a/src/pixi/display/Sprite.js b/src/pixi/display/Sprite.js index 9bc9cec..35b4235 100644 --- a/src/pixi/display/Sprite.js +++ b/src/pixi/display/Sprite.js @@ -184,12 +184,12 @@ var worldTransform = this.worldTransform; - var a = worldTransform[0]; - var b = worldTransform[3]; - var c = worldTransform[1]; - var d = worldTransform[4]; - var tx = worldTransform[2]; - var ty = worldTransform[5]; + var a = worldTransform.a; + var b = worldTransform.c; + var c = worldTransform.b; + var d = worldTransform.d; + var tx = worldTransform.tx; + var ty = worldTransform.ty; var x1 = a * w1 + c * h1 + tx; var y1 = d * h1 + b * w1 + ty; @@ -345,7 +345,7 @@ // allow for trimming - context.setTransform(transform[0], transform[3], transform[1], transform[4], transform[2], transform[5]); + context.setTransform(transform.a, transform.c, transform.b, transform.d, transform.tx, transform.ty); //if smoothingEnabled is supported and we need to change the smoothing property for this texture if(renderSession.smoothProperty && renderSession.scaleMode !== this.texture.baseTexture.scaleMode) { diff --git a/src/pixi/display/SpriteBatch.js b/src/pixi/display/SpriteBatch.js index bfd3017..7526390 100644 --- a/src/pixi/display/SpriteBatch.js +++ b/src/pixi/display/SpriteBatch.js @@ -93,7 +93,7 @@ // alow for trimming - context.setTransform(transform[0], transform[3], transform[1], transform[4], transform[2], transform[5]); + context.setTransform(transform.a, transform.c, transform.b, transform.d, transform.tx, transform.ty); context.save(); for (var i = 0; i < this.children.length; i++) { @@ -123,7 +123,7 @@ PIXI.DisplayObject.prototype.updateTransform.call(child); transform = child.localTransform; - context.setTransform(transform[0], transform[3], transform[1], transform[4], transform[2], transform[5]); + context.setTransform(transform.a, transform.c, transform.b, transform.d, transform.tx, transform.ty); context.drawImage(texture.baseTexture.source, frame.x, diff --git a/src/pixi/display/Stage.js b/src/pixi/display/Stage.js index e42c772..743e1e0 100644 --- a/src/pixi/display/Stage.js +++ b/src/pixi/display/Stage.js @@ -30,7 +30,7 @@ * @readOnly * @private */ - this.worldTransform = PIXI.mat3.create(); + this.worldTransform = new PIXI.Matrix()//PIXI.mat3.create(); /** * Whether or not the stage is interactive diff --git a/bin/pixi.dev.js b/bin/pixi.dev.js index 8558d80..45e6eba 100644 --- a/bin/pixi.dev.js +++ b/bin/pixi.dev.js @@ -1,10 +1,10 @@ /** * @license * pixi.js - v1.4.3 - * Copyright (c) 2012, Mat Groves + * Copyright (c) 2012-2014, Mat Groves * http://goodboydigital.com/ * - * Compiled: 2014-01-28 + * Compiled: 2014-01-30 * * pixi.js is licensed under the MIT License. * http://www.opensource.org/licenses/mit-license.php @@ -461,7 +461,7 @@ return (typeof Float32Array !== 'undefined') ? Float32Array : Array; }; -PIXI.Matrix = PIXI.determineMatrixArrayType(); +PIXI.Matrix2 = PIXI.determineMatrixArrayType(); /** @@ -482,7 +482,7 @@ */ PIXI.mat3.create = function() { - var matrix = new PIXI.Matrix(9); + var matrix = new PIXI.Matrix2(9); matrix[0] = 1; matrix[1] = 0; @@ -567,7 +567,7 @@ */ PIXI.mat3.clone = function(mat) { - var matrix = new PIXI.Matrix(9); + var matrix = new PIXI.Matrix2(9); matrix[0] = mat[0]; matrix[1] = mat[1]; @@ -666,7 +666,7 @@ */ PIXI.mat4.create = function() { - var matrix = new PIXI.Matrix(16); + var matrix = new PIXI.Matrix2(16); matrix[0] = 1; matrix[1] = 0; @@ -799,6 +799,64 @@ PIXI.identityMatrix = PIXI.mat3.create(); PIXI.tempMatrix = PIXI.mat3.create(); + +PIXI.Matrix = function() +{ + this.a = 1; + this.b = 0; + this.c = 0; + this.d = 1; + this.tx = 0; + this.ty = 0; + + +} + +PIXI.Matrix.prototype.fromArray = function(array) +{ + + this.a = array[0]; + this.b = array[1]; + this.c = array[3]; + this.d = array[4]; + this.tx = array[2]; + this.ty = array[5]; + +} + +PIXI.Matrix.prototype.toArray = function(transpose) +{ + if(!this.array)this.array = new Float32Array(9); + var array = this.array; + + if(transpose) + { + this.array[0] = this.a; + this.array[1] = this.c; + this.array[2] = 0; + this.array[3] = this.b; + this.array[4] = this.d; + this.array[5] = 0; + this.array[6] = this.tx; + this.array[7] = this.ty; + this.array[8] = 1; + } + else + { + this.array[0] = this.a; + this.array[1] = this.b; + this.array[2] = this.tx; + this.array[3] = this.c; + this.array[4] = this.d; + this.array[5] = this.ty; + this.array[6] = 0; + this.array[7] = 0; + this.array[8] = 1; + } + + return array;//[this.a, this.b, this.tx, this.c, this.d, this.ty, 0, 0, 1]; +} + /** * @author Mat Groves http://matgroves.com/ @Doormat23 */ @@ -940,7 +998,7 @@ * @readOnly * @private */ - this.worldTransform = PIXI.mat3.create(); //mat3.identity(); + this.worldTransform = new PIXI.Matrix()//PIXI.mat3.create(); //mat3.identity(); /** * [read-only] Current transform of the object locally @@ -950,7 +1008,7 @@ * @readOnly * @private */ - this.localTransform = PIXI.mat3.create(); //mat3.identity(); + this.localTransform = new PIXI.Matrix()//PIXI.mat3.create(); //mat3.identity(); /** * [NYI] Unknown @@ -1208,40 +1266,30 @@ this._cr = Math.cos(this.rotation); } - var localTransform = this.localTransform; - var parentTransform = this.parent.worldTransform; - var worldTransform = this.worldTransform; + // var localTransform = this.localTransform//.toArray(); + var parentTransform = this.parent.worldTransform//.toArray(); + var worldTransform = this.worldTransform//.toArray(); //console.log(localTransform) - localTransform[0] = this._cr * this.scale.x; - localTransform[1] = -this._sr * this.scale.y; - localTransform[3] = this._sr * this.scale.x; - localTransform[4] = this._cr * this.scale.y; - - // TODO --> do we even need a local matrix??? - var px = this.pivot.x; var py = this.pivot.y; - // Cache the matrix values (makes for huge speed increases!) - var a00 = localTransform[0], a01 = localTransform[1], a02 = this.position.x - localTransform[0] * px - py * localTransform[1], - a10 = localTransform[3], a11 = localTransform[4], a12 = this.position.y - localTransform[4] * py - px * localTransform[3], + var a00 = this._cr * this.scale.x, + a01 = -this._sr * this.scale.y, + a10 = this._sr * this.scale.x, + a11 = this._cr * this.scale.y, + a02 = this.position.x + a00 * px - py * a01, + a12 = this.position.y + a11 * py - px * a10, + b00 = parentTransform.a, b01 = parentTransform.b, b02 = parentTransform.tx, + b10 = parentTransform.c, b11 = parentTransform.d, b12 = parentTransform.ty; - b00 = parentTransform[0], b01 = parentTransform[1], b02 = parentTransform[2], - b10 = parentTransform[3], b11 = parentTransform[4], b12 = parentTransform[5]; + worldTransform.a = b00 * a00 + b01 * a10; + worldTransform.b = b00 * a01 + b01 * a11; + worldTransform.tx = b00 * a02 + b01 * a12 + b02; - localTransform[2] = a02; - localTransform[5] = a12; + worldTransform.c = b10 * a00 + b11 * a10; + worldTransform.d = b10 * a01 + b11 * a11; + worldTransform.ty = b10 * a02 + b11 * a12 + b12; - worldTransform[0] = b00 * a00 + b01 * a10; - worldTransform[1] = b00 * a01 + b01 * a11; - worldTransform[2] = b00 * a02 + b01 * a12 + b02; - - worldTransform[3] = b10 * a00 + b11 * a10; - worldTransform[4] = b10 * a01 + b11 * a11; - worldTransform[5] = b10 * a02 + b11 * a12 + b12; - - // because we are using affine transformation, we can optimise the matrix concatenation process.. wooo! - // mat3.multiply(this.localTransform, this.parent.worldTransform, this.worldTransform); this.worldAlpha = this.alpha * this.parent.worldAlpha; }; @@ -1316,6 +1364,36 @@ // this line is just here to pass jshinting :) renderSession = renderSession; }; + +/** + * The position of the displayObject on the x axis relative to the local coordinates of the parent. + * + * @property x + * @type Number + */ +Object.defineProperty(PIXI.DisplayObject.prototype, 'x', { + get: function() { + return this.position.x; + }, + set: function(value) { + this.position.x = value; + } +}); + +/** + * The position of the displayObject on the y axis relative to the local coordinates of the parent. + * + * @property y + * @type Number + */ +Object.defineProperty(PIXI.DisplayObject.prototype, 'y', { + get: function() { + return this.position.y; + }, + set: function(value) { + this.position.y = value; + } +}); /** * @author Mat Groves http://matgroves.com/ @Doormat23 */ @@ -1534,12 +1612,16 @@ var childMaxX; var childMaxY; + var childVisible = false; + for(var i=0,j=this.children.length; i childMaxY ? maxY : childMaxY; } + if(!childVisible) + return PIXI.EmptyRectangle; + var bounds = this._bounds; bounds.x = minX; @@ -1868,12 +1953,12 @@ var worldTransform = this.worldTransform; - var a = worldTransform[0]; - var b = worldTransform[3]; - var c = worldTransform[1]; - var d = worldTransform[4]; - var tx = worldTransform[2]; - var ty = worldTransform[5]; + var a = worldTransform.a; + var b = worldTransform.c; + var c = worldTransform.b; + var d = worldTransform.d; + var tx = worldTransform.tx; + var ty = worldTransform.ty; var x1 = a * w1 + c * h1 + tx; var y1 = d * h1 + b * w1 + ty; @@ -2029,7 +2114,7 @@ // allow for trimming - context.setTransform(transform[0], transform[3], transform[1], transform[4], transform[2], transform[5]); + context.setTransform(transform.a, transform.c, transform.b, transform.d, transform.tx, transform.ty); //if smoothingEnabled is supported and we need to change the smoothing property for this texture if(renderSession.smoothProperty && renderSession.scaleMode !== this.texture.baseTexture.scaleMode) { @@ -2169,6 +2254,13 @@ PIXI.SpriteBatch.prototype = Object.create( PIXI.DisplayObjectContainer.prototype ); PIXI.SpriteBatch.constructor = PIXI.SpriteBatch; + +/* + * Initialises the spriteBatch + * + * @method initWebGL + * @param gl {WebGLContext} the current WebGL drawing context + */ PIXI.SpriteBatch.prototype.initWebGL = function(gl) { @@ -2234,7 +2326,7 @@ // alow for trimming - context.setTransform(transform[0], transform[3], transform[1], transform[4], transform[2], transform[5]); + context.setTransform(transform.a, transform.c, transform.b, transform.d, transform.tx, transform.ty); context.save(); for (var i = 0; i < this.children.length; i++) { @@ -2264,7 +2356,7 @@ PIXI.DisplayObject.prototype.updateTransform.call(child); transform = child.localTransform; - context.setTransform(transform[0], transform[3], transform[1], transform[4], transform[2], transform[5]); + context.setTransform(transform.a, transform.c, transform.b, transform.d, transform.tx, transform.ty); context.drawImage(texture.baseTexture.source, frame.x, @@ -2484,8 +2576,21 @@ */ PIXI.Text = function(text, style) { + /** + * The canvas element that everything is drawn to + * + * @property canvas + * @type HTMLCanvasElement + */ 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'); + PIXI.Sprite.call(this, PIXI.Texture.fromCanvas(this.canvas)); this.setText(text); @@ -2631,6 +2736,13 @@ this.requiresUpdate = true; }; +/** +* Renders the object using the WebGL renderer +* +* @method _renderWebGL +* @param renderSession {RenderSession} +* @private +*/ PIXI.Text.prototype._renderWebGL = function(renderSession) { if(this.requiresUpdate) @@ -2662,6 +2774,7 @@ /* * http://stackoverflow.com/users/34441/ellisbben * great solution to the problem! + * returns the height of the given font * * @method determineFontHeight * @param fontStyle {Object} @@ -2798,11 +2911,11 @@ /** * 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 - * @param style {Object} The style parameters - * @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 + * @param style {Object} The style parameters, contained as properties of an object */ PIXI.BitmapText.prototype.setStyle = function(style) { @@ -3435,8 +3548,8 @@ var isSprite = (item instanceof PIXI.Sprite), worldTransform = item.worldTransform, - a00 = worldTransform[0], a01 = worldTransform[1], a02 = worldTransform[2], - a10 = worldTransform[3], a11 = worldTransform[4], a12 = worldTransform[5], + a00 = worldTransform.a, a01 = worldTransform.b, a02 = worldTransform.tx, + a10 = worldTransform.c, a11 = worldTransform.d, a12 = worldTransform.ty, id = 1 / (a00 * a11 + a01 * -a10), x = a11 * id * global.x + -a01 * id * global.y + (a12 * a01 - a02 * a11) * id, y = a00 * id * global.y + -a10 * id * global.x + (-a12 * a00 + a02 * a10) * id; @@ -3674,7 +3787,7 @@ * @param backgroundColor {Number} the background color of the stage, you have to pass this in is in hex format * 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); * 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 @@ -3693,7 +3806,7 @@ * @readOnly * @private */ - this.worldTransform = PIXI.mat3.create(); + this.worldTransform = new PIXI.Matrix()//PIXI.mat3.create(); /** * Whether or not the stage is interactive @@ -3901,7 +4014,7 @@ * @class AjaxRequest * @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 @@ -4008,7 +4121,7 @@ * Adds event emitter functionality to a class * * @class EventTarget - * @example + * * function MyEmitter() { * PIXI.EventTarget.call(this); //mixes in event target stuff * } @@ -4018,8 +4131,21 @@ */ PIXI.EventTarget = function () { + /** + * Holds all the listeners + * + * @property listeneners + * @type Object + */ 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 ) { @@ -4036,6 +4162,12 @@ }; + /** + * Fires the event, ie pretends that the event has happened + * + * @method dispatchEvent + * @param event {Event} the event object + */ this.dispatchEvent = this.emit = function ( event ) { if ( !listeners[ event.type ] || !listeners[ event.type ].length ) { @@ -4052,6 +4184,13 @@ }; + /** + * 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 ) { var index = listeners[ type ].indexOf( listener ); @@ -4064,6 +4203,12 @@ }; + /** + * 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 ) { var a = listeners[type]; if (a) @@ -4079,7 +4224,8 @@ * 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 * the browser then this function will return a canvas renderer - * + * @class autoDetectRenderer + * @static * @param width=800 {Number} the width 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 @@ -4149,17 +4295,23 @@ 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 = {}; /** * Triangulates shapes for webGL graphic fills * * @method Triangulate - * @namespace PolyK - * @constructor + * */ PIXI.PolyK.Triangulate = function(p) { @@ -4235,10 +4387,17 @@ }; /** - * Checks if a point is within a triangle + * Checks whether a point is within a triangle * - * @class _PointInTriangle - * @namespace PolyK + * @method _PointInTriangle + * @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 */ PIXI.PolyK._PointInTriangle = function(px, py, ax, ay, bx, by, cx, cy) @@ -4265,10 +4424,10 @@ }; /** - * Checks if a shape is convex + * Checks whether a shape is convex * - * @class _convex - * @namespace PolyK + * @method _convex + * * @private */ PIXI.PolyK._convex = function(ax, ay, bx, by, cx, cy, sign) @@ -4343,6 +4502,10 @@ */ PIXI.PixiShader = function(gl) { + /** + * @property gl + * @type WebGLContext + */ this.gl = gl; /** @@ -4375,7 +4538,9 @@ }; /** -* @method PIXI.PixiShader#init +* Initialises the shader +* @method init +* */ PIXI.PixiShader.prototype.init = function() { @@ -4430,7 +4595,7 @@ * 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 * -* @method PIXI.PixiShader#initUniforms +* @method initUniforms */ PIXI.PixiShader.prototype.initUniforms = function() { @@ -4501,7 +4666,7 @@ /** * 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) { @@ -4542,7 +4707,7 @@ wrapT = gl.REPEAT; } - gl.pixelStorei(gl.UNPACK_FLIP_Y_WEBGL, false); + gl.pixelStorei(gl.UNPACK_FLIP_Y_WEBGL, !!data.flipY); if (data.width) { @@ -4576,7 +4741,7 @@ /** * Updates the shader uniform values. * -* @method PIXI.PixiShader#syncUniforms +* @method syncUniforms */ PIXI.PixiShader.prototype.syncUniforms = function() { @@ -4631,6 +4796,11 @@ }; +/** +* Destroys the shader +* @method destroy +* +*/ PIXI.PixiShader.prototype.destroy = function() { this.gl.deleteProgram( this.program ); @@ -4640,6 +4810,11 @@ this.attributes = null; }; +/** +* +* @property defaultVertexSrc +* @type String +*/ PIXI.PixiShader.defaultVertexSrc = [ 'attribute vec2 aVertexPosition;', 'attribute vec2 aTextureCoord;', @@ -4673,19 +4848,25 @@ /** * @class PIXI.PixiFastShader * @constructor +* @param gl {WebGLContext} the current WebGL drawing context */ PIXI.PixiFastShader = function(gl) { + + /** + * @property gl + * @type WebGLContext + */ this.gl = gl; /** - * @property {any} program - The WebGL program. - */ + * @property {any} program - The WebGL program. + */ this.program = null; /** - * @property {array} fragmentSrc - The fragment shader. - */ + * @property {array} fragmentSrc - The fragment shader. + */ this.fragmentSrc = [ 'precision lowp float;', 'varying vec2 vTextureCoord;', @@ -4696,6 +4877,9 @@ '}' ]; + /** + * @property {array} vertexSrc - The vertex shader + */ this.vertexSrc = [ 'attribute vec2 aVertexPosition;', 'attribute vec2 aPositionCoord;', @@ -4737,7 +4921,9 @@ }; /** -* @method PIXI.PixiFastShader#init +* Initialises the shader +* @method init +* */ PIXI.PixiFastShader.prototype.init = function() { @@ -4787,6 +4973,11 @@ this.program = program; }; +/** +* Destroys the shader +* @method destroy +* +*/ PIXI.PixiFastShader.prototype.destroy = function() { this.gl.deleteProgram( this.program ); @@ -4803,9 +4994,14 @@ PIXI.StripShader = function() { - // the webGL program.. + /** + * @property {any} program - The WebGL program. + */ this.program = null; + /** + * @property {array} fragmentSrc - The fragment shader. + */ this.fragmentSrc = [ 'precision mediump float;', 'varying vec2 vTextureCoord;', @@ -4819,6 +5015,9 @@ '}' ]; + /** + * @property {array} fragmentSrc - The fragment shader. + */ this.vertexSrc = [ 'attribute vec2 aVertexPosition;', 'attribute vec2 aTextureCoord;', @@ -4839,6 +5038,11 @@ ]; }; +/** +* Initialises the shader +* @method init +* +*/ PIXI.StripShader.prototype.init = function() { @@ -4868,14 +5072,28 @@ * @author Mat Groves http://matgroves.com/ @Doormat23 */ - +/** +* @class PrimitiveShader +* @constructor +* @param gl {WebGLContext} the current WebGL drawing context +*/ PIXI.PrimitiveShader = function(gl) { + /** + * @property gl + * @type WebGLContext + */ this.gl = gl; - // the webGL program.. + /** + * @property {any} program - The WebGL program. + */ this.program = null; + /** + * @property fragmentSrc + * @type Array + */ this.fragmentSrc = [ 'precision mediump float;', 'varying vec4 vColor;', @@ -4885,6 +5103,10 @@ '}' ]; + /** + * @property vertexSrc + * @type Array + */ this.vertexSrc = [ 'attribute vec2 aVertexPosition;', 'attribute vec4 aColor;', @@ -4906,6 +5128,11 @@ this.init(); }; +/** +* Initialises the shader +* @method init +* +*/ PIXI.PrimitiveShader.prototype.init = function() { @@ -4932,6 +5159,11 @@ this.program = program; }; +/** +* Destroys the shader +* @method destroy +* +*/ PIXI.PrimitiveShader.prototype.destroy = function() { this.gl.deleteProgram( this.program ); @@ -4948,7 +5180,9 @@ /** * A set of functions used by the webGL renderer to draw the primitive graphics data * - * @class CanvasGraphics + * @class WebGLGraphics + * @private + * @static */ PIXI.WebGLGraphics = function() { @@ -4962,7 +5196,7 @@ * @private * @method renderGraphics * @param graphics {Graphics} - * @param projection {Object} + * @param renderSession {Object} */ PIXI.WebGLGraphics.renderGraphics = function(graphics, renderSession)//projection, offset) { @@ -4999,12 +5233,10 @@ // This could be speeded up for sure! // var m = PIXI.mat3.clone(graphics.worldTransform); - PIXI.mat3.transpose(graphics.worldTransform, PIXI.tempMatrix); - // set the matrix transform gl.blendFunc(gl.ONE, gl.ONE_MINUS_SRC_ALPHA); - gl.uniformMatrix3fv(shader.translationMatrix, false, PIXI.tempMatrix); + gl.uniformMatrix3fv(shader.translationMatrix, false, graphics.worldTransform.toArray(true)); gl.uniform2f(shader.projectionVector, projection.x, -projection.y); gl.uniform2f(shader.offsetVector, -offset.x, -offset.y); @@ -5034,7 +5266,8 @@ * @static * @private * @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) { @@ -5088,7 +5321,7 @@ * @static * @private * @method buildRectangle - * @param graphics {Graphics} + * @param graphicsData {Graphics} The graphics object to draw TODO-Alvin * @param webGLData {Object} */ PIXI.WebGLGraphics.buildRectangle = function(graphicsData, webGLData) @@ -5157,7 +5390,7 @@ * @static * @private * @method buildCircle - * @param graphics {Graphics} + * @param graphicsData {Graphics} The graphics object to draw * @param webGLData {Object} */ PIXI.WebGLGraphics.buildCircle = function(graphicsData, webGLData) @@ -5230,7 +5463,7 @@ * @static * @private * @method buildLine - * @param graphics {Graphics} + * @param graphicsData {Graphics} The graphics object to draw TODO-Alvin * @param webGLData {Object} */ PIXI.WebGLGraphics.buildLine = function(graphicsData, webGLData) @@ -5440,7 +5673,7 @@ * @static * @private * @method buildPoly - * @param graphics {Graphics} + * @param graphicsData {Graphics} The graphics object to draw TODO-Alvin * @param webGLData {Object} */ PIXI.WebGLGraphics.buildPoly = function(graphicsData, webGLData) @@ -6050,6 +6283,13 @@ * @author Mat Groves http://matgroves.com/ @Doormat23 */ + +/** +* @class WebGLMaskManager +* @constructor +* @param gl {WebGLContext} the current WebGL drawing context +* @private +*/ PIXI.WebGLMaskManager = function(gl) { this.maskStack = []; @@ -6058,11 +6298,22 @@ 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) { 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) { var gl = this.gl; @@ -6087,6 +6338,12 @@ 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) { var gl = this.gl; @@ -6110,6 +6367,10 @@ if(this.maskStack.length === 0)gl.disable(gl.STENCIL_TEST); }; +/** +* TODO-Alvin +* @method destroy +*/ PIXI.WebGLMaskManager.prototype.destroy = function() { this.maskStack = null; @@ -6119,6 +6380,12 @@ * @author Mat Groves http://matgroves.com/ @Doormat23 */ +/** +* @class WebGLShaderManager +* @constructor +* @param gl {WebGLContext} the current WebGL drawing context +* @private +*/ PIXI.WebGLShaderManager = function(gl) { @@ -6135,6 +6402,13 @@ //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) { this.gl = gl; @@ -6153,6 +6427,11 @@ }; +/** +* Initialises the context and the properties +* @method setAttribs +* @param attribs {Array} TODO-Alvin +*/ PIXI.WebGLShaderManager.prototype.setAttribs = function(attribs) { // reset temp state @@ -6194,6 +6473,11 @@ // 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) { //if(this.currentShader == shader)return; @@ -6207,6 +6491,10 @@ }; +/** +* Triggers the primitive shader +* @method activatePrimitiveShader +*/ PIXI.WebGLShaderManager.prototype.activatePrimitiveShader = function() { var gl = this.gl; @@ -6217,6 +6505,10 @@ }; +/** +* Disable the primitive shader +* @method deactivatePrimitiveShader +*/ PIXI.WebGLShaderManager.prototype.deactivatePrimitiveShader = function() { var gl = this.gl; @@ -6226,6 +6518,10 @@ this.setAttribs(this.defaultShader.attributes); }; +/** +* Destroys +* @method destroy +*/ PIXI.WebGLShaderManager.prototype.destroy = function() { this.attribState = null; @@ -6252,11 +6548,30 @@ * 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) { - + /** + * TODO-Alvin + * + * @property vertSize + * @type Number + */ this.vertSize = 6; + + /** + * TODO-Alvin + * @property size + * @type Number + */ this.size = 10000;//Math.pow(2, 16) / this.vertSize; // console.log(this.size); @@ -6265,9 +6580,23 @@ //the total number of indices in our batch var numIndices = this.size * 6; - //vertex data + //vertex data + + /** + * Holds the vertices + * + * @property vertices + * @type Float32Array + */ this.vertices = new Float32Array(numVerts); + //index data + /** + * Holds the indices + * + * @property indices + * @type Uint16Array + */ this.indices = new Uint16Array(numIndices); this.lastIndexCount = 0; @@ -6290,6 +6619,12 @@ this.setContext(gl); }; +/** +* +* @method setContext +* +* @param gl {WebGLContext} the current WebGL drawing context +*/ PIXI.WebGLSpriteBatch.prototype.setContext = function(gl) { this.gl = gl; @@ -6311,6 +6646,12 @@ this.currentBlendMode = 99999; }; +/** +* +* @method begin +* +* @param renderSession {RenderSession} the RenderSession +*/ PIXI.WebGLSpriteBatch.prototype.begin = function(renderSession) { this.renderSession = renderSession; @@ -6319,12 +6660,22 @@ this.start(); }; +/** +* +* @method end +* +*/ PIXI.WebGLSpriteBatch.prototype.end = function() { this.flush(); }; - +/** +* +* @method render +* +* @param sprite {Sprite} the sprite to render TODO-Alvin +*/ PIXI.WebGLSpriteBatch.prototype.render = function(sprite) { // check texture.. @@ -6383,21 +6734,21 @@ var index = this.currentBatchSize * 4 * this.vertSize; - var worldTransform = sprite.worldTransform; + var worldTransform = sprite.worldTransform;//.toArray(); - var a = worldTransform[0]; - var b = worldTransform[3]; - var c = worldTransform[1]; - var d = worldTransform[4]; - var tx = worldTransform[2]; - var ty = worldTransform[5]; + var a = worldTransform.a//[0]; + var b = worldTransform.c//[3]; + var c = worldTransform.b//[1]; + var d = worldTransform.d//[4]; + var tx = worldTransform.tx//[2]; + var ty = worldTransform.ty///[5]; // xy verticies[index++] = a * w1 + c * h1 + tx; verticies[index++] = d * h1 + b * w1 + ty; // uv - verticies[index++] = uvs[0]; - verticies[index++] = uvs[1]; + verticies[index++] = uvs.x0; + verticies[index++] = uvs.y0; // color verticies[index++] = alpha; verticies[index++] = tint; @@ -6406,8 +6757,8 @@ verticies[index++] = a * w0 + c * h1 + tx; verticies[index++] = d * h1 + b * w0 + ty; // uv - verticies[index++] = uvs[2]; - verticies[index++] = uvs[3]; + verticies[index++] = uvs.x1; + verticies[index++] = uvs.y1; // color verticies[index++] = alpha; verticies[index++] = tint; @@ -6416,8 +6767,8 @@ verticies[index++] = a * w0 + c * h0 + tx; verticies[index++] = d * h0 + b * w0 + ty; // uv - verticies[index++] = uvs[4]; - verticies[index++] = uvs[5]; + verticies[index++] = uvs.x2; + verticies[index++] = uvs.y2; // color verticies[index++] = alpha; verticies[index++] = tint; @@ -6426,18 +6777,24 @@ verticies[index++] = a * w1 + c * h0 + tx; verticies[index++] = d * h0 + b * w1 + ty; // uv - verticies[index++] = uvs[6]; - verticies[index++] = uvs[7]; + verticies[index++] = uvs.x3; + verticies[index++] = uvs.y3; // color verticies[index++] = alpha; verticies[index++] = tint; - + // increment the batchsize this.currentBatchSize++; }; +/** +* +* @method renderTilingSprite +* +* @param sprite {TilingSprite} the sprite to render TODO-Alvin +*/ PIXI.WebGLSpriteBatch.prototype.renderTilingSprite = function(tilingSprite) { var texture = tilingSprite.tilingTexture; @@ -6553,6 +6910,13 @@ this.currentBatchSize++; }; + +/** +* +* +* @method flush TODO-Alvin +* +*/ PIXI.WebGLSpriteBatch.prototype.flush = function() { // If the batch is length 0 then return as there is nothing to draw @@ -6589,12 +6953,21 @@ this.renderSession.drawCount++; }; - +/** +* +* @method stop +* +*/ PIXI.WebGLSpriteBatch.prototype.stop = function() { this.flush(); }; +/** +* +* @method start +* +*/ PIXI.WebGLSpriteBatch.prototype.start = function() { var gl = this.gl; @@ -6623,6 +6996,13 @@ } }; +/** +* +* @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) { this.flush(); @@ -6633,6 +7013,10 @@ this.gl.blendFunc(blendModeWebGL[0], blendModeWebGL[1]); }; +/** +* Destroys the SpriteBatch +* @method destroy +*/ PIXI.WebGLSpriteBatch.prototype.destroy = function() { @@ -6702,7 +7086,7 @@ this.shader = null; - this.tempMatrix = PIXI.mat3.create(); + this.matrix this.setContext(gl); }; @@ -6732,8 +7116,10 @@ { this.renderSession = renderSession; this.shader = this.renderSession.shaderManager.fastShader; - - PIXI.mat3.transpose(spriteBatch.worldTransform, this.tempMatrix); + + // PIXI.mat3.transpose(spriteBatch.worldTransform.toArray(), this.tempMatrix); + + this.matrix = spriteBatch.worldTransform.toArray(true) // console.log(this.tempMatrix) this.start(); @@ -6829,8 +7215,8 @@ verticies[index++] = sprite.rotation; // uv - verticies[index++] = uvs[0]; - verticies[index++] = uvs[1]; + verticies[index++] = uvs.x0; + verticies[index++] = uvs.y1; // color verticies[index++] = sprite.alpha; @@ -6850,8 +7236,8 @@ verticies[index++] = sprite.rotation; // uv - verticies[index++] = uvs[2]; - verticies[index++] = uvs[3]; + verticies[index++] = uvs.x1; + verticies[index++] = uvs.y1; // color verticies[index++] = sprite.alpha; @@ -6871,8 +7257,8 @@ verticies[index++] = sprite.rotation; // uv - verticies[index++] = uvs[4]; - verticies[index++] = uvs[5]; + verticies[index++] = uvs.x2; + verticies[index++] = uvs.y2; // color verticies[index++] = sprite.alpha; @@ -6894,8 +7280,8 @@ verticies[index++] = sprite.rotation; // uv - verticies[index++] = uvs[6]; - verticies[index++] = uvs[7]; + verticies[index++] = uvs.x3; + verticies[index++] = uvs.y3; // color verticies[index++] = sprite.alpha; @@ -6910,6 +7296,7 @@ PIXI.WebGLFastSpriteBatch.prototype.flush = function() { + // If the batch is length 0 then return as there is nothing to draw if (this.currentBatchSize===0)return; @@ -6968,7 +7355,7 @@ gl.uniform2f(this.shader.projectionVector, projection.x, projection.y); // set the matrix - gl.uniformMatrix3fv(this.shader.uMatrix, false, this.tempMatrix); + gl.uniformMatrix3fv(this.shader.uMatrix, false, this.matrix); // set the pointers var stride = this.vertSize * 4; @@ -7003,7 +7390,13 @@ * @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) { this.transparent = transparent; @@ -7017,7 +7410,11 @@ }; // API - +/** +* Initialises the context and the properties +* @method setContext +* @param gl {WebGLContext} the current WebGL drawing context +*/ PIXI.WebGLFilterManager.prototype.setContext = function(gl) { this.gl = gl; @@ -7026,6 +7423,12 @@ this.initShaderBuffers(); }; +/** +* +* @method begin +* @param renderSession {RenderSession} +* @param buffer {ArrayBuffer} +*/ PIXI.WebGLFilterManager.prototype.begin = function(renderSession, buffer) { this.renderSession = renderSession; @@ -7038,6 +7441,11 @@ 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) { var gl = this.gl; @@ -7119,6 +7527,10 @@ }; +/** +* Removes the last filter from the filter stack and doesn't return it +* @method popFilter +*/ PIXI.WebGLFilterManager.prototype.popFilter = function() { var gl = this.gl; @@ -7292,6 +7704,15 @@ 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) { // use program @@ -7344,6 +7765,10 @@ this.renderSession.drawCount++; }; +/** +* Initialises the shader buffers +* @method initShaderBuffers +*/ PIXI.WebGLFilterManager.prototype.initShaderBuffers = function() { var gl = this.gl; @@ -7400,6 +7825,10 @@ gl.STATIC_DRAW); }; +/** +* TODO-Alvin +* @method destroy +*/ PIXI.WebGLFilterManager.prototype.destroy = function() { var gl = this.gl; @@ -7422,9 +7851,24 @@ gl.deleteBuffer(this.colorBuffer); gl.deleteBuffer(this.indexBuffer); }; +/** + * @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 @@ -7444,6 +7888,11 @@ this.resize(width, height); }; + +/** +* Clears the filter texture +* @method clear +*/ PIXI.FilterTexture.prototype.clear = function() { var gl = this.gl; @@ -7452,6 +7901,13 @@ 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; @@ -7466,6 +7922,10 @@ }; +/** +* Destroys the filter texture +* @method destroy +*/ PIXI.FilterTexture.prototype.destroy = function() { var gl = this.gl; @@ -7476,7 +7936,6 @@ this.texture = null; }; - /** * @author Mat Groves * @@ -7509,7 +7968,7 @@ var cacheAlpha = maskData.alpha; var transform = maskData.worldTransform; - context.setTransform(transform[0], transform[3], transform[1], transform[4], transform[2], transform[5]); + context.setTransform(transform.a, transform.c, transform.b, transform.d, transform.tx, transform.ty); PIXI.CanvasGraphics.renderGraphicsMask(maskData, context); @@ -7876,7 +8335,7 @@ 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 * @type HTMLCanvasElement 2d Context */ @@ -7949,6 +8408,7 @@ { if(!this.transparent) { + this.context.globalAlpha = 1; this.context.fillStyle = stage.backgroundColorString; this.context.fillRect(0, 0, this.width, this.height); } @@ -8814,7 +9274,7 @@ context.globalCompositeOperation = PIXI.blendModesCanvas[renderSession.currentBlendMode]; } - context.setTransform(transform[0], transform[3], transform[1], transform[4], transform[2], transform[5]); + context.setTransform(transform.a, transform.c, transform.b, transform.d, transform.tx, transform.ty); PIXI.CanvasGraphics.renderGraphics(this, context); // simple render children! @@ -8842,12 +9302,12 @@ var worldTransform = this.worldTransform; - var a = worldTransform[0]; - var b = worldTransform[3]; - var c = worldTransform[1]; - var d = worldTransform[4]; - var tx = worldTransform[2]; - var ty = worldTransform[5]; + var a = worldTransform.a; + var b = worldTransform.c; + var c = worldTransform.b; + var d = worldTransform.d; + var tx = worldTransform.tx; + var ty = worldTransform.ty; var x1 = a * w1 + c * h1 + tx; var y1 = d * h1 + b * w1 + ty; @@ -9525,7 +9985,7 @@ // allow for trimming - context.setTransform(transform[0], transform[3], transform[1], transform[4], transform[2], transform[5]); + context.setTransform(transform.a, transform.c, transform.b, transform.d, transform.tx, transform.ty); if(!this.__tilePattern) @@ -9583,13 +10043,13 @@ var worldTransform = this.worldTransform; - var a = worldTransform[0]; - var b = worldTransform[3]; - var c = worldTransform[1]; - var d = worldTransform[4]; - var tx = worldTransform[2]; - var ty = worldTransform[5]; - + var a = worldTransform.a; + var b = worldTransform.c; + var c = worldTransform.b; + var d = worldTransform.d; + var tx = worldTransform.tx; + var ty = worldTransform.ty; + var x1 = a * w1 + c * h1 + tx; var y1 = d * h1 + b * w1 + ty; @@ -11189,6 +11649,7 @@ * @uses EventTarget * @constructor * @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) { @@ -11501,23 +11962,23 @@ PIXI.Texture.prototype._updateWebGLuvs = function() { - if(!this._uvs)this._uvs = new Float32Array(8); + if(!this._uvs)this._uvs = new PIXI.TextureUvs(); var frame = this.frame; var tw = this.baseTexture.width; var th = this.baseTexture.height; - this._uvs[0] = frame.x / tw; - this._uvs[1] = frame.y / th; + this._uvs.x0 = frame.x / tw; + this._uvs.y0 = frame.y / th; - this._uvs[2] = (frame.x + frame.width) / tw; - this._uvs[3] = frame.y / th; + this._uvs.x1 = (frame.x + frame.width) / tw; + this._uvs.y1 = frame.y / th; - this._uvs[4] = (frame.x + frame.width) / tw; - this._uvs[5] = (frame.y + frame.height) / th; + this._uvs.x2 = (frame.x + frame.width) / tw; + this._uvs.y2 = (frame.y + frame.height) / th; - this._uvs[6] = frame.x / tw; - this._uvs[7] = (frame.y + frame.height) / th; + this._uvs.x3 = frame.x / tw; + this._uvs.y3 = (frame.y + frame.height) / th; }; /** @@ -11608,6 +12069,28 @@ // this is more for webGL.. it contains updated frames.. PIXI.Texture.frameUpdates = []; +PIXI.TextureUvs = function() +{ + this.x0 = 0; + this.y0 = 0; + + this.x1 = 0; + this.y1 = 0; + + this.x2 = 0; + this.y2 = 0; + + this.x3 = 0; + this.y4 = 0; + + +} + + + + + + /** * @author Mat Groves http://matgroves.com/ @Doormat23 */ @@ -12606,7 +13089,7 @@ */ PIXI.BitmapFontLoader.prototype.load = function() { - this.ajaxRequest = new XMLHttpRequest(); + this.ajaxRequest = new PIXI.ajaxRequest(); var scope = this; this.ajaxRequest.onreadystatechange = function() { @@ -12619,7 +13102,7 @@ }; /** - * Invoked when XML file is loaded, parses the data + * Invoked when the XML file is loaded, parses the data * * @method onXMLLoaded * @private diff --git a/src/pixi/InteractionManager.js b/src/pixi/InteractionManager.js index a7072d6..98ac26c 100644 --- a/src/pixi/InteractionManager.js +++ b/src/pixi/InteractionManager.js @@ -454,8 +454,8 @@ var isSprite = (item instanceof PIXI.Sprite), worldTransform = item.worldTransform, - a00 = worldTransform[0], a01 = worldTransform[1], a02 = worldTransform[2], - a10 = worldTransform[3], a11 = worldTransform[4], a12 = worldTransform[5], + a00 = worldTransform.a, a01 = worldTransform.b, a02 = worldTransform.tx, + a10 = worldTransform.c, a11 = worldTransform.d, a12 = worldTransform.ty, id = 1 / (a00 * a11 + a01 * -a10), x = a11 * id * global.x + -a01 * id * global.y + (a12 * a01 - a02 * a11) * id, y = a00 * id * global.y + -a10 * id * global.x + (-a12 * a00 + a02 * a10) * id; diff --git a/src/pixi/core/Matrix.js b/src/pixi/core/Matrix.js index b88735c..5c4c103 100644 --- a/src/pixi/core/Matrix.js +++ b/src/pixi/core/Matrix.js @@ -12,7 +12,7 @@ return (typeof Float32Array !== 'undefined') ? Float32Array : Array; }; -PIXI.Matrix = PIXI.determineMatrixArrayType(); +PIXI.Matrix2 = PIXI.determineMatrixArrayType(); /** @@ -33,7 +33,7 @@ */ PIXI.mat3.create = function() { - var matrix = new PIXI.Matrix(9); + var matrix = new PIXI.Matrix2(9); matrix[0] = 1; matrix[1] = 0; @@ -118,7 +118,7 @@ */ PIXI.mat3.clone = function(mat) { - var matrix = new PIXI.Matrix(9); + var matrix = new PIXI.Matrix2(9); matrix[0] = mat[0]; matrix[1] = mat[1]; @@ -217,7 +217,7 @@ */ PIXI.mat4.create = function() { - var matrix = new PIXI.Matrix(16); + var matrix = new PIXI.Matrix2(16); matrix[0] = 1; matrix[1] = 0; @@ -349,4 +349,61 @@ }; PIXI.identityMatrix = PIXI.mat3.create(); -PIXI.tempMatrix = PIXI.mat3.create(); \ No newline at end of file +PIXI.tempMatrix = PIXI.mat3.create(); + +PIXI.Matrix = function() +{ + this.a = 1; + this.b = 0; + this.c = 0; + this.d = 1; + this.tx = 0; + this.ty = 0; + + +} + +PIXI.Matrix.prototype.fromArray = function(array) +{ + + this.a = array[0]; + this.b = array[1]; + this.c = array[3]; + this.d = array[4]; + this.tx = array[2]; + this.ty = array[5]; + +} + +PIXI.Matrix.prototype.toArray = function(transpose) +{ + if(!this.array)this.array = new Float32Array(9); + var array = this.array; + + if(transpose) + { + this.array[0] = this.a; + this.array[1] = this.c; + this.array[2] = 0; + this.array[3] = this.b; + this.array[4] = this.d; + this.array[5] = 0; + this.array[6] = this.tx; + this.array[7] = this.ty; + this.array[8] = 1; + } + else + { + this.array[0] = this.a; + this.array[1] = this.b; + this.array[2] = this.tx; + this.array[3] = this.c; + this.array[4] = this.d; + this.array[5] = this.ty; + this.array[6] = 0; + this.array[7] = 0; + this.array[8] = 1; + } + + return array;//[this.a, this.b, this.tx, this.c, this.d, this.ty, 0, 0, 1]; +} diff --git a/src/pixi/display/DisplayObject.js b/src/pixi/display/DisplayObject.js index b6da1a6..32d34a9 100644 --- a/src/pixi/display/DisplayObject.js +++ b/src/pixi/display/DisplayObject.js @@ -139,7 +139,7 @@ * @readOnly * @private */ - this.worldTransform = PIXI.mat3.create(); //mat3.identity(); + this.worldTransform = new PIXI.Matrix()//PIXI.mat3.create(); //mat3.identity(); /** * [read-only] Current transform of the object locally @@ -149,7 +149,7 @@ * @readOnly * @private */ - this.localTransform = PIXI.mat3.create(); //mat3.identity(); + this.localTransform = new PIXI.Matrix()//PIXI.mat3.create(); //mat3.identity(); /** * [NYI] Unknown @@ -407,40 +407,30 @@ this._cr = Math.cos(this.rotation); } - var localTransform = this.localTransform; - var parentTransform = this.parent.worldTransform; - var worldTransform = this.worldTransform; + // var localTransform = this.localTransform//.toArray(); + var parentTransform = this.parent.worldTransform//.toArray(); + var worldTransform = this.worldTransform//.toArray(); //console.log(localTransform) - localTransform[0] = this._cr * this.scale.x; - localTransform[1] = -this._sr * this.scale.y; - localTransform[3] = this._sr * this.scale.x; - localTransform[4] = this._cr * this.scale.y; - - // TODO --> do we even need a local matrix??? - var px = this.pivot.x; var py = this.pivot.y; - // Cache the matrix values (makes for huge speed increases!) - var a00 = localTransform[0], a01 = localTransform[1], a02 = this.position.x - localTransform[0] * px - py * localTransform[1], - a10 = localTransform[3], a11 = localTransform[4], a12 = this.position.y - localTransform[4] * py - px * localTransform[3], + var a00 = this._cr * this.scale.x, + a01 = -this._sr * this.scale.y, + a10 = this._sr * this.scale.x, + a11 = this._cr * this.scale.y, + a02 = this.position.x + a00 * px - py * a01, + a12 = this.position.y + a11 * py - px * a10, + b00 = parentTransform.a, b01 = parentTransform.b, b02 = parentTransform.tx, + b10 = parentTransform.c, b11 = parentTransform.d, b12 = parentTransform.ty; - b00 = parentTransform[0], b01 = parentTransform[1], b02 = parentTransform[2], - b10 = parentTransform[3], b11 = parentTransform[4], b12 = parentTransform[5]; + worldTransform.a = b00 * a00 + b01 * a10; + worldTransform.b = b00 * a01 + b01 * a11; + worldTransform.tx = b00 * a02 + b01 * a12 + b02; - localTransform[2] = a02; - localTransform[5] = a12; + worldTransform.c = b10 * a00 + b11 * a10; + worldTransform.d = b10 * a01 + b11 * a11; + worldTransform.ty = b10 * a02 + b11 * a12 + b12; - worldTransform[0] = b00 * a00 + b01 * a10; - worldTransform[1] = b00 * a01 + b01 * a11; - worldTransform[2] = b00 * a02 + b01 * a12 + b02; - - worldTransform[3] = b10 * a00 + b11 * a10; - worldTransform[4] = b10 * a01 + b11 * a11; - worldTransform[5] = b10 * a02 + b11 * a12 + b12; - - // because we are using affine transformation, we can optimise the matrix concatenation process.. wooo! - // mat3.multiply(this.localTransform, this.parent.worldTransform, this.worldTransform); this.worldAlpha = this.alpha * this.parent.worldAlpha; }; diff --git a/src/pixi/display/Sprite.js b/src/pixi/display/Sprite.js index 9bc9cec..35b4235 100644 --- a/src/pixi/display/Sprite.js +++ b/src/pixi/display/Sprite.js @@ -184,12 +184,12 @@ var worldTransform = this.worldTransform; - var a = worldTransform[0]; - var b = worldTransform[3]; - var c = worldTransform[1]; - var d = worldTransform[4]; - var tx = worldTransform[2]; - var ty = worldTransform[5]; + var a = worldTransform.a; + var b = worldTransform.c; + var c = worldTransform.b; + var d = worldTransform.d; + var tx = worldTransform.tx; + var ty = worldTransform.ty; var x1 = a * w1 + c * h1 + tx; var y1 = d * h1 + b * w1 + ty; @@ -345,7 +345,7 @@ // allow for trimming - context.setTransform(transform[0], transform[3], transform[1], transform[4], transform[2], transform[5]); + context.setTransform(transform.a, transform.c, transform.b, transform.d, transform.tx, transform.ty); //if smoothingEnabled is supported and we need to change the smoothing property for this texture if(renderSession.smoothProperty && renderSession.scaleMode !== this.texture.baseTexture.scaleMode) { diff --git a/src/pixi/display/SpriteBatch.js b/src/pixi/display/SpriteBatch.js index bfd3017..7526390 100644 --- a/src/pixi/display/SpriteBatch.js +++ b/src/pixi/display/SpriteBatch.js @@ -93,7 +93,7 @@ // alow for trimming - context.setTransform(transform[0], transform[3], transform[1], transform[4], transform[2], transform[5]); + context.setTransform(transform.a, transform.c, transform.b, transform.d, transform.tx, transform.ty); context.save(); for (var i = 0; i < this.children.length; i++) { @@ -123,7 +123,7 @@ PIXI.DisplayObject.prototype.updateTransform.call(child); transform = child.localTransform; - context.setTransform(transform[0], transform[3], transform[1], transform[4], transform[2], transform[5]); + context.setTransform(transform.a, transform.c, transform.b, transform.d, transform.tx, transform.ty); context.drawImage(texture.baseTexture.source, frame.x, diff --git a/src/pixi/display/Stage.js b/src/pixi/display/Stage.js index e42c772..743e1e0 100644 --- a/src/pixi/display/Stage.js +++ b/src/pixi/display/Stage.js @@ -30,7 +30,7 @@ * @readOnly * @private */ - this.worldTransform = PIXI.mat3.create(); + this.worldTransform = new PIXI.Matrix()//PIXI.mat3.create(); /** * Whether or not the stage is interactive diff --git a/src/pixi/extras/TilingSprite.js b/src/pixi/extras/TilingSprite.js index 59a1ad1..b19dafe 100644 --- a/src/pixi/extras/TilingSprite.js +++ b/src/pixi/extras/TilingSprite.js @@ -198,7 +198,7 @@ // allow for trimming - context.setTransform(transform[0], transform[3], transform[1], transform[4], transform[2], transform[5]); + context.setTransform(transform.a, transform.c, transform.b, transform.d, transform.tx, transform.ty); if(!this.__tilePattern) @@ -256,13 +256,13 @@ var worldTransform = this.worldTransform; - var a = worldTransform[0]; - var b = worldTransform[3]; - var c = worldTransform[1]; - var d = worldTransform[4]; - var tx = worldTransform[2]; - var ty = worldTransform[5]; - + var a = worldTransform.a; + var b = worldTransform.c; + var c = worldTransform.b; + var d = worldTransform.d; + var tx = worldTransform.tx; + var ty = worldTransform.ty; + var x1 = a * w1 + c * h1 + tx; var y1 = d * h1 + b * w1 + ty; diff --git a/bin/pixi.dev.js b/bin/pixi.dev.js index 8558d80..45e6eba 100644 --- a/bin/pixi.dev.js +++ b/bin/pixi.dev.js @@ -1,10 +1,10 @@ /** * @license * pixi.js - v1.4.3 - * Copyright (c) 2012, Mat Groves + * Copyright (c) 2012-2014, Mat Groves * http://goodboydigital.com/ * - * Compiled: 2014-01-28 + * Compiled: 2014-01-30 * * pixi.js is licensed under the MIT License. * http://www.opensource.org/licenses/mit-license.php @@ -461,7 +461,7 @@ return (typeof Float32Array !== 'undefined') ? Float32Array : Array; }; -PIXI.Matrix = PIXI.determineMatrixArrayType(); +PIXI.Matrix2 = PIXI.determineMatrixArrayType(); /** @@ -482,7 +482,7 @@ */ PIXI.mat3.create = function() { - var matrix = new PIXI.Matrix(9); + var matrix = new PIXI.Matrix2(9); matrix[0] = 1; matrix[1] = 0; @@ -567,7 +567,7 @@ */ PIXI.mat3.clone = function(mat) { - var matrix = new PIXI.Matrix(9); + var matrix = new PIXI.Matrix2(9); matrix[0] = mat[0]; matrix[1] = mat[1]; @@ -666,7 +666,7 @@ */ PIXI.mat4.create = function() { - var matrix = new PIXI.Matrix(16); + var matrix = new PIXI.Matrix2(16); matrix[0] = 1; matrix[1] = 0; @@ -799,6 +799,64 @@ PIXI.identityMatrix = PIXI.mat3.create(); PIXI.tempMatrix = PIXI.mat3.create(); + +PIXI.Matrix = function() +{ + this.a = 1; + this.b = 0; + this.c = 0; + this.d = 1; + this.tx = 0; + this.ty = 0; + + +} + +PIXI.Matrix.prototype.fromArray = function(array) +{ + + this.a = array[0]; + this.b = array[1]; + this.c = array[3]; + this.d = array[4]; + this.tx = array[2]; + this.ty = array[5]; + +} + +PIXI.Matrix.prototype.toArray = function(transpose) +{ + if(!this.array)this.array = new Float32Array(9); + var array = this.array; + + if(transpose) + { + this.array[0] = this.a; + this.array[1] = this.c; + this.array[2] = 0; + this.array[3] = this.b; + this.array[4] = this.d; + this.array[5] = 0; + this.array[6] = this.tx; + this.array[7] = this.ty; + this.array[8] = 1; + } + else + { + this.array[0] = this.a; + this.array[1] = this.b; + this.array[2] = this.tx; + this.array[3] = this.c; + this.array[4] = this.d; + this.array[5] = this.ty; + this.array[6] = 0; + this.array[7] = 0; + this.array[8] = 1; + } + + return array;//[this.a, this.b, this.tx, this.c, this.d, this.ty, 0, 0, 1]; +} + /** * @author Mat Groves http://matgroves.com/ @Doormat23 */ @@ -940,7 +998,7 @@ * @readOnly * @private */ - this.worldTransform = PIXI.mat3.create(); //mat3.identity(); + this.worldTransform = new PIXI.Matrix()//PIXI.mat3.create(); //mat3.identity(); /** * [read-only] Current transform of the object locally @@ -950,7 +1008,7 @@ * @readOnly * @private */ - this.localTransform = PIXI.mat3.create(); //mat3.identity(); + this.localTransform = new PIXI.Matrix()//PIXI.mat3.create(); //mat3.identity(); /** * [NYI] Unknown @@ -1208,40 +1266,30 @@ this._cr = Math.cos(this.rotation); } - var localTransform = this.localTransform; - var parentTransform = this.parent.worldTransform; - var worldTransform = this.worldTransform; + // var localTransform = this.localTransform//.toArray(); + var parentTransform = this.parent.worldTransform//.toArray(); + var worldTransform = this.worldTransform//.toArray(); //console.log(localTransform) - localTransform[0] = this._cr * this.scale.x; - localTransform[1] = -this._sr * this.scale.y; - localTransform[3] = this._sr * this.scale.x; - localTransform[4] = this._cr * this.scale.y; - - // TODO --> do we even need a local matrix??? - var px = this.pivot.x; var py = this.pivot.y; - // Cache the matrix values (makes for huge speed increases!) - var a00 = localTransform[0], a01 = localTransform[1], a02 = this.position.x - localTransform[0] * px - py * localTransform[1], - a10 = localTransform[3], a11 = localTransform[4], a12 = this.position.y - localTransform[4] * py - px * localTransform[3], + var a00 = this._cr * this.scale.x, + a01 = -this._sr * this.scale.y, + a10 = this._sr * this.scale.x, + a11 = this._cr * this.scale.y, + a02 = this.position.x + a00 * px - py * a01, + a12 = this.position.y + a11 * py - px * a10, + b00 = parentTransform.a, b01 = parentTransform.b, b02 = parentTransform.tx, + b10 = parentTransform.c, b11 = parentTransform.d, b12 = parentTransform.ty; - b00 = parentTransform[0], b01 = parentTransform[1], b02 = parentTransform[2], - b10 = parentTransform[3], b11 = parentTransform[4], b12 = parentTransform[5]; + worldTransform.a = b00 * a00 + b01 * a10; + worldTransform.b = b00 * a01 + b01 * a11; + worldTransform.tx = b00 * a02 + b01 * a12 + b02; - localTransform[2] = a02; - localTransform[5] = a12; + worldTransform.c = b10 * a00 + b11 * a10; + worldTransform.d = b10 * a01 + b11 * a11; + worldTransform.ty = b10 * a02 + b11 * a12 + b12; - worldTransform[0] = b00 * a00 + b01 * a10; - worldTransform[1] = b00 * a01 + b01 * a11; - worldTransform[2] = b00 * a02 + b01 * a12 + b02; - - worldTransform[3] = b10 * a00 + b11 * a10; - worldTransform[4] = b10 * a01 + b11 * a11; - worldTransform[5] = b10 * a02 + b11 * a12 + b12; - - // because we are using affine transformation, we can optimise the matrix concatenation process.. wooo! - // mat3.multiply(this.localTransform, this.parent.worldTransform, this.worldTransform); this.worldAlpha = this.alpha * this.parent.worldAlpha; }; @@ -1316,6 +1364,36 @@ // this line is just here to pass jshinting :) renderSession = renderSession; }; + +/** + * The position of the displayObject on the x axis relative to the local coordinates of the parent. + * + * @property x + * @type Number + */ +Object.defineProperty(PIXI.DisplayObject.prototype, 'x', { + get: function() { + return this.position.x; + }, + set: function(value) { + this.position.x = value; + } +}); + +/** + * The position of the displayObject on the y axis relative to the local coordinates of the parent. + * + * @property y + * @type Number + */ +Object.defineProperty(PIXI.DisplayObject.prototype, 'y', { + get: function() { + return this.position.y; + }, + set: function(value) { + this.position.y = value; + } +}); /** * @author Mat Groves http://matgroves.com/ @Doormat23 */ @@ -1534,12 +1612,16 @@ var childMaxX; var childMaxY; + var childVisible = false; + for(var i=0,j=this.children.length; i childMaxY ? maxY : childMaxY; } + if(!childVisible) + return PIXI.EmptyRectangle; + var bounds = this._bounds; bounds.x = minX; @@ -1868,12 +1953,12 @@ var worldTransform = this.worldTransform; - var a = worldTransform[0]; - var b = worldTransform[3]; - var c = worldTransform[1]; - var d = worldTransform[4]; - var tx = worldTransform[2]; - var ty = worldTransform[5]; + var a = worldTransform.a; + var b = worldTransform.c; + var c = worldTransform.b; + var d = worldTransform.d; + var tx = worldTransform.tx; + var ty = worldTransform.ty; var x1 = a * w1 + c * h1 + tx; var y1 = d * h1 + b * w1 + ty; @@ -2029,7 +2114,7 @@ // allow for trimming - context.setTransform(transform[0], transform[3], transform[1], transform[4], transform[2], transform[5]); + context.setTransform(transform.a, transform.c, transform.b, transform.d, transform.tx, transform.ty); //if smoothingEnabled is supported and we need to change the smoothing property for this texture if(renderSession.smoothProperty && renderSession.scaleMode !== this.texture.baseTexture.scaleMode) { @@ -2169,6 +2254,13 @@ PIXI.SpriteBatch.prototype = Object.create( PIXI.DisplayObjectContainer.prototype ); PIXI.SpriteBatch.constructor = PIXI.SpriteBatch; + +/* + * Initialises the spriteBatch + * + * @method initWebGL + * @param gl {WebGLContext} the current WebGL drawing context + */ PIXI.SpriteBatch.prototype.initWebGL = function(gl) { @@ -2234,7 +2326,7 @@ // alow for trimming - context.setTransform(transform[0], transform[3], transform[1], transform[4], transform[2], transform[5]); + context.setTransform(transform.a, transform.c, transform.b, transform.d, transform.tx, transform.ty); context.save(); for (var i = 0; i < this.children.length; i++) { @@ -2264,7 +2356,7 @@ PIXI.DisplayObject.prototype.updateTransform.call(child); transform = child.localTransform; - context.setTransform(transform[0], transform[3], transform[1], transform[4], transform[2], transform[5]); + context.setTransform(transform.a, transform.c, transform.b, transform.d, transform.tx, transform.ty); context.drawImage(texture.baseTexture.source, frame.x, @@ -2484,8 +2576,21 @@ */ PIXI.Text = function(text, style) { + /** + * The canvas element that everything is drawn to + * + * @property canvas + * @type HTMLCanvasElement + */ 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'); + PIXI.Sprite.call(this, PIXI.Texture.fromCanvas(this.canvas)); this.setText(text); @@ -2631,6 +2736,13 @@ this.requiresUpdate = true; }; +/** +* Renders the object using the WebGL renderer +* +* @method _renderWebGL +* @param renderSession {RenderSession} +* @private +*/ PIXI.Text.prototype._renderWebGL = function(renderSession) { if(this.requiresUpdate) @@ -2662,6 +2774,7 @@ /* * http://stackoverflow.com/users/34441/ellisbben * great solution to the problem! + * returns the height of the given font * * @method determineFontHeight * @param fontStyle {Object} @@ -2798,11 +2911,11 @@ /** * 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 - * @param style {Object} The style parameters - * @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 + * @param style {Object} The style parameters, contained as properties of an object */ PIXI.BitmapText.prototype.setStyle = function(style) { @@ -3435,8 +3548,8 @@ var isSprite = (item instanceof PIXI.Sprite), worldTransform = item.worldTransform, - a00 = worldTransform[0], a01 = worldTransform[1], a02 = worldTransform[2], - a10 = worldTransform[3], a11 = worldTransform[4], a12 = worldTransform[5], + a00 = worldTransform.a, a01 = worldTransform.b, a02 = worldTransform.tx, + a10 = worldTransform.c, a11 = worldTransform.d, a12 = worldTransform.ty, id = 1 / (a00 * a11 + a01 * -a10), x = a11 * id * global.x + -a01 * id * global.y + (a12 * a01 - a02 * a11) * id, y = a00 * id * global.y + -a10 * id * global.x + (-a12 * a00 + a02 * a10) * id; @@ -3674,7 +3787,7 @@ * @param backgroundColor {Number} the background color of the stage, you have to pass this in is in hex format * 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); * 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 @@ -3693,7 +3806,7 @@ * @readOnly * @private */ - this.worldTransform = PIXI.mat3.create(); + this.worldTransform = new PIXI.Matrix()//PIXI.mat3.create(); /** * Whether or not the stage is interactive @@ -3901,7 +4014,7 @@ * @class AjaxRequest * @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 @@ -4008,7 +4121,7 @@ * Adds event emitter functionality to a class * * @class EventTarget - * @example + * * function MyEmitter() { * PIXI.EventTarget.call(this); //mixes in event target stuff * } @@ -4018,8 +4131,21 @@ */ PIXI.EventTarget = function () { + /** + * Holds all the listeners + * + * @property listeneners + * @type Object + */ 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 ) { @@ -4036,6 +4162,12 @@ }; + /** + * Fires the event, ie pretends that the event has happened + * + * @method dispatchEvent + * @param event {Event} the event object + */ this.dispatchEvent = this.emit = function ( event ) { if ( !listeners[ event.type ] || !listeners[ event.type ].length ) { @@ -4052,6 +4184,13 @@ }; + /** + * 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 ) { var index = listeners[ type ].indexOf( listener ); @@ -4064,6 +4203,12 @@ }; + /** + * 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 ) { var a = listeners[type]; if (a) @@ -4079,7 +4224,8 @@ * 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 * the browser then this function will return a canvas renderer - * + * @class autoDetectRenderer + * @static * @param width=800 {Number} the width 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 @@ -4149,17 +4295,23 @@ 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 = {}; /** * Triangulates shapes for webGL graphic fills * * @method Triangulate - * @namespace PolyK - * @constructor + * */ PIXI.PolyK.Triangulate = function(p) { @@ -4235,10 +4387,17 @@ }; /** - * Checks if a point is within a triangle + * Checks whether a point is within a triangle * - * @class _PointInTriangle - * @namespace PolyK + * @method _PointInTriangle + * @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 */ PIXI.PolyK._PointInTriangle = function(px, py, ax, ay, bx, by, cx, cy) @@ -4265,10 +4424,10 @@ }; /** - * Checks if a shape is convex + * Checks whether a shape is convex * - * @class _convex - * @namespace PolyK + * @method _convex + * * @private */ PIXI.PolyK._convex = function(ax, ay, bx, by, cx, cy, sign) @@ -4343,6 +4502,10 @@ */ PIXI.PixiShader = function(gl) { + /** + * @property gl + * @type WebGLContext + */ this.gl = gl; /** @@ -4375,7 +4538,9 @@ }; /** -* @method PIXI.PixiShader#init +* Initialises the shader +* @method init +* */ PIXI.PixiShader.prototype.init = function() { @@ -4430,7 +4595,7 @@ * 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 * -* @method PIXI.PixiShader#initUniforms +* @method initUniforms */ PIXI.PixiShader.prototype.initUniforms = function() { @@ -4501,7 +4666,7 @@ /** * 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) { @@ -4542,7 +4707,7 @@ wrapT = gl.REPEAT; } - gl.pixelStorei(gl.UNPACK_FLIP_Y_WEBGL, false); + gl.pixelStorei(gl.UNPACK_FLIP_Y_WEBGL, !!data.flipY); if (data.width) { @@ -4576,7 +4741,7 @@ /** * Updates the shader uniform values. * -* @method PIXI.PixiShader#syncUniforms +* @method syncUniforms */ PIXI.PixiShader.prototype.syncUniforms = function() { @@ -4631,6 +4796,11 @@ }; +/** +* Destroys the shader +* @method destroy +* +*/ PIXI.PixiShader.prototype.destroy = function() { this.gl.deleteProgram( this.program ); @@ -4640,6 +4810,11 @@ this.attributes = null; }; +/** +* +* @property defaultVertexSrc +* @type String +*/ PIXI.PixiShader.defaultVertexSrc = [ 'attribute vec2 aVertexPosition;', 'attribute vec2 aTextureCoord;', @@ -4673,19 +4848,25 @@ /** * @class PIXI.PixiFastShader * @constructor +* @param gl {WebGLContext} the current WebGL drawing context */ PIXI.PixiFastShader = function(gl) { + + /** + * @property gl + * @type WebGLContext + */ this.gl = gl; /** - * @property {any} program - The WebGL program. - */ + * @property {any} program - The WebGL program. + */ this.program = null; /** - * @property {array} fragmentSrc - The fragment shader. - */ + * @property {array} fragmentSrc - The fragment shader. + */ this.fragmentSrc = [ 'precision lowp float;', 'varying vec2 vTextureCoord;', @@ -4696,6 +4877,9 @@ '}' ]; + /** + * @property {array} vertexSrc - The vertex shader + */ this.vertexSrc = [ 'attribute vec2 aVertexPosition;', 'attribute vec2 aPositionCoord;', @@ -4737,7 +4921,9 @@ }; /** -* @method PIXI.PixiFastShader#init +* Initialises the shader +* @method init +* */ PIXI.PixiFastShader.prototype.init = function() { @@ -4787,6 +4973,11 @@ this.program = program; }; +/** +* Destroys the shader +* @method destroy +* +*/ PIXI.PixiFastShader.prototype.destroy = function() { this.gl.deleteProgram( this.program ); @@ -4803,9 +4994,14 @@ PIXI.StripShader = function() { - // the webGL program.. + /** + * @property {any} program - The WebGL program. + */ this.program = null; + /** + * @property {array} fragmentSrc - The fragment shader. + */ this.fragmentSrc = [ 'precision mediump float;', 'varying vec2 vTextureCoord;', @@ -4819,6 +5015,9 @@ '}' ]; + /** + * @property {array} fragmentSrc - The fragment shader. + */ this.vertexSrc = [ 'attribute vec2 aVertexPosition;', 'attribute vec2 aTextureCoord;', @@ -4839,6 +5038,11 @@ ]; }; +/** +* Initialises the shader +* @method init +* +*/ PIXI.StripShader.prototype.init = function() { @@ -4868,14 +5072,28 @@ * @author Mat Groves http://matgroves.com/ @Doormat23 */ - +/** +* @class PrimitiveShader +* @constructor +* @param gl {WebGLContext} the current WebGL drawing context +*/ PIXI.PrimitiveShader = function(gl) { + /** + * @property gl + * @type WebGLContext + */ this.gl = gl; - // the webGL program.. + /** + * @property {any} program - The WebGL program. + */ this.program = null; + /** + * @property fragmentSrc + * @type Array + */ this.fragmentSrc = [ 'precision mediump float;', 'varying vec4 vColor;', @@ -4885,6 +5103,10 @@ '}' ]; + /** + * @property vertexSrc + * @type Array + */ this.vertexSrc = [ 'attribute vec2 aVertexPosition;', 'attribute vec4 aColor;', @@ -4906,6 +5128,11 @@ this.init(); }; +/** +* Initialises the shader +* @method init +* +*/ PIXI.PrimitiveShader.prototype.init = function() { @@ -4932,6 +5159,11 @@ this.program = program; }; +/** +* Destroys the shader +* @method destroy +* +*/ PIXI.PrimitiveShader.prototype.destroy = function() { this.gl.deleteProgram( this.program ); @@ -4948,7 +5180,9 @@ /** * A set of functions used by the webGL renderer to draw the primitive graphics data * - * @class CanvasGraphics + * @class WebGLGraphics + * @private + * @static */ PIXI.WebGLGraphics = function() { @@ -4962,7 +5196,7 @@ * @private * @method renderGraphics * @param graphics {Graphics} - * @param projection {Object} + * @param renderSession {Object} */ PIXI.WebGLGraphics.renderGraphics = function(graphics, renderSession)//projection, offset) { @@ -4999,12 +5233,10 @@ // This could be speeded up for sure! // var m = PIXI.mat3.clone(graphics.worldTransform); - PIXI.mat3.transpose(graphics.worldTransform, PIXI.tempMatrix); - // set the matrix transform gl.blendFunc(gl.ONE, gl.ONE_MINUS_SRC_ALPHA); - gl.uniformMatrix3fv(shader.translationMatrix, false, PIXI.tempMatrix); + gl.uniformMatrix3fv(shader.translationMatrix, false, graphics.worldTransform.toArray(true)); gl.uniform2f(shader.projectionVector, projection.x, -projection.y); gl.uniform2f(shader.offsetVector, -offset.x, -offset.y); @@ -5034,7 +5266,8 @@ * @static * @private * @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) { @@ -5088,7 +5321,7 @@ * @static * @private * @method buildRectangle - * @param graphics {Graphics} + * @param graphicsData {Graphics} The graphics object to draw TODO-Alvin * @param webGLData {Object} */ PIXI.WebGLGraphics.buildRectangle = function(graphicsData, webGLData) @@ -5157,7 +5390,7 @@ * @static * @private * @method buildCircle - * @param graphics {Graphics} + * @param graphicsData {Graphics} The graphics object to draw * @param webGLData {Object} */ PIXI.WebGLGraphics.buildCircle = function(graphicsData, webGLData) @@ -5230,7 +5463,7 @@ * @static * @private * @method buildLine - * @param graphics {Graphics} + * @param graphicsData {Graphics} The graphics object to draw TODO-Alvin * @param webGLData {Object} */ PIXI.WebGLGraphics.buildLine = function(graphicsData, webGLData) @@ -5440,7 +5673,7 @@ * @static * @private * @method buildPoly - * @param graphics {Graphics} + * @param graphicsData {Graphics} The graphics object to draw TODO-Alvin * @param webGLData {Object} */ PIXI.WebGLGraphics.buildPoly = function(graphicsData, webGLData) @@ -6050,6 +6283,13 @@ * @author Mat Groves http://matgroves.com/ @Doormat23 */ + +/** +* @class WebGLMaskManager +* @constructor +* @param gl {WebGLContext} the current WebGL drawing context +* @private +*/ PIXI.WebGLMaskManager = function(gl) { this.maskStack = []; @@ -6058,11 +6298,22 @@ 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) { 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) { var gl = this.gl; @@ -6087,6 +6338,12 @@ 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) { var gl = this.gl; @@ -6110,6 +6367,10 @@ if(this.maskStack.length === 0)gl.disable(gl.STENCIL_TEST); }; +/** +* TODO-Alvin +* @method destroy +*/ PIXI.WebGLMaskManager.prototype.destroy = function() { this.maskStack = null; @@ -6119,6 +6380,12 @@ * @author Mat Groves http://matgroves.com/ @Doormat23 */ +/** +* @class WebGLShaderManager +* @constructor +* @param gl {WebGLContext} the current WebGL drawing context +* @private +*/ PIXI.WebGLShaderManager = function(gl) { @@ -6135,6 +6402,13 @@ //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) { this.gl = gl; @@ -6153,6 +6427,11 @@ }; +/** +* Initialises the context and the properties +* @method setAttribs +* @param attribs {Array} TODO-Alvin +*/ PIXI.WebGLShaderManager.prototype.setAttribs = function(attribs) { // reset temp state @@ -6194,6 +6473,11 @@ // 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) { //if(this.currentShader == shader)return; @@ -6207,6 +6491,10 @@ }; +/** +* Triggers the primitive shader +* @method activatePrimitiveShader +*/ PIXI.WebGLShaderManager.prototype.activatePrimitiveShader = function() { var gl = this.gl; @@ -6217,6 +6505,10 @@ }; +/** +* Disable the primitive shader +* @method deactivatePrimitiveShader +*/ PIXI.WebGLShaderManager.prototype.deactivatePrimitiveShader = function() { var gl = this.gl; @@ -6226,6 +6518,10 @@ this.setAttribs(this.defaultShader.attributes); }; +/** +* Destroys +* @method destroy +*/ PIXI.WebGLShaderManager.prototype.destroy = function() { this.attribState = null; @@ -6252,11 +6548,30 @@ * 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) { - + /** + * TODO-Alvin + * + * @property vertSize + * @type Number + */ this.vertSize = 6; + + /** + * TODO-Alvin + * @property size + * @type Number + */ this.size = 10000;//Math.pow(2, 16) / this.vertSize; // console.log(this.size); @@ -6265,9 +6580,23 @@ //the total number of indices in our batch var numIndices = this.size * 6; - //vertex data + //vertex data + + /** + * Holds the vertices + * + * @property vertices + * @type Float32Array + */ this.vertices = new Float32Array(numVerts); + //index data + /** + * Holds the indices + * + * @property indices + * @type Uint16Array + */ this.indices = new Uint16Array(numIndices); this.lastIndexCount = 0; @@ -6290,6 +6619,12 @@ this.setContext(gl); }; +/** +* +* @method setContext +* +* @param gl {WebGLContext} the current WebGL drawing context +*/ PIXI.WebGLSpriteBatch.prototype.setContext = function(gl) { this.gl = gl; @@ -6311,6 +6646,12 @@ this.currentBlendMode = 99999; }; +/** +* +* @method begin +* +* @param renderSession {RenderSession} the RenderSession +*/ PIXI.WebGLSpriteBatch.prototype.begin = function(renderSession) { this.renderSession = renderSession; @@ -6319,12 +6660,22 @@ this.start(); }; +/** +* +* @method end +* +*/ PIXI.WebGLSpriteBatch.prototype.end = function() { this.flush(); }; - +/** +* +* @method render +* +* @param sprite {Sprite} the sprite to render TODO-Alvin +*/ PIXI.WebGLSpriteBatch.prototype.render = function(sprite) { // check texture.. @@ -6383,21 +6734,21 @@ var index = this.currentBatchSize * 4 * this.vertSize; - var worldTransform = sprite.worldTransform; + var worldTransform = sprite.worldTransform;//.toArray(); - var a = worldTransform[0]; - var b = worldTransform[3]; - var c = worldTransform[1]; - var d = worldTransform[4]; - var tx = worldTransform[2]; - var ty = worldTransform[5]; + var a = worldTransform.a//[0]; + var b = worldTransform.c//[3]; + var c = worldTransform.b//[1]; + var d = worldTransform.d//[4]; + var tx = worldTransform.tx//[2]; + var ty = worldTransform.ty///[5]; // xy verticies[index++] = a * w1 + c * h1 + tx; verticies[index++] = d * h1 + b * w1 + ty; // uv - verticies[index++] = uvs[0]; - verticies[index++] = uvs[1]; + verticies[index++] = uvs.x0; + verticies[index++] = uvs.y0; // color verticies[index++] = alpha; verticies[index++] = tint; @@ -6406,8 +6757,8 @@ verticies[index++] = a * w0 + c * h1 + tx; verticies[index++] = d * h1 + b * w0 + ty; // uv - verticies[index++] = uvs[2]; - verticies[index++] = uvs[3]; + verticies[index++] = uvs.x1; + verticies[index++] = uvs.y1; // color verticies[index++] = alpha; verticies[index++] = tint; @@ -6416,8 +6767,8 @@ verticies[index++] = a * w0 + c * h0 + tx; verticies[index++] = d * h0 + b * w0 + ty; // uv - verticies[index++] = uvs[4]; - verticies[index++] = uvs[5]; + verticies[index++] = uvs.x2; + verticies[index++] = uvs.y2; // color verticies[index++] = alpha; verticies[index++] = tint; @@ -6426,18 +6777,24 @@ verticies[index++] = a * w1 + c * h0 + tx; verticies[index++] = d * h0 + b * w1 + ty; // uv - verticies[index++] = uvs[6]; - verticies[index++] = uvs[7]; + verticies[index++] = uvs.x3; + verticies[index++] = uvs.y3; // color verticies[index++] = alpha; verticies[index++] = tint; - + // increment the batchsize this.currentBatchSize++; }; +/** +* +* @method renderTilingSprite +* +* @param sprite {TilingSprite} the sprite to render TODO-Alvin +*/ PIXI.WebGLSpriteBatch.prototype.renderTilingSprite = function(tilingSprite) { var texture = tilingSprite.tilingTexture; @@ -6553,6 +6910,13 @@ this.currentBatchSize++; }; + +/** +* +* +* @method flush TODO-Alvin +* +*/ PIXI.WebGLSpriteBatch.prototype.flush = function() { // If the batch is length 0 then return as there is nothing to draw @@ -6589,12 +6953,21 @@ this.renderSession.drawCount++; }; - +/** +* +* @method stop +* +*/ PIXI.WebGLSpriteBatch.prototype.stop = function() { this.flush(); }; +/** +* +* @method start +* +*/ PIXI.WebGLSpriteBatch.prototype.start = function() { var gl = this.gl; @@ -6623,6 +6996,13 @@ } }; +/** +* +* @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) { this.flush(); @@ -6633,6 +7013,10 @@ this.gl.blendFunc(blendModeWebGL[0], blendModeWebGL[1]); }; +/** +* Destroys the SpriteBatch +* @method destroy +*/ PIXI.WebGLSpriteBatch.prototype.destroy = function() { @@ -6702,7 +7086,7 @@ this.shader = null; - this.tempMatrix = PIXI.mat3.create(); + this.matrix this.setContext(gl); }; @@ -6732,8 +7116,10 @@ { this.renderSession = renderSession; this.shader = this.renderSession.shaderManager.fastShader; - - PIXI.mat3.transpose(spriteBatch.worldTransform, this.tempMatrix); + + // PIXI.mat3.transpose(spriteBatch.worldTransform.toArray(), this.tempMatrix); + + this.matrix = spriteBatch.worldTransform.toArray(true) // console.log(this.tempMatrix) this.start(); @@ -6829,8 +7215,8 @@ verticies[index++] = sprite.rotation; // uv - verticies[index++] = uvs[0]; - verticies[index++] = uvs[1]; + verticies[index++] = uvs.x0; + verticies[index++] = uvs.y1; // color verticies[index++] = sprite.alpha; @@ -6850,8 +7236,8 @@ verticies[index++] = sprite.rotation; // uv - verticies[index++] = uvs[2]; - verticies[index++] = uvs[3]; + verticies[index++] = uvs.x1; + verticies[index++] = uvs.y1; // color verticies[index++] = sprite.alpha; @@ -6871,8 +7257,8 @@ verticies[index++] = sprite.rotation; // uv - verticies[index++] = uvs[4]; - verticies[index++] = uvs[5]; + verticies[index++] = uvs.x2; + verticies[index++] = uvs.y2; // color verticies[index++] = sprite.alpha; @@ -6894,8 +7280,8 @@ verticies[index++] = sprite.rotation; // uv - verticies[index++] = uvs[6]; - verticies[index++] = uvs[7]; + verticies[index++] = uvs.x3; + verticies[index++] = uvs.y3; // color verticies[index++] = sprite.alpha; @@ -6910,6 +7296,7 @@ PIXI.WebGLFastSpriteBatch.prototype.flush = function() { + // If the batch is length 0 then return as there is nothing to draw if (this.currentBatchSize===0)return; @@ -6968,7 +7355,7 @@ gl.uniform2f(this.shader.projectionVector, projection.x, projection.y); // set the matrix - gl.uniformMatrix3fv(this.shader.uMatrix, false, this.tempMatrix); + gl.uniformMatrix3fv(this.shader.uMatrix, false, this.matrix); // set the pointers var stride = this.vertSize * 4; @@ -7003,7 +7390,13 @@ * @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) { this.transparent = transparent; @@ -7017,7 +7410,11 @@ }; // API - +/** +* Initialises the context and the properties +* @method setContext +* @param gl {WebGLContext} the current WebGL drawing context +*/ PIXI.WebGLFilterManager.prototype.setContext = function(gl) { this.gl = gl; @@ -7026,6 +7423,12 @@ this.initShaderBuffers(); }; +/** +* +* @method begin +* @param renderSession {RenderSession} +* @param buffer {ArrayBuffer} +*/ PIXI.WebGLFilterManager.prototype.begin = function(renderSession, buffer) { this.renderSession = renderSession; @@ -7038,6 +7441,11 @@ 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) { var gl = this.gl; @@ -7119,6 +7527,10 @@ }; +/** +* Removes the last filter from the filter stack and doesn't return it +* @method popFilter +*/ PIXI.WebGLFilterManager.prototype.popFilter = function() { var gl = this.gl; @@ -7292,6 +7704,15 @@ 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) { // use program @@ -7344,6 +7765,10 @@ this.renderSession.drawCount++; }; +/** +* Initialises the shader buffers +* @method initShaderBuffers +*/ PIXI.WebGLFilterManager.prototype.initShaderBuffers = function() { var gl = this.gl; @@ -7400,6 +7825,10 @@ gl.STATIC_DRAW); }; +/** +* TODO-Alvin +* @method destroy +*/ PIXI.WebGLFilterManager.prototype.destroy = function() { var gl = this.gl; @@ -7422,9 +7851,24 @@ gl.deleteBuffer(this.colorBuffer); gl.deleteBuffer(this.indexBuffer); }; +/** + * @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 @@ -7444,6 +7888,11 @@ this.resize(width, height); }; + +/** +* Clears the filter texture +* @method clear +*/ PIXI.FilterTexture.prototype.clear = function() { var gl = this.gl; @@ -7452,6 +7901,13 @@ 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; @@ -7466,6 +7922,10 @@ }; +/** +* Destroys the filter texture +* @method destroy +*/ PIXI.FilterTexture.prototype.destroy = function() { var gl = this.gl; @@ -7476,7 +7936,6 @@ this.texture = null; }; - /** * @author Mat Groves * @@ -7509,7 +7968,7 @@ var cacheAlpha = maskData.alpha; var transform = maskData.worldTransform; - context.setTransform(transform[0], transform[3], transform[1], transform[4], transform[2], transform[5]); + context.setTransform(transform.a, transform.c, transform.b, transform.d, transform.tx, transform.ty); PIXI.CanvasGraphics.renderGraphicsMask(maskData, context); @@ -7876,7 +8335,7 @@ 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 * @type HTMLCanvasElement 2d Context */ @@ -7949,6 +8408,7 @@ { if(!this.transparent) { + this.context.globalAlpha = 1; this.context.fillStyle = stage.backgroundColorString; this.context.fillRect(0, 0, this.width, this.height); } @@ -8814,7 +9274,7 @@ context.globalCompositeOperation = PIXI.blendModesCanvas[renderSession.currentBlendMode]; } - context.setTransform(transform[0], transform[3], transform[1], transform[4], transform[2], transform[5]); + context.setTransform(transform.a, transform.c, transform.b, transform.d, transform.tx, transform.ty); PIXI.CanvasGraphics.renderGraphics(this, context); // simple render children! @@ -8842,12 +9302,12 @@ var worldTransform = this.worldTransform; - var a = worldTransform[0]; - var b = worldTransform[3]; - var c = worldTransform[1]; - var d = worldTransform[4]; - var tx = worldTransform[2]; - var ty = worldTransform[5]; + var a = worldTransform.a; + var b = worldTransform.c; + var c = worldTransform.b; + var d = worldTransform.d; + var tx = worldTransform.tx; + var ty = worldTransform.ty; var x1 = a * w1 + c * h1 + tx; var y1 = d * h1 + b * w1 + ty; @@ -9525,7 +9985,7 @@ // allow for trimming - context.setTransform(transform[0], transform[3], transform[1], transform[4], transform[2], transform[5]); + context.setTransform(transform.a, transform.c, transform.b, transform.d, transform.tx, transform.ty); if(!this.__tilePattern) @@ -9583,13 +10043,13 @@ var worldTransform = this.worldTransform; - var a = worldTransform[0]; - var b = worldTransform[3]; - var c = worldTransform[1]; - var d = worldTransform[4]; - var tx = worldTransform[2]; - var ty = worldTransform[5]; - + var a = worldTransform.a; + var b = worldTransform.c; + var c = worldTransform.b; + var d = worldTransform.d; + var tx = worldTransform.tx; + var ty = worldTransform.ty; + var x1 = a * w1 + c * h1 + tx; var y1 = d * h1 + b * w1 + ty; @@ -11189,6 +11649,7 @@ * @uses EventTarget * @constructor * @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) { @@ -11501,23 +11962,23 @@ PIXI.Texture.prototype._updateWebGLuvs = function() { - if(!this._uvs)this._uvs = new Float32Array(8); + if(!this._uvs)this._uvs = new PIXI.TextureUvs(); var frame = this.frame; var tw = this.baseTexture.width; var th = this.baseTexture.height; - this._uvs[0] = frame.x / tw; - this._uvs[1] = frame.y / th; + this._uvs.x0 = frame.x / tw; + this._uvs.y0 = frame.y / th; - this._uvs[2] = (frame.x + frame.width) / tw; - this._uvs[3] = frame.y / th; + this._uvs.x1 = (frame.x + frame.width) / tw; + this._uvs.y1 = frame.y / th; - this._uvs[4] = (frame.x + frame.width) / tw; - this._uvs[5] = (frame.y + frame.height) / th; + this._uvs.x2 = (frame.x + frame.width) / tw; + this._uvs.y2 = (frame.y + frame.height) / th; - this._uvs[6] = frame.x / tw; - this._uvs[7] = (frame.y + frame.height) / th; + this._uvs.x3 = frame.x / tw; + this._uvs.y3 = (frame.y + frame.height) / th; }; /** @@ -11608,6 +12069,28 @@ // this is more for webGL.. it contains updated frames.. PIXI.Texture.frameUpdates = []; +PIXI.TextureUvs = function() +{ + this.x0 = 0; + this.y0 = 0; + + this.x1 = 0; + this.y1 = 0; + + this.x2 = 0; + this.y2 = 0; + + this.x3 = 0; + this.y4 = 0; + + +} + + + + + + /** * @author Mat Groves http://matgroves.com/ @Doormat23 */ @@ -12606,7 +13089,7 @@ */ PIXI.BitmapFontLoader.prototype.load = function() { - this.ajaxRequest = new XMLHttpRequest(); + this.ajaxRequest = new PIXI.ajaxRequest(); var scope = this; this.ajaxRequest.onreadystatechange = function() { @@ -12619,7 +13102,7 @@ }; /** - * Invoked when XML file is loaded, parses the data + * Invoked when the XML file is loaded, parses the data * * @method onXMLLoaded * @private diff --git a/src/pixi/InteractionManager.js b/src/pixi/InteractionManager.js index a7072d6..98ac26c 100644 --- a/src/pixi/InteractionManager.js +++ b/src/pixi/InteractionManager.js @@ -454,8 +454,8 @@ var isSprite = (item instanceof PIXI.Sprite), worldTransform = item.worldTransform, - a00 = worldTransform[0], a01 = worldTransform[1], a02 = worldTransform[2], - a10 = worldTransform[3], a11 = worldTransform[4], a12 = worldTransform[5], + a00 = worldTransform.a, a01 = worldTransform.b, a02 = worldTransform.tx, + a10 = worldTransform.c, a11 = worldTransform.d, a12 = worldTransform.ty, id = 1 / (a00 * a11 + a01 * -a10), x = a11 * id * global.x + -a01 * id * global.y + (a12 * a01 - a02 * a11) * id, y = a00 * id * global.y + -a10 * id * global.x + (-a12 * a00 + a02 * a10) * id; diff --git a/src/pixi/core/Matrix.js b/src/pixi/core/Matrix.js index b88735c..5c4c103 100644 --- a/src/pixi/core/Matrix.js +++ b/src/pixi/core/Matrix.js @@ -12,7 +12,7 @@ return (typeof Float32Array !== 'undefined') ? Float32Array : Array; }; -PIXI.Matrix = PIXI.determineMatrixArrayType(); +PIXI.Matrix2 = PIXI.determineMatrixArrayType(); /** @@ -33,7 +33,7 @@ */ PIXI.mat3.create = function() { - var matrix = new PIXI.Matrix(9); + var matrix = new PIXI.Matrix2(9); matrix[0] = 1; matrix[1] = 0; @@ -118,7 +118,7 @@ */ PIXI.mat3.clone = function(mat) { - var matrix = new PIXI.Matrix(9); + var matrix = new PIXI.Matrix2(9); matrix[0] = mat[0]; matrix[1] = mat[1]; @@ -217,7 +217,7 @@ */ PIXI.mat4.create = function() { - var matrix = new PIXI.Matrix(16); + var matrix = new PIXI.Matrix2(16); matrix[0] = 1; matrix[1] = 0; @@ -349,4 +349,61 @@ }; PIXI.identityMatrix = PIXI.mat3.create(); -PIXI.tempMatrix = PIXI.mat3.create(); \ No newline at end of file +PIXI.tempMatrix = PIXI.mat3.create(); + +PIXI.Matrix = function() +{ + this.a = 1; + this.b = 0; + this.c = 0; + this.d = 1; + this.tx = 0; + this.ty = 0; + + +} + +PIXI.Matrix.prototype.fromArray = function(array) +{ + + this.a = array[0]; + this.b = array[1]; + this.c = array[3]; + this.d = array[4]; + this.tx = array[2]; + this.ty = array[5]; + +} + +PIXI.Matrix.prototype.toArray = function(transpose) +{ + if(!this.array)this.array = new Float32Array(9); + var array = this.array; + + if(transpose) + { + this.array[0] = this.a; + this.array[1] = this.c; + this.array[2] = 0; + this.array[3] = this.b; + this.array[4] = this.d; + this.array[5] = 0; + this.array[6] = this.tx; + this.array[7] = this.ty; + this.array[8] = 1; + } + else + { + this.array[0] = this.a; + this.array[1] = this.b; + this.array[2] = this.tx; + this.array[3] = this.c; + this.array[4] = this.d; + this.array[5] = this.ty; + this.array[6] = 0; + this.array[7] = 0; + this.array[8] = 1; + } + + return array;//[this.a, this.b, this.tx, this.c, this.d, this.ty, 0, 0, 1]; +} diff --git a/src/pixi/display/DisplayObject.js b/src/pixi/display/DisplayObject.js index b6da1a6..32d34a9 100644 --- a/src/pixi/display/DisplayObject.js +++ b/src/pixi/display/DisplayObject.js @@ -139,7 +139,7 @@ * @readOnly * @private */ - this.worldTransform = PIXI.mat3.create(); //mat3.identity(); + this.worldTransform = new PIXI.Matrix()//PIXI.mat3.create(); //mat3.identity(); /** * [read-only] Current transform of the object locally @@ -149,7 +149,7 @@ * @readOnly * @private */ - this.localTransform = PIXI.mat3.create(); //mat3.identity(); + this.localTransform = new PIXI.Matrix()//PIXI.mat3.create(); //mat3.identity(); /** * [NYI] Unknown @@ -407,40 +407,30 @@ this._cr = Math.cos(this.rotation); } - var localTransform = this.localTransform; - var parentTransform = this.parent.worldTransform; - var worldTransform = this.worldTransform; + // var localTransform = this.localTransform//.toArray(); + var parentTransform = this.parent.worldTransform//.toArray(); + var worldTransform = this.worldTransform//.toArray(); //console.log(localTransform) - localTransform[0] = this._cr * this.scale.x; - localTransform[1] = -this._sr * this.scale.y; - localTransform[3] = this._sr * this.scale.x; - localTransform[4] = this._cr * this.scale.y; - - // TODO --> do we even need a local matrix??? - var px = this.pivot.x; var py = this.pivot.y; - // Cache the matrix values (makes for huge speed increases!) - var a00 = localTransform[0], a01 = localTransform[1], a02 = this.position.x - localTransform[0] * px - py * localTransform[1], - a10 = localTransform[3], a11 = localTransform[4], a12 = this.position.y - localTransform[4] * py - px * localTransform[3], + var a00 = this._cr * this.scale.x, + a01 = -this._sr * this.scale.y, + a10 = this._sr * this.scale.x, + a11 = this._cr * this.scale.y, + a02 = this.position.x + a00 * px - py * a01, + a12 = this.position.y + a11 * py - px * a10, + b00 = parentTransform.a, b01 = parentTransform.b, b02 = parentTransform.tx, + b10 = parentTransform.c, b11 = parentTransform.d, b12 = parentTransform.ty; - b00 = parentTransform[0], b01 = parentTransform[1], b02 = parentTransform[2], - b10 = parentTransform[3], b11 = parentTransform[4], b12 = parentTransform[5]; + worldTransform.a = b00 * a00 + b01 * a10; + worldTransform.b = b00 * a01 + b01 * a11; + worldTransform.tx = b00 * a02 + b01 * a12 + b02; - localTransform[2] = a02; - localTransform[5] = a12; + worldTransform.c = b10 * a00 + b11 * a10; + worldTransform.d = b10 * a01 + b11 * a11; + worldTransform.ty = b10 * a02 + b11 * a12 + b12; - worldTransform[0] = b00 * a00 + b01 * a10; - worldTransform[1] = b00 * a01 + b01 * a11; - worldTransform[2] = b00 * a02 + b01 * a12 + b02; - - worldTransform[3] = b10 * a00 + b11 * a10; - worldTransform[4] = b10 * a01 + b11 * a11; - worldTransform[5] = b10 * a02 + b11 * a12 + b12; - - // because we are using affine transformation, we can optimise the matrix concatenation process.. wooo! - // mat3.multiply(this.localTransform, this.parent.worldTransform, this.worldTransform); this.worldAlpha = this.alpha * this.parent.worldAlpha; }; diff --git a/src/pixi/display/Sprite.js b/src/pixi/display/Sprite.js index 9bc9cec..35b4235 100644 --- a/src/pixi/display/Sprite.js +++ b/src/pixi/display/Sprite.js @@ -184,12 +184,12 @@ var worldTransform = this.worldTransform; - var a = worldTransform[0]; - var b = worldTransform[3]; - var c = worldTransform[1]; - var d = worldTransform[4]; - var tx = worldTransform[2]; - var ty = worldTransform[5]; + var a = worldTransform.a; + var b = worldTransform.c; + var c = worldTransform.b; + var d = worldTransform.d; + var tx = worldTransform.tx; + var ty = worldTransform.ty; var x1 = a * w1 + c * h1 + tx; var y1 = d * h1 + b * w1 + ty; @@ -345,7 +345,7 @@ // allow for trimming - context.setTransform(transform[0], transform[3], transform[1], transform[4], transform[2], transform[5]); + context.setTransform(transform.a, transform.c, transform.b, transform.d, transform.tx, transform.ty); //if smoothingEnabled is supported and we need to change the smoothing property for this texture if(renderSession.smoothProperty && renderSession.scaleMode !== this.texture.baseTexture.scaleMode) { diff --git a/src/pixi/display/SpriteBatch.js b/src/pixi/display/SpriteBatch.js index bfd3017..7526390 100644 --- a/src/pixi/display/SpriteBatch.js +++ b/src/pixi/display/SpriteBatch.js @@ -93,7 +93,7 @@ // alow for trimming - context.setTransform(transform[0], transform[3], transform[1], transform[4], transform[2], transform[5]); + context.setTransform(transform.a, transform.c, transform.b, transform.d, transform.tx, transform.ty); context.save(); for (var i = 0; i < this.children.length; i++) { @@ -123,7 +123,7 @@ PIXI.DisplayObject.prototype.updateTransform.call(child); transform = child.localTransform; - context.setTransform(transform[0], transform[3], transform[1], transform[4], transform[2], transform[5]); + context.setTransform(transform.a, transform.c, transform.b, transform.d, transform.tx, transform.ty); context.drawImage(texture.baseTexture.source, frame.x, diff --git a/src/pixi/display/Stage.js b/src/pixi/display/Stage.js index e42c772..743e1e0 100644 --- a/src/pixi/display/Stage.js +++ b/src/pixi/display/Stage.js @@ -30,7 +30,7 @@ * @readOnly * @private */ - this.worldTransform = PIXI.mat3.create(); + this.worldTransform = new PIXI.Matrix()//PIXI.mat3.create(); /** * Whether or not the stage is interactive diff --git a/src/pixi/extras/TilingSprite.js b/src/pixi/extras/TilingSprite.js index 59a1ad1..b19dafe 100644 --- a/src/pixi/extras/TilingSprite.js +++ b/src/pixi/extras/TilingSprite.js @@ -198,7 +198,7 @@ // allow for trimming - context.setTransform(transform[0], transform[3], transform[1], transform[4], transform[2], transform[5]); + context.setTransform(transform.a, transform.c, transform.b, transform.d, transform.tx, transform.ty); if(!this.__tilePattern) @@ -256,13 +256,13 @@ var worldTransform = this.worldTransform; - var a = worldTransform[0]; - var b = worldTransform[3]; - var c = worldTransform[1]; - var d = worldTransform[4]; - var tx = worldTransform[2]; - var ty = worldTransform[5]; - + var a = worldTransform.a; + var b = worldTransform.c; + var c = worldTransform.b; + var d = worldTransform.d; + var tx = worldTransform.tx; + var ty = worldTransform.ty; + var x1 = a * w1 + c * h1 + tx; var y1 = d * h1 + b * w1 + ty; diff --git a/src/pixi/primitives/Graphics.js b/src/pixi/primitives/Graphics.js index b057305..a215650 100644 --- a/src/pixi/primitives/Graphics.js +++ b/src/pixi/primitives/Graphics.js @@ -422,7 +422,7 @@ context.globalCompositeOperation = PIXI.blendModesCanvas[renderSession.currentBlendMode]; } - context.setTransform(transform[0], transform[3], transform[1], transform[4], transform[2], transform[5]); + context.setTransform(transform.a, transform.c, transform.b, transform.d, transform.tx, transform.ty); PIXI.CanvasGraphics.renderGraphics(this, context); // simple render children! @@ -450,12 +450,12 @@ var worldTransform = this.worldTransform; - var a = worldTransform[0]; - var b = worldTransform[3]; - var c = worldTransform[1]; - var d = worldTransform[4]; - var tx = worldTransform[2]; - var ty = worldTransform[5]; + var a = worldTransform.a; + var b = worldTransform.c; + var c = worldTransform.b; + var d = worldTransform.d; + var tx = worldTransform.tx; + var ty = worldTransform.ty; var x1 = a * w1 + c * h1 + tx; var y1 = d * h1 + b * w1 + ty; diff --git a/bin/pixi.dev.js b/bin/pixi.dev.js index 8558d80..45e6eba 100644 --- a/bin/pixi.dev.js +++ b/bin/pixi.dev.js @@ -1,10 +1,10 @@ /** * @license * pixi.js - v1.4.3 - * Copyright (c) 2012, Mat Groves + * Copyright (c) 2012-2014, Mat Groves * http://goodboydigital.com/ * - * Compiled: 2014-01-28 + * Compiled: 2014-01-30 * * pixi.js is licensed under the MIT License. * http://www.opensource.org/licenses/mit-license.php @@ -461,7 +461,7 @@ return (typeof Float32Array !== 'undefined') ? Float32Array : Array; }; -PIXI.Matrix = PIXI.determineMatrixArrayType(); +PIXI.Matrix2 = PIXI.determineMatrixArrayType(); /** @@ -482,7 +482,7 @@ */ PIXI.mat3.create = function() { - var matrix = new PIXI.Matrix(9); + var matrix = new PIXI.Matrix2(9); matrix[0] = 1; matrix[1] = 0; @@ -567,7 +567,7 @@ */ PIXI.mat3.clone = function(mat) { - var matrix = new PIXI.Matrix(9); + var matrix = new PIXI.Matrix2(9); matrix[0] = mat[0]; matrix[1] = mat[1]; @@ -666,7 +666,7 @@ */ PIXI.mat4.create = function() { - var matrix = new PIXI.Matrix(16); + var matrix = new PIXI.Matrix2(16); matrix[0] = 1; matrix[1] = 0; @@ -799,6 +799,64 @@ PIXI.identityMatrix = PIXI.mat3.create(); PIXI.tempMatrix = PIXI.mat3.create(); + +PIXI.Matrix = function() +{ + this.a = 1; + this.b = 0; + this.c = 0; + this.d = 1; + this.tx = 0; + this.ty = 0; + + +} + +PIXI.Matrix.prototype.fromArray = function(array) +{ + + this.a = array[0]; + this.b = array[1]; + this.c = array[3]; + this.d = array[4]; + this.tx = array[2]; + this.ty = array[5]; + +} + +PIXI.Matrix.prototype.toArray = function(transpose) +{ + if(!this.array)this.array = new Float32Array(9); + var array = this.array; + + if(transpose) + { + this.array[0] = this.a; + this.array[1] = this.c; + this.array[2] = 0; + this.array[3] = this.b; + this.array[4] = this.d; + this.array[5] = 0; + this.array[6] = this.tx; + this.array[7] = this.ty; + this.array[8] = 1; + } + else + { + this.array[0] = this.a; + this.array[1] = this.b; + this.array[2] = this.tx; + this.array[3] = this.c; + this.array[4] = this.d; + this.array[5] = this.ty; + this.array[6] = 0; + this.array[7] = 0; + this.array[8] = 1; + } + + return array;//[this.a, this.b, this.tx, this.c, this.d, this.ty, 0, 0, 1]; +} + /** * @author Mat Groves http://matgroves.com/ @Doormat23 */ @@ -940,7 +998,7 @@ * @readOnly * @private */ - this.worldTransform = PIXI.mat3.create(); //mat3.identity(); + this.worldTransform = new PIXI.Matrix()//PIXI.mat3.create(); //mat3.identity(); /** * [read-only] Current transform of the object locally @@ -950,7 +1008,7 @@ * @readOnly * @private */ - this.localTransform = PIXI.mat3.create(); //mat3.identity(); + this.localTransform = new PIXI.Matrix()//PIXI.mat3.create(); //mat3.identity(); /** * [NYI] Unknown @@ -1208,40 +1266,30 @@ this._cr = Math.cos(this.rotation); } - var localTransform = this.localTransform; - var parentTransform = this.parent.worldTransform; - var worldTransform = this.worldTransform; + // var localTransform = this.localTransform//.toArray(); + var parentTransform = this.parent.worldTransform//.toArray(); + var worldTransform = this.worldTransform//.toArray(); //console.log(localTransform) - localTransform[0] = this._cr * this.scale.x; - localTransform[1] = -this._sr * this.scale.y; - localTransform[3] = this._sr * this.scale.x; - localTransform[4] = this._cr * this.scale.y; - - // TODO --> do we even need a local matrix??? - var px = this.pivot.x; var py = this.pivot.y; - // Cache the matrix values (makes for huge speed increases!) - var a00 = localTransform[0], a01 = localTransform[1], a02 = this.position.x - localTransform[0] * px - py * localTransform[1], - a10 = localTransform[3], a11 = localTransform[4], a12 = this.position.y - localTransform[4] * py - px * localTransform[3], + var a00 = this._cr * this.scale.x, + a01 = -this._sr * this.scale.y, + a10 = this._sr * this.scale.x, + a11 = this._cr * this.scale.y, + a02 = this.position.x + a00 * px - py * a01, + a12 = this.position.y + a11 * py - px * a10, + b00 = parentTransform.a, b01 = parentTransform.b, b02 = parentTransform.tx, + b10 = parentTransform.c, b11 = parentTransform.d, b12 = parentTransform.ty; - b00 = parentTransform[0], b01 = parentTransform[1], b02 = parentTransform[2], - b10 = parentTransform[3], b11 = parentTransform[4], b12 = parentTransform[5]; + worldTransform.a = b00 * a00 + b01 * a10; + worldTransform.b = b00 * a01 + b01 * a11; + worldTransform.tx = b00 * a02 + b01 * a12 + b02; - localTransform[2] = a02; - localTransform[5] = a12; + worldTransform.c = b10 * a00 + b11 * a10; + worldTransform.d = b10 * a01 + b11 * a11; + worldTransform.ty = b10 * a02 + b11 * a12 + b12; - worldTransform[0] = b00 * a00 + b01 * a10; - worldTransform[1] = b00 * a01 + b01 * a11; - worldTransform[2] = b00 * a02 + b01 * a12 + b02; - - worldTransform[3] = b10 * a00 + b11 * a10; - worldTransform[4] = b10 * a01 + b11 * a11; - worldTransform[5] = b10 * a02 + b11 * a12 + b12; - - // because we are using affine transformation, we can optimise the matrix concatenation process.. wooo! - // mat3.multiply(this.localTransform, this.parent.worldTransform, this.worldTransform); this.worldAlpha = this.alpha * this.parent.worldAlpha; }; @@ -1316,6 +1364,36 @@ // this line is just here to pass jshinting :) renderSession = renderSession; }; + +/** + * The position of the displayObject on the x axis relative to the local coordinates of the parent. + * + * @property x + * @type Number + */ +Object.defineProperty(PIXI.DisplayObject.prototype, 'x', { + get: function() { + return this.position.x; + }, + set: function(value) { + this.position.x = value; + } +}); + +/** + * The position of the displayObject on the y axis relative to the local coordinates of the parent. + * + * @property y + * @type Number + */ +Object.defineProperty(PIXI.DisplayObject.prototype, 'y', { + get: function() { + return this.position.y; + }, + set: function(value) { + this.position.y = value; + } +}); /** * @author Mat Groves http://matgroves.com/ @Doormat23 */ @@ -1534,12 +1612,16 @@ var childMaxX; var childMaxY; + var childVisible = false; + for(var i=0,j=this.children.length; i childMaxY ? maxY : childMaxY; } + if(!childVisible) + return PIXI.EmptyRectangle; + var bounds = this._bounds; bounds.x = minX; @@ -1868,12 +1953,12 @@ var worldTransform = this.worldTransform; - var a = worldTransform[0]; - var b = worldTransform[3]; - var c = worldTransform[1]; - var d = worldTransform[4]; - var tx = worldTransform[2]; - var ty = worldTransform[5]; + var a = worldTransform.a; + var b = worldTransform.c; + var c = worldTransform.b; + var d = worldTransform.d; + var tx = worldTransform.tx; + var ty = worldTransform.ty; var x1 = a * w1 + c * h1 + tx; var y1 = d * h1 + b * w1 + ty; @@ -2029,7 +2114,7 @@ // allow for trimming - context.setTransform(transform[0], transform[3], transform[1], transform[4], transform[2], transform[5]); + context.setTransform(transform.a, transform.c, transform.b, transform.d, transform.tx, transform.ty); //if smoothingEnabled is supported and we need to change the smoothing property for this texture if(renderSession.smoothProperty && renderSession.scaleMode !== this.texture.baseTexture.scaleMode) { @@ -2169,6 +2254,13 @@ PIXI.SpriteBatch.prototype = Object.create( PIXI.DisplayObjectContainer.prototype ); PIXI.SpriteBatch.constructor = PIXI.SpriteBatch; + +/* + * Initialises the spriteBatch + * + * @method initWebGL + * @param gl {WebGLContext} the current WebGL drawing context + */ PIXI.SpriteBatch.prototype.initWebGL = function(gl) { @@ -2234,7 +2326,7 @@ // alow for trimming - context.setTransform(transform[0], transform[3], transform[1], transform[4], transform[2], transform[5]); + context.setTransform(transform.a, transform.c, transform.b, transform.d, transform.tx, transform.ty); context.save(); for (var i = 0; i < this.children.length; i++) { @@ -2264,7 +2356,7 @@ PIXI.DisplayObject.prototype.updateTransform.call(child); transform = child.localTransform; - context.setTransform(transform[0], transform[3], transform[1], transform[4], transform[2], transform[5]); + context.setTransform(transform.a, transform.c, transform.b, transform.d, transform.tx, transform.ty); context.drawImage(texture.baseTexture.source, frame.x, @@ -2484,8 +2576,21 @@ */ PIXI.Text = function(text, style) { + /** + * The canvas element that everything is drawn to + * + * @property canvas + * @type HTMLCanvasElement + */ 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'); + PIXI.Sprite.call(this, PIXI.Texture.fromCanvas(this.canvas)); this.setText(text); @@ -2631,6 +2736,13 @@ this.requiresUpdate = true; }; +/** +* Renders the object using the WebGL renderer +* +* @method _renderWebGL +* @param renderSession {RenderSession} +* @private +*/ PIXI.Text.prototype._renderWebGL = function(renderSession) { if(this.requiresUpdate) @@ -2662,6 +2774,7 @@ /* * http://stackoverflow.com/users/34441/ellisbben * great solution to the problem! + * returns the height of the given font * * @method determineFontHeight * @param fontStyle {Object} @@ -2798,11 +2911,11 @@ /** * 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 - * @param style {Object} The style parameters - * @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 + * @param style {Object} The style parameters, contained as properties of an object */ PIXI.BitmapText.prototype.setStyle = function(style) { @@ -3435,8 +3548,8 @@ var isSprite = (item instanceof PIXI.Sprite), worldTransform = item.worldTransform, - a00 = worldTransform[0], a01 = worldTransform[1], a02 = worldTransform[2], - a10 = worldTransform[3], a11 = worldTransform[4], a12 = worldTransform[5], + a00 = worldTransform.a, a01 = worldTransform.b, a02 = worldTransform.tx, + a10 = worldTransform.c, a11 = worldTransform.d, a12 = worldTransform.ty, id = 1 / (a00 * a11 + a01 * -a10), x = a11 * id * global.x + -a01 * id * global.y + (a12 * a01 - a02 * a11) * id, y = a00 * id * global.y + -a10 * id * global.x + (-a12 * a00 + a02 * a10) * id; @@ -3674,7 +3787,7 @@ * @param backgroundColor {Number} the background color of the stage, you have to pass this in is in hex format * 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); * 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 @@ -3693,7 +3806,7 @@ * @readOnly * @private */ - this.worldTransform = PIXI.mat3.create(); + this.worldTransform = new PIXI.Matrix()//PIXI.mat3.create(); /** * Whether or not the stage is interactive @@ -3901,7 +4014,7 @@ * @class AjaxRequest * @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 @@ -4008,7 +4121,7 @@ * Adds event emitter functionality to a class * * @class EventTarget - * @example + * * function MyEmitter() { * PIXI.EventTarget.call(this); //mixes in event target stuff * } @@ -4018,8 +4131,21 @@ */ PIXI.EventTarget = function () { + /** + * Holds all the listeners + * + * @property listeneners + * @type Object + */ 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 ) { @@ -4036,6 +4162,12 @@ }; + /** + * Fires the event, ie pretends that the event has happened + * + * @method dispatchEvent + * @param event {Event} the event object + */ this.dispatchEvent = this.emit = function ( event ) { if ( !listeners[ event.type ] || !listeners[ event.type ].length ) { @@ -4052,6 +4184,13 @@ }; + /** + * 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 ) { var index = listeners[ type ].indexOf( listener ); @@ -4064,6 +4203,12 @@ }; + /** + * 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 ) { var a = listeners[type]; if (a) @@ -4079,7 +4224,8 @@ * 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 * the browser then this function will return a canvas renderer - * + * @class autoDetectRenderer + * @static * @param width=800 {Number} the width 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 @@ -4149,17 +4295,23 @@ 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 = {}; /** * Triangulates shapes for webGL graphic fills * * @method Triangulate - * @namespace PolyK - * @constructor + * */ PIXI.PolyK.Triangulate = function(p) { @@ -4235,10 +4387,17 @@ }; /** - * Checks if a point is within a triangle + * Checks whether a point is within a triangle * - * @class _PointInTriangle - * @namespace PolyK + * @method _PointInTriangle + * @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 */ PIXI.PolyK._PointInTriangle = function(px, py, ax, ay, bx, by, cx, cy) @@ -4265,10 +4424,10 @@ }; /** - * Checks if a shape is convex + * Checks whether a shape is convex * - * @class _convex - * @namespace PolyK + * @method _convex + * * @private */ PIXI.PolyK._convex = function(ax, ay, bx, by, cx, cy, sign) @@ -4343,6 +4502,10 @@ */ PIXI.PixiShader = function(gl) { + /** + * @property gl + * @type WebGLContext + */ this.gl = gl; /** @@ -4375,7 +4538,9 @@ }; /** -* @method PIXI.PixiShader#init +* Initialises the shader +* @method init +* */ PIXI.PixiShader.prototype.init = function() { @@ -4430,7 +4595,7 @@ * 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 * -* @method PIXI.PixiShader#initUniforms +* @method initUniforms */ PIXI.PixiShader.prototype.initUniforms = function() { @@ -4501,7 +4666,7 @@ /** * 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) { @@ -4542,7 +4707,7 @@ wrapT = gl.REPEAT; } - gl.pixelStorei(gl.UNPACK_FLIP_Y_WEBGL, false); + gl.pixelStorei(gl.UNPACK_FLIP_Y_WEBGL, !!data.flipY); if (data.width) { @@ -4576,7 +4741,7 @@ /** * Updates the shader uniform values. * -* @method PIXI.PixiShader#syncUniforms +* @method syncUniforms */ PIXI.PixiShader.prototype.syncUniforms = function() { @@ -4631,6 +4796,11 @@ }; +/** +* Destroys the shader +* @method destroy +* +*/ PIXI.PixiShader.prototype.destroy = function() { this.gl.deleteProgram( this.program ); @@ -4640,6 +4810,11 @@ this.attributes = null; }; +/** +* +* @property defaultVertexSrc +* @type String +*/ PIXI.PixiShader.defaultVertexSrc = [ 'attribute vec2 aVertexPosition;', 'attribute vec2 aTextureCoord;', @@ -4673,19 +4848,25 @@ /** * @class PIXI.PixiFastShader * @constructor +* @param gl {WebGLContext} the current WebGL drawing context */ PIXI.PixiFastShader = function(gl) { + + /** + * @property gl + * @type WebGLContext + */ this.gl = gl; /** - * @property {any} program - The WebGL program. - */ + * @property {any} program - The WebGL program. + */ this.program = null; /** - * @property {array} fragmentSrc - The fragment shader. - */ + * @property {array} fragmentSrc - The fragment shader. + */ this.fragmentSrc = [ 'precision lowp float;', 'varying vec2 vTextureCoord;', @@ -4696,6 +4877,9 @@ '}' ]; + /** + * @property {array} vertexSrc - The vertex shader + */ this.vertexSrc = [ 'attribute vec2 aVertexPosition;', 'attribute vec2 aPositionCoord;', @@ -4737,7 +4921,9 @@ }; /** -* @method PIXI.PixiFastShader#init +* Initialises the shader +* @method init +* */ PIXI.PixiFastShader.prototype.init = function() { @@ -4787,6 +4973,11 @@ this.program = program; }; +/** +* Destroys the shader +* @method destroy +* +*/ PIXI.PixiFastShader.prototype.destroy = function() { this.gl.deleteProgram( this.program ); @@ -4803,9 +4994,14 @@ PIXI.StripShader = function() { - // the webGL program.. + /** + * @property {any} program - The WebGL program. + */ this.program = null; + /** + * @property {array} fragmentSrc - The fragment shader. + */ this.fragmentSrc = [ 'precision mediump float;', 'varying vec2 vTextureCoord;', @@ -4819,6 +5015,9 @@ '}' ]; + /** + * @property {array} fragmentSrc - The fragment shader. + */ this.vertexSrc = [ 'attribute vec2 aVertexPosition;', 'attribute vec2 aTextureCoord;', @@ -4839,6 +5038,11 @@ ]; }; +/** +* Initialises the shader +* @method init +* +*/ PIXI.StripShader.prototype.init = function() { @@ -4868,14 +5072,28 @@ * @author Mat Groves http://matgroves.com/ @Doormat23 */ - +/** +* @class PrimitiveShader +* @constructor +* @param gl {WebGLContext} the current WebGL drawing context +*/ PIXI.PrimitiveShader = function(gl) { + /** + * @property gl + * @type WebGLContext + */ this.gl = gl; - // the webGL program.. + /** + * @property {any} program - The WebGL program. + */ this.program = null; + /** + * @property fragmentSrc + * @type Array + */ this.fragmentSrc = [ 'precision mediump float;', 'varying vec4 vColor;', @@ -4885,6 +5103,10 @@ '}' ]; + /** + * @property vertexSrc + * @type Array + */ this.vertexSrc = [ 'attribute vec2 aVertexPosition;', 'attribute vec4 aColor;', @@ -4906,6 +5128,11 @@ this.init(); }; +/** +* Initialises the shader +* @method init +* +*/ PIXI.PrimitiveShader.prototype.init = function() { @@ -4932,6 +5159,11 @@ this.program = program; }; +/** +* Destroys the shader +* @method destroy +* +*/ PIXI.PrimitiveShader.prototype.destroy = function() { this.gl.deleteProgram( this.program ); @@ -4948,7 +5180,9 @@ /** * A set of functions used by the webGL renderer to draw the primitive graphics data * - * @class CanvasGraphics + * @class WebGLGraphics + * @private + * @static */ PIXI.WebGLGraphics = function() { @@ -4962,7 +5196,7 @@ * @private * @method renderGraphics * @param graphics {Graphics} - * @param projection {Object} + * @param renderSession {Object} */ PIXI.WebGLGraphics.renderGraphics = function(graphics, renderSession)//projection, offset) { @@ -4999,12 +5233,10 @@ // This could be speeded up for sure! // var m = PIXI.mat3.clone(graphics.worldTransform); - PIXI.mat3.transpose(graphics.worldTransform, PIXI.tempMatrix); - // set the matrix transform gl.blendFunc(gl.ONE, gl.ONE_MINUS_SRC_ALPHA); - gl.uniformMatrix3fv(shader.translationMatrix, false, PIXI.tempMatrix); + gl.uniformMatrix3fv(shader.translationMatrix, false, graphics.worldTransform.toArray(true)); gl.uniform2f(shader.projectionVector, projection.x, -projection.y); gl.uniform2f(shader.offsetVector, -offset.x, -offset.y); @@ -5034,7 +5266,8 @@ * @static * @private * @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) { @@ -5088,7 +5321,7 @@ * @static * @private * @method buildRectangle - * @param graphics {Graphics} + * @param graphicsData {Graphics} The graphics object to draw TODO-Alvin * @param webGLData {Object} */ PIXI.WebGLGraphics.buildRectangle = function(graphicsData, webGLData) @@ -5157,7 +5390,7 @@ * @static * @private * @method buildCircle - * @param graphics {Graphics} + * @param graphicsData {Graphics} The graphics object to draw * @param webGLData {Object} */ PIXI.WebGLGraphics.buildCircle = function(graphicsData, webGLData) @@ -5230,7 +5463,7 @@ * @static * @private * @method buildLine - * @param graphics {Graphics} + * @param graphicsData {Graphics} The graphics object to draw TODO-Alvin * @param webGLData {Object} */ PIXI.WebGLGraphics.buildLine = function(graphicsData, webGLData) @@ -5440,7 +5673,7 @@ * @static * @private * @method buildPoly - * @param graphics {Graphics} + * @param graphicsData {Graphics} The graphics object to draw TODO-Alvin * @param webGLData {Object} */ PIXI.WebGLGraphics.buildPoly = function(graphicsData, webGLData) @@ -6050,6 +6283,13 @@ * @author Mat Groves http://matgroves.com/ @Doormat23 */ + +/** +* @class WebGLMaskManager +* @constructor +* @param gl {WebGLContext} the current WebGL drawing context +* @private +*/ PIXI.WebGLMaskManager = function(gl) { this.maskStack = []; @@ -6058,11 +6298,22 @@ 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) { 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) { var gl = this.gl; @@ -6087,6 +6338,12 @@ 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) { var gl = this.gl; @@ -6110,6 +6367,10 @@ if(this.maskStack.length === 0)gl.disable(gl.STENCIL_TEST); }; +/** +* TODO-Alvin +* @method destroy +*/ PIXI.WebGLMaskManager.prototype.destroy = function() { this.maskStack = null; @@ -6119,6 +6380,12 @@ * @author Mat Groves http://matgroves.com/ @Doormat23 */ +/** +* @class WebGLShaderManager +* @constructor +* @param gl {WebGLContext} the current WebGL drawing context +* @private +*/ PIXI.WebGLShaderManager = function(gl) { @@ -6135,6 +6402,13 @@ //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) { this.gl = gl; @@ -6153,6 +6427,11 @@ }; +/** +* Initialises the context and the properties +* @method setAttribs +* @param attribs {Array} TODO-Alvin +*/ PIXI.WebGLShaderManager.prototype.setAttribs = function(attribs) { // reset temp state @@ -6194,6 +6473,11 @@ // 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) { //if(this.currentShader == shader)return; @@ -6207,6 +6491,10 @@ }; +/** +* Triggers the primitive shader +* @method activatePrimitiveShader +*/ PIXI.WebGLShaderManager.prototype.activatePrimitiveShader = function() { var gl = this.gl; @@ -6217,6 +6505,10 @@ }; +/** +* Disable the primitive shader +* @method deactivatePrimitiveShader +*/ PIXI.WebGLShaderManager.prototype.deactivatePrimitiveShader = function() { var gl = this.gl; @@ -6226,6 +6518,10 @@ this.setAttribs(this.defaultShader.attributes); }; +/** +* Destroys +* @method destroy +*/ PIXI.WebGLShaderManager.prototype.destroy = function() { this.attribState = null; @@ -6252,11 +6548,30 @@ * 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) { - + /** + * TODO-Alvin + * + * @property vertSize + * @type Number + */ this.vertSize = 6; + + /** + * TODO-Alvin + * @property size + * @type Number + */ this.size = 10000;//Math.pow(2, 16) / this.vertSize; // console.log(this.size); @@ -6265,9 +6580,23 @@ //the total number of indices in our batch var numIndices = this.size * 6; - //vertex data + //vertex data + + /** + * Holds the vertices + * + * @property vertices + * @type Float32Array + */ this.vertices = new Float32Array(numVerts); + //index data + /** + * Holds the indices + * + * @property indices + * @type Uint16Array + */ this.indices = new Uint16Array(numIndices); this.lastIndexCount = 0; @@ -6290,6 +6619,12 @@ this.setContext(gl); }; +/** +* +* @method setContext +* +* @param gl {WebGLContext} the current WebGL drawing context +*/ PIXI.WebGLSpriteBatch.prototype.setContext = function(gl) { this.gl = gl; @@ -6311,6 +6646,12 @@ this.currentBlendMode = 99999; }; +/** +* +* @method begin +* +* @param renderSession {RenderSession} the RenderSession +*/ PIXI.WebGLSpriteBatch.prototype.begin = function(renderSession) { this.renderSession = renderSession; @@ -6319,12 +6660,22 @@ this.start(); }; +/** +* +* @method end +* +*/ PIXI.WebGLSpriteBatch.prototype.end = function() { this.flush(); }; - +/** +* +* @method render +* +* @param sprite {Sprite} the sprite to render TODO-Alvin +*/ PIXI.WebGLSpriteBatch.prototype.render = function(sprite) { // check texture.. @@ -6383,21 +6734,21 @@ var index = this.currentBatchSize * 4 * this.vertSize; - var worldTransform = sprite.worldTransform; + var worldTransform = sprite.worldTransform;//.toArray(); - var a = worldTransform[0]; - var b = worldTransform[3]; - var c = worldTransform[1]; - var d = worldTransform[4]; - var tx = worldTransform[2]; - var ty = worldTransform[5]; + var a = worldTransform.a//[0]; + var b = worldTransform.c//[3]; + var c = worldTransform.b//[1]; + var d = worldTransform.d//[4]; + var tx = worldTransform.tx//[2]; + var ty = worldTransform.ty///[5]; // xy verticies[index++] = a * w1 + c * h1 + tx; verticies[index++] = d * h1 + b * w1 + ty; // uv - verticies[index++] = uvs[0]; - verticies[index++] = uvs[1]; + verticies[index++] = uvs.x0; + verticies[index++] = uvs.y0; // color verticies[index++] = alpha; verticies[index++] = tint; @@ -6406,8 +6757,8 @@ verticies[index++] = a * w0 + c * h1 + tx; verticies[index++] = d * h1 + b * w0 + ty; // uv - verticies[index++] = uvs[2]; - verticies[index++] = uvs[3]; + verticies[index++] = uvs.x1; + verticies[index++] = uvs.y1; // color verticies[index++] = alpha; verticies[index++] = tint; @@ -6416,8 +6767,8 @@ verticies[index++] = a * w0 + c * h0 + tx; verticies[index++] = d * h0 + b * w0 + ty; // uv - verticies[index++] = uvs[4]; - verticies[index++] = uvs[5]; + verticies[index++] = uvs.x2; + verticies[index++] = uvs.y2; // color verticies[index++] = alpha; verticies[index++] = tint; @@ -6426,18 +6777,24 @@ verticies[index++] = a * w1 + c * h0 + tx; verticies[index++] = d * h0 + b * w1 + ty; // uv - verticies[index++] = uvs[6]; - verticies[index++] = uvs[7]; + verticies[index++] = uvs.x3; + verticies[index++] = uvs.y3; // color verticies[index++] = alpha; verticies[index++] = tint; - + // increment the batchsize this.currentBatchSize++; }; +/** +* +* @method renderTilingSprite +* +* @param sprite {TilingSprite} the sprite to render TODO-Alvin +*/ PIXI.WebGLSpriteBatch.prototype.renderTilingSprite = function(tilingSprite) { var texture = tilingSprite.tilingTexture; @@ -6553,6 +6910,13 @@ this.currentBatchSize++; }; + +/** +* +* +* @method flush TODO-Alvin +* +*/ PIXI.WebGLSpriteBatch.prototype.flush = function() { // If the batch is length 0 then return as there is nothing to draw @@ -6589,12 +6953,21 @@ this.renderSession.drawCount++; }; - +/** +* +* @method stop +* +*/ PIXI.WebGLSpriteBatch.prototype.stop = function() { this.flush(); }; +/** +* +* @method start +* +*/ PIXI.WebGLSpriteBatch.prototype.start = function() { var gl = this.gl; @@ -6623,6 +6996,13 @@ } }; +/** +* +* @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) { this.flush(); @@ -6633,6 +7013,10 @@ this.gl.blendFunc(blendModeWebGL[0], blendModeWebGL[1]); }; +/** +* Destroys the SpriteBatch +* @method destroy +*/ PIXI.WebGLSpriteBatch.prototype.destroy = function() { @@ -6702,7 +7086,7 @@ this.shader = null; - this.tempMatrix = PIXI.mat3.create(); + this.matrix this.setContext(gl); }; @@ -6732,8 +7116,10 @@ { this.renderSession = renderSession; this.shader = this.renderSession.shaderManager.fastShader; - - PIXI.mat3.transpose(spriteBatch.worldTransform, this.tempMatrix); + + // PIXI.mat3.transpose(spriteBatch.worldTransform.toArray(), this.tempMatrix); + + this.matrix = spriteBatch.worldTransform.toArray(true) // console.log(this.tempMatrix) this.start(); @@ -6829,8 +7215,8 @@ verticies[index++] = sprite.rotation; // uv - verticies[index++] = uvs[0]; - verticies[index++] = uvs[1]; + verticies[index++] = uvs.x0; + verticies[index++] = uvs.y1; // color verticies[index++] = sprite.alpha; @@ -6850,8 +7236,8 @@ verticies[index++] = sprite.rotation; // uv - verticies[index++] = uvs[2]; - verticies[index++] = uvs[3]; + verticies[index++] = uvs.x1; + verticies[index++] = uvs.y1; // color verticies[index++] = sprite.alpha; @@ -6871,8 +7257,8 @@ verticies[index++] = sprite.rotation; // uv - verticies[index++] = uvs[4]; - verticies[index++] = uvs[5]; + verticies[index++] = uvs.x2; + verticies[index++] = uvs.y2; // color verticies[index++] = sprite.alpha; @@ -6894,8 +7280,8 @@ verticies[index++] = sprite.rotation; // uv - verticies[index++] = uvs[6]; - verticies[index++] = uvs[7]; + verticies[index++] = uvs.x3; + verticies[index++] = uvs.y3; // color verticies[index++] = sprite.alpha; @@ -6910,6 +7296,7 @@ PIXI.WebGLFastSpriteBatch.prototype.flush = function() { + // If the batch is length 0 then return as there is nothing to draw if (this.currentBatchSize===0)return; @@ -6968,7 +7355,7 @@ gl.uniform2f(this.shader.projectionVector, projection.x, projection.y); // set the matrix - gl.uniformMatrix3fv(this.shader.uMatrix, false, this.tempMatrix); + gl.uniformMatrix3fv(this.shader.uMatrix, false, this.matrix); // set the pointers var stride = this.vertSize * 4; @@ -7003,7 +7390,13 @@ * @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) { this.transparent = transparent; @@ -7017,7 +7410,11 @@ }; // API - +/** +* Initialises the context and the properties +* @method setContext +* @param gl {WebGLContext} the current WebGL drawing context +*/ PIXI.WebGLFilterManager.prototype.setContext = function(gl) { this.gl = gl; @@ -7026,6 +7423,12 @@ this.initShaderBuffers(); }; +/** +* +* @method begin +* @param renderSession {RenderSession} +* @param buffer {ArrayBuffer} +*/ PIXI.WebGLFilterManager.prototype.begin = function(renderSession, buffer) { this.renderSession = renderSession; @@ -7038,6 +7441,11 @@ 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) { var gl = this.gl; @@ -7119,6 +7527,10 @@ }; +/** +* Removes the last filter from the filter stack and doesn't return it +* @method popFilter +*/ PIXI.WebGLFilterManager.prototype.popFilter = function() { var gl = this.gl; @@ -7292,6 +7704,15 @@ 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) { // use program @@ -7344,6 +7765,10 @@ this.renderSession.drawCount++; }; +/** +* Initialises the shader buffers +* @method initShaderBuffers +*/ PIXI.WebGLFilterManager.prototype.initShaderBuffers = function() { var gl = this.gl; @@ -7400,6 +7825,10 @@ gl.STATIC_DRAW); }; +/** +* TODO-Alvin +* @method destroy +*/ PIXI.WebGLFilterManager.prototype.destroy = function() { var gl = this.gl; @@ -7422,9 +7851,24 @@ gl.deleteBuffer(this.colorBuffer); gl.deleteBuffer(this.indexBuffer); }; +/** + * @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 @@ -7444,6 +7888,11 @@ this.resize(width, height); }; + +/** +* Clears the filter texture +* @method clear +*/ PIXI.FilterTexture.prototype.clear = function() { var gl = this.gl; @@ -7452,6 +7901,13 @@ 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; @@ -7466,6 +7922,10 @@ }; +/** +* Destroys the filter texture +* @method destroy +*/ PIXI.FilterTexture.prototype.destroy = function() { var gl = this.gl; @@ -7476,7 +7936,6 @@ this.texture = null; }; - /** * @author Mat Groves * @@ -7509,7 +7968,7 @@ var cacheAlpha = maskData.alpha; var transform = maskData.worldTransform; - context.setTransform(transform[0], transform[3], transform[1], transform[4], transform[2], transform[5]); + context.setTransform(transform.a, transform.c, transform.b, transform.d, transform.tx, transform.ty); PIXI.CanvasGraphics.renderGraphicsMask(maskData, context); @@ -7876,7 +8335,7 @@ 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 * @type HTMLCanvasElement 2d Context */ @@ -7949,6 +8408,7 @@ { if(!this.transparent) { + this.context.globalAlpha = 1; this.context.fillStyle = stage.backgroundColorString; this.context.fillRect(0, 0, this.width, this.height); } @@ -8814,7 +9274,7 @@ context.globalCompositeOperation = PIXI.blendModesCanvas[renderSession.currentBlendMode]; } - context.setTransform(transform[0], transform[3], transform[1], transform[4], transform[2], transform[5]); + context.setTransform(transform.a, transform.c, transform.b, transform.d, transform.tx, transform.ty); PIXI.CanvasGraphics.renderGraphics(this, context); // simple render children! @@ -8842,12 +9302,12 @@ var worldTransform = this.worldTransform; - var a = worldTransform[0]; - var b = worldTransform[3]; - var c = worldTransform[1]; - var d = worldTransform[4]; - var tx = worldTransform[2]; - var ty = worldTransform[5]; + var a = worldTransform.a; + var b = worldTransform.c; + var c = worldTransform.b; + var d = worldTransform.d; + var tx = worldTransform.tx; + var ty = worldTransform.ty; var x1 = a * w1 + c * h1 + tx; var y1 = d * h1 + b * w1 + ty; @@ -9525,7 +9985,7 @@ // allow for trimming - context.setTransform(transform[0], transform[3], transform[1], transform[4], transform[2], transform[5]); + context.setTransform(transform.a, transform.c, transform.b, transform.d, transform.tx, transform.ty); if(!this.__tilePattern) @@ -9583,13 +10043,13 @@ var worldTransform = this.worldTransform; - var a = worldTransform[0]; - var b = worldTransform[3]; - var c = worldTransform[1]; - var d = worldTransform[4]; - var tx = worldTransform[2]; - var ty = worldTransform[5]; - + var a = worldTransform.a; + var b = worldTransform.c; + var c = worldTransform.b; + var d = worldTransform.d; + var tx = worldTransform.tx; + var ty = worldTransform.ty; + var x1 = a * w1 + c * h1 + tx; var y1 = d * h1 + b * w1 + ty; @@ -11189,6 +11649,7 @@ * @uses EventTarget * @constructor * @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) { @@ -11501,23 +11962,23 @@ PIXI.Texture.prototype._updateWebGLuvs = function() { - if(!this._uvs)this._uvs = new Float32Array(8); + if(!this._uvs)this._uvs = new PIXI.TextureUvs(); var frame = this.frame; var tw = this.baseTexture.width; var th = this.baseTexture.height; - this._uvs[0] = frame.x / tw; - this._uvs[1] = frame.y / th; + this._uvs.x0 = frame.x / tw; + this._uvs.y0 = frame.y / th; - this._uvs[2] = (frame.x + frame.width) / tw; - this._uvs[3] = frame.y / th; + this._uvs.x1 = (frame.x + frame.width) / tw; + this._uvs.y1 = frame.y / th; - this._uvs[4] = (frame.x + frame.width) / tw; - this._uvs[5] = (frame.y + frame.height) / th; + this._uvs.x2 = (frame.x + frame.width) / tw; + this._uvs.y2 = (frame.y + frame.height) / th; - this._uvs[6] = frame.x / tw; - this._uvs[7] = (frame.y + frame.height) / th; + this._uvs.x3 = frame.x / tw; + this._uvs.y3 = (frame.y + frame.height) / th; }; /** @@ -11608,6 +12069,28 @@ // this is more for webGL.. it contains updated frames.. PIXI.Texture.frameUpdates = []; +PIXI.TextureUvs = function() +{ + this.x0 = 0; + this.y0 = 0; + + this.x1 = 0; + this.y1 = 0; + + this.x2 = 0; + this.y2 = 0; + + this.x3 = 0; + this.y4 = 0; + + +} + + + + + + /** * @author Mat Groves http://matgroves.com/ @Doormat23 */ @@ -12606,7 +13089,7 @@ */ PIXI.BitmapFontLoader.prototype.load = function() { - this.ajaxRequest = new XMLHttpRequest(); + this.ajaxRequest = new PIXI.ajaxRequest(); var scope = this; this.ajaxRequest.onreadystatechange = function() { @@ -12619,7 +13102,7 @@ }; /** - * Invoked when XML file is loaded, parses the data + * Invoked when the XML file is loaded, parses the data * * @method onXMLLoaded * @private diff --git a/src/pixi/InteractionManager.js b/src/pixi/InteractionManager.js index a7072d6..98ac26c 100644 --- a/src/pixi/InteractionManager.js +++ b/src/pixi/InteractionManager.js @@ -454,8 +454,8 @@ var isSprite = (item instanceof PIXI.Sprite), worldTransform = item.worldTransform, - a00 = worldTransform[0], a01 = worldTransform[1], a02 = worldTransform[2], - a10 = worldTransform[3], a11 = worldTransform[4], a12 = worldTransform[5], + a00 = worldTransform.a, a01 = worldTransform.b, a02 = worldTransform.tx, + a10 = worldTransform.c, a11 = worldTransform.d, a12 = worldTransform.ty, id = 1 / (a00 * a11 + a01 * -a10), x = a11 * id * global.x + -a01 * id * global.y + (a12 * a01 - a02 * a11) * id, y = a00 * id * global.y + -a10 * id * global.x + (-a12 * a00 + a02 * a10) * id; diff --git a/src/pixi/core/Matrix.js b/src/pixi/core/Matrix.js index b88735c..5c4c103 100644 --- a/src/pixi/core/Matrix.js +++ b/src/pixi/core/Matrix.js @@ -12,7 +12,7 @@ return (typeof Float32Array !== 'undefined') ? Float32Array : Array; }; -PIXI.Matrix = PIXI.determineMatrixArrayType(); +PIXI.Matrix2 = PIXI.determineMatrixArrayType(); /** @@ -33,7 +33,7 @@ */ PIXI.mat3.create = function() { - var matrix = new PIXI.Matrix(9); + var matrix = new PIXI.Matrix2(9); matrix[0] = 1; matrix[1] = 0; @@ -118,7 +118,7 @@ */ PIXI.mat3.clone = function(mat) { - var matrix = new PIXI.Matrix(9); + var matrix = new PIXI.Matrix2(9); matrix[0] = mat[0]; matrix[1] = mat[1]; @@ -217,7 +217,7 @@ */ PIXI.mat4.create = function() { - var matrix = new PIXI.Matrix(16); + var matrix = new PIXI.Matrix2(16); matrix[0] = 1; matrix[1] = 0; @@ -349,4 +349,61 @@ }; PIXI.identityMatrix = PIXI.mat3.create(); -PIXI.tempMatrix = PIXI.mat3.create(); \ No newline at end of file +PIXI.tempMatrix = PIXI.mat3.create(); + +PIXI.Matrix = function() +{ + this.a = 1; + this.b = 0; + this.c = 0; + this.d = 1; + this.tx = 0; + this.ty = 0; + + +} + +PIXI.Matrix.prototype.fromArray = function(array) +{ + + this.a = array[0]; + this.b = array[1]; + this.c = array[3]; + this.d = array[4]; + this.tx = array[2]; + this.ty = array[5]; + +} + +PIXI.Matrix.prototype.toArray = function(transpose) +{ + if(!this.array)this.array = new Float32Array(9); + var array = this.array; + + if(transpose) + { + this.array[0] = this.a; + this.array[1] = this.c; + this.array[2] = 0; + this.array[3] = this.b; + this.array[4] = this.d; + this.array[5] = 0; + this.array[6] = this.tx; + this.array[7] = this.ty; + this.array[8] = 1; + } + else + { + this.array[0] = this.a; + this.array[1] = this.b; + this.array[2] = this.tx; + this.array[3] = this.c; + this.array[4] = this.d; + this.array[5] = this.ty; + this.array[6] = 0; + this.array[7] = 0; + this.array[8] = 1; + } + + return array;//[this.a, this.b, this.tx, this.c, this.d, this.ty, 0, 0, 1]; +} diff --git a/src/pixi/display/DisplayObject.js b/src/pixi/display/DisplayObject.js index b6da1a6..32d34a9 100644 --- a/src/pixi/display/DisplayObject.js +++ b/src/pixi/display/DisplayObject.js @@ -139,7 +139,7 @@ * @readOnly * @private */ - this.worldTransform = PIXI.mat3.create(); //mat3.identity(); + this.worldTransform = new PIXI.Matrix()//PIXI.mat3.create(); //mat3.identity(); /** * [read-only] Current transform of the object locally @@ -149,7 +149,7 @@ * @readOnly * @private */ - this.localTransform = PIXI.mat3.create(); //mat3.identity(); + this.localTransform = new PIXI.Matrix()//PIXI.mat3.create(); //mat3.identity(); /** * [NYI] Unknown @@ -407,40 +407,30 @@ this._cr = Math.cos(this.rotation); } - var localTransform = this.localTransform; - var parentTransform = this.parent.worldTransform; - var worldTransform = this.worldTransform; + // var localTransform = this.localTransform//.toArray(); + var parentTransform = this.parent.worldTransform//.toArray(); + var worldTransform = this.worldTransform//.toArray(); //console.log(localTransform) - localTransform[0] = this._cr * this.scale.x; - localTransform[1] = -this._sr * this.scale.y; - localTransform[3] = this._sr * this.scale.x; - localTransform[4] = this._cr * this.scale.y; - - // TODO --> do we even need a local matrix??? - var px = this.pivot.x; var py = this.pivot.y; - // Cache the matrix values (makes for huge speed increases!) - var a00 = localTransform[0], a01 = localTransform[1], a02 = this.position.x - localTransform[0] * px - py * localTransform[1], - a10 = localTransform[3], a11 = localTransform[4], a12 = this.position.y - localTransform[4] * py - px * localTransform[3], + var a00 = this._cr * this.scale.x, + a01 = -this._sr * this.scale.y, + a10 = this._sr * this.scale.x, + a11 = this._cr * this.scale.y, + a02 = this.position.x + a00 * px - py * a01, + a12 = this.position.y + a11 * py - px * a10, + b00 = parentTransform.a, b01 = parentTransform.b, b02 = parentTransform.tx, + b10 = parentTransform.c, b11 = parentTransform.d, b12 = parentTransform.ty; - b00 = parentTransform[0], b01 = parentTransform[1], b02 = parentTransform[2], - b10 = parentTransform[3], b11 = parentTransform[4], b12 = parentTransform[5]; + worldTransform.a = b00 * a00 + b01 * a10; + worldTransform.b = b00 * a01 + b01 * a11; + worldTransform.tx = b00 * a02 + b01 * a12 + b02; - localTransform[2] = a02; - localTransform[5] = a12; + worldTransform.c = b10 * a00 + b11 * a10; + worldTransform.d = b10 * a01 + b11 * a11; + worldTransform.ty = b10 * a02 + b11 * a12 + b12; - worldTransform[0] = b00 * a00 + b01 * a10; - worldTransform[1] = b00 * a01 + b01 * a11; - worldTransform[2] = b00 * a02 + b01 * a12 + b02; - - worldTransform[3] = b10 * a00 + b11 * a10; - worldTransform[4] = b10 * a01 + b11 * a11; - worldTransform[5] = b10 * a02 + b11 * a12 + b12; - - // because we are using affine transformation, we can optimise the matrix concatenation process.. wooo! - // mat3.multiply(this.localTransform, this.parent.worldTransform, this.worldTransform); this.worldAlpha = this.alpha * this.parent.worldAlpha; }; diff --git a/src/pixi/display/Sprite.js b/src/pixi/display/Sprite.js index 9bc9cec..35b4235 100644 --- a/src/pixi/display/Sprite.js +++ b/src/pixi/display/Sprite.js @@ -184,12 +184,12 @@ var worldTransform = this.worldTransform; - var a = worldTransform[0]; - var b = worldTransform[3]; - var c = worldTransform[1]; - var d = worldTransform[4]; - var tx = worldTransform[2]; - var ty = worldTransform[5]; + var a = worldTransform.a; + var b = worldTransform.c; + var c = worldTransform.b; + var d = worldTransform.d; + var tx = worldTransform.tx; + var ty = worldTransform.ty; var x1 = a * w1 + c * h1 + tx; var y1 = d * h1 + b * w1 + ty; @@ -345,7 +345,7 @@ // allow for trimming - context.setTransform(transform[0], transform[3], transform[1], transform[4], transform[2], transform[5]); + context.setTransform(transform.a, transform.c, transform.b, transform.d, transform.tx, transform.ty); //if smoothingEnabled is supported and we need to change the smoothing property for this texture if(renderSession.smoothProperty && renderSession.scaleMode !== this.texture.baseTexture.scaleMode) { diff --git a/src/pixi/display/SpriteBatch.js b/src/pixi/display/SpriteBatch.js index bfd3017..7526390 100644 --- a/src/pixi/display/SpriteBatch.js +++ b/src/pixi/display/SpriteBatch.js @@ -93,7 +93,7 @@ // alow for trimming - context.setTransform(transform[0], transform[3], transform[1], transform[4], transform[2], transform[5]); + context.setTransform(transform.a, transform.c, transform.b, transform.d, transform.tx, transform.ty); context.save(); for (var i = 0; i < this.children.length; i++) { @@ -123,7 +123,7 @@ PIXI.DisplayObject.prototype.updateTransform.call(child); transform = child.localTransform; - context.setTransform(transform[0], transform[3], transform[1], transform[4], transform[2], transform[5]); + context.setTransform(transform.a, transform.c, transform.b, transform.d, transform.tx, transform.ty); context.drawImage(texture.baseTexture.source, frame.x, diff --git a/src/pixi/display/Stage.js b/src/pixi/display/Stage.js index e42c772..743e1e0 100644 --- a/src/pixi/display/Stage.js +++ b/src/pixi/display/Stage.js @@ -30,7 +30,7 @@ * @readOnly * @private */ - this.worldTransform = PIXI.mat3.create(); + this.worldTransform = new PIXI.Matrix()//PIXI.mat3.create(); /** * Whether or not the stage is interactive diff --git a/src/pixi/extras/TilingSprite.js b/src/pixi/extras/TilingSprite.js index 59a1ad1..b19dafe 100644 --- a/src/pixi/extras/TilingSprite.js +++ b/src/pixi/extras/TilingSprite.js @@ -198,7 +198,7 @@ // allow for trimming - context.setTransform(transform[0], transform[3], transform[1], transform[4], transform[2], transform[5]); + context.setTransform(transform.a, transform.c, transform.b, transform.d, transform.tx, transform.ty); if(!this.__tilePattern) @@ -256,13 +256,13 @@ var worldTransform = this.worldTransform; - var a = worldTransform[0]; - var b = worldTransform[3]; - var c = worldTransform[1]; - var d = worldTransform[4]; - var tx = worldTransform[2]; - var ty = worldTransform[5]; - + var a = worldTransform.a; + var b = worldTransform.c; + var c = worldTransform.b; + var d = worldTransform.d; + var tx = worldTransform.tx; + var ty = worldTransform.ty; + var x1 = a * w1 + c * h1 + tx; var y1 = d * h1 + b * w1 + ty; diff --git a/src/pixi/primitives/Graphics.js b/src/pixi/primitives/Graphics.js index b057305..a215650 100644 --- a/src/pixi/primitives/Graphics.js +++ b/src/pixi/primitives/Graphics.js @@ -422,7 +422,7 @@ context.globalCompositeOperation = PIXI.blendModesCanvas[renderSession.currentBlendMode]; } - context.setTransform(transform[0], transform[3], transform[1], transform[4], transform[2], transform[5]); + context.setTransform(transform.a, transform.c, transform.b, transform.d, transform.tx, transform.ty); PIXI.CanvasGraphics.renderGraphics(this, context); // simple render children! @@ -450,12 +450,12 @@ var worldTransform = this.worldTransform; - var a = worldTransform[0]; - var b = worldTransform[3]; - var c = worldTransform[1]; - var d = worldTransform[4]; - var tx = worldTransform[2]; - var ty = worldTransform[5]; + var a = worldTransform.a; + var b = worldTransform.c; + var c = worldTransform.b; + var d = worldTransform.d; + var tx = worldTransform.tx; + var ty = worldTransform.ty; var x1 = a * w1 + c * h1 + tx; var y1 = d * h1 + b * w1 + ty; diff --git a/src/pixi/renderers/canvas/utils/CanvasMaskManager.js b/src/pixi/renderers/canvas/utils/CanvasMaskManager.js index 3bbca21..e9a9f97 100644 --- a/src/pixi/renderers/canvas/utils/CanvasMaskManager.js +++ b/src/pixi/renderers/canvas/utils/CanvasMaskManager.js @@ -30,7 +30,7 @@ var cacheAlpha = maskData.alpha; var transform = maskData.worldTransform; - context.setTransform(transform[0], transform[3], transform[1], transform[4], transform[2], transform[5]); + context.setTransform(transform.a, transform.c, transform.b, transform.d, transform.tx, transform.ty); PIXI.CanvasGraphics.renderGraphicsMask(maskData, context); diff --git a/bin/pixi.dev.js b/bin/pixi.dev.js index 8558d80..45e6eba 100644 --- a/bin/pixi.dev.js +++ b/bin/pixi.dev.js @@ -1,10 +1,10 @@ /** * @license * pixi.js - v1.4.3 - * Copyright (c) 2012, Mat Groves + * Copyright (c) 2012-2014, Mat Groves * http://goodboydigital.com/ * - * Compiled: 2014-01-28 + * Compiled: 2014-01-30 * * pixi.js is licensed under the MIT License. * http://www.opensource.org/licenses/mit-license.php @@ -461,7 +461,7 @@ return (typeof Float32Array !== 'undefined') ? Float32Array : Array; }; -PIXI.Matrix = PIXI.determineMatrixArrayType(); +PIXI.Matrix2 = PIXI.determineMatrixArrayType(); /** @@ -482,7 +482,7 @@ */ PIXI.mat3.create = function() { - var matrix = new PIXI.Matrix(9); + var matrix = new PIXI.Matrix2(9); matrix[0] = 1; matrix[1] = 0; @@ -567,7 +567,7 @@ */ PIXI.mat3.clone = function(mat) { - var matrix = new PIXI.Matrix(9); + var matrix = new PIXI.Matrix2(9); matrix[0] = mat[0]; matrix[1] = mat[1]; @@ -666,7 +666,7 @@ */ PIXI.mat4.create = function() { - var matrix = new PIXI.Matrix(16); + var matrix = new PIXI.Matrix2(16); matrix[0] = 1; matrix[1] = 0; @@ -799,6 +799,64 @@ PIXI.identityMatrix = PIXI.mat3.create(); PIXI.tempMatrix = PIXI.mat3.create(); + +PIXI.Matrix = function() +{ + this.a = 1; + this.b = 0; + this.c = 0; + this.d = 1; + this.tx = 0; + this.ty = 0; + + +} + +PIXI.Matrix.prototype.fromArray = function(array) +{ + + this.a = array[0]; + this.b = array[1]; + this.c = array[3]; + this.d = array[4]; + this.tx = array[2]; + this.ty = array[5]; + +} + +PIXI.Matrix.prototype.toArray = function(transpose) +{ + if(!this.array)this.array = new Float32Array(9); + var array = this.array; + + if(transpose) + { + this.array[0] = this.a; + this.array[1] = this.c; + this.array[2] = 0; + this.array[3] = this.b; + this.array[4] = this.d; + this.array[5] = 0; + this.array[6] = this.tx; + this.array[7] = this.ty; + this.array[8] = 1; + } + else + { + this.array[0] = this.a; + this.array[1] = this.b; + this.array[2] = this.tx; + this.array[3] = this.c; + this.array[4] = this.d; + this.array[5] = this.ty; + this.array[6] = 0; + this.array[7] = 0; + this.array[8] = 1; + } + + return array;//[this.a, this.b, this.tx, this.c, this.d, this.ty, 0, 0, 1]; +} + /** * @author Mat Groves http://matgroves.com/ @Doormat23 */ @@ -940,7 +998,7 @@ * @readOnly * @private */ - this.worldTransform = PIXI.mat3.create(); //mat3.identity(); + this.worldTransform = new PIXI.Matrix()//PIXI.mat3.create(); //mat3.identity(); /** * [read-only] Current transform of the object locally @@ -950,7 +1008,7 @@ * @readOnly * @private */ - this.localTransform = PIXI.mat3.create(); //mat3.identity(); + this.localTransform = new PIXI.Matrix()//PIXI.mat3.create(); //mat3.identity(); /** * [NYI] Unknown @@ -1208,40 +1266,30 @@ this._cr = Math.cos(this.rotation); } - var localTransform = this.localTransform; - var parentTransform = this.parent.worldTransform; - var worldTransform = this.worldTransform; + // var localTransform = this.localTransform//.toArray(); + var parentTransform = this.parent.worldTransform//.toArray(); + var worldTransform = this.worldTransform//.toArray(); //console.log(localTransform) - localTransform[0] = this._cr * this.scale.x; - localTransform[1] = -this._sr * this.scale.y; - localTransform[3] = this._sr * this.scale.x; - localTransform[4] = this._cr * this.scale.y; - - // TODO --> do we even need a local matrix??? - var px = this.pivot.x; var py = this.pivot.y; - // Cache the matrix values (makes for huge speed increases!) - var a00 = localTransform[0], a01 = localTransform[1], a02 = this.position.x - localTransform[0] * px - py * localTransform[1], - a10 = localTransform[3], a11 = localTransform[4], a12 = this.position.y - localTransform[4] * py - px * localTransform[3], + var a00 = this._cr * this.scale.x, + a01 = -this._sr * this.scale.y, + a10 = this._sr * this.scale.x, + a11 = this._cr * this.scale.y, + a02 = this.position.x + a00 * px - py * a01, + a12 = this.position.y + a11 * py - px * a10, + b00 = parentTransform.a, b01 = parentTransform.b, b02 = parentTransform.tx, + b10 = parentTransform.c, b11 = parentTransform.d, b12 = parentTransform.ty; - b00 = parentTransform[0], b01 = parentTransform[1], b02 = parentTransform[2], - b10 = parentTransform[3], b11 = parentTransform[4], b12 = parentTransform[5]; + worldTransform.a = b00 * a00 + b01 * a10; + worldTransform.b = b00 * a01 + b01 * a11; + worldTransform.tx = b00 * a02 + b01 * a12 + b02; - localTransform[2] = a02; - localTransform[5] = a12; + worldTransform.c = b10 * a00 + b11 * a10; + worldTransform.d = b10 * a01 + b11 * a11; + worldTransform.ty = b10 * a02 + b11 * a12 + b12; - worldTransform[0] = b00 * a00 + b01 * a10; - worldTransform[1] = b00 * a01 + b01 * a11; - worldTransform[2] = b00 * a02 + b01 * a12 + b02; - - worldTransform[3] = b10 * a00 + b11 * a10; - worldTransform[4] = b10 * a01 + b11 * a11; - worldTransform[5] = b10 * a02 + b11 * a12 + b12; - - // because we are using affine transformation, we can optimise the matrix concatenation process.. wooo! - // mat3.multiply(this.localTransform, this.parent.worldTransform, this.worldTransform); this.worldAlpha = this.alpha * this.parent.worldAlpha; }; @@ -1316,6 +1364,36 @@ // this line is just here to pass jshinting :) renderSession = renderSession; }; + +/** + * The position of the displayObject on the x axis relative to the local coordinates of the parent. + * + * @property x + * @type Number + */ +Object.defineProperty(PIXI.DisplayObject.prototype, 'x', { + get: function() { + return this.position.x; + }, + set: function(value) { + this.position.x = value; + } +}); + +/** + * The position of the displayObject on the y axis relative to the local coordinates of the parent. + * + * @property y + * @type Number + */ +Object.defineProperty(PIXI.DisplayObject.prototype, 'y', { + get: function() { + return this.position.y; + }, + set: function(value) { + this.position.y = value; + } +}); /** * @author Mat Groves http://matgroves.com/ @Doormat23 */ @@ -1534,12 +1612,16 @@ var childMaxX; var childMaxY; + var childVisible = false; + for(var i=0,j=this.children.length; i childMaxY ? maxY : childMaxY; } + if(!childVisible) + return PIXI.EmptyRectangle; + var bounds = this._bounds; bounds.x = minX; @@ -1868,12 +1953,12 @@ var worldTransform = this.worldTransform; - var a = worldTransform[0]; - var b = worldTransform[3]; - var c = worldTransform[1]; - var d = worldTransform[4]; - var tx = worldTransform[2]; - var ty = worldTransform[5]; + var a = worldTransform.a; + var b = worldTransform.c; + var c = worldTransform.b; + var d = worldTransform.d; + var tx = worldTransform.tx; + var ty = worldTransform.ty; var x1 = a * w1 + c * h1 + tx; var y1 = d * h1 + b * w1 + ty; @@ -2029,7 +2114,7 @@ // allow for trimming - context.setTransform(transform[0], transform[3], transform[1], transform[4], transform[2], transform[5]); + context.setTransform(transform.a, transform.c, transform.b, transform.d, transform.tx, transform.ty); //if smoothingEnabled is supported and we need to change the smoothing property for this texture if(renderSession.smoothProperty && renderSession.scaleMode !== this.texture.baseTexture.scaleMode) { @@ -2169,6 +2254,13 @@ PIXI.SpriteBatch.prototype = Object.create( PIXI.DisplayObjectContainer.prototype ); PIXI.SpriteBatch.constructor = PIXI.SpriteBatch; + +/* + * Initialises the spriteBatch + * + * @method initWebGL + * @param gl {WebGLContext} the current WebGL drawing context + */ PIXI.SpriteBatch.prototype.initWebGL = function(gl) { @@ -2234,7 +2326,7 @@ // alow for trimming - context.setTransform(transform[0], transform[3], transform[1], transform[4], transform[2], transform[5]); + context.setTransform(transform.a, transform.c, transform.b, transform.d, transform.tx, transform.ty); context.save(); for (var i = 0; i < this.children.length; i++) { @@ -2264,7 +2356,7 @@ PIXI.DisplayObject.prototype.updateTransform.call(child); transform = child.localTransform; - context.setTransform(transform[0], transform[3], transform[1], transform[4], transform[2], transform[5]); + context.setTransform(transform.a, transform.c, transform.b, transform.d, transform.tx, transform.ty); context.drawImage(texture.baseTexture.source, frame.x, @@ -2484,8 +2576,21 @@ */ PIXI.Text = function(text, style) { + /** + * The canvas element that everything is drawn to + * + * @property canvas + * @type HTMLCanvasElement + */ 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'); + PIXI.Sprite.call(this, PIXI.Texture.fromCanvas(this.canvas)); this.setText(text); @@ -2631,6 +2736,13 @@ this.requiresUpdate = true; }; +/** +* Renders the object using the WebGL renderer +* +* @method _renderWebGL +* @param renderSession {RenderSession} +* @private +*/ PIXI.Text.prototype._renderWebGL = function(renderSession) { if(this.requiresUpdate) @@ -2662,6 +2774,7 @@ /* * http://stackoverflow.com/users/34441/ellisbben * great solution to the problem! + * returns the height of the given font * * @method determineFontHeight * @param fontStyle {Object} @@ -2798,11 +2911,11 @@ /** * 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 - * @param style {Object} The style parameters - * @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 + * @param style {Object} The style parameters, contained as properties of an object */ PIXI.BitmapText.prototype.setStyle = function(style) { @@ -3435,8 +3548,8 @@ var isSprite = (item instanceof PIXI.Sprite), worldTransform = item.worldTransform, - a00 = worldTransform[0], a01 = worldTransform[1], a02 = worldTransform[2], - a10 = worldTransform[3], a11 = worldTransform[4], a12 = worldTransform[5], + a00 = worldTransform.a, a01 = worldTransform.b, a02 = worldTransform.tx, + a10 = worldTransform.c, a11 = worldTransform.d, a12 = worldTransform.ty, id = 1 / (a00 * a11 + a01 * -a10), x = a11 * id * global.x + -a01 * id * global.y + (a12 * a01 - a02 * a11) * id, y = a00 * id * global.y + -a10 * id * global.x + (-a12 * a00 + a02 * a10) * id; @@ -3674,7 +3787,7 @@ * @param backgroundColor {Number} the background color of the stage, you have to pass this in is in hex format * 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); * 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 @@ -3693,7 +3806,7 @@ * @readOnly * @private */ - this.worldTransform = PIXI.mat3.create(); + this.worldTransform = new PIXI.Matrix()//PIXI.mat3.create(); /** * Whether or not the stage is interactive @@ -3901,7 +4014,7 @@ * @class AjaxRequest * @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 @@ -4008,7 +4121,7 @@ * Adds event emitter functionality to a class * * @class EventTarget - * @example + * * function MyEmitter() { * PIXI.EventTarget.call(this); //mixes in event target stuff * } @@ -4018,8 +4131,21 @@ */ PIXI.EventTarget = function () { + /** + * Holds all the listeners + * + * @property listeneners + * @type Object + */ 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 ) { @@ -4036,6 +4162,12 @@ }; + /** + * Fires the event, ie pretends that the event has happened + * + * @method dispatchEvent + * @param event {Event} the event object + */ this.dispatchEvent = this.emit = function ( event ) { if ( !listeners[ event.type ] || !listeners[ event.type ].length ) { @@ -4052,6 +4184,13 @@ }; + /** + * 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 ) { var index = listeners[ type ].indexOf( listener ); @@ -4064,6 +4203,12 @@ }; + /** + * 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 ) { var a = listeners[type]; if (a) @@ -4079,7 +4224,8 @@ * 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 * the browser then this function will return a canvas renderer - * + * @class autoDetectRenderer + * @static * @param width=800 {Number} the width 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 @@ -4149,17 +4295,23 @@ 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 = {}; /** * Triangulates shapes for webGL graphic fills * * @method Triangulate - * @namespace PolyK - * @constructor + * */ PIXI.PolyK.Triangulate = function(p) { @@ -4235,10 +4387,17 @@ }; /** - * Checks if a point is within a triangle + * Checks whether a point is within a triangle * - * @class _PointInTriangle - * @namespace PolyK + * @method _PointInTriangle + * @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 */ PIXI.PolyK._PointInTriangle = function(px, py, ax, ay, bx, by, cx, cy) @@ -4265,10 +4424,10 @@ }; /** - * Checks if a shape is convex + * Checks whether a shape is convex * - * @class _convex - * @namespace PolyK + * @method _convex + * * @private */ PIXI.PolyK._convex = function(ax, ay, bx, by, cx, cy, sign) @@ -4343,6 +4502,10 @@ */ PIXI.PixiShader = function(gl) { + /** + * @property gl + * @type WebGLContext + */ this.gl = gl; /** @@ -4375,7 +4538,9 @@ }; /** -* @method PIXI.PixiShader#init +* Initialises the shader +* @method init +* */ PIXI.PixiShader.prototype.init = function() { @@ -4430,7 +4595,7 @@ * 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 * -* @method PIXI.PixiShader#initUniforms +* @method initUniforms */ PIXI.PixiShader.prototype.initUniforms = function() { @@ -4501,7 +4666,7 @@ /** * 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) { @@ -4542,7 +4707,7 @@ wrapT = gl.REPEAT; } - gl.pixelStorei(gl.UNPACK_FLIP_Y_WEBGL, false); + gl.pixelStorei(gl.UNPACK_FLIP_Y_WEBGL, !!data.flipY); if (data.width) { @@ -4576,7 +4741,7 @@ /** * Updates the shader uniform values. * -* @method PIXI.PixiShader#syncUniforms +* @method syncUniforms */ PIXI.PixiShader.prototype.syncUniforms = function() { @@ -4631,6 +4796,11 @@ }; +/** +* Destroys the shader +* @method destroy +* +*/ PIXI.PixiShader.prototype.destroy = function() { this.gl.deleteProgram( this.program ); @@ -4640,6 +4810,11 @@ this.attributes = null; }; +/** +* +* @property defaultVertexSrc +* @type String +*/ PIXI.PixiShader.defaultVertexSrc = [ 'attribute vec2 aVertexPosition;', 'attribute vec2 aTextureCoord;', @@ -4673,19 +4848,25 @@ /** * @class PIXI.PixiFastShader * @constructor +* @param gl {WebGLContext} the current WebGL drawing context */ PIXI.PixiFastShader = function(gl) { + + /** + * @property gl + * @type WebGLContext + */ this.gl = gl; /** - * @property {any} program - The WebGL program. - */ + * @property {any} program - The WebGL program. + */ this.program = null; /** - * @property {array} fragmentSrc - The fragment shader. - */ + * @property {array} fragmentSrc - The fragment shader. + */ this.fragmentSrc = [ 'precision lowp float;', 'varying vec2 vTextureCoord;', @@ -4696,6 +4877,9 @@ '}' ]; + /** + * @property {array} vertexSrc - The vertex shader + */ this.vertexSrc = [ 'attribute vec2 aVertexPosition;', 'attribute vec2 aPositionCoord;', @@ -4737,7 +4921,9 @@ }; /** -* @method PIXI.PixiFastShader#init +* Initialises the shader +* @method init +* */ PIXI.PixiFastShader.prototype.init = function() { @@ -4787,6 +4973,11 @@ this.program = program; }; +/** +* Destroys the shader +* @method destroy +* +*/ PIXI.PixiFastShader.prototype.destroy = function() { this.gl.deleteProgram( this.program ); @@ -4803,9 +4994,14 @@ PIXI.StripShader = function() { - // the webGL program.. + /** + * @property {any} program - The WebGL program. + */ this.program = null; + /** + * @property {array} fragmentSrc - The fragment shader. + */ this.fragmentSrc = [ 'precision mediump float;', 'varying vec2 vTextureCoord;', @@ -4819,6 +5015,9 @@ '}' ]; + /** + * @property {array} fragmentSrc - The fragment shader. + */ this.vertexSrc = [ 'attribute vec2 aVertexPosition;', 'attribute vec2 aTextureCoord;', @@ -4839,6 +5038,11 @@ ]; }; +/** +* Initialises the shader +* @method init +* +*/ PIXI.StripShader.prototype.init = function() { @@ -4868,14 +5072,28 @@ * @author Mat Groves http://matgroves.com/ @Doormat23 */ - +/** +* @class PrimitiveShader +* @constructor +* @param gl {WebGLContext} the current WebGL drawing context +*/ PIXI.PrimitiveShader = function(gl) { + /** + * @property gl + * @type WebGLContext + */ this.gl = gl; - // the webGL program.. + /** + * @property {any} program - The WebGL program. + */ this.program = null; + /** + * @property fragmentSrc + * @type Array + */ this.fragmentSrc = [ 'precision mediump float;', 'varying vec4 vColor;', @@ -4885,6 +5103,10 @@ '}' ]; + /** + * @property vertexSrc + * @type Array + */ this.vertexSrc = [ 'attribute vec2 aVertexPosition;', 'attribute vec4 aColor;', @@ -4906,6 +5128,11 @@ this.init(); }; +/** +* Initialises the shader +* @method init +* +*/ PIXI.PrimitiveShader.prototype.init = function() { @@ -4932,6 +5159,11 @@ this.program = program; }; +/** +* Destroys the shader +* @method destroy +* +*/ PIXI.PrimitiveShader.prototype.destroy = function() { this.gl.deleteProgram( this.program ); @@ -4948,7 +5180,9 @@ /** * A set of functions used by the webGL renderer to draw the primitive graphics data * - * @class CanvasGraphics + * @class WebGLGraphics + * @private + * @static */ PIXI.WebGLGraphics = function() { @@ -4962,7 +5196,7 @@ * @private * @method renderGraphics * @param graphics {Graphics} - * @param projection {Object} + * @param renderSession {Object} */ PIXI.WebGLGraphics.renderGraphics = function(graphics, renderSession)//projection, offset) { @@ -4999,12 +5233,10 @@ // This could be speeded up for sure! // var m = PIXI.mat3.clone(graphics.worldTransform); - PIXI.mat3.transpose(graphics.worldTransform, PIXI.tempMatrix); - // set the matrix transform gl.blendFunc(gl.ONE, gl.ONE_MINUS_SRC_ALPHA); - gl.uniformMatrix3fv(shader.translationMatrix, false, PIXI.tempMatrix); + gl.uniformMatrix3fv(shader.translationMatrix, false, graphics.worldTransform.toArray(true)); gl.uniform2f(shader.projectionVector, projection.x, -projection.y); gl.uniform2f(shader.offsetVector, -offset.x, -offset.y); @@ -5034,7 +5266,8 @@ * @static * @private * @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) { @@ -5088,7 +5321,7 @@ * @static * @private * @method buildRectangle - * @param graphics {Graphics} + * @param graphicsData {Graphics} The graphics object to draw TODO-Alvin * @param webGLData {Object} */ PIXI.WebGLGraphics.buildRectangle = function(graphicsData, webGLData) @@ -5157,7 +5390,7 @@ * @static * @private * @method buildCircle - * @param graphics {Graphics} + * @param graphicsData {Graphics} The graphics object to draw * @param webGLData {Object} */ PIXI.WebGLGraphics.buildCircle = function(graphicsData, webGLData) @@ -5230,7 +5463,7 @@ * @static * @private * @method buildLine - * @param graphics {Graphics} + * @param graphicsData {Graphics} The graphics object to draw TODO-Alvin * @param webGLData {Object} */ PIXI.WebGLGraphics.buildLine = function(graphicsData, webGLData) @@ -5440,7 +5673,7 @@ * @static * @private * @method buildPoly - * @param graphics {Graphics} + * @param graphicsData {Graphics} The graphics object to draw TODO-Alvin * @param webGLData {Object} */ PIXI.WebGLGraphics.buildPoly = function(graphicsData, webGLData) @@ -6050,6 +6283,13 @@ * @author Mat Groves http://matgroves.com/ @Doormat23 */ + +/** +* @class WebGLMaskManager +* @constructor +* @param gl {WebGLContext} the current WebGL drawing context +* @private +*/ PIXI.WebGLMaskManager = function(gl) { this.maskStack = []; @@ -6058,11 +6298,22 @@ 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) { 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) { var gl = this.gl; @@ -6087,6 +6338,12 @@ 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) { var gl = this.gl; @@ -6110,6 +6367,10 @@ if(this.maskStack.length === 0)gl.disable(gl.STENCIL_TEST); }; +/** +* TODO-Alvin +* @method destroy +*/ PIXI.WebGLMaskManager.prototype.destroy = function() { this.maskStack = null; @@ -6119,6 +6380,12 @@ * @author Mat Groves http://matgroves.com/ @Doormat23 */ +/** +* @class WebGLShaderManager +* @constructor +* @param gl {WebGLContext} the current WebGL drawing context +* @private +*/ PIXI.WebGLShaderManager = function(gl) { @@ -6135,6 +6402,13 @@ //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) { this.gl = gl; @@ -6153,6 +6427,11 @@ }; +/** +* Initialises the context and the properties +* @method setAttribs +* @param attribs {Array} TODO-Alvin +*/ PIXI.WebGLShaderManager.prototype.setAttribs = function(attribs) { // reset temp state @@ -6194,6 +6473,11 @@ // 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) { //if(this.currentShader == shader)return; @@ -6207,6 +6491,10 @@ }; +/** +* Triggers the primitive shader +* @method activatePrimitiveShader +*/ PIXI.WebGLShaderManager.prototype.activatePrimitiveShader = function() { var gl = this.gl; @@ -6217,6 +6505,10 @@ }; +/** +* Disable the primitive shader +* @method deactivatePrimitiveShader +*/ PIXI.WebGLShaderManager.prototype.deactivatePrimitiveShader = function() { var gl = this.gl; @@ -6226,6 +6518,10 @@ this.setAttribs(this.defaultShader.attributes); }; +/** +* Destroys +* @method destroy +*/ PIXI.WebGLShaderManager.prototype.destroy = function() { this.attribState = null; @@ -6252,11 +6548,30 @@ * 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) { - + /** + * TODO-Alvin + * + * @property vertSize + * @type Number + */ this.vertSize = 6; + + /** + * TODO-Alvin + * @property size + * @type Number + */ this.size = 10000;//Math.pow(2, 16) / this.vertSize; // console.log(this.size); @@ -6265,9 +6580,23 @@ //the total number of indices in our batch var numIndices = this.size * 6; - //vertex data + //vertex data + + /** + * Holds the vertices + * + * @property vertices + * @type Float32Array + */ this.vertices = new Float32Array(numVerts); + //index data + /** + * Holds the indices + * + * @property indices + * @type Uint16Array + */ this.indices = new Uint16Array(numIndices); this.lastIndexCount = 0; @@ -6290,6 +6619,12 @@ this.setContext(gl); }; +/** +* +* @method setContext +* +* @param gl {WebGLContext} the current WebGL drawing context +*/ PIXI.WebGLSpriteBatch.prototype.setContext = function(gl) { this.gl = gl; @@ -6311,6 +6646,12 @@ this.currentBlendMode = 99999; }; +/** +* +* @method begin +* +* @param renderSession {RenderSession} the RenderSession +*/ PIXI.WebGLSpriteBatch.prototype.begin = function(renderSession) { this.renderSession = renderSession; @@ -6319,12 +6660,22 @@ this.start(); }; +/** +* +* @method end +* +*/ PIXI.WebGLSpriteBatch.prototype.end = function() { this.flush(); }; - +/** +* +* @method render +* +* @param sprite {Sprite} the sprite to render TODO-Alvin +*/ PIXI.WebGLSpriteBatch.prototype.render = function(sprite) { // check texture.. @@ -6383,21 +6734,21 @@ var index = this.currentBatchSize * 4 * this.vertSize; - var worldTransform = sprite.worldTransform; + var worldTransform = sprite.worldTransform;//.toArray(); - var a = worldTransform[0]; - var b = worldTransform[3]; - var c = worldTransform[1]; - var d = worldTransform[4]; - var tx = worldTransform[2]; - var ty = worldTransform[5]; + var a = worldTransform.a//[0]; + var b = worldTransform.c//[3]; + var c = worldTransform.b//[1]; + var d = worldTransform.d//[4]; + var tx = worldTransform.tx//[2]; + var ty = worldTransform.ty///[5]; // xy verticies[index++] = a * w1 + c * h1 + tx; verticies[index++] = d * h1 + b * w1 + ty; // uv - verticies[index++] = uvs[0]; - verticies[index++] = uvs[1]; + verticies[index++] = uvs.x0; + verticies[index++] = uvs.y0; // color verticies[index++] = alpha; verticies[index++] = tint; @@ -6406,8 +6757,8 @@ verticies[index++] = a * w0 + c * h1 + tx; verticies[index++] = d * h1 + b * w0 + ty; // uv - verticies[index++] = uvs[2]; - verticies[index++] = uvs[3]; + verticies[index++] = uvs.x1; + verticies[index++] = uvs.y1; // color verticies[index++] = alpha; verticies[index++] = tint; @@ -6416,8 +6767,8 @@ verticies[index++] = a * w0 + c * h0 + tx; verticies[index++] = d * h0 + b * w0 + ty; // uv - verticies[index++] = uvs[4]; - verticies[index++] = uvs[5]; + verticies[index++] = uvs.x2; + verticies[index++] = uvs.y2; // color verticies[index++] = alpha; verticies[index++] = tint; @@ -6426,18 +6777,24 @@ verticies[index++] = a * w1 + c * h0 + tx; verticies[index++] = d * h0 + b * w1 + ty; // uv - verticies[index++] = uvs[6]; - verticies[index++] = uvs[7]; + verticies[index++] = uvs.x3; + verticies[index++] = uvs.y3; // color verticies[index++] = alpha; verticies[index++] = tint; - + // increment the batchsize this.currentBatchSize++; }; +/** +* +* @method renderTilingSprite +* +* @param sprite {TilingSprite} the sprite to render TODO-Alvin +*/ PIXI.WebGLSpriteBatch.prototype.renderTilingSprite = function(tilingSprite) { var texture = tilingSprite.tilingTexture; @@ -6553,6 +6910,13 @@ this.currentBatchSize++; }; + +/** +* +* +* @method flush TODO-Alvin +* +*/ PIXI.WebGLSpriteBatch.prototype.flush = function() { // If the batch is length 0 then return as there is nothing to draw @@ -6589,12 +6953,21 @@ this.renderSession.drawCount++; }; - +/** +* +* @method stop +* +*/ PIXI.WebGLSpriteBatch.prototype.stop = function() { this.flush(); }; +/** +* +* @method start +* +*/ PIXI.WebGLSpriteBatch.prototype.start = function() { var gl = this.gl; @@ -6623,6 +6996,13 @@ } }; +/** +* +* @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) { this.flush(); @@ -6633,6 +7013,10 @@ this.gl.blendFunc(blendModeWebGL[0], blendModeWebGL[1]); }; +/** +* Destroys the SpriteBatch +* @method destroy +*/ PIXI.WebGLSpriteBatch.prototype.destroy = function() { @@ -6702,7 +7086,7 @@ this.shader = null; - this.tempMatrix = PIXI.mat3.create(); + this.matrix this.setContext(gl); }; @@ -6732,8 +7116,10 @@ { this.renderSession = renderSession; this.shader = this.renderSession.shaderManager.fastShader; - - PIXI.mat3.transpose(spriteBatch.worldTransform, this.tempMatrix); + + // PIXI.mat3.transpose(spriteBatch.worldTransform.toArray(), this.tempMatrix); + + this.matrix = spriteBatch.worldTransform.toArray(true) // console.log(this.tempMatrix) this.start(); @@ -6829,8 +7215,8 @@ verticies[index++] = sprite.rotation; // uv - verticies[index++] = uvs[0]; - verticies[index++] = uvs[1]; + verticies[index++] = uvs.x0; + verticies[index++] = uvs.y1; // color verticies[index++] = sprite.alpha; @@ -6850,8 +7236,8 @@ verticies[index++] = sprite.rotation; // uv - verticies[index++] = uvs[2]; - verticies[index++] = uvs[3]; + verticies[index++] = uvs.x1; + verticies[index++] = uvs.y1; // color verticies[index++] = sprite.alpha; @@ -6871,8 +7257,8 @@ verticies[index++] = sprite.rotation; // uv - verticies[index++] = uvs[4]; - verticies[index++] = uvs[5]; + verticies[index++] = uvs.x2; + verticies[index++] = uvs.y2; // color verticies[index++] = sprite.alpha; @@ -6894,8 +7280,8 @@ verticies[index++] = sprite.rotation; // uv - verticies[index++] = uvs[6]; - verticies[index++] = uvs[7]; + verticies[index++] = uvs.x3; + verticies[index++] = uvs.y3; // color verticies[index++] = sprite.alpha; @@ -6910,6 +7296,7 @@ PIXI.WebGLFastSpriteBatch.prototype.flush = function() { + // If the batch is length 0 then return as there is nothing to draw if (this.currentBatchSize===0)return; @@ -6968,7 +7355,7 @@ gl.uniform2f(this.shader.projectionVector, projection.x, projection.y); // set the matrix - gl.uniformMatrix3fv(this.shader.uMatrix, false, this.tempMatrix); + gl.uniformMatrix3fv(this.shader.uMatrix, false, this.matrix); // set the pointers var stride = this.vertSize * 4; @@ -7003,7 +7390,13 @@ * @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) { this.transparent = transparent; @@ -7017,7 +7410,11 @@ }; // API - +/** +* Initialises the context and the properties +* @method setContext +* @param gl {WebGLContext} the current WebGL drawing context +*/ PIXI.WebGLFilterManager.prototype.setContext = function(gl) { this.gl = gl; @@ -7026,6 +7423,12 @@ this.initShaderBuffers(); }; +/** +* +* @method begin +* @param renderSession {RenderSession} +* @param buffer {ArrayBuffer} +*/ PIXI.WebGLFilterManager.prototype.begin = function(renderSession, buffer) { this.renderSession = renderSession; @@ -7038,6 +7441,11 @@ 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) { var gl = this.gl; @@ -7119,6 +7527,10 @@ }; +/** +* Removes the last filter from the filter stack and doesn't return it +* @method popFilter +*/ PIXI.WebGLFilterManager.prototype.popFilter = function() { var gl = this.gl; @@ -7292,6 +7704,15 @@ 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) { // use program @@ -7344,6 +7765,10 @@ this.renderSession.drawCount++; }; +/** +* Initialises the shader buffers +* @method initShaderBuffers +*/ PIXI.WebGLFilterManager.prototype.initShaderBuffers = function() { var gl = this.gl; @@ -7400,6 +7825,10 @@ gl.STATIC_DRAW); }; +/** +* TODO-Alvin +* @method destroy +*/ PIXI.WebGLFilterManager.prototype.destroy = function() { var gl = this.gl; @@ -7422,9 +7851,24 @@ gl.deleteBuffer(this.colorBuffer); gl.deleteBuffer(this.indexBuffer); }; +/** + * @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 @@ -7444,6 +7888,11 @@ this.resize(width, height); }; + +/** +* Clears the filter texture +* @method clear +*/ PIXI.FilterTexture.prototype.clear = function() { var gl = this.gl; @@ -7452,6 +7901,13 @@ 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; @@ -7466,6 +7922,10 @@ }; +/** +* Destroys the filter texture +* @method destroy +*/ PIXI.FilterTexture.prototype.destroy = function() { var gl = this.gl; @@ -7476,7 +7936,6 @@ this.texture = null; }; - /** * @author Mat Groves * @@ -7509,7 +7968,7 @@ var cacheAlpha = maskData.alpha; var transform = maskData.worldTransform; - context.setTransform(transform[0], transform[3], transform[1], transform[4], transform[2], transform[5]); + context.setTransform(transform.a, transform.c, transform.b, transform.d, transform.tx, transform.ty); PIXI.CanvasGraphics.renderGraphicsMask(maskData, context); @@ -7876,7 +8335,7 @@ 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 * @type HTMLCanvasElement 2d Context */ @@ -7949,6 +8408,7 @@ { if(!this.transparent) { + this.context.globalAlpha = 1; this.context.fillStyle = stage.backgroundColorString; this.context.fillRect(0, 0, this.width, this.height); } @@ -8814,7 +9274,7 @@ context.globalCompositeOperation = PIXI.blendModesCanvas[renderSession.currentBlendMode]; } - context.setTransform(transform[0], transform[3], transform[1], transform[4], transform[2], transform[5]); + context.setTransform(transform.a, transform.c, transform.b, transform.d, transform.tx, transform.ty); PIXI.CanvasGraphics.renderGraphics(this, context); // simple render children! @@ -8842,12 +9302,12 @@ var worldTransform = this.worldTransform; - var a = worldTransform[0]; - var b = worldTransform[3]; - var c = worldTransform[1]; - var d = worldTransform[4]; - var tx = worldTransform[2]; - var ty = worldTransform[5]; + var a = worldTransform.a; + var b = worldTransform.c; + var c = worldTransform.b; + var d = worldTransform.d; + var tx = worldTransform.tx; + var ty = worldTransform.ty; var x1 = a * w1 + c * h1 + tx; var y1 = d * h1 + b * w1 + ty; @@ -9525,7 +9985,7 @@ // allow for trimming - context.setTransform(transform[0], transform[3], transform[1], transform[4], transform[2], transform[5]); + context.setTransform(transform.a, transform.c, transform.b, transform.d, transform.tx, transform.ty); if(!this.__tilePattern) @@ -9583,13 +10043,13 @@ var worldTransform = this.worldTransform; - var a = worldTransform[0]; - var b = worldTransform[3]; - var c = worldTransform[1]; - var d = worldTransform[4]; - var tx = worldTransform[2]; - var ty = worldTransform[5]; - + var a = worldTransform.a; + var b = worldTransform.c; + var c = worldTransform.b; + var d = worldTransform.d; + var tx = worldTransform.tx; + var ty = worldTransform.ty; + var x1 = a * w1 + c * h1 + tx; var y1 = d * h1 + b * w1 + ty; @@ -11189,6 +11649,7 @@ * @uses EventTarget * @constructor * @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) { @@ -11501,23 +11962,23 @@ PIXI.Texture.prototype._updateWebGLuvs = function() { - if(!this._uvs)this._uvs = new Float32Array(8); + if(!this._uvs)this._uvs = new PIXI.TextureUvs(); var frame = this.frame; var tw = this.baseTexture.width; var th = this.baseTexture.height; - this._uvs[0] = frame.x / tw; - this._uvs[1] = frame.y / th; + this._uvs.x0 = frame.x / tw; + this._uvs.y0 = frame.y / th; - this._uvs[2] = (frame.x + frame.width) / tw; - this._uvs[3] = frame.y / th; + this._uvs.x1 = (frame.x + frame.width) / tw; + this._uvs.y1 = frame.y / th; - this._uvs[4] = (frame.x + frame.width) / tw; - this._uvs[5] = (frame.y + frame.height) / th; + this._uvs.x2 = (frame.x + frame.width) / tw; + this._uvs.y2 = (frame.y + frame.height) / th; - this._uvs[6] = frame.x / tw; - this._uvs[7] = (frame.y + frame.height) / th; + this._uvs.x3 = frame.x / tw; + this._uvs.y3 = (frame.y + frame.height) / th; }; /** @@ -11608,6 +12069,28 @@ // this is more for webGL.. it contains updated frames.. PIXI.Texture.frameUpdates = []; +PIXI.TextureUvs = function() +{ + this.x0 = 0; + this.y0 = 0; + + this.x1 = 0; + this.y1 = 0; + + this.x2 = 0; + this.y2 = 0; + + this.x3 = 0; + this.y4 = 0; + + +} + + + + + + /** * @author Mat Groves http://matgroves.com/ @Doormat23 */ @@ -12606,7 +13089,7 @@ */ PIXI.BitmapFontLoader.prototype.load = function() { - this.ajaxRequest = new XMLHttpRequest(); + this.ajaxRequest = new PIXI.ajaxRequest(); var scope = this; this.ajaxRequest.onreadystatechange = function() { @@ -12619,7 +13102,7 @@ }; /** - * Invoked when XML file is loaded, parses the data + * Invoked when the XML file is loaded, parses the data * * @method onXMLLoaded * @private diff --git a/src/pixi/InteractionManager.js b/src/pixi/InteractionManager.js index a7072d6..98ac26c 100644 --- a/src/pixi/InteractionManager.js +++ b/src/pixi/InteractionManager.js @@ -454,8 +454,8 @@ var isSprite = (item instanceof PIXI.Sprite), worldTransform = item.worldTransform, - a00 = worldTransform[0], a01 = worldTransform[1], a02 = worldTransform[2], - a10 = worldTransform[3], a11 = worldTransform[4], a12 = worldTransform[5], + a00 = worldTransform.a, a01 = worldTransform.b, a02 = worldTransform.tx, + a10 = worldTransform.c, a11 = worldTransform.d, a12 = worldTransform.ty, id = 1 / (a00 * a11 + a01 * -a10), x = a11 * id * global.x + -a01 * id * global.y + (a12 * a01 - a02 * a11) * id, y = a00 * id * global.y + -a10 * id * global.x + (-a12 * a00 + a02 * a10) * id; diff --git a/src/pixi/core/Matrix.js b/src/pixi/core/Matrix.js index b88735c..5c4c103 100644 --- a/src/pixi/core/Matrix.js +++ b/src/pixi/core/Matrix.js @@ -12,7 +12,7 @@ return (typeof Float32Array !== 'undefined') ? Float32Array : Array; }; -PIXI.Matrix = PIXI.determineMatrixArrayType(); +PIXI.Matrix2 = PIXI.determineMatrixArrayType(); /** @@ -33,7 +33,7 @@ */ PIXI.mat3.create = function() { - var matrix = new PIXI.Matrix(9); + var matrix = new PIXI.Matrix2(9); matrix[0] = 1; matrix[1] = 0; @@ -118,7 +118,7 @@ */ PIXI.mat3.clone = function(mat) { - var matrix = new PIXI.Matrix(9); + var matrix = new PIXI.Matrix2(9); matrix[0] = mat[0]; matrix[1] = mat[1]; @@ -217,7 +217,7 @@ */ PIXI.mat4.create = function() { - var matrix = new PIXI.Matrix(16); + var matrix = new PIXI.Matrix2(16); matrix[0] = 1; matrix[1] = 0; @@ -349,4 +349,61 @@ }; PIXI.identityMatrix = PIXI.mat3.create(); -PIXI.tempMatrix = PIXI.mat3.create(); \ No newline at end of file +PIXI.tempMatrix = PIXI.mat3.create(); + +PIXI.Matrix = function() +{ + this.a = 1; + this.b = 0; + this.c = 0; + this.d = 1; + this.tx = 0; + this.ty = 0; + + +} + +PIXI.Matrix.prototype.fromArray = function(array) +{ + + this.a = array[0]; + this.b = array[1]; + this.c = array[3]; + this.d = array[4]; + this.tx = array[2]; + this.ty = array[5]; + +} + +PIXI.Matrix.prototype.toArray = function(transpose) +{ + if(!this.array)this.array = new Float32Array(9); + var array = this.array; + + if(transpose) + { + this.array[0] = this.a; + this.array[1] = this.c; + this.array[2] = 0; + this.array[3] = this.b; + this.array[4] = this.d; + this.array[5] = 0; + this.array[6] = this.tx; + this.array[7] = this.ty; + this.array[8] = 1; + } + else + { + this.array[0] = this.a; + this.array[1] = this.b; + this.array[2] = this.tx; + this.array[3] = this.c; + this.array[4] = this.d; + this.array[5] = this.ty; + this.array[6] = 0; + this.array[7] = 0; + this.array[8] = 1; + } + + return array;//[this.a, this.b, this.tx, this.c, this.d, this.ty, 0, 0, 1]; +} diff --git a/src/pixi/display/DisplayObject.js b/src/pixi/display/DisplayObject.js index b6da1a6..32d34a9 100644 --- a/src/pixi/display/DisplayObject.js +++ b/src/pixi/display/DisplayObject.js @@ -139,7 +139,7 @@ * @readOnly * @private */ - this.worldTransform = PIXI.mat3.create(); //mat3.identity(); + this.worldTransform = new PIXI.Matrix()//PIXI.mat3.create(); //mat3.identity(); /** * [read-only] Current transform of the object locally @@ -149,7 +149,7 @@ * @readOnly * @private */ - this.localTransform = PIXI.mat3.create(); //mat3.identity(); + this.localTransform = new PIXI.Matrix()//PIXI.mat3.create(); //mat3.identity(); /** * [NYI] Unknown @@ -407,40 +407,30 @@ this._cr = Math.cos(this.rotation); } - var localTransform = this.localTransform; - var parentTransform = this.parent.worldTransform; - var worldTransform = this.worldTransform; + // var localTransform = this.localTransform//.toArray(); + var parentTransform = this.parent.worldTransform//.toArray(); + var worldTransform = this.worldTransform//.toArray(); //console.log(localTransform) - localTransform[0] = this._cr * this.scale.x; - localTransform[1] = -this._sr * this.scale.y; - localTransform[3] = this._sr * this.scale.x; - localTransform[4] = this._cr * this.scale.y; - - // TODO --> do we even need a local matrix??? - var px = this.pivot.x; var py = this.pivot.y; - // Cache the matrix values (makes for huge speed increases!) - var a00 = localTransform[0], a01 = localTransform[1], a02 = this.position.x - localTransform[0] * px - py * localTransform[1], - a10 = localTransform[3], a11 = localTransform[4], a12 = this.position.y - localTransform[4] * py - px * localTransform[3], + var a00 = this._cr * this.scale.x, + a01 = -this._sr * this.scale.y, + a10 = this._sr * this.scale.x, + a11 = this._cr * this.scale.y, + a02 = this.position.x + a00 * px - py * a01, + a12 = this.position.y + a11 * py - px * a10, + b00 = parentTransform.a, b01 = parentTransform.b, b02 = parentTransform.tx, + b10 = parentTransform.c, b11 = parentTransform.d, b12 = parentTransform.ty; - b00 = parentTransform[0], b01 = parentTransform[1], b02 = parentTransform[2], - b10 = parentTransform[3], b11 = parentTransform[4], b12 = parentTransform[5]; + worldTransform.a = b00 * a00 + b01 * a10; + worldTransform.b = b00 * a01 + b01 * a11; + worldTransform.tx = b00 * a02 + b01 * a12 + b02; - localTransform[2] = a02; - localTransform[5] = a12; + worldTransform.c = b10 * a00 + b11 * a10; + worldTransform.d = b10 * a01 + b11 * a11; + worldTransform.ty = b10 * a02 + b11 * a12 + b12; - worldTransform[0] = b00 * a00 + b01 * a10; - worldTransform[1] = b00 * a01 + b01 * a11; - worldTransform[2] = b00 * a02 + b01 * a12 + b02; - - worldTransform[3] = b10 * a00 + b11 * a10; - worldTransform[4] = b10 * a01 + b11 * a11; - worldTransform[5] = b10 * a02 + b11 * a12 + b12; - - // because we are using affine transformation, we can optimise the matrix concatenation process.. wooo! - // mat3.multiply(this.localTransform, this.parent.worldTransform, this.worldTransform); this.worldAlpha = this.alpha * this.parent.worldAlpha; }; diff --git a/src/pixi/display/Sprite.js b/src/pixi/display/Sprite.js index 9bc9cec..35b4235 100644 --- a/src/pixi/display/Sprite.js +++ b/src/pixi/display/Sprite.js @@ -184,12 +184,12 @@ var worldTransform = this.worldTransform; - var a = worldTransform[0]; - var b = worldTransform[3]; - var c = worldTransform[1]; - var d = worldTransform[4]; - var tx = worldTransform[2]; - var ty = worldTransform[5]; + var a = worldTransform.a; + var b = worldTransform.c; + var c = worldTransform.b; + var d = worldTransform.d; + var tx = worldTransform.tx; + var ty = worldTransform.ty; var x1 = a * w1 + c * h1 + tx; var y1 = d * h1 + b * w1 + ty; @@ -345,7 +345,7 @@ // allow for trimming - context.setTransform(transform[0], transform[3], transform[1], transform[4], transform[2], transform[5]); + context.setTransform(transform.a, transform.c, transform.b, transform.d, transform.tx, transform.ty); //if smoothingEnabled is supported and we need to change the smoothing property for this texture if(renderSession.smoothProperty && renderSession.scaleMode !== this.texture.baseTexture.scaleMode) { diff --git a/src/pixi/display/SpriteBatch.js b/src/pixi/display/SpriteBatch.js index bfd3017..7526390 100644 --- a/src/pixi/display/SpriteBatch.js +++ b/src/pixi/display/SpriteBatch.js @@ -93,7 +93,7 @@ // alow for trimming - context.setTransform(transform[0], transform[3], transform[1], transform[4], transform[2], transform[5]); + context.setTransform(transform.a, transform.c, transform.b, transform.d, transform.tx, transform.ty); context.save(); for (var i = 0; i < this.children.length; i++) { @@ -123,7 +123,7 @@ PIXI.DisplayObject.prototype.updateTransform.call(child); transform = child.localTransform; - context.setTransform(transform[0], transform[3], transform[1], transform[4], transform[2], transform[5]); + context.setTransform(transform.a, transform.c, transform.b, transform.d, transform.tx, transform.ty); context.drawImage(texture.baseTexture.source, frame.x, diff --git a/src/pixi/display/Stage.js b/src/pixi/display/Stage.js index e42c772..743e1e0 100644 --- a/src/pixi/display/Stage.js +++ b/src/pixi/display/Stage.js @@ -30,7 +30,7 @@ * @readOnly * @private */ - this.worldTransform = PIXI.mat3.create(); + this.worldTransform = new PIXI.Matrix()//PIXI.mat3.create(); /** * Whether or not the stage is interactive diff --git a/src/pixi/extras/TilingSprite.js b/src/pixi/extras/TilingSprite.js index 59a1ad1..b19dafe 100644 --- a/src/pixi/extras/TilingSprite.js +++ b/src/pixi/extras/TilingSprite.js @@ -198,7 +198,7 @@ // allow for trimming - context.setTransform(transform[0], transform[3], transform[1], transform[4], transform[2], transform[5]); + context.setTransform(transform.a, transform.c, transform.b, transform.d, transform.tx, transform.ty); if(!this.__tilePattern) @@ -256,13 +256,13 @@ var worldTransform = this.worldTransform; - var a = worldTransform[0]; - var b = worldTransform[3]; - var c = worldTransform[1]; - var d = worldTransform[4]; - var tx = worldTransform[2]; - var ty = worldTransform[5]; - + var a = worldTransform.a; + var b = worldTransform.c; + var c = worldTransform.b; + var d = worldTransform.d; + var tx = worldTransform.tx; + var ty = worldTransform.ty; + var x1 = a * w1 + c * h1 + tx; var y1 = d * h1 + b * w1 + ty; diff --git a/src/pixi/primitives/Graphics.js b/src/pixi/primitives/Graphics.js index b057305..a215650 100644 --- a/src/pixi/primitives/Graphics.js +++ b/src/pixi/primitives/Graphics.js @@ -422,7 +422,7 @@ context.globalCompositeOperation = PIXI.blendModesCanvas[renderSession.currentBlendMode]; } - context.setTransform(transform[0], transform[3], transform[1], transform[4], transform[2], transform[5]); + context.setTransform(transform.a, transform.c, transform.b, transform.d, transform.tx, transform.ty); PIXI.CanvasGraphics.renderGraphics(this, context); // simple render children! @@ -450,12 +450,12 @@ var worldTransform = this.worldTransform; - var a = worldTransform[0]; - var b = worldTransform[3]; - var c = worldTransform[1]; - var d = worldTransform[4]; - var tx = worldTransform[2]; - var ty = worldTransform[5]; + var a = worldTransform.a; + var b = worldTransform.c; + var c = worldTransform.b; + var d = worldTransform.d; + var tx = worldTransform.tx; + var ty = worldTransform.ty; var x1 = a * w1 + c * h1 + tx; var y1 = d * h1 + b * w1 + ty; diff --git a/src/pixi/renderers/canvas/utils/CanvasMaskManager.js b/src/pixi/renderers/canvas/utils/CanvasMaskManager.js index 3bbca21..e9a9f97 100644 --- a/src/pixi/renderers/canvas/utils/CanvasMaskManager.js +++ b/src/pixi/renderers/canvas/utils/CanvasMaskManager.js @@ -30,7 +30,7 @@ var cacheAlpha = maskData.alpha; var transform = maskData.worldTransform; - context.setTransform(transform[0], transform[3], transform[1], transform[4], transform[2], transform[5]); + context.setTransform(transform.a, transform.c, transform.b, transform.d, transform.tx, transform.ty); PIXI.CanvasGraphics.renderGraphicsMask(maskData, context); diff --git a/src/pixi/renderers/webgl/utils/WebGLFastSpriteBatch.js b/src/pixi/renderers/webgl/utils/WebGLFastSpriteBatch.js index 765a471..b124701 100644 --- a/src/pixi/renderers/webgl/utils/WebGLFastSpriteBatch.js +++ b/src/pixi/renderers/webgl/utils/WebGLFastSpriteBatch.js @@ -52,7 +52,7 @@ this.shader = null; - this.tempMatrix = PIXI.mat3.create(); + this.matrix this.setContext(gl); }; @@ -82,8 +82,10 @@ { this.renderSession = renderSession; this.shader = this.renderSession.shaderManager.fastShader; - - PIXI.mat3.transpose(spriteBatch.worldTransform, this.tempMatrix); + + // PIXI.mat3.transpose(spriteBatch.worldTransform.toArray(), this.tempMatrix); + + this.matrix = spriteBatch.worldTransform.toArray(true) // console.log(this.tempMatrix) this.start(); @@ -179,8 +181,8 @@ verticies[index++] = sprite.rotation; // uv - verticies[index++] = uvs[0]; - verticies[index++] = uvs[1]; + verticies[index++] = uvs.x0; + verticies[index++] = uvs.y1; // color verticies[index++] = sprite.alpha; @@ -200,8 +202,8 @@ verticies[index++] = sprite.rotation; // uv - verticies[index++] = uvs[2]; - verticies[index++] = uvs[3]; + verticies[index++] = uvs.x1; + verticies[index++] = uvs.y1; // color verticies[index++] = sprite.alpha; @@ -221,8 +223,8 @@ verticies[index++] = sprite.rotation; // uv - verticies[index++] = uvs[4]; - verticies[index++] = uvs[5]; + verticies[index++] = uvs.x2; + verticies[index++] = uvs.y2; // color verticies[index++] = sprite.alpha; @@ -244,8 +246,8 @@ verticies[index++] = sprite.rotation; // uv - verticies[index++] = uvs[6]; - verticies[index++] = uvs[7]; + verticies[index++] = uvs.x3; + verticies[index++] = uvs.y3; // color verticies[index++] = sprite.alpha; @@ -260,6 +262,7 @@ PIXI.WebGLFastSpriteBatch.prototype.flush = function() { + // If the batch is length 0 then return as there is nothing to draw if (this.currentBatchSize===0)return; @@ -318,7 +321,7 @@ gl.uniform2f(this.shader.projectionVector, projection.x, projection.y); // set the matrix - gl.uniformMatrix3fv(this.shader.uMatrix, false, this.tempMatrix); + gl.uniformMatrix3fv(this.shader.uMatrix, false, this.matrix); // set the pointers var stride = this.vertSize * 4; diff --git a/bin/pixi.dev.js b/bin/pixi.dev.js index 8558d80..45e6eba 100644 --- a/bin/pixi.dev.js +++ b/bin/pixi.dev.js @@ -1,10 +1,10 @@ /** * @license * pixi.js - v1.4.3 - * Copyright (c) 2012, Mat Groves + * Copyright (c) 2012-2014, Mat Groves * http://goodboydigital.com/ * - * Compiled: 2014-01-28 + * Compiled: 2014-01-30 * * pixi.js is licensed under the MIT License. * http://www.opensource.org/licenses/mit-license.php @@ -461,7 +461,7 @@ return (typeof Float32Array !== 'undefined') ? Float32Array : Array; }; -PIXI.Matrix = PIXI.determineMatrixArrayType(); +PIXI.Matrix2 = PIXI.determineMatrixArrayType(); /** @@ -482,7 +482,7 @@ */ PIXI.mat3.create = function() { - var matrix = new PIXI.Matrix(9); + var matrix = new PIXI.Matrix2(9); matrix[0] = 1; matrix[1] = 0; @@ -567,7 +567,7 @@ */ PIXI.mat3.clone = function(mat) { - var matrix = new PIXI.Matrix(9); + var matrix = new PIXI.Matrix2(9); matrix[0] = mat[0]; matrix[1] = mat[1]; @@ -666,7 +666,7 @@ */ PIXI.mat4.create = function() { - var matrix = new PIXI.Matrix(16); + var matrix = new PIXI.Matrix2(16); matrix[0] = 1; matrix[1] = 0; @@ -799,6 +799,64 @@ PIXI.identityMatrix = PIXI.mat3.create(); PIXI.tempMatrix = PIXI.mat3.create(); + +PIXI.Matrix = function() +{ + this.a = 1; + this.b = 0; + this.c = 0; + this.d = 1; + this.tx = 0; + this.ty = 0; + + +} + +PIXI.Matrix.prototype.fromArray = function(array) +{ + + this.a = array[0]; + this.b = array[1]; + this.c = array[3]; + this.d = array[4]; + this.tx = array[2]; + this.ty = array[5]; + +} + +PIXI.Matrix.prototype.toArray = function(transpose) +{ + if(!this.array)this.array = new Float32Array(9); + var array = this.array; + + if(transpose) + { + this.array[0] = this.a; + this.array[1] = this.c; + this.array[2] = 0; + this.array[3] = this.b; + this.array[4] = this.d; + this.array[5] = 0; + this.array[6] = this.tx; + this.array[7] = this.ty; + this.array[8] = 1; + } + else + { + this.array[0] = this.a; + this.array[1] = this.b; + this.array[2] = this.tx; + this.array[3] = this.c; + this.array[4] = this.d; + this.array[5] = this.ty; + this.array[6] = 0; + this.array[7] = 0; + this.array[8] = 1; + } + + return array;//[this.a, this.b, this.tx, this.c, this.d, this.ty, 0, 0, 1]; +} + /** * @author Mat Groves http://matgroves.com/ @Doormat23 */ @@ -940,7 +998,7 @@ * @readOnly * @private */ - this.worldTransform = PIXI.mat3.create(); //mat3.identity(); + this.worldTransform = new PIXI.Matrix()//PIXI.mat3.create(); //mat3.identity(); /** * [read-only] Current transform of the object locally @@ -950,7 +1008,7 @@ * @readOnly * @private */ - this.localTransform = PIXI.mat3.create(); //mat3.identity(); + this.localTransform = new PIXI.Matrix()//PIXI.mat3.create(); //mat3.identity(); /** * [NYI] Unknown @@ -1208,40 +1266,30 @@ this._cr = Math.cos(this.rotation); } - var localTransform = this.localTransform; - var parentTransform = this.parent.worldTransform; - var worldTransform = this.worldTransform; + // var localTransform = this.localTransform//.toArray(); + var parentTransform = this.parent.worldTransform//.toArray(); + var worldTransform = this.worldTransform//.toArray(); //console.log(localTransform) - localTransform[0] = this._cr * this.scale.x; - localTransform[1] = -this._sr * this.scale.y; - localTransform[3] = this._sr * this.scale.x; - localTransform[4] = this._cr * this.scale.y; - - // TODO --> do we even need a local matrix??? - var px = this.pivot.x; var py = this.pivot.y; - // Cache the matrix values (makes for huge speed increases!) - var a00 = localTransform[0], a01 = localTransform[1], a02 = this.position.x - localTransform[0] * px - py * localTransform[1], - a10 = localTransform[3], a11 = localTransform[4], a12 = this.position.y - localTransform[4] * py - px * localTransform[3], + var a00 = this._cr * this.scale.x, + a01 = -this._sr * this.scale.y, + a10 = this._sr * this.scale.x, + a11 = this._cr * this.scale.y, + a02 = this.position.x + a00 * px - py * a01, + a12 = this.position.y + a11 * py - px * a10, + b00 = parentTransform.a, b01 = parentTransform.b, b02 = parentTransform.tx, + b10 = parentTransform.c, b11 = parentTransform.d, b12 = parentTransform.ty; - b00 = parentTransform[0], b01 = parentTransform[1], b02 = parentTransform[2], - b10 = parentTransform[3], b11 = parentTransform[4], b12 = parentTransform[5]; + worldTransform.a = b00 * a00 + b01 * a10; + worldTransform.b = b00 * a01 + b01 * a11; + worldTransform.tx = b00 * a02 + b01 * a12 + b02; - localTransform[2] = a02; - localTransform[5] = a12; + worldTransform.c = b10 * a00 + b11 * a10; + worldTransform.d = b10 * a01 + b11 * a11; + worldTransform.ty = b10 * a02 + b11 * a12 + b12; - worldTransform[0] = b00 * a00 + b01 * a10; - worldTransform[1] = b00 * a01 + b01 * a11; - worldTransform[2] = b00 * a02 + b01 * a12 + b02; - - worldTransform[3] = b10 * a00 + b11 * a10; - worldTransform[4] = b10 * a01 + b11 * a11; - worldTransform[5] = b10 * a02 + b11 * a12 + b12; - - // because we are using affine transformation, we can optimise the matrix concatenation process.. wooo! - // mat3.multiply(this.localTransform, this.parent.worldTransform, this.worldTransform); this.worldAlpha = this.alpha * this.parent.worldAlpha; }; @@ -1316,6 +1364,36 @@ // this line is just here to pass jshinting :) renderSession = renderSession; }; + +/** + * The position of the displayObject on the x axis relative to the local coordinates of the parent. + * + * @property x + * @type Number + */ +Object.defineProperty(PIXI.DisplayObject.prototype, 'x', { + get: function() { + return this.position.x; + }, + set: function(value) { + this.position.x = value; + } +}); + +/** + * The position of the displayObject on the y axis relative to the local coordinates of the parent. + * + * @property y + * @type Number + */ +Object.defineProperty(PIXI.DisplayObject.prototype, 'y', { + get: function() { + return this.position.y; + }, + set: function(value) { + this.position.y = value; + } +}); /** * @author Mat Groves http://matgroves.com/ @Doormat23 */ @@ -1534,12 +1612,16 @@ var childMaxX; var childMaxY; + var childVisible = false; + for(var i=0,j=this.children.length; i childMaxY ? maxY : childMaxY; } + if(!childVisible) + return PIXI.EmptyRectangle; + var bounds = this._bounds; bounds.x = minX; @@ -1868,12 +1953,12 @@ var worldTransform = this.worldTransform; - var a = worldTransform[0]; - var b = worldTransform[3]; - var c = worldTransform[1]; - var d = worldTransform[4]; - var tx = worldTransform[2]; - var ty = worldTransform[5]; + var a = worldTransform.a; + var b = worldTransform.c; + var c = worldTransform.b; + var d = worldTransform.d; + var tx = worldTransform.tx; + var ty = worldTransform.ty; var x1 = a * w1 + c * h1 + tx; var y1 = d * h1 + b * w1 + ty; @@ -2029,7 +2114,7 @@ // allow for trimming - context.setTransform(transform[0], transform[3], transform[1], transform[4], transform[2], transform[5]); + context.setTransform(transform.a, transform.c, transform.b, transform.d, transform.tx, transform.ty); //if smoothingEnabled is supported and we need to change the smoothing property for this texture if(renderSession.smoothProperty && renderSession.scaleMode !== this.texture.baseTexture.scaleMode) { @@ -2169,6 +2254,13 @@ PIXI.SpriteBatch.prototype = Object.create( PIXI.DisplayObjectContainer.prototype ); PIXI.SpriteBatch.constructor = PIXI.SpriteBatch; + +/* + * Initialises the spriteBatch + * + * @method initWebGL + * @param gl {WebGLContext} the current WebGL drawing context + */ PIXI.SpriteBatch.prototype.initWebGL = function(gl) { @@ -2234,7 +2326,7 @@ // alow for trimming - context.setTransform(transform[0], transform[3], transform[1], transform[4], transform[2], transform[5]); + context.setTransform(transform.a, transform.c, transform.b, transform.d, transform.tx, transform.ty); context.save(); for (var i = 0; i < this.children.length; i++) { @@ -2264,7 +2356,7 @@ PIXI.DisplayObject.prototype.updateTransform.call(child); transform = child.localTransform; - context.setTransform(transform[0], transform[3], transform[1], transform[4], transform[2], transform[5]); + context.setTransform(transform.a, transform.c, transform.b, transform.d, transform.tx, transform.ty); context.drawImage(texture.baseTexture.source, frame.x, @@ -2484,8 +2576,21 @@ */ PIXI.Text = function(text, style) { + /** + * The canvas element that everything is drawn to + * + * @property canvas + * @type HTMLCanvasElement + */ 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'); + PIXI.Sprite.call(this, PIXI.Texture.fromCanvas(this.canvas)); this.setText(text); @@ -2631,6 +2736,13 @@ this.requiresUpdate = true; }; +/** +* Renders the object using the WebGL renderer +* +* @method _renderWebGL +* @param renderSession {RenderSession} +* @private +*/ PIXI.Text.prototype._renderWebGL = function(renderSession) { if(this.requiresUpdate) @@ -2662,6 +2774,7 @@ /* * http://stackoverflow.com/users/34441/ellisbben * great solution to the problem! + * returns the height of the given font * * @method determineFontHeight * @param fontStyle {Object} @@ -2798,11 +2911,11 @@ /** * 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 - * @param style {Object} The style parameters - * @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 + * @param style {Object} The style parameters, contained as properties of an object */ PIXI.BitmapText.prototype.setStyle = function(style) { @@ -3435,8 +3548,8 @@ var isSprite = (item instanceof PIXI.Sprite), worldTransform = item.worldTransform, - a00 = worldTransform[0], a01 = worldTransform[1], a02 = worldTransform[2], - a10 = worldTransform[3], a11 = worldTransform[4], a12 = worldTransform[5], + a00 = worldTransform.a, a01 = worldTransform.b, a02 = worldTransform.tx, + a10 = worldTransform.c, a11 = worldTransform.d, a12 = worldTransform.ty, id = 1 / (a00 * a11 + a01 * -a10), x = a11 * id * global.x + -a01 * id * global.y + (a12 * a01 - a02 * a11) * id, y = a00 * id * global.y + -a10 * id * global.x + (-a12 * a00 + a02 * a10) * id; @@ -3674,7 +3787,7 @@ * @param backgroundColor {Number} the background color of the stage, you have to pass this in is in hex format * 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); * 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 @@ -3693,7 +3806,7 @@ * @readOnly * @private */ - this.worldTransform = PIXI.mat3.create(); + this.worldTransform = new PIXI.Matrix()//PIXI.mat3.create(); /** * Whether or not the stage is interactive @@ -3901,7 +4014,7 @@ * @class AjaxRequest * @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 @@ -4008,7 +4121,7 @@ * Adds event emitter functionality to a class * * @class EventTarget - * @example + * * function MyEmitter() { * PIXI.EventTarget.call(this); //mixes in event target stuff * } @@ -4018,8 +4131,21 @@ */ PIXI.EventTarget = function () { + /** + * Holds all the listeners + * + * @property listeneners + * @type Object + */ 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 ) { @@ -4036,6 +4162,12 @@ }; + /** + * Fires the event, ie pretends that the event has happened + * + * @method dispatchEvent + * @param event {Event} the event object + */ this.dispatchEvent = this.emit = function ( event ) { if ( !listeners[ event.type ] || !listeners[ event.type ].length ) { @@ -4052,6 +4184,13 @@ }; + /** + * 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 ) { var index = listeners[ type ].indexOf( listener ); @@ -4064,6 +4203,12 @@ }; + /** + * 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 ) { var a = listeners[type]; if (a) @@ -4079,7 +4224,8 @@ * 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 * the browser then this function will return a canvas renderer - * + * @class autoDetectRenderer + * @static * @param width=800 {Number} the width 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 @@ -4149,17 +4295,23 @@ 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 = {}; /** * Triangulates shapes for webGL graphic fills * * @method Triangulate - * @namespace PolyK - * @constructor + * */ PIXI.PolyK.Triangulate = function(p) { @@ -4235,10 +4387,17 @@ }; /** - * Checks if a point is within a triangle + * Checks whether a point is within a triangle * - * @class _PointInTriangle - * @namespace PolyK + * @method _PointInTriangle + * @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 */ PIXI.PolyK._PointInTriangle = function(px, py, ax, ay, bx, by, cx, cy) @@ -4265,10 +4424,10 @@ }; /** - * Checks if a shape is convex + * Checks whether a shape is convex * - * @class _convex - * @namespace PolyK + * @method _convex + * * @private */ PIXI.PolyK._convex = function(ax, ay, bx, by, cx, cy, sign) @@ -4343,6 +4502,10 @@ */ PIXI.PixiShader = function(gl) { + /** + * @property gl + * @type WebGLContext + */ this.gl = gl; /** @@ -4375,7 +4538,9 @@ }; /** -* @method PIXI.PixiShader#init +* Initialises the shader +* @method init +* */ PIXI.PixiShader.prototype.init = function() { @@ -4430,7 +4595,7 @@ * 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 * -* @method PIXI.PixiShader#initUniforms +* @method initUniforms */ PIXI.PixiShader.prototype.initUniforms = function() { @@ -4501,7 +4666,7 @@ /** * 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) { @@ -4542,7 +4707,7 @@ wrapT = gl.REPEAT; } - gl.pixelStorei(gl.UNPACK_FLIP_Y_WEBGL, false); + gl.pixelStorei(gl.UNPACK_FLIP_Y_WEBGL, !!data.flipY); if (data.width) { @@ -4576,7 +4741,7 @@ /** * Updates the shader uniform values. * -* @method PIXI.PixiShader#syncUniforms +* @method syncUniforms */ PIXI.PixiShader.prototype.syncUniforms = function() { @@ -4631,6 +4796,11 @@ }; +/** +* Destroys the shader +* @method destroy +* +*/ PIXI.PixiShader.prototype.destroy = function() { this.gl.deleteProgram( this.program ); @@ -4640,6 +4810,11 @@ this.attributes = null; }; +/** +* +* @property defaultVertexSrc +* @type String +*/ PIXI.PixiShader.defaultVertexSrc = [ 'attribute vec2 aVertexPosition;', 'attribute vec2 aTextureCoord;', @@ -4673,19 +4848,25 @@ /** * @class PIXI.PixiFastShader * @constructor +* @param gl {WebGLContext} the current WebGL drawing context */ PIXI.PixiFastShader = function(gl) { + + /** + * @property gl + * @type WebGLContext + */ this.gl = gl; /** - * @property {any} program - The WebGL program. - */ + * @property {any} program - The WebGL program. + */ this.program = null; /** - * @property {array} fragmentSrc - The fragment shader. - */ + * @property {array} fragmentSrc - The fragment shader. + */ this.fragmentSrc = [ 'precision lowp float;', 'varying vec2 vTextureCoord;', @@ -4696,6 +4877,9 @@ '}' ]; + /** + * @property {array} vertexSrc - The vertex shader + */ this.vertexSrc = [ 'attribute vec2 aVertexPosition;', 'attribute vec2 aPositionCoord;', @@ -4737,7 +4921,9 @@ }; /** -* @method PIXI.PixiFastShader#init +* Initialises the shader +* @method init +* */ PIXI.PixiFastShader.prototype.init = function() { @@ -4787,6 +4973,11 @@ this.program = program; }; +/** +* Destroys the shader +* @method destroy +* +*/ PIXI.PixiFastShader.prototype.destroy = function() { this.gl.deleteProgram( this.program ); @@ -4803,9 +4994,14 @@ PIXI.StripShader = function() { - // the webGL program.. + /** + * @property {any} program - The WebGL program. + */ this.program = null; + /** + * @property {array} fragmentSrc - The fragment shader. + */ this.fragmentSrc = [ 'precision mediump float;', 'varying vec2 vTextureCoord;', @@ -4819,6 +5015,9 @@ '}' ]; + /** + * @property {array} fragmentSrc - The fragment shader. + */ this.vertexSrc = [ 'attribute vec2 aVertexPosition;', 'attribute vec2 aTextureCoord;', @@ -4839,6 +5038,11 @@ ]; }; +/** +* Initialises the shader +* @method init +* +*/ PIXI.StripShader.prototype.init = function() { @@ -4868,14 +5072,28 @@ * @author Mat Groves http://matgroves.com/ @Doormat23 */ - +/** +* @class PrimitiveShader +* @constructor +* @param gl {WebGLContext} the current WebGL drawing context +*/ PIXI.PrimitiveShader = function(gl) { + /** + * @property gl + * @type WebGLContext + */ this.gl = gl; - // the webGL program.. + /** + * @property {any} program - The WebGL program. + */ this.program = null; + /** + * @property fragmentSrc + * @type Array + */ this.fragmentSrc = [ 'precision mediump float;', 'varying vec4 vColor;', @@ -4885,6 +5103,10 @@ '}' ]; + /** + * @property vertexSrc + * @type Array + */ this.vertexSrc = [ 'attribute vec2 aVertexPosition;', 'attribute vec4 aColor;', @@ -4906,6 +5128,11 @@ this.init(); }; +/** +* Initialises the shader +* @method init +* +*/ PIXI.PrimitiveShader.prototype.init = function() { @@ -4932,6 +5159,11 @@ this.program = program; }; +/** +* Destroys the shader +* @method destroy +* +*/ PIXI.PrimitiveShader.prototype.destroy = function() { this.gl.deleteProgram( this.program ); @@ -4948,7 +5180,9 @@ /** * A set of functions used by the webGL renderer to draw the primitive graphics data * - * @class CanvasGraphics + * @class WebGLGraphics + * @private + * @static */ PIXI.WebGLGraphics = function() { @@ -4962,7 +5196,7 @@ * @private * @method renderGraphics * @param graphics {Graphics} - * @param projection {Object} + * @param renderSession {Object} */ PIXI.WebGLGraphics.renderGraphics = function(graphics, renderSession)//projection, offset) { @@ -4999,12 +5233,10 @@ // This could be speeded up for sure! // var m = PIXI.mat3.clone(graphics.worldTransform); - PIXI.mat3.transpose(graphics.worldTransform, PIXI.tempMatrix); - // set the matrix transform gl.blendFunc(gl.ONE, gl.ONE_MINUS_SRC_ALPHA); - gl.uniformMatrix3fv(shader.translationMatrix, false, PIXI.tempMatrix); + gl.uniformMatrix3fv(shader.translationMatrix, false, graphics.worldTransform.toArray(true)); gl.uniform2f(shader.projectionVector, projection.x, -projection.y); gl.uniform2f(shader.offsetVector, -offset.x, -offset.y); @@ -5034,7 +5266,8 @@ * @static * @private * @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) { @@ -5088,7 +5321,7 @@ * @static * @private * @method buildRectangle - * @param graphics {Graphics} + * @param graphicsData {Graphics} The graphics object to draw TODO-Alvin * @param webGLData {Object} */ PIXI.WebGLGraphics.buildRectangle = function(graphicsData, webGLData) @@ -5157,7 +5390,7 @@ * @static * @private * @method buildCircle - * @param graphics {Graphics} + * @param graphicsData {Graphics} The graphics object to draw * @param webGLData {Object} */ PIXI.WebGLGraphics.buildCircle = function(graphicsData, webGLData) @@ -5230,7 +5463,7 @@ * @static * @private * @method buildLine - * @param graphics {Graphics} + * @param graphicsData {Graphics} The graphics object to draw TODO-Alvin * @param webGLData {Object} */ PIXI.WebGLGraphics.buildLine = function(graphicsData, webGLData) @@ -5440,7 +5673,7 @@ * @static * @private * @method buildPoly - * @param graphics {Graphics} + * @param graphicsData {Graphics} The graphics object to draw TODO-Alvin * @param webGLData {Object} */ PIXI.WebGLGraphics.buildPoly = function(graphicsData, webGLData) @@ -6050,6 +6283,13 @@ * @author Mat Groves http://matgroves.com/ @Doormat23 */ + +/** +* @class WebGLMaskManager +* @constructor +* @param gl {WebGLContext} the current WebGL drawing context +* @private +*/ PIXI.WebGLMaskManager = function(gl) { this.maskStack = []; @@ -6058,11 +6298,22 @@ 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) { 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) { var gl = this.gl; @@ -6087,6 +6338,12 @@ 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) { var gl = this.gl; @@ -6110,6 +6367,10 @@ if(this.maskStack.length === 0)gl.disable(gl.STENCIL_TEST); }; +/** +* TODO-Alvin +* @method destroy +*/ PIXI.WebGLMaskManager.prototype.destroy = function() { this.maskStack = null; @@ -6119,6 +6380,12 @@ * @author Mat Groves http://matgroves.com/ @Doormat23 */ +/** +* @class WebGLShaderManager +* @constructor +* @param gl {WebGLContext} the current WebGL drawing context +* @private +*/ PIXI.WebGLShaderManager = function(gl) { @@ -6135,6 +6402,13 @@ //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) { this.gl = gl; @@ -6153,6 +6427,11 @@ }; +/** +* Initialises the context and the properties +* @method setAttribs +* @param attribs {Array} TODO-Alvin +*/ PIXI.WebGLShaderManager.prototype.setAttribs = function(attribs) { // reset temp state @@ -6194,6 +6473,11 @@ // 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) { //if(this.currentShader == shader)return; @@ -6207,6 +6491,10 @@ }; +/** +* Triggers the primitive shader +* @method activatePrimitiveShader +*/ PIXI.WebGLShaderManager.prototype.activatePrimitiveShader = function() { var gl = this.gl; @@ -6217,6 +6505,10 @@ }; +/** +* Disable the primitive shader +* @method deactivatePrimitiveShader +*/ PIXI.WebGLShaderManager.prototype.deactivatePrimitiveShader = function() { var gl = this.gl; @@ -6226,6 +6518,10 @@ this.setAttribs(this.defaultShader.attributes); }; +/** +* Destroys +* @method destroy +*/ PIXI.WebGLShaderManager.prototype.destroy = function() { this.attribState = null; @@ -6252,11 +6548,30 @@ * 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) { - + /** + * TODO-Alvin + * + * @property vertSize + * @type Number + */ this.vertSize = 6; + + /** + * TODO-Alvin + * @property size + * @type Number + */ this.size = 10000;//Math.pow(2, 16) / this.vertSize; // console.log(this.size); @@ -6265,9 +6580,23 @@ //the total number of indices in our batch var numIndices = this.size * 6; - //vertex data + //vertex data + + /** + * Holds the vertices + * + * @property vertices + * @type Float32Array + */ this.vertices = new Float32Array(numVerts); + //index data + /** + * Holds the indices + * + * @property indices + * @type Uint16Array + */ this.indices = new Uint16Array(numIndices); this.lastIndexCount = 0; @@ -6290,6 +6619,12 @@ this.setContext(gl); }; +/** +* +* @method setContext +* +* @param gl {WebGLContext} the current WebGL drawing context +*/ PIXI.WebGLSpriteBatch.prototype.setContext = function(gl) { this.gl = gl; @@ -6311,6 +6646,12 @@ this.currentBlendMode = 99999; }; +/** +* +* @method begin +* +* @param renderSession {RenderSession} the RenderSession +*/ PIXI.WebGLSpriteBatch.prototype.begin = function(renderSession) { this.renderSession = renderSession; @@ -6319,12 +6660,22 @@ this.start(); }; +/** +* +* @method end +* +*/ PIXI.WebGLSpriteBatch.prototype.end = function() { this.flush(); }; - +/** +* +* @method render +* +* @param sprite {Sprite} the sprite to render TODO-Alvin +*/ PIXI.WebGLSpriteBatch.prototype.render = function(sprite) { // check texture.. @@ -6383,21 +6734,21 @@ var index = this.currentBatchSize * 4 * this.vertSize; - var worldTransform = sprite.worldTransform; + var worldTransform = sprite.worldTransform;//.toArray(); - var a = worldTransform[0]; - var b = worldTransform[3]; - var c = worldTransform[1]; - var d = worldTransform[4]; - var tx = worldTransform[2]; - var ty = worldTransform[5]; + var a = worldTransform.a//[0]; + var b = worldTransform.c//[3]; + var c = worldTransform.b//[1]; + var d = worldTransform.d//[4]; + var tx = worldTransform.tx//[2]; + var ty = worldTransform.ty///[5]; // xy verticies[index++] = a * w1 + c * h1 + tx; verticies[index++] = d * h1 + b * w1 + ty; // uv - verticies[index++] = uvs[0]; - verticies[index++] = uvs[1]; + verticies[index++] = uvs.x0; + verticies[index++] = uvs.y0; // color verticies[index++] = alpha; verticies[index++] = tint; @@ -6406,8 +6757,8 @@ verticies[index++] = a * w0 + c * h1 + tx; verticies[index++] = d * h1 + b * w0 + ty; // uv - verticies[index++] = uvs[2]; - verticies[index++] = uvs[3]; + verticies[index++] = uvs.x1; + verticies[index++] = uvs.y1; // color verticies[index++] = alpha; verticies[index++] = tint; @@ -6416,8 +6767,8 @@ verticies[index++] = a * w0 + c * h0 + tx; verticies[index++] = d * h0 + b * w0 + ty; // uv - verticies[index++] = uvs[4]; - verticies[index++] = uvs[5]; + verticies[index++] = uvs.x2; + verticies[index++] = uvs.y2; // color verticies[index++] = alpha; verticies[index++] = tint; @@ -6426,18 +6777,24 @@ verticies[index++] = a * w1 + c * h0 + tx; verticies[index++] = d * h0 + b * w1 + ty; // uv - verticies[index++] = uvs[6]; - verticies[index++] = uvs[7]; + verticies[index++] = uvs.x3; + verticies[index++] = uvs.y3; // color verticies[index++] = alpha; verticies[index++] = tint; - + // increment the batchsize this.currentBatchSize++; }; +/** +* +* @method renderTilingSprite +* +* @param sprite {TilingSprite} the sprite to render TODO-Alvin +*/ PIXI.WebGLSpriteBatch.prototype.renderTilingSprite = function(tilingSprite) { var texture = tilingSprite.tilingTexture; @@ -6553,6 +6910,13 @@ this.currentBatchSize++; }; + +/** +* +* +* @method flush TODO-Alvin +* +*/ PIXI.WebGLSpriteBatch.prototype.flush = function() { // If the batch is length 0 then return as there is nothing to draw @@ -6589,12 +6953,21 @@ this.renderSession.drawCount++; }; - +/** +* +* @method stop +* +*/ PIXI.WebGLSpriteBatch.prototype.stop = function() { this.flush(); }; +/** +* +* @method start +* +*/ PIXI.WebGLSpriteBatch.prototype.start = function() { var gl = this.gl; @@ -6623,6 +6996,13 @@ } }; +/** +* +* @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) { this.flush(); @@ -6633,6 +7013,10 @@ this.gl.blendFunc(blendModeWebGL[0], blendModeWebGL[1]); }; +/** +* Destroys the SpriteBatch +* @method destroy +*/ PIXI.WebGLSpriteBatch.prototype.destroy = function() { @@ -6702,7 +7086,7 @@ this.shader = null; - this.tempMatrix = PIXI.mat3.create(); + this.matrix this.setContext(gl); }; @@ -6732,8 +7116,10 @@ { this.renderSession = renderSession; this.shader = this.renderSession.shaderManager.fastShader; - - PIXI.mat3.transpose(spriteBatch.worldTransform, this.tempMatrix); + + // PIXI.mat3.transpose(spriteBatch.worldTransform.toArray(), this.tempMatrix); + + this.matrix = spriteBatch.worldTransform.toArray(true) // console.log(this.tempMatrix) this.start(); @@ -6829,8 +7215,8 @@ verticies[index++] = sprite.rotation; // uv - verticies[index++] = uvs[0]; - verticies[index++] = uvs[1]; + verticies[index++] = uvs.x0; + verticies[index++] = uvs.y1; // color verticies[index++] = sprite.alpha; @@ -6850,8 +7236,8 @@ verticies[index++] = sprite.rotation; // uv - verticies[index++] = uvs[2]; - verticies[index++] = uvs[3]; + verticies[index++] = uvs.x1; + verticies[index++] = uvs.y1; // color verticies[index++] = sprite.alpha; @@ -6871,8 +7257,8 @@ verticies[index++] = sprite.rotation; // uv - verticies[index++] = uvs[4]; - verticies[index++] = uvs[5]; + verticies[index++] = uvs.x2; + verticies[index++] = uvs.y2; // color verticies[index++] = sprite.alpha; @@ -6894,8 +7280,8 @@ verticies[index++] = sprite.rotation; // uv - verticies[index++] = uvs[6]; - verticies[index++] = uvs[7]; + verticies[index++] = uvs.x3; + verticies[index++] = uvs.y3; // color verticies[index++] = sprite.alpha; @@ -6910,6 +7296,7 @@ PIXI.WebGLFastSpriteBatch.prototype.flush = function() { + // If the batch is length 0 then return as there is nothing to draw if (this.currentBatchSize===0)return; @@ -6968,7 +7355,7 @@ gl.uniform2f(this.shader.projectionVector, projection.x, projection.y); // set the matrix - gl.uniformMatrix3fv(this.shader.uMatrix, false, this.tempMatrix); + gl.uniformMatrix3fv(this.shader.uMatrix, false, this.matrix); // set the pointers var stride = this.vertSize * 4; @@ -7003,7 +7390,13 @@ * @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) { this.transparent = transparent; @@ -7017,7 +7410,11 @@ }; // API - +/** +* Initialises the context and the properties +* @method setContext +* @param gl {WebGLContext} the current WebGL drawing context +*/ PIXI.WebGLFilterManager.prototype.setContext = function(gl) { this.gl = gl; @@ -7026,6 +7423,12 @@ this.initShaderBuffers(); }; +/** +* +* @method begin +* @param renderSession {RenderSession} +* @param buffer {ArrayBuffer} +*/ PIXI.WebGLFilterManager.prototype.begin = function(renderSession, buffer) { this.renderSession = renderSession; @@ -7038,6 +7441,11 @@ 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) { var gl = this.gl; @@ -7119,6 +7527,10 @@ }; +/** +* Removes the last filter from the filter stack and doesn't return it +* @method popFilter +*/ PIXI.WebGLFilterManager.prototype.popFilter = function() { var gl = this.gl; @@ -7292,6 +7704,15 @@ 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) { // use program @@ -7344,6 +7765,10 @@ this.renderSession.drawCount++; }; +/** +* Initialises the shader buffers +* @method initShaderBuffers +*/ PIXI.WebGLFilterManager.prototype.initShaderBuffers = function() { var gl = this.gl; @@ -7400,6 +7825,10 @@ gl.STATIC_DRAW); }; +/** +* TODO-Alvin +* @method destroy +*/ PIXI.WebGLFilterManager.prototype.destroy = function() { var gl = this.gl; @@ -7422,9 +7851,24 @@ gl.deleteBuffer(this.colorBuffer); gl.deleteBuffer(this.indexBuffer); }; +/** + * @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 @@ -7444,6 +7888,11 @@ this.resize(width, height); }; + +/** +* Clears the filter texture +* @method clear +*/ PIXI.FilterTexture.prototype.clear = function() { var gl = this.gl; @@ -7452,6 +7901,13 @@ 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; @@ -7466,6 +7922,10 @@ }; +/** +* Destroys the filter texture +* @method destroy +*/ PIXI.FilterTexture.prototype.destroy = function() { var gl = this.gl; @@ -7476,7 +7936,6 @@ this.texture = null; }; - /** * @author Mat Groves * @@ -7509,7 +7968,7 @@ var cacheAlpha = maskData.alpha; var transform = maskData.worldTransform; - context.setTransform(transform[0], transform[3], transform[1], transform[4], transform[2], transform[5]); + context.setTransform(transform.a, transform.c, transform.b, transform.d, transform.tx, transform.ty); PIXI.CanvasGraphics.renderGraphicsMask(maskData, context); @@ -7876,7 +8335,7 @@ 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 * @type HTMLCanvasElement 2d Context */ @@ -7949,6 +8408,7 @@ { if(!this.transparent) { + this.context.globalAlpha = 1; this.context.fillStyle = stage.backgroundColorString; this.context.fillRect(0, 0, this.width, this.height); } @@ -8814,7 +9274,7 @@ context.globalCompositeOperation = PIXI.blendModesCanvas[renderSession.currentBlendMode]; } - context.setTransform(transform[0], transform[3], transform[1], transform[4], transform[2], transform[5]); + context.setTransform(transform.a, transform.c, transform.b, transform.d, transform.tx, transform.ty); PIXI.CanvasGraphics.renderGraphics(this, context); // simple render children! @@ -8842,12 +9302,12 @@ var worldTransform = this.worldTransform; - var a = worldTransform[0]; - var b = worldTransform[3]; - var c = worldTransform[1]; - var d = worldTransform[4]; - var tx = worldTransform[2]; - var ty = worldTransform[5]; + var a = worldTransform.a; + var b = worldTransform.c; + var c = worldTransform.b; + var d = worldTransform.d; + var tx = worldTransform.tx; + var ty = worldTransform.ty; var x1 = a * w1 + c * h1 + tx; var y1 = d * h1 + b * w1 + ty; @@ -9525,7 +9985,7 @@ // allow for trimming - context.setTransform(transform[0], transform[3], transform[1], transform[4], transform[2], transform[5]); + context.setTransform(transform.a, transform.c, transform.b, transform.d, transform.tx, transform.ty); if(!this.__tilePattern) @@ -9583,13 +10043,13 @@ var worldTransform = this.worldTransform; - var a = worldTransform[0]; - var b = worldTransform[3]; - var c = worldTransform[1]; - var d = worldTransform[4]; - var tx = worldTransform[2]; - var ty = worldTransform[5]; - + var a = worldTransform.a; + var b = worldTransform.c; + var c = worldTransform.b; + var d = worldTransform.d; + var tx = worldTransform.tx; + var ty = worldTransform.ty; + var x1 = a * w1 + c * h1 + tx; var y1 = d * h1 + b * w1 + ty; @@ -11189,6 +11649,7 @@ * @uses EventTarget * @constructor * @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) { @@ -11501,23 +11962,23 @@ PIXI.Texture.prototype._updateWebGLuvs = function() { - if(!this._uvs)this._uvs = new Float32Array(8); + if(!this._uvs)this._uvs = new PIXI.TextureUvs(); var frame = this.frame; var tw = this.baseTexture.width; var th = this.baseTexture.height; - this._uvs[0] = frame.x / tw; - this._uvs[1] = frame.y / th; + this._uvs.x0 = frame.x / tw; + this._uvs.y0 = frame.y / th; - this._uvs[2] = (frame.x + frame.width) / tw; - this._uvs[3] = frame.y / th; + this._uvs.x1 = (frame.x + frame.width) / tw; + this._uvs.y1 = frame.y / th; - this._uvs[4] = (frame.x + frame.width) / tw; - this._uvs[5] = (frame.y + frame.height) / th; + this._uvs.x2 = (frame.x + frame.width) / tw; + this._uvs.y2 = (frame.y + frame.height) / th; - this._uvs[6] = frame.x / tw; - this._uvs[7] = (frame.y + frame.height) / th; + this._uvs.x3 = frame.x / tw; + this._uvs.y3 = (frame.y + frame.height) / th; }; /** @@ -11608,6 +12069,28 @@ // this is more for webGL.. it contains updated frames.. PIXI.Texture.frameUpdates = []; +PIXI.TextureUvs = function() +{ + this.x0 = 0; + this.y0 = 0; + + this.x1 = 0; + this.y1 = 0; + + this.x2 = 0; + this.y2 = 0; + + this.x3 = 0; + this.y4 = 0; + + +} + + + + + + /** * @author Mat Groves http://matgroves.com/ @Doormat23 */ @@ -12606,7 +13089,7 @@ */ PIXI.BitmapFontLoader.prototype.load = function() { - this.ajaxRequest = new XMLHttpRequest(); + this.ajaxRequest = new PIXI.ajaxRequest(); var scope = this; this.ajaxRequest.onreadystatechange = function() { @@ -12619,7 +13102,7 @@ }; /** - * Invoked when XML file is loaded, parses the data + * Invoked when the XML file is loaded, parses the data * * @method onXMLLoaded * @private diff --git a/src/pixi/InteractionManager.js b/src/pixi/InteractionManager.js index a7072d6..98ac26c 100644 --- a/src/pixi/InteractionManager.js +++ b/src/pixi/InteractionManager.js @@ -454,8 +454,8 @@ var isSprite = (item instanceof PIXI.Sprite), worldTransform = item.worldTransform, - a00 = worldTransform[0], a01 = worldTransform[1], a02 = worldTransform[2], - a10 = worldTransform[3], a11 = worldTransform[4], a12 = worldTransform[5], + a00 = worldTransform.a, a01 = worldTransform.b, a02 = worldTransform.tx, + a10 = worldTransform.c, a11 = worldTransform.d, a12 = worldTransform.ty, id = 1 / (a00 * a11 + a01 * -a10), x = a11 * id * global.x + -a01 * id * global.y + (a12 * a01 - a02 * a11) * id, y = a00 * id * global.y + -a10 * id * global.x + (-a12 * a00 + a02 * a10) * id; diff --git a/src/pixi/core/Matrix.js b/src/pixi/core/Matrix.js index b88735c..5c4c103 100644 --- a/src/pixi/core/Matrix.js +++ b/src/pixi/core/Matrix.js @@ -12,7 +12,7 @@ return (typeof Float32Array !== 'undefined') ? Float32Array : Array; }; -PIXI.Matrix = PIXI.determineMatrixArrayType(); +PIXI.Matrix2 = PIXI.determineMatrixArrayType(); /** @@ -33,7 +33,7 @@ */ PIXI.mat3.create = function() { - var matrix = new PIXI.Matrix(9); + var matrix = new PIXI.Matrix2(9); matrix[0] = 1; matrix[1] = 0; @@ -118,7 +118,7 @@ */ PIXI.mat3.clone = function(mat) { - var matrix = new PIXI.Matrix(9); + var matrix = new PIXI.Matrix2(9); matrix[0] = mat[0]; matrix[1] = mat[1]; @@ -217,7 +217,7 @@ */ PIXI.mat4.create = function() { - var matrix = new PIXI.Matrix(16); + var matrix = new PIXI.Matrix2(16); matrix[0] = 1; matrix[1] = 0; @@ -349,4 +349,61 @@ }; PIXI.identityMatrix = PIXI.mat3.create(); -PIXI.tempMatrix = PIXI.mat3.create(); \ No newline at end of file +PIXI.tempMatrix = PIXI.mat3.create(); + +PIXI.Matrix = function() +{ + this.a = 1; + this.b = 0; + this.c = 0; + this.d = 1; + this.tx = 0; + this.ty = 0; + + +} + +PIXI.Matrix.prototype.fromArray = function(array) +{ + + this.a = array[0]; + this.b = array[1]; + this.c = array[3]; + this.d = array[4]; + this.tx = array[2]; + this.ty = array[5]; + +} + +PIXI.Matrix.prototype.toArray = function(transpose) +{ + if(!this.array)this.array = new Float32Array(9); + var array = this.array; + + if(transpose) + { + this.array[0] = this.a; + this.array[1] = this.c; + this.array[2] = 0; + this.array[3] = this.b; + this.array[4] = this.d; + this.array[5] = 0; + this.array[6] = this.tx; + this.array[7] = this.ty; + this.array[8] = 1; + } + else + { + this.array[0] = this.a; + this.array[1] = this.b; + this.array[2] = this.tx; + this.array[3] = this.c; + this.array[4] = this.d; + this.array[5] = this.ty; + this.array[6] = 0; + this.array[7] = 0; + this.array[8] = 1; + } + + return array;//[this.a, this.b, this.tx, this.c, this.d, this.ty, 0, 0, 1]; +} diff --git a/src/pixi/display/DisplayObject.js b/src/pixi/display/DisplayObject.js index b6da1a6..32d34a9 100644 --- a/src/pixi/display/DisplayObject.js +++ b/src/pixi/display/DisplayObject.js @@ -139,7 +139,7 @@ * @readOnly * @private */ - this.worldTransform = PIXI.mat3.create(); //mat3.identity(); + this.worldTransform = new PIXI.Matrix()//PIXI.mat3.create(); //mat3.identity(); /** * [read-only] Current transform of the object locally @@ -149,7 +149,7 @@ * @readOnly * @private */ - this.localTransform = PIXI.mat3.create(); //mat3.identity(); + this.localTransform = new PIXI.Matrix()//PIXI.mat3.create(); //mat3.identity(); /** * [NYI] Unknown @@ -407,40 +407,30 @@ this._cr = Math.cos(this.rotation); } - var localTransform = this.localTransform; - var parentTransform = this.parent.worldTransform; - var worldTransform = this.worldTransform; + // var localTransform = this.localTransform//.toArray(); + var parentTransform = this.parent.worldTransform//.toArray(); + var worldTransform = this.worldTransform//.toArray(); //console.log(localTransform) - localTransform[0] = this._cr * this.scale.x; - localTransform[1] = -this._sr * this.scale.y; - localTransform[3] = this._sr * this.scale.x; - localTransform[4] = this._cr * this.scale.y; - - // TODO --> do we even need a local matrix??? - var px = this.pivot.x; var py = this.pivot.y; - // Cache the matrix values (makes for huge speed increases!) - var a00 = localTransform[0], a01 = localTransform[1], a02 = this.position.x - localTransform[0] * px - py * localTransform[1], - a10 = localTransform[3], a11 = localTransform[4], a12 = this.position.y - localTransform[4] * py - px * localTransform[3], + var a00 = this._cr * this.scale.x, + a01 = -this._sr * this.scale.y, + a10 = this._sr * this.scale.x, + a11 = this._cr * this.scale.y, + a02 = this.position.x + a00 * px - py * a01, + a12 = this.position.y + a11 * py - px * a10, + b00 = parentTransform.a, b01 = parentTransform.b, b02 = parentTransform.tx, + b10 = parentTransform.c, b11 = parentTransform.d, b12 = parentTransform.ty; - b00 = parentTransform[0], b01 = parentTransform[1], b02 = parentTransform[2], - b10 = parentTransform[3], b11 = parentTransform[4], b12 = parentTransform[5]; + worldTransform.a = b00 * a00 + b01 * a10; + worldTransform.b = b00 * a01 + b01 * a11; + worldTransform.tx = b00 * a02 + b01 * a12 + b02; - localTransform[2] = a02; - localTransform[5] = a12; + worldTransform.c = b10 * a00 + b11 * a10; + worldTransform.d = b10 * a01 + b11 * a11; + worldTransform.ty = b10 * a02 + b11 * a12 + b12; - worldTransform[0] = b00 * a00 + b01 * a10; - worldTransform[1] = b00 * a01 + b01 * a11; - worldTransform[2] = b00 * a02 + b01 * a12 + b02; - - worldTransform[3] = b10 * a00 + b11 * a10; - worldTransform[4] = b10 * a01 + b11 * a11; - worldTransform[5] = b10 * a02 + b11 * a12 + b12; - - // because we are using affine transformation, we can optimise the matrix concatenation process.. wooo! - // mat3.multiply(this.localTransform, this.parent.worldTransform, this.worldTransform); this.worldAlpha = this.alpha * this.parent.worldAlpha; }; diff --git a/src/pixi/display/Sprite.js b/src/pixi/display/Sprite.js index 9bc9cec..35b4235 100644 --- a/src/pixi/display/Sprite.js +++ b/src/pixi/display/Sprite.js @@ -184,12 +184,12 @@ var worldTransform = this.worldTransform; - var a = worldTransform[0]; - var b = worldTransform[3]; - var c = worldTransform[1]; - var d = worldTransform[4]; - var tx = worldTransform[2]; - var ty = worldTransform[5]; + var a = worldTransform.a; + var b = worldTransform.c; + var c = worldTransform.b; + var d = worldTransform.d; + var tx = worldTransform.tx; + var ty = worldTransform.ty; var x1 = a * w1 + c * h1 + tx; var y1 = d * h1 + b * w1 + ty; @@ -345,7 +345,7 @@ // allow for trimming - context.setTransform(transform[0], transform[3], transform[1], transform[4], transform[2], transform[5]); + context.setTransform(transform.a, transform.c, transform.b, transform.d, transform.tx, transform.ty); //if smoothingEnabled is supported and we need to change the smoothing property for this texture if(renderSession.smoothProperty && renderSession.scaleMode !== this.texture.baseTexture.scaleMode) { diff --git a/src/pixi/display/SpriteBatch.js b/src/pixi/display/SpriteBatch.js index bfd3017..7526390 100644 --- a/src/pixi/display/SpriteBatch.js +++ b/src/pixi/display/SpriteBatch.js @@ -93,7 +93,7 @@ // alow for trimming - context.setTransform(transform[0], transform[3], transform[1], transform[4], transform[2], transform[5]); + context.setTransform(transform.a, transform.c, transform.b, transform.d, transform.tx, transform.ty); context.save(); for (var i = 0; i < this.children.length; i++) { @@ -123,7 +123,7 @@ PIXI.DisplayObject.prototype.updateTransform.call(child); transform = child.localTransform; - context.setTransform(transform[0], transform[3], transform[1], transform[4], transform[2], transform[5]); + context.setTransform(transform.a, transform.c, transform.b, transform.d, transform.tx, transform.ty); context.drawImage(texture.baseTexture.source, frame.x, diff --git a/src/pixi/display/Stage.js b/src/pixi/display/Stage.js index e42c772..743e1e0 100644 --- a/src/pixi/display/Stage.js +++ b/src/pixi/display/Stage.js @@ -30,7 +30,7 @@ * @readOnly * @private */ - this.worldTransform = PIXI.mat3.create(); + this.worldTransform = new PIXI.Matrix()//PIXI.mat3.create(); /** * Whether or not the stage is interactive diff --git a/src/pixi/extras/TilingSprite.js b/src/pixi/extras/TilingSprite.js index 59a1ad1..b19dafe 100644 --- a/src/pixi/extras/TilingSprite.js +++ b/src/pixi/extras/TilingSprite.js @@ -198,7 +198,7 @@ // allow for trimming - context.setTransform(transform[0], transform[3], transform[1], transform[4], transform[2], transform[5]); + context.setTransform(transform.a, transform.c, transform.b, transform.d, transform.tx, transform.ty); if(!this.__tilePattern) @@ -256,13 +256,13 @@ var worldTransform = this.worldTransform; - var a = worldTransform[0]; - var b = worldTransform[3]; - var c = worldTransform[1]; - var d = worldTransform[4]; - var tx = worldTransform[2]; - var ty = worldTransform[5]; - + var a = worldTransform.a; + var b = worldTransform.c; + var c = worldTransform.b; + var d = worldTransform.d; + var tx = worldTransform.tx; + var ty = worldTransform.ty; + var x1 = a * w1 + c * h1 + tx; var y1 = d * h1 + b * w1 + ty; diff --git a/src/pixi/primitives/Graphics.js b/src/pixi/primitives/Graphics.js index b057305..a215650 100644 --- a/src/pixi/primitives/Graphics.js +++ b/src/pixi/primitives/Graphics.js @@ -422,7 +422,7 @@ context.globalCompositeOperation = PIXI.blendModesCanvas[renderSession.currentBlendMode]; } - context.setTransform(transform[0], transform[3], transform[1], transform[4], transform[2], transform[5]); + context.setTransform(transform.a, transform.c, transform.b, transform.d, transform.tx, transform.ty); PIXI.CanvasGraphics.renderGraphics(this, context); // simple render children! @@ -450,12 +450,12 @@ var worldTransform = this.worldTransform; - var a = worldTransform[0]; - var b = worldTransform[3]; - var c = worldTransform[1]; - var d = worldTransform[4]; - var tx = worldTransform[2]; - var ty = worldTransform[5]; + var a = worldTransform.a; + var b = worldTransform.c; + var c = worldTransform.b; + var d = worldTransform.d; + var tx = worldTransform.tx; + var ty = worldTransform.ty; var x1 = a * w1 + c * h1 + tx; var y1 = d * h1 + b * w1 + ty; diff --git a/src/pixi/renderers/canvas/utils/CanvasMaskManager.js b/src/pixi/renderers/canvas/utils/CanvasMaskManager.js index 3bbca21..e9a9f97 100644 --- a/src/pixi/renderers/canvas/utils/CanvasMaskManager.js +++ b/src/pixi/renderers/canvas/utils/CanvasMaskManager.js @@ -30,7 +30,7 @@ var cacheAlpha = maskData.alpha; var transform = maskData.worldTransform; - context.setTransform(transform[0], transform[3], transform[1], transform[4], transform[2], transform[5]); + context.setTransform(transform.a, transform.c, transform.b, transform.d, transform.tx, transform.ty); PIXI.CanvasGraphics.renderGraphicsMask(maskData, context); diff --git a/src/pixi/renderers/webgl/utils/WebGLFastSpriteBatch.js b/src/pixi/renderers/webgl/utils/WebGLFastSpriteBatch.js index 765a471..b124701 100644 --- a/src/pixi/renderers/webgl/utils/WebGLFastSpriteBatch.js +++ b/src/pixi/renderers/webgl/utils/WebGLFastSpriteBatch.js @@ -52,7 +52,7 @@ this.shader = null; - this.tempMatrix = PIXI.mat3.create(); + this.matrix this.setContext(gl); }; @@ -82,8 +82,10 @@ { this.renderSession = renderSession; this.shader = this.renderSession.shaderManager.fastShader; - - PIXI.mat3.transpose(spriteBatch.worldTransform, this.tempMatrix); + + // PIXI.mat3.transpose(spriteBatch.worldTransform.toArray(), this.tempMatrix); + + this.matrix = spriteBatch.worldTransform.toArray(true) // console.log(this.tempMatrix) this.start(); @@ -179,8 +181,8 @@ verticies[index++] = sprite.rotation; // uv - verticies[index++] = uvs[0]; - verticies[index++] = uvs[1]; + verticies[index++] = uvs.x0; + verticies[index++] = uvs.y1; // color verticies[index++] = sprite.alpha; @@ -200,8 +202,8 @@ verticies[index++] = sprite.rotation; // uv - verticies[index++] = uvs[2]; - verticies[index++] = uvs[3]; + verticies[index++] = uvs.x1; + verticies[index++] = uvs.y1; // color verticies[index++] = sprite.alpha; @@ -221,8 +223,8 @@ verticies[index++] = sprite.rotation; // uv - verticies[index++] = uvs[4]; - verticies[index++] = uvs[5]; + verticies[index++] = uvs.x2; + verticies[index++] = uvs.y2; // color verticies[index++] = sprite.alpha; @@ -244,8 +246,8 @@ verticies[index++] = sprite.rotation; // uv - verticies[index++] = uvs[6]; - verticies[index++] = uvs[7]; + verticies[index++] = uvs.x3; + verticies[index++] = uvs.y3; // color verticies[index++] = sprite.alpha; @@ -260,6 +262,7 @@ PIXI.WebGLFastSpriteBatch.prototype.flush = function() { + // If the batch is length 0 then return as there is nothing to draw if (this.currentBatchSize===0)return; @@ -318,7 +321,7 @@ gl.uniform2f(this.shader.projectionVector, projection.x, projection.y); // set the matrix - gl.uniformMatrix3fv(this.shader.uMatrix, false, this.tempMatrix); + gl.uniformMatrix3fv(this.shader.uMatrix, false, this.matrix); // set the pointers var stride = this.vertSize * 4; diff --git a/src/pixi/renderers/webgl/utils/WebGLGraphics.js b/src/pixi/renderers/webgl/utils/WebGLGraphics.js index 44f1323..9151c16 100644 --- a/src/pixi/renderers/webgl/utils/WebGLGraphics.js +++ b/src/pixi/renderers/webgl/utils/WebGLGraphics.js @@ -58,12 +58,10 @@ // This could be speeded up for sure! // var m = PIXI.mat3.clone(graphics.worldTransform); - PIXI.mat3.transpose(graphics.worldTransform, PIXI.tempMatrix); - // set the matrix transform gl.blendFunc(gl.ONE, gl.ONE_MINUS_SRC_ALPHA); - gl.uniformMatrix3fv(shader.translationMatrix, false, PIXI.tempMatrix); + gl.uniformMatrix3fv(shader.translationMatrix, false, graphics.worldTransform.toArray(true)); gl.uniform2f(shader.projectionVector, projection.x, -projection.y); gl.uniform2f(shader.offsetVector, -offset.x, -offset.y); diff --git a/bin/pixi.dev.js b/bin/pixi.dev.js index 8558d80..45e6eba 100644 --- a/bin/pixi.dev.js +++ b/bin/pixi.dev.js @@ -1,10 +1,10 @@ /** * @license * pixi.js - v1.4.3 - * Copyright (c) 2012, Mat Groves + * Copyright (c) 2012-2014, Mat Groves * http://goodboydigital.com/ * - * Compiled: 2014-01-28 + * Compiled: 2014-01-30 * * pixi.js is licensed under the MIT License. * http://www.opensource.org/licenses/mit-license.php @@ -461,7 +461,7 @@ return (typeof Float32Array !== 'undefined') ? Float32Array : Array; }; -PIXI.Matrix = PIXI.determineMatrixArrayType(); +PIXI.Matrix2 = PIXI.determineMatrixArrayType(); /** @@ -482,7 +482,7 @@ */ PIXI.mat3.create = function() { - var matrix = new PIXI.Matrix(9); + var matrix = new PIXI.Matrix2(9); matrix[0] = 1; matrix[1] = 0; @@ -567,7 +567,7 @@ */ PIXI.mat3.clone = function(mat) { - var matrix = new PIXI.Matrix(9); + var matrix = new PIXI.Matrix2(9); matrix[0] = mat[0]; matrix[1] = mat[1]; @@ -666,7 +666,7 @@ */ PIXI.mat4.create = function() { - var matrix = new PIXI.Matrix(16); + var matrix = new PIXI.Matrix2(16); matrix[0] = 1; matrix[1] = 0; @@ -799,6 +799,64 @@ PIXI.identityMatrix = PIXI.mat3.create(); PIXI.tempMatrix = PIXI.mat3.create(); + +PIXI.Matrix = function() +{ + this.a = 1; + this.b = 0; + this.c = 0; + this.d = 1; + this.tx = 0; + this.ty = 0; + + +} + +PIXI.Matrix.prototype.fromArray = function(array) +{ + + this.a = array[0]; + this.b = array[1]; + this.c = array[3]; + this.d = array[4]; + this.tx = array[2]; + this.ty = array[5]; + +} + +PIXI.Matrix.prototype.toArray = function(transpose) +{ + if(!this.array)this.array = new Float32Array(9); + var array = this.array; + + if(transpose) + { + this.array[0] = this.a; + this.array[1] = this.c; + this.array[2] = 0; + this.array[3] = this.b; + this.array[4] = this.d; + this.array[5] = 0; + this.array[6] = this.tx; + this.array[7] = this.ty; + this.array[8] = 1; + } + else + { + this.array[0] = this.a; + this.array[1] = this.b; + this.array[2] = this.tx; + this.array[3] = this.c; + this.array[4] = this.d; + this.array[5] = this.ty; + this.array[6] = 0; + this.array[7] = 0; + this.array[8] = 1; + } + + return array;//[this.a, this.b, this.tx, this.c, this.d, this.ty, 0, 0, 1]; +} + /** * @author Mat Groves http://matgroves.com/ @Doormat23 */ @@ -940,7 +998,7 @@ * @readOnly * @private */ - this.worldTransform = PIXI.mat3.create(); //mat3.identity(); + this.worldTransform = new PIXI.Matrix()//PIXI.mat3.create(); //mat3.identity(); /** * [read-only] Current transform of the object locally @@ -950,7 +1008,7 @@ * @readOnly * @private */ - this.localTransform = PIXI.mat3.create(); //mat3.identity(); + this.localTransform = new PIXI.Matrix()//PIXI.mat3.create(); //mat3.identity(); /** * [NYI] Unknown @@ -1208,40 +1266,30 @@ this._cr = Math.cos(this.rotation); } - var localTransform = this.localTransform; - var parentTransform = this.parent.worldTransform; - var worldTransform = this.worldTransform; + // var localTransform = this.localTransform//.toArray(); + var parentTransform = this.parent.worldTransform//.toArray(); + var worldTransform = this.worldTransform//.toArray(); //console.log(localTransform) - localTransform[0] = this._cr * this.scale.x; - localTransform[1] = -this._sr * this.scale.y; - localTransform[3] = this._sr * this.scale.x; - localTransform[4] = this._cr * this.scale.y; - - // TODO --> do we even need a local matrix??? - var px = this.pivot.x; var py = this.pivot.y; - // Cache the matrix values (makes for huge speed increases!) - var a00 = localTransform[0], a01 = localTransform[1], a02 = this.position.x - localTransform[0] * px - py * localTransform[1], - a10 = localTransform[3], a11 = localTransform[4], a12 = this.position.y - localTransform[4] * py - px * localTransform[3], + var a00 = this._cr * this.scale.x, + a01 = -this._sr * this.scale.y, + a10 = this._sr * this.scale.x, + a11 = this._cr * this.scale.y, + a02 = this.position.x + a00 * px - py * a01, + a12 = this.position.y + a11 * py - px * a10, + b00 = parentTransform.a, b01 = parentTransform.b, b02 = parentTransform.tx, + b10 = parentTransform.c, b11 = parentTransform.d, b12 = parentTransform.ty; - b00 = parentTransform[0], b01 = parentTransform[1], b02 = parentTransform[2], - b10 = parentTransform[3], b11 = parentTransform[4], b12 = parentTransform[5]; + worldTransform.a = b00 * a00 + b01 * a10; + worldTransform.b = b00 * a01 + b01 * a11; + worldTransform.tx = b00 * a02 + b01 * a12 + b02; - localTransform[2] = a02; - localTransform[5] = a12; + worldTransform.c = b10 * a00 + b11 * a10; + worldTransform.d = b10 * a01 + b11 * a11; + worldTransform.ty = b10 * a02 + b11 * a12 + b12; - worldTransform[0] = b00 * a00 + b01 * a10; - worldTransform[1] = b00 * a01 + b01 * a11; - worldTransform[2] = b00 * a02 + b01 * a12 + b02; - - worldTransform[3] = b10 * a00 + b11 * a10; - worldTransform[4] = b10 * a01 + b11 * a11; - worldTransform[5] = b10 * a02 + b11 * a12 + b12; - - // because we are using affine transformation, we can optimise the matrix concatenation process.. wooo! - // mat3.multiply(this.localTransform, this.parent.worldTransform, this.worldTransform); this.worldAlpha = this.alpha * this.parent.worldAlpha; }; @@ -1316,6 +1364,36 @@ // this line is just here to pass jshinting :) renderSession = renderSession; }; + +/** + * The position of the displayObject on the x axis relative to the local coordinates of the parent. + * + * @property x + * @type Number + */ +Object.defineProperty(PIXI.DisplayObject.prototype, 'x', { + get: function() { + return this.position.x; + }, + set: function(value) { + this.position.x = value; + } +}); + +/** + * The position of the displayObject on the y axis relative to the local coordinates of the parent. + * + * @property y + * @type Number + */ +Object.defineProperty(PIXI.DisplayObject.prototype, 'y', { + get: function() { + return this.position.y; + }, + set: function(value) { + this.position.y = value; + } +}); /** * @author Mat Groves http://matgroves.com/ @Doormat23 */ @@ -1534,12 +1612,16 @@ var childMaxX; var childMaxY; + var childVisible = false; + for(var i=0,j=this.children.length; i childMaxY ? maxY : childMaxY; } + if(!childVisible) + return PIXI.EmptyRectangle; + var bounds = this._bounds; bounds.x = minX; @@ -1868,12 +1953,12 @@ var worldTransform = this.worldTransform; - var a = worldTransform[0]; - var b = worldTransform[3]; - var c = worldTransform[1]; - var d = worldTransform[4]; - var tx = worldTransform[2]; - var ty = worldTransform[5]; + var a = worldTransform.a; + var b = worldTransform.c; + var c = worldTransform.b; + var d = worldTransform.d; + var tx = worldTransform.tx; + var ty = worldTransform.ty; var x1 = a * w1 + c * h1 + tx; var y1 = d * h1 + b * w1 + ty; @@ -2029,7 +2114,7 @@ // allow for trimming - context.setTransform(transform[0], transform[3], transform[1], transform[4], transform[2], transform[5]); + context.setTransform(transform.a, transform.c, transform.b, transform.d, transform.tx, transform.ty); //if smoothingEnabled is supported and we need to change the smoothing property for this texture if(renderSession.smoothProperty && renderSession.scaleMode !== this.texture.baseTexture.scaleMode) { @@ -2169,6 +2254,13 @@ PIXI.SpriteBatch.prototype = Object.create( PIXI.DisplayObjectContainer.prototype ); PIXI.SpriteBatch.constructor = PIXI.SpriteBatch; + +/* + * Initialises the spriteBatch + * + * @method initWebGL + * @param gl {WebGLContext} the current WebGL drawing context + */ PIXI.SpriteBatch.prototype.initWebGL = function(gl) { @@ -2234,7 +2326,7 @@ // alow for trimming - context.setTransform(transform[0], transform[3], transform[1], transform[4], transform[2], transform[5]); + context.setTransform(transform.a, transform.c, transform.b, transform.d, transform.tx, transform.ty); context.save(); for (var i = 0; i < this.children.length; i++) { @@ -2264,7 +2356,7 @@ PIXI.DisplayObject.prototype.updateTransform.call(child); transform = child.localTransform; - context.setTransform(transform[0], transform[3], transform[1], transform[4], transform[2], transform[5]); + context.setTransform(transform.a, transform.c, transform.b, transform.d, transform.tx, transform.ty); context.drawImage(texture.baseTexture.source, frame.x, @@ -2484,8 +2576,21 @@ */ PIXI.Text = function(text, style) { + /** + * The canvas element that everything is drawn to + * + * @property canvas + * @type HTMLCanvasElement + */ 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'); + PIXI.Sprite.call(this, PIXI.Texture.fromCanvas(this.canvas)); this.setText(text); @@ -2631,6 +2736,13 @@ this.requiresUpdate = true; }; +/** +* Renders the object using the WebGL renderer +* +* @method _renderWebGL +* @param renderSession {RenderSession} +* @private +*/ PIXI.Text.prototype._renderWebGL = function(renderSession) { if(this.requiresUpdate) @@ -2662,6 +2774,7 @@ /* * http://stackoverflow.com/users/34441/ellisbben * great solution to the problem! + * returns the height of the given font * * @method determineFontHeight * @param fontStyle {Object} @@ -2798,11 +2911,11 @@ /** * 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 - * @param style {Object} The style parameters - * @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 + * @param style {Object} The style parameters, contained as properties of an object */ PIXI.BitmapText.prototype.setStyle = function(style) { @@ -3435,8 +3548,8 @@ var isSprite = (item instanceof PIXI.Sprite), worldTransform = item.worldTransform, - a00 = worldTransform[0], a01 = worldTransform[1], a02 = worldTransform[2], - a10 = worldTransform[3], a11 = worldTransform[4], a12 = worldTransform[5], + a00 = worldTransform.a, a01 = worldTransform.b, a02 = worldTransform.tx, + a10 = worldTransform.c, a11 = worldTransform.d, a12 = worldTransform.ty, id = 1 / (a00 * a11 + a01 * -a10), x = a11 * id * global.x + -a01 * id * global.y + (a12 * a01 - a02 * a11) * id, y = a00 * id * global.y + -a10 * id * global.x + (-a12 * a00 + a02 * a10) * id; @@ -3674,7 +3787,7 @@ * @param backgroundColor {Number} the background color of the stage, you have to pass this in is in hex format * 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); * 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 @@ -3693,7 +3806,7 @@ * @readOnly * @private */ - this.worldTransform = PIXI.mat3.create(); + this.worldTransform = new PIXI.Matrix()//PIXI.mat3.create(); /** * Whether or not the stage is interactive @@ -3901,7 +4014,7 @@ * @class AjaxRequest * @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 @@ -4008,7 +4121,7 @@ * Adds event emitter functionality to a class * * @class EventTarget - * @example + * * function MyEmitter() { * PIXI.EventTarget.call(this); //mixes in event target stuff * } @@ -4018,8 +4131,21 @@ */ PIXI.EventTarget = function () { + /** + * Holds all the listeners + * + * @property listeneners + * @type Object + */ 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 ) { @@ -4036,6 +4162,12 @@ }; + /** + * Fires the event, ie pretends that the event has happened + * + * @method dispatchEvent + * @param event {Event} the event object + */ this.dispatchEvent = this.emit = function ( event ) { if ( !listeners[ event.type ] || !listeners[ event.type ].length ) { @@ -4052,6 +4184,13 @@ }; + /** + * 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 ) { var index = listeners[ type ].indexOf( listener ); @@ -4064,6 +4203,12 @@ }; + /** + * 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 ) { var a = listeners[type]; if (a) @@ -4079,7 +4224,8 @@ * 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 * the browser then this function will return a canvas renderer - * + * @class autoDetectRenderer + * @static * @param width=800 {Number} the width 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 @@ -4149,17 +4295,23 @@ 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 = {}; /** * Triangulates shapes for webGL graphic fills * * @method Triangulate - * @namespace PolyK - * @constructor + * */ PIXI.PolyK.Triangulate = function(p) { @@ -4235,10 +4387,17 @@ }; /** - * Checks if a point is within a triangle + * Checks whether a point is within a triangle * - * @class _PointInTriangle - * @namespace PolyK + * @method _PointInTriangle + * @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 */ PIXI.PolyK._PointInTriangle = function(px, py, ax, ay, bx, by, cx, cy) @@ -4265,10 +4424,10 @@ }; /** - * Checks if a shape is convex + * Checks whether a shape is convex * - * @class _convex - * @namespace PolyK + * @method _convex + * * @private */ PIXI.PolyK._convex = function(ax, ay, bx, by, cx, cy, sign) @@ -4343,6 +4502,10 @@ */ PIXI.PixiShader = function(gl) { + /** + * @property gl + * @type WebGLContext + */ this.gl = gl; /** @@ -4375,7 +4538,9 @@ }; /** -* @method PIXI.PixiShader#init +* Initialises the shader +* @method init +* */ PIXI.PixiShader.prototype.init = function() { @@ -4430,7 +4595,7 @@ * 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 * -* @method PIXI.PixiShader#initUniforms +* @method initUniforms */ PIXI.PixiShader.prototype.initUniforms = function() { @@ -4501,7 +4666,7 @@ /** * 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) { @@ -4542,7 +4707,7 @@ wrapT = gl.REPEAT; } - gl.pixelStorei(gl.UNPACK_FLIP_Y_WEBGL, false); + gl.pixelStorei(gl.UNPACK_FLIP_Y_WEBGL, !!data.flipY); if (data.width) { @@ -4576,7 +4741,7 @@ /** * Updates the shader uniform values. * -* @method PIXI.PixiShader#syncUniforms +* @method syncUniforms */ PIXI.PixiShader.prototype.syncUniforms = function() { @@ -4631,6 +4796,11 @@ }; +/** +* Destroys the shader +* @method destroy +* +*/ PIXI.PixiShader.prototype.destroy = function() { this.gl.deleteProgram( this.program ); @@ -4640,6 +4810,11 @@ this.attributes = null; }; +/** +* +* @property defaultVertexSrc +* @type String +*/ PIXI.PixiShader.defaultVertexSrc = [ 'attribute vec2 aVertexPosition;', 'attribute vec2 aTextureCoord;', @@ -4673,19 +4848,25 @@ /** * @class PIXI.PixiFastShader * @constructor +* @param gl {WebGLContext} the current WebGL drawing context */ PIXI.PixiFastShader = function(gl) { + + /** + * @property gl + * @type WebGLContext + */ this.gl = gl; /** - * @property {any} program - The WebGL program. - */ + * @property {any} program - The WebGL program. + */ this.program = null; /** - * @property {array} fragmentSrc - The fragment shader. - */ + * @property {array} fragmentSrc - The fragment shader. + */ this.fragmentSrc = [ 'precision lowp float;', 'varying vec2 vTextureCoord;', @@ -4696,6 +4877,9 @@ '}' ]; + /** + * @property {array} vertexSrc - The vertex shader + */ this.vertexSrc = [ 'attribute vec2 aVertexPosition;', 'attribute vec2 aPositionCoord;', @@ -4737,7 +4921,9 @@ }; /** -* @method PIXI.PixiFastShader#init +* Initialises the shader +* @method init +* */ PIXI.PixiFastShader.prototype.init = function() { @@ -4787,6 +4973,11 @@ this.program = program; }; +/** +* Destroys the shader +* @method destroy +* +*/ PIXI.PixiFastShader.prototype.destroy = function() { this.gl.deleteProgram( this.program ); @@ -4803,9 +4994,14 @@ PIXI.StripShader = function() { - // the webGL program.. + /** + * @property {any} program - The WebGL program. + */ this.program = null; + /** + * @property {array} fragmentSrc - The fragment shader. + */ this.fragmentSrc = [ 'precision mediump float;', 'varying vec2 vTextureCoord;', @@ -4819,6 +5015,9 @@ '}' ]; + /** + * @property {array} fragmentSrc - The fragment shader. + */ this.vertexSrc = [ 'attribute vec2 aVertexPosition;', 'attribute vec2 aTextureCoord;', @@ -4839,6 +5038,11 @@ ]; }; +/** +* Initialises the shader +* @method init +* +*/ PIXI.StripShader.prototype.init = function() { @@ -4868,14 +5072,28 @@ * @author Mat Groves http://matgroves.com/ @Doormat23 */ - +/** +* @class PrimitiveShader +* @constructor +* @param gl {WebGLContext} the current WebGL drawing context +*/ PIXI.PrimitiveShader = function(gl) { + /** + * @property gl + * @type WebGLContext + */ this.gl = gl; - // the webGL program.. + /** + * @property {any} program - The WebGL program. + */ this.program = null; + /** + * @property fragmentSrc + * @type Array + */ this.fragmentSrc = [ 'precision mediump float;', 'varying vec4 vColor;', @@ -4885,6 +5103,10 @@ '}' ]; + /** + * @property vertexSrc + * @type Array + */ this.vertexSrc = [ 'attribute vec2 aVertexPosition;', 'attribute vec4 aColor;', @@ -4906,6 +5128,11 @@ this.init(); }; +/** +* Initialises the shader +* @method init +* +*/ PIXI.PrimitiveShader.prototype.init = function() { @@ -4932,6 +5159,11 @@ this.program = program; }; +/** +* Destroys the shader +* @method destroy +* +*/ PIXI.PrimitiveShader.prototype.destroy = function() { this.gl.deleteProgram( this.program ); @@ -4948,7 +5180,9 @@ /** * A set of functions used by the webGL renderer to draw the primitive graphics data * - * @class CanvasGraphics + * @class WebGLGraphics + * @private + * @static */ PIXI.WebGLGraphics = function() { @@ -4962,7 +5196,7 @@ * @private * @method renderGraphics * @param graphics {Graphics} - * @param projection {Object} + * @param renderSession {Object} */ PIXI.WebGLGraphics.renderGraphics = function(graphics, renderSession)//projection, offset) { @@ -4999,12 +5233,10 @@ // This could be speeded up for sure! // var m = PIXI.mat3.clone(graphics.worldTransform); - PIXI.mat3.transpose(graphics.worldTransform, PIXI.tempMatrix); - // set the matrix transform gl.blendFunc(gl.ONE, gl.ONE_MINUS_SRC_ALPHA); - gl.uniformMatrix3fv(shader.translationMatrix, false, PIXI.tempMatrix); + gl.uniformMatrix3fv(shader.translationMatrix, false, graphics.worldTransform.toArray(true)); gl.uniform2f(shader.projectionVector, projection.x, -projection.y); gl.uniform2f(shader.offsetVector, -offset.x, -offset.y); @@ -5034,7 +5266,8 @@ * @static * @private * @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) { @@ -5088,7 +5321,7 @@ * @static * @private * @method buildRectangle - * @param graphics {Graphics} + * @param graphicsData {Graphics} The graphics object to draw TODO-Alvin * @param webGLData {Object} */ PIXI.WebGLGraphics.buildRectangle = function(graphicsData, webGLData) @@ -5157,7 +5390,7 @@ * @static * @private * @method buildCircle - * @param graphics {Graphics} + * @param graphicsData {Graphics} The graphics object to draw * @param webGLData {Object} */ PIXI.WebGLGraphics.buildCircle = function(graphicsData, webGLData) @@ -5230,7 +5463,7 @@ * @static * @private * @method buildLine - * @param graphics {Graphics} + * @param graphicsData {Graphics} The graphics object to draw TODO-Alvin * @param webGLData {Object} */ PIXI.WebGLGraphics.buildLine = function(graphicsData, webGLData) @@ -5440,7 +5673,7 @@ * @static * @private * @method buildPoly - * @param graphics {Graphics} + * @param graphicsData {Graphics} The graphics object to draw TODO-Alvin * @param webGLData {Object} */ PIXI.WebGLGraphics.buildPoly = function(graphicsData, webGLData) @@ -6050,6 +6283,13 @@ * @author Mat Groves http://matgroves.com/ @Doormat23 */ + +/** +* @class WebGLMaskManager +* @constructor +* @param gl {WebGLContext} the current WebGL drawing context +* @private +*/ PIXI.WebGLMaskManager = function(gl) { this.maskStack = []; @@ -6058,11 +6298,22 @@ 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) { 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) { var gl = this.gl; @@ -6087,6 +6338,12 @@ 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) { var gl = this.gl; @@ -6110,6 +6367,10 @@ if(this.maskStack.length === 0)gl.disable(gl.STENCIL_TEST); }; +/** +* TODO-Alvin +* @method destroy +*/ PIXI.WebGLMaskManager.prototype.destroy = function() { this.maskStack = null; @@ -6119,6 +6380,12 @@ * @author Mat Groves http://matgroves.com/ @Doormat23 */ +/** +* @class WebGLShaderManager +* @constructor +* @param gl {WebGLContext} the current WebGL drawing context +* @private +*/ PIXI.WebGLShaderManager = function(gl) { @@ -6135,6 +6402,13 @@ //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) { this.gl = gl; @@ -6153,6 +6427,11 @@ }; +/** +* Initialises the context and the properties +* @method setAttribs +* @param attribs {Array} TODO-Alvin +*/ PIXI.WebGLShaderManager.prototype.setAttribs = function(attribs) { // reset temp state @@ -6194,6 +6473,11 @@ // 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) { //if(this.currentShader == shader)return; @@ -6207,6 +6491,10 @@ }; +/** +* Triggers the primitive shader +* @method activatePrimitiveShader +*/ PIXI.WebGLShaderManager.prototype.activatePrimitiveShader = function() { var gl = this.gl; @@ -6217,6 +6505,10 @@ }; +/** +* Disable the primitive shader +* @method deactivatePrimitiveShader +*/ PIXI.WebGLShaderManager.prototype.deactivatePrimitiveShader = function() { var gl = this.gl; @@ -6226,6 +6518,10 @@ this.setAttribs(this.defaultShader.attributes); }; +/** +* Destroys +* @method destroy +*/ PIXI.WebGLShaderManager.prototype.destroy = function() { this.attribState = null; @@ -6252,11 +6548,30 @@ * 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) { - + /** + * TODO-Alvin + * + * @property vertSize + * @type Number + */ this.vertSize = 6; + + /** + * TODO-Alvin + * @property size + * @type Number + */ this.size = 10000;//Math.pow(2, 16) / this.vertSize; // console.log(this.size); @@ -6265,9 +6580,23 @@ //the total number of indices in our batch var numIndices = this.size * 6; - //vertex data + //vertex data + + /** + * Holds the vertices + * + * @property vertices + * @type Float32Array + */ this.vertices = new Float32Array(numVerts); + //index data + /** + * Holds the indices + * + * @property indices + * @type Uint16Array + */ this.indices = new Uint16Array(numIndices); this.lastIndexCount = 0; @@ -6290,6 +6619,12 @@ this.setContext(gl); }; +/** +* +* @method setContext +* +* @param gl {WebGLContext} the current WebGL drawing context +*/ PIXI.WebGLSpriteBatch.prototype.setContext = function(gl) { this.gl = gl; @@ -6311,6 +6646,12 @@ this.currentBlendMode = 99999; }; +/** +* +* @method begin +* +* @param renderSession {RenderSession} the RenderSession +*/ PIXI.WebGLSpriteBatch.prototype.begin = function(renderSession) { this.renderSession = renderSession; @@ -6319,12 +6660,22 @@ this.start(); }; +/** +* +* @method end +* +*/ PIXI.WebGLSpriteBatch.prototype.end = function() { this.flush(); }; - +/** +* +* @method render +* +* @param sprite {Sprite} the sprite to render TODO-Alvin +*/ PIXI.WebGLSpriteBatch.prototype.render = function(sprite) { // check texture.. @@ -6383,21 +6734,21 @@ var index = this.currentBatchSize * 4 * this.vertSize; - var worldTransform = sprite.worldTransform; + var worldTransform = sprite.worldTransform;//.toArray(); - var a = worldTransform[0]; - var b = worldTransform[3]; - var c = worldTransform[1]; - var d = worldTransform[4]; - var tx = worldTransform[2]; - var ty = worldTransform[5]; + var a = worldTransform.a//[0]; + var b = worldTransform.c//[3]; + var c = worldTransform.b//[1]; + var d = worldTransform.d//[4]; + var tx = worldTransform.tx//[2]; + var ty = worldTransform.ty///[5]; // xy verticies[index++] = a * w1 + c * h1 + tx; verticies[index++] = d * h1 + b * w1 + ty; // uv - verticies[index++] = uvs[0]; - verticies[index++] = uvs[1]; + verticies[index++] = uvs.x0; + verticies[index++] = uvs.y0; // color verticies[index++] = alpha; verticies[index++] = tint; @@ -6406,8 +6757,8 @@ verticies[index++] = a * w0 + c * h1 + tx; verticies[index++] = d * h1 + b * w0 + ty; // uv - verticies[index++] = uvs[2]; - verticies[index++] = uvs[3]; + verticies[index++] = uvs.x1; + verticies[index++] = uvs.y1; // color verticies[index++] = alpha; verticies[index++] = tint; @@ -6416,8 +6767,8 @@ verticies[index++] = a * w0 + c * h0 + tx; verticies[index++] = d * h0 + b * w0 + ty; // uv - verticies[index++] = uvs[4]; - verticies[index++] = uvs[5]; + verticies[index++] = uvs.x2; + verticies[index++] = uvs.y2; // color verticies[index++] = alpha; verticies[index++] = tint; @@ -6426,18 +6777,24 @@ verticies[index++] = a * w1 + c * h0 + tx; verticies[index++] = d * h0 + b * w1 + ty; // uv - verticies[index++] = uvs[6]; - verticies[index++] = uvs[7]; + verticies[index++] = uvs.x3; + verticies[index++] = uvs.y3; // color verticies[index++] = alpha; verticies[index++] = tint; - + // increment the batchsize this.currentBatchSize++; }; +/** +* +* @method renderTilingSprite +* +* @param sprite {TilingSprite} the sprite to render TODO-Alvin +*/ PIXI.WebGLSpriteBatch.prototype.renderTilingSprite = function(tilingSprite) { var texture = tilingSprite.tilingTexture; @@ -6553,6 +6910,13 @@ this.currentBatchSize++; }; + +/** +* +* +* @method flush TODO-Alvin +* +*/ PIXI.WebGLSpriteBatch.prototype.flush = function() { // If the batch is length 0 then return as there is nothing to draw @@ -6589,12 +6953,21 @@ this.renderSession.drawCount++; }; - +/** +* +* @method stop +* +*/ PIXI.WebGLSpriteBatch.prototype.stop = function() { this.flush(); }; +/** +* +* @method start +* +*/ PIXI.WebGLSpriteBatch.prototype.start = function() { var gl = this.gl; @@ -6623,6 +6996,13 @@ } }; +/** +* +* @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) { this.flush(); @@ -6633,6 +7013,10 @@ this.gl.blendFunc(blendModeWebGL[0], blendModeWebGL[1]); }; +/** +* Destroys the SpriteBatch +* @method destroy +*/ PIXI.WebGLSpriteBatch.prototype.destroy = function() { @@ -6702,7 +7086,7 @@ this.shader = null; - this.tempMatrix = PIXI.mat3.create(); + this.matrix this.setContext(gl); }; @@ -6732,8 +7116,10 @@ { this.renderSession = renderSession; this.shader = this.renderSession.shaderManager.fastShader; - - PIXI.mat3.transpose(spriteBatch.worldTransform, this.tempMatrix); + + // PIXI.mat3.transpose(spriteBatch.worldTransform.toArray(), this.tempMatrix); + + this.matrix = spriteBatch.worldTransform.toArray(true) // console.log(this.tempMatrix) this.start(); @@ -6829,8 +7215,8 @@ verticies[index++] = sprite.rotation; // uv - verticies[index++] = uvs[0]; - verticies[index++] = uvs[1]; + verticies[index++] = uvs.x0; + verticies[index++] = uvs.y1; // color verticies[index++] = sprite.alpha; @@ -6850,8 +7236,8 @@ verticies[index++] = sprite.rotation; // uv - verticies[index++] = uvs[2]; - verticies[index++] = uvs[3]; + verticies[index++] = uvs.x1; + verticies[index++] = uvs.y1; // color verticies[index++] = sprite.alpha; @@ -6871,8 +7257,8 @@ verticies[index++] = sprite.rotation; // uv - verticies[index++] = uvs[4]; - verticies[index++] = uvs[5]; + verticies[index++] = uvs.x2; + verticies[index++] = uvs.y2; // color verticies[index++] = sprite.alpha; @@ -6894,8 +7280,8 @@ verticies[index++] = sprite.rotation; // uv - verticies[index++] = uvs[6]; - verticies[index++] = uvs[7]; + verticies[index++] = uvs.x3; + verticies[index++] = uvs.y3; // color verticies[index++] = sprite.alpha; @@ -6910,6 +7296,7 @@ PIXI.WebGLFastSpriteBatch.prototype.flush = function() { + // If the batch is length 0 then return as there is nothing to draw if (this.currentBatchSize===0)return; @@ -6968,7 +7355,7 @@ gl.uniform2f(this.shader.projectionVector, projection.x, projection.y); // set the matrix - gl.uniformMatrix3fv(this.shader.uMatrix, false, this.tempMatrix); + gl.uniformMatrix3fv(this.shader.uMatrix, false, this.matrix); // set the pointers var stride = this.vertSize * 4; @@ -7003,7 +7390,13 @@ * @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) { this.transparent = transparent; @@ -7017,7 +7410,11 @@ }; // API - +/** +* Initialises the context and the properties +* @method setContext +* @param gl {WebGLContext} the current WebGL drawing context +*/ PIXI.WebGLFilterManager.prototype.setContext = function(gl) { this.gl = gl; @@ -7026,6 +7423,12 @@ this.initShaderBuffers(); }; +/** +* +* @method begin +* @param renderSession {RenderSession} +* @param buffer {ArrayBuffer} +*/ PIXI.WebGLFilterManager.prototype.begin = function(renderSession, buffer) { this.renderSession = renderSession; @@ -7038,6 +7441,11 @@ 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) { var gl = this.gl; @@ -7119,6 +7527,10 @@ }; +/** +* Removes the last filter from the filter stack and doesn't return it +* @method popFilter +*/ PIXI.WebGLFilterManager.prototype.popFilter = function() { var gl = this.gl; @@ -7292,6 +7704,15 @@ 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) { // use program @@ -7344,6 +7765,10 @@ this.renderSession.drawCount++; }; +/** +* Initialises the shader buffers +* @method initShaderBuffers +*/ PIXI.WebGLFilterManager.prototype.initShaderBuffers = function() { var gl = this.gl; @@ -7400,6 +7825,10 @@ gl.STATIC_DRAW); }; +/** +* TODO-Alvin +* @method destroy +*/ PIXI.WebGLFilterManager.prototype.destroy = function() { var gl = this.gl; @@ -7422,9 +7851,24 @@ gl.deleteBuffer(this.colorBuffer); gl.deleteBuffer(this.indexBuffer); }; +/** + * @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 @@ -7444,6 +7888,11 @@ this.resize(width, height); }; + +/** +* Clears the filter texture +* @method clear +*/ PIXI.FilterTexture.prototype.clear = function() { var gl = this.gl; @@ -7452,6 +7901,13 @@ 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; @@ -7466,6 +7922,10 @@ }; +/** +* Destroys the filter texture +* @method destroy +*/ PIXI.FilterTexture.prototype.destroy = function() { var gl = this.gl; @@ -7476,7 +7936,6 @@ this.texture = null; }; - /** * @author Mat Groves * @@ -7509,7 +7968,7 @@ var cacheAlpha = maskData.alpha; var transform = maskData.worldTransform; - context.setTransform(transform[0], transform[3], transform[1], transform[4], transform[2], transform[5]); + context.setTransform(transform.a, transform.c, transform.b, transform.d, transform.tx, transform.ty); PIXI.CanvasGraphics.renderGraphicsMask(maskData, context); @@ -7876,7 +8335,7 @@ 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 * @type HTMLCanvasElement 2d Context */ @@ -7949,6 +8408,7 @@ { if(!this.transparent) { + this.context.globalAlpha = 1; this.context.fillStyle = stage.backgroundColorString; this.context.fillRect(0, 0, this.width, this.height); } @@ -8814,7 +9274,7 @@ context.globalCompositeOperation = PIXI.blendModesCanvas[renderSession.currentBlendMode]; } - context.setTransform(transform[0], transform[3], transform[1], transform[4], transform[2], transform[5]); + context.setTransform(transform.a, transform.c, transform.b, transform.d, transform.tx, transform.ty); PIXI.CanvasGraphics.renderGraphics(this, context); // simple render children! @@ -8842,12 +9302,12 @@ var worldTransform = this.worldTransform; - var a = worldTransform[0]; - var b = worldTransform[3]; - var c = worldTransform[1]; - var d = worldTransform[4]; - var tx = worldTransform[2]; - var ty = worldTransform[5]; + var a = worldTransform.a; + var b = worldTransform.c; + var c = worldTransform.b; + var d = worldTransform.d; + var tx = worldTransform.tx; + var ty = worldTransform.ty; var x1 = a * w1 + c * h1 + tx; var y1 = d * h1 + b * w1 + ty; @@ -9525,7 +9985,7 @@ // allow for trimming - context.setTransform(transform[0], transform[3], transform[1], transform[4], transform[2], transform[5]); + context.setTransform(transform.a, transform.c, transform.b, transform.d, transform.tx, transform.ty); if(!this.__tilePattern) @@ -9583,13 +10043,13 @@ var worldTransform = this.worldTransform; - var a = worldTransform[0]; - var b = worldTransform[3]; - var c = worldTransform[1]; - var d = worldTransform[4]; - var tx = worldTransform[2]; - var ty = worldTransform[5]; - + var a = worldTransform.a; + var b = worldTransform.c; + var c = worldTransform.b; + var d = worldTransform.d; + var tx = worldTransform.tx; + var ty = worldTransform.ty; + var x1 = a * w1 + c * h1 + tx; var y1 = d * h1 + b * w1 + ty; @@ -11189,6 +11649,7 @@ * @uses EventTarget * @constructor * @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) { @@ -11501,23 +11962,23 @@ PIXI.Texture.prototype._updateWebGLuvs = function() { - if(!this._uvs)this._uvs = new Float32Array(8); + if(!this._uvs)this._uvs = new PIXI.TextureUvs(); var frame = this.frame; var tw = this.baseTexture.width; var th = this.baseTexture.height; - this._uvs[0] = frame.x / tw; - this._uvs[1] = frame.y / th; + this._uvs.x0 = frame.x / tw; + this._uvs.y0 = frame.y / th; - this._uvs[2] = (frame.x + frame.width) / tw; - this._uvs[3] = frame.y / th; + this._uvs.x1 = (frame.x + frame.width) / tw; + this._uvs.y1 = frame.y / th; - this._uvs[4] = (frame.x + frame.width) / tw; - this._uvs[5] = (frame.y + frame.height) / th; + this._uvs.x2 = (frame.x + frame.width) / tw; + this._uvs.y2 = (frame.y + frame.height) / th; - this._uvs[6] = frame.x / tw; - this._uvs[7] = (frame.y + frame.height) / th; + this._uvs.x3 = frame.x / tw; + this._uvs.y3 = (frame.y + frame.height) / th; }; /** @@ -11608,6 +12069,28 @@ // this is more for webGL.. it contains updated frames.. PIXI.Texture.frameUpdates = []; +PIXI.TextureUvs = function() +{ + this.x0 = 0; + this.y0 = 0; + + this.x1 = 0; + this.y1 = 0; + + this.x2 = 0; + this.y2 = 0; + + this.x3 = 0; + this.y4 = 0; + + +} + + + + + + /** * @author Mat Groves http://matgroves.com/ @Doormat23 */ @@ -12606,7 +13089,7 @@ */ PIXI.BitmapFontLoader.prototype.load = function() { - this.ajaxRequest = new XMLHttpRequest(); + this.ajaxRequest = new PIXI.ajaxRequest(); var scope = this; this.ajaxRequest.onreadystatechange = function() { @@ -12619,7 +13102,7 @@ }; /** - * Invoked when XML file is loaded, parses the data + * Invoked when the XML file is loaded, parses the data * * @method onXMLLoaded * @private diff --git a/src/pixi/InteractionManager.js b/src/pixi/InteractionManager.js index a7072d6..98ac26c 100644 --- a/src/pixi/InteractionManager.js +++ b/src/pixi/InteractionManager.js @@ -454,8 +454,8 @@ var isSprite = (item instanceof PIXI.Sprite), worldTransform = item.worldTransform, - a00 = worldTransform[0], a01 = worldTransform[1], a02 = worldTransform[2], - a10 = worldTransform[3], a11 = worldTransform[4], a12 = worldTransform[5], + a00 = worldTransform.a, a01 = worldTransform.b, a02 = worldTransform.tx, + a10 = worldTransform.c, a11 = worldTransform.d, a12 = worldTransform.ty, id = 1 / (a00 * a11 + a01 * -a10), x = a11 * id * global.x + -a01 * id * global.y + (a12 * a01 - a02 * a11) * id, y = a00 * id * global.y + -a10 * id * global.x + (-a12 * a00 + a02 * a10) * id; diff --git a/src/pixi/core/Matrix.js b/src/pixi/core/Matrix.js index b88735c..5c4c103 100644 --- a/src/pixi/core/Matrix.js +++ b/src/pixi/core/Matrix.js @@ -12,7 +12,7 @@ return (typeof Float32Array !== 'undefined') ? Float32Array : Array; }; -PIXI.Matrix = PIXI.determineMatrixArrayType(); +PIXI.Matrix2 = PIXI.determineMatrixArrayType(); /** @@ -33,7 +33,7 @@ */ PIXI.mat3.create = function() { - var matrix = new PIXI.Matrix(9); + var matrix = new PIXI.Matrix2(9); matrix[0] = 1; matrix[1] = 0; @@ -118,7 +118,7 @@ */ PIXI.mat3.clone = function(mat) { - var matrix = new PIXI.Matrix(9); + var matrix = new PIXI.Matrix2(9); matrix[0] = mat[0]; matrix[1] = mat[1]; @@ -217,7 +217,7 @@ */ PIXI.mat4.create = function() { - var matrix = new PIXI.Matrix(16); + var matrix = new PIXI.Matrix2(16); matrix[0] = 1; matrix[1] = 0; @@ -349,4 +349,61 @@ }; PIXI.identityMatrix = PIXI.mat3.create(); -PIXI.tempMatrix = PIXI.mat3.create(); \ No newline at end of file +PIXI.tempMatrix = PIXI.mat3.create(); + +PIXI.Matrix = function() +{ + this.a = 1; + this.b = 0; + this.c = 0; + this.d = 1; + this.tx = 0; + this.ty = 0; + + +} + +PIXI.Matrix.prototype.fromArray = function(array) +{ + + this.a = array[0]; + this.b = array[1]; + this.c = array[3]; + this.d = array[4]; + this.tx = array[2]; + this.ty = array[5]; + +} + +PIXI.Matrix.prototype.toArray = function(transpose) +{ + if(!this.array)this.array = new Float32Array(9); + var array = this.array; + + if(transpose) + { + this.array[0] = this.a; + this.array[1] = this.c; + this.array[2] = 0; + this.array[3] = this.b; + this.array[4] = this.d; + this.array[5] = 0; + this.array[6] = this.tx; + this.array[7] = this.ty; + this.array[8] = 1; + } + else + { + this.array[0] = this.a; + this.array[1] = this.b; + this.array[2] = this.tx; + this.array[3] = this.c; + this.array[4] = this.d; + this.array[5] = this.ty; + this.array[6] = 0; + this.array[7] = 0; + this.array[8] = 1; + } + + return array;//[this.a, this.b, this.tx, this.c, this.d, this.ty, 0, 0, 1]; +} diff --git a/src/pixi/display/DisplayObject.js b/src/pixi/display/DisplayObject.js index b6da1a6..32d34a9 100644 --- a/src/pixi/display/DisplayObject.js +++ b/src/pixi/display/DisplayObject.js @@ -139,7 +139,7 @@ * @readOnly * @private */ - this.worldTransform = PIXI.mat3.create(); //mat3.identity(); + this.worldTransform = new PIXI.Matrix()//PIXI.mat3.create(); //mat3.identity(); /** * [read-only] Current transform of the object locally @@ -149,7 +149,7 @@ * @readOnly * @private */ - this.localTransform = PIXI.mat3.create(); //mat3.identity(); + this.localTransform = new PIXI.Matrix()//PIXI.mat3.create(); //mat3.identity(); /** * [NYI] Unknown @@ -407,40 +407,30 @@ this._cr = Math.cos(this.rotation); } - var localTransform = this.localTransform; - var parentTransform = this.parent.worldTransform; - var worldTransform = this.worldTransform; + // var localTransform = this.localTransform//.toArray(); + var parentTransform = this.parent.worldTransform//.toArray(); + var worldTransform = this.worldTransform//.toArray(); //console.log(localTransform) - localTransform[0] = this._cr * this.scale.x; - localTransform[1] = -this._sr * this.scale.y; - localTransform[3] = this._sr * this.scale.x; - localTransform[4] = this._cr * this.scale.y; - - // TODO --> do we even need a local matrix??? - var px = this.pivot.x; var py = this.pivot.y; - // Cache the matrix values (makes for huge speed increases!) - var a00 = localTransform[0], a01 = localTransform[1], a02 = this.position.x - localTransform[0] * px - py * localTransform[1], - a10 = localTransform[3], a11 = localTransform[4], a12 = this.position.y - localTransform[4] * py - px * localTransform[3], + var a00 = this._cr * this.scale.x, + a01 = -this._sr * this.scale.y, + a10 = this._sr * this.scale.x, + a11 = this._cr * this.scale.y, + a02 = this.position.x + a00 * px - py * a01, + a12 = this.position.y + a11 * py - px * a10, + b00 = parentTransform.a, b01 = parentTransform.b, b02 = parentTransform.tx, + b10 = parentTransform.c, b11 = parentTransform.d, b12 = parentTransform.ty; - b00 = parentTransform[0], b01 = parentTransform[1], b02 = parentTransform[2], - b10 = parentTransform[3], b11 = parentTransform[4], b12 = parentTransform[5]; + worldTransform.a = b00 * a00 + b01 * a10; + worldTransform.b = b00 * a01 + b01 * a11; + worldTransform.tx = b00 * a02 + b01 * a12 + b02; - localTransform[2] = a02; - localTransform[5] = a12; + worldTransform.c = b10 * a00 + b11 * a10; + worldTransform.d = b10 * a01 + b11 * a11; + worldTransform.ty = b10 * a02 + b11 * a12 + b12; - worldTransform[0] = b00 * a00 + b01 * a10; - worldTransform[1] = b00 * a01 + b01 * a11; - worldTransform[2] = b00 * a02 + b01 * a12 + b02; - - worldTransform[3] = b10 * a00 + b11 * a10; - worldTransform[4] = b10 * a01 + b11 * a11; - worldTransform[5] = b10 * a02 + b11 * a12 + b12; - - // because we are using affine transformation, we can optimise the matrix concatenation process.. wooo! - // mat3.multiply(this.localTransform, this.parent.worldTransform, this.worldTransform); this.worldAlpha = this.alpha * this.parent.worldAlpha; }; diff --git a/src/pixi/display/Sprite.js b/src/pixi/display/Sprite.js index 9bc9cec..35b4235 100644 --- a/src/pixi/display/Sprite.js +++ b/src/pixi/display/Sprite.js @@ -184,12 +184,12 @@ var worldTransform = this.worldTransform; - var a = worldTransform[0]; - var b = worldTransform[3]; - var c = worldTransform[1]; - var d = worldTransform[4]; - var tx = worldTransform[2]; - var ty = worldTransform[5]; + var a = worldTransform.a; + var b = worldTransform.c; + var c = worldTransform.b; + var d = worldTransform.d; + var tx = worldTransform.tx; + var ty = worldTransform.ty; var x1 = a * w1 + c * h1 + tx; var y1 = d * h1 + b * w1 + ty; @@ -345,7 +345,7 @@ // allow for trimming - context.setTransform(transform[0], transform[3], transform[1], transform[4], transform[2], transform[5]); + context.setTransform(transform.a, transform.c, transform.b, transform.d, transform.tx, transform.ty); //if smoothingEnabled is supported and we need to change the smoothing property for this texture if(renderSession.smoothProperty && renderSession.scaleMode !== this.texture.baseTexture.scaleMode) { diff --git a/src/pixi/display/SpriteBatch.js b/src/pixi/display/SpriteBatch.js index bfd3017..7526390 100644 --- a/src/pixi/display/SpriteBatch.js +++ b/src/pixi/display/SpriteBatch.js @@ -93,7 +93,7 @@ // alow for trimming - context.setTransform(transform[0], transform[3], transform[1], transform[4], transform[2], transform[5]); + context.setTransform(transform.a, transform.c, transform.b, transform.d, transform.tx, transform.ty); context.save(); for (var i = 0; i < this.children.length; i++) { @@ -123,7 +123,7 @@ PIXI.DisplayObject.prototype.updateTransform.call(child); transform = child.localTransform; - context.setTransform(transform[0], transform[3], transform[1], transform[4], transform[2], transform[5]); + context.setTransform(transform.a, transform.c, transform.b, transform.d, transform.tx, transform.ty); context.drawImage(texture.baseTexture.source, frame.x, diff --git a/src/pixi/display/Stage.js b/src/pixi/display/Stage.js index e42c772..743e1e0 100644 --- a/src/pixi/display/Stage.js +++ b/src/pixi/display/Stage.js @@ -30,7 +30,7 @@ * @readOnly * @private */ - this.worldTransform = PIXI.mat3.create(); + this.worldTransform = new PIXI.Matrix()//PIXI.mat3.create(); /** * Whether or not the stage is interactive diff --git a/src/pixi/extras/TilingSprite.js b/src/pixi/extras/TilingSprite.js index 59a1ad1..b19dafe 100644 --- a/src/pixi/extras/TilingSprite.js +++ b/src/pixi/extras/TilingSprite.js @@ -198,7 +198,7 @@ // allow for trimming - context.setTransform(transform[0], transform[3], transform[1], transform[4], transform[2], transform[5]); + context.setTransform(transform.a, transform.c, transform.b, transform.d, transform.tx, transform.ty); if(!this.__tilePattern) @@ -256,13 +256,13 @@ var worldTransform = this.worldTransform; - var a = worldTransform[0]; - var b = worldTransform[3]; - var c = worldTransform[1]; - var d = worldTransform[4]; - var tx = worldTransform[2]; - var ty = worldTransform[5]; - + var a = worldTransform.a; + var b = worldTransform.c; + var c = worldTransform.b; + var d = worldTransform.d; + var tx = worldTransform.tx; + var ty = worldTransform.ty; + var x1 = a * w1 + c * h1 + tx; var y1 = d * h1 + b * w1 + ty; diff --git a/src/pixi/primitives/Graphics.js b/src/pixi/primitives/Graphics.js index b057305..a215650 100644 --- a/src/pixi/primitives/Graphics.js +++ b/src/pixi/primitives/Graphics.js @@ -422,7 +422,7 @@ context.globalCompositeOperation = PIXI.blendModesCanvas[renderSession.currentBlendMode]; } - context.setTransform(transform[0], transform[3], transform[1], transform[4], transform[2], transform[5]); + context.setTransform(transform.a, transform.c, transform.b, transform.d, transform.tx, transform.ty); PIXI.CanvasGraphics.renderGraphics(this, context); // simple render children! @@ -450,12 +450,12 @@ var worldTransform = this.worldTransform; - var a = worldTransform[0]; - var b = worldTransform[3]; - var c = worldTransform[1]; - var d = worldTransform[4]; - var tx = worldTransform[2]; - var ty = worldTransform[5]; + var a = worldTransform.a; + var b = worldTransform.c; + var c = worldTransform.b; + var d = worldTransform.d; + var tx = worldTransform.tx; + var ty = worldTransform.ty; var x1 = a * w1 + c * h1 + tx; var y1 = d * h1 + b * w1 + ty; diff --git a/src/pixi/renderers/canvas/utils/CanvasMaskManager.js b/src/pixi/renderers/canvas/utils/CanvasMaskManager.js index 3bbca21..e9a9f97 100644 --- a/src/pixi/renderers/canvas/utils/CanvasMaskManager.js +++ b/src/pixi/renderers/canvas/utils/CanvasMaskManager.js @@ -30,7 +30,7 @@ var cacheAlpha = maskData.alpha; var transform = maskData.worldTransform; - context.setTransform(transform[0], transform[3], transform[1], transform[4], transform[2], transform[5]); + context.setTransform(transform.a, transform.c, transform.b, transform.d, transform.tx, transform.ty); PIXI.CanvasGraphics.renderGraphicsMask(maskData, context); diff --git a/src/pixi/renderers/webgl/utils/WebGLFastSpriteBatch.js b/src/pixi/renderers/webgl/utils/WebGLFastSpriteBatch.js index 765a471..b124701 100644 --- a/src/pixi/renderers/webgl/utils/WebGLFastSpriteBatch.js +++ b/src/pixi/renderers/webgl/utils/WebGLFastSpriteBatch.js @@ -52,7 +52,7 @@ this.shader = null; - this.tempMatrix = PIXI.mat3.create(); + this.matrix this.setContext(gl); }; @@ -82,8 +82,10 @@ { this.renderSession = renderSession; this.shader = this.renderSession.shaderManager.fastShader; - - PIXI.mat3.transpose(spriteBatch.worldTransform, this.tempMatrix); + + // PIXI.mat3.transpose(spriteBatch.worldTransform.toArray(), this.tempMatrix); + + this.matrix = spriteBatch.worldTransform.toArray(true) // console.log(this.tempMatrix) this.start(); @@ -179,8 +181,8 @@ verticies[index++] = sprite.rotation; // uv - verticies[index++] = uvs[0]; - verticies[index++] = uvs[1]; + verticies[index++] = uvs.x0; + verticies[index++] = uvs.y1; // color verticies[index++] = sprite.alpha; @@ -200,8 +202,8 @@ verticies[index++] = sprite.rotation; // uv - verticies[index++] = uvs[2]; - verticies[index++] = uvs[3]; + verticies[index++] = uvs.x1; + verticies[index++] = uvs.y1; // color verticies[index++] = sprite.alpha; @@ -221,8 +223,8 @@ verticies[index++] = sprite.rotation; // uv - verticies[index++] = uvs[4]; - verticies[index++] = uvs[5]; + verticies[index++] = uvs.x2; + verticies[index++] = uvs.y2; // color verticies[index++] = sprite.alpha; @@ -244,8 +246,8 @@ verticies[index++] = sprite.rotation; // uv - verticies[index++] = uvs[6]; - verticies[index++] = uvs[7]; + verticies[index++] = uvs.x3; + verticies[index++] = uvs.y3; // color verticies[index++] = sprite.alpha; @@ -260,6 +262,7 @@ PIXI.WebGLFastSpriteBatch.prototype.flush = function() { + // If the batch is length 0 then return as there is nothing to draw if (this.currentBatchSize===0)return; @@ -318,7 +321,7 @@ gl.uniform2f(this.shader.projectionVector, projection.x, projection.y); // set the matrix - gl.uniformMatrix3fv(this.shader.uMatrix, false, this.tempMatrix); + gl.uniformMatrix3fv(this.shader.uMatrix, false, this.matrix); // set the pointers var stride = this.vertSize * 4; diff --git a/src/pixi/renderers/webgl/utils/WebGLGraphics.js b/src/pixi/renderers/webgl/utils/WebGLGraphics.js index 44f1323..9151c16 100644 --- a/src/pixi/renderers/webgl/utils/WebGLGraphics.js +++ b/src/pixi/renderers/webgl/utils/WebGLGraphics.js @@ -58,12 +58,10 @@ // This could be speeded up for sure! // var m = PIXI.mat3.clone(graphics.worldTransform); - PIXI.mat3.transpose(graphics.worldTransform, PIXI.tempMatrix); - // set the matrix transform gl.blendFunc(gl.ONE, gl.ONE_MINUS_SRC_ALPHA); - gl.uniformMatrix3fv(shader.translationMatrix, false, PIXI.tempMatrix); + gl.uniformMatrix3fv(shader.translationMatrix, false, graphics.worldTransform.toArray(true)); gl.uniform2f(shader.projectionVector, projection.x, -projection.y); gl.uniform2f(shader.offsetVector, -offset.x, -offset.y); diff --git a/src/pixi/renderers/webgl/utils/WebGLSpriteBatch.js b/src/pixi/renderers/webgl/utils/WebGLSpriteBatch.js index bf151bf..1616ef3 100644 --- a/src/pixi/renderers/webgl/utils/WebGLSpriteBatch.js +++ b/src/pixi/renderers/webgl/utils/WebGLSpriteBatch.js @@ -194,21 +194,21 @@ var index = this.currentBatchSize * 4 * this.vertSize; - var worldTransform = sprite.worldTransform; + var worldTransform = sprite.worldTransform;//.toArray(); - var a = worldTransform[0]; - var b = worldTransform[3]; - var c = worldTransform[1]; - var d = worldTransform[4]; - var tx = worldTransform[2]; - var ty = worldTransform[5]; + var a = worldTransform.a//[0]; + var b = worldTransform.c//[3]; + var c = worldTransform.b//[1]; + var d = worldTransform.d//[4]; + var tx = worldTransform.tx//[2]; + var ty = worldTransform.ty///[5]; // xy verticies[index++] = a * w1 + c * h1 + tx; verticies[index++] = d * h1 + b * w1 + ty; // uv - verticies[index++] = uvs[0]; - verticies[index++] = uvs[1]; + verticies[index++] = uvs.x0; + verticies[index++] = uvs.y0; // color verticies[index++] = alpha; verticies[index++] = tint; @@ -217,8 +217,8 @@ verticies[index++] = a * w0 + c * h1 + tx; verticies[index++] = d * h1 + b * w0 + ty; // uv - verticies[index++] = uvs[2]; - verticies[index++] = uvs[3]; + verticies[index++] = uvs.x1; + verticies[index++] = uvs.y1; // color verticies[index++] = alpha; verticies[index++] = tint; @@ -227,8 +227,8 @@ verticies[index++] = a * w0 + c * h0 + tx; verticies[index++] = d * h0 + b * w0 + ty; // uv - verticies[index++] = uvs[4]; - verticies[index++] = uvs[5]; + verticies[index++] = uvs.x2; + verticies[index++] = uvs.y2; // color verticies[index++] = alpha; verticies[index++] = tint; @@ -237,12 +237,12 @@ verticies[index++] = a * w1 + c * h0 + tx; verticies[index++] = d * h0 + b * w1 + ty; // uv - verticies[index++] = uvs[6]; - verticies[index++] = uvs[7]; + verticies[index++] = uvs.x3; + verticies[index++] = uvs.y3; // color verticies[index++] = alpha; verticies[index++] = tint; - + // increment the batchsize this.currentBatchSize++; diff --git a/bin/pixi.dev.js b/bin/pixi.dev.js index 8558d80..45e6eba 100644 --- a/bin/pixi.dev.js +++ b/bin/pixi.dev.js @@ -1,10 +1,10 @@ /** * @license * pixi.js - v1.4.3 - * Copyright (c) 2012, Mat Groves + * Copyright (c) 2012-2014, Mat Groves * http://goodboydigital.com/ * - * Compiled: 2014-01-28 + * Compiled: 2014-01-30 * * pixi.js is licensed under the MIT License. * http://www.opensource.org/licenses/mit-license.php @@ -461,7 +461,7 @@ return (typeof Float32Array !== 'undefined') ? Float32Array : Array; }; -PIXI.Matrix = PIXI.determineMatrixArrayType(); +PIXI.Matrix2 = PIXI.determineMatrixArrayType(); /** @@ -482,7 +482,7 @@ */ PIXI.mat3.create = function() { - var matrix = new PIXI.Matrix(9); + var matrix = new PIXI.Matrix2(9); matrix[0] = 1; matrix[1] = 0; @@ -567,7 +567,7 @@ */ PIXI.mat3.clone = function(mat) { - var matrix = new PIXI.Matrix(9); + var matrix = new PIXI.Matrix2(9); matrix[0] = mat[0]; matrix[1] = mat[1]; @@ -666,7 +666,7 @@ */ PIXI.mat4.create = function() { - var matrix = new PIXI.Matrix(16); + var matrix = new PIXI.Matrix2(16); matrix[0] = 1; matrix[1] = 0; @@ -799,6 +799,64 @@ PIXI.identityMatrix = PIXI.mat3.create(); PIXI.tempMatrix = PIXI.mat3.create(); + +PIXI.Matrix = function() +{ + this.a = 1; + this.b = 0; + this.c = 0; + this.d = 1; + this.tx = 0; + this.ty = 0; + + +} + +PIXI.Matrix.prototype.fromArray = function(array) +{ + + this.a = array[0]; + this.b = array[1]; + this.c = array[3]; + this.d = array[4]; + this.tx = array[2]; + this.ty = array[5]; + +} + +PIXI.Matrix.prototype.toArray = function(transpose) +{ + if(!this.array)this.array = new Float32Array(9); + var array = this.array; + + if(transpose) + { + this.array[0] = this.a; + this.array[1] = this.c; + this.array[2] = 0; + this.array[3] = this.b; + this.array[4] = this.d; + this.array[5] = 0; + this.array[6] = this.tx; + this.array[7] = this.ty; + this.array[8] = 1; + } + else + { + this.array[0] = this.a; + this.array[1] = this.b; + this.array[2] = this.tx; + this.array[3] = this.c; + this.array[4] = this.d; + this.array[5] = this.ty; + this.array[6] = 0; + this.array[7] = 0; + this.array[8] = 1; + } + + return array;//[this.a, this.b, this.tx, this.c, this.d, this.ty, 0, 0, 1]; +} + /** * @author Mat Groves http://matgroves.com/ @Doormat23 */ @@ -940,7 +998,7 @@ * @readOnly * @private */ - this.worldTransform = PIXI.mat3.create(); //mat3.identity(); + this.worldTransform = new PIXI.Matrix()//PIXI.mat3.create(); //mat3.identity(); /** * [read-only] Current transform of the object locally @@ -950,7 +1008,7 @@ * @readOnly * @private */ - this.localTransform = PIXI.mat3.create(); //mat3.identity(); + this.localTransform = new PIXI.Matrix()//PIXI.mat3.create(); //mat3.identity(); /** * [NYI] Unknown @@ -1208,40 +1266,30 @@ this._cr = Math.cos(this.rotation); } - var localTransform = this.localTransform; - var parentTransform = this.parent.worldTransform; - var worldTransform = this.worldTransform; + // var localTransform = this.localTransform//.toArray(); + var parentTransform = this.parent.worldTransform//.toArray(); + var worldTransform = this.worldTransform//.toArray(); //console.log(localTransform) - localTransform[0] = this._cr * this.scale.x; - localTransform[1] = -this._sr * this.scale.y; - localTransform[3] = this._sr * this.scale.x; - localTransform[4] = this._cr * this.scale.y; - - // TODO --> do we even need a local matrix??? - var px = this.pivot.x; var py = this.pivot.y; - // Cache the matrix values (makes for huge speed increases!) - var a00 = localTransform[0], a01 = localTransform[1], a02 = this.position.x - localTransform[0] * px - py * localTransform[1], - a10 = localTransform[3], a11 = localTransform[4], a12 = this.position.y - localTransform[4] * py - px * localTransform[3], + var a00 = this._cr * this.scale.x, + a01 = -this._sr * this.scale.y, + a10 = this._sr * this.scale.x, + a11 = this._cr * this.scale.y, + a02 = this.position.x + a00 * px - py * a01, + a12 = this.position.y + a11 * py - px * a10, + b00 = parentTransform.a, b01 = parentTransform.b, b02 = parentTransform.tx, + b10 = parentTransform.c, b11 = parentTransform.d, b12 = parentTransform.ty; - b00 = parentTransform[0], b01 = parentTransform[1], b02 = parentTransform[2], - b10 = parentTransform[3], b11 = parentTransform[4], b12 = parentTransform[5]; + worldTransform.a = b00 * a00 + b01 * a10; + worldTransform.b = b00 * a01 + b01 * a11; + worldTransform.tx = b00 * a02 + b01 * a12 + b02; - localTransform[2] = a02; - localTransform[5] = a12; + worldTransform.c = b10 * a00 + b11 * a10; + worldTransform.d = b10 * a01 + b11 * a11; + worldTransform.ty = b10 * a02 + b11 * a12 + b12; - worldTransform[0] = b00 * a00 + b01 * a10; - worldTransform[1] = b00 * a01 + b01 * a11; - worldTransform[2] = b00 * a02 + b01 * a12 + b02; - - worldTransform[3] = b10 * a00 + b11 * a10; - worldTransform[4] = b10 * a01 + b11 * a11; - worldTransform[5] = b10 * a02 + b11 * a12 + b12; - - // because we are using affine transformation, we can optimise the matrix concatenation process.. wooo! - // mat3.multiply(this.localTransform, this.parent.worldTransform, this.worldTransform); this.worldAlpha = this.alpha * this.parent.worldAlpha; }; @@ -1316,6 +1364,36 @@ // this line is just here to pass jshinting :) renderSession = renderSession; }; + +/** + * The position of the displayObject on the x axis relative to the local coordinates of the parent. + * + * @property x + * @type Number + */ +Object.defineProperty(PIXI.DisplayObject.prototype, 'x', { + get: function() { + return this.position.x; + }, + set: function(value) { + this.position.x = value; + } +}); + +/** + * The position of the displayObject on the y axis relative to the local coordinates of the parent. + * + * @property y + * @type Number + */ +Object.defineProperty(PIXI.DisplayObject.prototype, 'y', { + get: function() { + return this.position.y; + }, + set: function(value) { + this.position.y = value; + } +}); /** * @author Mat Groves http://matgroves.com/ @Doormat23 */ @@ -1534,12 +1612,16 @@ var childMaxX; var childMaxY; + var childVisible = false; + for(var i=0,j=this.children.length; i childMaxY ? maxY : childMaxY; } + if(!childVisible) + return PIXI.EmptyRectangle; + var bounds = this._bounds; bounds.x = minX; @@ -1868,12 +1953,12 @@ var worldTransform = this.worldTransform; - var a = worldTransform[0]; - var b = worldTransform[3]; - var c = worldTransform[1]; - var d = worldTransform[4]; - var tx = worldTransform[2]; - var ty = worldTransform[5]; + var a = worldTransform.a; + var b = worldTransform.c; + var c = worldTransform.b; + var d = worldTransform.d; + var tx = worldTransform.tx; + var ty = worldTransform.ty; var x1 = a * w1 + c * h1 + tx; var y1 = d * h1 + b * w1 + ty; @@ -2029,7 +2114,7 @@ // allow for trimming - context.setTransform(transform[0], transform[3], transform[1], transform[4], transform[2], transform[5]); + context.setTransform(transform.a, transform.c, transform.b, transform.d, transform.tx, transform.ty); //if smoothingEnabled is supported and we need to change the smoothing property for this texture if(renderSession.smoothProperty && renderSession.scaleMode !== this.texture.baseTexture.scaleMode) { @@ -2169,6 +2254,13 @@ PIXI.SpriteBatch.prototype = Object.create( PIXI.DisplayObjectContainer.prototype ); PIXI.SpriteBatch.constructor = PIXI.SpriteBatch; + +/* + * Initialises the spriteBatch + * + * @method initWebGL + * @param gl {WebGLContext} the current WebGL drawing context + */ PIXI.SpriteBatch.prototype.initWebGL = function(gl) { @@ -2234,7 +2326,7 @@ // alow for trimming - context.setTransform(transform[0], transform[3], transform[1], transform[4], transform[2], transform[5]); + context.setTransform(transform.a, transform.c, transform.b, transform.d, transform.tx, transform.ty); context.save(); for (var i = 0; i < this.children.length; i++) { @@ -2264,7 +2356,7 @@ PIXI.DisplayObject.prototype.updateTransform.call(child); transform = child.localTransform; - context.setTransform(transform[0], transform[3], transform[1], transform[4], transform[2], transform[5]); + context.setTransform(transform.a, transform.c, transform.b, transform.d, transform.tx, transform.ty); context.drawImage(texture.baseTexture.source, frame.x, @@ -2484,8 +2576,21 @@ */ PIXI.Text = function(text, style) { + /** + * The canvas element that everything is drawn to + * + * @property canvas + * @type HTMLCanvasElement + */ 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'); + PIXI.Sprite.call(this, PIXI.Texture.fromCanvas(this.canvas)); this.setText(text); @@ -2631,6 +2736,13 @@ this.requiresUpdate = true; }; +/** +* Renders the object using the WebGL renderer +* +* @method _renderWebGL +* @param renderSession {RenderSession} +* @private +*/ PIXI.Text.prototype._renderWebGL = function(renderSession) { if(this.requiresUpdate) @@ -2662,6 +2774,7 @@ /* * http://stackoverflow.com/users/34441/ellisbben * great solution to the problem! + * returns the height of the given font * * @method determineFontHeight * @param fontStyle {Object} @@ -2798,11 +2911,11 @@ /** * 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 - * @param style {Object} The style parameters - * @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 + * @param style {Object} The style parameters, contained as properties of an object */ PIXI.BitmapText.prototype.setStyle = function(style) { @@ -3435,8 +3548,8 @@ var isSprite = (item instanceof PIXI.Sprite), worldTransform = item.worldTransform, - a00 = worldTransform[0], a01 = worldTransform[1], a02 = worldTransform[2], - a10 = worldTransform[3], a11 = worldTransform[4], a12 = worldTransform[5], + a00 = worldTransform.a, a01 = worldTransform.b, a02 = worldTransform.tx, + a10 = worldTransform.c, a11 = worldTransform.d, a12 = worldTransform.ty, id = 1 / (a00 * a11 + a01 * -a10), x = a11 * id * global.x + -a01 * id * global.y + (a12 * a01 - a02 * a11) * id, y = a00 * id * global.y + -a10 * id * global.x + (-a12 * a00 + a02 * a10) * id; @@ -3674,7 +3787,7 @@ * @param backgroundColor {Number} the background color of the stage, you have to pass this in is in hex format * 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); * 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 @@ -3693,7 +3806,7 @@ * @readOnly * @private */ - this.worldTransform = PIXI.mat3.create(); + this.worldTransform = new PIXI.Matrix()//PIXI.mat3.create(); /** * Whether or not the stage is interactive @@ -3901,7 +4014,7 @@ * @class AjaxRequest * @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 @@ -4008,7 +4121,7 @@ * Adds event emitter functionality to a class * * @class EventTarget - * @example + * * function MyEmitter() { * PIXI.EventTarget.call(this); //mixes in event target stuff * } @@ -4018,8 +4131,21 @@ */ PIXI.EventTarget = function () { + /** + * Holds all the listeners + * + * @property listeneners + * @type Object + */ 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 ) { @@ -4036,6 +4162,12 @@ }; + /** + * Fires the event, ie pretends that the event has happened + * + * @method dispatchEvent + * @param event {Event} the event object + */ this.dispatchEvent = this.emit = function ( event ) { if ( !listeners[ event.type ] || !listeners[ event.type ].length ) { @@ -4052,6 +4184,13 @@ }; + /** + * 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 ) { var index = listeners[ type ].indexOf( listener ); @@ -4064,6 +4203,12 @@ }; + /** + * 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 ) { var a = listeners[type]; if (a) @@ -4079,7 +4224,8 @@ * 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 * the browser then this function will return a canvas renderer - * + * @class autoDetectRenderer + * @static * @param width=800 {Number} the width 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 @@ -4149,17 +4295,23 @@ 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 = {}; /** * Triangulates shapes for webGL graphic fills * * @method Triangulate - * @namespace PolyK - * @constructor + * */ PIXI.PolyK.Triangulate = function(p) { @@ -4235,10 +4387,17 @@ }; /** - * Checks if a point is within a triangle + * Checks whether a point is within a triangle * - * @class _PointInTriangle - * @namespace PolyK + * @method _PointInTriangle + * @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 */ PIXI.PolyK._PointInTriangle = function(px, py, ax, ay, bx, by, cx, cy) @@ -4265,10 +4424,10 @@ }; /** - * Checks if a shape is convex + * Checks whether a shape is convex * - * @class _convex - * @namespace PolyK + * @method _convex + * * @private */ PIXI.PolyK._convex = function(ax, ay, bx, by, cx, cy, sign) @@ -4343,6 +4502,10 @@ */ PIXI.PixiShader = function(gl) { + /** + * @property gl + * @type WebGLContext + */ this.gl = gl; /** @@ -4375,7 +4538,9 @@ }; /** -* @method PIXI.PixiShader#init +* Initialises the shader +* @method init +* */ PIXI.PixiShader.prototype.init = function() { @@ -4430,7 +4595,7 @@ * 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 * -* @method PIXI.PixiShader#initUniforms +* @method initUniforms */ PIXI.PixiShader.prototype.initUniforms = function() { @@ -4501,7 +4666,7 @@ /** * 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) { @@ -4542,7 +4707,7 @@ wrapT = gl.REPEAT; } - gl.pixelStorei(gl.UNPACK_FLIP_Y_WEBGL, false); + gl.pixelStorei(gl.UNPACK_FLIP_Y_WEBGL, !!data.flipY); if (data.width) { @@ -4576,7 +4741,7 @@ /** * Updates the shader uniform values. * -* @method PIXI.PixiShader#syncUniforms +* @method syncUniforms */ PIXI.PixiShader.prototype.syncUniforms = function() { @@ -4631,6 +4796,11 @@ }; +/** +* Destroys the shader +* @method destroy +* +*/ PIXI.PixiShader.prototype.destroy = function() { this.gl.deleteProgram( this.program ); @@ -4640,6 +4810,11 @@ this.attributes = null; }; +/** +* +* @property defaultVertexSrc +* @type String +*/ PIXI.PixiShader.defaultVertexSrc = [ 'attribute vec2 aVertexPosition;', 'attribute vec2 aTextureCoord;', @@ -4673,19 +4848,25 @@ /** * @class PIXI.PixiFastShader * @constructor +* @param gl {WebGLContext} the current WebGL drawing context */ PIXI.PixiFastShader = function(gl) { + + /** + * @property gl + * @type WebGLContext + */ this.gl = gl; /** - * @property {any} program - The WebGL program. - */ + * @property {any} program - The WebGL program. + */ this.program = null; /** - * @property {array} fragmentSrc - The fragment shader. - */ + * @property {array} fragmentSrc - The fragment shader. + */ this.fragmentSrc = [ 'precision lowp float;', 'varying vec2 vTextureCoord;', @@ -4696,6 +4877,9 @@ '}' ]; + /** + * @property {array} vertexSrc - The vertex shader + */ this.vertexSrc = [ 'attribute vec2 aVertexPosition;', 'attribute vec2 aPositionCoord;', @@ -4737,7 +4921,9 @@ }; /** -* @method PIXI.PixiFastShader#init +* Initialises the shader +* @method init +* */ PIXI.PixiFastShader.prototype.init = function() { @@ -4787,6 +4973,11 @@ this.program = program; }; +/** +* Destroys the shader +* @method destroy +* +*/ PIXI.PixiFastShader.prototype.destroy = function() { this.gl.deleteProgram( this.program ); @@ -4803,9 +4994,14 @@ PIXI.StripShader = function() { - // the webGL program.. + /** + * @property {any} program - The WebGL program. + */ this.program = null; + /** + * @property {array} fragmentSrc - The fragment shader. + */ this.fragmentSrc = [ 'precision mediump float;', 'varying vec2 vTextureCoord;', @@ -4819,6 +5015,9 @@ '}' ]; + /** + * @property {array} fragmentSrc - The fragment shader. + */ this.vertexSrc = [ 'attribute vec2 aVertexPosition;', 'attribute vec2 aTextureCoord;', @@ -4839,6 +5038,11 @@ ]; }; +/** +* Initialises the shader +* @method init +* +*/ PIXI.StripShader.prototype.init = function() { @@ -4868,14 +5072,28 @@ * @author Mat Groves http://matgroves.com/ @Doormat23 */ - +/** +* @class PrimitiveShader +* @constructor +* @param gl {WebGLContext} the current WebGL drawing context +*/ PIXI.PrimitiveShader = function(gl) { + /** + * @property gl + * @type WebGLContext + */ this.gl = gl; - // the webGL program.. + /** + * @property {any} program - The WebGL program. + */ this.program = null; + /** + * @property fragmentSrc + * @type Array + */ this.fragmentSrc = [ 'precision mediump float;', 'varying vec4 vColor;', @@ -4885,6 +5103,10 @@ '}' ]; + /** + * @property vertexSrc + * @type Array + */ this.vertexSrc = [ 'attribute vec2 aVertexPosition;', 'attribute vec4 aColor;', @@ -4906,6 +5128,11 @@ this.init(); }; +/** +* Initialises the shader +* @method init +* +*/ PIXI.PrimitiveShader.prototype.init = function() { @@ -4932,6 +5159,11 @@ this.program = program; }; +/** +* Destroys the shader +* @method destroy +* +*/ PIXI.PrimitiveShader.prototype.destroy = function() { this.gl.deleteProgram( this.program ); @@ -4948,7 +5180,9 @@ /** * A set of functions used by the webGL renderer to draw the primitive graphics data * - * @class CanvasGraphics + * @class WebGLGraphics + * @private + * @static */ PIXI.WebGLGraphics = function() { @@ -4962,7 +5196,7 @@ * @private * @method renderGraphics * @param graphics {Graphics} - * @param projection {Object} + * @param renderSession {Object} */ PIXI.WebGLGraphics.renderGraphics = function(graphics, renderSession)//projection, offset) { @@ -4999,12 +5233,10 @@ // This could be speeded up for sure! // var m = PIXI.mat3.clone(graphics.worldTransform); - PIXI.mat3.transpose(graphics.worldTransform, PIXI.tempMatrix); - // set the matrix transform gl.blendFunc(gl.ONE, gl.ONE_MINUS_SRC_ALPHA); - gl.uniformMatrix3fv(shader.translationMatrix, false, PIXI.tempMatrix); + gl.uniformMatrix3fv(shader.translationMatrix, false, graphics.worldTransform.toArray(true)); gl.uniform2f(shader.projectionVector, projection.x, -projection.y); gl.uniform2f(shader.offsetVector, -offset.x, -offset.y); @@ -5034,7 +5266,8 @@ * @static * @private * @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) { @@ -5088,7 +5321,7 @@ * @static * @private * @method buildRectangle - * @param graphics {Graphics} + * @param graphicsData {Graphics} The graphics object to draw TODO-Alvin * @param webGLData {Object} */ PIXI.WebGLGraphics.buildRectangle = function(graphicsData, webGLData) @@ -5157,7 +5390,7 @@ * @static * @private * @method buildCircle - * @param graphics {Graphics} + * @param graphicsData {Graphics} The graphics object to draw * @param webGLData {Object} */ PIXI.WebGLGraphics.buildCircle = function(graphicsData, webGLData) @@ -5230,7 +5463,7 @@ * @static * @private * @method buildLine - * @param graphics {Graphics} + * @param graphicsData {Graphics} The graphics object to draw TODO-Alvin * @param webGLData {Object} */ PIXI.WebGLGraphics.buildLine = function(graphicsData, webGLData) @@ -5440,7 +5673,7 @@ * @static * @private * @method buildPoly - * @param graphics {Graphics} + * @param graphicsData {Graphics} The graphics object to draw TODO-Alvin * @param webGLData {Object} */ PIXI.WebGLGraphics.buildPoly = function(graphicsData, webGLData) @@ -6050,6 +6283,13 @@ * @author Mat Groves http://matgroves.com/ @Doormat23 */ + +/** +* @class WebGLMaskManager +* @constructor +* @param gl {WebGLContext} the current WebGL drawing context +* @private +*/ PIXI.WebGLMaskManager = function(gl) { this.maskStack = []; @@ -6058,11 +6298,22 @@ 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) { 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) { var gl = this.gl; @@ -6087,6 +6338,12 @@ 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) { var gl = this.gl; @@ -6110,6 +6367,10 @@ if(this.maskStack.length === 0)gl.disable(gl.STENCIL_TEST); }; +/** +* TODO-Alvin +* @method destroy +*/ PIXI.WebGLMaskManager.prototype.destroy = function() { this.maskStack = null; @@ -6119,6 +6380,12 @@ * @author Mat Groves http://matgroves.com/ @Doormat23 */ +/** +* @class WebGLShaderManager +* @constructor +* @param gl {WebGLContext} the current WebGL drawing context +* @private +*/ PIXI.WebGLShaderManager = function(gl) { @@ -6135,6 +6402,13 @@ //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) { this.gl = gl; @@ -6153,6 +6427,11 @@ }; +/** +* Initialises the context and the properties +* @method setAttribs +* @param attribs {Array} TODO-Alvin +*/ PIXI.WebGLShaderManager.prototype.setAttribs = function(attribs) { // reset temp state @@ -6194,6 +6473,11 @@ // 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) { //if(this.currentShader == shader)return; @@ -6207,6 +6491,10 @@ }; +/** +* Triggers the primitive shader +* @method activatePrimitiveShader +*/ PIXI.WebGLShaderManager.prototype.activatePrimitiveShader = function() { var gl = this.gl; @@ -6217,6 +6505,10 @@ }; +/** +* Disable the primitive shader +* @method deactivatePrimitiveShader +*/ PIXI.WebGLShaderManager.prototype.deactivatePrimitiveShader = function() { var gl = this.gl; @@ -6226,6 +6518,10 @@ this.setAttribs(this.defaultShader.attributes); }; +/** +* Destroys +* @method destroy +*/ PIXI.WebGLShaderManager.prototype.destroy = function() { this.attribState = null; @@ -6252,11 +6548,30 @@ * 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) { - + /** + * TODO-Alvin + * + * @property vertSize + * @type Number + */ this.vertSize = 6; + + /** + * TODO-Alvin + * @property size + * @type Number + */ this.size = 10000;//Math.pow(2, 16) / this.vertSize; // console.log(this.size); @@ -6265,9 +6580,23 @@ //the total number of indices in our batch var numIndices = this.size * 6; - //vertex data + //vertex data + + /** + * Holds the vertices + * + * @property vertices + * @type Float32Array + */ this.vertices = new Float32Array(numVerts); + //index data + /** + * Holds the indices + * + * @property indices + * @type Uint16Array + */ this.indices = new Uint16Array(numIndices); this.lastIndexCount = 0; @@ -6290,6 +6619,12 @@ this.setContext(gl); }; +/** +* +* @method setContext +* +* @param gl {WebGLContext} the current WebGL drawing context +*/ PIXI.WebGLSpriteBatch.prototype.setContext = function(gl) { this.gl = gl; @@ -6311,6 +6646,12 @@ this.currentBlendMode = 99999; }; +/** +* +* @method begin +* +* @param renderSession {RenderSession} the RenderSession +*/ PIXI.WebGLSpriteBatch.prototype.begin = function(renderSession) { this.renderSession = renderSession; @@ -6319,12 +6660,22 @@ this.start(); }; +/** +* +* @method end +* +*/ PIXI.WebGLSpriteBatch.prototype.end = function() { this.flush(); }; - +/** +* +* @method render +* +* @param sprite {Sprite} the sprite to render TODO-Alvin +*/ PIXI.WebGLSpriteBatch.prototype.render = function(sprite) { // check texture.. @@ -6383,21 +6734,21 @@ var index = this.currentBatchSize * 4 * this.vertSize; - var worldTransform = sprite.worldTransform; + var worldTransform = sprite.worldTransform;//.toArray(); - var a = worldTransform[0]; - var b = worldTransform[3]; - var c = worldTransform[1]; - var d = worldTransform[4]; - var tx = worldTransform[2]; - var ty = worldTransform[5]; + var a = worldTransform.a//[0]; + var b = worldTransform.c//[3]; + var c = worldTransform.b//[1]; + var d = worldTransform.d//[4]; + var tx = worldTransform.tx//[2]; + var ty = worldTransform.ty///[5]; // xy verticies[index++] = a * w1 + c * h1 + tx; verticies[index++] = d * h1 + b * w1 + ty; // uv - verticies[index++] = uvs[0]; - verticies[index++] = uvs[1]; + verticies[index++] = uvs.x0; + verticies[index++] = uvs.y0; // color verticies[index++] = alpha; verticies[index++] = tint; @@ -6406,8 +6757,8 @@ verticies[index++] = a * w0 + c * h1 + tx; verticies[index++] = d * h1 + b * w0 + ty; // uv - verticies[index++] = uvs[2]; - verticies[index++] = uvs[3]; + verticies[index++] = uvs.x1; + verticies[index++] = uvs.y1; // color verticies[index++] = alpha; verticies[index++] = tint; @@ -6416,8 +6767,8 @@ verticies[index++] = a * w0 + c * h0 + tx; verticies[index++] = d * h0 + b * w0 + ty; // uv - verticies[index++] = uvs[4]; - verticies[index++] = uvs[5]; + verticies[index++] = uvs.x2; + verticies[index++] = uvs.y2; // color verticies[index++] = alpha; verticies[index++] = tint; @@ -6426,18 +6777,24 @@ verticies[index++] = a * w1 + c * h0 + tx; verticies[index++] = d * h0 + b * w1 + ty; // uv - verticies[index++] = uvs[6]; - verticies[index++] = uvs[7]; + verticies[index++] = uvs.x3; + verticies[index++] = uvs.y3; // color verticies[index++] = alpha; verticies[index++] = tint; - + // increment the batchsize this.currentBatchSize++; }; +/** +* +* @method renderTilingSprite +* +* @param sprite {TilingSprite} the sprite to render TODO-Alvin +*/ PIXI.WebGLSpriteBatch.prototype.renderTilingSprite = function(tilingSprite) { var texture = tilingSprite.tilingTexture; @@ -6553,6 +6910,13 @@ this.currentBatchSize++; }; + +/** +* +* +* @method flush TODO-Alvin +* +*/ PIXI.WebGLSpriteBatch.prototype.flush = function() { // If the batch is length 0 then return as there is nothing to draw @@ -6589,12 +6953,21 @@ this.renderSession.drawCount++; }; - +/** +* +* @method stop +* +*/ PIXI.WebGLSpriteBatch.prototype.stop = function() { this.flush(); }; +/** +* +* @method start +* +*/ PIXI.WebGLSpriteBatch.prototype.start = function() { var gl = this.gl; @@ -6623,6 +6996,13 @@ } }; +/** +* +* @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) { this.flush(); @@ -6633,6 +7013,10 @@ this.gl.blendFunc(blendModeWebGL[0], blendModeWebGL[1]); }; +/** +* Destroys the SpriteBatch +* @method destroy +*/ PIXI.WebGLSpriteBatch.prototype.destroy = function() { @@ -6702,7 +7086,7 @@ this.shader = null; - this.tempMatrix = PIXI.mat3.create(); + this.matrix this.setContext(gl); }; @@ -6732,8 +7116,10 @@ { this.renderSession = renderSession; this.shader = this.renderSession.shaderManager.fastShader; - - PIXI.mat3.transpose(spriteBatch.worldTransform, this.tempMatrix); + + // PIXI.mat3.transpose(spriteBatch.worldTransform.toArray(), this.tempMatrix); + + this.matrix = spriteBatch.worldTransform.toArray(true) // console.log(this.tempMatrix) this.start(); @@ -6829,8 +7215,8 @@ verticies[index++] = sprite.rotation; // uv - verticies[index++] = uvs[0]; - verticies[index++] = uvs[1]; + verticies[index++] = uvs.x0; + verticies[index++] = uvs.y1; // color verticies[index++] = sprite.alpha; @@ -6850,8 +7236,8 @@ verticies[index++] = sprite.rotation; // uv - verticies[index++] = uvs[2]; - verticies[index++] = uvs[3]; + verticies[index++] = uvs.x1; + verticies[index++] = uvs.y1; // color verticies[index++] = sprite.alpha; @@ -6871,8 +7257,8 @@ verticies[index++] = sprite.rotation; // uv - verticies[index++] = uvs[4]; - verticies[index++] = uvs[5]; + verticies[index++] = uvs.x2; + verticies[index++] = uvs.y2; // color verticies[index++] = sprite.alpha; @@ -6894,8 +7280,8 @@ verticies[index++] = sprite.rotation; // uv - verticies[index++] = uvs[6]; - verticies[index++] = uvs[7]; + verticies[index++] = uvs.x3; + verticies[index++] = uvs.y3; // color verticies[index++] = sprite.alpha; @@ -6910,6 +7296,7 @@ PIXI.WebGLFastSpriteBatch.prototype.flush = function() { + // If the batch is length 0 then return as there is nothing to draw if (this.currentBatchSize===0)return; @@ -6968,7 +7355,7 @@ gl.uniform2f(this.shader.projectionVector, projection.x, projection.y); // set the matrix - gl.uniformMatrix3fv(this.shader.uMatrix, false, this.tempMatrix); + gl.uniformMatrix3fv(this.shader.uMatrix, false, this.matrix); // set the pointers var stride = this.vertSize * 4; @@ -7003,7 +7390,13 @@ * @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) { this.transparent = transparent; @@ -7017,7 +7410,11 @@ }; // API - +/** +* Initialises the context and the properties +* @method setContext +* @param gl {WebGLContext} the current WebGL drawing context +*/ PIXI.WebGLFilterManager.prototype.setContext = function(gl) { this.gl = gl; @@ -7026,6 +7423,12 @@ this.initShaderBuffers(); }; +/** +* +* @method begin +* @param renderSession {RenderSession} +* @param buffer {ArrayBuffer} +*/ PIXI.WebGLFilterManager.prototype.begin = function(renderSession, buffer) { this.renderSession = renderSession; @@ -7038,6 +7441,11 @@ 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) { var gl = this.gl; @@ -7119,6 +7527,10 @@ }; +/** +* Removes the last filter from the filter stack and doesn't return it +* @method popFilter +*/ PIXI.WebGLFilterManager.prototype.popFilter = function() { var gl = this.gl; @@ -7292,6 +7704,15 @@ 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) { // use program @@ -7344,6 +7765,10 @@ this.renderSession.drawCount++; }; +/** +* Initialises the shader buffers +* @method initShaderBuffers +*/ PIXI.WebGLFilterManager.prototype.initShaderBuffers = function() { var gl = this.gl; @@ -7400,6 +7825,10 @@ gl.STATIC_DRAW); }; +/** +* TODO-Alvin +* @method destroy +*/ PIXI.WebGLFilterManager.prototype.destroy = function() { var gl = this.gl; @@ -7422,9 +7851,24 @@ gl.deleteBuffer(this.colorBuffer); gl.deleteBuffer(this.indexBuffer); }; +/** + * @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 @@ -7444,6 +7888,11 @@ this.resize(width, height); }; + +/** +* Clears the filter texture +* @method clear +*/ PIXI.FilterTexture.prototype.clear = function() { var gl = this.gl; @@ -7452,6 +7901,13 @@ 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; @@ -7466,6 +7922,10 @@ }; +/** +* Destroys the filter texture +* @method destroy +*/ PIXI.FilterTexture.prototype.destroy = function() { var gl = this.gl; @@ -7476,7 +7936,6 @@ this.texture = null; }; - /** * @author Mat Groves * @@ -7509,7 +7968,7 @@ var cacheAlpha = maskData.alpha; var transform = maskData.worldTransform; - context.setTransform(transform[0], transform[3], transform[1], transform[4], transform[2], transform[5]); + context.setTransform(transform.a, transform.c, transform.b, transform.d, transform.tx, transform.ty); PIXI.CanvasGraphics.renderGraphicsMask(maskData, context); @@ -7876,7 +8335,7 @@ 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 * @type HTMLCanvasElement 2d Context */ @@ -7949,6 +8408,7 @@ { if(!this.transparent) { + this.context.globalAlpha = 1; this.context.fillStyle = stage.backgroundColorString; this.context.fillRect(0, 0, this.width, this.height); } @@ -8814,7 +9274,7 @@ context.globalCompositeOperation = PIXI.blendModesCanvas[renderSession.currentBlendMode]; } - context.setTransform(transform[0], transform[3], transform[1], transform[4], transform[2], transform[5]); + context.setTransform(transform.a, transform.c, transform.b, transform.d, transform.tx, transform.ty); PIXI.CanvasGraphics.renderGraphics(this, context); // simple render children! @@ -8842,12 +9302,12 @@ var worldTransform = this.worldTransform; - var a = worldTransform[0]; - var b = worldTransform[3]; - var c = worldTransform[1]; - var d = worldTransform[4]; - var tx = worldTransform[2]; - var ty = worldTransform[5]; + var a = worldTransform.a; + var b = worldTransform.c; + var c = worldTransform.b; + var d = worldTransform.d; + var tx = worldTransform.tx; + var ty = worldTransform.ty; var x1 = a * w1 + c * h1 + tx; var y1 = d * h1 + b * w1 + ty; @@ -9525,7 +9985,7 @@ // allow for trimming - context.setTransform(transform[0], transform[3], transform[1], transform[4], transform[2], transform[5]); + context.setTransform(transform.a, transform.c, transform.b, transform.d, transform.tx, transform.ty); if(!this.__tilePattern) @@ -9583,13 +10043,13 @@ var worldTransform = this.worldTransform; - var a = worldTransform[0]; - var b = worldTransform[3]; - var c = worldTransform[1]; - var d = worldTransform[4]; - var tx = worldTransform[2]; - var ty = worldTransform[5]; - + var a = worldTransform.a; + var b = worldTransform.c; + var c = worldTransform.b; + var d = worldTransform.d; + var tx = worldTransform.tx; + var ty = worldTransform.ty; + var x1 = a * w1 + c * h1 + tx; var y1 = d * h1 + b * w1 + ty; @@ -11189,6 +11649,7 @@ * @uses EventTarget * @constructor * @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) { @@ -11501,23 +11962,23 @@ PIXI.Texture.prototype._updateWebGLuvs = function() { - if(!this._uvs)this._uvs = new Float32Array(8); + if(!this._uvs)this._uvs = new PIXI.TextureUvs(); var frame = this.frame; var tw = this.baseTexture.width; var th = this.baseTexture.height; - this._uvs[0] = frame.x / tw; - this._uvs[1] = frame.y / th; + this._uvs.x0 = frame.x / tw; + this._uvs.y0 = frame.y / th; - this._uvs[2] = (frame.x + frame.width) / tw; - this._uvs[3] = frame.y / th; + this._uvs.x1 = (frame.x + frame.width) / tw; + this._uvs.y1 = frame.y / th; - this._uvs[4] = (frame.x + frame.width) / tw; - this._uvs[5] = (frame.y + frame.height) / th; + this._uvs.x2 = (frame.x + frame.width) / tw; + this._uvs.y2 = (frame.y + frame.height) / th; - this._uvs[6] = frame.x / tw; - this._uvs[7] = (frame.y + frame.height) / th; + this._uvs.x3 = frame.x / tw; + this._uvs.y3 = (frame.y + frame.height) / th; }; /** @@ -11608,6 +12069,28 @@ // this is more for webGL.. it contains updated frames.. PIXI.Texture.frameUpdates = []; +PIXI.TextureUvs = function() +{ + this.x0 = 0; + this.y0 = 0; + + this.x1 = 0; + this.y1 = 0; + + this.x2 = 0; + this.y2 = 0; + + this.x3 = 0; + this.y4 = 0; + + +} + + + + + + /** * @author Mat Groves http://matgroves.com/ @Doormat23 */ @@ -12606,7 +13089,7 @@ */ PIXI.BitmapFontLoader.prototype.load = function() { - this.ajaxRequest = new XMLHttpRequest(); + this.ajaxRequest = new PIXI.ajaxRequest(); var scope = this; this.ajaxRequest.onreadystatechange = function() { @@ -12619,7 +13102,7 @@ }; /** - * Invoked when XML file is loaded, parses the data + * Invoked when the XML file is loaded, parses the data * * @method onXMLLoaded * @private diff --git a/src/pixi/InteractionManager.js b/src/pixi/InteractionManager.js index a7072d6..98ac26c 100644 --- a/src/pixi/InteractionManager.js +++ b/src/pixi/InteractionManager.js @@ -454,8 +454,8 @@ var isSprite = (item instanceof PIXI.Sprite), worldTransform = item.worldTransform, - a00 = worldTransform[0], a01 = worldTransform[1], a02 = worldTransform[2], - a10 = worldTransform[3], a11 = worldTransform[4], a12 = worldTransform[5], + a00 = worldTransform.a, a01 = worldTransform.b, a02 = worldTransform.tx, + a10 = worldTransform.c, a11 = worldTransform.d, a12 = worldTransform.ty, id = 1 / (a00 * a11 + a01 * -a10), x = a11 * id * global.x + -a01 * id * global.y + (a12 * a01 - a02 * a11) * id, y = a00 * id * global.y + -a10 * id * global.x + (-a12 * a00 + a02 * a10) * id; diff --git a/src/pixi/core/Matrix.js b/src/pixi/core/Matrix.js index b88735c..5c4c103 100644 --- a/src/pixi/core/Matrix.js +++ b/src/pixi/core/Matrix.js @@ -12,7 +12,7 @@ return (typeof Float32Array !== 'undefined') ? Float32Array : Array; }; -PIXI.Matrix = PIXI.determineMatrixArrayType(); +PIXI.Matrix2 = PIXI.determineMatrixArrayType(); /** @@ -33,7 +33,7 @@ */ PIXI.mat3.create = function() { - var matrix = new PIXI.Matrix(9); + var matrix = new PIXI.Matrix2(9); matrix[0] = 1; matrix[1] = 0; @@ -118,7 +118,7 @@ */ PIXI.mat3.clone = function(mat) { - var matrix = new PIXI.Matrix(9); + var matrix = new PIXI.Matrix2(9); matrix[0] = mat[0]; matrix[1] = mat[1]; @@ -217,7 +217,7 @@ */ PIXI.mat4.create = function() { - var matrix = new PIXI.Matrix(16); + var matrix = new PIXI.Matrix2(16); matrix[0] = 1; matrix[1] = 0; @@ -349,4 +349,61 @@ }; PIXI.identityMatrix = PIXI.mat3.create(); -PIXI.tempMatrix = PIXI.mat3.create(); \ No newline at end of file +PIXI.tempMatrix = PIXI.mat3.create(); + +PIXI.Matrix = function() +{ + this.a = 1; + this.b = 0; + this.c = 0; + this.d = 1; + this.tx = 0; + this.ty = 0; + + +} + +PIXI.Matrix.prototype.fromArray = function(array) +{ + + this.a = array[0]; + this.b = array[1]; + this.c = array[3]; + this.d = array[4]; + this.tx = array[2]; + this.ty = array[5]; + +} + +PIXI.Matrix.prototype.toArray = function(transpose) +{ + if(!this.array)this.array = new Float32Array(9); + var array = this.array; + + if(transpose) + { + this.array[0] = this.a; + this.array[1] = this.c; + this.array[2] = 0; + this.array[3] = this.b; + this.array[4] = this.d; + this.array[5] = 0; + this.array[6] = this.tx; + this.array[7] = this.ty; + this.array[8] = 1; + } + else + { + this.array[0] = this.a; + this.array[1] = this.b; + this.array[2] = this.tx; + this.array[3] = this.c; + this.array[4] = this.d; + this.array[5] = this.ty; + this.array[6] = 0; + this.array[7] = 0; + this.array[8] = 1; + } + + return array;//[this.a, this.b, this.tx, this.c, this.d, this.ty, 0, 0, 1]; +} diff --git a/src/pixi/display/DisplayObject.js b/src/pixi/display/DisplayObject.js index b6da1a6..32d34a9 100644 --- a/src/pixi/display/DisplayObject.js +++ b/src/pixi/display/DisplayObject.js @@ -139,7 +139,7 @@ * @readOnly * @private */ - this.worldTransform = PIXI.mat3.create(); //mat3.identity(); + this.worldTransform = new PIXI.Matrix()//PIXI.mat3.create(); //mat3.identity(); /** * [read-only] Current transform of the object locally @@ -149,7 +149,7 @@ * @readOnly * @private */ - this.localTransform = PIXI.mat3.create(); //mat3.identity(); + this.localTransform = new PIXI.Matrix()//PIXI.mat3.create(); //mat3.identity(); /** * [NYI] Unknown @@ -407,40 +407,30 @@ this._cr = Math.cos(this.rotation); } - var localTransform = this.localTransform; - var parentTransform = this.parent.worldTransform; - var worldTransform = this.worldTransform; + // var localTransform = this.localTransform//.toArray(); + var parentTransform = this.parent.worldTransform//.toArray(); + var worldTransform = this.worldTransform//.toArray(); //console.log(localTransform) - localTransform[0] = this._cr * this.scale.x; - localTransform[1] = -this._sr * this.scale.y; - localTransform[3] = this._sr * this.scale.x; - localTransform[4] = this._cr * this.scale.y; - - // TODO --> do we even need a local matrix??? - var px = this.pivot.x; var py = this.pivot.y; - // Cache the matrix values (makes for huge speed increases!) - var a00 = localTransform[0], a01 = localTransform[1], a02 = this.position.x - localTransform[0] * px - py * localTransform[1], - a10 = localTransform[3], a11 = localTransform[4], a12 = this.position.y - localTransform[4] * py - px * localTransform[3], + var a00 = this._cr * this.scale.x, + a01 = -this._sr * this.scale.y, + a10 = this._sr * this.scale.x, + a11 = this._cr * this.scale.y, + a02 = this.position.x + a00 * px - py * a01, + a12 = this.position.y + a11 * py - px * a10, + b00 = parentTransform.a, b01 = parentTransform.b, b02 = parentTransform.tx, + b10 = parentTransform.c, b11 = parentTransform.d, b12 = parentTransform.ty; - b00 = parentTransform[0], b01 = parentTransform[1], b02 = parentTransform[2], - b10 = parentTransform[3], b11 = parentTransform[4], b12 = parentTransform[5]; + worldTransform.a = b00 * a00 + b01 * a10; + worldTransform.b = b00 * a01 + b01 * a11; + worldTransform.tx = b00 * a02 + b01 * a12 + b02; - localTransform[2] = a02; - localTransform[5] = a12; + worldTransform.c = b10 * a00 + b11 * a10; + worldTransform.d = b10 * a01 + b11 * a11; + worldTransform.ty = b10 * a02 + b11 * a12 + b12; - worldTransform[0] = b00 * a00 + b01 * a10; - worldTransform[1] = b00 * a01 + b01 * a11; - worldTransform[2] = b00 * a02 + b01 * a12 + b02; - - worldTransform[3] = b10 * a00 + b11 * a10; - worldTransform[4] = b10 * a01 + b11 * a11; - worldTransform[5] = b10 * a02 + b11 * a12 + b12; - - // because we are using affine transformation, we can optimise the matrix concatenation process.. wooo! - // mat3.multiply(this.localTransform, this.parent.worldTransform, this.worldTransform); this.worldAlpha = this.alpha * this.parent.worldAlpha; }; diff --git a/src/pixi/display/Sprite.js b/src/pixi/display/Sprite.js index 9bc9cec..35b4235 100644 --- a/src/pixi/display/Sprite.js +++ b/src/pixi/display/Sprite.js @@ -184,12 +184,12 @@ var worldTransform = this.worldTransform; - var a = worldTransform[0]; - var b = worldTransform[3]; - var c = worldTransform[1]; - var d = worldTransform[4]; - var tx = worldTransform[2]; - var ty = worldTransform[5]; + var a = worldTransform.a; + var b = worldTransform.c; + var c = worldTransform.b; + var d = worldTransform.d; + var tx = worldTransform.tx; + var ty = worldTransform.ty; var x1 = a * w1 + c * h1 + tx; var y1 = d * h1 + b * w1 + ty; @@ -345,7 +345,7 @@ // allow for trimming - context.setTransform(transform[0], transform[3], transform[1], transform[4], transform[2], transform[5]); + context.setTransform(transform.a, transform.c, transform.b, transform.d, transform.tx, transform.ty); //if smoothingEnabled is supported and we need to change the smoothing property for this texture if(renderSession.smoothProperty && renderSession.scaleMode !== this.texture.baseTexture.scaleMode) { diff --git a/src/pixi/display/SpriteBatch.js b/src/pixi/display/SpriteBatch.js index bfd3017..7526390 100644 --- a/src/pixi/display/SpriteBatch.js +++ b/src/pixi/display/SpriteBatch.js @@ -93,7 +93,7 @@ // alow for trimming - context.setTransform(transform[0], transform[3], transform[1], transform[4], transform[2], transform[5]); + context.setTransform(transform.a, transform.c, transform.b, transform.d, transform.tx, transform.ty); context.save(); for (var i = 0; i < this.children.length; i++) { @@ -123,7 +123,7 @@ PIXI.DisplayObject.prototype.updateTransform.call(child); transform = child.localTransform; - context.setTransform(transform[0], transform[3], transform[1], transform[4], transform[2], transform[5]); + context.setTransform(transform.a, transform.c, transform.b, transform.d, transform.tx, transform.ty); context.drawImage(texture.baseTexture.source, frame.x, diff --git a/src/pixi/display/Stage.js b/src/pixi/display/Stage.js index e42c772..743e1e0 100644 --- a/src/pixi/display/Stage.js +++ b/src/pixi/display/Stage.js @@ -30,7 +30,7 @@ * @readOnly * @private */ - this.worldTransform = PIXI.mat3.create(); + this.worldTransform = new PIXI.Matrix()//PIXI.mat3.create(); /** * Whether or not the stage is interactive diff --git a/src/pixi/extras/TilingSprite.js b/src/pixi/extras/TilingSprite.js index 59a1ad1..b19dafe 100644 --- a/src/pixi/extras/TilingSprite.js +++ b/src/pixi/extras/TilingSprite.js @@ -198,7 +198,7 @@ // allow for trimming - context.setTransform(transform[0], transform[3], transform[1], transform[4], transform[2], transform[5]); + context.setTransform(transform.a, transform.c, transform.b, transform.d, transform.tx, transform.ty); if(!this.__tilePattern) @@ -256,13 +256,13 @@ var worldTransform = this.worldTransform; - var a = worldTransform[0]; - var b = worldTransform[3]; - var c = worldTransform[1]; - var d = worldTransform[4]; - var tx = worldTransform[2]; - var ty = worldTransform[5]; - + var a = worldTransform.a; + var b = worldTransform.c; + var c = worldTransform.b; + var d = worldTransform.d; + var tx = worldTransform.tx; + var ty = worldTransform.ty; + var x1 = a * w1 + c * h1 + tx; var y1 = d * h1 + b * w1 + ty; diff --git a/src/pixi/primitives/Graphics.js b/src/pixi/primitives/Graphics.js index b057305..a215650 100644 --- a/src/pixi/primitives/Graphics.js +++ b/src/pixi/primitives/Graphics.js @@ -422,7 +422,7 @@ context.globalCompositeOperation = PIXI.blendModesCanvas[renderSession.currentBlendMode]; } - context.setTransform(transform[0], transform[3], transform[1], transform[4], transform[2], transform[5]); + context.setTransform(transform.a, transform.c, transform.b, transform.d, transform.tx, transform.ty); PIXI.CanvasGraphics.renderGraphics(this, context); // simple render children! @@ -450,12 +450,12 @@ var worldTransform = this.worldTransform; - var a = worldTransform[0]; - var b = worldTransform[3]; - var c = worldTransform[1]; - var d = worldTransform[4]; - var tx = worldTransform[2]; - var ty = worldTransform[5]; + var a = worldTransform.a; + var b = worldTransform.c; + var c = worldTransform.b; + var d = worldTransform.d; + var tx = worldTransform.tx; + var ty = worldTransform.ty; var x1 = a * w1 + c * h1 + tx; var y1 = d * h1 + b * w1 + ty; diff --git a/src/pixi/renderers/canvas/utils/CanvasMaskManager.js b/src/pixi/renderers/canvas/utils/CanvasMaskManager.js index 3bbca21..e9a9f97 100644 --- a/src/pixi/renderers/canvas/utils/CanvasMaskManager.js +++ b/src/pixi/renderers/canvas/utils/CanvasMaskManager.js @@ -30,7 +30,7 @@ var cacheAlpha = maskData.alpha; var transform = maskData.worldTransform; - context.setTransform(transform[0], transform[3], transform[1], transform[4], transform[2], transform[5]); + context.setTransform(transform.a, transform.c, transform.b, transform.d, transform.tx, transform.ty); PIXI.CanvasGraphics.renderGraphicsMask(maskData, context); diff --git a/src/pixi/renderers/webgl/utils/WebGLFastSpriteBatch.js b/src/pixi/renderers/webgl/utils/WebGLFastSpriteBatch.js index 765a471..b124701 100644 --- a/src/pixi/renderers/webgl/utils/WebGLFastSpriteBatch.js +++ b/src/pixi/renderers/webgl/utils/WebGLFastSpriteBatch.js @@ -52,7 +52,7 @@ this.shader = null; - this.tempMatrix = PIXI.mat3.create(); + this.matrix this.setContext(gl); }; @@ -82,8 +82,10 @@ { this.renderSession = renderSession; this.shader = this.renderSession.shaderManager.fastShader; - - PIXI.mat3.transpose(spriteBatch.worldTransform, this.tempMatrix); + + // PIXI.mat3.transpose(spriteBatch.worldTransform.toArray(), this.tempMatrix); + + this.matrix = spriteBatch.worldTransform.toArray(true) // console.log(this.tempMatrix) this.start(); @@ -179,8 +181,8 @@ verticies[index++] = sprite.rotation; // uv - verticies[index++] = uvs[0]; - verticies[index++] = uvs[1]; + verticies[index++] = uvs.x0; + verticies[index++] = uvs.y1; // color verticies[index++] = sprite.alpha; @@ -200,8 +202,8 @@ verticies[index++] = sprite.rotation; // uv - verticies[index++] = uvs[2]; - verticies[index++] = uvs[3]; + verticies[index++] = uvs.x1; + verticies[index++] = uvs.y1; // color verticies[index++] = sprite.alpha; @@ -221,8 +223,8 @@ verticies[index++] = sprite.rotation; // uv - verticies[index++] = uvs[4]; - verticies[index++] = uvs[5]; + verticies[index++] = uvs.x2; + verticies[index++] = uvs.y2; // color verticies[index++] = sprite.alpha; @@ -244,8 +246,8 @@ verticies[index++] = sprite.rotation; // uv - verticies[index++] = uvs[6]; - verticies[index++] = uvs[7]; + verticies[index++] = uvs.x3; + verticies[index++] = uvs.y3; // color verticies[index++] = sprite.alpha; @@ -260,6 +262,7 @@ PIXI.WebGLFastSpriteBatch.prototype.flush = function() { + // If the batch is length 0 then return as there is nothing to draw if (this.currentBatchSize===0)return; @@ -318,7 +321,7 @@ gl.uniform2f(this.shader.projectionVector, projection.x, projection.y); // set the matrix - gl.uniformMatrix3fv(this.shader.uMatrix, false, this.tempMatrix); + gl.uniformMatrix3fv(this.shader.uMatrix, false, this.matrix); // set the pointers var stride = this.vertSize * 4; diff --git a/src/pixi/renderers/webgl/utils/WebGLGraphics.js b/src/pixi/renderers/webgl/utils/WebGLGraphics.js index 44f1323..9151c16 100644 --- a/src/pixi/renderers/webgl/utils/WebGLGraphics.js +++ b/src/pixi/renderers/webgl/utils/WebGLGraphics.js @@ -58,12 +58,10 @@ // This could be speeded up for sure! // var m = PIXI.mat3.clone(graphics.worldTransform); - PIXI.mat3.transpose(graphics.worldTransform, PIXI.tempMatrix); - // set the matrix transform gl.blendFunc(gl.ONE, gl.ONE_MINUS_SRC_ALPHA); - gl.uniformMatrix3fv(shader.translationMatrix, false, PIXI.tempMatrix); + gl.uniformMatrix3fv(shader.translationMatrix, false, graphics.worldTransform.toArray(true)); gl.uniform2f(shader.projectionVector, projection.x, -projection.y); gl.uniform2f(shader.offsetVector, -offset.x, -offset.y); diff --git a/src/pixi/renderers/webgl/utils/WebGLSpriteBatch.js b/src/pixi/renderers/webgl/utils/WebGLSpriteBatch.js index bf151bf..1616ef3 100644 --- a/src/pixi/renderers/webgl/utils/WebGLSpriteBatch.js +++ b/src/pixi/renderers/webgl/utils/WebGLSpriteBatch.js @@ -194,21 +194,21 @@ var index = this.currentBatchSize * 4 * this.vertSize; - var worldTransform = sprite.worldTransform; + var worldTransform = sprite.worldTransform;//.toArray(); - var a = worldTransform[0]; - var b = worldTransform[3]; - var c = worldTransform[1]; - var d = worldTransform[4]; - var tx = worldTransform[2]; - var ty = worldTransform[5]; + var a = worldTransform.a//[0]; + var b = worldTransform.c//[3]; + var c = worldTransform.b//[1]; + var d = worldTransform.d//[4]; + var tx = worldTransform.tx//[2]; + var ty = worldTransform.ty///[5]; // xy verticies[index++] = a * w1 + c * h1 + tx; verticies[index++] = d * h1 + b * w1 + ty; // uv - verticies[index++] = uvs[0]; - verticies[index++] = uvs[1]; + verticies[index++] = uvs.x0; + verticies[index++] = uvs.y0; // color verticies[index++] = alpha; verticies[index++] = tint; @@ -217,8 +217,8 @@ verticies[index++] = a * w0 + c * h1 + tx; verticies[index++] = d * h1 + b * w0 + ty; // uv - verticies[index++] = uvs[2]; - verticies[index++] = uvs[3]; + verticies[index++] = uvs.x1; + verticies[index++] = uvs.y1; // color verticies[index++] = alpha; verticies[index++] = tint; @@ -227,8 +227,8 @@ verticies[index++] = a * w0 + c * h0 + tx; verticies[index++] = d * h0 + b * w0 + ty; // uv - verticies[index++] = uvs[4]; - verticies[index++] = uvs[5]; + verticies[index++] = uvs.x2; + verticies[index++] = uvs.y2; // color verticies[index++] = alpha; verticies[index++] = tint; @@ -237,12 +237,12 @@ verticies[index++] = a * w1 + c * h0 + tx; verticies[index++] = d * h0 + b * w1 + ty; // uv - verticies[index++] = uvs[6]; - verticies[index++] = uvs[7]; + verticies[index++] = uvs.x3; + verticies[index++] = uvs.y3; // color verticies[index++] = alpha; verticies[index++] = tint; - + // increment the batchsize this.currentBatchSize++; diff --git a/src/pixi/textures/Texture.js b/src/pixi/textures/Texture.js index 400f297..704f922 100644 --- a/src/pixi/textures/Texture.js +++ b/src/pixi/textures/Texture.js @@ -128,23 +128,23 @@ PIXI.Texture.prototype._updateWebGLuvs = function() { - if(!this._uvs)this._uvs = new Float32Array(8); + if(!this._uvs)this._uvs = new PIXI.TextureUvs(); var frame = this.frame; var tw = this.baseTexture.width; var th = this.baseTexture.height; - this._uvs[0] = frame.x / tw; - this._uvs[1] = frame.y / th; + this._uvs.x0 = frame.x / tw; + this._uvs.y0 = frame.y / th; - this._uvs[2] = (frame.x + frame.width) / tw; - this._uvs[3] = frame.y / th; + this._uvs.x1 = (frame.x + frame.width) / tw; + this._uvs.y1 = frame.y / th; - this._uvs[4] = (frame.x + frame.width) / tw; - this._uvs[5] = (frame.y + frame.height) / th; + this._uvs.x2 = (frame.x + frame.width) / tw; + this._uvs.y2 = (frame.y + frame.height) / th; - this._uvs[6] = frame.x / tw; - this._uvs[7] = (frame.y + frame.height) / th; + this._uvs.x3 = frame.x / tw; + this._uvs.y3 = (frame.y + frame.height) / th; }; /** @@ -234,3 +234,25 @@ // this is more for webGL.. it contains updated frames.. PIXI.Texture.frameUpdates = []; + +PIXI.TextureUvs = function() +{ + this.x0 = 0; + this.y0 = 0; + + this.x1 = 0; + this.y1 = 0; + + this.x2 = 0; + this.y2 = 0; + + this.x3 = 0; + this.y4 = 0; + + +} + + + + +