Merge remote-tracking branch 'origin/master'

This commit is contained in:
Pavle Goloskokovic 2017-11-15 14:38:54 +01:00
commit 11c3b0a057
14 changed files with 153 additions and 214 deletions

View file

@ -1,20 +1,20 @@
var Formats = require('./Formats');
var Parsers = require('./parsers');
var Parse = function (key, mapFormat, mapData, tileWidth, tileHeight, width, height)
var Parse = function (key, mapFormat, mapData, tileWidth, tileHeight, insertNull)
{
var newMap;
switch(mapFormat)
{
case (Formats.TILEMAP_2D_ARRAY):
newMap = Parsers.Parse2DArray(key, mapData, tileWidth, tileHeight, width, height);
newMap = Parsers.Parse2DArray(key, mapData, tileWidth, tileHeight, insertNull);
break;
case (Formats.TILEMAP_CSV):
newMap = Parsers.ParseCSV(key, mapData, tileWidth, tileHeight, width, height);
newMap = Parsers.ParseCSV(key, mapData, tileWidth, tileHeight, insertNull);
break;
case (Formats.TILEMAP_TILED_JSON):
newMap = Parsers.ParseTiledJSON(key, mapData);
newMap = Parsers.ParseTiledJSON(key, mapData, insertNull);
break;
default:
console.warn('Unrecognized tilemap data format: ' + mapFormat);

View file

@ -1,10 +1,15 @@
var Class = require('../../utils/Class');
// Dummy Tile class
// Todo: merge dynamic/tile into this
var Components = require('../components');
var Tile = new Class({
// TODO: Add in bounds mixin, or custom replacement
Mixins: [
Components.Alpha,
Components.Flip,
Components.Visible
],
initialize:
function Tile (layer, index, x, y, width, height)
@ -13,10 +18,14 @@ var Tile = new Class({
this.index = index;
this.x = x;
this.y = y;
this.worldX = x * width;
this.worldY = y * height;
this.width = width;
this.height = height;
}
// TODO: update renders to allow for using Components.Tint
this.tint = 0xFFFFFF;
}
});
module.exports = Tile;

View file

@ -14,7 +14,8 @@ GameObjectCreator.register('tilemap', function (config)
// tileHeight: 32,
// width: 10,
// height: 10,
// data: null (2D array of tile indices)
// data: null (2D array of tile indices),
// insertNull: false
// }
var key = GetFastValue(config, 'key', null);
@ -22,12 +23,13 @@ GameObjectCreator.register('tilemap', function (config)
var tileHeight = GetFastValue(config, 'tileHeight', 32);
var width = GetFastValue(config, 'width', 10);
var height = GetFastValue(config, 'height', 10);
var insertNull = GetFastValue(config, 'insertNull', false);
var data = GetFastValue(config, 'data', null);
var parsedData = null;
if (key === null && Array.isArray(data))
{
parsedData = Parse(key, Formats.TILEMAP_2D_ARRAY, data, tileWidth, tileHeight, width, height);
parsedData = Parse(key, Formats.TILEMAP_2D_ARRAY, data, tileWidth, tileHeight, insertNull);
}
else if (key !== null)
{
@ -39,7 +41,7 @@ GameObjectCreator.register('tilemap', function (config)
}
else
{
parsedData = Parse(key, tilemapData.format, tilemapData.data, tileWidth, tileHeight, width, height);
parsedData = Parse(key, tilemapData.format, tilemapData.data, tileWidth, tileHeight, insertNull);
}
}

View file

@ -21,7 +21,8 @@ GameObjectFactory.register('tilemap', function (config)
// tileHeight: 32,
// width: 10,
// height: 10,
// data: null (2D array of tile indices)
// data: null (2D array of tile indices),
// insertNull: false
// }
var key = GetFastValue(config, 'key', null);
@ -29,12 +30,13 @@ GameObjectFactory.register('tilemap', function (config)
var tileHeight = GetFastValue(config, 'tileHeight', 32);
var width = GetFastValue(config, 'width', 10);
var height = GetFastValue(config, 'height', 10);
var insertNull = GetFastValue(config, 'insertNull', false);
var data = GetFastValue(config, 'data', null);
var parsedData = null;
if (key === null && Array.isArray(data))
{
parsedData = Parse(key, Formats.TILEMAP_2D_ARRAY, data, tileWidth, tileHeight, width, height);
parsedData = Parse(key, Formats.TILEMAP_2D_ARRAY, data, tileWidth, tileHeight, insertNull);
}
else if (key !== null)
{
@ -46,7 +48,7 @@ GameObjectFactory.register('tilemap', function (config)
}
else
{
parsedData = Parse(key, tilemapData.format, tilemapData.data, tileWidth, tileHeight, width, height);
parsedData = Parse(key, tilemapData.format, tilemapData.data, tileWidth, tileHeight, insertNull);
}
}

View file

@ -2,7 +2,6 @@ var Class = require('../../../utils/Class');
var GameObject = require('../../GameObject');
var Components = require('../../components');
var DynamicTilemapLayerRender = require('./DynamicTilemapLayerRender');
var Tile = require('./Tile');
var DynamicTilemapLayer = new Class({
@ -35,7 +34,6 @@ var DynamicTilemapLayer = new Class({
this.layer = tilemap.layers[layerIndex];
this.tileset = tileset;
this.tileArray = [];
this.culledTiles = [];
this.setTexture(tileset.image.key);
@ -45,8 +43,6 @@ var DynamicTilemapLayer = new Class({
this.setSize(this.map.tileWidth * this.layer.width, this.map.tileheight * this.layer.height);
this.skipIndexZero = false;
this.buildTilemap();
},
getTotalTileCount: function ()
@ -59,53 +55,12 @@ var DynamicTilemapLayer = new Class({
return this.cull(camera).length;
},
buildTilemap: function ()
{
var tileArray = this.tileArray;
var mapData = this.layer.data;
var tileWidth = this.map.tileWidth;
var tileHeight = this.map.tileHeight;
var tileset = this.tileset;
var width = this.texture.source[0].width;
var height = this.texture.source[0].height;
var mapWidth = this.layer.width;
var mapHeight = this.layer.height;
tileArray.length = 0;
for (var row = 0; row < mapHeight; ++row)
{
for (var col = 0; col < mapWidth; ++col)
{
var tileIndex = mapData[row][col].index;
if (tileIndex <= 0 && this.skipIndexZero) { continue; }
var texCoords = tileset.getTileTextureCoordinates(tileIndex);
if (texCoords === null) { continue; }
tileArray.push(new Tile({
index: tileIndex,
id: tileIndex,
x: col * tileWidth,
y: row * tileHeight,
width: tileWidth,
height: tileHeight,
frameX: texCoords.x,
frameY: texCoords.y,
frameWidth: tileWidth,
frameHeight: tileHeight,
textureWidth: width,
textureHeight: height
}));
}
}
},
cull: function (camera)
{
var mapData = this.layer.data;
var mapWidth = this.layer.width;
var mapHeight = this.layer.height;
var culledTiles = this.culledTiles;
var tiles = this.tileArray;
var length = tiles.length;
var scrollX = camera.scrollX * this.scrollFactorX;
var scrollY = camera.scrollY * this.scrollFactorY;
var cameraW = camera.width;
@ -113,31 +68,37 @@ var DynamicTilemapLayer = new Class({
culledTiles.length = 0;
for (var index = 0; index < length; ++index)
for (var row = 0; row < mapHeight; ++row)
{
var tile = tiles[index];
var tileX = tile.x - scrollX;
var tileY = tile.y - scrollY;
var tileW = tile.width;
var tileH = tile.height;
var cullW = cameraW + tileW;
var cullH = cameraH + tileH;
if (tile.visible &&
tileX > -tileW && tileY > -tileH &&
tileX < cullW && tileY < cullH)
for (var col = 0; col < mapWidth; ++col)
{
culledTiles.push(tile);
var tile = mapData[row][col];
if (tile === null || (tile.index <= 0 && this.skipIndexZero)) { continue; }
var tileX = tile.worldX - scrollX;
var tileY = tile.worldY - scrollY;
var tileW = tile.width;
var tileH = tile.height;
var cullW = cameraW + tileW;
var cullH = cameraH + tileH;
if (tile.visible &&
tileX > -tileW && tileY > -tileH &&
tileX < cullW && tileY < cullH)
{
culledTiles.push(tile);
}
}
}
return culledTiles;
},
}
forEach: function (callback)
{
this.tileArray.forEach(callback);
},
// forEach: function (callback)
// {
// this.tileArray.forEach(callback);
// },
// Returns Object containing:
// {
@ -157,32 +118,32 @@ var DynamicTilemapLayer = new Class({
// y
// }
getTileAt: function (x, y)
{
var ix = (x|0);
var iy = (y|0);
var tiles = this.tileArray;
var index = iy * this.mapWidth + ix;
// getTileAt: function (x, y)
// {
// var ix = (x|0);
// var iy = (y|0);
// var tiles = this.tileArray;
// var index = iy * this.mapWidth + ix;
if (index < tiles.length)
{
return tiles[index];
}
// if (index < tiles.length)
// {
// return tiles[index];
// }
return null;
},
// return null;
// },
getTileAtIndex: function (index)
{
var tiles = this.tileArray;
// getTileAtIndex: function (index)
// {
// var tiles = this.tileArray;
if (index < tiles.length)
{
return tiles[index];
}
// if (index < tiles.length)
// {
// return tiles[index];
// }
return null;
}
// return null;
// }
});

View file

@ -9,13 +9,10 @@ var DynamicTilemapLayerCanvasRenderer = function (renderer, gameObject, interpol
gameObject.cull(camera);
var tiles = gameObject.culledTiles;
var tileCount = tiles.length;
var renderTiles = gameObject.culledTiles;
var length = renderTiles.length;
var image = gameObject.frame.source.image;
// var scrollFactorX = gameObject.scrollFactorX;
// var scrollFactorY = gameObject.scrollFactorY;
// var alpha = gameObject.alpha;
var tileset = this.tileset;
var tx = gameObject.x - camera.scrollX * gameObject.scrollFactorX;
var ty = gameObject.y - camera.scrollY * gameObject.scrollFactorY;
@ -27,22 +24,35 @@ var DynamicTilemapLayerCanvasRenderer = function (renderer, gameObject, interpol
ctx.scale(gameObject.scaleX, gameObject.scaleY);
ctx.scale(gameObject.flipX ? -1 : 1, gameObject.flipY ? -1 : 1);
for (var index = 0; index < tileCount; ++index)
for (var index = 0; index < length; ++index)
{
var tile = tiles[index];
var tile = renderTiles[index];
if (tile.id <= 0 && gameObject.skipIndexZero)
var tileTexCoords = tileset.getTileTextureCoordinates(tile.index);
if (tileTexCoords === null) { continue; }
var halfWidth = tile.width / 2;
var halfHeight = tile.height / 2;
ctx.save();
ctx.translate(tile.worldX - halfWidth, tile.worldY - halfHeight);
if (tile.flipX || tile.flipY)
{
continue;
ctx.scale(tile.flipX ? -1 : 1, tile.flipY ? -1 : 1);
}
renderer.setAlpha(gameObject.alpha * tile.alpha);
ctx.drawImage(
image,
tile.frameX, tile.frameY,
tile.frameWidth, tile.frameHeight,
tile.x, tile.y,
tile.frameWidth, tile.frameHeight
tileTexCoords.x, tileTexCoords.y,
tile.width, tile.height,
-halfWidth, -halfHeight,
tile.width, tile.height
);
ctx.restore();
}
ctx.restore();

View file

@ -15,6 +15,7 @@ var DynamicTilemapLayerWebGLRenderer = function (renderer, gameObject, interpola
var texture = gameObject.texture.source[0].glTexture;
var textureWidth = texture.width;
var textureHeight = texture.height;
var tileset = this.tileset;
var renderTarget = gameObject.renderTarget;
var scrollFactorX = gameObject.scrollFactorX;
var scrollFactorY = gameObject.scrollFactorY;
@ -26,17 +27,20 @@ var DynamicTilemapLayerWebGLRenderer = function (renderer, gameObject, interpola
{
var tile = renderTiles[index];
if (tile.id <= 0 && gameObject.skipIndexZero)
{
continue;
}
var tileTexCoords = tileset.getTileTextureCoordinates(tile.index);
if (tileTexCoords === null) { continue; }
var frameWidth = tile.width * (tile.flipX ? -1 : 1);
var frameHeight = tile.height * (tile.flipY ? -1 : 1);
var frameX = tileTexCoords.x + (tile.flipX ? tile.width : 0);
var frameY = tileTexCoords.y + (tile.flipY ? tile.height : 0);
batch.addTileTextureRect(
texture,
x + tile.x, y + tile.y, tile.width, tile.height, alpha * tile.alpha, tile.tint,
x + tile.worldX, y + tile.worldY, tile.width, tile.height, alpha * tile.alpha, tile.tint,
scrollFactorX, scrollFactorY,
textureWidth, textureHeight,
tile.frameX, tile.frameY, tile.frameWidth, tile.frameHeight,
frameX, frameY, frameWidth, frameHeight,
camera,
renderTarget
);

View file

@ -1,55 +0,0 @@
function Tile (properties)
{
this.index = properties.index;
this.id = properties.id;
this.x = properties.x;
this.y = properties.y;
this.width = properties.width;
this.height = properties.height;
this.frameX = properties.frameX;
this.frameY = properties.frameY;
this.frameWidth = properties.frameWidth;
this.frameHeight = properties.frameHeight;
this.alpha = 1.0;
this.tint = 0xFFFFFF;
this.visible = true;
this.textureWidth = properties.textureWidth;
this.textureHeight = properties.textureHeight;
this.border = properties.border;
this.center = properties.center;
}
Tile.prototype.setId = function (id)
{
var tileId = this.id = id;
var tileWidth = this.width;
var tileHeight = this.height;
var setWidth = this.textureWidth / tileWidth;
var tileWidthBorder = (tileWidth + this.border * 2);
var tileHeightBorder = (tileHeight + this.border * 2);
var halfTileWidth = tileWidthBorder * 0.5;
var halfTileHeight = tileHeightBorder * 0.5;
if (!this.center)
{
halfTileWidth = 0;
halfTileHeight = 0;
}
var rectx = (((tileId % setWidth)|0) * tileWidthBorder) + halfTileWidth;
var recty = (((tileId / setWidth)|0) * tileHeightBorder) + halfTileHeight;
this.frameX = rectx;
this.frameY = recty;
};
module.exports = Tile;

View file

@ -2,7 +2,7 @@ var GenerateEmptyMapData = require('../GenerateEmptyMapData');
var Formats = require('../Formats');
var Tile = require('../Tile');
var Parse2DArray = function (key, data, tileWidth, tileHeight)
var Parse2DArray = function (key, data, tileWidth, tileHeight, insertNull)
{
var map = GenerateEmptyMapData(Formats.TILEMAP_2D_ARRAY, key, tileWidth, tileHeight);
@ -18,9 +18,17 @@ var Parse2DArray = function (key, data, tileWidth, tileHeight)
for (var x = 0; x < row.length; x++)
{
var tileIndex = parseInt(row[x], 10);
if (Number.isNaN(tileIndex)) { tileIndex = -1; }
output[y][x] = new Tile(map.layers[0], tileIndex, x, y, tileWidth, tileHeight);
if (Number.isNaN(tileIndex))
{
output[y][x] = insertNull
? null
: new Tile(map.layers[0], -1, x, y, tileWidth, tileHeight);
}
else
{
output[y][x] = new Tile(map.layers[0], tileIndex, x, y, tileWidth, tileHeight);
}
}
if (width === 0)

View file

@ -1,14 +1,14 @@
var Formats = require('../Formats');
var Parse2DArray = require('./Parse2DArray');
var ParseCSV = function (key, data, tileWidth, tileHeight)
var ParseCSV = function (key, data, tileWidth, tileHeight, insertNull)
{
var array2D = data
.trim()
.split('\n')
.map(function (row) { return row.split(','); });
var map = Parse2DArray(key, array2D, tileWidth, tileHeight);
var map = Parse2DArray(key, array2D, tileWidth, tileHeight, insertNull);
map.format = Formats.TILEMAP_CSV;
return map;

View file

@ -3,7 +3,7 @@ var Tileset = require('../Tileset');
var Tile = require('../Tile');
var Extend = require('../../../utils/object/Extend');
var ParseJSONTiled = function (key, json)
var ParseJSONTiled = function (key, json, insertNull)
{
if (json.orientation !== 'orthogonal')
{
@ -188,17 +188,10 @@ var ParseJSONTiled = function (key, json)
}
else
{
row.push(new Tile(layer, -1, x, output.length, json.tilewidth, json.tileheight));
// TODO: enable insert null functionality
// if (Phaser.TilemapParser.INSERT_NULL)
// {
// row.push(null);
// }
// else
// {
// row.push(new Phaser.Tile(layer, -1, x, output.length, json.tilewidth, json.tileheight));
// }
var blankTile = insertNull
? null
: new Tile(layer, -1, x, output.length, json.tilewidth, json.tileheight);
row.push(blankTile);
}
x++;

View file

@ -1,7 +1,7 @@
var Class = require('../../../utils/Class');
var GameObject = require('../../GameObject');
var Components = require('../../components');
var CONST = require('../../../renderer/webgl/renderers/tilemaprenderer/const');
var GameObject = require('../../GameObject');
var StaticTilemapLayerRender = require('./StaticTilemapLayerRender');
var StaticTilemapLayer = new Class({
@ -45,6 +45,7 @@ var StaticTilemapLayer = new Class({
this.vertexCount = 0;
this.cullStart = 0;
this.cullEnd = 0;
this.canvasTiles = [];
this.setTexture(tileset.image.key);
this.setPosition(x, y);
@ -80,6 +81,7 @@ var StaticTilemapLayer = new Class({
var height = this.texture.source[0].height;
var mapData = this.layer.data;
var tile;
var row;
var col;
var tileIndex;
@ -116,15 +118,15 @@ var StaticTilemapLayer = new Class({
{
for (col = 0; col < mapWidth; ++col)
{
tileIndex = mapData[row][col].index;
if (tileIndex <= 0 && this.skipIndexZero) { continue; }
tile = mapData[row][col];
if (tile === null || (tile.index <= 0 && this.skipIndexZero)) { continue; }
var tx = col * tileWidth;
var ty = row * tileHeight;
var txw = tx + tileWidth;
var tyh = ty + tileHeight;
texCoords = tileset.getTileTextureCoordinates(tileIndex);
texCoords = tileset.getTileTextureCoordinates(tile.index);
if (texCoords === null) { continue; }
// Inset UV coordinates by 0.5px to prevent tile bleeding
@ -202,25 +204,16 @@ var StaticTilemapLayer = new Class({
}
else if (this.dirty && !this.gl)
{
this.tiles = [];
this.canvasTiles.length = 0;
for (row = 0; row < mapHeight; ++row)
{
for (col = 0; col < mapWidth; ++col)
{
tileIndex = mapData[row][col].index;
if (tileIndex <= 0 && this.skipIndexZero) { continue; }
texCoords = tileset.getTileTextureCoordinates(tileIndex);
if (texCoords === null) { continue; }
this.tiles.push({
x: col * tileWidth,
y: row * tileHeight,
frameX: texCoords.x,
frameY: texCoords.y
});
tile = mapData[row][col];
if (tile === null || (tile.index <= 0 && this.skipIndexZero)) { continue; }
this.canvasTiles.push(tile);
}
}

View file

@ -9,9 +9,10 @@ var StaticTilemapLayerCanvasRenderer = function (renderer, gameObject, interpola
gameObject.upload(camera);
var tiles = gameObject.tiles;
var tiles = gameObject.canvasTiles;
var tileWidth = gameObject.map.tileWidth;
var tileHeight = gameObject.map.tileHeight;
var tileset = this.tileset;
var frame = gameObject.frame;
var ctx = renderer.gameContext;
var tileCount = tiles.length;
@ -29,7 +30,18 @@ var StaticTilemapLayerCanvasRenderer = function (renderer, gameObject, interpola
{
var tile = tiles[index];
ctx.drawImage(image, tile.frameX, tile.frameY, tileWidth, tileHeight, tile.x, tile.y, tileWidth, tileHeight);
var tileTexCoords = tileset.getTileTextureCoordinates(tile.index);
if (tileTexCoords === null) { continue; }
renderer.setAlpha(gameObject.alpha * tile.alpha);
ctx.drawImage(
image,
tileTexCoords.x, tileTexCoords.y,
tile.width, tile.height,
tile.worldX, tile.worldY,
tile.width, tile.height
);
}
ctx.restore();

View file

@ -385,8 +385,8 @@ var SpriteBatch = new Class({
// Inset UV coordinates by 0.5px to prevent tile bleeding
var u0 = (rectX + 0.5) / textureWidth;
var v0 = (rectY + 0.5) / textureHeight;
var u1 = (rectX - 0.5 + width) / textureWidth;
var v1 = (rectY - 0.5 + height) / textureHeight;
var u1 = (rectX - 0.5 + rectW) / textureWidth;
var v1 = (rectY - 0.5 + rectH) / textureHeight;
mva = cameraMatrix[0];
mvb = cameraMatrix[1];