let nextButton, backButton;

let clothesImages = [];

let currentImageIndex = 0;

​

let img; // Variable to store the loaded image

let showDorm = false; // Flag to track whether to show the image or not

let showCloset = false;

let mainFont, numFont, computerFont;

let showCompHighlight = false;

let showClosetHighlight = false;

let showPictureHighlight = false;

let showMenu = false; // Flag to track if the menu should be shown

let showYe = false;

​

let computerItem, closetItem, pictureItem;

let computerBackground;

let snake;

let fruit;

let gameState = 'start';

let currentView = 'menu';

let doorStroke;

​

// Drum Machine variables

let numRows = 6;  // For example, kick, snare, hi-hat

let numCols = 38; // Number of steps in the sequence

let grid = [];

let currentStep = 0;

let soundFiles = [];

let bpm = 120;    // Beats per minute

let interval;     // Time between steps

let instrumentNames = ["kick", "snare", "open hat", "closed hat", 'crash', 'clap'];

let isPlaying = false;

let PlayPauseButton;

let rowColors = [];

​

function preload() {

  img = loadImage('dormroomp.jpg'); // Load the image

  // Fonts

  mainFont = loadFont('Fonts/MisterGrape.otf');

  numFont = loadFont("Fonts/crashingnumber.ttf");

  computerFont = loadFont("Fonts/computerFont.otf");

  // Highlight images and menu

  compHighlight = loadImage('dormPhotos/comphighlight.jpg'); 

  compback = loadImage("computerbackground.jpeg");

  closetHighlight = loadImage("dormPhotos/closetHighlight.jpg");

  pictureHighlight = loadImage("dormPhotos/pictureHighlight.jpg");

  ye = loadImage("ye.jpg");

  computerItem = new HoverableItem(824, 495, 300, 215, compHighlight);  // Adjusted for new resolution

  closetItem = new HoverableItem(1584, 200, 320, 725, closetHighlight);  // Adjusted for new resolution

  pictureItem = new HoverableItem(1010, 355, 105, 140, pictureHighlight);  // Adjusted for new resolution

  // Closet images

  for (let i = 1; i <= 19; i++) {

    clothesImages.push(loadImage(`clothes/clothes${i} Large.png`));

  }

  // Drum sounds

  soundFormats('mp3', 'wav');

  soundFiles[0] = loadSound('drumsounds/kick_bip.wav');   // Kick drum

  soundFiles[1] = loadSound('drumsounds/snare_bip.wav');  // Snare drum

  soundFiles[2] = loadSound('drumsounds/open hat_bip.wav');  // Open Hi-hat

  soundFiles[3] = loadSound('drumsounds/closed hhat_bip.wav');  // Closed Hi-hat

  soundFiles[4] = loadSound('drumsounds/crash_bip.wav');  // Crash

  soundFiles[5] = loadSound('drumsounds/clap_bip.wav');  // Clap

}

​

function setup() {

  fullscreen(true);

  createCanvas(1920, 1080);  // Set canvas to 1920x1080

  snake = new Snake(20); // Initialize snake with grid size of 20

  fruit = new Fruit(600, 600, 20); // Initialize fruit

  // Create buttons for closet image cycling

  nextButton = createButton('→');

  backButton = createButton('←');

​

  // Position buttons on each door of the closet

  nextButton.position(1400, 550); // Right door button (Adjusted for 1920x1080)

  backButton.position(300, 550);  // Left door button (Adjusted for 1920x1080)

​

  // Style buttons (optional)

  nextButton.size(50, 20);

  backButton.size(50, 20);

​

  // Add functionality to the buttons

  nextButton.mousePressed(showNextImage);

  backButton.mousePressed(showPreviousImage);

  nextButton.hide(); // Initially hide buttons until closet view is activated

  backButton.hide();

  // Initialize grid with "off" cells for drum machine

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

    grid[i] = [];

    for (let j = 0; j < numCols; j++) {

      grid[i][j] = false; 

    }

  }

  interval = (60 / bpm) * 1000 / (4); // Calculate the interval between steps based on BPM

  playPauseButton = createButton('Play');

  playPauseButton.position(10, 800);  // Adjusted for 1920x1080

  playPauseButton.mousePressed(togglePlayPause);

  playPauseButton.hide();

  // Start sequencer

  setInterval(playStep, interval);

  // Define different colors for each row

  rowColors = [

    color(255, 100, 100),   // Red for Kick

    color(100, 255, 100),   // Green for Snare

    color(100, 100, 255),   // Blue for Open Hat

    color(255, 255, 100),   // Yellow for Closed Hat

    color(255, 100, 255),   // Pink for Crash

    color(100, 255, 255)    // Cyan for Clap

  ];

}

