Merge pull request #851 from jotson/dev

Render tilemap when camera outside of world bounds, layer wrapping
This commit is contained in:
Richard Davey 2014-06-11 00:05:23 +01:00
commit fddd1e9f7a

View file

@ -185,6 +185,12 @@ Phaser.TilemapLayer = function (game, tilemap, index, width, height) {
}; };
/**
* @property {boolean} wrap - Flag controlling whether the layer tiles wrap at the edges
* @default false
*/
this.wrap = false;
/** /**
* @property {array} _results - Local render loop var to help avoid gc spikes. * @property {array} _results - Local render loop var to help avoid gc spikes.
* @private * @private
@ -496,19 +502,6 @@ Phaser.TilemapLayer.prototype.updateMax = function () {
this._mc.maxX = this.game.math.ceil(this.canvas.width / this.map.tileWidth) + 1; this._mc.maxX = this.game.math.ceil(this.canvas.width / this.map.tileWidth) + 1;
this._mc.maxY = this.game.math.ceil(this.canvas.height / this.map.tileHeight) + 1; this._mc.maxY = this.game.math.ceil(this.canvas.height / this.map.tileHeight) + 1;
if (this.layer)
{
if (this._mc.maxX > this.layer.width)
{
this._mc.maxX = this.layer.width;
}
if (this._mc.maxY > this.layer.height)
{
this._mc.maxY = this.layer.height;
}
}
this.dirty = true; this.dirty = true;
}; };
@ -553,15 +546,41 @@ Phaser.TilemapLayer.prototype.render = function () {
for (var y = this._mc.startY, lenY = this._mc.startY + this._mc.maxY; y < lenY; y++) for (var y = this._mc.startY, lenY = this._mc.startY + this._mc.maxY; y < lenY; y++)
{ {
this._column = this.layer.data[y]; this._column = null;
for (var x = this._mc.startX, lenX = this._mc.startX + this._mc.maxX; x < lenX; x++) if (y < 0 && this.wrap)
{ {
if (this._column[x]) this._column = this.layer.data[y + this.map.height];
{ }
tile = this._column[x]; else if (y >= this.map.height && this.wrap)
{
this._column = this.layer.data[y - this.map.height];
}
else if (this.layer.data[y])
{
this._column = this.layer.data[y];
}
if (tile.index > -1) if (this._column)
{
for (var x = this._mc.startX, lenX = this._mc.startX + this._mc.maxX; x < lenX; x++)
{
var tile = null;
if (x < 0 && this.wrap)
{
tile = this._column[x + this.map.width];
}
else if (x >= this.map.width && this.wrap)
{
tile = this._column[x - this.map.width];
}
else if (this._column[x])
{
tile = this._column[x];
}
if (tile && tile.index > -1)
{ {
set = this.map.tilesets[this.map.tiles[tile.index][2]]; set = this.map.tilesets[this.map.tiles[tile.index][2]];
@ -578,9 +597,10 @@ Phaser.TilemapLayer.prototype.render = function () {
this.context.fillRect(Math.floor(this._mc.tx), Math.floor(this._mc.ty), this.map.tileWidth, this.map.tileHeight); this.context.fillRect(Math.floor(this._mc.tx), Math.floor(this._mc.ty), this.map.tileWidth, this.map.tileHeight);
} }
} }
}
this._mc.tx += this.map.tileWidth; this._mc.tx += this.map.tileWidth;
}
} }
@ -623,52 +643,81 @@ Phaser.TilemapLayer.prototype.renderDebug = function () {
for (var y = this._mc.startY, lenY = this._mc.startY + this._mc.maxY; y < lenY; y++) for (var y = this._mc.startY, lenY = this._mc.startY + this._mc.maxY; y < lenY; y++)
{ {
this._column = this.layer.data[y]; this._column = null;
for (var x = this._mc.startX, lenX = this._mc.startX + this._mc.maxX; x < lenX; x++) if (y < 0 && this.wrap)
{ {
var tile = this._column[x]; this._column = this.layer.data[y + this.map.height];
}
else if (y >= this.map.height && this.wrap)
{
this._column = this.layer.data[y - this.map.height];
}
else if (this.layer.data[y])
{
this._column = this.layer.data[y];
}
if (tile && (tile.faceTop || tile.faceBottom || tile.faceLeft || tile.faceRight)) if (this._column)
{
for (var x = this._mc.startX, lenX = this._mc.startX + this._mc.maxX; x < lenX; x++)
{ {
this._mc.tx = Math.floor(this._mc.tx); var tile = null;
if (this.debugFill) if (x < 0 && this.wrap)
{ {
this.context.fillRect(this._mc.tx, this._mc.ty, this._mc.cw, this._mc.ch); tile = this._column[x + this.map.width];
}
else if (x >= this.map.width && this.wrap)
{
tile = this._column[x - this.map.width];
}
else if (this._column[x])
{
tile = this._column[x];
} }
this.context.beginPath(); if (tile && (tile.faceTop || tile.faceBottom || tile.faceLeft || tile.faceRight))
if (tile.faceTop)
{ {
this.context.moveTo(this._mc.tx, this._mc.ty); this._mc.tx = Math.floor(this._mc.tx);
this.context.lineTo(this._mc.tx + this._mc.cw, this._mc.ty);
if (this.debugFill)
{
this.context.fillRect(this._mc.tx, this._mc.ty, this._mc.cw, this._mc.ch);
}
this.context.beginPath();
if (tile.faceTop)
{
this.context.moveTo(this._mc.tx, this._mc.ty);
this.context.lineTo(this._mc.tx + this._mc.cw, this._mc.ty);
}
if (tile.faceBottom)
{
this.context.moveTo(this._mc.tx, this._mc.ty + this._mc.ch);
this.context.lineTo(this._mc.tx + this._mc.cw, this._mc.ty + this._mc.ch);
}
if (tile.faceLeft)
{
this.context.moveTo(this._mc.tx, this._mc.ty);
this.context.lineTo(this._mc.tx, this._mc.ty + this._mc.ch);
}
if (tile.faceRight)
{
this.context.moveTo(this._mc.tx + this._mc.cw, this._mc.ty);
this.context.lineTo(this._mc.tx + this._mc.cw, this._mc.ty + this._mc.ch);
}
this.context.stroke();
} }
if (tile.faceBottom) this._mc.tx += this.map.tileWidth;
{
this.context.moveTo(this._mc.tx, this._mc.ty + this._mc.ch);
this.context.lineTo(this._mc.tx + this._mc.cw, this._mc.ty + this._mc.ch);
}
if (tile.faceLeft)
{
this.context.moveTo(this._mc.tx, this._mc.ty);
this.context.lineTo(this._mc.tx, this._mc.ty + this._mc.ch);
}
if (tile.faceRight)
{
this.context.moveTo(this._mc.tx + this._mc.cw, this._mc.ty);
this.context.lineTo(this._mc.tx + this._mc.cw, this._mc.ty + this._mc.ch);
}
this.context.stroke();
} }
this._mc.tx += this.map.tileWidth;
} }
this._mc.tx = this._mc.dx; this._mc.tx = this._mc.dx;
@ -690,27 +739,10 @@ Object.defineProperty(Phaser.TilemapLayer.prototype, "scrollX", {
set: function (value) { set: function (value) {
if (value !== this._mc.x && value >= 0 && this.layer.widthInPixels > this.width) if (value !== this._mc.x)
{ {
this._mc.x = value; this._mc.x = value;
if (this._mc.x > (this.layer.widthInPixels - this.width))
{
this._mc.x = this.layer.widthInPixels - this.width;
}
this._mc.startX = this.game.math.floor(this._mc.x / this.map.tileWidth); this._mc.startX = this.game.math.floor(this._mc.x / this.map.tileWidth);
if (this._mc.startX < 0)
{
this._mc.startX = 0;
}
if (this._mc.startX + this._mc.maxX > this.layer.width)
{
this._mc.startX = this.layer.width - this._mc.maxX;
}
this.dirty = true; this.dirty = true;
} }
@ -730,27 +762,10 @@ Object.defineProperty(Phaser.TilemapLayer.prototype, "scrollY", {
set: function (value) { set: function (value) {
if (value !== this._mc.y && value >= 0 && this.layer.heightInPixels > this.height) if (value !== this._mc.y)
{ {
this._mc.y = value; this._mc.y = value;
if (this._mc.y > (this.layer.heightInPixels - this.height))
{
this._mc.y = this.layer.heightInPixels - this.height;
}
this._mc.startY = this.game.math.floor(this._mc.y / this.map.tileHeight); this._mc.startY = this.game.math.floor(this._mc.y / this.map.tileHeight);
if (this._mc.startY < 0)
{
this._mc.startY = 0;
}
if (this._mc.startY + this._mc.maxY > this.layer.height)
{
this._mc.startY = this.layer.height - this._mc.maxY;
}
this.dirty = true; this.dirty = true;
} }