changed orientation localisation to layer, will make easier the fixing of pixelwidth and height and makes more sense overall

This commit is contained in:
Svipal 2020-01-29 20:27:40 +01:00
parent d6489d1146
commit 95df0be94a
8 changed files with 98 additions and 126 deletions

View file

@ -12213,7 +12213,6 @@ var Rectangle = __webpack_require__(441);
* @param {integer} baseHeight - The base height of the tile in pixels (in pixels). Tiled maps
* support multiple tileset sizes within one map, but they are still placed at intervals of the
* base tile height.
* @param {string} orientation - The Tilemap's orientation
*/
var Tile = new Class({
@ -12226,7 +12225,7 @@ var Tile = new Class({
initialize:
function Tile (layer, index, x, y, width, height, orientation, baseWidth, baseHeight )
function Tile (layer, index, x, y, width, height, baseWidth, baseHeight )
{
console.log(this)
/**
@ -12455,21 +12454,7 @@ var Tile = new Class({
* @since 3.0.0
*/
this.physics = {};
/**
* The tile's orientation, necessary to be able to determine pixelX and pixelY.
*
* @name Phaser.Tilemaps.Tile#orientation
* @type {string}
* @since 3.2.PR_svipal
*/
// we default to orthogonal
// we need to deep copy the string to prevent the orientation later going out of scope
if (orientation == undefined) {
this.orientation = "orthogonal";
} else {
this.orientation = (' ' + orientation).slice(1)
}
console.log("tile orientation : "+this.orientation)
},
/**
@ -12902,23 +12887,23 @@ var Tile = new Class({
*/
updatePixelXY: function ()
{
console.log("tile orientation 2: "+this.orientation)
if (this.orientation === "orthogonal") {
if (this.layer.orientation === "orthogonal") {
// In orthogonal mode, Tiled places tiles on a grid of baseWidth x baseHeight. The origin for a tile is the
// bottom left, while the Phaser renderer assumes the origin is the top left. The y
// coordinate needs to be adjusted by the difference.
this.pixelX = this.x * this.baseWidth;
this.pixelY = this.y * this.baseHeight;
console.log("orthopix "+this.pixelX+","+this.pixelY)
} else if (this.orientation === "isometric" ||true) {
// for the image to be centered we have to move the image to the right.
this.pixelX = this.layer.widthInPixels/2 + (this.x - this.y) * this.baseWidth *0.5;
} else if (this.layer.orientation === "isometric" ) {
// for the image to be centered we have to move the image to the right with the camera !
// this is crucial for wordtotile, tiletoworld to work.
this.pixelX = (this.x - this.y) * this.baseWidth *0.5;
this.pixelY = (this.x + this.y) * this.baseHeight *0.5;
console.log("isopix "+this.pixelX+","+this.pixelY)
// console.log(this)
console.log(this)
} else {
console.log("this :" + this)
console.log("tile orientation 3: "+this.orientation)
console.log("tile orientation 3: "+this.layer.orientation)
}
// this.pixelY = this.y * this.baseHeight - (this.height - this.baseHeight);
@ -19611,6 +19596,15 @@ var LayerData = new Class({
* @since 3.0.0
*/
this.tilemapLayer = GetFastValue(config, 'tilemapLayer', null);
/**
* The layer's orientation, necessary to be able to determine pixelX and pixelY.
*
* @name Phaser.Tilemaps.LayerData#orientation
* @type {string}
* @since 3.2.PR_svipal
*/
this.orientation = GetFastValue(config, 'orientation', "orthogonal");
}
});
@ -102894,9 +102888,12 @@ var ParseTileLayers = function (json, insertNull)
tileHeight: json.tileheight,
alpha: (curGroupState.opacity * curl.opacity),
visible: (curGroupState.visible && curl.visible),
properties: GetFastValue(curl, 'properties', {})
properties: GetFastValue(curl, 'properties', {}),
orientation: json.orientation
});
console.log("layerdata orientation", layerData.orientation)
for (var c = 0; c < curl.height; c++)
{
output.push([ null ]);
@ -102926,10 +102923,8 @@ var ParseTileLayers = function (json, insertNull)
// index, x, y, width, height
if (gidInfo.gid > 0)
{
console.log("Tile ptl 1", newOffsetX, newOffsetY, json.tilewidth,
json.tileheight,json.orientation)
tile = new Tile(layerData, gidInfo.gid, newOffsetX, newOffsetY, json.tilewidth,
json.tileheight,json.orientation);
json.tileheight);
// Turning Tiled's FlippedHorizontal, FlippedVertical and FlippedAntiDiagonal
// propeties into flipX, flipY and rotation
@ -102940,11 +102935,9 @@ var ParseTileLayers = function (json, insertNull)
}
else
{
console.log("Tile ptl 2", newOffsetX, newOffsetY, json.tilewidth,
json.tileheight,json.orientation)
blankTile = insertNull
? null
: new Tile(layerData, -1, newOffsetX, newOffsetY, json.tilewidth, json.tileheight,json.orientation);
: new Tile(layerData, -1, newOffsetX, newOffsetY, json.tilewidth, json.tileheight);
output[newOffsetY][newOffsetX] = blankTile;
}
@ -102971,9 +102964,10 @@ var ParseTileLayers = function (json, insertNull)
tileHeight: json.tileheight,
alpha: (curGroupState.opacity * curl.opacity),
visible: (curGroupState.visible && curl.visible),
properties: GetFastValue(curl, 'properties', {})
properties: GetFastValue(curl, 'properties', {}),
orientation: json.orientation
});
console.log("layerdata orientation", layerData.orientation)
var row = [];
// Loop through the data field in the JSON.
@ -102984,10 +102978,8 @@ var ParseTileLayers = function (json, insertNull)
// index, x, y, width, height
if (gidInfo.gid > 0)
{
console.log("Tile ptl 3", newOffsetX, newOffsetY, json.tilewidth,
json.tileheight,json.orientation)
tile = new Tile(layerData, gidInfo.gid, x, output.length, json.tilewidth,
json.tileheight, json.orientation);
json.tileheight);
// Turning Tiled's FlippedHorizontal, FlippedVertical and FlippedAntiDiagonal
// propeties into flipX, flipY and rotation
@ -102998,11 +102990,9 @@ var ParseTileLayers = function (json, insertNull)
}
else
{
console.log("Tile ptl 4", newOffsetX, newOffsetY, json.tilewidth,
json.tileheight,json.orientation)
blankTile = insertNull
? null
: new Tile(layerData, -1, x, output.length, json.tilewidth, json.tileheight, json.orientation);
: new Tile(layerData, -1, x, output.length, json.tilewidth, json.tileheight);
row.push(blankTile);
}
@ -104620,8 +104610,10 @@ var Tilemap = new Class({
tileWidth: tileWidth,
tileHeight: tileHeight,
width: width,
height: height
height: height,
orientation: this.orientation
});
console.log("tm orientation : ",layerData.orientation)
var row;
@ -104631,8 +104623,7 @@ var Tilemap = new Class({
for (var tileX = 0; tileX < width; tileX++)
{
console.log("Tile tm", tileX, tileY, tileWidth, tileHeight, this.orientation, this.tileWidth, this.tileHeight)
row.push(new Tile(layerData, -1, tileX, tileY, tileWidth, tileHeight, this.orientation, this.tileWidth, this.tileHeight));
row.push(new Tile(layerData, -1, tileX, tileY, tileWidth, tileHeight, this.tileWidth, this.tileHeight));
}
layerData.data.push(row);

File diff suppressed because one or more lines are too long

75
dist/phaser.js vendored
View file

@ -14137,7 +14137,6 @@ var Rectangle = __webpack_require__(441);
* @param {integer} baseHeight - The base height of the tile in pixels (in pixels). Tiled maps
* support multiple tileset sizes within one map, but they are still placed at intervals of the
* base tile height.
* @param {string} orientation - The Tilemap's orientation
*/
var Tile = new Class({
@ -14150,7 +14149,7 @@ var Tile = new Class({
initialize:
function Tile (layer, index, x, y, width, height, orientation, baseWidth, baseHeight )
function Tile (layer, index, x, y, width, height, baseWidth, baseHeight )
{
console.log(this)
/**
@ -14379,21 +14378,7 @@ var Tile = new Class({
* @since 3.0.0
*/
this.physics = {};
/**
* The tile's orientation, necessary to be able to determine pixelX and pixelY.
*
* @name Phaser.Tilemaps.Tile#orientation
* @type {string}
* @since 3.2.PR_svipal
*/
// we default to orthogonal
// we need to deep copy the string to prevent the orientation later going out of scope
if (orientation == undefined) {
this.orientation = "orthogonal";
} else {
this.orientation = (' ' + orientation).slice(1)
}
console.log("tile orientation : "+this.orientation)
},
/**
@ -14826,23 +14811,23 @@ var Tile = new Class({
*/
updatePixelXY: function ()
{
console.log("tile orientation 2: "+this.orientation)
if (this.orientation === "orthogonal") {
if (this.layer.orientation === "orthogonal") {
// In orthogonal mode, Tiled places tiles on a grid of baseWidth x baseHeight. The origin for a tile is the
// bottom left, while the Phaser renderer assumes the origin is the top left. The y
// coordinate needs to be adjusted by the difference.
this.pixelX = this.x * this.baseWidth;
this.pixelY = this.y * this.baseHeight;
console.log("orthopix "+this.pixelX+","+this.pixelY)
} else if (this.orientation === "isometric" ||true) {
// for the image to be centered we have to move the image to the right.
this.pixelX = this.layer.widthInPixels/2 + (this.x - this.y) * this.baseWidth *0.5;
} else if (this.layer.orientation === "isometric" ) {
// for the image to be centered we have to move the image to the right with the camera !
// this is crucial for wordtotile, tiletoworld to work.
this.pixelX = (this.x - this.y) * this.baseWidth *0.5;
this.pixelY = (this.x + this.y) * this.baseHeight *0.5;
console.log("isopix "+this.pixelX+","+this.pixelY)
// console.log(this)
console.log(this)
} else {
console.log("this :" + this)
console.log("tile orientation 3: "+this.orientation)
console.log("tile orientation 3: "+this.layer.orientation)
}
// this.pixelY = this.y * this.baseHeight - (this.height - this.baseHeight);
@ -22363,6 +22348,15 @@ var LayerData = new Class({
* @since 3.0.0
*/
this.tilemapLayer = GetFastValue(config, 'tilemapLayer', null);
/**
* The layer's orientation, necessary to be able to determine pixelX and pixelY.
*
* @name Phaser.Tilemaps.LayerData#orientation
* @type {string}
* @since 3.2.PR_svipal
*/
this.orientation = GetFastValue(config, 'orientation', "orthogonal");
}
});
@ -107705,9 +107699,12 @@ var ParseTileLayers = function (json, insertNull)
tileHeight: json.tileheight,
alpha: (curGroupState.opacity * curl.opacity),
visible: (curGroupState.visible && curl.visible),
properties: GetFastValue(curl, 'properties', {})
properties: GetFastValue(curl, 'properties', {}),
orientation: json.orientation
});
console.log("layerdata orientation", layerData.orientation)
for (var c = 0; c < curl.height; c++)
{
output.push([ null ]);
@ -107737,10 +107734,8 @@ var ParseTileLayers = function (json, insertNull)
// index, x, y, width, height
if (gidInfo.gid > 0)
{
console.log("Tile ptl 1", newOffsetX, newOffsetY, json.tilewidth,
json.tileheight,json.orientation)
tile = new Tile(layerData, gidInfo.gid, newOffsetX, newOffsetY, json.tilewidth,
json.tileheight,json.orientation);
json.tileheight);
// Turning Tiled's FlippedHorizontal, FlippedVertical and FlippedAntiDiagonal
// propeties into flipX, flipY and rotation
@ -107751,11 +107746,9 @@ var ParseTileLayers = function (json, insertNull)
}
else
{
console.log("Tile ptl 2", newOffsetX, newOffsetY, json.tilewidth,
json.tileheight,json.orientation)
blankTile = insertNull
? null
: new Tile(layerData, -1, newOffsetX, newOffsetY, json.tilewidth, json.tileheight,json.orientation);
: new Tile(layerData, -1, newOffsetX, newOffsetY, json.tilewidth, json.tileheight);
output[newOffsetY][newOffsetX] = blankTile;
}
@ -107782,9 +107775,10 @@ var ParseTileLayers = function (json, insertNull)
tileHeight: json.tileheight,
alpha: (curGroupState.opacity * curl.opacity),
visible: (curGroupState.visible && curl.visible),
properties: GetFastValue(curl, 'properties', {})
properties: GetFastValue(curl, 'properties', {}),
orientation: json.orientation
});
console.log("layerdata orientation", layerData.orientation)
var row = [];
// Loop through the data field in the JSON.
@ -107795,10 +107789,8 @@ var ParseTileLayers = function (json, insertNull)
// index, x, y, width, height
if (gidInfo.gid > 0)
{
console.log("Tile ptl 3", newOffsetX, newOffsetY, json.tilewidth,
json.tileheight,json.orientation)
tile = new Tile(layerData, gidInfo.gid, x, output.length, json.tilewidth,
json.tileheight, json.orientation);
json.tileheight);
// Turning Tiled's FlippedHorizontal, FlippedVertical and FlippedAntiDiagonal
// propeties into flipX, flipY and rotation
@ -107809,11 +107801,9 @@ var ParseTileLayers = function (json, insertNull)
}
else
{
console.log("Tile ptl 4", newOffsetX, newOffsetY, json.tilewidth,
json.tileheight,json.orientation)
blankTile = insertNull
? null
: new Tile(layerData, -1, x, output.length, json.tilewidth, json.tileheight, json.orientation);
: new Tile(layerData, -1, x, output.length, json.tilewidth, json.tileheight);
row.push(blankTile);
}
@ -109431,8 +109421,10 @@ var Tilemap = new Class({
tileWidth: tileWidth,
tileHeight: tileHeight,
width: width,
height: height
height: height,
orientation: this.orientation
});
console.log("tm orientation : ",layerData.orientation)
var row;
@ -109442,8 +109434,7 @@ var Tilemap = new Class({
for (var tileX = 0; tileX < width; tileX++)
{
console.log("Tile tm", tileX, tileY, tileWidth, tileHeight, this.orientation, this.tileWidth, this.tileHeight)
row.push(new Tile(layerData, -1, tileX, tileY, tileWidth, tileHeight, this.orientation, this.tileWidth, this.tileHeight));
row.push(new Tile(layerData, -1, tileX, tileY, tileWidth, tileHeight, this.tileWidth, this.tileHeight));
}
layerData.data.push(row);

2
dist/phaser.min.js vendored

File diff suppressed because one or more lines are too long

View file

@ -35,7 +35,6 @@ var Rectangle = require('../geom/rectangle');
* @param {integer} baseHeight - The base height of the tile in pixels (in pixels). Tiled maps
* support multiple tileset sizes within one map, but they are still placed at intervals of the
* base tile height.
* @param {string} orientation - The Tilemap's orientation
*/
var Tile = new Class({
@ -48,7 +47,7 @@ var Tile = new Class({
initialize:
function Tile (layer, index, x, y, width, height, orientation, baseWidth, baseHeight )
function Tile (layer, index, x, y, width, height, baseWidth, baseHeight )
{
console.log(this)
/**
@ -277,21 +276,7 @@ var Tile = new Class({
* @since 3.0.0
*/
this.physics = {};
/**
* The tile's orientation, necessary to be able to determine pixelX and pixelY.
*
* @name Phaser.Tilemaps.Tile#orientation
* @type {string}
* @since 3.2.PR_svipal
*/
// we default to orthogonal
// we need to deep copy the string to prevent the orientation later going out of scope
if (orientation == undefined) {
this.orientation = "orthogonal";
} else {
this.orientation = (' ' + orientation).slice(1)
}
console.log("tile orientation : "+this.orientation)
},
/**
@ -724,24 +709,23 @@ var Tile = new Class({
*/
updatePixelXY: function ()
{
console.log("tile orientation 2: "+this.orientation)
if (this.orientation === "orthogonal") {
if (this.layer.orientation === "orthogonal") {
// In orthogonal mode, Tiled places tiles on a grid of baseWidth x baseHeight. The origin for a tile is the
// bottom left, while the Phaser renderer assumes the origin is the top left. The y
// coordinate needs to be adjusted by the difference.
this.pixelX = this.x * this.baseWidth;
this.pixelY = this.y * this.baseHeight;
console.log("orthopix "+this.pixelX+","+this.pixelY)
} else if (this.orientation === "isometric" ||true) {
} else if (this.layer.orientation === "isometric" ) {
// for the image to be centered we have to move the image to the right with the camera !
// this is crucial for wordtotile, tiletoworld to work.
this.pixelX = (this.x - this.y) * this.baseWidth *0.5;
this.pixelY = (this.x + this.y) * this.baseHeight *0.5;
console.log("isopix "+this.pixelX+","+this.pixelY)
// console.log(this)
console.log(this)
} else {
console.log("this :" + this)
console.log("tile orientation 3: "+this.orientation)
console.log("tile orientation 3: "+this.layer.orientation)
}
// this.pixelY = this.y * this.baseHeight - (this.height - this.baseHeight);

View file

@ -502,8 +502,10 @@ var Tilemap = new Class({
tileWidth: tileWidth,
tileHeight: tileHeight,
width: width,
height: height
height: height,
orientation: this.orientation
});
console.log("tm orientation : ",layerData.orientation)
var row;
@ -513,8 +515,7 @@ var Tilemap = new Class({
for (var tileX = 0; tileX < width; tileX++)
{
console.log("Tile tm", tileX, tileY, tileWidth, tileHeight, this.orientation, this.tileWidth, this.tileHeight)
row.push(new Tile(layerData, -1, tileX, tileY, tileWidth, tileHeight, this.orientation, this.tileWidth, this.tileHeight));
row.push(new Tile(layerData, -1, tileX, tileY, tileWidth, tileHeight, this.tileWidth, this.tileHeight));
}
layerData.data.push(row);

View file

@ -207,6 +207,15 @@ var LayerData = new Class({
* @since 3.0.0
*/
this.tilemapLayer = GetFastValue(config, 'tilemapLayer', null);
/**
* The layer's orientation, necessary to be able to determine pixelX and pixelY.
*
* @name Phaser.Tilemaps.LayerData#orientation
* @type {string}
* @since 3.2.PR_svipal
*/
this.orientation = GetFastValue(config, 'orientation', "orthogonal");
}
});

View file

@ -127,9 +127,12 @@ var ParseTileLayers = function (json, insertNull)
tileHeight: json.tileheight,
alpha: (curGroupState.opacity * curl.opacity),
visible: (curGroupState.visible && curl.visible),
properties: GetFastValue(curl, 'properties', {})
properties: GetFastValue(curl, 'properties', {}),
orientation: json.orientation
});
console.log("layerdata orientation", layerData.orientation)
for (var c = 0; c < curl.height; c++)
{
output.push([ null ]);
@ -159,10 +162,8 @@ var ParseTileLayers = function (json, insertNull)
// index, x, y, width, height
if (gidInfo.gid > 0)
{
console.log("Tile ptl 1", newOffsetX, newOffsetY, json.tilewidth,
json.tileheight,json.orientation)
tile = new Tile(layerData, gidInfo.gid, newOffsetX, newOffsetY, json.tilewidth,
json.tileheight,json.orientation);
json.tileheight);
// Turning Tiled's FlippedHorizontal, FlippedVertical and FlippedAntiDiagonal
// propeties into flipX, flipY and rotation
@ -173,11 +174,9 @@ var ParseTileLayers = function (json, insertNull)
}
else
{
console.log("Tile ptl 2", newOffsetX, newOffsetY, json.tilewidth,
json.tileheight,json.orientation)
blankTile = insertNull
? null
: new Tile(layerData, -1, newOffsetX, newOffsetY, json.tilewidth, json.tileheight,json.orientation);
: new Tile(layerData, -1, newOffsetX, newOffsetY, json.tilewidth, json.tileheight);
output[newOffsetY][newOffsetX] = blankTile;
}
@ -204,9 +203,10 @@ var ParseTileLayers = function (json, insertNull)
tileHeight: json.tileheight,
alpha: (curGroupState.opacity * curl.opacity),
visible: (curGroupState.visible && curl.visible),
properties: GetFastValue(curl, 'properties', {})
properties: GetFastValue(curl, 'properties', {}),
orientation: json.orientation
});
console.log("layerdata orientation", layerData.orientation)
var row = [];
// Loop through the data field in the JSON.
@ -217,10 +217,8 @@ var ParseTileLayers = function (json, insertNull)
// index, x, y, width, height
if (gidInfo.gid > 0)
{
console.log("Tile ptl 3", newOffsetX, newOffsetY, json.tilewidth,
json.tileheight,json.orientation)
tile = new Tile(layerData, gidInfo.gid, x, output.length, json.tilewidth,
json.tileheight, json.orientation);
json.tileheight);
// Turning Tiled's FlippedHorizontal, FlippedVertical and FlippedAntiDiagonal
// propeties into flipX, flipY and rotation
@ -231,11 +229,9 @@ var ParseTileLayers = function (json, insertNull)
}
else
{
console.log("Tile ptl 4", newOffsetX, newOffsetY, json.tilewidth,
json.tileheight,json.orientation)
blankTile = insertNull
? null
: new Tile(layerData, -1, x, output.length, json.tilewidth, json.tileheight, json.orientation);
: new Tile(layerData, -1, x, output.length, json.tilewidth, json.tileheight);
row.push(blankTile);
}