81 lines
2.5 KiB
Plaintext
81 lines
2.5 KiB
Plaintext
package templates
|
|
|
|
import "mal/internal/jikan"
|
|
import "mal/internal/shared/ui"
|
|
import "fmt"
|
|
import "strings"
|
|
|
|
templ Schedule() {
|
|
@Layout("mal - schedule") {
|
|
<div class="schedule-page">
|
|
<h1>Weekly schedule</h1>
|
|
<p class="schedule-subtitle">Airing times in JST</p>
|
|
|
|
<div class="schedule-tabs">
|
|
<button class="schedule-tab active" data-day="Monday" onclick="loadDay('monday', this)">Mon</button>
|
|
<button class="schedule-tab" data-day="Tuesday" onclick="loadDay('tuesday', this)">Tue</button>
|
|
<button class="schedule-tab" data-day="Wednesday" onclick="loadDay('wednesday', this)">Wed</button>
|
|
<button class="schedule-tab" data-day="Thursday" onclick="loadDay('thursday', this)">Thu</button>
|
|
<button class="schedule-tab" data-day="Friday" onclick="loadDay('friday', this)">Fri</button>
|
|
<button class="schedule-tab" data-day="Saturday" onclick="loadDay('saturday', this)">Sat</button>
|
|
<button class="schedule-tab" data-day="Sunday" onclick="loadDay('sunday', this)">Sun</button>
|
|
</div>
|
|
|
|
<div id="schedule-content" hx-get="/api/schedule?day=monday" hx-trigger="load">
|
|
@ui.LoadingIndicator("Loading schedule")
|
|
</div>
|
|
</div>
|
|
|
|
<script>
|
|
function loadDay(day, btn) {
|
|
document.querySelectorAll('.schedule-tab').forEach(t => t.classList.remove('active'));
|
|
btn.classList.add('active');
|
|
htmx.ajax('GET', '/api/schedule?day=' + day, '#schedule-content');
|
|
}
|
|
</script>
|
|
}
|
|
}
|
|
|
|
templ ScheduleDay(day string, animes []jikan.Anime) {
|
|
<div class="schedule-day">
|
|
<h2>{ strings.Title(day) }</h2>
|
|
if len(animes) == 0 {
|
|
<p class="no-anime">No anime scheduled.</p>
|
|
} else {
|
|
<div class="schedule-grid">
|
|
for _, anime := range animes {
|
|
@ScheduleAnimeCard(anime)
|
|
}
|
|
</div>
|
|
}
|
|
</div>
|
|
}
|
|
|
|
templ ScheduleAnimeCard(anime jikan.Anime) {
|
|
@ui.AnimeCard(ui.AnimeCardProps{
|
|
ID: anime.MalID,
|
|
Title: anime.DisplayTitle(),
|
|
ImageURL: anime.ImageURL(),
|
|
Class: "schedule-card",
|
|
ImgClass: "schedule-card-image",
|
|
}) {
|
|
<div class="schedule-card-info">
|
|
<div class="schedule-card-title">{ anime.DisplayTitle() }</div>
|
|
<div class="schedule-card-meta">
|
|
if anime.Broadcast.Time != "" {
|
|
<span class="schedule-time">{ anime.Broadcast.Time }</span>
|
|
}
|
|
if anime.Type != "" {
|
|
<span class="schedule-type">{ anime.Type }</span>
|
|
}
|
|
if anime.Episodes > 0 {
|
|
<span class="schedule-eps">{ fmt.Sprintf("%d ep", anime.Episodes) }</span>
|
|
}
|
|
</div>
|
|
if anime.Score > 0 {
|
|
<div class="schedule-card-score">★ { fmt.Sprintf("%.1f", anime.Score) }</div>
|
|
}
|
|
</div>
|
|
}
|
|
}
|