//photo stuff

let lights;

let panels;

let movingImg;

let win;

let img;

​

//scrolling

let scrollY = 0;

​

let imgX, imgY;

let lastUpdateTime = 0;

let isMoving = false; //taylor's moving

let showLights = false;//lights

let lightsVisibleTime = 0;

let showWin = false;//win image

//buttons

let resetButton;

let beginButton;

//modes

let currentMode = 1;

let movingImgMode = 1;

//time stuff

let startTime;

let finalElapsedTime;

​

let page1, page2, page3;

let border1, border2, border3;

// Preload function to load the images before the setup function runs

function preload() {

  movingImg = loadImage('taylor-swift-png-by-maarcopngs-taylor-swift-png-by-maarcopngs-1200.png'); //taylor

  //background and foreground stff

  img = loadImage('Screenshot 2024-11-04 160007.png');

  lights = loadImage('Screenshot 2024-11-04 160007d.png');

  panels = loadImage('Screenshot 2024-11-04 160007DS.jpg');

  win = loadImage('DDD.png');

  //panels and panel borders

  page1 = loadImage('i.png');

  page2 = loadImage('o.jpg');

  page3 = loadImage('p.jpg');

  border1 = loadImage('i1.png');

  border2 = loadImage('o1.png');

  border3 = loadImage('p1.png');

  //menu

  begin = loadImage('AAAAAA.png');

}

​

​

// Setup function to initialize the canvas and other elements

// Setup function to initialize the canvas and other elements

​

// Setup function to initialize the canvas and other elements

// Setup function to initialize the canvas and other elements

function setup() {

  createCanvas(windowWidth, windowHeight); 

  imgX = width / 2; 

  imgY = height / 2; 

  lastUpdateTime = millis();

​

  // Create the reset button but hide it initially

  resetButton = createButton('Reset');

  resetButton.position(width / 2 - 50, height / 2 + 50);

  resetButton.mousePressed(resetGame);

  resetButton.hide();

​

  // Create the begin button with the begin image

  beginButton = createButton('baby let the games begin');

  beginButton.position(width / 2-70, height/1.5+50);

  beginButton.style('background-image', `url(${begin.src})`);

  beginButton.mousePressed(startGame);

}

​

​

function startGame() {

  beginButton.hide(); // Hide the begin button

  isMoving = true; // Start the moving image

  startTime = millis(); // Record the start time

}

​

// Draw function to continuously execute the code within it

function draw() {

  background(220); 

​

  translate(0, -scrollY);

​

  let aspectRatio = img.height / img.width;

  let imgHeight = width * aspectRatio; 

​

​

  if (!isMoving) {

    image(begin, 0, 0, width, height); // Draw the begin image

    beginButton.show(); // begin button

    fill(255, 0, 0); //fill color red

    textSize(32);

    textAlign(CENTER);

    text('Warning: Flashing', width / 2, height / 2 - 100); // 

    return; 

  }

  if (showLights && lights) {

    image(lights, 0, 0, width, imgHeight); // Draw the lights image

  }

​

​

  // modes

  if (currentMode === 1) {

    if (page1) {

      image(page1, 0, 0, width, height); 

    }

    if (movingImg && isMoving && movingImgMode === 1) {

      image(movingImg, imgX, imgY, window.width/9,  window.height/9); 

    }

    if (showLights && lights) {

      image(lights, 0, 0, width, imgHeight); 

    }

    if (border1) {

      image(border1, 0, 0, width, height); 

    }

​

  } else if (currentMode === 2) {

    if (page2) {

      image(page2, 0, 0, width, height); // Draw page2 image

    }

    if (movingImg && isMoving && movingImgMode === 2) {

      image(movingImg, imgX, imgY, window.width/9,window.height/9); // Draw the moving image

    }

    if (showLights && lights) {

      image(lights, 0, 0, width, imgHeight); // Draw the lights image

    }

    if (border2) {

      image(border2, 0, 0, width, height); // Draw border2 image

    }

  } else if (currentMode === 3) {

    // Mode 3: Display page3 and border3

    if (page3) {

      image(page3, 0, 0, width, height); // Draw page3 image

    }

    if (movingImg && isMoving && movingImgMode === 3) {

      image(movingImg, imgX, imgY, window.width/9, window.height/9); // Draw the moving image

    }

    if (showLights && lights) {

      image(lights, 0, 0, width, imgHeight); // Draw the lights image

    }

    if (border3) {

      image(border3, 0, 0, width, height); // Draw border3 image

    }

​

  }

​

  // Display the win image if the flag is set

  if (showWin && win) {

    image(win, 0, 0, width, height); // Draw the win image

    // Display the final elapsed time in red

    fill(255, 0, 0); // Set the fill color to red

    textSize(32);

    text(`Final Time: ${nf(finalElapsedTime / 1000, 1, 2)}s`, width / 2 - 150, height / 2 - 250);

  } else {

    // Display the elapsed time in red

    let elapsedTime = millis() - startTime;

    fill(255, 0, 0); // Set the fill color to red

    textSize(32);

    text(`Time: ${nf(elapsedTime / 1000, 1, 2)}s`, 100, 30);

  }

​

​

​

  // Update the image's position and toggle lights every 1 second if it is moving

  // Update the image's position and toggle lights at a fixed interval if it is moving

  if (millis() - lastUpdateTime > updateInterval) {

    if (isMoving) {

      imgX = random(width - 150); // Set the image's x position randomly within the canvas width

      imgY = random(height - 150); // Set the image's y position randomly within the canvas height

      movingImgMode = (movingImgMode % 3) + 1; // Cycle through the modes for movingImg

    }

    showLights = true; // Show the lights

    lightsVisibleTime = millis(); // Record the time when lights were shown

    lastUpdateTime = millis(); // Update the last update time

  }

​

  // Ensure lights are only visible for 1 second

  if (showLights && millis() - lightsVisibleTime > 500) {

    showLights = false; // Hide the lights after 1 second

  }

}

// Function to handle mouse wheel events

function mouseWheel(event) {

  scrollY += event.delta; // Update the scroll position based on the mouse wheel delta

  // Calculate the height to maintain the aspect ratio

  scrollY = constrain(scrollY, 0, window.height - height); // Constrain the scroll position to the image height

​

  // Update the mode based on the scroll direction and loop the modes

  if (event.delta > 0) {

    currentMode = (currentMode % 3) + 1; // Scroll down to increase mode and loop

  } else {

    currentMode = (currentMode - 2 + 3) % 3 + 1; // Scroll up to decrease mode and loop

  }

}

​

// Function to handle mouse press events

function mousePressed() {

  // Check if the mouse is within the bounds of the moving image

  if (mouseX > imgX && mouseX < imgX + 150 && mouseY > imgY && mouseY < imgY + 150) {

    showWin = true; // Set the flag to show the win image

    finalElapsedTime = millis() - startTime; // Record the final elapsed time

    resetButton.show(); // Show the reset button

  }

}

​

// Function to reset the game

function resetGame() {

  isMoving = !isMoving; // Reset the movement flag

  showWin = false; // Reset the win flag

  resetButton.hide(); // Hide the reset button

  imgX = width / 2; // Reset the image's x position to the center of the canvas

  imgY = height / 2; // Reset the image's y position to the center of the canvas

  lastUpdateTime = millis(); // Reset the last update time

  movingImgMode = Math.floor(Math.random() * 3) + 1; // Reset the random mode for movingImg

  startTime = millis(); // Reset the start time

}