Mirrors/phaser
2
0
Fork 0
mirror of https://github.com/photonstorm/phaser synced 2025-02-16 22:18:29 +00:00
Code Issues Projects Releases Packages Wiki Activity

Preparing for 2.6.2 release.

Browse source
This commit is contained in:
photonstorm 2016-08-22 12:31:02 +01:00
parent 19342fa3af
commit 7b9c4114b2
30 changed files with 725 additions and 3614 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

27
README.md
View file

@ -40,7 +40,7 @@ Grab the source and join in the fun!
> In Development
This is the development branch, where we are building Phaser 2.7.0.
This is the development branch, where we are building Phaser 2.6.2.
Check the [Change Log](#change-log) to see what we've done so far. Or switch to the master branch for the current stable release.
@ -107,15 +107,15 @@ Using Browserify? Please [read this](#browserify).
[jsDelivr](http://www.jsdelivr.com/#!phaser) is a "super-fast CDN for developers". Include the following in your html:
`<script src="//cdn.jsdelivr.net/phaser/2.7.0/phaser.js"></script>`
`<script src="//cdn.jsdelivr.net/phaser/2.6.2/phaser.js"></script>`
or the minified version:
`<script src="//cdn.jsdelivr.net/phaser/2.7.0/phaser.min.js"></script>`
`<script src="//cdn.jsdelivr.net/phaser/2.6.2/phaser.min.js"></script>`
[cdnjs.com](https://cdnjs.com/libraries/phaser) also offers a free CDN service. They have all versions of Phaser and even the custom builds:
`<script src="https://cdnjs.cloudflare.com/ajax/libs/phaser/2.7.0/phaser.js"></script>`
`<script src="https://cdnjs.cloudflare.com/ajax/libs/phaser/2.6.2/phaser.js"></script>`
### Phaser Sandbox
@ -305,11 +305,10 @@ You can read all about the philosophy behind Lazer [here](http://phaser.io/news/
![Change Log](http://phaser.io/images/github/div-change-log.png "Change Log")
<a name="change-log"></a>
## Version 2.7.0 - "Kore Springs" - In Development
## Version 2.6.2 - "Kore Springs" - In Development
### New Features
* The brand new WebGL Tilemap Renderer is available in this release of Phaser. Using custom developed shaders, map parsing and index batching, it finally makes tilemap rendering as fast as it possibly can be in WebGL.
* Group.getRandomExists will return a random child from the Group that has exists set to true.
* Group.getAll will return all children in the Group, or a section of the Group, with the optional ability to test if the child has a property matching the given value or not.
* Group.iterate has a new `returnType`: `RETURN_ALL`. This allows you to return all children that pass the iteration test in an array.
@ -352,14 +351,6 @@ You can read all about the philosophy behind Lazer [here](http://phaser.io/news/
Please note that Phaser uses a custom build of Pixi and always has done. The following changes have been made to our custom build, not to Pixi in general.
* Multi-Texture support has now been built into our version of Pixi. This can offer dramatic performance increases in WebGL games on GPUs that support multiple texture bindings (which is most of them these days).
* WebGLRenderer.setTexturePriority is the method used to set the priority of textures when the GPU supports multi-texture batching.
* Rope has two new properties `textureIndices` and `textureIndex` to handle multi-texture support.
* Strip has two new properties `textureIndices` and `textureIndex` to handle multi-texture support.
* The following shaders have all been updated to support multi-textures: `ComplexPrimitiveShader`, `PixiFastShader`, `PixiShader`, `PrimitiveShader`, `StripShader`.
* WebGLFastSpriteBatch.vertSize was increased from 10 to 11.
* BaseTexture.textureIndex is a new property that controls the index of the texture within the GPU texture cache. Usually you don't change this yourself, and use `renderer.setTexturePriority` instead, but the property is public and available for more advanced use-cases.
* CanvasRenderer.setTexturePriority is an empty function, but included to allow you to simply call `game.renderer.setTexturePriority` without first having to wrap that in a WebGL check.
* This version contains significant fixes for `DisplayObject.getBounds` and `DisplayObjectContainer.getBounds`. The methods can now accept an optional argument `targetCoordinateSpace` which makes it much more flexible, allowing you to check the bounds against any target, not just local and global ones. If the `targetCoordinateSpace` is a valid DisplayObject:
- If it's a parent of the caller at some level it will return the bounds
@ -409,10 +400,10 @@ All rights reserved.
[![Analytics](https://ga-beacon.appspot.com/UA-44006568-2/phaser/index)](https://github.com/igrigorik/ga-beacon)
[get-js]: https://github.com/photonstorm/phaser/releases/download/v2.7.0/phaser.js
[get-minjs]: https://github.com/photonstorm/phaser/releases/download/v2.7.0/phaser.min.js
[get-zip]: https://github.com/photonstorm/phaser/archive/v2.7.0.zip
[get-tgz]: https://github.com/photonstorm/phaser/archive/v2.7.0.tar.gz
[get-js]: https://github.com/photonstorm/phaser/releases/download/v2.6.2/phaser.js
[get-minjs]: https://github.com/photonstorm/phaser/releases/download/v2.6.2/phaser.min.js
[get-zip]: https://github.com/photonstorm/phaser/archive/v2.6.2.zip
[get-tgz]: https://github.com/photonstorm/phaser/archive/v2.6.2.tar.gz
[clone-http]: https://github.com/photonstorm/phaser.git
[clone-ssh]: git@github.com:photonstorm/phaser.git
[clone-svn]: https://github.com/photonstorm/phaser

3
build/config.php
View file

@ -408,13 +408,10 @@ EOL;
if ($modules['tilemap'])
{
echo <<<EOL
<script src="$path/src/pixi/extras/Tilemap.js"></script>
<script src="$path/src/pixi/renderers/webgl/shaders/TilemapShader.js"></script>
<script src="$path/src/tilemap/ImageCollection.js"></script>
<script src="$path/src/tilemap/Tile.js"></script>
<script src="$path/src/tilemap/Tilemap.js"></script>
<script src="$path/src/tilemap/TilemapLayer.js"></script>
<script src="$path/src/tilemap/TilemapLayerGL.js"></script>
<script src="$path/src/tilemap/TilemapParser.js"></script>
<script src="$path/src/tilemap/Tileset.js"></script>

2
src/Phaser.js
View file

@ -15,7 +15,7 @@ var Phaser = Phaser || {
* @constant
* @type {string}
*/
VERSION: '2.7.0 Beta 4',
VERSION: '2.6.2',
/**
* An array of Phaser game instances.

17
src/physics/arcade/TilemapCollision.js
View file

@ -33,15 +33,14 @@ Phaser.Physics.Arcade.TilemapCollision.prototype = {
*/
collideSpriteVsTilemapLayer: function (sprite, tilemapLayer, collideCallback, processCallback, callbackContext, overlapOnly) {
// Before we even do this, is the sprite outside the layer bounds?
if (!sprite.body || sprite.body.bottom < tilemapLayer.y || sprite.body.top > tilemapLayer.bottom || sprite.body.right < tilemapLayer.x || sprite.body.x > tilemapLayer.right)
if (!sprite.body)
{
return;
}
var mapData = tilemapLayer.getTiles(
(sprite.body.position.x - sprite.body.tilePadding.x) - tilemapLayer.offsetX,
(sprite.body.position.y - sprite.body.tilePadding.y) - tilemapLayer.offsetY,
sprite.body.position.x - sprite.body.tilePadding.x,
sprite.body.position.y - sprite.body.tilePadding.y,
sprite.body.width + sprite.body.tilePadding.x,
sprite.body.height + sprite.body.tilePadding.y,
false, false);
@ -130,8 +129,8 @@ Phaser.Physics.Arcade.TilemapCollision.prototype = {
return false;
}
var tilemapLayerOffsetX = tilemapLayer.offsetX;
var tilemapLayerOffsetY = tilemapLayer.offsetY;
var tilemapLayerOffsetX = (!tilemapLayer.fixedToCamera) ? tilemapLayer.position.x : 0;
var tilemapLayerOffsetY = (!tilemapLayer.fixedToCamera) ? tilemapLayer.position.y : 0;
// We re-check for collision in case body was separated in a previous step
if (!tile.intersects((body.position.x - tilemapLayerOffsetX), (body.position.y - tilemapLayerOffsetY), (body.right - tilemapLayerOffsetX), (body.bottom - tilemapLayerOffsetY)))
@ -153,7 +152,7 @@ Phaser.Physics.Arcade.TilemapCollision.prototype = {
// If it returns true then we can carry on, otherwise we should abort.
return false;
}
else if (tile.layer.callbacks !== undefined && tile.layer.callbacks[tile.index] && !tile.layer.callbacks[tile.index].callback.call(tile.layer.callbacks[tile.index].callbackContext, body.sprite, tile))
else if (typeof tile.layer.callbacks !== 'undefined' && tile.layer.callbacks[tile.index] && !tile.layer.callbacks[tile.index].callback.call(tile.layer.callbacks[tile.index].callbackContext, body.sprite, tile))
{
// If it returns true then we can carry on, otherwise we should abort.
return false;
@ -243,7 +242,7 @@ Phaser.Physics.Arcade.TilemapCollision.prototype = {
tileCheckX: function (body, tile, tilemapLayer) {
var ox = 0;
var tilemapLayerOffsetX = tilemapLayer.offsetX;
var tilemapLayerOffsetX = (!tilemapLayer.fixedToCamera) ? tilemapLayer.position.x : 0;
if (body.deltaX() < 0 && !body.blocked.left && tile.collideRight && body.checkCollision.left)
{
@ -301,7 +300,7 @@ Phaser.Physics.Arcade.TilemapCollision.prototype = {
tileCheckY: function (body, tile, tilemapLayer) {
var oy = 0;
var tilemapLayerOffsetY = tilemapLayer.offsetY;
var tilemapLayerOffsetY = (!tilemapLayer.fixedToCamera) ? tilemapLayer.position.y : 0;
if (body.deltaY() < 0 && !body.blocked.up && tile.collideDown && body.checkCollision.up)
{

542
src/pixi/display/Particle.js
View file

@ -1,542 +0,0 @@
/**
* @author Richard Davey <rich@photonstorm.com>
* @license {@link https://github.com/photonstorm/phaser/blob/master/license.txt|MIT License}
*/
/**
* A base class for the most simple display object possible.
* Supports position, scale, rotation, pivots, and transform updates from parents.
* Does not support having children of its own, filters, masks, or the ability to generate cached textures from itself.
*
* @class PIXI.Particle
* @constructor
*/
PIXI.Particle = function (parent, texture) {
/**
* The parent that this Particle is a child of.
* All Particles must belong to a parent in order to be rendered.
* The root parent is the Stage object. This property is set automatically when the
* Particle is added to, or removed from, a DisplayObjectContainer.
*
* @property {PIXI.ParticleContainer} parent
*/
this.parent = null;
/**
* The texture that the sprite is using
*
* @property texture
* @type Texture
*/
this.texture = texture || PIXI.Texture.emptyTexture;
/**
* The blend mode to be applied to the sprite. Set to PIXI.blendModes.NORMAL to remove any blend mode.
*
* Warning: You cannot have a blend mode and a filter active on the same Sprite. Doing so will render the sprite invisible.
*
* @property blendMode
* @type Number
* @default PIXI.blendModes.NORMAL;
*/
this.blendMode = PIXI.blendModes.NORMAL;
/**
* Controls if this Sprite is processed by the core Phaser game loops and Group loops.
*
* @property exists
* @type Boolean
* @default true
*/
this.exists = true;
/**
* The anchor sets the origin point of the texture.
* The default is 0,0 this means the texture's origin is the top left
* Setting than anchor to 0.5,0.5 means the textures origin is centered
* Setting the anchor to 1,1 would mean the textures origin points will be the bottom right corner
*
* @property anchor
* @type Point
*/
this.anchor = new PIXI.Point();
/**
* The coordinates, in pixels, of this Particle, relative to its parent container.
*
* The value of this property does not reflect any positioning happening further up the display list.
* To obtain that value please see the `worldPosition` property.
*
* @property {PIXI.Point} position
* @default
*/
this.position = new PIXI.Point(0, 0);
/**
* The scale of this Particle. A scale of 1:1 represents the Particle
* at its default size. A value of 0.5 would scale this Particle by half, and so on.
*
* The value of this property does not reflect any scaling happening further up the display list.
* To obtain that value please see the `worldScale` property.
*
* @property {PIXI.Point} scale
* @default
*/
this.scale = new PIXI.Point(1, 1);
/**
* The pivot point of this Particle that it rotates around. The values are expressed
* in pixel values.
* @property {PIXI.Point} pivot
* @default
*/
this.pivot = new PIXI.Point(0, 0);
/**
* The rotation of this Particle. The value is given, and expressed, in radians, and is based on
* a right-handed orientation.
*
* The value of this property does not reflect any rotation happening further up the display list.
* To obtain that value please see the `worldRotation` property.
*
* @property {number} rotation
* @default
*/
this.rotation = 0;
/**
* The alpha value of this Particle. A value of 1 is fully opaque. A value of 0 is transparent.
* Please note that an object with an alpha value of 0 is skipped during the render pass.
*
* The value of this property does not reflect any alpha values set further up the display list.
* To obtain that value please see the `worldAlpha` property.
*
* @property {number} alpha
* @default
*/
this.alpha = 1;
/**
* The visibility of this Particle. A value of `false` makes the object invisible.
* A value of `true` makes it visible. Please note that an object with a visible value of
* `false` is skipped during the render pass. Equally a Particle with visible false will
* not render any of its children.
*
* The value of this property does not reflect any visible values set further up the display list.
* To obtain that value please see the `worldVisible` property.
*
* @property {boolean} visible
* @default
*/
this.visible = true;
/**
* Should this Particle be rendered by the renderer? An object with a renderable value of
* `false` is skipped during the render pass.
*
* @property {boolean} renderable
* @default
*/
this.renderable = false;
/**
* The multiplied alpha value of this Particle. A value of 1 is fully opaque. A value of 0 is transparent.
* This value is the calculated total, based on the alpha values of all parents of this Particles
* in the display list.
*
* To obtain, and set, the local alpha value, see the `alpha` property.
*
* Note: This property is only updated at the end of the `updateTransform` call, once per render. Until
* that happens this property will contain values based on the previous frame. Be mindful of this if
* accessing this property outside of the normal game flow, i.e. from an asynchronous event callback.
*
* @property {number} worldAlpha
* @readOnly
*/
this.worldAlpha = 1;
/**
* The current transform of this Particle.
*
* This property contains the calculated total, based on the transforms of all parents of this
* Particle in the display list.
*
* Note: This property is only updated at the end of the `updateTransform` call, once per render. Until
* that happens this property will contain values based on the previous frame. Be mindful of this if
* accessing this property outside of the normal game flow, i.e. from an asynchronous event callback.
*
* @property {PIXI.Matrix} worldTransform
* @readOnly
*/
this.worldTransform = new PIXI.Matrix();
/**
* The coordinates, in pixels, of this Particle within the world.
*
* This property contains the calculated total, based on the positions of all parents of this
* Particle in the display list.
*
* Note: This property is only updated at the end of the `updateTransform` call, once per render. Until
* that happens this property will contain values based on the previous frame. Be mindful of this if
* accessing this property outside of the normal game flow, i.e. from an asynchronous event callback.
*
* @property {PIXI.Point} worldPosition
* @readOnly
*/
this.worldPosition = new PIXI.Point(0, 0);
/**
* The global scale of this Particle.
*
* This property contains the calculated total, based on the scales of all parents of this
* Particle in the display list.
*
* Note: This property is only updated at the end of the `updateTransform` call, once per render. Until
* that happens this property will contain values based on the previous frame. Be mindful of this if
* accessing this property outside of the normal game flow, i.e. from an asynchronous event callback.
*
* @property {PIXI.Point} worldScale
* @readOnly
*/
this.worldScale = new PIXI.Point(1, 1);
/**
* The rotation, in radians, of this Particle.
*
* This property contains the calculated total, based on the rotations of all parents of this
* Particle in the display list.
*
* Note: This property is only updated at the end of the `updateTransform` call, once per render. Until
* that happens this property will contain values based on the previous frame. Be mindful of this if
* accessing this property outside of the normal game flow, i.e. from an asynchronous event callback.
*
* @property {number} worldRotation
* @readOnly
*/
this.worldRotation = 0;
this._width = 0;
this._height = 0;
this._rotation = 0;
this._sr = 0;
this._cr = 0;
};
PIXI.Particle.prototype.constructor = PIXI.Particle;
PIXI.Particle.prototype = {
/*
* Updates the transform matrix this Particle uses for rendering.
*
* If the object has no parent, and no parent parameter is provided, it will default to
* Phaser.Game.World as the parent transform to use. If that is unavailable the transform fails to take place.
*
* The `parent` parameter has priority over the actual parent. Use it as a parent override.
* Setting it does **not** change the actual parent of this Particle.
*
* Calling this method updates the `worldTransform`, `worldAlpha`, `worldPosition`, `worldScale`
* and `worldRotation` properties.
*
* @method PIXI.Particle#updateTransform
* @param {PIXI.ParticleContainer} [parent] - Optional parent to calculate this Particles transform from.
* @return {PIXI.Particle} - A reference to this Particle.
*/
updateTransform: function (parent) {
if (!parent && !this.parent && !this.game)
{
return this;
}
var p = this.parent;
if (parent)
{
p = parent;
}
else if (!this.parent)
{
p = this.game.world;
}
// create some matrix refs for easy access
var pt = p.worldTransform;
var wt = this.worldTransform;
// temporary matrix variables
var a, b, c, d, tx, ty;
// so if rotation is between 0 then we can simplify the multiplication process..
if (this.rotation % PIXI.PI_2)
{
// check to see if the rotation is the same as the previous render. This means we only need to use sin and cos when rotation actually changes
if (this.rotation !== this._rotation)
{
this._rotation = this.rotation;
this._sr = Math.sin(this.rotation);
this._cr = Math.cos(this.rotation);
}
// get the matrix values of the displayobject based on its transform properties..
a = this._cr * this.scale.x;
b = this._sr * this.scale.x;
c = -this._sr * this.scale.y;
d = this._cr * this.scale.y;
tx = this.position.x;
ty = this.position.y;
// check for pivot.. not often used so geared towards that fact!
if (this.pivot.x || this.pivot.y)
{
tx -= this.pivot.x * a + this.pivot.y * c;
ty -= this.pivot.x * b + this.pivot.y * d;
}
// concat the parent matrix with the objects transform.
wt.a = a * pt.a + b * pt.c;
wt.b = a * pt.b + b * pt.d;
wt.c = c * pt.a + d * pt.c;
wt.d = c * pt.b + d * pt.d;
wt.tx = tx * pt.a + ty * pt.c + pt.tx;
wt.ty = tx * pt.b + ty * pt.d + pt.ty;
}
else
{
// lets do the fast version as we know there is no rotation..
a = this.scale.x;
d = this.scale.y;
tx = this.position.x - this.pivot.x * a;
ty = this.position.y - this.pivot.y * d;
wt.a = a * pt.a;
wt.b = a * pt.b;
wt.c = d * pt.c;
wt.d = d * pt.d;
wt.tx = tx * pt.a + ty * pt.c + pt.tx;
wt.ty = tx * pt.b + ty * pt.d + pt.ty;
}
// Set the World values
this.worldAlpha = this.alpha * p.worldAlpha;
this.worldPosition.set(wt.tx, wt.ty);
this.worldScale.set(this.scale.x * Math.sqrt(wt.a * wt.a + wt.c * wt.c), this.scale.y * Math.sqrt(wt.b * wt.b + wt.d * wt.d));
this.worldRotation = Math.atan2(-wt.c, wt.d);
return this;
},
/**
* To be overridden by classes that require it.
*
* @method PIXI.Particle#preUpdate
*/
preUpdate: function () {
},
/**
* Renders the object using the Canvas renderer
*
* @method _renderCanvas
* @param renderSession {RenderSession}
* @private
*/
_renderCanvas: function (renderSession) {
// If the sprite is not visible or the alpha is 0 then no need to render this element
if (!this.visible || this.alpha === 0 || !this.renderable || !this.texture.valid || this.texture.crop.width <= 0 || this.texture.crop.height <= 0)
{
return;
}
var wt = this.worldTransform;
if (this.blendMode !== renderSession.currentBlendMode)
{
renderSession.currentBlendMode = this.blendMode;
renderSession.context.globalCompositeOperation = PIXI.blendModesCanvas[renderSession.currentBlendMode];
}
var resolution = this.texture.baseTexture.resolution / renderSession.resolution;
renderSession.context.globalAlpha = this.worldAlpha;
// If smoothingEnabled is supported and we need to change the smoothing property for this texture
if (renderSession.smoothProperty && renderSession.scaleMode !== this.texture.baseTexture.scaleMode)
{
renderSession.scaleMode = this.texture.baseTexture.scaleMode;
renderSession.context[renderSession.smoothProperty] = (renderSession.scaleMode === PIXI.scaleModes.LINEAR);
}
// If the texture is trimmed we offset by the trim x/y, otherwise we use the frame dimensions
var dx = (this.texture.trim) ? this.texture.trim.x - this.anchor.x * this.texture.trim.width : this.anchor.x * -this.texture.frame.width;
var dy = (this.texture.trim) ? this.texture.trim.y - this.anchor.y * this.texture.trim.height : this.anchor.y * -this.texture.frame.height;
var tx = (wt.tx * renderSession.resolution) + renderSession.shakeX;
var ty = (wt.ty * renderSession.resolution) + renderSession.shakeY;
// Allow for pixel rounding
if (renderSession.roundPixels)
{
tx |= 0;
ty |= 0;
dx |= 0;
dy |= 0;
}
renderSession.context.setTransform(wt.a, wt.b, wt.c, wt.d, tx, ty);
var cw = this.texture.crop.width;
var ch = this.texture.crop.height;
var cx = this.texture.crop.x;
var cy = this.texture.crop.y;
dx /= resolution;
dy /= resolution;
renderSession.context.drawImage(this.texture.baseTexture.source, cx, cy, cw, ch, dx, dy, cw / resolution, ch / resolution);
},
/**
* Destroy this Particle.
*
* Removes any cached sprites, sets renderable flag to false, and nulls filters, bounds and mask.
*
* Also iteratively calls `destroy` on any children.
*
* @method PIXI.Particle#destroy
*/
destroy: function () {
this.parent = null;
this.worldTransform = null;
this.renderable = false;
}
};
Object.defineProperties(PIXI.Particle.prototype, {
/**
* The horizontal position of the Particle, in pixels, relative to its parent.
* If you need the world position of the Particle, use `Particle.worldPosition` instead.
* @name PIXI.Particle#x
* @property {number} x - The horizontal position of the Particle, in pixels, relative to its parent.
*/
'x': {
get: function () {
return this.position.x;
},
set: function (value) {
this.position.x = value;
}
},
/**
* The vertical position of the Particle, in pixels, relative to its parent.
* If you need the world position of the Particle, use `Particle.worldPosition` instead.
* @name PIXI.Particle#y
* @property {number} y - The vertical position of the Particle, in pixels, relative to its parent.
*/
'y': {
get: function () {
return this.position.y;
},
set: function (value) {
this.position.y = value;
}
},
'width': {
get: function () {
return this.scale.x * this.texture.frame.width;
},
set: function (value) {
this.scale.x = value / this.texture.frame.width;
this._width = value;
}
},
'height': {
get: function () {
return this.scale.y * this.texture.frame.height;
},
set: function (value) {
this.scale.y = value / this.texture.frame.height;
this._height = value;
}
},
/**
* Indicates if this Particle is visible, based on it, and all of its parents, `visible` property values.
* @name PIXI.Particle#worldVisible
* @property {boolean} worldVisible - Indicates if this Particle is visible, based on it, and all of its parents, `visible` property values.
*/
'worldVisible': {
get: function () {
if (!this.visible)
{
return false;
}
else
{
var item = this.parent;
do
{
if (!item.visible)
{
return false;
}
item = item.parent;
}
while (item);
return true;
}
}
}
});

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

@ -319,11 +319,13 @@ PIXI.Sprite.prototype.getBounds = function(matrix)
* @return {Rectangle} The rectangular bounding area
*/
PIXI.Sprite.prototype.getLocalBounds = function () {
var matrixCache = this.worldTransform;
this.worldTransform = PIXI.identityMatrix;
for (var i = 0; i < this.children.length; i++) {
for (var i = 0; i < this.children.length; i++)
{
this.children[i].updateTransform();
}
@ -331,11 +333,13 @@ PIXI.Sprite.prototype.getLocalBounds = function () {
this.worldTransform = matrixCache;
for (i = 0; i < this.children.length; i++) {
for (i = 0; i < this.children.length; i++)
{
this.children[i].updateTransform();
}
return bounds;
};
/**

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

@ -21,8 +21,7 @@ PIXI.Rope = function(texture, points)
this.uvs = new PIXI.Float32Array(points.length * 4);
this.colors = new PIXI.Float32Array(points.length * 2);
this.indices = new PIXI.Uint16Array(points.length * 2);
this.textureIndices = new PIXI.Float32Array(points.length * 4);
this.textureIndex = texture.baseTexture.textureIndex;
this.refresh();
};
@ -47,8 +46,6 @@ PIXI.Rope.prototype.refresh = function()
var lastPoint = points[0];
var indices = this.indices;
var colors = this.colors;
var textureIndices = this.textureIndices;
var textureIndex = this.textureIndex;
this.count-=0.2;
@ -98,12 +95,6 @@ PIXI.Rope.prototype.refresh = function()
indices[index] = index;
indices[index + 1] = index + 1;
textureIndices[index + 0] = textureIndex;
textureIndices[index + 1] = textureIndex;
textureIndices[index + 2] = textureIndex;
textureIndices[index + 3] = textureIndex;
lastPoint = point;
}
};
@ -179,7 +170,5 @@ PIXI.Rope.prototype.setTexture = function(texture)
{
// stop current texture
this.texture = texture;
this.textureIndex = texture.baseTexture.textureIndex;
this.rebindTexture();
//this.updateFrame = true;
};

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

@ -2,7 +2,7 @@
* @author Mat Groves http://matgroves.com/
*/
/**
/**
*
* @class Strip
* @extends DisplayObjectContainer
@ -12,9 +12,10 @@
* @param height {Number} the height
*
*/
PIXI.Strip = function (texture) {
PIXI.Strip = function(texture)
{
PIXI.DisplayObjectContainer.call( this );
PIXI.DisplayObjectContainer.call(this);
/**
* The texture of the strip
@ -26,27 +27,18 @@ PIXI.Strip = function (texture) {
// set up the main bits..
this.uvs = new PIXI.Float32Array([0, 1,
1, 1,
1, 0,
0, 1
]);
1, 1,
1, 0,
0, 1]);
this.vertices = new PIXI.Float32Array([0, 0,
100, 0,
100, 100,
0, 100
]);
100, 0,
100, 100,
0, 100]);
this.colors = new PIXI.Float32Array([1, 1, 1, 1]);
this.indices = new PIXI.Uint16Array([0, 1, 2, 3]);
this.textureIndex = texture.baseTexture.textureIndex;
this.textureIndices = new PIXI.Float32Array([
this.textureIndex,
this.textureIndex,
this.textureIndex,
this.textureIndex
]);
this.indices = new PIXI.Uint16Array([0, 1, 2, 3]);
/**
* Whether the strip is dirty or not
@ -81,16 +73,16 @@ PIXI.Strip = function (texture) {
PIXI.Strip.prototype = Object.create(PIXI.DisplayObjectContainer.prototype);
PIXI.Strip.prototype.constructor = PIXI.Strip;
PIXI.Strip.prototype._renderWebGL = function (renderSession) {
PIXI.Strip.prototype._renderWebGL = function(renderSession)
{
// if the sprite is not visible or the alpha is 0 then no need to render this element
if (!this.visible || this.alpha <= 0) return;
if(!this.visible || this.alpha <= 0)return;
// render triangle strip..
renderSession.spriteBatch.stop();
// init! init!
if (!this._vertexBuffer) this._initWebGL(renderSession);
if(!this._vertexBuffer)this._initWebGL(renderSession);
renderSession.shaderManager.setShader(renderSession.shaderManager.stripShader);
@ -103,38 +95,31 @@ PIXI.Strip.prototype._renderWebGL = function (renderSession) {
//TODO check culling
};
PIXI.Strip.prototype._initWebGL = function (renderSession) {
PIXI.Strip.prototype._initWebGL = function(renderSession)
{
// build the strip!
var gl = renderSession.gl;
this.gl = gl;
this._vertexBuffer = gl.createBuffer();
this._indexBuffer = gl.createBuffer();
this._uvBuffer = gl.createBuffer();
this._colorBuffer = gl.createBuffer();
this._textureIndex = gl.createBuffer();
gl.bindBuffer(gl.ARRAY_BUFFER, this._textureIndex);
gl.bufferData(gl.ARRAY_BUFFER, this.textureIndices, gl.STATIC_DRAW);
gl.bindBuffer(gl.ARRAY_BUFFER, this._vertexBuffer);
gl.bufferData(gl.ARRAY_BUFFER, this.vertices, gl.DYNAMIC_DRAW);
gl.bindBuffer(gl.ARRAY_BUFFER, this._uvBuffer);
gl.bufferData(gl.ARRAY_BUFFER, this.uvs, gl.STATIC_DRAW);
gl.bufferData(gl.ARRAY_BUFFER, this.uvs, gl.STATIC_DRAW);
gl.bindBuffer(gl.ARRAY_BUFFER, this._colorBuffer);
gl.bufferData(gl.ARRAY_BUFFER, this.colors, gl.STATIC_DRAW);
gl.bindBuffer(gl.ELEMENT_ARRAY_BUFFER, this._indexBuffer);
gl.bufferData(gl.ELEMENT_ARRAY_BUFFER, this.indices, gl.STATIC_DRAW);
this.rebindTexture();
};
PIXI.Strip.prototype._renderStrip = function (renderSession) {
PIXI.Strip.prototype._renderStrip = function(renderSession)
{
var gl = renderSession.gl;
var projection = renderSession.projection,
offset = renderSession.offset,
@ -145,7 +130,7 @@ PIXI.Strip.prototype._renderStrip = function (renderSession) {
// gl.uniformMatrix4fv(shaderProgram.mvMatrixUniform, false, mat4Real);
renderSession.blendModeManager.setBlendMode(this.blendMode);
this.gl = gl;
// set uniforms
gl.uniformMatrix3fv(shader.translationMatrix, false, this.worldTransform.toArray(true));
@ -153,43 +138,39 @@ PIXI.Strip.prototype._renderStrip = function (renderSession) {
gl.uniform2f(shader.offsetVector, -offset.x, -offset.y);
gl.uniform1f(shader.alpha, this.worldAlpha);
if (!this.dirty) {
gl.bindBuffer(gl.ARRAY_BUFFER, this._textureIndex);
gl.bufferSubData(gl.ARRAY_BUFFER, 0, this.textureIndices);
gl.vertexAttribPointer(shader.aTextureIndex, 1, gl.FLOAT, false, 0, 0);
if(!this.dirty)
{
gl.bindBuffer(gl.ARRAY_BUFFER, this._vertexBuffer);
gl.bufferSubData(gl.ARRAY_BUFFER, 0, this.vertices);
gl.vertexAttribPointer(shader.aVertexPosition, 2, gl.FLOAT, false, 0, 0);
// update the uvs
gl.bindBuffer(gl.ARRAY_BUFFER, this._uvBuffer);
gl.vertexAttribPointer(shader.aTextureCoord, 2, gl.FLOAT, false, 0, 0);
gl.activeTexture(gl.TEXTURE0);
// check if a texture is dirty..
if (this.texture.baseTexture._dirty[gl.id]) {
if(this.texture.baseTexture._dirty[gl.id])
{
renderSession.renderer.updateTexture(this.texture.baseTexture);
} else {
gl.activeTexture(gl.TEXTURE0 + this.textureIndex);
}
else
{
// bind the current texture
gl.bindTexture(gl.TEXTURE_2D, this.texture.baseTexture._glTextures[gl.id]);
}
// dont need to upload!
gl.bindBuffer(gl.ELEMENT_ARRAY_BUFFER, this._indexBuffer);
} else {
}
else
{
this.dirty = false;
gl.bindBuffer(gl.ARRAY_BUFFER, this._textureIndex);
gl.bufferData(gl.ARRAY_BUFFER, this.textureIndices, gl.STATIC_DRAW);
gl.vertexAttribPointer(shader.aTextureIndex, 1, gl.FLOAT, false, 0, 0);
gl.bindBuffer(gl.ARRAY_BUFFER, this._vertexBuffer);
gl.bufferData(gl.ARRAY_BUFFER, this.vertices, gl.STATIC_DRAW);
gl.vertexAttribPointer(shader.aVertexPosition, 2, gl.FLOAT, false, 0, 0);
@ -199,15 +180,18 @@ PIXI.Strip.prototype._renderStrip = function (renderSession) {
gl.bufferData(gl.ARRAY_BUFFER, this.uvs, gl.STATIC_DRAW);
gl.vertexAttribPointer(shader.aTextureCoord, 2, gl.FLOAT, false, 0, 0);
gl.activeTexture(gl.TEXTURE0);
// check if a texture is dirty..
if (this.texture.baseTexture._dirty[gl.id]) {
if(this.texture.baseTexture._dirty[gl.id])
{
renderSession.renderer.updateTexture(this.texture.baseTexture);
} else {
gl.activeTexture(gl.TEXTURE0 + this.textureIndex);
}
else
{
gl.bindTexture(gl.TEXTURE_2D, this.texture.baseTexture._glTextures[gl.id]);
}
// dont need to upload!
gl.bindBuffer(gl.ELEMENT_ARRAY_BUFFER, this._indexBuffer);
gl.bufferData(gl.ELEMENT_ARRAY_BUFFER, this.indices, gl.STATIC_DRAW);
@ -221,14 +205,10 @@ PIXI.Strip.prototype._renderStrip = function (renderSession) {
};
PIXI.Strip.prototype.rebindTexture = function () {
var gl = this.gl;
if (!gl) return;
gl.activeTexture(gl.TEXTURE0 + this.textureIndex);
gl.bindTexture(gl.TEXTURE_2D, this.texture.baseTexture._glTextures[gl.id]);
};
PIXI.Strip.prototype._renderCanvas = function (renderSession) {
PIXI.Strip.prototype._renderCanvas = function(renderSession)
{
var context = renderSession.context;
var transform = this.worldTransform;
@ -236,20 +216,27 @@ PIXI.Strip.prototype._renderCanvas = function (renderSession) {
var tx = (transform.tx * renderSession.resolution) + renderSession.shakeX;
var ty = (transform.ty * renderSession.resolution) + renderSession.shakeY;
if (renderSession.roundPixels) {
if (renderSession.roundPixels)
{
context.setTransform(transform.a, transform.b, transform.c, transform.d, tx | 0, ty | 0);
} else {
}
else
{
context.setTransform(transform.a, transform.b, transform.c, transform.d, tx, ty);
}
if (this.drawMode === PIXI.Strip.DrawModes.TRIANGLE_STRIP) {
if (this.drawMode === PIXI.Strip.DrawModes.TRIANGLE_STRIP)
{
this._renderCanvasTriangleStrip(context);
} else {
}
else
{
this._renderCanvasTriangles(context);
}
};
PIXI.Strip.prototype._renderCanvasTriangleStrip = function (context) {
PIXI.Strip.prototype._renderCanvasTriangleStrip = function(context)
{
// draw triangles!!
var vertices = this.vertices;
var uvs = this.uvs;
@ -264,7 +251,8 @@ PIXI.Strip.prototype._renderCanvasTriangleStrip = function (context) {
}
};
PIXI.Strip.prototype._renderCanvasTriangles = function (context) {
PIXI.Strip.prototype._renderCanvasTriangles = function(context)
{
// draw triangles!!
var vertices = this.vertices;
var uvs = this.uvs;
@ -275,31 +263,22 @@ PIXI.Strip.prototype._renderCanvasTriangles = function (context) {
for (var i = 0; i < length; i += 3) {
// draw some triangles!
var index0 = indices[i] * 2,
index1 = indices[i + 1] * 2,
index2 = indices[i + 2] * 2;
var index0 = indices[i] * 2, index1 = indices[i + 1] * 2, index2 = indices[i + 2] * 2;
this._renderCanvasDrawTriangle(context, vertices, uvs, index0, index1, index2);
}
};
PIXI.Strip.prototype._renderCanvasDrawTriangle = function (context, vertices, uvs, index0, index1, index2) {
PIXI.Strip.prototype._renderCanvasDrawTriangle = function(context, vertices, uvs, index0, index1, index2)
{
var textureSource = this.texture.baseTexture.source;
var textureWidth = this.texture.width;
var textureHeight = this.texture.height;
var x0 = vertices[index0],
x1 = vertices[index1],
x2 = vertices[index2];
var y0 = vertices[index0 + 1],
y1 = vertices[index1 + 1],
y2 = vertices[index2 + 1];
var x0 = vertices[index0], x1 = vertices[index1], x2 = vertices[index2];
var y0 = vertices[index0 + 1], y1 = vertices[index1 + 1], y2 = vertices[index2 + 1];
var u0 = uvs[index0] * textureWidth,
u1 = uvs[index1] * textureWidth,
u2 = uvs[index2] * textureWidth;
var v0 = uvs[index0 + 1] * textureHeight,
v1 = uvs[index1 + 1] * textureHeight,
v2 = uvs[index2 + 1] * textureHeight;
var u0 = uvs[index0] * textureWidth, u1 = uvs[index1] * textureWidth, u2 = uvs[index2] * textureWidth;
var v0 = uvs[index0 + 1] * textureHeight, v1 = uvs[index1 + 1] * textureHeight, v2 = uvs[index2 + 1] * textureHeight;
if (this.canvasPadding > 0) {
var paddingX = this.canvasPadding / this.worldTransform.a;
@ -344,12 +323,12 @@ PIXI.Strip.prototype._renderCanvasDrawTriangle = function (context, vertices, uv
context.clip();
// Compute matrix transform
var delta = (u0 * v1) + (v0 * u2) + (u1 * v2) - (v1 * u2) - (v0 * u1) - (u0 * v2);
var deltaA = (x0 * v1) + (v0 * x2) + (x1 * v2) - (v1 * x2) - (v0 * x1) - (x0 * v2);
var deltaB = (u0 * x1) + (x0 * u2) + (u1 * x2) - (x1 * u2) - (x0 * u1) - (u0 * x2);
var delta = (u0 * v1) + (v0 * u2) + (u1 * v2) - (v1 * u2) - (v0 * u1) - (u0 * v2);
var deltaA = (x0 * v1) + (v0 * x2) + (x1 * v2) - (v1 * x2) - (v0 * x1) - (x0 * v2);
var deltaB = (u0 * x1) + (x0 * u2) + (u1 * x2) - (x1 * u2) - (x0 * u1) - (u0 * x2);
var deltaC = (u0 * v1 * x2) + (v0 * x1 * u2) + (x0 * u1 * v2) - (x0 * v1 * u2) - (v0 * u1 * x2) - (u0 * x1 * v2);
var deltaD = (y0 * v1) + (v0 * y2) + (y1 * v2) - (v1 * y2) - (v0 * y1) - (y0 * v2);
var deltaE = (u0 * y1) + (y0 * u2) + (u1 * y2) - (y1 * u2) - (y0 * u1) - (u0 * y2);
var deltaD = (y0 * v1) + (v0 * y2) + (y1 * v2) - (v1 * y2) - (v0 * y1) - (y0 * v2);
var deltaE = (u0 * y1) + (y0 * u2) + (u1 * y2) - (y1 * u2) - (y0 * u1) - (u0 * y2);
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,
@ -369,24 +348,22 @@ PIXI.Strip.prototype._renderCanvasDrawTriangle = function (context, vertices, uv
* @param strip {Strip} The Strip to render
* @private
*/
PIXI.Strip.prototype.renderStripFlat = function (strip) {
PIXI.Strip.prototype.renderStripFlat = function(strip)
{
var context = this.context;
var vertices = strip.vertices;
var length = vertices.length / 2;
var length = vertices.length/2;
this.count++;
context.beginPath();
for (var i = 1; i < length - 2; i++) {
for (var i=1; i < length-2; i++)
{
// draw some triangles!
var index = i * 2;
var index = i*2;
var x0 = vertices[index],
x1 = vertices[index + 2],
x2 = vertices[index + 4];
var y0 = vertices[index + 1],
y1 = vertices[index + 3],
y2 = vertices[index + 5];
var x0 = vertices[index], x1 = vertices[index+2], x2 = vertices[index+4];
var y0 = vertices[index+1], y1 = vertices[index+3], y2 = vertices[index+5];
context.moveTo(x0, y0);
context.lineTo(x1, y1);
@ -420,9 +397,9 @@ PIXI.Strip.prototype.setTexture = function(texture)
* @private
*/
PIXI.Strip.prototype.onTextureUpdate = function () {
PIXI.Strip.prototype.onTextureUpdate = function()
{
this.updateFrame = true;
this.rebindTexture();
};
/**
@ -432,7 +409,8 @@ PIXI.Strip.prototype.onTextureUpdate = function () {
* @param matrix {Matrix} the transformation matrix of the sprite
* @return {Rectangle} the framing rectangle
*/
PIXI.Strip.prototype.getBounds = function (matrix) {
PIXI.Strip.prototype.getBounds = function(matrix)
{
var worldTransform = matrix || this.worldTransform;
var a = worldTransform.a;
@ -449,9 +427,9 @@ PIXI.Strip.prototype.getBounds = function (matrix) {
var minY = Infinity;
var vertices = this.vertices;
for (var i = 0, n = vertices.length; i < n; i += 2) {
var rawX = vertices[i],
rawY = vertices[i + 1];
for (var i = 0, n = vertices.length; i < n; i += 2)
{
var rawX = vertices[i], rawY = vertices[i + 1];
var x = (a * rawX) + (c * rawY) + tx;
var y = (d * rawY) + (b * rawX) + ty;
@ -462,7 +440,8 @@ PIXI.Strip.prototype.getBounds = function (matrix) {
maxY = y > maxY ? y : maxY;
}
if (minX === -Infinity || maxY === Infinity) {
if (minX === -Infinity || maxY === Infinity)
{
return PIXI.EmptyRectangle;
}
@ -480,32 +459,6 @@ PIXI.Strip.prototype.getBounds = function (matrix) {
return bounds;
};
/**
* Retrieves the non-global local bounds of the mesh as a rectangle. The calculation takes all visible children into consideration.
*
* @method getLocalBounds
* @return {Rectangle} The rectangular bounding area
*/
PIXI.Strip.prototype.getLocalBounds = function () {
var matrixCache = this.worldTransform;
this.worldTransform = PIXI.identityMatrix;
for (var i = 0; i < this.children.length; i++) {
this.children[i].updateTransform();
}
var bounds = this.getBounds();
this.worldTransform = matrixCache;
for (i = 0; i < this.children.length; i++) {
this.children[i].updateTransform();
}
return bounds;
};
/**
* Different drawing buffer modes supported
*

419
src/pixi/extras/Tilemap.js
View file

@ -1,419 +0,0 @@
/**
* @author Richard Davey <rich@photonstorm.com>
* @author Pete Baron <pete@photonstorm.com>
* @copyright 2016 Photon Storm Ltd.
* @license {@link https://github.com/photonstorm/phaser/blob/master/license.txt|MIT License}
*/
/**
* A PIXI WebGL Tilemap.
*
* @class PIXI.Tilemap
* @extends {PIXI.DisplayObject}
* @param {PIXI.Texture} texture - The tilemap texture.
* @param {integer} displayWidth - The width of the display area. Used as the clipping limit for the shader.
* @param {integer} displayHeight - The height of the display area. Used as the clipping limit for the shader.
* @param {integer} mapWidth - The width of the map.
* @param {integer} mapHeight - The height of the map.
* @param {integer} tileWidth - The width of a single tile.
* @param {integer} tileHeight - The height of a single tile.
* @param {Array} layer - Tilemap layer data from the map, arranged in mapHeight lists of mapWidth Phaser.Tile objects (2d array).
*/
PIXI.Tilemap = function (texture, displayWidth, displayHeight, mapWidth, mapHeight, tileWidth, tileHeight, layer) {
PIXI.DisplayObject.call(this);
/**
* The texture of the Tilemap
*
* @property texture
* @type Texture
*/
this.texture = texture;
/**
* The clipping limit of the display area.
*
* @property _displayWidth
* @type integer
* @private
*/
this._displayWidth = displayWidth;
/**
* The clipping limit of the display area.
*
* @property _displayHeight
* @type integer
* @private
*/
this._displayHeight = displayHeight;
/**
* The width of a single tile in pixels.
*
* @property tileWidth
* @type integer
*/
this.tileWidth = tileWidth;
/**
* The height of a single tile in pixels.
*
* @property tileHeight
* @type integer
*/
this.tileHeight = tileHeight;
/**
* The width of the map in tiles.
*
* @property mapWidth
* @type integer
*/
this.mapWidth = mapWidth;
/**
* The height of the map in tiles.
*
* @property mapHeight
* @type integer
*/
this.mapHeight = mapHeight;
/**
* The width of the map in pixels.
*
* @property width
* @type integer
*/
this.pxWidth = this.mapWidth * this.tileWidth;
/**
* The height of the map in pixels.
*
* @property height
* @type integer
*/
this.pxHeight = this.mapHeight * this.tileHeight;
/**
* Tilemap layer data from the map, arranged in mapHeight lists of mapWidth tiles.
* Contains Phaser.Tile objects (2d array).
*
* @property layer
* @type Array
*/
this.layer = layer;
/**
* Store the list of batch drawing instructions.
*
* @property glBatch
* @type Array
*/
this.glBatch = null;
/**
* Remember last tile drawn to avoid unnecessary set-up.
*
* @property lastTile
* @type integer
*/
this.lastTile = -1;
/**
* Whether the Tilemap is dirty or not.
*
* @property dirty
* @type boolean
*/
this.dirty = true;
/**
* The blend mode to be applied to the tilemap.
* Set to PIXI.blendModes.NORMAL to remove any blend mode.
*
* @property blendMode
* @type integer
* @default PIXI.blendModes.NORMAL;
*/
this.blendMode = PIXI.blendModes.NORMAL;
/**
* The size of a single data element in the batch drawing.
* Each tile requires two triangles, each specified as:
* float left, bottom, right, top - screen coordinates
* float u, v, wide, high - source texture coordinates
*
* @property batchDataElement
* @type integer
*/
this.batchDataElement = 16;
/**
* Create the buffer data for the WebGL rendering of this tilemap.
* Calculates the total batch data size.
*
* @property buffer
* @type PIXI.Float32Array
*/
this.buffer = new PIXI.Float32Array(mapWidth * mapHeight * this.batchDataElement);
/**
* A required but un-used array.
* Do not add objects to this array, Tilemaps cannot have children.
*
* @property children
* @type Array
* @private
*/
this.children = [];
};
PIXI.Tilemap.prototype = Object.create(PIXI.DisplayObject.prototype);
PIXI.Tilemap.prototype.constructor = PIXI.Tilemap;
PIXI.Tilemap.prototype.update = function () {};
PIXI.Tilemap.prototype.postUpdate = function () {};
PIXI.Tilemap.prototype._initWebGL = function (renderSession) {
var gl = renderSession.gl;
// create a GL buffer to transfer all the vertex position data through
this.positionBuffer = gl.createBuffer();
// bind the buffer to the RAM resident positionBuffer
gl.bindBuffer(gl.ARRAY_BUFFER, this.positionBuffer);
gl.bufferData(gl.ARRAY_BUFFER, this.buffer, gl.STATIC_DRAW);
};
// override PIXI.DisplayObjectContainer _renderWebGL
PIXI.Tilemap.prototype._renderWebGL = function (renderSession) {
// if the sprite is not visible or the alpha is 0 then no need to render this element
if (!this.visible || this.alpha <= 0)
{
return;
}
// stop current render session batch drawing
renderSession.spriteBatch.stop();
if (!this.positionBuffer)
{
this._initWebGL(renderSession);
}
renderSession.shaderManager.setShader(renderSession.shaderManager.tilemapShader);
this._renderWholeTilemap(renderSession);
// restart batch drawing now that this Tile layer has been rendered
renderSession.spriteBatch.start();
};
PIXI.Tilemap.prototype._renderBatch = function (renderSession) {
if (!this.glBatch)
{
return;
}
var gl = renderSession.gl;
// TODO: should probably use destination buffer dimensions (halved)
var screenWide2 = this.game.width * 0.5;
var screenHigh2 = this.game.height * 0.5;
// size of one pixel in the source texture
var iTextureWide = 1.0 / this.texture.width;
var iTextureHigh = 1.0 / this.texture.height;
// pre-calculate inverse half-buffer dimensions
var iWide = 1.0 / screenWide2;
var iHigh = 1.0 / screenHigh2;
var wide = this.tileWidth * 0.5 / screenWide2;
var high = this.tileHeight * 0.5 / screenHigh2;
var buffer = this.buffer;
var oldR, oldT, uvl, uvt;
// process entire glBatch into a single webGl draw buffer for a TRIANGLE_STRIP blit
var c = 0;
var degenerate = false;
for (var i = 0, l = this.glBatch.length; i < l; i++)
{
// each object in this.glBatch has properties:
// sx: this.drawCoords[coordIndex],
// sy: this.drawCoords[coordIndex + 1],
// sw: this.tileWidth,
// sh: this.tileHeight,
// dx: x,
// dy: y,
// dw: this.tileWidth,
// dh: this.tileHeight
var t = this.glBatch[i];
if (!t)
{
// insert a degenerate triangle when null is found in the list of batch objects
degenerate = true;
// skip to end of loop, degenerate will be inserted when no more null objects are found
continue;
}
var x = t.dx * iWide - 1;
var y = 1 - t.dy * iHigh;
var lft = x - wide;
var bot = y + high;
var uvl = t.sx * iTextureWide;
var uvt = t.sy * iTextureHigh;
// insert a degenerate triangle to separate the tiles
if (degenerate)
{
// add a degenerate triangle: repeat the last vertex
buffer[ c ] = oldR;
buffer[ c + 1 ] = oldT;
// then repeat the next vertex
buffer[ c + 4 ] = lft;
buffer[ c + 5 ] = bot;
// pad with texture coordinates (probably not needed)
buffer[ c + 2 ] = buffer[ c + 6 ] = uvl;
buffer[ c + 3 ] = buffer[ c + 7 ] = uvt;
// advance the buffer index for one single degenerate triangle
c += 8;
degenerate = false;
}
// calculate the destination location of the tile in screen units (-1..1)
buffer[ c ] = buffer[ c + 4 ] = lft;
buffer[ c + 1 ] = buffer[ c + 9 ] = bot;
buffer[ c + 8 ] = buffer[ c + 12 ] = oldR = x + wide;
buffer[ c + 5 ] = buffer[ c + 13 ] = oldT = y - high;
// calculate the uv coordinates of the tile source image
if (t.fd === 1)
{
// flipped diagonally, swap x,y axes
buffer[ c + 14 ] = buffer[ c + 6 ] = uvl;
buffer[ c + 15 ] = buffer[ c + 11 ] = uvt;
buffer[ c + 10 ] = buffer[ c + 2 ] = uvl + t.sw * iTextureWide;
buffer[ c + 7 ] = buffer[ c + 3 ] = uvt + t.sh * iTextureHigh;
}
else
{
buffer[ c + 2 ] = buffer[ c + 6 ] = uvl;
buffer[ c + 3 ] = buffer[ c + 11 ] = uvt;
buffer[ c + 10 ] = buffer[ c + 14 ] = uvl + t.sw * iTextureWide;
buffer[ c + 7 ] = buffer[ c + 15 ] = uvt + t.sh * iTextureHigh;
}
// advance the buffer index
c += 16;
}
// if there's anything to draw...
if (c > 0)
{
var shader = renderSession.shaderManager.tilemapShader;
// upload the VBO
gl.bufferData(gl.ARRAY_BUFFER, buffer, gl.STATIC_DRAW);
// prepare the shader attributes
gl.vertexAttribPointer(shader.aPosition, 4, gl.FLOAT, false, 0, 0);
// draw the entire VBO in one call
gl.drawArrays(gl.TRIANGLE_STRIP, 0, Math.floor(c / 4));
}
};
/**
* Render the entire tilemap using a fast WebGL batched tile render.
*
* @param {Object} renderSession - The PIXI RenderSession.
*/
PIXI.Tilemap.prototype._renderWholeTilemap = function (renderSession) {
var gl = renderSession.gl;
var shader = renderSession.shaderManager.tilemapShader;
renderSession.blendModeManager.setBlendMode(this.blendMode);
// set the uniforms and texture
// set the global offset (e.g. screen shake)
gl.uniform2f(shader.uOffset, renderSession.offset.x / this.game.width * 2, -renderSession.offset.y / this.game.height * 2);
// Set the clipping limits
var clipOffsetX = this._mc.x / this.game.width * 2;
var clipOffsetY = -this._mc.y / this.game.height * 2;
var clipLocX = this._mc.x;
var clipLocY = -this._mc.y;
// The width, going across from the LEFT OF THE SCREEN, of the clipping limit
var clipLimitX = this._mc.x + this._displayWidth;
// The height, going up from the BOTTOM OF THE SCREEN, of the clipping limit
var clipLimitY = this.game.height - (this._mc.y + this._displayHeight);
// console.log('render');
// console.log(clipOffsetX, clipOffsetY);
// console.log(clipLocX, clipLocY);
// console.log(clipLimitX, clipLimitY);
// console.log(this._displayWidth, this._displayHeight);
// debugger;
gl.uniform2f(shader.uClipLimit, clipLimitX, clipLimitY);
gl.uniform2f(shader.uClipOffset, clipOffsetX, clipOffsetY);
gl.uniform2f(shader.uClipLoc, clipLocX, clipLocY);
// set the offset in screen units to the center of the screen
// and flip the GL y coordinate to be zero at the top
gl.uniform2f(shader.uCentreOffset, 1, -1);
// alpha value for whole batch
gl.uniform1f(shader.uAlpha, this.alpha);
// scale factors for whole batch
gl.uniform2f(shader.uScale, this.worldScale.x, this.worldScale.y);
// source texture unit
gl.activeTexture(gl.TEXTURE0);
// check if a texture is dirty...
if (this.texture.baseTexture._dirty[gl.id])
{
renderSession.renderer.updateTexture(this.texture.baseTexture);
}
else
{
// bind the current texture
gl.bindTexture(gl.TEXTURE_2D, this.texture.baseTexture._glTextures[gl.id]);
}
// bind the source buffer
gl.bindBuffer(gl.ARRAY_BUFFER, this.positionBuffer);
// draw the batched tile list
this._renderBatch(renderSession);
};

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

@ -180,7 +180,6 @@ PIXI.TilingSprite.prototype._renderWebGL = function(renderSession)
{
if (this.tilingTexture.needsUpdate)
{
this.tilingTexture.baseTexture.textureIndex = this.texture.baseTexture.textureIndex;
renderSession.renderer.updateTexture(this.tilingTexture.baseTexture);
this.tilingTexture.needsUpdate = false;
}
@ -197,23 +196,21 @@ PIXI.TilingSprite.prototype._renderWebGL = function(renderSession)
{
this.children[i]._renderWebGL(renderSession);
}
var restartBatch = false;
renderSession.spriteBatch.stop();
if (this._filters)
{
restartBatch = true;
renderSession.spriteBatch.stop();
renderSession.filterManager.popFilter();
}
if (this._mask)
{
if (!restartBatch)
renderSession.spriteBatch.stop();
renderSession.maskManager.popMask(this._mask, renderSession);
}
if (restartBatch)
renderSession.spriteBatch.start();
renderSession.spriteBatch.start();
};
/**

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

@ -190,13 +190,6 @@ PIXI.CanvasRenderer.prototype.render = function (root) {
};
PIXI.CanvasRenderer.prototype.setTexturePriority = function (textureNameCollection) {
// Does nothing on Canvas, but here to allow you to simply set
// `game.renderer.setTexturePriority()` without having to worry about
// running in WebGL or not.
};
/**
* Removes everything from the renderer and optionally removes the Canvas DOM element.

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

@ -2,21 +2,20 @@
* @author Mat Groves http://matgroves.com/ @Doormat23
*/
// this is where we store the webGL contexts for easy access.
PIXI.glContexts = [];
PIXI.glContexts = []; // this is where we store the webGL contexts for easy access.
PIXI.instances = [];
/**
* The WebGLRenderer draws the stage and all its content onto a WebGL enabled canvas.
* This renderer should be used for browsers that support WebGL.
* This renderer works by automatically managing WebGL Batches, so there is no need for
* Sprite Batches or Sprite Clouds.
* The WebGLRenderer draws the stage and all its content onto a webGL enabled canvas. This renderer
* should be used for browsers that support webGL. This Render works by automatically managing webGLBatchs.
* So no need for Sprite Batches or Sprite Clouds.
* Don't forget to add the view to your DOM or you will not see anything :)
*
* @class WebGLRenderer
* @constructor
* @param game {Phaser.Game} A reference to the Phaser Game instance
*/
PIXI.WebGLRenderer = function (game) {
PIXI.WebGLRenderer = function(game) {
/**
* @property {Phaser.Game} game - A reference to the Phaser Game instance.
@ -210,7 +209,6 @@ PIXI.WebGLRenderer.prototype.initContext = function()
var gl = this.view.getContext('webgl', this._contextOptions) || this.view.getContext('experimental-webgl', this._contextOptions);
this.gl = gl;
this.maxTextures = gl.getParameter(gl.MAX_TEXTURE_IMAGE_UNITS);
if (!gl) {
// fail, not able to get a context
@ -242,72 +240,39 @@ PIXI.WebGLRenderer.prototype.initContext = function()
this.resize(this.width, this.height);
};
PIXI.WebGLRenderer.prototype.setTexturePriority = function (textureNameCollection) {
var maxTextures = this.maxTextures;
var imageCache = this.game.cache._cache.image;
var imageName = null;
// We start from 1 because framebuffer texture uses unit 0.
for (var index = 0; index < textureNameCollection.length; ++index)
{
imageName = textureNameCollection[index];
if (!(imageName in imageCache))
{
continue;
}
if (index + 1 < maxTextures)
{
imageCache[imageName].base.textureIndex = index + 1;
}
else
{
imageCache[imageName].base.textureIndex = maxTextures - 1;
}
}
};
/**
* Renders the DisplayObjectContainer, usually the Phaser.Stage, to the WebGL enabled canvas.
* Renders the stage to its webGL view
*
* @method render
* @param root {Phaser.Stage|PIXI.DisplayObjectContainer} The root element to be rendered.
* @param stage {Stage} the Stage element to be rendered
*/
PIXI.WebGLRenderer.prototype.render = function (root) {
PIXI.WebGLRenderer.prototype.render = function(stage)
{
// no point rendering if our context has been blown up!
if (this.contextLost)
{
// No point rendering if the context is lost.
return;
}
var gl = this.gl;
// -- Does this need to be set every frame? -- //
gl.viewport(0, 0, this.width, this.height);
// Bind the Frame Buffer
// make sure we are bound to the main frame buffer
gl.bindFramebuffer(gl.FRAMEBUFFER, null);
// Clear it
if (this.game.clearBeforeRender)
{
var color = this.game.stage._bgColor;
gl.clearColor(color.r, color.g, color.b, color.a);
gl.clearColor(stage._bgColor.r, stage._bgColor.g, stage._bgColor.b, stage._bgColor.a);
gl.clear(gl.COLOR_BUFFER_BIT);
}
// Apply Camera Shake
this.offset.x = this.game.camera._shake.x;
this.offset.y = this.game.camera._shake.y;
// Let the magic begin ...
this.renderDisplayObject(root, this.projection);
this.renderDisplayObject(stage, this.projection);
};
/**
@ -318,8 +283,8 @@ PIXI.WebGLRenderer.prototype.render = function (root) {
* @param projection {Point} The projection
* @param buffer {Array} a standard WebGL buffer
*/
PIXI.WebGLRenderer.prototype.renderDisplayObject = function(displayObject, projection, buffer, matrix) {
PIXI.WebGLRenderer.prototype.renderDisplayObject = function(displayObject, projection, buffer, matrix)
{
this.renderSession.blendModeManager.setBlendMode(PIXI.blendModes.NORMAL);
// reset the render session data..
@ -345,7 +310,6 @@ PIXI.WebGLRenderer.prototype.renderDisplayObject = function(displayObject, proje
// finish the sprite batch
this.spriteBatch.end();
};
/**
@ -355,18 +319,15 @@ PIXI.WebGLRenderer.prototype.renderDisplayObject = function(displayObject, proje
* @param width {Number} the new width of the webGL view
* @param height {Number} the new height of the webGL view
*/
PIXI.WebGLRenderer.prototype.resize = function (width, height) {
PIXI.WebGLRenderer.prototype.resize = function(width, height)
{
this.width = width * this.resolution;
this.height = height * this.resolution;
this.view.width = this.width;
this.view.height = this.height;
// TODO - This probably needs removing, along with the property
// as it will conflict with the ScaleManager
if (this.autoResize)
{
if (this.autoResize) {
this.view.style.width = this.width / this.resolution + 'px';
this.view.style.height = this.height / this.resolution + 'px';
}
@ -375,18 +336,17 @@ PIXI.WebGLRenderer.prototype.resize = function (width, height) {
this.projection.x = this.width / 2 / this.resolution;
this.projection.y = -this.height / 2 / this.resolution;
};
/**
* Updates and creates a WebGL texture for the renderers context.
* Updates and Creates a WebGL texture for the renderers context.
*
* @method updateTexture
* @param texture {Texture} the texture to update
* @return {boolean} True if the texture was successfully bound, otherwise false.
*/
PIXI.WebGLRenderer.prototype.updateTexture = function (texture) {
PIXI.WebGLRenderer.prototype.updateTexture = function(texture)
{
if (!texture.hasLoaded)
{
return false;
@ -398,7 +358,6 @@ PIXI.WebGLRenderer.prototype.updateTexture = function (texture) {
{
texture._glTextures[gl.id] = gl.createTexture();
}
gl.activeTexture(gl.TEXTURE0 + texture.textureIndex);
gl.bindTexture(gl.TEXTURE_2D, texture._glTextures[gl.id]);
@ -431,6 +390,7 @@ PIXI.WebGLRenderer.prototype.updateTexture = function (texture) {
texture._dirty[gl.id] = false;
// return texture._glTextures[gl.id];
return true;
};
@ -440,8 +400,8 @@ PIXI.WebGLRenderer.prototype.updateTexture = function (texture) {
*
* @method destroy
*/
PIXI.WebGLRenderer.prototype.destroy = function () {
PIXI.WebGLRenderer.prototype.destroy = function()
{
PIXI.glContexts[this.glContextId] = null;
this.projection = null;
@ -465,7 +425,6 @@ PIXI.WebGLRenderer.prototype.destroy = function () {
PIXI.instances[this.glContextId] = null;
PIXI.WebGLRenderer.glContextId--;
};
/**
@ -473,8 +432,8 @@ PIXI.WebGLRenderer.prototype.destroy = function () {
*
* @method mapBlendModes
*/
PIXI.WebGLRenderer.prototype.mapBlendModes = function () {
PIXI.WebGLRenderer.prototype.mapBlendModes = function()
{
var gl = this.gl;
if (!PIXI.blendModesWebGL)
@ -502,7 +461,6 @@ PIXI.WebGLRenderer.prototype.mapBlendModes = function () {
PIXI.blendModesWebGL = b;
}
};
PIXI.WebGLRenderer.glContextId = 0;

3
src/pixi/renderers/webgl/shaders/ComplexPrimitiveShader.js
View file

@ -35,7 +35,7 @@ PIXI.ComplexPrimitiveShader = function(gl)
* @type Array
*/
this.fragmentSrc = [
'// ComplexPrimitiveShader Fragment Shader.',
'precision mediump float;',
'varying vec4 vColor;',
@ -51,7 +51,6 @@ PIXI.ComplexPrimitiveShader = function(gl)
* @type Array
*/
this.vertexSrc = [
'// ComplexPrimitiveShader Vertex Shader.',
'attribute vec2 aVertexPosition;',
//'attribute vec4 aColor;',
'uniform mat3 translationMatrix;',

105
src/pixi/renderers/webgl/shaders/PixiFastShader.js
View file

@ -3,18 +3,19 @@
*/
/**
* @class PixiFastShader
* @constructor
* @param gl {WebGLContext} the current WebGL drawing context
*/
PIXI.PixiFastShader = function (gl) {
* @class PixiFastShader
* @constructor
* @param gl {WebGLContext} the current WebGL drawing context
*/
PIXI.PixiFastShader = function(gl)
{
/**
* @property _UID
* @type Number
* @private
*/
this._UID = PIXI._UID++;
/**
* @property gl
* @type WebGLContext
@ -28,33 +29,18 @@ PIXI.PixiFastShader = function (gl) {
*/
this.program = null;
var gl = this.gl;
this.MAX_TEXTURES = gl.getParameter(gl.MAX_TEXTURE_IMAGE_UNITS);
var dynamicIfs = '\tif (vTextureIndex == 0.0) gl_FragColor = texture2D(uSamplerArray[0], vTextureCoord) * vColor;\n'
for (var index = 1; index < this.MAX_TEXTURES; ++index)
{
dynamicIfs += '\telse if (vTextureIndex == ' +
index + '.0) gl_FragColor = texture2D(uSamplerArray[' +
index + '], vTextureCoord) * vColor;\n'
}
/**
* The fragment shader.
* @property fragmentSrc
* @type Array
*/
this.fragmentSrc = [
'// PixiFastShader Fragment Shader.',
'precision lowp float;',
'varying vec2 vTextureCoord;',
'varying float vColor;',
'varying float vTextureIndex;',
'uniform sampler2D uSamplerArray[' + this.MAX_TEXTURES + '];',
'const vec4 PINK = vec4(1.0, 0.0, 1.0, 1.0);',
'const vec4 GREEN = vec4(0.0, 1.0, 0.0, 1.0);',
'uniform sampler2D uSampler;',
'void main(void) {',
dynamicIfs,
'else gl_FragColor = PINK;',
' gl_FragColor = texture2D(uSampler, vTextureCoord) * vColor ;',
'}'
];
@ -64,14 +50,12 @@ PIXI.PixiFastShader = function (gl) {
* @type Array
*/
this.vertexSrc = [
'// PixiFastShader Vertex Shader.',
'attribute vec2 aVertexPosition;',
'attribute vec2 aPositionCoord;',
'attribute vec2 aScale;',
'attribute float aRotation;',
'attribute vec2 aTextureCoord;',
'attribute float aColor;',
'attribute float aTextureIndex;',
'uniform vec2 projectionVector;',
'uniform vec2 offsetVector;',
@ -79,7 +63,6 @@ PIXI.PixiFastShader = function (gl) {
'varying vec2 vTextureCoord;',
'varying float vColor;',
'varying float vTextureIndex;',
'const vec2 center = vec2(-1.0, 1.0);',
@ -91,8 +74,7 @@ PIXI.PixiFastShader = function (gl) {
' v = ( uMatrix * vec3(v + aPositionCoord , 1.0) ).xy ;',
' gl_Position = vec4( ( v / projectionVector) + center , 0.0, 1.0);',
' vTextureCoord = aTextureCoord;',
' vTextureIndex = aTextureIndex;',
// ' vec3 color = mod(vec3(aColor.y/65536.0, aColor.y/256.0, aColor.y), 256.0) / 256.0;',
// ' vec3 color = mod(vec3(aColor.y/65536.0, aColor.y/256.0, aColor.y), 256.0) / 256.0;',
' vColor = aColor;',
'}'
];
@ -103,40 +85,27 @@ PIXI.PixiFastShader = function (gl) {
* @type Number
*/
this.textureCount = 0;
this.init();
};
PIXI.PixiFastShader.prototype.constructor = PIXI.PixiFastShader;
/**
* Initialises the shader.
*
* @method init
*/
PIXI.PixiFastShader.prototype.init = function () {
* Initialises the shader.
*
* @method init
*/
PIXI.PixiFastShader.prototype.init = function()
{
var gl = this.gl;
var program = PIXI.compileProgram(gl, this.vertexSrc, this.fragmentSrc);
var program = PIXI.compileProgram(gl, this.vertexSrc, this.fragmentSrc);
gl.useProgram(program);
// get and store the uniforms for the shader
this.uSampler = gl.getUniformLocation(program, 'uSamplerArray[0]');
var indices = [];
// HACK: we bind an empty texture to avoid WebGL warning spam.
var tempTexture = gl.createTexture();
gl.activeTexture(gl.TEXTURE0);
gl.bindTexture(gl.TEXTURE_2D, tempTexture);
gl.texImage2D(gl.TEXTURE_2D, 0, gl.RGB, 1, 1, 0, gl.RGB, gl.UNSIGNED_BYTE, null);
for (var i = 0; i < this.MAX_TEXTURES; ++i) {
gl.activeTexture(gl.TEXTURE0 + i);
gl.bindTexture(gl.TEXTURE_2D, tempTexture);
indices.push(i);
}
gl.activeTexture(gl.TEXTURE0);
gl.uniform1iv(this.uSampler, indices);
this.uSampler = gl.getUniformLocation(program, 'uSampler');
this.projectionVector = gl.getUniformLocation(program, 'projectionVector');
this.offsetVector = gl.getUniformLocation(program, 'offsetVector');
@ -152,43 +121,35 @@ PIXI.PixiFastShader.prototype.init = function () {
this.aTextureCoord = gl.getAttribLocation(program, 'aTextureCoord');
this.colorAttribute = gl.getAttribLocation(program, 'aColor');
this.aTextureIndex = gl.getAttribLocation(program, 'aTextureIndex');
// Begin worst hack eva //
// WHY??? ONLY on my chrome pixel the line above returns -1 when using filters?
// maybe its somthing to do with the current state of the gl context.
// Im convinced this is a bug in the chrome browser as there is NO reason why this should be returning -1 especially as it only manifests on my chrome pixel
// If theres any webGL people that know why could happen please help :)
if (this.colorAttribute === -1) {
if(this.colorAttribute === -1)
{
this.colorAttribute = 2;
}
this.attributes = [
this.aVertexPosition,
this.aPositionCoord,
this.aScale,
this.aRotation,
this.aTextureCoord,
this.colorAttribute,
this.aTextureIndex
];
this.attributes = [this.aVertexPosition, this.aPositionCoord, this.aScale, this.aRotation, this.aTextureCoord, this.colorAttribute];
// End worst hack eva //
this.program = program;
};
/**
* Destroys the shader.
*
* @method destroy
*/
PIXI.PixiFastShader.prototype.destroy = function () {
this.gl.deleteProgram(this.program);
* Destroys the shader.
*
* @method destroy
*/
PIXI.PixiFastShader.prototype.destroy = function()
{
this.gl.deleteProgram( this.program );
this.uniforms = null;
this.gl = null;
this.attributes = null;
};
};

61
src/pixi/renderers/webgl/shaders/PixiShader.js
View file

@ -35,7 +35,15 @@ PIXI.PixiShader = function(gl)
* @property fragmentSrc
* @type Array
*/
this.fragmentSrc = null;
this.fragmentSrc = [
'precision lowp float;',
'varying vec2 vTextureCoord;',
'varying vec4 vColor;',
'uniform sampler2D uSampler;',
'void main(void) {',
' gl_FragColor = texture2D(uSampler, vTextureCoord) * vColor ;',
'}'
];
/**
* A local texture counter for multi-texture shaders.
@ -80,36 +88,13 @@ PIXI.PixiShader.prototype.constructor = PIXI.PixiShader;
PIXI.PixiShader.prototype.init = function()
{
var gl = this.gl;
this.MAX_TEXTURES = gl.getParameter(gl.MAX_TEXTURE_IMAGE_UNITS);
var dynamicIfs = '\tif (vTextureIndex == 0.0) gl_FragColor = texture2D(uSamplerArray[0], vTextureCoord) * vColor;\n'
for (var index = 1; index < this.MAX_TEXTURES; ++index)
{
dynamicIfs += '\telse if (vTextureIndex == ' +
index + '.0) gl_FragColor = texture2D(uSamplerArray[' +
index + '], vTextureCoord) * vColor;\n'
}
this.fragmentSrc = [
'// PixiShader Fragment Shader.',
'precision lowp float;',
'varying vec2 vTextureCoord;',
'varying vec4 vColor;',
'varying float vTextureIndex;',
'uniform sampler2D uSamplerArray[' + this.MAX_TEXTURES + '];',
'const vec4 PINK = vec4(1.0, 0.0, 1.0, 1.0);',
'const vec4 GREEN = vec4(0.0, 1.0, 0.0, 1.0);',
'void main(void) {',
dynamicIfs,
'else gl_FragColor = PINK;',
'}'
];
var program = PIXI.compileProgram(gl, this.vertexSrc || PIXI.PixiShader.defaultVertexSrc, this.fragmentSrc);
gl.useProgram(program);
// get and store the uniforms for the shader
//this.uSampler = gl.getUniformLocation(program, 'uSampler');
this.uSamplerArray = gl.getUniformLocation(program, 'uSamplerArray[0]');
this.uSampler = gl.getUniformLocation(program, 'uSampler');
this.projectionVector = gl.getUniformLocation(program, 'projectionVector');
this.offsetVector = gl.getUniformLocation(program, 'offsetVector');
this.dimensions = gl.getUniformLocation(program, 'dimensions');
@ -118,21 +103,6 @@ PIXI.PixiShader.prototype.init = function()
this.aVertexPosition = gl.getAttribLocation(program, 'aVertexPosition');
this.aTextureCoord = gl.getAttribLocation(program, 'aTextureCoord');
this.colorAttribute = gl.getAttribLocation(program, 'aColor');
this.aTextureIndex = gl.getAttribLocation(program, 'aTextureIndex');
var indices = [];
// HACK: we bind an empty texture to avoid WebGL warning spam.
var tempTexture = gl.createTexture();
gl.activeTexture(gl.TEXTURE0);
gl.bindTexture(gl.TEXTURE_2D, tempTexture);
gl.texImage2D(gl.TEXTURE_2D, 0, gl.RGB, 1, 1, 0, gl.RGB, gl.UNSIGNED_BYTE, null);
for (var i = 0; i < this.MAX_TEXTURES; ++i) {
gl.activeTexture(gl.TEXTURE0 + i);
gl.bindTexture(gl.TEXTURE_2D, tempTexture);
indices.push(i);
}
gl.activeTexture(gl.TEXTURE0);
gl.uniform1iv(this.uSamplerArray, indices);
// Begin worst hack eva //
@ -145,7 +115,7 @@ PIXI.PixiShader.prototype.init = function()
this.colorAttribute = 2;
}
this.attributes = [this.aVertexPosition, this.aTextureCoord, this.colorAttribute, this.aTextureIndex];
this.attributes = [this.aVertexPosition, this.aTextureCoord, this.colorAttribute];
// End worst hack eva //
@ -249,8 +219,7 @@ PIXI.PixiShader.prototype.initSampler2D = function(uniform)
var gl = this.gl;
// No need to do string manipulation for this.
gl.activeTexture(gl.TEXTURE0 + this.textureCount);
gl.activeTexture(gl['TEXTURE' + this.textureCount]);
gl.bindTexture(gl.TEXTURE_2D, uniform.value.baseTexture._glTextures[gl.id]);
// Extended texture data
@ -400,27 +369,21 @@ PIXI.PixiShader.prototype.destroy = function()
* @type String
*/
PIXI.PixiShader.defaultVertexSrc = [
'// PixiShader Vertex Shader',
'// With multi-texture rendering',
'attribute vec2 aVertexPosition;',
'attribute vec2 aTextureCoord;',
'attribute vec4 aColor;',
'attribute float aTextureIndex;',
'uniform vec2 projectionVector;',
'uniform vec2 offsetVector;',
'varying vec2 vTextureCoord;',
'varying vec4 vColor;',
'varying float vTextureIndex;',
'const vec2 center = vec2(-1.0, 1.0);',
'void main(void) {',
' if (aTextureIndex > 0.0) gl_Position = vec4(0.0);',
' gl_Position = vec4( ((aVertexPosition + offsetVector) / projectionVector) + center , 0.0, 1.0);',
' vTextureCoord = aTextureCoord;',
' vColor = vec4(aColor.rgb * aColor.a, aColor.a);',
' vTextureIndex = aTextureIndex;',
'}'
];

2
src/pixi/renderers/webgl/shaders/PrimitiveShader.js
View file

@ -35,7 +35,6 @@ PIXI.PrimitiveShader = function(gl)
* @type Array
*/
this.fragmentSrc = [
'// PrimitiveShader Fragment Shader.',
'precision mediump float;',
'varying vec4 vColor;',
@ -50,7 +49,6 @@ PIXI.PrimitiveShader = function(gl)
* @type Array
*/
this.vertexSrc = [
'// PrimitiveShader Vertex Shader.',
'attribute vec2 aVertexPosition;',
'attribute vec4 aColor;',
'uniform mat3 translationMatrix;',

48
src/pixi/renderers/webgl/shaders/StripShader.js
View file

@ -29,35 +29,21 @@ PIXI.StripShader = function(gl)
*/
this.program = null;
var gl = this.gl;
this.MAX_TEXTURES = gl.getParameter(gl.MAX_TEXTURE_IMAGE_UNITS);
var dynamicIfs = '\tif (vTextureIndex == 0.0) gl_FragColor = texture2D(uSamplerArray[0], vTextureCoord);\n'
for (var index = 1; index < this.MAX_TEXTURES; ++index)
{
dynamicIfs += '\telse if (vTextureIndex == ' +
index + '.0) gl_FragColor = texture2D(uSamplerArray[' +
index + '], vTextureCoord) ;\n'
}
/**
* The fragment shader.
* @property fragmentSrc
* @type Array
*/
this.fragmentSrc = [
'//StripShader Fragment Shader.',
'precision mediump float;',
'varying vec2 vTextureCoord;',
'varying float vTextureIndex;',
// 'varying float vColor;',
'uniform float alpha;',
'uniform sampler2D uSamplerArray[' + this.MAX_TEXTURES + '];',
'const vec4 PINK = vec4(1.0, 0.0, 1.0, 1.0);',
'const vec4 GREEN = vec4(0.0, 1.0, 0.0, 1.0);',
'uniform sampler2D uSampler;',
'void main(void) {',
dynamicIfs,
'else gl_FragColor = PINK;',
' gl_FragColor = texture2D(uSampler, vec2(vTextureCoord.x, vTextureCoord.y)) * alpha;',
// ' gl_FragColor = vec4(1.0, 0.0, 0.0, 1.0);',//gl_FragColor * alpha;',
'}'
];
@ -67,17 +53,14 @@ PIXI.StripShader = function(gl)
* @type Array
*/
this.vertexSrc = [
'//StripShader Vertex Shader.',
'attribute vec2 aVertexPosition;',
'attribute vec2 aTextureCoord;',
'attribute float aTextureIndex;',
'uniform mat3 translationMatrix;',
'uniform vec2 projectionVector;',
'uniform vec2 offsetVector;',
// 'uniform float alpha;',
// 'uniform vec3 tint;',
'varying vec2 vTextureCoord;',
'varying float vTextureIndex;',
// 'varying vec4 vColor;',
'void main(void) {',
@ -85,7 +68,6 @@ PIXI.StripShader = function(gl)
' v -= offsetVector.xyx;',
' gl_Position = vec4( v.x / projectionVector.x -1.0, v.y / -projectionVector.y + 1.0 , 0.0, 1.0);',
' vTextureCoord = aTextureCoord;',
' vTextureIndex = aTextureIndex;',
// ' vColor = aColor * vec4(tint * alpha, alpha);',
'}'
];
@ -103,38 +85,22 @@ PIXI.StripShader.prototype.constructor = PIXI.StripShader;
PIXI.StripShader.prototype.init = function()
{
var gl = this.gl;
var program = PIXI.compileProgram(gl, this.vertexSrc, this.fragmentSrc);
gl.useProgram(program);
// get and store the uniforms for the shader
// get and store the uniforms for the shader
this.uSampler = gl.getUniformLocation(program, 'uSamplerArray[0]');
var indices = [];
// HACK: we bind an empty texture to avoid WebGL warning spam.
var tempTexture = gl.createTexture();
gl.activeTexture(gl.TEXTURE0);
gl.bindTexture(gl.TEXTURE_2D, tempTexture);
gl.texImage2D(gl.TEXTURE_2D, 0, gl.RGB, 1, 1, 0, gl.RGB, gl.UNSIGNED_BYTE, null);
for (var i = 0; i < this.MAX_TEXTURES; ++i) {
gl.activeTexture(gl.TEXTURE0 + i);
gl.bindTexture(gl.TEXTURE_2D, tempTexture);
indices.push(i);
}
gl.activeTexture(gl.TEXTURE0);
gl.uniform1iv(this.uSampler, indices);
this.uSampler = gl.getUniformLocation(program, 'uSampler');
this.projectionVector = gl.getUniformLocation(program, 'projectionVector');
this.offsetVector = gl.getUniformLocation(program, 'offsetVector');
this.colorAttribute = gl.getAttribLocation(program, 'aColor');
this.aTextureIndex = gl.getAttribLocation(program, 'aTextureIndex');
//this.dimensions = gl.getUniformLocation(this.program, 'dimensions');
// get and store the attributes
this.aVertexPosition = gl.getAttribLocation(program, 'aVertexPosition');
this.aTextureCoord = gl.getAttribLocation(program, 'aTextureCoord');
this.attributes = [this.aVertexPosition, this.aTextureCoord, this.aTextureIndex];
this.attributes = [this.aVertexPosition, this.aTextureCoord];
this.translationMatrix = gl.getUniformLocation(program, 'translationMatrix');
this.alpha = gl.getUniformLocation(program, 'alpha');

146
src/pixi/renderers/webgl/shaders/TilemapShader.js
View file

@ -1,146 +0,0 @@
/**
* @author Richard Davey <rich@photonstorm.com>
* @author Pete Baron <pete@photonstorm.com>
* @copyright 2016 Photon Storm Ltd.
* @license {@link https://github.com/photonstorm/phaser/blob/master/license.txt|MIT License}
*/
/**
* This shader is used to render a batch of tiles stored as a tri-strip with
* degenerate triangles at the end of each row, or group of tiles (A group is a
* row of tiles with content followed by one or more empty tiles which are not
* drawn).
*
* Settings available are:
*
* uAlpha - the alpha blending factor for a batch draw
* uOffset - an offset for all tiles in this batch (e.g. screen shake)
* uCentreOffset - the offset to the center of the drawing area, in WebGL units (-1...1)
* uScale - the scaling factor for a batch draw
* uImageSampler - the source texture containing the tile images
* aPosition - the attribute set by the batch data for drawing location
*
* @class TilemapShader
* @constructor
* @param gl {WebGLContext} the current WebGL drawing context
*/
PIXI.TilemapShader = function (gl) {
/**
* @property _UID
* @type Number
* @private
*/
this._UID = PIXI._UID++;
/**
* @property gl
* @type WebGLContext
*/
this.gl = gl;
/**
* The WebGL program.
* @property program
* @type Any
*/
this.program = null;
this.fragmentSrc = [
'precision lowp float;',
'uniform sampler2D uImageSampler;',
'uniform float uAlpha;',
'uniform vec2 uClipLoc;',
'uniform vec2 uClipLimit;',
'varying vec2 vTexCoord;',
'void main(void) {',
' if ( gl_FragCoord.x >= uClipLoc.x && gl_FragCoord.y >= uClipLoc.y && gl_FragCoord.x < uClipLimit.x && gl_FragCoord.y > uClipLimit.y )',
' gl_FragColor = texture2D(uImageSampler, vTexCoord) * uAlpha;',
'}'
];
this.vertexSrc = [
'precision lowp float;',
'uniform vec2 uOffset;',
'uniform vec2 uCentreOffset;',
'uniform vec2 uScale;',
'uniform vec2 uClipOffset;',
'attribute vec4 aPosition;',
'varying vec2 vTexCoord;',
'void main(void) {',
' gl_Position.zw = vec2(1, 1);',
' gl_Position.xy = (aPosition.xy + uOffset + uCentreOffset) * uScale - uCentreOffset + uClipOffset;',
' vTexCoord = aPosition.zw;',
'}'
];
/**
* A local texture counter for multi-texture shaders.
* @property textureCount
* @type Number
*/
this.textureCount = 0;
this.init();
};
PIXI.TilemapShader.prototype.constructor = PIXI.TilemapShader;
/**
* Initialises the shader.
*
* @method init
*/
PIXI.TilemapShader.prototype.init = function () {
var gl = this.gl;
var program = PIXI.compileProgram(gl, this.vertexSrc, this.fragmentSrc);
gl.useProgram(program);
// get and store the attributes
this.aPosition = gl.getAttribLocation(program, 'aPosition');
this.uSampler = gl.getUniformLocation(program, 'uImageSampler');
// clipping uniforms...
// clipping start location (pixels)
this.uClipLoc = gl.getUniformLocation(program, 'uClipLoc');
// clipping width/height (pixels)
this.uClipLimit = gl.getUniformLocation(program, 'uClipLimit');
// clipping start location in webGl coordinates (-1...+1)
this.uClipOffset = gl.getUniformLocation(program, 'uClipOffset');
// offset for screen shake effect etc
this.uOffset = gl.getUniformLocation(program, 'uOffset');
// centre of a tile for offset before scaling (so tiles scale from the centre out)
this.uCentreOffset = gl.getUniformLocation(program, 'uCentreOffset');
// scale factor for tiles
this.uScale = gl.getUniformLocation(program, 'uScale');
// alpha blending
this.uAlpha = gl.getUniformLocation(program, 'uAlpha');
this.attributes = [this.aPosition];
this.uniforms = [this.uClipOffset, this.uClipLoc, this.uClipLimit, this.uOffset, this.uCentreOffset, this.uAlpha, this.uScale, this.uSampler];
this.program = program;
};
/**
* Destroys the shader.
*
* @method destroy
*/
PIXI.TilemapShader.prototype.destroy = function () {
this.gl.deleteProgram(this.program);
this.gl = null;
this.uniforms = null;
this.attributes = null;
};

30
src/pixi/renderers/webgl/utils/WebGLFastSpriteBatch.js
View file

@ -14,12 +14,11 @@
*/
PIXI.WebGLFastSpriteBatch = function(gl)
{
/**
* @property vertSize
* @type Number
*/
this.vertSize = 11;
this.vertSize = 10;
/**
* @property maxSize
@ -179,7 +178,7 @@ PIXI.WebGLFastSpriteBatch.prototype.end = function()
* @method render
* @param spriteBatch {WebGLSpriteBatch}
*/
PIXI.WebGLFastSpriteBatch.prototype.render = function (spriteBatch)
PIXI.WebGLFastSpriteBatch.prototype.render = function(spriteBatch)
{
var children = spriteBatch.children;
var sprite = children[0];
@ -212,16 +211,6 @@ PIXI.WebGLFastSpriteBatch.prototype.render = function (spriteBatch)
*/
PIXI.WebGLFastSpriteBatch.prototype.renderSprite = function(sprite)
{
var texture = sprite.texture;
var baseTexture = texture.baseTexture;
var gl = this.gl;
if (this.textureArray[baseTexture.textureIndex] != baseTexture) {
gl.activeTexture(gl.TEXTURE0 + baseTexture.textureIndex);
gl.bindTexture(gl.TEXTURE_2D, baseTexture._glTextures[gl.id]);
this.textureArray[baseTexture.textureIndex] = baseTexture;
this.flush();
}
//sprite = children[i];
if(!sprite.visible)return;
@ -262,7 +251,7 @@ PIXI.WebGLFastSpriteBatch.prototype.renderSprite = function(sprite)
}
index = this.currentBatchSize * 4 * this.vertSize;
var textureIndex = sprite.texture.baseTexture.textureIndex;
// xy
vertices[index++] = w1;
vertices[index++] = h1;
@ -282,8 +271,6 @@ PIXI.WebGLFastSpriteBatch.prototype.renderSprite = function(sprite)
vertices[index++] = uvs.y1;
// color
vertices[index++] = sprite.alpha;
// texture Index
vertices[index++] = textureIndex;
// xy
@ -305,8 +292,7 @@ PIXI.WebGLFastSpriteBatch.prototype.renderSprite = function(sprite)
vertices[index++] = uvs.y1;
// color
vertices[index++] = sprite.alpha;
// texture Index
vertices[index++] = textureIndex;
// xy
vertices[index++] = w0;
@ -327,8 +313,7 @@ PIXI.WebGLFastSpriteBatch.prototype.renderSprite = function(sprite)
vertices[index++] = uvs.y2;
// color
vertices[index++] = sprite.alpha;
// texture Index
vertices[index++] = textureIndex;
@ -351,8 +336,6 @@ PIXI.WebGLFastSpriteBatch.prototype.renderSprite = function(sprite)
vertices[index++] = uvs.y3;
// color
vertices[index++] = sprite.alpha;
// texture Index
vertices[index++] = textureIndex;
// increment the batchs
this.currentBatchSize++;
@ -377,7 +360,7 @@ PIXI.WebGLFastSpriteBatch.prototype.flush = function()
if(!this.currentBaseTexture._glTextures[gl.id])this.renderSession.renderer.updateTexture(this.currentBaseTexture, gl);
//gl.bindTexture(gl.TEXTURE_2D, this.currentBaseTexture._glTextures[gl.id]);
gl.bindTexture(gl.TEXTURE_2D, this.currentBaseTexture._glTextures[gl.id]);
// upload the verts to the buffer
@ -441,6 +424,5 @@ PIXI.WebGLFastSpriteBatch.prototype.start = function()
gl.vertexAttribPointer(this.shader.aRotation, 1, gl.FLOAT, false, stride, 6 * 4);
gl.vertexAttribPointer(this.shader.aTextureCoord, 2, gl.FLOAT, false, stride, 7 * 4);
gl.vertexAttribPointer(this.shader.colorAttribute, 1, gl.FLOAT, false, stride, 9 * 4);
gl.vertexAttribPointer(this.shader.aTextureIndex, 1, gl.FLOAT, false, stride, 10 * 4);
};

5
src/pixi/renderers/webgl/utils/WebGLShaderManager.js
View file

@ -67,9 +67,6 @@ PIXI.WebGLShaderManager.prototype.setContext = function(gl)
// the next one is used for rendering triangle strips
this.stripShader = new PIXI.StripShader(gl);
// shader for batch drawing tilemap tiles as a set of triangle strips with degenerate triangles between them
this.tilemapShader = new PIXI.TilemapShader(gl);
this.setShader(this.defaultShader);
};
@ -157,7 +154,5 @@ PIXI.WebGLShaderManager.prototype.destroy = function()
this.stripShader.destroy();
this.tilemapShader.destroy();
this.gl = null;
};

441
src/pixi/renderers/webgl/utils/WebGLSpriteBatch.js
View file

@ -9,13 +9,14 @@
* https://github.com/libgdx/libgdx/blob/master/gdx/src/com/badlogic/gdx/graphics/g2d/WebGLSpriteBatch.java
*/
/**
/**
*
* @class WebGLSpriteBatch
* @private
* @constructor
*/
PIXI.WebGLSpriteBatch = function () {
PIXI.WebGLSpriteBatch = function()
{
/**
* @property vertSize
* @type Number
@ -27,40 +28,35 @@ PIXI.WebGLSpriteBatch = function () {
* @property size
* @type Number
*/
this.size = 2000; //Math.pow(2, 16) / this.vertSize;
this.size = 2000;//Math.pow(2, 16) / this.vertSize;
//the total number of bytes in our batch
// Including texture index:
// position + uv + color + textureIndex
// vec2 + vec2 + (char * 4) + float
this.vertexSize = (4 * 2) + (4 * 2) + (4) + (4);
var numVerts = this.vertexSize * this.size * 4;
//this.size * 4 * 4 * this.vertSize;
var numVerts = this.size * 4 * 4 * this.vertSize;
//the total number of indices in our batch
var numIndices = this.size * 6;
/**
* Holds the vertices
*
* @property vertices
* @type ArrayBuffer
*/
* Holds the vertices
*
* @property vertices
* @type ArrayBuffer
*/
this.vertices = new PIXI.ArrayBuffer(numVerts);
/**
* View on the vertices as a Float32Array
*
* @property positions
* @type Float32Array
*/
* View on the vertices as a Float32Array
*
* @property positions
* @type Float32Array
*/
this.positions = new PIXI.Float32Array(this.vertices);
/**
* View on the vertices as a Uint32Array
*
* @property colors
* @type Uint32Array
*/
* View on the vertices as a Uint32Array
*
* @property colors
* @type Uint32Array
*/
this.colors = new PIXI.Uint32Array(this.vertices);
/**
@ -70,14 +66,15 @@ PIXI.WebGLSpriteBatch = function () {
* @type Uint16Array
*/
this.indices = new PIXI.Uint16Array(numIndices);
/**
* @property lastIndexCount
* @type Number
*/
this.lastIndexCount = 0;
for (var i = 0, j = 0; i < numIndices; i += 6, j += 4) {
for (var i=0, j=0; i < numIndices; i += 6, j += 4)
{
this.indices[i + 0] = j + 0;
this.indices[i + 1] = j + 1;
this.indices[i + 2] = j + 2;
@ -138,40 +135,24 @@ PIXI.WebGLSpriteBatch = function () {
* @property defaultShader
* @type AbstractFilter
*/
this.defaultShader = null;
/**
* @property textureArray
* @type Array
*/
this.textureArray = [];
};
/**
* @method setContext
* @param gl {WebGLContext} the current WebGL drawing context
*/
PIXI.WebGLSpriteBatch.prototype.setContext = function (gl) {
this.MAX_TEXTURES = gl.getParameter(gl.MAX_TEXTURE_IMAGE_UNITS);
var dynamicIfs = '\tif (vTextureIndex == 0.0) gl_FragColor = texture2D(uSamplerArray[0], vTextureCoord) * vColor;\n'
for (var index = 1; index < this.MAX_TEXTURES; ++index) {
dynamicIfs += '\telse if (vTextureIndex == ' +
index + '.0) gl_FragColor = texture2D(uSamplerArray[' +
index + '], vTextureCoord) * vColor;\n'
}
this.gl = gl;
this.defaultShader = new PIXI.AbstractFilter([
'//WebGLSpriteBatch Fragment Shader.',
'precision lowp float;',
'varying vec2 vTextureCoord;',
'varying vec4 vColor;',
'varying float vTextureIndex;',
'uniform sampler2D uSamplerArray[' + this.MAX_TEXTURES + '];',
'uniform sampler2D uSampler;',
'void main(void) {',
dynamicIfs,
'\telse gl_FragColor = texture2D(uSamplerArray[0], vTextureCoord) * vColor;',
' gl_FragColor = texture2D(uSampler, vTextureCoord) * vColor ;',
'}'
]);
};
/**
* @method setContext
* @param gl {WebGLContext} the current WebGL drawing context
*/
PIXI.WebGLSpriteBatch.prototype.setContext = function(gl)
{
this.gl = gl;
// create a couple of buffers
this.vertexBuffer = gl.createBuffer();
@ -198,10 +179,11 @@ PIXI.WebGLSpriteBatch.prototype.setContext = function (gl) {
};
/**
* @method begin
* @param renderSession {Object} The RenderSession object
*/
PIXI.WebGLSpriteBatch.prototype.begin = function (renderSession) {
* @method begin
* @param renderSession {Object} The RenderSession object
*/
PIXI.WebGLSpriteBatch.prototype.begin = function(renderSession)
{
this.renderSession = renderSession;
this.shader = this.renderSession.shaderManager.defaultShader;
@ -209,37 +191,33 @@ PIXI.WebGLSpriteBatch.prototype.begin = function (renderSession) {
};
/**
* @method end
*/
PIXI.WebGLSpriteBatch.prototype.end = function () {
* @method end
*/
PIXI.WebGLSpriteBatch.prototype.end = function()
{
this.flush();
};
/**
* @method render
* @param sprite {Sprite} the sprite to render when using this spritebatch
* @param {Matrix} [matrix] - Optional matrix. If provided the Display Object will be rendered using this matrix, otherwise it will use its worldTransform.
*/
PIXI.WebGLSpriteBatch.prototype.render = function (sprite, matrix) {
* @method render
* @param sprite {Sprite} the sprite to render when using this spritebatch
* @param {Matrix} [matrix] - Optional matrix. If provided the Display Object will be rendered using this matrix, otherwise it will use its worldTransform.
*/
PIXI.WebGLSpriteBatch.prototype.render = function(sprite, matrix)
{
var texture = sprite.texture;
var baseTexture = texture.baseTexture;
var gl = this.gl;
if (this.textureArray[baseTexture.textureIndex] != baseTexture) {
this.flush();
gl.activeTexture(gl.TEXTURE0 + baseTexture.textureIndex);
gl.bindTexture(gl.TEXTURE_2D, baseTexture._glTextures[gl.id]);
this.textureArray[baseTexture.textureIndex] = baseTexture;
}
// They provided an alternative rendering matrix, so use it
var wt = sprite.worldTransform;
if (matrix) {
if (matrix)
{
wt = matrix;
}
// check texture..
if (this.currentBatchSize >= this.size) {
if (this.currentBatchSize >= this.size)
{
this.flush();
this.currentBaseTexture = texture.baseTexture;
}
@ -248,7 +226,8 @@ PIXI.WebGLSpriteBatch.prototype.render = function (sprite, matrix) {
var uvs = texture._uvs;
// if the uvs have not updated then no point rendering just yet!
if (!uvs) {
if (!uvs)
{
return;
}
@ -256,8 +235,9 @@ PIXI.WebGLSpriteBatch.prototype.render = function (sprite, matrix) {
var aY = sprite.anchor.y;
var w0, w1, h0, h1;
if (texture.trim) {
if (texture.trim)
{
// if the sprite is trimmed then we need to add the extra space before transforming the sprite coords.
var trim = texture.trim;
@ -266,18 +246,18 @@ PIXI.WebGLSpriteBatch.prototype.render = function (sprite, matrix) {
h1 = trim.y - aY * trim.height;
h0 = h1 + texture.crop.height;
} else {
w0 = (texture.frame.width) * (1 - aX);
}
else
{
w0 = (texture.frame.width) * (1-aX);
w1 = (texture.frame.width) * -aX;
h0 = texture.frame.height * (1 - aY);
h0 = texture.frame.height * (1-aY);
h1 = texture.frame.height * -aY;
}
var i = this.currentBatchSize * this.vertexSize; //4 * this.vertSize;
var tiOffset = this.currentBatchSize * 4;
var i = this.currentBatchSize * 4 * this.vertSize;
var resolution = texture.baseTexture.resolution;
var textureIndex = texture.baseTexture.textureIndex;
var a = wt.a / resolution;
var b = wt.b / resolution;
@ -288,96 +268,90 @@ PIXI.WebGLSpriteBatch.prototype.render = function (sprite, matrix) {
var colors = this.colors;
var positions = this.positions;
var tint = sprite.tint;
var color = (tint >> 16) + (tint & 0xff00) + ((tint & 0xff) << 16) + (sprite.worldAlpha * 255 << 24);
if (this.renderSession.roundPixels) {
positions[i++] = a * w1 + c * h1 + tx | 0;
positions[i++] = d * h1 + b * w1 + ty | 0;
positions[i++] = uvs.x0;
positions[i++] = uvs.y0;
colors[i++] = color;
positions[i++] = textureIndex;
if (this.renderSession.roundPixels)
{
// xy
positions[i] = a * w1 + c * h1 + tx | 0;
positions[i+1] = d * h1 + b * w1 + ty | 0;
positions[i++] = a * w0 + c * h1 + tx | 0;
positions[i++] = d * h1 + b * w0 + ty | 0;
positions[i++] = uvs.x1;
positions[i++] = uvs.y1;
colors[i++] = color;
positions[i++] = textureIndex;
// xy
positions[i+5] = a * w0 + c * h1 + tx | 0;
positions[i+6] = d * h1 + b * w0 + ty | 0;
positions[i++] = a * w0 + c * h0 + tx | 0;
positions[i++] = d * h0 + b * w0 + ty | 0;
positions[i++] = uvs.x2;
positions[i++] = uvs.y2;
colors[i++] = color;
positions[i++] = textureIndex;
// xy
positions[i+10] = a * w0 + c * h0 + tx | 0;
positions[i+11] = d * h0 + b * w0 + ty | 0;
positions[i++] = a * w1 + c * h0 + tx | 0;
positions[i++] = d * h0 + b * w1 + ty | 0;
positions[i++] = uvs.x3;
positions[i++] = uvs.y3;
colors[i++] = color;
positions[i++] = textureIndex;
} else {
positions[i++] = a * w1 + c * h1 + tx;
positions[i++] = d * h1 + b * w1 + ty;
positions[i++] = uvs.x0;
positions[i++] = uvs.y0;
colors[i++] = color;
positions[i++] = textureIndex;
positions[i++] = a * w0 + c * h1 + tx;
positions[i++] = d * h1 + b * w0 + ty;
positions[i++] = uvs.x1;
positions[i++] = uvs.y1;
colors[i++] = color;
positions[i++] = textureIndex;
positions[i++] = a * w0 + c * h0 + tx;
positions[i++] = d * h0 + b * w0 + ty;
positions[i++] = uvs.x2;
positions[i++] = uvs.y2;
colors[i++] = color;
positions[i++] = textureIndex;
positions[i++] = a * w1 + c * h0 + tx;
positions[i++] = d * h0 + b * w1 + ty;
positions[i++] = uvs.x3;
positions[i++] = uvs.y3;
colors[i++] = color;
positions[i++] = textureIndex;
// xy
positions[i+15] = a * w1 + c * h0 + tx | 0;
positions[i+16] = d * h0 + b * w1 + ty | 0;
}
else
{
// xy
positions[i] = a * w1 + c * h1 + tx;
positions[i+1] = d * h1 + b * w1 + ty;
// xy
positions[i+5] = a * w0 + c * h1 + tx;
positions[i+6] = d * h1 + b * w0 + ty;
// xy
positions[i+10] = a * w0 + c * h0 + tx;
positions[i+11] = d * h0 + b * w0 + ty;
// xy
positions[i+15] = a * w1 + c * h0 + tx;
positions[i+16] = d * h0 + b * w1 + ty;
}
// uv
positions[i+2] = uvs.x0;
positions[i+3] = uvs.y0;
// uv
positions[i+7] = uvs.x1;
positions[i+8] = uvs.y1;
// uv
positions[i+12] = uvs.x2;
positions[i+13] = uvs.y2;
// uv
positions[i+17] = uvs.x3;
positions[i+18] = uvs.y3;
// color and alpha
var tint = sprite.tint;
colors[i+4] = colors[i+9] = colors[i+14] = colors[i+19] = (tint >> 16) + (tint & 0xff00) + ((tint & 0xff) << 16) + (sprite.worldAlpha * 255 << 24);
// increment the batchsize
this.sprites[this.currentBatchSize++] = sprite;
};
/**
* Renders a TilingSprite using the spriteBatch.
*
* @method renderTilingSprite
* @param sprite {TilingSprite} the sprite to render
*/
PIXI.WebGLSpriteBatch.prototype.renderTilingSprite = function (sprite) {
* Renders a TilingSprite using the spriteBatch.
*
* @method renderTilingSprite
* @param sprite {TilingSprite} the sprite to render
*/
PIXI.WebGLSpriteBatch.prototype.renderTilingSprite = function(sprite)
{
var texture = sprite.tilingTexture;
var baseTexture = texture.baseTexture;
var gl = this.gl;
var textureIndex = sprite.texture.baseTexture.textureIndex;
if (this.textureArray[textureIndex] != baseTexture) {
this.flush();
gl.activeTexture(gl.TEXTURE0 + textureIndex);
gl.bindTexture(gl.TEXTURE_2D, baseTexture._glTextures[gl.id]);
this.textureArray[textureIndex] = baseTexture;
}
// check texture..
if (this.currentBatchSize >= this.size) {
if (this.currentBatchSize >= this.size)
{
this.flush();
this.currentBaseTexture = texture.baseTexture;
}
// set the textures uvs temporarily
if (!sprite._uvs) {
if (!sprite._uvs)
{
sprite._uvs = new PIXI.TextureUvs();
}
@ -426,13 +400,13 @@ PIXI.WebGLSpriteBatch.prototype.renderTilingSprite = function (sprite) {
// TODO trim??
var aX = sprite.anchor.x;
var aY = sprite.anchor.y;
var w0 = width * (1 - aX);
var w0 = width * (1-aX);
var w1 = width * -aX;
var h0 = height * (1 - aY);
var h0 = height * (1-aY);
var h1 = height * -aY;
var i = this.currentBatchSize * this.vertexSize; //4 * this.vertSize;
var i = this.currentBatchSize * 4 * this.vertSize;
var resolution = texture.baseTexture.resolution;
@ -444,6 +418,7 @@ PIXI.WebGLSpriteBatch.prototype.renderTilingSprite = function (sprite) {
var d = wt.d / resolution;
var tx = wt.tx;
var ty = wt.ty;
// xy
positions[i++] = a * w1 + c * h1 + tx;
positions[i++] = d * h1 + b * w1 + ty;
@ -452,8 +427,6 @@ PIXI.WebGLSpriteBatch.prototype.renderTilingSprite = function (sprite) {
positions[i++] = uvs.y0;
// color
colors[i++] = color;
// texture index
positions[i++] = textureIndex;
// xy
positions[i++] = (a * w0 + c * h1 + tx);
@ -463,9 +436,7 @@ PIXI.WebGLSpriteBatch.prototype.renderTilingSprite = function (sprite) {
positions[i++] = uvs.y1;
// color
colors[i++] = color;
// texture index
positions[i++] = textureIndex;
// xy
positions[i++] = a * w0 + c * h0 + tx;
positions[i++] = d * h0 + b * w0 + ty;
@ -474,8 +445,6 @@ PIXI.WebGLSpriteBatch.prototype.renderTilingSprite = function (sprite) {
positions[i++] = uvs.y2;
// color
colors[i++] = color;
// texture index
positions[i++] = textureIndex;
// xy
positions[i++] = a * w1 + c * h0 + tx;
@ -485,56 +454,57 @@ PIXI.WebGLSpriteBatch.prototype.renderTilingSprite = function (sprite) {
positions[i++] = uvs.y3;
// color
colors[i++] = color;
// texture index
positions[i++] = textureIndex;
// increment the batchsize
this.sprites[this.currentBatchSize++] = sprite;
};
/**
* Renders the content and empties the current batch.
*
* @method flush
*/
PIXI.WebGLSpriteBatch.prototype.flush = function () {
* Renders the content and empties the current batch.
*
* @method flush
*/
PIXI.WebGLSpriteBatch.prototype.flush = function()
{
// If the batch is length 0 then return as there is nothing to draw
if (this.currentBatchSize === 0) {
if (this.currentBatchSize === 0)
{
return;
}
var gl = this.gl;
var shader;
if (this.dirty) {
if (this.dirty)
{
this.dirty = false;
shader = this.defaultShader.shaders[gl.id];
// bind the main texture
gl.activeTexture(gl.TEXTURE0);
// bind the buffers
gl.bindBuffer(gl.ARRAY_BUFFER, this.vertexBuffer);
gl.bindBuffer(gl.ELEMENT_ARRAY_BUFFER, this.indexBuffer);
shader = this.defaultShader.shaders[gl.id];
// this is the same for each shader?
var stride = this.vertexSize; //this.vertSize * 4;
var stride = this.vertSize * 4;
gl.vertexAttribPointer(shader.aVertexPosition, 2, gl.FLOAT, false, stride, 0);
gl.vertexAttribPointer(shader.aTextureCoord, 2, gl.FLOAT, false, stride, 8);
gl.vertexAttribPointer(shader.aTextureCoord, 2, gl.FLOAT, false, stride, 2 * 4);
// color attributes will be interpreted as unsigned bytes and normalized
gl.vertexAttribPointer(shader.colorAttribute, 4, gl.UNSIGNED_BYTE, true, stride, 16);
// Texture index
gl.vertexAttribPointer(shader.aTextureIndex, 1, gl.FLOAT, false, stride, 20);
gl.vertexAttribPointer(shader.colorAttribute, 4, gl.UNSIGNED_BYTE, true, stride, 4 * 4);
}
// upload the verts to the buffer
if (this.currentBatchSize > (this.size * 0.5)) {
if (this.currentBatchSize > (this.size * 0.5))
{
gl.bufferSubData(gl.ARRAY_BUFFER, 0, this.vertices);
} else {
gl.bindBuffer(gl.ARRAY_BUFFER, this.vertexBuffer);
var view = this.positions.subarray(0, this.currentBatchSize * this.vertexSize);
}
else
{
var view = this.positions.subarray(0, this.currentBatchSize * 4 * this.vertSize);
gl.bufferSubData(gl.ARRAY_BUFFER, 0, view);
}
@ -549,15 +519,17 @@ PIXI.WebGLSpriteBatch.prototype.flush = function () {
var blendSwap = false;
var shaderSwap = false;
var sprite;
var textureIndex = 0;
for (var i = 0, j = this.currentBatchSize; i < j; i++) {
sprite = this.sprites[i];
if (sprite.tilingTexture) {
if (sprite.tilingTexture)
{
nextTexture = sprite.tilingTexture.baseTexture;
} else {
}
else
{
nextTexture = sprite.texture.baseTexture;
}
@ -569,30 +541,33 @@ PIXI.WebGLSpriteBatch.prototype.flush = function () {
var skip = nextTexture.skipRender;
if (skip && sprite.children.length > 0) {
if (skip && sprite.children.length > 0)
{
skip = false;
}
//
if (/*(currentBaseTexture != nextTexture && !skip) ||*/
blendSwap ||
shaderSwap) {
if ((currentBaseTexture !== nextTexture && !skip) || blendSwap || shaderSwap)
{
this.renderBatch(currentBaseTexture, batchSize, start);
start = i;
batchSize = 0;
currentBaseTexture = nextTexture;
if (blendSwap) {
if (blendSwap)
{
currentBlendMode = nextBlendMode;
this.renderSession.blendModeManager.setBlendMode(currentBlendMode);
}
if (shaderSwap) {
if (shaderSwap)
{
currentShader = nextShader;
shader = currentShader.shaders[gl.id];
if (!shader) {
if (!shader)
{
shader = new PIXI.PixiShader(gl);
shader.fragmentSrc = currentShader.fragmentSrc;
@ -605,10 +580,11 @@ PIXI.WebGLSpriteBatch.prototype.flush = function () {
// set shader function???
this.renderSession.shaderManager.setShader(shader);
if (shader.dirty) {
if (shader.dirty)
{
shader.syncUniforms();
}
// both these only need to be set if they are changing..
// set the projection
var projection = this.renderSession.projection;
@ -632,58 +608,73 @@ PIXI.WebGLSpriteBatch.prototype.flush = function () {
};
/**
* @method renderBatch
* @param texture {Texture}
* @param size {Number}
* @param startIndex {Number}
*/
PIXI.WebGLSpriteBatch.prototype.renderBatch = function (texture, size, startIndex) {
if (size === 0) {
* @method renderBatch
* @param texture {Texture}
* @param size {Number}
* @param startIndex {Number}
*/
PIXI.WebGLSpriteBatch.prototype.renderBatch = function(texture, size, startIndex)
{
if (size === 0)
{
return;
}
var gl = this.gl;
// check if a texture is dirty..
if (texture._dirty[gl.id]) {
if (!this.renderSession.renderer.updateTexture(texture)) {
if (texture._dirty[gl.id])
{
if (!this.renderSession.renderer.updateTexture(texture))
{
// If updateTexture returns false then we cannot render it, so bail out now
return;
}
}
else
{
// bind the current texture
gl.bindTexture(gl.TEXTURE_2D, texture._glTextures[gl.id]);
}
// now draw those suckas!
gl.drawElements(gl.TRIANGLES, size * 6, gl.UNSIGNED_SHORT, startIndex * 6 * 2);
// increment the draw count
this.renderSession.drawCount++;
};
/**
* @method stop
*/
PIXI.WebGLSpriteBatch.prototype.stop = function () {
* @method stop
*/
PIXI.WebGLSpriteBatch.prototype.stop = function()
{
this.flush();
this.dirty = true;
};
/**
* @method start
*/
PIXI.WebGLSpriteBatch.prototype.start = function () {
* @method start
*/
PIXI.WebGLSpriteBatch.prototype.start = function()
{
this.dirty = true;
};
/**
* Destroys the SpriteBatch.
*
* @method destroy
*/
PIXI.WebGLSpriteBatch.prototype.destroy = function () {
* Destroys the SpriteBatch.
*
* @method destroy
*/
PIXI.WebGLSpriteBatch.prototype.destroy = function()
{
this.vertices = null;
this.indices = null;
this.gl.deleteBuffer(this.vertexBuffer);
this.gl.deleteBuffer(this.indexBuffer);
this.currentBaseTexture = null;
this.gl = null;
};

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

@ -92,12 +92,6 @@ PIXI.BaseTexture = function(source, scaleMode)
*/
this.mipmap = false;
/**
* @property textureIndex
* @type Number
*/
this.textureIndex = 0;
/**
* @property _dirty
* @type Array

2
src/sound/Sound.js
View file

@ -498,7 +498,7 @@ Phaser.Sound.prototype = {
*/
loopFull: function (volume) {
return this.play(null, 0, volume, true);
return this.play(null, 0, volume, true);
},

1
src/tilemap/Tile.js
View file

@ -80,7 +80,6 @@ Phaser.Tile = function (layer, index, x, y, width, height) {
/**
* @property {number} alpha - The alpha value at which this tile is drawn to the canvas.
* TODO: currently unused for both Canvas and WebGL renderers
*/
this.alpha = 1;

90
src/tilemap/Tilemap.js
View file

@ -103,12 +103,7 @@ Phaser.Tilemap = function (game, key, tileWidth, tileHeight, width, height) {
* @property {array} tilesets - An array of Tilesets.
*/
this.tilesets = data.tilesets;
/**
* @property {array} tilesetLayers - An array of internal layers used to separate multiple tilesets from a single map layer.
*/
this.tilesetLayers = null;
/**
* @property {array} imagecollections - An array of Image Collections.
*/
@ -578,6 +573,10 @@ Phaser.Tilemap.prototype = {
*/
createLayer: function (layer, width, height, group) {
// Add Buffer support for the left of the canvas
if (width === undefined) { width = this.game.width; }
if (height === undefined) { height = this.game.height; }
if (group === undefined) { group = this.game.world; }
var index = layer;
@ -621,38 +620,7 @@ Phaser.Tilemap.prototype = {
console.log('Tileset:', this.tilesets[0].name, 'index:', index);
}
var rootLayer;
if (this.game.renderType === Phaser.WEBGL)
{
rootLayer = group.add(new Phaser.TilemapLayerGL(this.game, this, index, width, height, this.tilesets[0]));
// Create child layers for multiple tilesets in a layer
// It is currently assumed that each base layer will use tileset[0] (so 'i' starts at 1 in the for loop)
// (a 'base' layer is any layer except the so-called 'internal' layers created here)
var fromLayer = this.layers[index];
var childLayer;
for (var i = 1; i < this.tilesets.length; i++)
{
if (this.checkChildLayer(this.tilesets[i], fromLayer))
{
childLayer = group.add(new Phaser.TilemapLayerGL(this.game, this, index, width, height, this.tilesets[i]));
rootLayer.linkedLayers.push(childLayer);
if (this.enableDebug)
{
console.log('Linked child created for tileset:', this.tilesets[i].name);
}
}
}
}
else
{
rootLayer = group.add(new Phaser.TilemapLayer(this.game, this, index, width, height));
}
var rootLayer = group.add(new Phaser.TilemapLayer(this.game, this, index, width, height));
if (this.enableDebug)
{
@ -663,36 +631,6 @@ Phaser.Tilemap.prototype = {
},
/**
* Takes a Tileset and map layer data, then runs through the data looking
* to see if there are any tiles that use the given Tileset. If there is,
* it returns true, otherwise false.
*
* @method Phaser.Tilemap#checkChildLayer
* @private
* @param {Phaser.Tileset} tileset - The Tileset to check against.
* @param {Object} fromLayer - The layer data to check.
* @return {boolean} True if a child layer needs to be created, otherwise false.
*/
checkChildLayer: function (tileset, fromLayer) {
for (var y = 0; y < fromLayer.height; y++)
{
for (var x = 0; x < fromLayer.width; x++)
{
// Get the equivalent tile from this Tilemap
var tile = fromLayer.data[y][x];
if (tile && tile.index >= tileset.firstgid && tile.index <= tileset.lastgid)
{
return true;
}
}
}
return false;
},
/**
* Creates a new and empty layer on this Tilemap. By default TilemapLayers are fixed to the camera.
@ -769,17 +707,7 @@ Phaser.Tilemap.prototype = {
h = this.game.height;
}
var output;
if (this.game.renderType === Phaser.WEBGL)
{
output = new Phaser.TilemapLayerGL(this.game, this, this.layers.length - 1, w, h, null);
}
else
{
output = new Phaser.TilemapLayer(this.game, this, this.layers.length - 1, w, h);
}
var output = new Phaser.TilemapLayer(this.game, this, this.layers.length - 1, w, h);
output.name = name;
return group.add(output);
@ -1108,10 +1036,6 @@ Phaser.Tilemap.prototype = {
{
layer = layer.index;
}
else if (layer instanceof Phaser.TilemapLayerGL)
{
layer = layer.index;
}
return layer;

705
src/tilemap/TilemapLayer.js
View file

@ -35,15 +35,6 @@ Phaser.TilemapLayer = function (game, tilemap, index, width, height) {
*/
this.map = tilemap;
/**
* A custom view.
*
* @property {Phaser.Point} view
*/
this.view = game.camera;
this._camDetatched = false;
/**
* The index of this layer within the Tilemap.
* @property {number} index
@ -168,19 +159,6 @@ Phaser.TilemapLayer = function (game, tilemap, index, width, height) {
*/
this.scrollFactorY = 1;
/**
* When ray-casting against tiles this is the number of steps it will jump. For larger tile sizes you can increase this to improve performance.
* @property {integer} rayStepRate
* @default
*/
this.rayStepRate = 4;
/**
* @property {array} _results - Internal var.
* @private
*/
this._results = [];
/**
* If true tiles will be force rendered, even if such is not believed to be required.
* @property {boolean} dirty
@ -188,6 +166,13 @@ Phaser.TilemapLayer = function (game, tilemap, index, width, height) {
*/
this.dirty = true;
/**
* When ray-casting against tiles this is the number of steps it will jump. For larger tile sizes you can increase this to improve performance.
* @property {integer} rayStepRate
* @default
*/
this.rayStepRate = 4;
/**
* Flag controlling if the layer tiles wrap at the edges.
* @property {boolean} _wrap
@ -236,12 +221,19 @@ Phaser.TilemapLayer = function (game, tilemap, index, width, height) {
*/
this._scrollY = 0;
/**
* Used for caching the tiles / array of tiles.
* @property {Phaser.Tile[]} _results
* @private
*/
this._results = [];
if (!game.device.canvasBitBltShift)
{
this.renderSettings.copyCanvas = Phaser.TilemapLayer.ensureSharedCopyCanvas();
}
// this.fixedToCamera = true;
this.fixedToCamera = true;
};
@ -289,20 +281,6 @@ Phaser.TilemapLayer.prototype.preUpdate = function() {
};
Phaser.TilemapLayer.prototype.addCamera = function () {
this.view = this.game.camera;
this._camDetatched = true;
};
Phaser.TilemapLayer.prototype.removeCamera = function (x, y) {
this.view = new Phaser.Point(x, y);
this._camDetatched = true;
};
/**
* Automatically called by World.postUpdate. Handles cache updates.
*
@ -313,12 +291,12 @@ Phaser.TilemapLayer.prototype.postUpdate = function () {
if (this.fixedToCamera)
{
// this.position.x = (this.game.camera.view.x + this.cameraOffset.x) / this.game.camera.scale.x;
// this.position.y = (this.game.camera.view.y + this.cameraOffset.y) / this.game.camera.scale.y;
this.position.x = (this.game.camera.view.x + this.cameraOffset.x) / this.game.camera.scale.x;
this.position.y = (this.game.camera.view.y + this.cameraOffset.y) / this.game.camera.scale.y;
}
this.scrollX = this.view.x * this.scrollFactorX / this.scale.x;
this.scrollY = this.view.y * this.scrollFactorY / this.scale.y;
this._scrollX = this.game.camera.view.x * this.scrollFactorX / this.scale.x;
this._scrollY = this.game.camera.view.y * this.scrollFactorY / this.scale.y;
};
@ -337,8 +315,8 @@ Phaser.TilemapLayer.prototype._renderCanvas = function (renderSession) {
this.position.y = (this.game.camera.view.y + this.cameraOffset.y) / this.game.camera.scale.y;
}
this.scrollX = this.view.x * this.scrollFactorX / this.scale.x;
this.scrollY = this.view.y * this.scrollFactorY / this.scale.y;
this._scrollX = this.game.camera.view.x * this.scrollFactorX / this.scale.x;
this._scrollY = this.game.camera.view.y * this.scrollFactorY / this.scale.y;
this.render();
@ -346,6 +324,30 @@ Phaser.TilemapLayer.prototype._renderCanvas = function (renderSession) {
};
/**
* Automatically called by the Canvas Renderer.
* Overrides the Sprite._renderWebGL function.
*
* @method Phaser.TilemapLayer#_renderWebGL
* @private
*/
Phaser.TilemapLayer.prototype._renderWebGL = function (renderSession) {
if (this.fixedToCamera)
{
this.position.x = (this.game.camera.view.x + this.cameraOffset.x) / this.game.camera.scale.x;
this.position.y = (this.game.camera.view.y + this.cameraOffset.y) / this.game.camera.scale.y;
}
this._scrollX = this.game.camera.view.x * this.scrollFactorX / this.scale.x;
this._scrollY = this.game.camera.view.y * this.scrollFactorY / this.scale.y;
this.render();
PIXI.Sprite.prototype._renderWebGL.call(this, renderSession);
};
/**
* Destroys this TilemapLayer.
*
@ -388,6 +390,11 @@ Phaser.TilemapLayer.prototype.resize = function (width, height) {
this.texture.baseTexture.width = width;
this.texture.baseTexture.height = height;
this.texture.baseTexture.dirty();
this.texture.requiresUpdate = true;
this.texture._updateUvs();
this.dirty = true;
};
@ -404,6 +411,247 @@ Phaser.TilemapLayer.prototype.resizeWorld = function () {
};
/**
* Take an x coordinate that doesn't account for scrollFactorX and 'fix' it into a scrolled local space.
*
* @method Phaser.TilemapLayer#_fixX
* @private
* @param {number} x - x coordinate in camera space
* @return {number} x coordinate in scrollFactor-adjusted dimensions
*/
Phaser.TilemapLayer.prototype._fixX = function (x) {
if (this.scrollFactorX === 1 || (this.scrollFactorX === 0 && this.position.x === 0))
{
return x;
}
// This executes if the scrollFactorX is 0 and the x position of the tilemap is off from standard.
if (this.scrollFactorX === 0 && this.position.x !== 0)
{
return x - this.position.x;
}
return this._scrollX + (x - (this._scrollX / this.scrollFactorX));
};
/**
* Take an x coordinate that _does_ account for scrollFactorX and 'unfix' it back to camera space.
*
* @method Phaser.TilemapLayer#_unfixX
* @private
* @param {number} x - x coordinate in scrollFactor-adjusted dimensions
* @return {number} x coordinate in camera space
*/
Phaser.TilemapLayer.prototype._unfixX = function (x) {
if (this.scrollFactorX === 1)
{
return x;
}
return (this._scrollX / this.scrollFactorX) + (x - this._scrollX);
};
/**
* Take a y coordinate that doesn't account for scrollFactorY and 'fix' it into a scrolled local space.
*
* @method Phaser.TilemapLayer#_fixY
* @private
* @param {number} y - y coordinate in camera space
* @return {number} y coordinate in scrollFactor-adjusted dimensions
*/
Phaser.TilemapLayer.prototype._fixY = function (y) {
if (this.scrollFactorY === 1 || (this.scrollFactorY === 0 && this.position.y === 0))
{
return y;
}
// This executes if the scrollFactorY is 0 and the y position of the tilemap is off from standard.
if (this.scrollFactorY === 0 && this.position.y !== 0)
{
return y - this.position.y;
}
return this._scrollY + (y - (this._scrollY / this.scrollFactorY));
};
/**
* Take a y coordinate that _does_ account for scrollFactorY and 'unfix' it back to camera space.
*
* @method Phaser.TilemapLayer#_unfixY
* @private
* @param {number} y - y coordinate in scrollFactor-adjusted dimensions
* @return {number} y coordinate in camera space
*/
Phaser.TilemapLayer.prototype._unfixY = function (y) {
if (this.scrollFactorY === 1)
{
return y;
}
return (this._scrollY / this.scrollFactorY) + (y - this._scrollY);
};
/**
* Convert a pixel value to a tile coordinate.
*
* @method Phaser.TilemapLayer#getTileX
* @public
* @param {number} x - X position of the point in target tile (in pixels).
* @return {integer} The X map location of the tile.
*/
Phaser.TilemapLayer.prototype.getTileX = function (x) {
// var tileWidth = this.tileWidth * this.scale.x;
return Math.floor(this._fixX(x) / this._mc.tileWidth);
};
/**
* Convert a pixel value to a tile coordinate.
*
* @method Phaser.TilemapLayer#getTileY
* @public
* @param {number} y - Y position of the point in target tile (in pixels).
* @return {integer} The Y map location of the tile.
*/
Phaser.TilemapLayer.prototype.getTileY = function (y) {
// var tileHeight = this.tileHeight * this.scale.y;
return Math.floor(this._fixY(y) / this._mc.tileHeight);
};
/**
* Convert a pixel coordinate to a tile coordinate.
*
* @method Phaser.TilemapLayer#getTileXY
* @public
* @param {number} x - X position of the point in target tile (in pixels).
* @param {number} y - Y position of the point in target tile (in pixels).
* @param {(Phaser.Point|object)} point - The Point/object to update.
* @return {(Phaser.Point|object)} A Point/object with its `x` and `y` properties set.
*/
Phaser.TilemapLayer.prototype.getTileXY = function (x, y, point) {
point.x = this.getTileX(x);
point.y = this.getTileY(y);
return point;
};
/**
* Gets all tiles that intersect with the given line.
*
* @method Phaser.TilemapLayer#getRayCastTiles
* @public
* @param {Phaser.Line} line - The line used to determine which tiles to return.
* @param {integer} [stepRate=(rayStepRate)] - How many steps through the ray will we check? Defaults to `rayStepRate`.
* @param {boolean} [collides=false] - If true, _only_ return tiles that collide on one or more faces.
* @param {boolean} [interestingFace=false] - If true, _only_ return tiles that have interesting faces.
* @return {Phaser.Tile[]} An array of Phaser.Tiles.
*/
Phaser.TilemapLayer.prototype.getRayCastTiles = function (line, stepRate, collides, interestingFace) {
if (!stepRate) { stepRate = this.rayStepRate; }
if (collides === undefined) { collides = false; }
if (interestingFace === undefined) { interestingFace = false; }
// First get all tiles that touch the bounds of the line
var tiles = this.getTiles(line.x, line.y, line.width, line.height, collides, interestingFace);
if (tiles.length === 0)
{
return [];
}
// Now we only want the tiles that intersect with the points on this line
var coords = line.coordinatesOnLine(stepRate);
var results = [];
for (var i = 0; i < tiles.length; i++)
{
for (var t = 0; t < coords.length; t++)
{
var tile = tiles[i];
var coord = coords[t];
if (tile.containsPoint(coord[0], coord[1]))
{
results.push(tile);
break;
}
}
}
return results;
};
/**
* Get all tiles that exist within the given area, defined by the top-left corner, width and height. Values given are in pixels, not tiles.
*
* @method Phaser.TilemapLayer#getTiles
* @public
* @param {number} x - X position of the top left corner (in pixels).
* @param {number} y - Y position of the top left corner (in pixels).
* @param {number} width - Width of the area to get (in pixels).
* @param {number} height - Height of the area to get (in pixels).
* @param {boolean} [collides=false] - If true, _only_ return tiles that collide on one or more faces.
* @param {boolean} [interestingFace=false] - If true, _only_ return tiles that have interesting faces.
* @return {array<Phaser.Tile>} An array of Tiles.
*/
Phaser.TilemapLayer.prototype.getTiles = function (x, y, width, height, collides, interestingFace) {
// Should we only get tiles that have at least one of their collision flags set? (true = yes, false = no just get them all)
if (collides === undefined) { collides = false; }
if (interestingFace === undefined) { interestingFace = false; }
var fetchAll = !(collides || interestingFace);
// Adjust the x,y coordinates for scrollFactor
x = this._fixX(x);
y = this._fixY(y);
// Convert the pixel values into tile coordinates
var tx = Math.floor(x / (this._mc.cw * this.scale.x));
var ty = Math.floor(y / (this._mc.ch * this.scale.y));
// Don't just use ceil(width/cw) to allow account for x/y diff within cell
var tw = Math.ceil((x + width) / (this._mc.cw * this.scale.x)) - tx;
var th = Math.ceil((y + height) / (this._mc.ch * this.scale.y)) - ty;
while (this._results.length)
{
this._results.pop();
}
for (var wy = ty; wy < ty + th; wy++)
{
for (var wx = tx; wx < tx + tw; wx++)
{
var row = this.layer.data[wy];
if (row && row[wx])
{
if (fetchAll || row[wx].isInteresting(collides, interestingFace))
{
this._results.push(row[wx]);
}
}
}
}
return this._results.slice();
};
/**
* Returns the appropriate tileset for the index, updating the internal cache as required.
* This should only be called if `tilesets[index]` evaluates to undefined.
@ -543,7 +791,6 @@ Phaser.TilemapLayer.prototype.shiftCanvas = function (context, x, y) {
var copyContext = copyCanvas.getContext('2d');
copyContext.clearRect(0, 0, copyW, copyH);
copyContext.drawImage(canvas, dx, dy, copyW, copyH, 0, 0, copyW, copyH);
// clear allows default 'source-over' semantics
context.clearRect(sx, sy, copyW, copyH);
context.drawImage(copyCanvas, 0, 0, copyW, copyH, sx, sy, copyW, copyH);
@ -592,7 +839,6 @@ Phaser.TilemapLayer.prototype.renderRegion = function (scrollX, scrollY, left, t
left = Math.max(0, left);
right = Math.min(width - 1, right);
}
if (top <= bottom)
{
top = Math.max(0, top);
@ -684,7 +930,9 @@ Phaser.TilemapLayer.prototype.renderRegion = function (scrollX, scrollY, left, t
context.fillStyle = this.debugSettings.debuggedTileOverfill;
context.fillRect(tx, ty, tw, th);
}
}
}
};
@ -874,6 +1122,8 @@ Phaser.TilemapLayer.prototype.render = function () {
this.renderDebug();
}
this.texture.baseTexture.dirty();
this.dirty = false;
this.context.restore();
@ -936,7 +1186,6 @@ Phaser.TilemapLayer.prototype.renderDebug = function () {
}
var tile = row[x];
if (!tile || tile.index < 0 || !tile.collides)
{
continue;
@ -980,352 +1229,12 @@ Phaser.TilemapLayer.prototype.renderDebug = function () {
context.stroke();
}
}
}
};
/**
* Take an x coordinate that doesn't account for scrollFactorX and 'fix' it into a scrolled local space.
*
* @method Phaser.TilemapLayer#_fixX
* @private
* @param {number} x - x coordinate in camera space
* @return {number} x coordinate in scrollFactor-adjusted dimensions
*/
Phaser.TilemapLayer.prototype._fixX = function (x) {
if (x < 0)
{
x = 0;
}
if (this.scrollFactorX === 1 && !this._camDetatched)
{
return x;
}
return this._scrollX + (x - (this._scrollX / this.scrollFactorX));
};
/**
* Take an x coordinate that _does_ account for scrollFactorX and 'unfix' it back to camera space.
*
* @method Phaser.TilemapLayer#_unfixX
* @private
* @param {number} x - x coordinate in scrollFactor-adjusted dimensions
* @return {number} x coordinate in camera space
*/
Phaser.TilemapLayer.prototype._unfixX = function (x) {
if (this.scrollFactorX === 1 && !this._camDetatched)
{
return x;
}
return (this._scrollX / this.scrollFactorX) + (x - this._scrollX);
};
/**
* Take a y coordinate that doesn't account for scrollFactorY and 'fix' it into a scrolled local space.
*
* @method Phaser.TilemapLayer#_fixY
* @private
* @param {number} y - y coordinate in camera space
* @return {number} y coordinate in scrollFactor-adjusted dimensions
*/
Phaser.TilemapLayer.prototype._fixY = function (y) {
if (y < 0)
{
y = 0;
}
if (this.scrollFactorY === 1 && !this._camDetatched)
{
return y;
}
return this._scrollY + (y - (this._scrollY / this.scrollFactorY));
};
/**
* Take a y coordinate that _does_ account for scrollFactorY and 'unfix' it back to camera space.
*
* @method Phaser.TilemapLayer#_unfixY
* @private
* @param {number} y - y coordinate in scrollFactor-adjusted dimensions
* @return {number} y coordinate in camera space
*/
Phaser.TilemapLayer.prototype._unfixY = function (y) {
if (this.scrollFactorY === 1 && !this._camDetatched)
{
return y;
}
return (this._scrollY / this.scrollFactorY) + (y - this._scrollY);
};
/**
* Convert a pixel value to a tile coordinate.
*
* @method Phaser.TilemapLayer#getTileX
* @param {number} x - X position of the point in target tile (in pixels).
* @return {integer} The X map location of the tile.
*/
Phaser.TilemapLayer.prototype.getTileX = function (x) {
return Math.floor(this._fixX(x) / this._mc.tileWidth);
};
/**
* Convert a pixel value to a tile coordinate.
*
* @method Phaser.TilemapLayer#getTileY
* @param {number} y - Y position of the point in target tile (in pixels).
* @return {integer} The Y map location of the tile.
*/
Phaser.TilemapLayer.prototype.getTileY = function (y) {
return Math.floor(this._fixY(y) / this._mc.tileHeight);
};
/**
* Convert a pixel coordinate to a tile coordinate.
*
* @method Phaser.TilemapLayer#getTileXY
* @param {number} x - X position of the point in target tile (in pixels).
* @param {number} y - Y position of the point in target tile (in pixels).
* @param {(Phaser.Point|object)} point - The Point/object to update.
* @return {(Phaser.Point|object)} A Point/object with its `x` and `y` properties set.
*/
Phaser.TilemapLayer.prototype.getTileXY = function (x, y, point) {
point.x = this.getTileX(x);
point.y = this.getTileY(y);
return point;
};
/**
* Gets all tiles that intersect with the given line.
*
* @method Phaser.TilemapLayer#getRayCastTiles
* @param {Phaser.Line} line - The line used to determine which tiles to return.
* @param {integer} [stepRate=(rayStepRate)] - How many steps through the ray will we check? Defaults to `rayStepRate`.
* @param {boolean} [collides=false] - If true, _only_ return tiles that collide on one or more faces.
* @param {boolean} [interestingFace=false] - If true, _only_ return tiles that have interesting faces.
* @return {Phaser.Tile[]} An array of Phaser.Tiles.
*/
Phaser.TilemapLayer.prototype.getRayCastTiles = function (line, stepRate, collides, interestingFace) {
if (!stepRate) { stepRate = this.rayStepRate; }
if (collides === undefined) { collides = false; }
if (interestingFace === undefined) { interestingFace = false; }
// First get all tiles that touch the bounds of the line
var tiles = this.getTiles(line.x, line.y, line.width, line.height, collides, interestingFace);
if (tiles.length === 0)
{
return [];
}
// Now we only want the tiles that intersect with the points on this line
var coords = line.coordinatesOnLine(stepRate);
var results = [];
for (var i = 0; i < tiles.length; i++)
{
for (var t = 0; t < coords.length; t++)
{
var tile = tiles[i];
var coord = coords[t];
if (tile.containsPoint(coord[0], coord[1]))
{
results.push(tile);
break;
}
}
}
return results;
};
/**
* Get all tiles that exist within the given area, defined by the top-left corner, width and height. Values given are in pixels, not tiles.
*
* @method Phaser.TilemapLayer#getTiles
* @param {number} x - X position of the top left corner (in pixels).
* @param {number} y - Y position of the top left corner (in pixels).
* @param {number} width - Width of the area to get (in pixels).
* @param {number} height - Height of the area to get (in pixels).
* @param {boolean} [collides=false] - If true, _only_ return tiles that collide on one or more faces.
* @param {boolean} [interestingFace=false] - If true, _only_ return tiles that have interesting faces.
* @return {array<Phaser.Tile>} An array of Tiles.
*/
Phaser.TilemapLayer.prototype.getTiles = function (x, y, width, height, collides, interestingFace) {
// Should we only get tiles that have at least one of their collision flags set? (true = yes, false = no just get them all)
if (collides === undefined) { collides = false; }
if (interestingFace === undefined) { interestingFace = false; }
var fetchAll = !(collides || interestingFace);
// Adjust the x,y coordinates for scrollFactor
x = this._fixX(x);
y = this._fixY(y);
// Convert the pixel values into tile coordinates
var tx = Math.floor(x / (this._mc.cw * this.scale.x));
var ty = Math.floor(y / (this._mc.ch * this.scale.y));
// Don't just use ceil(width/cw) to allow account for x/y diff within cell
var tw = Math.ceil((x + width) / (this._mc.cw * this.scale.x)) - tx;
var th = Math.ceil((y + height) / (this._mc.ch * this.scale.y)) - ty;
this._results.length = 0;
for (var wy = ty; wy < ty + th; wy++)
{
for (var wx = tx; wx < tx + tw; wx++)
{
var row = this.layer.data[wy];
if (row && row[wx] && (fetchAll || row[wx].isInteresting(collides, interestingFace)))
{
this._results.push(row[wx]);
}
}
}
return this._results.slice();
};
/**
* The x position of this Tilemap Layer.
*
* @property {integer} x
* @memberof Phaser.TilemapLayer
* @public
*/
Object.defineProperty(Phaser.TilemapLayer.prototype, "x", {
get: function () {
return this.cameraOffset.x;
},
set: function (value) {
this.cameraOffset.x = value;
}
});
/**
* The y position of this Tilemap Layer.
*
* @property {integer} y
* @memberof Phaser.TilemapLayer
* @public
*/
Object.defineProperty(Phaser.TilemapLayer.prototype, "y", {
get: function () {
return this.cameraOffset.y;
},
set: function (value) {
this.cameraOffset.y = value;
}
});
/**
* The x position of this Tilemap Layer.
*
* @property {integer} x
* @memberof Phaser.TilemapLayer
* @public
*/
Object.defineProperty(Phaser.TilemapLayer.prototype, "offsetX", {
get: function () {
if (this._camDetatched)
{
return this.cameraOffset.x - this.view.x;
}
else
{
return this.cameraOffset.x;
}
}
});
/**
* The y position of this Tilemap Layer.
*
* @property {integer} y
* @memberof Phaser.TilemapLayer
* @public
*/
Object.defineProperty(Phaser.TilemapLayer.prototype, "offsetY", {
get: function () {
if (this._camDetatched)
{
return this.cameraOffset.y - this.view.y;
}
else
{
return this.cameraOffset.y;
}
}
});
Object.defineProperty(Phaser.TilemapLayer.prototype, "bottom", {
get: function () {
return this.cameraOffset.y + this.layer.heightInPixels;
}
});
Object.defineProperty(Phaser.TilemapLayer.prototype, "right", {
get: function () {
return this.cameraOffset.x + this.layer.widthInPixels;
}
});
};
/**
* Flag controlling if the layer tiles wrap at the edges. Only works if the World size matches the Map size.
@ -1338,16 +1247,12 @@ Object.defineProperty(Phaser.TilemapLayer.prototype, "right", {
Object.defineProperty(Phaser.TilemapLayer.prototype, "wrap", {
get: function () {
return this._wrap;
},
set: function (value) {
this._wrap = value;
this.dirty = true;
}
});
@ -1362,15 +1267,11 @@ Object.defineProperty(Phaser.TilemapLayer.prototype, "wrap", {
Object.defineProperty(Phaser.TilemapLayer.prototype, "scrollX", {
get: function () {
return this._scrollX;
},
set: function (value) {
this._scrollX = value;
}
});
@ -1385,15 +1286,11 @@ Object.defineProperty(Phaser.TilemapLayer.prototype, "scrollX", {
Object.defineProperty(Phaser.TilemapLayer.prototype, "scrollY", {
get: function () {
return this._scrollY;
},
set: function (value) {
this._scrollY = value;
}
});
@ -1408,16 +1305,12 @@ Object.defineProperty(Phaser.TilemapLayer.prototype, "scrollY", {
Object.defineProperty(Phaser.TilemapLayer.prototype, "collisionWidth", {
get: function () {
return this._mc.cw;
},
set: function (value) {
this._mc.cw = value | 0;
this.dirty = true;
}
});
@ -1432,16 +1325,12 @@ Object.defineProperty(Phaser.TilemapLayer.prototype, "collisionWidth", {
Object.defineProperty(Phaser.TilemapLayer.prototype, "collisionHeight", {
get: function () {
return this._mc.ch;
},
set: function (value) {
this._mc.ch = value | 0;
this.dirty = true;
}
});

1091
src/tilemap/TilemapLayerGL.js
View file

File diff suppressed because it is too large Load diff

144
src/tilemap/TilemapView.js
View file

@ -1,144 +0,0 @@
/**
* @author Richard Davey <rich@photonstorm.com>
* @copyright 2016 Photon Storm Ltd.
* @license {@link https://github.com/photonstorm/phaser/blob/master/license.txt|MIT License}
*/
/**
*
* @class Phaser.TilemapLayer
* @constructor
* @param {Phaser.Game} game - Game reference to the currently running game.
* @param {Phaser.Tilemap} tilemap - The tilemap to which this layer belongs.
* @param {integer} index - The index of the TileLayer to render within the Tilemap.
* @param {integer} width - Width of the renderable area of the layer (in pixels).
* @param {integer} height - Height of the renderable area of the layer (in pixels).
*/
Phaser.TilemapView = function (game, tilemap, index, width, height) {
/**
* A reference to the Phaser.Game instance.
*
* @property {Phaser.Game} game
*/
this.game = game;
/**
* A custom view.
*
* @property {Phaser.Point} view
*/
this.view = null;
/**
* An Array of any linked layers.
*
* @property {Array} linkedLayers
* @private
*/
this.linkedLayers = [];
/**
* The Tilemap to which this layer is bound.
* @property {Phaser.Tilemap} map
* @protected
* @readonly
*/
this.map = tilemap;
/**
* The index of this layer within the Tilemap.
* @property {number} index
* @protected
* @readonly
*/
this.index = index;
/**
* The layer object within the Tilemap that this layer represents.
* @property {object} layer
* @protected
* @readonly
*/
this.layer = tilemap.layers[index];
/**
* The const type of this object.
* @property {number} type
* @readonly
* @protected
* @default Phaser.TILEMAPLAYER
*/
this.type = Phaser.TILEMAPLAYER;
/**
* @property {number} physicsType - The const physics body type of this object.
* @readonly
*/
this.physicsType = Phaser.TILEMAPLAYER;
/**
* @property {boolean} exists - Controls if the core game loop and physics update this game object or not.
*/
this.exists = true;
/**
* Speed at which this layer scrolls horizontally, relative to the camera (e.g. scrollFactorX of 0.5 scrolls half as quickly as the 'normal' camera-locked layers do).
* @property {number} scrollFactorX
* @public
* @default
*/
this.scrollFactor = new Phaser.Point(1, 1);
/**
* When ray-casting against tiles this is the number of steps it will jump. For larger tile sizes you can increase this to improve performance.
* @property {integer} rayStepRate
* @default
*/
this.rayStepRate = 4;
/**
* If true tiles will be force rendered, even if such is not believed to be required.
* @property {boolean} dirty
* @protected
*/
this.dirty = true;
/**
* @property {array} _results - Internal var.
* @private
*/
this._results = [];
};
Phaser.TilemapView.prototype.constructor = Phaser.TilemapView;
Phaser.TilemapView.prototype = {
preUpdate: function () {
},
postUpdate: function () {
},
render: function () {
},
resize: function () {
},
resizeWorld: function () {
},
destroy: function () {
}
};

86
src/tilemap/Tileset.js
View file

@ -137,7 +137,6 @@ Phaser.Tileset.prototype = {
if (coordIndex >= 0 && (coordIndex + 1) < this.drawCoords.length)
{
// draw the tile on the canvas
context.drawImage(
this.image,
this.drawCoords[coordIndex],
@ -153,91 +152,6 @@ Phaser.Tileset.prototype = {
},
/**
* Draws a tile from this Tileset at the given coordinates using a WebGL renderer.
*
* @method Phaser.Tileset#drawGl
* @public
* @param {Array} glBatch - A list of WebGL batch objects to draw later.
* @param {number} x - The x coordinate to draw to.
* @param {number} y - The y coordinate to draw to.
* @param {integer} index - The index of the tile within the set to draw.
* @param {number} alpha - The alpha value to draw this tile with.
* @param {integer} flippedVal - A bitwise value which indicates how the UV source coordinates should be flipped
*/
drawGl: function (glBatch, x, y, index, alpha, flippedVal) {
// Correct the tile index for the set and bias for interlacing x/y values
var coordIndex = (index - this.firstgid) * 2;
if (coordIndex >= 0 && (coordIndex + 1) < this.drawCoords.length)
{
// apply "half-pixel correction" to avoid edge bleeding as much as possible
var sx = this.drawCoords[coordIndex] + 0.5;
var sy = this.drawCoords[coordIndex + 1] + 0.5;
var sw = this.tileWidth - 1.0;
var sh = this.tileHeight - 1.0;
var fd = 0;
if (flippedVal)
{
if (flippedVal & 1)
{
// flipped diagonally (swap x,y axes)
fd = 1;
}
if (flippedVal & 4)
{
// flipped horizontally
sx += sw;
sw = -sw;
}
if (flippedVal & 2)
{
// flipped vertically
sy += sh;
sh = -sh;
}
}
// add the tile to the WebGL batch
// source and destination coordinates, in pixel units
// destination is the center of the tile
glBatch.push({
sx: sx,
sy: sy,
sw: sw,
sh: sh,
fd: fd,
dx: x + this.tileWidth * 0.5,
dy: y + this.tileHeight * 0.5,
dw: this.tileWidth,
dh: this.tileHeight,
alpha: alpha
});
}
},
/**
* Adds a marker for the WebGl batch display to insert a degenerate triangle (eg. at the end of each row of tiles)
*
* @method Phaser.Tileset#addDegenerate
* @public
* @param {[type]} glBatch [description]
*/
addDegenerate: function (glBatch) {
// don't insert multiple degenerate markers in a row
if (glBatch.length > 0 && glBatch[glBatch.length - 1])
{
glBatch.push(null);
}
},
/**
* Returns true if and only if this tileset contains the given tile index.
*

3
tasks/manifests/tilemaps.json
View file

@ -1,11 +1,8 @@
[
"src/pixi/extras/Tilemap.js",
"src/pixi/renderers/webgl/shaders/TilemapShader.js",
"src/tilemap/ImageCollection.js",
"src/tilemap/Tile.js",
"src/tilemap/Tilemap.js",
"src/tilemap/TilemapLayer.js",
"src/tilemap/TilemapLayerGL.js",
"src/tilemap/TilemapParser.js",
"src/tilemap/Tileset.js"
]