jeena/pixi.js
1
0
Fork 0
Code Issues Pull requests Projects Packages Wiki Activity Actions

Squashed commit of the following (jshint):

Browse source 
commit 09d68fb83686b82a2cbac0d99abcc7e0899d6724
Author: Dr. Kibitz <info@drkibitz.com>
Date:   Tue Sep 10 13:14:22 2013 -0700

    ignore W069 just in 4 methods

commit 931afab48f374194a808bedac4e31dd9c20d2ae4
Author: Dr. Kibitz <info@drkibitz.com>
Date:   Tue Sep 10 13:14:03 2013 -0700

    fix for warning W055

commit 43ad62a89a1c83e8da85dd9f9bb6e8a7c0acd59d
Author: Dr. Kibitz <info@drkibitz.com>
Date:   Tue Sep 10 13:13:46 2013 -0700

    rename HEXtoRGB to hex2rgb

commit adc2a1e83823061709dbf1d4b037bebeddc7281c
Author: Dr. Kibitz <info@drkibitz.com>
Date:   Tue Sep 10 13:13:02 2013 -0700

    Changed some jshint settings

commit 0d8eb1ef71332b076a0f9bd565633c92395ed5ec
Author: Dr. Kibitz <info@drkibitz.com>
Date:   Sun Sep 1 16:16:53 2013 -0700

    unittest-refactor branch compatible jshint setup

commit 3e91e79dab7c34dbb60bf364124d2ef7df93ec6d
Author: Dr. Kibitz <info@drkibitz.com>
Date:   Sun Sep 1 11:15:34 2013 -0700

    Final progress, jshint passed

commit c0f3750a06616195cf76149091dce4a1da7717ab
Author: Dr. Kibitz <info@drkibitz.com>
Date:   Sun Sep 1 10:31:36 2013 -0700

    More progress

commit b2118949bb47cbeffaf53d2cb1a978c8f9ffdf49
Author: Dr. Kibitz <info@drkibitz.com>
Date:   Sun Sep 1 02:38:10 2013 -0700

    jshint progress
This commit is contained in:
Dr. Kibitz 2013-09-24 09:32:56 -07:00
parent 56df185471
commit 67d0c577d3
41 changed files with 5776 additions and 5733 deletions
Download patch file Download diff file Expand all files Collapse all files

72
.jshintrc Normal file
View file

@ -0,0 +1,72 @@
{
"passfail" : false,
"maxerr" : 0,
"browser" : true,
"node" : false,
"rhino" : false,
"couch" : false,
"wsh" : false,
"jquery" : false,
"prototypejs" : false,
"mootools" : false,
"dojo" : false,
"predef" : [
"_",
"google",
"jasmine",
"describe",
"xdescribe",
"it",
"xit",
"beforeEach",
"afterEach",
"expect",
"spyOn",
"runs",
"waits",
"waitsFor",
"Benchmark",
"Backbone",
"Modernizr"
],
"debug" : false,
"devel" : false,
"es5" : false,
"strict" : false,
"globalstrict" : false,
"smarttabs" : true,
"asi" : true,
"laxbreak" : false,
"bitwise" : false,
"boss" : false,
"curly" : false,
"eqeqeq" : false,
"eqnull" : true,
"evil" : false,
"expr" : false,
"forin" : false,
"immed" : true,
"latedef" : true,
"loopfunc" : false,
"noarg" : true,
"regexp" : true,
"regexdash" : false,
"scripturl" : true,
"shadow" : false,
"supernew" : false,
"undef" : false,
"newcap" : true,
"noempty" : true,
"nonew" : false,
"nomen" : false,
"onevar" : false,
"plusplus" : false,
"sub" : false,
"trailing" : true
}

28
Gruntfile.js
View file

