corner/asdf-games
1
0
Fork 0
forked from arne/asdf-games
Code Issues Pull Requests Releases Wiki Activity

Added TileMap support (both with indexes and XML)

Browse Source
This commit is contained in:
Arne van Iterson 2020-01-17 13:26:50 +01:00
parent bba6c36621
commit 0d1ee32fd8
4 changed files with 95 additions and 41 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

45
asdf/SpriteSheetXML.js Normal file
View File

@ -0,0 +1,45 @@
// XML format must be:
// <TextureAlias imagePath="">
// <SubTexture x="" y="" width="" height=""></SubTexture>
// ...
// </TextureAlias>
class SpriteSheetXML {
constructor(url) {
this.array = [];
this.fetchXMLtoArray(url);
}
fetchXMLtoArray(url) {
var xhr = new XMLHttpRequest();
xhr.open('GET', url, false);
xhr.send(null);
if (xhr.status === 200) {
var children = xhr.responseXML.children[0].children;
for (let index = 0; index < children.length; index++) {
const element = children[index];
this.array.push({
name: element.attributes.name.nodeValue,
x: element.attributes.x.nodeValue,
y: element.attributes.y.nodeValue,
width: element.attributes.width.nodeValue,
height: element.attributes.height.nodeValue
});
}
} else {
console.error('XML file cannot be loaded!')
}
}
findIndex(attribute, value) {
for (let index = 0; index < this.array.length; index++) {
const element = this.array[index];
if (element[attribute] == value) {
return index;
}
}
}
}
export default SpriteSheetXML;

25
asdf/TileMap.js Normal file
View File

@ -0,0 +1,25 @@
import Container from "./Container.js";
import TileSprite from "./TileSprite.js";
class TileMap extends Container {
constructor(tiles, mapW, mapH, tileW, tileH, texture) {
super();
this.mapW = mapW;
this.mapH = mapH;
this.tileW = tileW;
this.tileH = tileH;
this.w = mapW * tileW;
this.h = mapH * tileH;
// Add all tile sprites
this.children = tiles.map((frame, i) => {
const s = new TileSprite(texture, tileW, tileH);
s.frame = frame;
s.pos.x = i % mapW * tileW;
s.pos.y = Math.floor(i / mapW) * tileH;
return s;
});
}
}
export default TileMap;

58
asdf/TileMapXML.js
View File

@ -1,44 +1,24 @@
// XML format must be:
// <TextureAlias imagePath="">
// <SubTexture x="" y="" width="" height=""></SubTexture>
// ...
// </TextureAlias>
import Container from "./Container.js";
import TileSpriteXML from "./TileSpriteXML.js";
class TileMapXML {
constructor(url) {
this.array = [];
this.fetchXMLtoArray(url);
}
class TileMapXML extends Container {
constructor (tiles, mapW, mapH, texture, xml) {
super(texture);
this.mapW = mapW;
this.mapH = mapH;
this.tileW = xml.array[tiles[0]].width;
this.tileH = xml.array[tiles[0]].height;
this.w = mapW * this.tileW;
this.h = mapH * this.tileH;
fetchXMLtoArray(url) {
var xhr = new XMLHttpRequest();
xhr.open('GET', url, false);
xhr.send(null);
if (xhr.status === 200) {
var children = xhr.responseXML.children[0].children;
for (let index = 0; index < children.length; index++) {
const element = children[index];
this.array.push({
name: element.attributes.name.nodeValue,
x: element.attributes.x.nodeValue,
y: element.attributes.y.nodeValue,
width: element.attributes.width.nodeValue,
height: element.attributes.height.nodeValue
});
}
} else {
console.error('XML file cannot be loaded!')
}
}
findIndex(attribute, value) {
for (let index = 0; index < this.array.length; index++) {
const element = this.array[index];
if (element[attribute] == value) {
return index;
}
}
// Add all tile sprites
this.children = tiles.map((frame, i) => {
const s = new TileSpriteXML(texture, xml, frame);
s.frame = frame;
s.pos.x = i % mapW * this.tileW;
s.pos.y = Math.floor(i / mapW) * this.tileH;
return s;
});
}
}

8
asdf/index.js
View File

@ -8,12 +8,14 @@ import KeyControls from "./controls/KeyControls.js";
import MouseControls from "./controls/MouseControls.js";
import Sprite from "./Sprite.js";
import TileMap from "./TileMap.js";
import TileMapXML from "./TileMapXML.js";
import TileSprite from "./TileSprite.js";
import TileSpriteXML from "./TileSpriteXML.js";
import Text from "./Text.js";
import Texture from "./Texture.js";
import TileMapXML from "./TileMapXML.js";
import SpriteSheetXML from "./SpriteSheetXML.js";
export default {
CanvasRenderer,
@ -23,8 +25,10 @@ export default {
KeyControls,
MouseControls,
Sprite,
TileSprite,
TileMap,
TileMapXML,
TileSprite,
SpriteSheetXML,
TileSpriteXML,
Text,
Texture