Titlebar connected.

actions/board/board.actions.js

@@ -1,35 +0,0 @@
-export const BOARD_ACTION = 'BOARD_ACTION';
-export const GENERATE = 'GENERATE';
-export const UPDATE = 'UPDATE';
-export const HIDE = 'HIDE';
-export const SHOW = 'SHOW';
-export const NEXT_LEVEL = 'NEXT_LEVEL';
-
-export const generateValues = () => ({
-    type: BOARD_ACTION,
-    action: GENERATE
-});
-
-export const updateValue = (index, value) => ({
-    type: BOARD_ACTION,
-    action: UPDATE,
-    index: index,
-    value: value
-});
-
-export const showValue = (index) => ({
-    type: BOARD_ACTION,
-    action: SHOW,
-    index: index
-});
-
-export const hideValue = (index) => ({
-    type: BOARD_ACTION,
-    action: HIDE,
-    index: index
-});
-
-export const nextLevel = () => ({
-    type: BOARD_ACTION,
-    action: NEXT_LEVEL
-});

actions/board/grid.actions.js

@@ -1,11 +1,7 @@
 export const GRID_ACTION = 'GRID_ACTION';
-export const UPDATE = 'UPDATE';
+export const UPDATE = 'GRID_UPDATE';
 
-const GridActions = {
-    update: () => ({
+export const update = () => ({
     type: GRID_ACTION,
     action: UPDATE
-    })
-};
-
-export default GridActions;
+});

actions/board/muncher.actions.js

@@ -1,5 +1,5 @@
 export const MUNCHER_ACTION = 'MUNCHER_ACTION';
