summaryrefslogtreecommitdiff
path: root/client/tmxloader.js
diff options
context:
space:
mode:
Diffstat (limited to 'client/tmxloader.js')
-rw-r--r--client/tmxloader.js122
1 files changed, 73 insertions, 49 deletions
diff --git a/client/tmxloader.js b/client/tmxloader.js
index 2b3ff0c..9e61012 100644
--- a/client/tmxloader.js
+++ b/client/tmxloader.js
@@ -1,4 +1,5 @@
-var TMXLoader = function(mapName){
+var TMXLoader = function (mapName)
+{
var self = {};
self.mapName = mapName;
@@ -46,19 +47,23 @@ var TMXLoader = function(mapName){
self.xml2 = new XMLHttpRequest();
self.parser = new DOMParser();
- self.loadMap = function(){
+ self.loadMap = function ()
+ {
self.xml.open('GET', "/client/assets/maps/" + mapName + ".tmx");
- self.xml.onload = function(){
- dom = self.parser.parseFromString(self.xml.response, "text/xml");
+ self.xml.onload = function ()
+ {
+ var dom = self.parser.parseFromString(self.xml.response, "text/xml");
self.map.width = dom.documentElement.getAttribute('width');
self.map.height = dom.documentElement.getAttribute('height');
// tilesets
- for (var i=0; i < dom.documentElement.getElementsByTagName('tileset').length; i++){
+ for (var i = 0; i < dom.documentElement.getElementsByTagName('tileset').length; i++)
+ {
var tileset = {};
tileset.firstGID = parseInt(dom.documentElement.getElementsByTagName('tileset').item(i).getAttribute('firstgid'));
- if(!dom.documentElement.getElementsByTagName('tileset').item(i).hasAttribute('source')){
+ if (!dom.documentElement.getElementsByTagName('tileset').item(i).hasAttribute('source'))
+ {
tileset.source = dom.documentElement.getElementsByTagName('tileset').item(i).getElementsByTagName('image')[0].getAttribute('source').replace("../", "/client/assets/");
tileset.width = parseInt(dom.documentElement.getElementsByTagName('tileset').item(i).getElementsByTagName('image')[0].getAttribute('width'));
tileset.height = parseInt(dom.documentElement.getElementsByTagName('tileset').item(i).getElementsByTagName('image')[0].getAttribute('height'));
@@ -67,7 +72,8 @@ var TMXLoader = function(mapName){
tileset.tileCount = parseInt(dom.documentElement.getElementsByTagName('tileset').item(i).getAttribute('tilecount'));
tileset.img = self.addImg(tileset.source);
self.map.tilesets[i] = tileset;
- }else{
+ } else
+ {
tileset.isTsx = true;
tileset.tsxSource = dom.documentElement.getElementsByTagName('tileset').item(i).getAttribute('source').replace("../", "/client/assets/");
self.map.tilesets[i] = tileset;
@@ -76,34 +82,40 @@ var TMXLoader = function(mapName){
}
// layers
- for (var i=0; i < dom.documentElement.getElementsByTagName('layer').length; i++){
+ for (var i = 0; i < dom.documentElement.getElementsByTagName('layer').length; i++)
+ {
var layer = {};
layer.name = dom.documentElement.getElementsByTagName('layer').item(i).getAttribute('name');
layer.tilesStr = dom.documentElement.getElementsByTagName('layer').item(i).getElementsByTagName('data')[0].innerHTML;
layer.id = parseInt(dom.documentElement.getElementsByTagName('layer').item(i).getAttribute('id'));
- layer.tiles= [];
+ layer.tiles = [];
self.map.layers[i] = layer;
}
self.parseLayer();
}
self.xml.send();
}
-
- self.addImg = function(source){
+
+ self.addImg = function (source)
+ {
var TSet = {};
TSet.new = new Image();
TSet.new.src = source;
return TSet.new;
}
- self.loadTSX = function(){
- for(var i=0; i < self.map.tilesets.length; i++){
-
- if(self.map.tilesets[i].isTsx && self.map.tilesets[i].tsxSource != null){
+ self.loadTSX = function ()
+ {
+ for (var i = 0; i < self.map.tilesets.length; i++)
+ {
+
+ if (self.map.tilesets[i].isTsx && self.map.tilesets[i].tsxSource != null)
+ {
self.xml2.open('GET', self.map.tilesets[i].tsxSource);
- tileset = self.map.tilesets[i];
- self.xml2.onload = function(){
- dom2 = self.parser.parseFromString(self.xml2.response, "text/xml");
+ var tileset = self.map.tilesets[i];
+ self.xml2.onload = function ()
+ {
+ var dom2 = self.parser.parseFromString(self.xml2.response, "text/xml");
tileset.source = "/client/assets/tilesets/" + dom2.documentElement.getElementsByTagName('image')[0].getAttribute('source')
tileset.width = parseInt(dom2.documentElement.getElementsByTagName('image')[0].getAttribute('width'));
tileset.height = parseInt(dom2.documentElement.getElementsByTagName('image')[0].getAttribute('height'));
@@ -118,58 +130,70 @@ var TMXLoader = function(mapName){
}
}
- self.getTileIdAt = function(x, y, layer){
+ self.getTileIdAt = function (x, y, layer)
+ {
return self.map.layers[layer].tiles[y][x];
}
- self.parseLayer = function() {
- for (var i=0; i < self.map.layers.length; i++){
- for(var mapX = 0; mapX < self.map.height; mapX++){
+ self.parseLayer = function ()
+ {
+ for (var i = 0; i < self.map.layers.length; i++)
+ {
+ for (var mapX = 0; mapX < self.map.height; mapX++)
+ {
self.map.layers[i].tiles[mapX] = [];
- for(var mapY = 0; mapY < self.map.width; mapY++){
- tileId = parseInt(self.map.layers[i].tilesStr.replace('\n','').split(',')[mapY * self.map.width + mapX]);
- self.map.layers[i].tiles[mapX][mapY] = {id : tileId,
- index : mapX * self.map.width + mapY };
+ for (var mapY = 0; mapY < self.map.width; mapY++)
+ {
+ var tileId = parseInt(self.map.layers[i].tilesStr.replace('\n', '').split(',')[mapY * self.map.width + mapX]);
+ self.map.layers[i].tiles[mapX][mapY] = {
+ id: tileId,
+ index: mapX * self.map.width + mapY
+ };
}
}
self.map.layers[i].tilesStr = "";
}
}
- self.getCollision = function(direction){
+ self.getCollision = function (direction)
+ {
// TODO
}
- self.drawLayer = function(layerName, xOffset, yOffset){
- for(var layerId=0; layerId < self.map.layers.length; layerId++)
+ self.drawLayer = function (canvas, layerName, xOffset, yOffset)
+ {
+ for (var layerId = 0; layerId < self.map.layers.length; layerId++)
{
var t = 0;
- if (self.map.layers[layerId].name.toLowerCase().includes(layerName)){
- for (var mapY=0; mapY < self.map.height; mapY++){
- for (var mapX=0; mapX < self.map.width; mapX++){
+ if (self.map.layers[layerId].name.toLowerCase().includes(layerName))
+ {
+ for (var mapY = 0; mapY < self.map.height; mapY++)
+ {
+ for (var mapX = 0; mapX < self.map.width; mapX++)
+ {
var gid = self.map.layers[layerId].tiles[mapX][mapY].id;
-
- for(var sets=0; sets< self.map.tilesets.length; sets++)
+
+ for (var sets = 0; sets < self.map.tilesets.length; sets++)
{
if (gid <= (self.map.tilesets[sets].firstGID + self.map.tilesets[sets].tileCount) &&
- gid >= self.map.tilesets[sets].firstGID)
- t=sets;
+ gid >= self.map.tilesets[sets].firstGID)
+ t = sets;
}
-
- tsGid = gid - self.map.tilesets[t].firstGID;
-
- if(self.map.tilesets[t].img == null && tsGid == 0)
+
+ var tsGid = gid - self.map.tilesets[t].firstGID;
+
+ if (self.map.tilesets[t].img == null && tsGid == 0)
continue;
-
- tilesinrow = self.map.tilesets[t].width / self.map.tilesets[t].tileWidth;
-
- y= Math.floor(tsGid / tilesinrow);
- x= tsGid % (tilesinrow);
-
- ctx.drawImage(self.map.tilesets[t].img,
+
+ var tilesinrow = self.map.tilesets[t].width / self.map.tilesets[t].tileWidth;
+
+ var y = Math.floor(tsGid / tilesinrow);
+ var x = tsGid % (tilesinrow);
+
+ canvas.drawImage(self.map.tilesets[t].img,
x * self.map.tilesets[t].tileWidth, y * self.map.tilesets[t].tileHeight,
self.map.tilesets[t].tileWidth, self.map.tilesets[t].tileHeight,
- mapX*self.map.tilesets[t].tileWidth+ xOffset,mapY*self.map.tilesets[t].tileWidth+ yOffset,
+ mapX * self.map.tilesets[t].tileWidth + xOffset, mapY * self.map.tilesets[t].tileWidth + yOffset,
self.map.tilesets[t].tileWidth, self.map.tilesets[t].tileHeight)
}
}
@@ -178,6 +202,6 @@ var TMXLoader = function(mapName){
}
self.loadMap();
-
+
return self;
}
generated by cgit v1.2.3-60-g2f50 (git 2.42.0) at 2024-05-14 10:12:45 +0000