diff --git a/App.js b/App.js
index 91a9d74..c0be2cb 100644
--- a/App.js
+++ b/App.js
@@ -7,8 +7,8 @@ import Board from './components/board/board.component';
import Welcome from './components/welcome/welcome.component';
export const SETTINGS = {
- GRID_WIDTH: 3,
- GRID_HEIGHT: 3,
+ GRID_WIDTH: 6,
+ GRID_HEIGHT: 5,
LIVES: 3
};
diff --git a/actions/board/troggle.actions.js b/actions/board/troggle.actions.js
index 0f0c633..f2545d8 100644
--- a/actions/board/troggle.actions.js
+++ b/actions/board/troggle.actions.js
@@ -3,19 +3,16 @@ export const CREATE = 'CREATE';
export const MOVE = 'MOVE';
export const CLEAR_ALL = 'CLEAR_ALL';
-export const create = (x, y) => ({
+export const create = (index) => ({
type: TROGGLE_ACTION,
action: CREATE,
- x: x,
- y: y
+ index: index
});
-export const move = (index, x, y) => ({
+export const move = (index) => ({
type: TROGGLE_ACTION,
action: MOVE,
- index: index,
- x: x,
- y: y
+ index: index
});
export const clearAll = () => ({
diff --git a/components/board/board.component.js b/components/board/board.component.js
index acf010b..ef7acbe 100644
--- a/components/board/board.component.js
+++ b/components/board/board.component.js
@@ -11,40 +11,25 @@ import Muncher from './muncher.component';
import Troggles from './troggles.component';
import ValuesLogic from '../../logic/values.logic.js';
-// import TroggleAI from '../../reducers/TroggleAI';
+import TroggleLogic from '../../logic/troggle.logic.js';
import { SETTINGS } from '../../App';
import * as BoardActions from '../../actions/board/board.actions';
import * as ScorebarActions from '../../actions/board/scorebar.actions';
import * as MessageActions from '../../actions/board/message.actions';
import * as MuncherActions from '../../actions/board/muncher.actions';
-import * as TroggleActions from '../../actions/board/troggle.actions';
-let listener = null;
let nextLevelFlag = false;
export default class Board extends Component {
- refocus() {
- this.props.dispatch(MessageActions.hide());
- ReactDOM.findDOMNode(this.refs.muncher).focus();
- };
-
componentDidMount() {
- ReactDOM.findDOMNode(this.refs.muncher).focus();
- listener = this.refocus.bind(this);
- window.addEventListener('click', listener);
this.nextLevel();
};
- componentWillUnmount() {
- window.removeEventListener('keydown', listener);
- };
-
nextLevel() {
this.props.dispatch(BoardActions.nextLevel());
- // this.props.dispatch(TroggleActions.clearAll());
- // this.clearTroggleTimers();
- // this.createTroggles();
+ TroggleLogic.clearAll(this.props.dispatch);
+ TroggleLogic.createTroggles(this.props.dispatch);
};
messageNext() {
@@ -78,7 +63,13 @@ export default class Board extends Component {
this.props.dispatch(ScorebarActions.munchFailed());
ReactDOM.findDOMNode(this.refs.message).focus();
}
-
+ //
+ // if (troggles[i].x === muncher.x && troggles[i].y === muncher.y) {
+ // this.props.dispatch(MessageActions.show("You've been eaten by a troggle!"));
+ // this.props.dispatch(ScorebarActions.munchFailed());
+ // TroggleLogic.frozen = true;
+ // ReactDOM.findDOMNode(this.refs.message).focus();
+ // }
};
render() {
@@ -88,6 +79,7 @@ export default class Board extends Component {
+
);
};
};
diff --git a/components/board/message.component.js b/components/board/message.component.js
index 496f3a8..c15b767 100644
--- a/components/board/message.component.js
+++ b/components/board/message.component.js
@@ -2,8 +2,24 @@ require('../../sass/board/message.scss');
import { Component } from 'react';
import { connect } from 'react-redux';
+import * as MessageActions from '../../actions/board/message.actions';
+
+let refocusListener = null;
export class Message extends Component {
+ componentDidMount() {
+ refocusListener = this.refocus.bind(this);
+ window.addEventListener('click', refocusListener);
+ };
+
+ componentWillUnmount() {
+ window.removeEventListener('click', refocusListener);
+ };
+
+ refocus() {
+ this.props.dispatch(MessageActions.hide());
+ };
+
keydown(e) {
if (e.keyCode === 32) {
this.props.next();
diff --git a/components/board/muncher.component.js b/components/board/muncher.component.js
index a400bc7..310586c 100644
--- a/components/board/muncher.component.js
+++ b/components/board/muncher.component.js
@@ -5,7 +5,23 @@ import { connect } from 'react-redux';
import * as MuncherActions from '../../actions/board/muncher.actions';
import { SETTINGS } from '../../App';
+let focusListener = null;
+
export class Muncher extends Component {
+ componentDidMount() {
+ this.focus();
+ focusListener = this.focus.bind(this);
+ window.addEventListener('click', focusListener);
+ };
+
+ componentWillUnmount() {
+ window.removeEventListener('click', focusListener);
+ };
+
+ focus() {
+ ReactDOM.findDOMNode(this).focus();
+ };
+
keydown(e) {
const x = this.props.x;
const y = this.props.y;
diff --git a/components/board/troggles.component.js b/components/board/troggles.component.js
index ad092d4..91df776 100644
--- a/components/board/troggles.component.js
+++ b/components/board/troggles.component.js
@@ -1,68 +1,32 @@
require('../../sass/board/troggle.scss');
import { Component } from 'react';
+import { connect } from 'react-redux';
-const troggleMoveTimers = [];
-const troggleCreateTimers = [];
+import Troggle from './troggle.component';
+import TroggleLogic from '../../logic/troggle.logic.js';
-export default class Troggles extends Component {
+export class Troggles extends Component {
componentWillUnmount() {
- // this.clearTroggleTimers();
- }
-
- // clearTroggleTimers() {
- // troggleMoveTimers.forEach((timer) => {
- // clearTimeout(timer);
- // });
- //
- // troggleCreateTimers.forEach((timer) => {
- // clearTimeout(timer);
- // });
- // };
- //
- // createTroggle(index) {
- // const newCoords = TroggleAI.create();
- // this.props.dispatch(TroggleActions.create(newCoords.x, newCoords.y));
- // troggleMoveTimers.push(setTimeout(this.moveTroggle.bind(this, index), 1000));
- // };
- //
- // createTroggles() {
- // const troggleCount = 3; //Math.min(Math.ceil(this.props.board.level / 2), 5);
- // for (let i = 0; i < troggleCount; i++) {
- // setTimeout(this.createTroggle.bind(this, i), (i + 1) * 5000);
- // }
- // };
- //
- // moveTroggle(index) {
- // const newCoords = TroggleAI.move(
- // this.props.troggles[index].x,
- // this.props.troggles[index].y,
- // this.props.muncher.x,
- // this.props.muncher.y
- // );
- //
- // if (newCoords.x === this.props.muncher.x && newCoords.y === this.props.muncher.y) {
- // this.props.dispatch(MessageActions.show("You've been eaten by a troggle!"));
- // this.props.dispatch(TroggleActions.clearAll());
- // }
- // else {
- // this.props.dispatch(TroggleActions.move(index, newCoords.x, newCoords.y));
- // clearTimeout(troggleMoveTimers[index]);
- // troggleMoveTimers[index] = setTimeout(this.moveTroggle.bind(this, index), 1000);
- // }
- // };
+ TroggleLogic.clearTimers();
+ };
render() {
- const classname = ['troggle', 'x' + this.props.x, 'y' + this.props.y];
+ const { troggles, muncher } = this.props;
- // const troggleElements = [];
- // for (let i = 0; i < troggles.length; i++) {
- // troggleElements[i] = ;
- // }
- // {troggleElements}
+ const troggleElements = Array.from(Array(troggles.length), (v, i) => {
+ return ;
+ });
- return (
-
- );
+ return {troggleElements}
};
};
+
+const select = (state) => {
+ return {
+ troggles: state.troggles,
+ muncher: state.muncher
+ };
+}
+
+export default connect(select)(Troggles);
diff --git a/index.js b/index.js
index 5d7cba3..7bcc0a7 100644
--- a/index.js
+++ b/index.js
@@ -11,7 +11,7 @@ import boardReducer from './reducers/board/board.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 troggleReducer from './reducers/board/troggle.reducer';
const reducers = combineReducers({
mode: modeReducer,
@@ -19,8 +19,8 @@ const reducers = combineReducers({
muncher: muncherReducer,
scorebar: scorebarReducer,
board: boardReducer,
- message: messageReducer
- // troggles: troggleReducer
+ message: messageReducer,
+ troggles: troggleReducer
});
const store = createStore(reducers);
diff --git a/logic/troggle.logic.js b/logic/troggle.logic.js
index 08e6a74..1fe951c 100644
--- a/logic/troggle.logic.js
+++ b/logic/troggle.logic.js
@@ -1,7 +1,53 @@
import { SETTINGS } from '../App';
+import * as TroggleActions from '../actions/board/troggle.actions';
+
+const troggleMoveTimers = [];
+const troggleCreateTimers = [];
+
const TroggleLogic = {
- move: function(currX, currY, muncherX, muncherY) {
+ frozen: false,
+
+ clearAll(dispatch) {
+ dispatch(TroggleActions.clearAll());
+
+ troggleMoveTimers.forEach((timer) => {
+ clearTimeout(timer);
+ });
+
+ troggleCreateTimers.forEach((timer) => {
+ clearTimeout(timer);
+ });
+ },
+
+ createTroggle(index, dispatch) {
+ dispatch(TroggleActions.create(index));
+
+ const ref = this.moveTroggle.bind(this, index, dispatch);
+ troggleMoveTimers[index] = setTimeout(ref, 1000);
+ },
+
+ createTroggles(dispatch, level) {
+ // const count = Math.min(Math.ceil((level + 1) / 2), 5);
+ const count = 3;
+
+ for (let index = 0; index < count; index++) {
+ const ref = this.createTroggle.bind(this, index, dispatch);
+ troggleCreateTimers[index] = setTimeout(ref, (index) * 1000);
+ // troggleCreateTimers[index] = setTimeout(ref, (index + 1) * 5000);
+ }
+ },
+
+ moveTroggle(index, dispatch) {
+ if (this.frozen === false) {
+ dispatch(TroggleActions.move(index));
+ }
+
+ const ref = this.moveTroggle.bind(this, index, dispatch);
+ troggleMoveTimers[index] = setTimeout(ref, 1000);
+ },
+
+ getMoveCoords(currX, currY, muncherX, muncherY) {
// Randomize movement with boolean flags.
const moveToAttack = Boolean(Math.round(Math.random()));
const moveAlongXAxis = Boolean(Math.round(Math.random()));
@@ -47,7 +93,7 @@ const TroggleLogic = {
return { x: newX, y: newY };
},
- create: function() {
+ getStartingCoords() {
// Start outside grid at a randomized location.
const enterOnXAxis = Boolean(Math.round(Math.random()));
const enterFromPositive = Boolean(Math.round(Math.random()));
@@ -71,4 +117,4 @@ const TroggleLogic = {
}
};
-export default TroggleAI;
+export default TroggleLogic;
diff --git a/reducers/board/message.reducer.js b/reducers/board/message.reducer.js
index 1a5cc14..7eff970 100644
--- a/reducers/board/message.reducer.js
+++ b/reducers/board/message.reducer.js
@@ -12,6 +12,7 @@ const exclamations = [
];
import * as MessageActions from '../../actions/board/message.actions';
+import TroggleLogic from '../../logic/troggle.logic.js';
const initial = { message: '', hidden: true };
@@ -22,6 +23,7 @@ const reducer = (state = initial, action) => {
switch (action.action) {
case MessageActions.EXCLAIM:
+ TroggleLogic.frozen = true;
const msg = exclamations[Math.floor(Math.random() * exclamations.length)];
return Immutable.Map(state)
.set('hidden', false)
@@ -29,12 +31,14 @@ const reducer = (state = initial, action) => {
.toObject();
case MessageActions.SHOW:
+ TroggleLogic.frozen = true;
return Immutable.Map(state)
.set('hidden', false)
.set('message', action.message)
.toObject();
case MessageActions.HIDE:
+ TroggleLogic.frozen = false;
return Immutable.Map(state)
.set('hidden', true)
.toObject();
diff --git a/reducers/board/troggle.reducer.js b/reducers/board/troggle.reducer.js
index 6aed5ba..1d1a890 100644
--- a/reducers/board/troggle.reducer.js
+++ b/reducers/board/troggle.reducer.js
@@ -1,6 +1,8 @@
const Immutable = require('immutable');
import * as TroggleActions from '../../actions/board/troggle.actions';
+import TroggleLogic from '../../logic/troggle.logic.js';
+
const initial = [];
const reducer = (state = initial, action) => {
@@ -10,13 +12,17 @@ const reducer = (state = initial, action) => {
switch (action.action) {
case TroggleActions.MOVE:
+ const t = state[action.index];
+ const coords1 = TroggleLogic.getMoveCoords(t.x, t.y, t.mx, t.my);
+
return Immutable.fromJS(state)
- .setIn([action.index, 'x'], action.x)
- .setIn([action.index, 'y'], action.y)
+ .setIn([action.index, 'x'], coords1.x)
+ .setIn([action.index, 'y'], coords1.y)
.toJS();
case TroggleActions.CREATE:
- return Immutable.List(state).push({ x: action.x, y: action.y }).toArray();
+ const coords2 = TroggleLogic.getStartingCoords();
+ return Immutable.List(state).set(action.index, { x: coords2.x, y: coords2.y }).toArray();
case TroggleActions.CLEAR_ALL:
return Immutable.List().toArray();