​

function draw() {

  background(255, 253, 208);  // Set default background color

  print(mouseX,mouseY)

  if (showMenu) {

    // Handle views within the menu (menu or snake game)

    if (currentView === 'menu') {

      resizeCanvas(1920, 1080);

      drawMenu();  // Show computer menu

    } else if (currentView === 'snake') {

      resizeCanvas(1920, 1080);

      background(250, 249, 240);

      frameRate(10);

      drawSnakeGame();  // Run the Snake game

    } else if(currentView === 'drumMachine'){

      resizeCanvas(1920, 1080);

      background(250, 249, 240);

      drawDrumMachine();

    }

  } else if (showCloset == true) {

    resizeCanvas(1920, 1080);

    drawCloset();  // Show the closet interaction when in 'closet' view

  } else if (showYe == true) {

    resizeCanvas(1920, 1080);

    drawYe();

  } else if (showDorm) {

    resizeCanvas(1920, 1080);

    drawDorm();  // Separate out drawing the dorm view

  } else {

    drawDoors();

  }

}

​

// Function to draw the dorm room

function drawDorm() {

  clear();

  image(img, 0, 0, 1920, 1080);  // Adjusted for new resolution

  // Check hover status for all items

  computerItem.checkHover();

  closetItem.checkHover();

  pictureItem.checkHover();

​

  // Draw highlights based on hover status

  computerItem.drawHighlight();

  closetItem.drawHighlight();

  pictureItem.drawHighlight();

}

​

function drawYe() {

  clear();

  background(0);

  image(ye, 25, 25, 550, 550);  // Image position unchanged

}

​

function drawDoors() {

  // Main page text

  strokeWeight(1);

  textFont(mainFont);

  textSize(250);

  textAlign(CENTER);

  text("Linus's Dorm experience", width / 2, 200);  // Adjusted Y position for new resolution

  rectMode(CENTER);

​

  // Coordinates and dimensions for the doors

  let middleDoorX = width - 960;

  let doorY = height / 1.5;

  let doorW = 350;

  let doorH = 600;

  // Middle Door (Interaction on hover)

  if (mouseX > middleDoorX - doorW / 2 && mouseX < middleDoorX + doorW / 2 && 

      mouseY > doorY - doorH / 2 && mouseY < doorY + doorH / 2) {

    strokeWeight(5); // Thicker border on hover

    rect(middleDoorX, doorY, doorW, doorH);

  } else {

    strokeWeight(1); // Default stroke weight

    rect(middleDoorX, doorY, doorW, doorH);

  }

​

  // Draw the middle door

  fill(20, 180, 190);

  rect(middleDoorX, doorY, doorW, doorH);

  fill(250);

  strokeWeight(1);

  rect(middleDoorX, height / 1.75, 120, 80);  // Adjusted handle

  circle(middleDoorX + 100, doorY + 40, 40);  // Adjusted doorknob

  fill(0);

  strokeWeight(0);

  textAlign(CENTER);

  textFont(numFont);

  textSize(40);

  text('705', middleDoorX, (height / 1.75) + 20);

  // Left and Right doors (Not interactive)

  fill(20, 180, 190);

  strokeWeight(1);

  rect(width - 1600, doorY, doorW, doorH);

  rect(width - 320, doorY, doorW, doorH);

  fill(250);

  strokeWeight(1);

  rect(width - 1600, height / 1.75, 120, 80);  // Adjusted handles

  rect(width - 320, height / 1.75, 120, 80);   // Adjusted handles

  circle(width - 1550, doorY + 40, 40);

  circle(width - 270, doorY + 40, 40);

  fill(0);

  strokeWeight(0);

  text('704', width - 1600, (height / 1.75) + 20);

  text('706', width - 320, (height / 1.75) + 20);

}

​

function drawMenu() {

  background(50, 50, 50); // Change the background color for the menu

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

  textFont(computerFont);

  textSize(50);

  fill(255);

  textAlign(CENTER);

  textSize(30);

  text("Press 1: Open Drum Machine", width / 2, 250);  // Adjusted for new resolution

  text("Press 2: Play Snake", width / 2, 450);        // Adjusted for new resolution

  text("Press ESC to go back", width / 2, 650);       // Adjusted for new resolution

}

​

