The share image and featured image of a page become image fields with the library dialog, as do image settings of plugins. The editor offers forms, sections, categories and tags as lists, a page search next to every link target and in text links, the redirect target has a page search, and the form editor picks the reply field, the condition and the option images. Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
32 lines
1.5 KiB
JavaScript
32 lines
1.5 KiB
JavaScript
import { openMedia } from './media.js';
|
|
|
|
/*
|
|
* Bildfelder in Formularen der Verwaltung: Vorschaubild beim Teilen, Beitragsbild.
|
|
*
|
|
* Über den Dokumentknoten statt je Feld, weil die Suche in der Inhaltsliste die Ergebnisse
|
|
* austauscht - ein Feld, das danach erscheint, funktioniert trotzdem.
|
|
*/
|
|
document.addEventListener('click', event => {
|
|
const button = event.target.closest('[data-media-choose], [data-media-remove]');
|
|
const field = button?.closest('[data-media-field]');
|
|
if (!field) return;
|
|
const input = field.querySelector('input[type="hidden"]');
|
|
const thumb = field.querySelector('.media-field-thumb');
|
|
const name = field.querySelector('.media-field-name');
|
|
const choose = field.querySelector('[data-media-choose]');
|
|
const remove = field.querySelector('[data-media-remove]');
|
|
const show = item => {
|
|
input.value = item?.id ?? '';
|
|
thumb.hidden = !item;
|
|
if (item) thumb.src = item.variants[0].src; else thumb.removeAttribute('src');
|
|
name.textContent = item ? item.title : 'Kein Bild gewählt';
|
|
choose.textContent = item ? 'Anderes Bild wählen' : 'Bild wählen oder hochladen';
|
|
remove.hidden = !item;
|
|
input.dispatchEvent(new Event('change', { bubbles: true }));
|
|
};
|
|
if (button.matches('[data-media-remove]')) { show(null); choose.focus(); return; }
|
|
// Kein Alternativtext nötig: das Bild erscheint als Vorschau beim Teilen oder in einer Karte,
|
|
// deren Titel schon sagt, worum es geht.
|
|
openMedia({ needsAlt: false, onChoose: ([item]) => { if (item) show(item); } });
|
|
});
|