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.
56 lines
1.5 KiB
56 lines
1.5 KiB
import { Component } from 'react';
|
|
import { connect } from 'react-redux';
|
|
|
|
import InitialsCtrl from '../../controllers/high-score/initials.controller';
|
|
|
|
let listener;
|
|
|
|
export class Initials extends Component {
|
|
componentDidMount() {
|
|
InitialsCtrl.setDispatch(this.props.dispatch);
|
|
InitialsCtrl.update();
|
|
|
|
listener = InitialsCtrl.keydown.bind(InitialsCtrl);
|
|
window.addEventListener('keydown', listener);
|
|
};
|
|
|
|
componentWillUnmount() {
|
|
window.removeEventListener('keydown', listener);
|
|
};
|
|
|
|
render() {
|
|
if (this.props.initials.length === 0) {
|
|
return <div className='initials'></div>;
|
|
}
|
|
|
|
const class1 = ['initial'];
|
|
const class2 = ['initial'];
|
|
const class3 = ['initial'];
|
|
|
|
if (this.props.initials[0].active === true) {
|
|
class1.push('blink');
|
|
}
|
|
if (this.props.initials[1].active === true) {
|
|
class2.push('blink');
|
|
}
|
|
if (this.props.initials[2].active === true) {
|
|
class3.push('blink');
|
|
}
|
|
|
|
return (
|
|
<div className='initials'>
|
|
<div className={class1.join(' ')}>{this.props.initials[0].initial}</div>
|
|
<div className={class2.join(' ')}>{this.props.initials[1].initial}</div>
|
|
<div className={class3.join(' ')}>{this.props.initials[2].initial}</div>
|
|
</div>
|
|
);
|
|
};
|
|
};
|
|
|
|
const select = (state) => {
|
|
return {
|
|
initials: state.highscore.initials
|
|
}
|
|
};
|
|
|
|
export default connect(select)(Initials);
|
|
|