@geekity/cms 0.35.0 → 0.36.1

package/admin/components/job-status.njk

@@ -8,38 +8,43 @@
      failed       the error, in an alert
      interrupted  that restarts or crashes cut it off and it will not run again
 
-   While it is queued or running, `refreshUrl` is offered as a link to look
-   again: the page does not reload itself. `verb` and `unit` word the
-   progress. The error and every word passed in are escaped. #}
+   While it is queued or running, the box names `refreshUrl` in
+   `data-job-refresh`. A page that loads static/job-status.js has it fetch
+   that page every few seconds and swap in its box with the same
+   `data-job-status` until the job ends. It swaps the closest
+   `data-job-region` around the box instead when there is one, so a page can
+   redraw the controls it hides while the job runs. Without JavaScript,
+   `refreshUrl` is a Check again link. `verb` and `unit` word the progress.
+   The error and every word passed in are escaped. #}
 {% from "components/alert.njk" import alert %}
 {% from "components/badge.njk" import status %}
 {% from "components/button.njk" import buttonLink %}
 
 {% macro jobStatus(job, refreshUrl, verb='Done', unit='items') -%}
-<div class="flex flex-col gap-3">
+<div class="flex flex-col gap-3" data-job-status="{{ job.name }}" data-job-state="{{ job.state }}" data-job-label="{{ job.label }}"{% if job.active %} data-job-refresh="{{ refreshUrl }}"{% endif %}>
   <p class="flex flex-wrap items-center gap-2">
     {{ status(job.state, job.label) }}
     <span class="text-sm"><time datetime="{{ job.at }}">{{ job.at | date('readable') }}</time></span>
   </p>
   {% if job.state == 'queued' %}
-    <p>Waiting for the worker to start it.{% if job.requeued %} A restart cut off the last try, so it is queued again as try {{ job.attempt }}.{% endif %}</p>
+    <p data-job-message>Waiting for the worker to start it.{% if job.requeued %} A restart cut off the last try, so it is queued again as try {{ job.attempt }}.{% endif %}</p>
   {% elif job.state == 'running' %}
     {% if job.progress and job.progress.total %}
       <progress class="progress progress-primary w-full max-w-md" value="{{ job.progress.done }}" max="{{ job.progress.total }}" aria-label="{{ verb }} {{ job.progress.done }} of {{ job.progress.total }} {{ unit }}"></progress>
-      <p>{{ verb }} {{ job.progress.done }} of {{ job.progress.total }} {{ unit }}.{% if job.progress.note %} {{ job.progress.note }}{% endif %}</p>
+      <p data-job-message>{{ verb }} {{ job.progress.done }} of {{ job.progress.total }} {{ unit }}.{% if job.progress.note %} {{ job.progress.note }}{% endif %}</p>
     {% else %}
       <progress class="progress progress-primary w-full max-w-md" aria-label="Starting"></progress>
-      <p>Starting.</p>
+      <p data-job-message>Starting.</p>
     {% endif %}
   {% elif job.state == 'finished' %}
     {% if caller %}{{ caller() }}{% endif %}
   {% elif job.state == 'failed' %}
-    {% call alert(color='error', style='soft') %}<span>{{ job.error }}</span>{% endcall %}
+    {% call alert(color='error', style='soft') %}<span data-job-message>{{ job.error }}</span>{% endcall %}
   {% elif job.state == 'interrupted' %}
-    <p>Restarts or crashes cut it off {{ job.attempt }} times, so it is not run again on its own.</p>
+    <p data-job-message>Restarts or crashes cut it off {{ job.attempt }} times, so it is not run again on its own.</p>
   {% endif %}
   {% if job.active %}
-    <div>{{ buttonLink('Check again', refreshUrl, style='outline') }}</div>
+    <div data-job-check-again>{{ buttonLink('Check again', refreshUrl, style='outline') }}</div>
   {% endif %}
 </div>
 {%- endmacro %}

package/admin/components/upload.njk

