Brittany Price

*/

let rectWidth;

let rectHeight;

let r = 0;

let g = 0;

let b = 0;

​

function setup() {

  createCanvas(400, 400);

  frameRate(60);

  rectWidth = 350;

  rectHeight = 350;

}

​

function draw() {

  background(100, 165, 215);

  stroke(0);

  strokeWeight(2);

  text("Mouse over the die and click to interact with it", 20,14);

  textSize(18);

  //die

  //only resize if mouse is over the shape

  push();

  rectMode(CENTER);

   rectWidth = mouseX/2+150;//150

  rectHeight = mouseY/2+130;//130

rect(200,210,rectWidth,rectHeight,20);

  pop();

  //each circle for die

  push();

  fill(b,r,g);//different set of random colors

/*

make dots move with the corners of the rectangle

*/

   let dot1PosX = (width-rectWidth)/2 + rectWidth/4;

  dot1PosY = (height-rectHeight)/2 + rectHeight/4;

  let dot2PosX = (width/2) + (rectWidth/4+5); 

  dot2PosY = (height-rectHeight)/2 + rectHeight/4;

  let dot3PosX = (width-rectWidth)/2+ rectWidth/4;

  dot3PosY = (height/2) + rectHeight/4-20;

  let  dot4PosX = (width/2) + (rectWidth/4+5);

  dot4PosY = (height/2) + (rectHeight/4-20);

 let dot5PosX = (width-rectWidth)/2 + rectWidth/4;

  dot5PosY = (height-rectHeight)/2 + rectHeight*0.9;

 let dot6PosX = (width/2) + (rectWidth/4+5);

  dot6PosY =  (height-rectHeight)/2 + rectHeight*0.9;

  dotWidth = mouseX/4+150;//150

​

  let dotSize = (dotWidth-rectWidth)/4 + dotWidth/5 * 1;

  circle(dot1PosX,dot1PosY,dotSize);

  circle(dot2PosX,dot2PosY,dotSize);

  circle(dot3PosX,dot3PosY,dotSize);

  circle(dot4PosX, dot4PosY, dotSize);

  circle(dot5PosX, dot5PosY, dotSize);

  circle(dot6PosX, dot6PosY, dotSize);

  pop();

}

​

function mousePressed(){

  //use random to change color of die

  if(mouseIsPressed && (mouseX > (100,100)) && (mouseX < (300,300)) && (mouseY > (100,100)) && (mouseY < (300,300))){

    r = random(0,255); 

    g = random(0,255);

    b = random(0,255);

    c = fill(r,g,b);

  }

  //die glitches with this code

  else{

  }

}