Autocomplete existing tags in the upload and manage forms

A small shared widget (static/tagcomplete.js) completes the tag after the last
comma from the existing tag list, keeping earlier tags intact. It is wired to
every comma-separated tag input: the upload form, and the manage page's per-row
edit field and bulk add/remove fields.

Suggestions come from /tags.json, which the generator already writes on every
build and nginx serves statically, so no server change is needed; the list is
fetched once, cached, and invalidated after an edit that may add a tag. Keyboard
navigation (up/down, enter/tab, escape) and click selection are supported.
This commit is contained in:
puttaalu committed 2026-10-18 22:39:13 +02:00
1 parent bf75c9fe8e
commit c4aa345914
4 files changed
+183 -3

No files matched your search

+2 -1
View File
@@ -163,13 +163,14 @@
<div class="field">
<label for="tags">Tags</label>
<input type="text" id="tags" placeholder="comma-separated, lowercase" autocomplete="off">
<input type="text" id="tags" placeholder="comma-separated, lowercase" autocomplete="off" data-tagcomplete>
</div>
<button class="submit-btn" id="submit-btn" disabled>Upload photo</button>
<div id="feedback"></div>
</div>
<script src="/static/tagcomplete.js"></script>
<script>
const fileInput = document.getElementById('file-input');
const preview = document.getElementById('preview');