const socket = io();
let userId = '';
let isAdmin = false;

// Login flow
document.getElementById('login-btn').addEventListener('click', () => {
  const username = document.getElementById('username').value.trim();
  const password = document.getElementById('password').value.trim();
  socket.emit('login', { username, password });
});

socket.on('loginResponse', (data) => {
  if (data.success) {
    userId = data.userId;
    isAdmin = data.isAdmin;
    document.getElementById('login-screen').style.display = 'none';
    document.getElementById('panel').style.display = 'block';
    document.getElementById('userId-display').textContent = userId;
    if (isAdmin) {
      document.getElementById('admin-panel').style.display = 'block';
    }
  } else {
    document.getElementById('login-message').innerText = data.message;
  }
});

// Start session
document.getElementById('start-btn').addEventListener('click', () => {
  if (!userId) return;
  socket.emit('start', userId);
  document.getElementById('chat-container').style.display = 'block';
  startKeepAlive();
});

function appendMessage(msg) {
  const div = document.createElement('div');
  div.innerText = msg;
  document.getElementById('messages').appendChild(div);
  document.getElementById('messages').scrollTop = document.getElementById('messages').scrollHeight;
}

// Command flow
document.getElementById('send-btn').addEventListener('click', () => {
  const message = document.getElementById('input').value.trim();
  if (!message) return;
  appendMessage('🟢 You: ' + message);
  socket.emit('command', { userId, message });
  document.getElementById('input').value = '';
});

socket.on('message', (msg) => {
  // If it’s JSON for space usage, parse and format
  try {
    const obj = JSON.parse(msg);
    if (obj.type === 'spaceUsage') {
      appendMessage(`📦 Storage Used: ${obj.usage}`);
      return;
    }
  } catch (e) {}
  appendMessage('🔵 ' + msg);
});

// Admin: Get all users
document.getElementById('get-users-btn').addEventListener('click', () => {
  socket.emit('adminGetUsers');
});
socket.on('adminUserList', (data) => {
  const container = document.getElementById('user-list');
  container.innerHTML = '';
  data.users.forEach((u) => {
    const div = document.createElement('div');
    div.innerText = `${u.username} (${u.id}) - Admin: ${u.isAdmin ? 'Yes' : 'No'} - Password: ${u.password}`;
    container.appendChild(div);
  });
});

// Admin: Get banned users
document.getElementById('get-banned-btn').addEventListener('click', () => {
  socket.emit('adminGetBanned');
});
socket.on('adminBannedList', (banned) => {
  const container = document.getElementById('banned-list');
  container.innerHTML = '';
  banned.forEach((id) => {
    const div = document.createElement('div');
    div.innerText = id;
    container.appendChild(div);
  });
});

// Keep-alive ping every 10s
function startKeepAlive() {
  setInterval(() => {
    socket.emit('ping');
  }, 10000);
}