@studious-lms/server 1.27.0 → 1.28.0

package/dist/pipelines/generateVisualization.js

@@ -0,0 +1,79 @@
+/**
+ * Newton visualisation generator: turns a teacher's description into a
+ * self-contained interactive HTML document (sliders, canvas/SVG, labels)
+ * that the frontend renders inside a sandboxed iframe.
+ */
+
+!function(){try{var e="undefined"!=typeof window?window:"undefined"!=typeof global?global:"undefined"!=typeof globalThis?globalThis:"undefined"!=typeof self?self:{},n=(new e.Error).stack;n&&(e._sentryDebugIds=e._sentryDebugIds||{},e._sentryDebugIds[n]="a40fb646-920a-50d5-8ec6-c7d4ba47bcd5")}catch(e){}}();
+import { z } from "zod";
+import { inference } from "../utils/inference.js";
+export const VISUALIZATION_MODEL = "gpt-5-mini";
+export const MAX_VISUALIZATION_HTML_LENGTH = 200000;
+export const generatedVisualizationSchema = z.object({
+    title: z
+        .string()
+        .describe("Short student-facing title, at most 80 characters."),
+    html: z
+        .string()
+        .describe("A complete, self-contained HTML document starting with <!DOCTYPE html>."),
+});
+export const VISUALIZATION_SYSTEM_PROMPT = `You are Newton, the teaching assistant inside the Studious LMS.
+A teacher wants an interactive visualisation to attach to a lesson for students.
+
+Return ONE complete, self-contained HTML document:
+- All CSS in a <style> tag and all JavaScript in inline <script> tags. No external scripts, stylesheets, fonts, images or network requests (no fetch, XMLHttpRequest, WebSocket, import()). It runs in a sandboxed iframe with no network access.
+- No localStorage, sessionStorage, cookies, alert, prompt or confirm.
+- Use <canvas> or inline <svg> for the visual. Give students real controls (sliders, toggles, buttons, draggable points) that update the visual live, and show the key values numerically next to each control.
+- Label axes, units and important quantities. Include a one-sentence instruction at the top telling students what to explore.
+- Responsive: fill the viewport width, work from 320px to 1200px wide, no horizontal scroll. Use a clean neutral look with system-ui font and support prefers-color-scheme: dark.
+- The science/maths must be correct. Prefer accurate formulas over approximations, and clamp inputs to physically sensible ranges.
+- Keep it focused on what the teacher asked for; no quizzes, scoring or chat.`;
+function classContext(options) {
+    const parts = [
+        options.subject ? `Subject: ${options.subject}` : null,
+        options.className ? `Class: ${options.className}` : null,
+    ].filter(Boolean);
+    return parts.length ? `${parts.join("\n")}\n\n` : "";
+}
+function assertValidHtml(result) {
+    if (!result?.html || !/<html[\s>]/i.test(result.html)) {
+        throw new Error("Newton did not return an HTML document");
+    }
+    if (result.html.length > MAX_VISUALIZATION_HTML_LENGTH) {
+        throw new Error("Generated visualisation is too large");
+    }
+    return {
+        title: result.title.trim().slice(0, 120) || "Visualisation",
+        html: result.html,
+    };
+}
+export async function generateVisualization(prompt, options = {}) {
+    const result = await inference([
+        { role: "system", content: VISUALIZATION_SYSTEM_PROMPT },
+        {
+            role: "user",
+            content: `${classContext(options)}Teacher request:\n${prompt}`,
+        },
+    ], generatedVisualizationSchema, {
+        reason: "visualization.generate",
+        model: VISUALIZATION_MODEL,
+        attribution: options.attribution,
+    });
+    return assertValidHtml(result);
+}
+export async function reviseVisualization(current, instruction, options = {}) {
+    const result = await inference([
+        { role: "system", content: VISUALIZATION_SYSTEM_PROMPT },
+        {
+            role: "user",
+            content: `${classContext(options)}Current visualisation "${current.title}":\n\n${current.html}\n\nRevise it as the teacher asks, keeping everything else working. Return the full updated document.\n\nTeacher request:\n${instruction}`,
+        },
+    ], generatedVisualizationSchema, {
+        reason: "visualization.revise",
+        model: VISUALIZATION_MODEL,
+        attribution: options.attribution,
+    });
+    return assertValidHtml(result);
+}
+//# sourceMappingURL=generateVisualization.js.map
+//# debugId=a40fb646-920a-50d5-8ec6-c7d4ba47bcd5

