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

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

var blinkTimer = null;

var toggleTimeout = function() {
    var hidden = this.state.hidden;
    this.setState({ hidden: !hidden });

    blinkTimer = setTimeout(toggleTimeout.bind(this), 600);
};

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

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

    componentWillUnmount() {
        clearTimeout(blinkTimer);
    },

    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>
        );
    }
});