@ -93,11 +93,24 @@ module.exports = function(grunt) {
}
},
jshint: {
beforeconcat: srcFiles,
test: ['<%= files.testBlob %>'],
options: {
asi: true,
smarttabs: true
beforeconcat: {
src: srcFiles,
options: {
jshintrc: '.jshintrc',
ignores: ['<%= dirs.src %>/{Intro,Outro}.js']
}
},
afterconcat: {
src: '<%= files.build %>',
options: {
jshintrc: '.jshintrc',
}
},
test: {
src: ['<%= files.testBlob %>'],
options: {
expr: true
}
}
},
uglify: {
@ -182,8 +195,9 @@ module.exports = function(grunt) {
}
)
grunt.registerTask('default', ['concat', 'uglify', 'distribute']);
grunt.registerTask('build', ['concat', 'uglify', 'distribute']);
grunt.registerTask('lintconcat', ['jshint:beforeconcat', 'concat', 'jshint:afterconcat']);
grunt.registerTask('default', ['lintconcat', 'uglify', 'distribute']);
grunt.registerTask('build', ['lintconcat', 'uglify', 'distribute']);
grunt.registerTask('test', ['build', 'connect:qunit', 'qunit']);
grunt.registerTask('docs', ['yuidoc']);

857
src/pixi/InteractionManager.js
View file

File diff suppressed because it is too large Load diff

2
src/pixi/Intro.js
View file

@ -4,4 +4,4 @@
(function(){
var root = this;
var root = this;

298
src/pixi/core/Matrix.js
View file

@ -16,35 +16,35 @@ PIXI.mat3 = {};
PIXI.mat3.create = function()
{
var matrix = new PIXI.Matrix(9);
var matrix = new PIXI.Matrix(9);
matrix[0] = 1;
matrix[1] = 0;
matrix[2] = 0;
matrix[3] = 0;
matrix[4] = 1;
matrix[5] = 0;
matrix[6] = 0;
matrix[7] = 0;
matrix[8] = 1;
matrix[0] = 1;
matrix[1] = 0;
matrix[2] = 0;
matrix[3] = 0;
matrix[4] = 1;
matrix[5] = 0;
matrix[6] = 0;
matrix[7] = 0;
matrix[8] = 1;
return matrix;
return matrix;
}
PIXI.mat3.identity = function(matrix)
{
matrix[0] = 1;
matrix[1] = 0;
matrix[2] = 0;
matrix[3] = 0;
matrix[4] = 1;
matrix[5] = 0;
matrix[6] = 0;
matrix[7] = 0;
matrix[8] = 1;
matrix[0] = 1;
matrix[1] = 0;
matrix[2] = 0;
matrix[3] = 0;
matrix[4] = 1;
matrix[5] = 0;
matrix[6] = 0;
matrix[7] = 0;
matrix[8] = 1;
return matrix;
return matrix;
}
@ -52,76 +52,76 @@ PIXI.mat4 = {};
PIXI.mat4.create = function()
{
var matrix = new PIXI.Matrix(16);
var matrix = new PIXI.Matrix(16);
matrix[0] = 1;
matrix[1] = 0;
matrix[2] = 0;
matrix[3] = 0;
matrix[4] = 0;
matrix[5] = 1;
matrix[6] = 0;
matrix[7] = 0;
matrix[8] = 0;
matrix[9] = 0;
matrix[10] = 1;
matrix[11] = 0;
matrix[12] = 0;
matrix[13] = 0;
matrix[14] = 0;
matrix[15] = 1;
matrix[0] = 1;
matrix[1] = 0;
matrix[2] = 0;
matrix[3] = 0;
matrix[4] = 0;
matrix[5] = 1;
matrix[6] = 0;
matrix[7] = 0;
matrix[8] = 0;
matrix[9] = 0;
matrix[10] = 1;
matrix[11] = 0;
matrix[12] = 0;
matrix[13] = 0;
matrix[14] = 0;
matrix[15] = 1;
return matrix;
return matrix;
}
PIXI.mat3.multiply = function (mat, mat2, dest)
{
if (!dest) { dest = mat; }
if (!dest) { dest = mat; }
// Cache the matrix values (makes for huge speed increases!)
var a00 = mat[0], a01 = mat[1], a02 = mat[2],
a10 = mat[3], a11 = mat[4], a12 = mat[5],
a20 = mat[6], a21 = mat[7], a22 = mat[8],
// Cache the matrix values (makes for huge speed increases!)
var a00 = mat[0], a01 = mat[1], a02 = mat[2],
a10 = mat[3], a11 = mat[4], a12 = mat[5],
a20 = mat[6], a21 = mat[7], a22 = mat[8],
b00 = mat2[0], b01 = mat2[1], b02 = mat2[2],
b10 = mat2[3], b11 = mat2[4], b12 = mat2[5],
b20 = mat2[6], b21 = mat2[7], b22 = mat2[8];
b00 = mat2[0], b01 = mat2[1], b02 = mat2[2],
b10 = mat2[3], b11 = mat2[4], b12 = mat2[5],
b20 = mat2[6], b21 = mat2[7], b22 = mat2[8];
dest[0] = b00 * a00 + b01 * a10 + b02 * a20;
dest[1] = b00 * a01 + b01 * a11 + b02 * a21;
dest[2] = b00 * a02 + b01 * a12 + b02 * a22;
dest[0] = b00 * a00 + b01 * a10 + b02 * a20;
dest[1] = b00 * a01 + b01 * a11 + b02 * a21;
dest[2] = b00 * a02 + b01 * a12 + b02 * a22;
dest[3] = b10 * a00 + b11 * a10 + b12 * a20;
dest[4] = b10 * a01 + b11 * a11 + b12 * a21;
dest[5] = b10 * a02 + b11 * a12 + b12 * a22;
dest[3] = b10 * a00 + b11 * a10 + b12 * a20;
dest[4] = b10 * a01 + b11 * a11 + b12 * a21;
dest[5] = b10 * a02 + b11 * a12 + b12 * a22;
dest[6] = b20 * a00 + b21 * a10 + b22 * a20;
dest[7] = b20 * a01 + b21 * a11 + b22 * a21;
dest[8] = b20 * a02 + b21 * a12 + b22 * a22;
dest[6] = b20 * a00 + b21 * a10 + b22 * a20;
dest[7] = b20 * a01 + b21 * a11 + b22 * a21;
dest[8] = b20 * a02 + b21 * a12 + b22 * a22;
return dest;
return dest;
}
PIXI.mat3.clone = function(mat)
{
var matrix = new PIXI.Matrix(9);
var matrix = new PIXI.Matrix(9);
matrix[0] = mat[0];
matrix[1] = mat[1];
matrix[2] = mat[2];
matrix[3] = mat[3];
matrix[4] = mat[4];
matrix[5] = mat[5];
matrix[6] = mat[6];
matrix[7] = mat[7];
matrix[8] = mat[8];
matrix[0] = mat[0];
matrix[1] = mat[1];
matrix[2] = mat[2];
matrix[3] = mat[3];
matrix[4] = mat[4];
matrix[5] = mat[5];
matrix[6] = mat[6];
matrix[7] = mat[7];
matrix[8] = mat[8];
return matrix;
return matrix;
}
PIXI.mat3.transpose = function (mat, dest)
{
// If we are transposing ourselves we can skip a few steps but have to cache some values
// If we are transposing ourselves we can skip a few steps but have to cache some values
if (!dest || mat === dest) {
var a01 = mat[1], a02 = mat[2],
a12 = mat[5];
@ -149,29 +149,29 @@ PIXI.mat3.transpose = function (mat, dest)
PIXI.mat3.toMat4 = function (mat, dest)
{
if (!dest) { dest = PIXI.mat4.create(); }
if (!dest) { dest = PIXI.mat4.create(); }
dest[15] = 1;
dest[14] = 0;
dest[13] = 0;
dest[12] = 0;
dest[15] = 1;
dest[14] = 0;
dest[13] = 0;
dest[12] = 0;
dest[11] = 0;
dest[10] = mat[8];
dest[9] = mat[7];
dest[8] = mat[6];
dest[11] = 0;
dest[10] = mat[8];
dest[9] = mat[7];
dest[8] = mat[6];
dest[7] = 0;
dest[6] = mat[5];
dest[5] = mat[4];
dest[4] = mat[3];
dest[7] = 0;
dest[6] = mat[5];
dest[5] = mat[4];
dest[4] = mat[3];
dest[3] = 0;
dest[2] = mat[2];
dest[1] = mat[1];
dest[0] = mat[0];
dest[3] = 0;
dest[2] = mat[2];
dest[1] = mat[1];
dest[0] = mat[0];
return dest;
return dest;
}
@ -180,82 +180,82 @@ PIXI.mat3.toMat4 = function (mat, dest)
PIXI.mat4.create = function()
{
var matrix = new PIXI.Matrix(16);
var matrix = new PIXI.Matrix(16);
matrix[0] = 1;
matrix[1] = 0;
matrix[2] = 0;
matrix[3] = 0;
matrix[4] = 0;
matrix[5] = 1;
matrix[6] = 0;
matrix[7] = 0;
matrix[8] = 0;
matrix[9] = 0;
matrix[10] = 1;
matrix[11] = 0;
matrix[12] = 0;
matrix[13] = 0;
matrix[14] = 0;
matrix[15] = 1;
matrix[0] = 1;
matrix[1] = 0;
matrix[2] = 0;
matrix[3] = 0;
matrix[4] = 0;
matrix[5] = 1;
matrix[6] = 0;
matrix[7] = 0;
matrix[8] = 0;
matrix[9] = 0;
matrix[10] = 1;
matrix[11] = 0;
matrix[12] = 0;
matrix[13] = 0;
matrix[14] = 0;
matrix[15] = 1;
return matrix;
return matrix;
}
PIXI.mat4.transpose = function (mat, dest)
{
// If we are transposing ourselves we can skip a few steps but have to cache some values
if (!dest || mat === dest)
{
var a01 = mat[1], a02 = mat[2], a03 = mat[3],
a12 = mat[6], a13 = mat[7],
a23 = mat[11];
// If we are transposing ourselves we can skip a few steps but have to cache some values
if (!dest || mat === dest)
{
var a01 = mat[1], a02 = mat[2], a03 = mat[3],
a12 = mat[6], a13 = mat[7],
a23 = mat[11];
mat[1] = mat[4];
mat[2] = mat[8];
mat[3] = mat[12];
mat[4] = a01;
mat[6] = mat[9];
mat[7] = mat[13];
mat[8] = a02;
mat[9] = a12;
mat[11] = mat[14];
mat[12] = a03;
mat[13] = a13;
mat[14] = a23;
return mat;
}
mat[1] = mat[4];
mat[2] = mat[8];
mat[3] = mat[12];
mat[4] = a01;
mat[6] = mat[9];
mat[7] = mat[13];
mat[8] = a02;
mat[9] = a12;
mat[11] = mat[14];
mat[12] = a03;
mat[13] = a13;
mat[14] = a23;
return mat;
}
dest[0] = mat[0];
dest[1] = mat[4];
dest[2] = mat[8];
dest[3] = mat[12];
dest[4] = mat[1];
dest[5] = mat[5];
dest[6] = mat[9];
dest[7] = mat[13];
dest[8] = mat[2];
dest[9] = mat[6];
dest[10] = mat[10];
dest[11] = mat[14];
dest[12] = mat[3];
dest[13] = mat[7];
dest[14] = mat[11];
dest[15] = mat[15];
return dest;
dest[0] = mat[0];
dest[1] = mat[4];
dest[2] = mat[8];
dest[3] = mat[12];
dest[4] = mat[1];
dest[5] = mat[5];
dest[6] = mat[9];
dest[7] = mat[13];
dest[8] = mat[2];
dest[9] = mat[6];
dest[10] = mat[10];
dest[11] = mat[14];
dest[12] = mat[3];
dest[13] = mat[7];
dest[14] = mat[11];
dest[15] = mat[15];
return dest;
}
PIXI.mat4.multiply = function (mat, mat2, dest)
{
if (!dest) { dest = mat; }
if (!dest) { dest = mat; }
// Cache the matrix values (makes for huge speed increases!)
var a00 = mat[ 0], a01 = mat[ 1], a02 = mat[ 2], a03 = mat[3];
var a10 = mat[ 4], a11 = mat[ 5], a12 = mat[ 6], a13 = mat[7];
var a20 = mat[ 8], a21 = mat[ 9], a22 = mat[10], a23 = mat[11];
var a30 = mat[12], a31 = mat[13], a32 = mat[14], a33 = mat[15];
// Cache the matrix values (makes for huge speed increases!)
var a00 = mat[ 0], a01 = mat[ 1], a02 = mat[ 2], a03 = mat[3];
var a10 = mat[ 4], a11 = mat[ 5], a12 = mat[ 6], a13 = mat[7];
var a20 = mat[ 8], a21 = mat[ 9], a22 = mat[10], a23 = mat[11];
var a30 = mat[12], a31 = mat[13], a32 = mat[14], a33 = mat[15];
// Cache only the current line of the second matrix
// Cache only the current line of the second matrix
var b0 = mat2[0], b1 = mat2[1], b2 = mat2[2], b3 = mat2[3];
dest[0] = b0*a00 + b1*a10 + b2*a20 + b3*a30;
dest[1] = b0*a01 + b1*a11 + b2*a21 + b3*a31;

26
src/pixi/core/Point.js
View file

@ -12,19 +12,19 @@
*/
PIXI.Point = function(x, y)
{
/**
* @property x
* @type Number
* @default 0
*/
this.x = x || 0;
/**
* @property x
* @type Number
* @default 0
*/
this.x = x || 0;
/**
* @property y
* @type Number
* @default 0
*/
this.y = y || 0;
/**
* @property y
* @type Number
* @default 0
*/
this.y = y || 0;
}
/**
@ -35,7 +35,7 @@ PIXI.Point = function(x, y)
*/
PIXI.Point.prototype.clone = function()
{
return new PIXI.Point(this.x, this.y);
return new PIXI.Point(this.x, this.y);
}
// constructor

12
src/pixi/core/Polygon.js
View file

@ -29,7 +29,7 @@ PIXI.Polygon = function(points)
points = p;
}
this.points = points;
this.points = points;
}
/**
@ -40,12 +40,12 @@ PIXI.Polygon = function(points)
*/
PIXI.Polygon.prototype.clone = function()
{
var points = [];
for (var i=0; i<this.points.length; i++) {
points.push(this.points[i].clone());
}
var points = [];
for (var i=0; i<this.points.length; i++) {
points.push(this.points[i].clone());
}
return new PIXI.Polygon(points);
return new PIXI.Polygon(points);
}
/**

70
src/pixi/core/Rectangle.js
View file

@ -14,33 +14,33 @@
*/
PIXI.Rectangle = function(x, y, width, height)
{
/**
* @property x
* @type Number
* @default 0
*/
this.x = x || 0;
/**
* @property x
* @type Number
* @default 0
*/
this.x = x || 0;
/**
* @property y
* @type Number
* @default 0
*/
this.y = y || 0;
/**
* @property y
* @type Number
* @default 0
*/
this.y = y || 0;
/**
* @property width
* @type Number
* @default 0
*/
this.width = width || 0;
/**
* @property width
* @type Number
* @default 0
*/
this.width = width || 0;
/**
* @property height
* @type Number
* @default 0
*/
this.height = height || 0;
/**
* @property height
* @type Number
* @default 0
*/
this.height = height || 0;
}
/**
@ -51,7 +51,7 @@ PIXI.Rectangle = function(x, y, width, height)
*/
PIXI.Rectangle.prototype.clone = function()
{
return new PIXI.Rectangle(this.x, this.y, this.width, this.height);
return new PIXI.Rectangle(this.x, this.y, this.width, this.height);
}
/**
@ -67,18 +67,18 @@ PIXI.Rectangle.prototype.contains = function(x, y)
if(this.width <= 0 || this.height <= 0)
return false;
var x1 = this.x;
if(x >= x1 && x <= x1 + this.width)
{
var y1 = this.y;
var x1 = this.x;
if(x >= x1 && x <= x1 + this.width)
{
var y1 = this.y;
if(y >= y1 && y <= y1 + this.height)
{
return true;
}
}
if(y >= y1 && y <= y1 + this.height)
{
return true;
}
}
return false;
return false;
}
// constructor

651
src/pixi/display/DisplayObject.js
View file

@ -10,233 +10,233 @@
*/
PIXI.DisplayObject = function()
{
this.last = this;
this.first = this;
this.last = this;
this.first = this;
/**
* The coordinate of the object relative to the local coordinates of the parent.
*
* @property position
* @type Point
*/
this.position = new PIXI.Point();
/**
* The coordinate of the object relative to the local coordinates of the parent.
*
* @property position
* @type Point
*/
this.position = new PIXI.Point();
/**
* The scale factor of the object.
*
* @property scale
* @type Point
*/
this.scale = new PIXI.Point(1,1);//{x:1, y:1};
/**
* The scale factor of the object.
*
* @property scale
* @type Point
*/
this.scale = new PIXI.Point(1,1);//{x:1, y:1};
/**
* The pivot point of the displayObject that it rotates around
*
* @property pivot
* @type Point
*/
this.pivot = new PIXI.Point(0,0);
/**
* The pivot point of the displayObject that it rotates around
*
* @property pivot
* @type Point
*/
this.pivot = new PIXI.Point(0,0);
/**
* The rotation of the object in radians.
*
* @property rotation
* @type Number
*/
this.rotation = 0;
/**
* The rotation of the object in radians.
*
* @property rotation
* @type Number
*/
this.rotation = 0;
/**
* The opacity of the object.
*
* @property alpha
* @type Number
*/
this.alpha = 1;
/**
* The opacity of the object.
*
* @property alpha
* @type Number
*/
this.alpha = 1;
/**
* The visibility of the object.
*
* @property visible
* @type Boolean
*/
this.visible = true;
/**
* The visibility of the object.
*
* @property visible
* @type Boolean
*/
this.visible = true;
/**
* This is the defined area that will pick up mouse / touch events. It is null by default.
* Setting it is a neat way of optimising the hitTest function that the interactionManager will use (as it will not need to hit test all the children)
*
* @property hitArea
* @type Rectangle|Circle|Ellipse|Polygon
*/
this.hitArea = null;
/**
* This is the defined area that will pick up mouse / touch events. It is null by default.
* Setting it is a neat way of optimising the hitTest function that the interactionManager will use (as it will not need to hit test all the children)
*
* @property hitArea
* @type Rectangle|Circle|Ellipse|Polygon
*/
this.hitArea = null;
/**
* This is used to indicate if the displayObject should display a mouse hand cursor on rollover
*
* @property buttonMode
* @type Boolean
*/
this.buttonMode = false;
/**
* This is used to indicate if the displayObject should display a mouse hand cursor on rollover
*
* @property buttonMode
* @type Boolean
*/
this.buttonMode = false;
/**
* Can this object be rendered
*
* @property renderable
* @type Boolean
*/
this.renderable = false;
/**
* Can this object be rendered
*
* @property renderable
* @type Boolean
*/
this.renderable = false;
/**
* [read-only] The display object container that contains this display object.
*
* @property parent
* @type DisplayObjectContainer
* @readOnly
*/
this.parent = null;
/**
* [read-only] The display object container that contains this display object.
*
* @property parent
* @type DisplayObjectContainer
* @readOnly
*/
this.parent = null;
/**
* [read-only] The stage the display object is connected to, or undefined if it is not connected to the stage.
*
* @property stage
* @type Stage
* @readOnly
*/
this.stage = null;
/**
* [read-only] The stage the display object is connected to, or undefined if it is not connected to the stage.
*
* @property stage
* @type Stage
* @readOnly
*/
this.stage = null;
/**
* [read-only] The multiplied alpha of the displayobject
*
* @property worldAlpha
* @type Number
* @readOnly
*/
this.worldAlpha = 1;
/**
* [read-only] The multiplied alpha of the displayobject
*
* @property worldAlpha
* @type Number
* @readOnly
*/
this.worldAlpha = 1;
/**
* [read-only] Whether or not the object is interactive, do not toggle directly! use the `interactive` property
*
* @property _interactive
* @type Boolean
* @readOnly
* @private
*/
this._interactive = false;
/**
* [read-only] Whether or not the object is interactive, do not toggle directly! use the `interactive` property
*
* @property _interactive
* @type Boolean
* @readOnly
* @private
*/
this._interactive = false;
/**
* [read-only] Current transform of the object based on world (parent) factors
*
* @property worldTransform
* @type Mat3
* @readOnly
* @private
*/
this.worldTransform = PIXI.mat3.create()//mat3.identity();
/**
* [read-only] Current transform of the object based on world (parent) factors
*
* @property worldTransform
* @type Mat3
* @readOnly
* @private
*/
this.worldTransform = PIXI.mat3.create()//mat3.identity();
/**
* [read-only] Current transform of the object locally
*
* @property localTransform
* @type Mat3
* @readOnly
* @private
*/
this.localTransform = PIXI.mat3.create()//mat3.identity();
/**
* [read-only] Current transform of the object locally
*
* @property localTransform
* @type Mat3
* @readOnly
* @private
*/
this.localTransform = PIXI.mat3.create()//mat3.identity();
/**
* [NYI] Unkown
*
* @property color
* @type Array<>
* @private
*/
this.color = [];
/**
* [NYI] Unkown
*
* @property color
* @type Array<>
* @private
*/
this.color = [];
/**
* [NYI] Holds whether or not this object is dynamic, for rendering optimization
*
* @property dynamic
* @type Boolean
* @private
*/
this.dynamic = true;
/**
* [NYI] Holds whether or not this object is dynamic, for rendering optimization
*
* @property dynamic
* @type Boolean
* @private
*/
this.dynamic = true;
// chach that puppy!
this._sr = 0;
this._cr = 1;
// chach that puppy!
this._sr = 0;
this._cr = 1;
/*
* MOUSE Callbacks
*/
/*
* MOUSE Callbacks
*/
/**
* A callback that is used when the users clicks on the displayObject with their mouse
* @method click
* @param interactionData {InteractionData}
*/
/**
* A callback that is used when the users clicks on the displayObject with their mouse
* @method click
* @param interactionData {InteractionData}
*/
/**
* A callback that is used when the user clicks the mouse down over the sprite
* @method mousedown
* @param interactionData {InteractionData}
*/
/**
* A callback that is used when the user clicks the mouse down over the sprite
* @method mousedown
* @param interactionData {InteractionData}
*/
/**
* A callback that is used when the user releases the mouse that was over the displayObject
* for this callback to be fired the mouse must have been pressed down over the displayObject
* @method mouseup
* @param interactionData {InteractionData}
*/
/**
* A callback that is used when the user releases the mouse that was over the displayObject
* for this callback to be fired the mouse must have been pressed down over the displayObject
* @method mouseup
* @param interactionData {InteractionData}
*/
/**
* A callback that is used when the user releases the mouse that was over the displayObject but is no longer over the displayObject
* for this callback to be fired, The touch must have started over the displayObject
* @method mouseupoutside
* @param interactionData {InteractionData}
*/
/**
* A callback that is used when the user releases the mouse that was over the displayObject but is no longer over the displayObject
* for this callback to be fired, The touch must have started over the displayObject
* @method mouseupoutside
* @param interactionData {InteractionData}
*/
/**
* A callback that is used when the users mouse rolls over the displayObject
* @method mouseover
* @param interactionData {InteractionData}
*/
/**
* A callback that is used when the users mouse rolls over the displayObject
* @method mouseover
* @param interactionData {InteractionData}
*/
/**
* A callback that is used when the users mouse leaves the displayObject
* @method mouseout
* @param interactionData {InteractionData}
*/
/**
* A callback that is used when the users mouse leaves the displayObject
* @method mouseout
* @param interactionData {InteractionData}
*/
/*
* TOUCH Callbacks
*/
/*
* TOUCH Callbacks
*/
/**
* A callback that is used when the users taps on the sprite with their finger
* basically a touch version of click
* @method tap
* @param interactionData {InteractionData}
*/
/**
* A callback that is used when the users taps on the sprite with their finger
* basically a touch version of click
* @method tap
* @param interactionData {InteractionData}
*/
/**
* A callback that is used when the user touch's over the displayObject
* @method touchstart
* @param interactionData {InteractionData}
*/
/**
* A callback that is used when the user touch's over the displayObject
* @method touchstart
* @param interactionData {InteractionData}
*/
/**
* A callback that is used when the user releases a touch over the displayObject
* @method touchend
* @param interactionData {InteractionData}
*/
/**
* A callback that is used when the user releases a touch over the displayObject
* @method touchend
* @param interactionData {InteractionData}
*/
/**
* A callback that is used when the user releases the touch that was over the displayObject
* for this callback to be fired, The touch must have started over the sprite
* @method touchendoutside
* @param interactionData {InteractionData}
*/
/**
* A callback that is used when the user releases the touch that was over the displayObject
* for this callback to be fired, The touch must have started over the sprite
* @method touchendoutside
* @param interactionData {InteractionData}
*/
}
// constructor
@ -252,7 +252,7 @@ PIXI.DisplayObject.prototype.constructor = PIXI.DisplayObject;
*/
PIXI.DisplayObject.prototype.setInteractive = function(interactive)
{
this.interactive = interactive;
this.interactive = interactive;
}
/**
@ -267,11 +267,11 @@ Object.defineProperty(PIXI.DisplayObject.prototype, 'interactive', {
return this._interactive;
},
set: function(value) {
this._interactive = value;
this._interactive = value;
// TODO more to be done here..
// need to sort out a re-crawl!
if(this.stage)this.stage.dirty = true;
// TODO more to be done here..
// need to sort out a re-crawl!
if(this.stage)this.stage.dirty = true;
}
});
@ -293,11 +293,11 @@ Object.defineProperty(PIXI.DisplayObject.prototype, 'mask', {
if(value)
{
this.addFilter(value)
this.addFilter(value)
}
else
{
this.removeFilter();
this.removeFilter();
}
}
});
@ -311,93 +311,88 @@ Object.defineProperty(PIXI.DisplayObject.prototype, 'mask', {
*/
PIXI.DisplayObject.prototype.addFilter = function(mask)
{
if(this.filter)return;
this.filter = true;
if(this.filter)return;
this.filter = true;
// insert a filter block..
var start = new PIXI.FilterBlock();
var end = new PIXI.FilterBlock();
// insert a filter block..
var start = new PIXI.FilterBlock();
var end = new PIXI.FilterBlock();
start.mask = mask;
end.mask = mask;
start.mask = mask;
end.mask = mask;
start.first = start.last = this;
end.first = end.last = this;
start.first = start.last = this;
end.first = end.last = this;
start.open = true;
start.open = true;
/*
* insert start
*/
/*
* insert start
*/
var childFirst, childLast, nextObject, previousObject;
childFirst = childLast = start;
var childFirst = start
var childLast = start
var nextObject;
var previousObject;
previousObject = this.first._iPrev;
previousObject = this.first._iPrev;
if(previousObject)
{
nextObject = previousObject._iNext;
childFirst._iPrev = previousObject;
previousObject._iNext = childFirst;
}
else
{
nextObject = this;
}
if(previousObject)
{
nextObject = previousObject._iNext;
childFirst._iPrev = previousObject;
previousObject._iNext = childFirst;
}
else
{
nextObject = this;
}
if(nextObject)
{
nextObject._iPrev = childLast;
childLast._iNext = nextObject;
}
if(nextObject)
{
nextObject._iPrev = childLast;
childLast._iNext = nextObject;
}
// now insert the end filter block..
// now insert the end filter block..
/*
* insert end filter
*/
var childFirst = end
var childLast = end
var nextObject = null;
var previousObject = null;
/*
* insert end filter
*/
childFirst = childLast = end
nextObject = previousObject = null;
previousObject = this.last;
nextObject = previousObject._iNext;
previousObject = this.last;
nextObject = previousObject._iNext;
if(nextObject)
{
nextObject._iPrev = childLast;
childLast._iNext = nextObject;
}
if(nextObject)
{
nextObject._iPrev = childLast;
childLast._iNext = nextObject;
}
childFirst._iPrev = previousObject;
previousObject._iNext = childFirst;
childFirst._iPrev = previousObject;
previousObject._iNext = childFirst;
var updateLast = this;
var updateLast = this;
var prevLast = this.last;
while(updateLast)
{
if(updateLast.last == prevLast)
{
updateLast.last = end;
}
updateLast = updateLast.parent;
}
var prevLast = this.last;
while(updateLast)
{
if(updateLast.last == prevLast)
{
updateLast.last = end;
}
updateLast = updateLast.parent;
}
this.first = start;
this.first = start;
// if webGL...
if(this.__renderGroup)
{
this.__renderGroup.addFilterBlocks(start, end);
}
// if webGL...
if(this.__renderGroup)
{
this.__renderGroup.addFilterBlocks(start, end);
}
mask.renderable = false;
mask.renderable = false;
}
@ -409,49 +404,47 @@ PIXI.DisplayObject.prototype.addFilter = function(mask)
*/
PIXI.DisplayObject.prototype.removeFilter = function()
{
if(!this.filter)return;
this.filter = false;
if(!this.filter)return;
this.filter = false;
// modify the list..
var startBlock = this.first;
// modify the list..
var startBlock = this.first,
lastBlock = this.last,
nextObject = startBlock._iNext,
previousObject = startBlock._iPrev;
var nextObject = startBlock._iNext;
var previousObject = startBlock._iPrev;
if (nextObject) nextObject._iPrev = previousObject;
if (previousObject) previousObject._iNext = nextObject;
if(nextObject)nextObject._iPrev = previousObject;
if(previousObject)previousObject._iNext = nextObject;
this.first = startBlock._iNext;
this.first = startBlock._iNext;
// remove the end filter
var lastBlock = this.last;
// remove the end filter
nextObject = lastBlock._iNext;
previousObject = lastBlock._iPrev;
var nextObject = lastBlock._iNext;
var previousObject = lastBlock._iPrev;
if (nextObject) nextObject._iPrev = previousObject;
previousObject._iNext = nextObject;
if(nextObject)nextObject._iPrev = previousObject;
previousObject._iNext = nextObject;
// this is always true too!
var tempLast = lastBlock._iPrev;
// need to make sure the parents last is updated too
var updateLast = this;
while(updateLast.last == lastBlock)
{
updateLast.last = tempLast;
updateLast = updateLast.parent;
if(!updateLast)break;
}
// this is always true too!
var tempLast = lastBlock._iPrev;
// need to make sure the parents last is updated too
var updateLast = this;
while(updateLast.last == lastBlock)
{
updateLast.last = tempLast;
updateLast = updateLast.parent;
if(!updateLast)break;
}
var mask = startBlock.mask
mask.renderable = true;
var mask = startBlock.mask
mask.renderable = true;
// if webGL...
if(this.__renderGroup)
{
this.__renderGroup.removeFilterBlocks(startBlock, lastBlock);
}
// if webGL...
if(this.__renderGroup)
{
this.__renderGroup.removeFilterBlocks(startBlock, lastBlock);
}
}
/*
@ -462,27 +455,27 @@ PIXI.DisplayObject.prototype.removeFilter = function()
*/
PIXI.DisplayObject.prototype.updateTransform = function()
{
// TODO OPTIMIZE THIS!! with dirty
if(this.rotation !== this.rotationCache)
{
this.rotationCache = this.rotation;
this._sr = Math.sin(this.rotation);
this._cr = Math.cos(this.rotation);
}
// TODO OPTIMIZE THIS!! with dirty
if(this.rotation !== this.rotationCache)
{
this.rotationCache = this.rotation;
this._sr = Math.sin(this.rotation);
this._cr = Math.cos(this.rotation);
}
var localTransform = this.localTransform;
var parentTransform = this.parent.worldTransform;
var worldTransform = this.worldTransform;
//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;
var localTransform = this.localTransform;
var parentTransform = this.parent.worldTransform;
var worldTransform = this.worldTransform;
//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???
// TODO --> do we even need a local matrix???
var px = this.pivot.x;
var py = this.pivot.y;
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],
@ -491,8 +484,8 @@ PIXI.DisplayObject.prototype.updateTransform = function()
b00 = parentTransform[0], b01 = parentTransform[1], b02 = parentTransform[2],
b10 = parentTransform[3], b11 = parentTransform[4], b12 = parentTransform[5];
localTransform[2] = a02
localTransform[5] = a12
localTransform[2] = a02
localTransform[5] = a12
worldTransform[0] = b00 * a00 + b01 * a10;
worldTransform[1] = b00 * a01 + b01 * a11;
@ -502,11 +495,11 @@ PIXI.DisplayObject.prototype.updateTransform = function()
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;
// 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;
this.vcount = PIXI.visibleCount;
this.vcount = PIXI.visibleCount;
}

468
src/pixi/display/DisplayObjectContainer.js
View file

@ -13,16 +13,16 @@
*/
PIXI.DisplayObjectContainer = function()
{
PIXI.DisplayObject.call( this );
PIXI.DisplayObject.call( this );
/**
* [read-only] The of children of this container.
*
* @property children
* @type Array<DisplayObject>
* @readOnly
*/
this.children = [];
/**
* [read-only] The of children of this container.
*
* @property children
* @type Array<DisplayObject>
* @readOnly
*/
this.children = [];
}
// constructor
@ -49,83 +49,80 @@ Object.defineProperty(PIXI.DisplayObjectContainer.prototype, 'visible', {
*/
PIXI.DisplayObjectContainer.prototype.addChild = function(child)
{
if(child.parent != undefined)
{
if (child.parent) {
//// COULD BE THIS???
child.parent.removeChild(child);
// return;
}
child.parent = this;
//// COULD BE THIS???
child.parent.removeChild(child);
// return;
}
this.children.push(child);
child.parent = this;
// update the stage refference..
this.children.push(child);
if(this.stage)
{
var tmpChild = child;
do
{
if(tmpChild.interactive)this.stage.dirty = true;
tmpChild.stage = this.stage;
tmpChild = tmpChild._iNext;
}
while(tmpChild)
}
// update the stage refference..
// LINKED LIST //
if(this.stage)
{
var tmpChild = child;
do
{
if(tmpChild.interactive)this.stage.dirty = true;
tmpChild.stage = this.stage;
tmpChild = tmpChild._iNext;
}
while(tmpChild)
}
// modify the list..
var childFirst = child.first
var childLast = child.last;
var nextObject;
var previousObject;
// LINKED LIST //
// this could be wrong if there is a filter??
if(this.filter)
{
previousObject = this.last._iPrev;
}
else
{
previousObject = this.last;
}
// modify the list..
var childFirst = child.first
var childLast = child.last;
var nextObject;
var previousObject;
nextObject = previousObject._iNext;
// this could be wrong if there is a filter??
if(this.filter)
{
previousObject = this.last._iPrev;
}
else
{
previousObject = this.last;
}
// always true in this case
// need to make sure the parents last is updated too
var updateLast = this;
var prevLast = previousObject;
nextObject = previousObject._iNext;
while(updateLast)
{
if(updateLast.last == prevLast)
{
updateLast.last = child.last;
}
updateLast = updateLast.parent;
}
// always true in this case
// need to make sure the parents last is updated too
var updateLast = this;
var prevLast = previousObject;
if(nextObject)
{
nextObject._iPrev = childLast;
childLast._iNext = nextObject;
}
while(updateLast)
{
if(updateLast.last == prevLast)
{
updateLast.last = child.last;
}
updateLast = updateLast.parent;
}
childFirst._iPrev = previousObject;
previousObject._iNext = childFirst;
if(nextObject)
{
nextObject._iPrev = childLast;
childLast._iNext = nextObject;
}
childFirst._iPrev = previousObject;
previousObject._iNext = childFirst;
// need to remove any render groups..
if(this.__renderGroup)
{
// being used by a renderTexture.. if it exists then it must be from a render texture;
if(child.__renderGroup)child.__renderGroup.removeDisplayObjectAndChildren(child);
// add them to the new render group..
this.__renderGroup.addDisplayObjectAndChildren(child);
}
// need to remove any render groups..
if(this.__renderGroup)
{
// being used by a renderTexture.. if it exists then it must be from a render texture;
if(child.__renderGroup)child.__renderGroup.removeDisplayObjectAndChildren(child);
// add them to the new render group..
this.__renderGroup.addDisplayObjectAndChildren(child);
}
}
@ -138,82 +135,81 @@ PIXI.DisplayObjectContainer.prototype.addChild = function(child)
*/
PIXI.DisplayObjectContainer.prototype.addChildAt = function(child, index)
{
if(index >= 0 && index <= this.children.length)
{
if(child.parent != undefined)
{
child.parent.removeChild(child);
}
child.parent = this;
if(index >= 0 && index <= this.children.length)
{
if (child.parent) {
child.parent.removeChild(child);
}
child.parent = this;
if(this.stage)
{
var tmpChild = child;
do
{
if(tmpChild.interactive)this.stage.dirty = true;
tmpChild.stage = this.stage;
tmpChild = tmpChild._iNext;
}
while(tmpChild)
}
if(this.stage)
{
var tmpChild = child;
do
{
if(tmpChild.interactive)this.stage.dirty = true;
tmpChild.stage = this.stage;
tmpChild = tmpChild._iNext;
}
while(tmpChild)
}
// modify the list..
var childFirst = child.first;
var childLast = child.last;
var nextObject;
var previousObject;
// modify the list..
var childFirst = child.first;
var childLast = child.last;
var nextObject;
var previousObject;
if(index == this.children.length)
{
previousObject = this.last;
var updateLast = this;
var prevLast = this.last;
while(updateLast)
{
if(updateLast.last == prevLast)
{
updateLast.last = child.last;
}
updateLast = updateLast.parent;
}
}
else if(index == 0)
{
previousObject = this;
}
else
{
previousObject = this.children[index-1].last;
}
if(index === this.children.length)
{
previousObject = this.last;
var updateLast = this;
var prevLast = this.last;
while(updateLast)
{
if(updateLast.last == prevLast)
{
updateLast.last = child.last;
}
updateLast = updateLast.parent;
}
}
else if(!index)
{
previousObject = this;
}
else
{
previousObject = this.children[index-1].last;
}
nextObject = previousObject._iNext;
nextObject = previousObject._iNext;
// always true in this case
if(nextObject)
{
nextObject._iPrev = childLast;
childLast._iNext = nextObject;
}
// always true in this case
if(nextObject)
{
nextObject._iPrev = childLast;
childLast._iNext = nextObject;
}
childFirst._iPrev = previousObject;
previousObject._iNext = childFirst;
childFirst._iPrev = previousObject;
previousObject._iNext = childFirst;
this.children.splice(index, 0, child);
// need to remove any render groups..
if(this.__renderGroup)
{
// being used by a renderTexture.. if it exists then it must be from a render texture;
if(child.__renderGroup)child.__renderGroup.removeDisplayObjectAndChildren(child);
// add them to the new render group..
this.__renderGroup.addDisplayObjectAndChildren(child);
}
this.children.splice(index, 0, child);
// need to remove any render groups..
if(this.__renderGroup)
{
// being used by a renderTexture.. if it exists then it must be from a render texture;
if(child.__renderGroup)child.__renderGroup.removeDisplayObjectAndChildren(child);
// add them to the new render group..
this.__renderGroup.addDisplayObjectAndChildren(child);
}
}
else
{
throw new Error(child + " The index "+ index +" supplied is out of bounds " + this.children.length);
}
}
else
{
throw new Error(child + " The index "+ index +" supplied is out of bounds " + this.children.length);
}
}
/**
@ -226,43 +222,43 @@ PIXI.DisplayObjectContainer.prototype.addChildAt = function(child, index)
*/
PIXI.DisplayObjectContainer.prototype.swapChildren = function(child, child2)
{
/*
* this funtion needs to be recoded..
* can be done a lot faster..
*/
return;
/*
* this funtion needs to be recoded..
* can be done a lot faster..
*/
return;
// need to fix this function :/
/*
// TODO I already know this??
var index = this.children.indexOf( child );
var index2 = this.children.indexOf( child2 );
// need to fix this function :/
/*
// TODO I already know this??
var index = this.children.indexOf( child );
var index2 = this.children.indexOf( child2 );
if ( index !== -1 && index2 !== -1 )
{
// cool
if ( index !== -1 && index2 !== -1 )
{
// cool
/*
if(this.stage)
{
// this is to satisfy the webGL batching..
// TODO sure there is a nicer way to achieve this!
this.stage.__removeChild(child);
this.stage.__removeChild(child2);
/*
if(this.stage)
{
// this is to satisfy the webGL batching..
// TODO sure there is a nicer way to achieve this!
this.stage.__removeChild(child);
this.stage.__removeChild(child2);
this.stage.__addChild(child);
this.stage.__addChild(child2);
}
this.stage.__addChild(child);
this.stage.__addChild(child2);
}
// swap the positions..
this.children[index] = child2;
this.children[index2] = child;
// swap the positions..
this.children[index] = child2;
this.children[index2] = child;
}
else
{
throw new Error(child + " Both the supplied DisplayObjects must be a child of the caller " + this);
}*/
}
else
{
throw new Error(child + " Both the supplied DisplayObjects must be a child of the caller " + this);
}*/
}
/**
@ -273,14 +269,14 @@ PIXI.DisplayObjectContainer.prototype.swapChildren = function(child, child2)
*/
PIXI.DisplayObjectContainer.prototype.getChildAt = function(index)
{
if(index >= 0 && index < this.children.length)
{
return this.children[index];
}
else
{
throw new Error(child + " Both the supplied DisplayObjects must be a child of the caller " + this);
}
if(index >= 0 && index < this.children.length)
{
return this.children[index];
}
else
{
throw new Error(child + " Both the supplied DisplayObjects must be a child of the caller " + this);
}
}
/**
@ -291,62 +287,62 @@ PIXI.DisplayObjectContainer.prototype.getChildAt = function(index)
*/
PIXI.DisplayObjectContainer.prototype.removeChild = function(child)
{
var index = this.children.indexOf( child );
if ( index !== -1 )
{
// unlink //
// modify the list..
var childFirst = child.first;
var childLast = child.last;
var index = this.children.indexOf( child );
if ( index !== -1 )
{
// unlink //
// modify the list..
var childFirst = child.first;
var childLast = child.last;
var nextObject = childLast._iNext;
var previousObject = childFirst._iPrev;
var nextObject = childLast._iNext;
var previousObject = childFirst._iPrev;
if(nextObject)nextObject._iPrev = previousObject;
previousObject._iNext = nextObject;
if(nextObject)nextObject._iPrev = previousObject;
previousObject._iNext = nextObject;
if(this.last == childLast)
{
var tempLast = childFirst._iPrev;
// need to make sure the parents last is updated too
var updateLast = this;
while(updateLast.last == childLast.last)
{
updateLast.last = tempLast;
updateLast = updateLast.parent;
if(!updateLast)break;
}
}
if(this.last == childLast)
{
var tempLast = childFirst._iPrev;
// need to make sure the parents last is updated too
var updateLast = this;
while(updateLast.last == childLast.last)
{
updateLast.last = tempLast;
updateLast = updateLast.parent;
if(!updateLast)break;
}
}
childLast._iNext = null;
childFirst._iPrev = null;
childLast._iNext = null;
childFirst._iPrev = null;
// update the stage reference..
if(this.stage)
{
var tmpChild = child;
do
{
if(tmpChild.interactive)this.stage.dirty = true;
tmpChild.stage = null;
tmpChild = tmpChild._iNext;
}
while(tmpChild)
}
// update the stage reference..
if(this.stage)
{
var tmpChild = child;
do
{
if(tmpChild.interactive)this.stage.dirty = true;
tmpChild.stage = null;
tmpChild = tmpChild._iNext;
}
while(tmpChild)
}
// webGL trim
if(child.__renderGroup)
{
child.__renderGroup.removeDisplayObjectAndChildren(child);
}
// webGL trim
if(child.__renderGroup)
{
child.__renderGroup.removeDisplayObjectAndChildren(child);
}
child.parent = undefined;
this.children.splice( index, 1 );
}
else
{
throw new Error(child + " The supplied DisplayObject must be a child of the caller " + this);
}
child.parent = undefined;
this.children.splice( index, 1 );
}
else
{
throw new Error(child + " The supplied DisplayObject must be a child of the caller " + this);
}
}
/*
@ -357,12 +353,12 @@ PIXI.DisplayObjectContainer.prototype.removeChild = function(child)
*/
PIXI.DisplayObjectContainer.prototype.updateTransform = function()
{
if(!this.visible)return;
if(!this.visible)return;
PIXI.DisplayObject.prototype.updateTransform.call( this );
PIXI.DisplayObject.prototype.updateTransform.call( this );
for(var i=0,j=this.children.length; i<j; i++)
{
this.children[i].updateTransform();
}
for(var i=0,j=this.children.length; i<j; i++)
{
this.children[i].updateTransform();
}
}

144
src/pixi/display/MovieClip.js
View file

@ -12,60 +12,60 @@
*/
PIXI.MovieClip = function(textures)
{
PIXI.Sprite.call(this, textures[0]);
PIXI.Sprite.call(this, textures[0]);
/**
* The array of textures that make up the animation
*
* @property textures
* @type Array
*/
this.textures = textures;
/**
* The array of textures that make up the animation
*
* @property textures
* @type Array
*/
this.textures = textures;
/**
* The speed that the MovieClip will play at. Higher is faster, lower is slower
*
* @property animationSpeed
* @type Number
* @default 1
*/
this.animationSpeed = 1;
/**
* The speed that the MovieClip will play at. Higher is faster, lower is slower
*
* @property animationSpeed
* @type Number
* @default 1
*/
this.animationSpeed = 1;
/**
* Whether or not the movie clip repeats after playing.
*
* @property loop
* @type Boolean
* @default true
*/
this.loop = true;
/**
* Whether or not the movie clip repeats after playing.
*
* @property loop
* @type Boolean
* @default true
*/
this.loop = true;
/**
* Function to call when a MovieClip finishes playing
*
* @property onComplete
* @type Function
*/
this.onComplete = null;
/**
* Function to call when a MovieClip finishes playing
*
* @property onComplete
* @type Function
*/
this.onComplete = null;
/**
* [read-only] The index MovieClips current frame (this may not have to be a whole number)
*
* @property currentFrame
* @type Number
* @default 0
* @readOnly
*/
this.currentFrame = 0;
/**
* [read-only] The index MovieClips current frame (this may not have to be a whole number)
*
* @property currentFrame
* @type Number
* @default 0
* @readOnly
*/
this.currentFrame = 0;
/**
* [read-only] Indicates if the MovieClip is currently playing
*
* @property playing
* @type Boolean
* @readOnly
*/
this.playing = false;
/**
* [read-only] Indicates if the MovieClip is currently playing
*
* @property playing
* @type Boolean
* @readOnly
*/
this.playing = false;
}
// constructor
@ -96,7 +96,7 @@ Object.defineProperty( PIXI.MovieClip.prototype, 'totalFrames', {
*/
PIXI.MovieClip.prototype.stop = function()
{
this.playing = false;
this.playing = false;
}
/**
@ -106,7 +106,7 @@ PIXI.MovieClip.prototype.stop = function()
*/
PIXI.MovieClip.prototype.play = function()
{
this.playing = true;
this.playing = true;
}
/**
@ -117,10 +117,10 @@ PIXI.MovieClip.prototype.play = function()
*/
PIXI.MovieClip.prototype.gotoAndStop = function(frameNumber)
{
this.playing = false;
this.currentFrame = frameNumber;
var round = (this.currentFrame + 0.5) | 0;
this.setTexture(this.textures[round % this.textures.length]);
this.playing = false;
this.currentFrame = frameNumber;
var round = (this.currentFrame + 0.5) | 0;
this.setTexture(this.textures[round % this.textures.length]);
}
/**
@ -131,8 +131,8 @@ PIXI.MovieClip.prototype.gotoAndStop = function(frameNumber)
*/
PIXI.MovieClip.prototype.gotoAndPlay = function(frameNumber)
{
this.currentFrame = frameNumber;
this.playing = true;
this.currentFrame = frameNumber;
this.playing = true;
}
/*
@ -143,24 +143,24 @@ PIXI.MovieClip.prototype.gotoAndPlay = function(frameNumber)
*/
PIXI.MovieClip.prototype.updateTransform = function()
{
PIXI.Sprite.prototype.updateTransform.call(this);
PIXI.Sprite.prototype.updateTransform.call(this);
if(!this.playing)return;
if(!this.playing)return;
this.currentFrame += this.animationSpeed;
this.currentFrame += this.animationSpeed;
var round = (this.currentFrame + 0.5) | 0;
var round = (this.currentFrame + 0.5) | 0;
if(this.loop || round < this.textures.length)
{
this.setTexture(this.textures[round % this.textures.length]);
}
else if(round >= this.textures.length)
{
this.gotoAndStop(this.textures.length - 1);
if(this.onComplete)
{
this.onComplete();
}
}
if(this.loop || round < this.textures.length)
{
this.setTexture(this.textures[round % this.textures.length]);
}
else if(round >= this.textures.length)
{
this.gotoAndStop(this.textures.length - 1);
if(this.onComplete)
{
this.onComplete();
}
}
}

152
src/pixi/display/Sprite.js
View file

@ -18,65 +18,65 @@ PIXI.blendModes.SCREEN = 1;
*/
PIXI.Sprite = function(texture)
{
PIXI.DisplayObjectContainer.call( this );
PIXI.DisplayObjectContainer.call( this );
/**
* The anchor sets the origin point of the texture.
* The default is 0,0 this means the textures origin is the top left
* Setting than anchor to 0.5,0.5 means the textures origin is centered
* Setting the anchor to 1,1 would mean the textures origin points will be the bottom right
*
/**
* The anchor sets the origin point of the texture.
* The default is 0,0 this means the textures origin is the top left
* Setting than anchor to 0.5,0.5 means the textures origin is centered
* Setting the anchor to 1,1 would mean the textures origin points will be the bottom right
*
* @property anchor
* @type Point
*/
this.anchor = new PIXI.Point();
this.anchor = new PIXI.Point();
/**
* The texture that the sprite is using
*
* @property texture
* @type Texture
*/
this.texture = texture;
/**
* The texture that the sprite is using
*
* @property texture
* @type Texture
*/
this.texture = texture;
/**
* The blend mode of sprite.
* currently supports PIXI.blendModes.NORMAL and PIXI.blendModes.SCREEN
*
* @property blendMode
* @type Number
*/
this.blendMode = PIXI.blendModes.NORMAL;
/**
* The blend mode of sprite.
* currently supports PIXI.blendModes.NORMAL and PIXI.blendModes.SCREEN
*
* @property blendMode
* @type Number
*/
this.blendMode = PIXI.blendModes.NORMAL;
/**
* The width of the sprite (this is initially set by the texture)
*
* @property _width
* @type Number
* @private
*/
this._width = 0;
/**
* The width of the sprite (this is initially set by the texture)
*
* @property _width
* @type Number
* @private
*/
this._width = 0;
/**
* The height of the sprite (this is initially set by the texture)
*
* @property _height
* @type Number
* @private
*/
this._height = 0;
/**
* The height of the sprite (this is initially set by the texture)
*
* @property _height
* @type Number
* @private
*/
this._height = 0;
if(texture.baseTexture.hasLoaded)
{
this.updateFrame = true;
}
else
{
this.onTextureUpdateBind = this.onTextureUpdate.bind(this);
this.texture.addEventListener( 'update', this.onTextureUpdateBind );
}
if(texture.baseTexture.hasLoaded)
{
this.updateFrame = true;
}
else
{
this.onTextureUpdateBind = this.onTextureUpdate.bind(this);
this.texture.addEventListener( 'update', this.onTextureUpdateBind );
}
this.renderable = true;
this.renderable = true;
}
// constructor
@ -94,7 +94,7 @@ Object.defineProperty(PIXI.Sprite.prototype, 'width', {
return this.scale.x * this.texture.frame.width;
},
set: function(value) {
this.scale.x = value / this.texture.frame.width
this.scale.x = value / this.texture.frame.width
this._width = value;
}
});
@ -110,7 +110,7 @@ Object.defineProperty(PIXI.Sprite.prototype, 'height', {
return this.scale.y * this.texture.frame.height;
},
set: function(value) {
this.scale.y = value / this.texture.frame.height
this.scale.y = value / this.texture.frame.height
this._height = value;
}
});
@ -123,23 +123,23 @@ Object.defineProperty(PIXI.Sprite.prototype, 'height', {
*/
PIXI.Sprite.prototype.setTexture = function(texture)
{
// stop current texture;
if(this.texture.baseTexture != texture.baseTexture)
{
this.textureChange = true;
this.texture = texture;
// stop current texture;
if(this.texture.baseTexture != texture.baseTexture)
{
this.textureChange = true;
this.texture = texture;
if(this.__renderGroup)
{
this.__renderGroup.updateTexture(this);
}
}
else
{
this.texture = texture;
}
if(this.__renderGroup)
{
this.__renderGroup.updateTexture(this);
}
}
else
{
this.texture = texture;
}
this.updateFrame = true;
this.updateFrame = true;
}
/**
@ -151,13 +151,13 @@ PIXI.Sprite.prototype.setTexture = function(texture)
*/
PIXI.Sprite.prototype.onTextureUpdate = function(event)
{
//this.texture.removeEventListener( 'update', this.onTextureUpdateBind );
//this.texture.removeEventListener( 'update', this.onTextureUpdateBind );
// so if _width is 0 then width was not set..
if(this._width)this.scale.x = this._width / this.texture.frame.width;
if(this._height)this.scale.y = this._height / this.texture.frame.height;
// so if _width is 0 then width was not set..
if(this._width)this.scale.x = this._width / this.texture.frame.width;
if(this._height)this.scale.y = this._height / this.texture.frame.height;
this.updateFrame = true;
this.updateFrame = true;
}
// some helper functions..
@ -174,9 +174,9 @@ PIXI.Sprite.prototype.onTextureUpdate = function(event)
*/
PIXI.Sprite.fromFrame = function(frameId)
{
var texture = PIXI.TextureCache[frameId];
if(!texture)throw new Error("The frameId '"+ frameId +"' does not exist in the texture cache" + this);
return new PIXI.Sprite(texture);
var texture = PIXI.TextureCache[frameId];
if(!texture)throw new Error("The frameId '"+ frameId +"' does not exist in the texture cache" + this);
return new PIXI.Sprite(texture);
}
/**
@ -191,7 +191,7 @@ PIXI.Sprite.fromFrame = function(frameId)
*/
PIXI.Sprite.fromImage = function(imageId)
{
var texture = PIXI.Texture.fromImage(imageId);
return new PIXI.Sprite(texture);
var texture = PIXI.Texture.fromImage(imageId);
return new PIXI.Sprite(texture);
}

124
src/pixi/display/Stage.js
View file

@ -9,58 +9,58 @@
* @extends DisplayObjectContainer
* @constructor
* @param backgroundColor {Number} the background color of the stage, easiest way to pass this in is in hex format
* like: 0xFFFFFF for white
* like: 0xFFFFFF for white
*/
PIXI.Stage = function(backgroundColor)
{
PIXI.DisplayObjectContainer.call( this );
PIXI.DisplayObjectContainer.call( this );
/**
* [read-only] Current transform of the object based on world (parent) factors
*
* @property worldTransform
* @type Mat3
* @readOnly
* @private
*/
this.worldTransform = PIXI.mat3.create();
/**
* [read-only] Current transform of the object based on world (parent) factors
*
* @property worldTransform
* @type Mat3
* @readOnly
* @private
*/
this.worldTransform = PIXI.mat3.create();
/**
* Whether or not the stage is interactive
*
* @property interactive
* @type Boolean
*/
this.interactive = true;
/**
* Whether or not the stage is interactive
*
* @property interactive
* @type Boolean
*/
this.interactive = true;
/**
* The interaction manage for this stage, manages all interactive activity on the stage
*
* @property interactive
* @type InteractionManager
*/
this.interactionManager = new PIXI.InteractionManager(this);
/**
* The interaction manage for this stage, manages all interactive activity on the stage
*
* @property interactive
* @type InteractionManager
*/
this.interactionManager = new PIXI.InteractionManager(this);
/**
* Whether the stage is dirty and needs to have interactions updated
*
* @property dirty
* @type Boolean
* @private
*/
this.dirty = true;
/**
* Whether the stage is dirty and needs to have interactions updated
*
* @property dirty
* @type Boolean
* @private
*/
this.dirty = true;
this.__childrenAdded = [];
this.__childrenRemoved = [];
this.__childrenAdded = [];
this.__childrenRemoved = [];
//the stage is it's own stage
this.stage = this;
//the stage is it's own stage
this.stage = this;
//optimize hit detection a bit
this.stage.hitArea = new PIXI.Rectangle(0,0,100000, 100000);
//optimize hit detection a bit
this.stage.hitArea = new PIXI.Rectangle(0,0,100000, 100000);
this.setBackgroundColor(backgroundColor);
this.worldVisible = true;
this.setBackgroundColor(backgroundColor);
this.worldVisible = true;
}
// constructor
@ -76,7 +76,7 @@ PIXI.Stage.prototype.constructor = PIXI.Stage;
*/
PIXI.Stage.prototype.setInteractionDelegate = function(domElement)
{
this.interactionManager.setTargetDomElement( domElement );
this.interactionManager.setTargetDomElement( domElement );
}
/*
@ -87,23 +87,23 @@ PIXI.Stage.prototype.setInteractionDelegate = function(domElement)
*/
PIXI.Stage.prototype.updateTransform = function()
{
this.worldAlpha = 1;
this.vcount = PIXI.visibleCount;
this.worldAlpha = 1;
this.vcount = PIXI.visibleCount;
for(var i=0,j=this.children.length; i<j; i++)
{
this.children[i].updateTransform();
}
for(var i=0,j=this.children.length; i<j; i++)
{
this.children[i].updateTransform();
}
if(this.dirty)
{
this.dirty = false;
// update interactive!
this.interactionManager.dirty = true;
}
if(this.dirty)
{
this.dirty = false;
// update interactive!
this.interactionManager.dirty = true;
}
if(this.interactive)this.interactionManager.update();
if(this.interactive)this.interactionManager.update();
}
/**
@ -111,15 +111,15 @@ PIXI.Stage.prototype.updateTransform = function()
*
* @method setBackgroundColor
* @param backgroundColor {Number} the color of the background, easiest way to pass this in is in hex format
* like: 0xFFFFFF for white
* like: 0xFFFFFF for white
*/
PIXI.Stage.prototype.setBackgroundColor = function(backgroundColor)
{
this.backgroundColor = backgroundColor || 0x000000;
this.backgroundColorSplit = HEXtoRGB(this.backgroundColor);
var hex = this.backgroundColor.toString(16);
hex = "000000".substr(0, 6 - hex.length) + hex;
this.backgroundColorString = "#" + hex;
this.backgroundColor = backgroundColor || 0x000000;
this.backgroundColorSplit = hex2rgb(this.backgroundColor);
var hex = this.backgroundColor.toString(16);
hex = "000000".substr(0, 6 - hex.length) + hex;
this.backgroundColorString = "#" + hex;
}
/**
@ -130,5 +130,5 @@ PIXI.Stage.prototype.setBackgroundColor = function(backgroundColor)
*/
PIXI.Stage.prototype.getMousePosition = function()
{
return this.interactionManager.mouse.global;
return this.interactionManager.mouse.global;
}

10
src/pixi/extras/CustomRenderable.js
View file

@ -12,7 +12,7 @@
*/
PIXI.CustomRenderable = function()
{
PIXI.DisplayObject.call( this );
PIXI.DisplayObject.call( this );
}
@ -28,7 +28,7 @@ PIXI.CustomRenderable.prototype.constructor = PIXI.CustomRenderable;
*/
PIXI.CustomRenderable.prototype.renderCanvas = function(renderer)
{
// override!
// override!
}
/**
@ -39,7 +39,7 @@ PIXI.CustomRenderable.prototype.renderCanvas = function(renderer)
*/
PIXI.CustomRenderable.prototype.initWebGL = function(renderer)
{
// override!
// override!
}
/**
@ -50,7 +50,7 @@ PIXI.CustomRenderable.prototype.initWebGL = function(renderer)
*/
PIXI.CustomRenderable.prototype.renderWebGL = function(renderGroup, projectionMatrix)
{
// not sure if both needed? but ya have for now!
// override!
// not sure if both needed? but ya have for now!
// override!
}

222
src/pixi/extras/Rope.js
View file

@ -5,26 +5,26 @@
PIXI.Rope = function(texture, points)
{
PIXI.Strip.call( this, texture );
this.points = points;
PIXI.Strip.call( this, texture );
this.points = points;
try
{
this.verticies = new Float32Array( points.length * 4);
this.uvs = new Float32Array( points.length * 4);
this.colors = new Float32Array( points.length * 2);
this.indices = new Uint16Array( points.length * 2);
}
catch(error)
{
this.verticies = verticies
try
{
this.verticies = new Float32Array( points.length * 4);
this.uvs = new Float32Array( points.length * 4);
this.colors = new Float32Array( points.length * 2);
this.indices = new Uint16Array( points.length * 2);
}
catch(error)
{
this.verticies = verticies
this.uvs = uvs
this.colors = colors
this.indices = indices
}
this.uvs = uvs
this.colors = colors
this.indices = indices
}
this.refresh();
this.refresh();
}
@ -34,140 +34,138 @@ PIXI.Rope.prototype.constructor = PIXI.Rope;
PIXI.Rope.prototype.refresh = function()
{
var points = this.points;
if(points.length < 1)return;
var points = this.points;
if(points.length < 1)return;
var uvs = this.uvs
var indices = this.indices;
var colors = this.colors;
var uvs = this.uvs
var indices = this.indices;
var colors = this.colors;
var lastPoint = points[0];
var nextPoint;
var perp = {x:0, y:0};
var point = points[0];
var lastPoint = points[0];
var nextPoint;
var perp = {x:0, y:0};
this.count-=0.2;
this.count-=0.2;
uvs[0] = 0
uvs[1] = 1
uvs[2] = 0
uvs[3] = 1
uvs[0] = 0
uvs[1] = 1
uvs[2] = 0
uvs[3] = 1
colors[0] = 1;
colors[1] = 1;
colors[0] = 1;
colors[1] = 1;
indices[0] = 0;
indices[1] = 1;
indices[0] = 0;
indices[1] = 1;
var total = points.length;
var total = points.length,
point, index, amount;
for (var i = 1; i < total; i++)
{
for (var i = 1; i < total; i++)
{
var point = points[i];
var index = i * 4;
// time to do some smart drawing!
var amount = i/(total-1)
point = points[i];
index = i * 4;
// time to do some smart drawing!
amount = i/(total-1)
if(i%2)
{
uvs[index] = amount;
uvs[index+1] = 0;
if(i%2)
{
uvs[index] = amount;
uvs[index+1] = 0;
uvs[index+2] = amount
uvs[index+3] = 1
uvs[index+2] = amount
uvs[index+3] = 1
}
else
{
uvs[index] = amount
uvs[index+1] = 0
}
else
{
uvs[index] = amount
uvs[index+1] = 0
uvs[index+2] = amount
uvs[index+3] = 1
}
uvs[index+2] = amount
uvs[index+3] = 1
}
index = i * 2;
colors[index] = 1;
colors[index+1] = 1;
index = i * 2;
colors[index] = 1;
colors[index+1] = 1;
index = i * 2;
indices[index] = index;
indices[index + 1] = index + 1;
index = i * 2;
indices[index] = index;
indices[index + 1] = index + 1;
lastPoint = point;
}
lastPoint = point;
}
}
PIXI.Rope.prototype.updateTransform = function()
{
var points = this.points;
if(points.length < 1)return;
var points = this.points;
if(points.length < 1)return;
var verticies = this.verticies
var lastPoint = points[0];
var nextPoint;
var perp = {x:0, y:0};
var lastPoint = points[0];
var nextPoint;
var perp = {x:0, y:0};
var point = points[0];
this.count-=0.2;
this.count-=0.2;
var verticies = this.verticies;
verticies[0] = lastPoint.x + perp.x
verticies[1] = lastPoint.y + perp.y //+ 200
verticies[2] = lastPoint.x - perp.x
verticies[3] = lastPoint.y - perp.y//+200
// time to do some smart drawing!
verticies[0] = point.x + perp.x
verticies[1] = point.y + perp.y //+ 200
verticies[2] = point.x - perp.x
verticies[3] = point.y - perp.y//+200
// time to do some smart drawing!
var total = points.length,
point, index, ratio, perpLength, num;
var total = points.length;
for (var i = 1; i < total; i++)
{
point = points[i];
index = i * 4;
for (var i = 1; i < total; i++)
{
if(i < points.length-1)
{
nextPoint = points[i+1];
}
else
{
nextPoint = point;
}
var point = points[i];
var index = i * 4;
perp.y = -(nextPoint.x - lastPoint.x);
perp.x = nextPoint.y - lastPoint.y;
if(i < points.length-1)
{
nextPoint = points[i+1];
}
else
{
nextPoint = point
}
ratio = (1 - (i / (total-1))) * 10;
if(ratio > 1)ratio = 1;
perp.y = -(nextPoint.x - lastPoint.x);
perp.x = nextPoint.y - lastPoint.y;
perpLength = Math.sqrt(perp.x * perp.x + perp.y * perp.y);
num = this.texture.height/2//(20 + Math.abs(Math.sin((i + this.count) * 0.3) * 50) )* ratio;
perp.x /= perpLength;
perp.y /= perpLength;
var ratio = (1 - (i / (total-1))) * 10;
if(ratio > 1)ratio = 1;
perp.x *= num;
perp.y *= num;
var perpLength = Math.sqrt(perp.x * perp.x + perp.y * perp.y);
var num = this.texture.height/2//(20 + Math.abs(Math.sin((i + this.count) * 0.3) * 50) )* ratio;
perp.x /= perpLength;
perp.y /= perpLength;
verticies[index] = point.x + perp.x
verticies[index+1] = point.y + perp.y
verticies[index+2] = point.x - perp.x
verticies[index+3] = point.y - perp.y
perp.x *= num;
perp.y *= num;
lastPoint = point;
}
verticies[index] = point.x + perp.x
verticies[index+1] = point.y + perp.y
verticies[index+2] = point.x - perp.x
verticies[index+3] = point.y - perp.y
lastPoint = point;
}
PIXI.DisplayObjectContainer.prototype.updateTransform.call( this );
PIXI.DisplayObjectContainer.prototype.updateTransform.call( this );
}
PIXI.Rope.prototype.setTexture = function(texture)
{
// stop current texture
this.texture = texture;
this.updateFrame = true;
// stop current texture
this.texture = texture;
this.updateFrame = true;
}

2827
src/pixi/extras/Spine.js
View file

File diff suppressed because it is too large Load diff

110
src/pixi/extras/Strip.js
View file

@ -4,65 +4,65 @@
PIXI.Strip = function(texture, width, height)
{
PIXI.DisplayObjectContainer.call( this );
this.texture = texture;
this.blendMode = PIXI.blendModes.NORMAL;
PIXI.DisplayObjectContainer.call( this );
this.texture = texture;
this.blendMode = PIXI.blendModes.NORMAL;
try
{
this.uvs = new Float32Array([0, 1,
1, 1,
1, 0, 0,1]);
try
{
this.uvs = new Float32Array([0, 1,
1, 1,
1, 0, 0,1]);
this.verticies = new Float32Array([0, 0,
0,0,
0,0, 0,
0, 0]);
this.verticies = new Float32Array([0, 0,
0,0,
0,0, 0,
0, 0]);
this.colors = new Float32Array([1, 1, 1, 1]);
this.colors = new Float32Array([1, 1, 1, 1]);
this.indices = new Uint16Array([0, 1, 2, 3]);
}
catch(error)
{
this.uvs = [0, 1,
1, 1,
1, 0, 0,1];
this.indices = new Uint16Array([0, 1, 2, 3]);
}
catch(error)
{
this.uvs = [0, 1,
1, 1,
1, 0, 0,1];
this.verticies = [0, 0,
0,0,
0,0, 0,
0, 0];
this.verticies = [0, 0,
0,0,
0,0, 0,
0, 0];
this.colors = [1, 1, 1, 1];
this.colors = [1, 1, 1, 1];
this.indices = [0, 1, 2, 3];
}
this.indices = [0, 1, 2, 3];
}
/*
this.uvs = new Float32Array()
this.verticies = new Float32Array()
this.colors = new Float32Array()
this.indices = new Uint16Array()
/*
this.uvs = new Float32Array()
this.verticies = new Float32Array()
this.colors = new Float32Array()
this.indices = new Uint16Array()
*/
this.width = width;
this.height = height;
this.width = width;
this.height = height;
// load the texture!
if(texture.baseTexture.hasLoaded)
{
this.width = this.texture.frame.width;
this.height = this.texture.frame.height;
this.updateFrame = true;
}
else
{
this.onTextureUpdateBind = this.onTextureUpdate.bind(this);
this.texture.addEventListener( 'update', this.onTextureUpdateBind );
}
// load the texture!
if(texture.baseTexture.hasLoaded)
{
this.width = this.texture.frame.width;
this.height = this.texture.frame.height;
this.updateFrame = true;
}
else
{
this.onTextureUpdateBind = this.onTextureUpdate.bind(this);
this.texture.addEventListener( 'update', this.onTextureUpdateBind );
}
this.renderable = true;
this.renderable = true;
}
// constructor
@ -71,19 +71,19 @@ PIXI.Strip.prototype.constructor = PIXI.Strip;
PIXI.Strip.prototype.setTexture = function(texture)
{
//TODO SET THE TEXTURES
//TODO VISIBILITY
//TODO SET THE TEXTURES
//TODO VISIBILITY
// stop current texture
this.texture = texture;
this.width = texture.frame.width;
this.height = texture.frame.height;
this.updateFrame = true;
// stop current texture
this.texture = texture;
this.width = texture.frame.width;
this.height = texture.frame.height;
this.updateFrame = true;
}
PIXI.Strip.prototype.onTextureUpdate = function(event)
{
this.updateFrame = true;
this.updateFrame = true;
}
// some helper functions..

88
src/pixi/extras/TilingSprite.js
View file

@ -14,51 +14,51 @@
*/
PIXI.TilingSprite = function(texture, width, height)
{
PIXI.DisplayObjectContainer.call( this );
PIXI.DisplayObjectContainer.call( this );
/**
* The texture that the sprite is using
*
* @property texture
* @type Texture
*/
this.texture = texture;
/**
* The texture that the sprite is using
*
* @property texture
* @type Texture
*/
this.texture = texture;
/**
* The width of the tiling sprite
*
* @property width
* @type Number
*/
this.width = width;
/**
* The width of the tiling sprite
*
* @property width
* @type Number
*/
this.width = width;
/**
* The height of the tiling sprite
*
* @property height
* @type Number
*/
this.height = height;
/**
* The height of the tiling sprite
*
* @property height
* @type Number
*/
this.height = height;
/**
* The scaling of the image that is being tiled
*
* @property tileScale
* @type Point
*/
this.tileScale = new PIXI.Point(1,1);
/**
* The scaling of the image that is being tiled
*
* @property tileScale
* @type Point
*/
this.tileScale = new PIXI.Point(1,1);
/**
* The offset position of the image that is being tiled
*
* @property tilePosition
* @type Point
*/
this.tilePosition = new PIXI.Point(0,0);
/**
* The offset position of the image that is being tiled
*
* @property tilePosition
* @type Point
*/
this.tilePosition = new PIXI.Point(0,0);
this.renderable = true;
this.renderable = true;
this.blendMode = PIXI.blendModes.NORMAL
this.blendMode = PIXI.blendModes.NORMAL
}
// constructor
@ -73,12 +73,12 @@ PIXI.TilingSprite.prototype.constructor = PIXI.TilingSprite;
*/
PIXI.TilingSprite.prototype.setTexture = function(texture)
{
//TODO SET THE TEXTURES
//TODO VISIBILITY
//TODO SET THE TEXTURES
//TODO VISIBILITY
// stop current texture
this.texture = texture;
this.updateFrame = true;
// stop current texture
this.texture = texture;
this.updateFrame = true;
}
/**
@ -90,6 +90,6 @@ PIXI.TilingSprite.prototype.setTexture = function(texture)
*/
PIXI.TilingSprite.prototype.onTextureUpdate = function(event)
{
this.updateFrame = true;
this.updateFrame = true;
}

6
src/pixi/filters/FilterBlock.js
View file

@ -6,8 +6,8 @@
PIXI.FilterBlock = function(mask)
{
this.graphics = mask
this.visible = true;
this.renderable = true;
this.graphics = mask
this.visible = true;
this.renderable = true;
}

4
src/pixi/filters/MaskFilter.js
View file

@ -6,7 +6,7 @@
PIXI.MaskFilter = function(graphics)
{
// the graphics data that will be used for filtering
this.graphics;
// the graphics data that will be used for filtering
this.graphics;
}

57
src/pixi/loaders/AssetLoader.js
View file

@ -20,15 +20,15 @@
*/
PIXI.AssetLoader = function(assetURLs, crossorigin)
{
PIXI.EventTarget.call(this);
PIXI.EventTarget.call(this);
/**
* The array of asset URLs that are going to be loaded
/**
* The array of asset URLs that are going to be loaded
*
* @property assetURLs
* @type Array<String>
*/
this.assetURLs = assetURLs;
* @property assetURLs
* @type Array<String>
*/
this.assetURLs = assetURLs;
/**
* Whether the requests should be treated as cross origin
@ -36,7 +36,7 @@ PIXI.AssetLoader = function(assetURLs, crossorigin)
* @property crossorigin
* @type Boolean
*/
this.crossorigin = crossorigin;
this.crossorigin = crossorigin;
/**
* Maps file extension to loader types
@ -80,25 +80,26 @@ PIXI.AssetLoader.prototype.load = function()
{
var scope = this;
this.loadCount = this.assetURLs.length;
function onLoad() {
scope.onAssetLoaded();
}
for (var i=0; i < this.assetURLs.length; i++)
{
var fileName = this.assetURLs[i];
var fileType = fileName.split(".").pop().toLowerCase();
this.loadCount = this.assetURLs.length;
var loaderClass = this.loadersByType[fileType];
if(!loaderClass)
for (var i = 0, l = this.assetURLs.length; i < l; i++)
{
var fileName = this.assetURLs[i];
var fileType = fileName.split(".").pop().toLowerCase();
var Constructor = this.loadersByType[fileType];
if(!Constructor)
throw new Error(fileType + " is an unsupported file type");
var loader = new loaderClass(fileName, this.crossorigin);
var loader = new Constructor(fileName, this.crossorigin);
loader.addEventListener("loaded", function()
{
scope.onAssetLoaded();
});
loader.addEventListener("loaded", onLoad);
loader.load();
}
}
};
/**
@ -110,13 +111,13 @@ PIXI.AssetLoader.prototype.load = function()
PIXI.AssetLoader.prototype.onAssetLoaded = function()
{
this.loadCount--;
this.dispatchEvent({type: "onProgress", content: this});
if(this.onProgress) this.onProgress();
this.dispatchEvent({type: "onProgress", content: this});
if (this.onProgress) this.onProgress();
if(this.loadCount == 0)
{
this.dispatchEvent({type: "onComplete", content: this});
if(this.onComplete) this.onComplete();
}
if (!this.loadCount)
{
this.dispatchEvent({type: "onComplete", content: this});
if(this.onComplete) this.onComplete();
}
};

198
src/pixi/loaders/JsonLoader.js
View file

@ -14,41 +14,41 @@
* @param crossorigin {Boolean} Whether requests should be treated as crossorigin
*/
PIXI.JsonLoader = function (url, crossorigin) {
PIXI.EventTarget.call(this);
PIXI.EventTarget.call(this);
/**
* The url of the bitmap font data
*
* @property url
* @type String
*/
this.url = url;
/**
* The url of the bitmap font data
*
* @property url
* @type String
*/
this.url = url;
/**
* Whether the requests should be treated as cross origin
*
* @property crossorigin
* @type Boolean
*/
this.crossorigin = crossorigin;
/**
* Whether the requests should be treated as cross origin
*
* @property crossorigin
* @type Boolean
*/
this.crossorigin = crossorigin;
/**
* [read-only] The base url of the bitmap font data
*
* @property baseUrl
* @type String
* @readOnly
*/
this.baseUrl = url.replace(/[^\/]*$/, "");
/**
* [read-only] The base url of the bitmap font data
*
* @property baseUrl
* @type String
* @readOnly
*/
this.baseUrl = url.replace(/[^\/]*$/, "");
/**
* [read-only] Whether the data has loaded yet
*
* @property loaded
* @type Boolean
* @readOnly
*/
this.loaded = false;
/**
* [read-only] Whether the data has loaded yet
*
* @property loaded
* @type Boolean
* @readOnly
*/
this.loaded = false;
};
@ -61,15 +61,15 @@ PIXI.JsonLoader.prototype.constructor = PIXI.JsonLoader;
* @method load
*/
PIXI.JsonLoader.prototype.load = function () {
this.ajaxRequest = new AjaxRequest();
var scope = this;
this.ajaxRequest.onreadystatechange = function () {
scope.onJSONLoaded();
};
this.ajaxRequest = new AjaxRequest();
var scope = this;
this.ajaxRequest.onreadystatechange = function () {
scope.onJSONLoaded();
};
this.ajaxRequest.open("GET", this.url, true);
if (this.ajaxRequest.overrideMimeType) this.ajaxRequest.overrideMimeType("application/json");
this.ajaxRequest.send(null);
this.ajaxRequest.open("GET", this.url, true);
if (this.ajaxRequest.overrideMimeType) this.ajaxRequest.overrideMimeType("application/json");
this.ajaxRequest.send(null);
};
/**
@ -79,62 +79,62 @@ PIXI.JsonLoader.prototype.load = function () {
* @private
*/
PIXI.JsonLoader.prototype.onJSONLoaded = function () {
if (this.ajaxRequest.readyState == 4) {
if (this.ajaxRequest.status == 200 || window.location.href.indexOf("http") == -1) {
this.json = JSON.parse(this.ajaxRequest.responseText);
if (this.ajaxRequest.readyState == 4) {
if (this.ajaxRequest.status == 200 || window.location.href.indexOf("http") == -1) {
this.json = JSON.parse(this.ajaxRequest.responseText);
if(this.json.frames)
{
// sprite sheet
var scope = this;
var textureUrl = this.baseUrl + this.json.meta.image;
var image = new PIXI.ImageLoader(textureUrl, this.crossorigin);
var frameData = this.json.frames;
if(this.json.frames)
{
// sprite sheet
var scope = this;
var textureUrl = this.baseUrl + this.json.meta.image;
var image = new PIXI.ImageLoader(textureUrl, this.crossorigin);
var frameData = this.json.frames;
this.texture = image.texture.baseTexture;
image.addEventListener("loaded", function (event) {
scope.onLoaded();
});
this.texture = image.texture.baseTexture;
image.addEventListener("loaded", function (event) {
scope.onLoaded();
});
for (var i in frameData) {
var rect = frameData[i].frame;
if (rect) {
PIXI.TextureCache[i] = new PIXI.Texture(this.texture, {
x: rect.x,
y: rect.y,
width: rect.w,
height: rect.h
});
if (frameData[i].trimmed) {
//var realSize = frameData[i].spriteSourceSize;
PIXI.TextureCache[i].realSize = frameData[i].spriteSourceSize;
PIXI.TextureCache[i].trim.x = 0; // (realSize.x / rect.w)
// calculate the offset!
}
}
}
for (var i in frameData) {
var rect = frameData[i].frame;
if (rect) {
PIXI.TextureCache[i] = new PIXI.Texture(this.texture, {
x: rect.x,
y: rect.y,
width: rect.w,
height: rect.h
});
if (frameData[i].trimmed) {
//var realSize = frameData[i].spriteSourceSize;
PIXI.TextureCache[i].realSize = frameData[i].spriteSourceSize;
PIXI.TextureCache[i].trim.x = 0; // (realSize.x / rect.w)
// calculate the offset!
}
}
}
image.load();
image.load();
}
else if(this.json.bones)
{
// spine animation
var spineJsonParser = new spine.SkeletonJson();
var skeletonData = spineJsonParser.readSkeletonData(this.json);
PIXI.AnimCache[this.url] = skeletonData;
this.onLoaded();
}
else
{
this.onLoaded();
}
}
else
{
this.onError();
}
}
}
else if(this.json.bones)
{
// spine animation
var spineJsonParser = new spine.SkeletonJson();
var skeletonData = spineJsonParser.readSkeletonData(this.json);
PIXI.AnimCache[this.url] = skeletonData;
this.onLoaded();
}
else
{
this.onLoaded();
}
}
else
{
this.onError();
}
}
};
/**
@ -144,11 +144,11 @@ PIXI.JsonLoader.prototype.onJSONLoaded = function () {
* @private
*/
PIXI.JsonLoader.prototype.onLoaded = function () {
this.loaded = true;
this.dispatchEvent({
type: "loaded",
content: this
});
this.loaded = true;
this.dispatchEvent({
type: "loaded",
content: this
});
};
/**
@ -158,8 +158,8 @@ PIXI.JsonLoader.prototype.onLoaded = function () {
* @private
*/
PIXI.JsonLoader.prototype.onError = function () {
this.dispatchEvent({
type: "error",
content: this
});
this.dispatchEvent({
type: "error",
content: this
});
};

70
src/pixi/loaders/SpineLoader.js
View file

@ -23,32 +23,32 @@
*/
PIXI.SpineLoader = function(url, crossorigin)
{
PIXI.EventTarget.call(this);
PIXI.EventTarget.call(this);
/**
* The url of the bitmap font data
*
* @property url
* @type String
*/
this.url = url;
/**
* The url of the bitmap font data
*
* @property url
* @type String
*/
this.url = url;
/**
* Whether the requests should be treated as cross origin
*
* @property crossorigin
* @type Boolean
*/
this.crossorigin = crossorigin;
/**
* Whether the requests should be treated as cross origin
*
* @property crossorigin
* @type Boolean
*/
this.crossorigin = crossorigin;
/**
* [read-only] Whether the data has loaded yet
*
* @property loaded
* @type Boolean
* @readOnly
*/
this.loaded = false;
/**
* [read-only] Whether the data has loaded yet
*
* @property loaded
* @type Boolean
* @readOnly
*/
this.loaded = false;
}
PIXI.SpineLoader.prototype.constructor = PIXI.SpineLoader;
@ -60,13 +60,13 @@ PIXI.SpineLoader.prototype.constructor = PIXI.SpineLoader;
*/
PIXI.SpineLoader.prototype.load = function () {
var scope = this;
var jsonLoader = new PIXI.JsonLoader(this.url, this.crossorigin);
jsonLoader.addEventListener("loaded", function (event) {
scope.json = event.content.json;
scope.onJSONLoaded();
});
jsonLoader.load();
var scope = this;
var jsonLoader = new PIXI.JsonLoader(this.url, this.crossorigin);
jsonLoader.addEventListener("loaded", function (event) {
scope.json = event.content.json;
scope.onJSONLoaded();
});
jsonLoader.load();
};
/**
@ -76,12 +76,12 @@ PIXI.SpineLoader.prototype.load = function () {
* @private
*/
PIXI.SpineLoader.prototype.onJSONLoaded = function (event) {
var spineJsonParser = new spine.SkeletonJson();
var skeletonData = spineJsonParser.readSkeletonData(this.json);
var spineJsonParser = new spine.SkeletonJson();
var skeletonData = spineJsonParser.readSkeletonData(this.json);
PIXI.AnimCache[this.url] = skeletonData;
PIXI.AnimCache[this.url] = skeletonData;
this.onLoaded();
this.onLoaded();
};
/**
@ -91,7 +91,7 @@ PIXI.SpineLoader.prototype.onJSONLoaded = function (event) {
* @private
*/
PIXI.SpineLoader.prototype.onLoaded = function () {
this.loaded = true;
this.loaded = true;
this.dispatchEvent({type: "loaded", content: this});
};

132
src/pixi/loaders/SpriteSheetLoader.js
View file

@ -19,37 +19,37 @@
*/
PIXI.SpriteSheetLoader = function (url, crossorigin) {
/*
* i use texture packer to load the assets..
* http://www.codeandweb.com/texturepacker
* make sure to set the format as "JSON"
*/
PIXI.EventTarget.call(this);
/*
* i use texture packer to load the assets..
* http://www.codeandweb.com/texturepacker
* make sure to set the format as "JSON"
*/
PIXI.EventTarget.call(this);
/**
* The url of the bitmap font data
*
* @property url
* @type String
*/
this.url = url;
/**
* The url of the bitmap font data
*
* @property url
* @type String
*/
this.url = url;
/**
* Whether the requests should be treated as cross origin
*
* @property crossorigin
* @type Boolean
*/
this.crossorigin = crossorigin;
/**
* Whether the requests should be treated as cross origin
*
* @property crossorigin
* @type Boolean
*/
this.crossorigin = crossorigin;
/**
* [read-only] The base url of the bitmap font data
*
* @property baseUrl
* @type String
* @readOnly
*/
this.baseUrl = url.replace(/[^\/]*$/, "");
/**
* [read-only] The base url of the bitmap font data
*
* @property baseUrl
* @type String
* @readOnly
*/
this.baseUrl = url.replace(/[^\/]*$/, "");
/**
* The texture being loaded
@ -65,7 +65,7 @@ PIXI.SpriteSheetLoader = function (url, crossorigin) {
* @property frames
* @type Object
*/
this.frames = {};
this.frames = {};
};
// constructor
@ -77,13 +77,13 @@ PIXI.SpriteSheetLoader.prototype.constructor = PIXI.SpriteSheetLoader;
* @method load
*/
PIXI.SpriteSheetLoader.prototype.load = function () {
var scope = this;
var jsonLoader = new PIXI.JsonLoader(this.url, this.crossorigin);
jsonLoader.addEventListener("loaded", function (event) {
scope.json = event.content.json;
scope.onJSONLoaded();
});
jsonLoader.load();
var scope = this;
var jsonLoader = new PIXI.JsonLoader(this.url, this.crossorigin);
jsonLoader.addEventListener("loaded", function (event) {
scope.json = event.content.json;
scope.onJSONLoaded();
});
jsonLoader.load();
};
/**
@ -93,35 +93,35 @@ PIXI.SpriteSheetLoader.prototype.load = function () {
* @private
*/
PIXI.SpriteSheetLoader.prototype.onJSONLoaded = function () {
var scope = this;
var textureUrl = this.baseUrl + this.json.meta.image;
var image = new PIXI.ImageLoader(textureUrl, this.crossorigin);
var frameData = this.json.frames;
var scope = this;
var textureUrl = this.baseUrl + this.json.meta.image;
var image = new PIXI.ImageLoader(textureUrl, this.crossorigin);
var frameData = this.json.frames;
this.texture = image.texture.baseTexture;
image.addEventListener("loaded", function (event) {
scope.onLoaded();
});
this.texture = image.texture.baseTexture;
image.addEventListener("loaded", function (event) {
scope.onLoaded();
});
for (var i in frameData) {
var rect = frameData[i].frame;
if (rect) {
PIXI.TextureCache[i] = new PIXI.Texture(this.texture, {
x: rect.x,
y: rect.y,
width: rect.w,
height: rect.h
});
if (frameData[i].trimmed) {
//var realSize = frameData[i].spriteSourceSize;
PIXI.TextureCache[i].realSize = frameData[i].spriteSourceSize;
PIXI.TextureCache[i].trim.x = 0; // (realSize.x / rect.w)
// calculate the offset!
}
}
}
for (var i in frameData) {
var rect = frameData[i].frame;
if (rect) {
PIXI.TextureCache[i] = new PIXI.Texture(this.texture, {
x: rect.x,
y: rect.y,
width: rect.w,
height: rect.h
});
if (frameData[i].trimmed) {
//var realSize = frameData[i].spriteSourceSize;
PIXI.TextureCache[i].realSize = frameData[i].spriteSourceSize;
PIXI.TextureCache[i].trim.x = 0; // (realSize.x / rect.w)
// calculate the offset!
}
}
}
image.load();
image.load();
};
/**
* Invoke when all files are loaded (json and texture)
@ -130,8 +130,8 @@ PIXI.SpriteSheetLoader.prototype.onJSONLoaded = function () {
* @private
*/
PIXI.SpriteSheetLoader.prototype.onLoaded = function () {
this.dispatchEvent({
type: "loaded",
content: this
});
this.dispatchEvent({
type: "loaded",
content: this
});
};

100
src/pixi/primitives/Graphics.js
View file

@ -14,9 +14,9 @@
*/
PIXI.Graphics = function()
{
PIXI.DisplayObjectContainer.call( this );
PIXI.DisplayObjectContainer.call( this );
this.renderable = true;
this.renderable = true;
/**
* The alpha of the fill of this graphics object
@ -24,7 +24,7 @@ PIXI.Graphics = function()
* @property fillAlpha
* @type Number
*/
this.fillAlpha = 1;
this.fillAlpha = 1;
/**
* The width of any lines drawn
@ -32,7 +32,7 @@ PIXI.Graphics = function()
* @property lineWidth
* @type Number
*/
this.lineWidth = 0;
this.lineWidth = 0;
/**
* The color of any lines drawn
@ -40,7 +40,7 @@ PIXI.Graphics = function()
* @property lineColor
* @type String
*/
this.lineColor = "black";
this.lineColor = "black";
/**
* Graphics data
@ -49,7 +49,7 @@ PIXI.Graphics = function()
* @type Array
* @private
*/
this.graphicsData = [];
this.graphicsData = [];
/**
* Current path
@ -58,7 +58,7 @@ PIXI.Graphics = function()
* @type Object
* @private
*/
this.currentPath = {points:[]};
this.currentPath = {points:[]};
}
// constructor
@ -75,16 +75,16 @@ PIXI.Graphics.prototype.constructor = PIXI.Graphics;
*/
PIXI.Graphics.prototype.lineStyle = function(lineWidth, color, alpha)
{
if(this.currentPath.points.length == 0)this.graphicsData.pop();
if (!this.currentPath.points.length) this.graphicsData.pop();
this.lineWidth = lineWidth || 0;
this.lineColor = color || 0;
this.lineAlpha = (alpha == undefined) ? 1 : alpha;
this.lineWidth = lineWidth || 0;
this.lineColor = color || 0;
this.lineAlpha = (arguments.length < 3) ? 1 : alpha;
this.currentPath = {lineWidth:this.lineWidth, lineColor:this.lineColor, lineAlpha:this.lineAlpha,
fillColor:this.fillColor, fillAlpha:this.fillAlpha, fill:this.filling, points:[], type:PIXI.Graphics.POLY};
this.currentPath = {lineWidth:this.lineWidth, lineColor:this.lineColor, lineAlpha:this.lineAlpha,
fillColor:this.fillColor, fillAlpha:this.fillAlpha, fill:this.filling, points:[], type:PIXI.Graphics.POLY};
this.graphicsData.push(this.currentPath);
this.graphicsData.push(this.currentPath);
}
/**
@ -96,14 +96,14 @@ PIXI.Graphics.prototype.lineStyle = function(lineWidth, color, alpha)
*/
PIXI.Graphics.prototype.moveTo = function(x, y)
{
if(this.currentPath.points.length == 0)this.graphicsData.pop();
if (!this.currentPath.points.length) this.graphicsData.pop();
this.currentPath = this.currentPath = {lineWidth:this.lineWidth, lineColor:this.lineColor, lineAlpha:this.lineAlpha,
fillColor:this.fillColor, fillAlpha:this.fillAlpha, fill:this.filling, points:[], type:PIXI.Graphics.POLY};
this.currentPath = this.currentPath = {lineWidth:this.lineWidth, lineColor:this.lineColor, lineAlpha:this.lineAlpha,
fillColor:this.fillColor, fillAlpha:this.fillAlpha, fill:this.filling, points:[], type:PIXI.Graphics.POLY};
this.currentPath.points.push(x, y);
this.currentPath.points.push(x, y);
this.graphicsData.push(this.currentPath);
this.graphicsData.push(this.currentPath);
}
/**
@ -116,8 +116,8 @@ PIXI.Graphics.prototype.moveTo = function(x, y)
*/
PIXI.Graphics.prototype.lineTo = function(x, y)
{
this.currentPath.points.push(x, y);
this.dirty = true;
this.currentPath.points.push(x, y);
this.dirty = true;
}
/**
@ -130,9 +130,9 @@ PIXI.Graphics.prototype.lineTo = function(x, y)
*/
PIXI.Graphics.prototype.beginFill = function(color, alpha)
{
this.filling = true;
this.fillColor = color || 0;
this.fillAlpha = (alpha == undefined) ? 1 : alpha;
this.filling = true;
this.fillColor = color || 0;
this.fillAlpha = (arguments.length < 2) ? 1 : alpha;
}
/**
@ -142,9 +142,9 @@ PIXI.Graphics.prototype.beginFill = function(color, alpha)
*/
PIXI.Graphics.prototype.endFill = function()
{
this.filling = false;
this.fillColor = null;
this.fillAlpha = 1;
this.filling = false;
this.fillColor = null;
this.fillAlpha = 1;
}
/**
@ -157,14 +157,14 @@ PIXI.Graphics.prototype.endFill = function()
*/
PIXI.Graphics.prototype.drawRect = function( x, y, width, height )
{
if(this.currentPath.points.length == 0)this.graphicsData.pop();
if (!this.currentPath.points.length) this.graphicsData.pop();
this.currentPath = {lineWidth:this.lineWidth, lineColor:this.lineColor, lineAlpha:this.lineAlpha,
fillColor:this.fillColor, fillAlpha:this.fillAlpha, fill:this.filling,
points:[x, y, width, height], type:PIXI.Graphics.RECT};
this.currentPath = {lineWidth:this.lineWidth, lineColor:this.lineColor, lineAlpha:this.lineAlpha,
fillColor:this.fillColor, fillAlpha:this.fillAlpha, fill:this.filling,
points:[x, y, width, height], type:PIXI.Graphics.RECT};
this.graphicsData.push(this.currentPath);
this.dirty = true;
this.graphicsData.push(this.currentPath);
this.dirty = true;
}
/**
@ -177,14 +177,14 @@ PIXI.Graphics.prototype.drawRect = function( x, y, width, height )
*/
PIXI.Graphics.prototype.drawCircle = function( x, y, radius)
{
if(this.currentPath.points.length == 0)this.graphicsData.pop();
if (!this.currentPath.points.length) this.graphicsData.pop();
this.currentPath = {lineWidth:this.lineWidth, lineColor:this.lineColor, lineAlpha:this.lineAlpha,
fillColor:this.fillColor, fillAlpha:this.fillAlpha, fill:this.filling,
points:[x, y, radius, radius], type:PIXI.Graphics.CIRC};
this.currentPath = {lineWidth:this.lineWidth, lineColor:this.lineColor, lineAlpha:this.lineAlpha,
fillColor:this.fillColor, fillAlpha:this.fillAlpha, fill:this.filling,
points:[x, y, radius, radius], type:PIXI.Graphics.CIRC};
this.graphicsData.push(this.currentPath);
this.dirty = true;
this.graphicsData.push(this.currentPath);
this.dirty = true;
}
/**
@ -198,14 +198,14 @@ PIXI.Graphics.prototype.drawCircle = function( x, y, radius)
*/
PIXI.Graphics.prototype.drawElipse = function( x, y, width, height)
{
if(this.currentPath.points.length == 0)this.graphicsData.pop();
if (!this.currentPath.points.length) this.graphicsData.pop();
this.currentPath = {lineWidth:this.lineWidth, lineColor:this.lineColor, lineAlpha:this.lineAlpha,
fillColor:this.fillColor, fillAlpha:this.fillAlpha, fill:this.filling,
points:[x, y, width, height], type:PIXI.Graphics.ELIP};
this.currentPath = {lineWidth:this.lineWidth, lineColor:this.lineColor, lineAlpha:this.lineAlpha,
fillColor:this.fillColor, fillAlpha:this.fillAlpha, fill:this.filling,
points:[x, y, width, height], type:PIXI.Graphics.ELIP};
this.graphicsData.push(this.currentPath);
this.dirty = true;
this.graphicsData.push(this.currentPath);
this.dirty = true;
}
/**
@ -215,12 +215,12 @@ PIXI.Graphics.prototype.drawElipse = function( x, y, width, height)
*/
PIXI.Graphics.prototype.clear = function()
{
this.lineWidth = 0;
this.filling = false;
this.lineWidth = 0;
this.filling = false;
this.dirty = true;
this.clearDirty = true;
this.graphicsData = [];
this.dirty = true;
this.clearDirty = true;
this.graphicsData = [];
}
// SOME TYPES:

323
src/pixi/renderers/canvas/CanvasGraphics.js
View file

@ -25,127 +25,127 @@ PIXI.CanvasGraphics = function()
*/
PIXI.CanvasGraphics.renderGraphics = function(graphics, context)
{
var worldAlpha = graphics.worldAlpha;
var worldAlpha = graphics.worldAlpha;
for (var i=0; i < graphics.graphicsData.length; i++)
{
var data = graphics.graphicsData[i];
var points = data.points;
for (var i=0; i < graphics.graphicsData.length; i++)
{
var data = graphics.graphicsData[i];
var points = data.points;
context.strokeStyle = color = '#' + ('00000' + ( data.lineColor | 0).toString(16)).substr(-6);
context.strokeStyle = color = '#' + ('00000' + ( data.lineColor | 0).toString(16)).substr(-6);
context.lineWidth = data.lineWidth;
context.lineWidth = data.lineWidth;
if(data.type == PIXI.Graphics.POLY)
{
context.beginPath();
if(data.type == PIXI.Graphics.POLY)
{
context.beginPath();
context.moveTo(points[0], points[1]);
context.moveTo(points[0], points[1]);
for (var j=1; j < points.length/2; j++)
{
context.lineTo(points[j * 2], points[j * 2 + 1]);
}
for (var j=1; j < points.length/2; j++)
{
context.lineTo(points[j * 2], points[j * 2 + 1]);
}
// if the first and last point are the same close the path - much neater :)
if(points[0] == points[points.length-2] && points[1] == points[points.length-1])
{
context.closePath();
}
// if the first and last point are the same close the path - much neater :)
if(points[0] == points[points.length-2] && points[1] == points[points.length-1])
{
context.closePath();
}
if(data.fill)
{
context.globalAlpha = data.fillAlpha * worldAlpha;
context.fillStyle = color = '#' + ('00000' + ( data.fillColor | 0).toString(16)).substr(-6);
context.fill();
}
if(data.lineWidth)
{
context.globalAlpha = data.lineAlpha * worldAlpha;
context.stroke();
}
}
else if(data.type == PIXI.Graphics.RECT)
{
if(data.fill)
{
context.globalAlpha = data.fillAlpha * worldAlpha;
context.fillStyle = color = '#' + ('00000' + ( data.fillColor | 0).toString(16)).substr(-6);
context.fill();
}
if(data.lineWidth)
{
context.globalAlpha = data.lineAlpha * worldAlpha;
context.stroke();
}
}
else if(data.type == PIXI.Graphics.RECT)
{
if(data.fillColor || data.fillColor === 0)
{
context.globalAlpha = data.fillAlpha * worldAlpha;
context.fillStyle = color = '#' + ('00000' + ( data.fillColor | 0).toString(16)).substr(-6);
context.fillRect(points[0], points[1], points[2], points[3]);
if(data.fillColor || data.fillColor === 0)
{
context.globalAlpha = data.fillAlpha * worldAlpha;
context.fillStyle = color = '#' + ('00000' + ( data.fillColor | 0).toString(16)).substr(-6);
context.fillRect(points[0], points[1], points[2], points[3]);
}
if(data.lineWidth)
{
context.globalAlpha = data.lineAlpha * worldAlpha;
context.strokeRect(points[0], points[1], points[2], points[3]);
}
}
if(data.lineWidth)
{
context.globalAlpha = data.lineAlpha * worldAlpha;
context.strokeRect(points[0], points[1], points[2], points[3]);
}
}
else if(data.type == PIXI.Graphics.CIRC)
{
// TODO - need to be Undefined!
context.beginPath();
context.arc(points[0], points[1], points[2],0,2*Math.PI);
context.closePath();
}
else if(data.type == PIXI.Graphics.CIRC)
{
// TODO - need to be Undefined!
context.beginPath();
context.arc(points[0], points[1], points[2],0,2*Math.PI);
context.closePath();
if(data.fill)
{
context.globalAlpha = data.fillAlpha * worldAlpha;
context.fillStyle = color = '#' + ('00000' + ( data.fillColor | 0).toString(16)).substr(-6);
context.fill();
}
if(data.lineWidth)
{
context.globalAlpha = data.lineAlpha * worldAlpha;
context.stroke();
}
}
else if(data.type == PIXI.Graphics.ELIP)
{
if(data.fill)
{
context.globalAlpha = data.fillAlpha * worldAlpha;
context.fillStyle = color = '#' + ('00000' + ( data.fillColor | 0).toString(16)).substr(-6);
context.fill();
}
if(data.lineWidth)
{
context.globalAlpha = data.lineAlpha * worldAlpha;
context.stroke();
}
}
else if(data.type == PIXI.Graphics.ELIP)
{
// elipse code taken from: http://stackoverflow.com/questions/2172798/how-to-draw-an-oval-in-html5-canvas
// elipse code taken from: http://stackoverflow.com/questions/2172798/how-to-draw-an-oval-in-html5-canvas
var elipseData = data.points;
var elipseData = data.points;
var w = elipseData[2] * 2;
var h = elipseData[3] * 2;
var w = elipseData[2] * 2;
var h = elipseData[3] * 2;
var x = elipseData[0] - w/2;
var y = elipseData[1] - h/2;
var x = elipseData[0] - w/2;
var y = elipseData[1] - h/2;
context.beginPath();
context.beginPath();
var kappa = .5522848,
ox = (w / 2) * kappa, // control point offset horizontal
oy = (h / 2) * kappa, // control point offset vertical
xe = x + w, // x-end
ye = y + h, // y-end
xm = x + w / 2, // x-middle
ym = y + h / 2; // y-middle
var kappa = 0.5522848,
ox = (w / 2) * kappa, // control point offset horizontal
oy = (h / 2) * kappa, // control point offset vertical
xe = x + w, // x-end
ye = y + h, // y-end
xm = x + w / 2, // x-middle
ym = y + h / 2; // y-middle
context.moveTo(x, ym);
context.bezierCurveTo(x, ym - oy, xm - ox, y, xm, y);
context.bezierCurveTo(xm + ox, y, xe, ym - oy, xe, ym);
context.bezierCurveTo(xe, ym + oy, xm + ox, ye, xm, ye);
context.bezierCurveTo(xm - ox, ye, x, ym + oy, x, ym);
context.moveTo(x, ym);
context.bezierCurveTo(x, ym - oy, xm - ox, y, xm, y);
context.bezierCurveTo(xm + ox, y, xe, ym - oy, xe, ym);
context.bezierCurveTo(xe, ym + oy, xm + ox, ye, xm, ye);
context.bezierCurveTo(xm - ox, ye, x, ym + oy, x, ym);
context.closePath();
context.closePath();
if(data.fill)
{
context.globalAlpha = data.fillAlpha * worldAlpha;
context.fillStyle = color = '#' + ('00000' + ( data.fillColor | 0).toString(16)).substr(-6);
context.fill();
}
if(data.lineWidth)
{
context.globalAlpha = data.lineAlpha * worldAlpha;
context.stroke();
}
}
if(data.fill)
{
context.globalAlpha = data.fillAlpha * worldAlpha;
context.fillStyle = color = '#' + ('00000' + ( data.fillColor | 0).toString(16)).substr(-6);
context.fill();
}
if(data.lineWidth)
{
context.globalAlpha = data.lineAlpha * worldAlpha;
context.stroke();
}
}
};
}
}
/*
@ -159,80 +159,79 @@ PIXI.CanvasGraphics.renderGraphics = function(graphics, context)
*/
PIXI.CanvasGraphics.renderGraphicsMask = function(graphics, context)
{
var worldAlpha = graphics.worldAlpha;
var worldAlpha = graphics.worldAlpha;
var len = graphics.graphicsData.length;
if(len > 1)
{
len = 1;
console.log("Pixi.js warning: masks in canvas can only mask using the first path in the graphics object")
}
var len = graphics.graphicsData.length;
if(len > 1)
{
len = 1;
console.log("Pixi.js warning: masks in canvas can only mask using the first path in the graphics object")
}
for (var i=0; i < 1; i++)
{
var data = graphics.graphicsData[i];
var points = data.points;
for (var i=0; i < 1; i++)
{
var data = graphics.graphicsData[i];
var points = data.points;
if(data.type == PIXI.Graphics.POLY)
{
context.beginPath();
context.moveTo(points[0], points[1]);
if(data.type == PIXI.Graphics.POLY)
{
context.beginPath();
context.moveTo(points[0], points[1]);
for (var j=1; j < points.length/2; j++)
{
context.lineTo(points[j * 2], points[j * 2 + 1]);
}
for (var j=1; j < points.length/2; j++)
{
context.lineTo(points[j * 2], points[j * 2 + 1]);
}
// if the first and last point are the same close the path - much neater :)
if(points[0] == points[points.length-2] && points[1] == points[points.length-1])
{
context.closePath();
}
// if the first and last point are the same close the path - much neater :)
if(points[0] == points[points.length-2] && points[1] == points[points.length-1])
{
context.closePath();
}
}
else if(data.type == PIXI.Graphics.RECT)
{
context.beginPath();
context.rect(points[0], points[1], points[2], points[3]);
context.closePath();
}
else if(data.type == PIXI.Graphics.CIRC)
{
// TODO - need to be Undefined!
context.beginPath();
context.arc(points[0], points[1], points[2],0,2*Math.PI);
context.closePath();
}
else if(data.type == PIXI.Graphics.ELIP)
{
}
else if(data.type == PIXI.Graphics.RECT)
{
context.beginPath();
context.rect(points[0], points[1], points[2], points[3]);
context.closePath();
}
else if(data.type == PIXI.Graphics.CIRC)
{
// TODO - need to be Undefined!
context.beginPath();
context.arc(points[0], points[1], points[2],0,2*Math.PI);
context.closePath();
}
else if(data.type == PIXI.Graphics.ELIP)
{
// elipse code taken from: http://stackoverflow.com/questions/2172798/how-to-draw-an-oval-in-html5-canvas
var elipseData = data.points;
// elipse code taken from: http://stackoverflow.com/questions/2172798/how-to-draw-an-oval-in-html5-canvas
var elipseData = data.points;
var w = elipseData[2] * 2;
var h = elipseData[3] * 2;
var w = elipseData[2] * 2;
var h = elipseData[3] * 2;
var x = elipseData[0] - w/2;
var y = elipseData[1] - h/2;
var x = elipseData[0] - w/2;
var y = elipseData[1] - h/2;
context.beginPath();
context.beginPath();
var kappa = .5522848,
ox = (w / 2) * kappa, // control point offset horizontal
oy = (h / 2) * kappa, // control point offset vertical
xe = x + w, // x-end
ye = y + h, // y-end
xm = x + w / 2, // x-middle
ym = y + h / 2; // y-middle
var kappa = 0.5522848,
ox = (w / 2) * kappa, // control point offset horizontal
oy = (h / 2) * kappa, // control point offset vertical
xe = x + w, // x-end
ye = y + h, // y-end
xm = x + w / 2, // x-middle
ym = y + h / 2; // y-middle
context.moveTo(x, ym);
context.bezierCurveTo(x, ym - oy, xm - ox, y, xm, y);
context.bezierCurveTo(xm + ox, y, xe, ym - oy, xe, ym);
context.bezierCurveTo(xe, ym + oy, xm + ox, ye, xm, ye);
context.bezierCurveTo(xm - ox, ye, x, ym + oy, x, ym);
context.closePath();
}
context.moveTo(x, ym);
context.bezierCurveTo(x, ym - oy, xm - ox, y, xm, y);
context.bezierCurveTo(xm + ox, y, xe, ym - oy, xe, ym);
context.bezierCurveTo(xe, ym + oy, xm + ox, ye, xm, ye);
context.bezierCurveTo(xm - ox, ye, x, ym + oy, x, ym);
context.closePath();
}
};
}
}

392
src/pixi/renderers/canvas/CanvasRenderer.js
View file

@ -16,48 +16,48 @@
*/
PIXI.CanvasRenderer = function(width, height, view, transparent)
{
this.transparent = transparent;
this.transparent = transparent;
/**
* The width of the canvas view
*
* @property width
* @type Number
* @default 800
*/
this.width = width || 800;
/**
* The width of the canvas view
*
* @property width
* @type Number
* @default 800
*/
this.width = width || 800;
/**
* The height of the canvas view
*
* @property height
* @type Number
* @default 600
*/
this.height = height || 600;
/**
* The height of the canvas view
*
* @property height
* @type Number
* @default 600
*/
this.height = height || 600;
/**
* The canvas element that the everything is drawn to
*
* @property view
* @type Canvas
*/
this.view = view || document.createElement( 'canvas' );
/**
* The canvas element that the everything is drawn to
*
* @property view
* @type Canvas
*/
this.view = view || document.createElement( 'canvas' );
/**
* The canvas context that the everything is drawn to
* @property context
* @type Canvas 2d Context
*/
this.context = this.view.getContext("2d");
/**
* The canvas context that the everything is drawn to
* @property context
* @type Canvas 2d Context
*/
this.context = this.view.getContext("2d");
this.refresh = true;
// hack to enable some hardware acceleration!
//this.view.style["transform"] = "translatez(0)";
this.refresh = true;
// hack to enable some hardware acceleration!
//this.view.style["transform"] = "translatez(0)";
this.view.width = this.width;
this.view.height = this.height;
this.count = 0;
this.view.height = this.height;
this.count = 0;
}
// constructor
@ -72,40 +72,40 @@ PIXI.CanvasRenderer.prototype.constructor = PIXI.CanvasRenderer;
PIXI.CanvasRenderer.prototype.render = function(stage)
{
//stage.__childrenAdded = [];
//stage.__childrenRemoved = [];
//stage.__childrenAdded = [];
//stage.__childrenRemoved = [];
// update textures if need be
PIXI.texturesToUpdate = [];
PIXI.texturesToDestroy = [];
// update textures if need be
PIXI.texturesToUpdate = [];
PIXI.texturesToDestroy = [];
PIXI.visibleCount++;
stage.updateTransform();
PIXI.visibleCount++;
stage.updateTransform();
// update the background color
if(this.view.style.backgroundColor!=stage.backgroundColorString && !this.transparent)this.view.style.backgroundColor = stage.backgroundColorString;
// update the background color
if(this.view.style.backgroundColor!=stage.backgroundColorString && !this.transparent)this.view.style.backgroundColor = stage.backgroundColorString;
this.context.setTransform(1,0,0,1,0,0);
this.context.clearRect(0, 0, this.width, this.height)
this.context.setTransform(1,0,0,1,0,0);
this.context.clearRect(0, 0, this.width, this.height)
this.renderDisplayObject(stage);
//as
// run interaction!
if(stage.interactive)
{
//need to add some events!
if(!stage._interactiveEventsAdded)
{
stage._interactiveEventsAdded = true;
stage.interactionManager.setTarget(this);
}
}
if(stage.interactive)
{
//need to add some events!
if(!stage._interactiveEventsAdded)
{
stage._interactiveEventsAdded = true;
stage.interactionManager.setTarget(this);
}
}
// remove frame updates..
if(PIXI.Texture.frameUpdates.length > 0)
{
PIXI.Texture.frameUpdates = [];
}
// remove frame updates..
if(PIXI.Texture.frameUpdates.length > 0)
{
PIXI.Texture.frameUpdates = [];
}
}
@ -119,11 +119,11 @@ PIXI.CanvasRenderer.prototype.render = function(stage)
*/
PIXI.CanvasRenderer.prototype.resize = function(width, height)
{
this.width = width;
this.height = height;
this.width = width;
this.height = height;
this.view.width = width;
this.view.height = height;
this.view.width = width;
this.view.height = height;
}
/**
@ -135,104 +135,104 @@ PIXI.CanvasRenderer.prototype.resize = function(width, height)
*/
PIXI.CanvasRenderer.prototype.renderDisplayObject = function(displayObject)
{
// no loger recurrsive!
var transform;
var context = this.context;
// no loger recurrsive!
var transform;
var context = this.context;
context.globalCompositeOperation = 'source-over';
context.globalCompositeOperation = 'source-over';
// one the display object hits this. we can break the loop
var testObject = displayObject.last._iNext;
displayObject = displayObject.first;
// one the display object hits this. we can break the loop
var testObject = displayObject.last._iNext;
displayObject = displayObject.first;
do
{
transform = displayObject.worldTransform;
do
{
transform = displayObject.worldTransform;
if(!displayObject.visible)
{
displayObject = displayObject.last._iNext;
continue;
}
if(!displayObject.visible)
{
displayObject = displayObject.last._iNext;
continue;
}
if(!displayObject.renderable)
{
displayObject = displayObject._iNext;
continue;
}
if(!displayObject.renderable)
{
displayObject = displayObject._iNext;
continue;
}
if(displayObject instanceof PIXI.Sprite)
{
if(displayObject instanceof PIXI.Sprite)
{
var frame = displayObject.texture.frame;
var frame = displayObject.texture.frame;
if(frame && frame.width && frame.height)
{
context.globalAlpha = displayObject.worldAlpha;
if(frame && frame.width && frame.height)
{
context.globalAlpha = displayObject.worldAlpha;
context.setTransform(transform[0], transform[3], transform[1], transform[4], transform[2], transform[5]);
context.setTransform(transform[0], transform[3], transform[1], transform[4], transform[2], transform[5]);
context.drawImage(displayObject.texture.baseTexture.source,
frame.x,
frame.y,
frame.width,
frame.height,
(displayObject.anchor.x) * -frame.width,
(displayObject.anchor.y) * -frame.height,
frame.width,
frame.height);
}
}
else if(displayObject instanceof PIXI.Strip)
{
context.setTransform(transform[0], transform[3], transform[1], transform[4], transform[2], transform[5])
this.renderStrip(displayObject);
}
else if(displayObject instanceof PIXI.TilingSprite)
{
context.setTransform(transform[0], transform[3], transform[1], transform[4], transform[2], transform[5])
this.renderTilingSprite(displayObject);
}
else if(displayObject instanceof PIXI.CustomRenderable)
{
displayObject.renderCanvas(this);
}
else if(displayObject instanceof PIXI.Graphics)
{
context.setTransform(transform[0], transform[3], transform[1], transform[4], transform[2], transform[5])
PIXI.CanvasGraphics.renderGraphics(displayObject, context);
}
else if(displayObject instanceof PIXI.FilterBlock)
{
if(displayObject.open)
{
context.save();
context.drawImage(displayObject.texture.baseTexture.source,
frame.x,
frame.y,
frame.width,
frame.height,
(displayObject.anchor.x) * -frame.width,
(displayObject.anchor.y) * -frame.height,
frame.width,
frame.height);
}
}
else if(displayObject instanceof PIXI.Strip)
{
context.setTransform(transform[0], transform[3], transform[1], transform[4], transform[2], transform[5])
this.renderStrip(displayObject);
}
else if(displayObject instanceof PIXI.TilingSprite)
{
context.setTransform(transform[0], transform[3], transform[1], transform[4], transform[2], transform[5])
this.renderTilingSprite(displayObject);
}
else if(displayObject instanceof PIXI.CustomRenderable)
{
displayObject.renderCanvas(this);
}
else if(displayObject instanceof PIXI.Graphics)
{
context.setTransform(transform[0], transform[3], transform[1], transform[4], transform[2], transform[5])
PIXI.CanvasGraphics.renderGraphics(displayObject, context);
}
else if(displayObject instanceof PIXI.FilterBlock)
{
if(displayObject.open)
{
context.save();
var cacheAlpha = displayObject.mask.alpha;
var maskTransform = displayObject.mask.worldTransform;
var cacheAlpha = displayObject.mask.alpha;
var maskTransform = displayObject.mask.worldTransform;
context.setTransform(maskTransform[0], maskTransform[3], maskTransform[1], maskTransform[4], maskTransform[2], maskTransform[5])
context.setTransform(maskTransform[0], maskTransform[3], maskTransform[1], maskTransform[4], maskTransform[2], maskTransform[5])
displayObject.mask.worldAlpha = 0.5;
displayObject.mask.worldAlpha = 0.5;
context.worldAlpha = 0;
context.worldAlpha = 0;
PIXI.CanvasGraphics.renderGraphicsMask(displayObject.mask, context);
context.clip();
PIXI.CanvasGraphics.renderGraphicsMask(displayObject.mask, context);
context.clip();
displayObject.mask.worldAlpha = cacheAlpha;
}
else
{
context.restore();
}
}
// count++
displayObject = displayObject._iNext;
displayObject.mask.worldAlpha = cacheAlpha;
}
else
{
context.restore();
}
}
// count++
displayObject = displayObject._iNext;
}
while(displayObject != testObject)
}
while(displayObject != testObject)
}
@ -246,32 +246,32 @@ PIXI.CanvasRenderer.prototype.renderDisplayObject = function(displayObject)
*/
PIXI.CanvasRenderer.prototype.renderStripFlat = function(strip)
{
var context = this.context;
var verticies = strip.verticies;
var uvs = strip.uvs;
var context = this.context;
var verticies = strip.verticies;
var uvs = strip.uvs;
var length = verticies.length/2;
this.count++;
var length = verticies.length/2;
this.count++;
context.beginPath();
for (var i=1; i < length-2; i++)
{
context.beginPath();
for (var i=1; i < length-2; i++)
{
// draw some triangles!
var index = i*2;
// draw some triangles!
var index = i*2;
var x0 = verticies[index], x1 = verticies[index+2], x2 = verticies[index+4];
var y0 = verticies[index+1], y1 = verticies[index+3], y2 = verticies[index+5];
var x0 = verticies[index], x1 = verticies[index+2], x2 = verticies[index+4];
var y0 = verticies[index+1], y1 = verticies[index+3], y2 = verticies[index+5];
context.moveTo(x0, y0);
context.lineTo(x1, y1);
context.lineTo(x2, y2);
context.moveTo(x0, y0);
context.lineTo(x1, y1);
context.lineTo(x2, y2);
};
}
context.fillStyle = "#FF0000";
context.fill();
context.closePath();
context.fillStyle = "#FF0000";
context.fill();
context.closePath();
}
/**
@ -283,25 +283,25 @@ PIXI.CanvasRenderer.prototype.renderStripFlat = function(strip)
*/
PIXI.CanvasRenderer.prototype.renderTilingSprite = function(sprite)
{
var context = this.context;
var context = this.context;
context.globalAlpha = sprite.worldAlpha;
context.globalAlpha = sprite.worldAlpha;
if(!sprite.__tilePattern) sprite.__tilePattern = context.createPattern(sprite.texture.baseTexture.source, "repeat");
if(!sprite.__tilePattern) sprite.__tilePattern = context.createPattern(sprite.texture.baseTexture.source, "repeat");
context.beginPath();
context.beginPath();
var tilePosition = sprite.tilePosition;
var tileScale = sprite.tileScale;
var tilePosition = sprite.tilePosition;
var tileScale = sprite.tileScale;
// offset
context.scale(tileScale.x,tileScale.y);
context.translate(tilePosition.x, tilePosition.y);
context.fillStyle = sprite.__tilePattern;
context.fillRect(-tilePosition.x,-tilePosition.y,sprite.width / tileScale.x, sprite.height / tileScale.y);
context.fillStyle = sprite.__tilePattern;
context.fillRect(-tilePosition.x,-tilePosition.y,sprite.width / tileScale.x, sprite.height / tileScale.y);
context.scale(1/tileScale.x, 1/tileScale.y);
context.scale(1/tileScale.x, 1/tileScale.y);
context.translate(-tilePosition.x, -tilePosition.y);
context.closePath();
@ -316,35 +316,35 @@ PIXI.CanvasRenderer.prototype.renderTilingSprite = function(sprite)
*/
PIXI.CanvasRenderer.prototype.renderStrip = function(strip)
{
var context = this.context;
var context = this.context;
// draw triangles!!
var verticies = strip.verticies;
var uvs = strip.uvs;
// draw triangles!!
var verticies = strip.verticies;
var uvs = strip.uvs;
var length = verticies.length/2;
this.count++;
for (var i=1; i < length-2; i++)
{
var length = verticies.length/2;
this.count++;
for (var i=1; i < length-2; i++)
{
// draw some triangles!
var index = i*2;
// draw some triangles!
var index = i*2;
var x0 = verticies[index], x1 = verticies[index+2], x2 = verticies[index+4];
var y0 = verticies[index+1], y1 = verticies[index+3], y2 = verticies[index+5];
var x0 = verticies[index], x1 = verticies[index+2], x2 = verticies[index+4];
var y0 = verticies[index+1], y1 = verticies[index+3], y2 = verticies[index+5];
var u0 = uvs[index] * strip.texture.width, u1 = uvs[index+2] * strip.texture.width, u2 = uvs[index+4]* strip.texture.width;
var v0 = uvs[index+1]* strip.texture.height, v1 = uvs[index+3] * strip.texture.height, v2 = uvs[index+5]* strip.texture.height;
var u0 = uvs[index] * strip.texture.width, u1 = uvs[index+2] * strip.texture.width, u2 = uvs[index+4]* strip.texture.width;
var v0 = uvs[index+1]* strip.texture.height, v1 = uvs[index+3] * strip.texture.height, v2 = uvs[index+5]* strip.texture.height;
context.save();
context.beginPath();
context.moveTo(x0, y0);
context.lineTo(x1, y1);
context.lineTo(x2, y2);
context.closePath();
context.save();
context.beginPath();
context.moveTo(x0, y0);
context.lineTo(x1, y1);
context.lineTo(x2, y2);
context.closePath();
context.clip();
context.clip();
// Compute matrix transform
@ -363,8 +363,8 @@ PIXI.CanvasRenderer.prototype.renderStrip = function(strip)
delta_b/delta, delta_e/delta,
delta_c/delta, delta_f/delta);
context.drawImage(strip.texture.baseTexture.source, 0, 0);
context.restore();
};
context.drawImage(strip.texture.baseTexture.source, 0, 0);
context.restore();
}
}

611
src/pixi/renderers/webgl/WebGLBatch.js
View file

@ -9,14 +9,7 @@ PIXI._batchs = [];
*/
PIXI._getBatch = function(gl)
{
if(PIXI._batchs.length == 0)
{
return new PIXI.WebGLBatch(gl);
}
else
{
return PIXI._batchs.pop();
}
return PIXI._batchs.length ? new PIXI.WebGLBatch(gl) : PIXI._batchs.pop();
}
/**
@ -24,8 +17,8 @@ PIXI._getBatch = function(gl)
*/
PIXI._returnBatch = function(batch)
{
batch.clean();
PIXI._batchs.push(batch);
batch.clean();
PIXI._batchs.push(batch);
}
/**
@ -33,10 +26,10 @@ PIXI._returnBatch = function(batch)
*/
PIXI._restoreBatchs = function(gl)
{
for (var i=0; i < PIXI._batchs.length; i++)
{
PIXI._batchs[i].restoreLostContext(gl);
};
for (var i = 0, l = PIXI._batchs.length; i < l; i++)
{
PIXI._batchs[i].restoreLostContext(gl);
}
}
/**
@ -53,16 +46,16 @@ PIXI._restoreBatchs = function(gl)
*/
PIXI.WebGLBatch = function(gl)
{
this.gl = gl;
this.gl = gl;
this.size = 0;
this.size = 0;
this.vertexBuffer = gl.createBuffer();
this.indexBuffer = gl.createBuffer();
this.uvBuffer = gl.createBuffer();
this.colorBuffer = gl.createBuffer();
this.blendMode = PIXI.blendModes.NORMAL;
this.dynamicSize = 1;
this.vertexBuffer = gl.createBuffer();
this.indexBuffer = gl.createBuffer();
this.uvBuffer = gl.createBuffer();
this.colorBuffer = gl.createBuffer();
this.blendMode = PIXI.blendModes.NORMAL;
this.dynamicSize = 1;
}
// constructor
@ -75,16 +68,15 @@ PIXI.WebGLBatch.prototype.constructor = PIXI.WebGLBatch;
*/
PIXI.WebGLBatch.prototype.clean = function()
{
this.verticies = [];
this.uvs = [];
this.indices = [];
this.colors = [];
this.dynamicSize = 1;
this.texture = null;
this.last = null;
this.size = 0;
this.head;
this.tail;
this.verticies = [];
this.uvs = [];
this.indices = [];
this.colors = [];
this.dynamicSize = 1;
this.texture = null;
this.size = 0;
this.head = null;
this.tail = null;
}
/**
@ -95,11 +87,11 @@ PIXI.WebGLBatch.prototype.clean = function()
*/
PIXI.WebGLBatch.prototype.restoreLostContext = function(gl)
{
this.gl = gl;
this.vertexBuffer = gl.createBuffer();
this.indexBuffer = gl.createBuffer();
this.uvBuffer = gl.createBuffer();
this.colorBuffer = gl.createBuffer();
this.gl = gl;
this.vertexBuffer = gl.createBuffer();
this.indexBuffer = gl.createBuffer();
this.uvBuffer = gl.createBuffer();
this.colorBuffer = gl.createBuffer();
}
/**
@ -107,19 +99,19 @@ PIXI.WebGLBatch.prototype.restoreLostContext = function(gl)
*
* @method init
* @param sprite {Sprite} the first sprite to be added to the batch. Only sprites with
* the same base texture and blend mode will be allowed to be added to this batch
* the same base texture and blend mode will be allowed to be added to this batch
*/
PIXI.WebGLBatch.prototype.init = function(sprite)
{
sprite.batch = this;
this.dirty = true;
this.blendMode = sprite.blendMode;
this.texture = sprite.texture.baseTexture;
this.head = sprite;
this.tail = sprite;
this.size = 1;
sprite.batch = this;
this.dirty = true;
this.blendMode = sprite.blendMode;
this.texture = sprite.texture.baseTexture;
this.head = sprite;
this.tail = sprite;
this.size = 1;
this.growBatch();
this.growBatch();
}
/**
@ -131,23 +123,23 @@ PIXI.WebGLBatch.prototype.init = function(sprite)
*/
PIXI.WebGLBatch.prototype.insertBefore = function(sprite, nextSprite)
{
this.size++;
this.size++;
sprite.batch = this;
this.dirty = true;
var tempPrev = nextSprite.__prev;
nextSprite.__prev = sprite;
sprite.__next = nextSprite;
sprite.batch = this;
this.dirty = true;
var tempPrev = nextSprite.__prev;
nextSprite.__prev = sprite;
sprite.__next = nextSprite;
if(tempPrev)
{
sprite.__prev = tempPrev;
tempPrev.__next = sprite;
}
else
{
this.head = sprite;
}
if(tempPrev)
{
sprite.__prev = tempPrev;
tempPrev.__next = sprite;
}
else
{
this.head = sprite;
}
}
/**
@ -159,24 +151,24 @@ PIXI.WebGLBatch.prototype.insertBefore = function(sprite, nextSprite)
*/
PIXI.WebGLBatch.prototype.insertAfter = function(sprite, previousSprite)
{
this.size++;
this.size++;
sprite.batch = this;
this.dirty = true;
sprite.batch = this;
this.dirty = true;
var tempNext = previousSprite.__next;
previousSprite.__next = sprite;
sprite.__prev = previousSprite;
var tempNext = previousSprite.__next;
previousSprite.__next = sprite;
sprite.__prev = previousSprite;
if(tempNext)
{
sprite.__next = tempNext;
tempNext.__prev = sprite;
}
else
{
this.tail = sprite
}
if(tempNext)
{
sprite.__next = tempNext;
tempNext.__prev = sprite;
}
else
{
this.tail = sprite
}
}
/**
@ -187,40 +179,40 @@ PIXI.WebGLBatch.prototype.insertAfter = function(sprite, previousSprite)
*/
PIXI.WebGLBatch.prototype.remove = function(sprite)
{
this.size--;
this.size--;
if(this.size == 0)
{
sprite.batch = null;
sprite.__prev = null;
sprite.__next = null;
return;
}
if (!this.size)
{
sprite.batch = null;
sprite.__prev = null;
sprite.__next = null;
return;
}
if(sprite.__prev)
{
sprite.__prev.__next = sprite.__next;
}
else
{
this.head = sprite.__next;
this.head.__prev = null;
}
if(sprite.__prev)
{
sprite.__prev.__next = sprite.__next;
}
else
{
this.head = sprite.__next;
this.head.__prev = null;
}
if(sprite.__next)
{
sprite.__next.__prev = sprite.__prev;
}
else
{
this.tail = sprite.__prev;
this.tail.__next = null
}
if(sprite.__next)
{
sprite.__next.__prev = sprite.__prev;
}
else
{
this.tail = sprite.__prev;
this.tail.__next = null
}
sprite.batch = null;
sprite.__next = null;
sprite.__prev = null;
this.dirty = true;
sprite.batch = null;
sprite.__next = null;
sprite.__prev = null;
this.dirty = true;
}
/**
@ -232,36 +224,36 @@ PIXI.WebGLBatch.prototype.remove = function(sprite)
*/
PIXI.WebGLBatch.prototype.split = function(sprite)
{
this.dirty = true;
this.dirty = true;
var batch = new PIXI.WebGLBatch(this.gl);
batch.init(sprite);
batch.texture = this.texture;
batch.tail = this.tail;
var batch = new PIXI.WebGLBatch(this.gl);
batch.init(sprite);
batch.texture = this.texture;
batch.tail = this.tail;
this.tail = sprite.__prev;
this.tail.__next = null;
this.tail = sprite.__prev;
this.tail.__next = null;
sprite.__prev = null;
// return a splite batch!
sprite.__prev = null;
// return a splite batch!
// TODO this size is wrong!
// need to recalculate :/ problem with a linked list!
// unless it gets calculated in the "clean"?
// TODO this size is wrong!
// need to recalculate :/ problem with a linked list!
// unless it gets calculated in the "clean"?
// need to loop through items as there is no way to know the length on a linked list :/
var tempSize = 0;
while(sprite)
{
tempSize++;
sprite.batch = batch;
sprite = sprite.__next;
}
// need to loop through items as there is no way to know the length on a linked list :/
var tempSize = 0;
while(sprite)
{
tempSize++;
sprite.batch = batch;
sprite = sprite.__next;
}
batch.size = tempSize;
this.size -= tempSize;
batch.size = tempSize;
this.size -= tempSize;
return batch;
return batch;
}
/**
@ -272,21 +264,21 @@ PIXI.WebGLBatch.prototype.split = function(sprite)
*/
PIXI.WebGLBatch.prototype.merge = function(batch)
{
this.dirty = true;
this.dirty = true;
this.tail.__next = batch.head;
batch.head.__prev = this.tail;
this.tail.__next = batch.head;
batch.head.__prev = this.tail;
this.size += batch.size;
this.size += batch.size;
this.tail = batch.tail;
this.tail = batch.tail;
var sprite = batch.head;
while(sprite)
{
sprite.batch = this;
sprite = sprite.__next;
}
var sprite = batch.head;
while(sprite)
{
sprite.batch = this;
sprite = sprite.__next;
}
}
/**
@ -298,49 +290,48 @@ PIXI.WebGLBatch.prototype.merge = function(batch)
*/
PIXI.WebGLBatch.prototype.growBatch = function()
{
var gl = this.gl;
if( this.size == 1)
{
this.dynamicSize = 1;
}
else
{
this.dynamicSize = this.size * 1.5
}
// grow verts
this.verticies = new Float32Array(this.dynamicSize * 8);
var gl = this.gl;
if( this.size == 1)
{
this.dynamicSize = 1;
}
else
{
this.dynamicSize = this.size * 1.5
}
// grow verts
this.verticies = new Float32Array(this.dynamicSize * 8);
gl.bindBuffer(gl.ARRAY_BUFFER, this.vertexBuffer);
gl.bufferData(gl.ARRAY_BUFFER,this.verticies , gl.DYNAMIC_DRAW);
gl.bindBuffer(gl.ARRAY_BUFFER, this.vertexBuffer);
gl.bufferData(gl.ARRAY_BUFFER,this.verticies , gl.DYNAMIC_DRAW);
this.uvs = new Float32Array( this.dynamicSize * 8 );
gl.bindBuffer(gl.ARRAY_BUFFER, this.uvBuffer);
gl.bufferData(gl.ARRAY_BUFFER, this.uvs , gl.DYNAMIC_DRAW);
this.uvs = new Float32Array( this.dynamicSize * 8 );
gl.bindBuffer(gl.ARRAY_BUFFER, this.uvBuffer);
gl.bufferData(gl.ARRAY_BUFFER, this.uvs , gl.DYNAMIC_DRAW);
this.dirtyUVS = true;
this.dirtyUVS = true;
this.colors = new Float32Array( this.dynamicSize * 4 );
gl.bindBuffer(gl.ARRAY_BUFFER, this.colorBuffer);
gl.bufferData(gl.ARRAY_BUFFER, this.colors , gl.DYNAMIC_DRAW);
this.colors = new Float32Array( this.dynamicSize * 4 );
gl.bindBuffer(gl.ARRAY_BUFFER, this.colorBuffer);
gl.bufferData(gl.ARRAY_BUFFER, this.colors , gl.DYNAMIC_DRAW);
this.dirtyColors = true;
this.dirtyColors = true;
this.indices = new Uint16Array(this.dynamicSize * 6);
var length = this.indices.length/6;
this.indices = new Uint16Array(this.dynamicSize * 6);
for (var i=0; i < length; i++)
{
var index2 = i * 6;
var index3 = i * 4;
this.indices[index2 + 0] = index3 + 0;
this.indices[index2 + 1] = index3 + 1;
this.indices[index2 + 2] = index3 + 2;
this.indices[index2 + 3] = index3 + 0;
this.indices[index2 + 4] = index3 + 2;
this.indices[index2 + 5] = index3 + 3;
};
for (var i = 0, l = this.indices.length/6; i < l; i++)
{
var index2 = i * 6;
var index3 = i * 4;
this.indices[index2 + 0] = index3 + 0;
this.indices[index2 + 1] = index3 + 1;
this.indices[index2 + 2] = index3 + 2;
this.indices[index2 + 3] = index3 + 0;
this.indices[index2 + 4] = index3 + 2;
this.indices[index2 + 5] = index3 + 3;
}
gl.bindBuffer(gl.ELEMENT_ARRAY_BUFFER, this.indexBuffer);
gl.bindBuffer(gl.ELEMENT_ARRAY_BUFFER, this.indexBuffer);
gl.bufferData(gl.ELEMENT_ARRAY_BUFFER, this.indices, gl.STATIC_DRAW);
}
@ -351,53 +342,53 @@ PIXI.WebGLBatch.prototype.growBatch = function()
*/
PIXI.WebGLBatch.prototype.refresh = function()
{
var gl = this.gl;
var gl = this.gl;
if (this.dynamicSize < this.size)
{
this.growBatch();
}
if (this.dynamicSize < this.size)
{
this.growBatch();
}
var indexRun = 0;
var worldTransform, width, height, aX, aY, w0, w1, h0, h1, index;
var a, b, c, d, tx, ty;
var indexRun = 0;
var worldTransform, width, height, aX, aY, w0, w1, h0, h1, index;
var a, b, c, d, tx, ty;
var displayObject = this.head;
var displayObject = this.head;
while(displayObject)
{
index = indexRun * 8;
while(displayObject)
{
index = indexRun * 8;
var texture = displayObject.texture;
var texture = displayObject.texture;
var frame = texture.frame;
var tw = texture.baseTexture.width;
var th = texture.baseTexture.height;
var frame = texture.frame;
var tw = texture.baseTexture.width;
var th = texture.baseTexture.height;
this.uvs[index + 0] = frame.x / tw;
this.uvs[index +1] = frame.y / th;
this.uvs[index + 0] = frame.x / tw;
this.uvs[index +1] = frame.y / th;
this.uvs[index +2] = (frame.x + frame.width) / tw;
this.uvs[index +3] = frame.y / th;
this.uvs[index +2] = (frame.x + frame.width) / tw;
this.uvs[index +3] = frame.y / th;
this.uvs[index +4] = (frame.x + frame.width) / tw;
this.uvs[index +5] = (frame.y + frame.height) / th;
this.uvs[index +4] = (frame.x + frame.width) / tw;
this.uvs[index +5] = (frame.y + frame.height) / th;
this.uvs[index +6] = frame.x / tw;
this.uvs[index +7] = (frame.y + frame.height) / th;
this.uvs[index +6] = frame.x / tw;
this.uvs[index +7] = (frame.y + frame.height) / th;
displayObject.updateFrame = false;
displayObject.updateFrame = false;
colorIndex = indexRun * 4;
this.colors[colorIndex] = this.colors[colorIndex + 1] = this.colors[colorIndex + 2] = this.colors[colorIndex + 3] = displayObject.worldAlpha;
colorIndex = indexRun * 4;
this.colors[colorIndex] = this.colors[colorIndex + 1] = this.colors[colorIndex + 2] = this.colors[colorIndex + 3] = displayObject.worldAlpha;
displayObject = displayObject.__next;
displayObject = displayObject.__next;
indexRun ++;
}
indexRun ++;
}
this.dirtyUVS = true;
this.dirtyColors = true;
this.dirtyUVS = true;
this.dirtyColors = true;
}
/**
@ -407,108 +398,108 @@ PIXI.WebGLBatch.prototype.refresh = function()
*/
PIXI.WebGLBatch.prototype.update = function()
{
var gl = this.gl;
var worldTransform, width, height, aX, aY, w0, w1, h0, h1, index, index2, index3
var gl = this.gl;
var worldTransform, width, height, aX, aY, w0, w1, h0, h1, index, index2, index3
var a, b, c, d, tx, ty;
var a, b, c, d, tx, ty;
var indexRun = 0;
var indexRun = 0;
var displayObject = this.head;
var displayObject = this.head;
while(displayObject)
{
if(displayObject.vcount === PIXI.visibleCount)
{
width = displayObject.texture.frame.width;
height = displayObject.texture.frame.height;
while(displayObject)
{
if(displayObject.vcount === PIXI.visibleCount)
{
width = displayObject.texture.frame.width;
height = displayObject.texture.frame.height;
// TODO trim??
aX = displayObject.anchor.x;// - displayObject.texture.trim.x
aY = displayObject.anchor.y; //- displayObject.texture.trim.y
w0 = width * (1-aX);
w1 = width * -aX;
// TODO trim??
aX = displayObject.anchor.x;// - displayObject.texture.trim.x
aY = displayObject.anchor.y; //- displayObject.texture.trim.y
w0 = width * (1-aX);
w1 = width * -aX;
h0 = height * (1-aY);
h1 = height * -aY;
h0 = height * (1-aY);
h1 = height * -aY;
index = indexRun * 8;
index = indexRun * 8;
worldTransform = displayObject.worldTransform;
worldTransform = displayObject.worldTransform;
a = worldTransform[0];
b = worldTransform[3];
c = worldTransform[1];
d = worldTransform[4];
tx = worldTransform[2];
ty = worldTransform[5];
a = worldTransform[0];
b = worldTransform[3];
c = worldTransform[1];
d = worldTransform[4];
tx = worldTransform[2];
ty = worldTransform[5];
this.verticies[index + 0 ] = a * w1 + c * h1 + tx;
this.verticies[index + 1 ] = d * h1 + b * w1 + ty;
this.verticies[index + 0 ] = a * w1 + c * h1 + tx;
this.verticies[index + 1 ] = d * h1 + b * w1 + ty;
this.verticies[index + 2 ] = a * w0 + c * h1 + tx;
this.verticies[index + 3 ] = d * h1 + b * w0 + ty;
this.verticies[index + 2 ] = a * w0 + c * h1 + tx;
this.verticies[index + 3 ] = d * h1 + b * w0 + ty;
this.verticies[index + 4 ] = a * w0 + c * h0 + tx;
this.verticies[index + 5 ] = d * h0 + b * w0 + ty;
this.verticies[index + 4 ] = a * w0 + c * h0 + tx;
this.verticies[index + 5 ] = d * h0 + b * w0 + ty;
this.verticies[index + 6] = a * w1 + c * h0 + tx;
this.verticies[index + 7] = d * h0 + b * w1 + ty;
this.verticies[index + 6] = a * w1 + c * h0 + tx;
this.verticies[index + 7] = d * h0 + b * w1 + ty;
if(displayObject.updateFrame || displayObject.texture.updateFrame)
{
this.dirtyUVS = true;
if(displayObject.updateFrame || displayObject.texture.updateFrame)
{
this.dirtyUVS = true;
var texture = displayObject.texture;
var texture = displayObject.texture;
var frame = texture.frame;
var tw = texture.baseTexture.width;
var th = texture.baseTexture.height;
var frame = texture.frame;
var tw = texture.baseTexture.width;
var th = texture.baseTexture.height;
this.uvs[index + 0] = frame.x / tw;
this.uvs[index +1] = frame.y / th;
this.uvs[index + 0] = frame.x / tw;
this.uvs[index +1] = frame.y / th;
this.uvs[index +2] = (frame.x + frame.width) / tw;
this.uvs[index +3] = frame.y / th;
this.uvs[index +2] = (frame.x + frame.width) / tw;
this.uvs[index +3] = frame.y / th;
this.uvs[index +4] = (frame.x + frame.width) / tw;
this.uvs[index +5] = (frame.y + frame.height) / th;
this.uvs[index +4] = (frame.x + frame.width) / tw;
this.uvs[index +5] = (frame.y + frame.height) / th;
this.uvs[index +6] = frame.x / tw;
this.uvs[index +7] = (frame.y + frame.height) / th;
this.uvs[index +6] = frame.x / tw;
this.uvs[index +7] = (frame.y + frame.height) / th;
displayObject.updateFrame = false;
}
displayObject.updateFrame = false;
}
// TODO this probably could do with some optimisation....
if(displayObject.cacheAlpha != displayObject.worldAlpha)
{
displayObject.cacheAlpha = displayObject.worldAlpha;
// TODO this probably could do with some optimisation....
if(displayObject.cacheAlpha != displayObject.worldAlpha)
{
displayObject.cacheAlpha = displayObject.worldAlpha;
var colorIndex = indexRun * 4;
this.colors[colorIndex] = this.colors[colorIndex + 1] = this.colors[colorIndex + 2] = this.colors[colorIndex + 3] = displayObject.worldAlpha;
this.dirtyColors = true;
}
}
else
{
index = indexRun * 8;
var colorIndex = indexRun * 4;
this.colors[colorIndex] = this.colors[colorIndex + 1] = this.colors[colorIndex + 2] = this.colors[colorIndex + 3] = displayObject.worldAlpha;
this.dirtyColors = true;
}
}
else
{
index = indexRun * 8;
this.verticies[index + 0 ] = 0;
this.verticies[index + 1 ] = 0;
this.verticies[index + 0 ] = 0;
this.verticies[index + 1 ] = 0;
this.verticies[index + 2 ] = 0;
this.verticies[index + 3 ] = 0;
this.verticies[index + 2 ] = 0;
this.verticies[index + 3 ] = 0;
this.verticies[index + 4 ] = 0;
this.verticies[index + 5 ] = 0;
this.verticies[index + 4 ] = 0;
this.verticies[index + 5 ] = 0;
this.verticies[index + 6] = 0;
this.verticies[index + 7] = 0;
}
this.verticies[index + 6] = 0;
this.verticies[index + 7] = 0;
}
indexRun++;
displayObject = displayObject.__next;
indexRun++;
displayObject = displayObject.__next;
}
}
@ -519,38 +510,38 @@ PIXI.WebGLBatch.prototype.update = function()
*/
PIXI.WebGLBatch.prototype.render = function(start, end)
{
start = start || 0;
start = start || 0;
if(end == undefined)end = this.size;
if (arguments.length < 2) end = this.size;
if(this.dirty)
{
this.refresh();
this.dirty = false;
}
if(this.dirty)
{
this.refresh();
this.dirty = false;
}
if (this.size == 0)return;
if (!this.size) return;
this.update();
var gl = this.gl;
this.update();
var gl = this.gl;
//TODO optimize this!
//TODO optimize this!
var shaderProgram = PIXI.shaderProgram;
gl.useProgram(shaderProgram);
var shaderProgram = PIXI.shaderProgram;
gl.useProgram(shaderProgram);
// update the verts..
gl.bindBuffer(gl.ARRAY_BUFFER, this.vertexBuffer);
// ok..
gl.bufferSubData(gl.ARRAY_BUFFER, 0, this.verticies)
// update the verts..
gl.bindBuffer(gl.ARRAY_BUFFER, this.vertexBuffer);
// ok..
gl.bufferSubData(gl.ARRAY_BUFFER, 0, this.verticies)
gl.vertexAttribPointer(shaderProgram.vertexPositionAttribute, 2, gl.FLOAT, false, 0, 0);
// update the uvs
gl.bindBuffer(gl.ARRAY_BUFFER, this.uvBuffer);
// update the uvs
gl.bindBuffer(gl.ARRAY_BUFFER, this.uvBuffer);
if(this.dirtyUVS)
{
this.dirtyUVS = false;
gl.bufferSubData(gl.ARRAY_BUFFER, 0, this.uvs);
this.dirtyUVS = false;
gl.bufferSubData(gl.ARRAY_BUFFER, 0, this.uvs);
}
gl.vertexAttribPointer(shaderProgram.textureCoordAttribute, 2, gl.FLOAT, false, 0, 0);
@ -558,21 +549,21 @@ PIXI.WebGLBatch.prototype.render = function(start, end)
gl.activeTexture(gl.TEXTURE0);
gl.bindTexture(gl.TEXTURE_2D, this.texture._glTexture);
// update color!
gl.bindBuffer(gl.ARRAY_BUFFER, this.colorBuffer);
// update color!
gl.bindBuffer(gl.ARRAY_BUFFER, this.colorBuffer);
if(this.dirtyColors)
if(this.dirtyColors)
{
this.dirtyColors = false;
gl.bufferSubData(gl.ARRAY_BUFFER, 0, this.colors);
}
this.dirtyColors = false;
gl.bufferSubData(gl.ARRAY_BUFFER, 0, this.colors);
}
gl.vertexAttribPointer(shaderProgram.colorAttribute, 1, gl.FLOAT, false, 0, 0);
// dont need to upload!
// dont need to upload!
gl.bindBuffer(gl.ELEMENT_ARRAY_BUFFER, this.indexBuffer);
var len = end - start;
var len = end - start;
// DRAW THAT this!
gl.drawElements(gl.TRIANGLES, len * 6, gl.UNSIGNED_SHORT, start * 2 * 6 );

624
src/pixi/renderers/webgl/WebGLGraphics.js
View file

@ -23,63 +23,63 @@ PIXI.WebGLGraphics = function()
*/
PIXI.WebGLGraphics.renderGraphics = function(graphics, projection)
{
var gl = PIXI.gl;
var gl = PIXI.gl;
if(!graphics._webGL)graphics._webGL = {points:[], indices:[], lastIndex:0,
buffer:gl.createBuffer(),
indexBuffer:gl.createBuffer()};
if(!graphics._webGL)graphics._webGL = {points:[], indices:[], lastIndex:0,
buffer:gl.createBuffer(),
indexBuffer:gl.createBuffer()};
if(graphics.dirty)
{
graphics.dirty = false;
if(graphics.dirty)
{
graphics.dirty = false;
if(graphics.clearDirty)
{
graphics.clearDirty = false;
if(graphics.clearDirty)
{
graphics.clearDirty = false;
graphics._webGL.lastIndex = 0;
graphics._webGL.points = [];
graphics._webGL.indices = [];
graphics._webGL.lastIndex = 0;
graphics._webGL.points = [];
graphics._webGL.indices = [];
}
}
PIXI.WebGLGraphics.updateGraphics(graphics);
}
PIXI.WebGLGraphics.updateGraphics(graphics);
}
PIXI.activatePrimitiveShader();
PIXI.activatePrimitiveShader();
// This could be speeded up fo sure!
var m = PIXI.mat3.clone(graphics.worldTransform);
// This could be speeded up fo sure!
var m = PIXI.mat3.clone(graphics.worldTransform);
PIXI.mat3.transpose(m);
PIXI.mat3.transpose(m);
// set the matrix transform for the
gl.blendFunc(gl.ONE, gl.ONE_MINUS_SRC_ALPHA);
// set the matrix transform for the
gl.blendFunc(gl.ONE, gl.ONE_MINUS_SRC_ALPHA);
gl.uniformMatrix3fv(PIXI.primitiveProgram.translationMatrix, false, m);
gl.uniformMatrix3fv(PIXI.primitiveProgram.translationMatrix, false, m);
gl.uniform2f(PIXI.primitiveProgram.projectionVector, projection.x, projection.y);
gl.uniform2f(PIXI.primitiveProgram.projectionVector, projection.x, projection.y);
gl.uniform1f(PIXI.primitiveProgram.alpha, graphics.worldAlpha);
gl.uniform1f(PIXI.primitiveProgram.alpha, graphics.worldAlpha);
gl.bindBuffer(gl.ARRAY_BUFFER, graphics._webGL.buffer);
gl.bindBuffer(gl.ARRAY_BUFFER, graphics._webGL.buffer);
// WHY DOES THIS LINE NEED TO BE THERE???
gl.vertexAttribPointer(PIXI.shaderProgram.vertexPositionAttribute, 2, gl.FLOAT, false, 0, 0);
// its not even used.. but need to be set or it breaks?
// only on pc though..
// WHY DOES THIS LINE NEED TO BE THERE???
gl.vertexAttribPointer(PIXI.shaderProgram.vertexPositionAttribute, 2, gl.FLOAT, false, 0, 0);
// its not even used.. but need to be set or it breaks?
// only on pc though..
gl.vertexAttribPointer(PIXI.primitiveProgram.vertexPositionAttribute, 2, gl.FLOAT, false, 4 * 6, 0);
gl.vertexAttribPointer(PIXI.primitiveProgram.colorAttribute, 4, gl.FLOAT, false,4 * 6, 2 * 4);
gl.vertexAttribPointer(PIXI.primitiveProgram.vertexPositionAttribute, 2, gl.FLOAT, false, 4 * 6, 0);
gl.vertexAttribPointer(PIXI.primitiveProgram.colorAttribute, 4, gl.FLOAT, false,4 * 6, 2 * 4);
// set the index buffer!
gl.bindBuffer(gl.ELEMENT_ARRAY_BUFFER, graphics._webGL.indexBuffer);
// set the index buffer!
gl.bindBuffer(gl.ELEMENT_ARRAY_BUFFER, graphics._webGL.indexBuffer);
gl.drawElements(gl.TRIANGLE_STRIP, graphics._webGL.indices.length, gl.UNSIGNED_SHORT, 0 );
gl.drawElements(gl.TRIANGLE_STRIP, graphics._webGL.indices.length, gl.UNSIGNED_SHORT, 0 );
// return to default shader...
PIXI.activateDefaultShader();
// return to default shader...
PIXI.activateDefaultShader();
}
/**
@ -92,45 +92,45 @@ PIXI.WebGLGraphics.renderGraphics = function(graphics, projection)
*/
PIXI.WebGLGraphics.updateGraphics = function(graphics)
{
for (var i=graphics._webGL.lastIndex; i < graphics.graphicsData.length; i++)
{
var data = graphics.graphicsData[i];
for (var i=graphics._webGL.lastIndex; i < graphics.graphicsData.length; i++)
{
var data = graphics.graphicsData[i];
if(data.type == PIXI.Graphics.POLY)
{
if(data.fill)
{
if(data.points.length>3)
PIXI.WebGLGraphics.buildPoly(data, graphics._webGL);
}
if(data.type == PIXI.Graphics.POLY)
{
if(data.fill)
{
if(data.points.length>3)
PIXI.WebGLGraphics.buildPoly(data, graphics._webGL);
}
if(data.lineWidth > 0)
{
PIXI.WebGLGraphics.buildLine(data, graphics._webGL);
}
}
else if(data.type == PIXI.Graphics.RECT)
{
PIXI.WebGLGraphics.buildRectangle(data, graphics._webGL);
}
else if(data.type == PIXI.Graphics.CIRC || data.type == PIXI.Graphics.ELIP)
{
PIXI.WebGLGraphics.buildCircle(data, graphics._webGL);
}
};
if(data.lineWidth > 0)
{
PIXI.WebGLGraphics.buildLine(data, graphics._webGL);
}
}
else if(data.type == PIXI.Graphics.RECT)
{
PIXI.WebGLGraphics.buildRectangle(data, graphics._webGL);
}
else if(data.type == PIXI.Graphics.CIRC || data.type == PIXI.Graphics.ELIP)
{
PIXI.WebGLGraphics.buildCircle(data, graphics._webGL);
}
}
graphics._webGL.lastIndex = graphics.graphicsData.length;
graphics._webGL.lastIndex = graphics.graphicsData.length;
var gl = PIXI.gl;
var gl = PIXI.gl;
graphics._webGL.glPoints = new Float32Array(graphics._webGL.points);
graphics._webGL.glPoints = new Float32Array(graphics._webGL.points);
gl.bindBuffer(gl.ARRAY_BUFFER, graphics._webGL.buffer);
gl.bufferData(gl.ARRAY_BUFFER, graphics._webGL.glPoints, gl.STATIC_DRAW);
gl.bindBuffer(gl.ARRAY_BUFFER, graphics._webGL.buffer);
gl.bufferData(gl.ARRAY_BUFFER, graphics._webGL.glPoints, gl.STATIC_DRAW);
graphics._webGL.glIndicies = new Uint16Array(graphics._webGL.indices);
graphics._webGL.glIndicies = new Uint16Array(graphics._webGL.indices);
gl.bindBuffer(gl.ELEMENT_ARRAY_BUFFER, graphics._webGL.indexBuffer);
gl.bindBuffer(gl.ELEMENT_ARRAY_BUFFER, graphics._webGL.indexBuffer);
gl.bufferData(gl.ELEMENT_ARRAY_BUFFER, graphics._webGL.glIndicies, gl.STATIC_DRAW);
}
@ -145,57 +145,57 @@ PIXI.WebGLGraphics.updateGraphics = function(graphics)
*/
PIXI.WebGLGraphics.buildRectangle = function(graphicsData, webGLData)
{
// --- //
// need to convert points to a nice regular data
//
var rectData = graphicsData.points;
var x = rectData[0];
var y = rectData[1];
var width = rectData[2];
var height = rectData[3];
// --- //
// need to convert points to a nice regular data
//
var rectData = graphicsData.points;
var x = rectData[0];
var y = rectData[1];
var width = rectData[2];
var height = rectData[3];
if(graphicsData.fill)
{
var color = HEXtoRGB(graphicsData.fillColor);
var alpha = graphicsData.fillAlpha;
if(graphicsData.fill)
{
var color = hex2rgb(graphicsData.fillColor);
var alpha = graphicsData.fillAlpha;
var r = color[0] * alpha;
var g = color[1] * alpha;
var b = color[2] * alpha;
var r = color[0] * alpha;
var g = color[1] * alpha;
var b = color[2] * alpha;
var verts = webGLData.points;
var indices = webGLData.indices;
var verts = webGLData.points;
var indices = webGLData.indices;
var vertPos = verts.length/6;
var vertPos = verts.length/6;
// start
verts.push(x, y);
verts.push(r, g, b, alpha);
// start
verts.push(x, y);
verts.push(r, g, b, alpha);
verts.push(x + width, y);
verts.push(r, g, b, alpha);
verts.push(x + width, y);
verts.push(r, g, b, alpha);
verts.push(x , y + height);
verts.push(r, g, b, alpha);
verts.push(x , y + height);
verts.push(r, g, b, alpha);
verts.push(x + width, y + height);
verts.push(r, g, b, alpha);
verts.push(x + width, y + height);
verts.push(r, g, b, alpha);
// insert 2 dead triangles..
indices.push(vertPos, vertPos, vertPos+1, vertPos+2, vertPos+3, vertPos+3)
}
// insert 2 dead triangles..
indices.push(vertPos, vertPos, vertPos+1, vertPos+2, vertPos+3, vertPos+3)
}
if(graphicsData.lineWidth)
{
graphicsData.points = [x, y,
x + width, y,
x + width, y + height,
x, y + height,
x, y];
if(graphicsData.lineWidth)
{
graphicsData.points = [x, y,
x + width, y,
x + width, y + height,
x, y + height,
x, y];
PIXI.WebGLGraphics.buildLine(graphicsData, webGLData);
}
PIXI.WebGLGraphics.buildLine(graphicsData, webGLData);
}
}
@ -210,60 +210,61 @@ PIXI.WebGLGraphics.buildRectangle = function(graphicsData, webGLData)
*/
PIXI.WebGLGraphics.buildCircle = function(graphicsData, webGLData)
{
// --- //
// need to convert points to a nice regular data
//
var rectData = graphicsData.points;
var x = rectData[0];
var y = rectData[1];
var width = rectData[2];
var height = rectData[3];
// --- //
// need to convert points to a nice regular data
//
var rectData = graphicsData.points;
var x = rectData[0];
var y = rectData[1];
var width = rectData[2];
var height = rectData[3];
var totalSegs = 40;
var seg = (Math.PI * 2) / totalSegs ;
var totalSegs = 40;
var seg = (Math.PI * 2) / totalSegs ;
var i;
if(graphicsData.fill)
{
var color = HEXtoRGB(graphicsData.fillColor);
var alpha = graphicsData.fillAlpha;
if (graphicsData.fill)
{
var color = hex2rgb(graphicsData.fillColor);
var alpha = graphicsData.fillAlpha;
var r = color[0] * alpha;
var g = color[1] * alpha;
var b = color[2] * alpha;
var r = color[0] * alpha;
var g = color[1] * alpha;
var b = color[2] * alpha;
var verts = webGLData.points;
var indices = webGLData.indices;
var verts = webGLData.points;
var indices = webGLData.indices;
var vecPos = verts.length/6;
var vecPos = verts.length/6;
indices.push(vecPos);
indices.push(vecPos);
for (var i=0; i < totalSegs + 1 ; i++)
{
verts.push(x,y, r, g, b, alpha);
for (i = 0; i < totalSegs + 1 ; i++)
{
verts.push(x,y, r, g, b, alpha);
verts.push(x + Math.sin(seg * i) * width,
y + Math.cos(seg * i) * height,
r, g, b, alpha);
verts.push(x + Math.sin(seg * i) * width,
y + Math.cos(seg * i) * height,
r, g, b, alpha);
indices.push(vecPos++, vecPos++);
};
indices.push(vecPos++, vecPos++);
}
indices.push(vecPos-1);
}
indices.push(vecPos-1);
}
if(graphicsData.lineWidth)
{
graphicsData.points = [];
if (graphicsData.lineWidth)
{
graphicsData.points = [];
for (var i=0; i < totalSegs + 1; i++)
{
graphicsData.points.push(x + Math.sin(seg * i) * width,
y + Math.cos(seg * i) * height)
};
for (i = 0; i < totalSegs + 1; i++)
{
graphicsData.points.push(x + Math.sin(seg * i) * width,
y + Math.cos(seg * i) * height)
}
PIXI.WebGLGraphics.buildLine(graphicsData, webGLData);
}
PIXI.WebGLGraphics.buildLine(graphicsData, webGLData);
}
}
@ -278,184 +279,184 @@ PIXI.WebGLGraphics.buildCircle = function(graphicsData, webGLData)
*/
PIXI.WebGLGraphics.buildLine = function(graphicsData, webGLData)
{
// TODO OPTIMISE!
// TODO OPTIMISE!
var wrap = true;
var points = graphicsData.points;
if(points.length == 0)return;
var wrap = true;
var points = graphicsData.points;
if (points.length === 0) return;
// get first and last point.. figure out the middle!
var firstPoint = new PIXI.Point( points[0], points[1] );
var lastPoint = new PIXI.Point( points[points.length - 2], points[points.length - 1] );
// get first and last point.. figure out the middle!
var firstPoint = new PIXI.Point( points[0], points[1] );
var lastPoint = new PIXI.Point( points[points.length - 2], points[points.length - 1] );
// if the first point is the last point - goona have issues :)
if(firstPoint.x == lastPoint.x && firstPoint.y == lastPoint.y)
{
points.pop();
points.pop();
// if the first point is the last point - goona have issues :)
if (firstPoint.x == lastPoint.x && firstPoint.y == lastPoint.y)
{
points.pop();
points.pop();
lastPoint = new PIXI.Point( points[points.length - 2], points[points.length - 1] );
lastPoint = new PIXI.Point( points[points.length - 2], points[points.length - 1] );
var midPointX = lastPoint.x + (firstPoint.x - lastPoint.x) *0.5;
var midPointY = lastPoint.y + (firstPoint.y - lastPoint.y) *0.5;
var midPointX = lastPoint.x + (firstPoint.x - lastPoint.x) *0.5;
var midPointY = lastPoint.y + (firstPoint.y - lastPoint.y) *0.5;
points.unshift(midPointX, midPointY);
points.push(midPointX, midPointY)
}
points.unshift(midPointX, midPointY);
points.push(midPointX, midPointY)
}
var verts = webGLData.points;
var indices = webGLData.indices;
var length = points.length / 2;
var indexCount = points.length;
var indexStart = verts.length/6;
var verts = webGLData.points;
var indices = webGLData.indices;
var length = points.length / 2;
var indexCount = points.length;
var indexStart = verts.length/6;
// DRAW the Line
var width = graphicsData.lineWidth / 2;
// DRAW the Line
var width = graphicsData.lineWidth / 2;
// sort color
var color = HEXtoRGB(graphicsData.lineColor);
var alpha = graphicsData.lineAlpha;
var r = color[0] * alpha;
var g = color[1] * alpha;
var b = color[2] * alpha;
// sort color
var color = hex2rgb(graphicsData.lineColor);
var alpha = graphicsData.lineAlpha;
var r = color[0] * alpha;
var g = color[1] * alpha;
var b = color[2] * alpha;
var p1x, p1y, p2x, p2y, p3x, p3y;
var perpx, perpy, perp2x, perp2y, perp3x, perp3y;
var ipx, ipy;
var a1, b1, c1, a2, b2, c2;
var denom, pdist, dist;
var p1x, p1y, p2x, p2y, p3x, p3y;
var perpx, perpy, perp2x, perp2y, perp3x, perp3y;
var ipx, ipy;
var a1, b1, c1, a2, b2, c2;
var denom, pdist, dist;
p1x = points[0];
p1y = points[1];
p1x = points[0];
p1y = points[1];
p2x = points[2];
p2y = points[3];
p2x = points[2];
p2y = points[3];
perpx = -(p1y - p2y);
perpy = p1x - p2x;
perpx = -(p1y - p2y);
perpy = p1x - p2x;
dist = Math.sqrt(perpx*perpx + perpy*perpy);
dist = Math.sqrt(perpx*perpx + perpy*perpy);
perpx /= dist;
perpy /= dist;
perpx *= width;
perpy *= width;
perpx /= dist;
perpy /= dist;
perpx *= width;
perpy *= width;
// start
verts.push(p1x - perpx , p1y - perpy,
r, g, b, alpha);
// start
verts.push(p1x - perpx , p1y - perpy,
r, g, b, alpha);
verts.push(p1x + perpx , p1y + perpy,
r, g, b, alpha);
verts.push(p1x + perpx , p1y + perpy,
r, g, b, alpha);
for (var i = 1; i < length-1; i++)
{
p1x = points[(i-1)*2];
p1y = points[(i-1)*2 + 1];
for (var i = 1; i < length-1; i++)
{
p1x = points[(i-1)*2];
p1y = points[(i-1)*2 + 1];
p2x = points[(i)*2]
p2y = points[(i)*2 + 1]
p2x = points[(i)*2]
p2y = points[(i)*2 + 1]
p3x = points[(i+1)*2];
p3y = points[(i+1)*2 + 1];
p3x = points[(i+1)*2];
p3y = points[(i+1)*2 + 1];
perpx = -(p1y - p2y);
perpy = p1x - p2x;
perpx = -(p1y - p2y);
perpy = p1x - p2x;
dist = Math.sqrt(perpx*perpx + perpy*perpy);
perpx /= dist;
perpy /= dist;
perpx *= width;
perpy *= width;
dist = Math.sqrt(perpx*perpx + perpy*perpy);
perpx /= dist;
perpy /= dist;
perpx *= width;
perpy *= width;
perp2x = -(p2y - p3y);
perp2y = p2x - p3x;
perp2x = -(p2y - p3y);
perp2y = p2x - p3x;
dist = Math.sqrt(perp2x*perp2x + perp2y*perp2y);
perp2x /= dist;
perp2y /= dist;
perp2x *= width;
perp2y *= width;
dist = Math.sqrt(perp2x*perp2x + perp2y*perp2y);
perp2x /= dist;
perp2y /= dist;
perp2x *= width;
perp2y *= width;
a1 = (-perpy + p1y) - (-perpy + p2y);
b1 = (-perpx + p2x) - (-perpx + p1x);
c1 = (-perpx + p1x) * (-perpy + p2y) - (-perpx + p2x) * (-perpy + p1y);
a2 = (-perp2y + p3y) - (-perp2y + p2y);
b2 = (-perp2x + p2x) - (-perp2x + p3x);
c2 = (-perp2x + p3x) * (-perp2y + p2y) - (-perp2x + p2x) * (-perp2y + p3y);
a1 = (-perpy + p1y) - (-perpy + p2y);
b1 = (-perpx + p2x) - (-perpx + p1x);
c1 = (-perpx + p1x) * (-perpy + p2y) - (-perpx + p2x) * (-perpy + p1y);
a2 = (-perp2y + p3y) - (-perp2y + p2y);
b2 = (-perp2x + p2x) - (-perp2x + p3x);
c2 = (-perp2x + p3x) * (-perp2y + p2y) - (-perp2x + p2x) * (-perp2y + p3y);
denom = a1*b2 - a2*b1;
denom = a1*b2 - a2*b1;
if (denom == 0) {
denom+=1;
}
if (denom === 0) {
denom+=1;
}
px = (b1*c2 - b2*c1)/denom;
py = (a2*c1 - a1*c2)/denom;
px = (b1*c2 - b2*c1)/denom;
py = (a2*c1 - a1*c2)/denom;
pdist = (px -p2x) * (px -p2x) + (py -p2y) + (py -p2y);
pdist = (px -p2x) * (px -p2x) + (py -p2y) + (py -p2y);
if(pdist > 140 * 140)
{
perp3x = perpx - perp2x;
perp3y = perpy - perp2y;
if(pdist > 140 * 140)
{
perp3x = perpx - perp2x;
perp3y = perpy - perp2y;
dist = Math.sqrt(perp3x*perp3x + perp3y*perp3y);
perp3x /= dist;
perp3y /= dist;
perp3x *= width;
perp3y *= width;
dist = Math.sqrt(perp3x*perp3x + perp3y*perp3y);
perp3x /= dist;
perp3y /= dist;
perp3x *= width;
perp3y *= width;
verts.push(p2x - perp3x, p2y -perp3y);
verts.push(r, g, b, alpha);
verts.push(p2x - perp3x, p2y -perp3y);
verts.push(r, g, b, alpha);
verts.push(p2x + perp3x, p2y +perp3y);
verts.push(r, g, b, alpha);
verts.push(p2x + perp3x, p2y +perp3y);
verts.push(r, g, b, alpha);
verts.push(p2x - perp3x, p2y -perp3y);
verts.push(r, g, b, alpha);
verts.push(p2x - perp3x, p2y -perp3y);
verts.push(r, g, b, alpha);
indexCount++;
}
else
{
verts.push(px , py);
verts.push(r, g, b, alpha);
indexCount++;
}
else
{
verts.push(px , py);
verts.push(r, g, b, alpha);
verts.push(p2x - (px-p2x), p2y - (py - p2y));
verts.push(r, g, b, alpha);
}
}
verts.push(p2x - (px-p2x), p2y - (py - p2y));
verts.push(r, g, b, alpha);
}
}
p1x = points[(length-2)*2]
p1y = points[(length-2)*2 + 1]
p1x = points[(length-2)*2]
p1y = points[(length-2)*2 + 1]
p2x = points[(length-1)*2]
p2y = points[(length-1)*2 + 1]
p2x = points[(length-1)*2]
p2y = points[(length-1)*2 + 1]
perpx = -(p1y - p2y)
perpy = p1x - p2x;
perpx = -(p1y - p2y)
perpy = p1x - p2x;
dist = Math.sqrt(perpx*perpx + perpy*perpy);
perpx /= dist;
perpy /= dist;
perpx *= width;
perpy *= width;
dist = Math.sqrt(perpx*perpx + perpy*perpy);
perpx /= dist;
perpy /= dist;
perpx *= width;
perpy *= width;
verts.push(p2x - perpx , p2y - perpy)
verts.push(r, g, b, alpha);
verts.push(p2x - perpx , p2y - perpy)
verts.push(r, g, b, alpha);
verts.push(p2x + perpx , p2y + perpy)
verts.push(r, g, b, alpha);
verts.push(p2x + perpx , p2y + perpy)
verts.push(r, g, b, alpha);
indices.push(indexStart);
indices.push(indexStart);
for (var i=0; i < indexCount; i++)
{
indices.push(indexStart++);
};
for (i = 0; i < indexCount; i++)
{
indices.push(indexStart++);
}
indices.push(indexStart-1);
indices.push(indexStart-1);
}
/**
@ -469,46 +470,37 @@ PIXI.WebGLGraphics.buildLine = function(graphicsData, webGLData)
*/
PIXI.WebGLGraphics.buildPoly = function(graphicsData, webGLData)
{
var points = graphicsData.points;
if(points.length < 6)return;
var points = graphicsData.points;
if (points.length < 6) return;
// get first and last point.. figure out the middle!
var verts = webGLData.points;
var indices = webGLData.indices;
// get first and last point.. figure out the middle!
var verts = webGLData.points;
var indices = webGLData.indices;
var length = points.length / 2;
var triangles = PIXI.PolyK.Triangulate(points);
var vertPos = verts.length / 6;
// sort color
var color = HEXtoRGB(graphicsData.fillColor);
var alpha = graphicsData.fillAlpha;
var r = color[0] * alpha;
var g = color[1] * alpha;
var b = color[2] * alpha;
for (var i = 0, l = triangles.length; i < l; i+=3)
{
indices.push(triangles[i] + vertPos);
indices.push(triangles[i] + vertPos);
indices.push(triangles[i+1] + vertPos);
indices.push(triangles[i+2] +vertPos);
indices.push(triangles[i+2] + vertPos);
}
var triangles = PIXI.PolyK.Triangulate(points);
// sort color
var color = hex2rgb(graphicsData.fillColor);
var alpha = graphicsData.fillAlpha;
var r = color[0] * alpha;
var g = color[1] * alpha;
var b = color[2] * alpha;
var vertPos = verts.length / 6;
for (var i=0; i < triangles.length; i+=3)
{
indices.push(triangles[i] + vertPos);
indices.push(triangles[i] + vertPos);
indices.push(triangles[i+1] + vertPos);
indices.push(triangles[i+2] +vertPos);
indices.push(triangles[i+2] + vertPos);
};
for (var i = 0; i < length; i++)
{
verts.push(points[i * 2], points[i * 2 + 1],
r, g, b, alpha);
};
}
function HEXtoRGB(hex) {
return [(hex >> 16 & 0xFF) / 255, ( hex >> 8 & 0xFF) / 255, (hex & 0xFF)/ 255];
for (i = 0, l = points.length / 2; i < l; i++)
{
verts.push(points[i * 2], points[i * 2 + 1],
r, g, b, alpha);
}
}

1309
src/pixi/renderers/webgl/WebGLRenderGroup.js
View file

File diff suppressed because it is too large Load diff

302
src/pixi/renderers/webgl/WebGLRenderer.js
View file

@ -6,7 +6,7 @@ PIXI._defaultFrame = new PIXI.Rectangle(0,0,1,1);
// an instance of the gl context..
// only one at the moment :/
PIXI.gl;
PIXI.gl = null;
/**
* the WebGLRenderer is draws the stage and all its content onto a webGL enabled canvas. This renderer
@ -25,36 +25,36 @@ PIXI.gl;
*/
PIXI.WebGLRenderer = function(width, height, view, transparent, antialias)
{
// do a catch.. only 1 webGL renderer..
// do a catch.. only 1 webGL renderer..
this.transparent = !!transparent;
this.transparent = !!transparent;
this.width = width || 800;
this.height = height || 600;
this.width = width || 800;
this.height = height || 600;
this.view = view || document.createElement( 'canvas' );
this.view = view || document.createElement( 'canvas' );
this.view.width = this.width;
this.view.height = this.height;
this.view.height = this.height;
// deal with losing context..
// deal with losing context..
var scope = this;
this.view.addEventListener('webglcontextlost', function(event) { scope.handleContextLost(event); }, false)
this.view.addEventListener('webglcontextrestored', function(event) { scope.handleContextRestored(event); }, false)
this.view.addEventListener('webglcontextlost', function(event) { scope.handleContextLost(event); }, false)
this.view.addEventListener('webglcontextrestored', function(event) { scope.handleContextRestored(event); }, false)
this.batchs = [];
this.batchs = [];
try
{
try
{
PIXI.gl = this.gl = this.view.getContext("experimental-webgl", {
alpha: this.transparent,
antialias:!!antialias, // SPEED UP??
premultipliedAlpha:false,
stencil:true
alpha: this.transparent,
antialias:!!antialias, // SPEED UP??
premultipliedAlpha:false,
stencil:true
});
}
catch (e)
{
throw new Error(" This browser does not support webGL. Try using the canvas renderer" + this);
throw new Error(" This browser does not support webGL. Try using the canvas renderer" + this);
}
PIXI.initPrimitiveShader();
@ -67,8 +67,8 @@ PIXI.WebGLRenderer = function(width, height, view, transparent, antialias)
PIXI.WebGLRenderer.gl = gl;
this.batch = new PIXI.WebGLBatch(gl);
gl.disable(gl.DEPTH_TEST);
gl.disable(gl.CULL_FACE);
gl.disable(gl.DEPTH_TEST);
gl.disable(gl.CULL_FACE);
gl.enable(gl.BLEND);
gl.colorMask(true, true, true, this.transparent);
@ -94,14 +94,14 @@ PIXI.WebGLRenderer.prototype.constructor = PIXI.WebGLRenderer;
*/
PIXI.WebGLRenderer.getBatch = function()
{
if(PIXI._batchs.length == 0)
{
return new PIXI.WebGLBatch(PIXI.WebGLRenderer.gl);
}
else
{
return PIXI._batchs.pop();
}
if(!PIXI._batchs.length)
{
return new PIXI.WebGLBatch(PIXI.WebGLRenderer.gl);
}
else
{
return PIXI._batchs.pop();
}
}
/**
@ -114,8 +114,8 @@ PIXI.WebGLRenderer.getBatch = function()
*/
PIXI.WebGLRenderer.returnBatch = function(batch)
{
batch.clean();
PIXI._batchs.push(batch);
batch.clean();
PIXI._batchs.push(batch);
}
/**
@ -126,72 +126,72 @@ PIXI.WebGLRenderer.returnBatch = function(batch)
*/
PIXI.WebGLRenderer.prototype.render = function(stage)
{
if(this.contextLost)return;
if(this.contextLost)return;
// if rendering a new stage clear the batchs..
if(this.__stage !== stage)
{
// TODO make this work
// dont think this is needed any more?
this.__stage = stage;
this.stageRenderGroup.setRenderable(stage);
}
// if rendering a new stage clear the batchs..
if(this.__stage !== stage)
{
// TODO make this work
// dont think this is needed any more?
this.__stage = stage;
this.stageRenderGroup.setRenderable(stage);
}
// TODO not needed now...
// update children if need be
// best to remove first!
/*for (var i=0; i < stage.__childrenRemoved.length; i++)
{
var group = stage.__childrenRemoved[i].__renderGroup
if(group)group.removeDisplayObject(stage.__childrenRemoved[i]);
}*/
// TODO not needed now...
// update children if need be
// best to remove first!
/*for (var i=0; i < stage.__childrenRemoved.length; i++)
{
var group = stage.__childrenRemoved[i].__renderGroup
if(group)group.removeDisplayObject(stage.__childrenRemoved[i]);
}*/
// update any textures
PIXI.WebGLRenderer.updateTextures();
// update any textures
PIXI.WebGLRenderer.updateTextures();
// update the scene graph
PIXI.visibleCount++;
stage.updateTransform();
// update the scene graph
PIXI.visibleCount++;
stage.updateTransform();
var gl = this.gl;
var gl = this.gl;
// -- Does this need to be set every frame? -- //
gl.colorMask(true, true, true, this.transparent);
gl.viewport(0, 0, this.width, this.height);
// -- Does this need to be set every frame? -- //
gl.colorMask(true, true, true, this.transparent);
gl.viewport(0, 0, this.width, this.height);
gl.bindFramebuffer(gl.FRAMEBUFFER, null);
gl.bindFramebuffer(gl.FRAMEBUFFER, null);
gl.clearColor(stage.backgroundColorSplit[0],stage.backgroundColorSplit[1],stage.backgroundColorSplit[2], !this.transparent);
gl.clear(gl.COLOR_BUFFER_BIT);
gl.clearColor(stage.backgroundColorSplit[0],stage.backgroundColorSplit[1],stage.backgroundColorSplit[2], !this.transparent);
gl.clear(gl.COLOR_BUFFER_BIT);
// HACK TO TEST
// HACK TO TEST
this.stageRenderGroup.backgroundColor = stage.backgroundColorSplit;
this.stageRenderGroup.render(PIXI.projection);
// this.stageRenderGroup.backgroundColor = stage.backgroundColorSplit;
this.stageRenderGroup.render(PIXI.projection);
// interaction
// run interaction!
if(stage.interactive)
{
//need to add some events!
if(!stage._interactiveEventsAdded)
{
stage._interactiveEventsAdded = true;
stage.interactionManager.setTarget(this);
}
}
// interaction
// run interaction!
if(stage.interactive)
{
//need to add some events!
if(!stage._interactiveEventsAdded)
{
stage._interactiveEventsAdded = true;
stage.interactionManager.setTarget(this);
}
}
// after rendering lets confirm all frames that have been uodated..
if(PIXI.Texture.frameUpdates.length > 0)
{
for (var i=0; i < PIXI.Texture.frameUpdates.length; i++)
{
PIXI.Texture.frameUpdates[i].updateFrame = false;
};
// after rendering lets confirm all frames that have been uodated..
if(PIXI.Texture.frameUpdates.length > 0)
{
for (var i = 0, l = PIXI.Texture.frameUpdates.length; i < l; i++)
{
PIXI.Texture.frameUpdates[i].updateFrame = false;
}
PIXI.Texture.frameUpdates = [];
}
PIXI.Texture.frameUpdates = [];
}
}
/**
@ -203,11 +203,13 @@ PIXI.WebGLRenderer.prototype.render = function(stage)
*/
PIXI.WebGLRenderer.updateTextures = function()
{
//TODO break this out into a texture manager...
for (var i=0; i < PIXI.texturesToUpdate.length; i++) PIXI.WebGLRenderer.updateTexture(PIXI.texturesToUpdate[i]);
for (var i=0; i < PIXI.texturesToDestroy.length; i++) PIXI.WebGLRenderer.destroyTexture(PIXI.texturesToDestroy[i]);
PIXI.texturesToUpdate = [];
PIXI.texturesToDestroy = [];
//TODO break this out into a texture manager...
for (var i = 0, l = PIXI.texturesToUpdate.length; i < l; i++)
PIXI.WebGLRenderer.updateTexture(PIXI.texturesToUpdate[i]);
for (i = 0, l = PIXI.texturesToDestroy.length; i < l; i++)
PIXI.WebGLRenderer.destroyTexture(PIXI.texturesToDestroy[i]);
PIXI.texturesToUpdate = [];
PIXI.texturesToDestroy = [];
}
/**
@ -220,38 +222,38 @@ PIXI.WebGLRenderer.updateTextures = function()
*/
PIXI.WebGLRenderer.updateTexture = function(texture)
{
//TODO break this out into a texture manager...
var gl = PIXI.gl;
//TODO break this out into a texture manager...
var gl = PIXI.gl;
if(!texture._glTexture)
{
texture._glTexture = gl.createTexture();
}
if(!texture._glTexture)
{
texture._glTexture = gl.createTexture();
}
if(texture.hasLoaded)
{
gl.bindTexture(gl.TEXTURE_2D, texture._glTexture);
gl.pixelStorei(gl.UNPACK_PREMULTIPLY_ALPHA_WEBGL, true);
if(texture.hasLoaded)
{
gl.bindTexture(gl.TEXTURE_2D, texture._glTexture);
gl.pixelStorei(gl.UNPACK_PREMULTIPLY_ALPHA_WEBGL, true);
gl.texImage2D(gl.TEXTURE_2D, 0, gl.RGBA, gl.RGBA, gl.UNSIGNED_BYTE, texture.source);
gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MAG_FILTER, gl.LINEAR);
gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MIN_FILTER, gl.LINEAR);
gl.texImage2D(gl.TEXTURE_2D, 0, gl.RGBA, gl.RGBA, gl.UNSIGNED_BYTE, texture.source);
gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MAG_FILTER, gl.LINEAR);
gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MIN_FILTER, gl.LINEAR);
// reguler...
// reguler...
if(!texture._powerOf2)
{
gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_S, gl.CLAMP_TO_EDGE);
gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_T, gl.CLAMP_TO_EDGE);
}
else
{
gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_S, gl.REPEAT);
gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_T, gl.REPEAT);
}
if(!texture._powerOf2)
{
gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_S, gl.CLAMP_TO_EDGE);
gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_T, gl.CLAMP_TO_EDGE);
}
else
{
gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_S, gl.REPEAT);
gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_T, gl.REPEAT);
}
gl.bindTexture(gl.TEXTURE_2D, null);
}
gl.bindTexture(gl.TEXTURE_2D, null);
}
}
/**
@ -263,14 +265,14 @@ PIXI.WebGLRenderer.updateTexture = function(texture)
*/
PIXI.WebGLRenderer.destroyTexture = function(texture)
{
//TODO break this out into a texture manager...
var gl = PIXI.gl;
//TODO break this out into a texture manager...
var gl = PIXI.gl;
if(texture._glTexture)
{
texture._glTexture = gl.createTexture();
gl.deleteTexture(gl.TEXTURE_2D, texture._glTexture);
}
if(texture._glTexture)
{
texture._glTexture = gl.createTexture();
gl.deleteTexture(gl.TEXTURE_2D, texture._glTexture);
}
}
/**
@ -282,23 +284,23 @@ PIXI.WebGLRenderer.destroyTexture = function(texture)
*/
PIXI.WebGLRenderer.prototype.resize = function(width, height)
{
this.width = width;
this.height = height;
this.width = width;
this.height = height;
this.view.width = width;
this.view.height = height;
this.view.width = width;
this.view.height = height;
this.gl.viewport(0, 0, this.width, this.height);
this.gl.viewport(0, 0, this.width, this.height);
//var projectionMatrix = this.projectionMatrix;
//var projectionMatrix = this.projectionMatrix;
PIXI.projection.x = this.width/2;
PIXI.projection.y = this.height/2;
PIXI.projection.x = this.width/2;
PIXI.projection.y = this.height/2;
// projectionMatrix[0] = 2/this.width;
// projectionMatrix[5] = -2/this.height;
// projectionMatrix[12] = -1;
// projectionMatrix[13] = 1;
// projectionMatrix[0] = 2/this.width;
// projectionMatrix[5] = -2/this.height;
// projectionMatrix[12] = -1;
// projectionMatrix[13] = 1;
}
/**
@ -310,8 +312,8 @@ PIXI.WebGLRenderer.prototype.resize = function(width, height)
*/
PIXI.WebGLRenderer.prototype.handleContextLost = function(event)
{
event.preventDefault();
this.contextLost = true;
event.preventDefault();
this.contextLost = true;
}
/**
@ -323,26 +325,26 @@ PIXI.WebGLRenderer.prototype.handleContextLost = function(event)
*/
PIXI.WebGLRenderer.prototype.handleContextRestored = function(event)
{
this.gl = this.view.getContext("experimental-webgl", {
alpha: true
this.gl = this.view.getContext("experimental-webgl", {
alpha: true
});
this.initShaders();
this.initShaders();
for(var key in PIXI.TextureCache)
{
var texture = PIXI.TextureCache[key].baseTexture;
texture._glTexture = null;
PIXI.WebGLRenderer.updateTexture(texture);
};
for(var key in PIXI.TextureCache)
{
var texture = PIXI.TextureCache[key].baseTexture;
texture._glTexture = null;
PIXI.WebGLRenderer.updateTexture(texture);
}
for (var i=0; i < this.batchs.length; i++)
{
this.batchs[i].restoreLostContext(this.gl)//
this.batchs[i].dirty = true;
};
for (var i = 0, l = this.batchs.length; i < l; i++)
{
this.batchs[i].restoreLostContext(this.gl)//
this.batchs[i].dirty = true;
}
PIXI._restoreBatchs(this.gl);
PIXI._restoreBatchs(this.gl);
this.contextLost = false;
this.contextLost = false;
}

60
src/pixi/renderers/webgl/WebGLShaders.js
View file

@ -62,7 +62,7 @@ PIXI.stripShaderVertexSrc = [
"varying vec2 vTextureCoord;",
"varying float vColor;",
"void main(void) {",
"vec3 v = translationMatrix * vec3(aVertexPosition, 1.0);",
"vec3 v = translationMatrix * vec3(aVertexPosition, 1.0);",
"gl_Position = vec4( v.x / projectionVector.x -1.0, v.y / -projectionVector.y + 1.0 , 0.0, 1.0);",
"vTextureCoord = aTextureCoord;",
"vColor = aColor;",
@ -90,7 +90,7 @@ PIXI.primitiveShaderVertexSrc = [
"uniform float alpha;",
"varying vec4 vColor;",
"void main(void) {",
"vec3 v = translationMatrix * vec3(aVertexPosition, 1.0);",
"vec3 v = translationMatrix * vec3(aVertexPosition, 1.0);",
"gl_Position = vec4( v.x / projectionVector.x -1.0, v.y / -projectionVector.y + 1.0 , 0.0, 1.0);",
"vColor = aColor * alpha;",
"}"
@ -98,9 +98,9 @@ PIXI.primitiveShaderVertexSrc = [
PIXI.initPrimitiveShader = function()
{
var gl = PIXI.gl;
var gl = PIXI.gl;
var shaderProgram = PIXI.compileProgram(PIXI.primitiveShaderVertexSrc, PIXI.primitiveShaderFragmentSrc)
var shaderProgram = PIXI.compileProgram(PIXI.primitiveShaderVertexSrc, PIXI.primitiveShaderFragmentSrc)
gl.useProgram(shaderProgram);
@ -110,49 +110,49 @@ PIXI.initPrimitiveShader = function()
shaderProgram.projectionVector = gl.getUniformLocation(shaderProgram, "projectionVector");
shaderProgram.translationMatrix = gl.getUniformLocation(shaderProgram, "translationMatrix");
shaderProgram.alpha = gl.getUniformLocation(shaderProgram, "alpha");
shaderProgram.alpha = gl.getUniformLocation(shaderProgram, "alpha");
PIXI.primitiveProgram = shaderProgram;
PIXI.primitiveProgram = shaderProgram;
}
PIXI.initDefaultShader = function()
{
var gl = this.gl;
var shaderProgram = PIXI.compileProgram(PIXI.shaderVertexSrc, PIXI.shaderFragmentSrc)
var gl = this.gl;
var shaderProgram = PIXI.compileProgram(PIXI.shaderVertexSrc, PIXI.shaderFragmentSrc)
gl.useProgram(shaderProgram);
shaderProgram.vertexPositionAttribute = gl.getAttribLocation(shaderProgram, "aVertexPosition");
shaderProgram.projectionVector = gl.getUniformLocation(shaderProgram, "projectionVector");
shaderProgram.textureCoordAttribute = gl.getAttribLocation(shaderProgram, "aTextureCoord");
shaderProgram.colorAttribute = gl.getAttribLocation(shaderProgram, "aColor");
shaderProgram.colorAttribute = gl.getAttribLocation(shaderProgram, "aColor");
// shaderProgram.mvMatrixUniform = gl.getUniformLocation(shaderProgram, "uMVMatrix");
shaderProgram.samplerUniform = gl.getUniformLocation(shaderProgram, "uSampler");
PIXI.shaderProgram = shaderProgram;
PIXI.shaderProgram = shaderProgram;
}
PIXI.initDefaultStripShader = function()
{
var gl = this.gl;
var shaderProgram = PIXI.compileProgram(PIXI.stripShaderVertexSrc, PIXI.stripShaderFragmentSrc)
var gl = this.gl;
var shaderProgram = PIXI.compileProgram(PIXI.stripShaderVertexSrc, PIXI.stripShaderFragmentSrc)
gl.useProgram(shaderProgram);
shaderProgram.vertexPositionAttribute = gl.getAttribLocation(shaderProgram, "aVertexPosition");
shaderProgram.projectionVector = gl.getUniformLocation(shaderProgram, "projectionVector");
shaderProgram.textureCoordAttribute = gl.getAttribLocation(shaderProgram, "aTextureCoord");
shaderProgram.translationMatrix = gl.getUniformLocation(shaderProgram, "translationMatrix");
shaderProgram.alpha = gl.getUniformLocation(shaderProgram, "alpha");
shaderProgram.translationMatrix = gl.getUniformLocation(shaderProgram, "translationMatrix");
shaderProgram.alpha = gl.getUniformLocation(shaderProgram, "alpha");
shaderProgram.colorAttribute = gl.getAttribLocation(shaderProgram, "aColor");
shaderProgram.colorAttribute = gl.getAttribLocation(shaderProgram, "aColor");
shaderProgram.projectionVector = gl.getUniformLocation(shaderProgram, "projectionVector");
shaderProgram.samplerUniform = gl.getUniformLocation(shaderProgram, "uSampler");
PIXI.stripShaderProgram = shaderProgram;
PIXI.stripShaderProgram = shaderProgram;
}
PIXI.CompileVertexShader = function(gl, shaderSrc)
@ -183,11 +183,11 @@ PIXI._CompileShader = function(gl, shaderSrc, shaderType)
PIXI.compileProgram = function(vertexSrc, fragmentSrc)
{
var gl = PIXI.gl;
var fragmentShader = PIXI.CompileFragmentShader(gl, fragmentSrc);
var vertexShader = PIXI.CompileVertexShader(gl, vertexSrc);
var gl = PIXI.gl;
var fragmentShader = PIXI.CompileFragmentShader(gl, fragmentSrc);
var vertexShader = PIXI.CompileVertexShader(gl, vertexSrc);
var shaderProgram = gl.createProgram();
var shaderProgram = gl.createProgram();
gl.attachShader(shaderProgram, vertexShader);
gl.attachShader(shaderProgram, fragmentShader);
@ -197,19 +197,19 @@ PIXI.compileProgram = function(vertexSrc, fragmentSrc)
alert("Could not initialise shaders");
}
return shaderProgram;
return shaderProgram;
}
PIXI.activateDefaultShader = function()
{
var gl = PIXI.gl;
var shaderProgram = PIXI.shaderProgram;
var gl = PIXI.gl;
var shaderProgram = PIXI.shaderProgram;
gl.useProgram(shaderProgram);
gl.useProgram(shaderProgram);
gl.enableVertexAttribArray(shaderProgram.vertexPositionAttribute);
gl.enableVertexAttribArray(shaderProgram.vertexPositionAttribute);
gl.enableVertexAttribArray(shaderProgram.textureCoordAttribute);
gl.enableVertexAttribArray(shaderProgram.colorAttribute);
}
@ -218,14 +218,14 @@ PIXI.activateDefaultShader = function()
PIXI.activatePrimitiveShader = function()
{
var gl = PIXI.gl;
var gl = PIXI.gl;
gl.disableVertexAttribArray(PIXI.shaderProgram.textureCoordAttribute);
gl.disableVertexAttribArray(PIXI.shaderProgram.textureCoordAttribute);
gl.disableVertexAttribArray(PIXI.shaderProgram.colorAttribute);
gl.useProgram(PIXI.primitiveProgram);
gl.useProgram(PIXI.primitiveProgram);
gl.enableVertexAttribArray(PIXI.primitiveProgram.vertexPositionAttribute);
gl.enableVertexAttribArray(PIXI.primitiveProgram.colorAttribute);
gl.enableVertexAttribArray(PIXI.primitiveProgram.vertexPositionAttribute);
gl.enableVertexAttribArray(PIXI.primitiveProgram.colorAttribute);
}

8
src/pixi/text/BitmapText.js
View file

@ -147,8 +147,8 @@ PIXI.BitmapText.prototype.updateText = function()
*/
PIXI.BitmapText.prototype.updateTransform = function()
{
if(this.dirty)
{
if(this.dirty)
{
while(this.children.length > 0)
{
this.removeChild(this.getChildAt(0));
@ -156,9 +156,9 @@ PIXI.BitmapText.prototype.updateTransform = function()
this.updateText();
this.dirty = false;
}
}
PIXI.DisplayObjectContainer.prototype.updateTransform.call(this);
PIXI.DisplayObjectContainer.prototype.updateTransform.call(this);
};
PIXI.BitmapText.fonts = {};

226
src/pixi/text/Text.js
View file

@ -82,65 +82,65 @@ PIXI.Text.prototype.setText = function(text)
*/
PIXI.Text.prototype.updateText = function()
{
this.context.font = this.style.font;
this.context.font = this.style.font;
var outputText = this.text;
var outputText = this.text;
// word wrap
// preserve original text
if(this.style.wordWrap)outputText = this.wordWrap(this.text);
// word wrap
// preserve original text
if(this.style.wordWrap)outputText = this.wordWrap(this.text);
//split text into lines
var lines = outputText.split(/(?:\r\n|\r|\n)/);
//split text into lines
var lines = outputText.split(/(?:\r\n|\r|\n)/);
//calculate text width
var lineWidths = [];
var maxLineWidth = 0;
for (var i = 0; i < lines.length; i++)
{
var lineWidth = this.context.measureText(lines[i]).width;
lineWidths[i] = lineWidth;
maxLineWidth = Math.max(maxLineWidth, lineWidth);
}
this.canvas.width = maxLineWidth + this.style.strokeThickness;
//calculate text width
var lineWidths = [];
var maxLineWidth = 0;
for (var i = 0; i < lines.length; i++)
{
var lineWidth = this.context.measureText(lines[i]).width;
lineWidths[i] = lineWidth;
maxLineWidth = Math.max(maxLineWidth, lineWidth);
}
this.canvas.width = maxLineWidth + this.style.strokeThickness;
//calculate text height
var lineHeight = this.determineFontHeight("font: " + this.style.font + ";") + this.style.strokeThickness;
this.canvas.height = lineHeight * lines.length;
//calculate text height
var lineHeight = this.determineFontHeight("font: " + this.style.font + ";") + this.style.strokeThickness;
this.canvas.height = lineHeight * lines.length;
//set canvas text styles
this.context.fillStyle = this.style.fill;
this.context.font = this.style.font;
//set canvas text styles
this.context.fillStyle = this.style.fill;
this.context.font = this.style.font;
this.context.strokeStyle = this.style.stroke;
this.context.lineWidth = this.style.strokeThickness;
this.context.strokeStyle = this.style.stroke;
this.context.lineWidth = this.style.strokeThickness;
this.context.textBaseline = "top";
this.context.textBaseline = "top";
//draw lines line by line
for (i = 0; i < lines.length; i++)
{
var linePosition = new PIXI.Point(this.style.strokeThickness / 2, this.style.strokeThickness / 2 + i * lineHeight);
//draw lines line by line
for (i = 0; i < lines.length; i++)
{
var linePosition = new PIXI.Point(this.style.strokeThickness / 2, this.style.strokeThickness / 2 + i * lineHeight);
if(this.style.align == "right")
{
linePosition.x += maxLineWidth - lineWidths[i];
}
else if(this.style.align == "center")
{
linePosition.x += (maxLineWidth - lineWidths[i]) / 2;
}
if(this.style.align == "right")
{
linePosition.x += maxLineWidth - lineWidths[i];
}
else if(this.style.align == "center")
{
linePosition.x += (maxLineWidth - lineWidths[i]) / 2;
}
if(this.style.stroke && this.style.strokeThickness)
{
this.context.strokeText(lines[i], linePosition.x, linePosition.y);
}
if(this.style.stroke && this.style.strokeThickness)
{
this.context.strokeText(lines[i], linePosition.x, linePosition.y);
}
if(this.style.fill)
{
this.context.fillText(lines[i], linePosition.x, linePosition.y);
}
}
if(this.style.fill)
{
this.context.fillText(lines[i], linePosition.x, linePosition.y);
}
}
this.updateTexture();
};
@ -158,7 +158,7 @@ PIXI.Text.prototype.updateTexture = function()
this.texture.frame.width = this.canvas.width;
this.texture.frame.height = this.canvas.height;
this._width = this.canvas.width;
this._width = this.canvas.width;
this._height = this.canvas.height;
PIXI.texturesToUpdate.push(this.texture.baseTexture);
@ -172,13 +172,13 @@ PIXI.Text.prototype.updateTexture = function()
*/
PIXI.Text.prototype.updateTransform = function()
{
if(this.dirty)
{
this.updateText();
this.dirty = false;
}
if(this.dirty)
{
this.updateText();
this.dirty = false;
}
PIXI.Sprite.prototype.updateTransform.call(this);
PIXI.Sprite.prototype.updateTransform.call(this);
};
/*
@ -191,26 +191,26 @@ PIXI.Text.prototype.updateTransform = function()
*/
PIXI.Text.prototype.determineFontHeight = function(fontStyle)
{
// build a little reference dictionary so if the font style has been used return a
// cached version...
var result = PIXI.Text.heightCache[fontStyle];
// build a little reference dictionary so if the font style has been used return a
// cached version...
var result = PIXI.Text.heightCache[fontStyle];
if(!result)
{
var body = document.getElementsByTagName("body")[0];
var dummy = document.createElement("div");
var dummyText = document.createTextNode("M");
dummy.appendChild(dummyText);
dummy.setAttribute("style", fontStyle + ';position:absolute;top:0;left:0');
body.appendChild(dummy);
if(!result)
{
var body = document.getElementsByTagName("body")[0];
var dummy = document.createElement("div");
var dummyText = document.createTextNode("M");
dummy.appendChild(dummyText);
dummy.setAttribute("style", fontStyle + ';position:absolute;top:0;left:0');
body.appendChild(dummy);
result = dummy.offsetHeight;
PIXI.Text.heightCache[fontStyle] = result;
result = dummy.offsetHeight;
PIXI.Text.heightCache[fontStyle] = result;
body.removeChild(dummy);
}
body.removeChild(dummy);
}
return result;
return result;
};
/**
@ -222,49 +222,49 @@ PIXI.Text.prototype.determineFontHeight = function(fontStyle)
*/
PIXI.Text.prototype.wordWrap = function(text)
{
// search good wrap position
var searchWrapPos = function(ctx, text, start, end, wrapWidth)
{
var p = Math.floor((end-start) / 2) + start;
if(p == start) {
return 1;
}
// search good wrap position
function searchWrapPos(ctx, text, start, end, wrapWidth)
{
var p = Math.floor((end-start) / 2) + start;
if(p == start) {
return 1;
}
if(ctx.measureText(text.substring(0,p)).width <= wrapWidth)
{
if(ctx.measureText(text.substring(0,p+1)).width > wrapWidth)
{
return p;
}
else
{
return arguments.callee(ctx, text, p, end, wrapWidth);
}
}
else
{
return arguments.callee(ctx, text, start, p, wrapWidth);
}
};
if(ctx.measureText(text.substring(0,p)).width <= wrapWidth)
{
if(ctx.measureText(text.substring(0,p+1)).width > wrapWidth)
{
return p;
}
else
{
return searchWrapPos(ctx, text, p, end, wrapWidth);
}
}
else
{
return searchWrapPos(ctx, text, start, p, wrapWidth);
}
}
var lineWrap = function(ctx, text, wrapWidth)
{
if(ctx.measureText(text).width <= wrapWidth || text.length < 1)
{
return text;
}
var pos = searchWrapPos(ctx, text, 0, text.length, wrapWidth);
return text.substring(0, pos) + "\n" + arguments.callee(ctx, text.substring(pos), wrapWidth);
};
function lineWrap(ctx, text, wrapWidth)
{
if(ctx.measureText(text).width <= wrapWidth || text.length < 1)
{
return text;
}
var pos = searchWrapPos(ctx, text, 0, text.length, wrapWidth);
return text.substring(0, pos) + "\n" + lineWrap(ctx, text.substring(pos), wrapWidth);
}
var result = "";
var lines = text.split("\n");
for (var i = 0; i < lines.length; i++)
{
result += lineWrap(this.context, lines[i], this.style.wordWrapWidth) + "\n";
}
var result = "";
var lines = text.split("\n");
for (var i = 0; i < lines.length; i++)
{
result += lineWrap(this.context, lines[i], this.style.wordWrapWidth) + "\n";
}
return result;
return result;
};
/**
@ -275,10 +275,10 @@ PIXI.Text.prototype.wordWrap = function(text)
*/
PIXI.Text.prototype.destroy = function(destroyTexture)
{
if(destroyTexture)
{
this.texture.destroy();
}
if(destroyTexture)
{
this.texture.destroy();
}
};

170
src/pixi/textures/BaseTexture.js
View file

@ -16,82 +16,82 @@ PIXI.texturesToDestroy = [];
*/
PIXI.BaseTexture = function(source)
{
PIXI.EventTarget.call( this );
PIXI.EventTarget.call( this );
/**
* [read-only] The width of the base texture set when the image has loaded
*
* @property width
* @type Number
* @readOnly
*/
this.width = 100;
/**
* [read-only] The width of the base texture set when the image has loaded
*
* @property width
* @type Number
* @readOnly
*/
this.width = 100;
/**
* [read-only] The height of the base texture set when the image has loaded
*
* @property height
* @type Number
* @readOnly
*/
this.height = 100;
/**
* [read-only] The height of the base texture set when the image has loaded
*
* @property height
* @type Number
* @readOnly
*/
this.height = 100;
/**
* [read-only] Describes if the base texture has loaded or not
*
* @property hasLoaded
* @type Boolean
* @readOnly
*/
this.hasLoaded = false;
/**
* [read-only] Describes if the base texture has loaded or not
*
* @property hasLoaded
* @type Boolean
* @readOnly
*/
this.hasLoaded = false;
/**
* The source that is loaded to create the texture
*
* @property source
* @type Image
*/
this.source = source;
/**
* The source that is loaded to create the texture
*
* @property source
* @type Image
*/
this.source = source;
if(!source)return;
if(!source)return;
if(this.source instanceof Image || this.source instanceof HTMLImageElement)
{
if(this.source.complete)
{
this.hasLoaded = true;
this.width = this.source.width;
this.height = this.source.height;
if(this.source instanceof Image || this.source instanceof HTMLImageElement)
{
if(this.source.complete)
{
this.hasLoaded = true;
this.width = this.source.width;
this.height = this.source.height;
PIXI.texturesToUpdate.push(this);
}
else
{
PIXI.texturesToUpdate.push(this);
}
else
{
var scope = this;
this.source.onload = function(){
var scope = this;
this.source.onload = function(){
scope.hasLoaded = true;
scope.width = scope.source.width;
scope.height = scope.source.height;
scope.hasLoaded = true;
scope.width = scope.source.width;
scope.height = scope.source.height;
// add it to somewhere...
PIXI.texturesToUpdate.push(scope);
scope.dispatchEvent( { type: 'loaded', content: scope } );
}
// this.image.src = imageUrl;
}
}
else
{
this.hasLoaded = true;
this.width = this.source.width;
this.height = this.source.height;
// add it to somewhere...
PIXI.texturesToUpdate.push(scope);
scope.dispatchEvent( { type: 'loaded', content: scope } );
}
// this.image.src = imageUrl;
}
}
else
{
this.hasLoaded = true;
this.width = this.source.width;
this.height = this.source.height;
PIXI.texturesToUpdate.push(this);
}
PIXI.texturesToUpdate.push(this);
}
this._powerOf2 = false;
this._powerOf2 = false;
}
PIXI.BaseTexture.prototype.constructor = PIXI.BaseTexture;
@ -103,12 +103,12 @@ PIXI.BaseTexture.prototype.constructor = PIXI.BaseTexture;
*/
PIXI.BaseTexture.prototype.destroy = function()
{
if(this.source instanceof Image)
{
this.source.src = null;
}
this.source = null;
PIXI.texturesToDestroy.push(this);
if(this.source instanceof Image)
{
this.source.src = null;
}
this.source = null;
PIXI.texturesToDestroy.push(this);
}
/**
@ -122,20 +122,20 @@ PIXI.BaseTexture.prototype.destroy = function()
*/
PIXI.BaseTexture.fromImage = function(imageUrl, crossorigin)
{
var baseTexture = PIXI.BaseTextureCache[imageUrl];
if(!baseTexture)
{
// new Image() breaks tex loading in some versions of Chrome.
// See https://code.google.com/p/chromium/issues/detail?id=238071
var image = new Image();//document.createElement('img');
if (crossorigin)
{
image.crossOrigin = '';
}
image.src = imageUrl;
baseTexture = new PIXI.BaseTexture(image);
PIXI.BaseTextureCache[imageUrl] = baseTexture;
}
var baseTexture = PIXI.BaseTextureCache[imageUrl];
if(!baseTexture)
{
// new Image() breaks tex loading in some versions of Chrome.
// See https://code.google.com/p/chromium/issues/detail?id=238071
var image = new Image();//document.createElement('img');
if (crossorigin)
{
image.crossOrigin = '';
}
image.src = imageUrl;
baseTexture = new PIXI.BaseTexture(image);
PIXI.BaseTextureCache[imageUrl] = baseTexture;
}
return baseTexture;
return baseTexture;
}

240
src/pixi/textures/RenderTexture.js
View file

@ -10,19 +10,19 @@
RenderTexture takes snapshot of DisplayObject passed to render method. If DisplayObject is passed to render method, position and rotation of it will be ignored. For example:
var renderTexture = new PIXI.RenderTexture(800, 600);
var sprite = PIXI.Sprite.fromImage("spinObj_01.png");
sprite.position.x = 800/2;
sprite.position.y = 600/2;
sprite.anchor.x = 0.5;
sprite.anchor.y = 0.5;
renderTexture.render(sprite);
var renderTexture = new PIXI.RenderTexture(800, 600);
var sprite = PIXI.Sprite.fromImage("spinObj_01.png");
sprite.position.x = 800/2;
sprite.position.y = 600/2;
sprite.anchor.x = 0.5;
sprite.anchor.y = 0.5;
renderTexture.render(sprite);
Sprite in this case will be rendered to 0,0 position. To render this sprite at center DisplayObjectContainer should be used:
var doc = new PIXI.DisplayObjectContainer();
doc.addChild(sprite);
renderTexture.render(doc); // Renders to center of renderTexture
var doc = new PIXI.DisplayObjectContainer();
doc.addChild(sprite);
renderTexture.render(doc); // Renders to center of renderTexture
@class RenderTexture
@extends Texture
@ -32,23 +32,23 @@
*/
PIXI.RenderTexture = function(width, height)
{
PIXI.EventTarget.call( this );
PIXI.EventTarget.call( this );
this.width = width || 100;
this.height = height || 100;
this.width = width || 100;
this.height = height || 100;
this.identityMatrix = PIXI.mat3.create();
this.identityMatrix = PIXI.mat3.create();
this.frame = new PIXI.Rectangle(0, 0, this.width, this.height);
this.frame = new PIXI.Rectangle(0, 0, this.width, this.height);
if(PIXI.gl)
{
this.initWebGL();
}
else
{
this.initCanvas();
}
if(PIXI.gl)
{
this.initWebGL();
}
else
{
this.initCanvas();
}
}
PIXI.RenderTexture.prototype = Object.create( PIXI.Texture.prototype );
@ -62,39 +62,39 @@ PIXI.RenderTexture.prototype.constructor = PIXI.RenderTexture;
*/
PIXI.RenderTexture.prototype.initWebGL = function()
{
var gl = PIXI.gl;
this.glFramebuffer = gl.createFramebuffer();
var gl = PIXI.gl;
this.glFramebuffer = gl.createFramebuffer();
gl.bindFramebuffer(gl.FRAMEBUFFER, this.glFramebuffer );
gl.bindFramebuffer(gl.FRAMEBUFFER, this.glFramebuffer );
this.glFramebuffer.width = this.width;
this.glFramebuffer.height = this.height;
this.baseTexture = new PIXI.BaseTexture();
this.baseTexture = new PIXI.BaseTexture();
this.baseTexture.width = this.width;
this.baseTexture.height = this.height;
this.baseTexture.width = this.width;
this.baseTexture.height = this.height;
this.baseTexture._glTexture = gl.createTexture();
gl.bindTexture(gl.TEXTURE_2D, this.baseTexture._glTexture);
gl.texImage2D(gl.TEXTURE_2D, 0, gl.RGBA, this.width, this.height, 0, gl.RGBA, gl.UNSIGNED_BYTE, null);
gl.texImage2D(gl.TEXTURE_2D, 0, gl.RGBA, this.width, this.height, 0, gl.RGBA, gl.UNSIGNED_BYTE, null);
gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MAG_FILTER, gl.LINEAR);
gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MIN_FILTER, gl.LINEAR);
gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_S, gl.CLAMP_TO_EDGE);
gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_T, gl.CLAMP_TO_EDGE);
gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MIN_FILTER, gl.LINEAR);
gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_S, gl.CLAMP_TO_EDGE);
gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_T, gl.CLAMP_TO_EDGE);
this.baseTexture.isRender = true;
this.baseTexture.isRender = true;
gl.bindFramebuffer(gl.FRAMEBUFFER, this.glFramebuffer );
gl.framebufferTexture2D(gl.FRAMEBUFFER, gl.COLOR_ATTACHMENT0, gl.TEXTURE_2D, this.baseTexture._glTexture, 0);
gl.bindFramebuffer(gl.FRAMEBUFFER, this.glFramebuffer );
gl.framebufferTexture2D(gl.FRAMEBUFFER, gl.COLOR_ATTACHMENT0, gl.TEXTURE_2D, this.baseTexture._glTexture, 0);
// create a projection matrix..
this.projection = new PIXI.Point(this.width/2 , this.height/2);
// create a projection matrix..
this.projection = new PIXI.Point(this.width/2 , this.height/2);
// set the correct render function..
this.render = this.renderWebGL;
// set the correct render function..
this.render = this.renderWebGL;
}
@ -103,25 +103,25 @@ PIXI.RenderTexture.prototype.initWebGL = function()
PIXI.RenderTexture.prototype.resize = function(width, height)
{
this.width = width;
this.height = height;
this.width = width;
this.height = height;
if(PIXI.gl)
{
this.projection.x = this.width/2
this.projection.y = this.height/2;
if(PIXI.gl)
{
this.projection.x = this.width/2
this.projection.y = this.height/2;
var gl = PIXI.gl;
gl.bindTexture(gl.TEXTURE_2D, this.baseTexture._glTexture);
gl.texImage2D(gl.TEXTURE_2D, 0, gl.RGBA, this.width, this.height, 0, gl.RGBA, gl.UNSIGNED_BYTE, null);
}
else
{
var gl = PIXI.gl;
gl.bindTexture(gl.TEXTURE_2D, this.baseTexture._glTexture);
gl.texImage2D(gl.TEXTURE_2D, 0, gl.RGBA, this.width, this.height, 0, gl.RGBA, gl.UNSIGNED_BYTE, null);
}
else
{
this.frame.width = this.width
this.frame.height = this.height;
this.renderer.resize(this.width, this.height);
}
this.frame.width = this.width
this.frame.height = this.height;
this.renderer.resize(this.width, this.height);
}
}
/**
@ -132,12 +132,12 @@ PIXI.RenderTexture.prototype.resize = function(width, height)
*/
PIXI.RenderTexture.prototype.initCanvas = function()
{
this.renderer = new PIXI.CanvasRenderer(this.width, this.height, null, 0);
this.renderer = new PIXI.CanvasRenderer(this.width, this.height, null, 0);
this.baseTexture = new PIXI.BaseTexture(this.renderer.view);
this.frame = new PIXI.Rectangle(0, 0, this.width, this.height);
this.baseTexture = new PIXI.BaseTexture(this.renderer.view);
this.frame = new PIXI.Rectangle(0, 0, this.width, this.height);
this.render = this.renderCanvas;
this.render = this.renderCanvas;
}
/**
@ -150,67 +150,67 @@ PIXI.RenderTexture.prototype.initCanvas = function()
*/
PIXI.RenderTexture.prototype.renderWebGL = function(displayObject, position, clear)
{
var gl = PIXI.gl;
var gl = PIXI.gl;
// enable the alpha color mask..
gl.colorMask(true, true, true, true);
// enable the alpha color mask..
gl.colorMask(true, true, true, true);
gl.viewport(0, 0, this.width, this.height);
gl.viewport(0, 0, this.width, this.height);
gl.bindFramebuffer(gl.FRAMEBUFFER, this.glFramebuffer );
gl.bindFramebuffer(gl.FRAMEBUFFER, this.glFramebuffer );
if(clear)
{
gl.clearColor(0,0,0, 0);
gl.clear(gl.COLOR_BUFFER_BIT);
}
if(clear)
{
gl.clearColor(0,0,0, 0);
gl.clear(gl.COLOR_BUFFER_BIT);
}
// THIS WILL MESS WITH HIT TESTING!
var children = displayObject.children;
// THIS WILL MESS WITH HIT TESTING!
var children = displayObject.children;
//TODO -? create a new one??? dont think so!
var originalWorldTransform = displayObject.worldTransform;
displayObject.worldTransform = PIXI.mat3.create();//sthis.identityMatrix;
// modify to flip...
displayObject.worldTransform[4] = -1;
displayObject.worldTransform[5] = this.projection.y * 2;
//TODO -? create a new one??? dont think so!
var originalWorldTransform = displayObject.worldTransform;
displayObject.worldTransform = PIXI.mat3.create();//sthis.identityMatrix;
// modify to flip...
displayObject.worldTransform[4] = -1;
displayObject.worldTransform[5] = this.projection.y * 2;
if(position)
{
displayObject.worldTransform[2] = position.x;
displayObject.worldTransform[5] -= position.y;
}
if(position)
{
displayObject.worldTransform[2] = position.x;
displayObject.worldTransform[5] -= position.y;
}
PIXI.visibleCount++;
displayObject.vcount = PIXI.visibleCount;
PIXI.visibleCount++;
displayObject.vcount = PIXI.visibleCount;
for(var i=0,j=children.length; i<j; i++)
{
children[i].updateTransform();
}
for(var i=0,j=children.length; i<j; i++)
{
children[i].updateTransform();
}
var renderGroup = displayObject.__renderGroup;
var renderGroup = displayObject.__renderGroup;
if(renderGroup)
{
if(displayObject == renderGroup.root)
{
renderGroup.render(this.projection);
}
else
{
renderGroup.renderSpecific(displayObject, this.projection);
}
}
else
{
if(!this.renderGroup)this.renderGroup = new PIXI.WebGLRenderGroup(gl);
this.renderGroup.setRenderable(displayObject);
this.renderGroup.render(this.projection);
}
if(renderGroup)
{
if(displayObject == renderGroup.root)
{
renderGroup.render(this.projection);
}
else
{
renderGroup.renderSpecific(displayObject, this.projection);
}
}
else
{
if(!this.renderGroup)this.renderGroup = new PIXI.WebGLRenderGroup(gl);
this.renderGroup.setRenderable(displayObject);
this.renderGroup.render(this.projection);
}
displayObject.worldTransform = originalWorldTransform;
displayObject.worldTransform = originalWorldTransform;
}
@ -224,23 +224,23 @@ PIXI.RenderTexture.prototype.renderWebGL = function(displayObject, position, cle
*/
PIXI.RenderTexture.prototype.renderCanvas = function(displayObject, position, clear)
{
var children = displayObject.children;
var children = displayObject.children;
displayObject.worldTransform = PIXI.mat3.create();
displayObject.worldTransform = PIXI.mat3.create();
if(position)
{
displayObject.worldTransform[2] = position.x;
displayObject.worldTransform[5] = position.y;
}
if(position)
{
displayObject.worldTransform[2] = position.x;
displayObject.worldTransform[5] = position.y;
}
for(var i=0,j=children.length; i<j; i++)
{
children[i].updateTransform();
}
for(var i=0,j=children.length; i<j; i++)
{
children[i].updateTransform();
}
if(clear)this.renderer.context.clearRect(0,0, this.width, this.height);
if(clear)this.renderer.context.clearRect(0,0, this.width, this.height);
this.renderer.renderDisplayObject(displayObject);

150
src/pixi/textures/Texture.js
View file

@ -17,55 +17,55 @@ PIXI.FrameCache = {};
*/
PIXI.Texture = function(baseTexture, frame)
{
PIXI.EventTarget.call( this );
PIXI.EventTarget.call( this );
if(!frame)
{
this.noFrame = true;
frame = new PIXI.Rectangle(0,0,1,1);
}
if(!frame)
{
this.noFrame = true;
frame = new PIXI.Rectangle(0,0,1,1);
}
if(baseTexture instanceof PIXI.Texture)
baseTexture = baseTexture.baseTexture;
if(baseTexture instanceof PIXI.Texture)
baseTexture = baseTexture.baseTexture;
/**
* The base texture of this texture
*
* @property baseTexture
* @type BaseTexture
*/
this.baseTexture = baseTexture;
/**
* The base texture of this texture
*
* @property baseTexture
* @type BaseTexture
*/
this.baseTexture = baseTexture;
/**
* The frame specifies the region of the base texture that this texture uses
*
* @property frame
* @type Rectangle
*/
this.frame = frame;
/**
* The frame specifies the region of the base texture that this texture uses
*
* @property frame
* @type Rectangle
*/
this.frame = frame;
/**
* The trim point
*
* @property trim
* @type Point
*/
this.trim = new PIXI.Point();
/**
* The trim point
*
* @property trim
* @type Point
*/
this.trim = new PIXI.Point();
this.scope = this;
this.scope = this;
if(baseTexture.hasLoaded)
{
if(this.noFrame)frame = new PIXI.Rectangle(0,0, baseTexture.width, baseTexture.height);
//console.log(frame)
if(baseTexture.hasLoaded)
{
if(this.noFrame)frame = new PIXI.Rectangle(0,0, baseTexture.width, baseTexture.height);
//console.log(frame)
this.setFrame(frame);
}
else
{
var scope = this;
baseTexture.addEventListener( 'loaded', function(){ scope.onBaseTextureLoaded()} );
}
this.setFrame(frame);
}
else
{
var scope = this;
baseTexture.addEventListener( 'loaded', function(){ scope.onBaseTextureLoaded()} );
}
}
PIXI.Texture.prototype.constructor = PIXI.Texture;
@ -79,15 +79,15 @@ PIXI.Texture.prototype.constructor = PIXI.Texture;
*/
PIXI.Texture.prototype.onBaseTextureLoaded = function(event)
{
var baseTexture = this.baseTexture;
baseTexture.removeEventListener( 'loaded', this.onLoaded );
var baseTexture = this.baseTexture;
baseTexture.removeEventListener( 'loaded', this.onLoaded );
if(this.noFrame)this.frame = new PIXI.Rectangle(0,0, baseTexture.width, baseTexture.height);
this.noFrame = false;
this.width = this.frame.width;
this.height = this.frame.height;
if(this.noFrame)this.frame = new PIXI.Rectangle(0,0, baseTexture.width, baseTexture.height);
this.noFrame = false;
this.width = this.frame.width;
this.height = this.frame.height;
this.scope.dispatchEvent( { type: 'update', content: this } );
this.scope.dispatchEvent( { type: 'update', content: this } );
}
/**
@ -98,7 +98,7 @@ PIXI.Texture.prototype.onBaseTextureLoaded = function(event)
*/
PIXI.Texture.prototype.destroy = function(destroyBase)
{
if(destroyBase)this.baseTexture.destroy();
if(destroyBase)this.baseTexture.destroy();
}
/**
@ -109,19 +109,19 @@ PIXI.Texture.prototype.destroy = function(destroyBase)
*/
PIXI.Texture.prototype.setFrame = function(frame)
{
this.frame = frame;
this.width = frame.width;
this.height = frame.height;
this.frame = frame;
this.width = frame.width;
this.height = frame.height;
if(frame.x + frame.width > this.baseTexture.width || frame.y + frame.height > this.baseTexture.height)
{
throw new Error("Texture Error: frame does not fit inside the base Texture dimensions " + this);
}
if(frame.x + frame.width > this.baseTexture.width || frame.y + frame.height > this.baseTexture.height)
{
throw new Error("Texture Error: frame does not fit inside the base Texture dimensions " + this);
}
this.updateFrame = true;
this.updateFrame = true;
PIXI.Texture.frameUpdates.push(this);
//this.dispatchEvent( { type: 'update', content: this } );
PIXI.Texture.frameUpdates.push(this);
//this.dispatchEvent( { type: 'update', content: this } );
}
/**
@ -136,15 +136,15 @@ PIXI.Texture.prototype.setFrame = function(frame)
*/
PIXI.Texture.fromImage = function(imageUrl, crossorigin)
{
var texture = PIXI.TextureCache[imageUrl];
var texture = PIXI.TextureCache[imageUrl];
if(!texture)
{
texture = new PIXI.Texture(PIXI.BaseTexture.fromImage(imageUrl, crossorigin));
PIXI.TextureCache[imageUrl] = texture;
}
if(!texture)
{
texture = new PIXI.Texture(PIXI.BaseTexture.fromImage(imageUrl, crossorigin));
PIXI.TextureCache[imageUrl] = texture;
}
return texture;
return texture;
}
/**
@ -158,9 +158,9 @@ PIXI.Texture.fromImage = function(imageUrl, crossorigin)
*/
PIXI.Texture.fromFrame = function(frameId)
{
var texture = PIXI.TextureCache[frameId];
if(!texture)throw new Error("The frameId '"+ frameId +"' does not exist in the texture cache " + this);
return texture;
var texture = PIXI.TextureCache[frameId];
if(!texture)throw new Error("The frameId '"+ frameId +"' does not exist in the texture cache " + this);
return texture;
}
/**
@ -174,8 +174,8 @@ PIXI.Texture.fromFrame = function(frameId)
*/
PIXI.Texture.fromCanvas = function(canvas)
{
var baseTexture = new PIXI.BaseTexture(canvas);
return new PIXI.Texture(baseTexture);
var baseTexture = new PIXI.BaseTexture(canvas);
return new PIXI.Texture(baseTexture);
}
@ -189,7 +189,7 @@ PIXI.Texture.fromCanvas = function(canvas)
*/
PIXI.Texture.addTextureToCache = function(texture, id)
{
PIXI.TextureCache[id] = texture;
PIXI.TextureCache[id] = texture;
}
/**
@ -202,9 +202,9 @@ PIXI.Texture.addTextureToCache = function(texture, id)
*/
PIXI.Texture.removeTextureFromCache = function(id)
{
var texture = PIXI.TextureCache[id]
PIXI.TextureCache[id] = null;
return texture;
var texture = PIXI.TextureCache[id]
PIXI.TextureCache[id] = null;
return texture;
}
// this is more for webGL.. it contains updated frames..

20
src/pixi/utils/Detector.js
View file

@ -19,19 +19,19 @@
*/
PIXI.autoDetectRenderer = function(width, height, view, transparent, antialias)
{
if(!width)width = 800;
if(!height)height = 600;
if(!width)width = 800;
if(!height)height = 600;
// BORROWED from Mr Doob (mrdoob.com)
var webgl = ( function () { try { return !! window.WebGLRenderingContext && !! document.createElement( 'canvas' ).getContext( 'experimental-webgl' ); } catch( e ) { return false; } } )();
// BORROWED from Mr Doob (mrdoob.com)
var webgl = ( function () { try { return !! window.WebGLRenderingContext && !! document.createElement( 'canvas' ).getContext( 'experimental-webgl' ); } catch( e ) { return false; } } )();
//console.log(webgl);
if( webgl )
{
return new PIXI.WebGLRenderer(width, height, view, transparent, antialias);
}
//console.log(webgl);
if( webgl )
{
return new PIXI.WebGLRenderer(width, height, view, transparent, antialias);
}
return new PIXI.CanvasRenderer(width, height, view, transparent);
return new PIXI.CanvasRenderer(width, height, view, transparent);
};

56
src/pixi/utils/EventTarget.js
View file

@ -8,59 +8,59 @@
*
* @class EventTarget
* @example
* function MyEmitter() {
* PIXI.EventTarget.call(this); //mixes in event target stuff
* }
* function MyEmitter() {
* PIXI.EventTarget.call(this); //mixes in event target stuff
* }
*
* var em = new MyEmitter();
* em.emit({ type: 'eventName', data: 'some data' });
* var em = new MyEmitter();
* em.emit({ type: 'eventName', data: 'some data' });
*/
PIXI.EventTarget = function () {
var listeners = {};
var listeners = {};
this.addEventListener = this.on = function ( type, listener ) {
this.addEventListener = this.on = function ( type, listener ) {
if ( listeners[ type ] === undefined ) {
if ( listeners[ type ] === undefined ) {
listeners[ type ] = [];
listeners[ type ] = [];
}
}
if ( listeners[ type ].indexOf( listener ) === - 1 ) {
if ( listeners[ type ].indexOf( listener ) === - 1 ) {
listeners[ type ].push( listener );
}
listeners[ type ].push( listener );
}
};
};
this.dispatchEvent = this.emit = function ( event ) {
this.dispatchEvent = this.emit = function ( event ) {
if ( !listeners[ event.type ] || !listeners[ event.type ].length ) {
if ( !listeners[ event.type ] || !listeners[ event.type ].length ) {
return;
return;
}
}
for(var i = 0, l = listeners[ event.type ].length; i < l; i++) {
for(var i = 0, l = listeners[ event.type ].length; i < l; i++) {
listeners[ event.type ][ i ]( event );
listeners[ event.type ][ i ]( event );
}
}
};
};
this.removeEventListener = this.off = function ( type, listener ) {
this.removeEventListener = this.off = function ( type, listener ) {
var index = listeners[ type ].indexOf( listener );
var index = listeners[ type ].indexOf( listener );
if ( index !== - 1 ) {
if ( index !== - 1 ) {
listeners[ type ].splice( index, 1 );
listeners[ type ].splice( index, 1 );
}
}
};
};
};

194
src/pixi/utils/Polyk.js
View file

@ -1,34 +1,34 @@
/*
PolyK library
url: http://polyk.ivank.net
Released under MIT licence.
PolyK library
url: http://polyk.ivank.net
Released under MIT licence.
Copyright (c) 2012 Ivan Kuckir
Copyright (c) 2012 Ivan Kuckir
Permission is hereby granted, free of charge, to any person
obtaining a copy of this software and associated documentation
files (the "Software"), to deal in the Software without
restriction, including without limitation the rights to use,
copy, modify, merge, publish, distribute, sublicense, and/or sell
copies of the Software, and to permit persons to whom the
Software is furnished to do so, subject to the following
conditions:
Permission is hereby granted, free of charge, to any person
obtaining a copy of this software and associated documentation
files (the "Software"), to deal in the Software without
restriction, including without limitation the rights to use,
copy, modify, merge, publish, distribute, sublicense, and/or sell
copies of the Software, and to permit persons to whom the
Software is furnished to do so, subject to the following
conditions:
The above copyright notice and this permission notice shall be
included in all copies or substantial portions of the Software.
The above copyright notice and this permission notice shall be
included in all copies or substantial portions of the Software.
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES
OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND
NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT
HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY,
WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING
FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR
OTHER DEALINGS IN THE SOFTWARE.
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES
OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND
NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT
HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY,
WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING
FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR
OTHER DEALINGS IN THE SOFTWARE.
This is an amazing lib!
This is an amazing lib!
slightly modified by mat groves (matgroves.com);
slightly modified by mat groves (matgroves.com);
*/
PIXI.PolyK = {};
@ -42,68 +42,68 @@ PIXI.PolyK = {};
*/
PIXI.PolyK.Triangulate = function(p)
{
var sign = true;
var sign = true;
var n = p.length>>1;
if(n<3) return [];
var tgs = [];
var avl = [];
for(var i=0; i<n; i++) avl.push(i);
var n = p.length>>1;
if(n<3) return [];
var tgs = [];
var avl = [];
for(var i=0; i<n; i++) avl.push(i);
var i = 0;
var al = n;
while(al > 3)
{
var i0 = avl[(i+0)%al];
var i1 = avl[(i+1)%al];
var i2 = avl[(i+2)%al];
i = 0;
var al = n;
while(al > 3)
{
var i0 = avl[(i+0)%al];
var i1 = avl[(i+1)%al];
var i2 = avl[(i+2)%al];
var ax = p[2*i0], ay = p[2*i0+1];
var bx = p[2*i1], by = p[2*i1+1];
var cx = p[2*i2], cy = p[2*i2+1];
var ax = p[2*i0], ay = p[2*i0+1];
var bx = p[2*i1], by = p[2*i1+1];
var cx = p[2*i2], cy = p[2*i2+1];
var earFound = false;
if(PIXI.PolyK._convex(ax, ay, bx, by, cx, cy, sign))
{
earFound = true;
for(var j=0; j<al; j++)
{
var vi = avl[j];
if(vi==i0 || vi==i1 || vi==i2) continue;
if(PIXI.PolyK._PointInTriangle(p[2*vi], p[2*vi+1], ax, ay, bx, by, cx, cy)) {earFound = false; break;}
}
}
if(earFound)
{
tgs.push(i0, i1, i2);
avl.splice((i+1)%al, 1);
al--;
i = 0;
}
else if(i++ > 3*al)
{
// need to flip flip reverse it!
// reset!
if(sign)
{
var tgs = [];
avl = [];
for(var i=0; i<n; i++) avl.push(i);
var earFound = false;
if(PIXI.PolyK._convex(ax, ay, bx, by, cx, cy, sign))
{
earFound = true;
for(var j=0; j<al; j++)
{
var vi = avl[j];
if(vi==i0 || vi==i1 || vi==i2) continue;
if(PIXI.PolyK._PointInTriangle(p[2*vi], p[2*vi+1], ax, ay, bx, by, cx, cy)) {earFound = false; break;}
}
}
if(earFound)
{
tgs.push(i0, i1, i2);
avl.splice((i+1)%al, 1);
al--;
i = 0;
}
else if(i++ > 3*al)
{
// need to flip flip reverse it!
// reset!
if(sign)
{
tgs = [];
avl = [];
for(i=0; i<n; i++) avl.push(i);
i = 0;
al = n;
i = 0;
al = n;
sign = false;
}
else
{
console.log("PIXI Warning: shape too complex to fill")
return [];
}
}
}
tgs.push(avl[0], avl[1], avl[2]);
return tgs;
sign = false;
}
else
{
console.log("PIXI Warning: shape too complex to fill")
return [];
}
}
}
tgs.push(avl[0], avl[1], avl[2]);
return tgs;
}
/**
@ -115,25 +115,25 @@ PIXI.PolyK.Triangulate = function(p)
*/
PIXI.PolyK._PointInTriangle = function(px, py, ax, ay, bx, by, cx, cy)
{
var v0x = cx-ax;
var v0y = cy-ay;
var v1x = bx-ax;
var v1y = by-ay;
var v2x = px-ax;
var v2y = py-ay;
var v0x = cx-ax;
var v0y = cy-ay;
var v1x = bx-ax;
var v1y = by-ay;
var v2x = px-ax;
var v2y = py-ay;
var dot00 = v0x*v0x+v0y*v0y;
var dot01 = v0x*v1x+v0y*v1y;
var dot02 = v0x*v2x+v0y*v2y;
var dot11 = v1x*v1x+v1y*v1y;
var dot12 = v1x*v2x+v1y*v2y;
var dot00 = v0x*v0x+v0y*v0y;
var dot01 = v0x*v1x+v0y*v1y;
var dot02 = v0x*v2x+v0y*v2y;
var dot11 = v1x*v1x+v1y*v1y;
var dot12 = v1x*v2x+v1y*v2y;
var invDenom = 1 / (dot00 * dot11 - dot01 * dot01);
var u = (dot11 * dot02 - dot01 * dot12) * invDenom;
var v = (dot00 * dot12 - dot01 * dot02) * invDenom;
var invDenom = 1 / (dot00 * dot11 - dot01 * dot01);
var u = (dot11 * dot02 - dot01 * dot12) * invDenom;
var v = (dot00 * dot12 - dot01 * dot02) * invDenom;
// Check if point is in triangle
return (u >= 0) && (v >= 0) && (u + v < 1);
// Check if point is in triangle
return (u >= 0) && (v >= 0) && (u + v < 1);
}
/**
@ -145,5 +145,5 @@ PIXI.PolyK._PointInTriangle = function(px, py, ax, ay, bx, by, cx, cy)
*/
PIXI.PolyK._convex = function(ax, ay, bx, by, cx, cy, sign)
{
return ((ay-by)*(cx-bx) + (bx-ax)*(cy-by) >= 0) == sign;
return ((ay-by)*(cx-bx) + (bx-ax)*(cy-by) >= 0) == sign;
}

96
src/pixi/utils/Utils.js
View file

@ -19,8 +19,8 @@ var lastTime = 0;
var vendors = ['ms', 'moz', 'webkit', 'o'];
for(var x = 0; x < vendors.length && !window.requestAnimationFrame; ++x) {
window.requestAnimationFrame = window[vendors[x]+'RequestAnimationFrame'];
window.cancelAnimationFrame = window[vendors[x]+'CancelAnimationFrame']
|| window[vendors[x]+'CancelRequestAnimationFrame'];
window.cancelAnimationFrame = window[vendors[x]+'CancelAnimationFrame'] ||
window[vendors[x]+'CancelRequestAnimationFrame'];
}
if (!window.requestAnimationFrame)
@ -43,11 +43,11 @@ window.requestAnimFrame = window.requestAnimationFrame;
/**
* Converts a hex color number to an [R, G, B] array
*
* @method HEXtoRGB
* @method hex2rgb
* @param hex {Number}
*/
function HEXtoRGB(hex) {
return [(hex >> 16 & 0xFF) / 255, ( hex >> 8 & 0xFF) / 255, (hex & 0xFF)/ 255];
function hex2rgb(hex) {
return [(hex >> 16 & 0xFF) / 255, ( hex >> 8 & 0xFF) / 255, (hex & 0xFF)/ 255];
}
/**
@ -64,14 +64,14 @@ if (typeof Function.prototype.bind != 'function') {
if (typeof target != 'function') throw new TypeError();
function bound() {
var args = boundArgs.concat(slice.call(arguments));
target.apply(this instanceof bound ? this : thisArg, args);
var args = boundArgs.concat(slice.call(arguments));
target.apply(this instanceof bound ? this : thisArg, args);
}
bound.prototype = (function F(proto) {
proto && (F.prototype = proto);
if (!(this instanceof F)) return new F;
})(target.prototype);
if (proto) F.prototype = proto;
if (!(this instanceof F)) return new F();
})(target.prototype);
return bound;
};
@ -86,28 +86,28 @@ if (typeof Function.prototype.bind != 'function') {
*/
var AjaxRequest = PIXI.AjaxRequest = function()
{
var activexmodes = ["Msxml2.XMLHTTP.6.0", "Msxml2.XMLHTTP.3.0", "Microsoft.XMLHTTP"] //activeX versions to check for in IE
var activexmodes = ["Msxml2.XMLHTTP.6.0", "Msxml2.XMLHTTP.3.0", "Microsoft.XMLHTTP"] //activeX versions to check for in IE
if (window.ActiveXObject)
{ //Test for support for ActiveXObject in IE first (as XMLHttpRequest in IE7 is broken)
for (var i=0; i<activexmodes.length; i++)
{
try{
return new ActiveXObject(activexmodes[i])
}
catch(e){
//suppress error
}
}
}
else if (window.XMLHttpRequest) // if Mozilla, Safari etc
{
return new XMLHttpRequest()
}
else
{
return false;
}
if (window.ActiveXObject)
{ //Test for support for ActiveXObject in IE first (as XMLHttpRequest in IE7 is broken)
for (var i=0; i<activexmodes.length; i++)
{
try{
return new ActiveXObject(activexmodes[i])
}
catch(e){
//suppress error
}
}
}
else if (window.XMLHttpRequest) // if Mozilla, Safari etc
{
return new XMLHttpRequest()
}
else
{
return false;
}
}
/*
@ -115,25 +115,25 @@ var AjaxRequest = PIXI.AjaxRequest = function()
*/
PIXI.runList = function(item)
{
console.log(">>>>>>>>>")
console.log("_")
var safe = 0;
var tmp = item.first;
console.log(tmp);
console.log(">>>>>>>>>")
console.log("_")
var safe = 0;
var tmp = item.first;
console.log(tmp);
while(tmp._iNext)
{
safe++;
tmp = tmp._iNext;
console.log(tmp);
// console.log(tmp);
while(tmp._iNext)
{
safe++;
tmp = tmp._iNext;
console.log(tmp);
// console.log(tmp);
if(safe > 100)
{
console.log("BREAK")
break
}
}
if(safe > 100)
{
console.log("BREAK")
break
}
}
}