Interaksjon igjen

//En skisse med noen kuler
 
// kulene, en array av kuleobjekter
var kuleListe;
var dragged;
function setup(){
  var canvas = createCanvas(200, 150);
  canvas.parent('canvasHere2');
  // 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,50,20,color(255,255,0));
  kuleListe[3]= new kule(100,100,20,color(255,0,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()){
            // den vi har valgt skal tegnes sist
            // (og finnes først)
            dragged=kuleListe[i];
            kuleListe[i]=kuleListe[kuleListe.length-1];
            kuleListe[kuleListe.length-1]=dragged;
        }
    }
}
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(){
        // hele kula innenfor rammene
        // pmouseX,pmouseY er forrige museposisjon
        var x=this.xPos+(mouseX-pmouseX);
        var y=this.yPos+(mouseY-pmouseY);
        this.xPos=Math.max(Math.min(x,width-this.radius),this.radius);
        this.yPos=Math.max(Math.min(y,height-this.radius),this.radius);
  }
}