@johnmorrisdotca/kyogijo-stadiums 0.16.0 → 0.17.0

package/dist/judging.turn.js

@@ -0,0 +1,152 @@
+// A judging assignment in 3D: the 3D view of `turn.ts` over the package's own judo floor (`drawKyogijo`, with as many areas side by side as there are mats), with each judge's chair and the judges' table stood up, a name
+// card on the table in front of every judge who has a name (turned to face the eye, so that it is read from wherever the view is) and the name of each mat on a sign over its judges' table. Nothing is drawn a second
+// way: the card is the plan's card (`judging.card.ts`), fitted by the same rule. The model it makes is a `TurnModel`, so the camera, the controls, the pointer, the auto-turn and the tests of every other 3D view are this one's.
+import { budoPlan } from "./budo/plan.js";
+import { drawKyogijo } from "./draw.js";
+import { hash } from "./format.js";
+import { FEET_PER_METRE as FT } from "./geometry.js";
+import { TURN_CARD, badge, card } from "./judging.card.js";
+import { JUDGING_LEAGUE } from "./judging.data.js";
+import { fitCard, fitSeats } from "./judging.fit.js";
+import { benchOf, judgingSetting } from "./judging.js";
+import { judgingDrawing, judgingText } from "./judging.draw.js";
+import { JUDGING_WORDS } from "./judging.words.js";
+import { mountTurn } from "./turn.dom.js";
+import { turnMarkupOf } from "./turn.markup.js";
+import { TURN_PRESETS } from "./turn.camera.js";
+import { WORLD_PX, openingView, sceneBox } from "./turn.model.js";
+import { box, n, plane, pole, rect, thinnest } from "./turn.kit.js";
+import { planesOf } from "./uprights.js";
+/** How high things stand, in metres (ours: no rule gives them): the table's top, a chair's seat, a name card on the table, the sign over it. */
+export const JUDGING_HEIGHTS = Object.freeze({ table: 0.75, chair: 0.45, card: 0.95, sign: 0.7, signAbove: 0.25 });
+/** The lens of a view close up on several benches at once: the scene turns about the middle of them, and a bench several metres from it would swell as it swung toward the eye, so the lens is long (the default is 8). */
+const BENCHES_LENS = 60;
+const clamp = (v, lo, hi) => Math.min(hi, Math.max(lo, v));
+/**
+ * The four viewpoints of a judging view. A card stands upright, so a high eye squashes its type: the broadcast view is from the mat side, so that the judges' table is at the far side and the cards face the eye, at a
+ * pitch where the type is still two thirds as tall as it is wide; the others are as every surface's but for the pitch of the corner and the end.
+ */
+export const JUDGING_PRESETS = { overhead: TURN_PRESETS.overhead, broadcast: { yaw: 0, pitch: 42, zoom: 1 }, end: { yaw: -90, pitch: 50, zoom: 1 }, corner: { yaw: -35, pitch: 48, zoom: 1 } };
+/**
+ * A judging assignment as a 3D model: the judo floor with every mat's judges' chairs and table, a name card on the table at each seat that has a name and fits one, a number badge at the others, and the mat's name on a sign.
+ * A `TurnModel` like any other: `turnMarkupOf` and `mountJudgingTurn` make a view of it. `mat` in the options builds one mat alone (a tab); without it the mats stand side by side.
+ */
+export function buildJudgingTurn(options, settings = {}) {
+    const setting = judgingSetting(options);
+    const language = setting.language;
+    const words = JUDGING_WORDS[language];
+    const league = JUDGING_LEAGUE[setting.style].league;
+    const count = setting.mats.length;
+    const id = settings.id ?? (typeof options.id === "string" && options.id !== "" ? `${options.id}-turn` : `ky-turn-${hash(JSON.stringify([options, settings.preset]))}`);
+    const floorOptions = { sport: "judo", league, budo: { style: setting.style, officials: true, areas: count }, language, margin: 2, id: `${id}-floor`, ...(options.theme === undefined ? {} : { theme: options.theme }), ...(options.css === "none" ? { style: "none" } : {}) };
+    const floor = drawKyogijo({ ...floorOptions, orientation: "landscape" });
+    const found = /viewBox="(-?[\d.]+) (-?[\d.]+) ([\d.]+) ([\d.]+)"/.exec(floor);
+    if (found === null)
+        throw new Error("the floor of a 3D view must be an SVG with a viewBox");
+    const [vx, vy, vw, vh] = found.slice(1).map(Number);
+    const plan = budoPlan({ sport: "judo", league, budo: { style: setting.style, officials: true, areas: count } });
+    const judges = plan.judo.judges;
+    const seatsPerMat = setting.mats[0].seats.length;
+    // The plan's own frame is metres from the top left of the tatami, and the drawing's is feet from the same corner.
+    const ft = (m) => m * FT;
+    const H = JUDGING_HEIGHTS;
+    const items = [];
+    const tableTop = ft(H.table);
+    const pitch = judges.seats.length > 1 ? judges.seats[1].x0 - judges.seats[0].x0 : 1.25;
+    const cardW = ft(pitch - 0.06);
+    const cardH = ft(H.card);
+    const pad = Math.max(0.08, cardW * 0.05);
+    const r = clamp(cardW * 0.2, 0.2, 0.45);
+    const innerW = cardW - 2 * pad;
+    const innerH = cardH - 2 * pad - r;
+    const minName = 0.62;
+    setting.mats.forEach((mat, mi) => {
+        const table = judges.tables[mi];
+        const fitted = fitSeats(mat.seats, { width: innerW, height: innerH, max: Math.min(cardW * 0.3, 0.75), min: minName, idLabel: words.chart.idLabel });
+        const furniture = [];
+        furniture.push(...box(`m${mat.n}-table`, "desk", rect(ft(table.x0), ft(table.y0), ft(table.x1 - table.x0), ft(table.y1 - table.y0)), tableTop, "u-bench"));
+        const cards = [];
+        mat.seats.forEach((a, si) => {
+            const chair = judges.seats[mi * seatsPerMat + si];
+            furniture.push(...box(`m${mat.n}-chair-${a.seat.n}`, "chair", rect(ft(chair.x0), ft(chair.y0), ft(chair.x1 - chair.x0), ft(chair.y1 - chair.y0)), ft(H.chair), "u-bench"));
+            const cx = ft((chair.x0 + chair.x1) / 2);
+            const cy = ft((table.y0 + table.y1) / 2);
+            const fit = fitted[si];
+            if (fit !== undefined) {
+                const p = plane(`m${mat.n}-card-${a.seat.n}`, "card", [cx - cardW / 2, cy, tableTop + cardH], [cardW, 0, 0], [0, 0, -cardH], card(TURN_CARD, fit, a.seat.n, 0, 0, cardW, cardH, pad, r, 0.1));
+                cards.push({ ...p, billboard: true });
+            }
+            else {
+                // Nobody in the seat, or a name that does not fit a card: the seat's number alone, on a small badge, with the name in the chart.
+                const br = 0.55;
+                const p = plane(`m${mat.n}-badge-${a.seat.n}`, "card", [cx - br, cy, tableTop + 2 * br], [2 * br, 0, 0], [0, 0, -2 * br], badge(TURN_CARD, br, br, br * 0.92, a.seat.n, a.assigned));
+                cards.push({ ...p, billboard: true });
+            }
+        });
+        // The mat's name on a sign over the whole bench, on a pole at each end of the table.
+        const midX = ft((table.x0 + table.x1) / 2);
+        const midY = ft((table.y0 + table.y1) / 2);
+        const signW = ft(pitch * seatsPerMat);
+        const signH = ft(H.sign);
+        const signBottom = tableTop + cardH + ft(H.signAbove);
+        const text = fitCard({ name: mat.label, id: "", idLabel: "", width: signW * 0.9, height: signH * 0.86, max: signH * 0.62, min: signH * 0.3, maxLines: 2, breakWords: true });
+        const lines = text?.name ?? [mat.label];
+        const size = text?.nameSize ?? signH * 0.3;
+        const label = lines.map((line, i) => `<text class="u-sign-text" x="${n(signW / 2)}" y="${n(signH / 2 + (i - (lines.length - 1) / 2) * size * 1.1 + size * 0.34)}" font-size="${n(size)}">${line.replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;")}</text>`).join("");
+        const sign = { ...plane(`m${mat.n}-sign`, "sign", [midX - signW / 2, midY, signBottom + signH], [signW, 0, 0], [0, 0, -signH], `<rect class="u-sign" width="${n(signW)}" height="${n(signH)}" rx="${n(signH * 0.12)}"/>${label}`), billboard: true };
+        const poles = [table.x0, table.x1].flatMap((px, k) => pole(`m${mat.n}-sign-pole-${k + 1}`, "pole", ft(px), midY, tableTop, signBottom + signH * 0.5, ft(0.06), "u-pole"));
+        items.push({ id: `m${mat.n}-furniture`, kind: "officials", at: [midX, midY], height: tableTop, planes: furniture });
+        items.push({ id: `m${mat.n}-judges`, kind: "judges", at: [midX, midY], height: tableTop + cardH, planes: [...cards, ...poles, sign] });
+    });
+    // The view is fitted to the whole floor, or to the judges' bench close up (the scene then turns about the bench, so that the cards stay where they are read).
+    const near = setting.focus === "bench" ? benchOf(judges.seats.slice(0, count * seatsPerMat), judges.tables[0], pitch, plan.judo.contests[0].y0, 2.2) : undefined;
+    const area = near === undefined ? { x0: vx, y0: vy, x1: vx + vw, y1: vy + vh } : { x0: ft(near.x0), y0: ft(near.y0), x1: ft(near.x1), y1: ft(near.y1) };
+    const uprights = { items, lift: 0, thin: thinnest(vw, vh), area, whole: true };
+    const planes = planesOf(uprights);
+    const scale = WORLD_PX / Math.max(vw, vh);
+    const centre = [(area.x0 + area.x1) / 2, (area.y0 + area.y1) / 2];
+    const look = /^<svg[^>]* data-look="([^"]*)"/.exec(floor)?.[1];
+    const { title, description } = judgingText(setting, options, true);
+    const surfaceLike = { sport: "judo", language, ...(options.theme === undefined ? {} : { theme: options.theme }), ...(options.css === "none" ? { style: "none" } : {}) };
+    return {
+        id,
+        language,
+        options: surfaceLike,
+        title,
+        description: `${description}${language === "ja" ? "" : " "}${words.turn.standing}`,
+        standing: words.turn.standing,
+        floor,
+        viewBox: { x: vx, y: vy, w: vw, h: vh },
+        scale,
+        uprights,
+        defs: "",
+        crowdStyle: "",
+        venue: false,
+        look: { sport: "judo", look: look ?? "yellow-red" },
+        planes,
+        box: sceneBox(planes, uprights.area, 0, centre, scale),
+        centre,
+        view: openingView({ preset: "broadcast", ...settings }, JUDGING_PRESETS),
+        turnable: true,
+        presets: JUDGING_PRESETS,
+        ...(near !== undefined && count > 1 ? { lens: BENCHES_LENS } : {}),
+        flat: judgingDrawing(options).svg,
+    };
+}
+/**
+ * Mount a judging assignment as a 3D view in a container: the same view as `mountKyogijoTurn`'s, with the controls, the pointer, the keys and the auto-turn of every 3D view, over the judo floor with each mat's judges'
+ * table, the name cards on it and the mat's name over it. Where the browser cannot turn it, the flat picture with its chart is shown.
+ * @example
+ * ```ts no-run
+ * import { mountJudgingTurn } from "@johnmorrisdotca/kyogijo-stadiums/judging";
+ * const view = mountJudgingTurn(document.querySelector("#mat")!, { style: "kata", mats: [{ officials: [{ seat: 1, name: "Aiko Mori", id: "J-1042" }] }] });
+ * view.set({ yaw: 40 });
+ * ```
+ */
+export function mountJudgingTurn(host, options, settings = {}) {
+    return mountTurn(host, options, settings, buildJudgingTurn);
+}
+/** A judging assignment as the markup of a 3D view, still until a page's script makes it turn: pure, so a server can make it. */
+export function judgingTurnMarkup(options, settings = {}) {
+    return turnMarkupOf(buildJudgingTurn(options, settings), settings);
+}

