You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
42 lines
1.1 KiB
42 lines
1.1 KiB
require('../../sass/board/scorebar.scss');
|
|
|
|
var React = require('react');
|
|
var State = require('../State');
|
|
|
|
module.exports = React.createClass({
|
|
getInitialState() {
|
|
return {
|
|
currentScore: 0,
|
|
highScore: 0,
|
|
lives: 3
|
|
};
|
|
},
|
|
|
|
componentDidMount() {
|
|
State.subscribe('munch/successful', this.updateScore);
|
|
State.subscribe('munch/failed', this.updateLives);
|
|
},
|
|
|
|
updateScore() {
|
|
var score = this.state.currentScore;
|
|
this.setState({ currentScore: score + 10 });
|
|
},
|
|
|
|
updateLives() {
|
|
var lives = this.state.lives;
|
|
this.setState({ lives: lives - 1 });
|
|
},
|
|
|
|
render() {
|
|
var lives = [];
|
|
for (var i = 0; i < this.state.lives; i++) {
|
|
lives.push(<div className='life' key={i}></div>);
|
|
}
|
|
|
|
return (<div className='scorebar'>
|
|
<div className='item current-score'>{this.state.currentScore}</div>
|
|
<div className='item high-score'>{this.state.highScore}</div>
|
|
<div className='item lives'>{lives}</div>
|
|
</div>);
|
|
}
|
|
});
|
|
|