Week 7 Lights Out with Loop
Zhaoliang Zhang
by Zhaoliang
HTML
<div id="drawing">
</div>
JavaScript
var draw = SVG('drawing').size(600,600);
var border = draw.rect(600,600).fill('white').stroke('red');
//Set up the lights from number 0 to 8
var isLit0, isLit1, isLit2, isLit3, isLit4, isLit5, isLit6, isLit7, isLit8;
var isLit = [isLit0, isLit1, isLit2, isLit3, isLit4, isLit5, isLit6, isLit7, isLit8];
var light0, light1, light2, light3, light4, light5, light6, light7, light8;
var light = [light0, light1, light2, light3, light4, light5, light6, light7, light8];
var lightX = 150;
var lightY = 200;
var feedback;
// set up the shapes for the lights
for (var i = 0; i < 9; i++) {
light[i] = draw.circle(100).stroke('black');
}
light[0].center(lightX, lightY);
light[1].center(lightX + 150, lightY);
light[2].center(lightX + 300, lightY);
light[3].center(lightX, lightY + 150);
light[4].center(lightX + 150, lightY + 150);
light[5].center(lightX + 300, lightY + 150);
light[6].center(lightX, lightY + 300);
light[7].center(lightX + 150, lightY + 300);
light[8].center(lightX + 300, lightY + 300);
//add some instructions for the game
feedback = draw.text("Click on the lights to turn them on and off.\n"+
"If you can get all of the lights turned off, you win!").move(30,30).fill("#0044cc").size(20);
//set up the click button for each light
for (var i = 0; i < 9; i++) {
light[i].on('click', toggleLight);
}
// initial states for the lights
isLit[0] = true;
isLit[1] = true;
isLit[2] = true;
isLit[3] = true;
isLit[4] = false;
isLit[5] = true;
isLit[6] = false;
isLit[7] = true;
isLit[8] = true;
//for update lightimages
updateLightImages()
//set up each lights from 0-8
function toggleLight() {
this.animate(200).fill('#FAEB31').animate(200).fill('#524F48');
var targetLight = 0;
while (light[targetLight] != this) {
targetLight++;
}
isLit[targetLight] = !isLit[targetLight];
updateLightData();
updateLightImages();
checkForWin();
}
//Set up the puzzle's logic.
function updateLightData() {
if...