(function () {
  const BASE = '/Game';
  const roomListEl = document.getElementById('room-list');
  const roomListStatus = document.getElementById('room-list-status');
  const LOBBY_MAP_NAME = 'LobbyA';
  const LOBBY_ROOM_NAME = 'LobbyA';

  function getNick() {
    const el = document.getElementById('nick');
    return (el && el.value || '').trim() || 'ผู้เล่น';
  }

  function refreshRoomList() {
    if (!roomListStatus) return;
    roomListStatus.textContent = 'โหลดรายการห้อง...';
    fetch(BASE + '/api/spaces')
      .then(r => r.json())
      .then(list => {
        if (!Array.isArray(list)) { roomListStatus.textContent = 'ไม่มีห้องที่เปิดอยู่'; return; }
        roomListStatus.textContent = '';
        if (!roomListEl) return;
        roomListEl.innerHTML = '';
        if (list.length === 0) {
          roomListStatus.textContent = 'ยังไม่มีห้องสาธารณะ — สร้างห้อง Public หรือเข้าร่วมห้อง Private ด้วยรหัสด้านล่าง';
          return;
        }
        list.forEach(room => {
          const li = document.createElement('li');
          li.className = 'room-item';
          const code = room.spaceId || ('room-' + Math.random().toString(36).slice(2, 8));
          const mapName = room.mapName || '—';
          const count = room.peerCount != null ? room.peerCount : 0;
          const max = room.maxPlayers != null ? room.maxPlayers : 10;
          const full = count >= max;
          const namePart = room.spaceName ? ' <span class="room-meta-inline">(' + escapeHtml(room.spaceName) + ')</span>' : '';
          li.innerHTML = '<span class="room-name">' + escapeHtml(code) + '</span>' + namePart + ' <span class="room-meta">ฉาก: ' + escapeHtml(mapName) + ' · ' + count + '/' + max + ' คน' + (full ? ' (เต็ม)' : '') + '</span> ';
          const btn = document.createElement('button');
          btn.type = 'button';
          btn.textContent = full ? 'เต็ม' : 'เข้าร่วม';
          btn.disabled = full;
          btn.addEventListener('click', () => {
            window.location.href = 'room-lobby.html?space=' + encodeURIComponent(room.spaceId) + '&nick=' + encodeURIComponent(getNick());
          });
          li.appendChild(btn);
          roomListEl.appendChild(li);
        });
      })
      .catch(() => {
        if (roomListStatus) roomListStatus.textContent = 'โหลดรายการห้องไม่ได้';
      });
  }

  function escapeHtml(s) {
    const div = document.createElement('div');
    div.textContent = s;
    return div.innerHTML;
  }

  if (roomListEl) refreshRoomList();
  setInterval(refreshRoomList, 8000);

  const btnCreateLobby = document.getElementById('btn-create-lobby');
  if (btnCreateLobby) {
    btnCreateLobby.addEventListener('click', () => {
      const nick = getNick();
      fetch(BASE + '/api/maps')
        .then(r => r.json())
        .then(list => {
          const maps = Array.isArray(list) ? list : [];
          const lobbyMap = maps.find(m => (m.name || '').trim().toLowerCase() === LOBBY_MAP_NAME.toLowerCase());
          const mapId = lobbyMap ? lobbyMap.id : 'lobbya';
          const isPrivate = document.querySelector('input[name="room-type"]:checked')?.value === 'private';
          const maxPlayers = Math.min(10, Math.max(2, parseInt(document.getElementById('max-players')?.value || 10, 10)));
          const roomName = isPrivate ? 'ห้องส่วนตัว' : LOBBY_ROOM_NAME;
          return fetch(BASE + '/api/spaces', {
            method: 'POST',
            headers: { 'Content-Type': 'application/json' },
            body: JSON.stringify({ mapId, name: roomName, isPrivate, maxPlayers })
          }).then(r => r.json()).then(data => {
            if (data.ok) {
              window.location.href = 'room-lobby.html?space=' + encodeURIComponent(data.spaceId) + '&nick=' + encodeURIComponent(nick);
            } else {
              alert(data.error || 'สร้างห้องไม่ได้');
            }
          });
        })
        .catch(() => alert('โหลดรายการฉากไม่ได้ หรือยังไม่มีฉากชื่อ "' + LOBBY_MAP_NAME + '" ใน Editor — สร้างฉากชื่อ LobbyA ก่อน'));
    });
  }

  const formJoin = document.getElementById('form-join');
  const spaceIdInput = document.getElementById('space-id');
  if (formJoin && spaceIdInput) {
    formJoin.addEventListener('submit', (e) => {
      e.preventDefault();
      const spaceId = spaceIdInput.value.trim();
      window.location.href = 'room-lobby.html?space=' + encodeURIComponent(spaceId) + '&nick=' + encodeURIComponent(getNick());
    });
  }
})();