/** * Main application — layout management, header updates, sidebar nav, routing. */ (function () { 'use strict'; var elConnect = document.getElementById('app-connect'); var elConnected = document.getElementById('app-connected'); var elHeader = document.getElementById('server-header'); var elSidebar = document.getElementById('sidebar-nav'); var elTitle = document.getElementById('page-title'); // ---- Sidebar navigation ---- var navPages = [ { title: 'Server', path: '/:address/info' }, { title: 'Console', path: '/:address/console' }, { title: 'Chat', path: '/:address/chat' }, { title: 'Player List', path: '/:address/playerlist' } ]; function renderSidebar(address) { var html = ''; for (var i = 0; i < navPages.length; i++) { var url = navPages[i].path.replace(':address', address); var linkCls = (window._currentPage === navPages[i].title) ? ' nav-link active' : 'nav-link'; html += ''; } elSidebar.innerHTML = html; } function setActivePage(title) { window._currentPage = title; elTitle.textContent = title; if (Rcon.isConnected()) renderSidebar(Rcon.getAddress()); } // ---- Header update ---- var headerTimer = null; function updateHeader() { Rcon.request('serverinfo', function (msg) { var data = JSON.parse(msg.Message); document.getElementById('header-hostname').textContent = data.Hostname || 'Rust Server'; document.getElementById('header-uptime').innerHTML = ' ' + secondsToDuration(data.Uptime); document.getElementById('header-map').innerHTML = ' ' + (data.Map || ''); document.getElementById('header-players').innerHTML = ' ' + formatNumber(data.Players) + '/' + formatNumber(data.MaxPlayers); document.getElementById('header-fps').innerHTML = ' ' + formatNumber(data.Framerate) + 'fps'; document.getElementById('header-entities').innerHTML = ' ' + formatNumber(data.EntityCount); }); } function startHeaderUpdates() { updateHeader(); headerTimer = setInterval(updateHeader, 1000); } function stopHeaderUpdates() { if (headerTimer) { clearInterval(headerTimer); headerTimer = null; } } // ---- Disconnect button ---- document.getElementById('btn-disconnect').addEventListener('click', function () { if (confirm('Do you really want to disconnect?')) { Rcon.disconnect(); } }); // ---- Layout toggling ---- function showConnected(address) { elConnect.innerHTML = ''; elConnect.style.display = 'none'; elConnected.style.display = 'block'; elHeader.style.display = 'block'; renderSidebar(address); startHeaderUpdates(); } function showDisconnected() { stopHeaderUpdates(); elConnected.style.display = 'none'; elHeader.style.display = 'none'; elConnect.style.display = 'block'; // Clear any stale router content document.getElementById('app-view').innerHTML = ''; ConnectPage([], elConnect); } // ---- Events ---- Rcon.on('connected', function () { var addr = Rcon.getAddress(); showConnected(addr); Router.go('#/' + addr + '/info'); }); Rcon.on('disconnected', function () { showDisconnected(); }); // ---- Router setup ---- Router.add(/^\/([^/]+)\/info$/, 'Server', function (p, c) { setActiveSidebar('Server'); ServerInfoPage(p, c); }); Router.add(/^\/([^/]+)\/console$/, 'Console', function (p, c) { setActiveSidebar('Console'); ConsolePage(p, c); }); Router.add(/^\/([^/]+)\/chat$/, 'Chat', function (p, c) { setActiveSidebar('Chat'); ChatPage(p, c); }); Router.add(/^\/([^/]+)\/playerlist$/, 'Player List', function (p, c) { setActiveSidebar('Player List'); PlayerListPage(p, c); }); Router.add(/^\/([^/]+)\/player\/(.+)$/, 'Player Info', function (p, c) { setActiveSidebar('Player Info'); PlayerInfoPage(p, c); }); Router.start('#app-view'); // ---- Initial state ---- showDisconnected(); })();