Mal/mr-crocs-adventures
1
0
Fork 0
mirror of https://git.leinelab.org/Mal/mr-crocs-adventures.git synced 2025-09-11 02:57:36 +02:00
Code Issues Packages Projects Releases Wiki Activity

Tileset dialog for Tilorswift and fix for adding rows.

Browse Source
This commit is contained in:
Mal
2020-02-14 00:12:24 +01:00
parent 72589544bd
commit 04c3d0253b
19 changed files with 297 additions and 52 deletions
Download Patch File Download Diff File Expand all files Collapse all files

64
tilorswift/js/dialog/Dialog.js
View File

@@ -1,3 +1,7 @@
import GraphicSet from "../../../js/GraphicSet.js";
import Setting from "../../../js/Setting.js";
import TilorswiftTilesetSelectedEvent from "../events/TilorswiftTilesetSelectedEvent.js";
export default class Dialog
{
constructor()
@@ -59,6 +63,66 @@ export default class Dialog
return htmlElementInput;
}
createTilesetSelector()
{
let htmlElement = document.createElement('div');
htmlElement.id = 'tileset-selector';
let htmlElementLabel = document.createElement('div');
htmlElementLabel.classList.add('dialog-label');
htmlElementLabel.innerText = 'Terrain';
let htmlAvatarElement = document.createElement('div');
htmlAvatarElement.id = 'tileset-avatar';
htmlAvatarElement.style.backgroundImage = 'url("' + Setting.TILESET_LOCATION + GraphicSet[0].tileset + '")';
let htmlListElement = document.createElement('div');
htmlListElement.id = 'tileset-list';
htmlElement.appendChild(htmlElementLabel);
htmlElement.appendChild(htmlAvatarElement);
htmlElement.appendChild(htmlListElement);
htmlAvatarElement.addEventListener(
'click',
() => {
htmlListElement.style.display = 'block';
}
);
GraphicSet.forEach(
(graphicSet, index) => {
let htmlTilesetElement = document.createElement('div');
htmlTilesetElement.classList.add('tileset');
let htmlThumbnail = document.createElement('div');
htmlThumbnail.classList.add('tileset-thumbnail');
htmlThumbnail.style.backgroundImage = 'url("' + Setting.TILESET_LOCATION + graphicSet.tileset + '")';
htmlTilesetElement.appendChild(htmlThumbnail);
let htmlTitleElement = document.createElement('div');
htmlTitleElement.classList.add('tileset-title');
htmlTitleElement.innerText = graphicSet.name;
htmlTilesetElement.appendChild(htmlTitleElement);
htmlTilesetElement.addEventListener(
'click',
() => {
htmlListElement.style.display = 'none';
htmlAvatarElement.style.backgroundImage = 'url("' + Setting.TILESET_LOCATION + GraphicSet[index].tileset + '")';
window.dispatchEvent(new TilorswiftTilesetSelectedEvent(index));
}
);
htmlListElement.appendChild(htmlTilesetElement);
}
);
this.inputAreaElement.appendChild(htmlElement);
return htmlElement;
}
setMessage(message)
{
this.messageElement.innerText = message;

4
tilorswift/js/dialog/DialogAddRows.js
View File

@@ -18,11 +18,11 @@ export default class DialogAddRows extends Dialog
getPosition()
{
return this.inputPosition.value;
return parseInt(this.inputPosition.value);
}
getRowsCount()
{
return this.inputRows.value;
return parseInt(this.inputRows.value);
}
}

16
tilorswift/js/dialog/DialogNewTerrain.js
View File

@@ -1,6 +1,6 @@
import Dialog from "./Dialog.js";
import TilorswiftNewTerrainEvent from "../events/TilorswiftNewTerrainEvent.js";
import Setting from "../../../js/Setting.js";
import TilorswiftEvent from "../events/TilorswiftEvent.js";
export default class DialogNewTerrain extends Dialog
{
@@ -9,19 +9,29 @@ export default class DialogNewTerrain extends Dialog
this.setMessage('Neues Terrain erstellen');
this.inputRows = this.createInputNumber('Zeilen');
this.inputColumns = this.createInputNumber('Spalten');
this.inputTerrain = this.createTilesetSelector();
this.buttonCancel = this.createButton('Abbrechen');
this.buttonCreate = this.createButton('Erstellen');
this.terrainIndex = 0;
this.buttonCreate.addEventListener(
'click',
() => {
window.dispatchEvent(
new TilorswiftNewTerrainEvent(
Setting.TILESET_LOCATION + 'landscape01.jpg', /* TODO */
this.terrainIndex,
this.inputColumns.value,
this.inputRows.value
)
)
);
}
);
window.addEventListener(
TilorswiftEvent.TILESET_SELECTED,
(event) => {
this.terrainIndex = event.tilesetIndex;
console.log(event.tilesetIndex);
}
);
}