require('../../sass/board/troggle.scss');

import { Component } from 'react';

const troggleMoveTimers = [];
const troggleCreateTimers = [];

export default class Troggles extends Component {
    componentWillUnmount() {
        // this.clearTroggleTimers();
    }

    // clearTroggleTimers() {
    //     troggleMoveTimers.forEach((timer) => {
    //         clearTimeout(timer);
    //     });
    //
    //     troggleCreateTimers.forEach((timer) => {
    //         clearTimeout(timer);
    //     });
    // };
    //
    // createTroggle(index) {
    //     const newCoords = TroggleAI.create();
    //     this.props.dispatch(TroggleActions.create(newCoords.x, newCoords.y));
    //     troggleMoveTimers.push(setTimeout(this.moveTroggle.bind(this, index), 1000));
    // };
    //
    // createTroggles() {
    //     const troggleCount = 3; //Math.min(Math.ceil(this.props.board.level / 2), 5);
    //     for (let i = 0; i < troggleCount; i++) {
    //         setTimeout(this.createTroggle.bind(this, i), (i + 1) * 5000);
    //     }
    // };
    //
    // moveTroggle(index) {
    //     const newCoords = TroggleAI.move(
    //         this.props.troggles[index].x,
    //         this.props.troggles[index].y,
    //         this.props.muncher.x,
    //         this.props.muncher.y
    //     );
    //
    //     if (newCoords.x === this.props.muncher.x && newCoords.y === this.props.muncher.y) {
    //         this.props.dispatch(MessageActions.show("You've been eaten by a troggle!"));
    //         this.props.dispatch(TroggleActions.clearAll());
    //     }
    //     else {
    //         this.props.dispatch(TroggleActions.move(index, newCoords.x, newCoords.y));
    //         clearTimeout(troggleMoveTimers[index]);
    //         troggleMoveTimers[index] = setTimeout(this.moveTroggle.bind(this, index), 1000);
    //     }
    // };

    render() {
        const classname = ['troggle', 'x' + this.props.x, 'y' + this.props.y];

        // const troggleElements = [];
        // for (let i = 0; i < troggles.length; i++) {
        //     troggleElements[i] = <Troggle x={troggles[i].x} y={troggles[i].y} key={i} />;
        // }
            // {troggleElements}

        return (
            <div className={classname.join(' ')}></div>
        );
    };
};