function drawSnakeGame() {

  if (gameState === 'start') {

    // Display start screen

    fill(0);

    background(0)

    textAlign(CENTER);

    textSize(50);

    text("Snake Game", 1920 / 2, 1080 / 4);  // Adjusted for new resolution

    textSize(36);

    text("Press ENTER to Start", 1920 / 2, 1080 / 2);  // Instructions to start

    text("Control using W A S D", 1920 / 2, 1080 / 2 + 100);

  }

  else if (gameState === 'playing') {

    if (gameActive) {

      snake.update();  // Update the snake's position

      snake.draw();  // Draw the snake

      // Check if the snake eats the fruit

      if (snake.x === fruit.x && snake.y === fruit.y) {

        snake.grow();  // Make the snake grow

        fruit.move();  // Move the fruit to a new position

      }

      fruit.draw();  // Draw the fruit

      // Check if the game is over

      if (gameOver()) {

        gameState = 'gameOver';  // If game over, change state

      }

    }

  }

  else if (gameState === 'gameOver') {

    // Display "Game Over" screen

    fill(0);

    textAlign(CENTER);

    textSize(72);

    text("Game Over", width / 2, height / 4);  // Display "Game Over" text

    textSize(60);

    text(snake.body.length + 1, width / 2, height / 2);  // Display the snake's length as score

    textSize(36);

    text("Press ENTER to Play Again", width / 2, height * 0.75);  // Instructions to replay

  }

}

​

function drawDrumMachine(){

  background(200);

  fill(0);

  strokeWeight(0);

  textFont(computerFont);

  rectMode(CORNER);

  text("Select the instruments for each beat with your mouse", 530, 980);  // Adjusted for 1920x1080

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

    for (let j = 0; j < numCols + 1; j++) { // Extra column for the dead node

      if (j === 0) {

        // Draw instrument name or icon in the first column (dead node)

        fill(rowColors[i]);

        strokeWeight(1);

        rect(j * 50, i * 50, 50, 50);

        fill(0);

        strokeWeight(0);

        textSize(10);

        textAlign(CENTER);

        text(instrumentNames[i], j * 50 + 25, i * 50 + 25);  // Centered instrument name

      } else {

        strokeWeight(1);

        // Regular grid cells for beat steps

        if (grid[i][j]) {

          fill(rowColors[i]);  // Active step

        } else {

          fill(254, 251, 234);  // Inactive step

        }

        if (j === currentStep) {

          stroke(255, 0, 0); // Highlight current step

        } else {

          stroke(0);

        }

        rect(j * 50, i * 50, 50, 50);

      }

    }

  }

  playPauseButton.show();

}

​

function drawCloset() {

  background(255, 253, 208);

​

  // Closet drawing

  strokeWeight(3);

​

  // Closet frame

  rectMode(RADIUS);

  fill(166, 138, 109);

  rect(960, height - 550, 350, 400); // Closet body (centered and resized for 1920x1080)

​

  // Closet doors

  rectMode(CORNER);

  fill(196, 164, 132);

  rect(560, 540, 800, 400);  // Door base resized for 1920x1080

  rect(600, 600, 720, 330);   // Lower door resized for 1920x1080

​

  // Closet handle

  rectMode(CENTER);

  strokeWeight(2);

  fill(170, 127, 36);

  rect(960, 850, 100, 14);  // Handle repositioned and resized for 1920x1080

​

  // Closet top design

  fill(196, 164, 132);

  quad(500, 50, 1420, 50, 1360, 130, 560, 130);  // Upper decorative design resized

​

  rectMode(CORNER);

  strokeWeight(0);

  fill(53, 33, 0);

  rect(560, 100, 800, 10);  // Horizontal bar in the design resized

​

  //feet

  strokeWeight(3);

  quad(600, 950, 620, 1000, 720, 1000, 740, 950);  // Left drawer resized

  quad(1320, 950, 1300, 1000, 1200, 1000, 1180, 950);  // Right drawer resized

​

  // Closet sides 

  strokeWeight(3);

  fill(196, 164, 132);

  quad(1335, 130, 1535, 110, 1535, 930, 1345, 900);  // Right side resized

  quad(510, 130, 320, 110, 320, 930, 510, 900);  // Left side resized

​

  // Display the current image in the center of the closet

  if (clothesImages[currentImageIndex]) {

    imageMode(CENTER);

    image(clothesImages[currentImageIndex], 960, 600, 450, 450);  // Adjusted image position and size

  }

​

  // Show the buttons for next/previous images when in closet view

  nextButton.show();

  backButton.show();

}

