back function

src/components/Board/index.tsx

@@ -10,7 +10,7 @@ import { BoardStyles } from './styles';
 
 import Board from '../../game/board';
 import { store } from '../../redux/store';
-import { saveGameState } from '../../redux/action';
+import { updateGame, updateHistory } from '../../redux/action';
 import { keygen } from '../../utils/keygen';
 import { Direction } from '../../utils/enums';
 import { GameConfig } from '../../utils/types';
@@ -21,19 +21,22 @@ interface ReduxProps {
 
 class BoardView extends React.Component<ReduxProps> {
 
-    constructor(props) {
-        super(props);
-
-        if (props.game === null)
-            store.dispatch(saveGameState({ ...new Board(4) }));
-    }
-
     swipe = (direction: Direction): void => {
         let temp = { ...this.props.game };
+        // update history
+        store.dispatch(updateHistory({ ...temp }));
+        console.log(temp);
+
+        // perform swipe
         Board.swipe(temp, direction);
+
+        // validate board
         if (!Board.validate(temp))
-            console.log('e')
-        store.dispatch(saveGameState(temp));
+            console.log('e');
+
+        // save game config
+        store.dispatch(updateGame(temp));
+        console.log(temp);
     }
 
     render() {

src/game/board.ts

@@ -10,6 +10,7 @@ export default class Board {
 
     constructor(dim: number) {
         this.dim = dim;
+        this.score = 0;
 
         for (let i = 0; i < dim; ++i) {
             let row = [];

src/redux/action.ts

@@ -2,15 +2,21 @@ import { ActionType, GameConfig, RecordType, } from '../utils/types';
 
 export enum ActionName {
     SAVE_GAME_STATE,
+    SAVE_HISTORY,
     SAVE_RECORDS,
 }
 
-export const updateRecords = (payload: Array<RecordType>): ActionType => ({
-    type: ActionName.SAVE_RECORDS,
-    payload
+export const updateGame = (payload: GameConfig): ActionType => ({
+    type: ActionName.SAVE_GAME_STATE,
+    payload,
 });
 
-export const saveGameState = (payload: GameConfig): ActionType => ({
-    type: ActionName.SAVE_GAME_STATE,
+export const updateHistory = (payload: GameConfig): ActionType => ({
+    type: ActionName.SAVE_HISTORY,
+    payload,
+});
+
+export const updateRecords = (payload: Array<RecordType>): ActionType => ({
+    type: ActionName.SAVE_RECORDS,
     payload,
 });

src/redux/reducer.ts

@@ -4,6 +4,9 @@ import { ActionName } from './action';
 
 import { ActionType, GameConfig, RecordType } from '../utils/types';
 
+const saveHistory = (board: GameConfig = null, action: ActionType) => 
+    action.type === ActionName.SAVE_HISTORY ? action.payload : board;
+
 const saveGame = (board: GameConfig = null, action: ActionType) => 
     action.type === ActionName.SAVE_GAME_STATE ? action.payload : board;
 
@@ -12,5 +15,6 @@ const saveRecords = (records: Array<RecordType> = [], action: ActionType) =>
 
 export default combineReducers({
     game: saveGame,
+    history: saveHistory,
     records: saveRecords,
 })

src/screens/main.tsx

@@ -10,7 +10,7 @@ import { darktheme } from '../data/color';
 import { MainStyles, ScreenStyles } from './styles';
 
 import Board from '../game/board';
-import { saveGameState } from '../redux/action';
+import { updateGame, updateHistory } from '../redux/action';
 import { store } from '../redux/store';
 import { GameConfig } from '../utils/types';
 
@@ -20,11 +20,30 @@ interface NavProps {
 
 interface ReduxProps {
     game: GameConfig,
+    history: GameConfig,
 }
 
 class Screen extends React.Component<NavProps & ReduxProps> {
 
-    newGame = () => store.dispatch(saveGameState({ ...new Board(4) }));
+    constructor(props) {
+        super(props);
+
+        if (props.game === null)
+            store.dispatch(updateGame({ ...new Board(4) }));
+    }
+
+    back = () => {
+        if (this.props.history !== null) {
+            let curGame = { ...this.props.game };
+            store.dispatch(updateGame(this.props.history));
+            store.dispatch(updateHistory(curGame));
+        }
+    }
+
+    newGame = () => {
+        store.dispatch(updateGame({ ...new Board(4) }));
+        store.dispatch(updateHistory(null));
+    }
 
     render() {
         return (
@@ -52,7 +71,7 @@ class Screen extends React.Component<NavProps & ReduxProps> {
                 </View>
                 <View style={MainStyles.functionBarOuter}>
                     <View style={MainStyles.functionBar}>
-                        <TouchableOpacity onPress={() => { }}>
+                        <TouchableOpacity onPress={this.back}>
                             <Icon color={darktheme.btnColor} name='backup-restore' size={40} />
                         </TouchableOpacity>
                         <TouchableOpacity onPress={this.newGame}>
@@ -74,6 +93,7 @@ class Screen extends React.Component<NavProps & ReduxProps> {
 
 const mapStateToProps = state => ({
     game: state.game,
+    history: state.history,
 });
 
 export default connect(mapStateToProps)(Screen);