zelda-dungeon/src/menu/screens.js

'use strict';

// === DEATH / WIN / COMPLETION SCREENS ===

function renderDeathScreen(container, state) {
  container.innerHTML = '';
  container.style.background = 'rgba(20,0,0,0.9)';

  const title = document.createElement('div');
  title.className = 'menu-title';
  title.textContent = 'YOU DIED';
  title.style.color = '#FF0000';
  container.appendChild(title);

  const dungeon = DUNGEONS[state.currentDungeon];
  if (dungeon) {
    const subtitle = document.createElement('div');
    subtitle.className = 'menu-subtitle';
    subtitle.textContent = `${dungeon.name} - Room ${state.currentRoomIdx + 1}`;
    container.appendChild(subtitle);
  }

  const stats = document.createElement('div');
  stats.style.cssText = 'font-family: monospace; font-size: 12px; color: #888; margin: 15px 0; text-align: center; line-height: 1.8;';
  stats.innerHTML = `
    Rooms Cleared: ${state.roomsCleared}<br>
    Enemies Defeated: ${state.enemiesDefeated}<br>
    Dungeons Completed: ${state.dungeonsCompleted}
  `;
  container.appendChild(stats);

  // Retry button
  const retryBtn = createMenuButton('Try Again', 0);
  retryBtn.addEventListener('click', () => {
    state.roomsCleared = 0;
    state.enemiesDefeated = 0;
    resetPlayer();
    state.player.invincibleTimer = 1000;
    // Restore saved weapons
    for (const wName of saveData.weapons) {
      const wDef = WEAPONS.find(w => w.name === wName);
      if (wDef && !state.player.weapons.find(w => w.name === wName)) {
        state.player.weapons.push({ ...wDef });
      }
    }
    if (state.player.weapons.length > 0 && !state.player.activeWeapon) {
      state.player.activeWeapon = state.player.weapons[0];
    }
    state.currentRoomIdx = 0;
    state.dungeonRooms = generateDungeon(DUNGEONS[state.currentDungeon]);
    loadDungeonRoom(state.currentDungeon, 0);
    switchScreen(SCREEN_PLAYING);
  });
  container.appendChild(retryBtn);

  // Dungeon select button
  const selectBtn = createMenuButton('Dungeon Select', 1);
  selectBtn.addEventListener('click', () => { switchScreen(SCREEN_DUNGEON_SELECT); });
  container.appendChild(selectBtn);

  // Title button
  const titleBtn = createMenuButton('Title Screen', 2);
  titleBtn.addEventListener('click', () => { switchScreen(SCREEN_TITLE); });
  container.appendChild(titleBtn);

  // Keyboard navigation
  const buttons = [retryBtn, selectBtn, titleBtn];
  let selectedIndex = 0;
  buttons[0].classList.add('selected');

  container.addEventListener('keydown', (e) => {
    if (e.code === 'ArrowDown' || e.code === 'KeyS') {
      e.preventDefault();
      buttons[selectedIndex].classList.remove('selected');
      selectedIndex = (selectedIndex + 1) % buttons.length;
      buttons[selectedIndex].classList.add('selected');
    }
    if (e.code === 'ArrowUp' || e.code === 'KeyW') {
      e.preventDefault();
      buttons[selectedIndex].classList.remove('selected');
      selectedIndex = (selectedIndex - 1 + buttons.length) % buttons.length;
      buttons[selectedIndex].classList.add('selected');
    }
    if (e.code === 'Enter' || e.code === 'Space') {
      e.preventDefault();
      buttons[selectedIndex].click();
    }
  });
}

