7 <link rel="preconnect" href="https://fonts.googleapis.com">
8 <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
9 <link href="https://fonts.googleapis.com/css2?family=Roboto+Condensed:wght@300;400;700&display=swap"
11 <script src="https://unpkg.com/htmx.org@1.7.0"
12 integrity="sha384-EzBXYPt0/T6gxNp0nuPtLkmRpmDBbjg6WmCUZRLXBBwYYmwAUxzlSGej0ARHX0Bo" crossorigin="anonymous"
14 <script src="/socket.io/socket.io.js"></script>
15 <link rel="stylesheet" type="text/css" href="https://unpkg.com/augmented-ui@2/augmented-ui.min.css">
16 <link rel="stylesheet" href="/scifi.css">
17 <link rel="stylesheet" href="/stylesheet.css">
24 <div class="pane" id="topbar" data-augmented-ui="br-clip bl-clip border">
26 <div class="col" id="nav">
29 <a href="#" hx-target="#main" hx-get="/poll/overview" hx-trigger="load, click">Home</a>
32 <a href="#" hx-target="#main" hx-get="/poll/construction" hx-trigger="click">Construction</a>
35 <a href="#" hx-target="#main" hx-get="/poll/unit-training" hx-trigger="click">Unit Training</a>
38 <a href="#" hx-target="#main" hx-post="/poll/map" hx-trigger="click">Map</a>
41 <a href="#" hx-target="#main" hx-get="/poll/mailroom" hx-trigger="click">Mail</a>
47 <div class="col" id="info-bar">
48 <span><b>Credits:</b> 10,000,0000</span>
49 <span><b>Alloys:</b> 10,000,000</span>
50 <span><b>Food:</b> 10,000,0000</span>
51 <span><b>Energy:</b> 10,000,0000</span>
59 <div id="notifications"></div>
60 <div id="main" data-augmented-ui="tl-clip tr-clip br-clip-x bl-clip border">
63 <div id="chat" data-augmented-ui="tl-2-clip-y tr-clip-x border">
64 <div id="chat-messages"></div>
65 <form id="chat-form" hx-post="/chat" class="row">
66 <input type="text" name="message" id="chat-input" class="col">
67 <button type="submit" class="col">Send</button>
73 <div id="stats" class="col text-right" hx-get="/server-stats" hx-trigger="load delay:1s, every 60s">
77 A project by <a href="https://xangelo.ca">xangelo</a>
81 ws.on('/chat-message', msg => {
82 document.querySelector('#chat-form').reset();
83 const $el = document.querySelector('#chat-messages');
84 $el.innerHTML = msg + $el.innerHTML;