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

import { Component } from 'react';
import GridCell from './GridCell';
// var Values = require('./Values');

export default class Grid extends Component {
    generateValues() {
        // return Values.generate(this.props.width * this.props.height, State.level);
    };

    // getInitialState() {
    //     return { values: this.generateValues() };
    // },

    componentDidMount() {
        // State.subscribe('level/next', this.levelNext);
    };

    checkComplete() {
        // if (Values.checkComplete(this.state.values, State.level) === true) {
            // State.publish('level/complete');
        // }
    };

    levelNext() {
        // this.setState({ values: this.generateValues() });
    };

    munch(x, y) {
        // var i = y * this.props.width + x;
        //
        // if (this.state.values[i] === "") {
        //     return;
        // }
        //
        // if (Values.validate(this.state.values[i], State.level)) {
        //     this.state.values[i] = "";
        //     this.setState({ values: this.state.values }, this.checkComplete);
        //     State.publish('munch/successful');
        // }
        // else {
        //     State.publish('munch/failed', this.state.values[i]);
        // }
    };

    render() {
        const cells = [];
        let i;

        for (let x = 0; x < this.props.width; x++) {
            for (let y = 0; y < this.props.height; y++) {
                i = y * this.props.width + x;
                // cells.push(<GridCell value={this.state.values[i]} x={x} y={y} key={i} />);
            }
        }

        return (<div className='grid'>{cells}</div>);
    };
};