wpetit/kouiz
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: initial commit

Browse Source
This commit is contained in:
wpetit
2025-06-15 14:46:32 +02:00
parent 85f0bc1024
commit c50d1858f2
25 changed files with 2002 additions and 55 deletions
Download Patch File Download Diff File Expand all files Collapse all files

127
internal/http/handler/webui/quiz/component/leaderboard_page.templ Normal file
View File

@ -0,0 +1,127 @@
package component
import (
common "forge.cadoles.com/wpetit/kouiz/internal/http/handler/webui/common/component"
"forge.cadoles.com/wpetit/kouiz/internal/store"
"strconv"
)
type LeaderboardPageVModel struct {
Player *store.Player
Players []*store.Player
PlayerRank int
}
templ LeaderboardPage(vmodel LeaderboardPageVModel) {
@common.AppPage(common.WithPageOptions(
common.WithTitle("Tableau des scores"),
)) {
<h3 class="title">Podium</h3>
<div class="podium">
<div class="podium-position podium-second">
if len(vmodel.Players) > 1 {
<div class="podium-player">
<span class="has-text-weight-bold is-uppercase">{ vmodel.Players[1].Name }</span>
<br/>
<span class="has-text-grey is-size-7">{ strconv.FormatInt(int64(vmodel.Players[1].Score), 10) }pts</span>
</div>
}
<div class="podium-step">2ème</div>
</div>
<div class="podium-position podium-first">
if len(vmodel.Players) > 0 {
<div class="podium-player">
<span class="icon is-size-4 has-text-warning"><i class="fas fa-trophy"></i></span>
<br/>
<span class="has-text-weight-bold is-uppercase">{ vmodel.Players[0].Name }</span>
<br/>
<span class="has-text-grey is-size-7">{ strconv.FormatInt(int64(vmodel.Players[0].Score), 10) }pts</span>
</div>
}
<div class="podium-step">1er</div>
</div>
<div class="podium-position podium-third">
if len(vmodel.Players) > 2 {
<div class="podium-player">
<span class="has-text-weight-bold is-uppercase">{ vmodel.Players[2].Name }</span>
<br/>
<span class="has-text-grey is-size-7">{ strconv.FormatInt(int64(vmodel.Players[2].Score), 10) }pts</span>
</div>
}
<div class="podium-step">3ème</div>
</div>
</div>
<h3 class="title mt-5">Tableau des scores</h3>
<div class="table-container">
<table class="table is-fullwidth">
<thead>
<tr>
<th>Position</th>
<th>Pseudonyme</th>
<th>Score</th>
</tr>
</thead>
<tbody>
for i, p := range vmodel.Players {
<tr
if p.ID == vmodel.Player.ID {
class="has-text-weight-bold is-info"
}
>
<td>{ strconv.FormatInt(int64(i+1), 10) }</td>
<td>{ p.Name }</td>
<td>{ strconv.FormatInt(int64(p.Score), 10) }</td>
</tr>
}
</tbody>
</table>
</div>
<style>
.podium {
display: flex;
flex-direction: row;
align-items: flex-end;
justify-content: center;
gap: 10px;
}
.podium .podium-step {
width: 100px;
justify-content: center;
align-items: center;
display: flex;
font-weight: bold;
color: white;
text-shadow: 1px 1px #333;
}
.podium .podium-position {
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
}
.podium .podium-player {
text-shadow: none;
color: #333;
text-align: center;
}
.podium .podium-first .podium-step {
height: 70px;
background-color: hsl(141, 71%, 48%) ;
}
.podium .podium-second .podium-step {
height: 50px;
background-color: hsl(204, 86%, 53%);
}
.podium .podium-third .podium-step {
height: 30px;
background-color: #66d1ff;
}
</style>
}
}