Upload: fix mp3 greyed-out in mobile file picker + error feedback

Android/iOS Chrome grey out audio files when the document provider reports
a generic MIME (e.g. application/octet-stream for mp3 in Downloads), so
accept="audio/*,video/*" alone hid them. Add explicit extension tokens
(.mp3, .m4a, …) which mobile pickers honour by filename, un-greying them.
Also surface upload success/failure on the button instead of silently
resetting.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>

public/index.html

@@ -35,7 +35,9 @@
       <div class="row">
         <button id="media-refresh">↻ Aggiorna</button>
         <button id="media-upload-btn">⬆️ Carica file</button>
-        <input id="media-upload" type="file" accept="audio/*,video/*" multiple hidden />
+        <!-- Explicit extensions first: mobile pickers (Android/iOS Chrome) grey out
+             mp3 etc. when the provider reports a generic MIME; extension tokens fix it. -->
+        <input id="media-upload" type="file" accept=".mp3,.m4a,.aac,.wav,.flac,.ogg,.opus,.aif,.aiff,.mp4,.mov,.m4v,.webm,.mkv,audio/*,video/*" multiple hidden />
       </div>
       <div id="nowbar" class="nowbar hidden">
         <div class="np-top"><span id="np-name">—</span><span id="np-time">0:00 / 0:00</span></div>

public/js/control.js

@@ -223,9 +223,16 @@ $('#seek').addEventListener('input', (e) => { if (curDur > 0) send({ type: 'seek
 $('#media-refresh').addEventListener('click', loadLibrary);
 $('#media-upload-btn').addEventListener('click', () => $('#media-upload').click());
 $('#media-upload').addEventListener('change', (e) => {
-  const fd = new FormData(); [...e.target.files].forEach((f) => fd.append('files', f));
+  const files = [...e.target.files];
-  $('#media-upload-btn').textContent = '⏳ Carico…';
+  if (!files.length) return;
-  fetch('/api/upload', { method: 'POST', body: fd }).then(() => { e.target.value = ''; $('#media-upload-btn').textContent = '⬆️ Carica file'; loadLibrary(); });
+  const fd = new FormData(); files.forEach((f) => fd.append('files', f));
+  const btn = $('#media-upload-btn');
+  btn.textContent = '⏳ Carico ' + files.length + '…';
+  const reset = (txt) => { e.target.value = ''; btn.textContent = txt; setTimeout(() => { btn.textContent = '⬆️ Carica file'; }, 2500); };
+  fetch('/api/upload', { method: 'POST', body: fd })
+    .then((r) => r.ok ? r.json() : Promise.reject(new Error('HTTP ' + r.status)))
+    .then((res) => { reset('✅ ' + (res && res.count || files.length) + ' caricati'); loadLibrary(); })
+    .catch((err) => { reset('❌ Errore: ' + err.message); });
 });
 loadLibrary();