2025-02-28-Bar-Clock-Completed

// Declare our "bar" variables

let secondBar, minuteBar, hourBar, dayBar, monthBar, yearBar;

​

function setup() {

  createCanvas(600, 600);

}

​

function draw() {

  background(220);

​

  noStroke();

​

  // Store the results of the time functions in temporary variables

  // Makes the code a little easier to read when we're using the map function

  let s = second();

  let m = minute();

  let h = hour();

  let d = day();

  let mo = month();

  let y = year();

​

  // Map the seconds onto the range 0-255 for alpha

  // This is used in the fill function to make the bars fade in 

  // over the course of each minute

  let alpha = map(s, 0, 59, 0, 255);

​

  let secondBar = map(s, 0, 59, 0, 600);

  fill(0, 255, 255, alpha);

  rect(0, 200, secondBar, 100);

​

  let minuteBar = map(m, 0, 59, 0, 600);

  fill(255, 255, 0, alpha);

  rect(0, 100, minuteBar, 100);

​

  let hourBar = map(h, 0, 23, 0, 600);

  fill(255, 0, 255, alpha);

  rect(0, 0, hourBar, 100);

​

  let dayBar = map(d, 1, 31, 0, 600);

  fill(255, 0, 0, alpha);

  rect(0, 300, dayBar, 100);

​

  let monthBar = map(mo, 1, 12, 0, 600);

  fill(0, 255, 0, alpha);

  rect(0, 400, monthBar, 100);

​

  let yearBar = map(y, 2000, 2099, 0, 600);

  fill(0, 0, 255, alpha);

  rect(0, 500, yearBar, 100);

}

​