mevebu 1.9.0 → 1.10.0

package/mevebu/libs/js/tools/scientific-calculator.js

@@ -1,205 +1,256 @@
-// Scientific math from a typed expression or the keypad. Degrees or radians
-// drive the trig functions, and recent results stay in a short history.
-import { el, bench, stack, panel, textInput, output, notice, button, copyButton, chipRow, actions, toolcard } from "../core.js";
-
-function tokenize(src) {
-  const tokens = [];
-  let i = 0;
-  while (i < src.length) {
-    const ch = src[i];
-    if (/\s/.test(ch)) { i++; continue; }
-    if (/[0-9.]/.test(ch)) {
-      let j = i;
-      while (j < src.length && /[0-9.]/.test(src[j])) j++;
-      if (src[j] === "e" || src[j] === "E") {
-        let k = j + 1;
-        if (src[k] === "+" || src[k] === "-") k++;
-        if (/[0-9]/.test(src[k] ?? "")) {
-          while (k < src.length && /[0-9]/.test(src[k])) k++;
-          j = k;
-        }
-      }
-      tokens.push({ type: "num", value: Number(src.slice(i, j)) });
-      i = j;
-      continue;
-    }
-    if (/[a-zA-Z]/.test(ch)) {
-      let j = i;
-      while (j < src.length && /[a-zA-Z]/.test(src[j])) j++;
-      tokens.push({ type: "name", value: src.slice(i, j).toLowerCase() });
-      i = j;
-      continue;
-    }
-    if ("+-*/^()".includes(ch)) {
-      tokens.push({ type: "op", value: ch });
-      i++;
-      continue;
-    }
-    throw new Error("Unexpected character");
-  }
-  return tokens;
+// A scientific calculator with a Desmos style keypad: one expression, a live
+// result, variables that persist, and a history you can click back into.
+// mathjs is vendored and loaded on demand, so the page still works offline and
+// the other 187 tools never pay for a parser they do not use.
+import {
+  el, icon, toast, bench, stack, panel, textInput, notice, chipRow, button,
+  copyButton, actions, toolcard,
+} from "../core.js";
+
+const VENDOR = new URL("../vendor/mathjs.min.js", import.meta.url).href;
+
+let engine = null;
+function loadEngine() {
+  if (globalThis.math?.parse) return Promise.resolve(globalThis.math);
+  if (engine) return engine;
+  engine = new Promise((resolve, reject) => {
+    const script = document.createElement("script");
+    script.src = VENDOR;
+    script.onload = () => (globalThis.math?.parse ? resolve(globalThis.math) : reject(new Error("The math engine did not start.")));
+    script.onerror = () => reject(new Error("The math engine could not be loaded."));
+    document.head.append(script);
+  });
+  return engine;
 }
 
-const FUNCTIONS = {
-  sin: (x) => Math.sin(x),
-  cos: (x) => Math.cos(x),
-  tan: (x) => Math.tan(x),
-  asin: (x) => Math.asin(x),
-  acos: (x) => Math.acos(x),
-  atan: (x) => Math.atan(x),
-  log: (x) => Math.log10(x),
-  ln: (x) => Math.log(x),
-  sqrt: (x) => Math.sqrt(x),
-  abs: (x) => Math.abs(x),
-  exp: (x) => Math.exp(x)};
-
-function evaluate(src, degrees) {
-  const tokens = tokenize(src);
-  let pos = 0;
-  const peek = () => tokens[pos];
-  const eat = () => tokens[pos++];
-  const toRad = (x) => (degrees ? (x * Math.PI) / 180 : x);
-  const fromRad = (x) => (degrees ? (x * 180) / Math.PI : x);
-
-  function expr() {
-    let value = term();
-    while (peek() && peek().type === "op" && (peek().value === "+" || peek().value === "-")) {
-      const op = eat().value;
-      const rhs = term();
-      value = op === "+" ? value + rhs : value - rhs;
-    }
-    return value;
-  }
+const INJECTED = new Set([
+  "sin", "cos", "tan", "asin", "acos", "atan",
+  "sinh", "cosh", "tanh", "asinh", "acosh", "atanh",
+  "log", "ln", "nCr", "nPr", "ans",
+]);
 
-  function term() {
-    let value = unary();
-    for (;;) {
-      const token = peek();
-      if (token && token.type === "op" && (token.value === "*" || token.value === "/")) {
-        eat();
-        const rhs = unary();
-        value = token.value === "*" ? value * rhs : value / rhs;
-      } else if (token && (token.type === "num" || token.type === "name" || (token.type === "op" && token.value === "("))) {
-        value *= unary();
-      } else break;
-    }
-    return value;
-  }
+const EXTRA = [
+  "asin", "acos", "atan", "sinh", "cosh", "tanh",
+  "abs", "round", "floor", "ceil", "exp", "nthRoot",
+  "min", "max", "mod", "gcd", "lcm", "nCr", "nPr",
+];
 
-  function unary() {
-    const token = peek();
-    if (token && token.type === "op" && (token.value === "-" || token.value === "+")) {
-      eat();
-      const value = unary();
-      return token.value === "-" ? -value : value;
-    }
-    return power();
-  }
+const KEYS = [
+  ["sin(", "sin"], ["cos(", "cos"], ["tan(", "tan"], ["ln(", "ln"],
+  ["log(", "log"], ["sqrt(", "√"], ["^2", "x²"], ["!", "x!"],
+  ["(", "("], [")", ")"], ["pi", "π"], ["ans", "ans"],
+  ["7", "7"], ["8", "8"], ["9", "9"], ["/", "÷"],
+  ["4", "4"], ["5", "5"], ["6", "6"], ["*", "×"],
+  ["1", "1"], ["2", "2"], ["3", "3"], ["-", "−"],
+  ["0", "0"], [".", "."], ["+", "+"], ["%", "%"],
+];
 
-  function power() {
-    const base = primary();
-    if (peek() && peek().type === "op" && peek().value === "^") {
-      eat();
-      return base ** unary();
-    }
-    return base;
-  }
+const FUNC_BTN =
+  "min-h-[var(--ctl)] cursor-pointer rounded-r1 border border-orbit bg-deck-2 px-1 text-sm font-semibold text-ink transition-colors duration-150 hover:border-orbit-hard hover:bg-deck active:scale-[0.97]";
 
-  function primary() {
-    const token = eat();
-    if (!token) throw new Error("Unexpected end of expression");
-    if (token.type === "num") return token.value;
-    if (token.type === "name") {
-      if (token.value === "pi") return Math.PI;
-      if (token.value === "e") return Math.E;
-      if (!FUNCTIONS[token.value]) throw new Error("Unknown name");
-      const open = eat();
-      if (!open || open.value !== "(") throw new Error("Expected an opening bracket");
-      const arg = expr();
-      const close = eat();
-      if (!close || close.value !== ")") throw new Error("Expected a closing bracket");
-      const raw = FUNCTIONS[token.value](token.value === "sin" || token.value === "cos" || token.value === "tan" ? toRad(arg) : arg);
-      return token.value === "asin" || token.value === "acos" || token.value === "atan" ? fromRad(raw) : raw;
-    }
-    if (token.type === "op" && token.value === "(") {
-      const value = expr();
-      const close = eat();
-      if (!close || close.value !== ")") throw new Error("Expected a closing bracket");
-      return value;
+function smallFraction(value) {
+  if (!Number.isFinite(value) || Number.isInteger(value)) return null;
+  const sign = value < 0 ? -1 : 1;
+  let x = Math.abs(value);
+  let h0 = 0, h1 = 1, k0 = 1, k1 = 0;
+  for (let i = 0; i < 24; i++) {
+    const a = Math.floor(x);
+    const h2 = a * h1 + h0;
+    const k2 = a * k1 + k0;
+    if (k2 > 10000) return null;
+    h0 = h1; h1 = h2; k0 = k1; k1 = k2;
+    if (Math.abs(Math.abs(value) - h1 / k1) < 1e-10) {
+      return k1 === 1 ? null : { n: sign * h1, d: k1 };
     }
-    throw new Error("Unexpected token");
+    const rest = x - a;
+    if (rest < 1e-12) break;
+    x = 1 / rest;
   }
-
-  const result = expr();
-  if (pos < tokens.length) throw new Error("Unexpected token");
-  return result;
+  return null;
 }
 
-function fmt(n) {
-  return n.toLocaleString(undefined, { maximumFractionDigits: 10 });
-}
-
-const KEYS = ["sin(", "cos(", "tan(", "log(", "ln(", "sqrt(", "pi", "e", "^", "(", ")", "/", "7", "8", "9", "*", "4", "5", "6", "-", "1", "2", "3", "+", "0", ".", "="];
-
 export function mount(slot) {
-  const input = textInput({ value: "sin(30) + 2^3", "aria-label": "Expression", placeholder: "sin(30) + 2^3" });
-  const display = output({ rows: 2 });
+  const math = { current: null };
+  const scope = { ans: 0 };
+  const history = [];
+  const state = { degrees: true, fractions: false };
+
+  const input = textInput({
+    value: "",
+    placeholder: "sin(30) + 2^3",
+    "aria-label": "Expression",
+    class: "min-h-[56px] border-0 bg-transparent px-0 py-1 font-mono text-2xl font-semibold tracking-[-0.01em] focus:ring-0",
+    inputmode: "text",
+    autocapitalize: "off",
+    autocorrect: "off",
+  });
+  const result = el("p", {
+    class: "m-0 min-h-[1.2em] overflow-x-auto font-mono text-3xl font-bold tracking-[-0.02em] text-ink tabular-nums",
+    "aria-live": "polite",
+    "aria-atomic": "true",
+  });
   const error = notice("error");
-  const history = el("div", { class: "grid gap-px overflow-hidden rounded-r1 border border-orbit bg-orbit" });
-  const chips = chipRow(
-    [
-      { value: "deg", label: "Degrees" },
-      { value: "rad", label: "Radians" }],
-    {
-      value: "deg",
-      label: "Angle unit",
-      onChange: (value) => {
-        degrees = value === "deg";
-        run();
-      }}
+  const loading = notice("note");
+
+  const historyList = el("div", { class: "grid gap-px overflow-hidden rounded-r1 border border-orbit bg-orbit" });
+  const historyEmpty = el("p", { class: "m-0 text-sm text-ink-3" }, "Every result you commit lands here.");
+  const variablesList = el("div", { class: "flex flex-wrap gap-1.5" });
+  const variablesEmpty = el("p", { class: "m-0 text-sm text-ink-3" }, "Type a = 5 to keep a value.");
+
+  const display = el(
+    "div",
+    { class: "grid gap-1 rounded-r2 border border-orbit bg-deck-2 px-4 py-3 focus-within:border-jade focus-within:ring-3 focus-within:ring-jade-soft" },
+    input,
+    el("div", { class: "h-px bg-orbit" }),
+    result
   );
-  const recent = [];
-  let degrees = true;
-  let current = "";
 
-  function renderHistory() {
-    history.replaceChildren();
-    for (const entry of recent) {
-      history.append(
-        el("div", { class: "grid gap-3 bg-deck px-3 py-[9px] [grid-template-columns:minmax(90px,34%)_minmax(0,1fr)]" },
-          el("span", { class: "wrap-anywhere text-2xs font-semibold text-ink-2" }, entry.expression),
-          el("span", { class: "wrap-anywhere font-mono text-2xs" }, entry.result))
-      );
+  function format(value) {
+    const m = math.current;
+    if (!m) return "";
+    if (typeof value === "number") {
+      if (!Number.isFinite(value)) return String(value);
+      if (state.fractions) {
+        const fraction = smallFraction(value);
+        if (fraction) return `${fraction.n}/${fraction.d}`;
+      }
+      const size = Math.abs(value);
+      const notation = size !== 0 && (size >= 1e12 || size < 1e-6) ? "exponential" : "auto";
+      return m.format(value, { precision: 12, notation });
     }
+    try {
+      return m.format(value, { precision: 12 });
+    } catch {
+      return String(value);
+    }
+  }
+
+  function inject(m) {
+    const toRad = (x) => (state.degrees ? (x * Math.PI) / 180 : x);
+    const fromRad = (x) => (state.degrees ? (x * 180) / Math.PI : x);
+    scope.sin = (x) => Math.sin(toRad(x));
+    scope.cos = (x) => Math.cos(toRad(x));
+    scope.tan = (x) => Math.tan(toRad(x));
+    scope.asin = (x) => fromRad(Math.asin(x));
+    scope.acos = (x) => fromRad(Math.acos(x));
+    scope.atan = (x) => fromRad(Math.atan(x));
+    scope.sinh = (x) => Math.sinh(x);
+    scope.cosh = (x) => Math.cosh(x);
+    scope.tanh = (x) => Math.tanh(x);
+    scope.asinh = (x) => Math.asinh(x);
+    scope.acosh = (x) => Math.acosh(x);
+    scope.atanh = (x) => Math.atanh(x);
+    // Desmos reads log as base 10 and ln as natural, which is the opposite of
+    // mathjs's default for log, so both names are pinned here.
+    scope.log = (x, base) => (base === undefined ? Math.log10(x) : Math.log(x) / Math.log(base));
+    scope.ln = (x) => Math.log(x);
+    scope.nCr = (n, r) => m.combinations(n, r);
+    scope.nPr = (n, r) => m.permutations(n, r);
+    math.current = m;
+  }
+
+  function read(text, target) {
+    const m = math.current;
+    if (!m) throw new Error("The math engine is still loading.");
+    const node = m.parse(text);
+    return node.evaluate(target);
   }
 
-  function run() {
+  let previewToken = 0;
+  async function preview() {
+    const token = ++previewToken;
     const text = input.value.trim();
+    error.write("");
     if (!text) {
-      display.write("");
-      error.write("");
-      current = "";
+      result.textContent = "";
       return;
     }
     try {
-      const value = evaluate(text, degrees);
-      if (!Number.isFinite(value)) throw new Error("Not a finite number");
-      current = fmt(value);
-      display.write(current);
-      error.write("");
-    } catch {
-      current = "";
-      display.write("");
-      error.write("That expression could not be read.");
+      const m = await loadEngine();
+      if (!math.current) inject(m);
+      if (token !== previewToken) return;
+      const value = read(text, { ...scope });
+      if (token !== previewToken) return;
+      result.textContent = format(value);
+      result.dataset.preview = "";
+    } catch (caught) {
+      if (token !== previewToken) return;
+      result.textContent = "";
+      error.write(shortError(caught));
     }
   }
 
+  function shortError(caught) {
+    const text = String(caught?.message ?? "Check the expression.");
+    return text.length > 120 ? `${text.slice(0, 117)}...` : text;
+  }
+
   function commit() {
-    run();
-    if (!current) return;
-    recent.unshift({ expression: input.value.trim(), result: current });
-    recent.splice(5);
-    renderHistory();
+    const text = input.value.trim();
+    if (!text) return;
+    try {
+      const value = read(text, scope);
+      if (typeof value === "number") scope.ans = value;
+      const shown = format(value);
+      result.textContent = shown;
+      delete result.dataset.preview;
+      error.write("");
+      if (history[0]?.text !== text) {
+        history.unshift({ text, value });
+        history.splice(20);
+      }
+      renderHistory();
+      renderVariables();
+      input.select();
+    } catch (caught) {
+      error.write(shortError(caught));
+    }
+  }
+
+  function renderHistory() {
+    historyList.replaceChildren(
+      ...history.map((entry) =>
+        el(
+          "button",
+          {
+            class: "grid w-full cursor-pointer gap-2 border-0 bg-deck px-3 py-2.5 text-start transition-colors duration-150 hover:bg-deck-2 [grid-template-columns:minmax(0,1fr)_auto]",
+            type: "button",
+            title: "Use this expression again",
+            onclick: () => {
+              input.value = entry.text;
+              input.focus();
+              input.setSelectionRange(entry.text.length, entry.text.length);
+              preview();
+            },
+          },
+          el("span", { class: "wrap-anywhere font-mono text-sm text-ink-2" }, entry.text),
+          el("span", { class: "font-mono text-sm font-semibold text-ink tabular-nums" }, format(entry.value))
+        )
+      )
+    );
+    historyEmpty.hidden = history.length > 0;
+    historyList.hidden = history.length === 0;
+  }
+
+  function renderVariables() {
+    const names = Object.keys(scope).filter((name) => !INJECTED.has(name) && name !== "ans");
+    variablesList.replaceChildren(
+      ...names.map((name) =>
+        el(
+          "button",
+          {
+            class: "inline-flex cursor-pointer items-baseline gap-1.5 rounded-full border border-orbit bg-deck-2 px-2.5 py-1 font-mono text-sm transition-colors duration-150 hover:border-jade hover:bg-jade-soft",
+            type: "button",
+            title: `Insert ${name}`,
+            onclick: () => insert(name),
+          },
+          el("span", { class: "font-semibold text-jade" }, name),
+          el("span", { class: "text-ink-2" }, format(scope[name]))
+        )
+      )
+    );
+    variablesEmpty.hidden = names.length > 0;
+    variablesList.hidden = names.length === 0;
   }
 
   function insert(token) {
@@ -213,31 +264,157 @@ export function mount(slot) {
     const caret = start + token.length;
     input.focus();
     input.setSelectionRange(caret, caret);
-    run();
+    preview();
+  }
+
+  function backspace() {
+    const start = input.selectionStart ?? input.value.length;
+    const end = input.selectionEnd ?? start;
+    if (start !== end) {
+      input.value = input.value.slice(0, start) + input.value.slice(end);
+    } else if (start > 0) {
+      input.value = input.value.slice(0, start - 1) + input.value.slice(start);
+      input.setSelectionRange(start - 1, start - 1);
+    }
+    input.focus();
+    preview();
   }
 
-  const keypad = el("div", { class: "flex flex-wrap gap-1.5" });
-  for (const key of KEYS) {
-    keypad.append(el("button", { class: "min-h-[var(--ctl)] cursor-pointer rounded-r1 border border-orbit bg-deck px-[13px] text-sm font-medium text-ink-2 transition-colors duration-150 hover:border-orbit-hard hover:text-ink data-[on]:border-jade data-[on]:bg-jade-soft data-[on]:text-ink", type: "button", onclick: () => insert(key) }, key));
+  function clear() {
+    input.value = "";
+    result.textContent = "";
+    error.write("");
+    input.focus();
   }
 
-  input.addEventListener("input", run);
-  const evaluateButton = button("Evaluate", { icon: "calculator", kind: "fill", onclick: commit });
+  const keypad = el("div", { class: "grid grid-cols-4 gap-1.5" });
+  for (const [token, label] of KEYS) {
+    keypad.append(
+      el("button", { class: FUNC_BTN, type: "button", "aria-label": label, onclick: () => insert(token) }, label)
+    );
+  }
+  keypad.append(
+    el("button", { class: FUNC_BTN, type: "button", "aria-label": "Backspace", onclick: backspace }, "DEL"),
+    el("button", { class: FUNC_BTN, type: "button", onclick: clear }, "C"),
+    el("button", {
+      class: "col-span-2 min-h-[var(--ctl)] cursor-pointer rounded-r1 border border-jade bg-jade text-sm font-bold text-on-jade transition-colors duration-150 hover:border-jade-deep hover:bg-jade-deep active:scale-[0.97]",
+      type: "button",
+      onclick: commit,
+    }, "=")
+  );
+
+  const extras = el("div", { class: "flex flex-wrap gap-1.5" });
+  for (const name of EXTRA) {
+    extras.append(
+      el("button", {
+        class: "inline-flex min-h-8 cursor-pointer items-center rounded-full border border-orbit bg-deck px-2.5 font-mono text-2xs font-semibold text-ink-2 transition-colors duration-150 hover:border-orbit-hard hover:text-ink",
+        type: "button",
+        onclick: () => insert(`${name}(`),
+      }, name)
+    );
+  }
+
+  const angle = chipRow(
+    [
+      { value: "deg", label: "Degrees" },
+      { value: "rad", label: "Radians" },
+    ],
+    {
+      value: "deg",
+      label: "Angle unit",
+      onChange: (value) => {
+        state.degrees = value === "deg";
+        preview();
+      },
+    }
+  );
+
+  const fraction = chipRow(
+    [
+      { value: "decimal", label: "Decimal" },
+      { value: "fraction", label: "Fraction" },
+    ],
+    {
+      value: "decimal",
+      label: "Result format",
+      onChange: (value) => {
+        state.fractions = value === "fraction";
+        renderHistory();
+        preview();
+      },
+    }
+  );
+
+  const copyResult = copyButton(() => result.textContent, "Copy result");
+  const clearHistory = button("Clear history", {
+    icon: "trash",
+    kind: "quiet",
+    onclick: () => {
+      history.length = 0;
+      renderHistory();
+    },
+  });
+  const commitButton = button("Evaluate", { icon: "calculator", kind: "fill", onclick: commit });
+
+  input.addEventListener("input", preview);
+  input.addEventListener("keydown", (event) => {
+    if (event.key === "Enter") {
+      event.preventDefault();
+      commit();
+    } else if (event.key === "Escape") {
+      event.preventDefault();
+      clear();
+    } else if (event.key === "ArrowUp" && history.length) {
+      event.preventDefault();
+      input.value = history[0].text;
+      input.setSelectionRange(input.value.length, input.value.length);
+      preview();
+    }
+  });
 
   const card = toolcard({
     body: bench(
       stack(
-        panel("Expression", input),
-        panel("Angle unit", chips),
-        panel("Keys", keypad)
+        panel("Angle", angle),
+        panel("Result", fraction),
+        el("div", { class: "grid gap-1.5" }, el("span", { class: "text-sm font-semibold text-ink-2" }, "Keypad"), keypad),
+        el("div", { class: "grid gap-1.5" }, el("span", { class: "text-sm font-semibold text-ink-2" }, "More functions"), extras),
+        loading,
+        error
       ),
-      stack(display, error, panel("History", history))
+      stack(
+        display,
+        panel("History", historyList),
+        historyEmpty,
+        panel("Variables", variablesList),
+        variablesEmpty
+      )
     ),
-    foot: actions(copyButton(() => current, "Copy result"), evaluateButton)});
+    foot: actions(clearHistory, copyResult, commitButton),
+  });
+
+  loading.write("Starting the math engine.");
   slot.append(card.node);
-  run();
+  renderHistory();
+  renderVariables();
+  input.focus();
+
+  loadEngine()
+    .then((m) => {
+      inject(m);
+      loading.write("");
+      preview();
+    })
+    .catch((caught) => {
+      loading.write("");
+      error.write(shortError(caught));
+    });
 
-  return {};
+  return {
+    unmount() {
+      previewToken++;
+    },
+  };
 }
 
 export default { mount };

package/mevebu/libs/js/tools/subtitle-formatter.js

@@ -39,7 +39,7 @@ export function mount(slot) {
     note.write(long.length ? `${long.length} lines run past ${cap} characters.` : "");
 
     if (!long.length) {
-      longWrap.replaceChildren(blank("film", "No line runs past the limit."));
+      longWrap.replaceChildren(blank("video", "No line runs past the limit."));
     } else {
       longWrap.replaceChildren(el("div", { class: "grid gap-px overflow-hidden rounded-r1 border border-orbit bg-orbit" },
         ...long.map((line) => el("div", { class: "grid gap-3 bg-deck px-3 py-[9px] [grid-template-columns:minmax(90px,34%)_minmax(0,1fr)]" },

package/mevebu/libs/js/vendor/mathjs.LICENSE.txt

@@ -0,0 +1,34 @@
+/*!
+ *  decimal.js v10.5.0
+ *  An arbitrary-precision Decimal type for JavaScript.
+ *  https://github.com/MikeMcl/decimal.js
+ *  Copyright (c) 2025 Michael Mclaughlin <M8ch88l@gmail.com>
+ *  MIT Licence
+ */
+
+/**
+ * math.js
+ * https://github.com/josdejong/mathjs
+ *
+ * Math.js is an extensive math library for JavaScript and Node.js,
+ * It features real and complex numbers, units, matrices, a large set of
+ * mathematical functions, and a flexible expression parser.
+ *
+ * @version 15.2.0
+ * @date    2026-04-07
+ *
+ * @license
+ * Copyright (C) 2013-2026 Jos de Jong <wjosdejong@gmail.com>
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License"); you may not
+ * use this file except in compliance with the License. You may obtain a copy
+ * of the License at
+ *
+ * https://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
+ * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
+ * License for the specific language governing permissions and limitations under
+ * the License.
+ */