unusualHW

 let secondAngle;

 let minuteAngle;

 let hourAngle;

 let img;

let hourImages = [];

let currentHour = -1; // Initialize to an invalid value

let speed = 2;

let images = [];  // Array to hold all the images

let x

​

 function preload() {

​

for (let i = 0; i < 12; i++) {

hourImages[i] = loadImage("backflip_" + (i + 1) + ".jpg");

}

   images.push(loadImage("p1.png"));

    images.push(loadImage("p2.png"));

    images.push(loadImage("p3.png"));

    images.push(loadImage("p4.png"));

    images.push(loadImage("p5.png"));

    images.push(loadImage("p7.png"));

    images.push(loadImage("p8.png"));

    images.push(loadImage("p9.png"));

    images.push(loadImage("p10.png"));

    images.push(loadImage("p11.png"));

   legImage= loadImage("foot.png")

 }

​

 function setup() {

  createCanvas(600, 600);

  colorMode(HSB);

  angleMode(DEGREES);

  ellipseMode(CENTER);

  }

​

 function draw() {

  background("turquoise");

​

  let s = second(); //i want the seconds bar to be a leg 

   //-frm ballet dancer

  secondAngle = map(s, 0, 59, 0, 354);

​

  let m = minute();

  minuteAngle = map(m, 0, 59, 0, 354);

​

  let h = hour() % 12; // Get the hour in 12-hour format (0-11)

 // Check if the hour has changed

  if (h !== currentHour) {

    currentHour = h; // Update the current hour

    hourAngle = map(h, 0, 11, 0, 360); // Recalculate the angle

  }

​

​

  push();

  fill('rgb(109,71,71)');

  stroke('rgb(247,247,247)');

  textSize(15);

  text("12", 294, 140);

  text("3", 450, 300);

  text("6", 297, 470);

  text("9", 140, 300);

  pop();

​

  push();

​

let imageWidth = hourImages[h].width/40; // Reduce width by half

  let imageHeight = hourImages[h].height *-300; // Reduce height by half

  let imageX = 140  ;

  let imageY = -20; 

   scale(0.4)

​

   //below i just put in h-1 which made the image highlight the 

   //first two backflips and not all three of them at what was my current 

   //time, 2:38pm

  image(hourImages[h-1], imageX/2 - 100, imageY*5); // Display the image for the current hour

  pop();

  push();

  translate(width / 2, height / 2);

  rotate(minuteAngle);

  stroke('white'); // Added stroke color

  line(0, 0, 0, -140);

  pop();

​

​

  push();

  stroke("rgb(229,0,255)");

  translate(width / 2, height / 2);

  rotate(hourAngle);

  line(0, 0, 0, -100);

  pop();

   push();

  translate(width / 2, height / 2);

  rotate(secondAngle);

​

  // Draw the leg image at the end of the second hand

  image(legImage, -legImage.width / 2, -170, legImage.width, legImage.height); 

  pop();

​

  x += images * speed

    let imageIndex = s % images.length;  // This will loop through the images every second

    image(images[imageIndex], 180, 120, 100, 170);

 }

​