let gameStarted = false;

let gameOver = false;

let gameWon = false;

let startButton;

let bgIntro;

let bgGame;

let bgMusic;

let cardBack;

let cardImages = [];

let cards = [];

let flippedCards = [];

let matchedCards = [];

​

// Game Timer Section

let gameTime = 20; // Timer starts from 20 seconds

let initTime = 0;

let remainingTime;

​

let cardWidth = 100;

let cardHeight = 150;

let numCards = 6;

​

function preload() {

  bgIntro = loadImage("BG.jpg"); // Background for all screens

  bgGame = loadImage("BG.jpg");

  bgMusic = loadSound("music.mp3"); // Load background music

  cardBack = loadImage("back.card.png"); // Load card back image

  // Load card face images

  cardImages.push(loadImage("cake.png"));

  cardImages.push(loadImage("kek.png"));

  cardImages.push(loadImage("Muffin.png"));

}

​

function setup() {

  createCanvas(800, 800);

  textAlign(CENTER, CENTER);

  let buttonWidth = 120;

  let buttonHeight = 60;

  startButton = createButton("Start the Game");

  startButton.size(buttonWidth, buttonHeight);

  startButton.position(width / 2 - buttonWidth / 2, height / 2 - buttonHeight / 2);

  startButton.style('font-size', '20px');

  startButton.style('background-color', '#ff1493'); // Deep pink color

  startButton.style('color', '#ffffff');

  startButton.style('border', 'none');

  startButton.style('border-radius', '10px');

  startButton.style('cursor', 'pointer');

  startButton.mousePressed(startGame);

  remainingTime = gameTime;

  if (!bgMusic.isPlaying()) {

    bgMusic.loop(); // Start and loop the background music immediately

  }

}

​

function draw() {

  if (!gameStarted) {

    drawStartScreen();

  } else {

    background(bgGame);

    drawGameScreen();

    drawCards();

    if (gameWon) {

      drawSuccessMessage();

    } else if (gameOver) {

      drawFailMessage();

    }

  }

}

​

function drawStartScreen() {

  background(bgIntro);

  fill(255);

  textSize(60);

  text("Memory Card Game", width / 2, 100);

  fill(255);

  textSize(28);

  text("Test your memory by matching cards!\nFind two matching cards.", width / 2, 600);

}

​

function drawSuccessMessage() {

  fill(255, 20, 147); // Pink color

  textSize(80);

  text("SUCCESS!", width / 2, height / 2);

  noLoop();

}

​

function drawFailMessage() {

  fill(255, 20, 147); // Pink color

  textSize(80);

  text("FAIL!", width / 2, height / 2);

  noLoop();

}

​

function drawGameScreen() {

  fill(255, 182, 193, 200);

  rect(width - 160, 20, 140, 60, 10);

  fill(255);

  textSize(18);

  text("Time Remaining", width - 90, 35);

  textSize(32);

  remainingTime = gameTime - floor((millis() - initTime) / 1000);

  if (remainingTime < 0) {

    remainingTime = 0;

  }

  text("" + remainingTime, width - 90, 60);

  if (remainingTime === 0) {

    gameOver = true;

    gameStarted = false;

  }

}

​

function initializeCards() {

  let images = [...cardImages, ...cardImages];

  images = shuffleArray(images);

  let startX = (width - (numCards / 2 * (cardWidth + 20))) / 2;

  let startY = height / 2 - cardHeight / 2;

  cards = [];

  flippedCards = [];

  matchedCards = [];

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

    let x = startX + (i % 3) * (cardWidth + 20);

    let y = startY + floor(i / 3) * (cardHeight + 20);

    cards.push({ x: x, y: y, image: images[i], revealed: false });

  }

}

​

function drawCards() {

  for (let card of cards) {

    if (card.revealed || matchedCards.includes(card)) {

      image(card.image, card.x, card.y, cardWidth, cardHeight);

    } else {

      image(cardBack, card.x, card.y, cardWidth, cardHeight);

    }

  }

}

​

function mousePressed() {

  if (!gameStarted || gameOver || gameWon) return;

  for (let card of cards) {

    if (

      mouseX > card.x && mouseX < card.x + cardWidth &&

      mouseY > card.y && mouseY < card.y + cardHeight &&

      !card.revealed && !matchedCards.includes(card)

    ) {

      card.revealed = true;

      flippedCards.push(card);

      if (flippedCards.length === 2) {

        checkMatch();

      }

      break;

    }

  }

}

​

function checkMatch() {

  let [card1, card2] = flippedCards;

  if (card1.image === card2.image) {

    matchedCards.push(card1, card2);

    if (matchedCards.length === numCards) {

      gameWon = true;

      gameStarted = false;

    }

  } else {

    setTimeout(() => {

      card1.revealed = false;

      card2.revealed = false;

    }, 1000);

  }

  flippedCards = [];

}

​

function shuffleArray(array) {

  for (let i = array.length - 1; i > 0; i--) {

    let j = Math.floor(Math.random() * (i + 1));

    [array[i], array[j]] = [array[j], array[i]];

  }

  return array;

}

​

function startGame() {

  gameStarted = true;

  gameWon = false;

  gameOver = false;

  startButton.hide();

  initTime = millis();

  initializeCards();

}

​