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

merge in jshint fixes

Browse source
This commit is contained in:
Chad Engler 2013-12-19 11:30:30 -08:00
commit ce8add7c62
158 changed files with 9855 additions and 10575 deletions
Download patch file Download diff file Expand all files Collapse all files

1
.gitignore vendored
View file

@ -2,3 +2,4 @@ node_modules
.DS_Store .DS_Store
.project .project
*.sublime-* *.sublime-*
*.log

127
.jshintrc Normal file
View file

@ -0,0 +1,127 @@
{
// --------------------------------------------------------------------
// JSHint Configuration
// --------------------------------------------------------------------
//
// @author Chad Engler <chad@pantherdev.com>
// == Enforcing Options ===============================================
//
// These options tell JSHint to be more strict towards your code. Use
// them if you want to allow only a safe subset of JavaScript, very
// useful when your codebase is shared with a big number of developers
// with different skill levels.
"bitwise" : false, // Disallow bitwise operators (&, |, ^, etc.).
"camelcase" : true, // Force all variable names to use either camelCase or UPPER_CASE.
"curly" : false, // Require {} for every new block or scope.
"eqeqeq" : true, // Require triple equals i.e. `===`.
"es3" : false, // Enforce conforming to ECMAScript 3.
"forin" : false, // Disallow `for in` loops without `hasOwnPrototype`.
"immed" : true, // Require immediate invocations to be wrapped in parens e.g. `( function(){}() );`
"indent" : 4, // Require that 4 spaces are used for indentation.
"latedef" : true, // Prohibit variable use before definition.
"newcap" : true, // Require capitalization of all constructor functions e.g. `new F()`.
"noarg" : true, // Prohibit use of `arguments.caller` and `arguments.callee`.
"noempty" : true, // Prohibit use of empty blocks.
"nonew" : true, // Prohibit use of constructors for side-effects.
"plusplus" : false, // Disallow use of `++` & `--`.
"quotmark" : true, // Force consistency when using quote marks.
"undef" : true, // Require all non-global variables be declared before they are used.
"unused" : true, // Warn when varaibles are created by not used.
"strict" : false, // Require `use strict` pragma in every file.
"trailing" : true, // Prohibit trailing whitespaces.
"maxparams" : 8, // Prohibit having more than X number of params in a function.
"maxdepth" : 8, // Prohibit nested blocks from going more than X levels deep.
"maxstatements" : false, // Restrict the number of statements in a function.
"maxcomplexity" : false, // Restrict the cyclomatic complexity of the code.
"maxlen" : 220, // Require that all lines are 100 characters or less.
"globals" : { // Register globals that are used in the code.
//commonjs globals
"module": false,
"require": false,
// PIXI globals
"PIXI": false,
"spine": false,
//chai globals
"chai": false,
//mocha globals
"describe": false,
"it": false,
//resemble globals
"resemble": false
},
// == Relaxing Options ================================================
//
// These options allow you to suppress certain types of warnings. Use
// them only if you are absolutely positive that you know what you are
// doing.
"asi" : false, // Tolerate Automatic Semicolon Insertion (no semicolons).
"boss" : true, // Tolerate assignments inside if, for & while. Usually conditions & loops are for comparison, not assignments.
"debug" : false, // Allow debugger statements e.g. browser breakpoints.
"eqnull" : false, // Tolerate use of `== null`.
"esnext" : false, // Allow ES.next specific features such as `const` and `let`.
"evil" : false, // Tolerate use of `eval`.
"expr" : false, // Tolerate `ExpressionStatement` as Programs.
"funcscope" : false, // Tolerate declarations of variables inside of control structures while accessing them later from the outside.
"globalstrict" : false, // Allow global "use strict" (also enables 'strict').
"iterator" : false, // Allow usage of __iterator__ property.
"lastsemic" : false, // Tolerate missing semicolons when the it is omitted for the last statement in a one-line block.
"laxbreak" : false, // Tolerate unsafe line breaks e.g. `return [\n] x` without semicolons.
"laxcomma" : false, // Suppress warnings about comma-first coding style.
"loopfunc" : false, // Allow functions to be defined within loops.
"moz" : false, // Code that uses Mozilla JS extensions will set this to true
"multistr" : false, // Tolerate multi-line strings.
"proto" : false, // Tolerate __proto__ property. This property is deprecated.
"scripturl" : false, // Tolerate script-targeted URLs.
"smarttabs" : false, // Tolerate mixed tabs and spaces when the latter are used for alignmnent only.
"shadow" : false, // Allows re-define variables later in code e.g. `var x=1; x=2;`.
"sub" : false, // Tolerate all forms of subscript notation besides dot notation e.g. `dict['key']` instead of `dict.key`.
"supernew" : false, // Tolerate `new function () { ... };` and `new Object;`.
"validthis" : false, // Tolerate strict violations when the code is running in strict mode and you use this in a non-constructor function.
// == Environments ====================================================
//
// These options pre-define global variables that are exposed by
// popular JavaScript libraries and runtime environments—such as
// browser or node.js.
"browser" : true, // Standard browser globals e.g. `window`, `document`.
"couch" : false, // Enable globals exposed by CouchDB.
"devel" : false, // Allow development statements e.g. `console.log();`.
"dojo" : false, // Enable globals exposed by Dojo Toolkit.
"jquery" : false, // Enable globals exposed by jQuery JavaScript library.
"mootools" : false, // Enable globals exposed by MooTools JavaScript framework.
"node" : false, // Enable globals available when code is running inside of the NodeJS runtime environment. (for Gruntfile)
"nonstandard" : false, // Define non-standard but widely adopted globals such as escape and unescape.
"prototypejs" : false, // Enable globals exposed by Prototype JavaScript framework.
"rhino" : false, // Enable globals available when your code is running inside of the Rhino runtime environment.
"worker" : false, // Enable globals available when your code is running as a WebWorker.
"wsh" : false, // Enable globals available when your code is running as a script for the Windows Script Host.
"yui" : false, // Enable globals exposed by YUI library.
// == JSLint Legacy ===================================================
//
// These options are legacy from JSLint. Aside from bug fixes they will
// not be improved in any way and might be removed at any point.
"nomen" : false, // Prohibit use of initial or trailing underbars in names.
"onevar" : false, // Allow only one `var` statement per function.
"passfail" : false, // Stop on first error.
"white" : false, // Check against strict whitespace and indentation rules.
// == Undocumented Options ============================================
//
// While I've found these options in some projects, they are not
// described in the [JSHint Options documentation][4].
//
// [4]: http://www.jshint.com/options/
"maxerr" : 100 // Maximum errors before stopping.
}

8
.travis.yml Normal file
View file

@ -0,0 +1,8 @@
language: node_js
node_js:
- 0.10
before_script:
- npm install -g grunt-cli
- export DISPLAY=:99.0
- sh -e /etc/init.d/xvfb start

71
Gruntfile.js
View file

@ -4,13 +4,10 @@ module.exports = function(grunt) {
grunt.loadNpmTasks('grunt-contrib-jshint'); grunt.loadNpmTasks('grunt-contrib-jshint');
grunt.loadNpmTasks('grunt-contrib-uglify'); grunt.loadNpmTasks('grunt-contrib-uglify');
grunt.loadNpmTasks('grunt-contrib-connect'); grunt.loadNpmTasks('grunt-contrib-connect');
grunt.loadNpmTasks('grunt-contrib-qunit');
grunt.loadNpmTasks('grunt-contrib-yuidoc'); grunt.loadNpmTasks('grunt-contrib-yuidoc');
grunt.loadNpmTasks('grunt-contrib-watch'); grunt.loadTasks('tasks');
var root = 'src/pixi/', var srcFiles = [
debug = 'bin/pixi.dev.js',
srcFiles = [
'<%= dirs.src %>/Intro.js', '<%= dirs.src %>/Intro.js',
'<%= dirs.src %>/Pixi.js', '<%= dirs.src %>/Pixi.js',
'<%= dirs.src %>/core/Point.js', '<%= dirs.src %>/core/Point.js',
@ -74,9 +71,9 @@ module.exports = function(grunt) {
'<%= dirs.src %>/filters/DotScreenFilter.js', '<%= dirs.src %>/filters/DotScreenFilter.js',
'<%= dirs.src %>/filters/CrossHatchFilter.js', '<%= dirs.src %>/filters/CrossHatchFilter.js',
'<%= dirs.src %>/filters/RGBSplitFilter.js', '<%= dirs.src %>/filters/RGBSplitFilter.js',
'<%= dirs.src %>/Outro.js' '<%= dirs.src %>/Outro.js'
], banner = [ ],
banner = [
'/**', '/**',
' * @license', ' * @license',
' * <%= pkg.name %> - v<%= pkg.version %>', ' * <%= pkg.name %> - v<%= pkg.version %>',
@ -101,7 +98,7 @@ module.exports = function(grunt) {
}, },
files: { files: {
srcBlob: '<%= dirs.src %>/**/*.js', srcBlob: '<%= dirs.src %>/**/*.js',
testBlob: '<%= dirs.test %>/unit/**/*.js', testBlob: '<%= dirs.test %>/{functional,lib/pixi,unit/pixi}/**/*.js',
build: '<%= dirs.build %>/pixi.dev.js', build: '<%= dirs.build %>/pixi.dev.js',
buildMin: '<%= dirs.build %>/pixi.js' buildMin: '<%= dirs.build %>/pixi.js'
}, },
@ -114,6 +111,7 @@ module.exports = function(grunt) {
dest: '<%= files.build %>' dest: '<%= files.build %>'
} }
}, },
/* jshint -W106 */
concat_sourcemap: { concat_sourcemap: {
dev: { dev: {
files: { files: {
@ -125,11 +123,18 @@ module.exports = function(grunt) {
} }
}, },
jshint: { jshint: {
beforeconcat: srcFiles,
test: ['<%= files.testBlob %>'],
options: { options: {
asi: true, jshintrc: '.jshintrc'
smarttabs: true },
source: srcFiles.filter(function(v) { return v.match(/(Intro|Outro|Spine|Pixi)\.js$/) === null; }).concat('Gruntfile.js'),
test: {
src: ['<%= files.testBlob %>'],
options: {
jshintrc: undefined, //don't use jshintrc for tests
expr: true,
undef: false,
camelcase: false
}
} }
}, },
uglify: { uglify: {
@ -142,12 +147,6 @@ module.exports = function(grunt) {
} }
}, },
connect: { connect: {
qunit: {
options: {
port: grunt.option('port-test') || 9002,
base: './'
}
},
test: { test: {
options: { options: {
port: grunt.option('port-test') || 9002, port: grunt.option('port-test') || 9002,
@ -156,13 +155,6 @@ module.exports = function(grunt) {
} }
} }
}, },
qunit: {
all: {
options: {
urls: ['http://localhost:' + (grunt.option('port-test') || 9002) + '/test/index.html']
}
}
},
yuidoc: { yuidoc: {
compile: { compile: {
name: '<%= pkg.name %>', name: '<%= pkg.name %>',
@ -176,23 +168,22 @@ module.exports = function(grunt) {
} }
} }
}, },
watch: { karma: {
dev: { unit: {
files: ['Gruntfile.js', 'src/**/*.js', 'examples/**/*.html'], configFile: 'test/karma.conf.js',
tasks: ['build-debug'], // browsers: ['Chrome'],
singleRun: true
// We would need to inject <script> in each HTML...
// options: {
// livereload: true
// }
} }
} }
}); });
grunt.registerTask('build-debug', ['concat_sourcemap', 'uglify']) grunt.registerTask('default', ['build', 'test']);
grunt.registerTask('default', ['concat', 'uglify']);
grunt.registerTask('build', ['concat', 'uglify']);
grunt.registerTask('test', ['build', 'connect:qunit', 'qunit']);
grunt.registerTask('docs', ['yuidoc']);
} grunt.registerTask('build', ['jshint:source', 'concat', 'uglify']);
grunt.registerTask('build-debug', ['concat_sourcemap', 'uglify']);
grunt.registerTask('test', ['concat', 'jshint:test', 'karma']);
grunt.registerTask('docs', ['yuidoc']);
grunt.registerTask('travis', ['test']);
};

25
package.json
View file

@ -18,16 +18,23 @@
"main": "bin/pixi.js", "main": "bin/pixi.js",
"scripts": {
"test": "grunt travis --verbose"
},
"dependencies": {}, "dependencies": {},
"devDependencies": { "devDependencies": {
"grunt": "~0.4.x", "grunt": "~0.4.1",
"grunt-contrib-jshint": "0.3.x", "grunt-contrib-jshint": "git+https://github.com/englercj/grunt-contrib-jshint.git",
"grunt-contrib-uglify": "0.2.x", "grunt-contrib-uglify": "~0.2",
"grunt-contrib-connect": "0.2.x", "grunt-contrib-connect": "~0.5",
"grunt-contrib-qunit": "0.2.x", "grunt-contrib-yuidoc": "~0.5",
"grunt-contrib-yuidoc": "0.4.x", "grunt-concat-sourcemap": "~0.4",
"grunt-contrib-concat": "0.1.x", "grunt-contrib-concat": "~0.3",
"grunt-concat-sourcemap": "0.3.x", "mocha": "~1.15",
"grunt-contrib-concat": "0.1.x" "chai": "~1.8",
"karma": "~0.11",
"karma-firefox-launcher": "~0.1",
"karma-mocha": "~0.1"
} }
} }

82
src/pixi/InteractionManager.js
View file

@ -36,8 +36,6 @@ PIXI.InteractionManager = function(stage)
*/ */
this.touchs = {}; this.touchs = {};
// helpers // helpers
this.tempPoint = new PIXI.Point(); this.tempPoint = new PIXI.Point();
//this.tempMatrix = mat3.create(); //this.tempMatrix = mat3.create();
@ -59,10 +57,8 @@ PIXI.InteractionManager = function(stage)
this.onTouchStart = this.onTouchStart.bind(this); this.onTouchStart = this.onTouchStart.bind(this);
this.onTouchEnd = this.onTouchEnd.bind(this); this.onTouchEnd = this.onTouchEnd.bind(this);
this.onTouchMove = this.onTouchMove.bind(this); this.onTouchMove = this.onTouchMove.bind(this);
this.last = 0; this.last = 0;
} };
// constructor // constructor
PIXI.InteractionManager.prototype.constructor = PIXI.InteractionManager; PIXI.InteractionManager.prototype.constructor = PIXI.InteractionManager;
@ -109,7 +105,7 @@ PIXI.InteractionManager.prototype.collectInteractiveSprite = function(displayObj
} }
// } // }
} }
} };
/** /**
* Sets the target for event delegation * Sets the target for event delegation
@ -129,7 +125,7 @@ PIXI.InteractionManager.prototype.setTarget = function(target)
} }
document.body.addEventListener('mouseup', this.onMouseUp, true); document.body.addEventListener('mouseup', this.onMouseUp, true);
} };
/** /**
@ -179,8 +175,7 @@ PIXI.InteractionManager.prototype.setTargetDomElement = function(domElement)
domElement.addEventListener('touchstart', this.onTouchStart, true); domElement.addEventListener('touchstart', this.onTouchStart, true);
domElement.addEventListener('touchend', this.onTouchEnd, true); domElement.addEventListener('touchend', this.onTouchEnd, true);
domElement.addEventListener('touchmove', this.onTouchMove, true); domElement.addEventListener('touchmove', this.onTouchMove, true);
} };
/** /**
* updates the state of interactive objects * updates the state of interactive objects
@ -200,6 +195,8 @@ PIXI.InteractionManager.prototype.update = function()
this.last = now; this.last = now;
// //
var i = 0;
// ok.. so mouse events?? // ok.. so mouse events??
// yes for now :) // yes for now :)
// OPTIMSE - how often to check?? // OPTIMSE - how often to check??
@ -209,7 +206,7 @@ PIXI.InteractionManager.prototype.update = function()
var len = this.interactiveItems.length; var len = this.interactiveItems.length;
for (var i=0; i < len; i++) { for (i = 0; i < len; i++) {
this.interactiveItems[i].interactiveChildren = false; this.interactiveItems[i].interactiveChildren = false;
} }
@ -223,9 +220,9 @@ PIXI.InteractionManager.prototype.update = function()
// loop through interactive objects! // loop through interactive objects!
var length = this.interactiveItems.length; var length = this.interactiveItems.length;
this.interactionDOMElement.style.cursor = "inherit"; this.interactionDOMElement.style.cursor = 'inherit';
for (var i = 0; i < length; i++) for (i = 0; i < length; i++)
{ {
var item = this.interactiveItems[i]; var item = this.interactiveItems[i];
@ -265,10 +262,9 @@ PIXI.InteractionManager.prototype.update = function()
} }
} }
} }
// ---> // --->
} }
} };
/** /**
* Is called when the mouse moves accross the renderer element * Is called when the mouse moves accross the renderer element
@ -287,8 +283,6 @@ PIXI.InteractionManager.prototype.onMouseMove = function(event)
this.mouse.global.y = (event.clientY - rect.top) * ( this.target.height / rect.height); this.mouse.global.y = (event.clientY - rect.top) * ( this.target.height / rect.height);
var length = this.interactiveItems.length; var length = this.interactiveItems.length;
var global = this.mouse.global;
for (var i = 0; i < length; i++) for (var i = 0; i < length; i++)
{ {
@ -300,7 +294,7 @@ PIXI.InteractionManager.prototype.onMouseMove = function(event)
item.mousemove(this.mouse); item.mousemove(this.mouse);
} }
} }
} };
/** /**
* Is called when the mouse button is pressed down on the renderer element * Is called when the mouse button is pressed down on the renderer element
@ -318,10 +312,6 @@ PIXI.InteractionManager.prototype.onMouseDown = function(event)
// get interactive items under point?? // get interactive items under point??
//stage.__i //stage.__i
var length = this.interactiveItems.length; var length = this.interactiveItems.length;
var global = this.mouse.global;
var index = 0;
var parent = this.stage;
// while // while
// hit test // hit test
@ -345,14 +335,14 @@ PIXI.InteractionManager.prototype.onMouseDown = function(event)
} }
} }
} }
} };
PIXI.InteractionManager.prototype.onMouseOut = function(event) PIXI.InteractionManager.prototype.onMouseOut = function()
{ {
var length = this.interactiveItems.length; var length = this.interactiveItems.length;
this.interactionDOMElement.style.cursor = "inherit"; this.interactionDOMElement.style.cursor = 'inherit';
for (var i = 0; i < length; i++) for (var i = 0; i < length; i++)
{ {
@ -365,7 +355,7 @@ PIXI.InteractionManager.prototype.onMouseOut = function(event)
item.__isOver = false; item.__isOver = false;
} }
} }
} };
/** /**
* Is called when the mouse button is released on the renderer element * Is called when the mouse button is released on the renderer element
@ -378,9 +368,6 @@ PIXI.InteractionManager.prototype.onMouseUp = function(event)
{ {
this.mouse.originalEvent = event || window.event; //IE uses window.event this.mouse.originalEvent = event || window.event; //IE uses window.event
var global = this.mouse.global;
var length = this.interactiveItems.length; var length = this.interactiveItems.length;
var up = false; var up = false;
@ -417,7 +404,7 @@ PIXI.InteractionManager.prototype.onMouseUp = function(event)
item.__isDown = false; item.__isDown = false;
} }
} }
} };
/** /**
* Tests if the current mouse coords hit a sprite * Tests if the current mouse coords hit a sprite
@ -469,7 +456,7 @@ PIXI.InteractionManager.prototype.hitTest = function(item, interactionData)
if(y > y1 && y < y1 + height) if(y > y1 && y < y1 + height)
{ {
// set the target property if a hit is true! // set the target property if a hit is true!
interactionData.target = item interactionData.target = item;
return true; return true;
} }
} }
@ -484,13 +471,13 @@ PIXI.InteractionManager.prototype.hitTest = function(item, interactionData)
if(hit) if(hit)
{ {
// hmm.. TODO SET CORRECT TARGET? // hmm.. TODO SET CORRECT TARGET?
interactionData.target = item interactionData.target = item;
return true; return true;
} }
} }
return false; return false;
} };
/** /**
* Is called when a touch is moved accross the renderer element * Is called when a touch is moved accross the renderer element
@ -503,11 +490,13 @@ PIXI.InteractionManager.prototype.onTouchMove = function(event)
{ {
var rect = this.interactionDOMElement.getBoundingClientRect(); var rect = this.interactionDOMElement.getBoundingClientRect();
var changedTouches = event.changedTouches; var changedTouches = event.changedTouches;
var touchData;
var i = 0;
for (var i=0; i < changedTouches.length; i++) for (i = 0; i < changedTouches.length; i++)
{ {
var touchEvent = changedTouches[i]; var touchEvent = changedTouches[i];
var touchData = this.touchs[touchEvent.identifier]; touchData = this.touchs[touchEvent.identifier];
touchData.originalEvent = event || window.event; touchData.originalEvent = event || window.event;
// update the touch position // update the touch position
@ -516,12 +505,13 @@ PIXI.InteractionManager.prototype.onTouchMove = function(event)
} }
var length = this.interactiveItems.length; var length = this.interactiveItems.length;
for (var i = 0; i < length; i++) for (i = 0; i < length; i++)
{ {
var item = this.interactiveItems[i]; var item = this.interactiveItems[i];
if(item.touchmove)item.touchmove(touchData); if(item.touchmove)
item.touchmove(touchData);
} }
} };
/** /**
* Is called when a touch is started on the renderer element * Is called when a touch is started on the renderer element
@ -570,7 +560,7 @@ PIXI.InteractionManager.prototype.onTouchStart = function(event)
} }
} }
} }
} };
/** /**
* Is called when a touch is ended on the renderer element * Is called when a touch is ended on the renderer element
@ -600,7 +590,7 @@ PIXI.InteractionManager.prototype.onTouchEnd = function(event)
var itemTouchData = item.__touchData; // <-- Here! var itemTouchData = item.__touchData; // <-- Here!
item.__hit = this.hitTest(item, touchData); item.__hit = this.hitTest(item, touchData);
if(itemTouchData == touchData) if(itemTouchData === touchData)
{ {
// so this one WAS down... // so this one WAS down...
touchData.originalEvent = event || window.event; touchData.originalEvent = event || window.event;
@ -632,16 +622,18 @@ PIXI.InteractionManager.prototype.onTouchEnd = function(event)
item.__touchData = null; item.__touchData = null;
} }
/*
else else
{ {
} }
*/
} }
// remove the touch.. // remove the touch..
this.pool.push(touchData); this.pool.push(touchData);
this.touchs[touchEvent.identifier] = null; this.touchs[touchEvent.identifier] = null;
} }
} };
/** /**
* Holds all information related to an Interaction event * Holds all information related to an Interaction event
@ -668,7 +660,7 @@ PIXI.InteractionData = function()
* @property target * @property target
* @type Sprite * @type Sprite
*/ */
this.target; this.target = null;
/** /**
* When passed to an event handler, this will be the original DOM Event that was captured * When passed to an event handler, this will be the original DOM Event that was captured
@ -676,8 +668,8 @@ PIXI.InteractionData = function()
* @property originalEvent * @property originalEvent
* @type Event * @type Event
*/ */
this.originalEvent; this.originalEvent = null;
} };
/** /**
* This will return the local coords of the specified displayObject for this InteractionData * This will return the local coords of the specified displayObject for this InteractionData
@ -697,8 +689,8 @@ PIXI.InteractionData.prototype.getLocalPosition = function(displayObject)
id = 1 / (a00 * a11 + a01 * -a10); id = 1 / (a00 * a11 + a01 * -a10);
// set the mouse coords... // set the mouse coords...
return new PIXI.Point(a11 * id * global.x + -a01 * id * global.y + (a12 * a01 - a02 * a11) * id, return new PIXI.Point(a11 * id * global.x + -a01 * id * global.y + (a12 * a01 - a02 * a11) * id,
a00 * id * global.y + -a10 * id * global.x + (-a12 * a00 + a02 * a10) * id) a00 * id * global.y + -a10 * id * global.x + (-a12 * a00 + a02 * a10) * id);
} };
// constructor // constructor
PIXI.InteractionData.prototype.constructor = PIXI.InteractionData; PIXI.InteractionData.prototype.constructor = PIXI.InteractionData;

6
src/pixi/core/Circle.js
View file

@ -33,7 +33,7 @@ PIXI.Circle = function(x, y, radius)
* @default 0 * @default 0
*/ */
this.radius = radius || 0; this.radius = radius || 0;
} };
/** /**
* Creates a clone of this Circle instance * Creates a clone of this Circle instance
@ -44,7 +44,7 @@ PIXI.Circle = function(x, y, radius)
PIXI.Circle.prototype.clone = function() PIXI.Circle.prototype.clone = function()
{ {
return new PIXI.Circle(this.x, this.y, this.radius); return new PIXI.Circle(this.x, this.y, this.radius);
} };
/** /**
* Checks if the x, and y coords passed to this function are contained within this circle * Checks if the x, and y coords passed to this function are contained within this circle
@ -67,7 +67,7 @@ PIXI.Circle.prototype.contains = function(x, y)
dy *= dy; dy *= dy;
return (dx + dy <= r2); return (dx + dy <= r2);
} };
// constructor // constructor
PIXI.Circle.prototype.constructor = PIXI.Circle; PIXI.Circle.prototype.constructor = PIXI.Circle;

10
src/pixi/core/Ellipse.js
View file

@ -41,7 +41,7 @@ PIXI.Ellipse = function(x, y, width, height)
* @default 0 * @default 0
*/ */
this.height = height || 0; this.height = height || 0;
} };
/** /**
* Creates a clone of this Ellipse instance * Creates a clone of this Ellipse instance
@ -52,7 +52,7 @@ PIXI.Ellipse = function(x, y, width, height)
PIXI.Ellipse.prototype.clone = function() PIXI.Ellipse.prototype.clone = function()
{ {
return new PIXI.Ellipse(this.x, this.y, this.width, this.height); return new PIXI.Ellipse(this.x, this.y, this.width, this.height);
} };
/** /**
* Checks if the x, and y coords passed to this function are contained within this ellipse * Checks if the x, and y coords passed to this function are contained within this ellipse
@ -76,12 +76,12 @@ PIXI.Ellipse.prototype.contains = function(x, y)
normy *= normy; normy *= normy;
return (normx + normy < 0.25); return (normx + normy < 0.25);
} };
PIXI.Ellipse.getBounds = function() PIXI.Ellipse.prototype.getBounds = 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);
} };
// constructor // constructor
PIXI.Ellipse.prototype.constructor = PIXI.Ellipse; PIXI.Ellipse.prototype.constructor = PIXI.Ellipse;

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

@ -29,7 +29,7 @@ PIXI.mat3.create = function()
matrix[8] = 1; matrix[8] = 1;
return matrix; return matrix;
} };
PIXI.mat3.identity = function(matrix) PIXI.mat3.identity = function(matrix)
@ -45,7 +45,7 @@ PIXI.mat3.identity = function(matrix)
matrix[8] = 1; matrix[8] = 1;
return matrix; return matrix;
} };
PIXI.mat4 = {}; PIXI.mat4 = {};
@ -72,7 +72,7 @@ PIXI.mat4.create = function()
matrix[15] = 1; matrix[15] = 1;
return matrix; return matrix;
} };
PIXI.mat3.multiply = function (mat, mat2, dest) PIXI.mat3.multiply = function (mat, mat2, dest)
{ {
@ -100,7 +100,7 @@ PIXI.mat3.multiply = function (mat, mat2, dest)
dest[8] = b20 * a02 + b21 * a12 + b22 * a22; dest[8] = b20 * a02 + b21 * a12 + b22 * a22;
return dest; return dest;
} };
PIXI.mat3.clone = function(mat) PIXI.mat3.clone = function(mat)
{ {
@ -117,7 +117,7 @@ PIXI.mat3.clone = function(mat)
matrix[8] = mat[8]; matrix[8] = mat[8];
return matrix; return matrix;
} };
PIXI.mat3.transpose = function (mat, dest) PIXI.mat3.transpose = function (mat, dest)
{ {
@ -145,7 +145,7 @@ PIXI.mat3.transpose = function (mat, dest)
dest[7] = mat[5]; dest[7] = mat[5];
dest[8] = mat[8]; dest[8] = mat[8];
return dest; return dest;
} };
PIXI.mat3.toMat4 = function (mat, dest) PIXI.mat3.toMat4 = function (mat, dest)
{ {
@ -172,7 +172,7 @@ PIXI.mat3.toMat4 = function (mat, dest)
dest[0] = mat[0]; dest[0] = mat[0];
return dest; return dest;
} };
///// /////
@ -200,7 +200,7 @@ PIXI.mat4.create = function()
matrix[15] = 1; matrix[15] = 1;
return matrix; return matrix;
} };
PIXI.mat4.transpose = function (mat, dest) PIXI.mat4.transpose = function (mat, dest)
{ {
@ -243,7 +243,7 @@ PIXI.mat4.transpose = function (mat, dest)
dest[14] = mat[11]; dest[14] = mat[11];
dest[15] = mat[15]; dest[15] = mat[15];
return dest; return dest;
} };
PIXI.mat4.multiply = function (mat, mat2, dest) PIXI.mat4.multiply = function (mat, mat2, dest)
{ {
@ -290,4 +290,4 @@ PIXI.mat4.multiply = function (mat, mat2, dest)
dest[15] = b0*a03 + b1*a13 + b2*a23 + b3*a33; dest[15] = b0*a03 + b1*a13 + b2*a23 + b3*a33;
return dest; return dest;
} };

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

@ -25,7 +25,7 @@ PIXI.Point = function(x, y)
* @default 0 * @default 0
*/ */
this.y = y || 0; this.y = y || 0;
} };
/** /**
* Creates a clone of this point * Creates a clone of this point
@ -36,7 +36,7 @@ PIXI.Point = function(x, y)
PIXI.Point.prototype.clone = function() PIXI.Point.prototype.clone = function()
{ {
return new PIXI.Point(this.x, this.y); return new PIXI.Point(this.x, this.y);
} };
// constructor // constructor
PIXI.Point.prototype.constructor = PIXI.Point; PIXI.Point.prototype.constructor = PIXI.Point;

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

@ -30,7 +30,7 @@ PIXI.Polygon = function(points)
} }
this.points = points; this.points = points;
} };
/** /**
* Creates a clone of this polygon * Creates a clone of this polygon
@ -46,7 +46,7 @@ PIXI.Polygon.prototype.clone = function()
} }
return new PIXI.Polygon(points); return new PIXI.Polygon(points);
} };
/** /**
* Checks if the x, and y coords passed to this function are contained within this polygon * Checks if the x, and y coords passed to this function are contained within this polygon
@ -65,13 +65,13 @@ PIXI.Polygon.prototype.contains = function(x, y)
for(var i = 0, j = this.points.length - 1; i < this.points.length; j = i++) { for(var i = 0, j = this.points.length - 1; i < this.points.length; j = i++) {
var xi = this.points[i].x, yi = this.points[i].y, var xi = this.points[i].x, yi = this.points[i].y,
xj = this.points[j].x, yj = this.points[j].y, xj = this.points[j].x, yj = this.points[j].y,
intersect = ((yi > y) != (yj > y)) && (x < (xj - xi) * (y - yi) / (yj - yi) + xi); intersect = ((yi > y) !== (yj > y)) && (x < (xj - xi) * (y - yi) / (yj - yi) + xi);
if(intersect) inside = !inside; if(intersect) inside = !inside;
} }
return inside; return inside;
} };
// constructor // constructor
PIXI.Polygon.prototype.constructor = PIXI.Polygon; PIXI.Polygon.prototype.constructor = PIXI.Polygon;

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

@ -41,7 +41,7 @@ PIXI.Rectangle = function(x, y, width, height)
* @default 0 * @default 0
*/ */
this.height = height || 0; this.height = height || 0;
} };
/** /**
* Creates a clone of this Rectangle * Creates a clone of this Rectangle
@ -52,7 +52,7 @@ PIXI.Rectangle = function(x, y, width, height)
PIXI.Rectangle.prototype.clone = function() 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);
} };
/** /**
* Checks if the x, and y coords passed to this function are contained within this Rectangle * Checks if the x, and y coords passed to this function are contained within this Rectangle
@ -79,7 +79,7 @@ PIXI.Rectangle.prototype.contains = function(x, y)
} }
return false; return false;
} };
// constructor // constructor
PIXI.Rectangle.prototype.constructor = PIXI.Rectangle; PIXI.Rectangle.prototype.constructor = PIXI.Rectangle;

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

@ -122,7 +122,7 @@ PIXI.DisplayObject = function()
*/ */
this._interactive = false; this._interactive = false;
this.defaultCursor = "pointer"; this.defaultCursor = 'pointer';
/** /**
* [read-only] Current transform of the object based on world (parent) factors * [read-only] Current transform of the object based on world (parent) factors
@ -132,7 +132,7 @@ PIXI.DisplayObject = function()
* @readOnly * @readOnly
* @private * @private
*/ */
this.worldTransform = PIXI.mat3.create()//mat3.identity(); this.worldTransform = PIXI.mat3.create(); //mat3.identity();
/** /**
* [read-only] Current transform of the object locally * [read-only] Current transform of the object locally
@ -142,7 +142,7 @@ PIXI.DisplayObject = function()
* @readOnly * @readOnly
* @private * @private
*/ */
this.localTransform = PIXI.mat3.create()//mat3.identity(); this.localTransform = PIXI.mat3.create(); //mat3.identity();
/** /**
* [NYI] Unkown * [NYI] Unkown
@ -241,7 +241,7 @@ PIXI.DisplayObject = function()
* @method touchendoutside * @method touchendoutside
* @param interactionData {InteractionData} * @param interactionData {InteractionData}
*/ */
} };
// constructor // constructor
PIXI.DisplayObject.prototype.constructor = PIXI.DisplayObject; PIXI.DisplayObject.prototype.constructor = PIXI.DisplayObject;
@ -257,7 +257,7 @@ PIXI.DisplayObject.prototype.constructor = PIXI.DisplayObject;
PIXI.DisplayObject.prototype.setInteractive = function(interactive) PIXI.DisplayObject.prototype.setInteractive = function(interactive)
{ {
this.interactive = interactive; this.interactive = interactive;
} };
/** /**
* Indicates if the sprite will have touch and mouse interactivity. It is false by default * Indicates if the sprite will have touch and mouse interactivity. It is false by default
@ -343,21 +343,19 @@ Object.defineProperty(PIXI.DisplayObject.prototype, 'filters', {
for (var j = 0; j < filterPasses.length; j++) for (var j = 0; j < filterPasses.length; j++)
{ {
passes.push(filterPasses[j]); passes.push(filterPasses[j]);
}; }
}; }
value.start.filterPasses = passes; value.start.filterPasses = passes;
} }
else else
{ {
if(this._filters)this.removeFilter(this._filters); if(this._filters) {
this.removeFilter(this._filters);
}
} }
this._filters = value; this._filters = value;
} }
}); });
@ -397,8 +395,8 @@ PIXI.DisplayObject.prototype.addFilter = function(data)
* insert start * insert start
*/ */
var childFirst = start var childFirst = start;
var childLast = start var childLast = start;
var nextObject; var nextObject;
var previousObject; var previousObject;
@ -421,16 +419,15 @@ PIXI.DisplayObject.prototype.addFilter = function(data)
childLast._iNext = nextObject; childLast._iNext = nextObject;
} }
// now insert the end filter block.. // now insert the end filter block..
/* /*
* insert end filter * insert end filter
*/ */
var childFirst = end childFirst = end;
var childLast = end childLast = end;
var nextObject = null; nextObject = null;
var previousObject = null; previousObject = null;
previousObject = this.last; previousObject = this.last;
nextObject = previousObject._iNext; nextObject = previousObject._iNext;
@ -449,7 +446,7 @@ PIXI.DisplayObject.prototype.addFilter = function(data)
var prevLast = this.last; var prevLast = this.last;
while(updateLast) while(updateLast)
{ {
if(updateLast.last == prevLast) if(updateLast.last === prevLast)
{ {
updateLast.last = end; updateLast.last = end;
} }
@ -463,8 +460,7 @@ PIXI.DisplayObject.prototype.addFilter = function(data)
{ {
this.__renderGroup.addFilterBlocks(start, end); this.__renderGroup.addFilterBlocks(start, end);
} }
};
}
/* /*
* Removes the filter to this displayObject * Removes the filter to this displayObject
@ -476,7 +472,7 @@ PIXI.DisplayObject.prototype.removeFilter = function(data)
{ {
//if(!this.filter)return; //if(!this.filter)return;
//this.filter = false; //this.filter = false;
// console.log("YUOIO") // console.log('YUOIO')
// modify the list.. // modify the list..
var startBlock = data.start; var startBlock = data.start;
@ -492,8 +488,8 @@ PIXI.DisplayObject.prototype.removeFilter = function(data)
// remove the end filter // remove the end filter
var lastBlock = data.end; var lastBlock = data.end;
var nextObject = lastBlock._iNext; nextObject = lastBlock._iNext;
var previousObject = lastBlock._iPrev; previousObject = lastBlock._iPrev;
if(nextObject)nextObject._iPrev = previousObject; if(nextObject)nextObject._iPrev = previousObject;
previousObject._iNext = nextObject; previousObject._iNext = nextObject;
@ -502,7 +498,7 @@ PIXI.DisplayObject.prototype.removeFilter = function(data)
var tempLast = lastBlock._iPrev; var tempLast = lastBlock._iPrev;
// need to make sure the parents last is updated too // need to make sure the parents last is updated too
var updateLast = this; var updateLast = this;
while(updateLast.last == lastBlock) while(updateLast.last === lastBlock)
{ {
updateLast.last = tempLast; updateLast.last = tempLast;
updateLast = updateLast.parent; updateLast = updateLast.parent;
@ -514,7 +510,7 @@ PIXI.DisplayObject.prototype.removeFilter = function(data)
{ {
this.__renderGroup.removeFilterBlocks(startBlock, lastBlock); this.__renderGroup.removeFilterBlocks(startBlock, lastBlock);
} }
} };
/* /*
* Updates the object transform for rendering * Updates the object transform for rendering
@ -537,7 +533,7 @@ PIXI.DisplayObject.prototype.updateTransform = function()
var worldTransform = this.worldTransform; var worldTransform = this.worldTransform;
//console.log(localTransform) //console.log(localTransform)
localTransform[0] = this._cr * this.scale.x; localTransform[0] = this._cr * this.scale.x;
localTransform[1] = -this._sr * this.scale.y localTransform[1] = -this._sr * this.scale.y;
localTransform[3] = this._sr * this.scale.x; localTransform[3] = this._sr * this.scale.x;
localTransform[4] = this._cr * this.scale.y; localTransform[4] = this._cr * this.scale.y;
@ -553,8 +549,8 @@ PIXI.DisplayObject.prototype.updateTransform = function()
b00 = parentTransform[0], b01 = parentTransform[1], b02 = parentTransform[2], b00 = parentTransform[0], b01 = parentTransform[1], b02 = parentTransform[2],
b10 = parentTransform[3], b11 = parentTransform[4], b12 = parentTransform[5]; b10 = parentTransform[3], b11 = parentTransform[4], b12 = parentTransform[5];
localTransform[2] = a02 localTransform[2] = a02;
localTransform[5] = a12 localTransform[5] = a12;
worldTransform[0] = b00 * a00 + b01 * a10; worldTransform[0] = b00 * a00 + b01 * a10;
worldTransform[1] = b00 * a01 + b01 * a11; worldTransform[1] = b00 * a01 + b01 * a11;
@ -569,7 +565,6 @@ PIXI.DisplayObject.prototype.updateTransform = function()
this.worldAlpha = this.alpha * this.parent.worldAlpha; this.worldAlpha = this.alpha * this.parent.worldAlpha;
this.vcount = PIXI.visibleCount; this.vcount = PIXI.visibleCount;
};
}
PIXI.visibleCount = 0; PIXI.visibleCount = 0;

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

@ -23,7 +23,7 @@ PIXI.DisplayObjectContainer = function()
* @readOnly * @readOnly
*/ */
this.children = []; this.children = [];
} };
// constructor // constructor
PIXI.DisplayObjectContainer.prototype = Object.create( PIXI.DisplayObject.prototype ); PIXI.DisplayObjectContainer.prototype = Object.create( PIXI.DisplayObject.prototype );
@ -37,7 +37,7 @@ PIXI.DisplayObjectContainer.prototype.constructor = PIXI.DisplayObjectContainer;
*/ */
PIXI.DisplayObjectContainer.prototype.addChild = function(child) PIXI.DisplayObjectContainer.prototype.addChild = function(child)
{ {
if(child.parent != undefined) if(child.parent !== undefined)
{ {
//// COULD BE THIS??? //// COULD BE THIS???
@ -60,13 +60,13 @@ PIXI.DisplayObjectContainer.prototype.addChild = function(child)
tmpChild.stage = this.stage; tmpChild.stage = this.stage;
tmpChild = tmpChild._iNext; tmpChild = tmpChild._iNext;
} }
while(tmpChild) while(tmpChild);
} }
// LINKED LIST // // LINKED LIST //
// modify the list.. // modify the list..
var childFirst = child.first var childFirst = child.first;
var childLast = child.last; var childLast = child.last;
var nextObject; var nextObject;
var previousObject; var previousObject;
@ -90,7 +90,7 @@ PIXI.DisplayObjectContainer.prototype.addChild = function(child)
while(updateLast) while(updateLast)
{ {
if(updateLast.last == prevLast) if(updateLast.last === prevLast)
{ {
updateLast.last = child.last; updateLast.last = child.last;
} }
@ -114,8 +114,7 @@ PIXI.DisplayObjectContainer.prototype.addChild = function(child)
// add them to the new render group.. // add them to the new render group..
this.__renderGroup.addDisplayObjectAndChildren(child); this.__renderGroup.addDisplayObjectAndChildren(child);
} }
};
}
/** /**
* Adds a child to the container at a specified index. If the index is out of bounds an error will be thrown * Adds a child to the container at a specified index. If the index is out of bounds an error will be thrown
@ -128,10 +127,11 @@ PIXI.DisplayObjectContainer.prototype.addChildAt = function(child, index)
{ {
if(index >= 0 && index <= this.children.length) if(index >= 0 && index <= this.children.length)
{ {
if(child.parent != undefined) if(child.parent !== undefined)
{ {
child.parent.removeChild(child); child.parent.removeChild(child);
} }
child.parent = this; child.parent = this;
if(this.stage) if(this.stage)
@ -143,7 +143,7 @@ PIXI.DisplayObjectContainer.prototype.addChildAt = function(child, index)
tmpChild.stage = this.stage; tmpChild.stage = this.stage;
tmpChild = tmpChild._iNext; tmpChild = tmpChild._iNext;
} }
while(tmpChild) while(tmpChild);
} }
// modify the list.. // modify the list..
@ -152,21 +152,21 @@ PIXI.DisplayObjectContainer.prototype.addChildAt = function(child, index)
var nextObject; var nextObject;
var previousObject; var previousObject;
if(index == this.children.length) if(index === this.children.length)
{ {
previousObject = this.last; previousObject = this.last;
var updateLast = this; var updateLast = this;
var prevLast = this.last; var prevLast = this.last;
while(updateLast) while(updateLast)
{ {
if(updateLast.last == prevLast) if(updateLast.last === prevLast)
{ {
updateLast.last = child.last; updateLast.last = child.last;
} }
updateLast = updateLast.parent; updateLast = updateLast.parent;
} }
} }
else if(index == 0) else if(index === 0)
{ {
previousObject = this; previousObject = this;
} }
@ -200,9 +200,9 @@ PIXI.DisplayObjectContainer.prototype.addChildAt = function(child, index)
} }
else else
{ {
throw new Error(child + " The index "+ index +" supplied is out of bounds " + this.children.length); throw new Error(child + ' The index '+ index +' supplied is out of bounds ' + this.children.length);
} }
} };
/** /**
* [NYI] Swaps the depth of 2 displayObjects * [NYI] Swaps the depth of 2 displayObjects
@ -222,7 +222,7 @@ PIXI.DisplayObjectContainer.prototype.swapChildren = function(child, child2)
var index2 = this.children.indexOf(child2); var index2 = this.children.indexOf(child2);
if(index1 < 0 || index2 < 0) { if(index1 < 0 || index2 < 0) {
throw new Error("swapChildren: Both the supplied DisplayObjects must be a child of the caller."); throw new Error('swapChildren: Both the supplied DisplayObjects must be a child of the caller.');
} }
this.removeChild(child); this.removeChild(child);
@ -238,7 +238,7 @@ PIXI.DisplayObjectContainer.prototype.swapChildren = function(child, child2)
this.addChildAt(child, index2); this.addChildAt(child, index2);
this.addChildAt(child2, index1); this.addChildAt(child2, index1);
} }
} };
/** /**
* Returns the Child at the specified index * Returns the Child at the specified index
@ -254,9 +254,9 @@ PIXI.DisplayObjectContainer.prototype.getChildAt = function(index)
} }
else else
{ {
throw new Error(child + " Both the supplied DisplayObjects must be a child of the caller " + this); throw new Error('Both the supplied DisplayObjects must be a child of the caller ' + this);
} }
} };
/** /**
* Removes a child from the container. * Removes a child from the container.
@ -280,14 +280,13 @@ PIXI.DisplayObjectContainer.prototype.removeChild = function(child)
if(nextObject)nextObject._iPrev = previousObject; if(nextObject)nextObject._iPrev = previousObject;
previousObject._iNext = nextObject; previousObject._iNext = nextObject;
if(this.last == childLast) if(this.last === childLast)
{ {
var tempLast = childFirst._iPrev; var tempLast = childFirst._iPrev;
// need to make sure the parents last is updated too // need to make sure the parents last is updated too
var updateLast = this; var updateLast = this;
while(updateLast.last == childLast) while(updateLast.last === childLast)
{ {
updateLast.last = tempLast; updateLast.last = tempLast;
updateLast = updateLast.parent; updateLast = updateLast.parent;
@ -309,7 +308,7 @@ PIXI.DisplayObjectContainer.prototype.removeChild = function(child)
tmpChild.stage = null; tmpChild.stage = null;
tmpChild = tmpChild._iNext; tmpChild = tmpChild._iNext;
} }
while(tmpChild) while(tmpChild);
} }
// webGL trim // webGL trim
@ -323,9 +322,9 @@ PIXI.DisplayObjectContainer.prototype.removeChild = function(child)
} }
else else
{ {
throw new Error(child + " The supplied DisplayObject must be a child of the caller " + this); throw new Error(child + ' The supplied DisplayObject must be a child of the caller ' + this);
} }
} };
/* /*
* Updates the container's children's transform for rendering * Updates the container's children's transform for rendering
@ -343,4 +342,4 @@ PIXI.DisplayObjectContainer.prototype.updateTransform = function()
{ {
this.children[i].updateTransform(); this.children[i].updateTransform();
} }
} };

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

@ -66,7 +66,7 @@ PIXI.MovieClip = function(textures)
* @readOnly * @readOnly
*/ */
this.playing = false; this.playing = false;
} };
// constructor // constructor
PIXI.MovieClip.prototype = Object.create( PIXI.Sprite.prototype ); PIXI.MovieClip.prototype = Object.create( PIXI.Sprite.prototype );
@ -97,7 +97,7 @@ Object.defineProperty( PIXI.MovieClip.prototype, 'totalFrames', {
PIXI.MovieClip.prototype.stop = function() PIXI.MovieClip.prototype.stop = function()
{ {
this.playing = false; this.playing = false;
} };
/** /**
* Plays the MovieClip * Plays the MovieClip
@ -107,7 +107,7 @@ PIXI.MovieClip.prototype.stop = function()
PIXI.MovieClip.prototype.play = function() PIXI.MovieClip.prototype.play = function()
{ {
this.playing = true; this.playing = true;
} };
/** /**
* Stops the MovieClip and goes to a specific frame * Stops the MovieClip and goes to a specific frame
@ -121,7 +121,7 @@ PIXI.MovieClip.prototype.gotoAndStop = function(frameNumber)
this.currentFrame = frameNumber; this.currentFrame = frameNumber;
var round = (this.currentFrame + 0.5) | 0; var round = (this.currentFrame + 0.5) | 0;
this.setTexture(this.textures[round % this.textures.length]); this.setTexture(this.textures[round % this.textures.length]);
} };
/** /**
* Goes to a specific frame and begins playing the MovieClip * Goes to a specific frame and begins playing the MovieClip
@ -133,7 +133,7 @@ PIXI.MovieClip.prototype.gotoAndPlay = function(frameNumber)
{ {
this.currentFrame = frameNumber; this.currentFrame = frameNumber;
this.playing = true; this.playing = true;
} };
/* /*
* Updates the object transform for rendering * Updates the object transform for rendering
@ -163,4 +163,4 @@ PIXI.MovieClip.prototype.updateTransform = function()
this.onComplete(); this.onComplete();
} }
} }
} };

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

@ -77,7 +77,7 @@ PIXI.Sprite = function(texture)
} }
this.renderable = true; this.renderable = true;
} };
// constructor // constructor
PIXI.Sprite.prototype = Object.create( PIXI.DisplayObjectContainer.prototype ); PIXI.Sprite.prototype = Object.create( PIXI.DisplayObjectContainer.prototype );
@ -94,7 +94,7 @@ Object.defineProperty(PIXI.Sprite.prototype, 'width', {
return this.scale.x * this.texture.frame.width; return this.scale.x * this.texture.frame.width;
}, },
set: function(value) { set: function(value) {
this.scale.x = value / this.texture.frame.width this.scale.x = value / this.texture.frame.width;
this._width = value; this._width = value;
} }
}); });
@ -110,7 +110,7 @@ Object.defineProperty(PIXI.Sprite.prototype, 'height', {
return this.scale.y * this.texture.frame.height; return this.scale.y * this.texture.frame.height;
}, },
set: function(value) { set: function(value) {
this.scale.y = value / this.texture.frame.height this.scale.y = value / this.texture.frame.height;
this._height = value; this._height = value;
} }
}); });
@ -124,7 +124,7 @@ Object.defineProperty(PIXI.Sprite.prototype, 'height', {
PIXI.Sprite.prototype.setTexture = function(texture) PIXI.Sprite.prototype.setTexture = function(texture)
{ {
// stop current texture; // stop current texture;
if(this.texture.baseTexture != texture.baseTexture) if(this.texture.baseTexture !== texture.baseTexture)
{ {
this.textureChange = true; this.textureChange = true;
this.texture = texture; this.texture = texture;
@ -140,7 +140,7 @@ PIXI.Sprite.prototype.setTexture = function(texture)
} }
this.updateFrame = true; this.updateFrame = true;
} };
/** /**
* When the texture is updated, this event will fire to update the scale and frame * When the texture is updated, this event will fire to update the scale and frame
@ -149,7 +149,7 @@ PIXI.Sprite.prototype.setTexture = function(texture)
* @param event * @param event
* @private * @private
*/ */
PIXI.Sprite.prototype.onTextureUpdate = function(event) PIXI.Sprite.prototype.onTextureUpdate = function()
{ {
//this.texture.removeEventListener( 'update', this.onTextureUpdateBind ); //this.texture.removeEventListener( 'update', this.onTextureUpdateBind );
@ -158,7 +158,7 @@ PIXI.Sprite.prototype.onTextureUpdate = function(event)
if(this._height)this.scale.y = this._height / this.texture.frame.height; if(this._height)this.scale.y = this._height / this.texture.frame.height;
this.updateFrame = true; this.updateFrame = true;
} };
// some helper functions.. // some helper functions..
@ -175,9 +175,9 @@ PIXI.Sprite.prototype.onTextureUpdate = function(event)
PIXI.Sprite.fromFrame = function(frameId) PIXI.Sprite.fromFrame = function(frameId)
{ {
var texture = PIXI.TextureCache[frameId]; var texture = PIXI.TextureCache[frameId];
if(!texture)throw new Error("The frameId '"+ frameId +"' does not exist in the texture cache" + this); if(!texture) throw new Error('The frameId "' + frameId + '" does not exist in the texture cache' + this);
return new PIXI.Sprite(texture); return new PIXI.Sprite(texture);
} };
/** /**
* *
@ -193,4 +193,4 @@ PIXI.Sprite.fromImage = function(imageId)
{ {
var texture = PIXI.Texture.fromImage(imageId); var texture = PIXI.Texture.fromImage(imageId);
return new PIXI.Sprite(texture); return new PIXI.Sprite(texture);
} };

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

@ -61,7 +61,7 @@ PIXI.Stage = function(backgroundColor)
this.setBackgroundColor(backgroundColor); this.setBackgroundColor(backgroundColor);
this.worldVisible = true; this.worldVisible = true;
} };
// constructor // constructor
PIXI.Stage.prototype = Object.create( PIXI.DisplayObjectContainer.prototype ); PIXI.Stage.prototype = Object.create( PIXI.DisplayObjectContainer.prototype );
@ -77,7 +77,7 @@ PIXI.Stage.prototype.constructor = PIXI.Stage;
PIXI.Stage.prototype.setInteractionDelegate = function(domElement) PIXI.Stage.prototype.setInteractionDelegate = function(domElement)
{ {
this.interactionManager.setTargetDomElement( domElement ); this.interactionManager.setTargetDomElement( domElement );
} };
/* /*
* Updates the object transform for rendering * Updates the object transform for rendering
@ -104,7 +104,7 @@ PIXI.Stage.prototype.updateTransform = function()
if(this.interactive)this.interactionManager.update(); if(this.interactive)this.interactionManager.update();
} };
/** /**
* Sets the background color for the stage * Sets the background color for the stage
@ -116,11 +116,11 @@ PIXI.Stage.prototype.updateTransform = function()
PIXI.Stage.prototype.setBackgroundColor = function(backgroundColor) PIXI.Stage.prototype.setBackgroundColor = function(backgroundColor)
{ {
this.backgroundColor = backgroundColor || 0x000000; this.backgroundColor = backgroundColor || 0x000000;
this.backgroundColorSplit = HEXtoRGB(this.backgroundColor); this.backgroundColorSplit = PIXI.hex2rgb(this.backgroundColor);
var hex = this.backgroundColor.toString(16); var hex = this.backgroundColor.toString(16);
hex = "000000".substr(0, 6 - hex.length) + hex; hex = '000000'.substr(0, 6 - hex.length) + hex;
this.backgroundColorString = "#" + hex; this.backgroundColorString = '#' + hex;
} };
/** /**
* This will return the point containing global coords of the mouse. * This will return the point containing global coords of the mouse.
@ -131,4 +131,4 @@ PIXI.Stage.prototype.setBackgroundColor = function(backgroundColor)
PIXI.Stage.prototype.getMousePosition = function() PIXI.Stage.prototype.getMousePosition = function()
{ {
return this.interactionManager.mouse.global; return this.interactionManager.mouse.global;
} };

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

@ -15,7 +15,7 @@ PIXI.CustomRenderable = function()
PIXI.DisplayObject.call( this ); PIXI.DisplayObject.call( this );
this.renderable = true; this.renderable = true;
} };
// constructor // constructor
PIXI.CustomRenderable.prototype = Object.create( PIXI.DisplayObject.prototype ); PIXI.CustomRenderable.prototype = Object.create( PIXI.DisplayObject.prototype );
@ -27,10 +27,10 @@ PIXI.CustomRenderable.prototype.constructor = PIXI.CustomRenderable;
* @method renderCanvas * @method renderCanvas
* @param renderer {CanvasRenderer} The renderer instance * @param renderer {CanvasRenderer} The renderer instance
*/ */
PIXI.CustomRenderable.prototype.renderCanvas = function(renderer) PIXI.CustomRenderable.prototype.renderCanvas = function()
{ {
// override! // override!
} };
/** /**
* If this object is being rendered by a WebGLRenderer it will call this callback to initialize * If this object is being rendered by a WebGLRenderer it will call this callback to initialize
@ -38,20 +38,21 @@ PIXI.CustomRenderable.prototype.renderCanvas = function(renderer)
* @method initWebGL * @method initWebGL
* @param renderer {WebGLRenderer} The renderer instance * @param renderer {WebGLRenderer} The renderer instance
*/ */
PIXI.CustomRenderable.prototype.initWebGL = function(renderer) PIXI.CustomRenderable.prototype.initWebGL = function()
{ {
// override! // override!
} };
/** /**
* If this object is being rendered by a WebGLRenderer it will call this callback * If this object is being rendered by a WebGLRenderer it will call this callback
* *
* @method renderWebGL * @method renderWebGL
* @param renderer {WebGLRenderer} The renderer instance * @param rendererGroup {WebGLRenderGroup} The renderer group instance
* @param projectionMatrix {Matrix} The object's projection matrix
*/ */
PIXI.CustomRenderable.prototype.renderWebGL = function(renderGroup, projectionMatrix) PIXI.CustomRenderable.prototype.renderWebGL = function()
{ {
// not sure if both needed? but ya have for now! // not sure if both needed? but ya have for now!
// override! // override!
} };

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

@ -2,7 +2,6 @@
* @author Mat Groves http://matgroves.com/ * @author Mat Groves http://matgroves.com/
*/ */
PIXI.Rope = function(texture, points) PIXI.Rope = function(texture, points)
{ {
PIXI.Strip.call( this, texture ); PIXI.Strip.call( this, texture );
@ -10,22 +9,21 @@ PIXI.Rope = function(texture, points)
try try
{ {
this.verticies = new Float32Array( points.length * 4); this.verticies = new Float32Array(points.length * 4);
this.uvs = new Float32Array( points.length * 4); this.uvs = new Float32Array(points.length * 4);
this.colors = new Float32Array( points.length * 2); this.colors = new Float32Array(points.length * 2);
this.indices = new Uint16Array( points.length * 2); this.indices = new Uint16Array(points.length * 2);
} }
catch(error) catch(error)
{ {
this.verticies = verticies this.verticies = new Array(points.length * 4);
this.uvs = new Array(points.length * 4);
this.uvs = uvs this.colors = new Array(points.length * 2);
this.colors = colors this.indices = new Array(points.length * 2);
this.indices = indices
} }
this.refresh(); this.refresh();
} };
// constructor // constructor
@ -35,24 +33,21 @@ PIXI.Rope.prototype.constructor = PIXI.Rope;
PIXI.Rope.prototype.refresh = function() PIXI.Rope.prototype.refresh = function()
{ {
var points = this.points; var points = this.points;
if(points.length < 1)return; if(points.length < 1) return;
var uvs = this.uvs var uvs = this.uvs;
var indices = this.indices;
var colors = this.colors;
var lastPoint = points[0]; var lastPoint = points[0];
var nextPoint; var indices = this.indices;
var perp = {x:0, y:0}; var colors = this.colors;
var point = points[0];
this.count-=0.2; this.count-=0.2;
uvs[0] = 0 uvs[0] = 0;
uvs[1] = 1 uvs[1] = 1;
uvs[2] = 0 uvs[2] = 0;
uvs[3] = 1 uvs[3] = 1;
colors[0] = 1; colors[0] = 1;
colors[1] = 1; colors[1] = 1;
@ -60,32 +55,33 @@ PIXI.Rope.prototype.refresh = function()
indices[0] = 0; indices[0] = 0;
indices[1] = 1; 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]; point = points[i];
var index = i * 4; index = i * 4;
// time to do some smart drawing! // time to do some smart drawing!
var amount = i/(total-1) amount = i / (total-1);
if(i%2) if(i%2)
{ {
uvs[index] = amount; uvs[index] = amount;
uvs[index+1] = 0; uvs[index+1] = 0;
uvs[index+2] = amount uvs[index+2] = amount;
uvs[index+3] = 1 uvs[index+3] = 1;
} }
else else
{ {
uvs[index] = amount uvs[index] = amount;
uvs[index+1] = 0 uvs[index+1] = 0;
uvs[index+2] = amount uvs[index+2] = amount;
uvs[index+3] = 1 uvs[index+3] = 1;
} }
index = i * 2; index = i * 2;
@ -98,7 +94,7 @@ PIXI.Rope.prototype.refresh = function()
lastPoint = point; lastPoint = point;
} }
} };
PIXI.Rope.prototype.updateTransform = function() PIXI.Rope.prototype.updateTransform = function()
{ {
@ -106,28 +102,26 @@ PIXI.Rope.prototype.updateTransform = function()
var points = this.points; var points = this.points;
if(points.length < 1)return; if(points.length < 1)return;
var verticies = this.verticies
var lastPoint = points[0]; var lastPoint = points[0];
var nextPoint; var nextPoint;
var perp = {x:0, y:0}; var perp = {x:0, y:0};
var point = points[0];
this.count-=0.2; this.count-=0.2;
verticies[0] = point.x + perp.x var verticies = this.verticies;
verticies[1] = point.y + perp.y //+ 200 verticies[0] = lastPoint.x + perp.x;
verticies[2] = point.x - perp.x verticies[1] = lastPoint.y + perp.y; //+ 200
verticies[3] = point.y - perp.y//+200 verticies[2] = lastPoint.x - perp.x;
verticies[3] = lastPoint.y - perp.y;//+200
// time to do some smart drawing! // time to do some smart drawing!
var total = points.length; var total = points.length,
point, index, ratio, perpLength, num;
for (var i = 1; i < total; i++) for (var i = 1; i < total; i++)
{ {
point = points[i];
var point = points[i]; index = i * 4;
var index = i * 4;
if(i < points.length-1) if(i < points.length-1)
{ {
@ -135,41 +129,38 @@ PIXI.Rope.prototype.updateTransform = function()
} }
else else
{ {
nextPoint = point nextPoint = point;
} }
perp.y = -(nextPoint.x - lastPoint.x); perp.y = -(nextPoint.x - lastPoint.x);
perp.x = nextPoint.y - lastPoint.y; perp.x = nextPoint.y - lastPoint.y;
var ratio = (1 - (i / (total-1))) * 10; ratio = (1 - (i / (total-1))) * 10;
if(ratio > 1)ratio = 1;
var perpLength = Math.sqrt(perp.x * perp.x + perp.y * perp.y); if(ratio > 1) ratio = 1;
var num = this.texture.height/2//(20 + Math.abs(Math.sin((i + this.count) * 0.3) * 50) )* ratio;
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.x /= perpLength;
perp.y /= perpLength; perp.y /= perpLength;
perp.x *= num; perp.x *= num;
perp.y *= num; perp.y *= num;
verticies[index] = point.x + perp.x verticies[index] = point.x + perp.x;
verticies[index+1] = point.y + perp.y verticies[index+1] = point.y + perp.y;
verticies[index+2] = point.x - perp.x verticies[index+2] = point.x - perp.x;
verticies[index+3] = point.y - perp.y verticies[index+3] = point.y - perp.y;
lastPoint = point; lastPoint = point;
} }
PIXI.DisplayObjectContainer.prototype.updateTransform.call( this ); PIXI.DisplayObjectContainer.prototype.updateTransform.call( this );
} };
PIXI.Rope.prototype.setTexture = function(texture) PIXI.Rope.prototype.setTexture = function(texture)
{ {
// stop current texture // stop current texture
this.texture = texture; this.texture = texture;
this.updateFrame = true; this.updateFrame = true;
} };

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

@ -7,122 +7,6 @@
* *
*/ */
/**
* A class that enables the you to import and run your spine animations in pixi.
* Spine animation data needs to be loaded using the PIXI.AssetLoader or PIXI.SpineLoader before it can be used by this class
* See example 12 (http://www.goodboydigital.com/pixijs/examples/12/) to see a working example and check out the source
*
* @class Spine
* @extends DisplayObjectContainer
* @constructor
* @param url {String} The url of the spine anim file to be used
*/
PIXI.Spine = function (url) {
PIXI.DisplayObjectContainer.call(this);
this.spineData = PIXI.AnimCache[url];
if (!this.spineData) {
throw new Error("Spine data must be preloaded using PIXI.SpineLoader or PIXI.AssetLoader: " + url);
}
this.skeleton = new spine.Skeleton(this.spineData);
this.skeleton.updateWorldTransform();
this.stateData = new spine.AnimationStateData(this.spineData);
this.state = new spine.AnimationState(this.stateData);
this.slotContainers = [];
for (var i = 0, n = this.skeleton.drawOrder.length; i < n; i++) {
var slot = this.skeleton.drawOrder[i];
var attachment = slot.attachment;
var slotContainer = new PIXI.DisplayObjectContainer();
this.slotContainers.push(slotContainer);
this.addChild(slotContainer);
if (!(attachment instanceof spine.RegionAttachment)) {
continue;
}
var spriteName = attachment.rendererObject.name;
var sprite = this.createSprite(slot, attachment.rendererObject);
slot.currentSprite = sprite;
slot.currentSpriteName = spriteName;
slotContainer.addChild(sprite);
}
};
PIXI.Spine.prototype = Object.create(PIXI.DisplayObjectContainer.prototype);
PIXI.Spine.prototype.constructor = PIXI.Spine;
/*
* Updates the object transform for rendering
*
* @method updateTransform
* @private
*/
PIXI.Spine.prototype.updateTransform = function () {
this.lastTime = this.lastTime || Date.now();
var timeDelta = (Date.now() - this.lastTime) * 0.001;
this.lastTime = Date.now();
this.state.update(timeDelta);
this.state.apply(this.skeleton);
this.skeleton.updateWorldTransform();
var drawOrder = this.skeleton.drawOrder;
for (var i = 0, n = drawOrder.length; i < n; i++) {
var slot = drawOrder[i];
var attachment = slot.attachment;
var slotContainer = this.slotContainers[i];
if (!(attachment instanceof spine.RegionAttachment)) {
slotContainer.visible = false;
continue;
}
if (attachment.rendererObject) {
if (!slot.currentSpriteName || slot.currentSpriteName != attachment.name) {
var spriteName = attachment.rendererObject.name;
if (slot.currentSprite !== undefined) {
slot.currentSprite.visible = false;
}
slot.sprites = slot.sprites || {};
if (slot.sprites[spriteName] !== undefined) {
slot.sprites[spriteName].visible = true;
} else {
var sprite = this.createSprite(slot, attachment.rendererObject);
slotContainer.addChild(sprite);
}
slot.currentSprite = slot.sprites[spriteName];
slot.currentSpriteName = spriteName;
}
}
slotContainer.visible = true;
var bone = slot.bone;
slotContainer.position.x = bone.worldX + attachment.x * bone.m00 + attachment.y * bone.m01;
slotContainer.position.y = bone.worldY + attachment.x * bone.m10 + attachment.y * bone.m11;
slotContainer.scale.x = bone.worldScaleX;
slotContainer.scale.y = bone.worldScaleY;
slotContainer.rotation = -(slot.bone.worldRotation * Math.PI / 180);
}
PIXI.DisplayObjectContainer.prototype.updateTransform.call(this);
};
PIXI.Spine.prototype.createSprite = function (slot, descriptor) {
var name = PIXI.TextureCache[descriptor.name] ? descriptor.name : descriptor.name + ".png";
var sprite = new PIXI.Sprite(PIXI.Texture.fromFrame(name));
sprite.scale = descriptor.scale;
sprite.rotation = descriptor.rotation;
sprite.anchor.x = sprite.anchor.y = 0.5;
slot.sprites = slot.sprites || {};
slot.sprites[descriptor.name] = sprite;
return sprite;
};
/* /*
* Awesome JS run time provided by EsotericSoftware * Awesome JS run time provided by EsotericSoftware
* *
@ -262,7 +146,7 @@ spine.Skin.prototype = {
_attachAll: function (skeleton, oldSkin) { _attachAll: function (skeleton, oldSkin) {
for (var key in oldSkin.attachments) { for (var key in oldSkin.attachments) {
var colon = key.indexOf(":"); var colon = key.indexOf(":");
var slotIndex = parseInt(key.substring(0, colon)); var slotIndex = parseInt(key.substring(0, colon), 10);
var name = key.substring(colon + 1); var name = key.substring(colon + 1);
var slot = skeleton.slots[slotIndex]; var slot = skeleton.slots[slotIndex];
if (slot.attachment && slot.attachment.name == name) { if (slot.attachment && slot.attachment.name == name) {
@ -280,13 +164,13 @@ spine.Animation = function (name, timelines, duration) {
}; };
spine.Animation.prototype = { spine.Animation.prototype = {
apply: function (skeleton, time, loop) { apply: function (skeleton, time, loop) {
if (loop && this.duration != 0) time %= this.duration; if (loop && this.duration) time %= this.duration;
var timelines = this.timelines; var timelines = this.timelines;
for (var i = 0, n = timelines.length; i < n; i++) for (var i = 0, n = timelines.length; i < n; i++)
timelines[i].apply(skeleton, time, 1); timelines[i].apply(skeleton, time, 1);
}, },
mix: function (skeleton, time, loop, alpha) { mix: function (skeleton, time, loop, alpha) {
if (loop && this.duration != 0) time %= this.duration; if (loop && this.duration) time %= this.duration;
var timelines = this.timelines; var timelines = this.timelines;
for (var i = 0, n = timelines.length; i < n; i++) for (var i = 0, n = timelines.length; i < n; i++)
timelines[i].apply(skeleton, time, alpha); timelines[i].apply(skeleton, time, alpha);
@ -296,7 +180,7 @@ spine.Animation.prototype = {
spine.binarySearch = function (values, target, step) { spine.binarySearch = function (values, target, step) {
var low = 0; var low = 0;
var high = Math.floor(values.length / step) - 2; var high = Math.floor(values.length / step) - 2;
if (high == 0) return step; if (!high) return step;
var current = high >>> 1; var current = high >>> 1;
while (true) { while (true) {
if (values[(current + 1) * step] <= target) if (values[(current + 1) * step] <= target)
@ -368,7 +252,7 @@ spine.Curves.prototype = {
var lastY = y - dfy; var lastY = y - dfy;
return lastY + (y - lastY) * (percent - lastX) / (x - lastX); return lastY + (y - lastY) * (percent - lastX) / (x - lastX);
} }
if (i == 0) break; if (!i) break;
i--; i--;
dfx += ddfx; dfx += ddfx;
dfy += ddfy; dfy += ddfy;
@ -397,13 +281,15 @@ spine.RotateTimeline.prototype = {
this.frames[frameIndex + 1] = angle; this.frames[frameIndex + 1] = angle;
}, },
apply: function (skeleton, time, alpha) { apply: function (skeleton, time, alpha) {
var frames = this.frames; var frames = this.frames,
amount;
if (time < frames[0]) return; // Time is before first frame. if (time < frames[0]) return; // Time is before first frame.
var bone = skeleton.bones[this.boneIndex]; var bone = skeleton.bones[this.boneIndex];
if (time >= frames[frames.length - 2]) { // Time is after last frame. if (time >= frames[frames.length - 2]) { // Time is after last frame.
var amount = bone.data.rotation + frames[frames.length - 1] - bone.rotation; amount = bone.data.rotation + frames[frames.length - 1] - bone.rotation;
while (amount > 180) while (amount > 180)
amount -= 360; amount -= 360;
while (amount < -180) while (amount < -180)
@ -419,7 +305,7 @@ spine.RotateTimeline.prototype = {
var percent = 1 - (time - frameTime) / (frames[frameIndex - 2/*LAST_FRAME_TIME*/] - frameTime); var percent = 1 - (time - frameTime) / (frames[frameIndex - 2/*LAST_FRAME_TIME*/] - frameTime);
percent = this.curves.getCurvePercent(frameIndex / 2 - 1, percent); percent = this.curves.getCurvePercent(frameIndex / 2 - 1, percent);
var amount = frames[frameIndex + 1/*FRAME_VALUE*/] - lastFrameValue; amount = frames[frameIndex + 1/*FRAME_VALUE*/] - lastFrameValue;
while (amount > 180) while (amount > 180)
amount -= 360; amount -= 360;
while (amount < -180) while (amount < -180)
@ -672,7 +558,7 @@ spine.Skeleton = function (skeletonData) {
this.slots = []; this.slots = [];
this.drawOrder = []; this.drawOrder = [];
for (var i = 0, n = skeletonData.slots.length; i < n; i++) { for (i = 0, n = skeletonData.slots.length; i < n; i++) {
var slotData = skeletonData.slots[i]; var slotData = skeletonData.slots[i];
var bone = this.bones[skeletonData.bones.indexOf(slotData.boneData)]; var bone = this.bones[skeletonData.bones.indexOf(slotData.boneData)];
var slot = new spine.Slot(slotData, this, bone); var slot = new spine.Slot(slotData, this, bone);
@ -711,7 +597,7 @@ spine.Skeleton.prototype = {
}, },
/** @return May return null. */ /** @return May return null. */
getRootBone: function () { getRootBone: function () {
return this.bones.length == 0 ? null : this.bones[0]; return this.bones.length ? this.bones[0] : null;
}, },
/** @return May be null. */ /** @return May be null. */
findBone: function (boneName) { findBone: function (boneName) {
@ -983,7 +869,7 @@ spine.AnimationState.prototype = {
entry.loop = loop; entry.loop = loop;
if (!delay || delay <= 0) { if (!delay || delay <= 0) {
var previousAnimation = this.queue.length == 0 ? this.current : this.queue[this.queue.length - 1].animation; var previousAnimation = this.queue.length ? this.queue[this.queue.length - 1].animation : this.current;
if (previousAnimation != null) if (previousAnimation != null)
delay = previousAnimation.duration - this.data.getMix(previousAnimation, animation) + (delay || 0); delay = previousAnimation.duration - this.data.getMix(previousAnimation, animation) + (delay || 0);
else else
@ -1005,7 +891,9 @@ spine.SkeletonJson = function (attachmentLoader) {
spine.SkeletonJson.prototype = { spine.SkeletonJson.prototype = {
scale: 1, scale: 1,
readSkeletonData: function (root) { readSkeletonData: function (root) {
var skeletonData = new spine.SkeletonData(); /*jshint -W069*/
var skeletonData = new spine.SkeletonData(),
boneData;
// Bones. // Bones.
var bones = root["bones"]; var bones = root["bones"];
@ -1016,7 +904,7 @@ spine.SkeletonJson.prototype = {
parent = skeletonData.findBone(boneMap["parent"]); parent = skeletonData.findBone(boneMap["parent"]);
if (!parent) throw "Parent bone not found: " + boneMap["parent"]; if (!parent) throw "Parent bone not found: " + boneMap["parent"];
} }
var boneData = new spine.BoneData(boneMap["name"], parent); boneData = new spine.BoneData(boneMap["name"], parent);
boneData.length = (boneMap["length"] || 0) * this.scale; boneData.length = (boneMap["length"] || 0) * this.scale;
boneData.x = (boneMap["x"] || 0) * this.scale; boneData.x = (boneMap["x"] || 0) * this.scale;
boneData.y = (boneMap["y"] || 0) * this.scale; boneData.y = (boneMap["y"] || 0) * this.scale;
@ -1028,9 +916,9 @@ spine.SkeletonJson.prototype = {
// Slots. // Slots.
var slots = root["slots"]; var slots = root["slots"];
for (var i = 0, n = slots.length; i < n; i++) { for (i = 0, n = slots.length; i < n; i++) {
var slotMap = slots[i]; var slotMap = slots[i];
var boneData = skeletonData.findBone(slotMap["bone"]); boneData = skeletonData.findBone(slotMap["bone"]);
if (!boneData) throw "Slot bone not found: " + slotMap["bone"]; if (!boneData) throw "Slot bone not found: " + slotMap["bone"];
var slotData = new spine.SlotData(slotMap["name"], boneData); var slotData = new spine.SlotData(slotMap["name"], boneData);
@ -1077,6 +965,7 @@ spine.SkeletonJson.prototype = {
return skeletonData; return skeletonData;
}, },
readAttachment: function (skin, name, map) { readAttachment: function (skin, name, map) {
/*jshint -W069*/
name = map["name"] || name; name = map["name"] || name;
var type = spine.AttachmentType[map["type"] || "region"]; var type = spine.AttachmentType[map["type"] || "region"];
@ -1105,8 +994,11 @@ spine.SkeletonJson.prototype = {
}, },
readAnimation: function (name, map, skeletonData) { readAnimation: function (name, map, skeletonData) {
/*jshint -W069*/
var timelines = []; var timelines = [];
var duration = 0; var duration = 0;
var frameIndex, timeline, timelineName, valueMap, values,
i, n;
var bones = map["bones"]; var bones = map["bones"];
for (var boneName in bones) { for (var boneName in bones) {
@ -1115,16 +1007,16 @@ spine.SkeletonJson.prototype = {
if (boneIndex == -1) throw "Bone not found: " + boneName; if (boneIndex == -1) throw "Bone not found: " + boneName;
var boneMap = bones[boneName]; var boneMap = bones[boneName];
for (var timelineName in boneMap) { for (timelineName in boneMap) {
if (!boneMap.hasOwnProperty(timelineName)) continue; if (!boneMap.hasOwnProperty(timelineName)) continue;
var values = boneMap[timelineName]; values = boneMap[timelineName];
if (timelineName == "rotate") { if (timelineName == "rotate") {
var timeline = new spine.RotateTimeline(values.length); timeline = new spine.RotateTimeline(values.length);
timeline.boneIndex = boneIndex; timeline.boneIndex = boneIndex;
var frameIndex = 0; frameIndex = 0;
for (var i = 0, n = values.length; i < n; i++) { for (i = 0, n = values.length; i < n; i++) {
var valueMap = values[i]; valueMap = values[i];
timeline.setFrame(frameIndex, valueMap["time"], valueMap["angle"]); timeline.setFrame(frameIndex, valueMap["time"], valueMap["angle"]);
spine.SkeletonJson.readCurve(timeline, frameIndex, valueMap); spine.SkeletonJson.readCurve(timeline, frameIndex, valueMap);
frameIndex++; frameIndex++;
@ -1133,7 +1025,6 @@ spine.SkeletonJson.prototype = {
duration = Math.max(duration, timeline.frames[timeline.getFrameCount() * 2 - 2]); duration = Math.max(duration, timeline.frames[timeline.getFrameCount() * 2 - 2]);
} else if (timelineName == "translate" || timelineName == "scale") { } else if (timelineName == "translate" || timelineName == "scale") {
var timeline;
var timelineScale = 1; var timelineScale = 1;
if (timelineName == "scale") if (timelineName == "scale")
timeline = new spine.ScaleTimeline(values.length); timeline = new spine.ScaleTimeline(values.length);
@ -1143,9 +1034,9 @@ spine.SkeletonJson.prototype = {
} }
timeline.boneIndex = boneIndex; timeline.boneIndex = boneIndex;
var frameIndex = 0; frameIndex = 0;
for (var i = 0, n = values.length; i < n; i++) { for (i = 0, n = values.length; i < n; i++) {
var valueMap = values[i]; valueMap = values[i];
var x = (valueMap["x"] || 0) * timelineScale; var x = (valueMap["x"] || 0) * timelineScale;
var y = (valueMap["y"] || 0) * timelineScale; var y = (valueMap["y"] || 0) * timelineScale;
timeline.setFrame(frameIndex, valueMap["time"], x, y); timeline.setFrame(frameIndex, valueMap["time"], x, y);
@ -1165,16 +1056,16 @@ spine.SkeletonJson.prototype = {
var slotMap = slots[slotName]; var slotMap = slots[slotName];
var slotIndex = skeletonData.findSlotIndex(slotName); var slotIndex = skeletonData.findSlotIndex(slotName);
for (var timelineName in slotMap) { for (timelineName in slotMap) {
if (!slotMap.hasOwnProperty(timelineName)) continue; if (!slotMap.hasOwnProperty(timelineName)) continue;
var values = slotMap[timelineName]; values = slotMap[timelineName];
if (timelineName == "color") { if (timelineName == "color") {
var timeline = new spine.ColorTimeline(values.length); timeline = new spine.ColorTimeline(values.length);
timeline.slotIndex = slotIndex; timeline.slotIndex = slotIndex;
var frameIndex = 0; frameIndex = 0;
for (var i = 0, n = values.length; i < n; i++) { for (i = 0, n = values.length; i < n; i++) {
var valueMap = values[i]; valueMap = values[i];
var color = valueMap["color"]; var color = valueMap["color"];
var r = spine.SkeletonJson.toColor(color, 0); var r = spine.SkeletonJson.toColor(color, 0);
var g = spine.SkeletonJson.toColor(color, 1); var g = spine.SkeletonJson.toColor(color, 1);
@ -1188,12 +1079,12 @@ spine.SkeletonJson.prototype = {
duration = Math.max(duration, timeline.frames[timeline.getFrameCount() * 5 - 5]); duration = Math.max(duration, timeline.frames[timeline.getFrameCount() * 5 - 5]);
} else if (timelineName == "attachment") { } else if (timelineName == "attachment") {
var timeline = new spine.AttachmentTimeline(values.length); timeline = new spine.AttachmentTimeline(values.length);
timeline.slotIndex = slotIndex; timeline.slotIndex = slotIndex;
var frameIndex = 0; frameIndex = 0;
for (var i = 0, n = values.length; i < n; i++) { for (i = 0, n = values.length; i < n; i++) {
var valueMap = values[i]; valueMap = values[i];
timeline.setFrame(frameIndex++, valueMap["time"], valueMap["name"]); timeline.setFrame(frameIndex++, valueMap["time"], valueMap["name"]);
} }
timelines.push(timeline); timelines.push(timeline);
@ -1207,6 +1098,7 @@ spine.SkeletonJson.prototype = {
} }
}; };
spine.SkeletonJson.readCurve = function (timeline, frameIndex, valueMap) { spine.SkeletonJson.readCurve = function (timeline, frameIndex, valueMap) {
/*jshint -W069*/
var curve = valueMap["curve"]; var curve = valueMap["curve"];
if (!curve) return; if (!curve) return;
if (curve == "stepped") if (curve == "stepped")
@ -1232,7 +1124,7 @@ spine.Atlas = function (atlasText, textureLoader) {
var line = reader.readLine(); var line = reader.readLine();
if (line == null) break; if (line == null) break;
line = reader.trim(line); line = reader.trim(line);
if (line.length == 0) if (!line.length)
page = null; page = null;
else if (!page) { else if (!page) {
page = new spine.AtlasPage(); page = new spine.AtlasPage();
@ -1266,12 +1158,12 @@ spine.Atlas = function (atlasText, textureLoader) {
region.rotate = reader.readValue() == "true"; region.rotate = reader.readValue() == "true";
reader.readTuple(tuple); reader.readTuple(tuple);
var x = parseInt(tuple[0]); var x = parseInt(tuple[0], 10);
var y = parseInt(tuple[1]); var y = parseInt(tuple[1], 10);
reader.readTuple(tuple); reader.readTuple(tuple);
var width = parseInt(tuple[0]); var width = parseInt(tuple[0], 10);
var height = parseInt(tuple[1]); var height = parseInt(tuple[1], 10);
region.u = x / page.width; region.u = x / page.width;
region.v = y / page.height; region.v = y / page.height;
@ -1288,23 +1180,23 @@ spine.Atlas = function (atlasText, textureLoader) {
region.height = Math.abs(height); region.height = Math.abs(height);
if (reader.readTuple(tuple) == 4) { // split is optional if (reader.readTuple(tuple) == 4) { // split is optional
region.splits = [parseInt(tuple[0]), parseInt(tuple[1]), parseInt(tuple[2]), parseInt(tuple[3])]; region.splits = [parseInt(tuple[0], 10), parseInt(tuple[1], 10), parseInt(tuple[2], 10), parseInt(tuple[3], 10)];
if (reader.readTuple(tuple) == 4) { // pad is optional, but only present with splits if (reader.readTuple(tuple) == 4) { // pad is optional, but only present with splits
region.pads = [parseInt(tuple[0]), parseInt(tuple[1]), parseInt(tuple[2]), parseInt(tuple[3])]; region.pads = [parseInt(tuple[0], 10), parseInt(tuple[1], 10), parseInt(tuple[2], 10), parseInt(tuple[3], 10)];
reader.readTuple(tuple); reader.readTuple(tuple);
} }
} }
region.originalWidth = parseInt(tuple[0]); region.originalWidth = parseInt(tuple[0], 10);
region.originalHeight = parseInt(tuple[1]); region.originalHeight = parseInt(tuple[1], 10);
reader.readTuple(tuple); reader.readTuple(tuple);
region.offsetX = parseInt(tuple[0]); region.offsetX = parseInt(tuple[0], 10);
region.offsetY = parseInt(tuple[1]); region.offsetY = parseInt(tuple[1], 10);
region.index = parseInt(reader.readValue()); region.index = parseInt(reader.readValue(), 10);
this.regions.push(region); this.regions.push(region);
} }
@ -1421,7 +1313,7 @@ spine.AtlasReader.prototype = {
for (; i < 3; i++) { for (; i < 3; i++) {
var comma = line.indexOf(",", lastMatch); var comma = line.indexOf(",", lastMatch);
if (comma == -1) { if (comma == -1) {
if (i == 0) throw "Invalid line: " + line; if (!i) throw "Invalid line: " + line;
break; break;
} }
tuple[i] = this.trim(line.substr(lastMatch, comma - lastMatch)); tuple[i] = this.trim(line.substr(lastMatch, comma - lastMatch));
@ -1456,5 +1348,121 @@ spine.AtlasAttachmentLoader.prototype = {
} }
} }
PIXI.AnimCache = {};
spine.Bone.yDown = true; spine.Bone.yDown = true;
PIXI.AnimCache = {};
/**
* A class that enables the you to import and run your spine animations in pixi.
* Spine animation data needs to be loaded using the PIXI.AssetLoader or PIXI.SpineLoader before it can be used by this class
* See example 12 (http://www.goodboydigital.com/pixijs/examples/12/) to see a working example and check out the source
*
* @class Spine
* @extends DisplayObjectContainer
* @constructor
* @param url {String} The url of the spine anim file to be used
*/
PIXI.Spine = function (url) {
PIXI.DisplayObjectContainer.call(this);
this.spineData = PIXI.AnimCache[url];
if (!this.spineData) {
throw new Error("Spine data must be preloaded using PIXI.SpineLoader or PIXI.AssetLoader: " + url);
}
this.skeleton = new spine.Skeleton(this.spineData);
this.skeleton.updateWorldTransform();
this.stateData = new spine.AnimationStateData(this.spineData);
this.state = new spine.AnimationState(this.stateData);
this.slotContainers = [];
for (var i = 0, n = this.skeleton.drawOrder.length; i < n; i++) {
var slot = this.skeleton.drawOrder[i];
var attachment = slot.attachment;
var slotContainer = new PIXI.DisplayObjectContainer();
this.slotContainers.push(slotContainer);
this.addChild(slotContainer);
if (!(attachment instanceof spine.RegionAttachment)) {
continue;
}
var spriteName = attachment.rendererObject.name;
var sprite = this.createSprite(slot, attachment.rendererObject);
slot.currentSprite = sprite;
slot.currentSpriteName = spriteName;
slotContainer.addChild(sprite);
}
};
PIXI.Spine.prototype = Object.create(PIXI.DisplayObjectContainer.prototype);
PIXI.Spine.prototype.constructor = PIXI.Spine;
/*
* Updates the object transform for rendering
*
* @method updateTransform
* @private
*/
PIXI.Spine.prototype.updateTransform = function () {
this.lastTime = this.lastTime || Date.now();
var timeDelta = (Date.now() - this.lastTime) * 0.001;
this.lastTime = Date.now();
this.state.update(timeDelta);
this.state.apply(this.skeleton);
this.skeleton.updateWorldTransform();
var drawOrder = this.skeleton.drawOrder;
for (var i = 0, n = drawOrder.length; i < n; i++) {
var slot = drawOrder[i];
var attachment = slot.attachment;
var slotContainer = this.slotContainers[i];
if (!(attachment instanceof spine.RegionAttachment)) {
slotContainer.visible = false;
continue;
}
if (attachment.rendererObject) {
if (!slot.currentSpriteName || slot.currentSpriteName != attachment.name) {
var spriteName = attachment.rendererObject.name;
if (slot.currentSprite !== undefined) {
slot.currentSprite.visible = false;
}
slot.sprites = slot.sprites || {};
if (slot.sprites[spriteName] !== undefined) {
slot.sprites[spriteName].visible = true;
} else {
var sprite = this.createSprite(slot, attachment.rendererObject);
slotContainer.addChild(sprite);
}
slot.currentSprite = slot.sprites[spriteName];
slot.currentSpriteName = spriteName;
}
}
slotContainer.visible = true;
var bone = slot.bone;
slotContainer.position.x = bone.worldX + attachment.x * bone.m00 + attachment.y * bone.m01;
slotContainer.position.y = bone.worldY + attachment.x * bone.m10 + attachment.y * bone.m11;
slotContainer.scale.x = bone.worldScaleX;
slotContainer.scale.y = bone.worldScaleY;
slotContainer.rotation = -(slot.bone.worldRotation * Math.PI / 180);
}
PIXI.DisplayObjectContainer.prototype.updateTransform.call(this);
};
PIXI.Spine.prototype.createSprite = function (slot, descriptor) {
var name = PIXI.TextureCache[descriptor.name] ? descriptor.name : descriptor.name + ".png";
var sprite = new PIXI.Sprite(PIXI.Texture.fromFrame(name));
sprite.scale = descriptor.scale;
sprite.rotation = descriptor.rotation;
sprite.anchor.x = sprite.anchor.y = 0.5;
slot.sprites = slot.sprites || {};
slot.sprites[descriptor.name] = sprite;
return sprite;
};

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

@ -45,7 +45,7 @@ PIXI.Strip = function(texture, width, height)
this.verticies = new Float32Array() this.verticies = new Float32Array()
this.colors = new Float32Array() this.colors = new Float32Array()
this.indices = new Uint16Array() this.indices = new Uint16Array()
*/ */
this.width = width; this.width = width;
this.height = height; this.height = height;
@ -63,7 +63,7 @@ PIXI.Strip = function(texture, width, height)
} }
this.renderable = true; this.renderable = true;
} };
// constructor // constructor
PIXI.Strip.prototype = Object.create( PIXI.DisplayObjectContainer.prototype ); PIXI.Strip.prototype = Object.create( PIXI.DisplayObjectContainer.prototype );
@ -79,11 +79,10 @@ PIXI.Strip.prototype.setTexture = function(texture)
this.width = texture.frame.width; this.width = texture.frame.width;
this.height = texture.frame.height; this.height = texture.frame.height;
this.updateFrame = true; this.updateFrame = true;
} };
PIXI.Strip.prototype.onTextureUpdate = function(event) PIXI.Strip.prototype.onTextureUpdate = function()
{ {
this.updateFrame = true; this.updateFrame = true;
} };
// some helper functions.. // some helper functions..

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

@ -58,8 +58,8 @@ PIXI.TilingSprite = function(texture, width, height)
this.renderable = true; this.renderable = true;
this.blendMode = PIXI.blendModes.NORMAL this.blendMode = PIXI.blendModes.NORMAL;
} };
// constructor // constructor
PIXI.TilingSprite.prototype = Object.create( PIXI.DisplayObjectContainer.prototype ); PIXI.TilingSprite.prototype = Object.create( PIXI.DisplayObjectContainer.prototype );
@ -79,7 +79,7 @@ PIXI.TilingSprite.prototype.setTexture = function(texture)
// stop current texture // stop current texture
this.texture = texture; this.texture = texture;
this.updateFrame = true; this.updateFrame = true;
} };
/** /**
* When the texture is updated, this event will fire to update the frame * When the texture is updated, this event will fire to update the frame
@ -88,8 +88,7 @@ PIXI.TilingSprite.prototype.setTexture = function(texture)
* @param event * @param event
* @private * @private
*/ */
PIXI.TilingSprite.prototype.onTextureUpdate = function(event) PIXI.TilingSprite.prototype.onTextureUpdate = function()
{ {
this.updateFrame = true; this.updateFrame = true;
} };

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

@ -2,7 +2,6 @@
* @author Mat Groves http://matgroves.com/ @Doormat23 * @author Mat Groves http://matgroves.com/ @Doormat23
*/ */
/** /**
* This is the base class for creating a pixi.js filter. Currently only webGL supports filters. * This is the base class for creating a pixi.js filter. Currently only webGL supports filters.
* If you want to make a custom filter this should be your base class. * If you want to make a custom filter this should be your base class.
@ -33,5 +32,4 @@ PIXI.AbstractFilter = function(fragmentSrc, uniforms)
this.uniforms = uniforms || {}; this.uniforms = uniforms || {};
this.fragmentSrc = fragmentSrc || []; this.fragmentSrc = fragmentSrc || [];
} };

5
src/pixi/filters/BlurFilter.js
View file

@ -2,7 +2,6 @@
* @author Mat Groves http://matgroves.com/ @Doormat23 * @author Mat Groves http://matgroves.com/ @Doormat23
*/ */
/** /**
* *
* The BlurFilter applies a Gaussian blur to an object. * The BlurFilter applies a Gaussian blur to an object.
@ -13,13 +12,11 @@
*/ */
PIXI.BlurFilter = function() PIXI.BlurFilter = function()
{ {
this.blurXFilter = new PIXI.BlurXFilter(); this.blurXFilter = new PIXI.BlurXFilter();
this.blurYFilter = new PIXI.BlurYFilter(); this.blurYFilter = new PIXI.BlurYFilter();
this.passes =[this.blurXFilter, this.blurYFilter]; this.passes =[this.blurXFilter, this.blurYFilter];
};
}
/** /**
* Sets the strength of both the blurX and blurY properties simultaneously * Sets the strength of both the blurX and blurY properties simultaneously

41
src/pixi/filters/BlurXFilter.js
View file

@ -2,8 +2,6 @@
* @author Mat Groves http://matgroves.com/ @Doormat23 * @author Mat Groves http://matgroves.com/ @Doormat23
*/ */
PIXI.BlurXFilter = function() PIXI.BlurXFilter = function()
{ {
PIXI.AbstractFilter.call( this ); PIXI.AbstractFilter.call( this );
@ -16,34 +14,33 @@ PIXI.BlurXFilter = function()
}; };
this.fragmentSrc = [ this.fragmentSrc = [
"precision mediump float;", 'precision mediump float;',
"varying vec2 vTextureCoord;", 'varying vec2 vTextureCoord;',
"varying float vColor;", 'varying float vColor;',
"uniform float blur;", 'uniform float blur;',
"uniform sampler2D uSampler;", 'uniform sampler2D uSampler;',
"void main(void) {",
"vec4 sum = vec4(0.0);",
"sum += texture2D(uSampler, vec2(vTextureCoord.x - 4.0*blur, vTextureCoord.y)) * 0.05;", 'void main(void) {',
"sum += texture2D(uSampler, vec2(vTextureCoord.x - 3.0*blur, vTextureCoord.y)) * 0.09;", ' vec4 sum = vec4(0.0);',
"sum += texture2D(uSampler, vec2(vTextureCoord.x - 2.0*blur, vTextureCoord.y)) * 0.12;",
"sum += texture2D(uSampler, vec2(vTextureCoord.x - blur, vTextureCoord.y)) * 0.15;",
"sum += texture2D(uSampler, vec2(vTextureCoord.x, vTextureCoord.y)) * 0.16;",
"sum += texture2D(uSampler, vec2(vTextureCoord.x + blur, vTextureCoord.y)) * 0.15;",
"sum += texture2D(uSampler, vec2(vTextureCoord.x + 2.0*blur, vTextureCoord.y)) * 0.12;",
"sum += texture2D(uSampler, vec2(vTextureCoord.x + 3.0*blur, vTextureCoord.y)) * 0.09;",
"sum += texture2D(uSampler, vec2(vTextureCoord.x + 4.0*blur, vTextureCoord.y)) * 0.05;",
"gl_FragColor = sum;", ' sum += texture2D(uSampler, vec2(vTextureCoord.x - 4.0*blur, vTextureCoord.y)) * 0.05;',
' sum += texture2D(uSampler, vec2(vTextureCoord.x - 3.0*blur, vTextureCoord.y)) * 0.09;',
' sum += texture2D(uSampler, vec2(vTextureCoord.x - 2.0*blur, vTextureCoord.y)) * 0.12;',
' sum += texture2D(uSampler, vec2(vTextureCoord.x - blur, vTextureCoord.y)) * 0.15;',
' sum += texture2D(uSampler, vec2(vTextureCoord.x, vTextureCoord.y)) * 0.16;',
' sum += texture2D(uSampler, vec2(vTextureCoord.x + blur, vTextureCoord.y)) * 0.15;',
' sum += texture2D(uSampler, vec2(vTextureCoord.x + 2.0*blur, vTextureCoord.y)) * 0.12;',
' sum += texture2D(uSampler, vec2(vTextureCoord.x + 3.0*blur, vTextureCoord.y)) * 0.09;',
' sum += texture2D(uSampler, vec2(vTextureCoord.x + 4.0*blur, vTextureCoord.y)) * 0.05;',
"}" ' gl_FragColor = sum;',
'}'
]; ];
} };
PIXI.BlurXFilter.prototype = Object.create( PIXI.AbstractFilter.prototype ); PIXI.BlurXFilter.prototype = Object.create( PIXI.AbstractFilter.prototype );
PIXI.BlurXFilter.prototype.constructor = PIXI.BlurXFilter; PIXI.BlurXFilter.prototype.constructor = PIXI.BlurXFilter;
Object.defineProperty(PIXI.BlurXFilter.prototype, 'blur', { Object.defineProperty(PIXI.BlurXFilter.prototype, 'blur', {
get: function() { get: function() {
return this.uniforms.blur.value / (1/7000); return this.uniforms.blur.value / (1/7000);

40
src/pixi/filters/BlurYFilter.js
View file

@ -2,8 +2,6 @@
* @author Mat Groves http://matgroves.com/ @Doormat23 * @author Mat Groves http://matgroves.com/ @Doormat23
*/ */
PIXI.BlurYFilter = function() PIXI.BlurYFilter = function()
{ {
PIXI.AbstractFilter.call( this ); PIXI.AbstractFilter.call( this );
@ -16,29 +14,29 @@ PIXI.BlurYFilter = function()
}; };
this.fragmentSrc = [ this.fragmentSrc = [
"precision mediump float;", 'precision mediump float;',
"varying vec2 vTextureCoord;", 'varying vec2 vTextureCoord;',
"varying float vColor;", 'varying float vColor;',
"uniform float blur;", 'uniform float blur;',
"uniform sampler2D uSampler;", 'uniform sampler2D uSampler;',
"void main(void) {",
"vec4 sum = vec4(0.0);",
"sum += texture2D(uSampler, vec2(vTextureCoord.x, vTextureCoord.y - 4.0*blur)) * 0.05;", 'void main(void) {',
"sum += texture2D(uSampler, vec2(vTextureCoord.x, vTextureCoord.y - 3.0*blur)) * 0.09;", ' vec4 sum = vec4(0.0);',
"sum += texture2D(uSampler, vec2(vTextureCoord.x, vTextureCoord.y - 2.0*blur)) * 0.12;",
"sum += texture2D(uSampler, vec2(vTextureCoord.x, vTextureCoord.y - blur)) * 0.15;",
"sum += texture2D(uSampler, vec2(vTextureCoord.x, vTextureCoord.y)) * 0.16;",
"sum += texture2D(uSampler, vec2(vTextureCoord.x, vTextureCoord.y + blur)) * 0.15;",
"sum += texture2D(uSampler, vec2(vTextureCoord.x, vTextureCoord.y + 2.0*blur)) * 0.12;",
"sum += texture2D(uSampler, vec2(vTextureCoord.x, vTextureCoord.y + 3.0*blur)) * 0.09;",
"sum += texture2D(uSampler, vec2(vTextureCoord.x, vTextureCoord.y + 4.0*blur)) * 0.05;",
"gl_FragColor = sum;", ' sum += texture2D(uSampler, vec2(vTextureCoord.x, vTextureCoord.y - 4.0*blur)) * 0.05;',
' sum += texture2D(uSampler, vec2(vTextureCoord.x, vTextureCoord.y - 3.0*blur)) * 0.09;',
' sum += texture2D(uSampler, vec2(vTextureCoord.x, vTextureCoord.y - 2.0*blur)) * 0.12;',
' sum += texture2D(uSampler, vec2(vTextureCoord.x, vTextureCoord.y - blur)) * 0.15;',
' sum += texture2D(uSampler, vec2(vTextureCoord.x, vTextureCoord.y)) * 0.16;',
' sum += texture2D(uSampler, vec2(vTextureCoord.x, vTextureCoord.y + blur)) * 0.15;',
' sum += texture2D(uSampler, vec2(vTextureCoord.x, vTextureCoord.y + 2.0*blur)) * 0.12;',
' sum += texture2D(uSampler, vec2(vTextureCoord.x, vTextureCoord.y + 3.0*blur)) * 0.09;',
' sum += texture2D(uSampler, vec2(vTextureCoord.x, vTextureCoord.y + 4.0*blur)) * 0.05;',
"}" ' gl_FragColor = sum;',
'}'
]; ];
} };
PIXI.BlurYFilter.prototype = Object.create( PIXI.AbstractFilter.prototype ); PIXI.BlurYFilter.prototype = Object.create( PIXI.AbstractFilter.prototype );
PIXI.BlurYFilter.prototype.constructor = PIXI.BlurYFilter; PIXI.BlurYFilter.prototype.constructor = PIXI.BlurYFilter;

24
src/pixi/filters/ColorMatrixFilter.js
View file

@ -25,19 +25,19 @@ PIXI.ColorMatrixFilter = function()
}; };
this.fragmentSrc = [ this.fragmentSrc = [
"precision mediump float;", 'precision mediump float;',
"varying vec2 vTextureCoord;", 'varying vec2 vTextureCoord;',
"varying float vColor;", 'varying float vColor;',
"uniform float invert;", 'uniform float invert;',
"uniform mat4 matrix;", 'uniform mat4 matrix;',
"uniform sampler2D uSampler;", 'uniform sampler2D uSampler;',
"void main(void) {",
"gl_FragColor = texture2D(uSampler, vTextureCoord) * matrix;",
"gl_FragColor = gl_FragColor * vColor;",
"}"
];
} 'void main(void) {',
' gl_FragColor = texture2D(uSampler, vTextureCoord) * matrix;',
' gl_FragColor = gl_FragColor * vColor;',
'}'
];
};
PIXI.ColorMatrixFilter.prototype = Object.create( PIXI.AbstractFilter.prototype ); PIXI.ColorMatrixFilter.prototype = Object.create( PIXI.AbstractFilter.prototype );
PIXI.ColorMatrixFilter.prototype.constructor = PIXI.ColorMatrixFilter; PIXI.ColorMatrixFilter.prototype.constructor = PIXI.ColorMatrixFilter;

24
src/pixi/filters/ColorStepFilter.js
View file

@ -2,7 +2,6 @@
* @author Mat Groves http://matgroves.com/ @Doormat23 * @author Mat Groves http://matgroves.com/ @Doormat23
*/ */
/** /**
* *
* This turns your displayObjects to black and white. * This turns your displayObjects to black and white.
@ -21,18 +20,19 @@ PIXI.ColorStepFilter = function()
}; };
this.fragmentSrc = [ this.fragmentSrc = [
"precision mediump float;", 'precision mediump float;',
"varying vec2 vTextureCoord;", 'varying vec2 vTextureCoord;',
"varying float vColor;", 'varying float vColor;',
"uniform sampler2D uSampler;", 'uniform sampler2D uSampler;',
"uniform float step;", 'uniform float step;',
"void main(void) {",
"vec4 color = texture2D(uSampler, vTextureCoord);", 'void main(void) {',
"color = floor(color * step) / step;", ' vec4 color = texture2D(uSampler, vTextureCoord);',
"gl_FragColor = color * vColor;", ' color = floor(color * step) / step;',
"}" ' gl_FragColor = color * vColor;',
'}'
]; ];
} };
PIXI.ColorStepFilter.prototype = Object.create( PIXI.AbstractFilter.prototype ); PIXI.ColorStepFilter.prototype = Object.create( PIXI.AbstractFilter.prototype );
PIXI.ColorStepFilter.prototype.constructor = PIXI.ColorStepFilter; PIXI.ColorStepFilter.prototype.constructor = PIXI.ColorStepFilter;

73
src/pixi/filters/CrossHatchFilter.js
View file

@ -2,8 +2,6 @@
* @author Mat Groves http://matgroves.com/ @Doormat23 * @author Mat Groves http://matgroves.com/ @Doormat23
*/ */
PIXI.CrossHatchFilter = function() PIXI.CrossHatchFilter = function()
{ {
PIXI.AbstractFilter.call( this ); PIXI.AbstractFilter.call( this );
@ -12,48 +10,47 @@ PIXI.CrossHatchFilter = function()
// set the uniforms // set the uniforms
this.uniforms = { this.uniforms = {
blur: {type: '1f', value: 1/512}, blur: {type: '1f', value: 1 / 512},
}; };
this.fragmentSrc = [ this.fragmentSrc = [
"precision mediump float;", 'precision mediump float;',
"varying vec2 vTextureCoord;", 'varying vec2 vTextureCoord;',
"varying float vColor;", 'varying float vColor;',
"uniform float blur;", 'uniform float blur;',
"uniform sampler2D uSampler;", 'uniform sampler2D uSampler;',
"void main(void) {",
'void main(void) {',
' float lum = length(texture2D(uSampler, vTextureCoord.xy).rgb);',
" float lum = length(texture2D(uSampler, vTextureCoord.xy).rgb);", ' gl_FragColor = vec4(1.0, 1.0, 1.0, 1.0);',
" ",
" gl_FragColor = vec4(1.0, 1.0, 1.0, 1.0);", ' if (lum < 1.00) {',
" ", ' if (mod(gl_FragCoord.x + gl_FragCoord.y, 10.0) == 0.0) {',
" if (lum < 1.00) {", ' gl_FragColor = vec4(0.0, 0.0, 0.0, 1.0);',
" if (mod(gl_FragCoord.x + gl_FragCoord.y, 10.0) == 0.0) {", ' }',
" gl_FragColor = vec4(0.0, 0.0, 0.0, 1.0);", ' }',
" }",
" }", ' if (lum < 0.75) {',
" ", ' if (mod(gl_FragCoord.x - gl_FragCoord.y, 10.0) == 0.0) {',
" if (lum < 0.75) {", ' gl_FragColor = vec4(0.0, 0.0, 0.0, 1.0);',
" if (mod(gl_FragCoord.x - gl_FragCoord.y, 10.0) == 0.0) {", ' }',
" gl_FragColor = vec4(0.0, 0.0, 0.0, 1.0);", ' }',
" }",
" }", ' if (lum < 0.50) {',
" ", ' if (mod(gl_FragCoord.x + gl_FragCoord.y - 5.0, 10.0) == 0.0) {',
" if (lum < 0.50) {", ' gl_FragColor = vec4(0.0, 0.0, 0.0, 1.0);',
" if (mod(gl_FragCoord.x + gl_FragCoord.y - 5.0, 10.0) == 0.0) {", ' }',
" gl_FragColor = vec4(0.0, 0.0, 0.0, 1.0);", ' }',
" }",
" }", ' if (lum < 0.3) {',
" ", ' if (mod(gl_FragCoord.x - gl_FragCoord.y - 5.0, 10.0) == 0.0) {',
" if (lum < 0.3) {", ' gl_FragColor = vec4(0.0, 0.0, 0.0, 1.0);',
" if (mod(gl_FragCoord.x - gl_FragCoord.y - 5.0, 10.0) == 0.0) {", ' }',
" gl_FragColor = vec4(0.0, 0.0, 0.0, 1.0);", ' }',
" }", '}'
" }",
"}"
]; ];
} };
PIXI.CrossHatchFilter.prototype = Object.create( PIXI.AbstractFilter.prototype ); PIXI.CrossHatchFilter.prototype = Object.create( PIXI.AbstractFilter.prototype );
PIXI.CrossHatchFilter.prototype.constructor = PIXI.BlurYFilter; PIXI.CrossHatchFilter.prototype.constructor = PIXI.BlurYFilter;

66
src/pixi/filters/DisplacementFilter.js
View file

@ -2,7 +2,6 @@
* @author Mat Groves http://matgroves.com/ @Doormat23 * @author Mat Groves http://matgroves.com/ @Doormat23
*/ */
/** /**
* *
* The DisplacementFilter class uses the pixel values from the specified texture (called the displacement map) to perform a displacement of an object. * The DisplacementFilter class uses the pixel values from the specified texture (called the displacement map) to perform a displacement of an object.
@ -29,7 +28,6 @@ PIXI.DisplacementFilter = function(texture)
dimensions: {type: '4fv', value:[0,0,0,0]} dimensions: {type: '4fv', value:[0,0,0,0]}
}; };
if(texture.baseTexture.hasLoaded) if(texture.baseTexture.hasLoaded)
{ {
this.uniforms.mapDimensions.value.x = texture.width; this.uniforms.mapDimensions.value.x = texture.width;
@ -39,55 +37,51 @@ PIXI.DisplacementFilter = function(texture)
{ {
this.boundLoadedFunction = this.onTextureLoaded.bind(this); this.boundLoadedFunction = this.onTextureLoaded.bind(this);
texture.baseTexture.on("loaded", this.boundLoadedFunction); texture.baseTexture.on('loaded', this.boundLoadedFunction);
} }
this.fragmentSrc = [ this.fragmentSrc = [
"precision mediump float;", 'precision mediump float;',
"varying vec2 vTextureCoord;", 'varying vec2 vTextureCoord;',
"varying float vColor;", 'varying float vColor;',
"uniform sampler2D displacementMap;", 'uniform sampler2D displacementMap;',
"uniform sampler2D uSampler;", 'uniform sampler2D uSampler;',
"uniform vec2 scale;", 'uniform vec2 scale;',
"uniform vec2 offset;", 'uniform vec2 offset;',
"uniform vec4 dimensions;", 'uniform vec4 dimensions;',
"uniform vec2 mapDimensions;",// = vec2(256.0, 256.0);", 'uniform vec2 mapDimensions;',// = vec2(256.0, 256.0);',
// "const vec2 textureDimensions = vec2(750.0, 750.0);", // 'const vec2 textureDimensions = vec2(750.0, 750.0);',
"void main(void) {", 'void main(void) {',
"vec2 mapCords = vTextureCoord.xy;", ' vec2 mapCords = vTextureCoord.xy;',
// "mapCords -= ;", //' mapCords -= ;',
"mapCords += (dimensions.zw + offset)/ dimensions.xy ;", ' mapCords += (dimensions.zw + offset)/ dimensions.xy ;',
"mapCords.y *= -1.0;", ' mapCords.y *= -1.0;',
"mapCords.y += 1.0;", ' mapCords.y += 1.0;',
"vec2 matSample = texture2D(displacementMap, mapCords).xy;", ' vec2 matSample = texture2D(displacementMap, mapCords).xy;',
"matSample -= 0.5;", ' matSample -= 0.5;',
"matSample *= scale;", ' matSample *= scale;',
"matSample /= mapDimensions;", ' matSample /= mapDimensions;',
"gl_FragColor = texture2D(uSampler, vec2(vTextureCoord.x + matSample.x, vTextureCoord.y + matSample.y));", ' gl_FragColor = texture2D(uSampler, vec2(vTextureCoord.x + matSample.x, vTextureCoord.y + matSample.y));',
"gl_FragColor.rgb = mix( gl_FragColor.rgb, gl_FragColor.rgb, 1.0);", ' gl_FragColor.rgb = mix( gl_FragColor.rgb, gl_FragColor.rgb, 1.0);',
"vec2 cord = vTextureCoord;", ' vec2 cord = vTextureCoord;',
//"gl_FragColor = texture2D(displacementMap, cord);", //' gl_FragColor = texture2D(displacementMap, cord);',
"gl_FragColor = gl_FragColor * vColor;", ' gl_FragColor = gl_FragColor * vColor;',
'}'
"}"
]; ];
};
}
PIXI.DisplacementFilter.prototype = Object.create( PIXI.AbstractFilter.prototype ); PIXI.DisplacementFilter.prototype = Object.create( PIXI.AbstractFilter.prototype );
PIXI.DisplacementFilter.prototype.constructor = PIXI.DisplacementFilter; PIXI.DisplacementFilter.prototype.constructor = PIXI.DisplacementFilter;
PIXI.DisplacementFilter.prototype.onTextureLoaded = function() PIXI.DisplacementFilter.prototype.onTextureLoaded = function()
{ {
this.uniforms.mapDimensions.value.x = this.uniforms.displacementMap.value.width; this.uniforms.mapDimensions.value.x = this.uniforms.displacementMap.value.width;
this.uniforms.mapDimensions.value.y = this.uniforms.displacementMap.value.height; this.uniforms.mapDimensions.value.y = this.uniforms.displacementMap.value.height;
this.uniforms.displacementMap.value.baseTexture.off("loaded", this.boundLoadedFunction) this.uniforms.displacementMap.value.baseTexture.off('loaded', this.boundLoadedFunction);
};
}
/** /**
* The texture used for the displacemtent map * must be power of 2 texture at the moment * The texture used for the displacemtent map * must be power of 2 texture at the moment

46
src/pixi/filters/DotScreenFilter.js
View file

@ -5,7 +5,7 @@
/** /**
* *
* This filter applies a pixlate effect making display objects appear "blocky" * This filter applies a pixlate effect making display objects appear 'blocky'
* @class PixelateFilter * @class PixelateFilter
* @contructor * @contructor
*/ */
@ -23,32 +23,32 @@ PIXI.DotScreenFilter = function()
}; };
this.fragmentSrc = [ this.fragmentSrc = [
"precision mediump float;", 'precision mediump float;',
"varying vec2 vTextureCoord;", 'varying vec2 vTextureCoord;',
"varying float vColor;", 'varying float vColor;',
"uniform vec4 dimensions;", 'uniform vec4 dimensions;',
"uniform sampler2D uSampler;", 'uniform sampler2D uSampler;',
"uniform float angle;", 'uniform float angle;',
"uniform float scale;", 'uniform float scale;',
"float pattern() {", 'float pattern() {',
"float s = sin(angle), c = cos(angle);", ' float s = sin(angle), c = cos(angle);',
"vec2 tex = vTextureCoord * dimensions.xy;", ' vec2 tex = vTextureCoord * dimensions.xy;',
"vec2 point = vec2(", ' vec2 point = vec2(',
"c * tex.x - s * tex.y,", ' c * tex.x - s * tex.y,',
"s * tex.x + c * tex.y", ' s * tex.x + c * tex.y',
") * scale;", ' ) * scale;',
"return (sin(point.x) * sin(point.y)) * 4.0;", ' return (sin(point.x) * sin(point.y)) * 4.0;',
"}", '}',
"void main() {", 'void main() {',
"vec4 color = texture2D(uSampler, vTextureCoord);", ' vec4 color = texture2D(uSampler, vTextureCoord);',
"float average = (color.r + color.g + color.b) / 3.0;", ' float average = (color.r + color.g + color.b) / 3.0;',
"gl_FragColor = vec4(vec3(average * 10.0 - 5.0 + pattern()), color.a);", ' gl_FragColor = vec4(vec3(average * 10.0 - 5.0 + pattern()), color.a);',
"}", '}'
]; ];
} };
PIXI.DotScreenFilter.prototype = Object.create( PIXI.DotScreenFilter.prototype ); PIXI.DotScreenFilter.prototype = Object.create( PIXI.DotScreenFilter.prototype );
PIXI.DotScreenFilter.prototype.constructor = PIXI.DotScreenFilter; PIXI.DotScreenFilter.prototype.constructor = PIXI.DotScreenFilter;

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

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

24
src/pixi/filters/GrayFilter.js
View file

@ -2,7 +2,6 @@
* @author Mat Groves http://matgroves.com/ @Doormat23 * @author Mat Groves http://matgroves.com/ @Doormat23
*/ */
/** /**
* *
* This turns your displayObjects to black and white. * This turns your displayObjects to black and white.
@ -21,18 +20,19 @@ PIXI.GrayFilter = function()
}; };
this.fragmentSrc = [ this.fragmentSrc = [
"precision mediump float;", 'precision mediump float;',
"varying vec2 vTextureCoord;", 'varying vec2 vTextureCoord;',
"varying float vColor;", 'varying float vColor;',
"uniform sampler2D uSampler;", 'uniform sampler2D uSampler;',
"uniform float gray;", 'uniform float gray;',
"void main(void) {",
"gl_FragColor = texture2D(uSampler, vTextureCoord);", 'void main(void) {',
"gl_FragColor.rgb = mix(gl_FragColor.rgb, vec3(0.2126*gl_FragColor.r + 0.7152*gl_FragColor.g + 0.0722*gl_FragColor.b), gray);", ' gl_FragColor = texture2D(uSampler, vTextureCoord);',
"gl_FragColor = gl_FragColor * vColor;", ' gl_FragColor.rgb = mix(gl_FragColor.rgb, vec3(0.2126*gl_FragColor.r + 0.7152*gl_FragColor.g + 0.0722*gl_FragColor.b), gray);',
"}" ' gl_FragColor = gl_FragColor * vColor;',
'}'
]; ];
} };
PIXI.GrayFilter.prototype = Object.create( PIXI.AbstractFilter.prototype ); PIXI.GrayFilter.prototype = Object.create( PIXI.AbstractFilter.prototype );
PIXI.GrayFilter.prototype.constructor = PIXI.GrayFilter; PIXI.GrayFilter.prototype.constructor = PIXI.GrayFilter;

26
src/pixi/filters/InvertFilter.js
View file

@ -20,20 +20,20 @@ PIXI.InvertFilter = function()
}; };
this.fragmentSrc = [ this.fragmentSrc = [
"precision mediump float;", 'precision mediump float;',
"varying vec2 vTextureCoord;", 'varying vec2 vTextureCoord;',
"varying float vColor;", 'varying float vColor;',
"uniform float invert;", 'uniform float invert;',
"uniform sampler2D uSampler;", 'uniform sampler2D uSampler;',
"void main(void) {",
"gl_FragColor = texture2D(uSampler, vTextureCoord);",
"gl_FragColor.rgb = mix( (vec3(1)-gl_FragColor.rgb) * gl_FragColor.a, gl_FragColor.rgb, 1.0 - invert);",
//"gl_FragColor.rgb = gl_FragColor.rgb * gl_FragColor.a;",
"gl_FragColor = gl_FragColor * vColor;",
"}"
];
} 'void main(void) {',
' gl_FragColor = texture2D(uSampler, vTextureCoord);',
' gl_FragColor.rgb = mix( (vec3(1)-gl_FragColor.rgb) * gl_FragColor.a, gl_FragColor.rgb, 1.0 - invert);',
//' gl_FragColor.rgb = gl_FragColor.rgb * gl_FragColor.a;',
' gl_FragColor = gl_FragColor * vColor;',
'}'
];
};
PIXI.InvertFilter.prototype = Object.create( PIXI.AbstractFilter.prototype ); PIXI.InvertFilter.prototype = Object.create( PIXI.AbstractFilter.prototype );
PIXI.InvertFilter.prototype.constructor = PIXI.InvertFilter; PIXI.InvertFilter.prototype.constructor = PIXI.InvertFilter;

33
src/pixi/filters/PixelateFilter.js
View file

@ -4,7 +4,7 @@
/** /**
* *
* This filter applies a pixlate effect making display objects appear "blocky" * This filter applies a pixlate effect making display objects appear 'blocky'
* @class PixelateFilter * @class PixelateFilter
* @contructor * @contructor
*/ */
@ -22,25 +22,24 @@ PIXI.PixelateFilter = function()
}; };
this.fragmentSrc = [ this.fragmentSrc = [
"precision mediump float;", 'precision mediump float;',
"varying vec2 vTextureCoord;", 'varying vec2 vTextureCoord;',
"varying float vColor;", 'varying float vColor;',
"uniform vec2 testDim;", 'uniform vec2 testDim;',
"uniform vec4 dimensions;", 'uniform vec4 dimensions;',
"uniform vec2 pixelSize;", 'uniform vec2 pixelSize;',
"uniform sampler2D uSampler;", 'uniform sampler2D uSampler;',
"void main(void) {",
"vec2 coord = vTextureCoord;",
"vec2 size = dimensions.xy/pixelSize;", 'void main(void) {',
' vec2 coord = vTextureCoord;',
"vec2 color = floor( ( vTextureCoord * size ) ) / size + pixelSize/dimensions.xy * 0.5;", ' vec2 size = dimensions.xy/pixelSize;',
"gl_FragColor = texture2D(uSampler, color);",
"}" ' vec2 color = floor( ( vTextureCoord * size ) ) / size + pixelSize/dimensions.xy * 0.5;',
' gl_FragColor = texture2D(uSampler, color);',
'}'
]; ];
};
}
PIXI.PixelateFilter.prototype = Object.create( PIXI.AbstractFilter.prototype ); PIXI.PixelateFilter.prototype = Object.create( PIXI.AbstractFilter.prototype );
PIXI.PixelateFilter.prototype.constructor = PIXI.PixelateFilter; PIXI.PixelateFilter.prototype.constructor = PIXI.PixelateFilter;

33
src/pixi/filters/RGBSplitFilter.js
View file

@ -2,8 +2,6 @@
* @author Mat Groves http://matgroves.com/ @Doormat23 * @author Mat Groves http://matgroves.com/ @Doormat23
*/ */
PIXI.RGBSplitFilter = function() PIXI.RGBSplitFilter = function()
{ {
PIXI.AbstractFilter.call( this ); PIXI.AbstractFilter.call( this );
@ -19,22 +17,23 @@ PIXI.RGBSplitFilter = function()
}; };
this.fragmentSrc = [ this.fragmentSrc = [
"precision mediump float;", 'precision mediump float;',
"varying vec2 vTextureCoord;", 'varying vec2 vTextureCoord;',
"varying float vColor;", 'varying float vColor;',
"uniform vec2 red;", 'uniform vec2 red;',
"uniform vec2 green;", 'uniform vec2 green;',
"uniform vec2 blue;", 'uniform vec2 blue;',
"uniform vec4 dimensions;", 'uniform vec4 dimensions;',
"uniform sampler2D uSampler;", 'uniform sampler2D uSampler;',
"void main(void) {",
"gl_FragColor.r = texture2D(uSampler, vTextureCoord + red/dimensions.xy).r;", 'void main(void) {',
"gl_FragColor.g = texture2D(uSampler, vTextureCoord + green/dimensions.xy).g;", ' gl_FragColor.r = texture2D(uSampler, vTextureCoord + red/dimensions.xy).r;',
"gl_FragColor.b = texture2D(uSampler, vTextureCoord + blue/dimensions.xy).b;", ' gl_FragColor.g = texture2D(uSampler, vTextureCoord + green/dimensions.xy).g;',
"gl_FragColor.a = texture2D(uSampler, vTextureCoord).a;", ' gl_FragColor.b = texture2D(uSampler, vTextureCoord + blue/dimensions.xy).b;',
"}" ' gl_FragColor.a = texture2D(uSampler, vTextureCoord).a;',
'}'
]; ];
} };
PIXI.RGBSplitFilter.prototype = Object.create( PIXI.AbstractFilter.prototype ); PIXI.RGBSplitFilter.prototype = Object.create( PIXI.AbstractFilter.prototype );
PIXI.RGBSplitFilter.prototype.constructor = PIXI.RGBSplitFilter; PIXI.RGBSplitFilter.prototype.constructor = PIXI.RGBSplitFilter;

28
src/pixi/filters/SepiaFilter.js
View file

@ -1,9 +1,7 @@
/**
/** /**
* @author Mat Groves http://matgroves.com/ @Doormat23 * @author Mat Groves http://matgroves.com/ @Doormat23
*/ */
/** /**
* *
* This applies a sepia effect to your displayObjects. * This applies a sepia effect to your displayObjects.
@ -22,21 +20,21 @@ PIXI.SepiaFilter = function()
}; };
this.fragmentSrc = [ this.fragmentSrc = [
"precision mediump float;", 'precision mediump float;',
"varying vec2 vTextureCoord;", 'varying vec2 vTextureCoord;',
"varying float vColor;", 'varying float vColor;',
"uniform float sepia;", 'uniform float sepia;',
"uniform sampler2D uSampler;", 'uniform sampler2D uSampler;',
"const mat3 sepiaMatrix = mat3(0.3588, 0.7044, 0.1368, 0.2990, 0.5870, 0.1140, 0.2392, 0.4696, 0.0912);", 'const mat3 sepiaMatrix = mat3(0.3588, 0.7044, 0.1368, 0.2990, 0.5870, 0.1140, 0.2392, 0.4696, 0.0912);',
"void main(void) {",
"gl_FragColor = texture2D(uSampler, vTextureCoord);", 'void main(void) {',
"gl_FragColor.rgb = mix( gl_FragColor.rgb, gl_FragColor.rgb * sepiaMatrix, sepia);", ' gl_FragColor = texture2D(uSampler, vTextureCoord);',
"gl_FragColor = gl_FragColor * vColor;", ' gl_FragColor.rgb = mix( gl_FragColor.rgb, gl_FragColor.rgb * sepiaMatrix, sepia);',
"}" ' gl_FragColor = gl_FragColor * vColor;',
'}'
]; ];
};
}
PIXI.SepiaFilter.prototype = Object.create( PIXI.AbstractFilter.prototype ); PIXI.SepiaFilter.prototype = Object.create( PIXI.AbstractFilter.prototype );
PIXI.SepiaFilter.prototype.constructor = PIXI.SepiaFilter; PIXI.SepiaFilter.prototype.constructor = PIXI.SepiaFilter;

55
src/pixi/filters/SmartBlurFilter.js
View file

@ -2,8 +2,6 @@
* @author Mat Groves http://matgroves.com/ @Doormat23 * @author Mat Groves http://matgroves.com/ @Doormat23
*/ */
PIXI.SmartBlurFilter = function() PIXI.SmartBlurFilter = function()
{ {
PIXI.AbstractFilter.call( this ); PIXI.AbstractFilter.call( this );
@ -16,40 +14,39 @@ PIXI.SmartBlurFilter = function()
}; };
this.fragmentSrc = [ this.fragmentSrc = [
"precision mediump float;", 'precision mediump float;',
"varying vec2 vTextureCoord;", 'varying vec2 vTextureCoord;',
"uniform sampler2D uSampler;", 'uniform sampler2D uSampler;',
// "uniform vec2 delta;", //'uniform vec2 delta;',
"const vec2 delta = vec2(1.0/10.0, 0.0);", 'const vec2 delta = vec2(1.0/10.0, 0.0);',
// "uniform float darkness;", //'uniform float darkness;',
"float random(vec3 scale, float seed) {", 'float random(vec3 scale, float seed) {',
"return fract(sin(dot(gl_FragCoord.xyz + seed, scale)) * 43758.5453 + seed);", ' return fract(sin(dot(gl_FragCoord.xyz + seed, scale)) * 43758.5453 + seed);',
"}", '}',
"void main(void) {", 'void main(void) {',
' vec4 color = vec4(0.0);',
' float total = 0.0;',
"vec4 color = vec4(0.0);", ' float offset = random(vec3(12.9898, 78.233, 151.7182), 0.0);',
"float total = 0.0;",
"float offset = random(vec3(12.9898, 78.233, 151.7182), 0.0);", ' for (float t = -30.0; t <= 30.0; t++) {',
' float percent = (t + offset - 0.5) / 30.0;',
' float weight = 1.0 - abs(percent);',
' vec4 sample = texture2D(uSampler, vTextureCoord + delta * percent);',
' sample.rgb *= sample.a;',
' color += sample * weight;',
' total += weight;',
' }',
"for (float t = -30.0; t <= 30.0; t++) {", ' gl_FragColor = color / total;',
"float percent = (t + offset - 0.5) / 30.0;", ' gl_FragColor.rgb /= gl_FragColor.a + 0.00001;',
"float weight = 1.0 - abs(percent);", //' gl_FragColor.rgb *= darkness;',
"vec4 sample = texture2D(uSampler, vTextureCoord + delta * percent);", '}'
"sample.rgb *= sample.a;",
"color += sample * weight;",
"total += weight;",
"}",
"gl_FragColor = color / total;",
"gl_FragColor.rgb /= gl_FragColor.a + 0.00001;",
// "gl_FragColor.rgb *= darkness;",
"}"
]; ];
} };
PIXI.SmartBlurFilter.prototype = Object.create( PIXI.AbstractFilter.prototype ); PIXI.SmartBlurFilter.prototype = Object.create( PIXI.AbstractFilter.prototype );
PIXI.SmartBlurFilter.prototype.constructor = PIXI.SmartBlurFilter; PIXI.SmartBlurFilter.prototype.constructor = PIXI.SmartBlurFilter;

46
src/pixi/filters/TwistFilter.js
View file

@ -4,7 +4,7 @@
/** /**
* *
* This filter applies a pixlate effect making display objects appear "blocky" * This filter applies a pixlate effect making display objects appear 'blocky'
* @class PixelateFilter * @class PixelateFilter
* @contructor * @contructor
*/ */
@ -22,34 +22,32 @@ PIXI.TwistFilter = function()
}; };
this.fragmentSrc = [ this.fragmentSrc = [
"precision mediump float;", 'precision mediump float;',
"varying vec2 vTextureCoord;", 'varying vec2 vTextureCoord;',
"varying float vColor;", 'varying float vColor;',
"uniform vec4 dimensions;", 'uniform vec4 dimensions;',
"uniform sampler2D uSampler;", 'uniform sampler2D uSampler;',
"uniform float radius;", 'uniform float radius;',
"uniform float angle;", 'uniform float angle;',
"uniform vec2 offset;", 'uniform vec2 offset;',
"void main(void) {", 'void main(void) {',
"vec2 coord = vTextureCoord - offset;", ' vec2 coord = vTextureCoord - offset;',
"float distance = length(coord);", ' float distance = length(coord);',
"if (distance < radius){", ' if (distance < radius) {',
' float ratio = (radius - distance) / radius;',
' float angleMod = ratio * ratio * angle;',
' float s = sin(angleMod);',
' float c = cos(angleMod);',
' coord = vec2(coord.x * c - coord.y * s, coord.x * s + coord.y * c);',
' }',
"float ratio = (radius - distance) / radius;", ' gl_FragColor = texture2D(uSampler, coord+offset);',
"float angleMod = ratio * ratio * angle;", '}'
"float s = sin(angleMod);",
"float c = cos(angleMod);",
"coord = vec2(coord.x * c - coord.y * s, coord.x * s + coord.y * c);",
"}",
"gl_FragColor = texture2D(uSampler, coord+offset);",
"}"
]; ];
} };
PIXI.TwistFilter.prototype = Object.create( PIXI.AbstractFilter.prototype ); PIXI.TwistFilter.prototype = Object.create( PIXI.AbstractFilter.prototype );
PIXI.TwistFilter.prototype.constructor = PIXI.TwistFilter; PIXI.TwistFilter.prototype.constructor = PIXI.TwistFilter;

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

@ -6,16 +6,16 @@
* A Class that loads a bunch of images / sprite sheet / bitmap font files. Once the * A Class that loads a bunch of images / sprite sheet / bitmap font files. Once the
* assets have been loaded they are added to the PIXI Texture cache and can be accessed * assets have been loaded they are added to the PIXI Texture cache and can be accessed
* easily through PIXI.Texture.fromImage() and PIXI.Sprite.fromImage() * easily through PIXI.Texture.fromImage() and PIXI.Sprite.fromImage()
* When all items have been loaded this class will dispatch a "onLoaded" event * When all items have been loaded this class will dispatch a 'onLoaded' event
* As each individual item is loaded this class will dispatch a "onProgress" event * As each individual item is loaded this class will dispatch a 'onProgress' event
* *
* @class AssetLoader * @class AssetLoader
* @constructor * @constructor
* @uses EventTarget * @uses EventTarget
* @param {Array<String>} assetURLs an array of image/sprite sheet urls that you would like loaded * @param {Array<String>} assetURLs an array of image/sprite sheet urls that you would like loaded
* supported. Supported image formats include "jpeg", "jpg", "png", "gif". Supported * supported. Supported image formats include 'jpeg', 'jpg', 'png', 'gif'. Supported
* sprite sheet data formats only include "JSON" at this time. Supported bitmap font * sprite sheet data formats only include 'JSON' at this time. Supported bitmap font
* data formats include "xml" and "fnt". * data formats include 'xml' and 'fnt'.
* @param crossorigin {Boolean} Whether requests should be treated as crossorigin * @param crossorigin {Boolean} Whether requests should be treated as crossorigin
*/ */
PIXI.AssetLoader = function(assetURLs, crossorigin) PIXI.AssetLoader = function(assetURLs, crossorigin)
@ -45,18 +45,16 @@ PIXI.AssetLoader = function(assetURLs, crossorigin)
* @type Object * @type Object
*/ */
this.loadersByType = { this.loadersByType = {
"jpg": PIXI.ImageLoader, 'jpg': PIXI.ImageLoader,
"jpeg": PIXI.ImageLoader, 'jpeg': PIXI.ImageLoader,
"png": PIXI.ImageLoader, 'png': PIXI.ImageLoader,
"gif": PIXI.ImageLoader, 'gif': PIXI.ImageLoader,
"json": PIXI.JsonLoader, 'json': PIXI.JsonLoader,
"atlas": PIXI.AtlasLoader, 'atlas': PIXI.AtlasLoader,
"anim": PIXI.SpineLoader, 'anim': PIXI.SpineLoader,
"xml": PIXI.BitmapFontLoader, 'xml': PIXI.BitmapFontLoader,
"fnt": PIXI.BitmapFontLoader 'fnt': PIXI.BitmapFontLoader
}; };
}; };
/** /**
@ -75,29 +73,30 @@ PIXI.AssetLoader.prototype.constructor = PIXI.AssetLoader;
PIXI.AssetLoader.prototype._getDataType = function(str) PIXI.AssetLoader.prototype._getDataType = function(str)
{ {
var test = "data:"; var test = 'data:';
//starts with 'data:' //starts with 'data:'
var start = str.slice(0, test.length).toLowerCase(); var start = str.slice(0, test.length).toLowerCase();
if (start == test) { if (start === test) {
var data = str.slice(test.length); var data = str.slice(test.length);
var sepIdx = data.indexOf(','); var sepIdx = data.indexOf(',');
if (sepIdx === -1) //malformed data URI scheme if (sepIdx === -1) //malformed data URI scheme
return null; return null;
//e.g. "image/gif;base64" => "image/gif" //e.g. 'image/gif;base64' => 'image/gif'
var info = data.slice(0, sepIdx).split(';')[0]; var info = data.slice(0, sepIdx).split(';')[0];
//We might need to handle some special cases here... //We might need to handle some special cases here...
//standardize text/plain to "txt" file extension //standardize text/plain to 'txt' file extension
if (!info || info.toLowerCase() == "text/plain") if (!info || info.toLowerCase() === 'text/plain')
return "txt" return 'txt';
//User specified mime type, try splitting it by '/' //User specified mime type, try splitting it by '/'
return info.split('/').pop().toLowerCase(); return info.split('/').pop().toLowerCase();
} }
return null; return null;
} };
/** /**
* Starts loading the assets sequentially * Starts loading the assets sequentially
@ -108,6 +107,10 @@ PIXI.AssetLoader.prototype.load = function()
{ {
var scope = this; var scope = this;
function onLoad() {
scope.onAssetLoaded();
}
this.loadCount = this.assetURLs.length; this.loadCount = this.assetURLs.length;
for (var i=0; i < this.assetURLs.length; i++) for (var i=0; i < this.assetURLs.length; i++)
@ -118,18 +121,15 @@ PIXI.AssetLoader.prototype.load = function()
//if not, assume it's a file URI //if not, assume it's a file URI
if (!fileType) if (!fileType)
fileType = fileName.split("?").shift().split(".").pop().toLowerCase(); fileType = fileName.split('?').shift().split('.').pop().toLowerCase();
var loaderClass = this.loadersByType[fileType]; var Constructor = this.loadersByType[fileType];
if(!loaderClass) if(!Constructor)
throw new Error(fileType + " is an unsupported file type"); 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() loader.addEventListener('loaded', onLoad);
{
scope.onAssetLoaded();
});
loader.load(); loader.load();
} }
}; };
@ -143,13 +143,12 @@ PIXI.AssetLoader.prototype.load = function()
PIXI.AssetLoader.prototype.onAssetLoaded = function() PIXI.AssetLoader.prototype.onAssetLoaded = function()
{ {
this.loadCount--; this.loadCount--;
this.dispatchEvent({type: "onProgress", content: this}); this.dispatchEvent({type: 'onProgress', content: this});
if(this.onProgress) this.onProgress(); if (this.onProgress) this.onProgress();
if(this.loadCount == 0) if (!this.loadCount)
{ {
this.dispatchEvent({type: "onComplete", content: this}); this.dispatchEvent({type: 'onComplete', content: this});
if(this.onComplete) this.onComplete(); if(this.onComplete) this.onComplete();
} }
}; };

73
src/pixi/loaders/AtlasLoader.js
View file

@ -4,8 +4,8 @@
/** /**
* The atlas file loader is used to load in Atlas data and parsing it * The atlas file loader is used to load in Atlas data and parsing it
* When loaded this class will dispatch a "loaded" event * When loaded this class will dispatch a 'loaded' event
* If load failed this class will dispatch a "error" event * If load failed this class will dispatch a 'error' event
* @class AtlasLoader * @class AtlasLoader
* @extends EventTarget * @extends EventTarget
* @constructor * @constructor
@ -16,7 +16,7 @@
PIXI.AtlasLoader = function (url, crossorigin) { PIXI.AtlasLoader = function (url, crossorigin) {
PIXI.EventTarget.call(this); PIXI.EventTarget.call(this);
this.url = url; this.url = url;
this.baseUrl = url.replace(/[^\/]*$/, ""); this.baseUrl = url.replace(/[^\/]*$/, '');
this.crossorigin = crossorigin; this.crossorigin = crossorigin;
this.loaded = false; this.loaded = false;
@ -29,14 +29,11 @@ PIXI.AtlasLoader.constructor = PIXI.AtlasLoader;
* This will begin loading the JSON file * This will begin loading the JSON file
*/ */
PIXI.AtlasLoader.prototype.load = function () { PIXI.AtlasLoader.prototype.load = function () {
this.ajaxRequest = new AjaxRequest(); this.ajaxRequest = new PIXI.AjaxRequest();
var scope = this; this.ajaxRequest.onreadystatechange = this.onAtlasLoaded.bind(this);
this.ajaxRequest.onreadystatechange = function () {
scope.onAtlasLoaded();
};
this.ajaxRequest.open("GET", this.url, true); this.ajaxRequest.open('GET', this.url, true);
if (this.ajaxRequest.overrideMimeType) this.ajaxRequest.overrideMimeType("application/json"); if (this.ajaxRequest.overrideMimeType) this.ajaxRequest.overrideMimeType('application/json');
this.ajaxRequest.send(null); this.ajaxRequest.send(null);
}; };
@ -45,8 +42,8 @@ PIXI.AtlasLoader.prototype.load = function () {
* @private * @private
*/ */
PIXI.AtlasLoader.prototype.onAtlasLoaded = function () { PIXI.AtlasLoader.prototype.onAtlasLoaded = function () {
if (this.ajaxRequest.readyState == 4) { if (this.ajaxRequest.readyState === 4) {
if (this.ajaxRequest.status == 200 || window.location.href.indexOf("http") == -1) { if (this.ajaxRequest.status === 200 || window.location.href.indexOf('http') === -1) {
this.atlas = { this.atlas = {
meta : { meta : {
image : [] image : []
@ -59,39 +56,45 @@ PIXI.AtlasLoader.prototype.onAtlasLoaded = function () {
var currentImageId = 0; var currentImageId = 0;
var currentFrame = null; var currentFrame = null;
var nameInNextLine = false; var nameInNextLine = false;
var i = 0,
j = 0,
selfOnLoaded = this.onLoaded.bind(this);
// parser without rotation support yet! // parser without rotation support yet!
for (var i = 0; i < result.length; i++) { for (i = 0; i < result.length; i++) {
result[i] = result[i].replace(/^\s+|\s+$/g, ''); result[i] = result[i].replace(/^\s+|\s+$/g, '');
if (result[i] == "") { if (result[i] === '') {
nameInNextLine = i+1; nameInNextLine = i+1;
} }
if (result[i].length > 0) { if (result[i].length > 0) {
if (nameInNextLine == i) { if (nameInNextLine === i) {
this.atlas.meta.image.push(result[i]); this.atlas.meta.image.push(result[i]);
currentImageId = this.atlas.meta.image.length - 1; currentImageId = this.atlas.meta.image.length - 1;
this.atlas.frames.push({}); this.atlas.frames.push({});
lineCount = -3; lineCount = -3;
} else if (lineCount > 0) { } else if (lineCount > 0) {
if (lineCount % 7 == 1) { // frame name if (lineCount % 7 === 1) { // frame name
if (currentFrame != null) { if (currentFrame != null) { //jshint ignore:line
this.atlas.frames[currentImageId][currentFrame.name] = currentFrame; this.atlas.frames[currentImageId][currentFrame.name] = currentFrame;
} }
currentFrame = { name: result[i], frame : {} }; currentFrame = { name: result[i], frame : {} };
} else { } else {
var text = result[i].split(" "); var text = result[i].split(' ');
if (lineCount % 7 == 3) { // position if (lineCount % 7 === 3) { // position
currentFrame.frame.x = Number(text[1].replace(",", "")); currentFrame.frame.x = Number(text[1].replace(',', ''));
currentFrame.frame.y = Number(text[2]); currentFrame.frame.y = Number(text[2]);
} else if (lineCount % 7 == 4) { // size } else if (lineCount % 7 === 4) { // size
currentFrame.frame.w = Number(text[1].replace(",", "")); currentFrame.frame.w = Number(text[1].replace(',', ''));
currentFrame.frame.h = Number(text[2]); currentFrame.frame.h = Number(text[2]);
} else if (lineCount % 7 == 5) { // real size } else if (lineCount % 7 === 5) { // real size
var realSize = { var realSize = {
x : 0, x : 0,
y : 0, y : 0,
w : Number(text[1].replace(",", "")), w : Number(text[1].replace(',', '')),
h : Number(text[2]) h : Number(text[2])
} };
if (realSize.w > currentFrame.frame.w || realSize.h > currentFrame.frame.h) { if (realSize.w > currentFrame.frame.w || realSize.h > currentFrame.frame.h) {
currentFrame.trimmed = true; currentFrame.trimmed = true;
currentFrame.realSize = realSize; currentFrame.realSize = realSize;
@ -104,20 +107,20 @@ PIXI.AtlasLoader.prototype.onAtlasLoaded = function () {
lineCount++; lineCount++;
} }
} }
if (currentFrame != null) {
if (currentFrame != null) { //jshint ignore:line
this.atlas.frames[currentImageId][currentFrame.name] = currentFrame; this.atlas.frames[currentImageId][currentFrame.name] = currentFrame;
} }
if (this.atlas.meta.image.length > 0) { if (this.atlas.meta.image.length > 0) {
this.images = []; this.images = [];
for (var j = 0; j < this.atlas.meta.image.length; j++) { for (j = 0; j < this.atlas.meta.image.length; j++) {
// sprite sheet // sprite sheet
var scope = this;
var textureUrl = this.baseUrl + this.atlas.meta.image[j]; var textureUrl = this.baseUrl + this.atlas.meta.image[j];
var frameData = this.atlas.frames[j]; var frameData = this.atlas.frames[j];
this.images.push(new PIXI.ImageLoader(textureUrl, this.crossorigin)); this.images.push(new PIXI.ImageLoader(textureUrl, this.crossorigin));
for (var i in frameData) { for (i in frameData) {
var rect = frameData[i].frame; var rect = frameData[i].frame;
if (rect) { if (rect) {
PIXI.TextureCache[i] = new PIXI.Texture(this.images[j].texture.baseTexture, { PIXI.TextureCache[i] = new PIXI.Texture(this.images[j].texture.baseTexture, {
@ -126,7 +129,7 @@ PIXI.AtlasLoader.prototype.onAtlasLoaded = function () {
width: rect.w, width: rect.w,
height: rect.h height: rect.h
}); });
if (frameData[i].trimmed == true) { if (frameData[i].trimmed) {
PIXI.TextureCache[i].realSize = frameData[i].realSize; PIXI.TextureCache[i].realSize = frameData[i].realSize;
// trim in pixi not supported yet, todo update trim properties if it is done ... // trim in pixi not supported yet, todo update trim properties if it is done ...
PIXI.TextureCache[i].trim.x = 0; PIXI.TextureCache[i].trim.x = 0;
@ -137,10 +140,8 @@ PIXI.AtlasLoader.prototype.onAtlasLoaded = function () {
} }
this.currentImageId = 0; this.currentImageId = 0;
for (var j = 0; j < this.images.length; j++) { for (j = 0; j < this.images.length; j++) {
this.images[j].addEventListener( this.images[j].addEventListener('loaded', selfOnLoaded);
"loaded", function (event) { scope.onLoaded(); }
);
} }
this.images[this.currentImageId].load(); this.images[this.currentImageId].load();
@ -165,7 +166,7 @@ PIXI.AtlasLoader.prototype.onLoaded = function () {
} else { } else {
this.loaded = true; this.loaded = true;
this.dispatchEvent({ this.dispatchEvent({
type: "loaded", type: 'loaded',
content: this content: this
}); });
} }
@ -177,7 +178,7 @@ PIXI.AtlasLoader.prototype.onLoaded = function () {
*/ */
PIXI.AtlasLoader.prototype.onError = function () { PIXI.AtlasLoader.prototype.onError = function () {
this.dispatchEvent({ this.dispatchEvent({
type: "error", type: 'error',
content: this content: this
}); });
}; };

60
src/pixi/loaders/BitmapFontLoader.js
View file

@ -3,10 +3,10 @@
*/ */
/** /**
* The xml loader is used to load in XML bitmap font data ("xml" or "fnt") * The xml loader is used to load in XML bitmap font data ('xml' or 'fnt')
* To generate the data you can use http://www.angelcode.com/products/bmfont/ * To generate the data you can use http://www.angelcode.com/products/bmfont/
* This loader will also load the image file as the data. * This loader will also load the image file as the data.
* When loaded this class will dispatch a "loaded" event * When loaded this class will dispatch a 'loaded' event
* *
* @class BitmapFontLoader * @class BitmapFontLoader
* @uses EventTarget * @uses EventTarget
@ -19,7 +19,7 @@ PIXI.BitmapFontLoader = function(url, crossorigin)
/* /*
* i use texture packer to load the assets.. * i use texture packer to load the assets..
* http://www.codeandweb.com/texturepacker * http://www.codeandweb.com/texturepacker
* make sure to set the format as "JSON" * make sure to set the format as 'JSON'
*/ */
PIXI.EventTarget.call(this); PIXI.EventTarget.call(this);
@ -46,7 +46,7 @@ PIXI.BitmapFontLoader = function(url, crossorigin)
* @type String * @type String
* @readOnly * @readOnly
*/ */
this.baseUrl = url.replace(/[^\/]*$/, ""); this.baseUrl = url.replace(/[^\/]*$/, '');
/** /**
* [read-only] The texture of the bitmap font * [read-only] The texture of the bitmap font
@ -74,9 +74,9 @@ PIXI.BitmapFontLoader.prototype.load = function()
scope.onXMLLoaded(); scope.onXMLLoaded();
}; };
this.ajaxRequest.open("GET", this.url, true); this.ajaxRequest.open('GET', this.url, true);
if (this.ajaxRequest.overrideMimeType) this.ajaxRequest.overrideMimeType("application/xml"); if (this.ajaxRequest.overrideMimeType) this.ajaxRequest.overrideMimeType('application/xml');
this.ajaxRequest.send(null) this.ajaxRequest.send(null);
}; };
/** /**
@ -87,40 +87,40 @@ PIXI.BitmapFontLoader.prototype.load = function()
*/ */
PIXI.BitmapFontLoader.prototype.onXMLLoaded = function() PIXI.BitmapFontLoader.prototype.onXMLLoaded = function()
{ {
if (this.ajaxRequest.readyState == 4) if (this.ajaxRequest.readyState === 4)
{ {
if (this.ajaxRequest.status == 200 || window.location.protocol.indexOf("http") == -1) if (this.ajaxRequest.status === 200 || window.location.protocol.indexOf('http') === -1)
{ {
var textureUrl = this.baseUrl + this.ajaxRequest.responseXML.getElementsByTagName("page")[0].attributes.getNamedItem("file").nodeValue; var textureUrl = this.baseUrl + this.ajaxRequest.responseXML.getElementsByTagName('page')[0].attributes.getNamedItem('file').nodeValue;
var image = new PIXI.ImageLoader(textureUrl, this.crossorigin); var image = new PIXI.ImageLoader(textureUrl, this.crossorigin);
this.texture = image.texture.baseTexture; this.texture = image.texture.baseTexture;
var data = {}; var data = {};
var info = this.ajaxRequest.responseXML.getElementsByTagName("info")[0]; var info = this.ajaxRequest.responseXML.getElementsByTagName('info')[0];
var common = this.ajaxRequest.responseXML.getElementsByTagName("common")[0]; var common = this.ajaxRequest.responseXML.getElementsByTagName('common')[0];
data.font = info.attributes.getNamedItem("face").nodeValue; data.font = info.attributes.getNamedItem('face').nodeValue;
data.size = parseInt(info.attributes.getNamedItem("size").nodeValue, 10); data.size = parseInt(info.attributes.getNamedItem('size').nodeValue, 10);
data.lineHeight = parseInt(common.attributes.getNamedItem("lineHeight").nodeValue, 10); data.lineHeight = parseInt(common.attributes.getNamedItem('lineHeight').nodeValue, 10);
data.chars = {}; data.chars = {};
//parse letters //parse letters
var letters = this.ajaxRequest.responseXML.getElementsByTagName("char"); var letters = this.ajaxRequest.responseXML.getElementsByTagName('char');
for (var i = 0; i < letters.length; i++) for (var i = 0; i < letters.length; i++)
{ {
var charCode = parseInt(letters[i].attributes.getNamedItem("id").nodeValue, 10); var charCode = parseInt(letters[i].attributes.getNamedItem('id').nodeValue, 10);
var textureRect = new PIXI.Rectangle( var textureRect = new PIXI.Rectangle(
parseInt(letters[i].attributes.getNamedItem("x").nodeValue, 10), parseInt(letters[i].attributes.getNamedItem('x').nodeValue, 10),
parseInt(letters[i].attributes.getNamedItem("y").nodeValue, 10), parseInt(letters[i].attributes.getNamedItem('y').nodeValue, 10),
parseInt(letters[i].attributes.getNamedItem("width").nodeValue, 10), parseInt(letters[i].attributes.getNamedItem('width').nodeValue, 10),
parseInt(letters[i].attributes.getNamedItem("height").nodeValue, 10) parseInt(letters[i].attributes.getNamedItem('height').nodeValue, 10)
); );
data.chars[charCode] = { data.chars[charCode] = {
xOffset: parseInt(letters[i].attributes.getNamedItem("xoffset").nodeValue, 10), xOffset: parseInt(letters[i].attributes.getNamedItem('xoffset').nodeValue, 10),
yOffset: parseInt(letters[i].attributes.getNamedItem("yoffset").nodeValue, 10), yOffset: parseInt(letters[i].attributes.getNamedItem('yoffset').nodeValue, 10),
xAdvance: parseInt(letters[i].attributes.getNamedItem("xadvance").nodeValue, 10), xAdvance: parseInt(letters[i].attributes.getNamedItem('xadvance').nodeValue, 10),
kerning: {}, kerning: {},
texture: PIXI.TextureCache[charCode] = new PIXI.Texture(this.texture, textureRect) texture: PIXI.TextureCache[charCode] = new PIXI.Texture(this.texture, textureRect)
@ -128,12 +128,12 @@ PIXI.BitmapFontLoader.prototype.onXMLLoaded = function()
} }
//parse kernings //parse kernings
var kernings = this.ajaxRequest.responseXML.getElementsByTagName("kerning"); var kernings = this.ajaxRequest.responseXML.getElementsByTagName('kerning');
for (i = 0; i < kernings.length; i++) for (i = 0; i < kernings.length; i++)
{ {
var first = parseInt(kernings[i].attributes.getNamedItem("first").nodeValue, 10); var first = parseInt(kernings[i].attributes.getNamedItem('first').nodeValue, 10);
var second = parseInt(kernings[i].attributes.getNamedItem("second").nodeValue, 10); var second = parseInt(kernings[i].attributes.getNamedItem('second').nodeValue, 10);
var amount = parseInt(kernings[i].attributes.getNamedItem("amount").nodeValue, 10); var amount = parseInt(kernings[i].attributes.getNamedItem('amount').nodeValue, 10);
data.chars[second].kerning[first] = amount; data.chars[second].kerning[first] = amount;
@ -142,7 +142,7 @@ PIXI.BitmapFontLoader.prototype.onXMLLoaded = function()
PIXI.BitmapText.fonts[data.font] = data; PIXI.BitmapText.fonts[data.font] = data;
var scope = this; var scope = this;
image.addEventListener("loaded", function() { image.addEventListener('loaded', function() {
scope.onLoaded(); scope.onLoaded();
}); });
image.load(); image.load();
@ -158,5 +158,5 @@ PIXI.BitmapFontLoader.prototype.onXMLLoaded = function()
*/ */
PIXI.BitmapFontLoader.prototype.onLoaded = function() PIXI.BitmapFontLoader.prototype.onLoaded = function()
{ {
this.dispatchEvent({type: "loaded", content: this}); this.dispatchEvent({type: 'loaded', content: this});
}; };

10
src/pixi/loaders/ImageLoader.js
View file

@ -3,7 +3,7 @@
*/ */
/** /**
* The image loader class is responsible for loading images file formats ("jpeg", "jpg", "png" and "gif") * The image loader class is responsible for loading images file formats ('jpeg', 'jpg', 'png' and 'gif')
* Once the image has been loaded it is stored in the PIXI texture cache and can be accessed though PIXI.Texture.fromFrameId() and PIXI.Sprite.fromFromeId() * Once the image has been loaded it is stored in the PIXI texture cache and can be accessed though PIXI.Texture.fromFrameId() and PIXI.Sprite.fromFromeId()
* When loaded this class will dispatch a 'loaded' event * When loaded this class will dispatch a 'loaded' event
* *
@ -46,7 +46,7 @@ PIXI.ImageLoader.prototype.load = function()
if(!this.texture.baseTexture.hasLoaded) if(!this.texture.baseTexture.hasLoaded)
{ {
var scope = this; var scope = this;
this.texture.baseTexture.addEventListener("loaded", function() this.texture.baseTexture.addEventListener('loaded', function()
{ {
scope.onLoaded(); scope.onLoaded();
}); });
@ -65,7 +65,7 @@ PIXI.ImageLoader.prototype.load = function()
*/ */
PIXI.ImageLoader.prototype.onLoaded = function() PIXI.ImageLoader.prototype.onLoaded = function()
{ {
this.dispatchEvent({type: "loaded", content: this}); this.dispatchEvent({type: 'loaded', content: this});
}; };
/** /**
@ -96,14 +96,14 @@ PIXI.ImageLoader.prototype.loadFramedSpriteSheet = function(frameWidth, frameHei
}); });
this.frames.push(texture); this.frames.push(texture);
if (textureName) PIXI.TextureCache[textureName+'-'+i] = texture; if (textureName) PIXI.TextureCache[textureName + '-' + i] = texture;
} }
} }
if(!this.texture.baseTexture.hasLoaded) if(!this.texture.baseTexture.hasLoaded)
{ {
var scope = this; var scope = this;
this.texture.baseTexture.addEventListener("loaded", function() { this.texture.baseTexture.addEventListener('loaded', function() {
scope.onLoaded(); scope.onLoaded();
}); });
} }

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

@ -4,8 +4,8 @@
/** /**
* The json file loader is used to load in JSON data and parsing it * The json file loader is used to load in JSON data and parsing it
* When loaded this class will dispatch a "loaded" event * When loaded this class will dispatch a 'loaded' event
* If load failed this class will dispatch a "error" event * If load failed this class will dispatch a 'error' event
* *
* @class JsonLoader * @class JsonLoader
* @uses EventTarget * @uses EventTarget
@ -39,7 +39,7 @@ PIXI.JsonLoader = function (url, crossorigin) {
* @type String * @type String
* @readOnly * @readOnly
*/ */
this.baseUrl = url.replace(/[^\/]*$/, ""); this.baseUrl = url.replace(/[^\/]*$/, '');
/** /**
* [read-only] Whether the data has loaded yet * [read-only] Whether the data has loaded yet
@ -61,14 +61,14 @@ PIXI.JsonLoader.prototype.constructor = PIXI.JsonLoader;
* @method load * @method load
*/ */
PIXI.JsonLoader.prototype.load = function () { PIXI.JsonLoader.prototype.load = function () {
this.ajaxRequest = new AjaxRequest(); this.ajaxRequest = new PIXI.AjaxRequest();
var scope = this; var scope = this;
this.ajaxRequest.onreadystatechange = function () { this.ajaxRequest.onreadystatechange = function () {
scope.onJSONLoaded(); scope.onJSONLoaded();
}; };
this.ajaxRequest.open("GET", this.url, true); this.ajaxRequest.open('GET', this.url, true);
if (this.ajaxRequest.overrideMimeType) this.ajaxRequest.overrideMimeType("application/json"); if (this.ajaxRequest.overrideMimeType) this.ajaxRequest.overrideMimeType('application/json');
this.ajaxRequest.send(null); this.ajaxRequest.send(null);
}; };
@ -79,8 +79,8 @@ PIXI.JsonLoader.prototype.load = function () {
* @private * @private
*/ */
PIXI.JsonLoader.prototype.onJSONLoaded = function () { PIXI.JsonLoader.prototype.onJSONLoaded = function () {
if (this.ajaxRequest.readyState == 4) { if (this.ajaxRequest.readyState === 4) {
if (this.ajaxRequest.status == 200 || window.location.protocol.indexOf("http") == -1) { if (this.ajaxRequest.status === 200 || window.location.protocol.indexOf('http') === -1) {
this.json = JSON.parse(this.ajaxRequest.responseText); this.json = JSON.parse(this.ajaxRequest.responseText);
if(this.json.frames) if(this.json.frames)
@ -92,7 +92,7 @@ PIXI.JsonLoader.prototype.onJSONLoaded = function () {
var frameData = this.json.frames; var frameData = this.json.frames;
this.texture = image.texture.baseTexture; this.texture = image.texture.baseTexture;
image.addEventListener("loaded", function (event) { image.addEventListener('loaded', function() {
scope.onLoaded(); scope.onLoaded();
}); });
@ -146,7 +146,7 @@ PIXI.JsonLoader.prototype.onJSONLoaded = function () {
PIXI.JsonLoader.prototype.onLoaded = function () { PIXI.JsonLoader.prototype.onLoaded = function () {
this.loaded = true; this.loaded = true;
this.dispatchEvent({ this.dispatchEvent({
type: "loaded", type: 'loaded',
content: this content: this
}); });
}; };
@ -159,7 +159,7 @@ PIXI.JsonLoader.prototype.onLoaded = function () {
*/ */
PIXI.JsonLoader.prototype.onError = function () { PIXI.JsonLoader.prototype.onError = function () {
this.dispatchEvent({ this.dispatchEvent({
type: "error", type: 'error',
content: this content: this
}); });
}; };

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

@ -49,7 +49,7 @@ PIXI.SpineLoader = function(url, crossorigin)
* @readOnly * @readOnly
*/ */
this.loaded = false; this.loaded = false;
} };
PIXI.SpineLoader.prototype.constructor = PIXI.SpineLoader; PIXI.SpineLoader.prototype.constructor = PIXI.SpineLoader;
@ -75,7 +75,7 @@ PIXI.SpineLoader.prototype.load = function () {
* @method onJSONLoaded * @method onJSONLoaded
* @private * @private
*/ */
PIXI.SpineLoader.prototype.onJSONLoaded = function (event) { PIXI.SpineLoader.prototype.onJSONLoaded = function () {
var spineJsonParser = new spine.SkeletonJson(); var spineJsonParser = new spine.SkeletonJson();
var skeletonData = spineJsonParser.readSkeletonData(this.json); var skeletonData = spineJsonParser.readSkeletonData(this.json);

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

@ -4,12 +4,12 @@
/** /**
* The sprite sheet loader is used to load in JSON sprite sheet data * The sprite sheet loader is used to load in JSON sprite sheet data
* To generate the data you can use http://www.codeandweb.com/texturepacker and publish the "JSON" format * To generate the data you can use http://www.codeandweb.com/texturepacker and publish the 'JSON' format
* There is a free version so thats nice, although the paid version is great value for money. * There is a free version so thats nice, although the paid version is great value for money.
* It is highly recommended to use Sprite sheets (also know as texture atlas") as it means sprite"s can be batched and drawn together for highly increased rendering speed. * It is highly recommended to use Sprite sheets (also know as texture atlas') as it means sprite's can be batched and drawn together for highly increased rendering speed.
* Once the data has been loaded the frames are stored in the PIXI texture cache and can be accessed though PIXI.Texture.fromFrameId() and PIXI.Sprite.fromFromeId() * Once the data has been loaded the frames are stored in the PIXI texture cache and can be accessed though PIXI.Texture.fromFrameId() and PIXI.Sprite.fromFromeId()
* This loader will also load the image file that the Spritesheet points to as well as the data. * This loader will also load the image file that the Spritesheet points to as well as the data.
* When loaded this class will dispatch a "loaded" event * When loaded this class will dispatch a 'loaded' event
* *
* @class SpriteSheetLoader * @class SpriteSheetLoader
* @uses EventTarget * @uses EventTarget
@ -17,12 +17,11 @@
* @param url {String} The url of the sprite sheet JSON file * @param url {String} The url of the sprite sheet JSON file
* @param crossorigin {Boolean} Whether requests should be treated as crossorigin * @param crossorigin {Boolean} Whether requests should be treated as crossorigin
*/ */
PIXI.SpriteSheetLoader = function (url, crossorigin) { PIXI.SpriteSheetLoader = function (url, crossorigin) {
/* /*
* i use texture packer to load the assets.. * i use texture packer to load the assets..
* http://www.codeandweb.com/texturepacker * http://www.codeandweb.com/texturepacker
* make sure to set the format as "JSON" * make sure to set the format as 'JSON'
*/ */
PIXI.EventTarget.call(this); PIXI.EventTarget.call(this);
@ -49,7 +48,7 @@ PIXI.SpriteSheetLoader = function (url, crossorigin) {
* @type String * @type String
* @readOnly * @readOnly
*/ */
this.baseUrl = url.replace(/[^\/]*$/, ""); this.baseUrl = url.replace(/[^\/]*$/, '');
/** /**
* The texture being loaded * The texture being loaded
@ -79,7 +78,7 @@ PIXI.SpriteSheetLoader.prototype.constructor = PIXI.SpriteSheetLoader;
PIXI.SpriteSheetLoader.prototype.load = function () { PIXI.SpriteSheetLoader.prototype.load = function () {
var scope = this; var scope = this;
var jsonLoader = new PIXI.JsonLoader(this.url, this.crossorigin); var jsonLoader = new PIXI.JsonLoader(this.url, this.crossorigin);
jsonLoader.addEventListener("loaded", function (event) { jsonLoader.addEventListener('loaded', function (event) {
scope.json = event.content.json; scope.json = event.content.json;
scope.onJSONLoaded(); scope.onJSONLoaded();
}); });
@ -99,7 +98,7 @@ PIXI.SpriteSheetLoader.prototype.onJSONLoaded = function () {
var frameData = this.json.frames; var frameData = this.json.frames;
this.texture = image.texture.baseTexture; this.texture = image.texture.baseTexture;
image.addEventListener("loaded", function (event) { image.addEventListener('loaded', function () {
scope.onLoaded(); scope.onLoaded();
}); });
@ -123,6 +122,7 @@ PIXI.SpriteSheetLoader.prototype.onJSONLoaded = function () {
image.load(); image.load();
}; };
/** /**
* Invoke when all files are loaded (json and texture) * Invoke when all files are loaded (json and texture)
* *
@ -131,7 +131,7 @@ PIXI.SpriteSheetLoader.prototype.onJSONLoaded = function () {
*/ */
PIXI.SpriteSheetLoader.prototype.onLoaded = function () { PIXI.SpriteSheetLoader.prototype.onLoaded = function () {
this.dispatchEvent({ this.dispatchEvent({
type: "loaded", type: 'loaded',
content: this content: this
}); });
}; };

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

@ -59,7 +59,7 @@ PIXI.Graphics = function()
* @private * @private
*/ */
this.currentPath = {points:[]}; this.currentPath = {points:[]};
} };
// constructor // constructor
PIXI.Graphics.prototype = Object.create( PIXI.DisplayObjectContainer.prototype ); PIXI.Graphics.prototype = Object.create( PIXI.DisplayObjectContainer.prototype );
@ -75,17 +75,17 @@ PIXI.Graphics.prototype.constructor = PIXI.Graphics;
*/ */
PIXI.Graphics.prototype.lineStyle = function(lineWidth, color, alpha) 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.lineWidth = lineWidth || 0;
this.lineColor = color || 0; this.lineColor = color || 0;
this.lineAlpha = (alpha == undefined) ? 1 : alpha; this.lineAlpha = (arguments.length < 3) ? 1 : alpha;
this.currentPath = {lineWidth:this.lineWidth, lineColor:this.lineColor, lineAlpha:this.lineAlpha, 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}; fillColor:this.fillColor, fillAlpha:this.fillAlpha, fill:this.filling, points:[], type:PIXI.Graphics.POLY};
this.graphicsData.push(this.currentPath); this.graphicsData.push(this.currentPath);
} };
/** /**
* Moves the current drawing position to (x, y). * Moves the current drawing position to (x, y).
@ -96,7 +96,7 @@ PIXI.Graphics.prototype.lineStyle = function(lineWidth, color, alpha)
*/ */
PIXI.Graphics.prototype.moveTo = function(x, y) 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, 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}; fillColor:this.fillColor, fillAlpha:this.fillAlpha, fill:this.filling, points:[], type:PIXI.Graphics.POLY};
@ -104,7 +104,7 @@ PIXI.Graphics.prototype.moveTo = function(x, y)
this.currentPath.points.push(x, y); this.currentPath.points.push(x, y);
this.graphicsData.push(this.currentPath); this.graphicsData.push(this.currentPath);
} };
/** /**
* Draws a line using the current line style from the current drawing position to (x, y); * Draws a line using the current line style from the current drawing position to (x, y);
@ -118,7 +118,7 @@ PIXI.Graphics.prototype.lineTo = function(x, y)
{ {
this.currentPath.points.push(x, y); this.currentPath.points.push(x, y);
this.dirty = true; this.dirty = true;
} };
/** /**
* Specifies a simple one-color fill that subsequent calls to other Graphics methods * Specifies a simple one-color fill that subsequent calls to other Graphics methods
@ -132,8 +132,8 @@ PIXI.Graphics.prototype.beginFill = function(color, alpha)
{ {
this.filling = true; this.filling = true;
this.fillColor = color || 0; this.fillColor = color || 0;
this.fillAlpha = (alpha == undefined) ? 1 : alpha; this.fillAlpha = (arguments.length < 2) ? 1 : alpha;
} };
/** /**
* Applies a fill to the lines and shapes that were added since the last call to the beginFill() method. * Applies a fill to the lines and shapes that were added since the last call to the beginFill() method.
@ -145,7 +145,7 @@ PIXI.Graphics.prototype.endFill = function()
this.filling = false; this.filling = false;
this.fillColor = null; this.fillColor = null;
this.fillAlpha = 1; this.fillAlpha = 1;
} };
/** /**
* @method drawRect * @method drawRect
@ -157,7 +157,7 @@ PIXI.Graphics.prototype.endFill = function()
*/ */
PIXI.Graphics.prototype.drawRect = function( x, y, width, height ) 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, this.currentPath = {lineWidth:this.lineWidth, lineColor:this.lineColor, lineAlpha:this.lineAlpha,
fillColor:this.fillColor, fillAlpha:this.fillAlpha, fill:this.filling, fillColor:this.fillColor, fillAlpha:this.fillAlpha, fill:this.filling,
@ -165,7 +165,7 @@ PIXI.Graphics.prototype.drawRect = function( x, y, width, height )
this.graphicsData.push(this.currentPath); this.graphicsData.push(this.currentPath);
this.dirty = true; this.dirty = true;
} };
/** /**
* Draws a circle. * Draws a circle.
@ -177,7 +177,7 @@ PIXI.Graphics.prototype.drawRect = function( x, y, width, height )
*/ */
PIXI.Graphics.prototype.drawCircle = function( x, y, radius) 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, this.currentPath = {lineWidth:this.lineWidth, lineColor:this.lineColor, lineAlpha:this.lineAlpha,
fillColor:this.fillColor, fillAlpha:this.fillAlpha, fill:this.filling, fillColor:this.fillColor, fillAlpha:this.fillAlpha, fill:this.filling,
@ -185,7 +185,7 @@ PIXI.Graphics.prototype.drawCircle = function( x, y, radius)
this.graphicsData.push(this.currentPath); this.graphicsData.push(this.currentPath);
this.dirty = true; this.dirty = true;
} };
/** /**
* Draws an ellipse. * Draws an ellipse.
@ -198,7 +198,7 @@ PIXI.Graphics.prototype.drawCircle = function( x, y, radius)
*/ */
PIXI.Graphics.prototype.drawEllipse = function( x, y, width, height) PIXI.Graphics.prototype.drawEllipse = 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, this.currentPath = {lineWidth:this.lineWidth, lineColor:this.lineColor, lineAlpha:this.lineAlpha,
fillColor:this.fillColor, fillAlpha:this.fillAlpha, fill:this.filling, fillColor:this.fillColor, fillAlpha:this.fillAlpha, fill:this.filling,
@ -206,7 +206,7 @@ PIXI.Graphics.prototype.drawEllipse = function( x, y, width, height)
this.graphicsData.push(this.currentPath); this.graphicsData.push(this.currentPath);
this.dirty = true; this.dirty = true;
} };
/** /**
* Clears the graphics that were drawn to this Graphics object, and resets fill and line style settings. * Clears the graphics that were drawn to this Graphics object, and resets fill and line style settings.
@ -222,8 +222,8 @@ PIXI.Graphics.prototype.clear = function()
this.clearDirty = true; this.clearDirty = true;
this.graphicsData = []; this.graphicsData = [];
this.bounds = null//new PIXI.Rectangle(); this.bounds = null; //new PIXI.Rectangle();
} };
PIXI.Graphics.prototype.updateFilterBounds = function() PIXI.Graphics.prototype.updateFilterBounds = function()
@ -239,8 +239,6 @@ PIXI.Graphics.prototype.updateFilterBounds = function()
var points, x, y; var points, x, y;
for (var i = 0; i < this.graphicsData.length; i++) { for (var i = 0; i < this.graphicsData.length; i++) {
var data = this.graphicsData[i]; var data = this.graphicsData[i];
var type = data.type; var type = data.type;
var lineWidth = data.lineWidth; var lineWidth = data.lineWidth;
@ -286,17 +284,14 @@ PIXI.Graphics.prototype.updateFilterBounds = function()
minY = y-lineWidth < minY ? y-lineWidth : minY; minY = y-lineWidth < minY ? y-lineWidth : minY;
maxY = y+lineWidth > maxY ? y+lineWidth : maxY; maxY = y+lineWidth > maxY ? y+lineWidth : maxY;
};
} }
}
}; }
this.bounds = new PIXI.Rectangle(minX, minY, maxX - minX, maxY - minY); this.bounds = new PIXI.Rectangle(minX, minY, maxX - minX, maxY - minY);
} }
// console.log(this.bounds); // console.log(this.bounds);
} };
// SOME TYPES: // SOME TYPES:
PIXI.Graphics.POLY = 0; PIXI.Graphics.POLY = 0;

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

@ -11,7 +11,7 @@
PIXI.CanvasGraphics = function() PIXI.CanvasGraphics = function()
{ {
} };
/* /*
@ -26,8 +26,9 @@ PIXI.CanvasGraphics = function()
PIXI.CanvasGraphics.renderGraphics = function(graphics, context) PIXI.CanvasGraphics.renderGraphics = function(graphics, context)
{ {
var worldAlpha = graphics.worldAlpha; var worldAlpha = graphics.worldAlpha;
var color = '';
for (var i=0; i < graphics.graphicsData.length; i++) for (var i = 0; i < graphics.graphicsData.length; i++)
{ {
var data = graphics.graphicsData[i]; var data = graphics.graphicsData[i];
var points = data.points; var points = data.points;
@ -36,7 +37,7 @@ PIXI.CanvasGraphics.renderGraphics = function(graphics, context)
context.lineWidth = data.lineWidth; context.lineWidth = data.lineWidth;
if(data.type == PIXI.Graphics.POLY) if(data.type === PIXI.Graphics.POLY)
{ {
context.beginPath(); context.beginPath();
@ -48,7 +49,7 @@ PIXI.CanvasGraphics.renderGraphics = function(graphics, context)
} }
// if the first and last point are the same close the path - much neater :) // 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]) if(points[0] === points[points.length-2] && points[1] === points[points.length-1])
{ {
context.closePath(); context.closePath();
} }
@ -65,7 +66,7 @@ PIXI.CanvasGraphics.renderGraphics = function(graphics, context)
context.stroke(); context.stroke();
} }
} }
else if(data.type == PIXI.Graphics.RECT) else if(data.type === PIXI.Graphics.RECT)
{ {
if(data.fillColor || data.fillColor === 0) if(data.fillColor || data.fillColor === 0)
@ -82,7 +83,7 @@ PIXI.CanvasGraphics.renderGraphics = function(graphics, context)
} }
} }
else if(data.type == PIXI.Graphics.CIRC) else if(data.type === PIXI.Graphics.CIRC)
{ {
// TODO - need to be Undefined! // TODO - need to be Undefined!
context.beginPath(); context.beginPath();
@ -101,7 +102,7 @@ PIXI.CanvasGraphics.renderGraphics = function(graphics, context)
context.stroke(); context.stroke();
} }
} }
else if(data.type == PIXI.Graphics.ELIP) else if(data.type === PIXI.Graphics.ELIP)
{ {
// ellipse code taken from: http://stackoverflow.com/questions/2172798/how-to-draw-an-oval-in-html5-canvas // ellipse code taken from: http://stackoverflow.com/questions/2172798/how-to-draw-an-oval-in-html5-canvas
@ -116,7 +117,7 @@ PIXI.CanvasGraphics.renderGraphics = function(graphics, context)
context.beginPath(); context.beginPath();
var kappa = .5522848, var kappa = 0.5522848,
ox = (w / 2) * kappa, // control point offset horizontal ox = (w / 2) * kappa, // control point offset horizontal
oy = (h / 2) * kappa, // control point offset vertical oy = (h / 2) * kappa, // control point offset vertical
xe = x + w, // x-end xe = x + w, // x-end
@ -144,9 +145,8 @@ PIXI.CanvasGraphics.renderGraphics = function(graphics, context)
context.stroke(); context.stroke();
} }
} }
}
}; };
}
/* /*
* Renders a graphics mask * Renders a graphics mask
@ -159,23 +159,22 @@ PIXI.CanvasGraphics.renderGraphics = function(graphics, context)
*/ */
PIXI.CanvasGraphics.renderGraphicsMask = function(graphics, context) PIXI.CanvasGraphics.renderGraphicsMask = function(graphics, context)
{ {
var worldAlpha = graphics.worldAlpha;
var len = graphics.graphicsData.length; var len = graphics.graphicsData.length;
if(len === 0)return;
if(len === 0) return;
if(len > 1) if(len > 1)
{ {
len = 1; len = 1;
console.log("Pixi.js warning: masks in canvas can only mask using the first path in the graphics object") window.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++) for (var i = 0; i < 1; i++)
{ {
var data = graphics.graphicsData[i]; var data = graphics.graphicsData[i];
var points = data.points; var points = data.points;
if(data.type == PIXI.Graphics.POLY) if(data.type === PIXI.Graphics.POLY)
{ {
context.beginPath(); context.beginPath();
context.moveTo(points[0], points[1]); context.moveTo(points[0], points[1]);
@ -186,26 +185,26 @@ PIXI.CanvasGraphics.renderGraphicsMask = function(graphics, context)
} }
// if the first and last point are the same close the path - much neater :) // 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]) if(points[0] === points[points.length-2] && points[1] === points[points.length-1])
{ {
context.closePath(); context.closePath();
} }
} }
else if(data.type == PIXI.Graphics.RECT) else if(data.type === PIXI.Graphics.RECT)
{ {
context.beginPath(); context.beginPath();
context.rect(points[0], points[1], points[2], points[3]); context.rect(points[0], points[1], points[2], points[3]);
context.closePath(); context.closePath();
} }
else if(data.type == PIXI.Graphics.CIRC) else if(data.type === PIXI.Graphics.CIRC)
{ {
// TODO - need to be Undefined! // TODO - need to be Undefined!
context.beginPath(); context.beginPath();
context.arc(points[0], points[1], points[2],0,2*Math.PI); context.arc(points[0], points[1], points[2],0,2*Math.PI);
context.closePath(); context.closePath();
} }
else if(data.type == PIXI.Graphics.ELIP) else if(data.type === PIXI.Graphics.ELIP)
{ {
// ellipse code taken from: http://stackoverflow.com/questions/2172798/how-to-draw-an-oval-in-html5-canvas // ellipse code taken from: http://stackoverflow.com/questions/2172798/how-to-draw-an-oval-in-html5-canvas
@ -219,7 +218,7 @@ PIXI.CanvasGraphics.renderGraphicsMask = function(graphics, context)
context.beginPath(); context.beginPath();
var kappa = .5522848, var kappa = 0.5522848,
ox = (w / 2) * kappa, // control point offset horizontal ox = (w / 2) * kappa, // control point offset horizontal
oy = (h / 2) * kappa, // control point offset vertical oy = (h / 2) * kappa, // control point offset vertical
xe = x + w, // x-end xe = x + w, // x-end
@ -234,7 +233,5 @@ PIXI.CanvasGraphics.renderGraphicsMask = function(graphics, context)
context.bezierCurveTo(xm - ox, ye, x, ym + oy, x, ym); context.bezierCurveTo(xm - ox, ye, x, ym + oy, x, ym);
context.closePath(); context.closePath();
} }
}
};
};
}

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

@ -2,7 +2,6 @@
* @author Mat Groves http://matgroves.com/ @Doormat23 * @author Mat Groves http://matgroves.com/ @Doormat23
*/ */
/** /**
* the CanvasRenderer draws the stage and all its content onto a 2d canvas. This renderer should be used for browsers that do not support webGL. * the CanvasRenderer draws the stage and all its content onto a 2d canvas. This renderer should be used for browsers that do not support webGL.
* Dont forget to add the view to your DOM or you will not see anything :) * Dont forget to add the view to your DOM or you will not see anything :)
@ -49,7 +48,7 @@ PIXI.CanvasRenderer = function(width, height, view, transparent)
* @property context * @property context
* @type Canvas 2d Context * @type Canvas 2d Context
*/ */
this.context = this.view.getContext("2d"); this.context = this.view.getContext( '2d' );
//some filter variables //some filter variables
this.smoothProperty = null; this.smoothProperty = null;
@ -72,7 +71,7 @@ PIXI.CanvasRenderer = function(width, height, view, transparent)
this.view.width = this.width; this.view.width = this.width;
this.view.height = this.height; this.view.height = this.height;
this.count = 0; this.count = 0;
} };
// constructor // constructor
PIXI.CanvasRenderer.prototype.constructor = PIXI.CanvasRenderer; PIXI.CanvasRenderer.prototype.constructor = PIXI.CanvasRenderer;
@ -85,7 +84,6 @@ PIXI.CanvasRenderer.prototype.constructor = PIXI.CanvasRenderer;
*/ */
PIXI.CanvasRenderer.prototype.render = function(stage) PIXI.CanvasRenderer.prototype.render = function(stage)
{ {
//stage.__childrenAdded = []; //stage.__childrenAdded = [];
//stage.__childrenRemoved = []; //stage.__childrenRemoved = [];
@ -97,10 +95,11 @@ PIXI.CanvasRenderer.prototype.render = function(stage)
stage.updateTransform(); stage.updateTransform();
// update the background color // update the background color
if(this.view.style.backgroundColor!=stage.backgroundColorString && !this.transparent)this.view.style.backgroundColor = stage.backgroundColorString; 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.setTransform(1,0,0,1,0,0);
this.context.clearRect(0, 0, this.width, this.height) this.context.clearRect(0, 0, this.width, this.height);
this.renderDisplayObject(stage); this.renderDisplayObject(stage);
//as //as
@ -120,9 +119,7 @@ PIXI.CanvasRenderer.prototype.render = function(stage)
{ {
PIXI.Texture.frameUpdates = []; PIXI.Texture.frameUpdates = [];
} }
};
}
/** /**
* resizes the canvas view to the specified width and height * resizes the canvas view to the specified width and height
@ -138,7 +135,7 @@ PIXI.CanvasRenderer.prototype.resize = function(width, height)
this.view.width = width; this.view.width = width;
this.view.height = height; this.view.height = height;
} };
/** /**
* Renders a display object * Renders a display object
@ -206,12 +203,12 @@ PIXI.CanvasRenderer.prototype.renderDisplayObject = function(displayObject)
} }
else if(displayObject instanceof PIXI.Strip) else if(displayObject instanceof PIXI.Strip)
{ {
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]);
this.renderStrip(displayObject); this.renderStrip(displayObject);
} }
else if(displayObject instanceof PIXI.TilingSprite) else if(displayObject instanceof PIXI.TilingSprite)
{ {
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]);
this.renderTilingSprite(displayObject); this.renderTilingSprite(displayObject);
} }
else if(displayObject instanceof PIXI.CustomRenderable) else if(displayObject instanceof PIXI.CustomRenderable)
@ -221,7 +218,7 @@ PIXI.CanvasRenderer.prototype.renderDisplayObject = function(displayObject)
} }
else if(displayObject instanceof PIXI.Graphics) else if(displayObject instanceof PIXI.Graphics)
{ {
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]);
PIXI.CanvasGraphics.renderGraphics(displayObject, context); PIXI.CanvasGraphics.renderGraphics(displayObject, context);
} }
else if(displayObject instanceof PIXI.FilterBlock) else if(displayObject instanceof PIXI.FilterBlock)
@ -237,7 +234,7 @@ PIXI.CanvasRenderer.prototype.renderDisplayObject = function(displayObject)
var cacheAlpha = mask.alpha; var cacheAlpha = mask.alpha;
var maskTransform = mask.worldTransform; var maskTransform = 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]);
mask.worldAlpha = 0.5; mask.worldAlpha = 0.5;
@ -253,20 +250,12 @@ PIXI.CanvasRenderer.prototype.renderDisplayObject = function(displayObject)
context.restore(); context.restore();
} }
} }
else
{
// only masks supported right now!
} }
} //count++
// count++
displayObject = displayObject._iNext; displayObject = displayObject._iNext;
} }
while(displayObject != testObject) while(displayObject !== testObject);
};
}
/** /**
* Renders a flat strip * Renders a flat strip
@ -279,7 +268,6 @@ PIXI.CanvasRenderer.prototype.renderStripFlat = function(strip)
{ {
var context = this.context; var context = this.context;
var verticies = strip.verticies; var verticies = strip.verticies;
var uvs = strip.uvs;
var length = verticies.length/2; var length = verticies.length/2;
this.count++; this.count++;
@ -287,7 +275,6 @@ PIXI.CanvasRenderer.prototype.renderStripFlat = function(strip)
context.beginPath(); context.beginPath();
for (var i=1; i < length-2; i++) for (var i=1; i < length-2; i++)
{ {
// draw some triangles! // draw some triangles!
var index = i*2; var index = i*2;
@ -297,13 +284,12 @@ PIXI.CanvasRenderer.prototype.renderStripFlat = function(strip)
context.moveTo(x0, y0); context.moveTo(x0, y0);
context.lineTo(x1, y1); context.lineTo(x1, y1);
context.lineTo(x2, y2); context.lineTo(x2, y2);
}
}; context.fillStyle = '#FF0000';
context.fillStyle = "#FF0000";
context.fill(); context.fill();
context.closePath(); context.closePath();
} };
/** /**
* Renders a tiling sprite * Renders a tiling sprite
@ -318,7 +304,8 @@ PIXI.CanvasRenderer.prototype.renderTilingSprite = function(sprite)
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();
@ -336,7 +323,7 @@ PIXI.CanvasRenderer.prototype.renderTilingSprite = function(sprite)
context.translate(-tilePosition.x, -tilePosition.y); context.translate(-tilePosition.x, -tilePosition.y);
context.closePath(); context.closePath();
} };
/** /**
* Renders a strip * Renders a strip
@ -355,9 +342,9 @@ PIXI.CanvasRenderer.prototype.renderStrip = function(strip)
var length = verticies.length/2; var length = verticies.length/2;
this.count++; this.count++;
for (var i=1; i < length-2; i++)
{
for (var i = 1; i < length-2; i++)
{
// draw some triangles! // draw some triangles!
var index = i*2; var index = i*2;
@ -367,7 +354,6 @@ PIXI.CanvasRenderer.prototype.renderStrip = function(strip)
var u0 = uvs[index] * strip.texture.width, u1 = uvs[index+2] * strip.texture.width, u2 = uvs[index+4]* strip.texture.width; 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 v0 = uvs[index+1]* strip.texture.height, v1 = uvs[index+3] * strip.texture.height, v2 = uvs[index+5]* strip.texture.height;
context.save(); context.save();
context.beginPath(); context.beginPath();
context.moveTo(x0, y0); context.moveTo(x0, y0);
@ -377,25 +363,20 @@ PIXI.CanvasRenderer.prototype.renderStrip = function(strip)
context.clip(); context.clip();
// Compute matrix transform // Compute matrix transform
var delta = u0*v1 + v0*u2 + u1*v2 - v1*u2 - v0*u1 - u0*v2; var delta = u0*v1 + v0*u2 + u1*v2 - v1*u2 - v0*u1 - u0*v2;
var delta_a = x0*v1 + v0*x2 + x1*v2 - v1*x2 - v0*x1 - x0*v2; var deltaA = x0*v1 + v0*x2 + x1*v2 - v1*x2 - v0*x1 - x0*v2;
var delta_b = u0*x1 + x0*u2 + u1*x2 - x1*u2 - x0*u1 - u0*x2; var deltaB = u0*x1 + x0*u2 + u1*x2 - x1*u2 - x0*u1 - u0*x2;
var delta_c = u0*v1*x2 + v0*x1*u2 + x0*u1*v2 - x0*v1*u2 - v0*u1*x2 - u0*x1*v2; var deltaC = u0*v1*x2 + v0*x1*u2 + x0*u1*v2 - x0*v1*u2 - v0*u1*x2 - u0*x1*v2;
var delta_d = y0*v1 + v0*y2 + y1*v2 - v1*y2 - v0*y1 - y0*v2; var deltaD = y0*v1 + v0*y2 + y1*v2 - v1*y2 - v0*y1 - y0*v2;
var delta_e = u0*y1 + y0*u2 + u1*y2 - y1*u2 - y0*u1 - u0*y2; var deltaE = u0*y1 + y0*u2 + u1*y2 - y1*u2 - y0*u1 - u0*y2;
var delta_f = u0*v1*y2 + v0*y1*u2 + y0*u1*v2 - y0*v1*u2 - v0*u1*y2 - u0*y1*v2; var deltaF = u0*v1*y2 + v0*y1*u2 + y0*u1*v2 - y0*v1*u2 - v0*u1*y2 - u0*y1*v2;
context.transform(deltaA / delta, deltaD / delta,
deltaB / delta, deltaE / delta,
deltaC / delta, deltaF / delta);
context.transform(delta_a/delta, delta_d/delta,
delta_b/delta, delta_e/delta,
delta_c/delta, delta_f/delta);
context.drawImage(strip.texture.baseTexture.source, 0, 0); context.drawImage(strip.texture.baseTexture.source, 0, 0);
context.restore(); context.restore();
}; }
};
}

89
src/pixi/renderers/webgl/PixiShader.js
View file

@ -12,26 +12,25 @@ PIXI.PixiShader = function()
/** /**
* @property {any} program - The WebGL program. * @property {any} program - The WebGL program.
*/ */
this.program; this.program = null;
/** /**
* @property {array} fragmentSrc - The fragment shader. * @property {array} fragmentSrc - The fragment shader.
*/ */
this.fragmentSrc = [ this.fragmentSrc = [
"precision lowp float;", 'precision lowp float;',
"varying vec2 vTextureCoord;", 'varying vec2 vTextureCoord;',
"varying float vColor;", 'varying float vColor;',
"uniform sampler2D uSampler;", 'uniform sampler2D uSampler;',
"void main(void) {", 'void main(void) {',
"gl_FragColor = texture2D(uSampler, vTextureCoord) * vColor;", ' gl_FragColor = texture2D(uSampler, vTextureCoord) * vColor;',
"}" '}'
]; ];
/** /**
* @property {number} textureCount - A local texture counter for multi-texture shaders. * @property {number} textureCount - A local texture counter for multi-texture shaders.
*/ */
this.textureCount = 0; this.textureCount = 0;
}; };
/** /**
@ -39,22 +38,22 @@ PIXI.PixiShader = function()
*/ */
PIXI.PixiShader.prototype.init = function() PIXI.PixiShader.prototype.init = function()
{ {
var program = PIXI.compileProgram(this.vertexSrc || PIXI.PixiShader.defaultVertexSrc, this.fragmentSrc) var program = PIXI.compileProgram(this.vertexSrc || PIXI.PixiShader.defaultVertexSrc, this.fragmentSrc);
var gl = PIXI.gl; var gl = PIXI.gl;
gl.useProgram(program); gl.useProgram(program);
// get and store the uniforms for the shader // get and store the uniforms for the shader
this.uSampler = gl.getUniformLocation(program, "uSampler"); this.uSampler = gl.getUniformLocation(program, 'uSampler');
this.projectionVector = gl.getUniformLocation(program, "projectionVector"); this.projectionVector = gl.getUniformLocation(program, 'projectionVector');
this.offsetVector = gl.getUniformLocation(program, "offsetVector"); this.offsetVector = gl.getUniformLocation(program, 'offsetVector');
this.dimensions = gl.getUniformLocation(program, "dimensions"); this.dimensions = gl.getUniformLocation(program, 'dimensions');
// get and store the attributes // get and store the attributes
this.aVertexPosition = gl.getAttribLocation(program, "aVertexPosition"); this.aVertexPosition = gl.getAttribLocation(program, 'aVertexPosition');
this.colorAttribute = gl.getAttribLocation(program, "aColor"); this.colorAttribute = gl.getAttribLocation(program, 'aColor');
this.aTextureCoord = gl.getAttribLocation(program, "aTextureCoord"); this.aTextureCoord = gl.getAttribLocation(program, 'aTextureCoord');
// add those custom shaders! // add those custom shaders!
for (var key in this.uniforms) for (var key in this.uniforms)
@ -83,10 +82,11 @@ PIXI.PixiShader.prototype.initUniforms = function()
for (var key in this.uniforms) for (var key in this.uniforms)
{ {
var uniform = this.uniforms[key]; uniform = this.uniforms[key];
var type = uniform.type; var type = uniform.type;
if (type == 'sampler2D') if (type === 'sampler2D')
{ {
uniform._init = false; uniform._init = false;
@ -95,21 +95,21 @@ PIXI.PixiShader.prototype.initUniforms = function()
this.initSampler2D(uniform); this.initSampler2D(uniform);
} }
} }
else if (type == 'mat2' || type == 'mat3' || type == 'mat4') else if (type === 'mat2' || type === 'mat3' || type === 'mat4')
{ {
// These require special handling // These require special handling
uniform.glMatrix = true; uniform.glMatrix = true;
uniform.glValueLength = 1; uniform.glValueLength = 1;
if (type == 'mat2') if (type === 'mat2')
{ {
uniform.glFunc = PIXI.gl.uniformMatrix2fv; uniform.glFunc = PIXI.gl.uniformMatrix2fv;
} }
else if (type == 'mat3') else if (type === 'mat3')
{ {
uniform.glFunc = PIXI.gl.uniformMatrix3fv; uniform.glFunc = PIXI.gl.uniformMatrix3fv;
} }
else if (type == 'mat4') else if (type === 'mat4')
{ {
uniform.glFunc = PIXI.gl.uniformMatrix4fv; uniform.glFunc = PIXI.gl.uniformMatrix4fv;
} }
@ -119,15 +119,15 @@ PIXI.PixiShader.prototype.initUniforms = function()
// GL function reference // GL function reference
uniform.glFunc = PIXI.gl['uniform' + type]; uniform.glFunc = PIXI.gl['uniform' + type];
if (type == '2f' || type == '2i') if (type === '2f' || type === '2i')
{ {
uniform.glValueLength = 2; uniform.glValueLength = 2;
} }
else if (type == '3f' || type == '3i') else if (type === '3f' || type === '3i')
{ {
uniform.glValueLength = 3; uniform.glValueLength = 3;
} }
else if (type == '4f' || type == '4i') else if (type === '4f' || type === '4i')
{ {
uniform.glValueLength = 4; uniform.glValueLength = 4;
} }
@ -229,7 +229,7 @@ PIXI.PixiShader.prototype.syncUniforms = function()
uniform = this.uniforms[key]; uniform = this.uniforms[key];
if (uniform.glValueLength == 1) if (uniform.glValueLength === 1)
{ {
if (uniform.glMatrix === true) if (uniform.glMatrix === true)
{ {
@ -240,19 +240,19 @@ PIXI.PixiShader.prototype.syncUniforms = function()
uniform.glFunc.call(PIXI.gl, uniform.uniformLocation, uniform.value); uniform.glFunc.call(PIXI.gl, uniform.uniformLocation, uniform.value);
} }
} }
else if (uniform.glValueLength == 2) else if (uniform.glValueLength === 2)
{ {
uniform.glFunc.call(PIXI.gl, uniform.uniformLocation, uniform.value.x, uniform.value.y); uniform.glFunc.call(PIXI.gl, uniform.uniformLocation, uniform.value.x, uniform.value.y);
} }
else if (uniform.glValueLength == 3) else if (uniform.glValueLength === 3)
{ {
uniform.glFunc.call(PIXI.gl, uniform.uniformLocation, uniform.value.x, uniform.value.y, uniform.value.z); uniform.glFunc.call(PIXI.gl, uniform.uniformLocation, uniform.value.x, uniform.value.y, uniform.value.z);
} }
else if (uniform.glValueLength == 4) else if (uniform.glValueLength === 4)
{ {
uniform.glFunc.call(PIXI.gl, uniform.uniformLocation, uniform.value.x, uniform.value.y, uniform.value.z, uniform.value.w); uniform.glFunc.call(PIXI.gl, uniform.uniformLocation, uniform.value.x, uniform.value.y, uniform.value.z, uniform.value.w);
} }
else if (uniform.type == 'sampler2D') else if (uniform.type === 'sampler2D')
{ {
if (uniform._init) if (uniform._init)
{ {
@ -271,22 +271,21 @@ PIXI.PixiShader.prototype.syncUniforms = function()
}; };
PIXI.PixiShader.defaultVertexSrc = [ PIXI.PixiShader.defaultVertexSrc = [
'attribute vec2 aVertexPosition;',
'attribute vec2 aTextureCoord;',
'attribute float aColor;',
"attribute vec2 aVertexPosition;", 'uniform vec2 projectionVector;',
"attribute vec2 aTextureCoord;", 'uniform vec2 offsetVector;',
"attribute float aColor;", 'varying vec2 vTextureCoord;',
"uniform vec2 projectionVector;", 'varying float vColor;',
"uniform vec2 offsetVector;",
"varying vec2 vTextureCoord;",
"varying float vColor;", 'const vec2 center = vec2(-1.0, 1.0);',
"const vec2 center = vec2(-1.0, 1.0);", 'void main(void) {',
' gl_Position = vec4( ((aVertexPosition + offsetVector) / projectionVector) + center , 0.0, 1.0);',
"void main(void) {", ' vTextureCoord = aTextureCoord;',
"gl_Position = vec4( ((aVertexPosition + offsetVector) / projectionVector) + center , 0.0, 1.0);", ' vColor = aColor;',
"vTextureCoord = aTextureCoord;", '}'
"vColor = aColor;",
"}"
]; ];

57
src/pixi/renderers/webgl/PrimitiveShader.js
View file

@ -6,33 +6,34 @@
PIXI.PrimitiveShader = function() PIXI.PrimitiveShader = function()
{ {
// the webGL program.. // the webGL program..
this.program; this.program = null;
this.fragmentSrc = [ this.fragmentSrc = [
"precision mediump float;", 'precision mediump float;',
"varying vec4 vColor;", 'varying vec4 vColor;',
"void main(void) {",
"gl_FragColor = vColor;", 'void main(void) {',
"}" ' gl_FragColor = vColor;',
'}'
]; ];
this.vertexSrc = [ this.vertexSrc = [
"attribute vec2 aVertexPosition;", 'attribute vec2 aVertexPosition;',
"attribute vec4 aColor;", 'attribute vec4 aColor;',
"uniform mat3 translationMatrix;", 'uniform mat3 translationMatrix;',
"uniform vec2 projectionVector;", 'uniform vec2 projectionVector;',
"uniform vec2 offsetVector;", 'uniform vec2 offsetVector;',
"uniform float alpha;", 'uniform float alpha;',
"varying vec4 vColor;", 'varying vec4 vColor;',
"void main(void) {",
"vec3 v = translationMatrix * vec3(aVertexPosition , 1.0);",
"v -= offsetVector.xyx;",
"gl_Position = vec4( v.x / projectionVector.x -1.0, v.y / -projectionVector.y + 1.0 , 0.0, 1.0);",
"vColor = aColor * alpha;",
"}"
];
} 'void main(void) {',
' vec3 v = translationMatrix * vec3(aVertexPosition , 1.0);',
' v -= offsetVector.xyx;',
' gl_Position = vec4( v.x / projectionVector.x -1.0, v.y / -projectionVector.y + 1.0 , 0.0, 1.0);',
' vColor = aColor * alpha;',
'}'
];
};
PIXI.PrimitiveShader.prototype.init = function() PIXI.PrimitiveShader.prototype.init = function()
{ {
@ -43,15 +44,15 @@ PIXI.PrimitiveShader.prototype.init = function()
gl.useProgram(program); gl.useProgram(program);
// get and store the uniforms for the shader // get and store the uniforms for the shader
this.projectionVector = gl.getUniformLocation(program, "projectionVector"); this.projectionVector = gl.getUniformLocation(program, 'projectionVector');
this.offsetVector = gl.getUniformLocation(program, "offsetVector"); this.offsetVector = gl.getUniformLocation(program, 'offsetVector');
// get and store the attributes // get and store the attributes
this.aVertexPosition = gl.getAttribLocation(program, "aVertexPosition"); this.aVertexPosition = gl.getAttribLocation(program, 'aVertexPosition');
this.colorAttribute = gl.getAttribLocation(program, "aColor"); this.colorAttribute = gl.getAttribLocation(program, 'aColor');
this.translationMatrix = gl.getUniformLocation(program, "translationMatrix"); this.translationMatrix = gl.getUniformLocation(program, 'translationMatrix');
this.alpha = gl.getUniformLocation(program, "alpha"); this.alpha = gl.getUniformLocation(program, 'alpha');
this.program = program; this.program = program;
} };

76
src/pixi/renderers/webgl/StripShader.js
View file

@ -6,60 +6,62 @@
PIXI.StripShader = function() PIXI.StripShader = function()
{ {
// the webGL program.. // the webGL program..
this.program; this.program = null;
this.fragmentSrc = [ this.fragmentSrc = [
"precision mediump float;", 'precision mediump float;',
"varying vec2 vTextureCoord;", 'varying vec2 vTextureCoord;',
"varying float vColor;", 'varying float vColor;',
"uniform float alpha;", 'uniform float alpha;',
"uniform sampler2D uSampler;", 'uniform sampler2D uSampler;',
"void main(void) {",
"gl_FragColor = texture2D(uSampler, vec2(vTextureCoord.x, vTextureCoord.y));", 'void main(void) {',
"gl_FragColor = gl_FragColor * alpha;", ' gl_FragColor = texture2D(uSampler, vec2(vTextureCoord.x, vTextureCoord.y));',
"}" ' gl_FragColor = gl_FragColor * alpha;',
'}'
]; ];
this.vertexSrc = [ this.vertexSrc = [
"attribute vec2 aVertexPosition;", 'attribute vec2 aVertexPosition;',
"attribute vec2 aTextureCoord;", 'attribute vec2 aTextureCoord;',
"attribute float aColor;", 'attribute float aColor;',
"uniform mat3 translationMatrix;", 'uniform mat3 translationMatrix;',
"uniform vec2 projectionVector;", 'uniform vec2 projectionVector;',
"varying vec2 vTextureCoord;", 'varying vec2 vTextureCoord;',
"varying vec2 offsetVector;", 'varying vec2 offsetVector;',
"varying float vColor;", 'varying float vColor;',
"void main(void) {",
"vec3 v = translationMatrix * vec3(aVertexPosition, 1.0);", 'void main(void) {',
"v -= offsetVector.xyx;", ' 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);", ' v -= offsetVector.xyx;',
"vTextureCoord = aTextureCoord;", ' gl_Position = vec4( v.x / projectionVector.x -1.0, v.y / projectionVector.y + 1.0 , 0.0, 1.0);',
"vColor = aColor;", ' vTextureCoord = aTextureCoord;',
"}" ' vColor = aColor;',
'}'
]; ];
} };
PIXI.StripShader.prototype.init = function() PIXI.StripShader.prototype.init = function()
{ {
var program = PIXI.compileProgram(this.vertexSrc, this.fragmentSrc) var program = PIXI.compileProgram(this.vertexSrc, this.fragmentSrc);
var gl = PIXI.gl; var gl = PIXI.gl;
gl.useProgram(program); gl.useProgram(program);
// get and store the uniforms for the shader // get and store the uniforms for the shader
this.uSampler = gl.getUniformLocation(program, "uSampler"); this.uSampler = gl.getUniformLocation(program, 'uSampler');
this.projectionVector = gl.getUniformLocation(program, "projectionVector"); this.projectionVector = gl.getUniformLocation(program, 'projectionVector');
this.offsetVector = gl.getUniformLocation(program, "offsetVector"); this.offsetVector = gl.getUniformLocation(program, 'offsetVector');
this.colorAttribute = gl.getAttribLocation(program, "aColor"); this.colorAttribute = gl.getAttribLocation(program, 'aColor');
//this.dimensions = gl.getUniformLocation(this.program, "dimensions"); //this.dimensions = gl.getUniformLocation(this.program, 'dimensions');
// get and store the attributes // get and store the attributes
this.aVertexPosition = gl.getAttribLocation(program, "aVertexPosition"); this.aVertexPosition = gl.getAttribLocation(program, 'aVertexPosition');
this.aTextureCoord = gl.getAttribLocation(program, "aTextureCoord"); this.aTextureCoord = gl.getAttribLocation(program, 'aTextureCoord');
this.translationMatrix = gl.getUniformLocation(program, "translationMatrix"); this.translationMatrix = gl.getUniformLocation(program, 'translationMatrix');
this.alpha = gl.getUniformLocation(program, "alpha"); this.alpha = gl.getUniformLocation(program, 'alpha');
this.program = program; this.program = program;
} };

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

@ -9,7 +9,7 @@ PIXI._batchs = [];
*/ */
PIXI._getBatch = function(gl) PIXI._getBatch = function(gl)
{ {
if(PIXI._batchs.length == 0) if(PIXI._batchs.length === 0)
{ {
return new PIXI.WebGLBatch(gl); return new PIXI.WebGLBatch(gl);
} }
@ -17,7 +17,7 @@ PIXI._getBatch = function(gl)
{ {
return PIXI._batchs.pop(); return PIXI._batchs.pop();
} }
} };
/** /**
* @private * @private
@ -26,7 +26,7 @@ PIXI._returnBatch = function(batch)
{ {
batch.clean(); batch.clean();
PIXI._batchs.push(batch); PIXI._batchs.push(batch);
} };
/** /**
* @private * @private
@ -36,8 +36,8 @@ PIXI._restoreBatchs = function(gl)
for (var i=0; i < PIXI._batchs.length; i++) for (var i=0; i < PIXI._batchs.length; i++)
{ {
PIXI._batchs[i].restoreLostContext(gl); PIXI._batchs[i].restoreLostContext(gl);
}; }
} };
/** /**
* A WebGLBatch Enables a group of sprites to be drawn using the same settings. * A WebGLBatch Enables a group of sprites to be drawn using the same settings.
@ -63,7 +63,7 @@ PIXI.WebGLBatch = function(gl)
this.colorBuffer = gl.createBuffer(); this.colorBuffer = gl.createBuffer();
this.blendMode = PIXI.blendModes.NORMAL; this.blendMode = PIXI.blendModes.NORMAL;
this.dynamicSize = 1; this.dynamicSize = 1;
} };
// constructor // constructor
PIXI.WebGLBatch.prototype.constructor = PIXI.WebGLBatch; PIXI.WebGLBatch.prototype.constructor = PIXI.WebGLBatch;
@ -83,9 +83,9 @@ PIXI.WebGLBatch.prototype.clean = function()
this.texture = null; this.texture = null;
this.last = null; this.last = null;
this.size = 0; this.size = 0;
this.head; this.head = null;
this.tail; this.tail = null;
} };
/** /**
* Recreates the buffers in the event of a context loss * Recreates the buffers in the event of a context loss
@ -100,7 +100,7 @@ PIXI.WebGLBatch.prototype.restoreLostContext = function(gl)
this.indexBuffer = gl.createBuffer(); this.indexBuffer = gl.createBuffer();
this.uvBuffer = gl.createBuffer(); this.uvBuffer = gl.createBuffer();
this.colorBuffer = gl.createBuffer(); this.colorBuffer = gl.createBuffer();
} };
/** /**
* inits the batch's texture and blend mode based if the supplied sprite * inits the batch's texture and blend mode based if the supplied sprite
@ -120,7 +120,7 @@ PIXI.WebGLBatch.prototype.init = function(sprite)
this.size = 1; this.size = 1;
this.growBatch(); this.growBatch();
} };
/** /**
* inserts a sprite before the specified sprite * inserts a sprite before the specified sprite
@ -148,7 +148,7 @@ PIXI.WebGLBatch.prototype.insertBefore = function(sprite, nextSprite)
{ {
this.head = sprite; this.head = sprite;
} }
} };
/** /**
* inserts a sprite after the specified sprite * inserts a sprite after the specified sprite
@ -175,9 +175,9 @@ PIXI.WebGLBatch.prototype.insertAfter = function(sprite, previousSprite)
} }
else else
{ {
this.tail = sprite this.tail = sprite;
} }
} };
/** /**
* removes a sprite from the batch * removes a sprite from the batch
@ -189,7 +189,7 @@ PIXI.WebGLBatch.prototype.remove = function(sprite)
{ {
this.size--; this.size--;
if(this.size == 0) if(this.size === 0)
{ {
sprite.batch = null; sprite.batch = null;
sprite.__prev = null; sprite.__prev = null;
@ -214,14 +214,14 @@ PIXI.WebGLBatch.prototype.remove = function(sprite)
else else
{ {
this.tail = sprite.__prev; this.tail = sprite.__prev;
this.tail.__next = null this.tail.__next = null;
} }
sprite.batch = null; sprite.batch = null;
sprite.__next = null; sprite.__next = null;
sprite.__prev = null; sprite.__prev = null;
this.dirty = true; this.dirty = true;
} };
/** /**
* Splits the batch into two with the specified sprite being the start of the new batch. * Splits the batch into two with the specified sprite being the start of the new batch.
@ -262,7 +262,7 @@ PIXI.WebGLBatch.prototype.split = function(sprite)
this.size -= tempSize; this.size -= tempSize;
return batch; return batch;
} };
/** /**
* Merges two batchs together * Merges two batchs together
@ -287,7 +287,7 @@ PIXI.WebGLBatch.prototype.merge = function(batch)
sprite.batch = this; sprite.batch = this;
sprite = sprite.__next; sprite = sprite.__next;
} }
} };
/** /**
* Grows the size of the batch. As the elements in the batch cannot have a dynamic size this * Grows the size of the batch. As the elements in the batch cannot have a dynamic size this
@ -299,14 +299,15 @@ PIXI.WebGLBatch.prototype.merge = function(batch)
PIXI.WebGLBatch.prototype.growBatch = function() PIXI.WebGLBatch.prototype.growBatch = function()
{ {
var gl = this.gl; var gl = this.gl;
if( this.size == 1) if( this.size === 1)
{ {
this.dynamicSize = 1; this.dynamicSize = 1;
} }
else else
{ {
this.dynamicSize = this.size * 1.5 this.dynamicSize = this.size * 1.5;
} }
// grow verts // grow verts
this.verticies = new Float32Array(this.dynamicSize * 8); this.verticies = new Float32Array(this.dynamicSize * 8);
@ -328,7 +329,7 @@ PIXI.WebGLBatch.prototype.growBatch = function()
this.indices = new Uint16Array(this.dynamicSize * 6); this.indices = new Uint16Array(this.dynamicSize * 6);
var length = this.indices.length/6; var length = this.indices.length/6;
for (var i=0; i < length; i++) for (var i = 0; i < length; i++)
{ {
var index2 = i * 6; var index2 = i * 6;
var index3 = i * 4; var index3 = i * 4;
@ -338,11 +339,11 @@ PIXI.WebGLBatch.prototype.growBatch = function()
this.indices[index2 + 3] = index3 + 0; this.indices[index2 + 3] = index3 + 0;
this.indices[index2 + 4] = index3 + 2; this.indices[index2 + 4] = index3 + 2;
this.indices[index2 + 5] = index3 + 3; 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); gl.bufferData(gl.ELEMENT_ARRAY_BUFFER, this.indices, gl.STATIC_DRAW);
} };
/** /**
* Refresh's all the data in the batch and sync's it with the webGL buffers * Refresh's all the data in the batch and sync's it with the webGL buffers
@ -351,16 +352,13 @@ PIXI.WebGLBatch.prototype.growBatch = function()
*/ */
PIXI.WebGLBatch.prototype.refresh = function() PIXI.WebGLBatch.prototype.refresh = function()
{ {
var gl = this.gl;
if (this.dynamicSize < this.size) if (this.dynamicSize < this.size)
{ {
this.growBatch(); this.growBatch();
} }
var indexRun = 0; var indexRun = 0;
var worldTransform, width, height, aX, aY, w0, w1, h0, h1, index; var index, colorIndex;
var a, b, c, d, tx, ty;
var displayObject = this.head; var displayObject = this.head;
@ -393,12 +391,12 @@ PIXI.WebGLBatch.prototype.refresh = function()
displayObject = displayObject.__next; displayObject = displayObject.__next;
indexRun ++; indexRun++;
} }
this.dirtyUVS = true; this.dirtyUVS = true;
this.dirtyColors = true; this.dirtyColors = true;
} };
/** /**
* Updates all the relevant geometry and uploads the data to the GPU * Updates all the relevant geometry and uploads the data to the GPU
@ -407,8 +405,7 @@ PIXI.WebGLBatch.prototype.refresh = function()
*/ */
PIXI.WebGLBatch.prototype.update = function() PIXI.WebGLBatch.prototype.update = function()
{ {
var gl = this.gl; var worldTransform, width, height, aX, aY, w0, w1, h0, h1, index;
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;
@ -484,7 +481,7 @@ PIXI.WebGLBatch.prototype.update = function()
} }
// TODO this probably could do with some optimisation.... // TODO this probably could do with some optimisation....
if(displayObject.cacheAlpha != displayObject.worldAlpha) if(displayObject.cacheAlpha !== displayObject.worldAlpha)
{ {
displayObject.cacheAlpha = displayObject.worldAlpha; displayObject.cacheAlpha = displayObject.worldAlpha;
@ -503,7 +500,7 @@ PIXI.WebGLBatch.prototype.update = function()
indexRun++; indexRun++;
displayObject = displayObject.__next; displayObject = displayObject.__next;
} }
} };
/** /**
* Draws the batch to the frame buffer * Draws the batch to the frame buffer
@ -514,7 +511,8 @@ PIXI.WebGLBatch.prototype.render = function(start, end)
{ {
start = start || 0; start = start || 0;
if(end == undefined)end = this.size; if(end === undefined)
end = this.size;
if(this.dirty) if(this.dirty)
{ {
@ -522,7 +520,7 @@ PIXI.WebGLBatch.prototype.render = function(start, end)
this.dirty = false; this.dirty = false;
} }
if (this.size == 0)return; if (this.size === 0)return;
this.update(); this.update();
var gl = this.gl; var gl = this.gl;
@ -536,7 +534,7 @@ PIXI.WebGLBatch.prototype.render = function(start, end)
// update the verts.. // update the verts..
gl.bindBuffer(gl.ARRAY_BUFFER, this.vertexBuffer); gl.bindBuffer(gl.ARRAY_BUFFER, this.vertexBuffer);
// ok.. // ok..
gl.bufferSubData(gl.ARRAY_BUFFER, 0, this.verticies) gl.bufferSubData(gl.ARRAY_BUFFER, 0, this.verticies);
gl.vertexAttribPointer(shaderProgram.aVertexPosition, 2, gl.FLOAT, false, 0, 0); gl.vertexAttribPointer(shaderProgram.aVertexPosition, 2, gl.FLOAT, false, 0, 0);
// update the uvs // update the uvs
//var isDefault = (shaderProgram == PIXI.shaderProgram) //var isDefault = (shaderProgram == PIXI.shaderProgram)
@ -571,4 +569,4 @@ PIXI.WebGLBatch.prototype.render = function(start, end)
// DRAW THAT this! // DRAW THAT this!
gl.drawElements(gl.TRIANGLES, len * 6, gl.UNSIGNED_SHORT, start * 2 * 6 ); gl.drawElements(gl.TRIANGLES, len * 6, gl.UNSIGNED_SHORT, start * 2 * 6 );
} };

61
src/pixi/renderers/webgl/WebGLFilterManager.js
View file

@ -14,7 +14,7 @@ PIXI.WebGLFilterManager = function(transparent)
this.offsetY = 0; this.offsetY = 0;
this.initShaderBuffers(); this.initShaderBuffers();
} };
// API // API
@ -23,7 +23,7 @@ PIXI.WebGLFilterManager.prototype.begin = function(projection, buffer)
this.width = projection.x * 2; this.width = projection.x * 2;
this.height = -projection.y * 2; this.height = -projection.y * 2;
this.buffer = buffer; this.buffer = buffer;
} };
PIXI.WebGLFilterManager.prototype.pushFilter = function(filterBlock) PIXI.WebGLFilterManager.prototype.pushFilter = function(filterBlock)
{ {
@ -35,15 +35,9 @@ PIXI.WebGLFilterManager.prototype.pushFilter = function(filterBlock)
var filter = filterBlock.filterPasses[0]; var filter = filterBlock.filterPasses[0];
this.offsetX += filterBlock.target.filterArea.x; this.offsetX += filterBlock.target.filterArea.x;
this.offsetY += filterBlock.target.filterArea.y; this.offsetY += filterBlock.target.filterArea.y;
var texture = this.texturePool.pop(); var texture = this.texturePool.pop();
if(!texture) if(!texture)
{ {
@ -75,11 +69,10 @@ PIXI.WebGLFilterManager.prototype.pushFilter = function(filterBlock)
if(filterArea.y < 0)filterArea.y = 0; if(filterArea.y < 0)filterArea.y = 0;
if(filterArea.height > this.height)filterArea.height = this.height; if(filterArea.height > this.height)filterArea.height = this.height;
//gl.texImage2D(gl.TEXTURE_2D, 0, gl.RGBA, filterArea.width, filterArea.height, 0, gl.RGBA, gl.UNSIGNED_BYTE, null); //gl.texImage2D(gl.TEXTURE_2D, 0, gl.RGBA, filterArea.width, filterArea.height, 0, gl.RGBA, gl.UNSIGNED_BYTE, null);
gl.bindFramebuffer(gl.FRAMEBUFFER, texture.frameBuffer); gl.bindFramebuffer(gl.FRAMEBUFFER, texture.frameBuffer);
// console.log(filterArea) //console.log(filterArea)
// set view port // set view port
gl.viewport(0, 0, filterArea.width, filterArea.height); gl.viewport(0, 0, filterArea.width, filterArea.height);
@ -103,20 +96,14 @@ PIXI.WebGLFilterManager.prototype.pushFilter = function(filterBlock)
filterBlock._glFilterTexture = texture; filterBlock._glFilterTexture = texture;
//console.log("PUSH") //console.log("PUSH")
} };
PIXI.WebGLFilterManager.prototype.popFilter = function() PIXI.WebGLFilterManager.prototype.popFilter = function()
{ {
var gl = PIXI.gl; var gl = PIXI.gl;
var filterBlock = this.filterStack.pop(); var filterBlock = this.filterStack.pop();
var filterArea = filterBlock.target.filterArea; var filterArea = filterBlock.target.filterArea;
var texture = filterBlock._glFilterTexture; var texture = filterBlock._glFilterTexture;
if(filterBlock.filterPasses.length > 1) if(filterBlock.filterPasses.length > 1)
@ -137,10 +124,8 @@ PIXI.WebGLFilterManager.prototype.popFilter = function()
this.vertexArray[6] = filterArea.width; this.vertexArray[6] = filterArea.width;
this.vertexArray[7] = 0; this.vertexArray[7] = 0;
gl.bufferSubData(gl.ARRAY_BUFFER, 0, this.vertexArray); gl.bufferSubData(gl.ARRAY_BUFFER, 0, this.vertexArray);
gl.bindBuffer(gl.ARRAY_BUFFER, this.uvBuffer); gl.bindBuffer(gl.ARRAY_BUFFER, this.uvBuffer);
// nnow set the uvs.. // nnow set the uvs..
this.uvArray[2] = filterArea.width/this.width; this.uvArray[2] = filterArea.width/this.width;
@ -178,8 +163,7 @@ PIXI.WebGLFilterManager.prototype.popFilter = function()
var temp = inputTexture; var temp = inputTexture;
inputTexture = outputTexture; inputTexture = outputTexture;
outputTexture = temp; outputTexture = temp;
}
};
gl.enable(gl.BLEND); gl.enable(gl.BLEND);
@ -209,7 +193,7 @@ PIXI.WebGLFilterManager.prototype.popFilter = function()
else else
{ {
var currentFilter = this.filterStack[this.filterStack.length-1]; var currentFilter = this.filterStack[this.filterStack.length-1];
var filterArea = currentFilter.target.filterArea; filterArea = currentFilter.target.filterArea;
sizeX = filterArea.width; sizeX = filterArea.width;
sizeY = filterArea.height; sizeY = filterArea.height;
@ -229,8 +213,8 @@ PIXI.WebGLFilterManager.prototype.popFilter = function()
PIXI.offset.x = offsetX; PIXI.offset.x = offsetX;
PIXI.offset.y = offsetY; PIXI.offset.y = offsetY;
filterArea = filterBlock.target.filterArea;
var filterArea = filterBlock.target.filterArea;
var x = filterArea.x-offsetX; var x = filterArea.x-offsetX;
var y = filterArea.y-offsetY; var y = filterArea.y-offsetY;
@ -281,16 +265,17 @@ PIXI.WebGLFilterManager.prototype.popFilter = function()
// return the texture to the pool // return the texture to the pool
this.texturePool.push(texture); this.texturePool.push(texture);
filterBlock._glFilterTexture = null; filterBlock._glFilterTexture = null;
} };
PIXI.WebGLFilterManager.prototype.applyFilterPass = function(filter, filterArea, width, height) PIXI.WebGLFilterManager.prototype.applyFilterPass = function(filter, filterArea, width, height)
{ {
// use program // use program
var gl = PIXI.gl; var gl = PIXI.gl;
var shader = filter.shader;
if(!filter.shader) if(!shader)
{ {
var shader = new PIXI.PixiShader(); shader = new PIXI.PixiShader();
shader.fragmentSrc = filter.fragmentSrc; shader.fragmentSrc = filter.fragmentSrc;
shader.uniforms = filter.uniforms; shader.uniforms = filter.uniforms;
@ -299,13 +284,11 @@ PIXI.WebGLFilterManager.prototype.applyFilterPass = function(filter, filterArea,
filter.shader = shader; filter.shader = shader;
} }
var shader = filter.shader;
// set the shader // set the shader
gl.useProgram(shader.program); gl.useProgram(shader.program);
gl.uniform2f(shader.projectionVector, width/2, -height/2); gl.uniform2f(shader.projectionVector, width/2, -height/2);
gl.uniform2f(shader.offsetVector, 0,0) gl.uniform2f(shader.offsetVector, 0,0);
if(filter.uniforms.dimensions) if(filter.uniforms.dimensions)
{ {
@ -329,7 +312,7 @@ PIXI.WebGLFilterManager.prototype.applyFilterPass = function(filter, filterArea,
// draw the filter... // draw the filter...
gl.drawElements(gl.TRIANGLES, 6, gl.UNSIGNED_SHORT, 0 ); gl.drawElements(gl.TRIANGLES, 6, gl.UNSIGNED_SHORT, 0 );
} };
PIXI.WebGLFilterManager.prototype.initShaderBuffers = function() PIXI.WebGLFilterManager.prototype.initShaderBuffers = function()
{ {
@ -372,12 +355,12 @@ PIXI.WebGLFilterManager.prototype.initShaderBuffers = function()
gl.ELEMENT_ARRAY_BUFFER, gl.ELEMENT_ARRAY_BUFFER,
new Uint16Array([0, 1, 2, 1, 3, 2]), new Uint16Array([0, 1, 2, 1, 3, 2]),
gl.STATIC_DRAW); gl.STATIC_DRAW);
} };
PIXI.WebGLFilterManager.prototype.getBounds = function(displayObject) PIXI.WebGLFilterManager.prototype.getBounds = function(displayObject)
{ {
// time to get the width and height of the object! // time to get the width and height of the object!
var worldTransform, width, height, aX, aY, w0, w1, h0, h1, index, doTest; var worldTransform, width, height, aX, aY, w0, w1, h0, h1, doTest;
var a, b, c, d, tx, ty, x1, x2, x3, x4, y1, y2, y3, y4; var a, b, c, d, tx, ty, x1, x2, x3, x4, y1, y2, y3, y4;
var tempObject = displayObject.first; var tempObject = displayObject.first;
@ -420,10 +403,10 @@ PIXI.WebGLFilterManager.prototype.getBounds = function(displayObject)
width = bounds.width; width = bounds.width;
height = bounds.height; height = bounds.height;
w0 = bounds.x w0 = bounds.x;
w1 = bounds.x + bounds.width; w1 = bounds.x + bounds.width;
h0 = bounds.y h0 = bounds.y;
h1 = bounds.y + bounds.height; h1 = bounds.y + bounds.height;
doTest = true; doTest = true;
@ -478,7 +461,7 @@ PIXI.WebGLFilterManager.prototype.getBounds = function(displayObject)
tempObject = tempObject._iNext; tempObject = tempObject._iNext;
} }
while(tempObject != testObject) while(tempObject !== testObject);
// maximum bounds is the size of the screen.. // maximum bounds is the size of the screen..
//minX = minX > 0 ? minX : 0; //minX = minX > 0 ? minX : 0;
@ -490,7 +473,7 @@ PIXI.WebGLFilterManager.prototype.getBounds = function(displayObject)
// console.log(maxX+ " : " + minX) // console.log(maxX+ " : " + minX)
displayObject.filterArea.width = maxX - minX; displayObject.filterArea.width = maxX - minX;
displayObject.filterArea.height = maxY - minY; displayObject.filterArea.height = maxY - minY;
} };
PIXI.FilterTexture = function(width, height) PIXI.FilterTexture = function(width, height)
{ {
@ -511,11 +494,11 @@ PIXI.FilterTexture = function(width, height)
gl.framebufferTexture2D(gl.FRAMEBUFFER, gl.COLOR_ATTACHMENT0, gl.TEXTURE_2D, this.texture, 0); gl.framebufferTexture2D(gl.FRAMEBUFFER, gl.COLOR_ATTACHMENT0, gl.TEXTURE_2D, this.texture, 0);
this.resize(width, height); this.resize(width, height);
} };
PIXI.FilterTexture.prototype.resize = function(width, height) PIXI.FilterTexture.prototype.resize = function(width, height)
{ {
if(this.width == width && this.height == height)return; if(this.width === width && this.height === height) return;
this.width = width; this.width = width;
this.height = height; this.height = height;
@ -525,4 +508,4 @@ PIXI.FilterTexture.prototype.resize = function(width, height)
gl.bindTexture(gl.TEXTURE_2D, this.texture); gl.bindTexture(gl.TEXTURE_2D, this.texture);
gl.texImage2D(gl.TEXTURE_2D, 0, gl.RGBA, width, height, 0, gl.RGBA, gl.UNSIGNED_BYTE, null); gl.texImage2D(gl.TEXTURE_2D, 0, gl.RGBA, width, height, 0, gl.RGBA, gl.UNSIGNED_BYTE, null);
} };

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

@ -10,7 +10,7 @@
PIXI.WebGLGraphics = function() PIXI.WebGLGraphics = function()
{ {
} };
/** /**
* Renders the graphics object * Renders the graphics object
@ -75,10 +75,9 @@ PIXI.WebGLGraphics.renderGraphics = function(graphics, projection)
PIXI.deactivatePrimitiveShader(); PIXI.deactivatePrimitiveShader();
// return to default shader... // return to default shader...
// PIXI.activateShader(PIXI.defaultShader); // PIXI.activateShader(PIXI.defaultShader);
} };
/** /**
* Updates the graphics object * Updates the graphics object
@ -90,11 +89,11 @@ PIXI.WebGLGraphics.renderGraphics = function(graphics, projection)
*/ */
PIXI.WebGLGraphics.updateGraphics = function(graphics) PIXI.WebGLGraphics.updateGraphics = function(graphics)
{ {
for (var i=graphics._webGL.lastIndex; i < graphics.graphicsData.length; i++) for (var i = graphics._webGL.lastIndex; i < graphics.graphicsData.length; i++)
{ {
var data = graphics.graphicsData[i]; var data = graphics.graphicsData[i];
if(data.type == PIXI.Graphics.POLY) if(data.type === PIXI.Graphics.POLY)
{ {
if(data.fill) if(data.fill)
{ {
@ -107,15 +106,15 @@ PIXI.WebGLGraphics.updateGraphics = function(graphics)
PIXI.WebGLGraphics.buildLine(data, graphics._webGL); PIXI.WebGLGraphics.buildLine(data, graphics._webGL);
} }
} }
else if(data.type == PIXI.Graphics.RECT) else if(data.type === PIXI.Graphics.RECT)
{ {
PIXI.WebGLGraphics.buildRectangle(data, graphics._webGL); PIXI.WebGLGraphics.buildRectangle(data, graphics._webGL);
} }
else if(data.type == PIXI.Graphics.CIRC || data.type == PIXI.Graphics.ELIP) else if(data.type === PIXI.Graphics.CIRC || data.type === PIXI.Graphics.ELIP);
{ {
PIXI.WebGLGraphics.buildCircle(data, graphics._webGL); PIXI.WebGLGraphics.buildCircle(data, graphics._webGL);
} }
}; }
graphics._webGL.lastIndex = graphics.graphicsData.length; graphics._webGL.lastIndex = graphics.graphicsData.length;
@ -130,7 +129,7 @@ PIXI.WebGLGraphics.updateGraphics = function(graphics)
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); gl.bufferData(gl.ELEMENT_ARRAY_BUFFER, graphics._webGL.glIndicies, gl.STATIC_DRAW);
} };
/** /**
* Builds a rectangle to draw * Builds a rectangle to draw
@ -155,7 +154,7 @@ PIXI.WebGLGraphics.buildRectangle = function(graphicsData, webGLData)
if(graphicsData.fill) if(graphicsData.fill)
{ {
var color = HEXtoRGB(graphicsData.fillColor); var color = PIXI.hex2rgb(graphicsData.fillColor);
var alpha = graphicsData.fillAlpha; var alpha = graphicsData.fillAlpha;
var r = color[0] * alpha; var r = color[0] * alpha;
@ -181,7 +180,7 @@ PIXI.WebGLGraphics.buildRectangle = function(graphicsData, webGLData)
verts.push(r, g, b, alpha); verts.push(r, g, b, alpha);
// insert 2 dead triangles.. // insert 2 dead triangles..
indices.push(vertPos, vertPos, vertPos+1, vertPos+2, vertPos+3, vertPos+3) indices.push(vertPos, vertPos, vertPos+1, vertPos+2, vertPos+3, vertPos+3);
} }
if(graphicsData.lineWidth) if(graphicsData.lineWidth)
@ -194,8 +193,7 @@ PIXI.WebGLGraphics.buildRectangle = function(graphicsData, webGLData)
PIXI.WebGLGraphics.buildLine(graphicsData, webGLData); PIXI.WebGLGraphics.buildLine(graphicsData, webGLData);
} }
};
}
/** /**
* Builds a circle to draw * Builds a circle to draw
@ -220,9 +218,11 @@ PIXI.WebGLGraphics.buildCircle = function(graphicsData, webGLData)
var totalSegs = 40; var totalSegs = 40;
var seg = (Math.PI * 2) / totalSegs ; var seg = (Math.PI * 2) / totalSegs ;
var i = 0;
if(graphicsData.fill) if(graphicsData.fill)
{ {
var color = HEXtoRGB(graphicsData.fillColor); var color = PIXI.hex2rgb(graphicsData.fillColor);
var alpha = graphicsData.fillAlpha; var alpha = graphicsData.fillAlpha;
var r = color[0] * alpha; var r = color[0] * alpha;
@ -236,7 +236,7 @@ PIXI.WebGLGraphics.buildCircle = function(graphicsData, webGLData)
indices.push(vecPos); indices.push(vecPos);
for (var i=0; i < totalSegs + 1 ; i++) for (i = 0; i < totalSegs + 1 ; i++)
{ {
verts.push(x,y, r, g, b, alpha); verts.push(x,y, r, g, b, alpha);
@ -245,7 +245,7 @@ PIXI.WebGLGraphics.buildCircle = function(graphicsData, webGLData)
r, g, b, alpha); r, g, b, alpha);
indices.push(vecPos++, vecPos++); indices.push(vecPos++, vecPos++);
}; }
indices.push(vecPos-1); indices.push(vecPos-1);
} }
@ -254,16 +254,15 @@ PIXI.WebGLGraphics.buildCircle = function(graphicsData, webGLData)
{ {
graphicsData.points = []; graphicsData.points = [];
for (var i=0; i < totalSegs + 1; i++) for (i = 0; i < totalSegs + 1; i++)
{ {
graphicsData.points.push(x + Math.sin(seg * i) * width, graphicsData.points.push(x + Math.sin(seg * i) * width,
y + Math.cos(seg * i) * height) y + Math.cos(seg * i) * height);
}; }
PIXI.WebGLGraphics.buildLine(graphicsData, webGLData); PIXI.WebGLGraphics.buildLine(graphicsData, webGLData);
} }
};
}
/** /**
* Builds a line to draw * Builds a line to draw
@ -277,17 +276,17 @@ PIXI.WebGLGraphics.buildCircle = function(graphicsData, webGLData)
PIXI.WebGLGraphics.buildLine = function(graphicsData, webGLData) PIXI.WebGLGraphics.buildLine = function(graphicsData, webGLData)
{ {
// TODO OPTIMISE! // TODO OPTIMISE!
var i = 0;
var wrap = true;
var points = graphicsData.points; var points = graphicsData.points;
if(points.length == 0)return; if(points.length === 0)return;
// if the line width is an odd number add 0.5 to align to a whole pixel // if the line width is an odd number add 0.5 to align to a whole pixel
if(graphicsData.lineWidth%2) if(graphicsData.lineWidth%2)
{ {
for (var i = 0; i < points.length; i++) { for (i = 0; i < points.length; i++) {
points[i] += 0.5; points[i] += 0.5;
}; }
} }
// get first and last point.. figure out the middle! // get first and last point.. figure out the middle!
@ -295,7 +294,7 @@ PIXI.WebGLGraphics.buildLine = function(graphicsData, webGLData)
var lastPoint = new PIXI.Point( points[points.length - 2], points[points.length - 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 the first point is the last point - goona have issues :)
if(firstPoint.x == lastPoint.x && firstPoint.y == lastPoint.y) if(firstPoint.x === lastPoint.x && firstPoint.y === lastPoint.y)
{ {
points.pop(); points.pop();
points.pop(); points.pop();
@ -306,7 +305,7 @@ PIXI.WebGLGraphics.buildLine = function(graphicsData, webGLData)
var midPointY = lastPoint.y + (firstPoint.y - lastPoint.y) *0.5; var midPointY = lastPoint.y + (firstPoint.y - lastPoint.y) *0.5;
points.unshift(midPointX, midPointY); points.unshift(midPointX, midPointY);
points.push(midPointX, midPointY) points.push(midPointX, midPointY);
} }
var verts = webGLData.points; var verts = webGLData.points;
@ -319,15 +318,14 @@ PIXI.WebGLGraphics.buildLine = function(graphicsData, webGLData)
var width = graphicsData.lineWidth / 2; var width = graphicsData.lineWidth / 2;
// sort color // sort color
var color = HEXtoRGB(graphicsData.lineColor); var color = PIXI.hex2rgb(graphicsData.lineColor);
var alpha = graphicsData.lineAlpha; var alpha = graphicsData.lineAlpha;
var r = color[0] * alpha; var r = color[0] * alpha;
var g = color[1] * alpha; var g = color[1] * alpha;
var b = color[2] * alpha; var b = color[2] * alpha;
var p1x, p1y, p2x, p2y, p3x, p3y; var px, py, p1x, p1y, p2x, p2y, p3x, p3y;
var perpx, perpy, perp2x, perp2y, perp3x, perp3y; var perpx, perpy, perp2x, perp2y, perp3x, perp3y;
var ipx, ipy;
var a1, b1, c1, a2, b2, c2; var a1, b1, c1, a2, b2, c2;
var denom, pdist, dist; var denom, pdist, dist;
@ -354,13 +352,13 @@ PIXI.WebGLGraphics.buildLine = function(graphicsData, webGLData)
verts.push(p1x + perpx , p1y + perpy, verts.push(p1x + perpx , p1y + perpy,
r, g, b, alpha); r, g, b, alpha);
for (var i = 1; i < length-1; i++) for (i = 1; i < length-1; i++)
{ {
p1x = points[(i-1)*2]; p1x = points[(i-1)*2];
p1y = points[(i-1)*2 + 1]; p1y = points[(i-1)*2 + 1];
p2x = points[(i)*2] p2x = points[(i)*2];
p2y = points[(i)*2 + 1] p2y = points[(i)*2 + 1];
p3x = points[(i+1)*2]; p3x = points[(i+1)*2];
p3y = points[(i+1)*2 + 1]; p3y = points[(i+1)*2 + 1];
@ -445,13 +443,13 @@ PIXI.WebGLGraphics.buildLine = function(graphicsData, webGLData)
} }
} }
p1x = points[(length-2)*2] p1x = points[(length-2)*2];
p1y = points[(length-2)*2 + 1] p1y = points[(length-2)*2 + 1];
p2x = points[(length-1)*2] p2x = points[(length-1)*2];
p2y = points[(length-1)*2 + 1] p2y = points[(length-1)*2 + 1];
perpx = -(p1y - p2y) perpx = -(p1y - p2y);
perpy = p1x - p2x; perpy = p1x - p2x;
dist = Math.sqrt(perpx*perpx + perpy*perpy); dist = Math.sqrt(perpx*perpx + perpy*perpy);
@ -460,21 +458,21 @@ PIXI.WebGLGraphics.buildLine = function(graphicsData, webGLData)
perpx *= width; perpx *= width;
perpy *= width; perpy *= width;
verts.push(p2x - perpx , p2y - perpy) verts.push(p2x - perpx , p2y - perpy);
verts.push(r, g, b, alpha); verts.push(r, g, b, alpha);
verts.push(p2x + perpx , p2y + perpy) verts.push(p2x + perpx , p2y + perpy);
verts.push(r, g, b, alpha); verts.push(r, g, b, alpha);
indices.push(indexStart); indices.push(indexStart);
for (var i=0; i < indexCount; i++) for (i = 0; i < indexCount; i++)
{ {
indices.push(indexStart++); indices.push(indexStart++);
}; }
indices.push(indexStart-1); indices.push(indexStart-1);
} };
/** /**
* Builds a polygon to draw * Builds a polygon to draw
@ -497,7 +495,7 @@ PIXI.WebGLGraphics.buildPoly = function(graphicsData, webGLData)
var length = points.length / 2; var length = points.length / 2;
// sort color // sort color
var color = HEXtoRGB(graphicsData.fillColor); var color = PIXI.hex2rgb(graphicsData.fillColor);
var alpha = graphicsData.fillAlpha; var alpha = graphicsData.fillAlpha;
var r = color[0] * alpha; var r = color[0] * alpha;
var g = color[1] * alpha; var g = color[1] * alpha;
@ -507,26 +505,20 @@ PIXI.WebGLGraphics.buildPoly = function(graphicsData, webGLData)
var vertPos = verts.length / 6; var vertPos = verts.length / 6;
for (var i=0; i < triangles.length; i+=3) var i = 0;
for (i = 0; i < triangles.length; i+=3)
{ {
indices.push(triangles[i] + vertPos); indices.push(triangles[i] + vertPos);
indices.push(triangles[i] + vertPos); indices.push(triangles[i] + vertPos);
indices.push(triangles[i+1] + vertPos); indices.push(triangles[i+1] + vertPos);
indices.push(triangles[i+2] +vertPos); indices.push(triangles[i+2] +vertPos);
indices.push(triangles[i+2] + vertPos); indices.push(triangles[i+2] + vertPos);
}; }
for (var i = 0; i < length; i++) for (i = 0; i < length; i++)
{ {
verts.push(points[i * 2], points[i * 2 + 1], verts.push(points[i * 2], points[i * 2 + 1],
r, g, b, alpha); r, g, b, alpha);
}; }
} };
function HEXtoRGB(hex) {
return [(hex >> 16 & 0xFF) / 255, ( hex >> 8 & 0xFF) / 255, (hex & 0xFF)/ 255];
}

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

@ -18,16 +18,16 @@
PIXI.WebGLRenderGroup = function(gl, transparent) PIXI.WebGLRenderGroup = function(gl, transparent)
{ {
this.gl = gl; this.gl = gl;
this.root; this.root = null;
this.backgroundColor; this.backgroundColor = undefined;
this.transparent = transparent == undefined ? true : transparent; this.transparent = transparent === undefined ? true : transparent;
this.batchs = []; this.batchs = [];
this.toRemove = []; this.toRemove = [];
console.log(this.transparent) //console.log(this.transparent);
this.filterManager = new PIXI.WebGLFilterManager(this.transparent); this.filterManager = new PIXI.WebGLFilterManager(this.transparent);
} };
// constructor // constructor
PIXI.WebGLRenderGroup.prototype.constructor = PIXI.WebGLRenderGroup; PIXI.WebGLRenderGroup.prototype.constructor = PIXI.WebGLRenderGroup;
@ -52,7 +52,7 @@ PIXI.WebGLRenderGroup.prototype.setRenderable = function(displayObject)
// TODO what if its already has an object? should remove it // TODO what if its already has an object? should remove it
this.root = displayObject; this.root = displayObject;
this.addDisplayObjectAndChildren(displayObject); this.addDisplayObjectAndChildren(displayObject);
} };
/** /**
* Renders the stage to its webgl view * Renders the stage to its webgl view
@ -87,8 +87,7 @@ PIXI.WebGLRenderGroup.prototype.render = function(projection, buffer)
// render special // render special
this.renderSpecial(renderable, projection); this.renderSpecial(renderable, projection);
} }
};
}
/** /**
* Renders a specific displayObject * Renders a specific displayObject
@ -115,6 +114,9 @@ PIXI.WebGLRenderGroup.prototype.renderSpecific = function(displayObject, project
var endIndex; var endIndex;
var endBatchIndex; var endBatchIndex;
var endBatch;
var head;
/* /*
* LOOK FOR THE NEXT SPRITE * LOOK FOR THE NEXT SPRITE
@ -136,11 +138,10 @@ PIXI.WebGLRenderGroup.prototype.renderSpecific = function(displayObject, project
{ {
startBatch = nextRenderable.batch; startBatch = nextRenderable.batch;
var head = startBatch.head; head = startBatch.head;
var next = head;
// ok now we have the batch.. need to find the start index! // ok now we have the batch.. need to find the start index!
if(head == nextRenderable) if(head === nextRenderable)
{ {
startIndex = 0; startIndex = 0;
} }
@ -148,7 +149,7 @@ PIXI.WebGLRenderGroup.prototype.renderSpecific = function(displayObject, project
{ {
startIndex = 1; startIndex = 1;
while(head.__next != nextRenderable) while(head.__next !== nextRenderable)
{ {
startIndex++; startIndex++;
head = head.__next; head = head.__next;
@ -172,9 +173,9 @@ PIXI.WebGLRenderGroup.prototype.renderSpecific = function(displayObject, project
{ {
endBatch = lastRenderable.batch; endBatch = lastRenderable.batch;
var head = endBatch.head; head = endBatch.head;
if(head == lastRenderable) if(head === lastRenderable)
{ {
endIndex = 0; endIndex = 0;
} }
@ -182,7 +183,7 @@ PIXI.WebGLRenderGroup.prototype.renderSpecific = function(displayObject, project
{ {
endIndex = 1; endIndex = 1;
while(head.__next != lastRenderable) while(head.__next !== lastRenderable)
{ {
endIndex++; endIndex++;
head = head.__next; head = head.__next;
@ -197,7 +198,7 @@ PIXI.WebGLRenderGroup.prototype.renderSpecific = function(displayObject, project
//console.log(endBatch); //console.log(endBatch);
// TODO - need to fold this up a bit! // TODO - need to fold this up a bit!
if(startBatch == endBatch) if(startBatch === endBatch)
{ {
if(startBatch instanceof PIXI.WebGLBatch) if(startBatch instanceof PIXI.WebGLBatch)
{ {
@ -225,7 +226,8 @@ PIXI.WebGLRenderGroup.prototype.renderSpecific = function(displayObject, project
} }
// DO the middle batchs.. // DO the middle batchs..
for (var i=startBatchIndex+1; i < endBatchIndex; i++) var renderable;
for (var i = startBatchIndex+1; i < endBatchIndex; i++)
{ {
renderable = this.batchs[i]; renderable = this.batchs[i];
@ -248,7 +250,7 @@ PIXI.WebGLRenderGroup.prototype.renderSpecific = function(displayObject, project
{ {
this.renderSpecial(endBatch, projection); this.renderSpecial(endBatch, projection);
} }
} };
/** /**
* Renders a specific renderable * Renders a specific renderable
@ -261,7 +263,7 @@ PIXI.WebGLRenderGroup.prototype.renderSpecific = function(displayObject, project
PIXI.WebGLRenderGroup.prototype.renderSpecial = function(renderable, projection) PIXI.WebGLRenderGroup.prototype.renderSpecial = function(renderable, projection)
{ {
var worldVisible = renderable.vcount === PIXI.visibleCount var worldVisible = renderable.vcount === PIXI.visibleCount;
if(renderable instanceof PIXI.TilingSprite) if(renderable instanceof PIXI.TilingSprite)
@ -284,9 +286,8 @@ PIXI.WebGLRenderGroup.prototype.renderSpecial = function(renderable, projection)
{ {
this.handleFilterBlock(renderable, projection); this.handleFilterBlock(renderable, projection);
} }
} };
flip = false;
var maskStack = []; var maskStack = [];
var maskPosition = 0; var maskPosition = 0;
@ -311,7 +312,7 @@ PIXI.WebGLRenderGroup.prototype.handleFilterBlock = function(filterBlock, projec
{ {
maskPosition++; maskPosition++;
maskStack.push(filterBlock) maskStack.push(filterBlock);
gl.enable(gl.STENCIL_TEST); gl.enable(gl.STENCIL_TEST);
@ -335,8 +336,7 @@ PIXI.WebGLRenderGroup.prototype.handleFilterBlock = function(filterBlock, projec
} }
else else
{ {
var maskData = maskStack.pop(filterBlock) var maskData = maskStack.pop(filterBlock);
if(maskData) if(maskData)
{ {
@ -350,12 +350,12 @@ PIXI.WebGLRenderGroup.prototype.handleFilterBlock = function(filterBlock, projec
gl.colorMask(true, true, true, true); gl.colorMask(true, true, true, true);
gl.stencilFunc(gl.NOTEQUAL,0,maskStack.length); gl.stencilFunc(gl.NOTEQUAL,0,maskStack.length);
gl.stencilOp(gl.KEEP,gl.KEEP,gl.KEEP); gl.stencilOp(gl.KEEP,gl.KEEP,gl.KEEP);
}; }
gl.disable(gl.STENCIL_TEST); gl.disable(gl.STENCIL_TEST);
} }
} }
} };
/** /**
* Updates a webgl texture * Updates a webgl texture
@ -377,7 +377,7 @@ PIXI.WebGLRenderGroup.prototype.updateTexture = function(displayObject)
* It keeps going back until it finds a sprite or the stage * It keeps going back until it finds a sprite or the stage
*/ */
var previousRenderable = displayObject.first; var previousRenderable = displayObject.first;
while(previousRenderable != this.root) while(previousRenderable !== this.root)
{ {
previousRenderable = previousRenderable._iPrev; previousRenderable = previousRenderable._iPrev;
if(previousRenderable.renderable && previousRenderable.__renderGroup)break; if(previousRenderable.renderable && previousRenderable.__renderGroup)break;
@ -397,7 +397,7 @@ PIXI.WebGLRenderGroup.prototype.updateTexture = function(displayObject)
} }
this.insertObject(displayObject, previousRenderable, nextRenderable); this.insertObject(displayObject, previousRenderable, nextRenderable);
} };
/** /**
* Adds filter blocks * Adds filter blocks
@ -417,7 +417,7 @@ PIXI.WebGLRenderGroup.prototype.addFilterBlocks = function(start, end)
* It keeps going back until it finds a sprite or the stage * It keeps going back until it finds a sprite or the stage
*/ */
var previousRenderable = start; var previousRenderable = start;
while(previousRenderable != this.root.first) while(previousRenderable !== this.root.first)
{ {
previousRenderable = previousRenderable._iPrev; previousRenderable = previousRenderable._iPrev;
if(previousRenderable.renderable && previousRenderable.__renderGroup)break; if(previousRenderable.renderable && previousRenderable.__renderGroup)break;
@ -431,13 +431,13 @@ PIXI.WebGLRenderGroup.prototype.addFilterBlocks = function(start, end)
* scene graph * scene graph
*/ */
var previousRenderable2 = end; var previousRenderable2 = end;
while(previousRenderable2 != this.root.first) while(previousRenderable2 !== this.root.first)
{ {
previousRenderable2 = previousRenderable2._iPrev; previousRenderable2 = previousRenderable2._iPrev;
if(previousRenderable2.renderable && previousRenderable2.__renderGroup)break; if(previousRenderable2.renderable && previousRenderable2.__renderGroup)break;
} }
this.insertAfter(end, previousRenderable2); this.insertAfter(end, previousRenderable2);
} };
/** /**
* Remove filter blocks * Remove filter blocks
@ -451,7 +451,7 @@ PIXI.WebGLRenderGroup.prototype.removeFilterBlocks = function(start, end)
{ {
this.removeObject(start); this.removeObject(start);
this.removeObject(end); this.removeObject(end);
} };
/** /**
* Adds a display object and children to the webgl context * Adds a display object and children to the webgl context
@ -471,7 +471,7 @@ PIXI.WebGLRenderGroup.prototype.addDisplayObjectAndChildren = function(displayOb
*/ */
var previousRenderable = displayObject.first; var previousRenderable = displayObject.first;
while(previousRenderable != this.root.first) while(previousRenderable !== this.root.first)
{ {
previousRenderable = previousRenderable._iPrev; previousRenderable = previousRenderable._iPrev;
if(previousRenderable.renderable && previousRenderable.__renderGroup)break; if(previousRenderable.renderable && previousRenderable.__renderGroup)break;
@ -494,6 +494,7 @@ PIXI.WebGLRenderGroup.prototype.addDisplayObjectAndChildren = function(displayOb
var tempObject = displayObject.first; var tempObject = displayObject.first;
var testObject = displayObject.last._iNext; var testObject = displayObject.last._iNext;
do do
{ {
tempObject.__renderGroup = this; tempObject.__renderGroup = this;
@ -507,8 +508,8 @@ PIXI.WebGLRenderGroup.prototype.addDisplayObjectAndChildren = function(displayOb
tempObject = tempObject._iNext; tempObject = tempObject._iNext;
} }
while(tempObject != testObject) while(tempObject !== testObject);
} };
/** /**
* Removes a display object and children to the webgl context * Removes a display object and children to the webgl context
@ -519,18 +520,16 @@ PIXI.WebGLRenderGroup.prototype.addDisplayObjectAndChildren = function(displayOb
*/ */
PIXI.WebGLRenderGroup.prototype.removeDisplayObjectAndChildren = function(displayObject) PIXI.WebGLRenderGroup.prototype.removeDisplayObjectAndChildren = function(displayObject)
{ {
if(displayObject.__renderGroup != this)return; if(displayObject.__renderGroup !== this) return;
// var displayObject = displayObject.first;
var lastObject = displayObject.last;
do do
{ {
displayObject.__renderGroup = null; displayObject.__renderGroup = null;
if(displayObject.renderable)this.removeObject(displayObject); if(displayObject.renderable)this.removeObject(displayObject);
displayObject = displayObject._iNext; displayObject = displayObject._iNext;
} }
while(displayObject) while(displayObject);
} };
/** /**
* Inserts a displayObject into the linked list * Inserts a displayObject into the linked list
@ -546,6 +545,7 @@ PIXI.WebGLRenderGroup.prototype.insertObject = function(displayObject, previousO
// while looping below THE OBJECT MAY NOT HAVE BEEN ADDED // while looping below THE OBJECT MAY NOT HAVE BEEN ADDED
var previousSprite = previousObject; var previousSprite = previousObject;
var nextSprite = nextObject; var nextSprite = nextObject;
var index, batch;
/* /*
* so now we have the next renderable and the previous renderable * so now we have the next renderable and the previous renderable
@ -553,15 +553,15 @@ PIXI.WebGLRenderGroup.prototype.insertObject = function(displayObject, previousO
*/ */
if(displayObject instanceof PIXI.Sprite) if(displayObject instanceof PIXI.Sprite)
{ {
var previousBatch var previousBatch;
var nextBatch var nextBatch;
if(previousSprite instanceof PIXI.Sprite) if(previousSprite instanceof PIXI.Sprite)
{ {
previousBatch = previousSprite.batch; previousBatch = previousSprite.batch;
if(previousBatch) if(previousBatch)
{ {
if(previousBatch.texture == displayObject.texture.baseTexture && previousBatch.blendMode == displayObject.blendMode) if(previousBatch.texture === displayObject.texture.baseTexture && previousBatch.blendMode === displayObject.blendMode)
{ {
previousBatch.insertAfter(displayObject, previousSprite); previousBatch.insertAfter(displayObject, previousSprite);
return; return;
@ -583,14 +583,14 @@ PIXI.WebGLRenderGroup.prototype.insertObject = function(displayObject, previousO
//batch may not exist if item was added to the display list but not to the webGL //batch may not exist if item was added to the display list but not to the webGL
if(nextBatch) if(nextBatch)
{ {
if(nextBatch.texture == displayObject.texture.baseTexture && nextBatch.blendMode == displayObject.blendMode) if(nextBatch.texture === displayObject.texture.baseTexture && nextBatch.blendMode === displayObject.blendMode)
{ {
nextBatch.insertBefore(displayObject, nextSprite); nextBatch.insertBefore(displayObject, nextSprite);
return; return;
} }
else else
{ {
if(nextBatch == previousBatch) if(nextBatch === previousBatch)
{ {
// THERE IS A SPLIT IN THIS BATCH! // // THERE IS A SPLIT IN THIS BATCH! //
var splitBatch = previousBatch.split(nextSprite); var splitBatch = previousBatch.split(nextSprite);
@ -601,9 +601,9 @@ PIXI.WebGLRenderGroup.prototype.insertObject = function(displayObject, previousO
* seems the new sprite is in the middle of a batch * seems the new sprite is in the middle of a batch
* lets split it.. * lets split it..
*/ */
var batch = PIXI.WebGLRenderer.getBatch(); batch = PIXI.WebGLRenderer.getBatch();
var index = this.batchs.indexOf( previousBatch ); index = this.batchs.indexOf( previousBatch );
batch.init(displayObject); batch.init(displayObject);
this.batchs.splice(index+1, 0, batch, splitBatch); this.batchs.splice(index+1, 0, batch, splitBatch);
@ -626,12 +626,12 @@ PIXI.WebGLRenderGroup.prototype.insertObject = function(displayObject, previousO
* time to create anew one! * time to create anew one!
*/ */
var batch = PIXI.WebGLRenderer.getBatch(); batch = PIXI.WebGLRenderer.getBatch();
batch.init(displayObject); batch.init(displayObject);
if(previousBatch) // if this is invalid it means if(previousBatch) // if this is invalid it means
{ {
var index = this.batchs.indexOf( previousBatch ); index = this.batchs.indexOf( previousBatch );
this.batchs.splice(index+1, 0, batch); this.batchs.splice(index+1, 0, batch);
} }
else else
@ -655,6 +655,7 @@ PIXI.WebGLRenderGroup.prototype.insertObject = function(displayObject, previousO
this.initStrip(displayObject); this.initStrip(displayObject);
// this.batchs.push(displayObject); // this.batchs.push(displayObject);
} }
/*
else if(displayObject)// instanceof PIXI.Graphics) else if(displayObject)// instanceof PIXI.Graphics)
{ {
//displayObject.initWebGL(this); //displayObject.initWebGL(this);
@ -663,12 +664,12 @@ PIXI.WebGLRenderGroup.prototype.insertObject = function(displayObject, previousO
//this.initStrip(displayObject); //this.initStrip(displayObject);
//this.batchs.push(displayObject); //this.batchs.push(displayObject);
} }
*/
this.insertAfter(displayObject, previousSprite); this.insertAfter(displayObject, previousSprite);
// insert and SPLIT! // insert and SPLIT!
};
}
/** /**
* Inserts a displayObject into the linked list * Inserts a displayObject into the linked list
@ -680,6 +681,8 @@ PIXI.WebGLRenderGroup.prototype.insertObject = function(displayObject, previousO
*/ */
PIXI.WebGLRenderGroup.prototype.insertAfter = function(item, displayObject) PIXI.WebGLRenderGroup.prototype.insertAfter = function(item, displayObject)
{ {
var index;
if(displayObject instanceof PIXI.Sprite) if(displayObject instanceof PIXI.Sprite)
{ {
var previousBatch = displayObject.batch; var previousBatch = displayObject.batch;
@ -689,10 +692,10 @@ PIXI.WebGLRenderGroup.prototype.insertAfter = function(item, displayObject)
// so this object is in a batch! // so this object is in a batch!
// is it not? need to split the batch // is it not? need to split the batch
if(previousBatch.tail == displayObject) if(previousBatch.tail === displayObject)
{ {
// is it tail? insert in to batchs // is it tail? insert in to batchs
var index = this.batchs.indexOf( previousBatch ); index = this.batchs.indexOf( previousBatch );
this.batchs.splice(index+1, 0, item); this.batchs.splice(index+1, 0, item);
} }
else else
@ -709,7 +712,7 @@ PIXI.WebGLRenderGroup.prototype.insertAfter = function(item, displayObject)
* seems the new sprite is in the middle of a batch * seems the new sprite is in the middle of a batch
* lets split it.. * lets split it..
*/ */
var index = this.batchs.indexOf( previousBatch ); index = this.batchs.indexOf( previousBatch );
this.batchs.splice(index+1, 0, item, splitBatch); this.batchs.splice(index+1, 0, item, splitBatch);
} }
} }
@ -720,10 +723,10 @@ PIXI.WebGLRenderGroup.prototype.insertAfter = function(item, displayObject)
} }
else else
{ {
var index = this.batchs.indexOf( displayObject ); index = this.batchs.indexOf( displayObject );
this.batchs.splice(index+1, 0, item); this.batchs.splice(index+1, 0, item);
} }
} };
/** /**
* Removes a displayObject from the linked list * Removes a displayObject from the linked list
@ -755,7 +758,7 @@ PIXI.WebGLRenderGroup.prototype.removeObject = function(displayObject)
batch.remove(displayObject); batch.remove(displayObject);
if(batch.size==0) if(batch.size === 0)
{ {
batchToRemove = batch; batchToRemove = batch;
} }
@ -771,11 +774,11 @@ PIXI.WebGLRenderGroup.prototype.removeObject = function(displayObject)
if(batchToRemove) if(batchToRemove)
{ {
var index = this.batchs.indexOf( batchToRemove ); var index = this.batchs.indexOf( batchToRemove );
if(index == -1)return;// this means it was added then removed before rendered if(index === -1)return;// this means it was added then removed before rendered
// ok so.. check to see if you adjacent batchs should be joined. // ok so.. check to see if you adjacent batchs should be joined.
// TODO may optimise? // TODO may optimise?
if(index == 0 || index == this.batchs.length-1) if(index === 0 || index === this.batchs.length-1)
{ {
// wha - eva! just get of the empty batch! // wha - eva! just get of the empty batch!
this.batchs.splice(index, 1); this.batchs.splice(index, 1);
@ -786,7 +789,7 @@ PIXI.WebGLRenderGroup.prototype.removeObject = function(displayObject)
if(this.batchs[index-1] instanceof PIXI.WebGLBatch && this.batchs[index+1] instanceof PIXI.WebGLBatch) if(this.batchs[index-1] instanceof PIXI.WebGLBatch && this.batchs[index+1] instanceof PIXI.WebGLBatch)
{ {
if(this.batchs[index-1].texture == this.batchs[index+1].texture && this.batchs[index-1].blendMode == this.batchs[index+1].blendMode) if(this.batchs[index-1].texture === this.batchs[index+1].texture && this.batchs[index-1].blendMode === this.batchs[index+1].blendMode)
{ {
//console.log("MERGE") //console.log("MERGE")
this.batchs[index-1].merge(this.batchs[index+1]); this.batchs[index-1].merge(this.batchs[index+1]);
@ -801,7 +804,7 @@ PIXI.WebGLRenderGroup.prototype.removeObject = function(displayObject)
this.batchs.splice(index, 1); this.batchs.splice(index, 1);
if(batchToRemove instanceof PIXI.WebGLBatch)PIXI.WebGLRenderer.returnBatch(batchToRemove); if(batchToRemove instanceof PIXI.WebGLBatch)PIXI.WebGLRenderer.returnBatch(batchToRemove);
} }
} };
/** /**
@ -829,7 +832,7 @@ PIXI.WebGLRenderGroup.prototype.initTilingSprite = function(sprite)
sprite.colors = new Float32Array([1,1,1,1]); sprite.colors = new Float32Array([1,1,1,1]);
sprite.indices = new Uint16Array([0, 1, 3,2])//, 2]); sprite.indices = new Uint16Array([0, 1, 3,2]); //, 2]);
sprite._vertexBuffer = gl.createBuffer(); sprite._vertexBuffer = gl.createBuffer();
sprite._indexBuffer = gl.createBuffer(); sprite._indexBuffer = gl.createBuffer();
@ -861,7 +864,7 @@ PIXI.WebGLRenderGroup.prototype.initTilingSprite = function(sprite)
{ {
sprite.texture.baseTexture._powerOf2 = true; sprite.texture.baseTexture._powerOf2 = true;
} }
} };
/** /**
* Renders a Strip * Renders a Strip
@ -879,8 +882,6 @@ PIXI.WebGLRenderGroup.prototype.renderStrip = function(strip, projection)
var shader = PIXI.stripShader; var shader = PIXI.stripShader;
var program = shader.program;
var m = PIXI.mat3.clone(strip.worldTransform); var m = PIXI.mat3.clone(strip.worldTransform);
PIXI.mat3.transpose(m); PIXI.mat3.transpose(m);
@ -908,7 +909,7 @@ PIXI.WebGLRenderGroup.prototype.renderStrip = function(strip, projection)
if(!strip.dirty) if(!strip.dirty)
{ {
gl.bindBuffer(gl.ARRAY_BUFFER, strip._vertexBuffer); gl.bindBuffer(gl.ARRAY_BUFFER, strip._vertexBuffer);
gl.bufferSubData(gl.ARRAY_BUFFER, 0, strip.verticies) gl.bufferSubData(gl.ARRAY_BUFFER, 0, strip.verticies);
gl.vertexAttribPointer(shader.aVertexPosition, 2, gl.FLOAT, false, 0, 0); gl.vertexAttribPointer(shader.aVertexPosition, 2, gl.FLOAT, false, 0, 0);
// update the uvs // update the uvs
@ -928,19 +929,19 @@ PIXI.WebGLRenderGroup.prototype.renderStrip = function(strip, projection)
{ {
strip.dirty = false; strip.dirty = false;
gl.bindBuffer(gl.ARRAY_BUFFER, strip._vertexBuffer); gl.bindBuffer(gl.ARRAY_BUFFER, strip._vertexBuffer);
gl.bufferData(gl.ARRAY_BUFFER, strip.verticies, gl.STATIC_DRAW) gl.bufferData(gl.ARRAY_BUFFER, strip.verticies, gl.STATIC_DRAW);
gl.vertexAttribPointer(shader.aVertexPosition, 2, gl.FLOAT, false, 0, 0); gl.vertexAttribPointer(shader.aVertexPosition, 2, gl.FLOAT, false, 0, 0);
// update the uvs // update the uvs
gl.bindBuffer(gl.ARRAY_BUFFER, strip._uvBuffer); gl.bindBuffer(gl.ARRAY_BUFFER, strip._uvBuffer);
gl.bufferData(gl.ARRAY_BUFFER, strip.uvs, gl.STATIC_DRAW) gl.bufferData(gl.ARRAY_BUFFER, strip.uvs, gl.STATIC_DRAW);
gl.vertexAttribPointer(shader.aTextureCoord, 2, gl.FLOAT, false, 0, 0); gl.vertexAttribPointer(shader.aTextureCoord, 2, gl.FLOAT, false, 0, 0);
gl.activeTexture(gl.TEXTURE0); gl.activeTexture(gl.TEXTURE0);
gl.bindTexture(gl.TEXTURE_2D, strip.texture.baseTexture._glTexture); gl.bindTexture(gl.TEXTURE_2D, strip.texture.baseTexture._glTexture);
// console.log(strip.texture.baseTexture._glTexture) // console.log(strip.texture.baseTexture._glTexture)
gl.bindBuffer(gl.ARRAY_BUFFER, strip._colorBuffer); gl.bindBuffer(gl.ARRAY_BUFFER, strip._colorBuffer);
gl.bufferData(gl.ARRAY_BUFFER, strip.colors, gl.STATIC_DRAW) gl.bufferData(gl.ARRAY_BUFFER, strip.colors, gl.STATIC_DRAW);
gl.vertexAttribPointer(shader.colorAttribute, 1, gl.FLOAT, false, 0, 0); gl.vertexAttribPointer(shader.colorAttribute, 1, gl.FLOAT, false, 0, 0);
// dont need to upload! // dont need to upload!
@ -953,7 +954,7 @@ PIXI.WebGLRenderGroup.prototype.renderStrip = function(strip, projection)
PIXI.deactivateStripShader(); PIXI.deactivateStripShader();
//gl.useProgram(PIXI.currentProgram); //gl.useProgram(PIXI.currentProgram);
} };
/** /**
* Renders a TilingSprite * Renders a TilingSprite
@ -967,9 +968,6 @@ PIXI.WebGLRenderGroup.prototype.renderTilingSprite = function(sprite, projection
{ {
var gl = this.gl; var gl = this.gl;
var shaderProgram = PIXI.shaderProgram;
var tilePosition = sprite.tilePosition; var tilePosition = sprite.tilePosition;
var tileScale = sprite.tileScale; var tileScale = sprite.tileScale;
@ -992,10 +990,10 @@ PIXI.WebGLRenderGroup.prototype.renderTilingSprite = function(sprite, projection
sprite.uvs[7] = (1 *scaleY) - offsetY; sprite.uvs[7] = (1 *scaleY) - offsetY;
gl.bindBuffer(gl.ARRAY_BUFFER, sprite._uvBuffer); gl.bindBuffer(gl.ARRAY_BUFFER, sprite._uvBuffer);
gl.bufferSubData(gl.ARRAY_BUFFER, 0, sprite.uvs) gl.bufferSubData(gl.ARRAY_BUFFER, 0, sprite.uvs);
this.renderStrip(sprite, projectionMatrix); this.renderStrip(sprite, projectionMatrix);
} };
/** /**
* Initializes a strip to be rendered * Initializes a strip to be rendered
@ -1008,7 +1006,6 @@ PIXI.WebGLRenderGroup.prototype.initStrip = function(strip)
{ {
// build the strip! // build the strip!
var gl = this.gl; var gl = this.gl;
var shaderProgram = this.shaderProgram;
strip._vertexBuffer = gl.createBuffer(); strip._vertexBuffer = gl.createBuffer();
strip._indexBuffer = gl.createBuffer(); strip._indexBuffer = gl.createBuffer();
@ -1027,5 +1024,4 @@ PIXI.WebGLRenderGroup.prototype.initStrip = function(strip)
gl.bindBuffer(gl.ELEMENT_ARRAY_BUFFER, strip._indexBuffer); gl.bindBuffer(gl.ELEMENT_ARRAY_BUFFER, strip._indexBuffer);
gl.bufferData(gl.ELEMENT_ARRAY_BUFFER, strip.indices, gl.STATIC_DRAW); gl.bufferData(gl.ELEMENT_ARRAY_BUFFER, strip.indices, gl.STATIC_DRAW);
} };

60
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.. // an instance of the gl context..
// only one at the moment :/ // 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 * the WebGLRenderer is draws the stage and all its content onto a webGL enabled canvas. This renderer
@ -38,8 +38,8 @@ PIXI.WebGLRenderer = function(width, height, view, transparent, antialias)
// deal with losing context.. // deal with losing context..
var scope = this; var scope = this;
this.view.addEventListener('webglcontextlost', function(event) { scope.handleContextLost(event); }, false) this.view.addEventListener('webglcontextlost', function(event) { scope.handleContextLost(event); }, false);
this.view.addEventListener('webglcontextrestored', function(event) { scope.handleContextRestored(event); }, false) this.view.addEventListener('webglcontextrestored', function(event) { scope.handleContextRestored(event); }, false);
this.batchs = []; this.batchs = [];
@ -48,18 +48,18 @@ PIXI.WebGLRenderer = function(width, height, view, transparent, antialias)
antialias:!!antialias, // SPEED UP?? antialias:!!antialias, // SPEED UP??
premultipliedAlpha:false, premultipliedAlpha:false,
stencil:true stencil:true
} };
//try 'experimental-webgl' //try 'experimental-webgl'
try { try {
PIXI.gl = this.gl = this.view.getContext("experimental-webgl", options); PIXI.gl = this.gl = this.view.getContext('experimental-webgl', options);
} catch (e) { } catch (e) {
//try 'webgl' //try 'webgl'
try { try {
PIXI.gl = this.gl = this.view.getContext("webgl", options); PIXI.gl = this.gl = this.view.getContext('webgl', options);
} catch (e) { } catch (e2) {
// fail, not able to get a context // fail, not able to get a context
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);
} }
} }
@ -96,7 +96,7 @@ PIXI.WebGLRenderer = function(width, height, view, transparent, antialias)
this.stageRenderGroup = new PIXI.WebGLRenderGroup(this.gl, this.transparent); this.stageRenderGroup = new PIXI.WebGLRenderGroup(this.gl, this.transparent);
// this.stageRenderGroup. = this.transparent // this.stageRenderGroup. = this.transparent
} };
// constructor // constructor
PIXI.WebGLRenderer.prototype.constructor = PIXI.WebGLRenderer; PIXI.WebGLRenderer.prototype.constructor = PIXI.WebGLRenderer;
@ -111,7 +111,7 @@ PIXI.WebGLRenderer.prototype.constructor = PIXI.WebGLRenderer;
*/ */
PIXI.WebGLRenderer.getBatch = function() PIXI.WebGLRenderer.getBatch = function()
{ {
if(PIXI._batchs.length == 0) if(PIXI._batchs.length === 0)
{ {
return new PIXI.WebGLBatch(PIXI.WebGLRenderer.gl); return new PIXI.WebGLBatch(PIXI.WebGLRenderer.gl);
} }
@ -119,7 +119,7 @@ PIXI.WebGLRenderer.getBatch = function()
{ {
return PIXI._batchs.pop(); return PIXI._batchs.pop();
} }
} };
/** /**
* Puts a batch back into the pool * Puts a batch back into the pool
@ -133,7 +133,7 @@ PIXI.WebGLRenderer.returnBatch = function(batch)
{ {
batch.clean(); batch.clean();
PIXI._batchs.push(batch); PIXI._batchs.push(batch);
} };
/** /**
* Renders the stage to its webGL view * Renders the stage to its webGL view
@ -200,11 +200,11 @@ PIXI.WebGLRenderer.prototype.render = function(stage)
for (var i=0; i < PIXI.Texture.frameUpdates.length; i++) for (var i=0; i < PIXI.Texture.frameUpdates.length; i++)
{ {
PIXI.Texture.frameUpdates[i].updateFrame = false; PIXI.Texture.frameUpdates[i].updateFrame = false;
}; }
PIXI.Texture.frameUpdates = []; PIXI.Texture.frameUpdates = [];
} }
} };
/** /**
* Updates the textures loaded into this webgl renderer * Updates the textures loaded into this webgl renderer
@ -215,12 +215,18 @@ PIXI.WebGLRenderer.prototype.render = function(stage)
*/ */
PIXI.WebGLRenderer.updateTextures = function() PIXI.WebGLRenderer.updateTextures = function()
{ {
var i = 0;
//TODO break this out into a texture manager... //TODO break this out into a texture manager...
for (var i=0; i < PIXI.texturesToUpdate.length; i++) PIXI.WebGLRenderer.updateTexture(PIXI.texturesToUpdate[i]); for (i = 0; i < PIXI.texturesToUpdate.length; i++)
for (var i=0; i < PIXI.texturesToDestroy.length; i++) PIXI.WebGLRenderer.destroyTexture(PIXI.texturesToDestroy[i]); PIXI.WebGLRenderer.updateTexture(PIXI.texturesToUpdate[i]);
for (i = 0; i < PIXI.texturesToDestroy.length; i++)
PIXI.WebGLRenderer.destroyTexture(PIXI.texturesToDestroy[i]);
PIXI.texturesToUpdate = []; PIXI.texturesToUpdate = [];
PIXI.texturesToDestroy = []; PIXI.texturesToDestroy = [];
} };
/** /**
* Updates a loaded webgl texture * Updates a loaded webgl texture
@ -264,7 +270,7 @@ PIXI.WebGLRenderer.updateTexture = function(texture)
gl.bindTexture(gl.TEXTURE_2D, null); gl.bindTexture(gl.TEXTURE_2D, null);
} }
} };
/** /**
* Destroys a loaded webgl texture * Destroys a loaded webgl texture
@ -283,7 +289,7 @@ PIXI.WebGLRenderer.destroyTexture = function(texture)
texture._glTexture = gl.createTexture(); texture._glTexture = gl.createTexture();
gl.deleteTexture(gl.TEXTURE_2D, texture._glTexture); gl.deleteTexture(gl.TEXTURE_2D, texture._glTexture);
} }
} };
/** /**
* resizes the webGL view to the specified width and height * resizes the webGL view to the specified width and height
@ -314,7 +320,7 @@ PIXI.WebGLRenderer.prototype.resize = function(width, height)
// projectionMatrix[5] = -2/this.height; // projectionMatrix[5] = -2/this.height;
// projectionMatrix[12] = -1; // projectionMatrix[12] = -1;
// projectionMatrix[13] = 1; // projectionMatrix[13] = 1;
} };
/** /**
* Handles a lost webgl context * Handles a lost webgl context
@ -327,7 +333,7 @@ PIXI.WebGLRenderer.prototype.handleContextLost = function(event)
{ {
event.preventDefault(); event.preventDefault();
this.contextLost = true; this.contextLost = true;
} };
/** /**
* Handles a restored webgl context * Handles a restored webgl context
@ -336,9 +342,9 @@ PIXI.WebGLRenderer.prototype.handleContextLost = function(event)
* @param event {Event} * @param event {Event}
* @private * @private
*/ */
PIXI.WebGLRenderer.prototype.handleContextRestored = function(event) PIXI.WebGLRenderer.prototype.handleContextRestored = function()
{ {
this.gl = this.view.getContext("experimental-webgl", { this.gl = this.view.getContext('experimental-webgl', {
alpha: true alpha: true
}); });
@ -349,15 +355,15 @@ PIXI.WebGLRenderer.prototype.handleContextRestored = function(event)
var texture = PIXI.TextureCache[key].baseTexture; var texture = PIXI.TextureCache[key].baseTexture;
texture._glTexture = null; texture._glTexture = null;
PIXI.WebGLRenderer.updateTexture(texture); PIXI.WebGLRenderer.updateTexture(texture);
}; }
for (var i=0; i < this.batchs.length; i++) for (var i=0; i < this.batchs.length; i++)
{ {
this.batchs[i].restoreLostContext(this.gl)// this.batchs[i].restoreLostContext(this.gl);
this.batchs[i].dirty = true; this.batchs[i].dirty = true;
}; }
PIXI._restoreBatchs(this.gl); PIXI._restoreBatchs(this.gl);
this.contextLost = false; this.contextLost = false;
} };

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

@ -2,7 +2,6 @@
* @author Mat Groves http://matgroves.com/ @Doormat23 * @author Mat Groves http://matgroves.com/ @Doormat23
*/ */
PIXI.initDefaultShaders = function() PIXI.initDefaultShaders = function()
{ {
PIXI.primitiveShader = new PIXI.PrimitiveShader(); PIXI.primitiveShader = new PIXI.PrimitiveShader();
@ -17,13 +16,12 @@ PIXI.initDefaultShaders = function()
var gl = PIXI.gl; var gl = PIXI.gl;
var shaderProgram = PIXI.defaultShader.program; var shaderProgram = PIXI.defaultShader.program;
gl.useProgram(shaderProgram); gl.useProgram(shaderProgram);
gl.enableVertexAttribArray(PIXI.defaultShader.aVertexPosition); gl.enableVertexAttribArray(PIXI.defaultShader.aVertexPosition);
gl.enableVertexAttribArray(PIXI.defaultShader.colorAttribute); gl.enableVertexAttribArray(PIXI.defaultShader.colorAttribute);
gl.enableVertexAttribArray(PIXI.defaultShader.aTextureCoord); gl.enableVertexAttribArray(PIXI.defaultShader.aTextureCoord);
} };
PIXI.activatePrimitiveShader = function() PIXI.activatePrimitiveShader = function()
{ {
@ -37,7 +35,7 @@ PIXI.activatePrimitiveShader = function()
gl.enableVertexAttribArray(PIXI.primitiveShader.aVertexPosition); gl.enableVertexAttribArray(PIXI.primitiveShader.aVertexPosition);
gl.enableVertexAttribArray(PIXI.primitiveShader.colorAttribute); gl.enableVertexAttribArray(PIXI.primitiveShader.colorAttribute);
} };
PIXI.deactivatePrimitiveShader = function() PIXI.deactivatePrimitiveShader = function()
{ {
@ -51,8 +49,7 @@ PIXI.deactivatePrimitiveShader = function()
gl.enableVertexAttribArray(PIXI.defaultShader.aVertexPosition); gl.enableVertexAttribArray(PIXI.defaultShader.aVertexPosition);
gl.enableVertexAttribArray(PIXI.defaultShader.colorAttribute); gl.enableVertexAttribArray(PIXI.defaultShader.colorAttribute);
gl.enableVertexAttribArray(PIXI.defaultShader.aTextureCoord); gl.enableVertexAttribArray(PIXI.defaultShader.aTextureCoord);
};
}
PIXI.activateStripShader = function() PIXI.activateStripShader = function()
{ {
@ -60,7 +57,7 @@ PIXI.activateStripShader = function()
gl.useProgram(PIXI.stripShader.program); gl.useProgram(PIXI.stripShader.program);
// gl.disableVertexAttribArray(PIXI.defaultShader.aTextureCoord); // gl.disableVertexAttribArray(PIXI.defaultShader.aTextureCoord);
} };
PIXI.deactivateStripShader = function() PIXI.deactivateStripShader = function()
{ {
@ -68,7 +65,7 @@ PIXI.deactivateStripShader = function()
gl.useProgram(PIXI.defaultShader.program); gl.useProgram(PIXI.defaultShader.program);
//gl.enableVertexAttribArray(PIXI.defaultShader.aTextureCoord); //gl.enableVertexAttribArray(PIXI.defaultShader.aTextureCoord);
} };
/* /*
@ -78,12 +75,12 @@ SHADER COMPILER HELPERS
PIXI.CompileVertexShader = function(gl, shaderSrc) PIXI.CompileVertexShader = function(gl, shaderSrc)
{ {
return PIXI._CompileShader(gl, shaderSrc, gl.VERTEX_SHADER); return PIXI._CompileShader(gl, shaderSrc, gl.VERTEX_SHADER);
} };
PIXI.CompileFragmentShader = function(gl, shaderSrc) PIXI.CompileFragmentShader = function(gl, shaderSrc)
{ {
return PIXI._CompileShader(gl, shaderSrc, gl.FRAGMENT_SHADER); return PIXI._CompileShader(gl, shaderSrc, gl.FRAGMENT_SHADER);
} };
PIXI._CompileShader = function(gl, shaderSrc, shaderType) PIXI._CompileShader = function(gl, shaderSrc, shaderType)
{ {
@ -93,13 +90,12 @@ PIXI._CompileShader = function(gl, shaderSrc, shaderType)
gl.compileShader(shader); gl.compileShader(shader);
if (!gl.getShaderParameter(shader, gl.COMPILE_STATUS)) { if (!gl.getShaderParameter(shader, gl.COMPILE_STATUS)) {
console.log(gl.getShaderInfoLog(shader)); window.console.log(gl.getShaderInfoLog(shader));
return null; return null;
} }
return shader; return shader;
} };
PIXI.compileProgram = function(vertexSrc, fragmentSrc) PIXI.compileProgram = function(vertexSrc, fragmentSrc)
{ {
@ -114,8 +110,8 @@ PIXI.compileProgram = function(vertexSrc, fragmentSrc)
gl.linkProgram(shaderProgram); gl.linkProgram(shaderProgram);
if (!gl.getProgramParameter(shaderProgram, gl.LINK_STATUS)) { if (!gl.getProgramParameter(shaderProgram, gl.LINK_STATUS)) {
console.log("Could not initialise shaders"); window.console.log("Could not initialise shaders");
} }
return shaderProgram; return shaderProgram;
} };

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

@ -3,7 +3,7 @@
*/ */
/** /**
* A Text Object will create a line(s) of text using bitmap font. To split a line you can use "\n", "\r" or "\r\n" * A Text Object will create a line(s) of text using bitmap font. To split a line you can use '\n', '\r' or '\r\n'
* You can generate the fnt files using * You can generate the fnt files using
* http://www.angelcode.com/products/bmfont/ for windows or * http://www.angelcode.com/products/bmfont/ for windows or
* http://www.bmglyph.com/ for mac. * http://www.bmglyph.com/ for mac.
@ -13,8 +13,8 @@
* @constructor * @constructor
* @param text {String} The copy that you would like the text to display * @param text {String} The copy that you would like the text to display
* @param style {Object} The style parameters * @param style {Object} The style parameters
* @param style.font {String} The size (optional) and bitmap font id (required) eq "Arial" or "20px Arial" (must have loaded previously) * @param style.font {String} The size (optional) and bitmap font id (required) eq 'Arial' or '20px Arial' (must have loaded previously)
* @param [style.align="left"] {String} An alignment of the multiline text ("left", "center" or "right") * @param [style.align='left'] {String} An alignment of the multiline text ('left', 'center' or 'right')
*/ */
PIXI.BitmapText = function(text, style) PIXI.BitmapText = function(text, style)
{ {
@ -23,8 +23,7 @@ PIXI.BitmapText = function(text, style)
this.setText(text); this.setText(text);
this.setStyle(style); this.setStyle(style);
this.updateText(); this.updateText();
this.dirty = false this.dirty = false;
}; };
// constructor // constructor
@ -39,7 +38,7 @@ PIXI.BitmapText.prototype.constructor = PIXI.BitmapText;
*/ */
PIXI.BitmapText.prototype.setText = function(text) PIXI.BitmapText.prototype.setText = function(text)
{ {
this.text = text || " "; this.text = text || ' ';
this.dirty = true; this.dirty = true;
}; };
@ -48,16 +47,16 @@ PIXI.BitmapText.prototype.setText = function(text)
* *
* @method setStyle * @method setStyle
* @param style {Object} The style parameters * @param style {Object} The style parameters
* @param style.font {String} The size (optional) and bitmap font id (required) eq "Arial" or "20px Arial" (must have loaded previously) * @param style.font {String} The size (optional) and bitmap font id (required) eq 'Arial' or '20px Arial' (must have loaded previously)
* @param [style.align="left"] {String} An alignment of the multiline text ("left", "center" or "right") * @param [style.align='left'] {String} An alignment of the multiline text ('left', 'center' or 'right')
*/ */
PIXI.BitmapText.prototype.setStyle = function(style) PIXI.BitmapText.prototype.setStyle = function(style)
{ {
style = style || {}; style = style || {};
style.align = style.align || "left"; style.align = style.align || 'left';
this.style = style; this.style = style;
var font = style.font.split(" "); var font = style.font.split(' ');
this.fontName = font[font.length - 1]; this.fontName = font[font.length - 1];
this.fontSize = font.length >= 2 ? parseInt(font[font.length - 2], 10) : PIXI.BitmapText.fonts[this.fontName].size; this.fontSize = font.length >= 2 ? parseInt(font[font.length - 2], 10) : PIXI.BitmapText.fonts[this.fontName].size;
@ -115,11 +114,11 @@ PIXI.BitmapText.prototype.updateText = function()
for(i = 0; i <= line; i++) for(i = 0; i <= line; i++)
{ {
var alignOffset = 0; var alignOffset = 0;
if(this.style.align == "right") if(this.style.align === 'right')
{ {
alignOffset = maxLineWidth - lineWidths[i]; alignOffset = maxLineWidth - lineWidths[i];
} }
else if(this.style.align == "center") else if(this.style.align === 'center')
{ {
alignOffset = (maxLineWidth - lineWidths[i]) / 2; alignOffset = (maxLineWidth - lineWidths[i]) / 2;
} }
@ -128,7 +127,7 @@ PIXI.BitmapText.prototype.updateText = function()
for(i = 0; i < chars.length; i++) for(i = 0; i < chars.length; i++)
{ {
var c = new PIXI.Sprite(chars[i].texture)//PIXI.Sprite.fromFrame(chars[i].charCode); var c = new PIXI.Sprite(chars[i].texture); //PIXI.Sprite.fromFrame(chars[i].charCode);
c.position.x = (chars[i].position.x + lineAlignOffsets[chars[i].line]) * scale; c.position.x = (chars[i].position.x + lineAlignOffsets[chars[i].line]) * scale;
c.position.y = chars[i].position.y * scale; c.position.y = chars[i].position.y * scale;
c.scale.x = c.scale.y = scale; c.scale.x = c.scale.y = scale;

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

@ -3,25 +3,25 @@
*/ */
/** /**
* A Text Object will create a line(s) of text to split a line you can use "\n" * A Text Object will create a line(s) of text to split a line you can use '\n'
* *
* @class Text * @class Text
* @extends Sprite * @extends Sprite
* @constructor * @constructor
* @param text {String} The copy that you would like the text to display * @param text {String} The copy that you would like the text to display
* @param [style] {Object} The style parameters * @param [style] {Object} The style parameters
* @param [style.font] {String} default "bold 20pt Arial" The style and size of the font * @param [style.font] {String} default 'bold 20pt Arial' The style and size of the font
* @param [style.fill="black"] {Object} A canvas fillstyle that will be used on the text eg "red", "#00FF00" * @param [style.fill='black'] {Object} A canvas fillstyle that will be used on the text eg 'red', '#00FF00'
* @param [style.align="left"] {String} An alignment of the multiline text ("left", "center" or "right") * @param [style.align='left'] {String} An alignment of the multiline text ('left', 'center' or 'right')
* @param [style.stroke] {String} A canvas fillstyle that will be used on the text stroke eg "blue", "#FCFF00" * @param [style.stroke] {String} A canvas fillstyle that will be used on the text stroke eg 'blue', '#FCFF00'
* @param [style.strokeThickness=0] {Number} A number that represents the thickness of the stroke. Default is 0 (no stroke) * @param [style.strokeThickness=0] {Number} A number that represents the thickness of the stroke. Default is 0 (no stroke)
* @param [style.wordWrap=false] {Boolean} Indicates if word wrap should be used * @param [style.wordWrap=false] {Boolean} Indicates if word wrap should be used
* @param [style.wordWrapWidth=100] {Number} The width at which text will wrap * @param [style.wordWrapWidth=100] {Number} The width at which text will wrap
*/ */
PIXI.Text = function(text, style) PIXI.Text = function(text, style)
{ {
this.canvas = document.createElement("canvas"); this.canvas = document.createElement('canvas');
this.context = this.canvas.getContext("2d"); this.context = this.canvas.getContext('2d');
PIXI.Sprite.call(this, PIXI.Texture.fromCanvas(this.canvas)); PIXI.Sprite.call(this, PIXI.Texture.fromCanvas(this.canvas));
this.setText(text); this.setText(text);
@ -40,10 +40,10 @@ PIXI.Text.prototype.constructor = PIXI.Text;
* *
* @method setStyle * @method setStyle
* @param [style] {Object} The style parameters * @param [style] {Object} The style parameters
* @param [style.font="bold 20pt Arial"] {String} The style and size of the font * @param [style.font='bold 20pt Arial'] {String} The style and size of the font
* @param [style.fill="black"] {Object} A canvas fillstyle that will be used on the text eg "red", "#00FF00" * @param [style.fill='black'] {Object} A canvas fillstyle that will be used on the text eg 'red', '#00FF00'
* @param [style.align="left"] {String} An alignment of the multiline text ("left", "center" or "right") * @param [style.align='left'] {String} An alignment of the multiline text ('left', 'center' or 'right')
* @param [style.stroke="black"] {String} A canvas fillstyle that will be used on the text stroke eg "blue", "#FCFF00" * @param [style.stroke='black'] {String} A canvas fillstyle that will be used on the text stroke eg 'blue', '#FCFF00'
* @param [style.strokeThickness=0] {Number} A number that represents the thickness of the stroke. Default is 0 (no stroke) * @param [style.strokeThickness=0] {Number} A number that represents the thickness of the stroke. Default is 0 (no stroke)
* @param [style.wordWrap=false] {Boolean} Indicates if word wrap should be used * @param [style.wordWrap=false] {Boolean} Indicates if word wrap should be used
* @param [style.wordWrapWidth=100] {Number} The width at which text will wrap * @param [style.wordWrapWidth=100] {Number} The width at which text will wrap
@ -51,10 +51,10 @@ PIXI.Text.prototype.constructor = PIXI.Text;
PIXI.Text.prototype.setStyle = function(style) PIXI.Text.prototype.setStyle = function(style)
{ {
style = style || {}; style = style || {};
style.font = style.font || "bold 20pt Arial"; style.font = style.font || 'bold 20pt Arial';
style.fill = style.fill || "black"; style.fill = style.fill || 'black';
style.align = style.align || "left"; style.align = style.align || 'left';
style.stroke = style.stroke || "black"; //provide a default, see: https://github.com/GoodBoyDigital/pixi.js/issues/136 style.stroke = style.stroke || 'black'; //provide a default, see: https://github.com/GoodBoyDigital/pixi.js/issues/136
style.strokeThickness = style.strokeThickness || 0; style.strokeThickness = style.strokeThickness || 0;
style.wordWrap = style.wordWrap || false; style.wordWrap = style.wordWrap || false;
style.wordWrapWidth = style.wordWrapWidth || 100; style.wordWrapWidth = style.wordWrapWidth || 100;
@ -63,14 +63,14 @@ PIXI.Text.prototype.setStyle = function(style)
}; };
/** /**
* Set the copy for the text object. To split a line you can use "\n" * Set the copy for the text object. To split a line you can use '\n'
* *
* @method setText * @method setText
* @param {String} text The copy that you would like the text to display * @param {String} text The copy that you would like the text to display
*/ */
PIXI.Text.prototype.setText = function(text) PIXI.Text.prototype.setText = function(text)
{ {
this.text = text.toString() || " "; this.text = text.toString() || ' ';
this.dirty = true; this.dirty = true;
}; };
@ -105,7 +105,7 @@ PIXI.Text.prototype.updateText = function()
this.canvas.width = maxLineWidth + this.style.strokeThickness; this.canvas.width = maxLineWidth + this.style.strokeThickness;
//calculate text height //calculate text height
var lineHeight = this.determineFontHeight("font: " + this.style.font + ";") + this.style.strokeThickness; var lineHeight = this.determineFontHeight('font: ' + this.style.font + ';') + this.style.strokeThickness;
this.canvas.height = lineHeight * lines.length; this.canvas.height = lineHeight * lines.length;
//set canvas text styles //set canvas text styles
@ -115,18 +115,18 @@ PIXI.Text.prototype.updateText = function()
this.context.strokeStyle = this.style.stroke; this.context.strokeStyle = this.style.stroke;
this.context.lineWidth = this.style.strokeThickness; this.context.lineWidth = this.style.strokeThickness;
this.context.textBaseline = "top"; this.context.textBaseline = 'top';
//draw lines line by line //draw lines line by line
for (i = 0; i < lines.length; i++) for (i = 0; i < lines.length; i++)
{ {
var linePosition = new PIXI.Point(this.style.strokeThickness / 2, this.style.strokeThickness / 2 + i * lineHeight); var linePosition = new PIXI.Point(this.style.strokeThickness / 2, this.style.strokeThickness / 2 + i * lineHeight);
if(this.style.align == "right") if(this.style.align === 'right')
{ {
linePosition.x += maxLineWidth - lineWidths[i]; linePosition.x += maxLineWidth - lineWidths[i];
} }
else if(this.style.align == "center") else if(this.style.align === 'center')
{ {
linePosition.x += (maxLineWidth - lineWidths[i]) / 2; linePosition.x += (maxLineWidth - lineWidths[i]) / 2;
} }
@ -197,11 +197,11 @@ PIXI.Text.prototype.determineFontHeight = function(fontStyle)
if(!result) if(!result)
{ {
var body = document.getElementsByTagName("body")[0]; var body = document.getElementsByTagName('body')[0];
var dummy = document.createElement("div"); var dummy = document.createElement('div');
var dummyText = document.createTextNode("M"); var dummyText = document.createTextNode('M');
dummy.appendChild(dummyText); dummy.appendChild(dummyText);
dummy.setAttribute("style", fontStyle + ';position:absolute;top:0;left:0'); dummy.setAttribute('style', fontStyle + ';position:absolute;top:0;left:0');
body.appendChild(dummy); body.appendChild(dummy);
result = dummy.offsetHeight; result = dummy.offsetHeight;
@ -225,34 +225,34 @@ PIXI.Text.prototype.wordWrap = function(text)
{ {
// Greedy wrapping algorithm that will wrap words as the line grows longer // Greedy wrapping algorithm that will wrap words as the line grows longer
// than its horizontal bounds. // than its horizontal bounds.
var result = ""; var result = '';
var lines = text.split("\n"); var lines = text.split('\n');
for (var i = 0; i < lines.length; i++) for (var i = 0; i < lines.length; i++)
{ {
var spaceLeft = this.style.wordWrapWidth; var spaceLeft = this.style.wordWrapWidth;
var words = lines[i].split(" "); var words = lines[i].split(' ');
for (var j = 0; j < words.length; j++) for (var j = 0; j < words.length; j++)
{ {
var wordWidth = this.context.measureText(words[j]).width; var wordWidth = this.context.measureText(words[j]).width;
var wordWidthWithSpace = wordWidth + this.context.measureText(" ").width; var wordWidthWithSpace = wordWidth + this.context.measureText(' ').width;
if(wordWidthWithSpace > spaceLeft) if(wordWidthWithSpace > spaceLeft)
{ {
// Skip printing the newline if it's the first word of the line that is // Skip printing the newline if it's the first word of the line that is
// greater than the word wrap width. // greater than the word wrap width.
if(j > 0) if(j > 0)
{ {
result += "\n"; result += '\n';
} }
result += words[j] + " "; result += words[j] + ' ';
spaceLeft = this.style.wordWrapWidth - wordWidth; spaceLeft = this.style.wordWrapWidth - wordWidth;
} }
else else
{ {
spaceLeft -= wordWidthWithSpace; spaceLeft -= wordWidthWithSpace;
result += words[j] + " "; result += words[j] + ' ';
} }
} }
result += "\n"; result += '\n';
} }
return result; return result;
}; };

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

@ -77,7 +77,7 @@ PIXI.BaseTexture = function(source, scaleMode)
{ {
var scope = this; var scope = this;
this.source.onload = function(){ this.source.onload = function() {
scope.hasLoaded = true; scope.hasLoaded = true;
scope.width = scope.source.width; scope.width = scope.source.width;
@ -86,8 +86,8 @@ PIXI.BaseTexture = function(source, scaleMode)
// add it to somewhere... // add it to somewhere...
PIXI.texturesToUpdate.push(scope); PIXI.texturesToUpdate.push(scope);
scope.dispatchEvent( { type: 'loaded', content: scope } ); scope.dispatchEvent( { type: 'loaded', content: scope } );
} };
// this.image.src = imageUrl; //this.image.src = imageUrl;
} }
} }
else else
@ -101,7 +101,7 @@ PIXI.BaseTexture = function(source, scaleMode)
this.imageUrl = null; this.imageUrl = null;
this._powerOf2 = false; this._powerOf2 = false;
} };
PIXI.BaseTexture.prototype.constructor = PIXI.BaseTexture; PIXI.BaseTexture.prototype.constructor = PIXI.BaseTexture;
@ -121,7 +121,7 @@ PIXI.BaseTexture.prototype.destroy = function()
} }
this.source = null; this.source = null;
PIXI.texturesToDestroy.push(this); PIXI.texturesToDestroy.push(this);
} };
/** /**
* *
@ -134,7 +134,7 @@ PIXI.BaseTexture.prototype.updateSourceImage = function(newSrc)
this.hasLoaded = false; this.hasLoaded = false;
this.source.src = null; this.source.src = null;
this.source.src = newSrc; this.source.src = newSrc;
} };
/** /**
* Helper function that returns a base texture based on an image url * Helper function that returns a base texture based on an image url
@ -164,7 +164,7 @@ PIXI.BaseTexture.fromImage = function(imageUrl, crossorigin, scaleMode)
} }
return baseTexture; return baseTexture;
} };
PIXI.BaseTexture.SCALE_MODE = { PIXI.BaseTexture.SCALE_MODE = {
DEFAULT: 0, //default to LINEAR DEFAULT: 0, //default to LINEAR

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

@ -49,7 +49,7 @@ PIXI.RenderTexture = function(width, height)
{ {
this.initCanvas(); this.initCanvas();
} }
} };
PIXI.RenderTexture.prototype = Object.create( PIXI.Texture.prototype ); PIXI.RenderTexture.prototype = Object.create( PIXI.Texture.prototype );
PIXI.RenderTexture.prototype.constructor = PIXI.RenderTexture; PIXI.RenderTexture.prototype.constructor = PIXI.RenderTexture;
@ -95,7 +95,7 @@ PIXI.RenderTexture.prototype.initWebGL = function()
// set the correct render function.. // set the correct render function..
this.render = this.renderWebGL; this.render = this.renderWebGL;
} };
PIXI.RenderTexture.prototype.resize = function(width, height) PIXI.RenderTexture.prototype.resize = function(width, height)
@ -106,8 +106,8 @@ PIXI.RenderTexture.prototype.resize = function(width, height)
if(PIXI.gl) if(PIXI.gl)
{ {
this.projection.x = this.width/2 this.projection.x = this.width / 2;
this.projection.y = -this.height/2; this.projection.y = -this.height / 2;
var gl = PIXI.gl; var gl = PIXI.gl;
gl.bindTexture(gl.TEXTURE_2D, this.baseTexture._glTexture); gl.bindTexture(gl.TEXTURE_2D, this.baseTexture._glTexture);
@ -116,11 +116,11 @@ PIXI.RenderTexture.prototype.resize = function(width, height)
else else
{ {
this.frame.width = this.width this.frame.width = this.width;
this.frame.height = this.height; this.frame.height = this.height;
this.renderer.resize(this.width, this.height); this.renderer.resize(this.width, this.height);
} }
} };
/** /**
* Initializes the canvas data for this texture * Initializes the canvas data for this texture
@ -136,7 +136,7 @@ PIXI.RenderTexture.prototype.initCanvas = function()
this.frame = new PIXI.Rectangle(0, 0, this.width, this.height); this.frame = new PIXI.Rectangle(0, 0, this.width, this.height);
this.render = this.renderCanvas; this.render = this.renderCanvas;
} };
/** /**
* This function will draw the display object to the texture. * This function will draw the display object to the texture.
@ -191,7 +191,7 @@ PIXI.RenderTexture.prototype.renderWebGL = function(displayObject, position, cle
if(renderGroup) if(renderGroup)
{ {
if(displayObject == renderGroup.root) if(displayObject === renderGroup.root)
{ {
renderGroup.render(this.projection, this.glFramebuffer); renderGroup.render(this.projection, this.glFramebuffer);
} }
@ -208,7 +208,7 @@ PIXI.RenderTexture.prototype.renderWebGL = function(displayObject, position, cle
} }
displayObject.worldTransform = originalWorldTransform; displayObject.worldTransform = originalWorldTransform;
} };
/** /**
@ -232,17 +232,16 @@ PIXI.RenderTexture.prototype.renderCanvas = function(displayObject, position, cl
} }
for(var i=0,j=children.length; i<j; i++) for(var i = 0, j = children.length; i < j; i++)
{ {
children[i].updateTransform(); 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); this.renderer.renderDisplayObject(displayObject);
this.renderer.context.setTransform(1,0,0,1,0,0); this.renderer.context.setTransform(1,0,0,1,0,0);
//PIXI.texturesToUpdate.push(this.baseTexture);
// PIXI.texturesToUpdate.push(this.baseTexture); };
}

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

@ -64,9 +64,9 @@ PIXI.Texture = function(baseTexture, frame)
else else
{ {
var scope = this; var scope = this;
baseTexture.addEventListener( 'loaded', function(){ scope.onBaseTextureLoaded()} ); baseTexture.addEventListener('loaded', function(){ scope.onBaseTextureLoaded(); });
} }
} };
PIXI.Texture.prototype.constructor = PIXI.Texture; PIXI.Texture.prototype.constructor = PIXI.Texture;
@ -77,7 +77,7 @@ PIXI.Texture.prototype.constructor = PIXI.Texture;
* @param event * @param event
* @private * @private
*/ */
PIXI.Texture.prototype.onBaseTextureLoaded = function(event) PIXI.Texture.prototype.onBaseTextureLoaded = function()
{ {
var baseTexture = this.baseTexture; var baseTexture = this.baseTexture;
baseTexture.removeEventListener( 'loaded', this.onLoaded ); baseTexture.removeEventListener( 'loaded', this.onLoaded );
@ -88,7 +88,7 @@ PIXI.Texture.prototype.onBaseTextureLoaded = function(event)
this.height = this.frame.height; this.height = this.frame.height;
this.scope.dispatchEvent( { type: 'update', content: this } ); this.scope.dispatchEvent( { type: 'update', content: this } );
} };
/** /**
* Destroys this texture * Destroys this texture
@ -98,8 +98,8 @@ PIXI.Texture.prototype.onBaseTextureLoaded = function(event)
*/ */
PIXI.Texture.prototype.destroy = function(destroyBase) PIXI.Texture.prototype.destroy = function(destroyBase)
{ {
if(destroyBase)this.baseTexture.destroy(); if(destroyBase) this.baseTexture.destroy();
} };
/** /**
* Specifies the rectangle region of the baseTexture * Specifies the rectangle region of the baseTexture
@ -115,14 +115,14 @@ PIXI.Texture.prototype.setFrame = function(frame)
if(frame.x + frame.width > this.baseTexture.width || frame.y + frame.height > this.baseTexture.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); 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); PIXI.Texture.frameUpdates.push(this);
//this.dispatchEvent( { type: 'update', content: this } ); //this.dispatchEvent( { type: 'update', content: this } );
} };
/** /**
* Helper function that returns a texture based on an image url * Helper function that returns a texture based on an image url
@ -145,7 +145,7 @@ PIXI.Texture.fromImage = function(imageUrl, crossorigin, scaleMode)
} }
return texture; return texture;
} };
/** /**
* Helper function that returns a texture based on a frame id * Helper function that returns a texture based on a frame id
@ -159,9 +159,9 @@ PIXI.Texture.fromImage = function(imageUrl, crossorigin, scaleMode)
PIXI.Texture.fromFrame = function(frameId) PIXI.Texture.fromFrame = function(frameId)
{ {
var texture = PIXI.TextureCache[frameId]; var texture = PIXI.TextureCache[frameId];
if(!texture)throw new Error("The frameId '"+ frameId +"' does not exist in the texture cache " + this); if(!texture) throw new Error('The frameId "' + frameId + '" does not exist in the texture cache ' + this);
return texture; return texture;
} };
/** /**
* Helper function that returns a texture based on a canvas element * Helper function that returns a texture based on a canvas element
@ -176,7 +176,7 @@ PIXI.Texture.fromCanvas = function(canvas, scaleMode)
{ {
var baseTexture = new PIXI.BaseTexture(canvas, scaleMode); var baseTexture = new PIXI.BaseTexture(canvas, scaleMode);
return new PIXI.Texture(baseTexture); return new PIXI.Texture(baseTexture);
} };
/** /**
@ -190,7 +190,7 @@ PIXI.Texture.fromCanvas = function(canvas, scaleMode)
PIXI.Texture.addTextureToCache = function(texture, id) PIXI.Texture.addTextureToCache = function(texture, id)
{ {
PIXI.TextureCache[id] = texture; PIXI.TextureCache[id] = texture;
} };
/** /**
* Remove a texture from the textureCache. * Remove a texture from the textureCache.
@ -202,10 +202,10 @@ PIXI.Texture.addTextureToCache = function(texture, id)
*/ */
PIXI.Texture.removeTextureFromCache = function(id) PIXI.Texture.removeTextureFromCache = function(id)
{ {
var texture = PIXI.TextureCache[id] var texture = PIXI.TextureCache[id];
PIXI.TextureCache[id] = null; PIXI.TextureCache[id] = null;
return texture; return texture;
} };
// this is more for webGL.. it contains updated frames.. // this is more for webGL.. it contains updated frames..
PIXI.Texture.frameUpdates = []; PIXI.Texture.frameUpdates = [];

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

@ -23,11 +23,17 @@ PIXI.autoDetectRenderer = function(width, height, view, transparent, antialias)
if(!height)height = 600; if(!height)height = 600;
// BORROWED from Mr Doob (mrdoob.com) // BORROWED from Mr Doob (mrdoob.com)
var webgl = ( function () { try { var canvas = document.createElement( 'canvas' ); return !! window.WebGLRenderingContext && ( canvas.getContext( 'webgl' ) || canvas.getContext( 'experimental-webgl' ) ); } catch( e ) { return false; } } )(); var webgl = ( function () { try {
var canvas = document.createElement( 'canvas' );
return !! window.WebGLRenderingContext && ( canvas.getContext( 'webgl' ) || canvas.getContext( 'experimental-webgl' ) );
} catch( e ) {
return false;
}
} )();
if(webgl) if(webgl)
{ {
var ie = (navigator.userAgent.toLowerCase().indexOf('trident') != -1); var ie = (navigator.userAgent.toLowerCase().indexOf('trident') !== -1);
webgl = !ie; webgl = !ie;
} }
@ -39,5 +45,3 @@ PIXI.autoDetectRenderer = function(width, height, view, transparent, antialias)
return new PIXI.CanvasRenderer(width, height, view, transparent); return new PIXI.CanvasRenderer(width, height, view, transparent);
}; };

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

@ -44,13 +44,14 @@ PIXI.PolyK.Triangulate = function(p)
{ {
var sign = true; var sign = true;
var n = p.length>>1; var n = p.length >> 1;
if(n<3) return []; if(n < 3) return [];
var tgs = []; var tgs = [];
var avl = []; var avl = [];
for(var i=0; i<n; i++) avl.push(i); for(var i = 0; i < n; i++) avl.push(i);
var i = 0; i = 0;
var al = n; var al = n;
while(al > 3) while(al > 3)
{ {
@ -66,13 +67,18 @@ PIXI.PolyK.Triangulate = function(p)
if(PIXI.PolyK._convex(ax, ay, bx, by, cx, cy, sign)) if(PIXI.PolyK._convex(ax, ay, bx, by, cx, cy, sign))
{ {
earFound = true; earFound = true;
for(var j=0; j<al; j++) for(var j = 0; j < al; j++)
{ {
var vi = avl[j]; var vi = avl[j];
if(vi==i0 || vi==i1 || vi==i2) continue; 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(PIXI.PolyK._PointInTriangle(p[2*vi], p[2*vi+1], ax, ay, bx, by, cx, cy)) {
earFound = false;
break;
} }
} }
}
if(earFound) if(earFound)
{ {
tgs.push(i0, i1, i2); tgs.push(i0, i1, i2);
@ -86,9 +92,9 @@ PIXI.PolyK.Triangulate = function(p)
// reset! // reset!
if(sign) if(sign)
{ {
var tgs = []; tgs = [];
avl = []; avl = [];
for(var i=0; i<n; i++) avl.push(i); for(i = 0; i < n; i++) avl.push(i);
i = 0; i = 0;
al = n; al = n;
@ -97,14 +103,15 @@ PIXI.PolyK.Triangulate = function(p)
} }
else else
{ {
console.log("PIXI Warning: shape too complex to fill") window.console.log("PIXI Warning: shape too complex to fill");
return []; return [];
} }
} }
} }
tgs.push(avl[0], avl[1], avl[2]); tgs.push(avl[0], avl[1], avl[2]);
return tgs; return tgs;
} };
/** /**
* Checks if a point is within a triangle * Checks if a point is within a triangle
@ -134,7 +141,7 @@ PIXI.PolyK._PointInTriangle = function(px, py, ax, ay, bx, by, cx, cy)
// Check if point is in triangle // Check if point is in triangle
return (u >= 0) && (v >= 0) && (u + v < 1); return (u >= 0) && (v >= 0) && (u + v < 1);
} };
/** /**
* Checks if a shape is convex * Checks if a shape is convex
@ -145,5 +152,5 @@ PIXI.PolyK._PointInTriangle = function(px, py, ax, ay, bx, by, cx, cy)
*/ */
PIXI.PolyK._convex = function(ax, ay, bx, by, cx, cy, sign) 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;
} };

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

@ -18,13 +18,13 @@
var lastTime = 0; var lastTime = 0;
var vendors = ['ms', 'moz', 'webkit', 'o']; var vendors = ['ms', 'moz', 'webkit', 'o'];
for(var x = 0; x < vendors.length && !window.requestAnimationFrame; ++x) { for(var x = 0; x < vendors.length && !window.requestAnimationFrame; ++x) {
window.requestAnimationFrame = window[vendors[x]+'RequestAnimationFrame']; window.requestAnimationFrame = window[vendors[x] + 'RequestAnimationFrame'];
window.cancelAnimationFrame = window[vendors[x]+'CancelAnimationFrame'] window.cancelAnimationFrame = window[vendors[x] + 'CancelAnimationFrame'] ||
|| window[vendors[x]+'CancelRequestAnimationFrame']; window[vendors[x] + 'CancelRequestAnimationFrame'];
} }
if (!window.requestAnimationFrame) if (!window.requestAnimationFrame) {
window.requestAnimationFrame = function(callback, element) { window.requestAnimationFrame = function(callback) {
var currTime = new Date().getTime(); var currTime = new Date().getTime();
var timeToCall = Math.max(0, 16 - (currTime - lastTime)); var timeToCall = Math.max(0, 16 - (currTime - lastTime));
var id = window.setTimeout(function() { callback(currTime + timeToCall); }, var id = window.setTimeout(function() { callback(currTime + timeToCall); },
@ -32,36 +32,38 @@ if (!window.requestAnimationFrame)
lastTime = currTime + timeToCall; lastTime = currTime + timeToCall;
return id; return id;
}; };
}
if (!window.cancelAnimationFrame) if (!window.cancelAnimationFrame) {
window.cancelAnimationFrame = function(id) { window.cancelAnimationFrame = function(id) {
clearTimeout(id); clearTimeout(id);
}; };
}
window.requestAnimFrame = window.requestAnimationFrame; window.requestAnimFrame = window.requestAnimationFrame;
/** /**
* Converts a hex color number to an [R, G, B] array * Converts a hex color number to an [R, G, B] array
* *
* @method HEXtoRGB * @method hex2rgb
* @param hex {Number} * @param hex {Number}
*/ */
function HEXtoRGB(hex) { PIXI.hex2rgb = function hex2rgb(hex) {
return [(hex >> 16 & 0xFF) / 255, ( hex >> 8 & 0xFF) / 255, (hex & 0xFF)/ 255]; return [(hex >> 16 & 0xFF) / 255, ( hex >> 8 & 0xFF) / 255, (hex & 0xFF)/ 255];
} };
/** /**
* A polyfill for Function.prototype.bind * A polyfill for Function.prototype.bind
* *
* @method bind * @method bind
*/ */
if (typeof Function.prototype.bind != 'function') { if (typeof Function.prototype.bind !== 'function') {
Function.prototype.bind = (function () { Function.prototype.bind = (function () {
var slice = Array.prototype.slice; var slice = Array.prototype.slice;
return function (thisArg) { return function (thisArg) {
var target = this, boundArgs = slice.call(arguments, 1); var target = this, boundArgs = slice.call(arguments, 1);
if (typeof target != 'function') throw new TypeError(); if (typeof target !== 'function') throw new TypeError();
function bound() { function bound() {
var args = boundArgs.concat(slice.call(arguments)); var args = boundArgs.concat(slice.call(arguments));
@ -69,8 +71,8 @@ if (typeof Function.prototype.bind != 'function') {
} }
bound.prototype = (function F(proto) { bound.prototype = (function F(proto) {
proto && (F.prototype = proto); if (proto) F.prototype = proto;
if (!(this instanceof F)) return new F; if (!(this instanceof F)) return new F();
})(target.prototype); })(target.prototype);
return bound; return bound;
@ -84,57 +86,57 @@ if (typeof Function.prototype.bind != 'function') {
* @class AjaxRequest * @class AjaxRequest
* @constructor * @constructor
*/ */
var AjaxRequest = PIXI.AjaxRequest = function() PIXI.AjaxRequest = function AjaxRequest()
{ {
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) if (window.ActiveXObject)
{ //Test for support for ActiveXObject in IE first (as XMLHttpRequest in IE7 is broken) { //Test for support for ActiveXObject in IE first (as XMLHttpRequest in IE7 is broken)
for (var i=0; i<activexmodes.length; i++) for (var i=0; i<activexmodes.length; i++)
{ {
try{ try{
return new ActiveXObject(activexmodes[i]) return new window.ActiveXObject(activexmodes[i]);
} }
catch(e){ catch(e) {
//suppress error //suppress error
} }
} }
} }
else if (window.XMLHttpRequest) // if Mozilla, Safari etc else if (window.XMLHttpRequest) // if Mozilla, Safari etc
{ {
return new XMLHttpRequest() return new window.XMLHttpRequest();
} }
else else
{ {
return false; return false;
} }
} };
/* /*
* DEBUGGING ONLY * DEBUGGING ONLY
*/ */
PIXI.runList = function(item) PIXI.runList = function(item)
{ {
console.log(">>>>>>>>>") window.console.log('>>>>>>>>>');
console.log("_") window.console.log('_');
var safe = 0; var safe = 0;
var tmp = item.first; var tmp = item.first;
console.log(tmp); window.console.log(tmp);
while(tmp._iNext) while(tmp._iNext)
{ {
safe++; safe++;
tmp = tmp._iNext; tmp = tmp._iNext;
console.log(tmp); window.console.log(tmp);
// console.log(tmp); // console.log(tmp);
if(safe > 100) if(safe > 100)
{ {
console.log("BREAK") window.console.log('BREAK');
break break;
} }
} }
} };

27
tasks/karma.js Normal file
View file

@ -0,0 +1,27 @@
'use strict';
var path = require('path');
var server = require('karma').server;
module.exports = function (grunt) {
grunt.registerMultiTask('karma', 'run karma.', function() {
var done = this.async();
var options = this.options({
background: false
});
var data = this.data;
//merge options onto data, with data taking precedence
data = grunt.util._.merge(options, data);
data.configFile = path.resolve(data.configFile);
if (data.configFile) {
data.configFile = grunt.template.process(data.configFile);
}
server.start(
data,
function(code) {
done(!code);
});
});
};

BIN
test/functional/example-1-basics/bunny.png Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 449 B

BIN
test/functional/example-1-basics/frame-30.png Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 5.4 KiB

BIN
test/functional/example-1-basics/frame-60.png Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 5.2 KiB

BIN
test/functional/example-1-basics/frame-90.png Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 5.5 KiB

133
test/functional/example-1-basics/index.js Normal file
View file

@ -0,0 +1,133 @@
describe('Example 1 - Basics', function () {
'use strict';
var baseUri = '/base/test/functional/example-1-basics';
var expect = chai.expect;
var currentFrame = 0;
var frameEvents = {};
var stage;
var renderer;
var bunny;
function onFrame(frame, callback) {
frameEvents[frame] = callback;
}
function animate() {
currentFrame += 1;
window.requestAnimFrame( animate );
// just for fun, lets rotate mr rabbit a little
bunny.rotation += 0.1;
// render the stage
renderer.render(stage);
if (frameEvents[currentFrame])
frameEvents[currentFrame](currentFrame);
}
function initScene() {
// create an new instance of a pixi stage
stage = new PIXI.Stage(0x66FF99);
// create a renderer instance
renderer = PIXI.autoDetectRenderer(400, 300);
console.log('Is PIXI.WebGLRenderer: ' + (renderer instanceof PIXI.WebGLRenderer));
// add the renderer view element to the DOM
document.body.appendChild(renderer.view);
window.requestAnimFrame( animate );
// create a texture from an image path
var texture = PIXI.Texture.fromImage(baseUri + '/bunny.png');
// create a new Sprite using the texture
bunny = new PIXI.Sprite(texture);
// center the sprites anchor point
bunny.anchor.x = 0.5;
bunny.anchor.y = 0.5;
// move the sprite t the center of the screen
bunny.position.x = 200;
bunny.position.y = 150;
stage.addChild(bunny);
}
it('assets loaded', function (done) {
var loader = new PIXI.AssetLoader([
baseUri + '/bunny.png',
baseUri + '/frame-30.png',
baseUri + '/frame-60.png',
baseUri + '/frame-90.png'
]);
// loader.on('onProgress', function (event) {
// console.log(event.content);
// });
loader.on('onComplete', function () {
done();
initScene();
});
loader.load();
});
it('frame 30 should match', function (done) {
this.timeout(700);
onFrame(30, function () {
var str = renderer.view.toDataURL('image/png');
//console.log('<img src="' + str + '" />');
resemble(str)
.compareTo(baseUri + '/frame-30.png')
.onComplete(function (data) {
expect(data).to.be.an('object');
expect(data.isSameDimensions).to.equal(true);
expect(data.misMatchPercentage).to.be.below(0.2);
done();
});
});
});
it('frame 60 should match', function (done) {
this.timeout(1200);
onFrame(60, function () {
var str = renderer.view.toDataURL('image/png');
//console.log('<img src="' + str + '" />');
resemble(str)
.compareTo(baseUri + '/frame-60.png')
.onComplete(function (data) {
expect(data).to.be.an('object');
expect(data.isSameDimensions).to.equal(true);
expect(data.misMatchPercentage).to.be.below(0.2);
done();
});
});
});
it('frame 90 should match', function (done) {
this.timeout(1700);
onFrame(90, function () {
var str = renderer.view.toDataURL('image/png');
//console.log('<img src="' + str + '" />');
resemble(str)
.compareTo(baseUri + '/frame-90.png')
.onComplete(function (data) {
expect(data).to.be.an('object');
expect(data.isSameDimensions).to.equal(true);
expect(data.misMatchPercentage).to.be.below(0.2);
done();
});
});
});
// it('capture something', function (done) {
// this.timeout(2000000);
// onFrame(30, function () {
// var img = new Image();
// img.src = renderer.view.toDataURL('image/png');
// document.body.appendChild(img);
// });
// });
});

22
test/index.html
View file

@ -1,22 +0,0 @@
<!DOCTYPE html>
<html>
<head>
<title>Pixi.js Test Suite</title>
<link rel="stylesheet" href="/test/lib/qunit-1.11.0.css" />
<!-- QUnit includes -->
<script src="/test/lib/qunit-1.11.0.js"></script>
<script>
window.Q = QUnit; //alias QUnit
Q.config.autostart = false;
</script>
</head>
<body>
<div id="qunit"></div>
<div id="qunit-fixture"></div>
<script src="/bin/pixi.dev.js"></script>
<script src="/test/lib/require.js" data-main="testsuite"></script>
</body>
</html>

82
test/karma.conf.js Normal file
View file

@ -0,0 +1,82 @@
module.exports = function(config) {
config.set({
// base path, that will be used to resolve files and exclude
basePath : '../',
frameworks : ['mocha'],
// list of files / patterns to load in the browser
files : [
'node_modules/chai/chai.js',
'bin/pixi.dev.js',
'test/lib/**/*.js',
'test/unit/**/*.js',
// 'test/functional/**/*.js',
{pattern: 'test/**/*.png', watched: false, included: false, served: true}
],
// list of files to exclude
exclude : [],
// use dolts reporter, as travis terminal does not support escaping sequences
// possible values: 'dots', 'progress', 'junit', 'teamcity'
// CLI --reporters progress
reporters : ['progress'],
// web server port
// CLI --port 9876
port : 9876,
// cli runner port
// CLI --runner-port 9100
runnerPort : 9100,
// enable / disable colors in the output (reporters and logs)
// CLI --colors --no-colors
colors : true,
// level of logging
// possible values: karma.LOG_DISABLE || karma.LOG_ERROR || karma.LOG_WARN || karma.LOG_INFO || karma.LOG_DEBUG
// CLI --log-level debug
logLevel : config.LOG_DEBUG,
// enable / disable watching file and executing tests whenever any file changes
// CLI --auto-watch --no-auto-watch
autoWatch : false,
// Start these browsers, currently available:
// - Chrome
// - ChromeCanary
// - Firefox
// - Opera
// - Safari (only Mac)
// - PhantomJS
// - IE (only Windows)
// CLI --browsers Chrome,Firefox,Safari
browsers : ['Firefox'],
// If browser does not capture in given timeout [ms], kill it
// CLI --capture-timeout 5000
captureTimeout : 5000,
// Auto run tests on start (when browsers are captured) and exit
// CLI --single-run --no-single-run
singleRun : true,
// report which specs are slower than 500ms
// CLI --report-slower-than 500
reportSlowerThan : 500,
preprocessors : {
// '**/client/js/*.js': 'coverage'
},
plugins : [
'karma-mocha',
// 'karma-chrome-launcher',
'karma-firefox-launcher',
// 'karma-phantomjs-launcher'
]
});
};

40
test/lib/pixi/core/Matrix.js Normal file
View file

@ -0,0 +1,40 @@
function pixi_core_Matrix_confirmNewMat3(matrix) {
var expect = chai.expect;
expect(matrix).to.be.an.instanceof(PIXI.Matrix);
expect(matrix).to.not.be.empty;
expect(matrix[1]).to.equal(0);
expect(matrix[2]).to.equal(0);
expect(matrix[3]).to.equal(0);
expect(matrix[4]).to.equal(1);
expect(matrix[5]).to.equal(0);
expect(matrix[6]).to.equal(0);
expect(matrix[7]).to.equal(0);
expect(matrix[8]).to.equal(1);
}
function pixi_core_Matrix_confirmNewMat4(matrix) {
var expect = chai.expect;
expect(matrix).to.be.an.instanceof(PIXI.Matrix);
expect(matrix).to.not.be.empty;
expect(matrix[0]).to.equal(1);
expect(matrix[1]).to.equal(0);
expect(matrix[2]).to.equal(0);
expect(matrix[3]).to.equal(0);
expect(matrix[4]).to.equal(0);
expect(matrix[5]).to.equal(1);
expect(matrix[6]).to.equal(0);
expect(matrix[7]).to.equal(0);
expect(matrix[8]).to.equal(0);
expect(matrix[9]).to.equal(0);
expect(matrix[10]).to.equal(1);
expect(matrix[11]).to.equal(0);
expect(matrix[12]).to.equal(0);
expect(matrix[13]).to.equal(0);
expect(matrix[14]).to.equal(0);
expect(matrix[15]).to.equal(1);
}

10
test/lib/pixi/core/Point.js Normal file
View file

@ -0,0 +1,10 @@
function pixi_core_Point_confirm(obj, x, y) {
var expect = chai.expect;
expect(obj).to.be.an.instanceof(PIXI.Point);
expect(obj).to.respondTo('clone');
expect(obj).to.have.property('x', x);
expect(obj).to.have.property('y', y);
}

13
test/lib/pixi/core/Rectangle.js Normal file
View file

@ -0,0 +1,13 @@
function pixi_core_Rectangle_confirm(obj, x, y, width, height) {
var expect = chai.expect;
expect(obj).to.be.an.instanceof(PIXI.Rectangle);
expect(obj).to.respondTo('clone');
expect(obj).to.respondTo('contains');
expect(obj).to.have.property('x', x);
expect(obj).to.have.property('y', y);
expect(obj).to.have.property('width', width);
expect(obj).to.have.property('height', height);
}

43
test/lib/pixi/display/DisplayObject.js Normal file
View file

@ -0,0 +1,43 @@
function pixi_display_DisplayObject_confirmNew(obj) {
var expect = chai.expect;
expect(obj).to.be.an.instanceof(PIXI.DisplayObject);
expect(obj).to.respondTo('setInteractive');
expect(obj).to.respondTo('addFilter');
expect(obj).to.respondTo('removeFilter');
expect(obj).to.respondTo('updateTransform');
expect(obj).to.have.property('last', obj);
expect(obj).to.have.property('first', obj);
expect(obj).to.contain.property('position');
pixi_core_Point_confirm(obj.position, 0, 0);
expect(obj).to.contain.property('scale');
pixi_core_Point_confirm(obj.scale, 1, 1);
expect(obj).to.contain.property('pivot');
pixi_core_Point_confirm(obj.pivot, 0, 0);
expect(obj).to.have.property('rotation', 0);
expect(obj).to.have.property('alpha', 1);
expect(obj).to.have.property('visible', true);
expect(obj).to.have.property('buttonMode', false);
expect(obj).to.have.property('parent', null);
expect(obj).to.have.property('worldAlpha', 1);
expect(obj).to.have.property('hitArea');
expect(obj).to.have.property('interactive'); // TODO: Have a better default value
expect('mask' in obj).to.be.true; // TODO: Have a better default value
expect(obj.mask).to.be.undefined;
expect(obj).to.have.property('renderable');
expect(obj).to.have.property('stage');
expect(obj).to.have.deep.property('worldTransform.length', 9);
pixi_core_Matrix_confirmNewMat3(obj.worldTransform);
expect(obj).to.have.deep.property('localTransform.length', 9);
pixi_core_Matrix_confirmNewMat3(obj.localTransform);
expect(obj).to.have.deep.property('color.length', 0);
expect(obj).to.have.property('dynamic', true);
}

16
test/lib/pixi/display/DisplayObjectContainer.js Normal file
View file

@ -0,0 +1,16 @@
function pixi_display_DisplayObjectContainer_confirmNew(obj) {
var expect = chai.expect;
pixi_display_DisplayObject_confirmNew(obj);
expect(obj).to.be.an.instanceof(PIXI.DisplayObjectContainer);
expect(obj).to.respondTo('addChild');
expect(obj).to.respondTo('addChildAt');
expect(obj).to.respondTo('swapChildren');
expect(obj).to.respondTo('getChildAt');
expect(obj).to.respondTo('removeChild');
expect(obj).to.respondTo('updateTransform');
expect(obj).to.have.deep.property('children.length', 0);
}

28
test/lib/pixi/display/Sprite.js Normal file
View file

@ -0,0 +1,28 @@
function pixi_display_Sprite_confirmNew(obj, done) {
var expect = chai.expect;
pixi_display_DisplayObjectContainer_confirmNew(obj);
expect(obj).to.be.an.instanceof(PIXI.Sprite);
expect(obj).to.respondTo('setTexture');
expect(obj).to.respondTo('onTextureUpdate');
expect(obj).to.have.property('hitArea', null);
expect(obj).to.have.property('interactive', false);
expect(obj).to.have.property('renderable', true);
expect(obj).to.have.property('stage', null);
expect(obj).to.have.property('anchor');
pixi_core_Point_confirm(obj.anchor, 0, 0);
expect(obj).to.have.property('blendMode', PIXI.blendModes.NORMAL);
expect(obj).to.have.property('width', 1); // TODO: is 1 expected
expect(obj).to.have.property('height', 1); // TODO: is 1 expected
// FIXME: Just make this a boolean that is always there
expect(!!obj.updateFrame).to.equal(obj.texture.baseTexture.hasLoaded);
expect(obj).to.have.property('texture');
pixi_textures_Texture_confirmNew(obj.texture, done);
}

12
test/lib/pixi/extras/Strip.js Normal file
View file

@ -0,0 +1,12 @@
function pixi_extras_Strip_confirmNew(obj) {
var expect = chai.expect;
pixi_display_DisplayObjectContainer_confirmNew(obj);
expect(obj).to.be.an.instanceof(PIXI.Strip);
expect(obj).to.respondTo('setTexture');
expect(obj).to.respondTo('onTextureUpdate');
// TODO: Test properties
}

31
test/lib/pixi/textures/Texture.js Normal file
View file

@ -0,0 +1,31 @@
function pixi_textures_Texture_confirmNew(obj, done) {
var expect = chai.expect;
function confirmFrameDone() {
pixi_core_Rectangle_confirm(obj.frame, 0, 0, obj.baseTexture.width, obj.baseTexture.height);
expect(obj).to.have.property('width', obj.baseTexture.width);
expect(obj).to.have.property('height', obj.baseTexture.height);
done();
}
expect(obj).to.be.an.instanceof(PIXI.Texture);
pixi_utils_EventTarget_like(obj);
expect(obj).to.have.property('baseTexture')
.and.to.be.an.instanceof(PIXI.BaseTexture);
expect(obj).to.have.property('scope', obj);
expect(obj).to.have.property('trim');
pixi_core_Point_confirm(obj.trim, 0, 0);
expect(obj).to.have.property('frame');
if (obj.baseTexture.hasLoaded) {
confirmFrameDone();
} else {
obj.addEventListener('update', confirmFrameDone);
pixi_core_Rectangle_confirm(obj.frame, 0, 0, 1, 1);
}
}

8
test/lib/pixi/utils/EventTarget.js Normal file
View file

@ -0,0 +1,8 @@
function pixi_utils_EventTarget_like(obj) {
var expect = chai.expect;
expect(obj).to.respondTo('addEventListener');
expect(obj).to.respondTo('dispatchEvent');
expect(obj).to.respondTo('removeEventListener');
}

244
test/lib/qunit-1.11.0.css
View file

@ -1,244 +0,0 @@
/**
* QUnit v1.11.0 - A JavaScript Unit Testing Framework
*
* http://qunitjs.com
*
* Copyright 2012 jQuery Foundation and other contributors
* Released under the MIT license.
* http://jquery.org/license
*/
/** Font Family and Sizes */
#qunit-tests, #qunit-header, #qunit-banner, #qunit-testrunner-toolbar, #qunit-userAgent, #qunit-testresult {
font-family: "Helvetica Neue Light", "HelveticaNeue-Light", "Helvetica Neue", Calibri, Helvetica, Arial, sans-serif;
}
#qunit-testrunner-toolbar, #qunit-userAgent, #qunit-testresult, #qunit-tests li { font-size: small; }
#qunit-tests { font-size: smaller; }
/** Resets */
#qunit-tests, #qunit-header, #qunit-banner, #qunit-userAgent, #qunit-testresult, #qunit-modulefilter {
margin: 0;
padding: 0;
}
/** Header */
#qunit-header {
padding: 0.5em 0 0.5em 1em;
color: #8699a4;
background-color: #0d3349;
font-size: 1.5em;
line-height: 1em;
font-weight: normal;
border-radius: 5px 5px 0 0;
-moz-border-radius: 5px 5px 0 0;
-webkit-border-top-right-radius: 5px;
-webkit-border-top-left-radius: 5px;
}
#qunit-header a {
text-decoration: none;
color: #c2ccd1;
}
#qunit-header a:hover,
#qunit-header a:focus {
color: #fff;
}
#qunit-testrunner-toolbar label {
display: inline-block;
padding: 0 .5em 0 .1em;
}
#qunit-banner {
height: 5px;
}
#qunit-testrunner-toolbar {
padding: 0.5em 0 0.5em 2em;
color: #5E740B;
background-color: #eee;
overflow: hidden;
}
#qunit-userAgent {
padding: 0.5em 0 0.5em 2.5em;
background-color: #2b81af;
color: #fff;
text-shadow: rgba(0, 0, 0, 0.5) 2px 2px 1px;
}
#qunit-modulefilter-container {
float: right;
}
/** Tests: Pass/Fail */
#qunit-tests {
list-style-position: inside;
}
#qunit-tests li {
padding: 0.4em 0.5em 0.4em 2.5em;
border-bottom: 1px solid #fff;
list-style-position: inside;
}
#qunit-tests.hidepass li.pass, #qunit-tests.hidepass li.running {
display: none;
}
#qunit-tests li strong {
cursor: pointer;
}
#qunit-tests li a {
padding: 0.5em;
color: #c2ccd1;
text-decoration: none;
}
#qunit-tests li a:hover,
#qunit-tests li a:focus {
color: #000;
}
#qunit-tests li .runtime {
float: right;
font-size: smaller;
}
.qunit-assert-list {
margin-top: 0.5em;
padding: 0.5em;
background-color: #fff;
border-radius: 5px;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
}
.qunit-collapsed {
display: none;
}
#qunit-tests table {
border-collapse: collapse;
margin-top: .2em;
}
#qunit-tests th {
text-align: right;
vertical-align: top;
padding: 0 .5em 0 0;
}
#qunit-tests td {
vertical-align: top;
}
#qunit-tests pre {
margin: 0;
white-space: pre-wrap;
word-wrap: break-word;
}
#qunit-tests del {
background-color: #e0f2be;
color: #374e0c;
text-decoration: none;
}
#qunit-tests ins {
background-color: #ffcaca;
color: #500;
text-decoration: none;
}
/*** Test Counts */
#qunit-tests b.counts { color: black; }
#qunit-tests b.passed { color: #5E740B; }
#qunit-tests b.failed { color: #710909; }
#qunit-tests li li {
padding: 5px;
background-color: #fff;
border-bottom: none;
list-style-position: inside;
}
/*** Passing Styles */
#qunit-tests li li.pass {
color: #3c510c;
background-color: #fff;
border-left: 10px solid #C6E746;
}
#qunit-tests .pass { color: #528CE0; background-color: #D2E0E6; }
#qunit-tests .pass .test-name { color: #366097; }
#qunit-tests .pass .test-actual,
#qunit-tests .pass .test-expected { color: #999999; }
#qunit-banner.qunit-pass { background-color: #C6E746; }
/*** Failing Styles */
#qunit-tests li li.fail {
color: #710909;
background-color: #fff;
border-left: 10px solid #EE5757;
white-space: pre;
}
#qunit-tests > li:last-child {
border-radius: 0 0 5px 5px;
-moz-border-radius: 0 0 5px 5px;
-webkit-border-bottom-right-radius: 5px;
-webkit-border-bottom-left-radius: 5px;
}
#qunit-tests .fail { color: #000000; background-color: #EE5757; }
#qunit-tests .fail .test-name,
#qunit-tests .fail .module-name { color: #000000; }
#qunit-tests .fail .test-actual { color: #EE5757; }
#qunit-tests .fail .test-expected { color: green; }
#qunit-banner.qunit-fail { background-color: #EE5757; }
/** Result */
#qunit-testresult {
padding: 0.5em 0.5em 0.5em 2.5em;
color: #2b81af;
background-color: #D2E0E6;
border-bottom: 1px solid white;
}
#qunit-testresult .module-name {
font-weight: bold;
}
/** Fixture */
#qunit-fixture {
position: absolute;
top: -10000px;
left: -10000px;
width: 1000px;
height: 1000px;
}

2152
test/lib/qunit-1.11.0.js
View file

File diff suppressed because it is too large Load diff

35
test/lib/require.js
View file

@ -1,35 +0,0 @@
/*
RequireJS 2.1.5 Copyright (c) 2010-2012, The Dojo Foundation All Rights Reserved.
Available via the MIT or new BSD license.
see: http://github.com/jrburke/requirejs for details
*/
var requirejs,require,define;
(function(aa){function I(b){return"[object Function]"===L.call(b)}function J(b){return"[object Array]"===L.call(b)}function y(b,c){if(b){var d;for(d=0;d<b.length&&(!b[d]||!c(b[d],d,b));d+=1);}}function M(b,c){if(b){var d;for(d=b.length-1;-1<d&&(!b[d]||!c(b[d],d,b));d-=1);}}function s(b,c){return ga.call(b,c)}function m(b,c){return s(b,c)&&b[c]}function G(b,c){for(var d in b)if(s(b,d)&&c(b[d],d))break}function R(b,c,d,m){c&&G(c,function(c,j){if(d||!s(b,j))m&&"string"!==typeof c?(b[j]||(b[j]={}),R(b[j],
c,d,m)):b[j]=c});return b}function u(b,c){return function(){return c.apply(b,arguments)}}function ba(b){if(!b)return b;var c=aa;y(b.split("."),function(b){c=c[b]});return c}function B(b,c,d,m){c=Error(c+"\nhttp://requirejs.org/docs/errors.html#"+b);c.requireType=b;c.requireModules=m;d&&(c.originalError=d);return c}function ha(b){function c(a,f,b){var e,n,c,g,d,S,i,h=f&&f.split("/");e=h;var j=k.map,l=j&&j["*"];if(a&&"."===a.charAt(0))if(f){e=m(k.pkgs,f)?h=[f]:h.slice(0,h.length-1);f=a=e.concat(a.split("/"));
for(e=0;f[e];e+=1)if(n=f[e],"."===n)f.splice(e,1),e-=1;else if(".."===n)if(1===e&&(".."===f[2]||".."===f[0]))break;else 0<e&&(f.splice(e-1,2),e-=2);e=m(k.pkgs,f=a[0]);a=a.join("/");e&&a===f+"/"+e.main&&(a=f)}else 0===a.indexOf("./")&&(a=a.substring(2));if(b&&j&&(h||l)){f=a.split("/");for(e=f.length;0<e;e-=1){c=f.slice(0,e).join("/");if(h)for(n=h.length;0<n;n-=1)if(b=m(j,h.slice(0,n).join("/")))if(b=m(b,c)){g=b;d=e;break}if(g)break;!S&&(l&&m(l,c))&&(S=m(l,c),i=e)}!g&&S&&(g=S,d=i);g&&(f.splice(0,d,
g),a=f.join("/"))}return a}function d(a){A&&y(document.getElementsByTagName("script"),function(f){if(f.getAttribute("data-requiremodule")===a&&f.getAttribute("data-requirecontext")===i.contextName)return f.parentNode.removeChild(f),!0})}function z(a){var f=m(k.paths,a);if(f&&J(f)&&1<f.length)return d(a),f.shift(),i.require.undef(a),i.require([a]),!0}function h(a){var f,b=a?a.indexOf("!"):-1;-1<b&&(f=a.substring(0,b),a=a.substring(b+1,a.length));return[f,a]}function j(a,f,b,e){var n,C,g=null,d=f?f.name:
null,j=a,l=!0,k="";a||(l=!1,a="_@r"+(M+=1));a=h(a);g=a[0];a=a[1];g&&(g=c(g,d,e),C=m(q,g));a&&(g?k=C&&C.normalize?C.normalize(a,function(a){return c(a,d,e)}):c(a,d,e):(k=c(a,d,e),a=h(k),g=a[0],k=a[1],b=!0,n=i.nameToUrl(k)));b=g&&!C&&!b?"_unnormalized"+(Q+=1):"";return{prefix:g,name:k,parentMap:f,unnormalized:!!b,url:n,originalName:j,isDefine:l,id:(g?g+"!"+k:k)+b}}function r(a){var f=a.id,b=m(p,f);b||(b=p[f]=new i.Module(a));return b}function t(a,f,b){var e=a.id,n=m(p,e);if(s(q,e)&&(!n||n.defineEmitComplete))"defined"===
f&&b(q[e]);else r(a).on(f,b)}function v(a,f){var b=a.requireModules,e=!1;if(f)f(a);else if(y(b,function(f){if(f=m(p,f))f.error=a,f.events.error&&(e=!0,f.emit("error",a))}),!e)l.onError(a)}function w(){T.length&&(ia.apply(H,[H.length-1,0].concat(T)),T=[])}function x(a){delete p[a];delete V[a]}function F(a,f,b){var e=a.map.id;a.error?a.emit("error",a.error):(f[e]=!0,y(a.depMaps,function(e,c){var g=e.id,d=m(p,g);d&&(!a.depMatched[c]&&!b[g])&&(m(f,g)?(a.defineDep(c,q[g]),a.check()):F(d,f,b))}),b[e]=!0)}
function D(){var a,f,b,e,n=(b=1E3*k.waitSeconds)&&i.startTime+b<(new Date).getTime(),c=[],g=[],h=!1,j=!0;if(!W){W=!0;G(V,function(b){a=b.map;f=a.id;if(b.enabled&&(a.isDefine||g.push(b),!b.error))if(!b.inited&&n)z(f)?h=e=!0:(c.push(f),d(f));else if(!b.inited&&(b.fetched&&a.isDefine)&&(h=!0,!a.prefix))return j=!1});if(n&&c.length)return b=B("timeout","Load timeout for modules: "+c,null,c),b.contextName=i.contextName,v(b);j&&y(g,function(a){F(a,{},{})});if((!n||e)&&h)if((A||da)&&!X)X=setTimeout(function(){X=
0;D()},50);W=!1}}function E(a){s(q,a[0])||r(j(a[0],null,!0)).init(a[1],a[2])}function K(a){var a=a.currentTarget||a.srcElement,b=i.onScriptLoad;a.detachEvent&&!Y?a.detachEvent("onreadystatechange",b):a.removeEventListener("load",b,!1);b=i.onScriptError;(!a.detachEvent||Y)&&a.removeEventListener("error",b,!1);return{node:a,id:a&&a.getAttribute("data-requiremodule")}}function L(){var a;for(w();H.length;){a=H.shift();if(null===a[0])return v(B("mismatch","Mismatched anonymous define() module: "+a[a.length-
1]));E(a)}}var W,Z,i,N,X,k={waitSeconds:7,baseUrl:"./",paths:{},pkgs:{},shim:{},config:{}},p={},V={},$={},H=[],q={},U={},M=1,Q=1;N={require:function(a){return a.require?a.require:a.require=i.makeRequire(a.map)},exports:function(a){a.usingExports=!0;if(a.map.isDefine)return a.exports?a.exports:a.exports=q[a.map.id]={}},module:function(a){return a.module?a.module:a.module={id:a.map.id,uri:a.map.url,config:function(){return k.config&&m(k.config,a.map.id)||{}},exports:q[a.map.id]}}};Z=function(a){this.events=
m($,a.id)||{};this.map=a;this.shim=m(k.shim,a.id);this.depExports=[];this.depMaps=[];this.depMatched=[];this.pluginMaps={};this.depCount=0};Z.prototype={init:function(a,b,c,e){e=e||{};if(!this.inited){this.factory=b;if(c)this.on("error",c);else this.events.error&&(c=u(this,function(a){this.emit("error",a)}));this.depMaps=a&&a.slice(0);this.errback=c;this.inited=!0;this.ignore=e.ignore;e.enabled||this.enabled?this.enable():this.check()}},defineDep:function(a,b){this.depMatched[a]||(this.depMatched[a]=
!0,this.depCount-=1,this.depExports[a]=b)},fetch:function(){if(!this.fetched){this.fetched=!0;i.startTime=(new Date).getTime();var a=this.map;if(this.shim)i.makeRequire(this.map,{enableBuildCallback:!0})(this.shim.deps||[],u(this,function(){return a.prefix?this.callPlugin():this.load()}));else return a.prefix?this.callPlugin():this.load()}},load:function(){var a=this.map.url;U[a]||(U[a]=!0,i.load(this.map.id,a))},check:function(){if(this.enabled&&!this.enabling){var a,b,c=this.map.id;b=this.depExports;
var e=this.exports,n=this.factory;if(this.inited)if(this.error)this.emit("error",this.error);else{if(!this.defining){this.defining=!0;if(1>this.depCount&&!this.defined){if(I(n)){if(this.events.error)try{e=i.execCb(c,n,b,e)}catch(d){a=d}else e=i.execCb(c,n,b,e);this.map.isDefine&&((b=this.module)&&void 0!==b.exports&&b.exports!==this.exports?e=b.exports:void 0===e&&this.usingExports&&(e=this.exports));if(a)return a.requireMap=this.map,a.requireModules=[this.map.id],a.requireType="define",v(this.error=
a)}else e=n;this.exports=e;if(this.map.isDefine&&!this.ignore&&(q[c]=e,l.onResourceLoad))l.onResourceLoad(i,this.map,this.depMaps);x(c);this.defined=!0}this.defining=!1;this.defined&&!this.defineEmitted&&(this.defineEmitted=!0,this.emit("defined",this.exports),this.defineEmitComplete=!0)}}else this.fetch()}},callPlugin:function(){var a=this.map,b=a.id,d=j(a.prefix);this.depMaps.push(d);t(d,"defined",u(this,function(e){var n,d;d=this.map.name;var g=this.map.parentMap?this.map.parentMap.name:null,h=
i.makeRequire(a.parentMap,{enableBuildCallback:!0});if(this.map.unnormalized){if(e.normalize&&(d=e.normalize(d,function(a){return c(a,g,!0)})||""),e=j(a.prefix+"!"+d,this.map.parentMap),t(e,"defined",u(this,function(a){this.init([],function(){return a},null,{enabled:!0,ignore:!0})})),d=m(p,e.id)){this.depMaps.push(e);if(this.events.error)d.on("error",u(this,function(a){this.emit("error",a)}));d.enable()}}else n=u(this,function(a){this.init([],function(){return a},null,{enabled:!0})}),n.error=u(this,
function(a){this.inited=!0;this.error=a;a.requireModules=[b];G(p,function(a){0===a.map.id.indexOf(b+"_unnormalized")&&x(a.map.id)});v(a)}),n.fromText=u(this,function(e,c){var d=a.name,g=j(d),C=O;c&&(e=c);C&&(O=!1);r(g);s(k.config,b)&&(k.config[d]=k.config[b]);try{l.exec(e)}catch(ca){return v(B("fromtexteval","fromText eval for "+b+" failed: "+ca,ca,[b]))}C&&(O=!0);this.depMaps.push(g);i.completeLoad(d);h([d],n)}),e.load(a.name,h,n,k)}));i.enable(d,this);this.pluginMaps[d.id]=d},enable:function(){V[this.map.id]=
this;this.enabling=this.enabled=!0;y(this.depMaps,u(this,function(a,b){var c,e;if("string"===typeof a){a=j(a,this.map.isDefine?this.map:this.map.parentMap,!1,!this.skipMap);this.depMaps[b]=a;if(c=m(N,a.id)){this.depExports[b]=c(this);return}this.depCount+=1;t(a,"defined",u(this,function(a){this.defineDep(b,a);this.check()}));this.errback&&t(a,"error",this.errback)}c=a.id;e=p[c];!s(N,c)&&(e&&!e.enabled)&&i.enable(a,this)}));G(this.pluginMaps,u(this,function(a){var b=m(p,a.id);b&&!b.enabled&&i.enable(a,
this)}));this.enabling=!1;this.check()},on:function(a,b){var c=this.events[a];c||(c=this.events[a]=[]);c.push(b)},emit:function(a,b){y(this.events[a],function(a){a(b)});"error"===a&&delete this.events[a]}};i={config:k,contextName:b,registry:p,defined:q,urlFetched:U,defQueue:H,Module:Z,makeModuleMap:j,nextTick:l.nextTick,onError:v,configure:function(a){a.baseUrl&&"/"!==a.baseUrl.charAt(a.baseUrl.length-1)&&(a.baseUrl+="/");var b=k.pkgs,c=k.shim,e={paths:!0,config:!0,map:!0};G(a,function(a,b){e[b]?
"map"===b?(k.map||(k.map={}),R(k[b],a,!0,!0)):R(k[b],a,!0):k[b]=a});a.shim&&(G(a.shim,function(a,b){J(a)&&(a={deps:a});if((a.exports||a.init)&&!a.exportsFn)a.exportsFn=i.makeShimExports(a);c[b]=a}),k.shim=c);a.packages&&(y(a.packages,function(a){a="string"===typeof a?{name:a}:a;b[a.name]={name:a.name,location:a.location||a.name,main:(a.main||"main").replace(ja,"").replace(ea,"")}}),k.pkgs=b);G(p,function(a,b){!a.inited&&!a.map.unnormalized&&(a.map=j(b))});if(a.deps||a.callback)i.require(a.deps||[],
a.callback)},makeShimExports:function(a){return function(){var b;a.init&&(b=a.init.apply(aa,arguments));return b||a.exports&&ba(a.exports)}},makeRequire:function(a,f){function d(e,c,h){var g,k;f.enableBuildCallback&&(c&&I(c))&&(c.__requireJsBuild=!0);if("string"===typeof e){if(I(c))return v(B("requireargs","Invalid require call"),h);if(a&&s(N,e))return N[e](p[a.id]);if(l.get)return l.get(i,e,a,d);g=j(e,a,!1,!0);g=g.id;return!s(q,g)?v(B("notloaded",'Module name "'+g+'" has not been loaded yet for context: '+
b+(a?"":". Use require([])"))):q[g]}L();i.nextTick(function(){L();k=r(j(null,a));k.skipMap=f.skipMap;k.init(e,c,h,{enabled:!0});D()});return d}f=f||{};R(d,{isBrowser:A,toUrl:function(b){var d,f=b.lastIndexOf("."),g=b.split("/")[0];if(-1!==f&&(!("."===g||".."===g)||1<f))d=b.substring(f,b.length),b=b.substring(0,f);return i.nameToUrl(c(b,a&&a.id,!0),d,!0)},defined:function(b){return s(q,j(b,a,!1,!0).id)},specified:function(b){b=j(b,a,!1,!0).id;return s(q,b)||s(p,b)}});a||(d.undef=function(b){w();var c=
j(b,a,!0),d=m(p,b);delete q[b];delete U[c.url];delete $[b];d&&(d.events.defined&&($[b]=d.events),x(b))});return d},enable:function(a){m(p,a.id)&&r(a).enable()},completeLoad:function(a){var b,c,e=m(k.shim,a)||{},d=e.exports;for(w();H.length;){c=H.shift();if(null===c[0]){c[0]=a;if(b)break;b=!0}else c[0]===a&&(b=!0);E(c)}c=m(p,a);if(!b&&!s(q,a)&&c&&!c.inited){if(k.enforceDefine&&(!d||!ba(d)))return z(a)?void 0:v(B("nodefine","No define call for "+a,null,[a]));E([a,e.deps||[],e.exportsFn])}D()},nameToUrl:function(a,
b,c){var e,d,h,g,j,i;if(l.jsExtRegExp.test(a))g=a+(b||"");else{e=k.paths;d=k.pkgs;g=a.split("/");for(j=g.length;0<j;j-=1)if(i=g.slice(0,j).join("/"),h=m(d,i),i=m(e,i)){J(i)&&(i=i[0]);g.splice(0,j,i);break}else if(h){a=a===h.name?h.location+"/"+h.main:h.location;g.splice(0,j,a);break}g=g.join("/");g+=b||(/\?/.test(g)||c?"":".js");g=("/"===g.charAt(0)||g.match(/^[\w\+\.\-]+:/)?"":k.baseUrl)+g}return k.urlArgs?g+((-1===g.indexOf("?")?"?":"&")+k.urlArgs):g},load:function(a,b){l.load(i,a,b)},execCb:function(a,
b,c,d){return b.apply(d,c)},onScriptLoad:function(a){if("load"===a.type||ka.test((a.currentTarget||a.srcElement).readyState))P=null,a=K(a),i.completeLoad(a.id)},onScriptError:function(a){var b=K(a);if(!z(b.id))return v(B("scripterror","Script error",a,[b.id]))}};i.require=i.makeRequire();return i}var l,w,x,D,t,E,P,K,Q,fa,la=/(\/\*([\s\S]*?)\*\/|([^:]|^)\/\/(.*)$)/mg,ma=/[^.]\s*require\s*\(\s*["']([^'"\s]+)["']\s*\)/g,ea=/\.js$/,ja=/^\.\//;w=Object.prototype;var L=w.toString,ga=w.hasOwnProperty,ia=
Array.prototype.splice,A=!!("undefined"!==typeof window&&navigator&&document),da=!A&&"undefined"!==typeof importScripts,ka=A&&"PLAYSTATION 3"===navigator.platform?/^complete$/:/^(complete|loaded)$/,Y="undefined"!==typeof opera&&"[object Opera]"===opera.toString(),F={},r={},T=[],O=!1;if("undefined"===typeof define){if("undefined"!==typeof requirejs){if(I(requirejs))return;r=requirejs;requirejs=void 0}"undefined"!==typeof require&&!I(require)&&(r=require,require=void 0);l=requirejs=function(b,c,d,z){var h,
j="_";!J(b)&&"string"!==typeof b&&(h=b,J(c)?(b=c,c=d,d=z):b=[]);h&&h.context&&(j=h.context);(z=m(F,j))||(z=F[j]=l.s.newContext(j));h&&z.configure(h);return z.require(b,c,d)};l.config=function(b){return l(b)};l.nextTick="undefined"!==typeof setTimeout?function(b){setTimeout(b,4)}:function(b){b()};require||(require=l);l.version="2.1.5";l.jsExtRegExp=/^\/|:|\?|\.js$/;l.isBrowser=A;w=l.s={contexts:F,newContext:ha};l({});y(["toUrl","undef","defined","specified"],function(b){l[b]=function(){var c=F._;return c.require[b].apply(c,
arguments)}});if(A&&(x=w.head=document.getElementsByTagName("head")[0],D=document.getElementsByTagName("base")[0]))x=w.head=D.parentNode;l.onError=function(b){throw b;};l.load=function(b,c,d){var l=b&&b.config||{},h;if(A)return h=l.xhtml?document.createElementNS("http://www.w3.org/1999/xhtml","html:script"):document.createElement("script"),h.type=l.scriptType||"text/javascript",h.charset="utf-8",h.async=!0,h.setAttribute("data-requirecontext",b.contextName),h.setAttribute("data-requiremodule",c),
h.attachEvent&&!(h.attachEvent.toString&&0>h.attachEvent.toString().indexOf("[native code"))&&!Y?(O=!0,h.attachEvent("onreadystatechange",b.onScriptLoad)):(h.addEventListener("load",b.onScriptLoad,!1),h.addEventListener("error",b.onScriptError,!1)),h.src=d,K=h,D?x.insertBefore(h,D):x.appendChild(h),K=null,h;if(da)try{importScripts(d),b.completeLoad(c)}catch(j){b.onError(B("importscripts","importScripts failed for "+c+" at "+d,j,[c]))}};A&&M(document.getElementsByTagName("script"),function(b){x||(x=
b.parentNode);if(t=b.getAttribute("data-main"))return r.baseUrl||(E=t.split("/"),Q=E.pop(),fa=E.length?E.join("/")+"/":"./",r.baseUrl=fa,t=Q),t=t.replace(ea,""),r.deps=r.deps?r.deps.concat(t):[t],!0});define=function(b,c,d){var l,h;"string"!==typeof b&&(d=c,c=b,b=null);J(c)||(d=c,c=[]);!c.length&&I(d)&&d.length&&(d.toString().replace(la,"").replace(ma,function(b,d){c.push(d)}),c=(1===d.length?["require"]:["require","exports","module"]).concat(c));if(O){if(!(l=K))P&&"interactive"===P.readyState||M(document.getElementsByTagName("script"),
function(b){if("interactive"===b.readyState)return P=b}),l=P;l&&(b||(b=l.getAttribute("data-requiremodule")),h=F[l.getAttribute("data-requirecontext")])}(h?h.defQueue:T).push([b,c,d])};define.amd={jQuery:!0};l.exec=function(b){return eval(b)};l(r)}})(this);

535
test/lib/resemble.js Normal file
View file

@ -0,0 +1,535 @@
/*
Author: James Cryer
Company: Huddle
Last updated date: 21 Feb 2013
URL: https://github.com/Huddle/Resemble.js
*/
(function(_this){
'use strict';
_this['resemble'] = function( fileData ){
var data = {};
var images = [];
var updateCallbackArray = [];
var tolerance = { // between 0 and 255
red: 16,
green: 16,
blue: 16,
minBrightness: 16,
maxBrightness: 240
};
var ignoreAntialiasing = false;
var ignoreColors = false;
function triggerDataUpdate(){
var len = updateCallbackArray.length;
var i;
for(i=0;i<len;i++){
if (typeof updateCallbackArray[i] === 'function'){
updateCallbackArray[i](data);
}
}
}
function loop(x, y, callback){
var i,j;
for (i=0;i<x;i++){
for (j=0;j<y;j++){
callback(i, j);
}
}
}
function parseImage(sourceImageData, width, height){
var pixleCount = 0;
var redTotal = 0;
var greenTotal = 0;
var blueTotal = 0;
var brightnessTotal = 0;
loop(height, width, function(verticalPos, horizontalPos){
var offset = (verticalPos*width + horizontalPos) * 4;
var red = sourceImageData[offset];
var green = sourceImageData[offset + 1];
var blue = sourceImageData[offset + 2];
var brightness = getBrightness(red,green,blue);
pixleCount++;
redTotal += red / 255 * 100;
greenTotal += green / 255 * 100;
blueTotal += blue / 255 * 100;
brightnessTotal += brightness / 255 * 100;
});
data.red = Math.floor(redTotal / pixleCount);
data.green = Math.floor(greenTotal / pixleCount);
data.blue = Math.floor(blueTotal / pixleCount);
data.brightness = Math.floor(brightnessTotal / pixleCount);
triggerDataUpdate();
}
function loadImageData( fileData, callback ){
var fileReader,
hiddenImage = new Image();
hiddenImage.onload = function() {
var hiddenCanvas = document.createElement('canvas');
var imageData;
var width = hiddenImage.width;
var height = hiddenImage.height;
hiddenCanvas.width = width;
hiddenCanvas.height = height;
hiddenCanvas.getContext('2d').drawImage(hiddenImage, 0, 0, width, height);
imageData = hiddenCanvas.getContext('2d').getImageData(0, 0, width, height);
images.push(imageData);
callback(imageData, width, height);
};
if (typeof fileData === 'string') {
hiddenImage.src = fileData;
} else {
fileReader = new FileReader();
fileReader.onload = function (event) {
hiddenImage.src = event.target.result;
};
fileReader.readAsDataURL(fileData);
}
}
function isColorSimilar(a, b, color){
var absDiff = Math.abs(a - b);
if(typeof a === 'undefined'){
return false;
}
if(typeof b === 'undefined'){
return false;
}
if(a === b){
return true;
} else if ( absDiff < tolerance[color] ) {
return true;
} else {
return false;
}
}
function isNumber(n) {
return !isNaN(parseFloat(n));
}
function isPixelBrightnessSimilar(d1, d2){
return Math.abs(d1.brightness - d2.brightness) < tolerance.minBrightness;
}
function getBrightness(r,g,b){
return 0.3*r + 0.59*g + 0.11*b;
}
function isRGBSame(d1,d2){
var red = d1.r === d2.r;
var green = d1.g === d2.g;
var blue = d1.b === d2.b;
return red && green && blue;
}
function isRGBSimilar(d1, d2){
var red = isColorSimilar(d1.r,d2.r,'red');
var green = isColorSimilar(d1.g,d2.g,'green');
var blue = isColorSimilar(d1.b,d2.b,'blue');
return red && green && blue;
}
function isContrasting(d1, d2){
return Math.abs(d1.brightness - d2.brightness) > tolerance.maxBrightness;
}
function getHue(r,g,b){
r = r / 255;
g = g / 255;
b = b / 255;
var max = Math.max(r, g, b), min = Math.min(r, g, b);
var h;
var d;
if (max == min){
h = 0; // achromatic
} else{
d = max - min;
switch(max){
case r: h = (g - b) / d + (g < b ? 6 : 0); break;
case g: h = (b - r) / d + 2; break;
case b: h = (r - g) / d + 4; break;
}
h /= 6;
}
return h;
}
function isAntialiased(sourcePix, data, cacheSet, verticalPos, horizontalPos, width){
var offset;
var targetPix;
var distance = 1;
var i;
var j;
var hasHighContrastSibling = 0;
var hasSiblingWithDifferentHue = 0;
var hasEquivilantSibling = 0;
addHueInfo(sourcePix);
for (i = distance*-1; i <= distance; i++){
for (j = distance*-1; j <= distance; j++){
if(i===0 && j===0){
// ignore source pixel
} else {
offset = ((verticalPos+j)*width + (horizontalPos+i)) * 4;
targetPix = getPixelInfo(data, offset, cacheSet);
if(targetPix === null){
continue;
}
addBrightnessInfo(targetPix);
addHueInfo(targetPix);
if( isContrasting(sourcePix, targetPix) ){
hasHighContrastSibling++;
}
if( isRGBSame(sourcePix,targetPix) ){
hasEquivilantSibling++;
}
if( Math.abs(targetPix.h - sourcePix.h) > 0.3 ){
hasSiblingWithDifferentHue++;
}
if( hasSiblingWithDifferentHue > 1 || hasHighContrastSibling > 1){
return true;
}
}
}
}
if(hasEquivilantSibling < 2){
return true;
}
return false;
}
function errorPixel(px, offset){
px[offset] = 255; //r
px[offset + 1] = 0; //g
px[offset + 2] = 255; //b
px[offset + 3] = 255; //a
}
function copyPixel(px, offset, data){
px[offset] = data.r; //r
px[offset + 1] = data.g; //g
px[offset + 2] = data.b; //b
px[offset + 3] = 255; //a
}
function copyGrayScalePixel(px, offset, data){
px[offset] = data.brightness; //r
px[offset + 1] = data.brightness; //g
px[offset + 2] = data.brightness; //b
px[offset + 3] = 255; //a
}
function getPixelInfo(data, offset, cacheSet){
var r;
var g;
var b;
var d;
if(typeof data[offset] !== 'undefined'){
r = data[offset];
g = data[offset+1];
b = data[offset+2];
d = {
r: r,
g: g,
b: b
};
return d;
} else {
return null;
}
}
function addBrightnessInfo(data){
data.brightness = getBrightness(data.r,data.g,data.b); // 'corrected' lightness
}
function addHueInfo(data){
data.h = getHue(data.r,data.g,data.b);
}
function analyseImages(img1, img2, width, height){
var hiddenCanvas = document.createElement('canvas');
var data1 = img1.data;
var data2 = img2.data;
hiddenCanvas.width = width;
hiddenCanvas.height = height;
var context = hiddenCanvas.getContext('2d');
var imgd = context.createImageData(width,height);
var targetPix = imgd.data;
var mismatchCount = 0;
var time = Date.now();
var skip;
if( (width > 1200 || height > 1200) && ignoreAntialiasing){
skip = 6;
}
loop(height, width, function(verticalPos, horizontalPos){
if(skip){ // only skip if the image isn't small
if(verticalPos % skip === 0 || horizontalPos % skip === 0){
return;
}
}
var offset = (verticalPos*width + horizontalPos) * 4;
var pixel1 = getPixelInfo(data1, offset, 1);
var pixel2 = getPixelInfo(data2, offset, 2);
if(pixel1 === null || pixel2 === null){
return;
}
if (ignoreColors){
addBrightnessInfo(pixel1);
addBrightnessInfo(pixel2);
if( isPixelBrightnessSimilar(pixel1, pixel2) ){
copyGrayScalePixel(targetPix, offset, pixel2);
} else {
errorPixel(targetPix, offset);
mismatchCount++;
}
return;
}
if( isRGBSimilar(pixel1, pixel2) ){
copyPixel(targetPix, offset, pixel2);
} else if( ignoreAntialiasing && (
addBrightnessInfo(pixel1), // jit pixel info augmentation looks a little weird, sorry.
addBrightnessInfo(pixel2),
isAntialiased(pixel1, data1, 1, verticalPos, horizontalPos, width) ||
isAntialiased(pixel2, data2, 2, verticalPos, horizontalPos, width)
)){
if( isPixelBrightnessSimilar(pixel1, pixel2) ){
copyGrayScalePixel(targetPix, offset, pixel2);
} else {
errorPixel(targetPix, offset);
mismatchCount++;
}
} else {
errorPixel(targetPix, offset);
mismatchCount++;
}
});
data.misMatchPercentage = (mismatchCount / (height*width) * 100).toFixed(2);
data.analysisTime = Date.now() - time;
data.getImageDataUrl = function(text){
var barHeight = 0;
if(text){
barHeight = addLabel(text,context,hiddenCanvas);
}
context.putImageData(imgd, 0, barHeight);
return hiddenCanvas.toDataURL("image/png");
};
}
function addLabel(text, context, hiddenCanvas){
var textPadding = 2;
context.font = '12px sans-serif';
var textWidth = context.measureText(text).width + textPadding*2;
var barHeight = 22;
if(textWidth > hiddenCanvas.width){
hiddenCanvas.width = textWidth;
}
hiddenCanvas.height += barHeight;
context.fillStyle = "#666";
context.fillRect(0,0,hiddenCanvas.width,barHeight -4);
context.fillStyle = "#fff";
context.fillRect(0,barHeight -4,hiddenCanvas.width, 4);
context.fillStyle = "#fff";
context.textBaseline = "top";
context.font = '12px sans-serif';
context.fillText(text, textPadding, 1);
return barHeight;
}
function normalise(img, w, h){
var c;
var context;
if(img.height < h || img.width < w){
c = document.createElement('canvas');
c.width = w;
c.height = h;
context = c.getContext('2d');
context.putImageData(img, 0, 0);
return context.getImageData(0, 0, w, h);
}
return img;
}
function compare(one, two){
function onceWeHaveBoth(){
var width;
var height;
if(images.length === 2){
width = images[0].width > images[1].width ? images[0].width : images[1].width;
height = images[0].height > images[1].height ? images[0].height : images[1].height;
if( (images[0].width === images[1].width) && (images[0].height === images[1].height) ){
data.isSameDimensions = true;
} else {
data.isSameDimensions = false;
}
analyseImages( normalise(images[0],width, height), normalise(images[1],width, height), width, height);
triggerDataUpdate();
}
}
images = [];
loadImageData(one, onceWeHaveBoth);
loadImageData(two, onceWeHaveBoth);
}
function getCompareApi(param){
var secondFileData,
hasMethod = typeof param === 'function';
if( !hasMethod ){
// assume it's file data
secondFileData = param;
}
var self = {
ignoreNothing: function(){
tolerance.red = 16;
tolerance.green = 16;
tolerance.blue = 16;
tolerance.minBrightness = 16;
tolerance.maxBrightness = 240;
ignoreAntialiasing = false;
ignoreColors = false;
if(hasMethod) { param(); }
return self;
},
ignoreAntialiasing: function(){
tolerance.red = 32;
tolerance.green = 32;
tolerance.blue = 32;
tolerance.minBrightness = 64;
tolerance.maxBrightness = 96;
ignoreAntialiasing = true;
ignoreColors = false;
if(hasMethod) { param(); }
return self;
},
ignoreColors: function(){
tolerance.minBrightness = 16;
tolerance.maxBrightness = 240;
ignoreAntialiasing = false;
ignoreColors = true;
if(hasMethod) { param(); }
return self;
},
onComplete: function( callback ){
updateCallbackArray.push(callback);
var wrapper = function(){
compare(fileData, secondFileData);
};
wrapper();
return getCompareApi(wrapper);
}
};
return self;
}
return {
onComplete: function( callback ){
updateCallbackArray.push(callback);
loadImageData(fileData, function(imageData, width, height){
parseImage(imageData.data, width, height);
});
},
compareTo: function(secondFileData){
return getCompareApi(secondFileData);
}
};
};
}(this));

36
test/testsuite.js
View file

@ -1,36 +0,0 @@
requirejs.config({
baseUrl: '/test/unit/'
});
define(function(require) {
var testModules = [
'Pixi',
'Point',
'Rectangle',
'DisplayObject',
'DisplayObjectContainer',
'Sprite',
'MovieClip',
'InteractionManager',
'Stage',
'utils/Utils',
'utils/EventTarget',
'utils/Matrix',
'utils/Detector',
'renderers/WebGLShaders',
'renderers/WebGLRenderer',
'renderers/WebGLBatch',
'renderers/CanvasRenderer',
'extras/Strip',
'extras/Rope',
'textures/BaseTexture',
'textures/Texture',
'loaders/SpriteSheetLoader',
'loaders/AssetLoader'
];
// Resolve all testModules and then start the Test Runner.
require(testModules, function() {
QUnit.start();
});
});

BIN
test/textures/SpriteSheet-Aliens.png Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 142 KiB

BIN
test/textures/SpriteSheet-Explosion.png Executable file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 899 KiB

BIN
test/textures/bunny.png Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 449 B

3
test/unit/DisplayObject.js
View file

@ -1,3 +0,0 @@
define(function() {
Q.module('DisplayObject');
});

3
test/unit/DisplayObjectContainer.js
View file

@ -1,3 +0,0 @@
define(function() {
Q.module('DisplayObjectContainer');
});

3
test/unit/InteractionManager.js
View file

@ -1,3 +0,0 @@
define(function() {
Q.module('InteractionManager');
});

3
test/unit/MovieClip.js
View file

@ -1,3 +0,0 @@
define(function() {
Q.module('MovieClip');
});

3
test/unit/Pixi.js
View file

@ -1,3 +0,0 @@
define(function() {
Q.module('Pixi');
});

3
test/unit/Point.js
View file

@ -1,3 +0,0 @@
define(function() {
Q.module('Point');
});

3
test/unit/Rectangle.js
View file

@ -1,3 +0,0 @@
define(function() {
Q.module('Rectangle');
});

3
test/unit/Sprite.js
View file

@ -1,3 +0,0 @@
define(function() {
Q.module('Sprite');
});

3
test/unit/Stage.js
View file

@ -1,3 +0,0 @@
define(function() {
Q.module('Stage');
});

Some files were not shown because too many files have changed in this diff Show more