@lernapps/app-templates 0.0.1 → 0.1.0

package/dist/needs-BzEahJ6X.mjs

@@ -0,0 +1,97 @@
+// runtime/explainer/needs.ts
+/** The needs, in the order the start page shows them; their ids are a contract with every tutor. */
+const NEEDS = [
+	"kurze-schritte",
+	"wenig-lesen",
+	"mehr-tiefe",
+	"andere-muttersprache",
+	"klar-und-woertlich",
+	"rechnen-anschaulich"
+];
+/** The need whose choice also asks for the learner's first language. */
+const OTHER_LANGUAGE = "andere-muttersprache";
+/** The key of the choice among the learner's settings, for every explainer or for one app. */
+const NEEDS_KEY = "tutor-bedarf";
+const isNeed = (value) => NEEDS.some((need) => need === value);
+/** Whether a stored value is a choice of needs. */
+function isNeedsChoice(value) {
+	if (typeof value !== "object" || value === null) return false;
+	const { needs, language } = value;
+	return Array.isArray(needs) && needs.every(isNeed) && (language === void 0 || typeof language === "string");
+}
+/**
+* The first languages the start page offers, as language tags: the most common first languages of children in
+* German schools besides German, and German Sign Language (`gsg`).
+*/
+const LANGUAGES = [
+	"ar",
+	"bg",
+	"bs",
+	"en",
+	"fa",
+	"fr",
+	"gsg",
+	"el",
+	"it",
+	"hr",
+	"ku",
+	"pl",
+	"ps",
+	"pt",
+	"ro",
+	"ru",
+	"so",
+	"sq",
+	"sr",
+	"es",
+	"ti",
+	"tr",
+	"uk",
+	"vi",
+	"zh"
+];
+/** The names of the languages Intl does not know, in each language of the explainer. */
+const OWN_NAMES = {
+	de: { gsg: "Deutsche Gebärdensprache" },
+	en: { gsg: "German Sign Language" }
+};
+/** The name of the language `tag` in `lang`, "Türkisch" for `tr` in German; the tag itself if none is known. */
+function languageName(tag, lang) {
+	const own = OWN_NAMES[lang]?.[tag] ?? OWN_NAMES["de"]?.[tag];
+	if (own !== void 0) return own;
+	try {
+		const name = new Intl.DisplayNames([lang], {
+			type: "language",
+			fallback: "none"
+		}).of(tag);
+		return name === void 0 ? tag : name.charAt(0).toLocaleUpperCase(lang) + name.slice(1);
+	} catch {
+		return tag;
+	}
+}
+/** The query parameter of the needs, `bedarf=kurze-schritte,mehr-tiefe` in the order of NEEDS; "" for none. */
+function needsParameter(choice) {
+	const needs = NEEDS.filter((need) => choice?.needs.includes(need));
+	return needs.length === 0 ? "" : `bedarf=${needs.join(",")}`;
+}
+/** The query `query` (with its "?" or "") with the needs of `choice` added. */
+function withNeeds(query, choice) {
+	const needs = needsParameter(choice);
+	if (needs === "") return query;
+	return query === "" ? `?${needs}` : `${query}&${needs}`;
+}
+const FIRST_LANGUAGE = {
+	de: "Meine Muttersprache ist {language}.",
+	en: "My first language is {language}."
+};
+/**
+* The sentence the start prompt adds in the learner's voice when they chose `andere-muttersprache` with a language,
+* in `lang`: "Meine Muttersprache ist Türkisch."; "" otherwise.
+*/
+function languageSentence(choice, lang) {
+	if (choice?.language === void 0 || !choice.needs.includes("andere-muttersprache")) return "";
+	return (FIRST_LANGUAGE[lang] ?? FIRST_LANGUAGE["de"] ?? "").replace("{language}", languageName(choice.language, lang));
+}
+/** A prompt that starts a chat, with the sentence of the learner's first language after it when they chose one. */
+const withLanguage = (prompt, choice, lang) => [prompt, languageSentence(choice, lang)].filter((part) => part !== "").join("\n");
+export { isNeedsChoice as a, withNeeds as c, OTHER_LANGUAGE as i, NEEDS as n, languageName as o, NEEDS_KEY as r, withLanguage as s, LANGUAGES as t };