-export const UPDATE = 'UPDATE';
+export const UPDATE = 'MUNCHER_UPDATE';
 
 export const update = () => ({
     type: MUNCHER_ACTION,

actions/board/scorebar.actions.js

@@ -1,6 +1,6 @@
 export const SCOREBAR_ACTION = 'SCOREBAR_ACTION';
-export const MUNCH_SUCCEEDED = 'MUNCH_SUCCEEDED';
-export const MUNCH_FAILED = 'MUNCH_FAILED';
+export const MUNCH_SUCCEEDED = 'SCOREBAR_MUNCH_SUCCEEDED';
+export const MUNCH_FAILED = 'SCOREBAR_MUNCH_FAILED';
 
 export const munchSucceeded = () => ({
     type: SCOREBAR_ACTION,

actions/board/titlebar.actions.js

@@ -0,0 +1,8 @@
+export const TITLEBAR_ACTION = 'TITLEBAR_ACTION';
+export const UPDATE = 'TITLEBAR_UPDATE';
+
+export const update = (text) => ({
+    type: TITLEBAR_ACTION,
+    action: UPDATE,
+    text: text
+});

actions/board/troggle.actions.js

@@ -1,7 +1,7 @@
 export const TROGGLE_ACTION = 'TROGGLE_ACTION';
-export const CREATE = 'CREATE';
-export const MOVE = 'MOVE';
-export const CLEAR_ALL = 'CLEAR_ALL';
+export const CREATE = 'TROGGLE_CREATE';
+export const MOVE = 'TROGGLE_MOVE';
+export const CLEAR_ALL = 'TROGGLE_CLEAR_ALL';
 
 export const create = (index) => ({
     type: TROGGLE_ACTION,

components/board/titlebar.component.js

@@ -1,9 +1,18 @@
 require('../../sass/board/titlebar.scss');
 
 import { Component } from 'react';
+import { connect } from 'react-redux';
 
-export default class Titlebar extends Component {
+export class Titlebar extends Component {
     render() {
-        return (<div className='titlebar'>Connect titlebar</div>);
+        return (<div className='titlebar'>{this.props.title}</div>);
     };
 };
+
+const select = (state) => {
+    return {
+        title: state.titlebar
+    }
+};
+
+export default connect(select)(Titlebar);

controllers/board.controller.js

@@ -7,8 +7,9 @@ import TroggleCtrl from './troggle.controller';
 import MessageCtrl from './message.controller';
 import MuncherCtrl from './muncher.controller';
 import GridCtrl from './grid.controller';
+import TitlebarCtrl from './titlebar.controller';
 
-const level = 0;
+let level = -1;
 let dispatch;
 
 const BoardCtrl = {
@@ -16,6 +17,7 @@ const BoardCtrl = {
         dispatch = d;
         GridCtrl.setDispatch(d);
         MuncherCtrl.setDispatch(d);
+        TitlebarCtrl.setDispatch(d);
     },
 
     munch() {
@@ -50,7 +52,9 @@ const BoardCtrl = {
     },
 
     nextLevel() {
+        level++;
         GridCtrl.generateValues(level);
+        TitlebarCtrl.setTitle(level);
     //     TroggleCtrl.clearAll(this.props.dispatch);
     //     TroggleCtrl.createTroggles(this.props.dispatch);
     },

controllers/grid.controller.js

@@ -1,4 +1,4 @@
-import GridActions from '../actions/board/grid.actions';
+import * as GridActions from '../actions/board/grid.actions';
 import ValuesCtrl from './values.controller';
 import { SETTINGS } from '../App';
 

controllers/titlebar.controller.js

@@ -0,0 +1,15 @@
+import * as TitlebarActions from '../actions/board/titlebar.actions';
+import ValuesCtrl from './values.controller';
+
+let dispatch;
+
+const TitlebarCtrl = {
+    setDispatch: d => dispatch = d,
+
+    setTitle: (level) => {
+        const title = ValuesCtrl.getTitle(level);
+        dispatch(TitlebarActions.update(title));
+    }
+};
+
+export default TitlebarCtrl;

controllers/values.controller.js

@@ -20,7 +20,7 @@ const ValuesCtrl = {
         return values;
     },
 
-    getDescription(level) {
+    getTitle(level) {
         return `Multiples of ${level + 2}`;
     },
 

index.js

@@ -7,22 +7,22 @@ import { Provider } from 'react-redux';
 import App from './App';
 import modeReducer from './reducers/mode.reducer';
 import newgameReducer from './reducers/welcome/new-game.reducer';
-import boardReducer from './reducers/board/board.reducer';
 import gridReducer from './reducers/board/grid.reducer';
 import muncherReducer from './reducers/board/muncher.reducer';
 import scorebarReducer from './reducers/board/scorebar.reducer';
 import messageReducer from './reducers/board/message.reducer';
 import troggleReducer from './reducers/board/troggle.reducer';
+import titlebarReducer from './reducers/board/titlebar.reducer';
 
 const reducers = combineReducers({
     mode: modeReducer,
     newgame: newgameReducer,
     muncher: muncherReducer,
     scorebar: scorebarReducer,
-    board: boardReducer,
     message: messageReducer,
     troggles: troggleReducer,
-    grid: gridReducer
+    grid: gridReducer,
+    titlebar: titlebarReducer
 });
 
 const store = createStore(reducers);

reducers/board/board.reducer.js

@@ -1,42 +0,0 @@
-const Immutable = require('immutable');
-
-import * as BoardActions from '../../actions/board/board.actions';
-import ValuesController from '../../controllers/values.controller.js';
-import { SETTINGS } from '../../App';
-
-const initial = {
-    level: -1,
-    values: [],
-    title: 'Setting up...'
-};
-
-const count = SETTINGS.GRID_WIDTH * SETTINGS.GRID_HEIGHT;
-
-const reducer = (state = initial, action) => {
-    if (action.type !== BoardActions.BOARD_ACTION) {
-        return state;
-    }
-
-    switch (action.action) {
-        case BoardActions.UPDATE:
-            return Immutable.fromJS(state).setIn(['values', action.index, 'value'], action.value).toJS();
-
-        case BoardActions.SHOW:
-            return Immutable.fromJS(state).setIn(['values', action.index, 'show'], true).toJS();
-
-        case BoardActions.HIDE:
-            return Immutable.fromJS(state).setIn(['values', action.index, 'show'], false).toJS();
-
-        case BoardActions.NEXT_LEVEL:
-            const lvl = state.level + 1;
-            return Immutable.Map(state)
-                .set('level', lvl)
-                .set('title', ValuesController.getDescription(lvl))
-                .set('values', ValuesController.generate(count, lvl))
-                .toObject();
-    }
-
-    return state;
-};
-
-export default reducer;

reducers/board/titlebar.reducer.js

@@ -0,0 +1,19 @@
+const Immutable = require('immutable');
+
+import * as TitlebarActions from '../../actions/board/titlebar.actions';
+
+const initial = '';
+
+const reducer = (state = initial, action) => {
+    if (action.type !== TitlebarActions.TITLEBAR_ACTION) {
+        return state;
+    }
+
+    if (action.action === TitlebarActions.UPDATE) {
+        return action.text;
+    }
+
+    return state;
+};
+
+export default reducer;