@johnmorrisdotca/kyogijo-stadiums 0.23.0 → 0.25.0

package/dist/draw.js

@@ -10,6 +10,7 @@ import { ERA_SPORTS, footballIn, rulesFor, seasonLabel } from "./eras.js";
 import { FOOTBALL } from "./geometry.js";
 import { renderLayers } from "./layers.js";
 import { arenaById, arenaCourtIn, arenaNameIn, arenaOfficialName, arenaRinkIn } from "./arenas.js";
+import { venueById, venueBowl } from "./venues.js";
 import { groundById, groundNameIn, groundOfficialName } from "./grounds.js";
 import { BOARD, courtFor, hasSetsBoard, isNetLeague, isNetSport } from "./court.js";
 import { cricketBoardMarkup } from "./cricket.board.js";
@@ -55,6 +56,7 @@ import { KYOGIJO_STRINGS, fill } from "./strings.js";
 import { courtStyle } from "./courts.style.js";
 import { annotate, annotated, wideView } from "./annotate.js";
 import { KYOGIJO_BACKGROUND_STYLE, laidOn } from "./background.js";
+import { overlayMarkup, placeBoard, resolveBoard } from "./overlay.js";
 import { KYOGIJO_HARDWOOD_STYLE, resolveHardwood } from "./hardwood.js";
 import { WALL_SEATS, densityOf, layoutOf as crowdLayout, resolveCrowd } from "./crowd.js";
 import { drawCrowd, KYOGIJO_CROWD_STYLE } from "./crowd.draw.js";
@@ -427,10 +429,16 @@ function standsFor(o, surface, crowd) {
         const walls = park === undefined || crowd.wallSeats === false ? [] : parkWallsIn(park, o.year).filter((w) => (crowd.wallSeats === true ? w.height_ft >= 25 : w.label !== undefined && WALL_SEATS[park.id] === w.label));
         return parkLayout({ fence: fenceOutline(points), backstop, crowd, seatsOnWalls: walls.map((w) => ({ from: w.from, to: w.to, height: w.height_ft })) });
     }
+    // An arena's real venue: the building it stands in and a bowl fitted to it, where the package has one for the arena and no league of the caller's own sets the surface.
+    const box = surface.whole ?? surface.box ?? { x: 0, y: 0, w: 100, h: 100 };
+    const venue = crowd.real && sport === "nhl" && chooseLeague(o).league === undefined ? venueById(o.arena) : undefined;
+    // (No visitors' block: no source says where a real arena puts them.)
+    if (venue !== undefined)
+        return crowdLayout({ sport, box, crowd: crowd.awayEnd === "auto" ? { ...crowd, awayEnd: "none" } : crowd, awaySide, real: venueBowl(venue, box) });
     // A dojo's crowd sits in its gallery, from the room's balcony data (in feet here); the arenas (the Budokan, the Kokugikan) keep their bowls.
     const hall = sport === "dojo" ? dojoGallery(o) : undefined;
     const gallery = hall === undefined ? undefined : { offset: hall.offset / 0.3048, depth: hall.depth / 0.3048, height: [hall.height[0] / 0.3048, hall.height[1] / 0.3048], rows: hall.rows, aisles: hall.aisles };
