triple t virus

function preload() {
  // Load the first jumpscare image
  jumpscareImage = loadImage('https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcQ5y9hqK1_1m7460gHkxhPzZGlqL53u1SiUwA&s');
  
  // Load the second jumpscare image (NEW)
  jumpscareImage2 = loadImage('https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcR8cVYRFVxnhmOEBzEkBjpMrhYG7LuQWj8MVA&s');
  
  // Load a suitable font for the virus text to give it a techy, monospaced look.
  // We're using Roboto Mono from the Fontsource CDN, which is reliable and works well with p5.js loadFont().
  // This specific URL is for latin characters, 400 weight (normal), normal style, in woff format.
  virusFont = loadFont('https://cdn.jsdelivr.net/npm/@fontsource/roboto-mono@latest/files/roboto-mono-latin-400-normal.woff');
}

function setup() {
  // Create a canvas that fills the entire browser window
  createCanvas(windowWidth, windowHeight);
  
  // Set the frame rate for smoother animations
  frameRate(60); 

  // Set the loaded font for all text drawn on the canvas
  textFont(virusFont);
  // Center all text horizontally and vertically
  textAlign(CENTER, CENTER);
  
  // Initialize jumpscare timers to the current time
  jumpscareTimer = millis();
  jumpscareTimer2 = millis(); // Initialize the second jumpscare timer (NEW)
  
  // Create the "Send Money" button
  virusButton = createButton('Send Money');
  // Create the new "Unlock Now" button
  unlockButton = createButton('Unlock Now');
  
  // Button styling (unified function to avoid repetition)
  function applyButtonStyle(button) {
    button.style('background-color', '#ff0000'); // Bright red background
    button.style('color', '#000000');           // Black text for high contrast
    button.style('font-family', 'Roboto Mono, monospace'); // Use the same techy font
    button.style('font-size', '24px');          // Large font size
    button.style('padding', '15px 30px');      // Generous padding for a bigger button
    button.style('border', '4px solid black');  // Thick black border for emphasis
    button.style('border-radius', '5px');       // Slightly rounded corners
    button.style('cursor', 'pointer');         // Change cursor to indicate it's clickable
  }

  applyButtonStyle(virusButton);
  applyButtonStyle(unlockButton);
  
  // Adjust position of both buttons
  positionButtons();
  
  // Attach click handlers to both buttons
  virusButton.mousePressed(handleButtonClick);
  unlockButton.mousePressed(handleUnlockButtonClick);
  
  // Adjust text sizes based on the initial window dimensions for responsiveness
  updateTextSizes();

  // --- Static Sound Setup (using p5.sound) ---
  // Create a white noise generator
  noiseGen = new p5.Noise('white');
  // Set a low amplitude for the background static (0.1 = 10% volume)
  noiseGen.amp(0.1);
  // Start the noise generator
  noiseGen.start();
  // Call userStartAudio() to enable audio playback in browsers
  // This needs to be called after a user interaction with the page.
  // Since the buttons are user interactions, the noise will start when the user clicks either of them,
  // or generally, when they interact with the sketch.
  userStartAudio(); 
}

function draw() {
  background(255, 0, 0); // Draw the background as solid red
  
  // Draw the "triple t virus" text at the top
  fill(0); // Set text color to black
  textSize(virusTextSize); // Use the responsive text size
  text('triple t virus', width / 2, height * 0.2); // Position 20% down the screen
  
  // Draw the "Send 100000 dollars to unlock computer" text below the title
  fill(0); // Set text color to black
  textSize(virusInstructionSize); // Use the responsive instruction text size
  text('Send 100000 dollars to unlock computer', width / 2, height * 0.4); // Position 40% down the screen
  
  // --- Jumpscare Logic 1 (13 seconds) ---
  // Check if 13 seconds have passed since the last jumpscare
  if (millis() - jumpscareTimer > jumpscareInterval) {
    showJumpscare = true; // Set flag to display jumpscare image
    jumpscareStartTime = millis(); // Record when the jumpscare started
    jumpscareTimer = millis(); // Reset the timer for the next jumpscare
  }
  
  // If showJumpscare is true, draw the image
  if (showJumpscare) {
    imageMode(CENTER); // Draw images from their center point
    // Draw the jumpscare image centered on the canvas and scaled to cover it
    image(jumpscareImage, width / 2, height / 2, width, height);
    
    // After the jumpscare duration, hide the image
    if (millis() - jumpscareStartTime > jumpscareDuration) {
      showJumpscare = false;
    }
  }

  // --- Jumpscare Logic 2 (5 seconds - NEW) ---
  // Check if 5 seconds have passed since the last jumpscare
  if (millis() - jumpscareTimer2 > jumpscareInterval2) {
    showJumpscare2 = true; // Set flag to display the second jumpscare image
    jumpscareStartTime2 = millis(); // Record when the second jumpscare started
    jumpscareTimer2 = millis(); // Reset the timer for the next second jumpscare
  }
  
  // If showJumpscare2 is true, draw the second image
  if (showJumpscare2) {
    imageMode(CENTER); // Draw images from their center point
    // Draw the second jumpscare image centered on the canvas and scaled to cover it
    image(jumpscareImage2, width / 2, height / 2, width, height);
    
    // After the second jumpscare duration, hide the image
    if (millis() - jumpscareStartTime2 > jumpscareDuration2) {
      showJumpscare2 = false;
    }
  }

  // --- Floating Text Logic ---
  // Loop through all floating texts, update them, display them, and remove inactive ones
  for (let i = floatingTexts.length - 1; i >= 0; i--) {
    floatingTexts[i].update();
    floatingTexts[i].display();
    if (!floatingTexts[i].active) {
      floatingTexts.splice(i, 1); // Remove inactive texts from the array
    }
  }
}

