HUGE refactor. working towards web UI
This commit is contained in:
parent
dd54e8cc49
commit
1f94eecca9
29 changed files with 1669 additions and 162 deletions
18
templates/html/index.html
Normal file
18
templates/html/index.html
Normal file
|
|
@ -0,0 +1,18 @@
|
|||
{{define "head"}}
|
||||
<title>Melody VOD Manager</title>
|
||||
|
||||
<link rel="stylesheet" href="/style/index.css">
|
||||
{{end}}
|
||||
|
||||
{{define "content"}}
|
||||
<main>
|
||||
<h1>Melody VOD Manager</h1>
|
||||
<a href="/vods">Vods</a>
|
||||
<p>Templates:</p>
|
||||
<ul>
|
||||
<li><a href="/templates/title">Title</a></li>
|
||||
<li><a href="/templates/description">Description</a></li>
|
||||
<li><a href="/templates/tags">Tags</a></li>
|
||||
</ul>
|
||||
</main>
|
||||
{{end}}
|
||||
32
templates/html/layout.html
Normal file
32
templates/html/layout.html
Normal file
|
|
@ -0,0 +1,32 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
|
||||
<head>
|
||||
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
|
||||
<meta charset="UTF-8">
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
|
||||
{{block "head" .}}{{end}}
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<header>
|
||||
<nav>
|
||||
<a href="/">Home</a>
|
||||
<a href="/vods">Vods</a>
|
||||
</nav>
|
||||
</header>
|
||||
|
||||
{{block "content" .}}
|
||||
<main>
|
||||
<h1>hello, world!</h1>
|
||||
<p>
|
||||
this is a template page.
|
||||
you probably shouldn't be seeing this!
|
||||
</p>
|
||||
</main>
|
||||
{{end}}
|
||||
</body>
|
||||
|
||||
</html>
|
||||
55
templates/html/vod-list.html
Normal file
55
templates/html/vod-list.html
Normal file
|
|
@ -0,0 +1,55 @@
|
|||
{{define "head"}}
|
||||
<title>Listing "{{.Directory}}" - Melody VOD Manager</title>
|
||||
|
||||
<link rel="stylesheet" href="/style/vod-list.css">
|
||||
{{end}}
|
||||
|
||||
{{define "content"}}
|
||||
<main>
|
||||
<h1>VODs</h1>
|
||||
|
||||
<nav>→ {{range Crumbs .Directory}}<a href="./{{.Path}}">{{.Name}}</a>/{{end}}</nav>
|
||||
|
||||
<table>
|
||||
<thead>
|
||||
<tr>
|
||||
<th colspan="2">Name</th>
|
||||
<th>Size</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
{{range $VOD := .VODs}}
|
||||
<tr>
|
||||
<td>📼</td>
|
||||
<td><a href="/vods{{$.Directory}}/{{$VOD.Path}}">{{$VOD.Title}}</a></td>
|
||||
<td>—</td>
|
||||
</tr>
|
||||
{{end}}
|
||||
|
||||
{{range $Name := .Directories}}
|
||||
<tr>
|
||||
<td>📁</td>
|
||||
<td><a href="/vods{{$.Directory}}/{{$Name}}">{{$Name}}</a></td>
|
||||
<td>—</td>
|
||||
</tr>
|
||||
{{end}}
|
||||
|
||||
{{range $File := .Files}}
|
||||
<tr>
|
||||
<td>📄</td>
|
||||
<td><a href="/vods{{$.Directory}}/{{$File.Name}}">{{$File.Name}}</a></td>
|
||||
<td>{{$File.Size}}</td>
|
||||
</tr>
|
||||
{{end}}
|
||||
</tbody>
|
||||
</table>
|
||||
|
||||
<h2>Actions</h2>
|
||||
<div class="actions">
|
||||
<p>
|
||||
<a href="/vods{{.Directory}}?init=true">Initialise as VOD Directory</a>
|
||||
— Create a <code>metadata.toml</code> file here, initialising this directory as a VOD.
|
||||
</p>
|
||||
</div>
|
||||
</main>
|
||||
{{end}}
|
||||
72
templates/html/vod.html
Normal file
72
templates/html/vod.html
Normal file
|
|
@ -0,0 +1,72 @@
|
|||
{{define "head"}}
|
||||
<title>{{.Title}}</title>
|
||||
|
||||
<link rel="stylesheet" href="/style/vod.css">
|
||||
{{end}}
|
||||
|
||||
{{define "content"}}
|
||||
<main>
|
||||
<h1>VOD Details</h1>
|
||||
|
||||
<nav>→ {{range Crumbs .Directory}}<a href="./{{.Path}}">{{.Name}}</a>/{{end}}</nav>
|
||||
|
||||
<form method="POST">
|
||||
<div class="metadata-top">
|
||||
<div>
|
||||
<label for="title">Title</label>
|
||||
<input type="text" name="title" value="{{.Title}}" />
|
||||
</div>
|
||||
<div>
|
||||
<label for="part">Part</label>
|
||||
<input type="number" min="0" name="part" value="{{.Part}}" />
|
||||
</div>
|
||||
<div>
|
||||
<label for="date">Date</label>
|
||||
<input type="date" name="date" value="{{FormatTime .Date "2006-01-02"}}" />
|
||||
</div>
|
||||
</div>
|
||||
<p>Formatted Title: <strong>{{.TitleFormatted}}</strong></p>
|
||||
|
||||
<p>Uploaded: <span id="upload-state">{{if .Uploaded}}Yes{{else}}No{{end}}</span></p>
|
||||
|
||||
<p>Tags:</p>
|
||||
<ul>
|
||||
{{range .Tags}}
|
||||
<li><code>{{.}}</code></li>
|
||||
{{end}}
|
||||
</ul>
|
||||
|
||||
<p>Category:</p>
|
||||
<blockquote>
|
||||
<label for="category-enabled">Enabled</label>
|
||||
<input type="checkbox" name="category-enabled" {{if .Category}}checked{{end}} />
|
||||
<label for="category-name">Name</label>
|
||||
<input type="text" name="category-name" value="{{if ne .Category nil}}{{.Category.Name}}{{end}}" />
|
||||
<label for="category-type">Type</label>
|
||||
<select name="category-type">
|
||||
<option value="entertainment" {{if ne .Category nil}}{{if eq .Category.Type "entertainment"}}selected{{end}}{{end}}>Entertainment</option>
|
||||
<option value="gaming" {{if ne .Category nil}}{{if eq .Category.Type "gaming"}}selected{{end}}{{end}}>Gaming</option>
|
||||
</select>
|
||||
<label for="category-url">URL</label>
|
||||
<input type="text" name="category-url" value="{{if ne .Category nil}}{{.Category.Url}}{{end}}" />
|
||||
</blockquote>
|
||||
|
||||
<p>Formatted Description:</p>
|
||||
<p><pre class="description">{{.DescriptionFormatted}}</pre></p>
|
||||
|
||||
<button type="submit">Save</button>
|
||||
</form>
|
||||
|
||||
<hr>
|
||||
|
||||
<p>Footage Directory: <code>"{{.FootageDir}}"</code></p>
|
||||
<p>Footage Blocks:</p>
|
||||
<ul>
|
||||
{{range .Footage}}
|
||||
<li><code>{{.Name}} ({{.Size}})</code></li>
|
||||
{{end}}
|
||||
</ul>
|
||||
</main>
|
||||
|
||||
<script type="module" src="/script/vod.js" defer></script>
|
||||
{{end}}
|
||||
Loading…
Add table
Add a link
Reference in a new issue