Factor out some helper methods to util

src/display.ts

@@ -8,6 +8,7 @@
 /// <reference path="kana.ts" />
 /// <reference path="state.ts" />
 /// <reference path="audio.ts" />
+/// <reference path="util.ts" />
 
 namespace display {
   import InputState = kana.KanaInputState;
@@ -354,8 +355,7 @@ namespace display {
     }
 
     createBar(): HTMLElement {
-      let template: HTMLTemplateElement = document.querySelector('#progress-bar-template');
-      let element = document.importNode(template.content, true);
+      let element = util.loadTemplate('progress-bar');
       let shade: HTMLElement = element.querySelector('.shade');
       this.element.appendChild(element);
       return shade;

src/game.ts

@@ -3,6 +3,7 @@
 /// <reference path="display.ts" />
 /// <reference path="background.ts" />
 /// <reference path="select.ts" />
+/// <reference path="util.ts" />
 
 namespace game {
   enum GameState {
@@ -139,9 +140,7 @@ namespace game {
       this.container.classList.add('game');
       this.gameController = new display.LevelController(this.audioManager, level);
       let gameContainer = this.container.querySelector('#game');
-      while (gameContainer.lastChild != null) {
-        gameContainer.removeChild(gameContainer.lastChild);
-      }
+      util.clearChildren(gameContainer);
       gameContainer.appendChild(this.gameController.element);
       this.state = GameState.PLAYING;
     }

src/index.ts

@@ -1,5 +1,5 @@
 /// <reference path="game.ts" />
 
 let container: HTMLElement = document.querySelector('#container');
-let controller = new game.MainController(container, 'levels.json');
+let controller = new game.MainController(container, 'tm');
 controller.start();

src/select.ts

@@ -1,4 +1,5 @@
 /// <reference path="game.ts" />
+/// <reference path="util.ts" />
 
 namespace game {
   export class SelectScreen {
@@ -61,9 +62,7 @@ namespace game {
         this.controller.assets.selectSound.play();
       }
       let songInfoComponent = new SongInfoComponent(this.currentLevelSet.levels[index]);
-      while (this.songInfo.firstChild) {
-        this.songInfo.removeChild(this.songInfo.firstChild);
-      }
+      util.clearChildren(this.songInfo);
       this.songInfo.appendChild(songInfoComponent.element);
     }
 
@@ -74,9 +73,7 @@ namespace game {
 
     selectLevelSet(index: number): void {
       this.currentFolderIndex = index;
-      if (this.songList.lastChild) {
-        this.songList.removeChild(this.songList.lastChild);
-      }
+      util.clearChildren(this.songList);
       this.songList.appendChild(this.activeListController.element);
       this.selectSong(this.activeListController.currentIndex);
     }
@@ -122,8 +119,7 @@ namespace game {
     element: DocumentFragment;
 
     constructor(level: level.Level) {
-      let template: HTMLTemplateElement = document.querySelector('#song-info-template');
-      this.element = document.importNode(template.content, true);
+      this.element = util.loadTemplate('song-info');
       this.element.querySelector('.genre').textContent = level.genre;
       this.element.querySelector('.creator').textContent = level.creator;
       this.element.querySelector('.title').textContent = level.name;
@@ -151,9 +147,8 @@ namespace game {
       this.element.className = 'song-list';
       this.element.style.marginTop = '200px';
 
-      let template: HTMLTemplateElement = document.querySelector('#song-item-template');
       this.levels.forEach((level, index) => {
-        let element = document.importNode(template.content, true);
+        let element = util.loadTemplate('song-item');
         element.querySelector('.creator').textContent = level.creator;
         element.querySelector('.title').textContent = level.name;
         element.querySelector('.difficulty').textContent = level.difficulty;

src/util.ts

@@ -0,0 +1,12 @@
+namespace util {
+  export function loadTemplate(id: string): DocumentFragment {
+    let template: HTMLTemplateElement = document.querySelector(`#${id}-template`);
+    return document.importNode(template.content, true);
+  }
+
+  export function clearChildren(node: Node): void {
+    while (node.lastChild !== null) {
+      node.removeChild(node.lastChild);
+    }
+  }
+}