Update minecraft server status page

This commit is contained in:
Daniel Flanagan 2023-11-06 17:19:44 -06:00
parent ef6e306cb3
commit 6dd8d36f57
Signed by: lytedev
GPG key ID: 5B2020A0F9921EF4

View file

@ -5,95 +5,68 @@ aliases:
/ourcraft-status /ourcraft-status
--- ---
<p id="server-status-loading"> <noscript>
Checking minecraft servers' status...
</p>
<div id="server-status-check-failed">
<p> <p>
Failed to retrieve <code>h.lyte.dev</code> server status. Unfortunately, that usually means we're <code><span style="color: var(--syntax-mag);">OFFLINE</span></code>. It looks like you have javascript disabled! This page uses javascript to query a third-party server which fetches data from our minecraft servers.
</p> </p>
<p> </noscript>
Please yell at <code>@lytedev</code> in Discord to fix it!
</p>
<p><button id="server-status-check-button">Try Again</button></p>
</div>
<div id="server-status-online" style="display: none;"> <button id="check-minecraft-server-status">Reload</button>
<p>Server <code>h.lyte.dev</code> is <code><span style="color: var(--syntax-name);">ONLINE</span></code></p>
<p id="server-status-player-info" style="display: none;">There are currently <span id="server-status-current-num-players">0</span>/<span id="server-status-max-players">20</span> players online.</p> <div id="server-status">
<h3 id="server-status-player-sampling-header" style="display: none;">Online Players</h3> <p id="server-status-loading">
<ul id="server-status-player-sampling" style="display: none;"> Checking minecraft servers' status...
<li>Player</li> </p>
<ul id="servers">
</ul> </ul>
<p id="server-status-player-sampling-insufficient" style="display: none">... and more!</p>
</div> </div>
<p id="server-status-offline" style="display: none;">
Server is <code><span style="color: var(--syntax-mag);">OFFLINE</span></code>
</p>
<script src="https://mcapi.us/scripts/minecraft.min.js"></script>
<script> <script>
function showServerStatus(key) { function checkMinecraftServerStatus() {
for (const name of ['server-status-check-failed', 'server-status-online', 'server-status-offline', 'server-status-loading']) { const loading = document.getElementById("server-status-loading")
if (name == key) { const servers = document.getElementById("servers")
document.getElementById(name).style.display = null
} else {
document.getElementById(name).style.display = 'none'
}
}
}
function checkServerStatus() {
showServerStatus('server-status-loading')
MinecraftAPI.getServerStatus('h.lyte.dev', {port: 25565}, function (err, status) {
console.debug("Status Errors:", err || false)
if (err || !('online' in status)) {
showServerStatus('server-status-check-failed')
} else {
handleOnlineStatus(status)
}
});
}
function handleOnlineStatus(status) {
console.debug("Status Data:", status)
if (status.online === true) {
showServerStatus('server-status-online')
const info = document.getElementById('server-status-player-info')
const samplingHeader = document.getElementById('server-status-player-sampling-header')
const samplingList = document.getElementById('server-status-player-sampling')
const insufficient = document.getElementById('server-status-player-sampling-insufficient')
info.style.display = 'none' loading.style.display = "inherit";
samplingHeader.style.display = 'none' servers.style.display = "none";
samplingList.style.display = 'none' try {
insufficient.style.display = 'none' fetch("https://api.lyte.dev/minecraft-server-status").then(res => {
res.json().then(statuses => {
if ('players' in status) { console.log(statuses)
if ('max' in status.players && 'now' in status.players) { loading.style.display = "none";
info.style.display = null servers.style.display = "inherit";
document.getElementById('server-status-current-num-players').textContent = status.players.now const newChildren = [];
document.getElementById('server-status-max-players').textContent = status.players.max for (let k of Object.keys(statuses)) {
if ('sample' in status.players && status.players.now > 0) { const status = statuses[k]
samplingHeader.style.display = null const el = document.createElement("li")
samplingList.style.display = null const s = document.createElement("strong")
samplingList.textContent = '' s.textContent = k
for (const player of status.players.sample) { const c = document.createElement("code")
const newListItem = document.createElement('li') c.className = "chroma"
newListItem.textContent = player.name const cs = document.createElement("span")
newListItem.title = player.id c.appendChild(cs)
samplingList.appendChild(newListItem) cs.className = (status.online ? "na" : "err")
} cs.textContent = status.online ? "ONLINE" : "OFFLINE"
if (status.players.sample.length != status.players.now) { const p = document.createElement("span")
document.getElementById('server-status-player-sampling-insufficient').style.display = null p.style.marginLeft = "0.5em";
if (status.players) {
p.textContent = `(${status.players.online}/${status.players.max} players)`
} }
el.replaceChildren(
s,
document.createTextNode(": "),
c,
p,
)
newChildren.push(el)
} }
} servers.replaceChildren(...newChildren)
} })
} else { }).catch(err => console.error(err))
showServerStatus('server-status-offline') } catch (err) {
console.err(err)
} }
} }
document.getElementById("server-status-check-button").addEventListener("click", checkServerStatus) document.getElementById("check-minecraft-server-status").addEventListener("click", checkMinecraftServerStatus)
checkServerStatus() document.addEventListener("DOMContentLoaded", checkMinecraftServerStatus)
</script> </script>