mevebu 0.3.0 → 0.4.0

package/mevebu/libs/js/tools/permutation-combination.js

@@ -0,0 +1,106 @@
+// Counts arrangements and selections with nPr and nCr.
+import { el, bench, stack, panel, numberInput, notice, copyButton, chipRow, actions, toolcard } from "../core.js";
+
+function fmt(n) {
+  return n.toLocaleString(undefined, { maximumFractionDigits: 6 });
+}
+
+function tile(label) {
+  const value = el("span", { class: "mvb-stat__v" }, "-");
+  const node = el("div", { class: "mvb-stat" }, value, el("span", { class: "mvb-stat__k" }, label));
+  node.set = (text) => { value.textContent = text; };
+  return node;
+}
+
+export function mount(slot) {
+  const nInput = numberInput({ value: "5", min: "0", step: "1", "aria-label": "n" });
+  const rInput = numberInput({ value: "3", min: "0", step: "1", "aria-label": "r" });
+  const count = tile("Result");
+  const stats = el("div", { class: "mvb-stats" }, count);
+  const formulaRow = el("span", { class: "mvb-kv__v" }, "-");
+  const kv = el(
+    "div",
+    { class: "mvb-kv" },
+    el("div", { class: "mvb-kv__row" }, el("span", { class: "mvb-kv__k" }, "Formula"), formulaRow)
+  );
+  const error = notice("error");
+  let mode = "npr";
+  let text = "";
+
+  function permutations(n, r) {
+    let value = 1;
+    for (let i = 0; i < r; i++) value *= n - i;
+    return value;
+  }
+
+  function run() {
+    error.write("");
+    const n = Number(nInput.value);
+    const r = Number(rInput.value);
+    if (nInput.value.trim() === "" || rInput.value.trim() === "" || !Number.isInteger(n) || !Number.isInteger(r)) {
+      count.set("-");
+      formulaRow.textContent = "-";
+      text = "";
+      return;
+    }
+    if (n < 0 || r < 0) {
+      count.set("-");
+      formulaRow.textContent = "-";
+      text = "";
+      error.write("n and r must be zero or more.");
+      return;
+    }
+    if (r > n) {
+      count.set("-");
+      formulaRow.textContent = "-";
+      text = "";
+      error.write("r cannot be larger than n.");
+      return;
+    }
+    const base = permutations(n, r);
+    const value = mode === "npr" ? base : base / permutations(r, r);
+    if (!Number.isFinite(value) || value > Number.MAX_SAFE_INTEGER) {
+      count.set("-");
+      formulaRow.textContent = "-";
+      text = "";
+      error.write("That result is too large to show exactly.");
+      return;
+    }
+    const rounded = Math.round(value);
+    count.set(fmt(rounded));
+    formulaRow.textContent = mode === "npr" ? "n! / (n - r)!" : "n! / (r! (n - r)!)";
+    text = `${mode === "npr" ? "P" : "C"}(${n}, ${r}) = ${fmt(rounded)}`;
+  }
+
+  const chips = chipRow(
+    [
+      { value: "npr", label: "Permutation nPr" },
+      { value: "ncr", label: "Combination nCr" },
+    ],
+    {
+      value: mode,
+      label: "Mode",
+      onChange: (value) => {
+        mode = value;
+        run();
+      },
+    }
+  );
+
+  nInput.addEventListener("input", run);
+  rInput.addEventListener("input", run);
+
+  const card = toolcard({
+    body: bench(
+      stack(panel("n", nInput), panel("r", rInput), panel("Mode", chips), error),
+      stack(stats, panel("Working", kv))
+    ),
+    foot: actions(copyButton(() => text, "Copy result", "fill")),
+  });
+  slot.append(card.node);
+  run();
+
+  return {};
+}
+
+export default { mount };

package/mevebu/libs/js/tools/prefix-suffix.js