package/dist/judging.types.d.ts

@@ -0,0 +1,72 @@
+import type { Language } from "./types.ts";
+/** The style a judo area is judged in. `kata` has five judges; `shiai`, the contest, is the next release. */
+export type JudgingStyle = "kata";
+/** One official: the seat, and who sits in it. The seat is its number (`3`, `"3"`), its key (`"judge-3"`) or `"central"` (the middle seat of a kata area). */
+export interface JudgingOfficial {
+    seat: string | number;
+    /** The name as it is to be read, at most 120 characters; a seat with no name is shown as not assigned. */
+    name?: string;
+    /** The official's identifier (a licence number, a registry id), shown under the name. At most 64 characters. */
+    id?: string | number;
+}
+/** One mat area: its name and its officials. */
+export interface JudgingMat {
+    /** The name on the plan: `Mat 1`, `Mat 2` in English and `第1試合場`, `第2試合場` in Japanese when missing. At most 40 characters. */
+    label?: string;
+    /** Who sits where. A seat that is not named is shown as not assigned. */
+    officials?: readonly JudgingOfficial[];
+}
+/** A judging assignment as the drawing asks for it. */
+export interface JudgingOptions {
+    /** The style the areas are judged in. */
+    style: JudgingStyle;
+    /** The mat areas, 1 to 6, in the order they are numbered. */
+    mats: readonly JudgingMat[];
+    /** Draw only this mat (counting from 1): one tab of a page that has a tab for each. All of them, stacked, when missing. */
+    mat?: number;
+    /** The chart of mat, seat, name and ID. `auto` (the default) draws it whenever a name or an ID does not fit in its seat, `always` and `never` as they say. */
+    chart?: "auto" | "always" | "never";
+    /** Where the chart is laid: beside the plan (`landscape`, the default) or under it (`portrait`). */
+    orientation?: "landscape" | "portrait";
+    /** What the plan shows: the whole `mat` (the default) or the judges' `bench`, close up, so that the names in the seats are as large as they can be. */
+    focus?: "mat" | "bench";
+    /** The width of the picture's own units, 480 to 2000 (1000 by default); the picture scales to whatever it is shown in, so this only sets how large its type is against its width. */
+    width?: number;
+    language?: Language;
+    theme?: "light" | "dark";
+    /** A prefix for the ids. Made from the options when missing. */
+    id?: string;
+    className?: string;
+    title?: string;
+    description?: string;
+    /** `none` leaves the stylesheet to the page (`KYOGIJO_STYLE` and `KYOGIJO_JUDGING_STYLE`). */
+    css?: "embed" | "none";
+}
+/** A seat of a style: where it is in the order, and what it is called. */
+export interface JudgingSeat {
+    /** The key: `judge-3`. */
+    id: string;
+    /** The number, from 1, in the order the seats are drawn (left to right as the plan lies, the shomen at the top). */
+    n: number;
+    /** `central` for the middle seat of a kata area. */
+    role: "judge" | "central";
+    label: {
+        en: string;
+        ja: string;
+    };
+}
+/** One seat of one mat with who sits in it. */
+export interface JudgingAssignment {
+    seat: JudgingSeat;
+    /** Empty when nobody is named. */
+    name: string;
+    id: string;
+    assigned: boolean;
+}
+/** One mat with every seat of the style, in order. */
+export interface JudgingResolved {
+    /** From 1. */
+    n: number;
+    label: string;
+    seats: JudgingAssignment[];
+}

