19 Javasript: Piccolo serpente.

Questa scheda contiene la descrizione della struttura per il programma del serpente che si muove sullo schermo. Le parti con il commento “//da completare” devi scriverle tu!

<canvas id="tela" width="600" height="600" >  </canvas>

<script>

// INIZIALIZZAZIONI

grafica = document.getElementById("tela").getContext("2d");

x = 100;

y = 100;

tasto = 0;

speed = 4;



function animazione() {

     spostaXY();

     disegna();  

     requestAnimationFrame(animazione);  // aggiorna appena possibile

}

 

function spostaXY() {

     if( tasto == 37 ) {

          x -= speed;

     } else if( tasto == 38 ) {

          // da completare

     } else if( tasto == 39 ) {

          // da completare

     } else if( tasto == 40 ) {

          // da completare

     }

}

 

function disegna() {

     grafica.strokeRect(x, y, 5, 5);

}

 

function gestisciEventoTasto(evento) {

     tasto = evento.keyCode;

}

 

// PROGRAMMA

addEventListener("keydown", gestisciEventoTasto );  

animazione();

 

</script>