ltcai 2.2.2 → 3.0.1

package/static/scripts/workspace.js

@@ -15,6 +15,8 @@ const state = {
 
 // Skills that match common workspace needs are surfaced under "Recommended".
 const RECOMMENDED_SKILL_HINTS = ["code", "review", "doc", "test", "security", "research", "changelog", "refactor", "debug"];
+const MODE_KEY = "ltcai_workspace_mode";
+const LANG_KEY = "ltcai_lang";
 
 function $(id) {
   return document.getElementById(id);
@@ -51,6 +53,61 @@ function toast(message) {
   node._timer = setTimeout(() => node.classList.remove("show"), 2200);
 }
 
+function adminAvailableForWorkspace(workspace) {
+  const storedAdmin = (() => {
+    try { return localStorage.getItem("ltcai_is_admin") === "true"; } catch { return false; }
+  })();
+  const role = String(workspace?.your_role || "").toLowerCase();
+  return storedAdmin || role === "owner" || role === "admin";
+}
+
+function currentWorkspaceMode() {
+  try {
+    const mode = localStorage.getItem(MODE_KEY);
+    return ["basic", "advanced", "admin"].includes(mode) ? mode : "basic";
+  } catch {
+    return "basic";
+  }
+}
+
+function applyWorkspaceMode(mode, { adminAvailable = false } = {}) {
+  if (mode === "admin" && !adminAvailable) mode = "basic";
+  const shell = document.querySelector(".workspace-shell");
+  if (shell) shell.dataset.workspaceMode = mode;
+  document.querySelectorAll("[data-workspace-mode]").forEach((button) => {
+    if (button.matches("button")) {
+      const active = button.dataset.workspaceMode === mode;
+      button.classList.toggle("active", active);
+      button.setAttribute("aria-selected", active ? "true" : "false");
+      button.disabled = button.dataset.workspaceMode === "admin" && !adminAvailable;
+    }
+  });
+  try { localStorage.setItem(MODE_KEY, mode); } catch {}
+}
+
+function updateWorkspaceChrome(activeWorkspace) {
+  const shell = document.querySelector(".workspace-shell");
+  const adminAvailable = adminAvailableForWorkspace(activeWorkspace);
+  if (shell) shell.dataset.adminAvailable = adminAvailable ? "true" : "false";
+  applyWorkspaceMode(currentWorkspaceMode(), { adminAvailable });
+  const lang = (() => {
+    try { return localStorage.getItem(LANG_KEY) || "en"; } catch { return "en"; }
+  })();
+  document.documentElement.lang = lang;
+  const langSelect = $("workspace-language");
+  if (langSelect) langSelect.value = lang;
+}
+
+async function logoutWorkspace() {
+  try { await api("/logout", { method: "POST" }); } catch (_) {}
+  try {
+    localStorage.removeItem("ltcai_user_email");
+    localStorage.removeItem("ltcai_user_nickname");
+    localStorage.removeItem("ltcai_is_admin");
+  } catch (_) {}
+  window.location.href = "/account";
+}
+
 function renderMetrics(os) {
   const counts = os?.counts || {};
   const graph = os?.graph || {};
@@ -363,6 +420,7 @@ function renderWorkspaceRegistry(registry, edition) {
     `).join("");
   }
   const active = workspaces.find((ws) => ws.workspace_id === state.activeWorkspace);
+  updateWorkspaceChrome(active);
   const rolePill = $("workspace-role");
   if (rolePill) rolePill.textContent = active ? (active.your_role || "—") : "";
   if (edition) {
@@ -837,6 +895,26 @@ document.addEventListener("change", async (event) => {
 });
 
 document.addEventListener("DOMContentLoaded", () => {
+  document.querySelectorAll("[data-workspace-mode]").forEach((button) => {
+    if (!button.matches("button")) return;
+    button.addEventListener("click", () => {
+      const shell = document.querySelector(".workspace-shell");
+      const adminAvailable = shell?.dataset.adminAvailable === "true";
+      applyWorkspaceMode(button.dataset.workspaceMode, { adminAvailable });
+    });
+  });
+  const language = $("workspace-language");
+  if (language) {
+    language.value = (() => {
+      try { return localStorage.getItem(LANG_KEY) || "en"; } catch { return "en"; }
+    })();
+    language.addEventListener("change", () => {
+      try { localStorage.setItem(LANG_KEY, language.value); } catch (_) {}
+      document.documentElement.lang = language.value;
+    });
+  }
+  const logoutButton = $("workspace-logout");
+  if (logoutButton) logoutButton.addEventListener("click", () => logoutWorkspace());
   $("refresh-btn").addEventListener("click", () => refreshAll().catch((err) => toast(err.message)));
   $("snapshot-now").addEventListener("click", () => createSnapshot().catch((err) => toast(err.message)));
   $("create-snapshot").addEventListener("click", () => createSnapshot().catch((err) => toast(err.message)));

package/static/sw.js

@@ -1,12 +1,14 @@
 // Lattice AI Service Worker — enables PWA install on Android/iOS
 // Strategy: network-first for API, cache-first for static assets.
-const CACHE = "ltcai-v110";
+const CACHE = "ltcai-v226";
 const STATIC = [
   "/",
   "/workspace",
-  "/static/lattice-reference.css",
-  "/static/workspace.css",
   "/static/css/tokens.css",
+  "/static/css/reference/base.css",
+  "/static/css/reference/chat.css",
+  "/static/css/responsive.css",
+  "/static/workspace.css",
   "/static/scripts/chat.js",
   "/static/scripts/admin.js",
   "/static/scripts/graph.js",

package/static/v3/css/lattice.base.css

@@ -0,0 +1,128 @@
+/* ============================================================================
+ * Lattice AI v3 — Base layer (reset + element defaults + lattice backdrop)
+ * Token-native: no themed hex values, everything via var(--*).
+ * ========================================================================== */
+
+*, *::before, *::after { box-sizing: border-box; }
+
+html, body { height: 100%; }
+
+body {
+  margin: 0;
+  font-family: var(--lt3-font-sans);
+  font-size: var(--lt3-text-md);
+  line-height: var(--lt3-leading-normal);
+  color: var(--text);
+  background: var(--bg);
+  -webkit-font-smoothing: antialiased;
+  text-rendering: optimizeLegibility;
+  overflow: hidden;            /* shell owns scroll regions */
+}
+
+/* The signature lattice backdrop — a faint structural mesh of nodes+edges.
+   Sits behind the whole app; reinforces the "lattice" identity without noise. */
+.lt3-app::before {
+  content: "";
+  position: fixed;
+  inset: 0;
+  z-index: 0;
+  pointer-events: none;
+  background:
+    radial-gradient(circle at center, var(--lt3-mesh-node) 0.9px, transparent 1.1px),
+    linear-gradient(var(--lt3-mesh-line) 1px, transparent 1px),
+    linear-gradient(90deg, var(--lt3-mesh-line) 1px, transparent 1px),
+    var(--app-bg);
+  background-size:
+    var(--lt3-mesh-size) var(--lt3-mesh-size),
+    var(--lt3-mesh-size) var(--lt3-mesh-size),
+    var(--lt3-mesh-size) var(--lt3-mesh-size),
+    cover;
+  background-position: center;
+  mask-image: radial-gradient(ellipse 120% 90% at 50% -10%, #000 55%, transparent 100%);
+  opacity: 0.9;
+}
+
+h1, h2, h3, h4, p, figure { margin: 0; }
+
+a { color: inherit; text-decoration: none; }
+
+button {
+  font: inherit;
+  color: inherit;
+  cursor: pointer;
+  border: none;
+  background: none;
+}
+
+input, select, textarea { font: inherit; color: inherit; }
+
+textarea { resize: vertical; }
+
+img, svg { display: block; max-width: 100%; }
+
+code, pre, kbd, samp { font-family: var(--lt3-font-mono); }
+
+:root[data-lt-icons="fallback"] .ti {
+  display: inline-grid;
+  place-items: center;
+  min-width: 1em;
+  min-height: 1em;
+  font-family: var(--lt3-font-mono);
+  font-size: 0.72em;
+  font-style: normal;
+  font-weight: 800;
+  line-height: 1;
+  text-transform: uppercase;
+}
+
+:root[data-lt-icons="fallback"] .ti::before {
+  content: attr(data-fallback);
+}
+
+:focus-visible {
+  outline: 2px solid var(--focus-ring);
+  outline-offset: 2px;
+  border-radius: var(--lt3-radius-xs);
+}
+
+::-webkit-scrollbar { width: 8px; height: 8px; }
+::-webkit-scrollbar-track { background: transparent; }
+::-webkit-scrollbar-thumb {
+  background: color-mix(in srgb, var(--border-strong) 60%, transparent);
+  border-radius: 99px;
+  border: 2px solid transparent;
+  background-clip: padding-box;
+}
+::-webkit-scrollbar-thumb:hover { background: var(--border-strong); background-clip: padding-box; }
+
+/* Accessible visually-hidden utility */
+.lt3-sr {
+  position: absolute !important;
+  width: 1px; height: 1px;
+  padding: 0; margin: -1px;
+  overflow: hidden; clip: rect(0,0,0,0);
+  white-space: nowrap; border: 0;
+}
+
+.lt3-skip {
+  position: fixed;
+  top: var(--lt3-space-3);
+  left: var(--lt3-space-3);
+  z-index: var(--lt3-z-toast);
+  padding: var(--lt3-space-2) var(--lt3-space-4);
+  background: var(--accent);
+  color: #fff;
+  border-radius: var(--lt3-radius-sm);
+  transform: translateY(-200%);
+  transition: transform var(--lt3-dur-2) var(--lt3-ease);
+}
+.lt3-skip:focus { transform: translateY(0); }
+
+@media (prefers-reduced-motion: reduce) {
+  *, *::before, *::after {
+    animation-duration: 0.001ms !important;
+    animation-iteration-count: 1 !important;
+    transition-duration: 0.001ms !important;
+    scroll-behavior: auto !important;
+  }
+}