fix: prevent dialog showModal from auto-focusing first input

Patches HTMLDialogElement.prototype.showModal globally to move focus
onto the dialog element itself instead of the first focusable
descendant. On touch devices the previous behavior popped up the
on-screen keyboard whenever a modal opened, which was confusing.

media_server/static/js/app.js

@@ -133,6 +133,23 @@ Object.assign(window, {
 // Initialization (DOMContentLoaded)
 // ============================================================
 
+// Prevent <dialog>.showModal() from auto-focusing the first input field.
+// On touch devices this pops up the on-screen keyboard, which is confusing
+// when the user just opened a dialog. Force focus onto the dialog itself.
+const _origShowModal = HTMLDialogElement.prototype.showModal;
+HTMLDialogElement.prototype.showModal = function (...args) {
+    if (!this.hasAttribute('tabindex')) {
+        this.setAttribute('tabindex', '-1');
+    }
+    const result = _origShowModal.apply(this, args);
+    const active = document.activeElement;
+    if (active && active !== this && this.contains(active)) {
+        active.blur();
+        this.focus({ preventScroll: true });
+    }
+    return result;
+};
+
 window.addEventListener('DOMContentLoaded', async () => {
     // Cache DOM references
     cacheDom();