52 lines
1.7 KiB
JavaScript
52 lines
1.7 KiB
JavaScript
import TilorswiftFieldClickedEvent from "./events/TilorswiftFieldClickedEvent.js";
|
|
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();
|
|
}
|
|
|
|
init()
|
|
{
|
|
this.htmlElement.addEventListener(
|
|
'mousedown', () => {
|
|
window.dispatchEvent(new TilorswiftFieldClickedEvent(this));
|
|
}
|
|
);
|
|
|
|
this.htmlElement.addEventListener(
|
|
'mouseenter', () => {
|
|
window.dispatchEvent(new TilorswiftFieldEnteredEvent(this));
|
|
}
|
|
);
|
|
|
|
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';
|
|
|
|
let hoverElement = document.createElement('div');
|
|
hoverElement.classList.add('selection');
|
|
this.htmlElement.appendChild(hoverElement);
|
|
}
|
|
|
|
setIndex(index)
|
|
{
|
|
this.index = index;
|
|
this.htmlElement.style.backgroundPositionX = -this.index * this.tileset.getTileWidth() + 'px';
|
|
}
|
|
|
|
getElement()
|
|
{
|
|
return this.htmlElement;
|
|
}
|
|
} |