const gameContainer = document.getElementById("game-container");
const scoreBoard = document.getElementById("score");
const timerElement = document.getElementById("time");
const pauseButton = document.getElementById("pause-button");

let score = 0;
let timeLeft = 30;
let gameInterval;
let isPaused = false;
let bubbleTimers = new Map(); 
///
const backgroundMusic = new Audio("sounds/background_music.mp3");
backgroundMusic.loop = true; // Repetir automáticamente
backgroundMusic.volume = 0.3;
document.body.addEventListener("click", () => {
  backgroundMusic.play().catch(error => console.error("Error al reproducir audio:", error));
}, { once: true }); // Solo se activa una vez
// Lista de objetos (nombre e imagen)
const objects = [
  { name: "apple", img: "apple.jpg", sound: "apple.mp3" },
  { name: "pear", img: "pear.jpg", sound: "pear.mp3" },
  { name: "orange", img: "orange.jpg", sound: "orange.mp3" },
  { name: "coconut", img: "coconut.jpg", sound: "coconut.mp3" },
  { name: "watermelon", img: "watermelon.jpg", sound: "watermelon.mp3" },
  { name: "banana", img: "banana.jpg", sound: "banana.mp3" },
  { name: "peach", img: "peach.jpg", sound: "peach.mp3" },
  { name: "cherry", img: "cherry.jpg", sound: "cherry.mp3" },
  { name: "grapes", img: "grapes.jpg", sound: "grapes.mp3" },
  { name: "melon", img: "melon.jpg", sound: "melon.mp3" },
  { name: "figs", img: "figs.jpg", sound: "figs.mp3" },
  { name: "pineapple", img: "pineapple.jpg", sound: "pineapple.mp3" },
  { name: "kiwi", img: "kiwi.jpg", sound: "kiwi.mp3" },
];

function createBubble() {
    if (isPaused) return; // No crear burbujas si el juego está en pausa
  
    const bubble = document.createElement("div");
    bubble.classList.add("bubble");
  
    // Seleccionar un objeto al azar
    const object = objects[Math.floor(Math.random() * objects.length)];
    bubble.style.backgroundImage = `url(images/${object.img})`;
  
    // Posición aleatoria
    const x = Math.random() * (window.innerWidth - 50);
    const y = Math.random() * (window.innerHeight - 50);
    bubble.style.left = `${x}px`;
    bubble.style.top = `${y}px`;
  
    // Añadir burbuja al contenedor
    gameContainer.appendChild(bubble);
  
    // Evento al hacer clic en la burbuja
    bubble.addEventListener("click", () => {
      if (isPaused) return; // No permitir clics en pausa
  
      score += 10; // Incrementa el puntaje
      scoreBoard.textContent = score;
  
      // Reproducir sonido
      const audio = new Audio(`sounds/${object.sound}`);
      const sound2 = new Audio('sounds/special_effect.mp3');
      audio.play();
      sound2.play();
  
      bubble.remove(); // Elimina la burbuja
      clearTimeout(bubbleTimers.get(bubble)); // Elimina el temporizador asociado
      bubbleTimers.delete(bubble);
    });
  
    // Configurar temporizador para eliminar burbuja
    const timeout = setTimeout(() => {
      bubble.remove();
      bubbleTimers.delete(bubble);
    }, 5000);
  
    bubbleTimers.set(bubble, timeout);
  }
  
  // Función para actualizar el temporizador
  function updateTimer() {
    if (isPaused || timeLeft <= 0) return;
  
    timeLeft--;
    timerElement.textContent = timeLeft;
  
    if (timeLeft <= 0) {
      clearInterval(gameInterval);
      endGame();
    }
  }
  
  // Función para iniciar el juego
  function startGame() {
    score = 0;
    timeLeft = 30;
    scoreBoard.textContent = score;
    timerElement.textContent = timeLeft;
    ///
    isPaused = false;
    backgroundMusic.play();
    gameInterval = setInterval(() => {
      createBubble();
      updateTimer();
    }, 1000);
  }
  function endGame() {
    // Redirigir a la página de resultados con el puntaje
    window.location.href = `final.html?score=${score}`;
  }
  // Función para pausar/reanudar el juego
  function togglePause() {
    isPaused = !isPaused;
  
    // Actualizar texto del botón
    pauseButton.textContent = isPaused ? "Reanudar" : "Pausar";
  
    // Detener/reanudar animaciones
    if (isPaused) {
      gameContainer.classList.add("paused");
  
      ///
      backgroundMusic.pause();
      // Pausar los temporizadores de las burbujas
      bubbleTimers.forEach((timeout, bubble) => {
        clearTimeout(timeout); // Detener el temporizador
      });
    } else {
      gameContainer.classList.remove("paused");
      ///
      backgroundMusic.play();
      // Reiniciar temporizadores para burbujas existentes
      bubbleTimers.forEach((_, bubble) => {
        const timeout = setTimeout(() => {
          bubble.remove();
          bubbleTimers.delete(bubble);
        }, 5000); // Reinicia el tiempo restante
  
        bubbleTimers.set(bubble, timeout);
      });
    }
  }
  
  // Evento para pausar/reanudar el juego
  pauseButton.addEventListener("click", togglePause);
  
  // Reinicia el juego
  function resetGame() {
    const bubbles = document.querySelectorAll(".bubble");
    bubbles.forEach(bubble => bubble.remove());
    bubbleTimers.clear();
    backgroundMusic.pause(); // Detener música de fondo
    backgroundMusic.currentTime = 0;
    setTimeout(startGame, 2000);
  }
  
  
  startGame();