48 lines
1.3 KiB
JavaScript
48 lines
1.3 KiB
JavaScript
|
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;
|
||
|
|
|