package/dist/judging.types.js

@@ -0,0 +1 @@
+export {};

package/dist/judging.words.d.ts

@@ -0,0 +1,45 @@
+import type { Language } from "./types.ts";
+export interface JudgingWords {
+    /** The name of a mat when the caller gives none, `{n}` its number. */
+    mat: string;
+    /** What a style is called on the plan, `{count}` the number of seats. */
+    styleName: {
+        kata: string;
+    };
+    /** The chart: its heading, its columns, the word before an ID and what a seat with nobody in it says. */
+    chart: {
+        heading: string;
+        seat: string;
+        name: string;
+        id: string;
+        idLabel: string;
+        vacant: string;
+    };
+    /** The sentences of the title and the description. */
+    say: {
+        title: string;
+        matsOne: string;
+        matsMany: string;
+        mat: string;
+        seat: string;
+        seatNoId: string;
+        seatVacant: string;
+        names: string;
+        chartOnly: string;
+        join: string;
+    };
+    /** The table that says the same as the picture. */
+    table: {
+        caption: string;
+        mat: string;
+        seat: string;
+        name: string;
+        id: string;
+    };
+    /** What the 3D view says of the seats' name cards. */
+    turn: {
+        standing: string;
+        board: string;
+    };
+}
+export declare const JUDGING_WORDS: Record<Language, JudgingWords>;

package/dist/judging.words.js