@@ -0,0 +1,46 @@
+// Adds a prefix, a suffix, or automatic numbering to every line.
+import { bench, stack, panel, textArea, textInput, checkbox, copyButton, actions, toolcard } from "../core.js";
+
+export function mount(slot) {
+  const source = textArea({ rows: 11, "aria-label": "Text", placeholder: "Paste your list, one entry per line" });
+  const prefixField = textInput({ placeholder: "Prefix", "aria-label": "Prefix" });
+  const suffixField = textInput({ placeholder: "Suffix", "aria-label": "Suffix" });
+  const numbering = checkbox("Numbering", { checked: false });
+  const result = textArea({ rows: 11, readonly: true, class: "mvb-in mvb-in--area mvb-in--mono", "aria-label": "Result" });
+
+  function run() {
+    const text = source.value;
+    if (!text) { result.value = ""; return; }
+    const prefix = prefixField.value;
+    const suffix = suffixField.value;
+    const numbered = numbering.input.checked;
+    result.value = text
+      .split("\n")
+      .map((line, index) => `${numbered ? `${index + 1}. ` : ""}${prefix}${line}${suffix}`)
+      .join("\n");
+  }
+
+  source.addEventListener("input", run);
+  prefixField.addEventListener("input", run);
+  suffixField.addEventListener("input", run);
+  numbering.input.addEventListener("change", run);
+
+  const card = toolcard({
+    body: bench(
+      stack(
+        panel("Text", source),
+        panel("Prefix", prefixField),
+        panel("Suffix", suffixField),
+        numbering
+      ),
+      stack(panel("Result", result))
+    ),
+    foot: actions(copyButton(() => result.value, "Copy result", "fill")),
+  });
+  slot.append(card.node);
+  run();
+
+  return {};
+}
+
+export default { mount };

package/mevebu/libs/js/tools/priority-matrix.js

@@ -0,0 +1,100 @@
+// Sorts tasks into four boxes by urgency and importance.
+import { el, toast, bench, stack, row, panel, textInput, selectInput, button, copyButton, actions, toolcard, readPin, writePin } from "../core.js";
+
+const uid = () => Date.now().toString(36) + Math.random().toString(36).slice(2, 7);
+const QUADRANTS = [
+  { id: "do", name: "Do now" },
+  { id: "schedule", name: "Schedule" },
+  { id: "delegate", name: "Delegate" },
+  { id: "drop", name: "Drop" },
+];
+
+export function mount(slot) {
+  const PIN = "priority-matrix";
+  const saved = readPin(PIN, []);
+  let list = Array.isArray(saved) ? saved : [];
+
+  const task = textInput({ placeholder: "Task", "aria-label": "Task" });
+  const quadrant = selectInput(QUADRANTS.map((q) => ({ value: q.id, label: q.name })), {
+    value: "do",
+    "aria-label": "Quadrant",
+  });
+
+  const matrix = stack();
+
+  const addButton = button("Add", { icon: "plus", kind: "fill" });
+  const copyMatrix = copyButton(() => matrixText(), "Copy matrix");
+
+  const save = () => writePin(PIN, list);
+
+  function matrixText() {
+    return QUADRANTS.map((q) => {
+      const items = list.filter((item) => item.q === q.id);
+      const lines = items.map((item) => `- ${item.text}`);
+      return lines.length ? `${q.name}\n${lines.join("\n")}` : q.name;
+    }).join("\n\n");
+  }
+
+  function taskRow(item) {
+    const text = el("span", {}, item.text);
+    const move = selectInput(QUADRANTS.map((q) => ({ value: q.id, label: q.name })), {
+      value: item.q,
+      "aria-label": `Move ${item.text}`,
+    });
+    move.addEventListener("change", () => {
+      item.q = move.value;
+      save();
+      render();
+    });
+    const remove = button("", { icon: "trash", "aria-label": `Remove ${item.text}` });
+    remove.addEventListener("click", () => {
+      list = list.filter((entry) => entry.id !== item.id);
+      save();
+      render();
+    });
+    return el("div", { class: "mvb-row" }, text, move, remove);
+  }
+
+  function quadrantBox(q) {
+    const items = list.filter((item) => item.q === q.id);
+    const body = items.length ? stack(...items.map(taskRow)) : el("span", { class: "mvb-note" }, "Empty");
+    return panel(`${q.name} (${items.length})`, body);
+  }
+
+  function render() {
+    matrix.replaceChildren(
+      row(quadrantBox(QUADRANTS[0]), quadrantBox(QUADRANTS[1])),
+      row(quadrantBox(QUADRANTS[2]), quadrantBox(QUADRANTS[3]))
+    );
+    copyMatrix.disabled = list.length === 0;
+  }
+
+  function add() {
+    const text = task.value.trim();
+    if (!text) return toast("Type a task first");
+    list.push({ id: uid(), text, q: quadrant.value });
+    task.value = "";
+    task.focus();
+    save();
+    render();
+  }
+
+  task.addEventListener("keydown", (event) => {
+    if (event.key === "Enter") add();
+  });
+  addButton.addEventListener("click", add);
+
+  const card = toolcard({
+    body: bench(
+      stack(panel("Task", task), panel("Quadrant", quadrant)),
+      matrix
+    ),
+    foot: actions(copyMatrix, addButton),
+  });
+  slot.append(card.node);
+  render();
+
+  return {};
+}
+
+export default { mount };

