Update public/script.js

public/script.js

@@ -1,269 +1,96 @@
-// ─────────────────────────────────────────────────────────────────────────────
-//                             Frontend Logic
-// ─────────────────────────────────────────────────────────────────────────────
-
 const socket = io();
-let currentUserId = null;
+let userId = '';
 let isAdmin = false;
 
-// ─────────────────────────────────────────────────────────────────────────────
-// 1) AUTHENTICATION (Register, Login, Logout)
-// ─────────────────────────────────────────────────────────────────────────────
-
-function doRegister() {
-  const username = document.getElementById('username').value.trim();
-  const password = document.getElementById('password').value.trim();
-  const clientId = document.getElementById('clientId').value.trim();
-  if (!username || !password || !clientId) {
-    showAuthMessage('All fields required for register.');
-    return;
-  }
-  socket.emit('register', { username, password, clientId });
-}
-
-function doLogin() {
+// Login flow
+document.getElementById('login-btn').addEventListener('click', () => {
   const username = document.getElementById('username').value.trim();
   const password = document.getElementById('password').value.trim();
-  if (!username || !password) {
-    showAuthMessage('Username & password required.');
-    return;
-  }
   socket.emit('login', { username, password });
-}
-
-function doLogout() {
-  location.reload(); // Full refresh to clear session
-}
-
-// Handle auth responses
-socket.on('registerResponse', (res) => {
-  const msgEl = document.getElementById('authMessage');
-  if (res.success) {
-    msgEl.style.color = 'green';
-    msgEl.innerText = `Registered! Your ID: ${res.userId}`;
-  } else {
-    msgEl.style.color = 'red';
-    msgEl.innerText = res.message;
-  }
 });
 
-socket.on('loginResponse', (res) => {
-  const msgEl = document.getElementById('authMessage');
-  if (res.success) {
-    currentUserId = res.userId;
-    isAdmin = res.isAdmin;
-    msgEl.innerText = '';
-    showMainPanel();
+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 {
-    msgEl.style.color = 'red';
-    msgEl.innerText = res.message;
+    document.getElementById('login-message').innerText = data.message;
   }
 });
 
-// ─────────────────────────────────────────────────────────────────────────────
-// 2) SHOW MAIN PANEL AFTER LOGIN
-// ─────────────────────────────────────────────────────────────────────────────
+// Start session
+document.getElementById('start-btn').addEventListener('click', () => {
+  if (!userId) return;
+  socket.emit('start', userId);
+  document.getElementById('chat-container').style.display = 'block';
+  startKeepAlive();
+});
 
-function showMainPanel() {
-  document.getElementById('authCard').style.display = 'none';
-  document.getElementById('mainPanel').style.display = 'block';
-  document.getElementById('displayUserId').innerText = currentUserId;
-  if (isAdmin) {
-    document.getElementById('adminBadge').style.display = 'inline-block';
-    document.getElementById('adminPanel').style.display = 'block';
-    fetchUsers();
-  }
-  // Start periodic stats & keep-alive ping
-  requestLiveStats();
-  startPing();
+function appendMessage(msg) {
+  const div = document.createElement('div');
+  div.innerText = msg;
+  document.getElementById('messages').appendChild(div);
+  document.getElementById('messages').scrollTop = document.getElementById('messages').scrollHeight;
 }
 
-// ─────────────────────────────────────────────────────────────────────────────
-// 3) LIVE STATS (uptime, system status, user counts)
-// ─────────────────────────────────────────────────────────────────────────────
-
-socket.on('serverRuntime', (uptimeStr) => {
-  document.getElementById('uptime').innerText = uptimeStr;
-});
-
-socket.on('systemStatus', (stats) => {
-  document.getElementById('cpu').innerText = stats.cpu + '%';
-  document.getElementById('mem').innerText = stats.memory + '%';
-  document.getElementById('disk').innerText = stats.disk + '%';
+// 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('userStats', (uStats) => {
-  document.getElementById('totalUsers').innerText = uStats.total;
-  document.getElementById('activeUsers').innerText = uStats.active;
-  document.getElementById('bannedUsers').innerText = uStats.banned;
+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 {}
+  appendMessage('🔵 ' + msg);
 });
 
-function requestLiveStats() {
-  socket.emit('getServerRuntime');
-  socket.emit('getSystemStatus');
-  socket.emit('getUserStats');
-  setTimeout(requestLiveStats, 5000);
-}
-
-// Keep-alive ping every 10 seconds to prevent HF from killing idle socket
-function startPing() {
-  setInterval(() => {
-    socket.emit('ping');
-  }, 10000);
-}
-
-// ─────────────────────────────────────────────────────────────────────────────
-// 4) ADMIN DASHBOARD (Fetch/list users, Ban/Unban/Delete/MakeAdmin/RemoveAdmin)
-// ─────────────────────────────────────────────────────────────────────────────
-
-function fetchUsers() {
+// Admin: Get all users
+document.getElementById('get-users-btn').addEventListener('click', () => {
   socket.emit('adminGetUsers');
-}
-
+});
 socket.on('adminUserList', (data) => {
-  const container = document.getElementById('adminUserList');
+  const container = document.getElementById('user-list');
   container.innerHTML = '';
-  if (!data.users.length) {
-    container.innerText = 'No users found.';
-    return;
-  }
   data.users.forEach((u) => {
-    const row = document.createElement('div');
-    row.className = 'user-row';
-    row.innerHTML = `
-      <span><b>${u.username}</b> (ID: ${u.id}) ${u.isAdmin ? '[Admin]' : ''}</span>
-      <button onclick="adminBan('${u.id}')">Ban</button>
-      <button onclick="adminUnban('${u.id}')">Unban</button>
-      <button onclick="adminDelete('${u.id}')">Delete</button>
-      <button onclick="adminMakeAdmin('${u.id}')">Make Admin</button>
-      <button onclick="adminRemoveAdmin('${u.id}')">Remove Admin</button>
-    `;
-    container.appendChild(row);
+    const div = document.createElement('div');
+    div.innerText = `${u.username} (${u.id}) - Admin: ${u.isAdmin ? 'Yes' : 'No'}`;
+    container.appendChild(div);
   });
 });
 
-socket.on('adminBanResponse', (res) => {
-  showAdminMessage(res.message, res.success);
-  fetchUsers();
-});
-socket.on('adminUnbanResponse', (res) => {
-  showAdminMessage(res.message, res.success);
-  fetchUsers();
-});
-socket.on('adminDeleteUserResponse', (res) => {
-  showAdminMessage(res.message, res.success);
-  fetchUsers();
-});
-socket.on('adminMakeAdminResponse', (res) => {
-  showAdminMessage(res.message, res.success);
-  fetchUsers();
+// Admin: Get banned users
+document.getElementById('get-banned-btn').addEventListener('click', () => {
+  socket.emit('adminGetBanned');
 });
-socket.on('adminRemoveAdminResponse', (res) => {
-  showAdminMessage(res.message, res.success);
-  fetchUsers();
-});
-
-function adminBan(userId) {
-  socket.emit('adminBanUser', userId);
-}
-function adminUnban(userId) {
-  socket.emit('adminUnbanUser', userId);
-}
-function adminDelete(userId) {
-  socket.emit('adminDeleteUser', userId);
-}
-function adminMakeAdmin(userId) {
-  socket.emit('adminMakeAdmin', userId);
-}
-function adminRemoveAdmin(userId) {
-  socket.emit('adminRemoveAdmin', userId);
-}
-
-function showAdminMessage(msg, success) {
-  const el = document.getElementById('adminMessage');
-  el.style.color = success ? 'green' : 'red';
-  el.innerText = msg;
-}
-
-// ─────────────────────────────────────────────────────────────────────────────
-// 5) USER CONSOLE (Start session, send commands, display output)
-// ──────────────────���──────────────────────────────────────────────────────────
-
-function startSession() {
-  if (!currentUserId) return;
-  socket.emit('start', currentUserId);
-}
-
-function sendCommand() {
-  const cmd = document.getElementById('commandInput').value.trim();
-  if (!cmd) return;
-  appendOutput(`> ${cmd}`);
-  socket.emit('command', { userId: currentUserId, message: cmd });
-  document.getElementById('commandInput').value = '';
-}
-
-socket.on('message', (data) => {
-  if (typeof data === 'string') {
-    appendOutput(data);
-  } else {
-    appendOutput(JSON.stringify(data, null, 2));
-  }
-});
-
-function appendOutput(text) {
-  const out = document.getElementById('consoleOutput');
-  out.innerText += text + '\n';
-  out.scrollTop = out.scrollHeight;
-}
-
-// ─────────────────────────────────────────────────────────────────────────────
-// 6) PASSWORD RESET (Request token, submit reset)
-// ─────────────────────────────────────────────────────────────────────────────
-
-function requestReset() {
-  const clientId = document.getElementById('resetClientId').value.trim();
-  if (!clientId) {
-    showResetMessage('Enter your Device ID first.', false);
-    return;
-  }
-  socket.emit('forgotPassword', clientId);
-}
-
-socket.on('resetTokenGenerated', ({ username, resetToken }) => {
-  showResetMessage(`Token generated for ${username}: ${resetToken}`, true);
-});
-
-socket.on('resetTokenError', (msg) => {
-  showResetMessage(msg, false);
-});
-
-function submitReset() {
-  const token = document.getElementById('resetToken').value.trim();
-  const newPass = document.getElementById('newPassword').value.trim();
-  if (!token || !newPass) {
-    showResetMessage('Token & new password are required.', false);
-    return;
-  }
-  socket.emit('resetPassword', { resetToken: token, newPassword: newPass });
-}
-
-socket.on('passwordResetSuccess', (msg) => {
-  showResetMessage(msg, true);
-});
-socket.on('passwordResetError', (msg) => {
-  showResetMessage(msg, false);
+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);
+  });
 });
 
-function showResetMessage(msg, success) {
-  const el = document.getElementById('resetMessage');
-  el.style.color = success ? 'green' : 'red';
-  el.innerText = msg;
-}
-
-// ─────────────────────────────────────────────────────────────────────────────
-// 7) HANDLE DISCONNECTS (optional cleanup)
-// ─────────────────────────────────────────────────────────────────────────────
-
-socket.on('disconnect', () => {
-  appendOutput('📴 Disconnected from server.');
-});
+// Keep-alive ping every 10s
+function startKeepAlive() {
+  setInterval(() => {
+    socket.emit('ping');
+  }, 10000);
+}