import { Component } from 'react';
import { connect } from 'react-redux';
import * as creators from '../app/Creators.js';

let blinkTimer = null;

const toggleTimeout = function() {
    var hidden = this.props.blink;
    this.props.dispatch(creators.toggleBlink());
    blinkTimer = setTimeout(toggleTimeout.bind(this), 600);
};

export default class NewGame extends Component {
    componentDidMount() {
        toggleTimeout.call(this);
    };

    componentWillUnmount() {
        clearTimeout(blinkTimer);
    };

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

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

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

const select = (state) => {
    return {
        blink: state.blink
    }
};

export default connect(select)(NewGame);