clickGame

import React from 'react';
import ReactDOM from 'react-dom';

class SpeedClickGame extends React.Component{
	constructor(props){
		super(props),
		this.state = {
			time: this.props.time,
			points: 0,
			disabled: false,
			}
	}

	handleButtonClick = () => {
		if(this.state.disabled == false) {
			this.setState({
				time: this.state.time - 50,
				points: this.state.points + 1,
			})
		}
	}

	componentDidMount() {
		this.setTimeout = setTimeout( () => {
			this.setState({
				disabled: true,
			})
		}, this.state.time)
	}

	componentWillUpdate() {
		clearInterval(this.setTimeout)
		this.setTimeout = setTimeout( () => {
			this.setState({
				disabled: true,
			})
		}, this.state.time)
	}

	componentWillUnmount() {
		clearInterval(this.intervalId)
	}

	render() {
		return <div>
			<button onClick={this.handleButtonClick}>Click me!</button>
			<h1>{this.state.time}ms</h1>
			<h2>{this.state.points}</h2>
		</div>
	}
}


document.addEventListener('DOMContentLoaded', function(){
    ReactDOM.render(
        <SpeedClickGame time={1000} />,
        document.getElementById('app')
    );
});