PSForever/PSFPortal
1
0
Fork 0
mirror of https://github.com/psforever/PSFPortal.git synced 2026-07-16 00:44:40 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

Auto-refresh player list + empire stats

Browse source
This commit is contained in:
Chord 2020-05-13 22:57:07 +02:00
parent 96fcbba812
commit 26f743d907
3 changed files with 116 additions and 62 deletions
Download patch file Download diff file Expand all files Collapse all files

114
app/views/Home.svelte
View file

@ -14,24 +14,49 @@
let stats;
let alert;
let players;
let next_update = 30;
let next_update_label = "";
let empire_stats;
function format_account(account) {
return `<a href="/user/${account.id}">${account.username}</a>`
}
onMount(async () => {
try {
const resp = await axios.get("/api/stats")
stats = resp.data;
players = stats.players
alert.message("")
} catch (e) {
console.log(e)
alert.message("Failed to fetch stats from server")
}
await update_stats()
update_stats_label()
setInterval(update_stats_label, 1000)
ready = true
})
async function update_stats_label() {
if (next_update == 1) {
next_update = 30;
await update_stats()
empire_stats.refresh()
} else {
next_update -= 1
}
if (next_update == 1)
next_update_label = next_update + " second"
else
next_update_label = next_update + " seconds"
}
async function update_stats() {
try {
const resp = await axios.get("/api/stats")
stats = resp.data;
players = stats.players
stats.empires = stats.empires
alert.message("")
} catch (e) {
console.log(e)
alert.message("Failed to fetch stats from server")
}
}
</script>
<svelte:head>
@ -42,44 +67,47 @@
{#if stats}
<div class="row">
<div class="col-md-8 col-12">
<h1>PSForever Live Server</h1>
<div class="col-md-8 col-12">
<h1>PSForever Live Server</h1>
<div class="row">
<div class="col">
{#if !$loggedIn}
<a class="btn btn-primary" href="/login" role="button">Login</a>
<a class="btn btn-primary" href="/register" role="button">Create Account</a>
{/if}
<a class="btn btn-secondary" href="https://docs.google.com/document/d/1ZMx1NUylVZCXJNRyhkuVWT0eUKSVYu0JXsU-y3f93BY/edit" role="button">Setup Instructions</a>
</div>
</div><br/>
<div class="row">
<div class="col">
{#if !$loggedIn}
<a class="btn btn-primary" href="/login" role="button">Login</a>
<a class="btn btn-primary" href="/register" role="button">Create Account</a>
{/if}
<a class="btn btn-secondary" href="https://docs.google.com/document/d/1ZMx1NUylVZCXJNRyhkuVWT0eUKSVYu0JXsU-y3f93BY/edit" role="button">Setup Instructions</a>
</div>
</div><br/>
<p>
<strong>Server address:</strong> <code>play.psforever.net:51000</code>&nbsp;
<button type="button" class="btn btn-sm" class:btn-success={stats.status == "UP"}
<p>
<strong>Server address:</strong> <code>play.psforever.net:51000</code>&nbsp;
<button type="button" class="btn btn-sm" class:btn-success={stats.status == "UP"}
class:btn-danger={stats.status != "UP"}>Server {stats.status}</button><br/>
<strong>Last character created:</strong> <CharacterLink character={stats.last.character} /> (<span title={moment(stats.last.character.created).format(`MMMM Do YYYY, h:mm:ss a`)}>{moment(stats.last.character.created).fromNow()}</span>)<br/>
<strong># Accounts:</strong> {stats.accounts.toLocaleString()}<br/>
<strong># Characters:</strong> {stats.characters.toLocaleString()}
</p>
<strong>Last character created:</strong> <CharacterLink character={stats.last.character} /> (<span title={moment(stats.last.character.created).format(`MMMM Do YYYY, h:mm:ss a`)}>{moment(stats.last.character.created).fromNow()}</span>)<br/>
<strong># Accounts:</strong> {stats.accounts.toLocaleString()}<br/>
<strong># Characters:</strong> {stats.characters.toLocaleString()}
</p>
</div>
</div>
<div class="row">
<div class="col-12">
<h2>Online Players ({players.length})</h2>
<p>Next update in {next_update_label}</p>
</div>
<div class="col-md-8 col-12">
<div class="row">
{#each players as char, i}
<div class="col-md-4 col-12"><CharacterLink character={char} /></div>
{/each}
</div>
{#if players}
<h2>Online Players ({players.length})</h2>
<div class="row">
{#each players as char, i}
<div class="col-md-4 col-12"><CharacterLink character={char} /></div>
{/each}
</div>
{/if}
</div>
<div class="col-md-4 col-12 mt-md-0 mt-3">
<EmpireStats stats={stats.empires} />
</div>
</div>
<div class="col-md-4 col-12 mt-md-0 mt-3">
{#if stats.empires}
<EmpireStats bind:this={empire_stats} bind:stats={stats.empires} />
{/if}
</div>
</div>
{/if}