Files
oslstats/internal/view/seasonsview/detail_page.templ
2026-02-12 21:10:49 +11:00

224 lines
7.2 KiB
Plaintext

package seasonsview
import "git.haelnorr.com/h/oslstats/internal/db"
import "git.haelnorr.com/h/oslstats/internal/view/baseview"
import "time"
import "strconv"
import "git.haelnorr.com/h/oslstats/internal/permissions"
import "git.haelnorr.com/h/oslstats/internal/contexts"
templ DetailPage(season *db.Season, leaguesWithTeams []db.LeagueWithTeams) {
@baseview.Layout(season.Name) {
<div class="max-w-screen-2xl mx-auto px-4 py-8">
@SeasonDetails(season, leaguesWithTeams)
</div>
}
}
templ SeasonDetails(season *db.Season, leaguesWithTeams []db.LeagueWithTeams) {
{{
permCache := contexts.Permissions(ctx)
canEditSeason := permCache.HasPermission(permissions.SeasonsUpdate)
}}
<div class="bg-mantle border border-surface1 rounded-lg overflow-hidden">
<!-- Header Section -->
<div class="bg-surface0 border-b border-surface1 px-6 py-8">
<div class="flex flex-col sm:flex-row justify-between items-start sm:items-center gap-4">
<div>
<h1 class="text-4xl font-bold text-text mb-2">{ season.Name }</h1>
<div class="flex items-center gap-2 flex-wrap">
<span class="inline-block bg-blue px-3 py-1 rounded-full text-sm font-semibold text-mantle">
{ season.ShortName }
</span>
@SlapVersionBadge(season.SlapVersion)
@StatusBadge(season, false, false)
</div>
</div>
<div class="flex gap-2">
if canEditSeason {
<a
href={ templ.SafeURL("/seasons/" + season.ShortName + "/edit") }
class="rounded-lg px-4 py-2 hover:cursor-pointer text-center
bg-blue hover:bg-blue/75 text-mantle transition"
>
Edit
</a>
}
<a
href="/seasons"
class="rounded-lg px-4 py-2 hover:cursor-pointer text-center
bg-surface1 hover:bg-surface2 text-text transition"
>
Back to Seasons
</a>
</div>
</div>
</div>
<!-- Information Grid -->
<div class="grid grid-cols-1 md:grid-cols-2 gap-6 p-6">
<!-- Regular Season Section -->
<div class="bg-surface0 border border-surface1 rounded-lg p-6">
<h2 class="text-2xl font-bold text-text mb-4 flex items-center gap-2">
<span class="text-blue">●</span>
Regular Season
</h2>
<div class="space-y-3">
<div class="flex justify-between items-center">
<span class="text-subtext0">Start Date:</span>
<span class="text-text font-semibold">
{ formatDateLong(season.StartDate) }
</span>
</div>
<div class="flex justify-between items-center">
<span class="text-subtext0">End Date:</span>
<span class="text-text font-semibold">
if !season.EndDate.IsZero() {
{ formatDateLong(season.EndDate.Time) }
} else {
<span class="text-subtext1 italic">Not set</span>
}
</span>
</div>
<div class="flex justify-between items-center">
<span class="text-subtext0">Duration:</span>
<span class="text-text font-semibold">
if !season.EndDate.IsZero() {
{ formatDuration(season.StartDate, season.EndDate.Time) }
} else {
<span class="text-subtext1 italic">Ongoing</span>
}
</span>
</div>
</div>
</div>
<!-- Finals Section -->
<div class="bg-surface0 border border-surface1 rounded-lg p-6">
<h2 class="text-2xl font-bold text-text mb-4 flex items-center gap-2">
<span class="text-yellow">★</span>
Finals
</h2>
<div class="space-y-3">
<div class="flex justify-between items-center">
<span class="text-subtext0">Start Date:</span>
<span class="text-text font-semibold">
if !season.FinalsStartDate.IsZero() {
{ formatDateLong(season.FinalsStartDate.Time) }
} else {
<span class="text-subtext1 italic">Not set</span>
}
</span>
</div>
<div class="flex justify-between items-center">
<span class="text-subtext0">End Date:</span>
<span class="text-text font-semibold">
if !season.FinalsEndDate.IsZero() {
{ formatDateLong(season.FinalsEndDate.Time) }
} else {
<span class="text-subtext1 italic">Not set</span>
}
</span>
</div>
<div class="flex justify-between items-center">
<span class="text-subtext0">Duration:</span>
<span class="text-text font-semibold">
if !season.FinalsStartDate.IsZero() && !season.FinalsEndDate.IsZero() {
{ formatDuration(season.FinalsStartDate.Time, season.FinalsEndDate.Time) }
} else {
<span class="text-subtext1 italic">Not scheduled</span>
}
</span>
</div>
</div>
</div>
</div>
<!-- Leagues Section -->
<div class="px-6 pb-6">
<div class="bg-surface0 border border-surface1 rounded-lg p-6">
<h2 class="text-2xl font-bold text-text mb-4">Leagues</h2>
if len(leaguesWithTeams) == 0 {
<p class="text-subtext0 text-sm">No leagues assigned to this season.</p>
} else {
<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-4">
for _, lwt := range leaguesWithTeams {
<div class="bg-mantle border border-surface1 rounded-lg p-4 flex flex-col">
<!-- League Header -->
<a
href={ templ.SafeURL("/seasons/" + season.ShortName + "/leagues/" + lwt.League.ShortName) }
class="mb-3 pb-3 border-b border-surface1"
>
<h3 class="font-semibold text-text text-lg mb-1 hover:text-blue transition-colors">{ lwt.League.Name }</h3>
<span class="text-xs text-subtext0 font-mono">{ lwt.League.ShortName }</span>
</a>
<!-- Teams List -->
<div class="flex-1">
if len(lwt.Teams) == 0 {
<p class="text-sm text-subtext1 italic">No teams yet</p>
} else {
<div class="space-y-2">
for _, team := range lwt.Teams {
<div class="flex items-center gap-2 px-3 py-2 bg-surface0 border border-surface1 rounded hover:bg-surface1 transition-colors">
if team.Color != "" {
<div
class="w-3 h-3 rounded-full border border-surface1 shrink-0"
style={ "background-color: " + templ.SafeCSS(team.Color) }
></div>
}
<span class="text-sm text-text truncate">{ team.Name }</span>
</div>
}
</div>
}
</div>
</div>
}
</div>
}
</div>
</div>
</div>
}
func formatDateLong(t time.Time) string {
return t.Format("January 2, 2006")
}
func formatDuration(start, end time.Time) string {
days := int(end.Sub(start).Hours()/24) + 1
if days == 1 {
return "1 day"
} else if days < 7 {
return strconv.Itoa(days) + " days"
} else if days < 30 {
weeks := days / 7
if weeks == 1 {
return "1 week"
}
return strconv.Itoa(weeks) + " weeks"
} else if days < 365 {
months := days / 30
if months == 1 {
return "1 month"
}
return strconv.Itoa(months) + " months"
} else {
years := days / 365
if years == 1 {
return "1 year"
}
return strconv.Itoa(years) + " years"
}
}
templ SlapVersionBadge(version string) {
switch version {
case "rebound":
<span class="inline-block bg-green px-3 py-1 rounded-full text-sm font-semibold text-mantle">
Rebound
</span>
case "slapshot1":
<span class="inline-block bg-red px-3 py-1 rounded-full text-sm font-semibold text-mantle">
Slapshot 1
</span>
}
}