Extract auth admin and vote handlers from app entry

wwwroot/app.js

@@ -1,10 +1,7 @@
-import { api, adminApi } from "./js/api.js";
 import { t, setLanguage, getLanguage, initI18n, onLanguageChange, faqMarkdown } from "./js/i18n.js";
-import { state, clearUserState, setSavedUsername } from "./js/state.js";
-import { $, toast } from "./js/dom.js";
+import { state, clearUserState } from "./js/state.js";
+import { toast } from "./js/dom.js";
 import {
-  setAuthUI,
-  setAuthMode,
   handleAuthError,
   renderWelcome,
   renderPhasePill,
@@ -15,10 +12,7 @@ import {
   syncVoteScores,
   renderResults,
   renderPhaseTitles,
-  openNewSuggestionModal,
   updatePhaseNav,
-  openConfirmModal,
-  openResultsRelockModal,
   configureUiRuntime,
 } from "./js/ui.js";
 import {
@@ -26,6 +20,9 @@ import {
   loadVoteData,
   refreshPhaseData,
 } from "./js/data.js";
+import { setupAuthHandlers } from "./js/app-auth-handlers.js";
+import { setupAdminHandlers } from "./js/app-admin-handlers.js";
+import { setupVoteNavigationHandlers } from "./js/app-vote-nav-handlers.js";
 
 const REFRESH_INTERVAL_MS = 4000;
 let refreshInFlight = null;
@@ -81,37 +78,9 @@ configureUiRuntime({
 });
 
 function setupHandlers() {
-  const toggleAuth = $("auth-toggle");
-  if (toggleAuth) {
-    toggleAuth.addEventListener("click", (e) => {
-      e.preventDefault();
-      setAuthMode(state.authMode === "login" ? "register" : "login");
-    });
-  }
-  setAuthMode(state.authMode);
-
-  const hasConsent = () => document.cookie.split(";").some((c) => c.trim().startsWith("cookie_consent=1"));
-  const setConsent = () => { document.cookie = "cookie_consent=1; path=/; max-age=31536000; SameSite=Lax"; };
-  const consentRows = document.querySelectorAll(".consent-row");
-  const toggleConsentRows = () => {
-    const hide = hasConsent();
-    consentRows.forEach((row) => row.classList.toggle("hidden", hide));
-  };
-  toggleConsentRows();
-  ["login-consent", "register-consent"].forEach((id) => {
-    const box = $(id);
-    if (box) {
-      box.checked = hasConsent();
-    }
-  });
-
-  const loginUser = $("login-username");
-  if (loginUser) {
-    const markEditing = () => { loginUser.dataset.userEditing = "1"; };
-    ["focus", "input", "keydown"].forEach((evt) => loginUser.addEventListener(evt, markEditing));
-    loginUser.addEventListener("blur", () => { delete loginUser.dataset.userEditing; });
-  }
-
+  setupAuthHandlers({ runSerializedRefresh });
+  setupAdminHandlers({ runSerializedRefresh });
+  setupVoteNavigationHandlers({ runSerializedRefresh });
   setupLanguageSwitchers();
 
   onLanguageChange(() => {
@@ -133,201 +102,9 @@ function setupHandlers() {
     updatePhaseNav();
   });
 
-  const loginForm = $("login-form");
-  if (loginForm) {
-    loginForm.addEventListener("submit", async (e) => {
-      e.preventDefault();
-      const username = $("login-username").value.trim();
-      const password = $("login-password").value;
-      if (!username || !password) return toast(t("auth.needCredentials"), true);
-      if (!hasConsent() && !$("login-consent")?.checked) return toast(t("auth.cookieRequired"), true);
-      try {
-        await api.login({ username, password });
-        setConsent();
-        toggleConsentRows();
-        setSavedUsername(username);
-        state.isAuthenticated = true;
-        setAuthUI(true);
-        await runSerializedRefresh();
-        toast(t("toast.loggedIn"));
-      } catch (err) {
-        if (err?.status === 401) return toast(t("auth.invalidCredentials"), true);
-        if (handleAuthError(err, clearUserState)) return;
-      }
-    });
-  }
-
-  const registerForm = $("register-form");
-  if (registerForm) {
-    registerForm.addEventListener("submit", async (e) => {
-      e.preventDefault();
-      const username = $("register-username").value.trim();
-      const password = $("register-password").value;
-      const displayName = $("register-displayName").value.trim();
-      const adminKey = $("register-adminkey").value.trim();
-      if (!displayName) return toast(t("toast.displayNameRequired") || "Display name is required.", true);
-      if (!username || !password) return toast(t("auth.needCredentials"), true);
-      if (!hasConsent() && !$("register-consent")?.checked) return toast(t("auth.cookieRequired"), true);
-      try {
-        await api.register({ username, password, displayName, adminKey });
-        setConsent();
-        toggleConsentRows();
-        setSavedUsername(username);
-        state.isAuthenticated = true;
-        setAuthUI(true);
-        await runSerializedRefresh();
-        toast(t("toast.registered"));
-      } catch (err) {
-        if (handleAuthError(err, clearUserState)) return;
-        toast(err.message, true);
-      }
-    });
-  }
-
-  const openSuggestBtn = $("open-suggest-modal");
-  if (openSuggestBtn) {
-    openSuggestBtn.addEventListener("click", (e) => {
-      e.preventDefault();
-      if (openSuggestBtn.disabled) return;
-      if (state.phase !== "Suggest") return;
-      openNewSuggestionModal();
-    });
-  }
-  const openJokerBtn = $("open-joker-modal");
-  if (openJokerBtn) {
-    openJokerBtn.addEventListener("click", (e) => {
-      e.preventDefault();
-      if (state.phase !== "Vote" || !state.hasJoker) return;
-      openNewSuggestionModal();
-    });
-  }
-
-  bindNavButtons();
-
-  $("reset").addEventListener("click", () => adminAction(adminApi.reset, t("admin.resetDone")));
-  $("factory-reset").addEventListener("click", () => adminAction(adminApi.factoryReset, t("admin.factoryResetDone")));
-
-  const logoutBtn = $("logout");
-  if (logoutBtn) {
-    logoutBtn.addEventListener("click", async (e) => {
-      e.preventDefault();
-      const lastUser = state.me?.username;
-      try {
-        await api.logout();
-      } catch (err) {
-        toast(err.message, true);
-      }
-      clearUserState();
-      state.isAuthenticated = false;
-      setAuthUI(false);
-      if (lastUser) {
-        setSavedUsername(lastUser);
-        const loginUser = $("login-username");
-        if (loginUser) loginUser.value = lastUser;
-        const loginPass = $("login-password");
-        if (loginPass) loginPass.value = "";
-      }
-    });
-  }
-
-  const adminToggle = $("admin-toggle");
-  const adminCard = $("admin-card");
-  const adminClose = $("admin-close");
-  if (adminToggle && adminCard && adminClose) {
-    const togglePanel = (show) => adminCard.classList.toggle("hidden", !show);
-    adminToggle.addEventListener("click", () => togglePanel(adminCard.classList.contains("hidden")));
-    adminClose.addEventListener("click", () => togglePanel(false));
-  }
-
   document.querySelectorAll(".help-chip").forEach((chip) => {
     chip.addEventListener("click", () => openFaqModal());
   });
-
-  const resultsToggle = $("results-open");
-  if (resultsToggle) {
-    resultsToggle.addEventListener("change", async (e) => {
-      const desired = !!e.target.checked;
-      try {
-        const resp = await adminApi.setResultsOpen(desired);
-        const wasResultsOpen = state.resultsOpen;
-        const wasPhase = state.phase;
-        state.resultsOpen = resp.resultsOpen;
-        if (wasResultsOpen && !resp.resultsOpen && wasPhase === "Results") {
-          openResultsRelockModal();
-        }
-        renderPhasePill();
-        toast(t("admin.resultsUpdated"));
-        await runSerializedRefresh();
-      } catch (err) {
-        e.target.checked = !desired;
-        toast(err.message, true);
-      }
-    });
-  }
-
-  const linkApply = $("link-apply");
-  if (linkApply) {
-    linkApply.addEventListener("click", async () => {
-      const source = Number($("link-source")?.value);
-      const target = Number($("link-target")?.value);
-      if (!source || !target || source === target) {
-        return toast(t("admin.linkValidation"), true);
-      }
-      try {
-        await adminApi.linkSuggestions(source, target);
-        toast(t("admin.linkDone"));
-        await runSerializedRefresh();
-      } catch (err) {
-        toast(err.message, true);
-      }
-    });
-  }
-
-  const playerTable = $("admin-player-table");
-  if (playerTable) {
-    playerTable.addEventListener("click", async (e) => {
-      const grantBtn = e.target.closest("[data-grant-joker]");
-      const deleteBtn = e.target.closest("[data-delete-player]");
-      if (grantBtn) {
-        const playerId = grantBtn.dataset.grantJoker;
-        try {
-          await adminApi.grantJoker(playerId);
-          toast(t("admin.jokerGranted"));
-          await runSerializedRefresh();
-        } catch (err) {
-          toast(err.message, true);
-        }
-      } else if (deleteBtn) {
-        const playerId = deleteBtn.dataset.deletePlayer;
-        const name = deleteBtn.dataset.name || "";
-        openConfirmModal({
-          title: t("admin.deleteTitle"),
-          body: t("admin.deleteBody", { name }),
-          confirmLabel: t("admin.deleteConfirm"),
-          onConfirm: async (close) => {
-            try {
-              await adminApi.deletePlayer(playerId);
-              toast(t("admin.deleteDone"));
-              close();
-              await runSerializedRefresh();
-            } catch (err) {
-              toast(err.message, true);
-            }
-          },
-        });
-      }
-    });
-  }
-}
-
-async function adminAction(fn, successMessage) {
-  try {
-    await fn();
-    toast(successMessage);
-    await runSerializedRefresh();
-  } catch (err) {
-    toast(err.message, true);
-  }
 }
 
 async function main() {
@@ -378,103 +155,6 @@ function setupLanguageSwitchers() {
   updateLanguageButtons();
 }
 
-function bindNavButtons() {
-  const makeForward = (id, before) => {
-    const btn = $(id);
-    if (!btn) return;
-    btn.addEventListener("click", async () => {
-      try {
-        if (before) {
-          const proceed = await before();
-          if (!proceed) return;
-        }
-        const resp = await api.nextPhase();
-        state.prevPhase = state.phase;
-        state.phase = resp.currentPhase;
-        state.resultsOpen = resp.resultsOpen ?? state.resultsOpen;
-        state.votesRendered = false;
-        renderPhasePill();
-        await runSerializedRefresh();
-      } catch (err) {
-        toast(err.message, true);
-      }
-    });
-  };
-
-  const makeBack = (id) => {
-    const btn = $(id);
-    if (!btn) return;
-    btn.addEventListener("click", async () => {
-      try {
-        const resp = await api.prevPhase();
-        state.prevPhase = state.phase;
-        state.phase = resp.currentPhase;
-        state.resultsOpen = resp.resultsOpen ?? state.resultsOpen;
-        state.votesRendered = false;
-        renderPhasePill();
-        await runSerializedRefresh();
-      } catch (err) {
-        toast(err.message, true);
-      }
-    });
-  };
-
-  makeForward("nav-suggest-next", async () => {
-    return await new Promise((resolve) => {
-      openConfirmModal({
-        title: t("nav.freezeModalTitle"),
-        body: t("nav.freezeModalBody"),
-        confirmLabel: t("nav.next"),
-        onConfirm: (close) => {
-          close();
-          resolve(true);
-        },
-      });
-    });
-  });
-  makeBack("nav-vote-prev");
-
-  const finalizeBtn = $("finalize-votes");
-  if (finalizeBtn) {
-    const finalizeVotes = async (desired) => {
-      await api.finalizeVotes(desired);
-      state.votesFinal = desired;
-      renderPhasePill();
-      renderVotes();
-      toast(desired ? t("vote.finalize") : t("vote.unfinalize"));
-    };
-
-    const missingVotes = () => {
-      const votedIds = new Set((state.myVotes ?? []).map((v) => v.suggestionId));
-      return (state.allSuggestions ?? []).filter((s) => !votedIds.has(s.id));
-    };
-
-    finalizeBtn.addEventListener("click", async () => {
-      try {
-        const desired = !state.votesFinal;
-        if (desired) {
-          const missing = missingVotes();
-          if (missing.length > 0) {
-            openConfirmModal({
-              title: t("vote.finalizeMissingTitle"),
-              body: t("vote.finalizeMissingBody", { count: missing.length }),
-              confirmLabel: t("vote.finalizeMissingConfirm"),
-              onConfirm: async (close) => {
-                await finalizeVotes(desired);
-                close();
-              },
-            });
-            return;
-          }
-        }
-        await finalizeVotes(desired);
-      } catch (err) {
-        toast(err.message, true);
-      }
-    });
-  }
-}
-
 function markdownToHtml(md) {
   const lines = md.trim().split(/\r?\n/);
   const html = [];