var x = 5; // De x-coordinaat van het zwarte wordt in deze variabele bijgehouden
var y = 5; // De y-coordinaat van het zwarte wordt in deze variabele bijgehouden
function beweeg(event)
{
if(window.event)
event = window.event;
// Hou bij welke op welke coordinaten de speler staat voordat deze verplaatst gaat worden
// Zo kan de speler altijd nog teruggeplaatst worden (stel dat hij op een muur probeert te lopen)
var oldX = x;
var oldY = y;
var table = document.getElementById("gameboard");
table.rows[y].cells[x].className = ""; // Haal de speler van het huidige vakje af, we gaan immers hier vandaan verplaatsen
// Als er geen pijltjes toets ingedrukt is blijven de coordinaten ongewijzigd
// en zal het vakje dus opnieuw zwart worden gemaakt aan het einde van deze functie
switch(event.keyCode)
{
case 37: // Pijltje naar links
if(--x < 0) // Trek 1 van x af, als het resultaat kleiner is dan 0 (dus buiten de tabel valt)
{
x = 0; // Maak x dan weer 0
}
break;
case 38: // Pijltje naar boven
if(--y < 0) // Trek 1 van y af, als het resultaat kleiner is dan 0 (dus buiten de tabel valt)
{
y = 0; // Maak y dan weer 0
}
break;
case 39: // Pijltje naar rechts
if(++x >= table.rows[0].cells.length) // Tel 1 bij x op, als het resultaat groter is dan (of gelijk aan) de breedte van de tabel
{
x = table.rows[0].cells.length - 1; // Maak x dan weer gelijk aan de breedte v/d tabel - 1
}
break;
case 40: // Pijltje naar onder
if(++y >= table.rows.length) // Tel 1 bij y op, als het resultaat groter is dan 4 (dus buiten de tabel valt)
{
y = table.rows.length-1; // Maak y dan weer 4
}
break;
}
if(table.rows[y].cells[x].className != "") // Als het vakje waar we naartoe willen lopen momenteel niet leeg is
{
// Zet dan de oude coordinaten (van voor het lopen) terug
x = oldX;
y = oldY;
}
table.rows[y].cells[x].className = "player"; // Maak van het vakje met de nieuwe coordinaten de speler
}
function muur(event)
{
if(window.event)
event = window.event;
// Als speler op het vakje waarop geklikt wordt staat moet er niks gebeuren
if(this.className == "player")
return;
// Als de shift toets ingedrukt is
if(event.shiftKey)
{
this.className = ""; // Haal dan de muur weg van dit vakje (als er niks stond is er geen verandering)
}
else
{
this.className = "wall"; // Anders wordt juist een muur neergezet (als er al een muur stond verandert er niks)
}
}
function maakEvents()
{
document.body.onkeydown = beweeg;
// Ken aan alle tds in het document een onclick event toe
var tds = document.getElementsByTagName("td");
for(var i = 0; i < tds.length; ++i)
{
tds[i].onclick = muur;
}
}
window.onload = maakEvents;