Updated to Pixi 1.5 final.

InputHandler.pixelPerfectOver - performs a pixel perfect check to see if any pointer is over the current object (warning: very expensive!)
InputHandler.pixelPerfectClick - performs a pixel perfect check but only when the pointer touches/clicks on the current object.
This commit is contained in:
photonstorm
2014-02-12 01:25:36 +00:00
parent da878b2181
commit ab5c07dfe8
46 changed files with 845 additions and 526 deletions
+1
View File
@@ -120,6 +120,7 @@ Bug Fixes:
* IE11 didn't populate the Device.ieVersion value. Now extracted from Trident revision, but still use Device.trident instead for IE11+ checks. * IE11 didn't populate the Device.ieVersion value. Now extracted from Trident revision, but still use Device.trident instead for IE11+ checks.
* Fixed bug in Math.angleBetween where it was using the coordinates in the wrong order. * Fixed bug in Math.angleBetween where it was using the coordinates in the wrong order.
* Previously using a Pixel Perfect check didn't work if the Sprite was rotated or had a non-zero anchor point, now works under all conditions + atlas frames. * Previously using a Pixel Perfect check didn't work if the Sprite was rotated or had a non-zero anchor point, now works under all conditions + atlas frames.
* If pixelPerfect Input Sprites overlapped each other the pixel check wasn't taken into consieration in the Pointer move method.
TO DO: TO DO:
+380 -224
View File
File diff suppressed because it is too large Load Diff
+13 -13
View File
File diff suppressed because one or more lines are too long
+2 -2
View File
@@ -3,8 +3,8 @@ var game = new Phaser.Game(800, 600, Phaser.CANVAS, 'phaser-example', { preload:
function preload() { function preload() {
game.load.atlasXML('seacreatures', 'assets/sprites/seacreatures.png', 'assets/sprites/seacreatures.xml'); // game.load.atlasXML('seacreatures', 'assets/sprites/seacreatures.png', 'assets/sprites/seacreatures.xml');
// game.load.atlas('seacreatures', 'assets/sprites/seacreatures_json.png', 'assets/sprites/seacreatures_json.json'); game.load.atlas('seacreatures', 'assets/sprites/seacreatures_json.png', 'assets/sprites/seacreatures_json.json');
// Just a few images to use in our underwater scene // Just a few images to use in our underwater scene
game.load.image('undersea', 'assets/pics/undersea.jpg'); game.load.image('undersea', 'assets/pics/undersea.jpg');
+42
View File
@@ -0,0 +1,42 @@
var game = new Phaser.Game(800, 600, Phaser.AUTO, 'phaser-example', { preload: preload, create: create });
function preload() {
game.load.atlas('seacreatures', 'assets/sprites/seacreatures_json.png', 'assets/sprites/seacreatures_json.json');
}
var sprite1;
var sprite2;
var sprite3;
function create() {
sprite1 = game.add.sprite(200, 300, 'seacreatures', 'blueJellyfish0000');
sprite2 = game.add.sprite(230, 300, 'seacreatures', 'crab10000');
sprite3 = game.add.sprite(280, 250, 'seacreatures', 'seahorse0000');
sprite1.inputEnabled = true;
sprite2.inputEnabled = true;
sprite3.inputEnabled = true;
sprite1.input.priorityID = 0;
sprite2.input.priorityID = 1;
sprite3.input.priorityID = 2;
sprite1.input.pixelPerfectClick = true;
sprite2.input.pixelPerfectClick = true;
sprite3.input.pixelPerfectClick = true;
sprite1.events.onInputDown.add(clicked, this);
sprite2.events.onInputDown.add(clicked, this);
sprite3.events.onInputDown.add(clicked, this);
}
function clicked(s) {
console.log('clicked', s.frameName);
}
+3 -28
View File
@@ -153,15 +153,7 @@ Phaser.AnimationParser = {
frames[i].spriteSourceSize.h frames[i].spriteSourceSize.h
); );
PIXI.TextureCache[uuid].trimmed = true; PIXI.TextureCache[uuid].trim = new Phaser.Rectangle(frames[i].spriteSourceSize.x, frames[i].spriteSourceSize.y, frames[i].sourceSize.w, frames[i].sourceSize.h);
PIXI.TextureCache[uuid].trim = {
x: frames[i].spriteSourceSize.x,
y: frames[i].spriteSourceSize.y,
realWidth: frames[i].sourceSize.w,
realHeight: frames[i].sourceSize.h
}
} }
} }
@@ -229,15 +221,7 @@ Phaser.AnimationParser = {
frames[key].spriteSourceSize.h frames[key].spriteSourceSize.h
); );
PIXI.TextureCache[uuid].trimmed = true; PIXI.TextureCache[uuid].trim = new Phaser.Rectangle(frames[i].spriteSourceSize.x, frames[i].spriteSourceSize.y, frames[i].sourceSize.w, frames[i].sourceSize.h);
PIXI.TextureCache[uuid].trim = {
x: frames[i].spriteSourceSize.x,
y: frames[i].spriteSourceSize.y,
realWidth: frames[i].sourceSize.w,
realHeight: frames[i].sourceSize.h
}
} }
i++; i++;
@@ -319,16 +303,7 @@ Phaser.AnimationParser = {
{ {
newFrame.setTrim(true, width, height, frameX, frameY, frameWidth, frameHeight); newFrame.setTrim(true, width, height, frameX, frameY, frameWidth, frameHeight);
PIXI.TextureCache[uuid].realSize = { x: frameX, y: frameY, w: frameWidth, h: frameHeight }; PIXI.TextureCache[uuid].trim = new Phaser.Rectangle(frameX, frameY, width, height);
PIXI.TextureCache[uuid].trimmed = true;
PIXI.TextureCache[uuid].trim = {
x: frameX,
y: frameY,
realWidth: width,
realHeight: height
}
} }
} }
+30
View File
@@ -502,6 +502,36 @@ Phaser.InputHandler.prototype = {
}, },
/**
* Checks if the given pointer is over this Sprite and can click it.
* @method Phaser.InputHandler#checkPointerDown
* @param {Phaser.Pointer} pointer
* @return {boolean}
*/
checkPointerDown: function (pointer) {
if (this.enabled === false || this.sprite.visible === false || this.sprite.parent.visible === false)
{
return false;
}
// Need to pass it a temp point, in case we need it again for the pixel check
if (this.game.input.hitTest(this.sprite, pointer, this._tempPoint))
{
if (this.pixelPerfectClick)
{
return this.checkPixel(this._tempPoint.x, this._tempPoint.y);
}
else
{
return true;
}
}
return false;
},
/** /**
* Checks if the given pointer is over this Sprite. * Checks if the given pointer is over this Sprite.
* @method Phaser.InputHandler#checkPointerOver * @method Phaser.InputHandler#checkPointerOver
+14 -8
View File
@@ -225,12 +225,12 @@ Phaser.Pointer.prototype = {
this._holdSent = false; this._holdSent = false;
// This sets the x/y and other local values // This sets the x/y and other local values
this.move(event); this.move(event, true);
// x and y are the old values here? // x and y are the old values here?
this.positionDown.setTo(this.x, this.y); this.positionDown.setTo(this.x, this.y);
if (this.game.input.multiInputOverride == Phaser.Input.MOUSE_OVERRIDES_TOUCH || this.game.input.multiInputOverride == Phaser.Input.MOUSE_TOUCH_COMBINE || (this.game.input.multiInputOverride == Phaser.Input.TOUCH_OVERRIDES_MOUSE && this.game.input.currentPointers === 0)) if (this.game.input.multiInputOverride === Phaser.Input.MOUSE_OVERRIDES_TOUCH || this.game.input.multiInputOverride === Phaser.Input.MOUSE_TOUCH_COMBINE || (this.game.input.multiInputOverride === Phaser.Input.TOUCH_OVERRIDES_MOUSE && this.game.input.currentPointers === 0))
{ {
this.game.input.x = this.x; this.game.input.x = this.x;
this.game.input.y = this.y; this.game.input.y = this.y;
@@ -242,7 +242,7 @@ Phaser.Pointer.prototype = {
this._stateReset = false; this._stateReset = false;
this.totalTouches++; this.totalTouches++;
if (this.isMouse === false) if (!this.isMouse)
{ {
this.game.input.currentPointers++; this.game.input.currentPointers++;
} }
@@ -297,14 +297,17 @@ Phaser.Pointer.prototype = {
* Called when the Pointer is moved. * Called when the Pointer is moved.
* @method Phaser.Pointer#move * @method Phaser.Pointer#move
* @param {MouseEvent|PointerEvent|TouchEvent} event - The event passed up from the input handler. * @param {MouseEvent|PointerEvent|TouchEvent} event - The event passed up from the input handler.
* @param {boolean} [fromClick=false] - Was this called from the click event?
*/ */
move: function (event) { move: function (event, fromClick) {
if (this.game.input.pollLocked) if (this.game.input.pollLocked)
{ {
return; return;
} }
if (typeof fromClick === 'undefined') { fromClick = false; }
if (typeof event.button !== 'undefined') if (typeof event.button !== 'undefined')
{ {
this.button = event.button; this.button = event.button;
@@ -371,11 +374,14 @@ Phaser.Pointer.prototype = {
do do
{ {
// If the object is using pixelPerfect checks, or has a higher InputManager.PriorityID OR if the priority ID is the same as the current highest AND it has a higher renderOrderID, then set it to the top // If the object is using pixelPerfect checks, or has a higher InputManager.PriorityID OR if the priority ID is the same as the current highest AND it has a higher renderOrderID, then set it to the top
if (currentNode.pixelPerfect || currentNode.priorityID > this._highestInputPriorityID || (currentNode.priorityID == this._highestInputPriorityID && currentNode.sprite.renderOrderID > this._highestRenderOrderID)) if (currentNode.pixelPerfectClick || currentNode.pixelPerfectOver || currentNode.priorityID > this._highestInputPriorityID || (currentNode.priorityID === this._highestInputPriorityID && currentNode.sprite.renderOrderID > this._highestRenderOrderID))
{ {
if (currentNode.checkPointerOver(this)) if ((!fromClick && currentNode.checkPointerOver(this)) || (fromClick && currentNode.checkPointerDown(this)))
{ {
// console.log('HRO set', currentNode.sprite.name); if (fromClick)
{
console.log('HRO set', currentNode.sprite.name, currentNode.priorityID, 'current highest', this._highestRenderOrderID, 'highest p', this._highestInputPriorityID);
}
this._highestRenderOrderID = currentNode.sprite.renderOrderID; this._highestRenderOrderID = currentNode.sprite.renderOrderID;
this._highestInputPriorityID = currentNode.priorityID; this._highestInputPriorityID = currentNode.priorityID;
this._highestRenderObject = currentNode; this._highestRenderObject = currentNode;
@@ -443,7 +449,7 @@ Phaser.Pointer.prototype = {
leave: function (event) { leave: function (event) {
this.withinGame = false; this.withinGame = false;
this.move(event); this.move(event, false);
}, },
+44 -27
View File
@@ -40,12 +40,37 @@ PIXI.InteractionManager = function(stage)
// helpers // helpers
this.tempPoint = new PIXI.Point(); this.tempPoint = new PIXI.Point();
/**
*
* @property mouseoverEnabled
* @type Boolean
* @default
*/
this.mouseoverEnabled = true; this.mouseoverEnabled = true;
//tiny little interactiveData pool! /**
* tiny little interactiveData pool !
*
* @property pool
* @type Array
*/
this.pool = []; this.pool = [];
/**
* An array containing all the iterative items from the our interactive tree
* @property interactiveItems
* @type Array
* @private
*
*/
this.interactiveItems = []; this.interactiveItems = [];
/**
* Our canvas
* @property interactionDOMElement
* @type HTMLCanvasElement
* @private
*/
this.interactionDOMElement = null; this.interactionDOMElement = null;
//this will make it so that you dont have to call bind all the time //this will make it so that you dont have to call bind all the time
@@ -57,10 +82,23 @@ 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;
/**
* The css style of the cursor that is being used
* @property currentCursorStyle
* @type String
*
*/
this.currentCursorStyle = 'inherit'; this.currentCursorStyle = 'inherit';
/**
* Is set to true when the mouse is moved out of the canvas
* @property mouseOut
* @type Boolean
*
*/
this.mouseOut = false; this.mouseOut = false;
}; };
@@ -72,7 +110,7 @@ PIXI.InteractionManager.prototype.constructor = PIXI.InteractionManager;
* *
* @method collectInteractiveSprite * @method collectInteractiveSprite
* @param displayObject {DisplayObject} the displayObject to collect * @param displayObject {DisplayObject} the displayObject to collect
* @param iParent {DisplayObject} * @param iParent {DisplayObject} the display object's parent
* @private * @private
*/ */
PIXI.InteractionManager.prototype.collectInteractiveSprite = function(displayObject, iParent) PIXI.InteractionManager.prototype.collectInteractiveSprite = function(displayObject, iParent)
@@ -80,12 +118,11 @@ PIXI.InteractionManager.prototype.collectInteractiveSprite = function(displayObj
var children = displayObject.children; var children = displayObject.children;
var length = children.length; var length = children.length;
/// make an interaction tree... {item.__interactiveParent} // make an interaction tree... {item.__interactiveParent}
for (var i = length-1; i >= 0; i--) for (var i = length-1; i >= 0; i--)
{ {
var child = children[i]; var child = children[i];
// if(child.visible) {
// push all interactive bits // push all interactive bits
if(child.interactive) if(child.interactive)
{ {
@@ -107,7 +144,7 @@ PIXI.InteractionManager.prototype.collectInteractiveSprite = function(displayObj
this.collectInteractiveSprite(child, iParent); this.collectInteractiveSprite(child, iParent);
} }
} }
// }
} }
}; };
@@ -143,7 +180,6 @@ PIXI.InteractionManager.prototype.setTarget = function(target)
*/ */
PIXI.InteractionManager.prototype.setTargetDomElement = function(domElement) PIXI.InteractionManager.prototype.setTargetDomElement = function(domElement)
{ {
//remove previouse listeners
this.removeEvents(); this.removeEvents();
@@ -209,7 +245,6 @@ PIXI.InteractionManager.prototype.update = function()
diff = (diff * PIXI.INTERACTION_FREQUENCY ) / 1000; diff = (diff * PIXI.INTERACTION_FREQUENCY ) / 1000;
if(diff < 1)return; if(diff < 1)return;
this.last = now; this.last = now;
//
var i = 0; var i = 0;
@@ -235,9 +270,6 @@ PIXI.InteractionManager.prototype.update = function()
// loop through interactive objects! // loop through interactive objects!
var length = this.interactiveItems.length; var length = this.interactiveItems.length;
var cursor = 'inherit'; var cursor = 'inherit';
var over = false; var over = false;
@@ -245,9 +277,6 @@ PIXI.InteractionManager.prototype.update = function()
{ {
var item = this.interactiveItems[i]; var item = this.interactiveItems[i];
//if(!item.visible)continue;
// OPTIMISATION - only calculate every time if the mousemove function exists.. // OPTIMISATION - only calculate every time if the mousemove function exists..
// OK so.. does the object have any other interactive functions? // OK so.. does the object have any other interactive functions?
// hit-test the clip! // hit-test the clip!
@@ -266,16 +295,9 @@ PIXI.InteractionManager.prototype.update = function()
if(!item.__isOver) if(!item.__isOver)
{ {
if(item.mouseover)item.mouseover(this.mouse); if(item.mouseover)item.mouseover(this.mouse);
item.__isOver = true; item.__isOver = true;
// just the one!
//break;
} }
//break;
} }
else else
{ {
@@ -286,8 +308,6 @@ PIXI.InteractionManager.prototype.update = function()
item.__isOver = false; item.__isOver = false;
} }
} }
// }
// --->
} }
if( this.currentCursorStyle !== cursor ) if( this.currentCursorStyle !== cursor )
@@ -295,7 +315,6 @@ PIXI.InteractionManager.prototype.update = function()
this.currentCursorStyle = cursor; this.currentCursorStyle = cursor;
this.interactionDOMElement.style.cursor = cursor; this.interactionDOMElement.style.cursor = cursor;
} }
}; };
/** /**
@@ -374,7 +393,7 @@ PIXI.InteractionManager.prototype.onMouseDown = function(event)
/** /**
* Is called when the mouse button is moved out of the renderer element * Is called when the mouse button is moved out of the renderer element
* *
* @method onMouseDown * @method onMouseOut
* @param event {Event} The DOM event of a mouse button being moved out * @param event {Event} The DOM event of a mouse button being moved out
* @private * @private
*/ */
@@ -421,8 +440,6 @@ PIXI.InteractionManager.prototype.onMouseUp = function(event)
{ {
var item = this.interactiveItems[i]; var item = this.interactiveItems[i];
//if(item.mouseup || item.mouseupoutside || item.click)
//{
item.__hit = this.hitTest(item, this.mouse); item.__hit = this.hitTest(item, this.mouse);
if(item.__hit && !up) if(item.__hit && !up)
@@ -695,4 +712,4 @@ PIXI.InteractionManager.prototype.onTouchEnd = function(event)
this.pool.push(touchData); this.pool.push(touchData);
this.touchs[touchEvent.identifier] = null; this.touchs[touchEvent.identifier] = null;
} }
}; };
+9 -1
View File
@@ -7,6 +7,11 @@
*/ */
var PIXI = PIXI || {}; var PIXI = PIXI || {};
/*
*
* This file contains a lot of pixi consts which are used across the rendering engine
* @class Consts
*/
PIXI.WEBGL_RENDERER = 0; PIXI.WEBGL_RENDERER = 0;
PIXI.CANVAS_RENDERER = 1; PIXI.CANVAS_RENDERER = 1;
@@ -43,4 +48,7 @@ PIXI.scaleModes = {
// interaction frequency // interaction frequency
PIXI.INTERACTION_FREQUENCY = 30; PIXI.INTERACTION_FREQUENCY = 30;
PIXI.AUTO_PREVENT_DEFAULT = true; PIXI.AUTO_PREVENT_DEFAULT = true;
PIXI.RAD_TO_DEG = 180 / Math.PI;
PIXI.DEG_TO_RAD = Math.PI / 180;
+3 -4
View File
@@ -68,14 +68,13 @@ PIXI.Ellipse.prototype.contains = function(x, y)
return false; return false;
//normalize the coords to an ellipse with center 0,0 //normalize the coords to an ellipse with center 0,0
//and a radius of 0.5 var normx = ((x - this.x) / this.width),
var normx = ((x - this.x) / this.width) - 0.5, normy = ((y - this.y) / this.height);
normy = ((y - this.y) / this.height) - 0.5;
normx *= normx; normx *= normx;
normy *= normy; normy *= normy;
return (normx + normy < 0.25); return (normx + normy <= 1);
}; };
/** /**
+28 -6
View File
@@ -2,18 +2,27 @@
* @author Mat Groves http://matgroves.com/ @Doormat23 * @author Mat Groves http://matgroves.com/ @Doormat23
*/ */
/*
* @class Matrix
* The Matrix class will choose the best type of array to use between
* a regular javascript Array and a Float32Array if the latter is available
*
*/
PIXI.determineMatrixArrayType = function() { PIXI.determineMatrixArrayType = function() {
return (typeof Float32Array !== 'undefined') ? Float32Array : Array; return (typeof Float32Array !== 'undefined') ? Float32Array : Array;
}; };
/*
* @class Matrix2
* The Matrix2 class will choose the best type of array to use between
* a regular javascript Array and a Float32Array if the latter is available
*
*/
PIXI.Matrix2 = PIXI.determineMatrixArrayType(); PIXI.Matrix2 = PIXI.determineMatrixArrayType();
/*
* @class Matrix
* The Matrix class is now an object, which makes it a lot faster,
* here is a representation of it :
* | a | b | tx|
* | c | c | ty|
* | 0 | 0 | 1 |
*
*/
PIXI.Matrix = function() PIXI.Matrix = function()
{ {
this.a = 1; this.a = 1;
@@ -24,6 +33,12 @@ PIXI.Matrix = function()
this.ty = 0; this.ty = 0;
}; };
/**
* Creates a pixi matrix object based on the array given as a parameter
*
* @method fromArray
* @param array {Array} The array that the matrix will be filled with
*/
PIXI.Matrix.prototype.fromArray = function(array) PIXI.Matrix.prototype.fromArray = function(array)
{ {
this.a = array[0]; this.a = array[0];
@@ -34,6 +49,13 @@ PIXI.Matrix.prototype.fromArray = function(array)
this.ty = array[5]; this.ty = array[5];
}; };
/**
* Creates an array from the current Matrix object
*
* @method toArray
* @param transpose {Boolean} Whether we need to transpose the matrix or not
* @return array {Array} the newly created array which contains the matrix
*/
PIXI.Matrix.prototype.toArray = function(transpose) PIXI.Matrix.prototype.toArray = function(transpose)
{ {
if(!this.array) this.array = new Float32Array(9); if(!this.array) this.array = new Float32Array(9);
+8 -19
View File
@@ -10,8 +10,6 @@
*/ */
PIXI.DisplayObject = function() PIXI.DisplayObject = function()
{ {
this.last = this;
this.first = this;
/** /**
* The coordinate of the object relative to the local coordinates of the parent. * The coordinate of the object relative to the local coordinates of the parent.
* *
@@ -196,7 +194,6 @@ PIXI.DisplayObject = function()
*/ */
this._mask = null; this._mask = null;
/* /*
* MOUSE Callbacks * MOUSE Callbacks
*/ */
@@ -402,7 +399,6 @@ PIXI.DisplayObject.prototype.updateTransform = function()
// var localTransform = this.localTransform//.toArray(); // var localTransform = this.localTransform//.toArray();
var parentTransform = this.parent.worldTransform;//.toArray(); var parentTransform = this.parent.worldTransform;//.toArray();
var worldTransform = this.worldTransform;//.toArray(); var worldTransform = this.worldTransform;//.toArray();
//console.log(localTransform)
var px = this.pivot.x; var px = this.pivot.x;
var py = this.pivot.y; var py = this.pivot.y;
@@ -412,16 +408,16 @@ PIXI.DisplayObject.prototype.updateTransform = function()
a11 = this._cr * this.scale.y, a11 = this._cr * this.scale.y,
a02 = this.position.x + a00 * px - py * a01, a02 = this.position.x + a00 * px - py * a01,
a12 = this.position.y + a11 * py - px * a10, a12 = this.position.y + a11 * py - px * a10,
b00 = parentTransform.a, b01 = parentTransform.b, b02 = parentTransform.tx, b00 = parentTransform.a, b01 = parentTransform.b,
b10 = parentTransform.c, b11 = parentTransform.d, b12 = parentTransform.ty; b10 = parentTransform.c, b11 = parentTransform.d;
worldTransform.a = b00 * a00 + b01 * a10; worldTransform.a = b00 * a00 + b01 * a10;
worldTransform.b = b00 * a01 + b01 * a11; worldTransform.b = b00 * a01 + b01 * a11;
worldTransform.tx = b00 * a02 + b01 * a12 + b02; worldTransform.tx = b00 * a02 + b01 * a12 + parentTransform.tx;
worldTransform.c = b10 * a00 + b11 * a10; worldTransform.c = b10 * a00 + b11 * a10;
worldTransform.d = b10 * a01 + b11 * a11; worldTransform.d = b10 * a01 + b11 * a11;
worldTransform.ty = b10 * a02 + b11 * a12 + b12; worldTransform.ty = b10 * a02 + b11 * a12 + parentTransform.ty;
this.worldAlpha = this.alpha * this.parent.worldAlpha; this.worldAlpha = this.alpha * this.parent.worldAlpha;
}; };
@@ -432,8 +428,9 @@ PIXI.DisplayObject.prototype.updateTransform = function()
* @method getBounds * @method getBounds
* @return {Rectangle} the rectangular bounding area * @return {Rectangle} the rectangular bounding area
*/ */
PIXI.DisplayObject.prototype.getBounds = function() PIXI.DisplayObject.prototype.getBounds = function( matrix )
{ {
matrix = matrix;//just to get passed js hinting (and preserve inheritance)
return PIXI.EmptyRectangle; return PIXI.EmptyRectangle;
}; };
@@ -445,17 +442,9 @@ PIXI.DisplayObject.prototype.getBounds = function()
*/ */
PIXI.DisplayObject.prototype.getLocalBounds = function() PIXI.DisplayObject.prototype.getLocalBounds = function()
{ {
var matrixCache = this.worldTransform; //var matrixCache = this.worldTransform;
this.worldTransform = PIXI.identityMatrix; return this.getBounds(PIXI.identityMatrix);///PIXI.EmptyRectangle();
this.updateTransform();
var bounds = this.getBounds();
this.worldTransform = matrixCache;
return bounds;
}; };
/** /**
+49 -8
View File
@@ -16,7 +16,7 @@ PIXI.DisplayObjectContainer = function()
PIXI.DisplayObject.call( this ); PIXI.DisplayObject.call( this );
/** /**
* [read-only] The of children of this container. * [read-only] The array of children of this container.
* *
* @property children * @property children
* @type Array<DisplayObject> * @type Array<DisplayObject>
@@ -36,7 +36,7 @@ PIXI.DisplayObjectContainer.prototype.constructor = PIXI.DisplayObjectContainer;
* @type Number * @type Number
*/ */
/* /*
Object.defineProperty(PIXI.DisplayObjectContainer.prototype, 'width', { Object.defineProperty(PIXI.DisplayObjectContainer.prototype, 'width', {
get: function() { get: function() {
return this.scale.x * this.getLocalBounds().width; return this.scale.x * this.getLocalBounds().width;
@@ -55,7 +55,7 @@ Object.defineProperty(PIXI.DisplayObjectContainer.prototype, 'width', {
* @type Number * @type Number
*/ */
/* /*
Object.defineProperty(PIXI.DisplayObjectContainer.prototype, 'height', { Object.defineProperty(PIXI.DisplayObjectContainer.prototype, 'height', {
get: function() { get: function() {
return this.scale.y * this.getLocalBounds().height; return this.scale.y * this.getLocalBounds().height;
@@ -173,6 +173,24 @@ PIXI.DisplayObjectContainer.prototype.removeChild = function(child)
} }
}; };
/**
* Removes all the children
*
* @method removeAll
* NOT tested yet
*/
/* PIXI.DisplayObjectContainer.prototype.removeAll = function()
{
for(var i = 0 , j = this.children.length; i < j; i++)
{
this.removeChild(this.children[i]);
}
};
*/
/* /*
* Updates the container's childrens transform for rendering * Updates the container's childrens transform for rendering
* *
@@ -199,12 +217,18 @@ PIXI.DisplayObjectContainer.prototype.updateTransform = function()
* @method getBounds * @method getBounds
* @return {Rectangle} the rectangular bounding area * @return {Rectangle} the rectangular bounding area
*/ */
PIXI.DisplayObjectContainer.prototype.getBounds = function() PIXI.DisplayObjectContainer.prototype.getBounds = function(matrix)
{ {
if(this.children.length === 0)return PIXI.EmptyRectangle; if(this.children.length === 0)return PIXI.EmptyRectangle;
// TODO the bounds have already been calculated this render session so return what we have // TODO the bounds have already been calculated this render session so return what we have
if(matrix)
{
var matrixCache = this.worldTransform;
this.worldTransform = matrix;
this.updateTransform();
this.worldTransform = matrixCache;
}
var minX = Infinity; var minX = Infinity;
var minY = Infinity; var minY = Infinity;
@@ -226,7 +250,7 @@ PIXI.DisplayObjectContainer.prototype.getBounds = function()
childVisible = true; childVisible = true;
childBounds = this.children[i].getBounds(); childBounds = this.children[i].getBounds( matrix );
minX = minX < childBounds.x ? minX : childBounds.x; minX = minX < childBounds.x ? minX : childBounds.x;
minY = minY < childBounds.y ? minY : childBounds.y; minY = minY < childBounds.y ? minY : childBounds.y;
@@ -254,6 +278,24 @@ PIXI.DisplayObjectContainer.prototype.getBounds = function()
return bounds; return bounds;
}; };
PIXI.DisplayObjectContainer.prototype.getLocalBounds = function()
{
var matrixCache = this.worldTransform;
this.worldTransform = PIXI.identityMatrix;
for(var i=0,j=this.children.length; i<j; i++)
{
this.children[i].updateTransform();
}
var bounds = this.getBounds();
this.worldTransform = matrixCache;
return bounds;
};
/** /**
* Sets the container's stage reference, the stage this object is connected to * Sets the container's stage reference, the stage this object is connected to
* *
@@ -368,5 +410,4 @@ PIXI.DisplayObjectContainer.prototype._renderCanvas = function(renderSession)
{ {
renderSession.maskManager.popMask(renderSession.context); renderSession.maskManager.popMask(renderSession.context);
} }
}; };
+13 -11
View File
@@ -165,12 +165,13 @@ PIXI.Sprite.prototype.onTextureUpdate = function()
}; };
/** /**
* Retrieves the bounds of the sprite as a rectangle object * Returns the framing rectangle of the sprite as a PIXI.Rectangle object
* *
* @method getBounds * @method getBounds
* @return {Rectangle} the rectangular bounding area * @param matrix {Matrix} the transformation matrix of the sprite
*/ * @return {Rectangle} the framing rectangle
PIXI.Sprite.prototype.getBounds = function() */
PIXI.Sprite.prototype.getBounds = function(matrix)
{ {
var width = this.texture.frame.width; var width = this.texture.frame.width;
@@ -182,7 +183,7 @@ PIXI.Sprite.prototype.getBounds = function()
var h0 = height * (1-this.anchor.y); var h0 = height * (1-this.anchor.y);
var h1 = height * -this.anchor.y; var h1 = height * -this.anchor.y;
var worldTransform = this.worldTransform; var worldTransform = matrix || this.worldTransform ;
var a = worldTransform.a; var a = worldTransform.a;
var b = worldTransform.c; var b = worldTransform.c;
@@ -347,7 +348,7 @@ PIXI.Sprite.prototype._renderCanvas = function(renderSession)
if (renderSession.roundPixels) if (renderSession.roundPixels)
{ {
context.setTransform(transform.a, transform.c, transform.b, transform.d, Math.floor(transform.tx), Math.floor(transform.ty)); context.setTransform(transform.a, transform.c, transform.b, transform.d, transform.tx || 0, transform.ty || 0);
} }
else else
{ {
@@ -391,7 +392,7 @@ PIXI.Sprite.prototype._renderCanvas = function(renderSession)
if(texture.trimmed) if(texture.trim)
{ {
var trim = texture.trim; var trim = texture.trim;
@@ -400,8 +401,8 @@ PIXI.Sprite.prototype._renderCanvas = function(renderSession)
frame.y, frame.y,
frame.width, frame.width,
frame.height, frame.height,
trim.x - this.anchor.x * trim.realWidth, trim.x - this.anchor.x * trim.width,
trim.y - this.anchor.y * trim.realHeight, trim.y - this.anchor.y * trim.height,
frame.width, frame.width,
frame.height); frame.height);
} }
@@ -435,6 +436,7 @@ PIXI.Sprite.prototype._renderCanvas = function(renderSession)
} }
}; };
// some helper functions.. // some helper functions..
/** /**
+17 -7
View File
@@ -3,7 +3,20 @@
*/ */
/** /**
* TODO-Alvin * The SpriteBatch class is a really fast version of the DisplayObjectContainer
* built solely for speed, so use when you need a lot of sprites or particles.
* And it's extremely easy to use :
var container = new PIXI.SpriteBatch();
stage.addChild(container);
for(var i = 0; i < 100; i++)
{
var sprite = new PIXI.Sprite.fromImage("myImage.png");
container.addChild(sprite);
}
* And here you have a hundred sprites that will be renderer at the speed of light
* *
* @class SpriteBatch * @class SpriteBatch
* @constructor * @constructor
@@ -18,10 +31,9 @@ PIXI.SpriteBatch = function(texture)
this.ready = false; this.ready = false;
}; };
PIXI.SpriteBatch.prototype = Object.create( PIXI.DisplayObjectContainer.prototype ); PIXI.SpriteBatch.prototype = Object.create(PIXI.DisplayObjectContainer.prototype);
PIXI.SpriteBatch.constructor = PIXI.SpriteBatch; PIXI.SpriteBatch.constructor = PIXI.SpriteBatch;
/* /*
* Initialises the spriteBatch * Initialises the spriteBatch
* *
@@ -30,10 +42,10 @@ PIXI.SpriteBatch.constructor = PIXI.SpriteBatch;
*/ */
PIXI.SpriteBatch.prototype.initWebGL = function(gl) PIXI.SpriteBatch.prototype.initWebGL = function(gl)
{ {
// TODO only one needed for the whole engine really?
this.fastSpriteBatch = new PIXI.WebGLFastSpriteBatch(gl); this.fastSpriteBatch = new PIXI.WebGLFastSpriteBatch(gl);
this.ready = true; this.ready = true;
// alert("!")
}; };
/* /*
@@ -44,7 +56,7 @@ PIXI.SpriteBatch.prototype.initWebGL = function(gl)
*/ */
PIXI.SpriteBatch.prototype.updateTransform = function() PIXI.SpriteBatch.prototype.updateTransform = function()
{ {
// dont need to! // TODO dont need to!
PIXI.DisplayObject.prototype.updateTransform.call( this ); PIXI.DisplayObject.prototype.updateTransform.call( this );
// PIXI.DisplayObjectContainer.prototype.updateTransform.call( this ); // PIXI.DisplayObjectContainer.prototype.updateTransform.call( this );
}; };
@@ -143,8 +155,6 @@ PIXI.SpriteBatch.prototype._renderCanvas = function(renderSession)
d = child._cr * child.scale.y; d = child._cr * child.scale.y;
context.setTransform(a, c, b, d, child.position.x, child.position.y); context.setTransform(a, c, b, d, child.position.x, child.position.y);
//context.setTransform(transform.a, transform.c, transform.b, transform.d, transform.tx, transform.ty);
context.drawImage(texture.baseTexture.source, context.drawImage(texture.baseTexture.source,
frame.x, frame.x,
+3 -4
View File
@@ -5,8 +5,8 @@
* *
* @class Rope * @class Rope
* @constructor * @constructor
* @param texture {Texture} TODO-Alvin * @param texture {Texture} The texture to use
* @param y {Array} TODO-Alvin * @param points {Array}
* *
*/ */
PIXI.Rope = function(texture, points) PIXI.Rope = function(texture, points)
@@ -38,7 +38,7 @@ PIXI.Rope.prototype = Object.create( PIXI.Strip.prototype );
PIXI.Rope.prototype.constructor = PIXI.Rope; PIXI.Rope.prototype.constructor = PIXI.Rope;
/* /*
* Refreshes TODO-Alvin * Refreshes
* *
* @method refresh * @method refresh
*/ */
@@ -177,7 +177,6 @@ PIXI.Rope.prototype.updateTransform = function()
}; };
/* /*
* Sets the texture that the Rope will use * Sets the texture that the Rope will use
* TODO-Alvin
* *
* @method setTexture * @method setTexture
* @param texture {Texture} the texture that will be used * @param texture {Texture} the texture that will be used
+2
View File
@@ -14,6 +14,8 @@
* *
*/ */
var spine = {}; var spine = {};
spine.BoneData = function (name, parent) { spine.BoneData = function (name, parent) {
+7 -8
View File
@@ -5,13 +5,13 @@
/** /**
* *
* @class Strip * @class Strip
* @extends DisplayObjectContainer
* @constructor * @constructor
* @param texture {Texture} TODO-Alvin * @param texture {Texture} The texture to use
* @param width {Number} the width of the TODO-Alvin * @param width {Number} the width
* @param height {Number} the height of the TODO-Alvin * @param height {Number} the height
* *
*/ */
PIXI.Strip = function(texture, width, height) PIXI.Strip = function(texture, width, height)
{ {
PIXI.DisplayObjectContainer.call( this ); PIXI.DisplayObjectContainer.call( this );
@@ -56,6 +56,7 @@ PIXI.Strip = function(texture, width, height)
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;
@@ -76,12 +77,11 @@ PIXI.Strip = function(texture, width, height)
}; };
// constructor // constructor
PIXI.Strip.prototype = Object.create( PIXI.DisplayObjectContainer.prototype ); PIXI.Strip.prototype = Object.create(PIXI.DisplayObjectContainer.prototype);
PIXI.Strip.prototype.constructor = PIXI.Strip; PIXI.Strip.prototype.constructor = PIXI.Strip;
/* /*
* Sets the texture that the Strip will use * Sets the texture that the Strip will use
* TODO-Alvin
* *
* @method setTexture * @method setTexture
* @param texture {Texture} the texture that will be used * @param texture {Texture} the texture that will be used
@@ -109,5 +109,4 @@ PIXI.Strip.prototype.setTexture = function(texture)
PIXI.Strip.prototype.onTextureUpdate = function() PIXI.Strip.prototype.onTextureUpdate = function()
{ {
this.updateFrame = true; this.updateFrame = true;
}; };
// some helper functions..
+38 -10
View File
@@ -40,7 +40,7 @@ PIXI.TilingSprite = function(texture, width, height)
this.tileScale = new PIXI.Point(1,1); this.tileScale = new PIXI.Point(1,1);
/** /**
* * A point that represents the scale of the texture object
* *
* @property tileScaleOffset * @property tileScaleOffset
* @type Point * @type Point
@@ -55,6 +55,14 @@ PIXI.TilingSprite = function(texture, width, height)
*/ */
this.tilePosition = new PIXI.Point(0,0); this.tilePosition = new PIXI.Point(0,0);
/**
* Whether this sprite is renderable or not
*
* @property renderable
* @type Boolean
* @default true
*/
this.renderable = true; this.renderable = true;
/** /**
@@ -77,7 +85,7 @@ PIXI.TilingSprite = function(texture, width, height)
}; };
// constructor // constructor
PIXI.TilingSprite.prototype = Object.create( PIXI.Sprite.prototype ); PIXI.TilingSprite.prototype = Object.create(PIXI.Sprite.prototype);
PIXI.TilingSprite.prototype.constructor = PIXI.TilingSprite; PIXI.TilingSprite.prototype.constructor = PIXI.TilingSprite;
@@ -113,7 +121,7 @@ Object.defineProperty(PIXI.TilingSprite.prototype, 'height', {
}); });
/** /**
* When the texture is updated, this event will fire to update the scale and frame * When the texture is updated, this event will be fired to update the scale and frame
* *
* @method onTextureUpdate * @method onTextureUpdate
* @param event * @param event
@@ -121,13 +129,16 @@ Object.defineProperty(PIXI.TilingSprite.prototype, 'height', {
*/ */
PIXI.TilingSprite.prototype.onTextureUpdate = function() PIXI.TilingSprite.prototype.onTextureUpdate = function()
{ {
// so if _width is 0 then width was not set..
//console.log("HI MUM")
this.updateFrame = true; this.updateFrame = true;
}; };
/**
* Renders the object using the WebGL renderer
*
* @method _renderWebGL
* @param renderSession {RenderSession}
* @private
*/
PIXI.TilingSprite.prototype._renderWebGL = function(renderSession) PIXI.TilingSprite.prototype._renderWebGL = function(renderSession)
{ {
@@ -179,7 +190,13 @@ PIXI.TilingSprite.prototype._renderWebGL = function(renderSession)
} }
}; };
/**
* Renders the object using the Canvas renderer
*
* @method _renderCanvas
* @param renderSession {RenderSession}
* @private
*/
PIXI.TilingSprite.prototype._renderCanvas = function(renderSession) PIXI.TilingSprite.prototype._renderCanvas = function(renderSession)
{ {
if(this.visible === false || this.alpha === 0)return; if(this.visible === false || this.alpha === 0)return;
@@ -227,7 +244,6 @@ PIXI.TilingSprite.prototype._renderCanvas = function(renderSession)
tilePosition.x %= this.tilingTexture.baseTexture.width; tilePosition.x %= this.tilingTexture.baseTexture.width;
tilePosition.y %= this.tilingTexture.baseTexture.height; tilePosition.y %= this.tilingTexture.baseTexture.height;
// console.log(tileScale.x)
// offset // offset
context.scale(tileScale.x,tileScale.y); context.scale(tileScale.x,tileScale.y);
context.translate(tilePosition.x, tilePosition.y); context.translate(tilePosition.x, tilePosition.y);
@@ -246,6 +262,13 @@ PIXI.TilingSprite.prototype._renderCanvas = function(renderSession)
} }
}; };
/**
* Returns the framing rectangle of the sprite as a PIXI.Rectangle object
*
* @method getBounds
* @return {Rectangle} the framing rectangle
*/
PIXI.TilingSprite.prototype.getBounds = function() PIXI.TilingSprite.prototype.getBounds = function()
{ {
@@ -319,7 +342,12 @@ PIXI.TilingSprite.prototype.getBounds = function()
return bounds; return bounds;
}; };
/**
*
* @method generateTilingTexture
*
* @param forcePowerOfTwo {Boolean} Whether we want to force the texture to be a power of two
*/
PIXI.TilingSprite.prototype.generateTilingTexture = function(forcePowerOfTwo) PIXI.TilingSprite.prototype.generateTilingTexture = function(forcePowerOfTwo)
{ {
var texture = this.texture; var texture = this.texture;
-1
View File
@@ -19,7 +19,6 @@ PIXI.AlphaMaskFilter = function(texture)
texture.baseTexture._powerOf2 = true; texture.baseTexture._powerOf2 = true;
// set the uniforms // set the uniforms
//console.log()
this.uniforms = { this.uniforms = {
mask: {type: 'sampler2D', value:texture}, mask: {type: 'sampler2D', value:texture},
mapDimensions: {type: '2f', value:{x:1, y:5112}}, mapDimensions: {type: '2f', value:{x:1, y:5112}},
-1
View File
@@ -19,7 +19,6 @@ PIXI.DisplacementFilter = function(texture)
texture.baseTexture._powerOf2 = true; texture.baseTexture._powerOf2 = true;
// set the uniforms // set the uniforms
//console.log()
this.uniforms = { this.uniforms = {
displacementMap: {type: 'sampler2D', value:texture}, displacementMap: {type: 'sampler2D', value:texture},
scale: {type: '2f', value:{x:30, y:30}}, scale: {type: '2f', value:{x:30, y:30}},
-1
View File
@@ -3,7 +3,6 @@
*/ */
PIXI.FilterBlock = function() PIXI.FilterBlock = function()
{ {
this.visible = true; this.visible = true;
-1
View File
@@ -20,7 +20,6 @@ PIXI.NormalMapFilter = function(texture)
texture.baseTexture._powerOf2 = true; texture.baseTexture._powerOf2 = true;
// set the uniforms // set the uniforms
//console.log()
this.uniforms = { this.uniforms = {
displacementMap: {type: 'sampler2D', value:texture}, displacementMap: {type: 'sampler2D', value:texture},
scale: {type: '2f', value:{x:15, y:15}}, scale: {type: '2f', value:{x:15, y:15}},
+5 -5
View File
@@ -112,8 +112,8 @@ PIXI.AssetLoader.prototype.load = function()
{ {
var scope = this; var scope = this;
function onLoad() { function onLoad(evt) {
scope.onAssetLoaded(); scope.onAssetLoaded(evt.loader);
} }
this.loadCount = this.assetURLs.length; this.loadCount = this.assetURLs.length;
@@ -145,11 +145,11 @@ PIXI.AssetLoader.prototype.load = function()
* @method onAssetLoaded * @method onAssetLoaded
* @private * @private
*/ */
PIXI.AssetLoader.prototype.onAssetLoaded = function() PIXI.AssetLoader.prototype.onAssetLoaded = function(loader)
{ {
this.loadCount--; this.loadCount--;
this.dispatchEvent({type: 'onProgress', content: this}); this.dispatchEvent({ type: 'onProgress', content: this, loader: loader });
if (this.onProgress) this.onProgress(); if (this.onProgress) this.onProgress(loader);
if (!this.loadCount) if (!this.loadCount)
{ {
+1 -6
View File
@@ -111,15 +111,10 @@ PIXI.JsonLoader.prototype.onJSONLoaded = function () {
var texture = PIXI.TextureCache[i]; var texture = PIXI.TextureCache[i];
texture.trimmed = true;
var actualSize = frameData[i].sourceSize; var actualSize = frameData[i].sourceSize;
var realSize = frameData[i].spriteSourceSize; var realSize = frameData[i].spriteSourceSize;
texture.trim.x = realSize.x; texture.trim = new PIXI.Rectangle(realSize.x, realSize.y, actualSize.w, actualSize.h);
texture.trim.y = realSize.y;
texture.trim.realWidth = actualSize.w;
texture.trim.realHeight = actualSize.h;
} }
} }
} }
+7 -7
View File
@@ -80,7 +80,7 @@ PIXI.Graphics = function()
this.currentPath = {points:[]}; this.currentPath = {points:[]};
/** /**
* WebGL lines ? TODO-Alvin * Array containing some WebGL-related properties used by the WebGL renderer
* *
* @property _webGL * @property _webGL
* @type Array * @type Array
@@ -89,7 +89,7 @@ PIXI.Graphics = function()
this._webGL = []; this._webGL = [];
/** /**
* Whether this shape is used as a mask * Whether this shape is being used as a mask
* *
* @property isMask * @property isMask
* @type isMask * @type isMask
@@ -105,7 +105,7 @@ PIXI.Graphics = function()
this.bounds = null; this.bounds = null;
/** /**
* the bound padding TODO-Alvin * the bounds' padding used for bounds calculation
* *
* @property bounds * @property bounds
* @type Number * @type Number
@@ -438,7 +438,7 @@ PIXI.Graphics.prototype._renderCanvas = function(renderSession)
* @method getBounds * @method getBounds
* @return {Rectangle} the rectangular bounding area * @return {Rectangle} the rectangular bounding area
*/ */
PIXI.Graphics.prototype.getBounds = function() PIXI.Graphics.prototype.getBounds = function( matrix )
{ {
if(!this.bounds)this.updateBounds(); if(!this.bounds)this.updateBounds();
@@ -448,7 +448,7 @@ PIXI.Graphics.prototype.getBounds = function()
var h0 = this.bounds.y; var h0 = this.bounds.y;
var h1 = this.bounds.height + this.bounds.y; var h1 = this.bounds.height + this.bounds.y;
var worldTransform = this.worldTransform; var worldTransform = matrix || this.worldTransform;
var a = worldTransform.a; var a = worldTransform.a;
var b = worldTransform.c; var b = worldTransform.c;
@@ -578,14 +578,14 @@ PIXI.Graphics.prototype.updateBounds = function()
/** /**
* Generates the cached sprite that was made using the generate TODO-Alvin * Generates the cached sprite when the sprite has cacheAsBitmap = true
* *
* @method _generateCachedSprite * @method _generateCachedSprite
* @private * @private
*/ */
PIXI.Graphics.prototype._generateCachedSprite = function() PIXI.Graphics.prototype._generateCachedSprite = function()
{ {
var bounds = this.getBounds(); var bounds = this.getLocalBounds();
if(!this._cachedSprite) if(!this._cachedSprite)
{ {
+1 -1
View File
@@ -145,7 +145,7 @@ PIXI.CanvasRenderer = function(width, height, view, transparent)
this.maskManager = new PIXI.CanvasMaskManager(); this.maskManager = new PIXI.CanvasMaskManager();
/** /**
* RenderSession TODO-Alvin * The render session is just a bunch of parameter used for rendering
* @property renderSession * @property renderSession
* @type Object * @type Object
*/ */
@@ -14,19 +14,16 @@ PIXI.CanvasMaskManager = function()
}; };
/** /**
* TODO-Alvin * This method adds it to the current stack of masks
* *
* @method pushMask * @method pushMask
* @param maskData TODO-Alvin * @param maskData the maskData that will be pushed
* @param context {Context2D} the 2d drawing method of the canvas * @param context {Context2D} the 2d drawing method of the canvas
*/ */
PIXI.CanvasMaskManager.prototype.pushMask = function(maskData, context) PIXI.CanvasMaskManager.prototype.pushMask = function(maskData, context)
{ {
context.save(); context.save();
//maskData.visible = false;
// maskData.alpha = 0;
var cacheAlpha = maskData.alpha; var cacheAlpha = maskData.alpha;
var transform = maskData.worldTransform; var transform = maskData.worldTransform;
@@ -19,17 +19,15 @@ PIXI.CanvasTinter = function()
/** /**
* TODO-Alvin * Basically this method just needs a sprite and a color and tints the sprite
* with the given color
*
* @method getTintedTexture * @method getTintedTexture
* @param sprite {Sprite} the sprite to tint * @param sprite {Sprite} the sprite to tint
* @param color {Number} the color to use to tint the sprite with * @param color {Number} the color to use to tint the sprite with
*/ */
PIXI.CanvasTinter.getTintedTexture = function(sprite, color) PIXI.CanvasTinter.getTintedTexture = function(sprite, color)
{ {
//
// cache on sprite
// cache on texture
// no cache
var texture = sprite.texture; var texture = sprite.texture;
+4 -10
View File
@@ -63,10 +63,9 @@ PIXI.WebGLRenderer = function(width, height, view, transparent, antialias)
this.view.height = this.height; this.view.height = this.height;
// deal with losing context.. // deal with losing context..
// TODO-Alvin
this.contextLost = this.handleContextLost.bind(this); this.contextLost = this.handleContextLost.bind(this);
this.contextRestoredLost = this.handleContextRestored.bind(this); this.contextRestoredLost = this.handleContextRestored.bind(this);
// console.log(this.handleContextRestored)
this.view.addEventListener('webglcontextlost', this.contextLost, false); this.view.addEventListener('webglcontextlost', this.contextLost, false);
this.view.addEventListener('webglcontextrestored', this.contextRestoredLost, false); this.view.addEventListener('webglcontextrestored', this.contextRestoredLost, false);
@@ -136,7 +135,6 @@ PIXI.WebGLRenderer = function(width, height, view, transparent, antialias)
this.maskManager = new PIXI.WebGLMaskManager(gl); // manages the masks using the stencil buffer this.maskManager = new PIXI.WebGLMaskManager(gl); // manages the masks using the stencil buffer
this.filterManager = new PIXI.WebGLFilterManager(gl, this.transparent); // manages the filters this.filterManager = new PIXI.WebGLFilterManager(gl, this.transparent); // manages the filters
//
this.renderSession = {}; this.renderSession = {};
this.renderSession.gl = this.gl; this.renderSession.gl = this.gl;
this.renderSession.drawCount = 0; this.renderSession.drawCount = 0;
@@ -206,9 +204,6 @@ PIXI.WebGLRenderer.prototype.render = function(stage)
gl.clear(gl.COLOR_BUFFER_BIT); gl.clear(gl.COLOR_BUFFER_BIT);
// this.projection.x = this.width/2;
//this.projection.y = -this.height/2;
this.renderDisplayObject( stage, this.projection ); this.renderDisplayObject( stage, this.projection );
// interaction // interaction
@@ -257,8 +252,8 @@ PIXI.WebGLRenderer.prototype.render = function(stage)
* *
* @method renderDIsplayObject * @method renderDIsplayObject
* @param displayObject {DisplayObject} The DisplayObject to render * @param displayObject {DisplayObject} The DisplayObject to render
* @param projection {Point} * @param projection {Point} The projection
* @param buffer {Array} buffer TODO-Alvin * @param buffer {Array} a standard WebGL buffer
*/ */
PIXI.WebGLRenderer.prototype.renderDisplayObject = function(displayObject, projection, buffer) PIXI.WebGLRenderer.prototype.renderDisplayObject = function(displayObject, projection, buffer)
{ {
@@ -335,7 +330,6 @@ PIXI.WebGLRenderer.destroyTexture = function(texture)
}; };
/** /**
* TODO-Alvin
* *
* @method updateTextureFrame * @method updateTextureFrame
* @param texture {Texture} The texture to update the frame from * @param texture {Texture} The texture to update the frame from
@@ -524,7 +518,7 @@ PIXI.WebGLRenderer.prototype.handleContextRestored = function()
}; };
/** /**
* Destroy TODO-Alvin * Removes everything from the renderer (event listeners, spritebatch, etc...)
* *
* @method destroy * @method destroy
*/ */
@@ -4,7 +4,7 @@
*/ */
/** /**
* @class PIXI.PixiFastShader * @class PixiFastShader
* @constructor * @constructor
* @param gl {WebGLContext} the current WebGL drawing context * @param gl {WebGLContext} the current WebGL drawing context
*/ */
@@ -4,7 +4,7 @@
*/ */
/** /**
* @class PIXI.PixiShader * @class PixiShader
* @constructor * @constructor
*/ */
PIXI.PixiShader = function(gl) PIXI.PixiShader = function(gl)
@@ -16,7 +16,6 @@ PIXI.WebGLFastSpriteBatch = function(gl)
this.maxSize = 6000;//Math.pow(2, 16) / this.vertSize; this.maxSize = 6000;//Math.pow(2, 16) / this.vertSize;
this.size = this.maxSize; this.size = this.maxSize;
// console.log(this.size);
//the total number of floats in our batch //the total number of floats in our batch
var numVerts = this.size * 4 * this.vertSize; var numVerts = this.size * 4 * this.vertSize;
//the total number of indices in our batch //the total number of indices in our batch
@@ -85,7 +84,6 @@ PIXI.WebGLFastSpriteBatch.prototype.begin = function(spriteBatch, renderSession)
this.matrix = spriteBatch.worldTransform.toArray(true); this.matrix = spriteBatch.worldTransform.toArray(true);
// console.log(this.tempMatrix)
this.start(); this.start();
}; };
@@ -128,9 +126,9 @@ PIXI.WebGLFastSpriteBatch.prototype.renderSprite = function(sprite)
// TODO trim?? // TODO trim??
if(sprite.texture.baseTexture !== this.currentBaseTexture) if(sprite.texture.baseTexture !== this.currentBaseTexture)
{ {
this.currentBaseTexture = sprite.texture.baseTexture;
this.flush(); this.flush();
this.currentBaseTexture = sprite.texture.baseTexture;
if(!sprite.texture._uvs)return; if(!sprite.texture._uvs)return;
} }
@@ -142,15 +140,15 @@ PIXI.WebGLFastSpriteBatch.prototype.renderSprite = function(sprite)
width = sprite.texture.frame.width; width = sprite.texture.frame.width;
height = sprite.texture.frame.height; height = sprite.texture.frame.height;
if (sprite.texture.trimmed) if (sprite.texture.trim)
{ {
// if the sprite is trimmed then we need to add the extra space before transforming the sprite coords.. // if the sprite is trimmed then we need to add the extra space before transforming the sprite coords..
var trim = sprite.texture.trim; var trim = sprite.texture.trim;
w1 = trim.x - sprite.anchor.x * trim.realWidth; w1 = trim.x - sprite.anchor.x * trim.width;
w0 = w1 + sprite.texture.frame.width; w0 = w1 + sprite.texture.frame.width;
h1 = trim.y - sprite.anchor.y * trim.realHeight; h1 = trim.y - sprite.anchor.y * trim.height;
h0 = h1 + sprite.texture.frame.height; h0 = h1 + sprite.texture.frame.height;
} }
else else
@@ -56,7 +56,7 @@ PIXI.WebGLFilterManager.prototype.begin = function(renderSession, buffer)
/** /**
* Applies the filter and adds it to the current filter stack * Applies the filter and adds it to the current filter stack
* @method pushFilter * @method pushFilter
* @param filterBlock {Object} TODO-Alvin * @param filterBlock {Object} the filter that will be pushed to the current filter stack
*/ */
PIXI.WebGLFilterManager.prototype.pushFilter = function(filterBlock) PIXI.WebGLFilterManager.prototype.pushFilter = function(filterBlock)
{ {
@@ -87,13 +87,7 @@ PIXI.WebGLFilterManager.prototype.pushFilter = function(filterBlock)
gl.bindTexture(gl.TEXTURE_2D, texture.texture); gl.bindTexture(gl.TEXTURE_2D, texture.texture);
// this.getBounds(filterBlock.target);
filterBlock.target.filterArea = filterBlock.target.getBounds(); filterBlock.target.filterArea = filterBlock.target.getBounds();
// console.log(filterBlock.target.filterArea)
// console.log(filterBlock.target.filterArea);
// addpadding?
//displayObject.filterArea.x
var filterArea = filterBlock.target.filterArea; var filterArea = filterBlock.target.filterArea;
@@ -112,7 +106,6 @@ PIXI.WebGLFilterManager.prototype.pushFilter = function(filterBlock)
//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)
// set view port // set view port
gl.viewport(0, 0, filterArea.width, filterArea.height); gl.viewport(0, 0, filterArea.width, filterArea.height);
@@ -122,20 +115,16 @@ PIXI.WebGLFilterManager.prototype.pushFilter = function(filterBlock)
offset.x = -filterArea.x; offset.x = -filterArea.x;
offset.y = -filterArea.y; offset.y = -filterArea.y;
//console.log(PIXI.defaultShader.projectionVector)
// update projection // update projection
gl.uniform2f(this.defaultShader.projectionVector, filterArea.width/2, -filterArea.height/2); gl.uniform2f(this.defaultShader.projectionVector, filterArea.width/2, -filterArea.height/2);
gl.uniform2f(this.defaultShader.offsetVector, -filterArea.x, -filterArea.y); gl.uniform2f(this.defaultShader.offsetVector, -filterArea.x, -filterArea.y);
//PIXI.primitiveProgram
gl.colorMask(true, true, true, true); gl.colorMask(true, true, true, true);
gl.clearColor(0,0,0, 0); gl.clearColor(0,0,0, 0);
gl.clear(gl.COLOR_BUFFER_BIT); gl.clear(gl.COLOR_BUFFER_BIT);
//filter.texture = texture;
filterBlock._glFilterTexture = texture; filterBlock._glFilterTexture = texture;
//console.log("PUSH")
}; };
@@ -303,7 +292,6 @@ PIXI.WebGLFilterManager.prototype.popFilter = function()
gl.bindTexture(gl.TEXTURE_2D, texture.texture); gl.bindTexture(gl.TEXTURE_2D, texture.texture);
// apply! // apply!
//filter.applyFilterPass(sizeX, sizeY);
this.applyFilterPass(filter, filterArea, sizeX, sizeY); this.applyFilterPass(filter, filterArea, sizeX, sizeY);
// now restore the regular shader.. // now restore the regular shader..
@@ -350,12 +338,10 @@ PIXI.WebGLFilterManager.prototype.applyFilterPass = function(filter, filterArea,
if(filter.uniforms.dimensions) if(filter.uniforms.dimensions)
{ {
//console.log(filter.uniforms.dimensions)
filter.uniforms.dimensions.value[0] = this.width;//width; filter.uniforms.dimensions.value[0] = this.width;//width;
filter.uniforms.dimensions.value[1] = this.height;//height; filter.uniforms.dimensions.value[1] = this.height;//height;
filter.uniforms.dimensions.value[2] = this.vertexArray[0]; filter.uniforms.dimensions.value[2] = this.vertexArray[0];
filter.uniforms.dimensions.value[3] = this.vertexArray[5];//filterArea.height; filter.uniforms.dimensions.value[3] = this.vertexArray[5];//filterArea.height;
// console.log(this.vertexArray[5])
} }
shader.syncUniforms(); shader.syncUniforms();
@@ -438,7 +424,7 @@ PIXI.WebGLFilterManager.prototype.initShaderBuffers = function()
}; };
/** /**
* TODO-Alvin * Destroys the filter and removes it from the filter stack
* @method destroy * @method destroy
*/ */
PIXI.WebGLFilterManager.prototype.destroy = function() PIXI.WebGLFilterManager.prototype.destroy = function()
@@ -145,7 +145,7 @@ PIXI.WebGLGraphics.updateGraphics = function(graphics, gl)
* @static * @static
* @private * @private
* @method buildRectangle * @method buildRectangle
* @param graphicsData {Graphics} The graphics object to draw TODO-Alvin * @param graphicsData {Graphics} The graphics object containing all the necessary properties
* @param webGLData {Object} * @param webGLData {Object}
*/ */
PIXI.WebGLGraphics.buildRectangle = function(graphicsData, webGLData) PIXI.WebGLGraphics.buildRectangle = function(graphicsData, webGLData)
@@ -219,9 +219,8 @@ PIXI.WebGLGraphics.buildRectangle = function(graphicsData, webGLData)
*/ */
PIXI.WebGLGraphics.buildCircle = function(graphicsData, webGLData) PIXI.WebGLGraphics.buildCircle = function(graphicsData, webGLData)
{ {
// --- //
// need to convert points to a nice regular data // need to convert points to a nice regular data
//
var rectData = graphicsData.points; var rectData = graphicsData.points;
var x = rectData[0]; var x = rectData[0];
var y = rectData[1]; var y = rectData[1];
@@ -287,7 +286,7 @@ PIXI.WebGLGraphics.buildCircle = function(graphicsData, webGLData)
* @static * @static
* @private * @private
* @method buildLine * @method buildLine
* @param graphicsData {Graphics} The graphics object to draw TODO-Alvin * @param graphicsData {Graphics} The graphics object containing all the necessary properties
* @param webGLData {Object} * @param webGLData {Object}
*/ */
PIXI.WebGLGraphics.buildLine = function(graphicsData, webGLData) PIXI.WebGLGraphics.buildLine = function(graphicsData, webGLData)
@@ -497,7 +496,7 @@ PIXI.WebGLGraphics.buildLine = function(graphicsData, webGLData)
* @static * @static
* @private * @private
* @method buildPoly * @method buildPoly
* @param graphicsData {Graphics} The graphics object to draw TODO-Alvin * @param graphicsData {Graphics} The graphics object containing all the necessary properties
* @param webGLData {Object} * @param webGLData {Object}
*/ */
PIXI.WebGLGraphics.buildPoly = function(graphicsData, webGLData) PIXI.WebGLGraphics.buildPoly = function(graphicsData, webGLData)
@@ -61,7 +61,7 @@ PIXI.WebGLMaskManager.prototype.pushMask = function(maskData, renderSession)
* Removes the last filter from the filter stack and doesn't return it * Removes the last filter from the filter stack and doesn't return it
* @method popMask * @method popMask
* *
* @param renderSession {RenderSession} TODO-Alvin * @param renderSession {RenderSession} an object containing all the useful parameters
*/ */
PIXI.WebGLMaskManager.prototype.popMask = function(renderSession) PIXI.WebGLMaskManager.prototype.popMask = function(renderSession)
{ {
@@ -87,7 +87,7 @@ PIXI.WebGLMaskManager.prototype.popMask = function(renderSession)
}; };
/** /**
* TODO-Alvin * Destroys the mask stack
* @method destroy * @method destroy
*/ */
PIXI.WebGLMaskManager.prototype.destroy = function() PIXI.WebGLMaskManager.prototype.destroy = function()
@@ -50,9 +50,9 @@ PIXI.WebGLShaderManager.prototype.setContext = function(gl)
/** /**
* Initialises the context and the properties * Takes the attributes given in parameters
* @method setAttribs * @method setAttribs
* @param attribs {Array} TODO-Alvin * @param attribs {Array} attribs
*/ */
PIXI.WebGLShaderManager.prototype.setAttribs = function(attribs) PIXI.WebGLShaderManager.prototype.setAttribs = function(attribs)
{ {
@@ -91,12 +91,11 @@ PIXI.WebGLShaderManager.prototype.setAttribs = function(attribs)
} }
} }
} }
// console.log(this.tempAttribState)
}; };
/** /**
* TODO-Alvin * Sets-up the given shader
*
* @method activateShader * @method activateShader
* @param shader {Object} the shader that is going to be activated * @param shader {Object} the shader that is going to be activated
*/ */
@@ -105,11 +104,9 @@ PIXI.WebGLShaderManager.prototype.activateShader = function(shader)
//if(this.currentShader == shader)return; //if(this.currentShader == shader)return;
this.currentShader = shader; this.currentShader = shader;
// console.log(shader.program)
this.gl.useProgram(shader.program); this.gl.useProgram(shader.program);
this.setAttribs(shader.attributes); this.setAttribs(shader.attributes);
// console.log(shader.attributes)
}; };
@@ -2,6 +2,9 @@
* @author Mat Groves http://matgroves.com/ @Doormat23 * @author Mat Groves http://matgroves.com/ @Doormat23
*/ */
// TODO Alvin and Mat
// Should we eventually create a Utils class ?
// Or just move this file to the pixi.js file ?
PIXI.initDefaultShaders = function() PIXI.initDefaultShaders = function()
{ {
@@ -37,7 +40,6 @@ PIXI._CompileShader = function(gl, shaderSrc, shaderType)
PIXI.compileProgram = function(gl, vertexSrc, fragmentSrc) PIXI.compileProgram = function(gl, vertexSrc, fragmentSrc)
{ {
//var gl = PIXI.gl;
var fragmentShader = PIXI.CompileFragmentShader(gl, fragmentSrc); var fragmentShader = PIXI.CompileFragmentShader(gl, fragmentSrc);
var vertexShader = PIXI.CompileVertexShader(gl, vertexSrc); var vertexShader = PIXI.CompileVertexShader(gl, vertexSrc);
@@ -20,7 +20,7 @@ PIXI.WebGLSpriteBatch = function(gl)
{ {
/** /**
* TODO-Alvin *
* *
* @property vertSize * @property vertSize
* @type Number * @type Number
@@ -28,13 +28,12 @@ PIXI.WebGLSpriteBatch = function(gl)
this.vertSize = 6; this.vertSize = 6;
/** /**
* TODO-Alvin * The number of images in the SpriteBatch before it flushes
* @property size * @property size
* @type Number * @type Number
*/ */
this.size = 10000;//Math.pow(2, 16) / this.vertSize; this.size = 10000;//Math.pow(2, 16) / this.vertSize;
// console.log(this.size);
//the total number of floats in our batch //the total number of floats in our batch
var numVerts = this.size * 4 * this.vertSize; var numVerts = this.size * 4 * this.vertSize;
//the total number of indices in our batch //the total number of indices in our batch
@@ -134,7 +133,7 @@ PIXI.WebGLSpriteBatch.prototype.end = function()
* *
* @method render * @method render
* *
* @param sprite {Sprite} the sprite to render TODO-Alvin * @param sprite {Sprite} the sprite to render when using this spritebatch
*/ */
PIXI.WebGLSpriteBatch.prototype.render = function(sprite) PIXI.WebGLSpriteBatch.prototype.render = function(sprite)
{ {
@@ -161,7 +160,7 @@ PIXI.WebGLSpriteBatch.prototype.render = function(sprite)
var alpha = sprite.worldAlpha; var alpha = sprite.worldAlpha;
var tint = sprite.tint; var tint = sprite.tint;
var verticies = this.vertices; var verticies = this.vertices;
var width = sprite.texture.frame.width; var width = sprite.texture.frame.width;
var height = sprite.texture.frame.height; var height = sprite.texture.frame.height;
@@ -172,15 +171,15 @@ PIXI.WebGLSpriteBatch.prototype.render = function(sprite)
var w0, w1, h0, h1; var w0, w1, h0, h1;
if (sprite.texture.trimmed) if (sprite.texture.trim)
{ {
// if the sprite is trimmed then we need to add the extra space before transforming the sprite coords.. // if the sprite is trimmed then we need to add the extra space before transforming the sprite coords..
var trim = sprite.texture.trim; var trim = sprite.texture.trim;
w1 = trim.x - aX * trim.realWidth; w1 = trim.x - aX * trim.width;
w0 = w1 + width; w0 = w1 + width;
h1 = trim.y - aY * trim.realHeight; h1 = trim.y - aY * trim.height;
h0 = h1 + height; h0 = h1 + height;
} }
else else
@@ -250,10 +249,10 @@ PIXI.WebGLSpriteBatch.prototype.render = function(sprite)
}; };
/** /**
* * Renders a tilingSprite using the spriteBatch
* @method renderTilingSprite * @method renderTilingSprite
* *
* @param sprite {TilingSprite} the sprite to render TODO-Alvin * @param sprite {TilingSprite} the tilingSprite to render
*/ */
PIXI.WebGLSpriteBatch.prototype.renderTilingSprite = function(tilingSprite) PIXI.WebGLSpriteBatch.prototype.renderTilingSprite = function(tilingSprite)
{ {
@@ -375,9 +374,9 @@ PIXI.WebGLSpriteBatch.prototype.renderTilingSprite = function(tilingSprite)
/** /**
* * Renders the content and empties the current batch
* *
* @method flush TODO-Alvin * @method flush
* *
*/ */
PIXI.WebGLSpriteBatch.prototype.flush = function() PIXI.WebGLSpriteBatch.prototype.flush = function()
@@ -460,11 +459,10 @@ PIXI.WebGLSpriteBatch.prototype.start = function()
}; };
/** /**
* * Sets-up the given blendMode from WebGL's point of view
* @method setBlendMode * @method setBlendMode
* *
* @param blendMode {Number} the blendMode, should be a Pixi const, such as PIXI.BlendModes.ADD * @param blendMode {Number} the blendMode, should be a Pixi const, such as PIXI.BlendModes.ADD
* TODO-Alvin
*/ */
PIXI.WebGLSpriteBatch.prototype.setBlendMode = function(blendMode) PIXI.WebGLSpriteBatch.prototype.setBlendMode = function(blendMode)
{ {
+23 -7
View File
@@ -9,7 +9,7 @@
* http://www.bmglyph.com/ for mac. * http://www.bmglyph.com/ for mac.
* *
* @class BitmapText * @class BitmapText
* @extends SpriteBatch * @extends DisplayObjectContainer
* @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
@@ -18,7 +18,7 @@
*/ */
PIXI.BitmapText = function(text, style) PIXI.BitmapText = function(text, style)
{ {
PIXI.SpriteBatch.call(this); PIXI.DisplayObjectContainer.call(this);
this._pool = []; this._pool = [];
@@ -29,7 +29,7 @@ PIXI.BitmapText = function(text, style)
}; };
// constructor // constructor
PIXI.BitmapText.prototype = Object.create(PIXI.SpriteBatch.prototype); PIXI.BitmapText.prototype = Object.create(PIXI.DisplayObjectContainer.prototype);
PIXI.BitmapText.prototype.constructor = PIXI.BitmapText; PIXI.BitmapText.prototype.constructor = PIXI.BitmapText;
/** /**
@@ -67,7 +67,7 @@ PIXI.BitmapText.prototype.setStyle = function(style)
}; };
/** /**
* Renders text * Renders text and updates it when needed
* *
* @method updateText * @method updateText
* @private * @private
@@ -156,8 +156,24 @@ PIXI.BitmapText.prototype.updateText = function()
this.removeChild(child); this.removeChild(child);
} }
this.width = maxLineWidth * scale;
this.height = (pos.y + data.lineHeight) * scale; /**
* [read-only] The width of the overall text, different from fontSize,
* which is defined in the style object
*
* @property textWidth
* @type Number
*/
this.textWidth = maxLineWidth * scale;
/**
* [read-only] The height of the overall text, different from fontSize,
* which is defined in the style object
*
* @property textHeight
* @type Number
*/
this.textHeight = (pos.y + data.lineHeight) * scale;
}; };
/** /**
@@ -174,7 +190,7 @@ PIXI.BitmapText.prototype.updateTransform = function()
this.dirty = false; this.dirty = false;
} }
PIXI.SpriteBatch.prototype.updateTransform.call(this); PIXI.DisplayObjectContainer.prototype.updateTransform.call(this);
}; };
PIXI.BitmapText.fonts = {}; PIXI.BitmapText.fonts = {};
+13 -7
View File
@@ -3,20 +3,22 @@
*/ */
/** /**
* 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'
* or add a wordWrap property set to true and and wordWrapWidth property with a value
* in the style object
* *
* @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 20px 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'] {String|Number} A canvas fillstyle that will be used on the text e.g 'red', '#00FF00'
* @param [style.align='left'] {String} Alignment for multiline text ('left', 'center' or 'right'), does not affect single line text * @param [style.align='left'] {String} Alignment for multiline text ('left', 'center' or 'right'), does not affect single line text
* @param [style.stroke] {String} A canvas fillstyle that will be used on the text stroke eg 'blue', '#FCFF00' * @param [style.stroke] {String|Number} A canvas fillstyle that will be used on the text stroke e.g '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, it needs wordWrap to be set to true
*/ */
PIXI.Text = function(text, style) PIXI.Text = function(text, style)
{ {
@@ -89,7 +91,7 @@ PIXI.Text.prototype.setText = function(text)
}; };
/** /**
* Renders text * Renders text and updates it when needed
* *
* @method updateText * @method updateText
* @private * @private
@@ -287,7 +289,11 @@ PIXI.Text.prototype.wordWrap = function(text)
result += words[j] + ' '; result += words[j] + ' ';
} }
} }
result += '\n';
if (i < lines.length-1)
{
result += '\n';
}
} }
return result; return result;
}; };
+5 -4
View File
@@ -88,7 +88,6 @@ PIXI.BaseTexture = function(source, scaleMode)
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.imageUrl = null; this.imageUrl = null;
@@ -122,11 +121,11 @@ PIXI.BaseTexture.prototype.destroy = function()
}; };
/** /**
* Changes the source image of the texture
* *
* * @method updateSourceImage
* @method destroy * @param newSrc {String} the path of the image
*/ */
PIXI.BaseTexture.prototype.updateSourceImage = function(newSrc) PIXI.BaseTexture.prototype.updateSourceImage = function(newSrc)
{ {
this.hasLoaded = false; this.hasLoaded = false;
@@ -141,6 +140,8 @@ PIXI.BaseTexture.prototype.updateSourceImage = function(newSrc)
* @static * @static
* @method fromImage * @method fromImage
* @param imageUrl {String} The image url of the texture * @param imageUrl {String} The image url of the texture
* @param crossorigin {Boolean}
* @param scaleMode {Number} Should be one of the PIXI.scaleMode consts
* @return BaseTexture * @return BaseTexture
*/ */
PIXI.BaseTexture.fromImage = function(imageUrl, crossorigin, scaleMode) PIXI.BaseTexture.fromImage = function(imageUrl, crossorigin, scaleMode)
+33 -10
View File
@@ -24,21 +24,45 @@
doc.addChild(sprite); doc.addChild(sprite);
renderTexture.render(doc); // Renders to center of renderTexture renderTexture.render(doc); // Renders to center of renderTexture
@class RenderTexture * @class RenderTexture
@extends Texture * @extends Texture
@constructor * @constructor
@param width {Number} The width of the render texture * @param width {Number} The width of the render texture
@param height {Number} The height of the render texture * @param height {Number} The height of the render texture
*/ */
PIXI.RenderTexture = function(width, height, renderer) PIXI.RenderTexture = function(width, height, renderer)
{ {
PIXI.EventTarget.call( this ); PIXI.EventTarget.call( this );
/**
* The with of the render texture
*
* @property width
* @type Number
*/
this.width = width || 100; this.width = width || 100;
/**
* The height of the render texture
*
* @property height
* @type Number
*/
this.height = height || 100; this.height = height || 100;
/**
* The framing rectangle of the render texture
*
* @property frame
* @type Rectangle
*/
this.frame = new PIXI.Rectangle(0, 0, this.width, this.height); this.frame = new PIXI.Rectangle(0, 0, this.width, this.height);
/**
* The base texture object that this texture uses
*
* @property baseTexture
* @type BaseTexture
*/
this.baseTexture = new PIXI.BaseTexture(); this.baseTexture = new PIXI.BaseTexture();
this.baseTexture.width = this.width; this.baseTexture.width = this.width;
this.baseTexture.height = this.height; this.baseTexture.height = this.height;
@@ -71,7 +95,7 @@ PIXI.RenderTexture = function(width, height, renderer)
}; };
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;
PIXI.RenderTexture.prototype.resize = function(width, height) PIXI.RenderTexture.prototype.resize = function(width, height)
@@ -87,7 +111,7 @@ PIXI.RenderTexture.prototype.resize = function(width, height)
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 = this.gl; var gl = this.renderer.gl;
gl.bindTexture(gl.TEXTURE_2D, this.baseTexture._glTextures[gl.id]); gl.bindTexture(gl.TEXTURE_2D, this.baseTexture._glTextures[gl.id]);
gl.texImage2D(gl.TEXTURE_2D, 0, gl.RGBA, this.width, this.height, 0, gl.RGBA, gl.UNSIGNED_BYTE, null); gl.texImage2D(gl.TEXTURE_2D, 0, gl.RGBA, this.width, this.height, 0, gl.RGBA, gl.UNSIGNED_BYTE, null);
} }
@@ -109,6 +133,7 @@ PIXI.RenderTexture.prototype.resize = function(width, height)
*/ */
PIXI.RenderTexture.prototype.renderWebGL = function(displayObject, position, clear) PIXI.RenderTexture.prototype.renderWebGL = function(displayObject, position, clear)
{ {
//TOOD replace position with matrix..
var gl = this.renderer.gl; var gl = this.renderer.gl;
gl.colorMask(true, true, true, true); gl.colorMask(true, true, true, true);
@@ -160,7 +185,6 @@ PIXI.RenderTexture.prototype.renderWebGL = function(displayObject, position, cle
*/ */
PIXI.RenderTexture.prototype.renderCanvas = function(displayObject, position, clear) PIXI.RenderTexture.prototype.renderCanvas = function(displayObject, position, clear)
{ {
//console.log("!!")
var children = displayObject.children; var children = displayObject.children;
displayObject.worldTransform = PIXI.RenderTexture.tempMatrix; displayObject.worldTransform = PIXI.RenderTexture.tempMatrix;
@@ -185,5 +209,4 @@ PIXI.RenderTexture.prototype.renderCanvas = function(displayObject, position, cl
context.setTransform(1,0,0,1,0,0); context.setTransform(1,0,0,1,0,0);
}; };
PIXI.RenderTexture.tempMatrix = new PIXI.Matrix(); PIXI.RenderTexture.tempMatrix = new PIXI.Matrix();
+4 -8
View File
@@ -31,7 +31,7 @@ PIXI.Texture = function(baseTexture, frame)
baseTexture = baseTexture.baseTexture; baseTexture = baseTexture.baseTexture;
/** /**
* The base texture of this texture * The base texture of that this texture uses
* *
* @property baseTexture * @property baseTexture
* @type BaseTexture * @type BaseTexture
@@ -50,10 +50,10 @@ PIXI.Texture = function(baseTexture, frame)
* The trim point * The trim point
* *
* @property trim * @property trim
* @type Point * @type Rectangle
*/ */
this.trim = new PIXI.Point(); this.trim = null;
this.scope = this; this.scope = this;
if(baseTexture.hasLoaded) if(baseTexture.hasLoaded)
@@ -252,7 +252,3 @@ PIXI.TextureUvs = function()
}; };
+3 -12
View File
@@ -10,13 +10,12 @@
* @static * @static
* @param width=800 {Number} the width of the renderers view * @param width=800 {Number} the width of the renderers view
* @param height=600 {Number} the height of the renderers view * @param height=600 {Number} the height of the renderers view
* @param [view] {Canvas} the canvas to use as a view, optional * @param [view] {Canvas} the canvas to use as a view, optional
* @param [transparent=false] {Boolean} the transparency of the render view, default false
* @param [antialias=false] {Boolean} sets antialias (only applicable in webGL chrome at the moment) * @param [antialias=false] {Boolean} sets antialias (only applicable in webGL chrome at the moment)
* @param [transparent=false] {Boolean} the transparency of the render view, default false
* *
* antialias
*/ */
PIXI.autoDetectRenderer = function(width, height, view, transparent, antialias) PIXI.autoDetectRenderer = function(width, height, view,antialias,transparent)
{ {
if(!width)width = 800; if(!width)width = 800;
if(!height)height = 600; if(!height)height = 600;
@@ -30,14 +29,6 @@ PIXI.autoDetectRenderer = function(width, height, view, transparent, antialias)
} }
} )(); } )();
// used to detect ie 11 - no longer required
/* if(webgl)
{
var ie = (navigator.userAgent.toLowerCase().indexOf('trident') !== -1);
webgl = !ie;
}
*/
if( webgl ) if( webgl )
{ {