class FloatingText {
  constructor(text, x, y, duration, speedY, fontSize, fontColor = 0) {
    this.text = text;
    this.x = x;
    this.y = y;
    this.duration = duration; // milliseconds for the animation
    this.speedY = speedY;     // pixels per frame the text moves up (negative for up)
    this.fontSize = fontSize;
    this.fontColor = fontColor;
    this.alpha = 255;         // Initial opacity
    this.startTime = millis(); // Time when the text started floating
    this.active = true;       // Flag to indicate if the text is still animating
  }

  update() {
    if (!this.active) return; // If not active, no need to update

    let elapsedTime = millis() - this.startTime; // Time passed since start
    let progress = elapsedTime / this.duration;   // Animation progress (0 to 1)

    if (progress >= 1) {
      this.active = false; // Animation finished
      return;
    }

    this.y += this.speedY; // Move text upwards
    this.alpha = map(progress, 0, 1, 255, 0); // Fade out text as it moves
    this.alpha = constrain(this.alpha, 0, 255); // Ensure alpha stays within bounds
  }

  display() {
    if (!this.active) return; // If not active, no need to display

    fill(this.fontColor, this.alpha); // Set text color with current opacity
    textSize(this.fontSize);         // Set text size
    text(this.text, this.x, this.y); // Draw the text at its current position
  }
}

function createFloatingText(button, message) {
  let startX = button.position().x + button.width / 2; // Center floating text horizontally above the button
  let startY = button.position().y - 20; // Start floating text 20 pixels above the button
  let duration = 2000;   // Float for 2 seconds
  let speedY = -0.5;     // Move up 0.5 pixels per frame
  let fontSize = virusInstructionSize * 1.2; // Slightly larger font size for emphasis
  let fontColor = 0;     // Black text
  floatingTexts.push(new FloatingText(message, startX, startY, duration, speedY, fontSize, fontColor));
}

function handleButtonClick() {
  createFloatingText(virusButton, 'noob your computers fried forever');
}

function handleUnlockButtonClick() {
  createFloatingText(unlockButton, 'no');
}

function windowResized() {
  // Resize the canvas to match the new window dimensions
  resizeCanvas(windowWidth, windowHeight);
  // Update text sizes to remain responsive
  updateTextSizes();
  // Re-position the buttons based on new text sizes and canvas dimensions
  positionButtons();
}

function positionButtons() {
  const instructionText = 'Send 100000 dollars to unlock computer';
  const textBeforeSpace = 'Send 100000 dollars'; // Text including "dollars"
  const singleSpace = ' ';
  const paddingBelowText = 20; // Pixels below the instruction text baseline
  const gapBetweenButtons = 200; // Increased gap between the two buttons (from 120 to 200)

  // Temporarily set text size to calculate widths accurately
  // This is crucial because textWidth() depends on the current textSize()
  textSize(virusInstructionSize);

  const w_total = textWidth(instructionText);
  const w_before_space = textWidth(textBeforeSpace); // Width up to the right edge of "dollars"
  const w_single_space = textWidth(singleSpace);

  // Calculate the x-coordinate of the center of the space
  const x_space_center = (width / 2 - w_total / 2) + w_before_space + w_single_space / 2;

  // Calculate the y-coordinate for the buttons' top edge (both buttons will be on this line)
  const y_buttons_top = (height * 0.4 + virusInstructionSize / 2) + paddingBelowText;

  // Get the widths of the buttons (p5.Element.width/height are DOM element dimensions)
  const virusButtonWidth = virusButton.width;
  const unlockButtonWidth = unlockButton.width;

  // Calculate the total width needed for both buttons and the gap
  const totalButtonsWidth = virusButtonWidth + gapBetweenButtons + unlockButtonWidth;

  // Calculate the starting x-position for the leftmost button
  const leftButtonX = x_space_center - totalButtonsWidth / 2;

  // Position the "Send Money" button (left)
  virusButton.position(leftButtonX, y_buttons_top);

  // Position the "Unlock Now" button (right)
  unlockButton.position(leftButtonX + virusButtonWidth + gapBetweenButtons, y_buttons_top);
}

function updateTextSizes() {
  // Make the main virus title text size responsive, constraining it between 20px and 64px
  virusTextSize = constrain(width * 0.04, 20, 64);
  // Make the instruction text size responsive, constraining it between 16px and 32px
  virusInstructionSize = constrain(width * 0.02, 16, 32);
}