Project-03

sketch

//Naomi Shimada
//Section D
//nshimada@andrew.cmu.edu
//Project-03

var x1 = 140;
var y1 = 160;
var r1 = 30;

var x2 = 550;
var y2 = 300;
var r2 = 100;

var R = 150;
var G = 35;
var B = 75;

var num = 5;


function setup() {
    createCanvas(640, 480);
    
}

function draw() {
 background("MistyRose");

fill("MediumSpringGreen");
 ellipse(110,210,90,90);      //background pokadots

 ellipse(310,110,70,70);

 ellipse(600,40,10,10);

 ellipse(350,390,20,20);

 ellipse(50,50,60,60);

 ellipse(210,420,50,50);

 ellipse(250,240,80,80);

 ellipse(620,460,25,25);

 ellipse(500,190,45,45);

 ellipse(30,460,8,8);

 ellipse(450,100,35,35);

 ellipse(90,350,55,55);

 ellipse(640,380,100,100);

 ellipse(400,290,25,25);

  fill(R,G,B);

  ellipse(x1,y1,r1,r1);         //draws left side ellipse

  for (var i = 0; i<num;i++) {      //makes the motion effect

  ellipse(x2-(10*i),y2,r2,r2);       //draws right side ellipse
  

  }


  if ((mouseX >= x1-r1) & (mouseX<=x1+r1) && (mouseY<=y1+r1) && (mouseY>=y1-r1) && (num>1)){

   x1 = x1+1;
   y1 = y1+1;
   r1 = r1+1;
                             //right side ellipse
   x2 = x2-1;
   y2 = y2-1;
   r2 = r2-1;

   num = num-1;


  }

   if ((mouseX >= x2-r2) & (mouseX<=x2+r2)){
   

   x2 = x2+0.5;
   y2 = y2+0.75;
   r2 = r2+0.1;
                         //left side ellipse
   x1 = x1-0.8;
   y1 = y1-0.4;
   r1 = r1-0.2;
   
   num =num+1;

  }

}

 

This was a challenge for me because I had a lot of trouble getting my if statements to work.  Luckily after many hours of perseverance it came together!