require('../sass/welcome.scss');

var React = require('react');
var HighScores = require('./HighScores');

var toggleTimeout = function() {
    var hidden = this.state.hidden;

    setTimeout(function() {
        this.setState({ hidden: !hidden });
        toggleTimeout.call(this);
    }.bind(this), 1000);
};

var NewGame = React.createClass({
    getInitialState() {
        return {
            hidden: false
        }
    },

    componentDidMount() {
        toggleTimeout.call(this);
    },

    render() {
        var classname = ['newgame'];

        if (this.state.hidden === true) {
            classname.push('hidden');
        }

        return (
            <div className={classname.join(' ')}>Press Space Bar To Play</div>
        );
    }
});

module.exports = React.createClass({
    render() {
        return (
            <div className='welcome'>
                <img src="res/title.png" />
                <NewGame />
                <HighScores />
            </div>
        );
    }
});