Feat: stats [WIP]

This commit is contained in:
Grail Finder
2025-07-10 19:55:46 +03:00
parent ff6fed073e
commit 8392a764a2
6 changed files with 134 additions and 2 deletions

View File

@ -43,7 +43,7 @@
</head>
<body>
<div id="ancestor" hx-ext="sse" sse-connect="/sub/sse">
{{template "main" .}}
{{template "main" .}}
</div>
</body>
</html>

View File

@ -5,9 +5,11 @@
{{template "linklogin" .LinkLogin}}
{{ else if not .State.RoomID }}
<div id="hello-user" class="grid grid-cols-3 items-center text-xl py-2">
<div></div>
<p class="text-center">Hello {{.State.Username}}</p>
<div class="text-right">
<a href="/stats" class="bg-transparent hover:bg-green-500 text-green-700 font-semibold hover:text-white py-2 px-4 border border-green-500 hover:border-transparent rounded">
Stats
</a>
<a href="/signout"><button class="bg-indigo-600 text-white font-semibold text-sm px-4 py-2 rounded hover:bg-indigo-500">signout</button></a>
</div>
</div>

83
components/stats.html Normal file
View File

@ -0,0 +1,83 @@
{{define "stats"}}
<!DOCTYPE html>
<html lang="en">
<head>
<title>Alias</title>
<script src="/assets/tailwind.css"></script>
<link rel="stylesheet" href="/assets/style.css"/>
<script src="/assets/htmx.min.js"></script>
<script src="/assets/htmx.sse.js"></script>
<script src="/assets/helpers.js"></script>
<meta charset="utf-8" name="viewport" content="width=device-width,initial-scale=1"/>
<link rel="icon" sizes="64x64" href="/assets/favicon/wolfhead_negated.ico"/>
<style type="text/css">
body{
background-color: #0C1616FF;
color: #8896b2;
max-width: 1000px;
min-width: 0;
margin: 2em auto !important;
margin-left: auto;
margin-right: auto;
line-height: 1.5;
font-size: 16px;
font-family: Open Sans,Arial;
text-align: center;
display: block;
}
a{
color: #00a2e7;
}
a:visited{
color: #ca1a70;
}
table {
border-collapse: separate !important;
border-spacing: 10px 10px;
border: 1px solid white;
}
tr{
border: 1px solid white;
}
</style>
</head>
<body>
<div id="ancestor">
<div class="container mx-auto p-4">
<h1 class="text-2xl font-bold mb-4">Player Leaderboard</h1>
<div class="mb-4">
<a href="/" class="bg-blue-500 hover:bg-blue-700 text-white font-bold py-2 px-4 rounded">
Home
</a>
</div>
<div class="overflow-x-auto">
<table class="min-w-full bg-white">
<thead class="bg-gray-800 text-white">
<tr>
<th class="py-2 px-4">Player</th>
<th class="py-2 px-4">Games Played</th>
<th class="py-2 px-4">Games Won</th>
<th class="py-2 px-4">Games Lost</th>
<th class="py-2 px-4">Mime Winrate</th>
<th class="py-2 px-4">Guesser Winrate</th>
</tr>
</thead>
<tbody class="text-gray-700">
{{range .}}
<tr>
<td class="py-2 px-4 border">{{.PlayerUsername}}</td>
<td class="py-2 px-4 border">{{.GamesPlayed}}</td>
<td class="py-2 px-4 border">{{.GamesWon}}</td>
<td class="py-2 px-4 border">{{.GamesLost}}</td>
<td class="py-2 px-4 border">{{printf "%.2f" .MimeWinrate}}</td>
<td class="py-2 px-4 border">{{printf "%.2f" .GuesserWinrate}}</td>
</tr>
{{end}}
</tbody>
</table>
</div>
</div>
</div>
</body>
</html>
{{end}}