package/mevebu/libs/js/tools/profit-margin.js

@@ -0,0 +1,69 @@
+// Profit, margin and markup from a cost and a selling price.
+import { el, bench, stack, panel, numberInput, notice, copyButton, actions, toolcard } from "../core.js";
+
+function fmt(n) {
+  return n.toLocaleString(undefined, { maximumFractionDigits: 2 });
+}
+
+function tile(label) {
+  const value = el("span", { class: "mvb-stat__v" }, "-");
+  const node = el("div", { class: "mvb-stat" }, value, el("span", { class: "mvb-stat__k" }, label));
+  node.set = (text) => { value.textContent = text; };
+  return node;
+}
+
+export function mount(slot) {
+  const cost = numberInput({ value: "40", "aria-label": "Cost" });
+  const price = numberInput({ value: "100", "aria-label": "Selling price" });
+  const profit = tile("Profit");
+  const margin = tile("Margin");
+  const markup = tile("Markup");
+  const stats = el("div", { class: "mvb-stats" }, profit, margin, markup);
+  const error = notice("error");
+  let text = "";
+
+  function clear() {
+    profit.set("-");
+    margin.set("-");
+    markup.set("-");
+    text = "";
+  }
+
+  function run() {
+    error.write("");
+    const c = Number(cost.value);
+    const p = Number(price.value);
+    if (cost.value.trim() === "" || price.value.trim() === "" || !Number.isFinite(c) || !Number.isFinite(p)) {
+      clear();
+      return;
+    }
+    if (c < 0 || p < 0) {
+      clear();
+      error.write("The cost and price cannot be negative.");
+      return;
+    }
+    const gain = p - c;
+    profit.set(fmt(gain));
+    margin.set(p === 0 ? "-" : `${fmt((gain / p) * 100)}%`);
+    markup.set(c === 0 ? "-" : `${fmt((gain / c) * 100)}%`);
+    text = `Profit ${fmt(gain)}, margin ${p === 0 ? "n/a" : `${fmt((gain / p) * 100)}%`}, markup ${c === 0 ? "n/a" : `${fmt((gain / c) * 100)}%`}`;
+    if (p === 0 || c === 0) error.write("Margin needs a price and markup needs a cost above zero.");
+  }
+
+  cost.addEventListener("input", run);
+  price.addEventListener("input", run);
+
+  const card = toolcard({
+    body: bench(
+      stack(panel("Cost", cost), panel("Selling price", price), error),
+      stack(stats)
+    ),
+    foot: actions(copyButton(() => text, "Copy result", "fill")),
+  });
+  slot.append(card.node);
+  run();
+
+  return {};
+}
+
+export default { mount };

package/mevebu/libs/js/tools/quadratic-solver.js

