From b24d6c87b222dbd0b256fe7a1cf17c2305e079d2 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?S=C3=A9bastien=20Dabet?= Date: Sat, 21 Jan 2012 12:46:17 +0000 Subject: [PATCH] Store lines instead of unitHeight --- editor.js | 23 +++------- level.js | 126 +++++++++++++++++++++++++++--------------------------- 2 files changed, 71 insertions(+), 78 deletions(-) diff --git a/editor.js b/editor.js index 5b862b7..2168e3e 100644 --- a/editor.js +++ b/editor.js @@ -35,7 +35,7 @@ function handleFileSelect(evt, callback) { // Closure to capture the file information. reader.onload = function(e) { - Resample(e.target.result, unitHeight, unitHeight, function(data) { + Resample(e.target.result, level.unitHeight(), level.unitHeight(), function(data) { callback(data); }); }; @@ -92,7 +92,7 @@ widthField.value = level.boardWidth(); var heightField = document.querySelector("#board_height_field"); heightField.value = level.boardHeight(); var linesField = document.querySelector("#lines_field"); -linesField.value = parseInt(level.boardHeight() / unitHeight); +linesField.value = level.lines; /* Ball editor */ var ballUrlField = document.getElementById("ball_url_field"); @@ -158,26 +158,17 @@ backgroundField.addEventListener("change", function() { /* Board */ board.addEventListener("click", function(e) { - var x = e.pageX - board.offsetLeft - container.offsetLeft; - var y = e.pageY - board.offsetTop - container.offsetTop; + var unitHeight = level.unitHeight(); + var x = Math.max(0,Math.min(level.boardWidth()-unitHeight, parseInt(e.pageX - board.offsetLeft - container.offsetLeft - unitHeight/2))); + var y = parseInt(e.pageY - board.offsetTop - container.offsetTop); y -= y % unitHeight; console.log("Clic: (" + x + "," + y + ")"); switch(selection) { case "wall": - level.addWall({ - x: x, - y: y, - w: unitHeight, - h: unitHeight - }, 0); + level.addWall(x, y, 0); break; case "gum": - level.addGum({ - x: x, - y: y, - w: unitHeight, - h: unitHeight - }, 0); + level.addGum(x, y, 0); break; case "erase": level.removeItemsAtPosition(x,y); diff --git a/level.js b/level.js index e0fae8e..0268d65 100644 --- a/level.js +++ b/level.js @@ -14,9 +14,6 @@ function getQueryVariable(query,variable) { } } -/* Base height unit */ -var unitHeight = 30; - var ballImg = new Image(); var wallImg = new Image(); var gumImg = new Image(); @@ -28,7 +25,7 @@ var Level = function(board) { var gums = []; var walls = []; - + var drawWall = function(i) { var wallEl = wallImg.cloneNode(true); wallEl.style.left = walls[i].x + "px"; @@ -49,32 +46,6 @@ var Level = function(board) { gums[i].dom = gumEl; }; - var randomX = function() { - return Math.floor(Math.random()*(board.offsetWidth-unitHeight)); - } - var randomY = function() { - return Math.floor(Math.random()*((board.offsetHeight-unitHeight)/unitHeight)) * unitHeight; - } - - var initBall = function() { - // Remove current ball - var balls = board.getElementsByClassName("ball"); - if(balls.length > 0) { - board.removeChild(balls[0]); - } - - /* Init ball position */ - boule.x = randomX(); - boule.y = 0; // on the first line - boule.w = unitHeight; - boule.h = unitHeight; - boule.targetY = boule.y; - boule.dom = ballImg.cloneNode(true); - board.appendChild(boule.dom); - boule.draw(); - } - - /* * Check if there is a collision between an area and a set of items */ @@ -115,8 +86,6 @@ var Level = function(board) { var boule = { x: 0, y: 0, - w: unitHeight, - h: unitHeight, speed: 0, // pixels per second draw: function() { var style = this.dom.style; @@ -177,17 +146,49 @@ var Level = function(board) { return { + randomX: function() { + return Math.floor(Math.random()*(this.boardWidth()-this.unitHeight())); + }, + randomY: function() { + return Math.floor(Math.random()*((this.boardHeight()-this.unitHeight())/this.unitHeight())) * this.unitHeight(); + }, + + initBall: function() { + var unitHeight = this.unitHeight(); + // Remove current ball + var balls = board.getElementsByClassName("ball"); + if(balls.length > 0) { + board.removeChild(balls[0]); + } + + /* Init ball position */ + boule.x = this.randomX(); + boule.y = 0; // on the first line + boule.w = unitHeight; + boule.h = unitHeight; + boule.targetY = boule.y; + boule.dom = ballImg.cloneNode(true); + board.appendChild(boule.dom); + boule.draw(); + }, + + lines: 10, + + unitHeight: function() { + return this.boardHeight() / this.lines; + }, + boardWidth: function() { - return board.offsetWidth; + return board.clientWidth; }, boardHeight: function() { - return board.offsetHeight; + return board.clientHeight; }, ready: function() { container.className = "ready"; - initBall(); + this.initBall(); }, clear: function() { @@ -291,9 +292,9 @@ var Level = function(board) { var str = ""; // Serialize board dimensions - str += "boardWidth=" + board.offsetWidth; - str += "&boardHeight=" + board.offsetHeight; - str += "&lines=" + parseInt(this.boardHeight() / unitHeight); + str += "boardWidth=" + board.clientWidth; + str += "&boardHeight=" + board.clientHeight; + str += "&lines=" + this.lines; // Serialize ball position str += "&ball=" + boule.x + coord_sep + boule.y; @@ -346,7 +347,7 @@ var Level = function(board) { } var lines = getQueryVariable(query, "lines"); if(lines) { - unitHeight = parseInt(this.boardHeight() / lines); + this.lines = lines; } // Unserialize ball position @@ -364,12 +365,7 @@ var Level = function(board) { for(var i=0; i 0 && findCollision(gum.x - margin, gum.y - margin, gum.w + 2*margin, gum.h + 2*margin, gums) !== null); - this.addGum(gum, 100*i); + this.addGum(gum.x, gum.y, 100*i); } /* Init walls */ @@ -462,8 +464,8 @@ var Level = function(board) { do { tries--; wall = { - x: randomX(), - y: randomY(), + x: this.randomX(), + y: this.randomY(), w: unitHeight, h: unitHeight }; @@ -473,7 +475,7 @@ var Level = function(board) { || findCollision(wall.x - margin, wall.y - margin, wall.w + 2*margin, wall.h + 2*margin, walls) !== null || (wall.y <= boule.y+boule.h && wall.y+wall.h >= boule.y) // no wall on the initial ball row ); - this.addWall(wall, 100*i); + this.addWall(wall.x, wall.y, 100*i); } } };