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.
50 lines
1.4 KiB
50 lines
1.4 KiB
require('../../sass/options/options.scss');
|
|
|
|
import { Component } from 'react';
|
|
import { connect } from 'react-redux';
|
|
import OptionsCtrl from '../../controllers/options/options.controller';
|
|
import ModeCtrl from '../../controllers/mode.controller';
|
|
import Option from './option.component';
|
|
|
|
let listener;
|
|
|
|
export default class Options extends Component {
|
|
componentDidMount() {
|
|
OptionsCtrl.setDispatch(this.props.dispatch);
|
|
ModeCtrl.setDispatch(this.props.dispatch);
|
|
|
|
listener = OptionsCtrl.keyListener.bind(OptionsCtrl);
|
|
window.addEventListener('keydown', listener);
|
|
};
|
|
|
|
componentWillUnmount() {
|
|
window.removeEventListener('keydown', listener);
|
|
};
|
|
|
|
render() {
|
|
const optionsElements = [];
|
|
|
|
OptionsCtrl.getValues().map((v, i) => {
|
|
optionsElements.push(<Option value={v} selected={this.props.selected === i} key={i} />);
|
|
});
|
|
|
|
return (
|
|
<div className='options'>
|
|
<div className='line'>Which game would you like to play?</div>
|
|
<hr />
|
|
<div className='line'>Use the arrow keys to move.</div>
|
|
<div className='line'>Press spacebar to select.</div>
|
|
<hr />
|
|
{optionsElements}
|
|
</div>
|
|
);
|
|
};
|
|
};
|
|
|
|
const select = (state) => {
|
|
return {
|
|
selected: state.options
|
|
};
|
|
};
|
|
|
|
export default connect(select)(Options);
|
|
|