Appunti di programmazione: Collisioni con il canvas, prove con il colore.

giovedì 8 gennaio 2015

Collisioni con il canvas, prove con il colore.

Ecco il codice di un rettangolo rosso che viene respinto da due triangoli aventi in comune il byte del colore verde di valore 0xFF (255):

<!DOCTYPE html>
<html>
<script src="funzioniCanvas.js"></script>
<script>

var x=150;
var y=30;
var dx=0;
var delta=5
var differenza=delta;
var dy=0;
var w=50;
var h=30;
var COLORE="#FF0000"
var immagine;
var scarto=5;
function init(){
 //chiamata obbligatoria.
 initContext("canvas");
  
 intervallo=setInterval(draw,10); 
}

function draw(){
 rect(0,0,WIDTH,HEIGHT,"black");
 rect(x,y,w,h,COLORE);
 rect(10,20,10,30,"#00FF00");
 rect(250,20,10,30,"#00FFAA");
 var areaWidth=w+scarto*2;
 
 immagine=ctx.getImageData(x-scarto,y,areaWidth,h);
 
 for(var n=0;n<immagine.data.length;n+=4){
  if(immagine.data[n+1]==255){
  
  
   if(n % areaWidth<20){
    differenza=delta;
      }
   else if (n % areaWidth >(areaWidth-scarto)){
    differenza=-delta;
   }
  }
 }
 x+=differenza;
}

window.addEventListener("load",init);
</script>
<body>
<canvas id="canvas" width=300 height=300></canvas>
</body>
</html>

Non ho la screencam e non lo posso documentare...

Appunti di programmazione

giovedì 8 gennaio 2015

Collisioni con il canvas, prove con il colore.

Nessun commento:

Posta un commento