Snake bug fixes, stil WIP. Moved page logic into a separate JS file.

snake/snake-page.js

@@ -0,0 +1,47 @@
+var $canvas = $("#snakeCanvas");
+var canvasEl = $canvas[0];
+var $scoreValue = $("#score span.value");
+var $levelSelectSection = $("#levelSelect");
+
+canvasEl.width = canvasEl.clientWidth;
+canvasEl.height = canvasEl.clientHeight;
+
+var initializePage = function() {
+
+    // Load the snake levels onto the page UI.
+    _.each(SnakeLevels, function(levelSet, setName) {
+        var newHtml = "<h5>" + setName + "</h5>" +
+                      "<ol levelSet='" + setName + "'>";
+
+        _.each(levelSet, function(levelData, levelIdx) {
+            newHtml += "<li levelNum='" + levelIdx + "'>" +
+                levelData.name + "</li>"; });
+
+        newHtml += "</ol>"; });
+};
+
+var loadLevel = function(ev) { }
+
+var nextLevel = function() { };
+
+var updateScore = function(ev) {
+    var curScore = parseInt(scoreValue.textContent);
+    curScore += ev.detail.bodyLength;
+    curScore.textContent = curScore;
+
+    if (evDetail.score == Snake.currentLevel.targetScore)
+        nextLevel(); };
+
+$canvas.on('score', updateScore);
+
+
+// Add listeners for each of the level list items.
+var levelLis = document.querySelectorAll("#levelSelect li");
+for (var i = 0; i < levelLis.length; ++i) {
+    levelLis[i].addEventListener("click", loadLevel); }
+
+loadLevel({target: document.querySelector("#levelSelect li.selected")});
+
+
+window.onload = initializePage;
+