@@ -0,0 +1,26 @@
+{# An upload in place: a file picker beside a box, grid or menu that wants a
+   file, so nobody has to leave a post for the media library and come back
+   with an address (TASK-439).
+
+   `uploadControl(kind, target, url)` emits a `hidden` block that
+   `static/upload-drop.js` reveals, so a page with no script shows nothing that
+   does nothing. The script posts each file to `url` and hands the answer to
+   the `kind`'s handler, which fills the element whose id is `target`:
+
+     photos   adds a ticked tile to the photo grid; `name` is the prefix of
+              the grid's checkbox names
+     field    sets the text box's value; `preview` names an <img> to show it
+     select   adds the file to the menu and chooses it
+     library  reloads the page once the files have landed
+
+   Dropping files on the target, or on the field around it, does the same.
+   `images` asks the server to refuse anything that is not an image. #}
+
+{% macro uploadControl(kind, target, url, images=false, accept='', name='', preview='') -%}
+<div class="mt-1 flex flex-wrap items-center gap-2" data-upload-drop="{{ kind }}" data-upload-url="{{ url }}" data-upload-target="{{ target }}"{% if images %} data-upload-images{% endif %}{% if name %} data-upload-name="{{ name }}"{% endif %}{% if preview %} data-upload-preview="{{ preview }}"{% endif %} hidden>
+  <label class="text-xs" for="{{ target }}-upload">Upload</label>
+  <input id="{{ target }}-upload" type="file" class="file-input file-input-xs w-auto max-w-full"{% if images %} accept="image/*"{% elif accept %} accept="{{ accept }}"{% endif %}{% if kind == 'photos' or kind == 'library' %} multiple{% endif %} data-upload-input />
+  <span class="text-xs text-base-content/70">or drop {% if kind == 'photos' or kind == 'library' %}files{% else %}a file{% endif %} here</span>
+  <p class="w-full text-xs empty:hidden" role="status" aria-live="polite" data-upload-status></p>
+</div>
+{%- endmacro %}

package/admin/pages/documents/editor.njk

@@ -13,6 +13,7 @@
 {% from "components/card.njk" import card, cardActions %}
 {% from "components/collapse.njk" import collapse %}
 {% from "components/dropdown.njk" import dropdown %}
+{% from "components/upload.njk" import uploadControl %}
 
 {% set ACTION_COLORS = { 'publish': 'primary', 'update': 'primary', 'trash': 'error' } %}
 {% set ACTION_STYLES = { 'trash': 'ghost' } %}
@@ -20,6 +21,14 @@
 
 {% set ICON_SIZES = { md: 'size-6', sm: 'size-4' } %}
 
+{% macro photoTile(name, url, thumbnail, alt) -%}
+<label class="relative cursor-pointer">
+  <input class="peer sr-only" type="checkbox" name="{{ name }}" value="{{ url }}" />
+  <img class="aspect-square w-full rounded-box object-cover ring-primary ring-offset-2 ring-offset-base-100 peer-checked:ring-2 peer-focus-visible:outline-2 peer-focus-visible:outline-offset-2 peer-focus-visible:outline-base-content" src="{{ thumbnail }}" alt="{{ alt }}" loading="lazy" />
+  <span class="badge badge-primary badge-xs absolute end-1 top-1 hidden peer-checked:inline-flex" aria-hidden="true">✓</span>
+</label>
+{%- endmacro %}
+
 {% macro icon(path, size='md') -%}
 <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.6" stroke="currentColor" class="shrink-0{{ ICON_SIZES | modifier(size) }}" aria-hidden="true"><path stroke-linecap="round" stroke-linejoin="round" d="{{ path }}"/></svg>
 {%- endmacro %}
@@ -152,22 +161,21 @@
         </div>
       </div>
     {% endfor %}
-    {% if photos.picks | length %}
-      <fieldset class="fieldset">
-        <legend class="fieldset-legend">Add from the media library</legend>
-        <div class="grid grid-cols-3 gap-2 sm:grid-cols-6">
-          {% for pick in photos.picks %}
-            <label class="relative cursor-pointer">
-              <input class="peer sr-only" type="checkbox" name="{{ photoFields.url }}{{ pick.index }}" value="{{ pick.url }}" />
-              <img class="aspect-square w-full rounded-box object-cover ring-primary ring-offset-2 ring-offset-base-100 peer-checked:ring-2 peer-focus-visible:outline-2 peer-focus-visible:outline-offset-2 peer-focus-visible:outline-base-content" src="{{ pick.thumbnail }}" alt="{{ pick.alt or pick.url }}" loading="lazy" />
-              <span class="badge badge-primary badge-xs absolute end-1 top-1 hidden peer-checked:inline-flex" aria-hidden="true">✓</span>
-            </label>
-          {% endfor %}
-        </div>
-        <p class="label block whitespace-normal">A ticked photo is added when you save, with the media library’s alt text. Add them now to write alt text of your own first.</p>
-        <div>{{ button('Add the ticked photos', type='submit', name='switch-kind', value=postKind, style='soft', formnovalidate=true) }}</div>
-      </fieldset>
-    {% endif %}
+    <fieldset class="fieldset rounded-box">
+      <legend class="fieldset-legend">Add from the media library</legend>
+      <div class="grid grid-cols-3 gap-2 sm:grid-cols-6" id="editor-photo-picks">
+        {% for pick in photos.picks %}
+          {{ photoTile(photoFields.url + pick.index, pick.url, pick.thumbnail, pick.alt or pick.url) }}
+        {% endfor %}
+      </div>
+      <template data-upload-tile="editor-photo-picks">{{ photoTile('', '', '', '') }}</template>
+      {% if not photos.picks | length %}
+        <p class="text-sm" data-upload-empty>The media library has no images yet.</p>
+      {% endif %}
+      {{ uploadControl('photos', 'editor-photo-picks', uploadsUrl, images=true, name=photoFields.url) }}
+      <p class="label block whitespace-normal">A ticked photo is added when you save, with the media library’s alt text. Add them now to write alt text of your own first.</p>
+      <div{% if not photos.picks | length %} hidden data-upload-reveal{% endif %}>{{ button('Add the ticked photos', type='submit', name='switch-kind', value=postKind, style='soft', formnovalidate=true) }}</div>
+    </fieldset>
     <div class="grid gap-x-4 sm:grid-cols-2">
       {{ field.text('editor-photo-url-' + photos.blank, photoFields.url + photos.blank, 'Or a web address', value='', list='editor-photo-uploads', autocomplete='off', error=(error if errorField == ('editor-photo-url-' + photos.blank) else '')) }}
       {{ field.text('editor-photo-alt-' + photos.blank, photoFields.alt + photos.blank, 'Its alt text', value='') }}
@@ -224,15 +232,19 @@
   {{ placeFields(true) }}
 
 {% elif name == 'episode' %}
-  {% call field.select('editor-enclosure-url', enclosureFields.url, 'Audio or video file', error=(error if errorField == 'editor-enclosure-url' else ''), hint='Upload the file to the media library first. Feeds carry it as the post’s enclosure and the post page plays it. None removes the recording, its transcript and its other versions.', hintId='editor-enclosure-url-hint') %}
+  {% call field.select('editor-enclosure-url', enclosureFields.url, 'Audio or video file', error=(error if errorField == 'editor-enclosure-url' else ''), hint='Feeds carry it as the post’s enclosure and the post page plays it. None removes the recording, its transcript and its other versions.', hintId='editor-enclosure-url-hint') %}
     <option value=""{% if form.enclosure.url == "" %} selected{% endif %}>None</option>
     {% for choice in enclosureChoices.media %}
       <option value="{{ choice.url }}"{% if choice.url == form.enclosure.url %} selected{% endif %}>{{ choice.label }}</option>
     {% endfor %}
   {% endcall %}
+  {{ uploadControl('select', 'editor-enclosure-url', uploadsUrl, accept='audio/*,video/*') }}
   <div class="grid gap-x-4 sm:grid-cols-2">
     {{ field.text('editor-enclosure-duration', enclosureFields.duration, 'Duration', value=form.enclosure.duration, inputmode='numeric', autocomplete='off', error=(error if errorField == 'editor-enclosure-duration' else ''), hint='Seconds, or 30:34, or 1:02:03. Leave it empty if you do not know.', hintId='editor-enclosure-duration-hint') }}
-    {{ field.text('editor-enclosure-transcript', enclosureFields.transcriptUrl, 'Transcript or captions', value=form.enclosure.transcriptUrl, list='editor-transcript-uploads', autocomplete='off', error=(error if errorField == 'editor-enclosure-transcript' else ''), hintId='editor-enclosure-transcript-hint') }}
+    <div>
+      {{ field.text('editor-enclosure-transcript', enclosureFields.transcriptUrl, 'Transcript or captions', value=form.enclosure.transcriptUrl, list='editor-transcript-uploads', autocomplete='off', error=(error if errorField == 'editor-enclosure-transcript' else ''), hintId='editor-enclosure-transcript-hint') }}
+      {{ uploadControl('field', 'editor-enclosure-transcript', uploadsUrl, accept='.vtt,.srt,.txt') }}
+    </div>
   </div>
   <datalist id="editor-transcript-uploads">
     {% for url in enclosureChoices.transcripts %}
@@ -256,6 +268,7 @@
       {% set n = loop.index0 %}
       {% call collapse(('Version ' + loop.index) if row.url else 'Add a version', row.url, fields=true) %}
         {{ field.text('editor-alternate-url-' + n, enclosureFields.alternate.url + n, 'Address', value=row.url, list='editor-media-uploads', autocomplete='off', error=(error if errorField == ('editor-alternate-url-' + n) else '')) }}
+        {{ uploadControl('field', 'editor-alternate-url-' + n, uploadsUrl, accept='audio/*,video/*') }}
         {{ field.text('editor-alternate-type-' + n, enclosureFields.alternate.type + n, 'Type', value=row.type, placeholder='video/mp4', autocomplete='off', spellcheck='false', error=(error if errorField == ('editor-alternate-type-' + n) else '')) }}
         {{ field.text('editor-alternate-title-' + n, enclosureFields.alternate.title + n, 'Title', value=row.title, maxlength='32', error=(error if errorField == ('editor-alternate-title-' + n) else '')) }}
         {{ field.text('editor-alternate-height-' + n, enclosureFields.alternate.height + n, 'Height', value=row.height, inputmode='numeric', autocomplete='off', error=(error if errorField == ('editor-alternate-height-' + n) else '')) }}
@@ -364,6 +377,7 @@
       <img class="h-24 w-16 shrink-0 rounded-box object-cover" id="editor-item-photo-preview"{% if reviewPhotoThumbnail %} src="{{ reviewPhotoThumbnail }}"{% else %} hidden{% endif %} alt="" loading="lazy" />
       <div class="flex min-w-0 flex-1 flex-col">
         {{ field.text('editor-item-photo', reviewFields.photo, '', labelHtml=itemWord('picture'), value=form.review.photo, list='editor-photo-uploads', autocomplete='off', error=(error if errorField == 'editor-item-photo' else ''), hint='An image in the media library or a web address. It is the item’s picture, not a photo for the post: it shows beside the item’s details.', hintId='editor-item-photo-hint') }}
+        {{ uploadControl('field', 'editor-item-photo', uploadsUrl, images=true, preview='editor-item-photo-preview') }}
         {{ field.text('editor-item-photo-alt', reviewFields.photoAlt, '', labelHtml=itemWord('picture', ' alt text'), value=form.review.photoAlt) }}
       </div>
     </div>
@@ -478,7 +492,7 @@
           class="flex flex-wrap items-center gap-2"
           id="editor-enhance"
           data-preview-url="{{ previewUrl }}"
-          data-upload-url="{{ uploadUrl }}"
+          data-upload-url="{{ uploadsUrl }}"
           data-kind="{{ kind.type }}"
         >
           {{ button('Preview', type='submit', id='editor-preview-fallback', style='soft', formaction=previewUrl, formtarget='_blank', formnovalidate=true) }}
@@ -667,6 +681,7 @@
   {# The slug and permalink auto-fill, in a file of its own so the policy never
      has to allow an inline script. #}
   <script defer src="{{ assetPrefix }}slug.js"></script>
+  <script defer src="{{ assetPrefix }}upload-drop.js"></script>
   {% if kind.type == 'post' %}
     <script defer src="{{ assetPrefix }}location.js"></script>
   {% endif %}

package/admin/pages/federation/followers.njk

@@ -175,7 +175,7 @@
     {% endif %}
   </section>
 
-  <section id="resend" class="mb-10 max-w-2xl" aria-labelledby="resend-heading">
+  <section id="resend" class="mb-10 max-w-2xl" aria-labelledby="resend-heading" data-job-region>
     {% call card() %}
       <h2 id="resend-heading" class="card-title">Resend</h2>
       <p class="max-w-prose">
@@ -295,4 +295,5 @@
       <p>No post has been announced to the fediverse yet.</p>
     {% endif %}
   </section>
+  <script defer src="{{ assetPrefix }}job-status.js"></script>
 {% endblock %}

package/admin/pages/media/file.njk

@@ -44,15 +44,15 @@
         {% call card(title='Delete ' + confirm.url + '?', style='border') %}
           <p>
             {{ confirm.references.length }}
-            {% if confirm.references.length == 1 %}document still points{% else %}documents still point{% endif %}
-            at it. Deleting the file does not change them, so they will point at nothing.
+            {% if confirm.references.length == 1 %}thing still uses{% else %}things still use{% endif %}
+            it. Deleting the file does not change them, so they will point at nothing.
           </p>
           <ul class="list-disc pl-6">
             {% for reference in confirm.references %}
               <li>
                 <a class="link" href="{{ reference.editUrl }}">{{ reference.title }}</a>
                 {% if reference.trashed %}{{ status('trashed', 'Trash') }}{% endif %}
-                <code>{{ reference.path }}</code>
+                <code>{{ reference.where }}</code>
               </li>
             {% endfor %}
           </ul>
@@ -120,11 +120,12 @@
                 <li>
                   <a class="link link-hover" href="{{ reference.editUrl }}">{{ reference.title }}</a>
                   {% if reference.trashed %}{{ status('trashed', 'Trash') }}{% endif %}
+                  <span class="text-base-content/70">{{ reference.where }}</span>
                 </li>
               {% endfor %}
             </ul>
           {% else %}
-            <p class="text-sm">Nothing links to it.</p>
+            <p class="text-sm">Nothing uses it.</p>
           {% endif %}
         </div>
 

package/admin/pages/media/library.njk

@@ -5,13 +5,14 @@
    Everything works with JavaScript switched off: the upload form opens from a
    <details>, the filters are a GET form, and a tile is a link. media.js opens
    a tile's details in a dialog instead and steps through them with the arrow
-   keys. #}
+   keys, and upload-drop.js takes files dropped anywhere on the page. #}
 {% extends "layouts/shell.njk" %}
 {% from "components/alert.njk" import alert %}
 {% from "components/badge.njk" import badge %}
 {% from "components/button.njk" import button, buttonLink %}
 {% from "components/pagination.njk" import pagination %}
 {% from "components/tabs.njk" import tabs %}
+{% from "components/upload.njk" import uploadControl %}
 
 {% block title %}{{ heading }}{% endblock %}
 
@@ -34,12 +35,13 @@
         <div class="mt-2">{{ button('Upload', type='submit', color='primary') }}</div>
       </form>
     </details>
+    {{ uploadControl('library', 'main', uploadsUrl) }}
   </div>
 
   {% if sweepNotice %}
-    <section id="strip-metadata-notice" class="mb-6 max-w-4xl" aria-label="Location and camera metadata">
+    <section id="strip-metadata-notice" class="mb-6 max-w-4xl" aria-label="Location and camera metadata"{% if sweepNotice.sweep %} data-job-status="{{ sweepNotice.sweep.name }}" data-job-state="{{ sweepNotice.sweep.state }}" data-job-label="{{ sweepNotice.sweep.label }}"{% if sweepNotice.sweep.active %} data-job-refresh="{{ sweepNotice.panelUrl }}" data-job-redraw="{{ listUrl }}"{% endif %}{% endif %}>
       {% call alert(color='info', style='soft', direction='responsive', polite=true) %}
-        <span>
+        <span data-job-message>
           {% if sweepNotice.sweep and sweepNotice.sweep.active %}
             The sweep that strips location and camera metadata from older uploads is {{ sweepNotice.sweep.label | lower }}.
           {% else %}
@@ -129,5 +131,7 @@
   {% endif %}
 
   <script defer src="{{ assetPrefix }}copy.js"></script>
+  <script defer src="{{ assetPrefix }}upload-drop.js"></script>
   <script defer src="{{ assetPrefix }}media.js"></script>
+  <script defer src="{{ assetPrefix }}job-status.js"></script>
 {% endblock %}

package/admin/pages/settings/general.njk

@@ -4,6 +4,7 @@
 {% from "components/badge.njk" import status %}
 {% from "components/button.njk" import button %}
 {% from "components/card.njk" import card, cardActions %}
+{% from "components/upload.njk" import uploadControl %}
 
 {% block settingsProblems %}
   {{ field.problem('settings-title', problems.title) }}
@@ -49,9 +50,11 @@
   {{ field.text('settings-locale', fields.locale, 'Locale', form.locale,
        error=problems.locale, hintHtml=localeHint) }}
 
-  {% set iconHint %}A square image at least 512 pixels wide, uploaded on <a href="{{ adminUrl }}/media">Media</a>: a path such as <code>/uploads/2026/10/icon.png</code>. It is the favicon, the home screen icon, <code>/favicon.ico</code> and the web app manifest's icon. Anything not square is cropped to its middle.{% endset %}
+  {% set iconHint %}A square image at least 512 pixels wide in the media library: a path such as <code>/uploads/2026/10/icon.png</code>. It is the favicon, the home screen icon, <code>/favicon.ico</code> and the web app manifest's icon. Anything not square is cropped to its middle.{% endset %}
   {{ field.text('settings-icon', fields.icon, 'Site icon', form.icon,
        error=problems.icon, hintHtml=iconHint) }}
+  {{ uploadControl('field', 'settings-icon', uploadsUrl, images=true) }}
+  <script defer src="{{ assetPrefix }}upload-drop.js"></script>
 
   <div class="flex items-center gap-4">
     {% if iconPreview %}

package/admin/pages/tools/export.njk

@@ -29,61 +29,64 @@
       site, wait until none are, and look again here.
     </p>
 
-    {% if job %}
-      <section id="export-status" aria-labelledby="export-status-heading">
-        {% call card() %}
-          <h2 id="export-status-heading" class="card-title">Latest export</h2>
-          {% call jobStatus(job, exportUrl, verb='Exported', unit='files') %}
-            {% if result %}
-              <p>
-                {{ result.files }} {% if result.files == 1 %}file{% else %}files{% endif %},
-                {{ result.size }} before compression, {% if result.credentials %}with{% else %}without{% endif %} credentials.
-              </p>
-              {% if result.credentialsLeftOut.length %}
-                <p>Credentials left out: {{ result.credentialsLeftOut | join(', ') }}.</p>
-              {% endif %}
-              {% if result.undeclared.length %}
-                <p>Left out because no declaration says what they are:</p>
-                <ul class="list-disc pl-6">
-                  {% for file in result.undeclared %}<li><code class="break-all">{{ file }}</code></li>{% endfor %}
-                </ul>
-              {% endif %}
-              {% if result.notCarried.length %}
-                <p>Left out because an export holds only regular files:</p>
-                <ul class="list-disc pl-6">
-                  {% for entry in result.notCarried %}<li><code class="break-all">{{ entry.path }}</code>, {{ entry.why }}</li>{% endfor %}
-                </ul>
-              {% endif %}
-              {% if archive %}
+    <div class="flex flex-col gap-6" data-job-region>
+      {% if job %}
+        <section id="export-status" aria-labelledby="export-status-heading">
+          {% call card() %}
+            <h2 id="export-status-heading" class="card-title">Latest export</h2>
+            {% call jobStatus(job, exportUrl, verb='Exported', unit='files') %}
+              {% if result %}
                 <p>
-                  <code class="break-all">{{ archive.name }}</code> is deleted at
-                  <time datetime="{{ archive.expiresAt }}">{{ archive.expiresAt | date('datetime') }}</time>,
-                  or when the next export finishes.
+                  {{ result.files }} {% if result.files == 1 %}file{% else %}files{% endif %},
+                  {{ result.size }} before compression, {% if result.credentials %}with{% else %}without{% endif %} credentials.
                 </p>
-                <div>{{ buttonLink('Download ' + archive.size, downloadUrl, color='primary') }}</div>
-              {% else %}
-                <p>The archive was deleted 24 hours after it was written, or a later export replaced it. Export again to download one.</p>
+                {% if result.credentialsLeftOut.length %}
+                  <p>Credentials left out: {{ result.credentialsLeftOut | join(', ') }}.</p>
+                {% endif %}
+                {% if result.undeclared.length %}
+                  <p>Left out because no declaration says what they are:</p>
+                  <ul class="list-disc pl-6">
+                    {% for file in result.undeclared %}<li><code class="break-all">{{ file }}</code></li>{% endfor %}
+                  </ul>
+                {% endif %}
+                {% if result.notCarried.length %}
+                  <p>Left out because an export holds only regular files:</p>
+                  <ul class="list-disc pl-6">
+                    {% for entry in result.notCarried %}<li><code class="break-all">{{ entry.path }}</code>, {{ entry.why }}</li>{% endfor %}
+                  </ul>
+                {% endif %}
+                {% if archive %}
+                  <p>
+                    <code class="break-all">{{ archive.name }}</code> is deleted at
+                    <time datetime="{{ archive.expiresAt }}">{{ archive.expiresAt | date('datetime') }}</time>,
+                    or when the next export finishes.
+                  </p>
+                  <div>{{ buttonLink('Download ' + archive.size, downloadUrl, color='primary') }}</div>
+                {% else %}
+                  <p>The archive was deleted 24 hours after it was written, or a later export replaced it. Export again to download one.</p>
+                {% endif %}
               {% endif %}
-            {% endif %}
+            {% endcall %}
           {% endcall %}
-        {% endcall %}
-      </section>
-    {% endif %}
+        </section>
+      {% endif %}
 
-    {% if not job or not job.active %}
-      {% call card(title='Export the site') %}
-        <form method="post" action="{{ exportUrl }}">
-          <input type="hidden" name="csrf_token" value="{{ csrfToken }}" />
-          {{ field.checkbox('export-with-credentials', fields.withCredentials,
-               'Include credentials', checked=withCredentials,
-               hint='API keys and logins for other services, such as an email provider. Left out, they are typed in again after an import.') }}
-          {{ field.password('export-password', fields.password, 'Your password',
-               error=problem, autocomplete='current-password', required=true) }}
-          {% call cardActions() %}
-            {{ button('Export', type='submit', color='primary') }}
-          {% endcall %}
-        </form>
-      {% endcall %}
-    {% endif %}
+      {% if not job or not job.active %}
+        {% call card(title='Export the site') %}
+          <form method="post" action="{{ exportUrl }}">
+            <input type="hidden" name="csrf_token" value="{{ csrfToken }}" />
+            {{ field.checkbox('export-with-credentials', fields.withCredentials,
+                 'Include credentials', checked=withCredentials,
+                 hint='API keys and logins for other services, such as an email provider. Left out, they are typed in again after an import.') }}
+            {{ field.password('export-password', fields.password, 'Your password',
+                 error=problem, autocomplete='current-password', required=true) }}
+            {% call cardActions() %}
+              {{ button('Export', type='submit', color='primary') }}
+            {% endcall %}
+          </form>
+        {% endcall %}
+      {% endif %}
+    </div>
   </div>
+  <script defer src="{{ assetPrefix }}job-status.js"></script>
 {% endblock %}

package/admin/pages/tools/maintenance.njk

@@ -49,7 +49,7 @@
       same switch, and a running site notices either within a second.
     </p>
 
-    <section id="strip-metadata" aria-labelledby="strip-metadata-heading">
+    <section id="strip-metadata" aria-labelledby="strip-metadata-heading" data-job-region>
       {% call card() %}
         <h2 id="strip-metadata-heading" class="card-title">Location and camera metadata</h2>
         <p class="max-w-prose">
@@ -96,4 +96,5 @@
       {% endcall %}
     </section>
   </div>
+  <script defer src="{{ assetPrefix }}job-status.js"></script>
 {% endblock %}

package/admin/pages/users/edit.njk

@@ -15,6 +15,7 @@
 {% from "components/badge.njk" import badge, status %}
 {% from "components/button.njk" import button %}
 {% from "components/card.njk" import card, cardActions %}
+{% from "components/upload.njk" import uploadControl %}
 
 {% block title %}Edit {{ account.username }}{% endblock %}
 
@@ -97,6 +98,7 @@
     {% set avatarHint %}A path such as <code>/uploads/2026/09/me.jpg</code>, or a full URL.{% endset %}
     {{ field.text('profile-avatar', fields.avatar, 'Avatar', account.profile.avatar,
          hintHtml=avatarHint) }}
+    {{ uploadControl('field', 'profile-avatar', uploadsUrl, images=true) }}
 
     {{ field.text('profile-job-title', fields.jobTitle, 'Job title', account.profile.jobTitle,
          hint='What they do, printed beside the name on the archive.') }}
@@ -280,4 +282,5 @@
     {% endif %}
   {% endcall %}
   </div>
+  <script defer src="{{ assetPrefix }}upload-drop.js"></script>
 {% endblock %}

package/admin/src/admin.css

@@ -4,6 +4,7 @@
 @source '../pages';
 @source '../../editor/look.ts';
 @source '../static/media.js';
+@source '../static/upload-drop.js';
 
 @plugin 'daisyui' {
   themes:

package/admin/static/admin.css

@@ -5277,6 +5277,44 @@
       border-top: 3px solid;
     }
 
+    .swap {
+      cursor: pointer;
+      vertical-align: middle;
+      webkit-user-select: none;
+      -webkit-user-select: none;
+      user-select: none;
+      place-content: center;
+      display: inline-grid;
+      position: relative;
+    }
+
+    .swap input {
+      appearance: none;
+      border: none;
+    }
+
+    .swap > * {
+      grid-row-start: 1;
+      grid-column-start: 1;
+    }
+
+    @media (prefers-reduced-motion: no-preference) {
+      .swap > * {
+        transition-property: transform, rotate, opacity;
+        transition-duration: .2s;
+        transition-timing-function: cubic-bezier(0, 0, .2, 1);
+      }
+    }
+
+    .swap .swap-on, .swap .swap-indeterminate, .swap input:indeterminate ~ .swap-on, .swap input:is(:checked, :indeterminate) ~ .swap-off {
+      opacity: 0;
+    }
+
+    .swap input:checked ~ .swap-on, .swap input:indeterminate ~ .swap-indeterminate {
+      opacity: 1;
+      backface-visibility: visible;
+    }
+
     .select:has( > select[disabled]) {
       cursor: not-allowed;
       border-color: var(--color-base-200);
@@ -6295,6 +6333,16 @@
       font-size: .75rem;
     }
 
+    .file-input-xs {
+      --size: calc(var(--size-field, .25rem) * 6);
+      font-size: .6875rem;
+      line-height: 1rem;
+    }
+
+    .file-input-xs::file-selector-button {
+      font-size: .6875rem;
+    }
+
     .tabs-lg {
       --tab-height: calc(var(--size-field, .25rem) * 12);
     }
@@ -7281,6 +7329,10 @@
     width: calc(var(--spacing) * 80);
   }
 
+  .w-auto {
+    width: auto;
+  }
+
   .w-full {
     width: 100%;
   }
@@ -7739,6 +7791,19 @@
     outline-width: 1px;
   }
 
+  .outline-2 {
+    outline-style: var(--tw-outline-style);
+    outline-width: 2px;
+  }
+
+  .outline-offset-4 {
+    outline-offset: 4px;
+  }
+
+  .outline-primary {
+    outline-color: var(--color-primary);
+  }
+
   .transition {
     transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to, opacity, box-shadow, transform, translate, scale, rotate, filter, -webkit-backdrop-filter, backdrop-filter, display, content-visibility, overlay, pointer-events;
     transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
@@ -7762,6 +7827,11 @@
     contain: var(--tw-contain-size, ) var(--tw-contain-layout, ) var(--tw-contain-paint, ) var(--tw-contain-style, );
   }
 
+  .outline-dashed {
+    --tw-outline-style: dashed;
+    outline-style: dashed;
+  }
+
   :is(.\*\:align-top > *) {
     vertical-align: top;
   }
@@ -7827,6 +7897,10 @@
     background-color: var(--color-base-200);
   }
 
+  .empty\:hidden:empty {
+    display: none;
+  }
+
   @media (hover: hover) {
     .hover\:bg-base-200:hover {
       background-color: var(--color-base-200);