Fusion de main (leçons, 1g) dans plateau-soigne
Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
This commit is contained in:
Pierre MARTIN
Claude Opus 5.5
@@ -0,0 +1,184 @@
|
||||
// La progression dans les leçons (ADR 0011, étape 1g) : où en est chaque
|
||||
// leçon, et laquelle proposer ensuite. Code pur, testé sous Node
|
||||
// (app/tests/lessons.test.ts).
|
||||
//
|
||||
// Copyright (C) 2026 les auteurs d'Ustagammon.
|
||||
// Licence : GPLv3 ou ultérieure (voir LICENSE).
|
||||
//
|
||||
// Le contenu des leçons vit dans docs/lecons/ (ADR 0008) ; ici, une leçon
|
||||
// n'est que son numéro et les étapes qui portent un exercice « à vous ».
|
||||
// La progression est enregistrée telle quelle (ADR 0007, amendement du
|
||||
// 2026-11-12) : son format est durable, et readLessonProgress relit toute
|
||||
// version enregistrée.
|
||||
|
||||
/** Version du format de la progression enregistrée. */
|
||||
export const LESSON_PROGRESS_VERSION = 1;
|
||||
|
||||
/** reached quand l'écran de fin d'une leçon a été vu. */
|
||||
export const LESSON_END = 99;
|
||||
|
||||
/** Où en est une leçon. */
|
||||
export interface LessonRecord {
|
||||
/** La dernière étape vue (0 : aucune ; LESSON_END : la fin). */
|
||||
readonly last: number;
|
||||
/** L'étape la plus loin déjà vue : la barre de progression ne mène
|
||||
* qu'aux étapes vues. */
|
||||
readonly reached: number;
|
||||
/** Les étapes dont l'exercice « à vous » a été réussi, dans l'ordre. */
|
||||
readonly solved: readonly number[];
|
||||
}
|
||||
|
||||
/** La progression dans toutes les leçons, par numéro de leçon. */
|
||||
export interface LessonProgress {
|
||||
readonly version: typeof LESSON_PROGRESS_VERSION;
|
||||
readonly lessons: Readonly<Record<string, LessonRecord>>;
|
||||
}
|
||||
|
||||
export const NO_PROGRESS: LessonProgress = { version: LESSON_PROGRESS_VERSION, lessons: {} };
|
||||
|
||||
const NO_RECORD: LessonRecord = { last: 0, reached: 0, solved: [] };
|
||||
|
||||
/** Ce qu'une leçon offre à la progression : son numéro et les étapes qui
|
||||
* ont un exercice « à vous ». */
|
||||
export interface LessonOutline {
|
||||
readonly number: number;
|
||||
readonly exercises: readonly number[];
|
||||
}
|
||||
|
||||
function step(value: unknown): number | null {
|
||||
return typeof value === "number" && Number.isInteger(value) && value >= 0 && value <= LESSON_END
|
||||
? value
|
||||
: null;
|
||||
}
|
||||
|
||||
/**
|
||||
* La progression enregistrée, relue : absente (avant l'étape 1g) ou
|
||||
* illisible, elle est vide ; une leçon mal formée est oubliée, sans toucher
|
||||
* aux autres. Une version inconnue (enregistrée par une version future de
|
||||
* l'application) est lue comme vide plutôt que mal comprise.
|
||||
*/
|
||||
export function readLessonProgress(value: unknown): LessonProgress {
|
||||
if (value === null || typeof value !== "object") {
|
||||
return NO_PROGRESS;
|
||||
}
|
||||
const raw = value as { version?: unknown; lessons?: unknown };
|
||||
if (raw.version !== LESSON_PROGRESS_VERSION) {
|
||||
return NO_PROGRESS;
|
||||
}
|
||||
if (raw.lessons === null || typeof raw.lessons !== "object") {
|
||||
return NO_PROGRESS;
|
||||
}
|
||||
const lessons: Record<string, LessonRecord> = {};
|
||||
for (const [key, entry] of Object.entries(raw.lessons as Record<string, unknown>)) {
|
||||
if (!/^[1-9][0-9]?$/.test(key) || entry === null || typeof entry !== "object") {
|
||||
continue;
|
||||
}
|
||||
const record = entry as { last?: unknown; reached?: unknown; solved?: unknown };
|
||||
const last = step(record.last);
|
||||
const reached = step(record.reached);
|
||||
const solved = Array.isArray(record.solved)
|
||||
? record.solved.map(step).filter((s): s is number => s !== null && s > 0)
|
||||
: null;
|
||||
if (last === null || reached === null || solved === null) {
|
||||
continue;
|
||||
}
|
||||
lessons[key] = { last, reached, solved: [...new Set(solved)].sort((a, b) => a - b) };
|
||||
}
|
||||
return { version: LESSON_PROGRESS_VERSION, lessons };
|
||||
}
|
||||
|
||||
/** Où en est la leçon number (rien de fait si elle n'a jamais été ouverte). */
|
||||
export function lessonRecord(progress: LessonProgress, number: number): LessonRecord {
|
||||
return progress.lessons[String(number)] ?? NO_RECORD;
|
||||
}
|
||||
|
||||
function withRecord(
|
||||
progress: LessonProgress,
|
||||
number: number,
|
||||
change: (record: LessonRecord) => LessonRecord,
|
||||
): LessonProgress {
|
||||
return {
|
||||
version: LESSON_PROGRESS_VERSION,
|
||||
lessons: { ...progress.lessons, [String(number)]: change(lessonRecord(progress, number)) },
|
||||
};
|
||||
}
|
||||
|
||||
/** La progression après l'arrivée sur une étape d'une leçon (LESSON_END :
|
||||
* sa fin). */
|
||||
export function withVisit(progress: LessonProgress, number: number, at: number): LessonProgress {
|
||||
return withRecord(progress, number, (record) => ({
|
||||
...record,
|
||||
last: at,
|
||||
reached: Math.max(record.reached, at),
|
||||
}));
|
||||
}
|
||||
|
||||
/** La progression après la réussite de l'exercice d'une étape. */
|
||||
export function withSolved(progress: LessonProgress, number: number, at: number): LessonProgress {
|
||||
return withRecord(progress, number, (record) =>
|
||||
record.solved.includes(at)
|
||||
? record
|
||||
: { ...record, solved: [...record.solved, at].sort((a, b) => a - b) },
|
||||
);
|
||||
}
|
||||
|
||||
/** L'état d'une leçon, tel que l'affichent la liste et l'accueil : à
|
||||
* commencer, en cours (« 2 exercices sur 4 »), terminée (tous ses
|
||||
* exercices réussis). */
|
||||
export type LessonState =
|
||||
| { readonly kind: "toStart"; readonly total: number }
|
||||
| { readonly kind: "inProgress"; readonly solved: number; readonly total: number }
|
||||
| { readonly kind: "done"; readonly total: number };
|
||||
|
||||
export function lessonState(progress: LessonProgress, outline: LessonOutline): LessonState {
|
||||
const record = lessonRecord(progress, outline.number);
|
||||
const total = outline.exercises.length;
|
||||
const solved = outline.exercises.filter((s) => record.solved.includes(s)).length;
|
||||
if (solved === total && (total > 0 || record.reached === LESSON_END)) {
|
||||
return { kind: "done", total };
|
||||
}
|
||||
if (solved === 0 && record.reached === 0) {
|
||||
return { kind: "toStart", total };
|
||||
}
|
||||
return { kind: "inProgress", solved, total };
|
||||
}
|
||||
|
||||
/**
|
||||
* La leçon à proposer ensuite (carte de l'accueil, « Continuer » de la
|
||||
* liste) : la première en cours, sinon la première à commencer, sinon
|
||||
* aucune (toutes terminées). L'ordre est conseillé, jamais imposé.
|
||||
*/
|
||||
export function nextLesson(
|
||||
progress: LessonProgress,
|
||||
outlines: readonly LessonOutline[],
|
||||
): LessonOutline | null {
|
||||
const states = outlines.map((outline) => ({ outline, state: lessonState(progress, outline) }));
|
||||
return (
|
||||
states.find((s) => s.state.kind === "inProgress")?.outline ??
|
||||
states.find((s) => s.state.kind === "toStart")?.outline ??
|
||||
null
|
||||
);
|
||||
}
|
||||
|
||||
/**
|
||||
* L'étape où reprendre une leçon : là où on l'a quittée ; après sa fin, le
|
||||
* premier exercice pas encore réussi ; sinon le début.
|
||||
*/
|
||||
export function resumeStep(progress: LessonProgress, outline: LessonOutline): number {
|
||||
const record = lessonRecord(progress, outline.number);
|
||||
if (record.last > 0 && record.last < LESSON_END) {
|
||||
return record.last;
|
||||
}
|
||||
if (record.last === LESSON_END) {
|
||||
return outline.exercises.find((s) => !record.solved.includes(s)) ?? 1;
|
||||
}
|
||||
return 1;
|
||||
}
|
||||
|
||||
/** Le nombre de leçons terminées. */
|
||||
export function finishedLessons(
|
||||
progress: LessonProgress,
|
||||
outlines: readonly LessonOutline[],
|
||||
): number {
|
||||
return outlines.filter((outline) => lessonState(progress, outline).kind === "done").length;
|
||||
}
|
||||
+10
-2
@@ -65,7 +65,7 @@ const settings = createSettingsStore(localStorage ?? memoryStorage());
|
||||
// pendant que le moteur se charge : le plateau est dessiné sans les
|
||||
// attendre. L'écran de jeu ne s'en sert qu'une fois engineReady résolue.
|
||||
const opening = (async () => {
|
||||
const { library } = await openGameLibrary({
|
||||
const { library, lessons } = await openGameLibrary({
|
||||
indexedDB: attempt(() => window.indexedDB),
|
||||
localStorage,
|
||||
});
|
||||
@@ -76,7 +76,7 @@ const opening = (async () => {
|
||||
resume: (journal) => Game.resume(engine, journal),
|
||||
});
|
||||
const saved = await session.restore();
|
||||
return { library, session, saved };
|
||||
return { library, session, saved, lessons };
|
||||
})();
|
||||
let stored: Awaited<typeof opening> | null = null;
|
||||
/** Le stockage, ouvert (toujours le cas une fois engineReady résolue). */
|
||||
@@ -154,6 +154,14 @@ startApp({
|
||||
MovePractice.start(engine, position, roll, expected),
|
||||
shouldTake: (position) => shouldTake(engine, position),
|
||||
},
|
||||
// La progression dans les leçons (étape 1g), dans le stockage des
|
||||
// parties : lue une fois ouvert, enregistrée sans être attendue.
|
||||
lessons: {
|
||||
load: async () => (await opening).lessons.load(),
|
||||
save: (progress) => {
|
||||
void opening.then((opened) => opened.lessons.save(progress));
|
||||
},
|
||||
},
|
||||
// Hors ligne : le service worker met tout le site en cache. Le navigateur
|
||||
// le refuse hors https (sauf localhost) : l'application marche alors sans.
|
||||
// Il est enregistré une fois le moteur chargé : si le Worker et le service
|
||||
|
||||
@@ -59,6 +59,10 @@ export interface LibraryBackend {
|
||||
remove(id: string): Promise<void>;
|
||||
currentId(): Promise<string | undefined>;
|
||||
setCurrentId(id: string): Promise<void>;
|
||||
/** La progression dans les leçons (étape 1g), telle qu'enregistrée
|
||||
* (undefined : jamais enregistrée) ; relue par readLessonProgress. */
|
||||
lessonProgress(): Promise<unknown>;
|
||||
saveLessonProgress(progress: unknown): Promise<void>;
|
||||
}
|
||||
|
||||
export interface LibraryOptions {
|
||||
|
||||
@@ -6,7 +6,8 @@
|
||||
// Base « ustagammon », trois magasins d'objets :
|
||||
// - games : les résumés des parties (SavedGameSummary), clé id ;
|
||||
// - journals : leurs journaux, { id, journal }, clé id ;
|
||||
// - settings : { key, value }, dont la partie en cours (key « current »).
|
||||
// - settings : { key, value }, dont la partie en cours (key « current ») et
|
||||
// la progression dans les leçons (key « lessons », étape 1g).
|
||||
// Le résumé et le journal d'une partie sont écrits dans la même transaction.
|
||||
// L'API IndexedDB est utilisée directement, sans bibliothèque.
|
||||
|
||||
@@ -19,6 +20,9 @@ const VERSION = 1;
|
||||
const GAMES = "games";
|
||||
const JOURNALS = "journals";
|
||||
const SETTINGS = "settings";
|
||||
/** Clé de la progression dans les leçons, dans le magasin settings (étape
|
||||
* 1g : nouvelle clé, même schéma, version 1 de la base). */
|
||||
const LESSONS = "lessons";
|
||||
|
||||
/** Le résultat d'une requête IndexedDB, en promesse. */
|
||||
function done<T>(request: IDBRequest<T>): Promise<T> {
|
||||
@@ -77,5 +81,11 @@ export async function openIndexedDbBackend(factory: IDBFactory): Promise<Library
|
||||
transaction.objectStore(SETTINGS).put({ key: "current", value: id });
|
||||
await committed(transaction);
|
||||
},
|
||||
lessonProgress: async () => (await get<{ value: unknown }>(SETTINGS, LESSONS))?.value,
|
||||
saveLessonProgress: async (progress) => {
|
||||
const transaction = db.transaction(SETTINGS, "readwrite");
|
||||
transaction.objectStore(SETTINGS).put({ key: LESSONS, value: progress });
|
||||
await committed(transaction);
|
||||
},
|
||||
};
|
||||
}
|
||||
|
||||
@@ -19,6 +19,8 @@ export interface KeyValueStorage {
|
||||
const SUMMARIES = "ustagammon.games";
|
||||
const CURRENT = "ustagammon.current-game-id";
|
||||
const journalKey = (id: string) => `ustagammon.game.${id}`;
|
||||
/** La progression dans les leçons (étape 1g). */
|
||||
const LESSONS = "ustagammon.lessons";
|
||||
|
||||
/** La partie unique des versions précédentes (étape 0), à migrer. */
|
||||
const LEGACY_GAME = "ustagammon.current-game";
|
||||
@@ -60,6 +62,8 @@ export function createKeyValueBackend(storage: KeyValueStorage): LibraryBackend
|
||||
return typeof id === "string" ? id : undefined;
|
||||
},
|
||||
setCurrentId: async (id) => storage.setItem(CURRENT, JSON.stringify(id)),
|
||||
lessonProgress: async () => read(storage, LESSONS),
|
||||
saveLessonProgress: async (progress) => storage.setItem(LESSONS, JSON.stringify(progress)),
|
||||
};
|
||||
}
|
||||
|
||||
|
||||
@@ -0,0 +1,48 @@
|
||||
// La progression dans les leçons (étape 1g), dans le stockage des parties
|
||||
// (IndexedDB, ou localStorage en repli) : une seule valeur, relue par le
|
||||
// domaine (readLessonProgress), qui en connaît le format.
|
||||
//
|
||||
// Copyright (C) 2026 les auteurs d'Ustagammon.
|
||||
// Licence : GPLv3 ou ultérieure (voir LICENSE).
|
||||
|
||||
import { type LessonProgress, readLessonProgress } from "../domain/learning/lessons.js";
|
||||
import type { LibraryBackend } from "./game-library.js";
|
||||
|
||||
export interface LessonStore {
|
||||
/** La progression enregistrée (vide si rien n'est enregistré ou si le
|
||||
* stockage est illisible). */
|
||||
load(): Promise<LessonProgress>;
|
||||
/** Enregistre la progression ; les enregistrements se font dans l'ordre
|
||||
* des appels. Un stockage refusé ne fait pas échouer l'appel. */
|
||||
save(progress: LessonProgress): Promise<void>;
|
||||
}
|
||||
|
||||
export function createLessonStore(
|
||||
backend: Pick<LibraryBackend, "lessonProgress" | "saveLessonProgress">,
|
||||
): LessonStore {
|
||||
let queue: Promise<unknown> = Promise.resolve();
|
||||
const inTurn = <T>(task: () => Promise<T>): Promise<T> => {
|
||||
const run = queue.then(task, task);
|
||||
queue = run.catch(() => undefined);
|
||||
return run;
|
||||
};
|
||||
return {
|
||||
load: () =>
|
||||
inTurn(async () => {
|
||||
try {
|
||||
return readLessonProgress(await backend.lessonProgress());
|
||||
} catch {
|
||||
return readLessonProgress(undefined);
|
||||
}
|
||||
}),
|
||||
save: (progress) =>
|
||||
inTurn(async () => {
|
||||
try {
|
||||
await backend.saveLessonProgress(progress);
|
||||
} catch {
|
||||
// Stockage plein ou refusé : la progression reste en
|
||||
// mémoire pour cette visite.
|
||||
}
|
||||
}),
|
||||
};
|
||||
}
|
||||
@@ -4,13 +4,19 @@
|
||||
// Copyright (C) 2026 les auteurs d'Ustagammon.
|
||||
// Licence : GPLv3 ou ultérieure (voir LICENSE).
|
||||
|
||||
import { createGameLibrary, type GameLibrary, type LibraryOptions } from "./game-library.js";
|
||||
import {
|
||||
createGameLibrary,
|
||||
type GameLibrary,
|
||||
type LibraryBackend,
|
||||
type LibraryOptions,
|
||||
} from "./game-library.js";
|
||||
import { openIndexedDbBackend } from "./indexeddb-backend.js";
|
||||
import {
|
||||
createKeyValueBackend,
|
||||
type KeyValueStorage,
|
||||
migrateLegacyGame,
|
||||
} from "./key-value-backend.js";
|
||||
import { createLessonStore, type LessonStore } from "./lesson-store.js";
|
||||
|
||||
/** Les stockages du navigateur ; chacun peut manquer ou être refusé. */
|
||||
export interface BrowserStorage {
|
||||
@@ -23,6 +29,8 @@ export interface OpenedLibrary {
|
||||
/** Le stockage retenu : IndexedDB, son repli localStorage, ou la seule
|
||||
* mémoire de la page (rien n'est gardé après sa fermeture). */
|
||||
readonly kind: "indexeddb" | "localStorage" | "memory";
|
||||
/** La progression dans les leçons, dans le même stockage. */
|
||||
readonly lessons: LessonStore;
|
||||
}
|
||||
|
||||
/** Au-delà, IndexedDB est tenu pour indisponible (une ouverture bloquée ne
|
||||
@@ -55,7 +63,7 @@ async function open(storage: BrowserStorage, options: LibraryOptions): Promise<O
|
||||
timer = setTimeout(() => reject(new Error("IndexedDB muet")), OPEN_TIMEOUT_MS);
|
||||
}),
|
||||
]);
|
||||
return { library: createGameLibrary(backend, options), kind: "indexeddb" };
|
||||
return opened(backend, options, "indexeddb");
|
||||
} catch {
|
||||
// Indisponible (navigation privée de certains navigateurs) : repli.
|
||||
} finally {
|
||||
@@ -63,14 +71,21 @@ async function open(storage: BrowserStorage, options: LibraryOptions): Promise<O
|
||||
}
|
||||
}
|
||||
if (storage.localStorage !== undefined && usable(storage.localStorage)) {
|
||||
return {
|
||||
library: createGameLibrary(createKeyValueBackend(storage.localStorage), options),
|
||||
kind: "localStorage",
|
||||
};
|
||||
return opened(createKeyValueBackend(storage.localStorage), options, "localStorage");
|
||||
}
|
||||
return opened(createKeyValueBackend(memoryStorage()), options, "memory");
|
||||
}
|
||||
|
||||
/** Les parties et la progression dans les leçons, sur le même stockage. */
|
||||
function opened(
|
||||
backend: LibraryBackend,
|
||||
options: LibraryOptions,
|
||||
kind: OpenedLibrary["kind"],
|
||||
): OpenedLibrary {
|
||||
return {
|
||||
library: createGameLibrary(createKeyValueBackend(memoryStorage()), options),
|
||||
kind: "memory",
|
||||
library: createGameLibrary(backend, options),
|
||||
kind,
|
||||
lessons: createLessonStore(backend),
|
||||
};
|
||||
}
|
||||
|
||||
|
||||
+239
-12
@@ -44,6 +44,15 @@ import { type PositionLink, type SharedPosition, setupOf } from "../domain/game/
|
||||
import type { SavedGameSummary } from "../domain/game/saved-game.js";
|
||||
import { otherSide, type Side } from "../domain/game/side.js";
|
||||
import type { GameState } from "../domain/game/state.js";
|
||||
import {
|
||||
finishedLessons,
|
||||
LESSON_END,
|
||||
type LessonProgress,
|
||||
lessonRecord,
|
||||
NO_PROGRESS,
|
||||
withSolved,
|
||||
withVisit,
|
||||
} from "../domain/learning/lessons.js";
|
||||
import { ADVICE_TEXTS } from "./advice-texts.js";
|
||||
import { type Analyse, createAdviceTracker } from "./advice-tracker.js";
|
||||
import { createAdviceView, VERDICT_ICONS } from "./advice-view.js";
|
||||
@@ -87,6 +96,10 @@ import { HOME_TEXTS } from "./home-texts.js";
|
||||
import { createHomeView } from "./home-view.js";
|
||||
import { icon } from "./icons.js";
|
||||
import { installPlatform, startInstaller } from "./install.js";
|
||||
import { LESSON_COUNT, type Lesson, lessonSource, outlineOf, parseLesson } from "./lesson-text.js";
|
||||
import { LESSON_TEXTS } from "./lesson-texts.js";
|
||||
import { lessonCards, nextLessonCard } from "./lessons-model.js";
|
||||
import { createLessonsView } from "./lessons-view.js";
|
||||
import { MATCH_TEXTS } from "./match-texts.js";
|
||||
import { replacingLink, startNavigation } from "./navigation.js";
|
||||
import { createNewGameView } from "./new-game-view.js";
|
||||
@@ -111,8 +124,21 @@ import {
|
||||
} from "./settings.js";
|
||||
import { createSummaryView } from "./summary-view.js";
|
||||
import { type PromptText, TEXTS } from "./texts.js";
|
||||
import { seenAfter } from "./tutorial-nav.js";
|
||||
import { createTutorialView, type TutorialAccess } from "./tutorial-view.js";
|
||||
import {
|
||||
lessonPlaceOf,
|
||||
lessonPlaceRoute,
|
||||
seenAfter,
|
||||
placeOf as tutorialPlaceOf,
|
||||
placeRoute as tutorialPlaceRoute,
|
||||
} from "./tutorial-nav.js";
|
||||
import { parseTutorial, type Tutorial } from "./tutorial-text.js";
|
||||
import {
|
||||
type Course,
|
||||
cachedText,
|
||||
createTutorialView,
|
||||
TUTORIAL_SOURCE,
|
||||
type TutorialAccess,
|
||||
} from "./tutorial-view.js";
|
||||
import { betweenTurns, type Updates, updateBannerShown } from "./updates.js";
|
||||
|
||||
/** Glissement d'un pion de l'ordinateur, et pause entre deux pions
|
||||
@@ -152,8 +178,15 @@ export interface AppOptions {
|
||||
/** Les réglages, en JSON (null : jamais enregistrés). */
|
||||
readonly loadSettings: () => string | null;
|
||||
readonly saveSettings: (json: string) => void;
|
||||
/** Le tutoriel : plateaux, coups illustrés, gestes jugés par le moteur. */
|
||||
/** Le tutoriel : plateaux, coups illustrés, gestes jugés par le moteur ;
|
||||
* les leçons s'en servent aussi. */
|
||||
readonly tutorial: TutorialAccess;
|
||||
/** La progression dans les leçons (étape 1g), dans le stockage des
|
||||
* parties. */
|
||||
readonly lessons: {
|
||||
readonly load: () => Promise<LessonProgress>;
|
||||
readonly save: (progress: LessonProgress) => void;
|
||||
};
|
||||
/** Les mises à jour de l'application (service worker) : onAvailable est
|
||||
* appelé quand une nouvelle version attend. */
|
||||
readonly startUpdates: (onAvailable: () => void) => Updates;
|
||||
@@ -327,8 +360,11 @@ export function startApp(options: AppOptions): void {
|
||||
resumeOld: byId<HTMLButtonElement>("resume-old"),
|
||||
home: byId("home"),
|
||||
tutorial: byId("tutorial"),
|
||||
lessons: byId("lessons"),
|
||||
lesson: byId("lesson"),
|
||||
menuHome: byId<HTMLAnchorElement>("menu-home"),
|
||||
menuTutorial: byId<HTMLAnchorElement>("menu-tutorial"),
|
||||
menuLessons: byId<HTMLAnchorElement>("menu-lessons"),
|
||||
menuInstall: byId<HTMLButtonElement>("menu-install"),
|
||||
menuUpdate: byId<HTMLButtonElement>("menu-update"),
|
||||
installVeil: byId("install-veil"),
|
||||
@@ -476,6 +512,7 @@ export function startApp(options: AppOptions): void {
|
||||
ui.resumeOld.textContent = TEXTS.resumeOld;
|
||||
label(ui.menuHome, HOME_TEXTS.homeLink, "home");
|
||||
label(ui.menuTutorial, HOME_TEXTS.tutorialMenu, "rules");
|
||||
label(ui.menuLessons, LESSON_TEXTS.menu, "lessons");
|
||||
label(ui.menuInstall, HOME_TEXTS.installMenu, "install");
|
||||
label(ui.menuUpdate, HOME_TEXTS.updateCheck, "replay");
|
||||
ui.installTitle.textContent = HOME_TEXTS.installTitle;
|
||||
@@ -1888,6 +1925,10 @@ export function startApp(options: AppOptions): void {
|
||||
navigation.leave((r) => r.screen === "analysis");
|
||||
} else if (route.screen === "tutorial" || route.screen === "tutorialEnd") {
|
||||
navigation.leave((r) => r.screen === "tutorial" || r.screen === "tutorialEnd");
|
||||
} else if (route.screen === "lesson" || route.screen === "lessonEnd") {
|
||||
navigation.leave((r) => r.screen === "lesson" || r.screen === "lessonEnd");
|
||||
} else if (route.screen === "lessons") {
|
||||
navigation.leave((r) => r.screen === "lessons");
|
||||
}
|
||||
},
|
||||
};
|
||||
@@ -1993,6 +2034,7 @@ export function startApp(options: AppOptions): void {
|
||||
replacingLink(ui.menuHelp, navigation);
|
||||
replacingLink(ui.menuHome, navigation);
|
||||
replacingLink(ui.menuTutorial, navigation);
|
||||
replacingLink(ui.menuLessons, navigation);
|
||||
ui.menuClose.onclick = () => closeOverlays();
|
||||
ui.menuCopyLink.onclick = () => {
|
||||
const link = currentLink;
|
||||
@@ -2044,9 +2086,12 @@ export function startApp(options: AppOptions): void {
|
||||
const position = below.screen === "position";
|
||||
const home = below.screen === "home";
|
||||
const tutorial = below.screen === "tutorial" || below.screen === "tutorialEnd";
|
||||
const lessonList = below.screen === "lessons";
|
||||
const lesson = below.screen === "lesson" || below.screen === "lessonEnd";
|
||||
const choosing = below.screen === "newGame";
|
||||
const analysing = below.screen === "analysis";
|
||||
const page = help || position || home || tutorial || choosing || analysing;
|
||||
const page =
|
||||
help || position || home || tutorial || lessonList || lesson || choosing || analysing;
|
||||
const wasPage = ui.game.hidden;
|
||||
const wasScreen = ui.root.dataset.screen;
|
||||
ui.game.hidden = page;
|
||||
@@ -2054,13 +2099,18 @@ export function startApp(options: AppOptions): void {
|
||||
ui.position.hidden = !position;
|
||||
ui.home.hidden = !home;
|
||||
ui.tutorial.hidden = !tutorial;
|
||||
ui.lessons.hidden = !lessonList;
|
||||
ui.lesson.hidden = !lesson;
|
||||
ui.analysis.hidden = !analysing;
|
||||
const opening = choosing && ui.newGameSection.hidden;
|
||||
ui.newGameSection.hidden = !choosing;
|
||||
ui.root.classList.toggle("page-open", page);
|
||||
// Le tutoriel, le premier lancement et l'écran « Nouvelle partie »
|
||||
// ont leur propre en-tête.
|
||||
ui.root.classList.toggle("bare", tutorial || choosing || (home && isFirstLaunch(settings)));
|
||||
// Le tutoriel, les leçons, le premier lancement et l'écran « Nouvelle
|
||||
// partie » ont leur propre en-tête.
|
||||
ui.root.classList.toggle(
|
||||
"bare",
|
||||
tutorial || lesson || choosing || (home && isFirstLaunch(settings)),
|
||||
);
|
||||
if (opening) {
|
||||
newGameView.render(busy || game === null);
|
||||
newGameView.focus();
|
||||
@@ -2076,6 +2126,21 @@ export function startApp(options: AppOptions): void {
|
||||
} else {
|
||||
tutorialView.hide();
|
||||
}
|
||||
if (lesson) {
|
||||
// Une leçon qui n'existe pas : la liste des leçons.
|
||||
if (below.lesson > LESSON_COUNT) {
|
||||
navigation.replace(routeHash({ screen: "lessons" }));
|
||||
return;
|
||||
}
|
||||
if (route.screen !== "install") {
|
||||
void lessonView.show(below);
|
||||
}
|
||||
} else {
|
||||
lessonView.hide();
|
||||
}
|
||||
if (lessonList) {
|
||||
renderLessons();
|
||||
}
|
||||
if (home) {
|
||||
homeProgress = null;
|
||||
}
|
||||
@@ -2230,8 +2295,26 @@ export function startApp(options: AppOptions): void {
|
||||
sides: sides ?? options.cachedBoard()?.sides ?? null,
|
||||
tutorialSeen: settings.tutorialSeen,
|
||||
progress: homeProgress,
|
||||
lessons:
|
||||
lessonTexts === null || lessonProgress === null
|
||||
? null
|
||||
: {
|
||||
next: nextLessonCard(lessonTexts, lessonProgress),
|
||||
finished: finishedLessons(lessonProgress, lessonTexts.map(outlineOf)),
|
||||
total: lessonTexts.length,
|
||||
},
|
||||
busy: busy || game === null,
|
||||
});
|
||||
if (lessonTexts === null || lessonProgress === null) {
|
||||
lessonsReady().then(
|
||||
() => {
|
||||
if (navigation.route.screen === "home") {
|
||||
renderHome();
|
||||
}
|
||||
},
|
||||
() => undefined,
|
||||
);
|
||||
}
|
||||
if (homeProgress === null && !progressLoading) {
|
||||
progressLoading = true;
|
||||
// La liste vient du stockage, ouvert avec le moteur.
|
||||
@@ -2254,17 +2337,158 @@ export function startApp(options: AppOptions): void {
|
||||
}
|
||||
}
|
||||
|
||||
const tutorialView = createTutorialView({
|
||||
section: ui.tutorial,
|
||||
access: options.tutorial,
|
||||
engineReady: options.engineReady,
|
||||
const loadTutorial = cachedText(TUTORIAL_SOURCE, parseTutorial);
|
||||
const tutorialCourse: Course = {
|
||||
id: "tutorial",
|
||||
load: () => loadTutorial(),
|
||||
placeOf: tutorialPlaceOf,
|
||||
routeOf: (_, place) => tutorialPlaceRoute(place),
|
||||
seen: () => settings.tutorialSeen,
|
||||
visit: (place) => {
|
||||
visit: (_, place) => {
|
||||
const seen = seenAfter(settings.tutorialSeen, place);
|
||||
if (seen !== settings.tutorialSeen || !settings.welcomed) {
|
||||
saveSettings({ tutorialSeen: seen, ...welcomed() });
|
||||
}
|
||||
},
|
||||
solved: () => undefined,
|
||||
quitHref: () => "#/",
|
||||
firstBackHref: () => "#/accueil",
|
||||
endHref: () => "#/",
|
||||
texts: {
|
||||
progress: HOME_TEXTS.tutorialProgress,
|
||||
stepLink: HOME_TEXTS.tutorialStepLink,
|
||||
quit: HOME_TEXTS.tutorialSkip,
|
||||
quitLabel: HOME_TEXTS.tutorialSkipLabel,
|
||||
overline: (_, n, total, practice) => HOME_TEXTS.tutorialOverline(n, total, practice),
|
||||
endOverline: () => HOME_TEXTS.tutorialEndOverline,
|
||||
endTitle: () => HOME_TEXTS.tutorialEndTitle,
|
||||
loading: HOME_TEXTS.tutorialLoading,
|
||||
failed: HOME_TEXTS.tutorialFailed,
|
||||
},
|
||||
};
|
||||
const tutorialView = createTutorialView({
|
||||
section: ui.tutorial,
|
||||
access: options.tutorial,
|
||||
engineReady: options.engineReady,
|
||||
course: tutorialCourse,
|
||||
placed: () => haptic("checkerPlaced"),
|
||||
reducedMotion,
|
||||
landscape: () => layout() === "landscape",
|
||||
replace: (hash) => navigation.replace(hash),
|
||||
});
|
||||
|
||||
// ------------------------------------------------------------ Leçons
|
||||
|
||||
// Les textes des leçons (docs/lecons/, copiés dans le site) et la
|
||||
// progression enregistrée, lus une fois.
|
||||
const lessonLoaders = Array.from({ length: LESSON_COUNT }, (_, i) =>
|
||||
cachedText(lessonSource(i + 1), (text) => parseLesson(i + 1, text)),
|
||||
);
|
||||
let lessonTexts: Lesson[] | null = null;
|
||||
let lessonProgress: LessonProgress | null = null;
|
||||
const lessonProgressLoading = options.lessons
|
||||
.load()
|
||||
.catch(() => NO_PROGRESS)
|
||||
.then((progress) => {
|
||||
lessonProgress = progress;
|
||||
return progress;
|
||||
});
|
||||
/** Les leçons et la progression, lues (rejetée si un texte manque). */
|
||||
async function lessonsReady(): Promise<{ texts: Lesson[]; progress: LessonProgress }> {
|
||||
const [texts, progress] = await Promise.all([
|
||||
Promise.all(lessonLoaders.map((load) => load())),
|
||||
lessonProgressLoading,
|
||||
]);
|
||||
lessonTexts = texts;
|
||||
return { texts, progress };
|
||||
}
|
||||
const progressNow = () => lessonProgress ?? NO_PROGRESS;
|
||||
function updateLessons(progress: LessonProgress): void {
|
||||
lessonProgress = progress;
|
||||
options.lessons.save(progress);
|
||||
}
|
||||
const lessonOf = (route: Route) =>
|
||||
route.screen === "lesson" || route.screen === "lessonEnd" ? route.lesson : 1;
|
||||
// Le texte que l'écran d'une leçon reçoit est une leçon (Lesson).
|
||||
const lessonNumberOf = (text: Tutorial) => (text as Partial<Lesson>).number ?? 1;
|
||||
const lessonTitleOf = (text: Tutorial) => (text as Partial<Lesson>).title ?? "";
|
||||
|
||||
const lessonsView = createLessonsView(ui.lessons);
|
||||
function renderLessons(): void {
|
||||
if (lessonTexts !== null && lessonProgress !== null) {
|
||||
lessonsView.render(lessonCards(lessonTexts, lessonProgress));
|
||||
return;
|
||||
}
|
||||
lessonsView.render(null);
|
||||
lessonsReady().then(
|
||||
() => {
|
||||
if (navigation.route.screen === "lessons") {
|
||||
renderLessons();
|
||||
}
|
||||
},
|
||||
() => {
|
||||
if (navigation.route.screen === "lessons") {
|
||||
lessonsView.render(null, true);
|
||||
}
|
||||
},
|
||||
);
|
||||
}
|
||||
|
||||
const lessonCourse: Course = {
|
||||
id: "lesson",
|
||||
load: async (route) => {
|
||||
await lessonProgressLoading;
|
||||
const load = lessonLoaders[lessonOf(route) - 1];
|
||||
if (load === undefined) {
|
||||
throw new Error(`leçon ${lessonOf(route)} absente`);
|
||||
}
|
||||
return load();
|
||||
},
|
||||
placeOf: lessonPlaceOf,
|
||||
routeOf: (route, place) => lessonPlaceRoute(lessonOf(route), place),
|
||||
seen: (route) => lessonRecord(progressNow(), lessonOf(route)).reached,
|
||||
visit: (route, place) => {
|
||||
const number = lessonOf(route);
|
||||
const at = place === "end" ? LESSON_END : place.step;
|
||||
const record = lessonRecord(progressNow(), number);
|
||||
if (record.last !== at || record.reached < at) {
|
||||
updateLessons(withVisit(progressNow(), number, at));
|
||||
}
|
||||
if (!settings.welcomed) {
|
||||
saveSettings(welcomed());
|
||||
}
|
||||
},
|
||||
solved: (route, place) => {
|
||||
if (place !== "end" && place.practice) {
|
||||
updateLessons(withSolved(progressNow(), lessonOf(route), place.step));
|
||||
}
|
||||
},
|
||||
quitHref: () => routeHash({ screen: "lessons" }),
|
||||
firstBackHref: () => routeHash({ screen: "lessons" }),
|
||||
endHref: (route) => {
|
||||
const number = lessonOf(route);
|
||||
return number < LESSON_COUNT
|
||||
? routeHash({ screen: "lesson", lesson: number + 1, step: 1, practice: false })
|
||||
: routeHash({ screen: "lessons" });
|
||||
},
|
||||
texts: {
|
||||
progress: LESSON_TEXTS.progress,
|
||||
stepLink: LESSON_TEXTS.stepLink,
|
||||
quit: LESSON_TEXTS.quit,
|
||||
quitLabel: LESSON_TEXTS.quitLabel,
|
||||
overline: (text, n, total, practice) =>
|
||||
LESSON_TEXTS.overline(lessonNumberOf(text), n, total, practice),
|
||||
endOverline: (text) => LESSON_TEXTS.endOverline(lessonNumberOf(text)),
|
||||
endTitle: (text) => LESSON_TEXTS.endTitle(lessonTitleOf(text)),
|
||||
loading: LESSON_TEXTS.loading,
|
||||
failed: LESSON_TEXTS.failed,
|
||||
},
|
||||
};
|
||||
const lessonView = createTutorialView({
|
||||
section: ui.lesson,
|
||||
access: options.tutorial,
|
||||
engineReady: options.engineReady,
|
||||
course: lessonCourse,
|
||||
placed: () => haptic("checkerPlaced"),
|
||||
reducedMotion,
|
||||
landscape: () => layout() === "landscape",
|
||||
@@ -2535,6 +2759,9 @@ export function startApp(options: AppOptions): void {
|
||||
if (!ui.tutorial.hidden) {
|
||||
tutorialView.relayout();
|
||||
}
|
||||
if (!ui.lesson.hidden) {
|
||||
lessonView.relayout();
|
||||
}
|
||||
});
|
||||
};
|
||||
window.addEventListener("resize", relayout);
|
||||
|
||||
@@ -35,6 +35,7 @@ export const FEATURES = [
|
||||
"docs/scenarios/revoir-ma-partie.feature",
|
||||
"docs/scenarios/demander-a-une-ia.feature",
|
||||
"docs/scenarios/apprendre-les-regles.feature",
|
||||
"docs/scenarios/suivre-une-lecon.feature",
|
||||
"docs/scenarios/mes-parties.feature",
|
||||
"docs/scenarios/partager-une-position.feature",
|
||||
"docs/scenarios/regler-l-application.feature",
|
||||
|
||||
@@ -41,7 +41,9 @@ export const HOME_TEXTS = {
|
||||
rulesContinue: (step: number) => `Reprendre à l'étape ${step}`,
|
||||
rulesAgain: "Revoir",
|
||||
progress: (played: number, won: number) =>
|
||||
`${plural(played, "partie jouée", "parties jouées")} · ${plural(won, "gagnée", "gagnées")}`,
|
||||
played === 0
|
||||
? "aucune partie jouée"
|
||||
: `${plural(played, "partie jouée", "parties jouées")} · ${plural(won, "gagnée", "gagnées")}`,
|
||||
footer: "Né à l'Atelier du Huit, à Cugnaux. Logiciel libre, sans publicité ni mise.",
|
||||
|
||||
// Installation
|
||||
@@ -119,7 +121,7 @@ export const HOME_TEXTS = {
|
||||
aboutVersionUnknown: "Version publiée : inconnue (lancée depuis les sources).",
|
||||
aboutParagraphs: [
|
||||
"Ustagammon est un logiciel libre, sous licence GNU GPL version 3 ou ultérieure : vous pouvez l'utiliser, l'étudier, le modifier et le partager.",
|
||||
"Les textes du tutoriel, de l'aide et du glossaire sont sous licence Creative Commons BY-SA 4.0.",
|
||||
"Les textes du tutoriel, des leçons, de l'aide et du glossaire sont sous licence Creative Commons BY-SA 4.0.",
|
||||
"L'ordinateur joue et juge les coups avec GNU Backgammon (GPLv3), compilé pour le navigateur. Police Alegreya Sans, sous licence SIL Open Font License.",
|
||||
"Né à l'Atelier du Huit, café associatif à Cugnaux. Sans publicité, sans compte, sans mise : tout reste sur votre téléphone.",
|
||||
],
|
||||
|
||||
+65
-7
@@ -1,13 +1,13 @@
|
||||
// L'accueil (#/accueil) : au premier lancement, le choix « Je découvre » /
|
||||
// « Je connais les règles » ; ensuite, la partie en cours, l'invitation à
|
||||
// installer, les règles et la progression résumée
|
||||
// installer, la prochaine leçon (1g), les règles et la progression résumée
|
||||
// (docs/identite/charte/accueil-tutoriel-aide.md, « Accueil »).
|
||||
//
|
||||
// Copyright (C) 2026 les auteurs d'Ustagammon.
|
||||
// Licence : GPLv3 ou ultérieure (voir LICENSE).
|
||||
//
|
||||
// Les leçons (1g) et la progression détaillée (1h) n'existent pas encore :
|
||||
// l'accueil n'affiche que ce qui existe.
|
||||
// La progression détaillée (1h) n'existe pas encore : l'accueil n'affiche
|
||||
// que ce qui existe.
|
||||
|
||||
import type { SideBoards } from "../domain/game/game.js";
|
||||
import { boardModel, OPENING_BOARDS } from "./board-model.js";
|
||||
@@ -16,6 +16,9 @@ import { boardGeometry, PORTRAIT_ASPECT } from "./geometry.js";
|
||||
import { type HomeModel, WELCOME_LINKS } from "./home-model.js";
|
||||
import { HOME_TEXTS } from "./home-texts.js";
|
||||
import { icon } from "./icons.js";
|
||||
import { LESSON_TEXTS } from "./lesson-texts.js";
|
||||
import type { LessonCardModel } from "./lessons-model.js";
|
||||
import { fillLessonCard, lessonAction } from "./lessons-view.js";
|
||||
import { TUTORIAL_DONE } from "./settings.js";
|
||||
import { TEXTS } from "./texts.js";
|
||||
|
||||
@@ -38,6 +41,13 @@ export interface HomeState {
|
||||
readonly tutorialSeen: number;
|
||||
/** Parties jouées et gagnées (null : pas encore lues). */
|
||||
readonly progress: { readonly played: number; readonly won: number } | null;
|
||||
/** Les leçons : la prochaine (null : toutes terminées), et combien sont
|
||||
* terminées sur combien (null : pas encore lues). */
|
||||
readonly lessons: {
|
||||
readonly next: LessonCardModel | null;
|
||||
readonly finished: number;
|
||||
readonly total: number;
|
||||
} | null;
|
||||
/** Le moteur se charge, ou l'écran est occupé. */
|
||||
readonly busy: boolean;
|
||||
}
|
||||
@@ -186,6 +196,23 @@ export function createHomeView(options: HomeViewOptions): HomeView {
|
||||
later.title = HOME_TEXTS.installLater;
|
||||
later.addEventListener("click", () => options.dismissInstall());
|
||||
|
||||
// La prochaine leçon : une seule carte, « Continuer » en secondaire, et
|
||||
// le lien vers toutes les leçons.
|
||||
const lesson = element(main, "article", { id: "home-lesson", className: "card home-lesson" });
|
||||
element(lesson, "span", { className: "overline", text: LESSON_TEXTS.homeOverline });
|
||||
const lessonInfo = element(lesson, "div", { className: "home-lesson-info" });
|
||||
const lessonActions = element(lesson, "div", { className: "home-lesson-actions" });
|
||||
const lessonGo = element(lessonActions, "a", {
|
||||
id: "home-lesson-go",
|
||||
className: "button secondary",
|
||||
});
|
||||
const lessonAll = element(lessonActions, "a", {
|
||||
id: "home-lessons",
|
||||
className: "home-lessons-link",
|
||||
text: LESSON_TEXTS.allLessons,
|
||||
});
|
||||
lessonAll.href = "#/lecons";
|
||||
|
||||
const rules = element(main, "a", { id: "home-rules", className: "card home-rules" });
|
||||
const rulesText = element(rules, "span", { className: "home-rules-text" });
|
||||
element(rulesText, "strong", { text: HOME_TEXTS.rulesTitle });
|
||||
@@ -233,10 +260,41 @@ export function createHomeView(options: HomeViewOptions): HomeView {
|
||||
: seen >= TUTORIAL_DONE
|
||||
? HOME_TEXTS.rulesAgain
|
||||
: HOME_TEXTS.rulesContinue(seen);
|
||||
progress.textContent =
|
||||
state.progress === null || state.progress.played === 0
|
||||
? ""
|
||||
: HOME_TEXTS.progress(state.progress.played, state.progress.won);
|
||||
// La carte de la leçon, une fois les leçons lues.
|
||||
lesson.hidden = state.lessons === null;
|
||||
if (state.lessons !== null) {
|
||||
const card = state.lessons.next;
|
||||
if (card === null) {
|
||||
lessonInfo.replaceChildren();
|
||||
element(lessonInfo, "strong", {
|
||||
className: "lesson-card-title",
|
||||
text: LESSON_TEXTS.homeAllDone,
|
||||
});
|
||||
element(lessonInfo, "span", {
|
||||
className: "muted",
|
||||
text: LESSON_TEXTS.homeAllDoneDetail,
|
||||
});
|
||||
lessonGo.hidden = true;
|
||||
} else {
|
||||
fillLessonCard(lessonInfo, card);
|
||||
lessonGo.hidden = false;
|
||||
lessonGo.textContent = lessonAction(card);
|
||||
lessonGo.href = card.href;
|
||||
lessonGo.setAttribute(
|
||||
"aria-label",
|
||||
`${lessonAction(card)} : ${LESSON_TEXTS.openLabel(card.number, card.title)}`,
|
||||
);
|
||||
}
|
||||
}
|
||||
const parts: string[] = [];
|
||||
if (state.lessons !== null) {
|
||||
parts.push(LESSON_TEXTS.homeSummary(state.lessons.finished, state.lessons.total));
|
||||
}
|
||||
if (state.progress !== null) {
|
||||
parts.push(HOME_TEXTS.progress(state.progress.played, state.progress.won));
|
||||
}
|
||||
const line = parts.join(" · ");
|
||||
progress.textContent = line.charAt(0).toUpperCase() + line.slice(1);
|
||||
},
|
||||
};
|
||||
}
|
||||
|
||||
@@ -25,6 +25,7 @@ export const ICON_PATHS = {
|
||||
home: "M4 11l8-7 8 7M6 9.5V20h12V9.5M10 20v-6h4v6",
|
||||
rules: "M4 5h6a2 2 0 0 1 2 2v13a2 2 0 0 0-2-2H4zM20 5h-6a2 2 0 0 0-2 2v13a2 2 0 0 1 2-2h6z",
|
||||
install: "M12 4v11M7 10l5 5 5-5M5 20h14",
|
||||
lessons: "M3 9l9-5 9 5-9 5zM7 11.2V16c0 1.6 2.2 3 5 3s5-1.4 5-3v-4.8M21 9v6",
|
||||
verdictGood: "M12 21a9 9 0 1 0 0-18a9 9 0 0 0 0 18zM8 12.5l3 3 5-6",
|
||||
verdictDoubtful:
|
||||
"M12 21a9 9 0 1 0 0-18a9 9 0 0 0 0 18zM9.5 9.3a2.6 2.6 0 1 1 3.6 2.4c-.7.3-1.1.9-1.1 1.6v.6M12 17.2v.1",
|
||||
|
||||
@@ -0,0 +1,43 @@
|
||||
// Lecture du texte des leçons (docs/lecons/lecon-<n>.md, format décrit dans
|
||||
// docs/lecons/README.md), copié tel quel dans le site par make site
|
||||
// (ADR 0008 : une seule source). Même format que le tutoriel, avec un titre
|
||||
// en tête. Fonctions pures, testées sous Node.
|
||||
//
|
||||
// Copyright (C) 2026 les auteurs d'Ustagammon.
|
||||
// Licence : GPLv3 ou ultérieure (voir LICENSE).
|
||||
|
||||
import type { LessonOutline } from "../domain/learning/lessons.js";
|
||||
import { parseTutorial, type Tutorial } from "./tutorial-text.js";
|
||||
|
||||
/** Le nombre de leçons (fichiers lecon-1.md à lecon-<n>.md). */
|
||||
export const LESSON_COUNT = 5;
|
||||
|
||||
/** Une leçon : son numéro, son titre, et ses écrans, comme le tutoriel. */
|
||||
export interface Lesson extends Tutorial {
|
||||
readonly number: number;
|
||||
readonly title: string;
|
||||
}
|
||||
|
||||
/** L'adresse, dans le site, du texte de la leçon number. */
|
||||
export function lessonSource(number: number): string {
|
||||
return `docs/lecons/lecon-${number}.md`;
|
||||
}
|
||||
|
||||
/** Lit le texte d'une leçon. Erreur si le titre manque ou si les écrans
|
||||
* sont mal formés (parseTutorial). */
|
||||
export function parseLesson(number: number, text: string): Lesson {
|
||||
const title = /^# (.+)$/m.exec(text)?.[1]?.trim();
|
||||
if (title === undefined || title === "") {
|
||||
throw new Error(`leçon ${number} : titre absent`);
|
||||
}
|
||||
return { ...parseTutorial(text), number, title };
|
||||
}
|
||||
|
||||
/** Ce que la progression retient d'une leçon : les étapes de ses
|
||||
* exercices. */
|
||||
export function outlineOf(lesson: Lesson): LessonOutline {
|
||||
return {
|
||||
number: lesson.number,
|
||||
exercises: lesson.steps.filter((s) => s.practice !== null).map((s) => s.number),
|
||||
};
|
||||
}
|
||||
@@ -0,0 +1,59 @@
|
||||
// Les textes de la liste des leçons, de leurs écrans et de la carte
|
||||
// « prochaine leçon » de l'accueil (ADR 0007, point 5 ;
|
||||
// docs/identite/charte/ecrans-etape-1.md, « 1g. Leçons »). Le texte des
|
||||
// leçons elles-mêmes n'est pas ici : il vit dans docs/lecons/.
|
||||
//
|
||||
// Copyright (C) 2026 les auteurs d'Ustagammon.
|
||||
// Licence : GPLv3 ou ultérieure (voir LICENSE).
|
||||
|
||||
import type { LessonState } from "../domain/learning/lessons.js";
|
||||
|
||||
function plural(n: number, one: string, many: string): string {
|
||||
return `${n} ${n > 1 ? many : one}`;
|
||||
}
|
||||
|
||||
export const LESSON_TEXTS = {
|
||||
// Liste
|
||||
menu: "Les leçons",
|
||||
listTitle: "Les leçons",
|
||||
listLead:
|
||||
"Cinq leçons courtes, plateau à l'appui, avec des exercices où vous jouez le coup du maître. L'ordre est conseillé, jamais imposé.",
|
||||
rulesReminder: "Les règles du jeu",
|
||||
rulesReview: "revoir",
|
||||
rulesReviewLabel: "Revoir les règles du jeu (le tutoriel)",
|
||||
number: (n: number) => `Leçon ${n}`,
|
||||
listLoading: "Chargement des leçons…",
|
||||
listFailed: "Les leçons n'ont pas pu se charger.",
|
||||
state: (state: LessonState) =>
|
||||
state.kind === "done"
|
||||
? "Terminée"
|
||||
: state.kind === "toStart"
|
||||
? `À commencer · ${plural(state.total, "exercice", "exercices")}`
|
||||
: `${plural(state.solved, "exercice", "exercices")} sur ${state.total}`,
|
||||
continue: "Continuer",
|
||||
start: "Commencer",
|
||||
review: "Revoir",
|
||||
openLabel: (n: number, title: string) => `Leçon ${n} : ${title}`,
|
||||
|
||||
// Écrans d'une leçon
|
||||
progress: "Étapes de la leçon",
|
||||
stepLink: (n: number, title: string) => `Étape ${n} : ${title}`,
|
||||
quit: "Quitter",
|
||||
quitLabel: "Quitter la leçon",
|
||||
overline: (lesson: number, n: number, total: number, practice: boolean) =>
|
||||
`Leçon ${lesson} · ${n} sur ${total}${practice ? " · à vous" : ""}`,
|
||||
endOverline: (lesson: number) => `Leçon ${lesson} · fin`,
|
||||
endTitle: (title: string) => title,
|
||||
loading: "Chargement de la leçon…",
|
||||
failed: "La leçon n'a pas pu se charger.",
|
||||
|
||||
// Accueil
|
||||
homeOverline: "Prochaine leçon",
|
||||
homeAllDone: "Toutes les leçons sont terminées",
|
||||
homeAllDoneDetail: "Vous pouvez les revoir quand vous voulez.",
|
||||
allLessons: "Toutes les leçons",
|
||||
homeSummary: (finished: number, total: number) =>
|
||||
finished === 0
|
||||
? `Aucune leçon terminée sur ${total}`
|
||||
: `${plural(finished, "leçon terminée", "leçons terminées")} sur ${total}`,
|
||||
} as const;
|
||||
@@ -0,0 +1,66 @@
|
||||
// Ce que montrent la liste des leçons et la carte « prochaine leçon » de
|
||||
// l'accueil : fonctions pures, testées sous Node
|
||||
// (docs/identite/charte/ecrans-etape-1.md, « 1g. Leçons »).
|
||||
//
|
||||
// Copyright (C) 2026 les auteurs d'Ustagammon.
|
||||
// Licence : GPLv3 ou ultérieure (voir LICENSE).
|
||||
|
||||
import {
|
||||
type LessonProgress,
|
||||
type LessonState,
|
||||
lessonRecord,
|
||||
lessonState,
|
||||
nextLesson,
|
||||
resumeStep,
|
||||
} from "../domain/learning/lessons.js";
|
||||
import { type Lesson, outlineOf } from "./lesson-text.js";
|
||||
import { routeHash } from "./router.js";
|
||||
|
||||
/** Une leçon dans la liste, ou sur l'accueil. */
|
||||
export interface LessonCardModel {
|
||||
readonly number: number;
|
||||
readonly title: string;
|
||||
readonly state: LessonState;
|
||||
/** Les exercices, dans l'ordre : réussi ou non (barre de progression). */
|
||||
readonly exercises: readonly boolean[];
|
||||
/** Où mène la carte : là où reprendre la leçon. */
|
||||
readonly href: string;
|
||||
/** La leçon proposée ensuite : carte bordée de brique, seule action
|
||||
* principale de l'écran. */
|
||||
readonly current: boolean;
|
||||
}
|
||||
|
||||
/** L'adresse où reprendre la leçon. */
|
||||
export function resumeHref(progress: LessonProgress, lesson: Lesson): string {
|
||||
const step = resumeStep(progress, outlineOf(lesson));
|
||||
return routeHash({ screen: "lesson", lesson: lesson.number, step, practice: false });
|
||||
}
|
||||
|
||||
/** Les cartes de la liste des leçons, dans l'ordre. */
|
||||
export function lessonCards(
|
||||
lessons: readonly Lesson[],
|
||||
progress: LessonProgress,
|
||||
): LessonCardModel[] {
|
||||
const outlines = lessons.map(outlineOf);
|
||||
const next = nextLesson(progress, outlines)?.number ?? null;
|
||||
return lessons.map((lesson, i) => {
|
||||
const outline = outlines[i] ?? outlineOf(lesson);
|
||||
const solved = lessonRecord(progress, lesson.number).solved;
|
||||
return {
|
||||
number: lesson.number,
|
||||
title: lesson.title,
|
||||
state: lessonState(progress, outline),
|
||||
exercises: outline.exercises.map((step) => solved.includes(step)),
|
||||
href: resumeHref(progress, lesson),
|
||||
current: lesson.number === next,
|
||||
};
|
||||
});
|
||||
}
|
||||
|
||||
/** La carte « prochaine leçon » de l'accueil (null : toutes terminées). */
|
||||
export function nextLessonCard(
|
||||
lessons: readonly Lesson[],
|
||||
progress: LessonProgress,
|
||||
): LessonCardModel | null {
|
||||
return lessonCards(lessons, progress).find((card) => card.current) ?? null;
|
||||
}
|
||||
@@ -0,0 +1,135 @@
|
||||
// La liste des leçons (#/lecons) et la carte d'une leçon, reprise par la
|
||||
// carte « prochaine leçon » de l'accueil
|
||||
// (docs/identite/charte/ecrans-etape-1.md, « 1g. Leçons »).
|
||||
//
|
||||
// Copyright (C) 2026 les auteurs d'Ustagammon.
|
||||
// Licence : GPLv3 ou ultérieure (voir LICENSE).
|
||||
|
||||
import { LESSON_TEXTS } from "./lesson-texts.js";
|
||||
import type { LessonCardModel } from "./lessons-model.js";
|
||||
|
||||
function element<K extends keyof HTMLElementTagNameMap>(
|
||||
parent: HTMLElement,
|
||||
tag: K,
|
||||
options: { id?: string; className?: string; text?: string } = {},
|
||||
): HTMLElementTagNameMap[K] {
|
||||
const child = document.createElement(tag);
|
||||
if (options.id !== undefined) {
|
||||
child.id = options.id;
|
||||
}
|
||||
if (options.className !== undefined) {
|
||||
child.className = options.className;
|
||||
}
|
||||
if (options.text !== undefined) {
|
||||
child.textContent = options.text;
|
||||
}
|
||||
parent.append(child);
|
||||
return child;
|
||||
}
|
||||
|
||||
/** La pastille ronde au numéro de la leçon : verte une fois terminée,
|
||||
* brique pour la leçon proposée, au contour sinon. */
|
||||
function badge(parent: HTMLElement, card: LessonCardModel): void {
|
||||
const kind = card.state.kind === "done" ? "done" : card.current ? "current" : "todo";
|
||||
const span = element(parent, "span", {
|
||||
className: `lesson-badge ${kind}`,
|
||||
text: String(card.number),
|
||||
});
|
||||
span.setAttribute("aria-hidden", "true");
|
||||
}
|
||||
|
||||
/** La barre de progression : un segment par exercice, en brique une fois
|
||||
* réussi. */
|
||||
function progressBar(parent: HTMLElement, card: LessonCardModel): void {
|
||||
const bar = element(parent, "span", { className: "lesson-progress" });
|
||||
bar.setAttribute("aria-hidden", "true");
|
||||
for (const done of card.exercises) {
|
||||
element(bar, "span", { className: done ? "segment done" : "segment" });
|
||||
}
|
||||
}
|
||||
|
||||
/** Le contenu d'une carte de leçon : pastille, numéro, titre, état et
|
||||
* progression. */
|
||||
export function fillLessonCard(target: HTMLElement, card: LessonCardModel): void {
|
||||
target.replaceChildren();
|
||||
const top = element(target, "span", { className: "lesson-card-top" });
|
||||
badge(top, card);
|
||||
const body = element(top, "span", { className: "lesson-card-body" });
|
||||
element(body, "span", { className: "overline", text: LESSON_TEXTS.number(card.number) });
|
||||
element(body, "strong", { className: "lesson-card-title", text: card.title });
|
||||
element(body, "span", {
|
||||
className: `lesson-card-state ${card.state.kind}`,
|
||||
text: LESSON_TEXTS.state(card.state),
|
||||
});
|
||||
if (card.state.kind !== "toStart" && card.state.total > 0) {
|
||||
progressBar(body, card);
|
||||
}
|
||||
}
|
||||
|
||||
/** Le libellé de l'action d'une leçon. */
|
||||
export function lessonAction(card: LessonCardModel): string {
|
||||
return card.state.kind === "toStart"
|
||||
? LESSON_TEXTS.start
|
||||
: card.state.kind === "done"
|
||||
? LESSON_TEXTS.review
|
||||
: LESSON_TEXTS.continue;
|
||||
}
|
||||
|
||||
export interface LessonsView {
|
||||
/** Les cartes (null : les leçons se chargent ; erreur : échec). */
|
||||
render(cards: readonly LessonCardModel[] | null, failed?: boolean): void;
|
||||
}
|
||||
|
||||
/** Crée la liste des leçons dans section (vide dans index.html). */
|
||||
export function createLessonsView(section: HTMLElement): LessonsView {
|
||||
section.replaceChildren();
|
||||
const head = element(section, "div", { className: "lessons-intro" });
|
||||
element(head, "h2", { text: LESSON_TEXTS.listTitle });
|
||||
element(head, "p", { className: "muted", text: LESSON_TEXTS.listLead });
|
||||
// Le rappel des règles : toute la ligne est le lien, haute de 44 px.
|
||||
const review = element(section, "a", { id: "lessons-rules", className: "lessons-rules" });
|
||||
review.append(`${LESSON_TEXTS.rulesReminder} · `);
|
||||
element(review, "span", { text: LESSON_TEXTS.rulesReview });
|
||||
review.href = "#/tutoriel/1";
|
||||
review.setAttribute("aria-label", LESSON_TEXTS.rulesReviewLabel);
|
||||
const status = element(section, "p", { id: "lessons-status", className: "muted" });
|
||||
status.setAttribute("role", "status");
|
||||
const list = element(section, "ol", { id: "lesson-list", className: "lesson-list" });
|
||||
|
||||
return {
|
||||
render(cards, failed = false) {
|
||||
status.textContent =
|
||||
cards !== null ? "" : failed ? LESSON_TEXTS.listFailed : LESSON_TEXTS.listLoading;
|
||||
list.replaceChildren();
|
||||
for (const card of cards ?? []) {
|
||||
const item = element(list, "li");
|
||||
// La leçon proposée porte la seule action principale ; les
|
||||
// autres cartes sont des liens, toutes restent ouvertes.
|
||||
if (card.current) {
|
||||
const article = element(item, "article", {
|
||||
id: `lesson-card-${card.number}`,
|
||||
className: "card lesson-card current",
|
||||
});
|
||||
const info = element(article, "div");
|
||||
fillLessonCard(info, card);
|
||||
const action = element(article, "a", {
|
||||
className: "button lesson-card-action",
|
||||
text: lessonAction(card),
|
||||
});
|
||||
action.href = card.href;
|
||||
action.setAttribute(
|
||||
"aria-label",
|
||||
`${lessonAction(card)} : ${LESSON_TEXTS.openLabel(card.number, card.title)}`,
|
||||
);
|
||||
} else {
|
||||
const link = element(item, "a", {
|
||||
id: `lesson-card-${card.number}`,
|
||||
className: "card lesson-card",
|
||||
});
|
||||
link.href = card.href;
|
||||
fillLessonCard(link, card);
|
||||
}
|
||||
}
|
||||
},
|
||||
};
|
||||
}
|
||||
@@ -24,6 +24,19 @@ export type Route =
|
||||
| { readonly screen: "tutorial"; readonly step: number | null; readonly practice: boolean }
|
||||
/** #/tutoriel/fin : la fin du tutoriel. */
|
||||
| { readonly screen: "tutorialEnd" }
|
||||
/** #/lecons : la liste des leçons (étape 1g). */
|
||||
| { readonly screen: "lessons" }
|
||||
/** #/lecons/<n> (son premier écran), une étape de la leçon n :
|
||||
* #/lecons/<n>/<étape>, et son exercice « à vous » :
|
||||
* #/lecons/<n>/<étape>/a-vous. */
|
||||
| {
|
||||
readonly screen: "lesson";
|
||||
readonly lesson: number;
|
||||
readonly step: number | null;
|
||||
readonly practice: boolean;
|
||||
}
|
||||
/** #/lecons/<n>/fin : la fin de la leçon n. */
|
||||
| { readonly screen: "lessonEnd"; readonly lesson: number }
|
||||
/** #/installer : la marche à suivre pour installer l'application. */
|
||||
| { readonly screen: "install" }
|
||||
/** #/parties, et une partie : #/parties/<identifiant>. */
|
||||
@@ -91,6 +104,9 @@ export function parseRoute(hash: string): Route {
|
||||
if (head === "tutoriel") {
|
||||
return tutorialRoute(rest) ?? unknown;
|
||||
}
|
||||
if (head === "lecons") {
|
||||
return lessonRoute(rest) ?? unknown;
|
||||
}
|
||||
if (head === "parties" && rest.length > 1) {
|
||||
return gameReviewRoute(rest) ?? unknown;
|
||||
}
|
||||
@@ -194,6 +210,29 @@ function tutorialRoute(rest: readonly string[]): Route | null {
|
||||
return { screen: "tutorial", step: Number(name), practice: part === "a-vous" };
|
||||
}
|
||||
|
||||
/** #/lecons, #/lecons/<n>, #/lecons/<n>/<étape>, #/lecons/<n>/<étape>/a-vous,
|
||||
* #/lecons/<n>/fin. */
|
||||
function lessonRoute(rest: readonly string[]): Route | null {
|
||||
const [number, name, part, ...more] = rest;
|
||||
if (number === undefined) {
|
||||
return { screen: "lessons" };
|
||||
}
|
||||
if (!/^[1-9]$/.test(number) || more.length > 0) {
|
||||
return null;
|
||||
}
|
||||
const lesson = Number(number);
|
||||
if (name === undefined) {
|
||||
return { screen: "lesson", lesson, step: null, practice: false };
|
||||
}
|
||||
if (name === "fin") {
|
||||
return part === undefined ? { screen: "lessonEnd", lesson } : null;
|
||||
}
|
||||
if (!/^[1-9][0-9]?$/.test(name) || (part !== undefined && part !== "a-vous")) {
|
||||
return null;
|
||||
}
|
||||
return { screen: "lesson", lesson, step: Number(name), practice: part === "a-vous" };
|
||||
}
|
||||
|
||||
/**
|
||||
* #/position/... : le Position ID (14 caractères), puis, après une barre, le
|
||||
* Match ID. Chaque identifiant est encodé avec encodeURIComponent, mais une
|
||||
@@ -246,6 +285,14 @@ function screenHash(route: Route): string {
|
||||
: `#/tutoriel/${route.step}${route.practice ? "/a-vous" : ""}`;
|
||||
case "tutorialEnd":
|
||||
return "#/tutoriel/fin";
|
||||
case "lessons":
|
||||
return "#/lecons";
|
||||
case "lesson":
|
||||
return route.step === null
|
||||
? `#/lecons/${route.lesson}`
|
||||
: `#/lecons/${route.lesson}/${route.step}${route.practice ? "/a-vous" : ""}`;
|
||||
case "lessonEnd":
|
||||
return `#/lecons/${route.lesson}/fin`;
|
||||
case "install":
|
||||
return "#/installer";
|
||||
case "games":
|
||||
|
||||
@@ -19,14 +19,19 @@ export function placeOf(tutorial: Tutorial, route: Route): TutorialPlace {
|
||||
if (route.screen === "tutorialEnd") {
|
||||
return "end";
|
||||
}
|
||||
if (route.screen !== "tutorial" || route.step === null) {
|
||||
return { step: 1, practice: false };
|
||||
}
|
||||
const step = tutorial.steps[route.step - 1];
|
||||
return route.screen === "tutorial"
|
||||
? existingPlace(tutorial, route.step, route.practice)
|
||||
: { step: 1, practice: false };
|
||||
}
|
||||
|
||||
/** Le même écran qu'une adresse d'étape, s'il existe ; sinon la première
|
||||
* étape (étape absente), ou l'explication (« à vous » absent). */
|
||||
function existingPlace(tutorial: Tutorial, at: number | null, practice: boolean): TutorialPlace {
|
||||
const step = at === null ? undefined : tutorial.steps[at - 1];
|
||||
if (step === undefined) {
|
||||
return { step: 1, practice: false };
|
||||
}
|
||||
return { step: step.number, practice: route.practice && step.practice !== null };
|
||||
return { step: step.number, practice: practice && step.practice !== null };
|
||||
}
|
||||
|
||||
/** L'adresse d'un écran du tutoriel. */
|
||||
@@ -36,6 +41,24 @@ export function placeRoute(place: TutorialPlace): Route {
|
||||
: { screen: "tutorial", step: place.step, practice: place.practice };
|
||||
}
|
||||
|
||||
/** L'écran d'une leçon que désigne une adresse (#/lecons/<n>/...), ramené à
|
||||
* un écran qui existe, comme placeOf pour le tutoriel. */
|
||||
export function lessonPlaceOf(lesson: Tutorial, route: Route): TutorialPlace {
|
||||
if (route.screen === "lessonEnd") {
|
||||
return "end";
|
||||
}
|
||||
return route.screen === "lesson"
|
||||
? existingPlace(lesson, route.step, route.practice)
|
||||
: { step: 1, practice: false };
|
||||
}
|
||||
|
||||
/** L'adresse d'un écran de la leçon number. */
|
||||
export function lessonPlaceRoute(number: number, place: TutorialPlace): Route {
|
||||
return place === "end"
|
||||
? { screen: "lessonEnd", lesson: number }
|
||||
: { screen: "lesson", lesson: number, step: place.step, practice: place.practice };
|
||||
}
|
||||
|
||||
/** L'écran suivant (la fin après la dernière étape). */
|
||||
export function nextPlace(tutorial: Tutorial, place: TutorialPlace): TutorialPlace {
|
||||
if (place === "end") {
|
||||
|
||||
@@ -26,6 +26,9 @@ export interface TutorialScreen {
|
||||
readonly move: string | null;
|
||||
/** Explication : le sens du jeu, deux flèches circulaires. */
|
||||
readonly path: boolean;
|
||||
/** Les comptes de points de la position que cite le texte (vous,
|
||||
* l'ordinateur), vérifiés par les tests ; null s'il n'en cite pas. */
|
||||
readonly pips: readonly [number, number] | null;
|
||||
/** « À vous » : les coups justes, en notation de gnubg. */
|
||||
readonly expected: readonly string[];
|
||||
/** « À vous » de videau : la bonne réponse au double. */
|
||||
@@ -90,6 +93,17 @@ function rollOf(text: string | undefined, where: string): readonly [number, numb
|
||||
return [Number(match[1]), Number(match[2])];
|
||||
}
|
||||
|
||||
function pipsOf(text: string | undefined, where: string): readonly [number, number] | null {
|
||||
if (text === undefined) {
|
||||
return null;
|
||||
}
|
||||
const match = /^(\d+)\/(\d+)$/.exec(text);
|
||||
if (match === null) {
|
||||
throw new Error(`${where} : compte illisible « ${text} »`);
|
||||
}
|
||||
return [Number(match[1]), Number(match[2])];
|
||||
}
|
||||
|
||||
function screenOf(raw: RawScreen, where: string): TutorialScreen {
|
||||
const one = (key: string) => raw.keys.get(key)?.[0];
|
||||
const position = one("position");
|
||||
@@ -110,6 +124,7 @@ function screenOf(raw: RawScreen, where: string): TutorialScreen {
|
||||
roll: rollOf(one("jet"), where),
|
||||
move: one("coup") ?? null,
|
||||
path: one("chemin") === "oui",
|
||||
pips: pipsOf(one("compte"), where),
|
||||
expected: raw.keys.get("attendu") ?? [],
|
||||
answer: answer === undefined ? null : answer === "prendre" ? "take" : "pass",
|
||||
right: parseInline(one("juste") ?? ""),
|
||||
|
||||
+137
-75
@@ -2,11 +2,14 @@
|
||||
// #/tutoriel/fin) : la barre de progression, le titre, le plateau, le texte,
|
||||
// et les écrans « à vous » où le joueur fait le geste sur le vrai plateau
|
||||
// (docs/identite/charte/accueil-tutoriel-aide.md, « Tutoriel des règles »).
|
||||
// Les leçons (#/lecons/<n>/..., étape 1g) reprennent le même écran, avec
|
||||
// leur texte et leurs adresses (Course).
|
||||
//
|
||||
// Copyright (C) 2026 les auteurs d'Ustagammon.
|
||||
// Licence : GPLv3 ou ultérieure (voir LICENSE).
|
||||
//
|
||||
// Le texte vient de docs/tutoriel/regles.md (copie du site) ; les plateaux,
|
||||
// Le texte vient de docs/tutoriel/regles.md ou de docs/lecons/ (copies du
|
||||
// site) ; les plateaux,
|
||||
// les coups illustrés et le jugement des gestes viennent du domaine, branché
|
||||
// sur le moteur (TutorialAccess, assemblé dans main.ts). Aucune règle n'est
|
||||
// écrite ici.
|
||||
@@ -39,20 +42,8 @@ import { boardGeometry, columnLeft, type Geometry, PORTRAIT_ASPECT } from "./geo
|
||||
import { HOME_TEXTS } from "./home-texts.js";
|
||||
import { icon } from "./icons.js";
|
||||
import { type Route, routeHash } from "./router.js";
|
||||
import {
|
||||
nextPlace,
|
||||
placeOf,
|
||||
placeRoute,
|
||||
previousPlace,
|
||||
progress,
|
||||
type TutorialPlace,
|
||||
} from "./tutorial-nav.js";
|
||||
import {
|
||||
type Paragraph,
|
||||
parseTutorial,
|
||||
type Tutorial,
|
||||
type TutorialScreen,
|
||||
} from "./tutorial-text.js";
|
||||
import { nextPlace, previousPlace, progress, type TutorialPlace } from "./tutorial-nav.js";
|
||||
import type { Paragraph, Tutorial, TutorialScreen } from "./tutorial-text.js";
|
||||
|
||||
/** Le coup illustré se joue tout seul après une seconde. */
|
||||
const AUTOPLAY_MS = 1000;
|
||||
@@ -61,7 +52,32 @@ const PAUSE_MS = 120;
|
||||
/** Un pion refusé reste un instant à sa place avant de revenir. */
|
||||
const REFUSED_MS = 450;
|
||||
|
||||
const SOURCE = "docs/tutoriel/regles.md";
|
||||
/** Le texte du tutoriel, copié dans le site (make site). */
|
||||
export const TUTORIAL_SOURCE = "docs/tutoriel/regles.md";
|
||||
|
||||
/**
|
||||
* Un texte du site, lu une fois puis gardé : la fonction renvoyée le
|
||||
* télécharge à son premier appel et le relit avec parse. Un échec n'est
|
||||
* pas gardé : l'appel suivant réessaie.
|
||||
*/
|
||||
export function cachedText<T>(source: string, parse: (text: string) => T): () => Promise<T> {
|
||||
let loaded: Promise<T> | null = null;
|
||||
return () => {
|
||||
loaded ??= fetch(source)
|
||||
.then((response) => {
|
||||
if (!response.ok) {
|
||||
throw new Error(`${source} : ${response.status}`);
|
||||
}
|
||||
return response.text();
|
||||
})
|
||||
.then(parse)
|
||||
.catch((error: unknown) => {
|
||||
loaded = null;
|
||||
throw error;
|
||||
});
|
||||
return loaded;
|
||||
};
|
||||
}
|
||||
|
||||
/** Un écran « à vous » où l'on joue un coup (MovePractice du domaine). */
|
||||
export interface PracticeSession {
|
||||
@@ -87,14 +103,53 @@ export interface TutorialAccess {
|
||||
shouldTake(position: string): Promise<boolean>;
|
||||
}
|
||||
|
||||
/**
|
||||
* Un parcours d'écrans courts : le tutoriel des règles, ou une leçon (étape
|
||||
* 1g), qui en reprennent la forme (charte, « 1g. Leçons »). Ce qui les
|
||||
* distingue : leur texte, leurs adresses, leurs libellés, et ce que retient
|
||||
* la progression.
|
||||
*/
|
||||
export interface Course {
|
||||
/** Préfixe des identifiants des éléments de l'écran (« tutorial »,
|
||||
* « lesson ») : deux parcours peuvent coexister dans la page. */
|
||||
readonly id: string;
|
||||
/** Le texte du parcours que désigne l'adresse. */
|
||||
load(route: Route): Promise<Tutorial>;
|
||||
/** L'écran que désigne l'adresse, ramené à un écran qui existe. */
|
||||
placeOf(text: Tutorial, route: Route): TutorialPlace;
|
||||
/** L'adresse d'un écran du même parcours que route. */
|
||||
routeOf(route: Route, place: TutorialPlace): Route;
|
||||
/** La dernière étape déjà vue : la barre de progression n'en mène pas
|
||||
* plus loin. */
|
||||
seen(route: Route): number;
|
||||
/** L'arrivée sur un écran. */
|
||||
visit(route: Route, place: TutorialPlace): void;
|
||||
/** Un écran « à vous » réussi. */
|
||||
solved(route: Route, place: TutorialPlace): void;
|
||||
/** « Quitter » : où il mène. */
|
||||
quitHref(route: Route): string;
|
||||
/** « Retour » sur le premier écran. */
|
||||
firstBackHref(route: Route): string;
|
||||
/** L'action de l'écran de fin. */
|
||||
endHref(route: Route): string;
|
||||
readonly texts: {
|
||||
readonly progress: string;
|
||||
readonly stepLink: (n: number, title: string) => string;
|
||||
readonly quit: string;
|
||||
readonly quitLabel: string;
|
||||
readonly overline: (text: Tutorial, n: number, total: number, practice: boolean) => string;
|
||||
readonly endOverline: (text: Tutorial) => string;
|
||||
readonly endTitle: (text: Tutorial) => string;
|
||||
readonly loading: string;
|
||||
readonly failed: string;
|
||||
};
|
||||
}
|
||||
|
||||
export interface TutorialViewOptions {
|
||||
readonly section: HTMLElement;
|
||||
readonly access: TutorialAccess;
|
||||
readonly engineReady: Promise<unknown>;
|
||||
/** La dernière étape vue, et son enregistrement à l'arrivée sur un
|
||||
* écran. */
|
||||
readonly seen: () => number;
|
||||
readonly visit: (place: TutorialPlace) => void;
|
||||
readonly course: Course;
|
||||
/** Un geste juste : la vibration « pion posé ». */
|
||||
readonly placed: () => void;
|
||||
readonly reducedMotion: MediaQueryList;
|
||||
@@ -221,24 +276,30 @@ function drawDirections(svg: SVGSVGElement, g: Geometry, pxPerUnit: number): voi
|
||||
|
||||
/** Crée l'écran du tutoriel dans section (vide dans index.html). */
|
||||
export function createTutorialView(options: TutorialViewOptions): TutorialView {
|
||||
const { section, access } = options;
|
||||
const { section, access, course } = options;
|
||||
const idOf = (name: string) => `${course.id}-${name}`;
|
||||
section.replaceChildren();
|
||||
const head = element(section, "header", { className: "tutorial-head" });
|
||||
const bar = element(head, "nav", { id: "tutorial-progress", className: "tutorial-progress" });
|
||||
bar.setAttribute("aria-label", HOME_TEXTS.tutorialProgress);
|
||||
const skip = element(head, "a", { id: "tutorial-skip", className: "tutorial-skip" });
|
||||
const bar = element(head, "nav", { id: idOf("progress"), className: "tutorial-progress" });
|
||||
bar.setAttribute("aria-label", course.texts.progress);
|
||||
const skip = element(head, "a", { id: idOf("skip"), className: "tutorial-skip" });
|
||||
skip.href = "#/";
|
||||
skip.textContent = HOME_TEXTS.tutorialSkip;
|
||||
skip.setAttribute("aria-label", HOME_TEXTS.tutorialSkipLabel);
|
||||
const overline = element(section, "p", { id: "tutorial-overline", className: "overline" });
|
||||
const title = element(section, "h2", { id: "tutorial-title", className: "tutorial-title" });
|
||||
skip.textContent = course.texts.quit;
|
||||
skip.setAttribute("aria-label", course.texts.quitLabel);
|
||||
const overline = element(section, "p", { id: idOf("overline"), className: "overline" });
|
||||
// Le titre, et « Revoir » à sa droite (en portrait comme en paysage).
|
||||
const titleRow = element(section, "div", { className: "tutorial-title-row" });
|
||||
const title = element(titleRow, "h2", { id: idOf("title"), className: "tutorial-title" });
|
||||
const boardBox = element(section, "div", { className: "tutorial-board-box" });
|
||||
const svg = document.createElementNS(SVG_NS, "svg");
|
||||
svg.id = "tutorial-board";
|
||||
svg.id = idOf("board");
|
||||
svg.setAttribute("class", "board tutorial-board");
|
||||
svg.setAttribute("role", "img");
|
||||
boardBox.append(svg);
|
||||
const replay = element(boardBox, "button", { id: "tutorial-replay", className: "icon-button" });
|
||||
const replay = element(titleRow, "button", {
|
||||
id: idOf("replay"),
|
||||
className: "icon-button tutorial-replay",
|
||||
});
|
||||
replay.type = "button";
|
||||
replay.append(icon("replay"));
|
||||
replay.setAttribute("aria-label", HOME_TEXTS.replayLabel);
|
||||
@@ -246,39 +307,43 @@ export function createTutorialView(options: TutorialViewOptions): TutorialView {
|
||||
// Le texte, la consigne « à vous » et la réponse : en paysage, la seule
|
||||
// partie qui défile si l'écran est trop bas (app.css).
|
||||
const body = element(section, "div", { className: "tutorial-body" });
|
||||
const text = element(body, "div", { id: "tutorial-text", className: "tutorial-text" });
|
||||
const task = element(body, "p", { id: "tutorial-task", className: "tutorial-task" });
|
||||
const text = element(body, "div", { id: idOf("text"), className: "tutorial-text" });
|
||||
const task = element(body, "p", { id: idOf("task"), className: "tutorial-task" });
|
||||
const feedback = element(body, "p", {
|
||||
id: "tutorial-feedback",
|
||||
id: idOf("feedback"),
|
||||
className: "tutorial-feedback",
|
||||
});
|
||||
feedback.setAttribute("role", "status");
|
||||
const cube = element(section, "div", { id: "tutorial-cube", className: "tutorial-cube" });
|
||||
const cube = element(section, "div", { id: idOf("cube"), className: "tutorial-cube" });
|
||||
const drop = element(cube, "button", {
|
||||
id: "tutorial-drop",
|
||||
id: idOf("drop"),
|
||||
className: "secondary",
|
||||
text: HOME_TEXTS.drop,
|
||||
});
|
||||
drop.type = "button";
|
||||
const take = element(cube, "button", {
|
||||
id: "tutorial-take",
|
||||
id: idOf("take"),
|
||||
className: "secondary",
|
||||
text: HOME_TEXTS.take,
|
||||
});
|
||||
take.type = "button";
|
||||
const nav = element(section, "div", { className: "tutorial-nav" });
|
||||
const back = element(nav, "a", {
|
||||
id: "tutorial-back",
|
||||
id: idOf("back"),
|
||||
className: "button secondary",
|
||||
text: HOME_TEXTS.back,
|
||||
});
|
||||
const next = element(nav, "a", {
|
||||
id: "tutorial-next",
|
||||
id: idOf("next"),
|
||||
className: "button",
|
||||
text: HOME_TEXTS.next,
|
||||
});
|
||||
|
||||
let tutorial: Promise<Tutorial> | null = null;
|
||||
// Le dernier texte lu : tant qu'il n'y en a pas, l'écran dit qu'il se
|
||||
// charge.
|
||||
let lastText: Tutorial | null = null;
|
||||
// L'adresse affichée.
|
||||
let shownRoute: Route | null = null;
|
||||
// Chaque affichage a son numéro : un affichage dépassé ne touche plus
|
||||
// à l'écran (le joueur est déjà ailleurs).
|
||||
let shown = 0;
|
||||
@@ -302,22 +367,6 @@ export function createTutorialView(options: TutorialViewOptions): TutorialView {
|
||||
let selected: Place | null = null;
|
||||
let solved = false;
|
||||
|
||||
const load = () => {
|
||||
tutorial ??= fetch(SOURCE)
|
||||
.then((response) => {
|
||||
if (!response.ok) {
|
||||
throw new Error(`${SOURCE} : ${response.status}`);
|
||||
}
|
||||
return response.text();
|
||||
})
|
||||
.then(parseTutorial)
|
||||
.catch((error: unknown) => {
|
||||
tutorial = null;
|
||||
throw error;
|
||||
});
|
||||
return tutorial;
|
||||
};
|
||||
|
||||
/** En paysage, le plateau occupe toute la hauteur, à gauche de la
|
||||
* colonne du texte (app.css), avec la géométrie du jeu en paysage. */
|
||||
function geometry(): Geometry {
|
||||
@@ -456,6 +505,9 @@ export function createTutorialView(options: TutorialViewOptions): TutorialView {
|
||||
take.disabled = true;
|
||||
drop.disabled = true;
|
||||
options.placed();
|
||||
if (shownRoute !== null && place !== null) {
|
||||
course.solved(shownRoute, place);
|
||||
}
|
||||
}
|
||||
|
||||
async function playHalfMove(halfMove: HalfMove): Promise<void> {
|
||||
@@ -550,17 +602,21 @@ export function createTutorialView(options: TutorialViewOptions): TutorialView {
|
||||
take.addEventListener("click", () => void answer(true));
|
||||
drop.addEventListener("click", () => void answer(false));
|
||||
|
||||
function renderProgress(total: number, at: TutorialPlace, steps: Tutorial["steps"]): void {
|
||||
function renderProgress(route: Route, at: TutorialPlace, loaded: Tutorial): void {
|
||||
const steps = loaded.steps;
|
||||
const total = steps.length;
|
||||
bar.replaceChildren();
|
||||
for (const segment of progress(total, at, options.seen())) {
|
||||
for (const segment of progress(total, at, course.seen(route))) {
|
||||
const stepTitle = steps[segment.step - 1]?.title ?? "";
|
||||
const label = HOME_TEXTS.tutorialStepLink(segment.step, stepTitle);
|
||||
const label = course.texts.stepLink(segment.step, stepTitle);
|
||||
const item = segment.link
|
||||
? document.createElement("a")
|
||||
: document.createElement("span");
|
||||
item.className = `segment${segment.done ? " done" : ""}`;
|
||||
if (item instanceof HTMLAnchorElement) {
|
||||
item.href = routeHash({ screen: "tutorial", step: segment.step, practice: false });
|
||||
item.href = routeHash(
|
||||
course.routeOf(route, { step: segment.step, practice: false }),
|
||||
);
|
||||
item.setAttribute("aria-label", label);
|
||||
} else {
|
||||
item.setAttribute("aria-hidden", "true");
|
||||
@@ -573,8 +629,8 @@ export function createTutorialView(options: TutorialViewOptions): TutorialView {
|
||||
bar.setAttribute(
|
||||
"aria-description",
|
||||
at === "end"
|
||||
? HOME_TEXTS.tutorialEndOverline
|
||||
: HOME_TEXTS.tutorialOverline(at.step, total, at.practice),
|
||||
? course.texts.endOverline(loaded)
|
||||
: course.texts.overline(loaded, at.step, total, at.practice),
|
||||
);
|
||||
}
|
||||
|
||||
@@ -603,42 +659,48 @@ export function createTutorialView(options: TutorialViewOptions): TutorialView {
|
||||
drop.disabled = false;
|
||||
let loaded: Tutorial;
|
||||
try {
|
||||
if (tutorial === null) {
|
||||
title.textContent = HOME_TEXTS.tutorialLoading;
|
||||
if (lastText === null) {
|
||||
title.textContent = course.texts.loading;
|
||||
text.replaceChildren();
|
||||
svg.replaceChildren();
|
||||
}
|
||||
loaded = await load();
|
||||
loaded = await course.load(route);
|
||||
} catch {
|
||||
if (id === shown) {
|
||||
title.textContent = HOME_TEXTS.tutorialFailed;
|
||||
title.textContent = course.texts.failed;
|
||||
}
|
||||
return;
|
||||
}
|
||||
if (id !== shown) {
|
||||
return;
|
||||
}
|
||||
const at = placeOf(loaded, route);
|
||||
const wanted = routeHash(placeRoute(at));
|
||||
lastText = loaded;
|
||||
const at = course.placeOf(loaded, route);
|
||||
const wanted = routeHash(course.routeOf(route, at));
|
||||
if (routeHash(route) !== wanted) {
|
||||
options.replace(wanted);
|
||||
return;
|
||||
}
|
||||
place = at;
|
||||
options.visit(at);
|
||||
shownRoute = route;
|
||||
course.visit(route, at);
|
||||
const total = loaded.steps.length;
|
||||
renderProgress(total, at, loaded.steps);
|
||||
renderProgress(route, at, loaded);
|
||||
skip.href = course.quitHref(route);
|
||||
const before = previousPlace(loaded, at);
|
||||
back.href = before === null ? "#/accueil" : routeHash(placeRoute(before));
|
||||
back.href =
|
||||
before === null
|
||||
? course.firstBackHref(route)
|
||||
: routeHash(course.routeOf(route, before));
|
||||
if (at === "end") {
|
||||
overline.textContent = HOME_TEXTS.tutorialEndOverline;
|
||||
title.textContent = HOME_TEXTS.tutorialEndTitle;
|
||||
overline.textContent = course.texts.endOverline(loaded);
|
||||
title.textContent = course.texts.endTitle(loaded);
|
||||
text.replaceChildren();
|
||||
for (const paragraph of loaded.end.paragraphs) {
|
||||
fillParagraph(element(text, "p"), paragraph);
|
||||
}
|
||||
next.textContent = loaded.end.action;
|
||||
next.href = "#/";
|
||||
next.href = course.endHref(route);
|
||||
next.classList.remove("secondary");
|
||||
screen = loaded.steps[0]?.explain ?? null;
|
||||
} else {
|
||||
@@ -648,7 +710,7 @@ export function createTutorialView(options: TutorialViewOptions): TutorialView {
|
||||
return;
|
||||
}
|
||||
screen = { ...current, path: current.path && !at.practice };
|
||||
overline.textContent = HOME_TEXTS.tutorialOverline(at.step, total, at.practice);
|
||||
overline.textContent = course.texts.overline(loaded, at.step, total, at.practice);
|
||||
title.textContent = step.title;
|
||||
text.replaceChildren();
|
||||
const paragraphs = at.practice ? [] : current.paragraphs;
|
||||
@@ -669,7 +731,7 @@ export function createTutorialView(options: TutorialViewOptions): TutorialView {
|
||||
}
|
||||
const after = nextPlace(loaded, at);
|
||||
next.textContent = HOME_TEXTS.next;
|
||||
next.href = routeHash(placeRoute(after));
|
||||
next.href = routeHash(course.routeOf(route, after));
|
||||
next.classList.toggle("secondary", at.practice);
|
||||
}
|
||||
const currentScreen = screen;
|
||||
|
||||
@@ -0,0 +1,440 @@
|
||||
// Tests des leçons (étape 1g) : le texte des cinq leçons (docs/lecons/) se
|
||||
// lit ; chaque position est valide pour le vrai moteur ; chaque coup attendu
|
||||
// d'un exercice est le meilleur coup du moteur à 2 plis, avec plus de 0,04
|
||||
// d'avance sur le deuxième, et seul accepté ; chaque coup illustré est aussi
|
||||
// le meilleur coup ; chaque compte de points cité est celui du moteur. Puis
|
||||
// la progression : sa lecture (formats durables, ADR 0007), son
|
||||
// enregistrement, les états affichés et la leçon proposée.
|
||||
//
|
||||
// Copyright (C) 2026 les auteurs d'Ustagammon.
|
||||
// Licence : GPLv3 ou ultérieure (voir LICENSE).
|
||||
|
||||
import assert from "node:assert/strict";
|
||||
import { existsSync, readdirSync, readFileSync } from "node:fs";
|
||||
import { test } from "node:test";
|
||||
import type { Engine, EngineCube } from "../src/domain/game/engine.js";
|
||||
import type { Roll } from "../src/domain/game/roll.js";
|
||||
import {
|
||||
finishedLessons,
|
||||
LESSON_END,
|
||||
LESSON_PROGRESS_VERSION,
|
||||
type LessonOutline,
|
||||
lessonRecord,
|
||||
lessonState,
|
||||
NO_PROGRESS,
|
||||
nextLesson,
|
||||
readLessonProgress,
|
||||
resumeStep,
|
||||
withSolved,
|
||||
withVisit,
|
||||
} from "../src/domain/learning/lessons.js";
|
||||
import { MovePractice, tutorialBoard } from "../src/domain/learning/tutorial.js";
|
||||
import { createKeyValueBackend } from "../src/storage/key-value-backend.js";
|
||||
import { createLessonStore } from "../src/storage/lesson-store.js";
|
||||
import { memoryStorage } from "../src/storage/open-library.js";
|
||||
import { LESSON_COUNT, type Lesson, outlineOf, parseLesson } from "../src/ui/lesson-text.js";
|
||||
import { LESSON_TEXTS } from "../src/ui/lesson-texts.js";
|
||||
import { lessonCards, nextLessonCard } from "../src/ui/lessons-model.js";
|
||||
import { lessonPlaceOf, lessonPlaceRoute } from "../src/ui/tutorial-nav.js";
|
||||
import type { TutorialScreen } from "../src/ui/tutorial-text.js";
|
||||
import { loadNodeEngine } from "./support/node-engine.js";
|
||||
|
||||
const root = new URL("../../../", import.meta.url);
|
||||
const lessons: Lesson[] = Array.from({ length: LESSON_COUNT }, (_, i) =>
|
||||
parseLesson(i + 1, readFileSync(new URL(`docs/lecons/lecon-${i + 1}.md`, root), "utf8")),
|
||||
);
|
||||
|
||||
/** Niveau d'analyse des réponses attendues (décision de Pierre). */
|
||||
const PLY = 2;
|
||||
/** Avance minimale du coup attendu sur le deuxième : un exercice n'a
|
||||
* qu'une bonne réponse nette. */
|
||||
const MIN_GAP = 0.04;
|
||||
const CENTERED: EngineCube = { value: 1, owner: "centered" };
|
||||
|
||||
/** Les écrans d'une leçon, avec leur nom pour les messages. */
|
||||
function screens(lesson: Lesson): [string, TutorialScreen][] {
|
||||
return lesson.steps.flatMap((s) => [
|
||||
[`leçon ${lesson.number}, étape ${s.number}`, s.explain] as [string, TutorialScreen],
|
||||
...(s.practice === null
|
||||
? []
|
||||
: [
|
||||
[`leçon ${lesson.number}, étape ${s.number}, à vous`, s.practice] as [
|
||||
string,
|
||||
TutorialScreen,
|
||||
],
|
||||
]),
|
||||
]);
|
||||
}
|
||||
const allScreens = () => lessons.flatMap(screens);
|
||||
|
||||
/** Le classement du moteur à 2 plis pour un coup : son rang, et l'écart
|
||||
* avec le meilleur coup suivant (positif : le coup a cette avance). */
|
||||
async function rankOf(
|
||||
engine: Engine,
|
||||
position: string,
|
||||
roll: Roll,
|
||||
notation: string,
|
||||
): Promise<{ rank: number; best: string; gap: number; second: string }> {
|
||||
const legal = await engine.legalMoves(position, roll);
|
||||
const move = legal.find((m) => m.notation === notation);
|
||||
assert.ok(move !== undefined, `${notation} n'est pas un coup légal de ${roll.join("-")}`);
|
||||
const analysis = await engine.analyseMove(position, CENTERED, roll, move.position, PLY);
|
||||
assert.ok(analysis !== null, `${notation} : aucune analyse`);
|
||||
const second = analysis.ranking.find((m) => m.position !== analysis.best.position);
|
||||
assert.ok(second !== undefined, `${notation} : un seul coup possible, rien à choisir`);
|
||||
// Le deuxième coup analysé à son tour : l'analyse le réévalue au même
|
||||
// niveau que le meilleur, ce qui donne l'écart exact.
|
||||
const other = await engine.analyseMove(position, CENTERED, roll, second.position, PLY);
|
||||
assert.ok(other !== null);
|
||||
return {
|
||||
rank: analysis.rank,
|
||||
best: analysis.best.notation,
|
||||
gap: -other.equityLoss,
|
||||
second: second.notation,
|
||||
};
|
||||
}
|
||||
|
||||
test("cinq leçons, de deux à quatre exercices chacune, avec un titre et une fin", () => {
|
||||
assert.equal(lessons.length, 5);
|
||||
assert.deepEqual(
|
||||
readdirSync(new URL("docs/lecons/", root))
|
||||
.filter((f) => f.startsWith("lecon-"))
|
||||
.sort(),
|
||||
["lecon-1.md", "lecon-2.md", "lecon-3.md", "lecon-4.md", "lecon-5.md"],
|
||||
);
|
||||
assert.deepEqual(
|
||||
lessons.map((l) => l.title),
|
||||
[
|
||||
"Les ouvertures",
|
||||
"Faire des points",
|
||||
"Frapper ou ne pas frapper",
|
||||
"La course et le compte de points",
|
||||
"Sortir sans se faire frapper",
|
||||
],
|
||||
);
|
||||
for (const lesson of lessons) {
|
||||
const exercises = outlineOf(lesson).exercises.length;
|
||||
assert.ok(
|
||||
exercises >= 2 && exercises <= 4,
|
||||
`leçon ${lesson.number} : ${exercises} exercices`,
|
||||
);
|
||||
assert.ok(lesson.end.action !== "" && lesson.end.paragraphs.length > 0);
|
||||
for (const step of lesson.steps) {
|
||||
assert.ok(
|
||||
step.explain.paragraphs.length > 0,
|
||||
`leçon ${lesson.number}, étape ${step.number} sans texte`,
|
||||
);
|
||||
const practice = step.practice;
|
||||
if (practice !== null) {
|
||||
assert.ok(
|
||||
practice.paragraphs.length > 0,
|
||||
`leçon ${lesson.number} : consigne absente`,
|
||||
);
|
||||
assert.ok(practice.right.length > 0 && practice.wrong.length > 0);
|
||||
assert.equal(practice.expected.length, 1, "un seul coup attendu par exercice");
|
||||
assert.ok(practice.roll !== null);
|
||||
}
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
test("le texte des leçons garde le ton du maître et les mots du glossaire", () => {
|
||||
for (const lesson of lessons) {
|
||||
const text = readFileSync(new URL(`docs/lecons/lecon-${lesson.number}.md`, root), "utf8");
|
||||
// Pas de point d'exclamation, pas de « camp » (remplacé par les
|
||||
// jans), pas de reproche.
|
||||
assert.ok(!text.includes("!"), `leçon ${lesson.number} : point d'exclamation`);
|
||||
assert.ok(!/\bcamp\b/i.test(text), `leçon ${lesson.number} : « camp »`);
|
||||
assert.ok(
|
||||
!/vous auriez dû|il fallait|erreur/i.test(text),
|
||||
`leçon ${lesson.number} : reproche`,
|
||||
);
|
||||
assert.ok(text.includes("CC BY-SA 4.0"), `leçon ${lesson.number} : licence`);
|
||||
const inlines = screens(lesson).flatMap(([, s]) => [
|
||||
...s.paragraphs.flat(),
|
||||
...s.right,
|
||||
...s.wrong,
|
||||
]);
|
||||
for (const term of inlines.flatMap((i) => (i.term === undefined ? [] : [i.term]))) {
|
||||
assert.ok(
|
||||
existsSync(new URL(`docs/glossaire/${term}.md`, root)),
|
||||
`fiche ${term}.md absente`,
|
||||
);
|
||||
}
|
||||
}
|
||||
const terms = new Set(
|
||||
lessons
|
||||
.flatMap((l) => screens(l).flatMap(([, s]) => s.paragraphs.flat()))
|
||||
.flatMap((i) => (i.term === undefined ? [] : [i.term])),
|
||||
);
|
||||
for (const term of ["jan-interieur", "jan-exterieur", "point", "blot", "compte-de-points"]) {
|
||||
assert.ok(terms.has(term), `aucun lien vers ${term}.md`);
|
||||
}
|
||||
});
|
||||
|
||||
test("chaque position des leçons est valide, et ses comptes de points sont ceux du moteur", async () => {
|
||||
const engine = await loadNodeEngine();
|
||||
let counts = 0;
|
||||
for (const [name, screen] of allScreens()) {
|
||||
const board = await tutorialBoard(engine, screen.position, screen.onRoll);
|
||||
for (const side of ["player", "computer"] as const) {
|
||||
const s = board.sides[side];
|
||||
assert.equal(
|
||||
s.points.reduce((a, b) => a + b, 0) + s.bar + s.off,
|
||||
15,
|
||||
`${name} : ${side}`,
|
||||
);
|
||||
}
|
||||
assert.equal(board.result, null, `${name} : partie finie`);
|
||||
if (screen.pips !== null) {
|
||||
counts++;
|
||||
assert.deepEqual(
|
||||
[board.sides.player.pipCount, board.sides.computer.pipCount],
|
||||
screen.pips,
|
||||
`${name} : comptes de points`,
|
||||
);
|
||||
}
|
||||
}
|
||||
assert.ok(counts >= 4, "la leçon 4 cite les comptes de points");
|
||||
});
|
||||
|
||||
test("chaque coup attendu est le meilleur coup du moteur à 2 plis, avec plus de 0,04 d'avance", async () => {
|
||||
const engine = await loadNodeEngine();
|
||||
const report: string[] = [];
|
||||
for (const [name, screen] of allScreens()) {
|
||||
const notation = screen.expected[0];
|
||||
if (notation === undefined || screen.roll === null) {
|
||||
continue;
|
||||
}
|
||||
const ranked = await rankOf(engine, screen.position, screen.roll, notation);
|
||||
assert.equal(ranked.rank, 1, `${name} : le moteur préfère ${ranked.best} à ${notation}`);
|
||||
assert.ok(
|
||||
ranked.gap > MIN_GAP,
|
||||
`${name} : ${notation} devant ${ranked.second} de ${ranked.gap.toFixed(3)} seulement`,
|
||||
);
|
||||
report.push(`${name} : ${notation} (+${ranked.gap.toFixed(3)} sur ${ranked.second})`);
|
||||
}
|
||||
assert.equal(report.length, 16);
|
||||
});
|
||||
|
||||
// Couvre aussi le « nettement devant tous les autres » de la leçon 1 (étape
|
||||
// 1) : chaque coup illustré a plus de MIN_GAP d'avance sur le deuxième.
|
||||
test("chaque coup illustré est le meilleur coup du moteur à 2 plis, avec plus de 0,04 d'avance", async () => {
|
||||
const engine = await loadNodeEngine();
|
||||
let illustrated = 0;
|
||||
for (const [name, screen] of allScreens()) {
|
||||
if (screen.move === null || screen.roll === null) {
|
||||
continue;
|
||||
}
|
||||
illustrated++;
|
||||
const ranked = await rankOf(engine, screen.position, screen.roll, screen.move);
|
||||
assert.equal(ranked.rank, 1, `${name} : le moteur préfère ${ranked.best} à ${screen.move}`);
|
||||
assert.ok(
|
||||
ranked.gap > MIN_GAP,
|
||||
`${name} : ${screen.move} seulement +${ranked.gap.toFixed(3)}`,
|
||||
);
|
||||
}
|
||||
assert.ok(illustrated >= 5);
|
||||
});
|
||||
|
||||
test("chaque exercice accepte le coup du moteur et refuse tous les autres", async () => {
|
||||
const engine = await loadNodeEngine();
|
||||
for (const [name, screen] of allScreens()) {
|
||||
if (screen.expected.length === 0 || screen.roll === null) {
|
||||
continue;
|
||||
}
|
||||
const legal = await engine.legalMoves(screen.position, screen.roll);
|
||||
assert.ok(legal.length > 1, `${name} : rien à refuser`);
|
||||
for (const move of legal) {
|
||||
const practice = await MovePractice.start(
|
||||
engine,
|
||||
screen.position,
|
||||
screen.roll,
|
||||
screen.expected,
|
||||
);
|
||||
let verdict = "continue";
|
||||
for (const halfMove of move.halfMoves) {
|
||||
verdict = await practice.play(halfMove);
|
||||
if (verdict !== "continue") {
|
||||
break;
|
||||
}
|
||||
}
|
||||
const right = screen.expected.includes(move.notation);
|
||||
assert.equal(verdict, right ? "right" : "wrong", `${name} : ${move.notation}`);
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
// ------------------------------------------------------- Progression
|
||||
|
||||
const outlines: LessonOutline[] = [
|
||||
{ number: 1, exercises: [1, 2, 3, 4] },
|
||||
{ number: 2, exercises: [1, 2, 3] },
|
||||
{ number: 3, exercises: [1, 2] },
|
||||
];
|
||||
|
||||
test("la progression enregistrée se relit, même absente, abîmée ou d'une autre version", () => {
|
||||
assert.deepEqual(readLessonProgress(undefined), NO_PROGRESS);
|
||||
assert.deepEqual(readLessonProgress("texte"), NO_PROGRESS);
|
||||
assert.deepEqual(readLessonProgress({ version: 99, lessons: {} }), NO_PROGRESS);
|
||||
assert.deepEqual(readLessonProgress({ version: 1, lessons: null }), NO_PROGRESS);
|
||||
const saved = {
|
||||
version: LESSON_PROGRESS_VERSION,
|
||||
lessons: {
|
||||
1: { last: 3, reached: 3, solved: [2, 1, 2, -1, 1.5] },
|
||||
2: { last: "x", reached: 1, solved: [] },
|
||||
x: { last: 1, reached: 1, solved: [] },
|
||||
4: { last: LESSON_END, reached: LESSON_END, solved: [1] },
|
||||
},
|
||||
};
|
||||
assert.deepEqual(readLessonProgress(JSON.parse(JSON.stringify(saved))), {
|
||||
version: 1,
|
||||
lessons: {
|
||||
1: { last: 3, reached: 3, solved: [1, 2] },
|
||||
4: { last: LESSON_END, reached: LESSON_END, solved: [1] },
|
||||
},
|
||||
});
|
||||
});
|
||||
|
||||
test("les états d'une leçon : à commencer, « 2 exercices sur 4 », terminée", () => {
|
||||
let progress = NO_PROGRESS;
|
||||
const first = outlines[0] as LessonOutline;
|
||||
assert.deepEqual(lessonState(progress, first), { kind: "toStart", total: 4 });
|
||||
assert.equal(LESSON_TEXTS.state(lessonState(progress, first)), "À commencer · 4 exercices");
|
||||
progress = withVisit(progress, 1, 1);
|
||||
assert.deepEqual(lessonState(progress, first), { kind: "inProgress", solved: 0, total: 4 });
|
||||
progress = withSolved(withSolved(withVisit(progress, 1, 2), 1, 1), 1, 2);
|
||||
progress = withSolved(progress, 1, 2);
|
||||
assert.equal(LESSON_TEXTS.state(lessonState(progress, first)), "2 exercices sur 4");
|
||||
assert.deepEqual(lessonRecord(progress, 1), { last: 2, reached: 2, solved: [1, 2] });
|
||||
// Revenir en arrière garde l'étape la plus loin vue.
|
||||
progress = withVisit(progress, 1, 1);
|
||||
assert.deepEqual(lessonRecord(progress, 1), { last: 1, reached: 2, solved: [1, 2] });
|
||||
progress = withSolved(withSolved(progress, 1, 3), 1, 4);
|
||||
assert.deepEqual(lessonState(progress, first), { kind: "done", total: 4 });
|
||||
assert.equal(LESSON_TEXTS.state(lessonState(progress, first)), "Terminée");
|
||||
assert.equal(
|
||||
LESSON_TEXTS.state({ kind: "inProgress", solved: 1, total: 3 }),
|
||||
"1 exercice sur 3",
|
||||
);
|
||||
});
|
||||
|
||||
test("la leçon proposée : la première en cours, sinon la première à commencer", () => {
|
||||
assert.equal(nextLesson(NO_PROGRESS, outlines)?.number, 1);
|
||||
let progress = withVisit(NO_PROGRESS, 2, 1);
|
||||
assert.equal(nextLesson(progress, outlines)?.number, 2);
|
||||
for (const step of [1, 2, 3]) {
|
||||
progress = withSolved(progress, 2, step);
|
||||
}
|
||||
assert.equal(nextLesson(progress, outlines)?.number, 1, "leçon 2 terminée");
|
||||
assert.equal(finishedLessons(progress, outlines), 1);
|
||||
for (const [number, steps] of [
|
||||
[1, [1, 2, 3, 4]],
|
||||
[3, [1, 2]],
|
||||
] as const) {
|
||||
for (const step of steps) {
|
||||
progress = withSolved(progress, number, step);
|
||||
}
|
||||
}
|
||||
assert.equal(nextLesson(progress, outlines), null, "toutes terminées");
|
||||
assert.equal(finishedLessons(progress, outlines), 3);
|
||||
});
|
||||
|
||||
test("« Continuer » reprend là où l'on a quitté la leçon", () => {
|
||||
const first = outlines[0] as LessonOutline;
|
||||
assert.equal(resumeStep(NO_PROGRESS, first), 1);
|
||||
let progress = withVisit(NO_PROGRESS, 1, 3);
|
||||
assert.equal(resumeStep(progress, first), 3);
|
||||
// Après la fin, le premier exercice pas encore réussi.
|
||||
progress = withSolved(withVisit(progress, 1, LESSON_END), 1, 1);
|
||||
assert.equal(resumeStep(progress, first), 2);
|
||||
});
|
||||
|
||||
test("la progression est enregistrée dans le stockage des parties et relue", async () => {
|
||||
const storage = memoryStorage();
|
||||
const store = createLessonStore(createKeyValueBackend(storage));
|
||||
assert.deepEqual(await store.load(), NO_PROGRESS);
|
||||
const progress = withSolved(withVisit(NO_PROGRESS, 3, 2), 3, 2);
|
||||
void store.save(progress);
|
||||
// Les enregistrements passent avant la lecture qui suit.
|
||||
assert.deepEqual(await store.load(), progress);
|
||||
assert.deepEqual(JSON.parse(storage.getItem("ustagammon.lessons") ?? "null"), progress);
|
||||
const again = createLessonStore(createKeyValueBackend(storage));
|
||||
assert.deepEqual(await again.load(), progress);
|
||||
// Une valeur illisible n'empêche rien.
|
||||
storage.setItem("ustagammon.lessons", "{abîmé");
|
||||
assert.deepEqual(await again.load(), NO_PROGRESS);
|
||||
// Un stockage qui refuse l'écriture non plus.
|
||||
const refused = createLessonStore({
|
||||
lessonProgress: async () => {
|
||||
throw new Error("refusé");
|
||||
},
|
||||
saveLessonProgress: async () => {
|
||||
throw new Error("refusé");
|
||||
},
|
||||
});
|
||||
await refused.save(progress);
|
||||
assert.deepEqual(await refused.load(), NO_PROGRESS);
|
||||
});
|
||||
|
||||
test("la liste des leçons et la carte de l'accueil", () => {
|
||||
const empty = lessonCards(lessons, NO_PROGRESS);
|
||||
assert.deepEqual(
|
||||
empty.map((c) => [c.number, c.state.kind, c.current, c.href]),
|
||||
[
|
||||
[1, "toStart", true, "#/lecons/1/1"],
|
||||
[2, "toStart", false, "#/lecons/2/1"],
|
||||
[3, "toStart", false, "#/lecons/3/1"],
|
||||
[4, "toStart", false, "#/lecons/4/1"],
|
||||
[5, "toStart", false, "#/lecons/5/1"],
|
||||
],
|
||||
);
|
||||
let progress = withSolved(withVisit(NO_PROGRESS, 2, 2), 2, 1);
|
||||
const card = nextLessonCard(lessons, progress);
|
||||
assert.equal(card?.number, 2);
|
||||
assert.equal(card?.href, "#/lecons/2/2");
|
||||
assert.deepEqual(card?.exercises, [true, false, false]);
|
||||
assert.equal(
|
||||
LESSON_TEXTS.state(card?.state ?? { kind: "toStart", total: 0 }),
|
||||
"1 exercice sur 3",
|
||||
);
|
||||
for (const lesson of lessons) {
|
||||
for (const step of outlineOf(lesson).exercises) {
|
||||
progress = withSolved(progress, lesson.number, step);
|
||||
}
|
||||
}
|
||||
assert.equal(nextLessonCard(lessons, progress), null);
|
||||
});
|
||||
|
||||
test("les écrans d'une leçon ont leur adresse, ramenée à un écran qui existe", () => {
|
||||
const lesson = lessons[0] as Lesson;
|
||||
assert.deepEqual(
|
||||
lessonPlaceOf(lesson, { screen: "lesson", lesson: 1, step: 2, practice: true }),
|
||||
{
|
||||
step: 2,
|
||||
practice: true,
|
||||
},
|
||||
);
|
||||
assert.deepEqual(
|
||||
lessonPlaceOf(lesson, { screen: "lesson", lesson: 1, step: null, practice: false }),
|
||||
{
|
||||
step: 1,
|
||||
practice: false,
|
||||
},
|
||||
);
|
||||
assert.deepEqual(
|
||||
lessonPlaceOf(lesson, { screen: "lesson", lesson: 1, step: 9, practice: false }),
|
||||
{
|
||||
step: 1,
|
||||
practice: false,
|
||||
},
|
||||
);
|
||||
assert.equal(lessonPlaceOf(lesson, { screen: "lessonEnd", lesson: 1 }), "end");
|
||||
assert.deepEqual(lessonPlaceRoute(3, { step: 2, practice: true }), {
|
||||
screen: "lesson",
|
||||
lesson: 3,
|
||||
step: 2,
|
||||
practice: true,
|
||||
});
|
||||
assert.deepEqual(lessonPlaceRoute(3, "end"), { screen: "lessonEnd", lesson: 3 });
|
||||
});
|
||||
@@ -34,6 +34,12 @@ const TABLE: [string, Route][] = [
|
||||
["#/tutoriel/3", { screen: "tutorial", step: 3, practice: false }],
|
||||
["#/tutoriel/3/a-vous", { screen: "tutorial", step: 3, practice: true }],
|
||||
["#/tutoriel/fin", { screen: "tutorialEnd" }],
|
||||
// Les leçons (amendement du 2026-11-12, 1g).
|
||||
["#/lecons", { screen: "lessons" }],
|
||||
["#/lecons/2", { screen: "lesson", lesson: 2, step: null, practice: false }],
|
||||
["#/lecons/2/3", { screen: "lesson", lesson: 2, step: 3, practice: false }],
|
||||
["#/lecons/2/3/a-vous", { screen: "lesson", lesson: 2, step: 3, practice: true }],
|
||||
["#/lecons/2/fin", { screen: "lessonEnd", lesson: 2 }],
|
||||
["#/installer", { screen: "install" }],
|
||||
["#/parties", { screen: "games", game: null }],
|
||||
["#/parties/mh2k3x-a1b2c3", { screen: "games", game: "mh2k3x-a1b2c3" }],
|
||||
@@ -99,6 +105,14 @@ test("une adresse inconnue est reconnue comme telle", () => {
|
||||
"#/tutoriel/3/b",
|
||||
"#/tutoriel/3/a-vous/x",
|
||||
"#/tutoriel/fin/a-vous",
|
||||
"#/lecons/0",
|
||||
"#/lecons/12",
|
||||
"#/lecons/x",
|
||||
"#/lecons/2/0",
|
||||
"#/lecons/2/x",
|
||||
"#/lecons/2/3/b",
|
||||
"#/lecons/2/3/a-vous/x",
|
||||
"#/lecons/2/fin/a-vous",
|
||||
"#/installer/x",
|
||||
"#/a-propos/x",
|
||||
"#/position",
|
||||
|
||||
@@ -0,0 +1,205 @@
|
||||
// Étapes du scénario docs/scenarios/suivre-une-lecon.feature (ADR 0008) :
|
||||
// le texte des leçons est lu dans sa source (docs/lecons/), chaque geste est
|
||||
// jugé par le domaine branché sur le vrai moteur, et la progression passe
|
||||
// par le stockage des parties, comme dans l'application.
|
||||
//
|
||||
// Copyright (C) 2026 les auteurs d'Ustagammon.
|
||||
// Licence : GPLv3 ou ultérieure (voir LICENSE).
|
||||
|
||||
import assert from "node:assert/strict";
|
||||
import { readFileSync } from "node:fs";
|
||||
import { BeforeAll, Given, Then, When } from "@cucumber/cucumber";
|
||||
import type { Engine } from "../../src/domain/game/engine.js";
|
||||
import {
|
||||
type LessonProgress,
|
||||
lessonState,
|
||||
NO_PROGRESS,
|
||||
withSolved,
|
||||
withVisit,
|
||||
} from "../../src/domain/learning/lessons.js";
|
||||
import {
|
||||
MovePractice,
|
||||
type PracticeVerdict,
|
||||
tutorialBoard,
|
||||
} from "../../src/domain/learning/tutorial.js";
|
||||
import {
|
||||
createKeyValueBackend,
|
||||
type KeyValueStorage,
|
||||
} from "../../src/storage/key-value-backend.js";
|
||||
import { createLessonStore, type LessonStore } from "../../src/storage/lesson-store.js";
|
||||
import { memoryStorage } from "../../src/storage/open-library.js";
|
||||
import { LESSON_COUNT, type Lesson, outlineOf, parseLesson } from "../../src/ui/lesson-text.js";
|
||||
import { LESSON_TEXTS } from "../../src/ui/lesson-texts.js";
|
||||
import { lessonCards, nextLessonCard } from "../../src/ui/lessons-model.js";
|
||||
import type { TutorialScreen } from "../../src/ui/tutorial-text.js";
|
||||
import { loadNodeEngine } from "../support/node-engine.js";
|
||||
|
||||
const root = new URL("../../../../", import.meta.url);
|
||||
|
||||
let engine: Engine;
|
||||
let lessons: Lesson[];
|
||||
let storage: KeyValueStorage;
|
||||
let store: LessonStore;
|
||||
let progress: LessonProgress = NO_PROGRESS;
|
||||
let screen: TutorialScreen;
|
||||
let practice: MovePractice | null = null;
|
||||
let verdict: PracticeVerdict = "continue";
|
||||
|
||||
BeforeAll(async () => {
|
||||
engine = await loadNodeEngine();
|
||||
lessons = Array.from({ length: LESSON_COUNT }, (_, i) =>
|
||||
parseLesson(i + 1, readFileSync(new URL(`docs/lecons/lecon-${i + 1}.md`, root), "utf8")),
|
||||
);
|
||||
});
|
||||
|
||||
function lesson(n: number): Lesson {
|
||||
const found = lessons[n - 1];
|
||||
assert.ok(found !== undefined, `leçon ${n} absente`);
|
||||
return found;
|
||||
}
|
||||
|
||||
/** Enregistre la progression, comme l'application à chaque écran. */
|
||||
async function save(next: LessonProgress): Promise<void> {
|
||||
progress = next;
|
||||
await store.save(progress);
|
||||
}
|
||||
|
||||
Given("vous ouvrez les leçons pour la première fois", async () => {
|
||||
storage = memoryStorage();
|
||||
store = createLessonStore(createKeyValueBackend(storage));
|
||||
progress = await store.load();
|
||||
assert.deepEqual(progress, NO_PROGRESS);
|
||||
});
|
||||
|
||||
Then("il y en a cinq, chacune avec deux à quatre exercices", () => {
|
||||
assert.equal(lessons.length, 5);
|
||||
for (const card of lessonCards(lessons, progress)) {
|
||||
assert.equal(card.state.kind, "toStart");
|
||||
assert.ok(card.state.total >= 2 && card.state.total <= 4);
|
||||
}
|
||||
});
|
||||
|
||||
Then("chaque position des leçons se lit sur le plateau", async () => {
|
||||
for (const current of lessons.flatMap((l) => l.steps.flatMap((s) => [s.explain, s.practice]))) {
|
||||
if (current !== null) {
|
||||
const board = await tutorialBoard(engine, current.position, current.onRoll);
|
||||
assert.equal(board.sides.player.points.length, 24);
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
Then("l'accueil vous propose la leçon {int}", (n: number) => {
|
||||
assert.equal(nextLessonCard(lessons, progress)?.number, n);
|
||||
});
|
||||
|
||||
When("vous réussissez le premier exercice de la leçon {int}", async (n: number) => {
|
||||
const first = outlineOf(lesson(n)).exercises[0];
|
||||
assert.ok(first !== undefined);
|
||||
await save(withSolved(withVisit(progress, n, first), n, first));
|
||||
});
|
||||
|
||||
Then(
|
||||
"la leçon {int} en est à « {int} exercice sur {int} »",
|
||||
(n: number, solved: number, total: number) => {
|
||||
const state = lessonState(progress, outlineOf(lesson(n)));
|
||||
assert.deepEqual(state, { kind: "inProgress", solved, total });
|
||||
assert.equal(LESSON_TEXTS.state(state), `${solved} exercice sur ${total}`);
|
||||
},
|
||||
);
|
||||
|
||||
Then("l'accueil vous propose de continuer la leçon {int}", (n: number) => {
|
||||
const card = nextLessonCard(lessons, progress);
|
||||
assert.equal(card?.number, n);
|
||||
assert.equal(card?.state.kind, "inProgress");
|
||||
});
|
||||
|
||||
Given("vous êtes au premier exercice de la leçon {int}", async (n: number) => {
|
||||
const step = lesson(n).steps.find((s) => s.practice !== null);
|
||||
assert.ok(step?.practice != null && step.practice.roll !== null);
|
||||
screen = step.practice;
|
||||
practice = await MovePractice.start(
|
||||
engine,
|
||||
screen.position,
|
||||
screen.roll as [number, number],
|
||||
screen.expected,
|
||||
);
|
||||
verdict = "continue";
|
||||
});
|
||||
|
||||
When(
|
||||
"vous avancez un pion de la flèche {int} à la flèche {int}",
|
||||
async (from: number, to: number) => {
|
||||
assert.ok(practice !== null);
|
||||
verdict = await practice.play({ from, to });
|
||||
if (verdict === "wrong") {
|
||||
practice.reset();
|
||||
}
|
||||
},
|
||||
);
|
||||
|
||||
Then("le pion revient, et le maître vous met sur la voie", () => {
|
||||
assert.equal(verdict, "wrong");
|
||||
assert.deepEqual(practice?.pendingHalfMoves, []);
|
||||
assert.match(screen.wrong.map((part) => part.text).join(""), /^Ce coup est permis, mais/);
|
||||
});
|
||||
|
||||
When("vous faites le point {int}", async (point: number) => {
|
||||
assert.ok(practice !== null && screen.roll !== null);
|
||||
// Le coup du maître de cet exercice, demi-coup par demi-coup : il
|
||||
// amène bien deux pions sur la flèche demandée.
|
||||
const legal = await engine.legalMoves(screen.position, screen.roll);
|
||||
const move = legal.find((m) => m.notation === screen.expected[0]);
|
||||
assert.ok(move !== undefined);
|
||||
assert.equal(move.halfMoves.filter((h) => h.to === point).length, 2);
|
||||
for (const halfMove of move.halfMoves) {
|
||||
verdict = await practice.play(halfMove);
|
||||
}
|
||||
});
|
||||
|
||||
Then("le maître salue votre coup", () => {
|
||||
assert.equal(verdict, "right");
|
||||
assert.match(screen.right.map((part) => part.text).join(""), /^C'est (aussi )?mon coup/);
|
||||
});
|
||||
|
||||
Then("c'est le meilleur coup du moteur", async () => {
|
||||
assert.ok(screen.roll !== null);
|
||||
const best = await engine.bestMove(
|
||||
screen.position,
|
||||
{ value: 1, owner: "centered" },
|
||||
screen.roll,
|
||||
2,
|
||||
);
|
||||
assert.equal(best?.notation, screen.expected[0]);
|
||||
});
|
||||
|
||||
Given("vous avez quitté la leçon {int} à sa deuxième étape", async (n: number) => {
|
||||
storage = memoryStorage();
|
||||
store = createLessonStore(createKeyValueBackend(storage));
|
||||
progress = NO_PROGRESS;
|
||||
await save(withVisit(withVisit(progress, n, 1), n, 2));
|
||||
});
|
||||
|
||||
When("vous revenez plus tard aux leçons", async () => {
|
||||
store = createLessonStore(createKeyValueBackend(storage));
|
||||
progress = await store.load();
|
||||
});
|
||||
|
||||
Then("« Continuer » vous ramène à la deuxième étape de la leçon {int}", (n: number) => {
|
||||
const card = lessonCards(lessons, progress).find((c) => c.number === n);
|
||||
assert.equal(card?.href, `#/lecons/${n}/2`);
|
||||
assert.equal(nextLessonCard(lessons, progress)?.number, n);
|
||||
});
|
||||
|
||||
When("vous réussissez tous les exercices de la leçon {int}", async (n: number) => {
|
||||
let next = progress;
|
||||
for (const step of outlineOf(lesson(n)).exercises) {
|
||||
next = withSolved(withVisit(next, n, step), n, step);
|
||||
}
|
||||
await save(next);
|
||||
});
|
||||
|
||||
Then("la leçon {int} est terminée", (n: number) => {
|
||||
const state = lessonState(progress, outlineOf(lesson(n)));
|
||||
assert.equal(state.kind, "done");
|
||||
assert.equal(LESSON_TEXTS.state(state), "Terminée");
|
||||
});
|
||||
Reference in New Issue
Block a user