Add a compressed illustration carousel with slide indicators

apps/docs/scripts/auth-cli.ts

@@ -142,6 +142,7 @@ async function main() {
     "/docs/00-endor-concepts-draft",
     "/figures/endor-architecture.svg",
     "/figures/endor-review-gate.webp",
+    "/figures/endor-review-desk.webp",
     "/docs/pretext/01-chapter",
     "/materials/pretext/verify.cjs",
     "/materials/pretext/results.chrome156.json",
@@ -200,15 +201,26 @@ async function main() {
     2,
     "The comic preview and lightbox must use WebP",
   );
-  assert.ok(!purpose.includes("endor-review-gate.png"));
-  const comic = await request("/figures/endor-review-gate.webp", { headers });
-  assert.equal(comic.status, 200);
-  assert.match(comic.headers.get("content-type") || "", /image\/webp/);
-  assert.deepEqual(
-    Buffer.from(await comic.arrayBuffer()),
-    readFileSync(join(__dirname, "public/figures/endor-review-gate.webp")),
+  assert.ok(purpose.includes('aria-label="上一张图片"'));
+  assert.ok(purpose.includes('aria-label="下一张图片"'));
+  assert.ok(purpose.includes('aria-label="显示第 1 张图片" aria-current="true"'));
+  assert.ok(purpose.includes('aria-label="显示第 2 张图片"'));
+  assert.equal(
+    [...purpose.matchAll(/<img\b[^>]*\bsrc="\/figures\/endor-review-desk\.webp"/g)].length,
+    0,
+    "The second slide should not download until selected",
   );
-  assert.equal((await request("/figures/endor-review-gate.png", { headers })).status, 404);
+  for (const name of ["endor-review-gate", "endor-review-desk"]) {
+    assert.ok(!purpose.includes(`/figures/${name}.png`));
+    const comic = await request(`/figures/${name}.webp`, { headers });
+    assert.equal(comic.status, 200);
+    assert.match(comic.headers.get("content-type") || "", /image\/webp/);
+    assert.deepEqual(
+      Buffer.from(await comic.arrayBuffer()),
+      readFileSync(join(__dirname, `public/figures/${name}.webp`)),
+    );
+    assert.equal((await request(`/figures/${name}.png`, { headers })).status, 404);
+  }
   const assets = new Set(
     [...home.matchAll(/(?:src|href)="(\/_next\/static\/[^" ]+)"/g)].map((m) =>
       m[1].replaceAll("&amp;", "&"),

apps/docs/scripts/build-doc-images.mjs

@@ -52,8 +52,8 @@ for (const source of await files(sources)) {
     throw new Error(`${relative}: ${encoded.length} bytes exceeds the ${policy.maxBytes}-byte image budget.`);
   }
   if (check) {
-    const committed = await readFile(destination);
-    if (!encoded.equals(committed)) throw new Error(`${relative} is stale. Run pnpm --filter @endor/docs images and commit the output.`);
+    const generated = await readFile(destination);
+    if (!encoded.equals(generated)) throw new Error(`${relative} is stale. Regenerate browser images on the confirmed remote runner.`);
   } else {
     await mkdir(path.dirname(destination), { recursive: true });
     await writeFile(destination, encoded);