export default function Grid() {
    this.points = {};
    this.gridSize = 5;
};

Grid.prototype.fitToGrid = function(n) {
    return n - n % this.gridSize;
}

Grid.prototype.getKey = function({ x, y, type }) {
    const gridX = this.fitToGrid(x);
    const gridY = this.fitToGrid(y);

    return `${gridX}-${gridY}-${type}`;
}

Grid.prototype.setPoint = function({ x, y, type }, value) {
    this.points[this.getKey({ x, y, type })] = value;
};

Grid.prototype.getPoint = function({ x, y, type }) {
    return this.points[this.getKey({ x, y, type })];
}

Grid.prototype.deletePoint = function({ x, y, type }) {
    delete this.points[this.getKey({ x, y, type })];
};

Grid.prototype.setArea = function({ x, y, w, h, type }, container) {
    const xFit = this.fitToGrid(x);
    const yFit = this.fitToGrid(y);
    const wFit = this.fitToGrid(w);
    const hFit = this.fitToGrid(h);

    const div = document.createElement('div');
    div.className = 'hazard';
    div.style.left = `${xFit}px`;
    div.style.width = `${wFit}px`;
    div.style.top = `${yFit}px`;
    div.style.height = `${hFit}px`;
    container.appendChild(div);

    for (let i = xFit; i <= xFit + wFit; i += this.gridSize) {
        for (let j = yFit; j <= yFit + hFit; j += this.gridSize) {
            this.setPoint({ x: i, y: j, type }, true);

            const dot = document.createElement('dot');
            dot.className = 'hazard-dot';
            dot.style.left = `${i - xFit}px`;
            dot.style.top = `${j - yFit}px`;
            div.appendChild(dot);
        }
    }
};