var React = require('react');
var Cell = require('./Cell');
var Character = require('./Character');
var UserInput = require('./Input');
var Values = require('./Values');

module.exports = React.createClass({
    getInitialState() {
        return {
            values: Values.generate(this.props.width, this.props.height)
        };
    },

    componentDidMount() {
        window.addEventListener('keydown', UserInput.keydown.bind(this));
    },

    munch(x, y) {
        if (this.state.values[x + '-' + y][1] === true) {
            console.log('yum');
        }
        else {
            console.log('blech');
        }
    },

    render() {
        var cells = [];

        for (var x = 0; x < this.props.width; x++) {
            for (var y = 0; y < this.props.height; y++) {
                cells.push(<Cell value={this.state.values[x + '-' + y][0]} x={x} y={y} key={x + '-' + y} />);
            }
        }

        return (<div>
            {cells}
            <Character ref='ourhero1' />
        </div>);
    }
});