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.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';
    }

    setIndex(index)
    {
        this.index = index;
        this.htmlElement.style.backgroundPositionX = -this.index * this.tileset.getTileWidth() + 'px';
    }

    getElement()
    {
        return this.htmlElement;
    }
}