@@ -0,0 +1,40 @@
+export const JUDGING_WORDS = {
+    en: {
+        mat: "Mat {n}",
+        styleName: { kata: "Kata, {count} judges" },
+        chart: { heading: "Judging assignments", seat: "Seat", name: "Name", id: "ID", idLabel: "ID", vacant: "Not assigned" },
+        say: {
+            title: "Judging assignments: {style}, {mats}",
+            matsOne: "1 mat",
+            matsMany: "{n} mats",
+            mat: "{label}: {seats}.",
+            seat: "{seat} {name}, ID {id}",
+            seatNoId: "{seat} {name}",
+            seatVacant: "{seat} not assigned",
+            names: "The names are in the seats where they fit, and in the chart of mat, seat, name and ID.",
+            chartOnly: "The names are in the chart of mat, seat, name and ID.",
+            join: "; ",
+        },
+        table: { caption: "{title}", mat: "Mat", seat: "Seat", name: "Name", id: "ID" },
+        turn: { standing: "A name card stands at each judge's seat, turned to face the eye, and the name of each mat stands over its judges' table.", board: "Mat" },
+    },
+    ja: {
+        mat: "第{n}試合場",
+        styleName: { kata: "形（{count}人制）" },
+        chart: { heading: "審判員の配置", seat: "席", name: "氏名", id: "ID", idLabel: "ID", vacant: "未定" },
+        say: {
+            title: "審判員の配置：{style}、{mats}",
+            matsOne: "試合場1面",
+            matsMany: "試合場{n}面",
+            mat: "{label}：{seats}。",
+            seat: "{seat}は{name}（ID {id}）",
+            seatNoId: "{seat}は{name}",
+            seatVacant: "{seat}は未定",
+            names: "氏名は、席に収まる場合は各席の中に表示し、試合場・席・氏名・IDの一覧表にも載せています。",
+            chartOnly: "氏名は、試合場・席・氏名・IDの一覧表に載せています。",
+            join: "、",
+        },
+        table: { caption: "{title}", mat: "試合場", seat: "席", name: "氏名", id: "ID" },
+        turn: { standing: "各審判員の席に名札を置き、見ている方向に向くようにしています。各試合場の名前は審判員席の上に掲げています。", board: "試合場" },
+    },
+};

package/dist/multi.draw.js

@@ -27,6 +27,42 @@ function inner(svg) {
     body = body.replace(/<rect class="ky-(?:apron|free)(?: [^"]*)?"[^>]*\/>/g, "");
     return { body, style, look };
 }