@@ -0,0 +1,93 @@
+// Solves a quadratic equation and labels the discriminant and the roots.
+import { el, bench, stack, panel, numberInput, notice, copyButton, actions, toolcard } from "../core.js";
+
+function fmt(n) {
+  return n.toLocaleString(undefined, { maximumFractionDigits: 6 });
+}
+
+const kvRow = (key, value) =>
+  el("div", { class: "mvb-kv__row" }, el("span", { class: "mvb-kv__k" }, key), el("span", { class: "mvb-kv__v" }, value));
+
+export function mount(slot) {
+  const a = numberInput({ value: "1", "aria-label": "Coefficient a" });
+  const b = numberInput({ value: "-3", "aria-label": "Coefficient b" });
+  const c = numberInput({ value: "2", "aria-label": "Coefficient c" });
+  const discriminant = el("span", { class: "mvb-kv__v" }, "-");
+  const root1 = el("span", { class: "mvb-kv__v" }, "-");
+  const root2 = el("span", { class: "mvb-kv__v" }, "-");
+  const nature = el("span", { class: "mvb-kv__v" }, "-");
+  const kv = el(
+    "div",
+    { class: "mvb-kv" },
+    kvRow("Discriminant", discriminant),
+    kvRow("Root 1", root1),
+    kvRow("Root 2", root2),
+    kvRow("Nature", nature)
+  );
+  const error = notice("error");
+  let text = "";
+
+  function clear() {
+    discriminant.textContent = "-";
+    root1.textContent = "-";
+    root2.textContent = "-";
+    nature.textContent = "-";
+    text = "";
+  }
+
+  function run() {
+    error.write("");
+    const A = Number(a.value);
+    const B = Number(b.value);
+    const C = Number(c.value);
+    if ([a, b, c].some((input) => input.value.trim() === "") || ![A, B, C].every(Number.isFinite)) {
+      clear();
+      return;
+    }
+    if (A === 0) {
+      clear();
+      error.write("The coefficient a cannot be zero, that is not a quadratic.");
+      return;
+    }
+    const disc = B * B - 4 * A * C;
+    discriminant.textContent = fmt(disc);
+    if (disc > 0) {
+      const root = Math.sqrt(disc);
+      const r1 = (-B + root) / (2 * A);
+      const r2 = (-B - root) / (2 * A);
+      root1.textContent = fmt(r1);
+      root2.textContent = fmt(r2);
+      nature.textContent = "Two real roots";
+      text = `Roots ${fmt(r1)} and ${fmt(r2)}, discriminant ${fmt(disc)}`;
+    } else if (disc === 0) {
+      const r = -B / (2 * A);
+      root1.textContent = fmt(r);
+      root2.textContent = fmt(r);
+      nature.textContent = "One real root";
+      text = `Root ${fmt(r)}, discriminant 0`;
+    } else {
+      const real = -B / (2 * A);
+      const imag = Math.sqrt(-disc) / (2 * A);
+      root1.textContent = `${fmt(real)} + ${fmt(Math.abs(imag))}i`;
+      root2.textContent = `${fmt(real)} - ${fmt(Math.abs(imag))}i`;
+      nature.textContent = "Two complex roots";
+      text = `Roots ${fmt(real)} + ${fmt(Math.abs(imag))}i and ${fmt(real)} - ${fmt(Math.abs(imag))}i, discriminant ${fmt(disc)}`;
+    }
+  }
+
+  for (const input of [a, b, c]) input.addEventListener("input", run);
+
+  const card = toolcard({
+    body: bench(
+      stack(panel("a", a), panel("b", b), panel("c", c), error),
+      stack(panel("Solution", kv))
+    ),
+    foot: actions(copyButton(() => text, "Copy roots", "fill")),
+  });
+  slot.append(card.node);
+  run();
+
+  return {};
+}
+
+export default { mount };

package/mevebu/libs/js/tools/query-builder.js

