chore(app): created a class Game for top-level game routines

stared · Dec 14, 2015 · 7076b21 · 7076b21
1 parent 127deca
commit 7076b21
Show file tree

Hide file tree

Showing 2 changed files with 61 additions and 39 deletions.
diff --git a/app.js b/app.js
@@ -1,43 +1,7 @@
 /*global window:false*/
 import 'normalize.css';
-import d3 from 'd3';
 
-import * as tile from './js/tile';
-import * as level from './js/level';
-import * as board from './js/board';
+import * as game from './js/game';
 
-const demoLevel = new level.Level(level.levels[0]);
-
-const gameBoard = new board.Board(demoLevel, d3.select('svg'), d3.select('#helper'));
-gameBoard.reset();
-
-// for debugging purposes
-window.gameBoard = gameBoard;
-window.tile = tile;
-
-gameBoard.setAnimationControls(d3.select('#animation-controls'));
-
-d3.select('#select-level').on('click', () => {
-  d3.select('#level-selector').remove();
-  gameBoard.stop();
-
-  const levelSelector = d3.select('body').append('div')
-    .attr('id', 'level-selector')
-    .attr('class', 'item-selector');
-
-  levelSelector.append('ul').attr('class', 'level-item').selectAll('li')
-    .data(level.levels)
-    .enter()
-      .append('li')
-        .attr('class', 'level-item')
-        .text((d) => `[${d.group}] ${d.i}. ${d.name}`)
-        .on('click', (d) => {
-          gameBoard.level = new level.Level(d);
-          gameBoard.reset();
-          levelSelector.remove();
-        });
-});
-
-d3.select('#clip-board-a').on('click', function () {
-  gameBoard.clipBoard(this);
-});
+const quantumGame = new game.Game();
+quantumGame.htmlReady();
diff --git a/js/game.js b/js/game.js
@@ -0,0 +1,58 @@
+/*global window:false*/
+import d3 from 'd3';
+
+import * as tile from './tile';
+import * as level from './level';
+import * as board from './board';
+
+export class Game {
+  constructor() {
+    this.gameBoard = null;
+  }
+
+  htmlReady() {
+    this.createGameBoard();
+    this.bindMenuEvents();
+
+    // for debugging purposes
+    window.gameBoard = this.gameBoard;
+    window.tile = tile;
+  }
+
+  createGameBoard() {
+    const demoLevel = new level.Level(level.levels[0]);
+    this.gameBoard = new board.Board(
+      demoLevel,
+      d3.select('svg'),
+      d3.select('#helper'));
+    this.gameBoard.reset();
+    this.gameBoard.setAnimationControls(d3.select('#animation-controls'));
+  }
+
+  bindMenuEvents() {
+    d3.select('#select-level').on('click', () => {
+      d3.select('#level-selector').remove();
+      this.gameBoard.stop();
+
+      const levelSelector = d3.select('body').append('div')
+        .attr('id', 'level-selector')
+        .attr('class', 'item-selector');
+
+      levelSelector.append('ul').attr('class', 'level-item').selectAll('li')
+        .data(level.levels)
+        .enter()
+        .append('li')
+        .attr('class', 'level-item')
+        .text((d) => `[${d.group}] ${d.i}. ${d.name}`)
+        .on('click', (d) => {
+          this.gameBoard.level = new level.Level(d);
+          this.gameBoard.reset();
+          levelSelector.remove();
+        });
+    });
+
+    d3.select('#clip-board-a').on('click', function () {
+      this.gameBoard.clipBoard(this);
+    });
+  }
+}