+/** The invented event of a layout's sample content: the options' own, or the package's (`Kyogijo Open 2026, Osaka`). */
+function sampleOf(o, words) {
+    if (o.sample === undefined || o.sample === false)
+        return undefined;
+    const given = o.sample === true ? {} : o.sample;
+    return { event: given.event ?? words.sample.event, year: String(given.year ?? words.sample.year), city: given.city ?? words.sample.city };
+}
+/** The line of a sample event: its name, year and city. */
+const sampleLine = (e) => `${e.event} ${e.year} · ${e.city}`;
+/**
+ * A simple emblem of the package's own, in a square of `size` feet centred on (cx, cy): a ring with a star, a diamond or waves, by `kind`. Plain geometry: no real mark, brand, federation or sponsor is drawn, and no one's logo is
+ * imitated.
+ */
+function emblem(cx, cy, size, kind) {
+    const r = size / 2;
+    const ring = el("circle", { class: "ky-mu-emblem", cx: num(cx), cy: num(cy), r: num(r * 0.92) });
+    const k = ((kind % 3) + 3) % 3;
+    if (k === 0) {
+        const pts = Array.from({ length: 10 }, (_, i) => {
+            const a = -Math.PI / 2 + (i * Math.PI) / 5;
+            const rr = i % 2 === 0 ? r * 0.6 : r * 0.26;
+            return `${num(cx + rr * Math.cos(a))} ${num(cy + rr * Math.sin(a))}`;
+        });
+        return ring + el("path", { class: "ky-mu-emblem-fill", d: `M${pts.join("L")}Z` });
+    }
+    if (k === 1) {
+        const d = r * 0.5;
+        return ring + el("path", { class: "ky-mu-emblem-fill", d: `M${num(cx)} ${num(cy - d)}L${num(cx + d)} ${num(cy)}L${num(cx)} ${num(cy + d)}L${num(cx - d)} ${num(cy)}Z` });
+    }
+    let waves = "";
+    for (const dy of [-0.28, 0, 0.28]) {
+        const y = cy + r * dy;
+        waves += `M${num(cx - r * 0.55)} ${num(y)}Q${num(cx - r * 0.275)} ${num(y - r * 0.2)} ${num(cx)} ${num(y)}T${num(cx + r * 0.55)} ${num(y)}`;
+    }
+    return ring + el("path", { class: "ky-mu-emblem", d: waves, fill: "none" });
+}
 /** The text of an empty place, sized to fit it. */
 function slotText(slot, words) {
     return slot.kind === "floor-text" ? words.slots.floorText : slot.kind === "floor-logo" ? words.slots.floorLogo : words.slots.board;
@@ -164,13 +200,21 @@ export function multiDrawing(options, raise, uprights = true) {
     }
     let slotsMarkup = "";
     let slotTexts = "";
+    const sample = sampleOf(o, words);
     if (withSlots) {
-        for (const slot of layout.slots) {
+        layout.slots.forEach((slot, index) => {
             const board = slot.kind === "board";
-            slotsMarkup += el("rect", { class: board ? "ky-mu-board" : "ky-mu-slot", x: num(slot.x), y: num(slot.y), width: num(slot.w), height: num(slot.h), "data-slot": slot.id });
-            if (board)
+            // With sample content a floor's places carry an invented event's words and emblems and are not drawn dashed; the boards keep their dark panels.
+            if (sample === undefined || board)
+                slotsMarkup += el("rect", { class: board ? "ky-mu-board" : "ky-mu-slot", x: num(slot.x), y: num(slot.y), width: num(slot.w), height: num(slot.h), "data-slot": slot.id });
+            if (board && sample === undefined)
                 slotsMarkup += el("rect", { class: "ky-mu-slot ky-mu-slot-board", x: num(slot.x + 0.3), y: num(slot.y + 0.3), width: num(slot.w - 0.6), height: num(slot.h - 0.6) });
-            const text = slotText(slot, words);
+            if (sample !== undefined && slot.kind === "floor-logo") {
+                const [ex, ey] = to(slot.x + slot.w / 2, slot.y + slot.h / 2);
+                slotsMarkup += el("g", { class: "ky-mu-emblems", "data-slot": slot.id }, emblem(ex, ey, Math.min(slot.w, slot.h) * 0.9, index));
+                return;
+            }
+            const text = sample === undefined ? slotText(slot, words) : board ? sampleLine(sample).toUpperCase() : sampleLine(sample);
             const horizontal = slot.w >= slot.h;
             const long = horizontal ? slot.w : slot.h;
             const short = horizontal ? slot.h : slot.w;
@@ -178,8 +222,9 @@ export function multiDrawing(options, raise, uprights = true) {
             const [tx, ty] = to(slot.x + slot.w / 2, slot.y + slot.h / 2);
             // The words of a slot on a long side are laid along it; in a turned layout they turn back to read from the left.
             const rot = (horizontal ? 0 : -90) + 0;
-            slotTexts += el("text", { class: `ky-mu-slot-text${board ? " ky-mu-slot-text-board" : ""}`, x: num(tx), y: num(ty + size * 0.34), "font-size": num(size), transform: rot === 0 ? undefined : `rotate(${rot} ${num(tx)} ${num(ty)})` }, esc(text));
-        }
+            const cls = sample === undefined ? "ky-mu-slot-text" : "ky-mu-sample-text";
+            slotTexts += el("text", { class: `${cls}${board ? ` ${cls}-board` : ""}`, x: num(tx), y: num(ty + size * 0.34), "font-size": num(size), transform: rot === 0 ? undefined : `rotate(${rot} ${num(tx)} ${num(ty)})` }, esc(text));
+        });
     }
     let labelsMarkup = "";
     if (withLabels) {
@@ -260,8 +305,10 @@ export function multiDrawing(options, raise, uprights = true) {
         sentences.push(fill(words.say.stagger, { share: `${Math.round(spec.stagger * 100)}%` }));
     if (layout.shared !== undefined)
         sentences.push(words.say.shared);
-    if (withSlots && layout.slots.some((s) => s.kind !== "board"))
-        sentences.push(fill(words.say.slots, { n: layout.slots.filter((s) => s.kind !== "board").length }));
+    if (withSlots && layout.slots.some((s) => s.kind !== "board")) {
+        const filled = sampleOf(o, words);
+        sentences.push(filled === undefined ? fill(words.say.slots, { n: layout.slots.filter((s) => s.kind !== "board").length }) : fill(words.say.sample, filled));
+    }
     if (spec.event !== undefined) {
         const named = language === "ja" ? spec.event.ja : undefined;
         sentences.push(fill(words.say.event, { event: named?.name ?? spec.event.name, year: spec.event.year, venue: named?.venue ?? spec.event.venue, city: named?.city ?? spec.event.city }));

package/dist/multi.style.js

@@ -40,6 +40,10 @@ ${Object.keys(FLOORS).map((name) => `.kyogijo .ky-mu-hf-${name}{fill:var(--ky-mu
 .kyogijo .ky-mu-slot-board{stroke:var(--ky-mu-board-ink)}
 .kyogijo .ky-mu-slot-text{fill:var(--ky-mu-slot);fill-opacity:.8;font-family:var(--ky-font);font-weight:700;text-anchor:middle}
 .kyogijo .ky-mu-slot-text-board{fill:var(--ky-mu-board-ink)}
+.kyogijo .ky-mu-sample-text{fill:var(--ky-mu-slot);font-family:var(--ky-font);font-weight:700;text-anchor:middle}
+.kyogijo .ky-mu-sample-text-board{fill:var(--ky-mu-board-ink)}
+.kyogijo .ky-mu-emblem{fill:none;stroke:var(--ky-mu-slot);stroke-width:.35;stroke-linejoin:round;stroke-linecap:round}
+.kyogijo .ky-mu-emblem-fill{fill:var(--ky-mu-slot);stroke:none}
 .kyogijo .ky-mu-label{fill:var(--ky-ink);font-family:var(--ky-font);font-weight:800;paint-order:stroke;stroke:var(--ky-halo);stroke-width:.5;stroke-linejoin:round}
 .kyogijo .ky-mu-caption{fill:var(--ky-mu-sb-ink);font-family:var(--ky-font);font-weight:700;text-anchor:middle}
 .kyogijo.ky-multi{--ky-cr-home:#8b94a3;--ky-cr-away:#8b94a3}

package/dist/multi.turn.js

@@ -7,7 +7,7 @@ import { multiDrawing } from "./multi.draw.js";
 import { outlineOf } from "./outline.js";
 import { hash } from "./format.js";
 import { TURN_PRESETS, NET_PRESETS, wrap } from "./turn.camera.js";
-import { flat, n, plane, shy, thinnest, wall } from "./turn.kit.js";
+import { box, flat, n, plane, rect, shy, thinnest, wall } from "./turn.kit.js";
 import { mountTurn } from "./turn.dom.js";
 import { turnMarkupOf } from "./turn.markup.js";
 import { openingView, sceneBox } from "./turn.model.js";
@@ -51,14 +51,6 @@ function place(p, m, id) {
     }
     return moved;
 }
-const rect = (x, y, w, h) => ({ x0: x, y0: y, x1: x + w, y1: y + h });
-/** A solid box on the floor: four sides up to `z1` and a flat top. `cls` paints the top; the sides are one tone darker (`cls-side`). */
-function box(id, kind, r, z1, cls) {
-    const sides = [[r.x0, r.y0, r.x1, r.y0], [r.x1, r.y0, r.x1, r.y1], [r.x1, r.y1, r.x0, r.y1], [r.x0, r.y1, r.x0, r.y0]];
-    const planes = sides.map(([a, b, c, d], i) => wall(`${id}-${i + 1}`, kind, a, b, c, d, 0, z1, `<rect width="${n(Math.hypot(c - a, d - b))}" height="${n(z1)}" class="${cls}-side"/>`));
-    planes.push(flat(`${id}-top`, kind, r.x0, r.y0, r.x1, r.y1, z1, `<rect width="${n(r.x1 - r.x0)}" height="${n(r.y1 - r.y0)}" class="${cls}"/>`));
-    return planes;
-}
 /** The surround of one area: four sides over the rectangle, each in pieces of at most `SURROUND_PIECE`, facing out from the area's middle (it gives way to a nearly level eye, as the glass of a rink does, but only then). */
 function surround(id, r) {
     const centre = [(r.x0 + r.x1) / 2, (r.y0 + r.y1) / 2];

package/dist/multi.types.d.ts

@@ -37,6 +37,12 @@ export interface MultiEvent {
     /** Keys of `MULTI_SOURCES`. */
     sources: readonly string[];
 }
+/** The words of a sample event: any part left out is the package's own. */
+export interface MultiSample {
+    event?: string;
+    year?: string | number;
+    city?: string;
+}
 /** What stands on or beside each playing surface, and over the floor. */
 export interface MultiParts {
     /** The barriers (surrounds) that enclose each playing area, drawn round the area's bay. */
@@ -244,6 +250,12 @@ export interface MultiOptions {
     };
     /** The empty places for the event's words and marks, and the boards: on by default; `false` draws neither. */
     slots?: boolean;
+    /**
+     * Fill the places for the event's words and marks with sample content, to show a layout as an event would dress it: an invented event name, year and city on the floor and the boards, and simple emblems of the package's own
+     * (a ring with a star, a diamond or waves) in the logo places, in place of the dashed empty places. `true` for "Kyogijo Open 2026, Osaka" (in Japanese, 競技場杯 2026, 大阪), or the event's name, year and city of
+     * your own. It names no real event, brand, federation or sponsor. Off by default: the places are drawn empty, as a layout is configured.
+     */
+    sample?: boolean | MultiSample;
     /** The names of the surfaces over them. On by default. */
     labels?: boolean;
     language?: "en" | "ja";

package/dist/multi.words.d.ts

@@ -21,6 +21,12 @@ export interface MultiWords {
         floorLogo: string;
         board: string;
     };
+    /** The invented event of the sample content (`sample: true`): its name, its year and its city. */
+    sample: {
+        event: string;
+        year: string;
+        city: string;
+    };
     /** The sentences of the title and the description. */
     say: {
         title: string;
@@ -29,6 +35,7 @@ export interface MultiWords {
         stagger: string;
         shared: string;
         slots: string;
+        sample: string;
         venue: string;
         stadium: string;
         event: string;

package/dist/multi.words.js

@@ -3,6 +3,7 @@ export const MULTI_WORDS = {
         names: { table: "Table {n}", court: "Court {n}", sheet: "Sheet {n}", area: "Area {n}" },
         parts: { chair: "Umpire's chair", table: "Score table", scoreboard: "Scoreboard", shared: "One scoreboard for all, hung over the middle", barrier: "Barrier", board: "Board", floor: "Floor", hall: "Hall floor", stands: "Stands" },
         slots: { floorText: "Event name, year and city", floorLogo: "Logo", board: "Board" },
+        sample: { event: "Kyogijo Open", year: "2026", city: "Osaka" },
         say: {
             title: "{name}",
             drawn: "Drawn as: {name}, {surfaces} playing surfaces to scale on one floor of {length} by {width} metres ({area} square metres).",
@@ -10,6 +11,7 @@ export const MULTI_WORDS = {
             stagger: "Every other row is moved along by {share} of a bay.",
             shared: "One scoreboard for all is hung over the middle of the floor.",
             slots: "The empty places for the event's own words and marks are drawn dashed: {n}.",
+            sample: "The places for the event's words and marks carry sample content: an invented event, {event}, {year}, {city}, and simple emblems. Nothing real is printed.",
             venue: "Set in {venue}: {fit}",
             stadium: "Drawn inside a stadium to the same scale: walls, stands and crowd.",
             event: "Tied to {event}, {year}, {venue}, {city}.",
@@ -31,6 +33,7 @@ export const MULTI_WORDS = {
         names: { table: "第{n}台", court: "第{n}コート", sheet: "第{n}シート", area: "第{n}試合場" },
         parts: { chair: "審判席", table: "記録台", scoreboard: "スコアボード", shared: "中央の真上に吊るした全面共用のスコアボード", barrier: "フェンス", board: "ボード", floor: "床", hall: "会場の床", stands: "スタンド" },
         slots: { floorText: "大会名・年・開催地", floorLogo: "ロゴ", board: "ボード" },
+        sample: { event: "競技場杯", year: "2026", city: "大阪" },
         say: {
             title: "{name}",
             drawn: "{name}。競技面を{surfaces}面、横{length}m×縦{width}m（{area}平方メートル）の床1枚の上に縮尺どおりに描いています。",
@@ -38,6 +41,7 @@ export const MULTI_WORDS = {
             stagger: "1行おきに、1区画の{share}だけずらしています。",
             shared: "床の中央の上に、全面共用のスコアボードを1台吊るしています。",
             slots: "大会の文字やマークを入れる空き枠を破線で描いています：{n}か所。",
+            sample: "大会名やマークを入れる枠には、見本として架空の大会「{event}」（{year}年・{city}）と簡単なエンブレムを入れています。実在の大会や団体のものは含まれていません。",
             venue: "{venue}に置いた場合：{fit}",
             stadium: "同じ縮尺で、壁・スタンド・観客を備えたスタジアムの中に描いています。",
             event: "関連する大会：{event}（{year}年、{venue}、{city}）。",

package/dist/strings.d.ts

@@ -993,7 +993,7 @@ export interface KyogijoWords {
         item: string;
         itemSag: string;
         /** The names of what stands on the surface, by kind. */
-        parts: Record<"scoreboard" | "net" | "antennae" | "goalposts" | "netposts" | "hoop" | "goal" | "boards" | "stumps" | "pylons" | "flags" | "fence" | "backstop" | "foul-poles" | "table-legs" | "walls" | "starting-blocks" | "backstroke-flags" | "false-start-rope" | "springboards" | "platforms" | "judges-stand" | "hurdles" | "steeplechase" | "high-jump" | "pole-vault" | "cage" | "padding" | "rink-boards" | "mound" | "azuchi" | "targets" | "stands" | "wall-seats" | "roof" | "gallery" | "dais" | "banner" | "shrine" | "mat-edge" | "surrounds" | "officials", string>;
+        parts: Record<"scoreboard" | "net" | "antennae" | "goalposts" | "netposts" | "hoop" | "goal" | "boards" | "stumps" | "pylons" | "flags" | "fence" | "backstop" | "foul-poles" | "table-legs" | "walls" | "starting-blocks" | "backstroke-flags" | "false-start-rope" | "springboards" | "platforms" | "judges-stand" | "hurdles" | "steeplechase" | "high-jump" | "pole-vault" | "cage" | "padding" | "rink-boards" | "mound" | "azuchi" | "targets" | "stands" | "wall-seats" | "roof" | "gallery" | "dais" | "banner" | "shrine" | "mat-edge" | "surrounds" | "officials" | "judges", string>;
     };
     /** The names of the zones that `zoneAt` answers with (rules.ts), by id. */
     rules: Record<RuleId, string>;

package/dist/strings.js

@@ -432,7 +432,7 @@ export const KYOGIJO_STRINGS = {
             announce: "{name} view", announceAngle: "Turned to {yaw} degrees, seen from {pitch} degrees above the floor.",
             flat: "This browser cannot draw the 3D view, so the flat drawing is shown.",
             standing: "Standing on it, in the 3D view: {list}.", item: "{name} {h}", itemSag: "{name} {h} at the posts, {low} at the middle",
-            parts: { scoreboard: "scoreboard (lower edge)", net: "net", antennae: "antennae", goalposts: "goal posts", netposts: "net posts", hoop: "baskets", goal: "goals", boards: "boards and glass", stumps: "stumps", pylons: "pylons", flags: "corner flags", fence: "fence", backstop: "backstop", "foul-poles": "foul poles", "table-legs": "table top", walls: "walls", "starting-blocks": "starting blocks", "backstroke-flags": "backstroke flags", "false-start-rope": "false start rope", springboards: "springboards", platforms: "platforms", "judges-stand": "judges' stand", hurdles: "hurdles", steeplechase: "steeplechase barriers", "high-jump": "high jump uprights and bar", "pole-vault": "pole vault uprights and bar", cage: "discus and hammer cage", padding: "padding", "rink-boards": "boards", mound: "clay mound", azuchi: "azuchi", targets: "targets", stands: "stands", "wall-seats": "seats on top of the wall", roof: "roof", gallery: "gallery", dais: "dais", banner: "banner", shrine: "shrine", "mat-edge": "mat thickness", surrounds: "surrounds", officials: "umpires' chairs and score tables" },
+            parts: { scoreboard: "scoreboard (lower edge)", net: "net", antennae: "antennae", goalposts: "goal posts", netposts: "net posts", hoop: "baskets", goal: "goals", boards: "boards and glass", stumps: "stumps", pylons: "pylons", flags: "corner flags", fence: "fence", backstop: "backstop", "foul-poles": "foul poles", "table-legs": "table top", walls: "walls", "starting-blocks": "starting blocks", "backstroke-flags": "backstroke flags", "false-start-rope": "false start rope", springboards: "springboards", platforms: "platforms", "judges-stand": "judges' stand", hurdles: "hurdles", steeplechase: "steeplechase barriers", "high-jump": "high jump uprights and bar", "pole-vault": "pole vault uprights and bar", cage: "discus and hammer cage", padding: "padding", "rink-boards": "boards", mound: "clay mound", azuchi: "azuchi", targets: "targets", stands: "stands", "wall-seats": "seats on top of the wall", roof: "roof", gallery: "gallery", dais: "dais", banner: "banner", shrine: "shrine", "mat-edge": "mat thickness", surrounds: "surrounds", officials: "umpires' chairs and score tables", judges: "name cards on the judges' table" },
         },
         rules: {
             "defensive-zone": "Defensive zone",
@@ -968,7 +968,7 @@ export const KYOGIJO_STRINGS = {
             announce: "{name}の視点", announceAngle: "向きは{yaw}度、見下ろす角度は{pitch}度です。",
             flat: "このブラウザーでは3D表示ができないため、平面の図を表示しています。",
             standing: "3D表示で立って見えるもの：{list}。", item: "{name} {h}", itemSag: "{name} 支柱の位置で{h}（中央は{low}）",
-            parts: { scoreboard: "スコアボードの下端", net: "ネット", antennae: "アンテナ", goalposts: "ゴールポスト", netposts: "支柱", hoop: "バスケットゴール", goal: "ゴール", boards: "ボードとガラス", stumps: "ウィケットのスタンプ", pylons: "パイロン", flags: "コーナーフラッグ", fence: "外野フェンス", backstop: "バックネット", "foul-poles": "ファウルポール", "table-legs": "天板", walls: "壁", "starting-blocks": "スタート台", "backstroke-flags": "背泳ぎ用フラッグ", "false-start-rope": "フォルススタートロープ", springboards: "飛板", platforms: "固定台", "judges-stand": "ジャッジ台", hurdles: "ハードル", steeplechase: "障害物", "high-jump": "走高跳の支柱とバー", "pole-vault": "棒高跳の支柱とバー", cage: "円盤投・ハンマー投の囲い", padding: "防護マット", "rink-boards": "フェンス", mound: "土の台", azuchi: "安土", targets: "的", stands: "スタンド", "wall-seats": "壁の上の観客席", roof: "屋根", gallery: "見学席", dais: "上座の台", banner: "垂れ幕", shrine: "神棚", "mat-edge": "畳の厚み", surrounds: "競技エリアのフェンス", officials: "審判席と記録台" },
+            parts: { scoreboard: "スコアボードの下端", net: "ネット", antennae: "アンテナ", goalposts: "ゴールポスト", netposts: "支柱", hoop: "バスケットゴール", goal: "ゴール", boards: "ボードとガラス", stumps: "ウィケットのスタンプ", pylons: "パイロン", flags: "コーナーフラッグ", fence: "外野フェンス", backstop: "バックネット", "foul-poles": "ファウルポール", "table-legs": "天板", walls: "壁", "starting-blocks": "スタート台", "backstroke-flags": "背泳ぎ用フラッグ", "false-start-rope": "フォルススタートロープ", springboards: "飛板", platforms: "固定台", "judges-stand": "ジャッジ台", hurdles: "ハードル", steeplechase: "障害物", "high-jump": "走高跳の支柱とバー", "pole-vault": "棒高跳の支柱とバー", cage: "円盤投・ハンマー投の囲い", padding: "防護マット", "rink-boards": "フェンス", mound: "土の台", azuchi: "安土", targets: "的", stands: "スタンド", "wall-seats": "壁の上の観客席", roof: "屋根", gallery: "見学席", dais: "上座の台", banner: "垂れ幕", shrine: "神棚", "mat-edge": "畳の厚み", surrounds: "競技エリアのフェンス", officials: "審判席と記録台", judges: "審判員席の名札" },
         },
         rules: {
             "defensive-zone": "ディフェンディングゾーン",

package/dist/turn.kit.d.ts

@@ -1,7 +1,7 @@
 /** A point or a direction: x, y, z in feet. */
 export type V3 = readonly [number, number, number];
 /** What a plane is a part of: it is the class of its element (`ky-up-<kind>`) and what a test finds it by. */
-export type PartKind = "post" | "net" | "tape" | "antenna" | "board" | "glass" | "rim" | "stanchion" | "frame" | "goal" | "flag" | "stump" | "leg" | "table" | "pylon" | "wall" | "screen" | "pole" | "ground" | "target" | "seats" | "concourse" | "fascia" | "roof" | "banner" | "platform" | "rail" | "matedge" | "shrine" | "surround" | "chair" | "desk";
+export type PartKind = "post" | "net" | "tape" | "antenna" | "board" | "glass" | "rim" | "stanchion" | "frame" | "goal" | "flag" | "stump" | "leg" | "table" | "pylon" | "wall" | "screen" | "pole" | "ground" | "target" | "seats" | "concourse" | "fascia" | "roof" | "banner" | "platform" | "rail" | "matedge" | "shrine" | "surround" | "chair" | "desk" | "card" | "sign";
 /** One flat rectangle. Its own x runs along `u` (its whole length) and its own y along `v`; `o` is the corner both start from. `svg` is what is drawn on it, in feet along `u` and `v`. */
 export interface Plane {
     /** A name that says what it is and where: `net`, `post-left`, `goal-right-back`. */
@@ -32,7 +32,7 @@ export interface Plane {
     fadeAt?: number;
 }
 /** What stands on the surface as a thing a reader would name: a net, a basket, a goal, a pair of posts. */
-export type UprightKind = "scoreboard" | "net" | "antennae" | "goalposts" | "netposts" | "hoop" | "goal" | "boards" | "stumps" | "pylons" | "flags" | "fence" | "backstop" | "foul-poles" | "table-legs" | "walls" | "starting-blocks" | "backstroke-flags" | "false-start-rope" | "springboards" | "platforms" | "judges-stand" | "hurdles" | "steeplechase" | "high-jump" | "pole-vault" | "cage" | "padding" | "rink-boards" | "mound" | "azuchi" | "targets" | "stands" | "wall-seats" | "roof" | "gallery" | "dais" | "banner" | "shrine" | "mat-edge" | "surrounds" | "officials";
+export type UprightKind = "scoreboard" | "net" | "antennae" | "goalposts" | "netposts" | "hoop" | "goal" | "boards" | "stumps" | "pylons" | "flags" | "fence" | "backstop" | "foul-poles" | "table-legs" | "walls" | "starting-blocks" | "backstroke-flags" | "false-start-rope" | "springboards" | "platforms" | "judges-stand" | "hurdles" | "steeplechase" | "high-jump" | "pole-vault" | "cage" | "padding" | "rink-boards" | "mound" | "azuchi" | "targets" | "stands" | "wall-seats" | "roof" | "gallery" | "dais" | "banner" | "shrine" | "mat-edge" | "surrounds" | "officials" | "judges";
 /** A thing that stands on the surface: where, how high, and the planes it is made of. */
 export interface Upright {
     id: string;
@@ -93,3 +93,14 @@ export declare function shy(p: Plane, centre: readonly [number, number]): Plane;
  * from straight above hides nothing. `yaw` and `pitch` are the view's, in degrees.
  */
 export declare function fadeOf(p: Pick<Plane, "shy" | "fadeTo" | "fadeAt">, yaw: number, pitch: number): number;
+/** A rectangle on the surface, in feet: its corners. */
+export type Rect = {
+    x0: number;
+    y0: number;
+    x1: number;
+    y1: number;
+};
+/** A rectangle from its corner and its size. */
+export declare const rect: (x: number, y: number, w: number, h: number) => Rect;
+/** A solid box on the floor: four sides up to `z1` and a flat top. `cls` paints the top; the sides are one tone darker (`cls-side`). */
+export declare function box(id: string, kind: Plane["kind"], r: Rect, z1: number, cls: string): Plane[];

package/dist/turn.kit.js

@@ -109,3 +109,12 @@ export function fadeOf(p, yaw, pitch) {
     const t = Math.min(1, Math.max(0, (hides - from) / 0.25));
     return Math.round((1 - (1 - (p.fadeTo ?? 0.08)) * t) * 1000) / 1000;
 }
+/** A rectangle from its corner and its size. */
+export const rect = (x, y, w, h) => ({ x0: x, y0: y, x1: x + w, y1: y + h });
+/** A solid box on the floor: four sides up to `z1` and a flat top. `cls` paints the top; the sides are one tone darker (`cls-side`). */
+export function box(id, kind, r, z1, cls) {
+    const sides = [[r.x0, r.y0, r.x1, r.y0], [r.x1, r.y0, r.x1, r.y1], [r.x1, r.y1, r.x0, r.y1], [r.x0, r.y1, r.x0, r.y0]];
+    const planes = sides.map(([a, b, c, d], i) => wall(`${id}-${i + 1}`, kind, a, b, c, d, 0, z1, `<rect width="${n(Math.hypot(c - a, d - b))}" height="${n(z1)}" class="${cls}-side"/>`));
+    planes.push(flat(`${id}-top`, kind, r.x0, r.y0, r.x1, r.y1, z1, `<rect width="${n(r.x1 - r.x0)}" height="${n(r.y1 - r.y0)}" class="${cls}"/>`));
+    return planes;
+}