Files
podstalk/template/episode_form.html
T
jbrechtel c3d1adddc2
Build and Deploy / build-and-deploy (push) Successful in 47s
Fix blank episode form: move all CSS to external static files
- Go html/template rejects <style> blocks and inline style attributes
  when template expressions are present in URL/CSS contexts
- Move all inline CSS to static/auth.css, static/episode.css,
  static/dashboard.css
- Serve static files from embedded FS via /static/ handler
- Fix missing </div> in episode form audio file group
2026-07-08 13:12:43 -04:00

96 lines
4.4 KiB
HTML

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Podstalk — {{if .Editing}}Edit Episode{{else}}New Episode{{end}}</title>
<link rel="stylesheet" href="https://unpkg.com/neobrutalismcss@latest" />
<link rel="stylesheet" href="/static/episode.css" />
</head>
<body>
<nav class="nb-navbar" role="navigation" aria-label="Main navigation">
<a href="/" class="nb-navbar-brand" aria-label="Go to homepage">Podstalk</a>
<ul class="nb-navbar-nav" role="menubar">
<li class="nb-navbar-item" role="none">
<a href="/" class="nb-navbar-link" role="menuitem">Dashboard</a>
</li>
<li class="nb-navbar-item" role="none">
<a href="/signout" class="nb-navbar-link" role="menuitem">Sign Out</a>
</li>
</ul>
</nav>
<div class="container">
{{if .Error}}<div class="flash flash-error">{{.Error}}</div>{{end}}
<h2>{{if .Editing}}Edit Episode{{else}}New Episode{{end}}</h2>
<form method="post" enctype="multipart/form-data">
<div class="nb-form-group">
<label for="title">Title</label>
<input type="text" id="title" name="title" class="nb-input blue" required autofocus
value="{{if .Editing}}{{.Episode.Title}}{{end}}" />
</div>
<div class="nb-form-group">
<label for="description">Description</label>
<textarea id="description" name="description" class="nb-textarea"
rows="4">{{if .Editing}}{{.Episode.Description}}{{end}}</textarea>
</div>
<div class="nb-form-group">
<label for="audio_file">Audio File</label>
<div class="file-upload">
<input type="file" id="audio_file" name="audio_file" accept="audio/*" onchange="updateFileName(this)" />
<label for="audio_file" class="nb-button blue file-label">Choose Audio File</label>
<span class="file-name" id="audio_file_name"></span>
</div>
{{if .Editing}}
<div class="current-file">
{{if .Episode.AudioPath}}Current: {{.Episode.AudioPath}}{{else}}No audio file uploaded.{{end}}
</div>
{{end}}
</div>
<div class="nb-form-group">
<label for="image_file">Episode Image (optional)</label>
<div class="file-upload">
<input type="file" id="image_file" name="image_file" accept="image/*" onchange="updateFileName(this)" />
<label for="image_file" class="nb-button blue file-label">Choose Image</label>
<span class="file-name" id="image_file_name"></span>
</div>
{{if .Editing}}
<div class="current-file">
{{if .Episode.ImagePath}}Current: {{.Episode.ImagePath}}{{else}}No image uploaded.{{end}}
</div>
{{end}}
</div>
<div class="nb-form-group">
<label for="published_at">Published At</label>
<input type="datetime-local" id="published_at" name="published_at" class="nb-input blue"
value="{{if .Editing}}{{.PublishedAt}}{{end}}" />
</div>
<div class="form-actions">
<button type="submit" class="nb-button green">{{if .Editing}}Save Changes{{else}}Create Episode{{end}}</button>
<a href="/" class="nb-button default">Cancel</a>
</div>
</form>
</div>
<script>
function updateFileName(input) {
const span = document.getElementById(input.id + '_name');
if (span && input.files.length > 0) {
span.textContent = input.files[0].name;
}
}
(function() {
const input = document.getElementById('published_at');
if (!input.value) {
const now = new Date();
const pad = (n) => String(n).padStart(2, '0');
input.value = now.getFullYear() + '-' +
pad(now.getMonth() + 1) + '-' +
pad(now.getDate()) + 'T' +
pad(now.getHours()) + ':' +
pad(now.getMinutes());
}
})();
</script>
</body>
</html>