package/dist/pages-9RaaomoO.mjs

@@ -0,0 +1,81 @@
+// runtime/shared/pages.ts
+/** The root of a language's tree, from the app's root: "" for German, "en/" for English. */
+const languageRoot = (lang) => lang === "de" ? "" : `${lang}/`;
+/** A relative URL from the page at `from` to `to` (both from the app's root). */
+function relative(from, to) {
+	const url = `${"../".repeat(from.split("/").filter((part) => part !== "").length)}${to}`;
+	return url === "" ? "./" : url.startsWith("#") ? `./${url}` : url;
+}
+/** The built shell's relative URLs (./assets/…, built by Vite with base "./"), from a page at `path`. */
+function fromDepth(html, path) {
+	const up = "../".repeat(path.split("/").filter((part) => part !== "").length);
+	return html.replace(/((?:src|href)=")\.\/(?!\/)/g, `$1${up === "" ? "./" : up}`);
+}
+/** The page with `lang` as the language of its <html>, in place of the one it had. */
+const withLanguage = (html, lang) => html.replace(/<html([^>]*?)\slang="[^"]*"/, "<html$1").replace("<html", `<html lang="${lang}"`);
+/** An alternate link to the page in each of its languages, for <head>. */
+const alternateLinks = ({ path, local, languages }) => languages.map((lang) => `<link rel="alternate" hreflang="${lang}" href="${relative(path, languageRoot(lang) + local)}" />`);
+/**
+* The header of a page in `lang`: the language switch, a link to the page in each language, named in its own
+* language, the current one marked; nothing while the app has one language. `label` and `name` give HTML, already
+* escaped.
+*/
+function pageHeader(page) {
+	const { path, local, languages, lang: current, label, name } = page;
+	if (languages.length < 2) return "";
+	return `<header class="page-header"><nav class="page-languages" aria-label="${label}"><ul>${languages.map((lang) => `<li><a href="${relative(path, languageRoot(lang) + local)}" hreflang="${lang}" lang="${lang}"${lang === current ? " aria-current=\"page\"" : ""}>${name(lang)}</a></li>`).join("")}</ul></nav></header>`;
+}
+/** The footer of a page: what the app is, and the links to the imprint and the privacy statement; texts as HTML, already escaped. */
+const pageFooter = (words) => `<footer class="page-footer"><p>${words.footer} · <a href="https://lernapps.net/imprint/">${words.imprint}</a> · <a href="https://lernapps.net/privacy/">${words.privacy}</a></p></footer>`;
+/**
+* The page for every address the app does not have, 404.html at the bundle's root: GitHub Pages serves it for any
+* missing path below the site, at that path, so the page cannot know its own depth, and relative links in it would
+* point below the missing path. Its script finds the app's root instead: from the missing path's folder upwards, the
+* first folder whose 404.html exists (one HEAD request each, to the same server) is the root of the bundle that
+* answers there: the app at /<repo>/, a preview at /<repo>/pr-preview/pr-<n>/ (which has its own 404.html), or / when
+* served locally. It then moves on to that root's start page and points the link there. Without JavaScript the link
+* leads to the start page of the site. German, plain language, not indexed, nothing loaded from another server.
+*/
+function notFoundPage() {
+	return [
+		`<!doctype html>`,
+		`<html lang="de">`,
+		`  <head>`,
+		`    <meta charset="utf-8" />`,
+		`    <meta name="viewport" content="width=device-width, initial-scale=1" />`,
+		`    <meta name="robots" content="noindex" />`,
+		`    <title>Seite nicht gefunden</title>`,
+		`    <style>body { margin: 2rem auto; max-width: 40rem; padding: 0 1rem; font-family: system-ui, sans-serif; line-height: 1.5; color: #1a1a1a; background: #ffffff; } a { color: #1d4ed8; }</style>`,
+		`  </head>`,
+		`  <body>`,
+		`    <main>`,
+		`      <h1>Seite nicht gefunden</h1>`,
+		`      <p>Diese Seite gibt es nicht (mehr).</p>`,
+		`      <p id="weiter" hidden>Du wirst zur Startseite der App weitergeleitet.</p>`,
+		`      <p><a id="start" href="/">Zur Startseite</a></p>`,
+		`    </main>`,
+		`    <script>(async () => {
+  const link = document.getElementById("start");
+  let folder = location.pathname.slice(0, location.pathname.lastIndexOf("/") + 1);
+  for (;;) {
+    try {
+      const found = await fetch(folder + "404.html", { method: "HEAD", cache: "no-store" });
+      if (found.ok) break;
+    } catch {
+      return;
+    }
+    if (folder === "/") return;
+    folder = folder.slice(0, folder.lastIndexOf("/", folder.length - 2) + 1);
+  }
+  link.href = folder;
+  link.textContent = "Zur Startseite der App";
+  if (folder === location.pathname) return;
+  document.getElementById("weiter").hidden = false;
+  location.replace(folder);
+})();<\/script>`,
+		`  </body>`,
+		`</html>`,
+		``
+	].join("\n");
+}
+export { pageFooter as a, withLanguage as c, notFoundPage as i, fromDepth as n, pageHeader as o, languageRoot as r, relative as s, alternateLinks as t };

package/dist/questions-e2e.mjs

@@ -0,0 +1 @@
+export { t as answerQuestion, n as expectBackground, r as expectFeedbackInView, i as expectMaterial, a as giveAnswer, o as question } from "./e2e-BiMI-pCL.mjs";

package/dist/questions-engine.mjs

@@ -0,0 +1,3 @@
+import { g as questionId } from "./render-BJey0bwl.mjs";
+import { n as startQuestion, t as readAnswer } from "./engine-BqF2Vffn.mjs";
+export { questionId, readAnswer, startQuestion };

package/dist/questions.mjs

@@ -0,0 +1,6 @@
+import { C as wrongAnswer, S as shuffled, T as de_default, _ as questionIn, a as renderQuestion, b as rightAnswer, c as hash, d as materialPairs, f as missesRight, g as questionId, h as questionAddresses, i as questionMessagesIn, l as isComplete, m as parseNumber, n as answerText, o as renderSolution, p as mixed, s as QUESTION_TYPES, t as QUESTION_MESSAGES, u as isCorrect, v as questionTexts, w as wrongReasons, x as rightEntries, y as random } from "./render-BJey0bwl.mjs";
+import { c as questionSchema, l as questionSchemaProblems, n as QUESTION_REF, p as validateQuestion, r as QUESTION_SCHEMA_ID, s as questionDetails, u as questionSchemas } from "./validate-COaZso7u.mjs";
+// runtime/shared/questions/index.ts
+/** The texts of a question for learners in German, by their key (messages/de.json); questionMessagesIn(lang) for another. */
+const messages = de_default;
+export { QUESTION_MESSAGES, QUESTION_REF, QUESTION_SCHEMA_ID, QUESTION_TYPES, answerText, hash, isComplete, isCorrect, materialPairs, messages, missesRight, mixed, parseNumber, questionAddresses, questionDetails, questionId, questionIn, questionMessagesIn, questionSchema, questionSchemaProblems, questionSchemas, questionTexts, random, renderQuestion, renderSolution, rightAnswer, rightEntries, shuffled, validateQuestion, wrongAnswer, wrongReasons };

package/dist/quiz-BKc8JYtC.mjs

@@ -0,0 +1,70 @@
+import { i as inLanguage } from "./html-mffkHGHh.mjs";
+import { _ as questionIn } from "./render-BJey0bwl.mjs";
+// runtime/quiz/messages/de.json
+var de_default = {
+	howto: "Beantworte die Fragen der Reihe nach. Nach jeder Antwort siehst du, ob sie stimmt, und erfährst mehr über jede Antwort. Am Ende siehst du dein Ergebnis.",
+	noscript: "Ohne JavaScript kannst du alle Fragen lesen. Die Lösungen mit mehr Wissen zu jeder Antwort stehen am Ende der Seite.",
+	questions: "Fragen",
+	countLabel: "Wie viele Fragen möchtest du beantworten?",
+	countOf: "von {total}",
+	start: "Los geht’s",
+	progress: "Frage {current} von {total}",
+	toResult: "Zum Ergebnis",
+	result: "Ergebnis",
+	score: "Du hast {score} von {total} Fragen richtig beantwortet.",
+	last: "Beim letzten Mal waren es {score} von {total}.",
+	restart: "Noch einmal",
+	solutions: "Lösungen",
+	toQuestion: "Zur Frage",
+	footer: "Ein Quiz auf lernapps.net",
+	imprint: "Impressum",
+	privacy: "Datenschutz",
+	sources: "Quellen",
+	sourcesIntro: "Die Fakten in diesem Quiz stammen aus diesen Quellen:",
+	language: "Deutsch",
+	languages: "Sprache"
+};
+// runtime/quiz/messages/en.json
+var en_default = {
+	howto: "Answer the questions one by one. After each answer you see whether it is right and learn more about every answer. At the end you see your result.",
+	noscript: "Without JavaScript you can read all questions. The solutions, with more on every answer, are at the end of the page.",
+	questions: "Questions",
+	countLabel: "How many questions do you want to answer?",
+	countOf: "of {total}",
+	start: "Start",
+	progress: "Question {current} of {total}",
+	toResult: "To the result",
+	result: "Result",
+	score: "You answered {score} of {total} questions right.",
+	last: "Last time it was {score} of {total}.",
+	restart: "Again",
+	solutions: "Solutions",
+	toQuestion: "To the question",
+	footer: "A quiz on lernapps.net",
+	imprint: "Imprint",
+	privacy: "Privacy",
+	sources: "Sources",
+	sourcesIntro: "The facts in this quiz come from these sources:",
+	language: "English",
+	languages: "Language"
+};
+// runtime/quiz/quiz.ts
+/** The quiz's languages, German first. */
+const quizLanguages = (quiz) => quiz.languages ?? ["de"];
+/** The quiz in `lang`: each text from its map, a plain string as it is; everything else as it is. */
+function quizIn(quiz, lang) {
+	const { sources } = quiz;
+	return {
+		...quiz,
+		title: inLanguage(quiz.title, lang),
+		intro: inLanguage(quiz.intro, lang),
+		questions: quiz.questions.map((question) => questionIn(question, lang)),
+		...sources === void 0 ? {} : { sources: sources.map((source) => ({
+			...source,
+			title: inLanguage(source.title, lang)
+		})) }
+	};
+}
+/** The id of the element of the solution of a question, in the list of solutions. */
+const solutionId = (question) => `loesung-${question.id}`;
+export { de_default as a, en_default as i, quizLanguages as n, solutionId as r, quizIn as t };

package/dist/quiz-e2e.mjs

@@ -0,0 +1,174 @@
+import { C as wrongAnswer, b as rightAnswer, g as questionId } from "./render-BJey0bwl.mjs";
+import { i as expectMaterial, n as expectBackground, o as question, r as expectFeedbackInView, t as answerQuestion } from "./e2e-BiMI-pCL.mjs";
+import { n as quizLanguages, t as quizIn } from "./quiz-BKc8JYtC.mjs";
+import { n as messagesIn, t as QUIZ_MESSAGES } from "./render-DpRO_RKm.mjs";
+import { expect, test } from "playwright/test";
+import { readFileSync } from "node:fs";
+// runtime/quiz/e2e.ts
+const de = QUIZ_MESSAGES.de;
+/** The quiz's own texts in `lang`. */
+const messagesOf = messagesIn;
+/** The quiz's tests, for the question bank in `bank` (relative to the app's root). */
+function quizTests(bank = "src/quiz.json") {
+	const all = JSON.parse(readFileSync(bank, "utf8"));
+	const languages = quizLanguages(all);
+	const quiz = quizIn(all, "de");
+	test.describe("quiz", () => {
+		test.use({ reducedMotion: "reduce" });
+		for (const item of quiz.questions) {
+			test(`${item.id} (${item.type}): its link opens it and the right answer counts`, async ({ page }) => {
+				await page.goto(`./#${questionId(item)}`);
+				await expect(question(page, item)).toBeVisible();
+				await expect(page.locator(".question:visible")).toHaveCount(1);
+				await answerQuestion(page, item, rightAnswer(item));
+				await expect(question(page, item).locator(".question-feedback")).toContainText(de.right);
+				await expectFeedbackInView(page, item);
+				const next = question(page, item).locator(".question-next");
+				for (let tab = 0; tab < 30 && !await next.evaluate((button) => button === document.activeElement); tab++) await page.keyboard.press("Tab");
+				await expect(next).toBeFocused();
+				const reveal = question(page, item).locator(".question-reveal");
+				await expectBackground(reveal, item);
+				if (item.type === "single-choice" || item.type === "multiple-choice") {
+					const right = item.options.filter((option) => option.correct).length;
+					await expect(reveal.locator(".question-badge-right")).toHaveCount(right);
+					await expect(reveal.locator(".question-badge-right").first()).toHaveText(de.rightOption);
+				} else await expect(reveal).toContainText(de.rightAnswer);
+			});
+			if (item.material !== void 0) test(`${item.id} (${item.type}): what it shows is there, and its images load`, async ({ page }) => {
+				await page.goto(`./#${questionId(item)}`);
+				await expectMaterial(page, item);
+			});
+			test(`${item.id} (${item.type}): a wrong answer does not count`, async ({ page }) => {
+				await page.goto(`./#${questionId(item)}`);
+				await answerQuestion(page, item, wrongAnswer(item));
+				await expect(question(page, item).locator(".question-feedback")).toContainText(de.wrong);
+				await expectFeedbackInView(page, item);
+				await expectBackground(question(page, item).locator(".question-reveal"), item);
+				if (item.type === "single-choice" || item.type === "multiple-choice") await expect(question(page, item).locator(".question-badge-chosen").first()).toHaveText(de.yourChoice);
+			});
+		}
+		test("the seed in the address gives the order; without one, the address gets one", async ({ page }) => {
+			const everything = `&n=${quiz.questions.length}`;
+			const order = async (address) => {
+				await page.goto(address);
+				return page.locator(".question").evaluateAll((items) => items.map((item) => item.id).join());
+			};
+			const first = await order(`./?seed=11${everything}`);
+			expect(await order(`./?seed=11${everything}`)).toBe(first);
+			if (quiz.questions.length > 2) {
+				const others = [];
+				for (const seed of [
+					12,
+					13,
+					14,
+					15,
+					16
+				]) others.push(await order(`./?seed=${seed}${everything}`));
+				expect(others.some((other) => other !== first)).toBe(true);
+			}
+			await page.goto("./");
+			await expect.poll(() => new URL(page.url()).searchParams.get("seed")).toMatch(/^\d+$/);
+		});
+		test("all right answers give the full score, then the solutions show", async ({ page }) => {
+			await page.goto("./");
+			if (quiz.questions.length > 1) await page.locator(".quiz-start button").click();
+			expect(await page.evaluate(() => Object.keys(localStorage))).toEqual([]);
+			for (let step = 0; step < quiz.questions.length; step++) {
+				const id = await page.locator(".question:visible").getAttribute("data-id");
+				const item = quiz.questions.find((candidate) => candidate.id === id);
+				if (item === void 0) throw new Error(`no visible question at step ${step + 1}`);
+				await answerQuestion(page, item, rightAnswer(item));
+				await question(page, item).locator(".question-next").click();
+			}
+			const total = String(quiz.questions.length);
+			await expect(page.locator(".quiz-score")).toHaveText(de.score.replace("{score}", total).replace("{total}", total));
+			await expect(page.locator("#loesungen")).toBeVisible();
+			const stored = await page.evaluate(() => Object.keys(localStorage));
+			if (quiz.rememberLastResult === true) {
+				expect(stored).toHaveLength(1);
+				expect(stored[0]).toMatch(/^lernapps:.+:last-result$/);
+			} else expect(stored).toEqual([]);
+		});
+		if (quiz.questions.length > 1) test("the learner chooses how many questions to answer; the address keeps the choice", async ({ page }) => {
+			await page.goto("./?seed=11");
+			await expect(page.locator(".quiz-start")).toBeVisible();
+			await expect(page.locator(".question:visible")).toHaveCount(0);
+			const count = page.locator("#quiz-count");
+			await expect(count).toHaveValue(String(quiz.questions.length));
+			await expect(count).toHaveAttribute("max", String(quiz.questions.length));
+			await count.fill("1");
+			await page.locator(".quiz-start button").click();
+			await expect(page.locator(".quiz-start")).toBeHidden();
+			expect(new URL(page.url()).searchParams.get("n")).toBe("1");
+			await expect(page.locator(".question")).toHaveCount(1);
+			await expect(page.locator(".quiz-solution")).toHaveCount(1);
+			const id = await page.locator(".question:visible").getAttribute("data-id");
+			const item = quiz.questions.find((candidate) => candidate.id === id);
+			if (item === void 0) throw new Error("no visible question");
+			await answerQuestion(page, item, rightAnswer(item));
+			await question(page, item).locator(".question-next").click();
+			await expect(page.locator(".quiz-score")).toHaveText(de.score.replace("{score}", "1").replace("{total}", "1"));
+			await page.goto(page.url());
+			await expect(page.locator(".quiz-start")).toBeHidden();
+			await expect(page.locator(".question")).toHaveCount(1);
+			await expect(page.locator(".question")).toHaveAttribute("data-id", item.id);
+		});
+		test.describe("without JavaScript", () => {
+			test.use({ javaScriptEnabled: false });
+			test("every question and its solution can be read", async ({ page }) => {
+				await page.goto("./");
+				for (const item of quiz.questions) {
+					await expect(question(page, item).locator("legend")).toHaveText(item.text);
+					await expectMaterial(page, item, { loaded: false });
+					await expectBackground(page.locator(`#loesung-${item.id}`), item);
+				}
+			});
+		});
+		for (const lang of languages.slice(1)) {
+			const local = quizIn(all, lang);
+			const words = messagesOf(lang);
+			const address = `./${lang}/`;
+			test.describe(`in ${lang}`, () => {
+				test.describe("without JavaScript", () => {
+					test.use({ javaScriptEnabled: false });
+					test(`the page is in ${lang}, every question and its solution can be read, the switch leads to every language`, async ({ page }) => {
+						await page.goto(address);
+						await expect(page.locator("html")).toHaveAttribute("lang", lang);
+						await expect(page.locator("h1")).toHaveText(local.title);
+						await expect(page.locator("#loesungen h2")).toHaveText(words.solutions);
+						for (const item of local.questions) {
+							await expect(question(page, item).locator("legend")).toHaveText(item.text);
+							await expectMaterial(page, item, { loaded: false });
+							await expectBackground(page.locator(`#loesung-${item.id}`), item);
+						}
+						for (const other of languages) await expect(page.locator(`link[rel="alternate"][hreflang="${other}"]`)).toHaveCount(1);
+						for (const other of languages.filter((candidate) => candidate !== lang)) {
+							await page.goto(address);
+							await page.locator(`.page-languages a[hreflang="${other}"]`).click();
+							await expect(page.locator("html")).toHaveAttribute("lang", other);
+							await expect(page.locator("h1")).toHaveText(quizIn(all, other).title);
+							await expect(page.locator(".page-languages a[aria-current=\"page\"]")).toHaveAttribute("hreflang", other);
+						}
+					});
+				});
+				test(`what a question shows, in ${lang}`, async ({ page }) => {
+					const item = local.questions.find((candidate) => candidate.material !== void 0);
+					test.skip(item === void 0, "no question shows content");
+					if (item === void 0) return;
+					await page.goto(`${address}#${questionId(item)}`);
+					await expectMaterial(page, item);
+				});
+				test(`one question, answered in ${lang}`, async ({ page }) => {
+					const item = local.questions[0];
+					if (item === void 0) throw new Error("the quiz has no questions");
+					await page.goto(`${address}#${questionId(item)}`);
+					await expect(question(page, item)).toBeVisible();
+					await answerQuestion(page, item, rightAnswer(item), lang);
+					await expect(question(page, item).locator(".question-feedback")).toContainText(words.right);
+					await expectBackground(question(page, item).locator(".question-reveal"), item);
+				});
+			});
+		}
+	});
+}
+export { answerQuestion, expectBackground, expectFeedbackInView, expectMaterial, quizTests };