package/dist/pipelines/generateVisualization.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"generateVisualization.js","sources":["pipelines/generateVisualization.ts"],"sourceRoot":"/","sourcesContent":["/**\n * Newton visualisation generator: turns a teacher's description into a\n * self-contained interactive HTML document (sliders, canvas/SVG, labels)\n * that the frontend renders inside a sandboxed iframe.\n */\nimport { z } from \"zod\";\nimport { inference, type AiUsageAttribution } from \"../utils/inference.js\";\n\nexport const VISUALIZATION_MODEL = \"gpt-5-mini\";\nexport const MAX_VISUALIZATION_HTML_LENGTH = 200_000;\n\nexport const generatedVisualizationSchema = z.object({\n  title: z\n    .string()\n    .describe(\"Short student-facing title, at most 80 characters.\"),\n  html: z\n    .string()\n    .describe(\n      \"A complete, self-contained HTML document starting with <!DOCTYPE html>.\",\n    ),\n});\n\nexport type GeneratedVisualization = z.infer<typeof generatedVisualizationSchema>;\n\nexport const VISUALIZATION_SYSTEM_PROMPT = `You are Newton, the teaching assistant inside the Studious LMS.\nA teacher wants an interactive visualisation to attach to a lesson for students.\n\nReturn ONE complete, self-contained HTML document:\n- All CSS in a <style> tag and all JavaScript in inline <script> tags. No external scripts, stylesheets, fonts, images or network requests (no fetch, XMLHttpRequest, WebSocket, import()). It runs in a sandboxed iframe with no network access.\n- No localStorage, sessionStorage, cookies, alert, prompt or confirm.\n- Use <canvas> or inline <svg> for the visual. Give students real controls (sliders, toggles, buttons, draggable points) that update the visual live, and show the key values numerically next to each control.\n- Label axes, units and important quantities. Include a one-sentence instruction at the top telling students what to explore.\n- Responsive: fill the viewport width, work from 320px to 1200px wide, no horizontal scroll. Use a clean neutral look with system-ui font and support prefers-color-scheme: dark.\n- The science/maths must be correct. Prefer accurate formulas over approximations, and clamp inputs to physically sensible ranges.\n- Keep it focused on what the teacher asked for; no quizzes, scoring or chat.`;\n\ninterface GenerateOptions {\n  attribution?: AiUsageAttribution;\n  className?: string | null;\n  subject?: string | null;\n}\n\nfunction classContext(options: GenerateOptions) {\n  const parts = [\n    options.subject ? `Subject: ${options.subject}` : null,\n    options.className ? `Class: ${options.className}` : null,\n  ].filter(Boolean);\n  return parts.length ? `${parts.join(\"\\n\")}\\n\\n` : \"\";\n}\n\nfunction assertValidHtml(result: GeneratedVisualization | null | undefined) {\n  if (!result?.html || !/<html[\\s>]/i.test(result.html)) {\n    throw new Error(\"Newton did not return an HTML document\");\n  }\n  if (result.html.length > MAX_VISUALIZATION_HTML_LENGTH) {\n    throw new Error(\"Generated visualisation is too large\");\n  }\n  return {\n    title: result.title.trim().slice(0, 120) || \"Visualisation\",\n    html: result.html,\n  };\n}\n\nexport async function generateVisualization(\n  prompt: string,\n  options: GenerateOptions = {},\n): Promise<GeneratedVisualization> {\n  const result = await inference<GeneratedVisualization>(\n    [\n      { role: \"system\", content: VISUALIZATION_SYSTEM_PROMPT },\n      {\n        role: \"user\",\n        content: `${classContext(options)}Teacher request:\\n${prompt}`,\n      },\n    ],\n    generatedVisualizationSchema,\n    {\n      reason: \"visualization.generate\",\n      model: VISUALIZATION_MODEL,\n      attribution: options.attribution,\n    },\n  );\n  return assertValidHtml(result);\n}\n\nexport async function reviseVisualization(\n  current: { title: string; html: string },\n  instruction: string,\n  options: GenerateOptions = {},\n): Promise<GeneratedVisualization> {\n  const result = await inference<GeneratedVisualization>(\n    [\n      { role: \"system\", content: VISUALIZATION_SYSTEM_PROMPT },\n      {\n        role: \"user\",\n        content: `${classContext(options)}Current visualisation \"${current.title}\":\\n\\n${current.html}\\n\\nRevise it as the teacher asks, keeping everything else working. Return the full updated document.\\n\\nTeacher request:\\n${instruction}`,\n      },\n    ],\n    generatedVisualizationSchema,\n    {\n      reason: \"visualization.revise\",\n      model: VISUALIZATION_MODEL,\n      attribution: options.attribution,\n    },\n  );\n  return assertValidHtml(result);\n}\n"],"names":[],"mappings":"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","debug_id":"a40fb646-920a-50d5-8ec6-c7d4ba47bcd5"}