From 3194cb87289cf8ae751b66d4367f23c40670ed85 Mon Sep 17 00:00:00 2001 From: Ben Burlingham Date: Sun, 17 Apr 2016 15:24:16 -0700 Subject: [PATCH] Folder structure finalized in light of redux rework. --- .gitignore | 1 + App.js | 35 +++++++++++ actions/board/grid.actions.js | 18 ++++++ actions/board/muncher.actions.js | 32 ++++++++++ actions/board/scorebar.actions.js | 8 +++ actions/mode.actions.js | 14 +++++ actions/welcome/new-game.actions.js | 8 +++ components/board/board.component.js | 31 ++++++++++ .../board/grid-cell.component.js | 0 components/board/grid.component.js | 36 +++++++++++ .../board/message.component.js | 0 .../board/muncher.component.js | 40 ++++++------ components/board/scorebar.component.js | 25 ++++++++ .../board/titlebar.component.js | 0 .../welcome/high-score-entry.component.js | 0 .../welcome/high-scores.component.js | 2 +- components/welcome/new-game.component.js | 51 ++++++++++++++++ components/welcome/welcome.component.js | 19 ++++++ index.js | 29 +++++++++ js/app/App.js | 27 -------- js/app/Constants.js | 23 ------- js/app/Creators.js | 29 --------- js/app/Reducers.js | 61 ------------------- js/app/Settings.js | 4 -- js/board/Board.js | 20 ------ js/board/Grid.js | 47 -------------- js/board/Input.js | 35 ----------- js/board/Scorebar.js | 41 ------------- js/index.js | 24 -------- js/welcome/NewGame.js | 41 ------------- js/welcome/Welcome.js | 39 ------------ npm-debug.log | 24 -------- package.json | 1 + {js/board => reducers}/Values.js | 8 +-- reducers/board/grid.reducer.js | 25 ++++++++ reducers/board/muncher.reducer.js | 26 ++++++++ reducers/board/scorebar.reducer.js | 19 ++++++ reducers/mode.reducer.js | 12 ++++ reducers/welcome/high-scores.reducer.js | 0 reducers/welcome/new-game.reducer.js | 16 +++++ webpack.config.js | 4 +- 41 files changed, 432 insertions(+), 443 deletions(-) create mode 100644 App.js create mode 100644 actions/board/grid.actions.js create mode 100644 actions/board/muncher.actions.js create mode 100644 actions/board/scorebar.actions.js create mode 100644 actions/mode.actions.js create mode 100644 actions/welcome/new-game.actions.js create mode 100644 components/board/board.component.js rename js/board/GridCell.js => components/board/grid-cell.component.js (100%) create mode 100644 components/board/grid.component.js rename js/board/Message.js => components/board/message.component.js (100%) rename js/board/Muncher.js => components/board/muncher.component.js (50%) create mode 100644 components/board/scorebar.component.js rename js/board/Titlebar.js => components/board/titlebar.component.js (100%) rename js/welcome/HighScoreEntry.js => components/welcome/high-score-entry.component.js (100%) rename js/welcome/HighScores.js => components/welcome/high-scores.component.js (93%) create mode 100644 components/welcome/new-game.component.js create mode 100644 components/welcome/welcome.component.js create mode 100644 index.js delete mode 100644 js/app/App.js delete mode 100644 js/app/Constants.js delete mode 100644 js/app/Creators.js delete mode 100644 js/app/Reducers.js delete mode 100644 js/app/Settings.js delete mode 100644 js/board/Board.js delete mode 100644 js/board/Grid.js delete mode 100644 js/board/Input.js delete mode 100644 js/board/Scorebar.js delete mode 100644 js/index.js delete mode 100644 js/welcome/NewGame.js delete mode 100644 js/welcome/Welcome.js delete mode 100644 npm-debug.log rename {js/board => reducers}/Values.js (94%) create mode 100644 reducers/board/grid.reducer.js create mode 100644 reducers/board/muncher.reducer.js create mode 100644 reducers/board/scorebar.reducer.js create mode 100644 reducers/mode.reducer.js create mode 100644 reducers/welcome/high-scores.reducer.js create mode 100644 reducers/welcome/new-game.reducer.js diff --git a/.gitignore b/.gitignore index ecfdfb2..9e51570 100644 --- a/.gitignore +++ b/.gitignore @@ -1,2 +1,3 @@ TODO.txt node_modules +.DS_STORE diff --git a/App.js b/App.js new file mode 100644 index 0000000..4c251eb --- /dev/null +++ b/App.js @@ -0,0 +1,35 @@ +import { Component } from 'react'; +import { connect } from 'react-redux'; + +import * as ModeActions from './actions/mode.actions'; + +import Board from './components/board/board.component'; +import Welcome from './components/welcome/welcome.component'; + +export const SETTINGS = { + GRID_WIDTH: 3, + GRID_HEIGHT: 3, + LIVES: 3 +}; + +export default class App extends Component { + render() { + const { mode, dispatch } = this.props; + console.log(dispatch) + + switch (this.props.mode) { + case ModeActions.WELCOME: + return ; + case ModeActions.BOARD: + return ; + } + }; +}; + +const select = (state) => { + return { + mode: state.mode + } +}; + +export default connect(select)(App); diff --git a/actions/board/grid.actions.js b/actions/board/grid.actions.js new file mode 100644 index 0000000..59b11fe --- /dev/null +++ b/actions/board/grid.actions.js @@ -0,0 +1,18 @@ +// Grid component actions and action creators. +export const GRID_ACTION = 'GRID_ACTION'; +export const GENERATE = 'GENERATE'; +export const UPDATE = 'UPDATE'; + +export const generateValues = (count, level) => ({ + type: GRID_ACTION, + action: GENERATE, + count: count, + level: level +}); + +export const updateValues = (i, level) => ({ + type: GRID_ACTION, + action: UPDATE, + index: i, + level: level +}); diff --git a/actions/board/muncher.actions.js b/actions/board/muncher.actions.js new file mode 100644 index 0000000..b60bc3a --- /dev/null +++ b/actions/board/muncher.actions.js @@ -0,0 +1,32 @@ +// Muncher component actions and action creators. +export const MUNCHER_ACTION = 'MUNCHER_ACTION'; +export const LEFT = 'LEFT'; +export const RIGHT = 'RIGHT'; +export const UP = 'UP'; +export const DOWN = 'DOWN'; +export const MUNCH = 'MUNCH'; + +export const moveLeft = () => ({ + type: MUNCHER_ACTION, + action: LEFT +}); + +export const moveRight = () => ({ + type: MUNCHER_ACTION, + action: RIGHT +}); + +export const moveUp = () => ({ + type: MUNCHER_ACTION, + action: UP +}); + +export const moveDown = () => ({ + type: MUNCHER_ACTION, + action: DOWN +}); + +export const munch = () => ({ + type: MUNCHER_ACTION, + action: MUNCH +}); diff --git a/actions/board/scorebar.actions.js b/actions/board/scorebar.actions.js new file mode 100644 index 0000000..9d08391 --- /dev/null +++ b/actions/board/scorebar.actions.js @@ -0,0 +1,8 @@ +// Scorebar component actions and action creators. +export const SCOREBAR_ACTION = 'SCOREBAR_ACTION'; +export const UPDATE = 'UPDATE'; + +export const update = () => ({ + type: SCOREBAR_ACTION, + action: UPDATE +}); diff --git a/actions/mode.actions.js b/actions/mode.actions.js new file mode 100644 index 0000000..19c8a5a --- /dev/null +++ b/actions/mode.actions.js @@ -0,0 +1,14 @@ +// Game mode actions and action creators. +export const MODE_ACTION = 'MODE_ACTION'; +export const WELCOME = 'WELCOME'; +export const BOARD = 'BOARD'; + +export const welcomeMode = () => ({ + type: MODE_ACTION, + action: WELCOME +}); + +export const boardMode = () => ({ + type: MODE_ACTION, + action: BOARD +}); diff --git a/actions/welcome/new-game.actions.js b/actions/welcome/new-game.actions.js new file mode 100644 index 0000000..8622a33 --- /dev/null +++ b/actions/welcome/new-game.actions.js @@ -0,0 +1,8 @@ +// New game component actions and action creators. +export const NEWGAME_ACTION = 'NEWGAME_ACTION'; +export const BLINK = 'BLINK'; + +export const blink = () => ({ + type: NEWGAME_ACTION, + action: BLINK +}); diff --git a/components/board/board.component.js b/components/board/board.component.js new file mode 100644 index 0000000..95319a7 --- /dev/null +++ b/components/board/board.component.js @@ -0,0 +1,31 @@ +require('../../sass/board/board.scss'); + +import { Component } from 'react'; +import Scorebar from './scorebar.component'; +// import Titlebar from './Titlebar'; +import Grid from './grid.component'; +// import Message from './Message'; +import Muncher from './muncher.component'; + +import * as GridActions from '../../actions/board/grid.actions'; +import * as MuncherActions from '../../actions/board/muncher.actions'; +import * as ScorebarActions from '../../actions/board/scorebar.actions'; + +export default class Board extends Component { + // A "munch" event affects several children. It needs a dispatch reference. + munch() { + this.props.dispatch(GridActions.updateValues(0, 0)); + this.props.dispatch(MuncherActions.munch()); + this.props.dispatch(ScorebarActions.update()); + }; + + render() { + // + // + return (
+ + + +
); + }; +}; diff --git a/js/board/GridCell.js b/components/board/grid-cell.component.js similarity index 100% rename from js/board/GridCell.js rename to components/board/grid-cell.component.js diff --git a/components/board/grid.component.js b/components/board/grid.component.js new file mode 100644 index 0000000..2a62608 --- /dev/null +++ b/components/board/grid.component.js @@ -0,0 +1,36 @@ +require('../../sass/board/grid.scss'); + +import { Component } from 'react'; +import { connect } from 'react-redux'; +import GridCell from './grid-cell.component'; +import * as Actions from '../../actions/board/grid.actions'; +import { SETTINGS } from '../../App'; + +export default class Grid extends Component { + componentDidMount(n) { + this.props.dispatch(Actions.generateValues(SETTINGS.GRID_WIDTH * SETTINGS.GRID_HEIGHT, 1)); + }; + + render() { + const { values } = this.props; + const cells = []; + let i; + + for (let x = 0; x < SETTINGS.GRID_WIDTH; x++) { + for (let y = 0; y < SETTINGS.GRID_HEIGHT; y++) { + i = y * SETTINGS.GRID_WIDTH + x; + cells.push(); + } + } + + return (
{cells}
); + }; +}; + +const select = (state) => { + return { + values: state.grid + } +}; + +export default connect(select)(Grid); diff --git a/js/board/Message.js b/components/board/message.component.js similarity index 100% rename from js/board/Message.js rename to components/board/message.component.js diff --git a/js/board/Muncher.js b/components/board/muncher.component.js similarity index 50% rename from js/board/Muncher.js rename to components/board/muncher.component.js index e794ff7..92f8029 100644 --- a/js/board/Muncher.js +++ b/components/board/muncher.component.js @@ -2,8 +2,8 @@ require('../../sass/board/muncher.scss'); import { Component } from 'react'; import { connect } from 'react-redux'; -import { MUNCHER } from '../app/Constants'; -import * as creators from '../app/Creators'; +import * as Actions from '../../actions/board/muncher.actions'; +import { SETTINGS } from '../../App'; let listener = null; @@ -14,29 +14,32 @@ export class Muncher extends Component { switch (e.keyCode) { case 32: - console.warn('munch (leave this here until sure event listener has been removed'); - this.props.dispatch(creators.updateValues(0, 0)); - // var i = y * this.props.width + x; - // - // this.setState({ values: this.state.values }, this.checkComplete); - // State.publish('munch/successful'); - // } - // else { - // State.publish('munch/failed', this.state.values[i]); - // } + this.props.munch(); break; case 37: - this.props.dispatch(creators.moveMuncher(MUNCHER.LEFT)); + if (this.props.x === 0) { + return; + } + this.props.dispatch(Actions.moveLeft()); break; case 38: - this.props.dispatch(creators.moveMuncher(MUNCHER.UP)); + if (this.props.y === 0) { + return; + } + this.props.dispatch(Actions.moveUp()); break; case 39: - this.props.dispatch(creators.moveMuncher(MUNCHER.RIGHT)); + if (this.props.x === SETTINGS.GRID_WIDTH - 1) { + return; + } + this.props.dispatch(Actions.moveRight()); break; case 40: - this.props.dispatch(creators.moveMuncher(MUNCHER.DOWN)); + if (this.props.y === SETTINGS.GRID_HEIGHT - 1) { + return; + } + this.props.dispatch(Actions.moveDown()); break; } }; @@ -60,10 +63,7 @@ export class Muncher extends Component { }; const select = (state) => { - return { - x: state.muncher.x, - y: state.muncher.y - } + return state.muncher; }; export default connect(select)(Muncher); diff --git a/components/board/scorebar.component.js b/components/board/scorebar.component.js new file mode 100644 index 0000000..e27e7a3 --- /dev/null +++ b/components/board/scorebar.component.js @@ -0,0 +1,25 @@ +require('../../sass/board/scorebar.scss'); + +import { Component } from 'react'; +import { connect } from 'react-redux'; + +export default class Scorebar extends Component { + render() { + var lives = []; + for (var i = 0; i < this.props.lives; i++) { + lives.push(
); + } + + return (
+
{this.props.current}
+
{this.props.high}
+
{lives}
+
); + }; +}; + +const select = (state) => { + return state.scorebar; +}; + +export default connect(select)(Scorebar); diff --git a/js/board/Titlebar.js b/components/board/titlebar.component.js similarity index 100% rename from js/board/Titlebar.js rename to components/board/titlebar.component.js diff --git a/js/welcome/HighScoreEntry.js b/components/welcome/high-score-entry.component.js similarity index 100% rename from js/welcome/HighScoreEntry.js rename to components/welcome/high-score-entry.component.js diff --git a/js/welcome/HighScores.js b/components/welcome/high-scores.component.js similarity index 93% rename from js/welcome/HighScores.js rename to components/welcome/high-scores.component.js index f4d2808..19868fc 100644 --- a/js/welcome/HighScores.js +++ b/components/welcome/high-scores.component.js @@ -1,7 +1,7 @@ require('../../sass/welcome/highscores.scss'); import { Component } from 'react'; -import HighScoreEntry from './HighScoreEntry'; +import HighScoreEntry from './high-score-entry.component'; export default class HighScores extends Component { render() { diff --git a/components/welcome/new-game.component.js b/components/welcome/new-game.component.js new file mode 100644 index 0000000..4038e16 --- /dev/null +++ b/components/welcome/new-game.component.js @@ -0,0 +1,51 @@ +import { Component } from 'react'; +import { connect } from 'react-redux'; + +import * as ModeActions from '../../actions/mode.actions'; +import * as NewGameActions from '../../actions/welcome/new-game.actions'; + +let blinkTimer = null; +let newgameListener = null; + +const toggleTimeout = function() { + var hidden = this.props.blink; + this.props.dispatch(NewGameActions.blink()); + blinkTimer = setTimeout(toggleTimeout.bind(this), 600); +}; + +export default class NewGame extends Component { + componentDidMount() { + newgameListener = this.handleKeydown.bind(this); + window.addEventListener('keydown', newgameListener); + // toggleTimeout.call(this); + }; + + componentWillUnmount() { + window.removeEventListener('keydown', newgameListener); + clearTimeout(blinkTimer); + }; + + handleKeydown(e) { + if (e.keyCode === 32) { + this.props.dispatch(ModeActions.boardMode()); + } + }; + + render() { + const classname = ['newgame']; + + if (this.props.blink === true) { + classname.push('hidden'); + } + + return ( +
Press Space Bar To Play
+ ); + }; +}; +// +// const select = (state) => { +// return state.newgame; +// }; +// +// export default connect(select)(NewGame); diff --git a/components/welcome/welcome.component.js b/components/welcome/welcome.component.js new file mode 100644 index 0000000..93906f6 --- /dev/null +++ b/components/welcome/welcome.component.js @@ -0,0 +1,19 @@ +require('../../sass/welcome/welcome.scss'); + +import { Component } from 'react'; + +import NewGame from './new-game.component'; +import HighScores from './high-scores.component'; + +export default class Welcome extends Component { + + render() { + return ( +
+ + + +
+ ); + }; +}; diff --git a/index.js b/index.js new file mode 100644 index 0000000..4332794 --- /dev/null +++ b/index.js @@ -0,0 +1,29 @@ +require('./sass/reset.scss'); + +import { render } from 'react-dom'; +import { createStore, combineReducers } from 'redux' +import { Provider } from 'react-redux'; + +import App from './App'; +import modeReducer from './reducers/mode.reducer'; +import newgameReducer from './reducers/welcome/new-game.reducer'; +import gridReducer from './reducers/board/grid.reducer'; +import muncherReducer from './reducers/board/muncher.reducer'; +import scorebarReducer from './reducers/board/scorebar.reducer'; + +const combinedReducers = combineReducers({ + mode: modeReducer, + newgame: newgameReducer, + muncher: muncherReducer, + scorebar: scorebarReducer, + grid: gridReducer +}); + +const store = createStore(combinedReducers); + +ReactDOM.render( + + + , + document.getElementById('app') +); diff --git a/js/app/App.js b/js/app/App.js deleted file mode 100644 index 3128b2f..0000000 --- a/js/app/App.js +++ /dev/null @@ -1,27 +0,0 @@ -import React, { Component } from 'react'; -import { connect } from 'react-redux'; - -import Board from '../board/Board'; -import Welcome from '../welcome/Welcome'; -import { MODE } from './Constants'; - -export class App extends Component { - render() { - const { mode } = this.props; - - switch (mode) { - case MODE.WELCOME: - return ; - case MODE.BOARD: - return ; - } - }; -}; - -const select = (state) => { - return { - mode: state.mode - } -}; - -export default connect(select)(App); diff --git a/js/app/Constants.js b/js/app/Constants.js deleted file mode 100644 index 34a2744..0000000 --- a/js/app/Constants.js +++ /dev/null @@ -1,23 +0,0 @@ -export const MODE = { - WELCOME: 'WELCOME', - BOARD: 'BOARD', - NEXT: 'NEXT' -}; - -export const BLINK = { - TOGGLE: 'TOGGLE' -}; - -export const VALUES = { - FOO: 'FOO', - GENERATE: 'GENERATE', - UPDATE: 'UPDATE' -}; - -export const MUNCHER = { - MOVE: 'MOVE', - LEFT: 'LEFT', - RIGHT: 'RIGHT', - UP: 'UP', - DOWN: 'DOWN' -}; diff --git a/js/app/Creators.js b/js/app/Creators.js deleted file mode 100644 index ee73a7e..0000000 --- a/js/app/Creators.js +++ /dev/null @@ -1,29 +0,0 @@ -import { MODE, BLINK, VALUES, MUNCHER } from './Constants'; - -export const nextMode = - () => ({ type: MODE.NEXT }); - -export const toggleBlink = - () => ({ type: BLINK.TOGGLE }); - -export const generateValues = - (count, level) => ({ - type: VALUES.FOO, - action: VALUES.GENERATE, - count: count, - level: level - }); - -export const updateValues = - (i, level) => ({ - type: VALUES.FOO, - action: VALUES.UPDATE, - index: i, - level: level - }); - -export const moveMuncher = - (direction) => ({ - type: MUNCHER.MOVE, - direction: direction - }); diff --git a/js/app/Reducers.js b/js/app/Reducers.js deleted file mode 100644 index 0230129..0000000 --- a/js/app/Reducers.js +++ /dev/null @@ -1,61 +0,0 @@ -import { MODE, VALUES, BLINK, MUNCHER } from './Constants.js'; - -import { Values } from '../board/Values'; -import { GRID } from './Settings'; - -export const modeReducer = (state = MODE.WELCOME, action) => { - if (action.type === MODE.NEXT) { - switch (state) { - case MODE.BOARD: - return MODE.WELCOME; - case MODE.WELCOME: - return MODE.BOARD; - }; - } - - return MODE.BOARD; -}; - -export const blinkReducer = (state = false, action) => { - if (action.type === BLINK.TOGGLE) { - return (state ? false : true); - } - - return state; -}; - -export const valuesReducer = (state = [], action) => { - if (action.type === VALUES.FOO) { - switch (action.action) { - case VALUES.GENERATE: - return Values.generate(action.count, action.level); - case VALUES.UPDATE: - const valid = Values.validate(state[action.index], action.level); - const results = state.slice(0); - if (valid) { - results[action.index] = ""; - } - return results; - } - } - - return state; -}; - -const muncherInitialState = { x: 0, y: 0 }; -export const muncherReducer = (state = muncherInitialState, action) => { - if (action.type === MUNCHER.MOVE) { - switch (action.direction) { - case MUNCHER.LEFT: - return (state.x > 0 ? { x: state.x - 1, y: state.y } : state); - case MUNCHER.RIGHT: - return (state.x < GRID.W - 1 ? { x: state.x + 1, y: state.y } : state); - case MUNCHER.UP: - return (state.y > 0 ? { x: state.x, y: state.y - 1 } : state); - case MUNCHER.DOWN: - return (state.y < GRID.H - 1 ? { x: state.x, y: state.y + 1 } : state); - }; - } - - return state; - }; diff --git a/js/app/Settings.js b/js/app/Settings.js deleted file mode 100644 index d9e8fb5..0000000 --- a/js/app/Settings.js +++ /dev/null @@ -1,4 +0,0 @@ -export const GRID = { - W: 3, - H: 3 -} diff --git a/js/board/Board.js b/js/board/Board.js deleted file mode 100644 index 5afd137..0000000 --- a/js/board/Board.js +++ /dev/null @@ -1,20 +0,0 @@ -require('../../sass/board/board.scss'); - -import { Component } from 'react'; -import Scorebar from './Scorebar'; -import Titlebar from './Titlebar'; -import Grid from './Grid'; -import Message from './Message'; -import Muncher from './Muncher'; - -export default class Board extends Component { - render() { - return (
- - - - - -
); - } -}; diff --git a/js/board/Grid.js b/js/board/Grid.js deleted file mode 100644 index 25eb60f..0000000 --- a/js/board/Grid.js +++ /dev/null @@ -1,47 +0,0 @@ -require('../../sass/board/grid.scss'); - -import { Component } from 'react'; -import { connect } from 'react-redux'; -import GridCell from './GridCell'; -import * as creators from '../app/Creators'; -import { GRID } from '../app/Settings'; - -export default class Grid extends Component { - componentDidMount(n) { - this.props.dispatch(creators.generateValues(GRID.W * GRID.H, 1)); - // State.subscribe('level/next', this.levelNext); - }; - - checkComplete() { - // if (Values.checkComplete(this.state.values, State.level) === true) { - // State.publish('level/complete'); - // } - }; - - levelNext() { - // this.setState({ values: this.generateValues() }); - }; - - render() { - const { values, dispatch } = this.props; - const cells = []; - let i; - - for (let x = 0; x < GRID.W; x++) { - for (let y = 0; y < GRID.H; y++) { - i = y * GRID.W + x; - cells.push(); - } - } - - return (
{cells}
); - }; -}; - -const select = (state) => { - return { - values: state.values - } -}; - -export default connect(select)(Grid); diff --git a/js/board/Input.js b/js/board/Input.js deleted file mode 100644 index 2471526..0000000 --- a/js/board/Input.js +++ /dev/null @@ -1,35 +0,0 @@ -/** - * THIS is the Board class. - */ -module.exports = { - keydown(e) { - var x = this.refs.muncher.state.x; - var y = this.refs.muncher.state.y; - - switch (e.keyCode) { - case 32: - this.refs.grid.munch(x, y); - break; - - case 37: // Left arrow - if (x > 0) { - this.refs.muncher.setState({ x: x - 1 }); - } - break; - case 38: // Up arrow - if (y > 0) { - this.refs.muncher.setState({ y: y - 1 }); - } - break; - case 39: // Right arrow - if (x < this.refs.grid.props.width - 1) { - this.refs.muncher.setState({ x: x + 1 }); - } - break; - case 40: // Down arrow - if (y < this.refs.grid.props.height - 1) { - this.refs.muncher.setState({ y: y + 1 }); - } - } - } -}; diff --git a/js/board/Scorebar.js b/js/board/Scorebar.js deleted file mode 100644 index b2f6540..0000000 --- a/js/board/Scorebar.js +++ /dev/null @@ -1,41 +0,0 @@ -require('../../sass/board/scorebar.scss'); - -import { Component } from 'react'; - -export default class Scorebar extends Component { - // getInitialState() { - // return { - // currentScore: 0, - // highScore: 0, - // lives: 3 - // }; - // }, - - componentDidMount() { - // // State.subscribe('munch/successful', this.updateScore); - // State.subscribe('munch/failed', this.updateLives); - }; - - updateScore() { - // var score = this.state.currentScore; - // this.setState({ currentScore: score + 10 }); - }; - - updateLives() { - // var lives = this.state.lives; - // this.setState({ lives: lives - 1 }); - }; - - render() { - var lives = []; - for (var i = 0; i < 3; i++) { - lives.push(
); - } - - return (
-
0
-
0
-
{lives}
-
); - }; -}; diff --git a/js/index.js b/js/index.js deleted file mode 100644 index e09a359..0000000 --- a/js/index.js +++ /dev/null @@ -1,24 +0,0 @@ -require('../sass/reset.scss'); - -import { render } from 'react-dom'; -import { createStore, combineReducers } from 'redux' -import { Provider } from 'react-redux'; - -import App from './app/App'; -import * as reducers from './app/Reducers'; - -const combinedReducers = combineReducers({ - mode: reducers.modeReducer, - blink: reducers.blinkReducer, - values: reducers.valuesReducer, - muncher: reducers.muncherReducer -}); - -const store = createStore(combinedReducers); - -ReactDOM.render( - - - , - document.getElementById('app') -); diff --git a/js/welcome/NewGame.js b/js/welcome/NewGame.js deleted file mode 100644 index a469fdb..0000000 --- a/js/welcome/NewGame.js +++ /dev/null @@ -1,41 +0,0 @@ -import { Component } from 'react'; -import { connect } from 'react-redux'; -import * as creators from '../app/Creators.js'; - -let blinkTimer = null; - -const toggleTimeout = function() { - var hidden = this.props.blink; - this.props.dispatch(creators.toggleBlink()); - blinkTimer = setTimeout(toggleTimeout.bind(this), 600); -}; - -export default class NewGame extends Component { - componentDidMount() { - toggleTimeout.call(this); - }; - - componentWillUnmount() { - clearTimeout(blinkTimer); - }; - - render() { - const classname = ['newgame']; - - if (this.props.blink === true) { - classname.push('hidden'); - } - - return ( -
Press Space Bar To Play
- ); - }; -}; - -const select = (state) => { - return { - blink: state.blink - } -}; - -export default connect(select)(NewGame); diff --git a/js/welcome/Welcome.js b/js/welcome/Welcome.js deleted file mode 100644 index 5012e29..0000000 --- a/js/welcome/Welcome.js +++ /dev/null @@ -1,39 +0,0 @@ -require('../../sass/welcome/welcome.scss'); - -import { Component } from 'react'; -import { connect } from 'react-redux'; -import * as creators from '../app/Creators.js'; - -import NewGame from './NewGame'; -import HighScores from './HighScores'; - -let listener = null; - -export class Welcome extends Component { - handleKeydown(e) { - if (e.keyCode === 32) { - this.props.dispatch(creators.nextMode()); - } - }; - - componentDidMount() { - listener = this.handleKeydown.bind(this); - window.addEventListener('keydown', listener); - }; - - componentWillUnmount() { - window.removeEventListener('keydown', listener); - }; - - render() { - return ( -
- - - -
- ); - } -}; - -export default connect(() => ({}))(Welcome); diff --git a/npm-debug.log b/npm-debug.log deleted file mode 100644 index f5eb9d4..0000000 --- a/npm-debug.log +++ /dev/null @@ -1,24 +0,0 @@ -0 info it worked if it ends with ok -1 verbose cli [ '/usr/local/bin/node', '/usr/local/bin/npm', 'run', 'start' ] -2 info using npm@3.7.3 -3 info using node@v5.8.0 -4 verbose stack Error: missing script: start -4 verbose stack at run (/usr/local/lib/node_modules/npm/lib/run-script.js:147:19) -4 verbose stack at /usr/local/lib/node_modules/npm/lib/run-script.js:57:5 -4 verbose stack at /usr/local/lib/node_modules/npm/node_modules/read-package-json/read-json.js:345:5 -4 verbose stack at checkBinReferences_ (/usr/local/lib/node_modules/npm/node_modules/read-package-json/read-json.js:309:45) -4 verbose stack at final (/usr/local/lib/node_modules/npm/node_modules/read-package-json/read-json.js:343:3) -4 verbose stack at then (/usr/local/lib/node_modules/npm/node_modules/read-package-json/read-json.js:113:5) -4 verbose stack at /usr/local/lib/node_modules/npm/node_modules/read-package-json/read-json.js:300:12 -4 verbose stack at /usr/local/lib/node_modules/npm/node_modules/graceful-fs/graceful-fs.js:78:16 -4 verbose stack at tryToString (fs.js:414:3) -4 verbose stack at FSReqWrap.readFileAfterClose [as oncomplete] (fs.js:401:12) -5 verbose cwd /Users/tonklin/Development/bb/number-munchers -6 error Darwin 15.3.0 -7 error argv "/usr/local/bin/node" "/usr/local/bin/npm" "run" "start" -8 error node v5.8.0 -9 error npm v3.7.3 -10 error missing script: start -11 error If you need help, you may report this error at: -11 error -12 verbose exit [ 1, true ] diff --git a/package.json b/package.json index ea4729b..0e65d27 100644 --- a/package.json +++ b/package.json @@ -16,6 +16,7 @@ "css-loader": "^0.23.1", "express": "^4.13.4", "extract-text-webpack-plugin": "^1.0.1", + "immutable": "^3.8.0", "jsx-loader": "^0.13.2", "node-sass": "^3.4.2", "react": "^0.14.7", diff --git a/js/board/Values.js b/reducers/Values.js similarity index 94% rename from js/board/Values.js rename to reducers/Values.js index fc56664..79eb58e 100644 --- a/js/board/Values.js +++ b/reducers/Values.js @@ -1,4 +1,4 @@ -export const Values = { +const Values = { // Anagrams, multiples, equality generate(n) { var values = []; @@ -33,9 +33,7 @@ export const Values = { } return (remaining === 0); - }, - - checkLoss() { - } }; + +export default Values; diff --git a/reducers/board/grid.reducer.js b/reducers/board/grid.reducer.js new file mode 100644 index 0000000..cbb954b --- /dev/null +++ b/reducers/board/grid.reducer.js @@ -0,0 +1,25 @@ +require('immutable'); +import * as GridActions from '../../actions/board/grid.actions'; +import Values from '../Values'; + +const reducer = (state = [], action) => { + if (action.type !== GridActions.GRID_ACTION) { + return state; + } + + switch (action.action) { + case GridActions.GENERATE: + return Values.generate(action.count, action.level); + case GridActions.UPDATE: + // const valid = Values.validate(state[action.index], action.level); + const results = state.slice(0); + // if (valid) { + results[action.index] = ""; + // } + return results; + } + + return state; +}; + +export default reducer; diff --git a/reducers/board/muncher.reducer.js b/reducers/board/muncher.reducer.js new file mode 100644 index 0000000..d27d567 --- /dev/null +++ b/reducers/board/muncher.reducer.js @@ -0,0 +1,26 @@ +require('immutable'); +import * as MuncherActions from '../../actions/board/muncher.actions'; + +const reducer = (state = { x: 0, y: 0 }, action) => { + if (action.type !== MuncherActions.MUNCHER_ACTION) { + return state; + } + + switch (action.action) { + case MuncherActions.LEFT: + return { x: state.x - 1, y: state.y }; + case MuncherActions.RIGHT: + return { x: state.x + 1, y: state.y }; + case MuncherActions.UP: + return { x: state.x, y: state.y - 1 }; + case MuncherActions.DOWN: + return { x: state.x, y: state.y + 1 }; + case MuncherActions.MUNCH: + console.log("Muncher's mouth moved!"); + return state; + } + + return state; +}; + +export default reducer; diff --git a/reducers/board/scorebar.reducer.js b/reducers/board/scorebar.reducer.js new file mode 100644 index 0000000..60be97e --- /dev/null +++ b/reducers/board/scorebar.reducer.js @@ -0,0 +1,19 @@ +require('immutable'); +import * as ScorebarActions from '../../actions/board/scorebar.actions'; +import Values from '../Values'; +import { SETTINGS } from '../../App'; + +const reducer = (state = { current: 100, high: 999, lives: SETTINGS.LIVES }, action) => { + if (action.type !== ScorebarActions.SCOREBAR_ACTION) { + return state; + } + + switch (action.action) { + case ScorebarActions.UPDATE: + return { current: state.current + 10, high: 999 }; + } + + return state; +}; + +export default reducer; diff --git a/reducers/mode.reducer.js b/reducers/mode.reducer.js new file mode 100644 index 0000000..c58e09c --- /dev/null +++ b/reducers/mode.reducer.js @@ -0,0 +1,12 @@ +require('immutable'); +import * as ModeActions from '../actions/mode.actions'; + +const reducer = (state = ModeActions.WELCOME, action) => { + if (action.type !== ModeActions.MODE_ACTION) { + return state; + } + + return action.action; +}; + +export default reducer; diff --git a/reducers/welcome/high-scores.reducer.js b/reducers/welcome/high-scores.reducer.js new file mode 100644 index 0000000..e69de29 diff --git a/reducers/welcome/new-game.reducer.js b/reducers/welcome/new-game.reducer.js new file mode 100644 index 0000000..4c858b2 --- /dev/null +++ b/reducers/welcome/new-game.reducer.js @@ -0,0 +1,16 @@ +require('immutable'); +import * as NewGameActions from '../../actions/welcome/new-game.actions'; + +const reducer = (state = false, action) => { + // if (action.type !== NewGameActions.NEWGAME_ACTION) { + // return state; + // } + // + // if (action.action === NewGameActions.BLINK) { + // return (state ? false : true); + // } + + return false; +}; + +export default reducer; diff --git a/webpack.config.js b/webpack.config.js index 24b0167..752b98d 100644 --- a/webpack.config.js +++ b/webpack.config.js @@ -3,7 +3,7 @@ var ExtractTextPlugin = require('extract-text-webpack-plugin'); function getEntrySources() { var sources = [ - './js/index.js' + './index.js' ]; if (process.env.NODE_ENV !== 'production') { @@ -21,7 +21,7 @@ module.exports = { loaders: [ { test: /\.js$/, - include: __dirname + '/js', + exclude: __dirname + '/node_modules', loader: 'babel', query: { presets: ['react', 'es2015']