45 lines
1.3 KiB
JavaScript
45 lines
1.3 KiB
JavaScript
|
|
class MapLoader {
|
|
constructor(map) {
|
|
this.map = map;
|
|
}
|
|
|
|
load() {
|
|
const mapContainer = document.getElementById('rts-map-container');
|
|
mapContainer.innerHTML = '';
|
|
|
|
for (let y = 0; y < this.map.height; y++) {
|
|
for (let x = 0; x < this.map.width; x++) {
|
|
const tile = document.createElement('div');
|
|
tile.classList.add('rts-tile');
|
|
tile.dataset.x = x;
|
|
tile.dataset.y = y;
|
|
|
|
switch (this.map.tiles[y][x]) {
|
|
case 1:
|
|
tile.classList.add('enclosure');
|
|
break;
|
|
case 2:
|
|
tile.classList.add('wall');
|
|
break;
|
|
default:
|
|
tile.classList.add('path');
|
|
break;
|
|
}
|
|
|
|
mapContainer.appendChild(tile);
|
|
}
|
|
}
|
|
|
|
this.map.entities.forEach(entity => {
|
|
const entityElement = document.createElement('div');
|
|
entityElement.classList.add('rts-entity', entity.type);
|
|
entityElement.style.left = `${entity.x * 16}px`;
|
|
entityElement.style.top = `${entity.y * 16}px`;
|
|
mapContainer.appendChild(entityElement);
|
|
});
|
|
}
|
|
}
|
|
|
|
export { MapLoader };
|