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

Menu bar for brush selection implemented.

Browse Source
This commit is contained in:
Mal
2020-01-30 23:40:42 +01:00
parent 2fa3bf5a53
commit 9c3aca1bc9
10 changed files with 142 additions and 23 deletions
Download Patch File Download Diff File Expand all files Collapse all files

33
tilorswift/js/Field.js
View File

@@ -3,21 +3,26 @@ import TilorswiftFieldEnteredEvent from "./events/TilorswiftFieldEnteredEvent.js
export default class Field
{
className = 'field';
constructor(tileset, index = 0)
{
this.tileset = tileset;
this.index = index;
this.htmlElement = document.createElement('td');
this.init();
this.initHtml();
this.initEventListeners();
}
init()
initEventListeners()
{
this.htmlElement.addEventListener(
'mousedown', () => {
window.dispatchEvent(new TilorswiftFieldClickedEvent(this));
'mousedown', (event) => {
console.log(event);
window.dispatchEvent(new TilorswiftFieldClickedEvent(this, event.button));
}
);
this.htmlElement.addEventListener(
'contextmenu', (event) => {
window.dispatchEvent(new TilorswiftFieldClickedEvent(this), event.button);
}
);
@@ -26,14 +31,28 @@ export default class Field
window.dispatchEvent(new TilorswiftFieldEnteredEvent(this));
}
);
}
initHtml()
{
this.htmlElement = document.createElement('td');
this.className = 'field';
this.setupElement();
this.addSelector();
}
setupElement()
{
this.htmlElement.classList.add(this.className);
this.htmlElement.style.width = String(this.tileset.getTileWidth()) + 'px';
this.htmlElement.style.height = String(this.tileset.getTileHeight()) + 'px';
this.htmlElement.style.backgroundSize = 'auto ' + this.tileset.getTileHeight() + 'px';
this.htmlElement.style.backgroundImage = 'url("' + this.tileset.image.src + '")';
this.htmlElement.style.backgroundPositionX = -this.index * this.tileset.getTileWidth() + 'px';
}
addSelector()
{
let hoverElement = document.createElement('div');
hoverElement.classList.add('selection');
this.htmlElement.appendChild(hoverElement);