Interaksjon

//En skisse med noen kuler
 
// kulene, en array av kuleobjekter
var kuleListe;
var dragged;
function setup(){
  var canvas = createCanvas(200, 150);
  canvas.parent('canvasHere');
  // plasser nye kuleobjekter i kulelista
  kuleListe=new Array();
  kuleListe[0]= new kule(50,50,20,color(0,255,0));
  kuleListe[1]= new kule(50,100,20,color(0,0,255));
  kuleListe[2]= new kule(100,100,20,color(255,255,0));
  dragged=null;
}
function draw(){
  background(255,255,255);
  // be kulene om å tegne seg
  for(var ix=0;ix < kuleListe.length; ix++){
    kuleListe[ix].tegn();
  }
}
function mousePressed(){
    for(var i=kuleListe.length-1;  i>=0; i--){
        if(kuleListe[i].truffet()){
            dragged=kuleListe[i];
        }
    }
}
function mouseDragged(){
    if(dragged!=null)
        dragged.flytt();
}
function mouseReleased(){
    dragged=null;
}

// Representasjon et kuleobjekt
function kule(xpos,ypos,radius,farge){
  this.xPos=xpos;
  this.yPos=ypos;
  this.radius=radius;
  this.farge=farge;
 
  this.tegn=function(){
        push();
        fill(this.farge);
        ellipse(this.xPos,this.yPos,
                2*this.radius,2*this.radius);
        pop();
    }
  this.truffet=function(){
        if(dist(mouseX,mouseY,this.xPos,this.yPos)< this.radius)
            return true;;
        return false;
  }
  this.flytt=function(){
        this.xPos+=(mouseX-pmouseX);
        this.yPos+=(mouseY-pmouseY);
  }
}