@@ -0,0 +1,71 @@
+// Builds a query string from key=value lines and joins it to an optional base
+// URL.
+import { bench, stack, panel, textInput, textArea, checkbox, notice, output, copyButton, actions, toolcard } from "../core.js";
+
+const isUrl = (value) => {
+  try {
+    new URL(value);
+    return true;
+  } catch {
+    return false;
+  }
+};
+
+export function mount(slot) {
+  const base = textInput({ value: "https://example.com/search", "aria-label": "Base URL" });
+  const params = textArea({ rows: 8, class: "mvb-in mvb-in--area mvb-in--mono", value: "q=hello world\npage=2", placeholder: "q=hello world\npage=2", "aria-label": "Parameters" });
+  const encode = checkbox("Encode values", { checked: true });
+  const result = output({ rows: 4 });
+  const error = notice("error");
+
+  function build() {
+    error.write("");
+    const pairs = params.value
+      .split(/\r?\n/)
+      .map((line) => line.trim())
+      .filter(Boolean)
+      .map((line) => {
+        const at = line.indexOf("=");
+        return at === -1 ? [line, ""] : [line.slice(0, at), line.slice(at + 1)];
+      });
+
+    let query;
+    if (encode.input.checked) {
+      const search = new URLSearchParams();
+      for (const [key, value] of pairs) search.append(key, value);
+      query = search.toString();
+    } else {
+      query = pairs.map(([key, value]) => (value === "" ? key : `${key}=${value}`)).join("&");
+    }
+
+    const site = base.value.trim();
+    let out = query;
+    if (site) {
+      if (!isUrl(site)) {
+        error.write("The base URL is not valid.");
+      } else {
+        const separator = site.includes("?") ? (site.endsWith("?") || site.endsWith("&") ? "" : "&") : "?";
+        out = query ? `${site}${separator}${query}` : site;
+      }
+    }
+    result.write(out);
+  }
+
+  base.addEventListener("input", build);
+  params.addEventListener("input", build);
+  encode.input.addEventListener("change", build);
+
+  const card = toolcard({
+    body: bench(
+      stack(panel("Base URL", base), panel("Parameters", params), encode, error),
+      stack(panel("URL", result))
+    ),
+    foot: actions(copyButton(() => result.textContent, "Copy URL", "fill")),
+  });
+  slot.append(card.node);
+  build();
+
+  return {};
+}
+
+export default { mount };

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

@@ -0,0 +1,70 @@
+// Lays out pasted questions and options, and separates the answer key.
+import { bench, stack, panel, textArea, notice, copyButton, actions, toolcard } from "../core.js";
+
+const OPTION = /^[-*]\s+/;
+const LETTERS = "ABCDEFGHIJ";
+
+function parse(text) {
+  const out = [];
+  for (const block of text.split(/\n\s*\n/)) {
+    const lines = block.split("\n").map((line) => line.trim()).filter(Boolean);
+    if (!lines.length) continue;
+    const question = lines.find((line) => !OPTION.test(line));
+    if (!question) continue;
+    const options = lines
+      .filter((line) => OPTION.test(line))
+      .map((line) => ({ text: line.replace(OPTION, ""), correct: line.startsWith("*") }));
+    out.push({ question: question.replace(/^\d+[.)]\s*/, ""), options });
+  }
+  return out;
+}
+
+export function mount(slot) {
+  const source = textArea({
+    rows: 14,
+    "aria-label": "Questions",
+    placeholder: "Question one\n- First option\n- Second option\n* The correct option\n\nQuestion two\n- ...",
+  });
+  const quiz = textArea({ rows: 12, readonly: true, class: "mvb-in mvb-in--area mvb-in--mono", "aria-label": "Quiz" });
+  const key = textArea({ rows: 12, readonly: true, class: "mvb-in mvb-in--area mvb-in--mono", "aria-label": "Answer key" });
+  const error = notice("error");
+
+  function render() {
+    const items = source.value.trim() ? parse(source.value) : [];
+    if (!items.length) {
+      quiz.value = "";
+      key.value = "";
+      error.write(source.value.trim() ? "No questions found. Put the question on the first line and start each option with - or *." : "");
+      return;
+    }
+    error.write("");
+    quiz.value = items.map((item, i) => {
+      const head = `${i + 1}. ${item.question}`;
+      const body = item.options.map((option, j) => `   ${LETTERS[j] || "?"}. ${option.text}`);
+      return [head, ...body].join("\n");
+    }).join("\n\n");
+    key.value = items.map((item, i) => {
+      const at = item.options.findIndex((option) => option.correct);
+      return `${i + 1}. ${at >= 0 ? LETTERS[at] : "-"}`;
+    }).join("\n");
+  }
+
+  source.addEventListener("input", render);
+
+  const card = toolcard({
+    body: bench(
+      stack(panel("Questions", source), error),
+      stack(panel("Quiz", quiz), panel("Answer key", key))
+    ),
+    foot: actions(
+      copyButton(() => key.value, "Copy key"),
+      copyButton(() => quiz.value, "Copy quiz", "fill")
+    ),
+  });
+  slot.append(card.node);
+  render();
+
+  return {};
+}
+
+export default { mount };

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

