feat: implement name autosave functionality and remove set name button

public/js/ui.js

@@ -16,7 +16,6 @@ import {
   $room,
   $roomCode,
   $roomId,
-  $setNameLobby,
   $slotSelect,
   $startGame,
   $leaveRoom,
@@ -31,13 +30,61 @@ import { showToast, wire } from './utils.js';
 export function wireUi() {
   initAudioUI();
 
-  wire($setNameLobby, 'click', () => {
-    const name = $nameLobby.value.trim();
+  // --- Name autosave helpers
+  let nameDebounce;
+  const SAVE_DEBOUNCE_MS = 800;
+  // Button was removed; no state management needed.
+
+  function saveNameIfChanged(raw) {
+    const name = (raw || '').trim();
     if (!name) return;
-    localStorage.setItem('playerName', name);
-    if ($nameDisplay) $nameDisplay.textContent = name;
-    sendMsg({ type: 'set_name', name });
-  });
+    try {
+      const prev = localStorage.getItem('playerName') || '';
+      if (prev === name) return; // no-op
+      localStorage.setItem('playerName', name);
+      if ($nameDisplay) $nameDisplay.textContent = name;
+      sendMsg({ type: 'set_name', name });
+      showToast('Name gespeichert!');
+    } catch {
+      // best-effort
+    }
+  }
+
+  // Button removed: autosave handles everything
+
+  // Autosave on input with debounce
+  if ($nameLobby) {
+    wire($nameLobby, 'input', () => {
+      if (nameDebounce) clearTimeout(nameDebounce);
+      const val = ($nameLobby.value || '').trim();
+      if (!val) return;
+      nameDebounce = setTimeout(() => {
+        saveNameIfChanged($nameLobby.value);
+        nameDebounce = null;
+      }, SAVE_DEBOUNCE_MS);
+    });
+    // Save immediately on blur
+    wire($nameLobby, 'blur', () => {
+      if (nameDebounce) {
+        clearTimeout(nameDebounce);
+        nameDebounce = null;
+      }
+      const val = ($nameLobby.value || '').trim();
+      if (val) saveNameIfChanged(val);
+    });
+    // Save on Enter
+    wire($nameLobby, 'keydown', (e) => {
+      if (e.key === 'Enter') {
+        e.preventDefault();
+        if (nameDebounce) {
+          clearTimeout(nameDebounce);
+          nameDebounce = null;
+        }
+        const val = ($nameLobby.value || '').trim();
+        if (val) saveNameIfChanged(val);
+      }
+    });
+  }
 
   wire($createRoom, 'click', () => sendMsg({ type: 'create_room' }));