Moved regio43 to base HTML template

This commit is contained in:
2025-05-23 18:30:08 +02:00
parent 847fb6491d
commit 54986f6edf
6 changed files with 38 additions and 46 deletions

View File

@@ -1,6 +1,21 @@
package baseTemplates package baseTemplates
import "embed" import (
"embed"
"html/template"
"net/http"
)
//go:embed templates/* //go:embed templates/*
var FS embed.FS var FS embed.FS
func WithBase(w http.ResponseWriter, templateData any, patterns ...string) {
args := append([]string{"templates/base.tmpl"}, patterns...)
tmpl := template.Must(template.ParseFS(FS, args...))
err := tmpl.ExecuteTemplate(w, "base", templateData)
if err != nil {
http.Error(w, err.Error(), http.StatusInternalServerError)
return
}
}

View File

@@ -1,19 +1,13 @@
<!DOCTYPE html> {{ define "bodyClass" }}page-regio43{{ end }}
<html>
<head> {{ define "content" }}
<meta charset="utf-8"> <div class="video-zone max-80">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>prettysunflower - Regio 43</title>
<link rel="stylesheet" type="text/css" href="/static/css/style.css">
</head>
<body class="page-radio-trains">
<div class="video-zone">
<video id="video-player" controls></video> <video id="video-player" controls></video>
</div> </div>
<h1>Regio 43</h1> <h1>Regio43</h1>
<main> <main class="max-80">
{{ range .PlaylistItems }} {{ range .PlaylistItems }}
<div class="playlist-item" data-videoid="{{ .VideoId }}"> <div class="playlist-item" data-videoid="{{ .VideoId }}">
<img src="{{ .ThumbnailUrl }}"> <img src="{{ .ThumbnailUrl }}">
@@ -52,5 +46,4 @@
} }
}) })
</script> </script>
</body> {{ end }}
</html>

View File

@@ -1,13 +1,9 @@
package regio43 package regio43
import ( import (
"embed"
"net/http" "net/http"
) )
//go:embed templates/*
var content embed.FS
func InitHttpHandlers() { func InitHttpHandlers() {
http.HandleFunc("/regio43/", trains) http.HandleFunc("/regio43/", trains)
} }

View File

@@ -1,9 +1,9 @@
package regio43 package regio43
import ( import (
"html/template"
"math/rand" "math/rand"
"net/http" "net/http"
"prettysunflower-website/baseTemplates"
) )
type TrainsTemplateData struct { type TrainsTemplateData struct {
@@ -16,19 +16,7 @@ func trains(w http.ResponseWriter, r *http.Request) {
trainsPlaylist[i], trainsPlaylist[j] = trainsPlaylist[j], trainsPlaylist[i] trainsPlaylist[i], trainsPlaylist[j] = trainsPlaylist[j], trainsPlaylist[i]
}) })
templateFile := "templates/regio43.tmpl" baseTemplates.WithBase(w, TrainsTemplateData{
files, err := template.New(templateFile).ParseFS(content, templateFile)
if err != nil {
http.Error(w, err.Error(), http.StatusInternalServerError)
return
}
err = files.ExecuteTemplate(w, "regio43.tmpl", TrainsTemplateData{
PlaylistItems: trainsPlaylist, PlaylistItems: trainsPlaylist,
}) }, "templates/regio43.tmpl")
if err != nil {
http.Error(w, err.Error(), http.StatusInternalServerError)
return
}
} }

View File

@@ -1,6 +1,6 @@
@use "colors"; @use "colors";
.page-radio-trains { .page-regio43 {
.video-zone { .video-zone {
display: flex; display: flex;
justify-content: center; justify-content: center;

View File

@@ -192,53 +192,53 @@ body {
border: 0.5px solid oklch(75% 0 0deg); border: 0.5px solid oklch(75% 0 0deg);
} }
.page-radio-trains .video-zone { .page-regio43 .video-zone {
display: flex; display: flex;
justify-content: center; justify-content: center;
align-items: center; align-items: center;
padding: 1rem; padding: 1rem;
} }
.page-radio-trains .video-zone #video-player { .page-regio43 .video-zone #video-player {
aspect-ratio: 16/9; aspect-ratio: 16/9;
max-width: 80%; max-width: 80%;
max-height: 50vh; max-height: 50vh;
width: 100%; width: 100%;
} }
.page-radio-trains h1 { .page-regio43 h1 {
padding: 0 1rem; padding: 0 1rem;
text-align: center; text-align: center;
} }
.page-radio-trains main { .page-regio43 main {
display: grid; display: grid;
gap: 1rem; gap: 1rem;
padding: 1rem; padding: 1rem;
grid-template-columns: repeat(4, 1fr); grid-template-columns: repeat(4, 1fr);
} }
.page-radio-trains main > div img { .page-regio43 main > div img {
width: 100%; width: 100%;
} }
.page-radio-trains main > div.active { .page-regio43 main > div.active {
background-color: oklch(from oklch(97% 0.0261 90.1deg) calc(l - 0.05) c h); background-color: oklch(from oklch(97% 0.0261 90.1deg) calc(l - 0.05) c h);
} }
.page-radio-trains main > div p { .page-regio43 main > div p {
margin: 0.5em; margin: 0.5em;
} }
.page-radio-trains main > div p a { .page-regio43 main > div p a {
text-decoration: none; text-decoration: none;
color: black; color: black;
} }
@media screen and (max-width: 992px) { @media screen and (max-width: 992px) {
.page-radio-trains main { .page-regio43 main {
grid-template-columns: repeat(3, 1fr); grid-template-columns: repeat(3, 1fr);
} }
} }
@media screen and (max-width: 768px) { @media screen and (max-width: 768px) {
.page-radio-trains main { .page-regio43 main {
grid-template-columns: repeat(2, 1fr); grid-template-columns: repeat(2, 1fr);
} }
} }
@media screen and (max-width: 576px) { @media screen and (max-width: 576px) {
.page-radio-trains main { .page-regio43 main {
grid-template-columns: 1fr; grid-template-columns: 1fr;
} }
} }