queue.html
⎇
Raw
1{{define "queue"}}
2<div class="page-header">
3 <h2>Queue</h2>
4 <div class="actions">
5 <form method="post" action="/queue/clear" class="inline">
6 <button type="submit" class="secondary">Clear All</button>
7 </form>
8 <form method="get" action="/queue" class="inline filter-form">
9 <select name="status">
10 <option value="all" {{if eq .Data.Status "all"}}selected{{end}}>All</option>
11 <option value="queued" {{if eq .Data.Status "queued"}}selected{{end}}>Queued</option>
12 <option value="downloading" {{if eq .Data.Status "downloading"}}selected{{end}}>Active</option>
13 <option value="completed" {{if eq .Data.Status "completed"}}selected{{end}}>Completed</option>
14 <option value="error" {{if eq .Data.Status "error"}}selected{{end}}>Failed</option>
15 </select>
16 <select name="sort">
17 <option value="date" {{if eq .Data.SortBy "date"}}selected{{end}}>Date</option>
18 <option value="status" {{if eq .Data.SortBy "status"}}selected{{end}}>Status</option>
19 </select>
20 <button type="submit">Filter</button>
21 </form>
22 </div>
23</div>
24
25<div class="queue-list">
26 {{range .Data.Items}}
27 <article class="queue-item {{.Status}}">
28 <a href="/queue/{{.ID}}" class="queue-link" aria-label="View download details"></a>
29 <div class="queue-header">
30 <div class="queue-url">{{.URL}}</div>
31 <div class="queue-status">
32 <span class="status-badge {{.Status}}">{{.Status}}</span>
33 </div>
34 <form method="post" action="/queue/{{.ID}}/delete" class="inline queue-action">
35 <button type="submit" class="small danger">Remove</button>
36 </form>
37 </div>
38 {{if .ErrorMessage.Valid}}
39 <div class="error-message">{{.ErrorMessage.String}}</div>
40 {{end}}
41 <div class="queue-meta">
42 <span>Created: {{.CreatedAt.Format "2006-01-02 15:04"}}</span>
43 {{if .StartedAt.Valid}}
44 <span>Started: {{.StartedAt.Time.Format "2006-01-02 15:04"}}</span>
45 {{end}}
46 </div>
47 </article>
48 {{else}}
49 <div class="empty-state">
50 <p>Queue is empty. <a href="/download">Start a download</a>.</p>
51 </div>
52 {{end}}
53</div>
54{{end}}