aranders-project-06

aranders-project-06

function setup() {
  createCanvas(400, 250);
}

function draw() {
  background(255, 225, 225);

  //strawberry jam jar
  push();
  fill(255, 26, 26);
  ellipse(70, 170, 100, 30);
  pop();
  line(20, 40, 20, 170);
  line(120, 40, 120, 170);
  push();
  noStroke();
  fill(255);
  ellipse(70, 40, 100, 30);
  fill(255, 26, 26);
  ellipse(70, 40, 30, 10);
  pop();

  //raspberry jam jar
  push();
  fill(102, 0, 34);
  ellipse(200, 170, 100, 30);
  pop();
  line(150, 40, 150, 170);
  line(250, 40, 250, 170);
  push();
  noStroke();
  fill(255);
  ellipse(200, 40, 100, 30);
  fill(102, 0, 34);
  ellipse(200, 40, 30, 10);
  pop();

  //apricot jam jar
  push();
  fill(240, 90, 26);
  ellipse(330, 170, 100, 30);
  pop();
  line(280, 40, 280, 170);
  line(380, 40, 380, 170);
  push();
  noStroke();
  fill(255);
  ellipse(330, 40, 100, 30);
  fill(240, 90, 26);
  ellipse(330, 40, 30, 10);
  pop();

  //time
  var h = hour();
  var m = minute();
  var s = second();

  //height of jam based on time
  var maph = map(h, 0, 23, 0, height / 2.25);
  var mapm = map(m, 0, 59, 0, height / 2.25);
  var maps = map(s, 0, 59, 0, height / 2.25);

  push();
  noStroke();

  //strawberry jam
  fill(255, 26, 26);
  rect(20, 170, 100, - maps)

  //raspberry jam
  fill(102, 0, 34);
  rect(150, 170, 100, - mapm)

  //apricot jam
  fill(240, 90, 26);
  rect(280, 170, 100, - maph)

  pop();

  textSize(18);
  text("strawberry", 25, 225);
  text("raspberry", 160, 225);
  text("apricot", 300, 225);

}

I chose to use different jams as a representation of time. Strawberry jam sells more than the other two which is why I made it seconds. Raspberry sells faster than apricot which is why I made it minutes.