-    return crowdLayout({ sport, box: surface.whole ?? surface.box ?? { x: 0, y: 0, w: 100, h: 100 }, crowd, awaySide, ground: o.ground, arena: o.budo?.hall === "budokan", ...(gallery === undefined ? {} : { gallery }) });
+    return crowdLayout({ sport, box, crowd, awaySide, ground: o.ground, arena: o.budo?.hall === "budokan", ...(gallery === undefined ? {} : { gallery }) });
 }
 /** True when the drawing is asked to be small: `detail: "simple"` or a `width` under 480 pixels. */
 const smallDrawing = (o) => {
@@ -715,7 +723,11 @@ export function describe(o) {
     const special = specialText(o, language, surfaceName);
     // What the arena says about the size: that it is the one its sources publish, or that its rink is said to have been shorter and no size is given.
     const arenaLine = arenaName === undefined ? "" : `${arenaSize !== undefined ? `${gap}${fill(words.said.arenaSize, { arena: arenaName })}` : sport === "nhl" && arena?.rinkUnknown === true ? `${gap}${fill(words.said.arenaUnknown, { arena: arenaName })}` : ""}${officially(arena === undefined ? undefined : arenaOfficialName(arena, language, year))}`;
-    const parkLine = (parkName === undefined ? `${groundLine}${halfLine}${arenaLine}` : `${gap}${fill(words.said.park, { park: parkName })}${officially(parkOfficial)}${ballpark === undefined ? "" : ballparkSentences(ballpark).map((line) => `${gap}${line}`).join("")}`) + (special === undefined ? "" : `${gap}${special.text}`);
+    // The stands of a real venue say what they are: a plausible bowl, and how the rink lies in the building.
+    const realCrowd = o.crowd === undefined || o.crowd === false ? undefined : resolveCrowd(o.crowd);
+    const venue = sport === "nhl" && league === undefined && realCrowd?.real === true ? venueById(o.arena) : undefined;
+    const realLine = venue === undefined || arenaName === undefined ? "" : `${gap}${fill(words.said.real, { arena: arenaName, seats: String(venue.seats.hockey), tiers: String(venue.tiers.count) })}${gap}${words.said[venue.osm.axis.basis === "mapped" ? "realMapped" : venue.osm.axis.basis === "building" ? "realBuilding" : "realNone"]}`;
+    const parkLine = (parkName === undefined ? `${groundLine}${halfLine}${arenaLine}${realLine}` : `${gap}${fill(words.said.park, { park: parkName })}${officially(parkOfficial)}${ballpark === undefined ? "" : ballparkSentences(ballpark).map((line) => `${gap}${line}`).join("")}`) + (special === undefined ? "" : `${gap}${special.text}`);
     // A drawing of a past season says which: the markings are those of that season.
     const dated = typeof o.year === "number" && Number.isFinite(o.year);
     const eraLine = dated && league !== undefined
@@ -901,6 +913,8 @@ function drawnKyogijo(o) {
     let defs = "";
     let grounded = false;
     let foldedSheet = false;
+    let boarded;
+    const board = sized === "badge" ? undefined : resolveBoard(o.board);
     let pg;
     if (isScore(o) && left !== undefined && right !== undefined && sized === "badge") {
         const badge = badgeMarkup(left, right, { sport, status, parts, id, situation: situation === undefined ? undefined : badgeSituation(situation, language) });
@@ -1065,6 +1079,14 @@ function drawnKyogijo(o) {
             body = group;
             viewBox = `${num(v.x)} ${num(v.y)} ${num(v.w)} ${num(v.h)}`;
         }
+        // A board over the surface, in the drawing's own units, over everything else (a strip's score stays clear of it, under the surface).
+        if (board !== undefined) {
+            const laid = overlayMarkup(board, placeBoard(board, v));
+            if (laid !== "") {
+                body += laid;
+                boarded = typeof board.position === "object" ? "custom" : board.position;
+            }
+        }
     }
     const root = el("svg", {
         xmlns: "http://www.w3.org/2000/svg",
@@ -1084,6 +1106,7 @@ function drawnKyogijo(o) {
         "data-track": sport === "athletics" ? o.athletics?.track : undefined,
         "data-winner": isScore(o) ? winner : undefined,
         "data-pageant": pg === undefined ? undefined : pageant?.style,
+        "data-board": boarded,
         "data-version": VERSION,
         width: safeLength(o.width),
         height: safeLength(o.height),

package/dist/index.d.ts

@@ -10,6 +10,8 @@ export { OUTCOMES, drawLayers, layerTable } from "./layers.ts";
 export { RANGES } from "./ranges.names.ts";
 export { BACKGROUND_OPACITY, BACKGROUND_PATTERNS, KYOGIJO_BACKGROUND_STYLE } from "./background.ts";
 export type { Background, BackgroundFit, BackgroundOptions, BackgroundPattern } from "./background.ts";
+export { BOARD_CLEAR, BOARD_POSITIONS, placeBoard } from "./overlay.ts";
+export type { BoardBox, BoardOptions, BoardPoint, BoardPosition } from "./overlay.ts";
 export { FIELD_SPORTS, fieldPlan, isFieldSport } from "./fields.ts";
 export { POOL_SPORTS, isPoolSport, poolPlan, swimPlan, venueLayout } from "./pool.ts";
 export type { ArtisticPlan, Board, DivePlan, LanePlan, PoloPlan, PoolPlan, Rope, RopeColour, SwimPlan, VenueItem, VenueLayout } from "./pool.ts";
@@ -61,6 +63,8 @@ export { ERA_CURRENT, ERA_SOURCES, ERA_SPORTS, eraChanges, eraRange, eraStates,
 export type { EraChange, EraRules, EraRulesOf, EraSource, EraSpan, EraSport, FootballRules, MlbRules, NbaRules, NhlRules } from "./eras.ts";
 export { ARENA_IDS, ARENAS, arenaById, arenaByName, arenaByWikidata, arenaCourtIn, arenaNameIn, arenaOfficialName, arenaRinkIn, arenaSourceUrl, arenasByName } from "./arenas.ts";
 export type { Arena, ArenaCapacity, ArenaData, ArenaName, ArenaSize, ArenaSource } from "./arenas.ts";
+export { VENUE_ATTRIBUTION, VENUE_IDS, VENUES, arenaOfVenue, bowlInside, planVenue, venueBowl, venueById, venueByWikidata, venueOrientation, venueRink, venuesIn } from "./venues.ts";
+export type { RealVenue, RealVenueData, VenueBasis, VenueDivision, VenueOrientation, VenueOsm, VenuePlan, VenueRoof } from "./venues.ts";
 export { GROUND_IDS, GROUNDS, groundById, groundByName, groundByWikidata, groundNameIn, groundOfficialName, groundSourceUrl, groundsByName, groundsHosting } from "./grounds.ts";
 export type { Ground, GroundCompetition, GroundData, GroundName, GroundSource, GroundTournament } from "./grounds.ts";
 export { AFL_GROUNDS, FAMILY_OF, LEAGUES, LEAGUE_SOURCES, VARIANTS, chooseLeague, hasHistory, leagueAt, leagueById, leagueChanges, leagueFigures, leagueIds, leagueSeason, leagueSize } from "./leagues.ts";

package/dist/index.js

@@ -8,6 +8,7 @@ export { useFlags } from "./flags-source.js";
 export { OUTCOMES, drawLayers, layerTable } from "./layers.js";
 export { RANGES } from "./ranges.names.js";
 export { BACKGROUND_OPACITY, BACKGROUND_PATTERNS, KYOGIJO_BACKGROUND_STYLE } from "./background.js";
+export { BOARD_CLEAR, BOARD_POSITIONS, placeBoard } from "./overlay.js";
 export { FIELD_SPORTS, fieldPlan, isFieldSport } from "./fields.js";
 export { POOL_SPORTS, isPoolSport, poolPlan, swimPlan, venueLayout } from "./pool.js";
 export { formatTime, parseTime } from "./pool.race.js";
@@ -38,6 +39,7 @@ export { PARKS, PARK_IDS, fenceFor, parkById, parkByName, parkByWikidata, parkNa
 export { officialName, plainName } from "./names.js";
 export { ERA_CURRENT, ERA_SOURCES, ERA_SPORTS, eraChanges, eraRange, eraStates, footballIn, rulesFor, seasonLabel } from "./eras.js";
 export { ARENA_IDS, ARENAS, arenaById, arenaByName, arenaByWikidata, arenaCourtIn, arenaNameIn, arenaOfficialName, arenaRinkIn, arenaSourceUrl, arenasByName } from "./arenas.js";
+export { VENUE_ATTRIBUTION, VENUE_IDS, VENUES, arenaOfVenue, bowlInside, planVenue, venueBowl, venueById, venueByWikidata, venueOrientation, venueRink, venuesIn } from "./venues.js";
 export { GROUND_IDS, GROUNDS, groundById, groundByName, groundByWikidata, groundNameIn, groundOfficialName, groundSourceUrl, groundsByName, groundsHosting } from "./grounds.js";
 export { AFL_GROUNDS, FAMILY_OF, LEAGUES, LEAGUE_SOURCES, VARIANTS, chooseLeague, hasHistory, leagueAt, leagueById, leagueChanges, leagueFigures, leagueIds, leagueSeason, leagueSize } from "./leagues.js";
 export { SURFACE_UNITS, UNITS, convertLength, isUnit } from "./units.js";

package/dist/overlay.d.ts

@@ -0,0 +1,73 @@
+/** Where a board goes. `top` and `bottom` are centred on the drawing's top and bottom edge, `side` is at the right edge, centred, `left` the same at the left, `corner` is the top right corner, and the four corners by their names. */
+export type BoardPosition = "top" | "bottom" | "side" | "left" | "corner" | "top-left" | "top-right" | "bottom-left" | "bottom-right";
+/** A place of your own: the board's top left corner (or, with `anchor: "center"`, its middle) at this share of the drawing's width (`x`) and height (`y`), 0 to 1. The board may then cover the middle of the surface: you asked for it. */
+export interface BoardPoint {
+    x: number;
+    y: number;
+    anchor?: "start" | "center";
+}
+/** A board over a drawing. */
+export interface BoardOptions {
+    /** The board, as SVG text (`<svg …>…</svg>`): the string `resultsBoard`, `boutBoard` or `broadcastMedalTable` of Taisen Brackets gives. It is written as an image, so nothing in it can run and its styles stay in it. Anything else is ignored. */
+    svg: string;
+    /** The board's own width and height, the numbers its maker gives (`resultsBoardSize`, `boutBoardSize`, `broadcastMedalSize`): they give its shape. Left out, the `viewBox` of the SVG is read. A board with no size is ignored. */
+    width?: number;
+    height?: number;
+    /** Where it goes: a name (`BOARD_POSITIONS`) or a point of your own. `top` by default. */
+    position?: BoardPosition | BoardPoint;
+    /** How opaque it is, 0 to 1. 1 by default. */
+    opacity?: number;
+    /** Its width as a share of the drawing's width, 0.1 to 1. By default 0.5 at the top and the bottom, 0.3 at a side and 0.36 in a corner, and 0.4 at a point; a board is never made larger than the room that keeps the middle of the surface clear. */
+    share?: number;
+    /** The gap between the board and the edge of the drawing, as a share of the drawing's width, 0 to 0.2. 0.02 by default. */
+    margin?: number;
+    /** Let a named position cover the middle of the surface, so that the board may be as large as `share` says (it is still kept inside the drawing). Off by default. */
+    cover?: boolean;
+    /** What the board says, in a sentence, for a reader who cannot see it: its title and who leads, say. Without it the board is hidden from assistive technology (it is a picture of what the page says elsewhere). */
+    label?: string;
+}
+/** A board that has been read: sizes and places that can be used, and the picture as an address. */
+export interface ResolvedBoard {
+    href: string;
+    width: number;
+    height: number;
+    position: BoardPosition | {
+        x: number;
+        y: number;
+        anchor: "start" | "center";
+    };
+    opacity: number;
+    share: number;
+    margin: number;
+    cover: boolean;
+    label: string | undefined;
+}
+/** A box: a drawing's viewBox, or the place a board takes in it. */
+export interface BoardBox {
+    x: number;
+    y: number;
+    w: number;
+    h: number;
+}
+/** The positions, in the order a menu lists them. */
+export declare const BOARD_POSITIONS: readonly BoardPosition[];
+/** The share of a drawing's width and of its height that is kept clear round its middle: a board placed by name does not reach into it, so the middle of the playing area, where the score's panel stands, is never covered. */
+export declare const BOARD_CLEAR = 0.34;
+/** The shape of the box a 3D view is placed for (16 by 10, the view's own) and the units of it: a board in 3D is placed for this box and keeps its place, as a share of the box, when the box is another shape. */
+export declare const BOARD_TURN_BOX: BoardBox;
+/** The board an option asks for, read: a bad one is `undefined` and the drawing is as it was without it, as a bad `background` image is. */
+export declare function resolveBoard(value: unknown): ResolvedBoard | undefined;
+/**
+ * The place a board takes in a box. A named position keeps to its edge and takes the share asked for, unless that would reach into the middle (`BOARD_CLEAR` of the box's width and height, centred): then the board is made smaller, down
+ * to nothing in a box too small to hold one, and never moved. `cover` lifts that, and a point of your own is never held to it. The board keeps its own shape, and stays inside the box.
+ */
+export declare function placeBoard(board: ResolvedBoard, view: BoardBox): BoardBox;
+/** The board as markup in a drawing: an image in the box `placeBoard` gave, in the drawing's own units, over everything else. Nothing for a box with no room. */
+export declare function overlayMarkup(board: ResolvedBoard, box: BoardBox): string;
+/**
+ * The 3D view's board: a layer over the whole view (not in the scene, so it never turns, tips or zooms with it), and in it the picture at its size as a share of the view's width, its own shape kept (`height:auto`, `object-fit:contain`),
+ * placed by flex alignment on the view's edges. Its largest height is what the box `BOARD_TURN_BOX` gives it, so that on a wider view than that it still does not reach into the middle. It never takes the pointer: a drag on it turns the view.
+ */
+export declare function turnBoardMarkup(board: ResolvedBoard): string;
+/** The rules of the 3D view's board layer, written into `KYOGIJO_TURN_STYLE`. */
+export declare const KYOGIJO_TURN_BOARD_STYLE: string;

package/dist/overlay.js

@@ -0,0 +1,182 @@
+// A board laid over a drawing: a results board, a bout presentation, a medal table, drawn by anything else as an SVG (Taisen Brackets', say) and placed here, over the surface, in 2D (`board` in the drawing's
+// options) and in 3D (`board` in the options of the 3D view, where it is a screen-space overlay over the view and never a plane that turns). The package takes the board as a string and draws no board of its own and
+// reads nothing from the one it is given but its size: it is written as an image, which cannot run scripts, scaled evenly (its own shape is kept, so no letter is ever stretched), and placed by a named position
+// that keeps the middle of the surface clear, or by a point of the caller's choosing. Pure: the same options always give the same string.
+import { safePicture } from "./colour.js";
+import { el, esc, num } from "./format.js";
+/** The positions, in the order a menu lists them. */
+export const BOARD_POSITIONS = ["top", "bottom", "side", "left", "corner", "top-left", "top-right", "bottom-left", "bottom-right"];
+/** The share of a drawing's width and of its height that is kept clear round its middle: a board placed by name does not reach into it, so the middle of the playing area, where the score's panel stands, is never covered. */
+export const BOARD_CLEAR = 0.34;
+/** The shape of the box a 3D view is placed for (16 by 10, the view's own) and the units of it: a board in 3D is placed for this box and keeps its place, as a share of the box, when the box is another shape. */
+export const BOARD_TURN_BOX = { x: 0, y: 0, w: 1600, h: 1000 };
+const MAX_SIZE = 100000;
+const isPosition = (value) => typeof value === "string" && BOARD_POSITIONS.includes(value);
+const finite = (value) => typeof value === "number" && Number.isFinite(value);
+const between = (value, low, high) => Math.min(high, Math.max(low, value));
+/** The width and height of an SVG document's root, from its `viewBox`. */
+function viewBoxOf(svg) {
+    const root = /^\s*(?:<\?xml[^>]*\?>\s*)?(?:<!--[\s\S]*?-->\s*)*<svg\b[^>]*>/i.exec(svg)?.[0];
+    const box = root === undefined ? undefined : /\sviewBox\s*=\s*"\s*(-?[\d.]+)[\s,]+(-?[\d.]+)[\s,]+([\d.]+)[\s,]+([\d.]+)\s*"/i.exec(root);
+    if (box === undefined || box === null)
+        return undefined;
+    const [width, height] = [Number(box[3]), Number(box[4])];
+    return Number.isFinite(width) && Number.isFinite(height) && width > 0 && height > 0 ? { width, height } : undefined;
+}
+const defaultShare = (position) => {
+    if (typeof position === "object")
+        return 0.4;
+    if (position === "top" || position === "bottom")
+        return 0.5;
+    if (position === "side" || position === "left")
+        return 0.3;
+    return 0.36;
+};
+/** The board an option asks for, read: a bad one is `undefined` and the drawing is as it was without it, as a bad `background` image is. */
+export function resolveBoard(value) {
+    if (typeof value !== "object" || value === null)
+        return undefined;
+    const o = value;
+    if (typeof o.svg !== "string" || !/^\s*(?:<\?xml|<svg)\b/i.test(o.svg))
+        return undefined;
+    const href = safePicture(o.svg);
+    if (href === undefined)
+        return undefined;
+    const own = viewBoxOf(o.svg);
+    const width = finite(o.width) && o.width > 0 ? o.width : own?.width;
+    const height = finite(o.height) && o.height > 0 ? o.height : own?.height;
+    if (width === undefined || height === undefined || width > MAX_SIZE || height > MAX_SIZE)
+        return undefined;
+    let position = "top";
+    const asked = o.position;
+    if (isPosition(asked))
+        position = asked;
+    else if (typeof asked === "object" && asked !== null && finite(asked.x) && finite(asked.y)) {
+        const point = asked;
+        position = { x: between(point.x, 0, 1), y: between(point.y, 0, 1), anchor: point.anchor === "center" ? "center" : "start" };
+    }
+    const label = typeof o.label === "string" && o.label.trim() !== "" ? o.label.trim().slice(0, 300) : undefined;
+    return {
+        href,
+        width,
+        height,
+        position,
+        opacity: finite(o.opacity) ? between(o.opacity, 0, 1) : 1,
+        share: finite(o.share) ? between(o.share, 0.1, 1) : defaultShare(position),
+        margin: finite(o.margin) ? between(o.margin, 0, 0.2) : 0.02,
+        cover: o.cover === true,
+        label,
+    };
+}
+/** Where a named position stands: which edge it keeps to on each axis. */
+function edges(position) {
+    switch (position) {
+        case "top":
+            return { v: "top", h: "centre" };
+        case "bottom":
+            return { v: "bottom", h: "centre" };
+        case "side":
+            return { v: "middle", h: "right" };
+        case "left":
+            return { v: "middle", h: "left" };
+        case "corner":
+        case "top-right":
+            return { v: "top", h: "right" };
+        case "top-left":
+            return { v: "top", h: "left" };
+        case "bottom-left":
+            return { v: "bottom", h: "left" };
+        case "bottom-right":
+            return { v: "bottom", h: "right" };
+    }
+}
+/**
+ * The place a board takes in a box. A named position keeps to its edge and takes the share asked for, unless that would reach into the middle (`BOARD_CLEAR` of the box's width and height, centred): then the board is made smaller, down
+ * to nothing in a box too small to hold one, and never moved. `cover` lifts that, and a point of your own is never held to it. The board keeps its own shape, and stays inside the box.
+ */
+export function placeBoard(board, view) {
+    const ratio = board.width / board.height;
+    const gap = board.margin * view.w;
+    const inner = { x0: view.x + gap, y0: view.y + gap, x1: view.x + view.w - gap, y1: view.y + view.h - gap };
+    const innerW = Math.max(0, inner.x1 - inner.x0);
+    const innerH = Math.max(0, inner.y1 - inner.y0);
+    const wanted = board.share * view.w;
+    const point = board.position;
+    if (typeof point === "object") {
+        const w = Math.max(0, Math.min(wanted, view.w, view.h * ratio));
+        const h = w / ratio;
+        const x = view.x + point.x * view.w - (point.anchor === "center" ? w / 2 : 0);
+        const y = view.y + point.y * view.h - (point.anchor === "center" ? h / 2 : 0);
+        return { x: between(x, view.x, view.x + view.w - w), y: between(y, view.y, view.y + view.h - h), w, h };
+    }
+    const { v, h: side } = edges(point);
+    const clear = { x0: view.x + view.w * (0.5 - BOARD_CLEAR / 2), x1: view.x + view.w * (0.5 + BOARD_CLEAR / 2), y0: view.y + view.h * (0.5 - BOARD_CLEAR / 2), y1: view.y + view.h * (0.5 + BOARD_CLEAR / 2) };
+    let room = Math.min(innerW, innerH * ratio);
+    if (!board.cover) {
+        // Beside the middle (to its right, or to its left) and above or below it: how wide the board may be in each.
+        const beside = side === "right" ? inner.x1 - (clear.x1 + gap) : side === "left" ? clear.x0 - gap - inner.x0 : 0;
+        const above = v === "top" ? clear.y0 - gap - inner.y0 : v === "bottom" ? inner.y1 - (clear.y1 + gap) : 0;
+        if (v === "middle")
+            room = Math.min(beside, innerH * ratio);
+        else if (side === "centre")
+            room = Math.min(above * ratio, innerW);
+        else
+            room = Math.max(Math.min(beside, innerH * ratio), Math.min(above * ratio, innerW));
+    }
+    const w = Math.max(0, Math.min(wanted, room));
+    const h = w / ratio;
+    const x = side === "left" ? inner.x0 : side === "right" ? inner.x1 - w : view.x + (view.w - w) / 2;
+    const y = v === "top" ? inner.y0 : v === "bottom" ? inner.y1 - h : view.y + (view.h - h) / 2;
+    return { x, y, w, h };
+}
+/** The name a position goes by in the markup. */
+const positionName = (board) => (typeof board.position === "object" ? "custom" : board.position);
+/** The board as markup in a drawing: an image in the box `placeBoard` gave, in the drawing's own units, over everything else. Nothing for a box with no room. */
+export function overlayMarkup(board, box) {
+    if (!(box.w > 0) || !(box.h > 0))
+        return "";
+    return el("g", {
+        class: "ky-board",
+        "data-position": positionName(board),
+        opacity: board.opacity < 1 ? board.opacity : undefined,
+        "pointer-events": "none",
+        role: board.label === undefined ? undefined : "img",
+        "aria-label": board.label,
+        "aria-hidden": board.label === undefined ? "true" : undefined,
+    }, el("image", { class: "ky-board-img", href: board.href, x: box.x, y: box.y, width: box.w, height: box.h, preserveAspectRatio: "xMidYMid meet" }));
+}
+/**
+ * The 3D view's board: a layer over the whole view (not in the scene, so it never turns, tips or zooms with it), and in it the picture at its size as a share of the view's width, its own shape kept (`height:auto`, `object-fit:contain`),
+ * placed by flex alignment on the view's edges. Its largest height is what the box `BOARD_TURN_BOX` gives it, so that on a wider view than that it still does not reach into the middle. It never takes the pointer: a drag on it turns the view.
+ */
+export function turnBoardMarkup(board) {
+    const box = placeBoard(board, BOARD_TURN_BOX);
+    if (!(box.w > 0))
+        return "";
+    const percent = (n) => `${num(Math.round(n * 1000) / 10)}%`;
+    const style = [`width:${percent(box.w / BOARD_TURN_BOX.w)}`, `max-height:${percent(box.h / BOARD_TURN_BOX.h)}`];
+    if (typeof board.position === "object") {
+        style.push("position:absolute", `left:${percent(board.position.x)}`, `top:${percent(board.position.y)}`, "margin:0");
+        if (board.position.anchor === "center")
+            style.push("translate:-50% -50%");
+    }
+    else
+        style.push(`margin:${percent(board.margin)}`);
+    if (board.opacity < 1)
+        style.push(`opacity:${num(board.opacity)}`);
+    const attributes = `class="ky-turn-board" data-position="${positionName(board)}"${board.label === undefined ? ' aria-hidden="true"' : ` role="img" aria-label="${esc(board.label)}"`}`;
+    return `<div ${attributes}><img class="ky-turn-board-img" src="${esc(board.href)}" alt="" width="${num(board.width)}" height="${num(board.height)}" style="${style.join(";")}"></div>`;
+}
+/** The rules of the 3D view's board layer, written into `KYOGIJO_TURN_STYLE`. */
+export const KYOGIJO_TURN_BOARD_STYLE = `
+.ky-turn-board{position:absolute;inset:0;z-index:var(--ky-turn-board-z,9999);display:flex;pointer-events:none;overflow:hidden}
+.ky-turn-board-img{display:block;height:auto;object-fit:contain;flex:none;min-width:0}
+.ky-turn-board[data-position=top]{justify-content:center;align-items:flex-start}
+.ky-turn-board[data-position=bottom]{justify-content:center;align-items:flex-end}
+.ky-turn-board[data-position=side]{justify-content:flex-end;align-items:center}
+.ky-turn-board[data-position=left]{justify-content:flex-start;align-items:center}
+.ky-turn-board[data-position=corner],.ky-turn-board[data-position=top-right]{justify-content:flex-end;align-items:flex-start}
+.ky-turn-board[data-position=top-left]{justify-content:flex-start;align-items:flex-start}
+.ky-turn-board[data-position=bottom-left]{justify-content:flex-start;align-items:flex-end}
+.ky-turn-board[data-position=bottom-right]{justify-content:flex-end;align-items:flex-end}
+.ky-turn-board[data-position=custom]{display:block}`.trim();

package/dist/strings.d.ts

@@ -504,6 +504,12 @@ export interface KyogijoWords {
         arenaSize: string;
         /** An arena whose rink is said to have been shorter than the NHL's, with no size given: {arena}. */
         arenaUnknown: string;
+        /** The stands of an arena's real venue: {seats} seats in {tiers} tiers, fitted inside the outline of {arena}'s building from OpenStreetMap. */
+        real: string;
+        /** How the rink lies in it: along the building's long axis (an inference), as OpenStreetMap maps the ice, or not known. */
+        realBuilding: string;
+        realMapped: string;
+        realNone: string;
         /** A game decided on penalties: {name}, and the shoot-out score {a}-{b}, winner first. */
         wonPens: string;
         /** The shoot-out, as it is written beside a status: {a} and {b}, in the order of the sides on the drawing. */

package/dist/strings.js

@@ -199,7 +199,7 @@ export const KYOGIJO_STRINGS = {
             },
         },
         scoreTitle: "{away} {awayScore}, {home} {homeScore}",
-        said: { home: "home", away: "away", won: "{name} won.", tied: "The game is level.", park: "The outfield fence follows the figures published for {park}.", officially: "Its official name is {name}.", ground: "The pitch follows the size published for {ground}.", groundDefault: "No pitch size is published for {ground}, so the pitch has the international size of 105 by 68 metres.", arenaRink: "{arena}, hockey rink", arenaCourt: "{arena}, basketball court", arenaRinkAbout: "an ice hockey rink, {length} by {width} feet ({lengthM} by {widthM} metres) with rounded corners, with its red and blue lines, face-off circles, creases and goal nets", arenaCourtAbout: "a basketball court, {length} by {width} feet ({lengthM} by {widthM} metres), with its keys, three-point lines, free-throw circles and the centre circle", arenaSize: "The size is the one published for {arena}.", arenaUnknown: "The article says the rink of {arena} was shorter than the NHL's but gives no size, so the NHL's is drawn.", era: "The markings are those of the {season} season.", hammer: "{name} has the hammer.", ends: "By end, {name}: {list}.", total: "Total", wonPens: "{name} won {a}-{b} on penalties.", pens: "{a}-{b} pens", on: "Drawn as", sep: ", ", stop: ".", colon: ": ", gap: " " },
+        said: { home: "home", away: "away", won: "{name} won.", tied: "The game is level.", park: "The outfield fence follows the figures published for {park}.", officially: "Its official name is {name}.", ground: "The pitch follows the size published for {ground}.", groundDefault: "No pitch size is published for {ground}, so the pitch has the international size of 105 by 68 metres.", arenaRink: "{arena}, hockey rink", arenaCourt: "{arena}, basketball court", arenaRinkAbout: "an ice hockey rink, {length} by {width} feet ({lengthM} by {widthM} metres) with rounded corners, with its red and blue lines, face-off circles, creases and goal nets", arenaCourtAbout: "a basketball court, {length} by {width} feet ({lengthM} by {widthM} metres), with its keys, three-point lines, free-throw circles and the centre circle", arenaSize: "The size is the one published for {arena}.", arenaUnknown: "The article says the rink of {arena} was shorter than the NHL's but gives no size, so the NHL's is drawn.", real: "The stands are a plausible bowl of {seats} seats in {tiers} tiers, fitted inside the outline of the building of {arena} from OpenStreetMap ((c) OpenStreetMap contributors); it is not the arena's plan.", realBuilding: "The rink lies along the building's long axis, which is an inference, and the arrow points north.", realMapped: "The rink lies as OpenStreetMap maps the ice, and the arrow points north.", realNone: "The rink's orientation is not known, so it is drawn east-west with north at the top.", era: "The markings are those of the {season} season.", hammer: "{name} has the hammer.", ends: "By end, {name}: {list}.", total: "Total", wonPens: "{name} won {a}-{b} on penalties.", pens: "{a}-{b} pens", on: "Drawn as", sep: ", ", stop: ".", colon: ": ", gap: " " },
         budo: {
             sides: { north: "north", south: "south", east: "east", west: "west" },
             judo: "a judo contest area of {contest} by {contest} metres in a safety area {safety} metres wide, laid with tatami of {tatami}",
@@ -758,7 +758,7 @@ export const KYOGIJO_STRINGS = {
             },
         },
         scoreTitle: "{away} {awayScore}、{home} {homeScore}",
-        said: { home: "ホーム", away: "アウェイ", won: "{name}の勝ちです。", tied: "同点です。", park: "外野フェンスは、{park}の公表されている距離をもとに描かれています。", officially: "正式名称は{name}です。", ground: "ピッチは、{ground}の公表されている広さをもとに描かれています。", groundDefault: "{ground}のピッチの広さは公表されていないため、国際標準の105×68mで描かれています。", arenaRink: "{arena}のアイスホッケーリンク", arenaCourt: "{arena}のバスケットボールコート", arenaRinkAbout: "アイスホッケーのリンク。{length}フィート（約{lengthM}m）×{width}フィート（約{widthM}m）で角が丸く、レッドライン、ブルーライン、フェイスオフサークル、クリース、ゴールがあります", arenaCourtAbout: "バスケットボールのコート。{length}フィート（約{lengthM}m）×{width}フィート（約{widthM}m）で、ペイントエリア、スリーポイントライン、フリースローサークル、センターサークルがあります", arenaSize: "広さは、{arena}の公表されている数値をもとに描かれています。", arenaUnknown: "{arena}のリンクはNHLの規格より短かったとされていますが、広さが示されていないため、NHLの規格で描かれています。", era: "ラインやマークは{season}シーズンのものです。", hammer: "{name}がハンマー（最後の1投）を持っています。", ends: "{name}のエンドごとの得点：{list}。", total: "合計", wonPens: "{name}がPK戦を{a}-{b}で制しました。", pens: "PK戦 {a}-{b}", on: "図の内容", sep: "、", stop: "。", colon: "：", gap: "" },
+        said: { home: "ホーム", away: "アウェイ", won: "{name}の勝ちです。", tied: "同点です。", park: "外野フェンスは、{park}の公表されている距離をもとに描かれています。", officially: "正式名称は{name}です。", ground: "ピッチは、{ground}の公表されている広さをもとに描かれています。", groundDefault: "{ground}のピッチの広さは公表されていないため、国際標準の105×68mで描かれています。", arenaRink: "{arena}のアイスホッケーリンク", arenaCourt: "{arena}のバスケットボールコート", arenaRinkAbout: "アイスホッケーのリンク。{length}フィート（約{lengthM}m）×{width}フィート（約{widthM}m）で角が丸く、レッドライン、ブルーライン、フェイスオフサークル、クリース、ゴールがあります", arenaCourtAbout: "バスケットボールのコート。{length}フィート（約{lengthM}m）×{width}フィート（約{widthM}m）で、ペイントエリア、スリーポイントライン、フリースローサークル、センターサークルがあります", arenaSize: "広さは、{arena}の公表されている数値をもとに描かれています。", arenaUnknown: "{arena}のリンクはNHLの規格より短かったとされていますが、広さが示されていないため、NHLの規格で描かれています。", real: "スタンドは、OpenStreetMapの建物の輪郭（(c) OpenStreetMap contributors）の内側に収まるように、{arena}の{seats}席・{tiers}層を推定して描いたもので、アリーナの設計図ではありません。", realBuilding: "リンクは建物の長い軸に沿って置いており（推定）、矢印は北を指します。", realMapped: "リンクの向きはOpenStreetMapに記録された氷面のとおりで、矢印は北を指します。", realNone: "リンクの向きは分かっていないため、東西に置き、北を上にしています。", era: "ラインやマークは{season}シーズンのものです。", hammer: "{name}がハンマー（最後の1投）を持っています。", ends: "{name}のエンドごとの得点：{list}。", total: "合計", wonPens: "{name}がPK戦を{a}-{b}で制しました。", pens: "PK戦 {a}-{b}", on: "図の内容", sep: "、", stop: "。", colon: "：", gap: "" },
         budo: {
             sides: { north: "北", south: "南", east: "東", west: "西" },
             judo: "柔道の試合場。試合場内は{contest}m四方、幅{safety}mの安全地帯があり、{tatami}の畳を敷いています",

package/dist/turn.dom.js

@@ -8,6 +8,7 @@ import { buildTurn, floorOptions, openingView, turnWords } from "./turn.model.js
 import { controlsMarkup, layoutOf, turnMarkupOf, worldMarkup } from "./turn.markup.js";
 import { KYOGIJO_TURN_STYLE } from "./turn.style.js";
 import { esc } from "./format.js";
+import { turnBoardMarkup } from "./overlay.js";
 /** True where the page can draw a plane in 3D by one `matrix3d`: that is, nearly everywhere with a stylesheet. */
 export function turnSupported(win = typeof window === "undefined" ? undefined : window) {
     const css = win?.CSS;
@@ -47,7 +48,7 @@ export function mountTurn(host, options, settings, build) {
     if (!supported) {
         // The flat drawing, with a sentence that says why it does not turn when the browser is the reason.
         const flat = (next) => {
-            host.innerHTML = `<div class="ky-turn" data-mode="flat"><style>${KYOGIJO_TURN_STYLE}</style>${model.flat ?? drawKyogijo(floorOptions(next))}${model.turnable ? `<p class="ky-turn-flat">${esc(turnWords(model).flat)}</p>` : ""}</div>`;
+            host.innerHTML = `<div class="ky-turn" data-mode="flat"><style>${KYOGIJO_TURN_STYLE}</style>${model.flat ?? drawKyogijo({ ...floorOptions(next), board: next.board })}${model.turnable ? `<p class="ky-turn-flat">${esc(turnWords(model).flat)}</p>` : ""}</div>`;
         };
         flat(options);
         return {
@@ -456,6 +457,10 @@ export function mountTurn(host, options, settings, build) {
                     world.setAttribute("data-theme", forced);
             }
             gather();
+            // The board is a layer of its own over the view, after the scene: it is written again, and the view's turn is not touched.
+            stage.querySelector(".ky-turn-board")?.remove();
+            if (model.board !== undefined)
+                stage.insertAdjacentHTML("beforeend", turnBoardMarkup(model.board));
             stage.setAttribute("aria-label", model.title);
             root.querySelector(".ky-turn-help").textContent = `${turnWords(model).keys}${model.standing === "" ? "" : ` ${model.standing}`}`;
             const theme = model.options.theme;

package/dist/turn.markup.js

@@ -7,6 +7,7 @@ import { cross, facing, fadeOf, n, size, unit } from "./turn.kit.js";
 import { buildTurn, turnWords } from "./turn.model.js";
 import { KYOGIJO_TURN_STYLE } from "./turn.style.js";
 import { esc } from "./format.js";
+import { turnBoardMarkup } from "./overlay.js";
 const px = (value) => `${Math.round(value * 1000) / 1000}`;
 /**
  * The matrix that stands a plane in the scene, before the camera: its x along `u`, its y along `v`, its corner `o`, in pixels from the middle of the scene
@@ -117,7 +118,7 @@ export function turnMarkupOf(model, settings = {}) {
     const sport = model.options.sport;
     return (`<div class="ky-turn" id="${esc(model.id)}" data-sport="${esc(String(sport))}" data-mode="3d" data-touch="${settings.touch === "turn" ? "turn" : "scroll"}" data-preset="${presetOf(view, model.presets ?? sport) ?? "custom"}"${theme === "light" || theme === "dark" ? ` data-theme="${theme}"` : ""} lang="${model.language}">` +
         sheet +
-        `<div class="ky-turn-view" tabindex="0" role="group" aria-roledescription="${esc(words.region)}" aria-label="${esc(model.title)}" aria-describedby="${esc(model.id)}-help" aria-keyshortcuts="ArrowLeft ArrowRight ArrowUp ArrowDown + - 0 1 2 3 4 Home Space"><div ${worldAttributes(model)}>${worldMarkup(model, layout)}</div></div>` +
+        `<div class="ky-turn-view" tabindex="0" role="group" aria-roledescription="${esc(words.region)}" aria-label="${esc(model.title)}" aria-describedby="${esc(model.id)}-help" aria-keyshortcuts="ArrowLeft ArrowRight ArrowUp ArrowDown + - 0 1 2 3 4 Home Space"><div ${worldAttributes(model)}>${worldMarkup(model, layout)}</div>${model.board === undefined ? "" : turnBoardMarkup(model.board)}</div>` +
         `<p class="ky-turn-help" id="${esc(model.id)}-help">${esc(keys)}</p>` +
         (settings.controls === false ? "" : controlsMarkup(model, view)) +
         `<div class="ky-turn-live" role="status" aria-live="polite"></div>` +

package/dist/turn.model.d.ts

@@ -2,6 +2,7 @@ import { KYOGIJO_STRINGS } from "./strings.ts";
 import { type PresetTable, type TurnPreset, type TurnView } from "./turn.camera.ts";
 import type { Plane } from "./turn.kit.ts";
 import { type UprightOptions, type Uprights } from "./uprights.ts";
+import { type ResolvedBoard } from "./overlay.ts";
 import type { VenueSettings } from "./venue.ts";
 import type { Box3 } from "./turn.camera.ts";
 import type { Language, ScoreOptions, SurfaceOptions } from "./types.ts";
@@ -99,6 +100,8 @@ export interface TurnModel {
     lens?: number;
     /** The flat drawing to show where the 3D view cannot be drawn, when it is not `drawKyogijo`'s of `options` (a tournament layout's). */
     flat?: string;
+    /** The board the options ask for (`board`), laid over the view: a layer of its own, never a plane of the scene. */
+    board?: ResolvedBoard;
 }
 /** The options with what makes the floor of a 3D view: the whole surface, lying wide, at its full size. */
 export declare function floorOptions(options: SurfaceOptions | ScoreOptions): SurfaceOptions | ScoreOptions;

package/dist/turn.model.js

@@ -8,6 +8,7 @@ import { KYOGIJO_STRINGS } from "./strings.js";
 import { TURN_DEFAULT, clampView, presetView } from "./turn.camera.js";
 import { describeUprights, planesOf, uprightsFor } from "./uprights.js";
 import { resolveCrowd } from "./crowd.js";
+import { resolveBoard } from "./overlay.js";
 /** The pixels in one foot of the scene at a zoom of 1: the floor is drawn this big, and scaled down to fit. A larger floor is sharper. */
 export const WORLD_PX = 1400;
 /** The options with what makes the floor of a 3D view: the whole surface, lying wide, at its full size. */
@@ -16,6 +17,8 @@ export function floorOptions(options) {
     delete rest.range;
     delete rest.half;
     delete rest.aspect;
+    // A board is a layer over the 3D view, not a picture on the floor.
+    delete rest.board;
     return rest;
 }
 const VIEWBOX = /viewBox="(-?[\d.]+) (-?[\d.]+) ([\d.]+) ([\d.]+)"/;
@@ -86,7 +89,9 @@ export function buildTurn(options, settings = {}) {
     const reach = uprights.reach;
     const margin = reach === undefined ? undefined : convertLength(reach, "ft", lengthUnit(asked));
     const own = asked.margin;
-    const base = reach !== undefined && crowdOpt !== undefined && crowdOpt !== false ? { ...asked, crowd: undefined, margin: Math.max(margin ?? 0, typeof own === "number" && Number.isFinite(own) ? own : 0) } : asked;
+    // (A real venue's building stays on the floor, with the arrow that says where north is: the crowd drawn without its seats.)
+    const keep = resolveCrowd(crowdOpt)?.real === true ? { real: true, stands: false } : undefined;
+    const base = reach !== undefined && crowdOpt !== undefined && crowdOpt !== false ? { ...asked, crowd: keep, margin: Math.max(margin ?? 0, typeof own === "number" && Number.isFinite(own) ? own : 0) } : asked;
     const o = boarded ? { ...base, plate: false, size: asked.size === "compact" ? "full" : asked.size } : base;
     const floor = settings.floor === undefined ? drawKyogijo(o) : settings.floor(o);
     const found = VIEWBOX.exec(floor);
@@ -123,6 +128,7 @@ export function buildTurn(options, settings = {}) {
         centre,
         view: openingView(settings, o.sport),
         turnable: !badge,
+        board: badge ? undefined : resolveBoard(options.board),
     };
 }
 /** The words of the 3D view in the model's language. */

package/dist/turn.style.js

@@ -1,4 +1,5 @@
 import { JUDGING_DARK, JUDGING_LIGHT } from "./judging.style.js";
+import { KYOGIJO_TURN_BOARD_STYLE } from "./overlay.js";
 /**
  * The 3D view's stylesheet: the colours of what stands on the surface, in light and dark, and the rules that lay the scene out. Like the drawing's own, the
  * defaults are in `:where()`, which has no weight, so a page's own rule always wins; the colours are custom properties (`--ky-up-*`) a page can set.
@@ -65,6 +66,7 @@ export const KYOGIJO_TURN_STYLE = `
 .ky-turn .u-th{fill:var(--ky-cr-home)}
 .ky-turn .u-conc{fill:var(--ky-cr-conc)}
 .ky-turn .u-fascia{fill:var(--ky-up-fascia)}
+.ky-turn .u-shell{fill:var(--ky-up-fascia);stroke:var(--ky-up-roofline);stroke-width:.6}
 .ky-turn .u-roof{fill:var(--ky-up-roof);stroke:var(--ky-up-roofline);stroke-width:.8;stroke-linejoin:round}
 .ky-turn .ky-up-seats svg{opacity:var(--ky-cr-dim)}
 .ky-turn .ky-cr-seat{fill:none;stroke:var(--ky-cr-empty);stroke-width:1.3;stroke-opacity:.65}
@@ -136,4 +138,5 @@ export const KYOGIJO_TURN_STYLE = `
 .ky-turn-controls button:disabled{opacity:.4;cursor:default}
 .ky-turn-help,.ky-turn-live{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
 .ky-turn-flat{margin:8px 0 0;font-size:.85rem}
+${KYOGIJO_TURN_BOARD_STYLE}
 `.trim();

package/dist/types.d.ts

@@ -1,4 +1,5 @@
 import type { Background } from "./background.ts";
+import type { BoardOptions } from "./overlay.ts";
 import type { EmblemRef, EmblemRenderer } from "./emblems-source.ts";
 import type { FlagRenderer } from "./flags-source.ts";
 import type { Layer } from "./layers.types.ts";
@@ -283,6 +284,14 @@ export interface CrowdOptions {
      * ballpark's outfield with a gap at the batter's eye) or `grandstand` (a ballpark's infield stands only). Each sport has its usual one.
      */
     shape?: CrowdShape;
+    /**
+     * The stands of the arena's real venue, for an NHL `arena` the package has one of (`VENUES`, `@johnmorrisdotca/kyogijo-stadiums/venues`): the outline of its building from OpenStreetMap, the rink lying along
+     * the building as it does in the world (a small arrow says where north is), and a bowl of the number of tiers and the seats the sources give, fitted inside the building, under its kind of roof. An arena with no venue
+     * is drawn with the usual stands. Off by default. The drawing needs the credit `VENUE_ATTRIBUTION`. See `docs/venues.md`.
+     */
+    real?: boolean;
+    /** `false` draws no seats: of a real venue (`real`) only its building and the arrow that says where north is, which is what the floor of the 3D view needs under the stands it raises. On by default. */
+    stands?: boolean;
     /** The end of a `horseshoe` that is open: `right` (the usual) or `left`. */
     open?: "left" | "right";
     /**
@@ -699,6 +708,12 @@ export interface SurfaceOptions {
      * Unset, the drawing is byte for byte as before. See `BackgroundOptions`.
      */
     background?: Background;
+    /**
+     * A board laid over the drawing: a results board, a bout presentation or a medal table that another package drew (Taisen Brackets', say), taken as an SVG string with its width and height, and placed at the top, a side, a corner or a point
+     * of your own, kept off the middle of the surface unless you say otherwise. It is written as an image, never changed and never stretched, and in the 3D view it is a layer over the view that does not turn with it. A compact strip and a
+     * badge take none. Unset, the drawing is byte for byte as before. See `BoardOptions` and `docs/boards.md`.
+     */
+    board?: BoardOptions;
     /**
      * The pageant: each team's flag or logo laid large over its half (a `carpet`) or on a round disc (a `stage`), with an emblem in the centre. `"carpet"`, `"stage"`, `true` (a carpet) or `PageantOptions`.
      * Off by default; a score drawing only. See `PageantOptions`.

package/dist/venue.js

@@ -6,7 +6,8 @@ import { densityOf, resolveCrowd } from "./crowd.js";
 import { patterns } from "./crowd.draw.js";
 import { crowdStands } from "./draw.js";
 import { groundById } from "./grounds.js";
-import { clipAround, clipConvex, clipSegment, areaOf, pointList, raked, slopeOf, stripsOf, tidy } from "./venue.geom.js";
+import { ARC_STEPS, clipAround, clipConvex, clipSegment, areaOf, pointList, raked, slopeOf, stripsOf, tidy } from "./venue.geom.js";
+import { realBuilding } from "./venue.real.js";
 import { n, shy, wall } from "./turn.kit.js";
 export const NO_VENUE = { items: [], defs: "", reach: 0 };
 /** The sports played under a roof: their stands have a lid and not a canopy. */
@@ -45,7 +46,7 @@ export function standsVenueOf(stands, crowd, o, v, lift) {
     const density = densityOf(crowd, stands.seats, groundById(o.ground)?.capacity);
     const tifo = { home: stands.sectors.some((s) => s.kind === "tifo-home"), away: stands.sectors.some((s) => s.kind === "tifo-away") };
     const pid = `${v.id}-v`;
-    const defs = fine ? patterns(pid, crowd, density, tifo.home || tifo.away ? tifo : undefined, false, true) : "";
+    const defs = fine ? patterns(pid, crowd, density, tifo.home || tifo.away ? tifo : undefined, stands.real !== undefined, true) : "";
     const centre = [stands.box.x + stands.box.w / 2, stands.box.y + stands.box.h / 2];
     const covers = stands.covers;
     const inCover = (p) => covers.some(([x0, y0, x1, y1]) => p[0] >= x0 && p[0] <= x1 && p[1] >= y0 && p[1] <= y1);
@@ -148,8 +149,10 @@ export function standsVenueOf(stands, crowd, o, v, lift) {
         items.push({ id: "stands", kind: "stands", at: centre, height: topOf(seatPlanes), planes: seatPlanes });
     if (wallSeats.length > 0)
         items.push({ id: "wall-seats", kind: "wall-seats", at: centre, height: topOf(wallSeats), planes: wallSeats });
-    // The roof: a canopy over the back of the top tier, or a lid over it in a hall.
-    const top = v.roof === true && crowd.roof ? topRing(stands) : undefined;
+    // The roof: a canopy over the back of the top tier, or a lid over it in a hall. A real venue has its own: the walls of its building and a roof of its kind over them.
+    if (stands.real !== undefined && v.roof === true)
+        items.push(...realBuilding(stands.real, topRing(stands), centre, lift, ARC_STEPS[cut].oval * 2));
+    const top = v.roof === true && crowd.roof && stands.real === undefined ? topRing(stands) : undefined;
     if (top !== undefined) {
         const lid = INDOOR.includes(String(o.sport));
         const reach = lid ? 1 : ROOF.canopyReach;