diff --git a/App.js b/App.js
index c0be2cb..15b712e 100644
--- a/App.js
+++ b/App.js
@@ -6,13 +6,7 @@ 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: 6,
- GRID_HEIGHT: 5,
- LIVES: 3
-};
-
-export default class App extends Component {
+export class App extends Component {
render() {
const { mode } = this.props;
diff --git a/AppSettings.js b/AppSettings.js
new file mode 100644
index 0000000..c5d63de
--- /dev/null
+++ b/AppSettings.js
@@ -0,0 +1,7 @@
+const SETTINGS = {
+ GRID_WIDTH: 6,
+ GRID_HEIGHT: 5,
+ LIVES: 3
+};
+
+export default SETTINGS;
diff --git a/actions/board/grid.actions.js b/actions/board/grid.actions.js
index e7b5cc0..28f9d4f 100644
--- a/actions/board/grid.actions.js
+++ b/actions/board/grid.actions.js
@@ -1,7 +1,8 @@
export const GRID_ACTION = 'GRID_ACTION';
export const UPDATE = 'GRID_UPDATE';
-export const update = () => ({
+export const update = (values) => ({
type: GRID_ACTION,
- action: UPDATE
+ action: UPDATE,
+ values: values
});
diff --git a/actions/board/muncher.actions.js b/actions/board/muncher.actions.js
index a5b4836..5783b68 100644
--- a/actions/board/muncher.actions.js
+++ b/actions/board/muncher.actions.js
@@ -1,7 +1,9 @@
export const MUNCHER_ACTION = 'MUNCHER_ACTION';
export const UPDATE = 'MUNCHER_UPDATE';
-export const update = () => ({
+export const update = (x, y) => ({
type: MUNCHER_ACTION,
- action: UPDATE
+ action: UPDATE,
+ x: x,
+ y: y
});
diff --git a/actions/board/scorebar.actions.js b/actions/board/scorebar.actions.js
index c78d4b0..b57304b 100644
--- a/actions/board/scorebar.actions.js
+++ b/actions/board/scorebar.actions.js
@@ -1,7 +1,10 @@
export const SCOREBAR_ACTION = 'SCOREBAR_ACTION';
export const UPDATE = 'SCOREBAR_UPDATE';
-export const update = () => ({
+export const update = (lives, currentScore, highScore) => ({
type: SCOREBAR_ACTION,
- action: UPDATE
+ action: UPDATE,
+ lives: lives,
+ currentScore: currentScore,
+ highScore: highScore
});
diff --git a/components/board/grid.component.js b/components/board/grid.component.js
index 21dba36..051ea2f 100644
--- a/components/board/grid.component.js
+++ b/components/board/grid.component.js
@@ -4,7 +4,7 @@ import { Component } from 'react';
import { connect } from 'react-redux';
import GridCell from './grid-cell.component';
-import { SETTINGS } from '../../App';
+import SETTINGS from '../../AppSettings';
export class Grid extends Component {
render() {
diff --git a/components/board/message.component.js b/components/board/message.component.js
index 0fa210e..bb3c95b 100644
--- a/components/board/message.component.js
+++ b/components/board/message.component.js
@@ -2,30 +2,8 @@ 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();
- }
- };
-
render() {
var classname = ['message'];
@@ -33,8 +11,6 @@ export class Message extends Component {
classname.push('hidden');
}
- //
-
return (
{this.props.message}
diff --git a/controllers/board.controller.js b/controllers/board.controller.js
index 8f1de8d..223fbe6 100644
--- a/controllers/board.controller.js
+++ b/controllers/board.controller.js
@@ -1,4 +1,4 @@
-import { SETTINGS } from '../App.js';
+import SETTINGS from '../AppSettings';
import TroggleCtrl from './troggle.controller';
import MessageCtrl from './message.controller';
@@ -46,46 +46,46 @@ const BoardCtrl = {
},
keyListener(e) {
- if (e.keyCode === 32 && ScorebarCtrl.isGameOver()) {
+ if (e.keyCode !== 32 && MessageCtrl.isShowing() === false) {
+ MuncherCtrl.move(e);
+ }
+ else if (ScorebarCtrl.isGameOver()) {
level = -1;
ScorebarCtrl.reset();
MessageCtrl.hide();
TroggleCtrl.unfreeze();
ModeCtrl.welcome();
}
- else if (e.keyCode === 32 && ScorebarCtrl.getLives() === 0) {
+ else if (ScorebarCtrl.getLives() === 0) {
ScorebarCtrl.flagGameOver();
MessageCtrl.show("Game over!");
}
- else if (e.keyCode === 32 && GridCtrl.isCompleted() === true) {
+ else if (GridCtrl.isCompleted() === true) {
this.nextLevel();
TroggleCtrl.unfreeze();
ScorebarCtrl.levelUp(level);
MessageCtrl.hide();
}
- else if (e.keyCode === 32 && BoardCtrl.isCollision() === true) {
- console.log("Creating troggles")
+ else if (BoardCtrl.isCollision() === true) {
collision = false;
TroggleCtrl.clearTroggles();
TroggleCtrl.createTroggles(level);
TroggleCtrl.unfreeze();
MessageCtrl.hide();
}
- else if (e.keyCode === 32 && MessageCtrl.isShowing() === true) {
+ else if (MessageCtrl.isShowing() === true) {
TroggleCtrl.unfreeze();
MessageCtrl.hide();
}
- else if (e.keyCode === 32 && MessageCtrl.isShowing() === false) {
- this.munch();
- }
else if (MessageCtrl.isShowing() === false) {
- MuncherCtrl.move(e);
+ this.munch();
}
},
nextLevel() {
level++;
collision = false;
+ ScorebarCtrl.update();
GridCtrl.generateValues(level);
TitlebarCtrl.setTitle(level);
TroggleCtrl.clearTroggles();
diff --git a/controllers/grid.controller.js b/controllers/grid.controller.js
index 3327fde..6921d82 100644
--- a/controllers/grid.controller.js
+++ b/controllers/grid.controller.js
@@ -1,6 +1,6 @@
import * as GridActions from '../actions/board/grid.actions';
import ValuesCtrl from './values.controller';
-import { SETTINGS } from '../App';
+import SETTINGS from '../AppSettings';
let values;
let dispatch;
@@ -11,7 +11,7 @@ const GridCtrl = {
generateValues: (level) => {
values = ValuesCtrl.generate(SETTINGS.GRID_WIDTH * SETTINGS.GRID_HEIGHT, level);
- dispatch(GridActions.update());
+ dispatch(GridActions.update(values));
},
isCompleted: (level) => {
@@ -20,7 +20,7 @@ const GridCtrl = {
hideValue: (index) => {
values[index].show = false;
- dispatch(GridActions.update());
+ dispatch(GridActions.update(values));
}
};
diff --git a/controllers/muncher.controller.js b/controllers/muncher.controller.js
index e73e838..d02f277 100644
--- a/controllers/muncher.controller.js
+++ b/controllers/muncher.controller.js
@@ -1,6 +1,6 @@
import * as MuncherActions from '../actions/board/muncher.actions';
import BoardCtrl from './board.controller';
-import { SETTINGS } from '../App';
+import SETTINGS from '../AppSettings';
let x = 0;
let y = 0;
@@ -39,7 +39,7 @@ const MuncherCtrl = {
}
if (e.keyCode >= 37 || e.keyCode <= 40) {
- dispatch(MuncherActions.update());
+ dispatch(MuncherActions.update(x, y));
BoardCtrl.checkCollision();
}
}
diff --git a/controllers/scorebar.controller.js b/controllers/scorebar.controller.js
index 037bfe0..5b4d673 100644
--- a/controllers/scorebar.controller.js
+++ b/controllers/scorebar.controller.js
@@ -1,8 +1,8 @@
import * as ScorebarActions from '../actions/board/scorebar.actions';
-import { SETTINGS } from '../App';
+import SETTINGS from '../AppSettings';
let dispatch;
-let lives = 1;
+let lives = SETTINGS.LIVES;
let currentScore = 0;
let highScore = 7;
let gameOver = false;
@@ -10,39 +10,41 @@ let gameOver = false;
const ScorebarCtrl = {
setDispatch: d => dispatch = d,
- getCurrentScore: () => currentScore,
- getHighScore: () => highScore,
getLives: () => lives,
flagGameOver: () => gameOver = true,
isGameOver: () => gameOver,
+ update: () => {
+ dispatch(ScorebarActions.update(lives, currentScore, highScore));
+ },
+
munchSucceeded: () => {
currentScore += 10;
- dispatch(ScorebarActions.update());
+ ScorebarCtrl.update();
},
munchFailed: () => {
lives--;
currentScore -= 5;
- dispatch(ScorebarActions.update());
+ ScorebarCtrl.update();
},
eatenByTroggle: () => {
lives--;
- dispatch(ScorebarActions.update());
+ ScorebarCtrl.update();
},
levelUp: (level) => {
currentScore += 25;
- dispatch(ScorebarActions.update());
+ ScorebarCtrl.update();
},
reset: () => {
lives = SETTINGS.LIVES;
currentScore = 0;
gameOver = false;
- dispatch(ScorebarActions.update());
+ ScorebarCtrl.update();
}
};
diff --git a/controllers/troggle.controller.js b/controllers/troggle.controller.js
index 3643798..7383f49 100644
--- a/controllers/troggle.controller.js
+++ b/controllers/troggle.controller.js
@@ -1,4 +1,4 @@
-import { SETTINGS } from '../App';
+import SETTINGS from '../AppSettings';
import * as TroggleActions from '../actions/board/troggle.actions';
import MuncherCtrl from './muncher.controller';
@@ -44,13 +44,12 @@ const TroggleCtrl = {
},
createTroggles(level) {
- // const count = Math.min(Math.ceil((level + 1) / 2), 5);
- const count = 3;
+ const count = Math.min(Math.ceil((level + 1) / 2), 5);
for (let index = 0; index < count; index++) {
const ref = this.createTroggle.bind(this, index);
- troggleCreateTimers[index] = setTimeout(ref, (index) * 1000);
- // troggleCreateTimers[index] = setTimeout(ref, (index + 1) * 5000);
+ // troggleCreateTimers[index] = setTimeout(ref, 1000);
+ troggleCreateTimers[index] = setTimeout(ref, (index + 1) * Math.random() * 10000);
}
},
diff --git a/reducers/board/grid.reducer.js b/reducers/board/grid.reducer.js
index c32dd10..ab77c92 100644
--- a/reducers/board/grid.reducer.js
+++ b/reducers/board/grid.reducer.js
@@ -1,7 +1,6 @@
const Immutable = require('immutable');
import * as GridActions from '../../actions/board/grid.actions';
-import GridCtrl from '../../controllers/grid.controller.js';
const initial = [];
@@ -11,7 +10,7 @@ const reducer = (state = initial, action) => {
}
if (action.action === GridActions.UPDATE) {
- return Immutable.List(GridCtrl.getValues()).toArray();
+ return Immutable.List(action.values).toArray();
}
return state;
diff --git a/reducers/board/muncher.reducer.js b/reducers/board/muncher.reducer.js
index e55a1c6..1835ff8 100644
--- a/reducers/board/muncher.reducer.js
+++ b/reducers/board/muncher.reducer.js
@@ -1,7 +1,5 @@
const Immutable = require('immutable');
import * as MuncherActions from '../../actions/board/muncher.actions';
-import MuncherCtrl from '../../controllers/muncher.controller';
-import { SETTINGS } from '../../App';
const initial = { x: 0, y: 0, frozen: false };
@@ -12,9 +10,8 @@ const reducer = (state = initial, action) => {
if (action.action === MuncherActions.UPDATE) {
return Immutable.Map(state)
- .set('x', MuncherCtrl.getX())
- .set('y', MuncherCtrl.getY())
- .set('frozen', false)
+ .set('x', action.x)
+ .set('y', action.y)
.toObject();
}
diff --git a/reducers/board/scorebar.reducer.js b/reducers/board/scorebar.reducer.js
index 9f4108b..0fb64aa 100644
--- a/reducers/board/scorebar.reducer.js
+++ b/reducers/board/scorebar.reducer.js
@@ -1,13 +1,8 @@
const Immutable = require('immutable');
import * as ScorebarActions from '../../actions/board/scorebar.actions';
-import ScorebarCtrl from '../../controllers/scorebar.controller.js';
-const initial = {
- current: ScorebarCtrl.getCurrentScore(),
- high: ScorebarCtrl.getHighScore(),
- lives: ScorebarCtrl.getLives()
-};
+const initial = { current: 0, high: 0, lives: 0 };
const reducer = (state = initial, action) => {
if (action.type !== ScorebarActions.SCOREBAR_ACTION) {
@@ -15,9 +10,9 @@ const reducer = (state = initial, action) => {
}
return Immutable.Map(state)
- .set('current', ScorebarCtrl.getCurrentScore())
- .set('high', ScorebarCtrl.getHighScore())
- .set('lives', ScorebarCtrl.getLives())
+ .set('current', action.currentScore)
+ .set('high', action.highScore)
+ .set('lives', action.lives)
.toObject();
};
diff --git a/reducers/mode.reducer.js b/reducers/mode.reducer.js
index e502908..d1e9045 100644
--- a/reducers/mode.reducer.js
+++ b/reducers/mode.reducer.js
@@ -1,6 +1,8 @@
import * as ModeActions from '../actions/mode.actions';
-const reducer = (state = ModeActions.BOARD, action) => {
+const initial = ModeActions.WELCOME;
+
+const reducer = (state = initial, action) => {
if (action.type !== ModeActions.MODE_ACTION) {
return state;
}
diff --git a/sass/board/troggle.scss b/sass/board/troggle.scss
index fd5454e..6c7dd9c 100644
--- a/sass/board/troggle.scss
+++ b/sass/board/troggle.scss
@@ -1,10 +1,21 @@
+.troggles {
+ height:500px;
+ left:50%;
+ margin-left:-300px;
+ overflow:hidden;
+ position:absolute;
+ top:110px;
+ width:600px;
+ z-index:0;
+}
+
.troggle {
$bg: crimson;
background: $bg;
height:100px;
- margin-top:110px;
opacity: 0.5;
position:absolute;
+ transition:left 0.3s, top 0.3s;
width:100px;
}