Tidying up the examples and more Tilemap work.

This commit is contained in:
photonstorm
2013-12-10 12:23:42 +00:00
parent af5847e8e4
commit 669570c701
115 changed files with 372 additions and 11768 deletions
+2 -2
View File
@@ -17,8 +17,8 @@
* @param {number} [width=800] - The width of your game in game pixels.
* @param {number} [height=600] - The height of your game in game pixels.
* @param {number} [renderer=Phaser.AUTO] - Which renderer to use: Phaser.AUTO will auto-detect, Phaser.WEBGL, Phaser.CANVAS or Phaser.HEADLESS (no rendering at all).
* @param {HTMLElement} [parent=''] - The Games DOM parent.
* @param {any} [state=null] - Description.
* @param {string|HTMLElement} [parent=''] - The DOM element into which this games canvas will be injected. Either a DOM ID (string) or the element itself.
* @param {object} [state=null] - The default state object. A object consisting of Phaser.State functions (preload, create, update, render) or null.
* @param {boolean} [transparent=false] - Use a transparent canvas background or not.
* @param {boolean} [antialias=true] - Anti-alias graphics.
*/
+2 -2
View File
@@ -10,7 +10,7 @@
* @classdesc A Group is a container for display objects that allows for fast pooling, recycling and collision checks.
* @constructor
* @param {Phaser.Game} game - A reference to the currently running game.
* @param {*} parent - The parent Group or DisplayObjectContainer that will hold this group, if any. If not set, or set to null, it will use game.world.
* @param {*} parent - The parent Group or DisplayObjectContainer that will hold this group, if any. If undefined it will use game.world.
* @param {string} [name=group] - A name for this Group. Not used internally but useful for debugging.
* @param {boolean} [useStage=false] - Should the DisplayObjectContainer this Group creates be added to the World (default, false) or direct to the Stage (true).
*/
@@ -21,7 +21,7 @@ Phaser.Group = function (game, parent, name, useStage) {
*/
this.game = game;
if (typeof parent === 'undefined' || parent === null)
if (typeof parent === 'undefined')
{
parent = game.world;
}
+88
View File
@@ -0,0 +1,88 @@
/**
* @author Richard Davey <rich@photonstorm.com>
* @copyright 2013 Photon Storm Ltd.
* @license {@link https://github.com/photonstorm/phaser/blob/master/license.txt|MIT License}
*/
/**
* Create a new DOMSprite.
* @class Phaser.DOMSprite
* @constructor
* @param {Phaser.Game} game - Current game instance.
* @param {string} id - DOM ID.
* @param {number} x - X position of the new text object.
* @param {number} y - Y position of the new text object.
* @param {string} text - The actual text that will be written.
* @param {object} style - The style object containing style attributes like font, font size ,
*/
Phaser.DOMSprite = function (game, element, x, y, style) {
x = x || 0;
y = y || 0;
style = style || '';
/**
* @property {Phaser.Game} game - A reference to the currently running Game.
*/
this.game = game;
/**
* @property {boolean} exists - If exists = false then the Text isn't updated by the core game loop.
* @default
*/
this.exists = true;
/**
* @property {boolean} alive - This is a handy little var your game can use to determine if an object is alive or not, it doesn't effect rendering.
* @default
*/
this.alive = true;
/**
* @property {Phaser.Group} group - The parent Group of this Text object.
*/
this.group = null;
/**
* @property {string} name - The user defined name given to this object.
* @default
*/
this.name = '';
/**
* @property {number} type - The const type of this object.
* @default
*/
this.type = Phaser.DOMSPRITE;
/**
* @property {boolean} visible - Sets the visible state of this DOMSprite.
* @default
*/
this.visible = true;
/*
if (parent)
{
if (typeof parent === 'string')
{
// hopefully an element ID
target = document.getElementById(parent);
}
else if (typeof parent === 'object' && parent.nodeType === 1)
{
// quick test for a HTMLelement
target = parent;
}
if (overflowHidden)
{
target.style.overflow = 'hidden';
}
}
*/
};
// Phaser.DOMSprite.prototype = Object.create(PIXI.DOMSprite.prototype);
// Phaser.DOMSprite.prototype.constructor = Phaser.DOMSprite;
+1 -1
View File
@@ -5,7 +5,7 @@
*/
/**
* Create a new <code>Text</code>.
* Create a new `Text` object.
* @class Phaser.Text
* @constructor
* @param {Phaser.Game} game - Current game instance.
+40 -19
View File
@@ -415,8 +415,10 @@ Phaser.Cache.prototype = {
{
return this._canvases[key].canvas;
}
return null;
else
{
console.warn('Phaser.Cache.getCanvas: Invalid key: "' + key + '"');
}
},
@@ -433,8 +435,10 @@ Phaser.Cache.prototype = {
{
return this._bitmapDatas[key];
}
return null;
else
{
console.warn('Phaser.Cache.getBitmapData: Invalid key: "' + key + '"');
}
},
@@ -469,8 +473,10 @@ Phaser.Cache.prototype = {
{
return this._images[key].data;
}
return null;
else
{
console.warn('Phaser.Cache.getImage: Invalid key: "' + key + '"');
}
},
@@ -487,8 +493,10 @@ Phaser.Cache.prototype = {
{
return this._tilesets[key].data;
}
return null;
else
{
console.warn('Phaser.Cache.getTilesetImage: Invalid key: "' + key + '"');
}
},
@@ -505,8 +513,10 @@ Phaser.Cache.prototype = {
{
return this._tilesets[key].tileData;
}
return null;
else
{
console.warn('Phaser.Cache.getTileset: Invalid key: "' + key + '"');
}
},
@@ -523,8 +533,11 @@ Phaser.Cache.prototype = {
{
return this._tilemaps[key];
}
else
{
console.warn('Phaser.Cache.getTilemapData: Invalid key: "' + key + '"');
}
return null;
},
/**
@@ -625,8 +638,10 @@ Phaser.Cache.prototype = {
{
return this._textures[key];
}
return null;
else
{
console.warn('Phaser.Cache.getTexture: Invalid key: "' + key + '"');
}
},
@@ -643,8 +658,10 @@ Phaser.Cache.prototype = {
{
return this._sounds[key];
}
return null;
else
{
console.warn('Phaser.Cache.getSound: Invalid key: "' + key + '"');
}
},
@@ -661,8 +678,10 @@ Phaser.Cache.prototype = {
{
return this._sounds[key].data;
}
return null;
else
{
console.warn('Phaser.Cache.getSoundData: Invalid key: "' + key + '"');
}
},
@@ -726,8 +745,10 @@ Phaser.Cache.prototype = {
{
return this._text[key].data;
}
return null;
else
{
console.warn('Phaser.Cache.getText: Invalid key: "' + key + '"');
}
},
+28 -12
View File
@@ -21,7 +21,7 @@ Phaser.Tilemap = function (game, key) {
this.game = game;
/**
* @property {array} layers - An array of Tilemap layers.
* @property {array} layers - An array of Tilemap layer data.
*/
this.layers = null;
@@ -30,7 +30,6 @@ Phaser.Tilemap = function (game, key) {
this.key = key;
this.layers = game.cache.getTilemapData(key).layers;
this.calculateIndexes();
}
else
{
@@ -45,7 +44,6 @@ Phaser.Tilemap = function (game, key) {
/**
* @property {array} debugMap - Map data used for debug values only.
*/
this.debugMap = [];
/**
@@ -117,25 +115,40 @@ Phaser.Tilemap.prototype = {
data: data,
indexes: [],
dirty: true
});
this.currentLayer = this.layers.length - 1;
},
createTilemapLayer: function (x, y, renderWidth, renderHeight, tileset, layer) {
return this.game.world.add(new Phaser.TilemapLayer(this.game, x, y, renderWidth, renderHeight, tileset, this, layer));
},
setCollisionByIndexRange: function (start, stop, layer) {
if (start > stop)
{
return;
}
for (var i = start; i <= stop; i++)
{
this.setCollisionByIndex(i, layer);
}
},
/**
* Sets collision values on a tile in the set.
*
* @method Phaser.Tileset#setCollision
* @param {number} index - The index of the tile within the set.
* @param {boolean} left - Should the tile collide on the left?
* @param {boolean} right - Should the tile collide on the right?
* @param {boolean} up - Should the tile collide on the top?
* @param {boolean} down - Should the tile collide on the bottom?
* @param {number} index - The index of the tile on the layer.
* @param {number} layer - The layer to operate on.
*/
// Sets all tiles matching the given index to collide on the given faces
// Recalculates the collision map
setCollisionByIndex: function (index, layer) {
if (typeof layer === "undefined") { layer = this.currentLayer; }
@@ -157,6 +170,9 @@ Phaser.Tilemap.prototype = {
}
}
// Sets all tiles matching the given index to collide on the given faces
// Recalculates the collision map
// Now re-calculate interesting faces
this.calculateFaces(layer);
@@ -169,7 +185,7 @@ Phaser.Tilemap.prototype = {
var left = null;
var right = null;
console.log(this.layers[layer].width, 'x', this.layers[layer].height);
// console.log(this.layers[layer].width, 'x', this.layers[layer].height);
for (var y = 0; y < this.layers[layer].height ; y++)
{
+30 -29
View File
@@ -16,7 +16,7 @@
* @param {number} renderHeight - Height of the layer.
* @param {Phaser.Tileset|string} tileset - The tile set used for rendering.
* @param {Phaser.Tilemap} tilemap - The tilemap to which this layer belongs.
* @param {number} layer - The layer index within the map.
* @param {number|string} [layer=0] - The layer within the tilemap this TilemapLayer represents.
*/
Phaser.TilemapLayer = function (game, x, y, renderWidth, renderHeight, tileset, tilemap, layer) {
@@ -48,7 +48,7 @@ Phaser.TilemapLayer = function (game, x, y, renderWidth, renderHeight, tileset,
/**
* @property {Phaser.Frame} textureFrame - Dimensions of the renderable area.
*/
this.textureFrame = new Phaser.Frame(0, 0, 0, renderWidth, renderHeight, 'tilemaplayer', game.rnd.uuid());
this.textureFrame = new Phaser.Frame(0, 0, 0, renderWidth, renderHeight, 'tilemapLayer', game.rnd.uuid());
Phaser.Sprite.call(this, this.game, x, y, this.texture, this.textureFrame);
@@ -248,12 +248,12 @@ Phaser.TilemapLayer = function (game, x, y, renderWidth, renderHeight, tileset,
this.tilemap = null;
/**
* @property {number} layer - Tilemap layer index.
* @property {object} layer - The layer object within the Tilemap that this layer represents.
*/
this.layer = null;
/**
* @property {number} index
* @property {number} index - The index of this layer within the Tilemap.
*/
this.index = 0;
@@ -349,13 +349,13 @@ Phaser.TilemapLayer.prototype.updateTileset = function (tileset) {
*/
Phaser.TilemapLayer.prototype.updateMapData = function (tilemap, layer) {
if (typeof layer === 'undefined')
{
layer = 0;
}
if (tilemap instanceof Phaser.Tilemap)
{
if (typeof layer === 'undefined')
{
layer = 0;
}
this.tilemap = tilemap;
this.layer = this.tilemap.layers[layer];
this.tileWidth = this.layer.tileWidth;
@@ -690,7 +690,8 @@ Phaser.TilemapLayer.prototype.render = function () {
this.dirty = true;
}
if (!this.dirty || !this.tileset || !this.tilemap || !this.visible)
// if (!this.dirty || !this.tileset || !this.tilemap || !this.visible)
if (!this.dirty || !this.tilemap || !this.visible)
{
return;
}
@@ -710,10 +711,8 @@ Phaser.TilemapLayer.prototype.render = function () {
this._ty = this._dy;
this.context.clearRect(0, 0, this.canvas.width, this.canvas.height);
// this.context.fillStyle = '#000000';
// this.context.fillRect(0, 0, this.canvas.width, this.canvas.height);
this.context.strokeStyle = '#00ff00';
this.context.fillStyle = 'rgba(0,255,0,0.3)';
this.context.strokeStyle = 'rgba(0,255,0,0.9)';
for (var y = this._startY, lenY = this._startY + this._maxY; y < lenY; y++)
{
@@ -725,25 +724,27 @@ Phaser.TilemapLayer.prototype.render = function () {
// var tile = this.tileset.tiles[this._column[x] - 1];
if (tile)
{
// this.context.drawImage(
// this.tileset.image,
// tile.x,
// tile.y,
// this.tileWidth,
// this.tileHeight,
// Math.floor(this._tx),
// Math.floor(this._ty),
// this.tileWidth,
// this.tileHeight
// );
}
// if (tile && this.tileset)
// {
// this.context.drawImage(
// this.tileset.image,
// tile.x,
// tile.y,
// this.tileWidth,
// this.tileHeight,
// Math.floor(this._tx),
// Math.floor(this._ty),
// this.tileWidth,
// this.tileHeight
// );
// }
if (tile && (tile.faceTop || tile.faceBottom || tile.faceLeft || tile.faceRight))
{
this._tx = Math.floor(this._tx);
this.context.fillRect(this._tx, this._ty, this.tileWidth, this.tileHeight);
this.context.beginPath();
if (tile.faceTop)
@@ -770,9 +771,9 @@ Phaser.TilemapLayer.prototype.render = function () {
this.context.lineTo(this._tx + this.tileWidth, this._ty + this.tileHeight);
}
// this.context.closePath();
this.context.stroke();
// this.context.fillRect(this._tx, this._ty, this.tileWidth, this.tileHeight);
// this.context.strokeRect(this._tx, this._ty, this.tileWidth, this.tileHeight);
}