summaryrefslogtreecommitdiff
path: root/templates
diff options
context:
space:
mode:
Diffstat (limited to 'templates')
-rw-r--r--templates/index.html75
-rw-r--r--templates/parts/entry.html81
-rw-r--r--templates/parts/entryRows.html12
3 files changed, 115 insertions, 53 deletions
diff --git a/templates/index.html b/templates/index.html
index 3654855..c408fb0 100644
--- a/templates/index.html
+++ b/templates/index.html
@@ -6,6 +6,9 @@
<title>Tidsreg</title>
+ <!-- TODO REMOVE -->
+ <script src="https://unpkg.com/htmx.org@1.9.12/dist/htmx.js" integrity="sha384-qbtR4rS9RrUMECUWDWM2+YGgN3U4V4ZncZ0BvUcg9FGct0jqXz3PUdVpU1p0yrXS" crossorigin="anonymous"></script>
+
<style>
.flex {
display: flex;
@@ -28,7 +31,14 @@
border-color: green;
}
-.entry-bar {
+.status-stopped {
+ border-color: red;
+}
+.status-detached {
+ border-color: blue;
+}
+
+#entry-bar {
border-width: 3px;
border-style: solid;
padding: 10px;
@@ -46,48 +56,11 @@
<body>
<div id="controls-bar">
<button>I går</button>
- <input type="date"</input>
+ <input type="date" />
<button>I morgen</button>
</div>
<div class="flex">
- <div class="status-started entry-bar">
- <div class="flex just-start">
- <div class="entry-box">
- <b>Interval</b>
- <div>
- <label for="fromTime">Fra: </label>
- <input id="fromTime" type="time" class="form-control" aria-label="Time start">
- </div>
- <div>
- <label for="toTime">Til: </label>
- <input id="toTime" type="time" class="form-control" aria-label="Time stop">
- </div>
- </div>
- <div class="entry-box">
- <b>Mærker</b><br>
- <select>
- <option value="-">-</option>
- <option value="SVT-232">SVT-232</option>
- <option value="Ferie">Ferie</option>
- </select><br>
- <select>
- <option value="-">-</option>
- <option value="SVT-232">SVT-232</option>
- <option value="Ferie">Ferie</option>
- </select>
- </div>
- <div class="entry-box">
- <b>Kommentar</b><br>
- <textarea></textarea>
- </div>
- <div class="entry-box">
- <b>Status</b><br>
- <i class="status-started">I gang</i><br>
- <span>1:34 timer</span>
- </div>
- </div>
- <button>Start ny</button>
- </div>
+ {{template "entry.html" .Entry}}
<div class="flex-grow week-bar">
<b>Uge 42</b>
</div>
@@ -96,20 +69,16 @@
<div class="flex-grow">
<table>
<thead>
- <th>-</th>
- <th>Fra</th>
- <th>Til</th>
- <th>Mærker</th>
- <th>Beskrivelse</th>
- </thead>
- <tbody>
<tr>
- <td><input type="checkbox" /></td>
- <td><input type="time" /></td>
- <td></td>
- <td>Ferie, SVT-232</td>
- <td>Ting og sager</td>
- </tbody>
+ <th>Id</th>
+ <th>Fra</th>
+ <th>Til</th>
+ <th>Mærker</th>
+ <th>Beskrivelse</th>
+ <th>Handlinger</th>
+ </tr>
+ </thead>
+ {{ template "entryRows.html" . }}
</table>
</div>
</div>
diff --git a/templates/parts/entry.html b/templates/parts/entry.html
new file mode 100644
index 0000000..f99fb90
--- /dev/null
+++ b/templates/parts/entry.html
@@ -0,0 +1,81 @@
+<form id="entry-bar" autocomplete="off" class="status-{{if .Detached}}detached{{else}}{{if .Task}}started{{else}}stopped{{end}}{{end}}">
+ <input style="display: none;" value="{{ if .Task }}{{ .Task.Id }}{{end}}" type="text" name="id" />
+ {{ if .Detached }}
+ <span>{{ if gt .Task.Id -1 }}Redigerer opgave {{ .Task.Id }}{{else}}Redigerer ny opgave{{end}}{{ if .Tracking }}, med opgave i baggrunden!{{else}}.{{end}}</span><br>
+ {{end}}
+ <div class="flex just-start">
+ <div class="entry-box">
+ <b>Interval</b>
+ <div>
+ <label for="fromTime">Fra: </label>
+ <input name="from" id="fromTime" type="time" class="form-control" {{if .Task}}value="{{formatTime .Task.From}}" required{{end}} aria-label="Time start">
+ </div>
+ <div>
+ <label for="toTime">Til: </label>
+ <input name="to" id="toTime" type="time" class="form-control" {{if not .Detached}}disabled{{end}} aria-label="Time stop">
+ </div>
+ </div>
+ <div class="entry-box">
+ <b>Mærker</b><br>
+ <select>
+ <option value="-">-</option>
+ <option value="SVT-232">SVT-232</option>
+ <option value="Ferie">Ferie</option>
+ </select><br>
+ <select>
+ <option value="-">-</option>
+ <option value="SVT-232">SVT-232</option>
+ <option value="Ferie">Ferie</option>
+ </select>
+ </div>
+ <div class="entry-box">
+ <b>Kommentar</b><br>
+ <textarea name="comment">{{if .Task}}{{.Task.Comment}}{{end}}</textarea>
+ </div>
+ <div class="entry-box">
+ <b>Status</b><br>
+ {{ if not .Detached}}<i>{{ if .Task }}I gang{{ else }}Stoppet{{ end }}</i><br>{{end}}
+ {{ if .Task }}<span>1:34 timer</span>{{ end }}
+ </div>
+ </div>
+
+ {{ if .Task }}
+ <button
+ hx-put="/save{{if .Detached}}?detached=true{{end}}"
+ hx-trigger="click"
+ hx-target="#entry-bar"
+ hx-swap="outerHTML"
+ >Gem
+ </button>
+ {{end}}
+ {{ if .Detached }}
+ <button
+ hx-get="/tracking"
+ hx-trigger="click"
+ hx-target="#entry-bar"
+ hx-swap="outerHTML"
+ >Tilbage</button>
+ {{ else }}
+ {{ if .Task }}
+ <button
+ hx-post="/stop"
+ hx-trigger="click"
+ hx-target="#entry-bar"
+ hx-swap="outerHTML"
+ >Stop</button>
+ {{ else }}
+ <button
+ hx-post="/start"
+ hx-trigger="click"
+ hx-target="#entry-bar"
+ hx-swap="outerHTML"
+ >Start ny</button>
+ {{ end }}
+ <button
+ hx-get="/newDetached"
+ hx-trigger="click"
+ hx-target="#entry-bar"
+ hx-swap="outerHTML"
+ >Manuel</button>
+ {{ end }}
+</form>
diff --git a/templates/parts/entryRows.html b/templates/parts/entryRows.html
new file mode 100644
index 0000000..1b364e3
--- /dev/null
+++ b/templates/parts/entryRows.html
@@ -0,0 +1,12 @@
+<tbody hx-trigger="changedTasks from:body" hx-get="/entryRows">
+ {{ range $task := .Tasks }}
+ <tr>
+ <td>{{ $task.Id }}</td>
+ <td><input type="time" disabled value="{{formatTime $task.From }}" /></td>
+ <td><input type="time" disabled value="{{formatTime $task.To }}" /></td>
+ <td>{{ if $task.Tag}}{{ $task.Tag }}{{end}}</td>
+ <td>{{ $task.Comment }}</td>
+ <td></td>
+ </tr>
+ {{ end }}
+</tbody>