CLI

static/app.js

@@ -194,6 +194,7 @@ function header() {
     el("button", { class: "btn primary", text: "+ New note", onclick: () => openNote(null) }),
     el("button", { class: "btn ghost", text: "Help", onclick: showHelp }),
     el("button", { class: "btn ghost", text: "QUICKsnote", onclick: showTools }),
+    el("button", { class: "btn ghost", text: "CLI", onclick: showCli }),
     themeSelector(),
   ]);
   const burger = el("button", { class: "menu-toggle", title: "Menu", "aria-label": "Menu", onclick: () => menu.classList.toggle("open") }, [
@@ -252,6 +253,53 @@ function helpRow(keys, action) {
   return el("tr", {}, [el("td", { html: "<code>" + keys + "</code>" }), el("td", { text: action })]);
 }
 
+function showCli() {
+  state.view = "cli";
+  root.innerHTML = "";
+  state.editor?.destroy(); state.editor = null;
+
+  const back = backButton(showHome);
+  const installCmd = "curl -fsSL " + window.location.origin + "/" + state.user + "/cli | bash";
+  const cmdEl = el("code", { class: "cli-install-cmd", text: installCmd });
+  const copyBtn = el("button", {
+    class: "btn", text: "Copy",
+    onclick: () => { navigator.clipboard?.writeText(installCmd); copyBtn.textContent = "Copied!"; setTimeout(() => { copyBtn.textContent = "Copy"; }, 2000); },
+  });
+
+  const card = el("div", { class: "help-card" }, [
+    el("div", { class: "tools-head" }, [
+      el("img", { src: "/static/snotes-logo.png", class: "tools-logo", alt: "snotes CLI" }),
+      el("h1", { text: "snotes CLI" }),
+    ]),
+    el("p", { html: "A terminal client for snotes: TUI browser, quick capture, and <b>templates</b>." }),
+    el("p", { html: "Requires <a href=\"https://docs.astral.sh/uv/\" target=\"_blank\">uv</a>. Install or update for user <b>" + escapeHtml(state.user) + "</b> with:" }),
+    el("div", { class: "tools-row cli-install-row" }, [cmdEl, copyBtn]),
+    el("p", { class: "muted", text: "The script downloads the CLI to ~/.local/bin/snotes and saves this server's URL and your userspace to ~/.config/snotes/config.json." }),
+
+    el("h2", { text: "Commands" }),
+    el("table", { class: "help-table" }, [
+      el("tr", {}, [el("th", { text: "Command" }), el("th", { text: "Action" })]),
+      helpRow("snotes", "Open the TUI: recent notes, list, search (n = new, enter = edit, d = delete)"),
+      helpRow("snotes recent [-n N]", "Print recent notes"),
+      helpRow("snotes find <term>", "Open the TUI with a search for <term>"),
+      helpRow("snotes new", "Create a note in $EDITOR"),
+      helpRow("snotes <template> [date]", "Open/create a note from a template (today, yesterday, YYYY-MM-DD, +/-N)"),
+      helpRow("snotes templates", "List available templates"),
+      helpRow("snotes login", "Authenticate for remote (non-LAN) access"),
+    ]),
+
+    el("h2", { text: "Templates" }),
+    el("p", { html: "Any note containing <code>$name</code> defines a template — e.g. put <code>$journal</code> in a note titled <code># Journal for %date%</code> and <code>snotes journal</code> opens today's journal (existing entries are reopened, not duplicated)." }),
+    el("p", { html: "Template variables: <code>%date%</code>, <code>%time%</code>, <code>%datetime%</code>, <code>%user%</code>." }),
+  ]);
+
+  const wrap = el("div", { class: "editor-wrap" }, [
+    el("div", { class: "editor-topbar" }, [back]),
+    card,
+  ]);
+  root.appendChild(wrap);
+}
+
 function showTools() {
   state.view = "tools";
   root.innerHTML = "";