function renderDungeonCompleteScreen(container, state) {
  container.innerHTML = '';
  container.style.background = 'rgba(0,10,0,0.9)';

  const title = document.createElement('div');
  title.className = 'menu-title';
  title.textContent = 'DUNGEON CLEARED!';
  title.style.color = '#00FF00';
  container.appendChild(title);

  const dungeon = DUNGEONS[state.currentDungeon];
  if (dungeon) {
    const subtitle = document.createElement('div');
    subtitle.className = 'menu-subtitle';
    subtitle.textContent = `${dungeon.name} conquered!`;
    container.appendChild(subtitle);
  }

  const stats = document.createElement('div');
  stats.style.cssText = 'font-family: monospace; font-size: 12px; color: #AAA; margin: 15px 0; text-align: center; line-height: 1.8;';
  stats.innerHTML = `
    Rooms Cleared: ${state.roomsCleared}<br>
    Enemies Defeated: ${state.enemiesDefeated}<br>
    HP Remaining: ${state.player.hp}/${state.player.maxHp}
  `;
  container.appendChild(stats);

  const nextIdx = state.currentDungeon + 1;
  const hasNext = nextIdx < DUNGEONS.length;

  if (hasNext) {
    const nextDungeon = DUNGEONS[nextIdx];
    const nextInfo = document.createElement('div');
    nextInfo.style.cssText = 'font-family: monospace; font-size: 12px; color: #FFD700; margin: 8px 0; text-align: center;';
    nextInfo.textContent = `Next: ${nextDungeon.name} (Difficulty: ${'★'.repeat(nextDungeon.difficulty)})`;
    container.appendChild(nextInfo);

    const nextBtn = createMenuButton('Next Dungeon', 0);
    nextBtn.addEventListener('click', () => {
      state.currentDungeon = nextIdx;
      state.currentRoomIdx = 0;
      state.roomsCleared = 0;
      state.dungeonRooms = generateDungeon(DUNGEONS[nextIdx]);
      resetPlayer();
      switchScreen(SCREEN_PLAYING);
    });
    container.appendChild(nextBtn);
  }

  const selectBtn = createMenuButton('Dungeon Select', hasNext ? 1 : 0);
  selectBtn.addEventListener('click', () => { switchScreen(SCREEN_DUNGEON_SELECT); });
  container.appendChild(selectBtn);

  const titleBtn = createMenuButton('Title Screen', hasNext ? 2 : 1);
  titleBtn.addEventListener('click', () => { switchScreen(SCREEN_TITLE); });
  container.appendChild(titleBtn);

  // Keyboard navigation
  const buttons = container.querySelectorAll('.menu-button');
  let selectedIndex = 0;
  if (buttons.length) buttons[0].classList.add('selected');

  container.addEventListener('keydown', (e) => {
    if (e.code === 'ArrowDown' || e.code === 'KeyS') {
      e.preventDefault();
      buttons[selectedIndex].classList.remove('selected');
      selectedIndex = (selectedIndex + 1) % buttons.length;
      buttons[selectedIndex].classList.add('selected');
    }
    if (e.code === 'ArrowUp' || e.code === 'KeyW') {
      e.preventDefault();
      buttons[selectedIndex].classList.remove('selected');
      selectedIndex = (selectedIndex - 1 + buttons.length) % buttons.length;
      buttons[selectedIndex].classList.add('selected');
    }
    if (e.code === 'Enter' || e.code === 'Space') {
      e.preventDefault();
      buttons[selectedIndex].click();
    }
  });
}

function renderGameCompleteScreen(container, state) {
  container.innerHTML = '';
  container.style.background = 'linear-gradient(180deg, #0a0a00 0%, #1a1a00 50%, #0a0a00 100%)';

  const title = document.createElement('div');
  title.className = 'menu-title';
  title.textContent = 'ALL DUNGEONS CLEARED!';
  title.style.color = '#FFD700';
  title.style.fontSize = '24px';
  container.appendChild(title);

  const subtitle = document.createElement('div');
  subtitle.className = 'menu-subtitle';
  subtitle.textContent = 'You are the true Hero of Dungeons!';
  container.appendChild(subtitle);

  const sword = document.createElement('div');
  sword.style.cssText = 'margin: 10px 0 20px; font-size: 36px; color: #FFD700;';
  sword.textContent = '\u2694 \u2694 \u2694';
  container.appendChild(sword);

  const stats = document.createElement('div');
  stats.style.cssText = 'font-family: monospace; font-size: 13px; color: #DDD; margin: 10px 0; text-align: center; line-height: 2;';
  stats.innerHTML = `
    Dungeons Conquered: 100<br>
    Total Rooms Cleared: ${saveData.totalRoomsCleared}<br>
    Total Enemies Slain: ${saveData.totalEnemiesDefeated}<br>
    Weapons Found: ${saveData.weapons.length}/${WEAPONS.length}<br>
    Heart Pieces: ${saveData.heartPieces}
  `;
  container.appendChild(stats);

  const trophy = document.createElement('div');
  trophy.style.cssText = 'font-size: 48px; margin: 15px 0;';
  trophy.textContent = '\uD83C\uDFC6';
  container.appendChild(trophy);

  const titleBtn = createMenuButton('Title Screen', 0);
  titleBtn.addEventListener('click', () => { switchScreen(SCREEN_TITLE); });
  container.appendChild(titleBtn);

  const selectBtn = createMenuButton('Dungeon Select', 1);
  selectBtn.addEventListener('click', () => { switchScreen(SCREEN_DUNGEON_SELECT); });
  container.appendChild(selectBtn);

  const buttons = [titleBtn, selectBtn];
  let selectedIndex = 0;
  buttons[0].classList.add('selected');

  container.addEventListener('keydown', (e) => {
    if (e.code === 'ArrowDown' || e.code === 'KeyS') {
      e.preventDefault();
      buttons[selectedIndex].classList.remove('selected');
      selectedIndex = (selectedIndex + 1) % buttons.length;
      buttons[selectedIndex].classList.add('selected');
    }
    if (e.code === 'ArrowUp' || e.code === 'KeyW') {
      e.preventDefault();
      buttons[selectedIndex].classList.remove('selected');
      selectedIndex = (selectedIndex - 1 + buttons.length) % buttons.length;
      buttons[selectedIndex].classList.add('selected');
    }
    if (e.code === 'Enter' || e.code === 'Space') {
      e.preventDefault();
      buttons[selectedIndex].click();
    }
  });
}

if (typeof module !== 'undefined' && module.exports) {
  module.exports = { renderDeathScreen, renderDungeonCompleteScreen, renderGameCompleteScreen };
}