...
 
Commits (3)
......@@ -9018,6 +9018,16 @@
"symbol-observable": "^1.2.0"
}
},
"redux-thunk": {
"version": "2.3.0",
"resolved": "https://registry.npmjs.org/redux-thunk/-/redux-thunk-2.3.0.tgz",
"integrity": "sha512-km6dclyFnmcvxhAcrQV2AkZmPQjzPDjgVlQtR0EQjxZPyJ0BnMf3in1ryuR8A2qU0HldVRfxYXbFSKlI3N7Slw=="
},
"redux-undo": {
"version": "1.0.0-beta9-9-7",
"resolved": "https://registry.npmjs.org/redux-undo/-/redux-undo-1.0.0-beta9-9-7.tgz",
"integrity": "sha1-/juqGycUI9fdu/w6gscbApotuLo="
},
"regenerate": {
"version": "1.4.0",
"resolved": "https://registry.npmjs.org/regenerate/-/regenerate-1.4.0.tgz",
......
......@@ -7,7 +7,9 @@
"react-dom": "^16.4.2",
"react-redux": "^5.0.7",
"react-scripts": "1.1.4",
"redux": "^4.0.0"
"redux": "^4.0.0",
"redux-thunk": "^2.3.0",
"redux-undo": "^1.0.0-beta9-9-7"
},
"scripts": {
"start": "react-scripts start",
......
import { ActionCreators } from 'redux-undo'
import { START_NEW_GAME } from "./types";
export const startNewGame = (options) => ({
type: START_NEW_GAME,
payload: options
})
export const startNewGame = (options) => (dispatch) => {
dispatch({
type: START_NEW_GAME,
payload: options
})
dispatch(ActionCreators.clearHistory())
}
......@@ -103,9 +103,7 @@ class Board extends Component {
}
}
const mapStateToProps = ({left, center, right, move}) => {
return {left, center, right, move}
}
const mapStateToProps = (state) => state.game.present
export default connect(mapStateToProps, {
onStartMove: startMove,
......
......@@ -6,4 +6,8 @@
.Toolbar>span {
padding: 0 2rem;
}
.Toolbar button {
margin-right: 10px;
}
\ No newline at end of file
import React from 'react'
import { connect } from 'react-redux'
import { ActionCreators } from 'redux-undo';
import { startNewGame } from '../../actions/gameActions';
import './Toolbar.css'
......@@ -11,14 +12,22 @@ const Toolbar = (props) => {
<span>
Moves: {props.moveCount}
</span>
<button disabled={!props.past} onClick={props.undo}>undo</button>
<button disabled={!props.future} onClick={props.redo}>redo</button>
</div>
)
}
const mapStateToProps = (state) => {
return {
moveCount: state.moves
moveCount: state.game.present.moves,
past: state.game.past.length,
future: state.game.future.length
}
}
export default connect( mapStateToProps, { startNewGame })(Toolbar)
export default connect( mapStateToProps, {
startNewGame,
undo: ActionCreators.undo,
redo: ActionCreators.redo
})(Toolbar)
......@@ -20,3 +20,8 @@ button:hover {
background-color: #0069d9;
border-color: #0062cc;
}
button:disabled {
background-color: lightgrey;
border-color: darkgray;
}
import { combineReducers } from 'redux'
import undoable from 'redux-undo'
import moves from './movesReducer'
import move from './moveReducer'
......@@ -12,13 +13,15 @@ const chainReducers = (...reducers) => {
}
}
export default chainReducers(
gameReducer,
combineReducers({
moves,
move,
left: towerReducer('left'),
center: towerReducer('center'),
right: towerReducer('right')
})
)
\ No newline at end of file
export default combineReducers({
game: undoable(chainReducers(
gameReducer,
combineReducers({
moves,
move,
left: towerReducer('left'),
center: towerReducer('center'),
right: towerReducer('right')
})
))
})
\ No newline at end of file
import { createStore } from 'redux'
import { createStore, compose, applyMiddleware } from 'redux'
import thunk from 'redux-thunk'
import rootReducer from './reducers'
const store = createStore(
rootReducer,
localStorage.state && JSON.parse(localStorage.state),
window.__REDUX_DEVTOOLS_EXTENSION__ && window.__REDUX_DEVTOOLS_EXTENSION__()
compose(
applyMiddleware(thunk),
window.__REDUX_DEVTOOLS_EXTENSION__ && window.__REDUX_DEVTOOLS_EXTENSION__()
)
)
store.subscribe(() => {
......