shindakun.net
The attodo.app, uhh... app.
list detail
+26
-2
templates/list-detail.html
+26
-2
templates/list-detail.html
···
264
264
<div id="toast-container" class="toast-container"></div>
265
265
266
266
<script>
267
-
// HTMX event listeners for list operations
267
+
// HTMX event listeners for list and task operations
268
268
document.body.addEventListener('htmx:afterRequest', function(evt) {
269
269
const url = evt.detail.pathInfo && evt.detail.pathInfo.requestPath;
270
+
271
+
// Check if this is a task completion operation
272
+
if (url && url.includes('/app/tasks') && evt.detail.xhr && evt.detail.verb === 'put') {
273
+
if (evt.detail.successful) {
274
+
showToast('Task marked as complete!', 'success');
275
+
276
+
// Update the task count after a short delay to ensure DOM is updated
277
+
setTimeout(updateTaskCount, 50);
278
+
279
+
// Reload the page after a short delay to show the task in the completed tab
280
+
setTimeout(() => {
281
+
window.location.reload();
282
+
}, 1000);
283
+
} else {
284
+
showToast('Failed to mark task as complete. Please try again.', 'error');
285
+
}
286
+
}
270
287
271
288
// Check if this is a list operation
272
289
if (url && url.includes('/app/lists') && evt.detail.xhr) {
···
334
351
{{range .Tasks}}
335
352
{{if not .Completed}}
336
353
{{$hasIncomplete = true}}
337
-
<div class="task-item">
354
+
<div class="task-item" id="task-{{.RKey}}">
338
355
<h4>{{.Title}}</h4>
339
356
{{if .Description}}<p>{{.Description}}</p>{{end}}
340
357
<small>Created: {{formatDate .CreatedAt}}</small>
341
358
342
359
<div class="task-actions">
360
+
<button
361
+
hx-put="/app/tasks"
362
+
hx-vals='{"rkey": "{{.RKey}}"}'
363
+
hx-target="#task-{{.RKey}}"
364
+
hx-swap="outerHTML">
365
+
Mark Complete
366
+
</button>
343
367
<button
344
368
hx-patch="/app/lists"
345
369
hx-vals='{"rkey": "{{$.RKey}}", "taskUri": "{{.URI}}", "action": "remove"}'