@@ -0,0 +1,77 @@
+// Formats a direct or indirect quotation with its citation.
+import { bench, stack, panel, textArea, textInput, selectInput, output, notice, copyButton, actions, toolcard } from "../core.js";
+
+const MODES = [
+  { value: "direct", label: "Direct quote" },
+  { value: "paraphrase", label: "Paraphrase" },
+];
+
+const parts = (raw) => raw.split(";").map((item) => item.trim()).filter(Boolean);
+const surname = (author) => author.split(",")[0].trim();
+const countWords = (text) => (text.trim() ? text.trim().split(/\s+/).length : 0);
+
+function inText(raw, year, page) {
+  const list = parts(raw);
+  const y = year.trim();
+  const p = page.trim();
+  let who = "";
+  if (list.length === 1) who = surname(list[0]);
+  else if (list.length === 2) who = `${surname(list[0])} & ${surname(list[1])}`;
+  else if (list.length > 2) who = `${surname(list[0])} et al.`;
+  return `(${[who, y, p ? `p. ${p}` : ""].filter(Boolean).join(", ")})`;
+}
+
+export function mount(slot) {
+  const quote = textArea({ rows: 8, "aria-label": "Quotation", placeholder: "Paste the quoted text" });
+  const authors = textInput({ placeholder: "Smith, J. A.; Doe, B.", "aria-label": "Authors" });
+  const year = textInput({ placeholder: "2020", "aria-label": "Year" });
+  const page = textInput({ placeholder: "5", "aria-label": "Page" });
+  const mode = selectInput(MODES, { value: "direct", "aria-label": "Mode" });
+
+  const result = output({ rows: 10 });
+  const note = notice("note");
+  note.write("Check your institution's rules for block quotes and page numbers.");
+  let text = "";
+
+  function build() {
+    const body = quote.value.trim();
+    if (!body) {
+      text = "";
+      result.write("");
+      return;
+    }
+    const cite = inText(authors.value, year.value, page.value);
+    if (mode.value === "paraphrase") {
+      text = `${body} ${cite}`.trim();
+    } else if (countWords(body) >= 40) {
+      text = `${body}\n\n${cite}`.trim();
+    } else {
+      text = `"${body}" ${cite}`.trim();
+    }
+    result.write(text);
+  }
+
+  for (const input of [quote, authors, year, page]) input.addEventListener("input", build);
+  mode.addEventListener("change", build);
+
+  const card = toolcard({
+    body: bench(
+      stack(
+        panel("Quotation", quote),
+        panel("Authors", authors),
+        panel("Year", year),
+        panel("Page", page),
+        panel("Mode", mode),
+        note
+      ),
+      stack(panel("Formatted", result))
+    ),
+    foot: actions(copyButton(() => text, "Copy quote", "fill")),
+  });
+  slot.append(card.node);
+  build();
+
+  return {};
+}
+
+export default { mount };