​

​

function showNextImage() {

  currentImageIndex = (currentImageIndex + 1) % clothesImages.length;

}

​

function showPreviousImage() {

  currentImageIndex = (currentImageIndex - 1 + clothesImages.length) % clothesImages.length;

}

​

function mousePressed() {

  let middleDoorX = width - 960;

  let doorY = height / 1.5;

  let doorW = 350;

  let doorH = 600;

​

  // Check if the mouse is within the middle door to display the main room image

  if (!showDorm && mouseX > middleDoorX - doorW / 2 && mouseX < middleDoorX + doorW / 2 && 

      mouseY > doorY - doorH / 2 && mouseY < doorY + doorH / 2) {

    showDorm = true; // Set flag to true to show the dorm room image

    showCompHighlight = false; // Reset highlight to ensure no immediate transition to computer menu

    return; // Exit the function after entering the dorm room

  }

​

  // Check if the user clicks on the computer only after dorm room is shown

  if (showDorm && !showMenu && computerItem.isHighlighted) {

    showMenu = true; // Show the menu when the user clicks on the computer

  }

  if (showDorm && !showMenu && pictureItem.isHighlighted) {

    showYe = true;

  }

  if (showDorm && closetItem.isHighlighted) {

    showCloset = true;  // Switch to the closet view

  }

  if (currentView === "drumMachine") {

    let col = floor(mouseX / 50);

    let row = floor(mouseY / 50);

    if (col < numCols && row < numRows) {

      grid[row][col] = !grid[row][col];

    }

  }

}

​

function keyPressed() {

  if (keyCode === BACKSPACE) {

    if (currentView === 'snake') {

      currentView = 'menu';  // Go back to the computer menu from Snake

    } else if (currentView === 'drumMachine') {

      currentView = 'menu';

      playPauseButton.hide();

    } else if (showMenu) {

      showMenu = false;  // Close the menu if it is open

    } else if (showCloset) {

      // Exit closet and return to dorm

      showCloset = false;

      imageMode(CORNER);

      showDorm = true;

      nextButton.hide();  // Hide closet buttons

      backButton.hide();

    } else if (showYe) {

      showYe = false;

      showDorm = true;

    } else if (showDorm) {

      // Exit dorm and return to doors

      showDorm = false;

    }

  }

​

  // Handle the computer menu view

  if (showMenu) {

    if (currentView === 'menu') {

      if (key === '1') {

        currentView = 'drumMachine';

      } else if (key === '2') {

        currentView = 'snake';  // Switch to the Snake game when '2' is pressed

        gameState = 'start';

      }

    }

​

    if (currentView === 'snake') {

      if (gameState === 'start' && keyCode === ENTER) {

        // Start the Snake game when ENTER is pressed

        resetGame();

        gameState = 'playing';

      }

​

      if (gameState === 'gameOver' && keyCode === ENTER) {

        // Replay the Snake game when ENTER is pressed on the game over screen

        resetGame();

        gameState = 'playing';

      }

​

      if (gameState === 'playing') {

        snake.action(key);  // Pass the key to the snake's action method

      }

    }

  }

  if(keyCode === 32){

    fullscreen(true); //enter full screen when spacebar is pressed

  }

}

​

function gameOver() {

  // Check if the snake goes out of bounds

  if (snake.x < 0 || snake.x >= 600 || snake.y < 0 || snake.y >= 600) {

    return true;

  }

  // Check if the snake runs into its own body

  for (let i = 0; i < snake.body.length; i++) {

    if (snake.x === snake.body[i][0] && snake.y === snake.body[i][1]) {

      return true;

    }

  }

  return false;

}

​

// Function to reset the Snake game

function resetGame() {

  snake = new Snake(20);  // Reset the snake object

  fruit = new Fruit(600, 600, 20);  // Reset the fruit object

  gameActive = true;  // Reactivate the game

}

​

// Drum machine functions

​

function playStep() {

  if (isPlaying) {

    // Play sounds for the active beats in the current step

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

      if (grid[i][currentStep + 1]) {  // Adjust for the dead node

        soundFiles[i].play();

      }

    }

    // Move to the next step

    currentStep = (currentStep + 1) % numCols;

  }

}

​

function togglePlayPause() {

  isPlaying = !isPlaying;

  if (isPlaying) {

    playPauseButton.html('Pause');

  } else {

    playPauseButton.html('Play');

  }

}

​