@johnmorrisdotca/kyogijo-stadiums 0.39.0 → 0.40.0

package/CHANGELOG.md

@@ -7,6 +7,24 @@ All notable changes to this project are written here. The format follows
 
 ## [Unreleased]
 
+## [0.40.0] - 2026-10-21
+
+### Added
+
+- **The named lighting presets** ([the presets](./docs/venues.md#the-lighting-presets)): `lighting: "game" | "intro" | "concert"` join `"night"` and `"lightsDown"`. `game` is white light with the house half lit (a light veil, `u-veil-half`) and a pool of white light round the surface, `intro` the house dark with the home team's colour washed over the surface and the visitors' (the second colour) in the aisle beams, `concert` the house dark with warm amber beams and a purple surface. The presets are a table of constants, `LIGHT_PRESETS` (each preset's `house`, `aisles`, `pool`, and wash and beam colours), with `LIGHTING_PRESETS` (the names) and `LIGHT_COLORS` (the named colours); `LIGHT_PRESETS`, `LIGHTING_PRESETS`, `LIGHT_COLORS` and `resolveLighting` are exported from the main entry and from `/turn` (the 0.39.0 notes named `LIGHT_COLORS` without exporting it), and `WASH` from `/turn`. The `intro`'s team colours are the package's where it has them: the crowd's `home` and `away`, else the colours of a score's two teams, else blue and amber. `lighting: { preset, colors }` passes colours (the first stands for the home team's, the second for the visitors'), and `wash` and `aisles` win over them, for any preset. `resolveLighting(option, team)` now answers `{ preset, house, aisles, pool, beam, wash }`. `TurnModel.lighting` and the view's `data-lighting` say the preset (the stylesheet has a rule for `game` and one for the three dark ones); in the plan the stands' group has `ky-half` or `ky-down`. The `celebration` (colours chasing round the bowl) is to come. Off by default, and a drawing without lighting is exactly what it was.
+- **A Lighting choice on the demo**, in place of the Night and Lights down buttons (kept in the address as `lighting=intro` and so on, with `wash=` for the colour of light over the preset's own; an old address's `night=1` and `lights=1` still work): a choice in the bar over the venues page's view and the home page's featured arena, and on the stadiums, tournament layouts and district pages. The intro is shown with sample team colours (a red and a blue that are nobody's). In 3D a change goes in while the view turns, without stopping it or sending it back.
+
+### Fixed
+
+- **A test that raced another** (`src/docs-language.test.js`): it walks the Markdown files from the root, and met the docs examples' scratch folder `.cache` while that test was removing it, so that `pnpm check` failed now and then with an error reading a file that had just gone. `.cache` is skipped.
+- **The demo's selects were 24 pixels high on a phone in WebKit** (`e2e/looks.demo.mjs`, "every control is a finger wide", failing on `webkit-phone` since 0.39.0): the bar's colour choice took the chip class, whose `display: inline-flex` WebKit does not honour on a select. The bar's selects are `display: inline-block`, 44 pixels high, no wider than 12 rem (they had taken the venue choice's 16 rem minimum).
+
+## [0.39.1] - 2026-10-21
+
+### Fixed
+
+- **Japanese wording, from a native-quality review**: spectator seating is `観客席` everywhere in the demo and the fly-through (the fly-through's Bowl stage and the venues page's Stands toggle were `客席`, and the "tiers" labels are now `観客席の層数`); the fly-through's Rink stage is `アイスリンク` (and the atlas's rink label), and its badge is `プレーのイメージ` (was `模擬プレー（イメージ）`); the night lighting is `夜間照明` and its toggle `夜間` (was `ナイト`, which also means a court colour and reads as "knight"); the centre-hung scoreboard is `センターハングビジョン（吊り下げ式スコアボード）` (`センタービジョン` reads as the centre-field screen in baseball); two fly-through sentences read more naturally. English is unchanged.
+
 ## [0.39.0] - 2026-10-21
 
 ### Added

package/README.md

@@ -581,7 +581,7 @@ console.log(layout.needs.length, layout.needs.width);
 
 ### The real venues
 
-`crowd: { real: true }` draws an NHL arena in its building: the outline from OpenStreetMap, the rink lying along the building where it says so, and a plausible bowl of the seats, tiers and roof the sources give. All thirty-two arenas of the league, division by division ([the real venues](./docs/venues.md)). `boards: true` adds LED ribbon boards and a hung scoreboard, generic content ([LED boards](./docs/venues.md#led-boards)). In 3D the demo's [venues page](https://johnmorrisdotca.github.io/kyogijo-stadiums/venues.html) turns while the pointer is over it, with the stands, walls, roof, LED boards, night, lights down, building, markings and labels switched on the view while it turns.
+`crowd: { real: true }` draws an NHL arena in its building: the outline from OpenStreetMap, the rink lying along the building where it says so, and a plausible bowl of the seats, tiers and roof the sources give. All thirty-two arenas of the league, division by division ([the real venues](./docs/venues.md)). `boards: true` adds LED ribbon boards and a hung scoreboard, generic content ([LED boards](./docs/venues.md#led-boards)). In 3D the demo's [venues page](https://johnmorrisdotca.github.io/kyogijo-stadiums/venues.html) turns while the pointer is over it, with the stands, walls, roof, LED boards, lighting, building, markings and labels switched on the view while it turns.
 
 ```ts
 import { drawKyogijo } from "@johnmorrisdotca/kyogijo-stadiums";

package/dist/crowd.draw.d.ts

@@ -11,6 +11,11 @@ export interface DrawInput {
     density: number;
     fine: boolean;
     ground: string;
+    /** The teams' colours of the drawing's score, where it has them: what a lighting's team colours are (the crowd's own `home` and `away` come first). */
+    team?: {
+        home?: string;
+        away?: string;
+    };
 }
 /** The building of a real venue and, where its rink's orientation is known, a small arrow with an N that says where north lies. The N is a path of three strokes, so that no font is needed. */
 export declare function realMarkup(real: RealShell): string;

package/dist/crowd.draw.js

@@ -197,12 +197,12 @@ export function drawCrowd(stands, o) {
     for (const s of stands.sectors)
         body += sector(s, id, fine, density);
     // The house is down: a dark veil over the seats, under the aisles' lights.
-    const light = stands.gallery === true ? undefined : resolveLighting(crowd.lighting);
-    const night = light?.preset === "night";
-    const down = light?.preset === "lightsDown";
+    const light = stands.gallery === true ? undefined : resolveLighting(crowd.lighting, { home: crowd.home ?? o.team?.home, away: crowd.away ?? o.team?.away });
+    const night = light?.aisles === "dots";
+    const down = light?.aisles === "beams";
     if (light !== undefined)
         for (const ring of stands.rings)
-            body += el("path", { class: down ? "ky-cr-veil ky-cr-veil-down" : "ky-cr-veil", d: path(ring) });
+            body += el("path", { class: light.house === "dark" ? "ky-cr-veil ky-cr-veil-down" : light.house === "half" ? "ky-cr-veil ky-cr-veil-half" : "ky-cr-veil", d: path(ring) });
     if (fine) {
         for (const ring of stands.rings) {
             if (stands.gallery === true)
@@ -211,8 +211,8 @@ export function drawCrowd(stands, o) {
                 body += rows(ring) + aisles(ring, night);
             else {
                 // The lights down: the front of each tier edged with light, each stair aisle a beam from above with its rails (a vomitory a broader one).
-                body += rows(ring) + (ring.hole === null ? "" : el("path", { class: "ky-cr-edge", d: outlinePath(ring.hole), fill: "none", stroke: light.aisles, "stroke-opacity": 0.6, "stroke-width": 0.6 }));
-                ring.aisles.forEach(([[x0, y0], [x1, y1]], i) => (body += beamSvg([x0, y0], [x1, y1], light.aisles, "ky-cr-beam", i % 4 === 0)));
+                body += rows(ring) + (ring.hole === null ? "" : el("path", { class: "ky-cr-edge", d: outlinePath(ring.hole), fill: "none", stroke: light.beam, "stroke-opacity": 0.6, "stroke-width": 0.6 }));
+                ring.aisles.forEach(([[x0, y0], [x1, y1]], i) => (body += beamSvg([x0, y0], [x1, y1], light.beam, "ky-cr-beam", i % 4 === 0)));
             }
         }
     }
@@ -242,7 +242,7 @@ export function drawCrowd(stands, o) {
         pool += el("radialGradient", { id: `${id}-wash`, cx: 0.5, cy: 0.5, r: 0.72 }, el("stop", { offset: 0, "stop-color": light.wash, "stop-opacity": WASH.middle }) + el("stop", { offset: 1, "stop-color": light.wash, "stop-opacity": WASH.edge }));
         over += el("rect", { class: "ky-cr-wash", x: n1(b.x), y: n1(b.y), width: n1(b.w), height: n1(b.h), rx: stands.sport === "nhl" ? NHL.cornerRadius : undefined, fill: `url(#${id}-wash)` });
     }
-    if (night) {
+    if (light?.pool === true) {
         const b = stands.box;
         const [w, h] = [b.w + 2 * POOL.reach, b.h + 2 * POOL.reach];
         pool += el("radialGradient", { id: `${id}-pool`, cx: 0.5, cy: 0.5, r: 0.5 }, [[0, 0], [POOL.edge - 0.12, 0], [POOL.edge, POOL.strength], [1, 0]].map(([offset, opacity]) => el("stop", { offset, "stop-color": "#fff4dc", "stop-opacity": opacity })).join(""));
@@ -254,7 +254,7 @@ export function drawCrowd(stands, o) {
         const [x0, y0, x1, y1] = g.box;
         body += el("rect", { class: `ky-cr-${g.kind}`, x: n1(x0), y: n1(y0), width: n1(x1 - x0), height: n1(y1 - y0), rx: g.kind === "bench" ? 1 : undefined });
     }
-    return { defs: (fine && (stands.gallery !== true || density > 0) ? patterns(id, crowd, density, tifo.home || tifo.away ? tifo : undefined, stands.gallery === true || stands.real !== undefined) : "") + pool, markup: el("g", { class: down ? "ky-crowd ky-night ky-down" : night ? "ky-crowd ky-night" : "ky-crowd" }, body) + lit, over };
+    return { defs: (fine && (stands.gallery !== true || density > 0) ? patterns(id, crowd, density, tifo.home || tifo.away ? tifo : undefined, stands.gallery === true || stands.real !== undefined) : "") + pool, markup: el("g", { class: light === undefined ? "ky-crowd" : light.house === "dark" ? "ky-crowd ky-night ky-down" : light.house === "half" ? "ky-crowd ky-night ky-half" : "ky-crowd ky-night" }, body) + lit, over };
 }
 /** A block of visitors or a card display, a polygon over the band it is in. */
 function sector(s, id, fine, density) {
@@ -297,6 +297,8 @@ export const KYOGIJO_CROWD_STYLE = `
 .kyogijo .ky-night{--ky-cr-bed:#11151a;--ky-cr-empty:#2a313a;--ky-cr-gap:#020304;--ky-cr-conc:#171c22;--ky-cr-rim:#07090c}
 .kyogijo .ky-cr-veil{fill:#04060a;fill-opacity:.6}
 .kyogijo .ky-cr-veil-down{fill-opacity:.8}
+.kyogijo .ky-cr-veil-half{fill-opacity:.3}
+.kyogijo .ky-half{--ky-cr-bed:#2a3039;--ky-cr-empty:#4a535f;--ky-cr-gap:#0a0c0f;--ky-cr-conc:#2a3038}
 .kyogijo .ky-cr-beam,.kyogijo .ky-cr-edge{stroke-linecap:butt}
 .kyogijo .ky-night .ky-cr-aisle{stroke:#ffd9a3;stroke-opacity:.95;stroke-dasharray:1.1 3.4;stroke-linecap:round}
 .kyogijo .ky-night .ky-cr-vom{stroke:#7dffb0;stroke-opacity:.6;stroke-dasharray:none}

package/dist/draw.js

@@ -61,6 +61,7 @@ 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";
+import { teamColors } from "./venue.lighting.js";
 import { parkLayout } from "./crowd.park.js";
 import { featureColours, featureStyle } from "./features.js";
 import { isLook, lookStyle } from "./look.js";
@@ -489,7 +490,7 @@ function buildCrowded(o, portrait, id, score, scored, extra, crowd) {
     const bg = /class="([^"]*)"/.exec(first)?.[1] ?? "ky-apron";
     // A gallery is empty unless the options say how full: its seats are the detail.
     const taken = stands.gallery === true && crowd.density === undefined && crowd.attendance === undefined ? 0 : densityOf(crowd, seats, ground);
-    const drawn = drawCrowd(stands, { id, crowd, density: taken, fine, ground: bg });
+    const drawn = drawCrowd(stands, { id, crowd, density: taken, fine, ground: bg, team: teamColors(o) });
     surface.base = first + drawn.markup + surface.base.slice(first.length);
     surface.defs += drawn.defs;
     surface.lines += drawn.over;

package/dist/flythrough.words.js

@@ -26,14 +26,14 @@ export const FLYTHROUGH_WORDS = {
     ja: {
         title: "フライスルー：{arena}",
         region: "フライスルー",
-        about: "地図から{place}の{arena}まで進むフライスルーです。地図、都市、3Dのアリーナ、スタンドの上空から中へ入る場面、客席から見たリンク、氷上の短い模擬プレーの順に見られます。ボタンまたはキーで、再生・一時停止、前後の場面への移動、場面の選択ができます。",
+        about: "地図から{place}の{arena}まで進むフライスルーです。地図、都市、3Dのアリーナ、スタンドの上空から中へ入る場面、観客席から見たアイスリンク、氷上の短い模擬プレーの順に見られます。ボタンまたはキーで、再生・一時停止、前後の場面への移動、場面の選択ができます。",
         stage: {
             map: { name: "地図", text: "{arena}は{place}にあります。" },
             city: { name: "都市", text: "{arena}の建物を真上から見たところです（OpenStreetMapの記録による）。" },
             arena: { name: "アリーナ", text: "{arena}を3Dで回転させて表示しています。" },
-            bowl: { name: "客席", text: "屋根を取り払い、スタンドの上空から中へ入ります。{seats}席・{tiers}層の推定のスタンドで、実際の座席表ではありません。" },
-            rink: { name: "リンク", text: "スタンドからリンクを見渡した眺めで、ゆっくり回転します。視点の位置と高さは仮のもので、実在の座席ではありません。" },
-            game: { name: "試合", text: "絵として作った短い模擬プレーです。両チーム各5人のスケーターとゴーリー、そしてパックが氷上を動きます。実際の試合のデータではありません。" },
+            bowl: { name: "観客席", text: "屋根を取り払い、スタンドの上空から中へ入ります。{seats}席・{tiers}層と推定したスタンドで、実際の座席表ではありません。" },
+            rink: { name: "アイスリンク", text: "スタンドからリンクを見渡した眺めで、ゆっくり回転します。視点の位置と高さは仮のもので、実在の座席ではありません。" },
+            game: { name: "試合", text: "イメージ用に作った短い模擬プレーです。各チーム5人のスケーターとゴーリー、そしてパックが氷上を動きます。実際の試合のデータではありません。" },
         },
         announce: "場面{n}／{total}：{name}。{text}",
         play: "再生",
@@ -44,7 +44,7 @@ export const FLYTHROUGH_WORDS = {
         keys: "スペースキーで再生・一時停止。左右の矢印キーで前後の場面へ、数字キーで場面を選び、Homeキーで最初に戻ります。",
         creditMap: "地図：Natural Earth（パブリックドメイン）、chizuで描画。建物の輪郭：(c) OpenStreetMap contributors、ODbL 1.0、openstreetmap.org/copyright。",
         creditPlain: "建物の輪郭：(c) OpenStreetMap contributors、ODbL 1.0、openstreetmap.org/copyright。",
-        illustrative: "模擬プレー（イメージ）",
+        illustrative: "プレーのイメージ",
         still: "この端末は動きを減らす設定のため、各場面を静止画で表示しています。",
     },
 };

package/dist/index.d.ts

@@ -3,6 +3,7 @@ export { HOME_FIRST, HOME_FIRST_LEAGUES, homeSideFor } from "./homeside.ts";
 export { inkOn, luminance, rgbOf, safeColour, safePicture } from "./colour.ts";
 export { safeLogo } from "./logo.ts";
 export { useEmblems } from "./emblems-source.ts";
+export { LIGHTING_PRESETS, LIGHT_COLORS, LIGHT_PRESETS, resolveLighting } from "./venue.lighting.ts";
 export type { EmblemDrawOptions, EmblemId, EmblemRef, EmblemRenderer, EmblemStyleName } from "./emblems-source.ts";
 export { useFlags } from "./flags-source.ts";
 export type { FlagRenderer, FlagRequest, FlagShape } from "./flags-source.ts";

package/dist/index.js

@@ -4,6 +4,7 @@ export { HOME_FIRST, HOME_FIRST_LEAGUES, homeSideFor } from "./homeside.js";
 export { inkOn, luminance, rgbOf, safeColour, safePicture } from "./colour.js";
 export { safeLogo } from "./logo.js";
 export { useEmblems } from "./emblems-source.js";
+export { LIGHTING_PRESETS, LIGHT_COLORS, LIGHT_PRESETS, resolveLighting } from "./venue.lighting.js";
 export { useFlags } from "./flags-source.js";
 export { OUTCOMES, drawLayers, layerTable } from "./layers.js";
 export { RANGES } from "./ranges.names.js";

package/dist/strings.js

@@ -1014,7 +1014,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: "審判席と記録台", judges: "審判員席の名札", deck: "台", "cage-fence": "金網", "cage-posts": "パッド付き支柱", "ring-ropes": "ロープ", "ring-posts": "コーナーポスト", "ribbon-boards": "LEDリボンビジョン", "hung-board": "センタービジョン（吊り下げ式スコアボード）" },
+            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: "審判員席の名札", deck: "台", "cage-fence": "金網", "cage-posts": "パッド付き支柱", "ring-ropes": "ロープ", "ring-posts": "コーナーポスト", "ribbon-boards": "LEDリボンビジョン", "hung-board": "センターハングビジョン（吊り下げ式スコアボード）" },
         },
         rules: {
             "defensive-zone": "ディフェンディングゾーン",

package/dist/turn-entry.d.ts

@@ -12,6 +12,8 @@ export type { Box3, Mat4, Placement, TurnPreset, TurnToward, TurnView } from "./
 export { describeUprights, heightUnit, planesOf, uprightsFor } from "./uprights.ts";
 export type { UprightOptions, Uprights } from "./uprights.ts";
 export { ROOF } from "./venue.ts";
+export { LIGHTING_PRESETS, LIGHT_COLORS, LIGHT_PRESETS, WASH, resolveLighting } from "./venue.lighting.ts";
+export type { House, LightPreset, Lighting } from "./venue.lighting.ts";
 export type { Venue, VenueBuild, VenueSettings } from "./venue.ts";
 export type { LedBoardOptions, LedBoardPattern, LightingOptions, LightingPreset } from "./types.ts";
 export type { Plane, PartKind, Upright, UprightKind, V3 } from "./turn.kit.ts";

package/dist/turn-entry.js

@@ -7,3 +7,4 @@ export { KYOGIJO_TURN_STYLE } from "./turn.style.js";
 export { CURLING_PRESETS, LONG_PRESETS, NET_PRESETS, PITCH_MAX, STEP, TURN_DEFAULT, TURN_PRESETS, TURN_PRESET_NAMES, ZOOM_MAX, ZOOM_MIN, cameraMatrix, clampView, depthOf, drag, eyeDistance, fit, matrix3d, multiply, nudge, presetOf, presetView, presetsFor, project, step } from "./turn.camera.js";
 export { describeUprights, heightUnit, planesOf, uprightsFor } from "./uprights.js";
 export { ROOF } from "./venue.js";
+export { LIGHTING_PRESETS, LIGHT_COLORS, LIGHT_PRESETS, WASH, resolveLighting } from "./venue.lighting.js";

package/dist/turn.style.js

@@ -93,11 +93,13 @@ export const KYOGIJO_TURN_STYLE = `
 .ky-turn[data-lighting]{--ky-cr-bed:#11151a;--ky-cr-empty:#2a313a;--ky-cr-gap:#020304;--ky-cr-conc:#171c22;--ky-cr-dim:1;--ky-up-fascia:#272c29;--ky-up-ground:#1d211e;--ky-night-aisle:#ffd9a3;--ky-night-exit:#7dffb0;--ky-night-rim:#ffe0b0}
 .ky-turn .u-veil{fill:#04060a;fill-opacity:.62}
 .ky-turn .u-veil-down{fill-opacity:.8}
-.ky-turn[data-lighting=lightsDown]{--ky-cr-bed:#0a0d11;--ky-cr-conc:#101419;--ky-up-fascia:#1b1f1d;--ky-up-ground:#15181a}
+.ky-turn .u-veil-half{fill-opacity:.3}
+.ky-turn:is([data-lighting=lightsDown],[data-lighting=intro],[data-lighting=concert]){--ky-cr-bed:#0a0d11;--ky-cr-conc:#101419;--ky-up-fascia:#1b1f1d;--ky-up-ground:#15181a}
+.ky-turn[data-lighting=game]{--ky-cr-bed:#2a3039;--ky-cr-empty:#4a535f;--ky-cr-gap:#0a0c0f;--ky-cr-conc:#2a3038;--ky-up-fascia:#3b403c;--ky-up-ground:#242823}
 .ky-turn[data-lighting=night] .ky-cr-aisle{stroke:var(--ky-night-aisle);stroke-opacity:.95;stroke-dasharray:1.1 3.4;stroke-linecap:round}
 .ky-turn[data-lighting=night] .ky-cr-vom{stroke:var(--ky-night-exit);stroke-opacity:.6;stroke-dasharray:none}
 .ky-turn[data-lighting] .u-suite-win{fill:color-mix(in srgb,var(--ky-night-aisle) 50%,#2a2218)}
-.ky-turn[data-lighting=lightsDown] .u-suite-win{fill:color-mix(in srgb,var(--ky-night-aisle) 10%,#0d1116)}
+.ky-turn:is([data-lighting=lightsDown],[data-lighting=intro],[data-lighting=concert]) .u-suite-win{fill:color-mix(in srgb,var(--ky-night-aisle) 10%,#0d1116)}
 .ky-turn[data-lighting] .u-coping{fill:color-mix(in srgb,var(--ky-night-rim) 55%,var(--ky-up-fascia))}
 .ky-turn[data-lighting] .u-suite-ledge{fill:color-mix(in srgb,var(--ky-night-rim) 45%,var(--ky-up-fascia))}
 .ky-turn[data-lighting] .u-clane{stroke:var(--ky-night-rim);stroke-opacity:.4}

package/dist/types.d.ts

@@ -275,13 +275,16 @@ export type SheetEnd = Side | "top" | "bottom";
 /** The shape of a venue's stands round the playing surface. */
 export type CrowdShape = "bowl" | "sides" | "horseshoe" | "grandstand";
 /**
- * The lighting of a venue (`crowd.lighting` in the plan, `venue.lighting` in the 3D view). `"night"` (or `true`, or `{ preset: "night" }`) dims the house, lights the playing surface and shows small lights along the aisles and stairs, the ribbon
- * boards and the scoreboard glowing, the exits and the concourse rim softly lit. `"lightsDown"` is a show's house: nearly black, each stair aisle lit from above as a beam with a soft falloff on the steps either side, the rails and the front of
- * every step edged with light. `wash` colours the playing surface with a light (a CSS colour, or `white`, `amber`, `purple`, `magenta`, `blue`, `cyan`; the markings stay visible) and `aisles` the beams (`lightsDown`). `false` is no lighting. Off by default.
+ * The lighting of a venue (`crowd.lighting` in the plan, `venue.lighting` in the 3D view): a named preset (`LIGHT_PRESETS`), `true` (the night), or `{ preset, colors, aisles, wash }`. `"night"` dims the house, lights the playing surface and shows small
+ * lights along the aisles and stairs, the ribbon boards and the scoreboard glowing, the exits and the concourse rim softly lit. `"game"` is white light with the house half lit. `"lightsDown"` is a show's house: nearly black, each stair aisle lit from
+ * above as a beam with a soft falloff on the steps either side, the rails and the front of every step edged with light. `"intro"` is the same house with the home team's colour washed over the surface and the visitors' in the beams (the teams'
+ * colours where the options have them, else blue and amber); `"concert"` has warm amber beams and a purple surface. `colors` are one or two colours that stand for the home and the visitors (before the options' teams); `wash` colours the playing surface
+ * with a light (a CSS colour, or `white`, `amber`, `purple`, `magenta`, `blue`, `cyan`; the markings stay visible) and `aisles` the beams, and both win over the preset's. `false` is no lighting. Off by default.
  */
-export type LightingPreset = "night" | "lightsDown";
+export type LightingPreset = "night" | "game" | "lightsDown" | "intro" | "concert";
 export type LightingOptions = LightingPreset | boolean | {
     preset?: LightingPreset;
+    colors?: readonly string[];
     aisles?: string;
     wash?: string;
 };

package/dist/venue.d.ts

@@ -30,6 +30,11 @@ export interface VenueBuild extends VenueSettings {
     id: string;
     /** Leave the scoreboard hung over the middle out (a tournament hall has scoreboards of its own). */
     noCentre?: boolean;
+    /** The teams' colours the drawing has (a crowd's `home` and `away`, or a score's teams'): what a lighting's team colours are. */
+    team?: {
+        home?: string;
+        away?: string;
+    };
 }
 /** What the venue is made of: the things that stand, and the patterns they are drawn with (the contents of a `defs`). */
 export interface Venue {

package/dist/venue.js

@@ -10,7 +10,7 @@ import { groundById } from "./grounds.js";
 import { ARC_STEPS, clipAround, clipConvex, clipSegment, areaOf, pointList, raked, slopeOf, stripsOf, tidy } from "./venue.geom.js";
 import { APRON_RISE, apronPlanes, backEdges, backWall, concourseFloor, rimAt, suiteWall } from "./venue.fill.js";
 import { firstHit, realBuilding } from "./venue.real.js";
-import { beamSvg, edgeSvg, lightPool, lightWash, resolveLighting } from "./venue.lighting.js";
+import { beamSvg, edgeSvg, lightPool, lightWash, resolveLighting, teamColors } from "./venue.lighting.js";
 import { centreBoard, fasciaRibbon, hangsOver, ledStrip, resolveBoards, ribbonHigh, ribbonShare, tierLinks } from "./venue.boards.js";
 import { n, shy, wall } from "./turn.kit.js";
 export const NO_VENUE = { items: [], defs: "", reach: 0 };
@@ -38,7 +38,7 @@ export function standsVenue(o, v, lift) {
     const crowd = resolveCrowd(o.crowd);
     if (stands === undefined || crowd === undefined || stands.gallery === true)
         return NO_VENUE;
-    return standsVenueOf(stands, crowd, { sport: o.sport, detail: o.detail, ground: o.ground }, v, lift);
+    return standsVenueOf(stands, crowd, { sport: o.sport, detail: o.detail, ground: o.ground }, { ...v, team: v.team ?? teamColors(o, crowd) }, lift);
 }
 /**
  * The stands the model says (`crowdStands`, or the stands of a tournament layout's hall) as planes: what `standsVenue` makes of a surface's, for stands that were worked out some other way. `o` is the little of the
@@ -76,17 +76,17 @@ export function standsVenueOf(stands, crowd, o, v, lift) {
                 svg += fine ? `<polygon fill="url(#${pid}-cr-${s.kind === "tifo-home" ? "th" : "ta"})" points="${points}"/>` : `<polygon class="${s.kind === "tifo-home" ? "u-th" : "u-ta"}" points="${points}"/>`;
         }
         if (light !== undefined)
-            svg += `<polygon class="${down ? "u-veil u-veil-down" : "u-veil"}" points="${pointList(corners)}"/>`;
+            svg += `<polygon class="${light.house === "dark" ? "u-veil u-veil-down" : light.house === "half" ? "u-veil u-veil-half" : "u-veil"}" points="${pointList(corners)}"/>`;
         // The lights down: the front of each step is edged with light, and each stair aisle is a beam from above with the rails beside it (the aisle lines the stands' dark ones are, are left out).
         if (down && light !== undefined) {
             if (corners.length === 4)
-                svg += edgeSvg(corners[0], corners[1], light.aisles, "u-edge");
+                svg += edgeSvg(corners[0], corners[1], light.beam, "u-edge");
             if (fine) {
                 ring.aisles.forEach(([a, b], i) => {
                     const seg = clipSegment(a, b, piece);
                     if (seg === undefined || Math.hypot(seg[1][0] - seg[0][0], seg[1][1] - seg[0][1]) < 0.5)
                         return;
-                    svg += beamSvg(local(seg[0]), local(seg[1]), light.aisles, "u-beam", i % 4 === 0);
+                    svg += beamSvg(local(seg[0]), local(seg[1]), light.beam, "u-beam", i % 4 === 0);
                 });
             }
         }
@@ -116,9 +116,9 @@ export function standsVenueOf(stands, crowd, o, v, lift) {
     const links = tierLinks(stands);
     for (const l of links)
         chained.add(l.after);
-    const light = resolveLighting(v.lighting !== undefined ? v.lighting : crowd.lighting);
-    const night = light?.preset === "night";
-    const down = light?.preset === "lightsDown";
+    const light = resolveLighting(v.lighting !== undefined ? v.lighting : crowd.lighting, v.team ?? teamColors({}, crowd));
+    const night = light?.aisles === "dots";
+    const down = light?.aisles === "beams";
     const boards = resolveBoards(v.boards !== undefined ? v.boards : crowd.boards, { home: crowd.home, away: crowd.away }, light !== undefined);
     const ribbons = [];
     /** How far along the ribbon of one level the next piece of it starts, in feet, so that its panels carry on. */
@@ -208,7 +208,7 @@ export function standsVenueOf(stands, crowd, o, v, lift) {
         }
     }
     // The surface is lit: a pool of light on the floor round it, under the seats.
-    if (night)
+    if (light?.pool === true)
         seatPlanes.push(lightPool("night-pool", stands.box, lift + APRON_RISE + 0.03, light?.wash));
     // A colour of light on the surface (a show's wash), over the markings, which stay visible through it.
     if (light?.wash !== undefined)

package/dist/venue.lighting.d.ts

@@ -1,7 +1,6 @@
 import { type Plane } from "./turn.kit.ts";
 import type { LightingOptions, LightingPreset } from "./types.ts";
-export declare const LIGHTING_PRESETS: readonly LightingPreset[];
-/** The named colours of light: `wash` and `aisles` take these by name (ours, a little saturated, for a light seen on dark). */
+/** The named colours of light: `wash`, `aisles` and `colors` take these by name (ours, a little saturated, for a light seen on dark). */
 export declare const LIGHT_COLORS: {
     readonly white: "#fff6e6";
     readonly amber: "#ffb830";
@@ -10,14 +9,57 @@ export declare const LIGHT_COLORS: {
     readonly blue: "#2b7bff";
     readonly cyan: "#27d6ff";
 };
-/** The lighting as asked, with every part's value. `aisles` is the colour of the beams and `wash` the surface's colour of light (none for the surface as it is). */
+/** How dark the house is: `half` (a light veil, the game's), `dim` (the night's) or `dark` (a show's). */
+export type House = "half" | "dim" | "dark";
+/**
+ * A named lighting. `house` is how dark the stands are; `aisles` how the aisles are lit (`none`, small `dots`, or a `beam` of light from above down each); `pool` whether a pool of light lies on the floor round the surface; `wash` and `beam` are the colours
+ * of the light on the surface and of the beams: a colour (a name of `LIGHT_COLORS`), or `home` and `away`, the teams' colours where the options have them (`crowd.home` and `crowd.away`, the colours of a score's teams), else `fallback`'s.
+ */
+export interface LightPreset {
+    house: House;
+    aisles: "none" | "dots" | "beams";
+    pool: boolean;
+    wash?: keyof typeof LIGHT_COLORS | "home" | "away";
+    beam?: keyof typeof LIGHT_COLORS | "home" | "away";
+    /** What `home` and `away` are where the options name no team colour. */
+    fallback?: {
+        home: keyof typeof LIGHT_COLORS;
+        away: keyof typeof LIGHT_COLORS;
+    };
+}
+/**
+ * The named lightings. `night`: the calm dim house with small lights along the aisles. `game`: white light, the house half lit, a pool of light round the surface. `lightsDown`: the house nearly black, a white beam down each aisle. `intro`: the
+ * house dark, the home team's colour washed over the surface and the visitors' (the second colour) in the beams. `concert`: warm amber beams and a purple surface. (The `celebration` of the plan, colours chasing round the bowl, is a later one.)
+ */
+export declare const LIGHT_PRESETS: Readonly<Record<LightingPreset, LightPreset>>;
+export declare const LIGHTING_PRESETS: readonly LightingPreset[];
+/** The lighting as asked, with every part's value. */
 export interface Lighting {
     preset: LightingPreset;
-    aisles: string;
+    house: House;
+    aisles: "none" | "dots" | "beams";
+    pool: boolean;
+    /** The colour of the beams. */
+    beam: string;
+    /** The surface's colour of light (none for the surface as it is). */
     wash: string | undefined;
 }
-/** The lighting an option asks for: a named preset, `true` for the first (night), `{ preset, aisles, wash }`, or `undefined` for none (false, nothing, an unknown name). */
-export declare function resolveLighting(ask: LightingOptions | undefined | null): Lighting | undefined;
+/** The teams' colours the options have: a score's teams' `color`, over which a crowd's `home` and `away` stand. */
+export declare function teamColors(o: object, crowd?: {
+    home?: string;
+    away?: string;
+}): {
+    home?: string;
+    away?: string;
+};
+/**
+ * The lighting an option asks for: a preset's name, `true` for the first (night), or `{ preset, colors, aisles, wash }`, or `undefined` for none (false, nothing, an unknown name). A colour comes from, in order: `wash` or `aisles`, `colors` (the first
+ * is what the preset's `home` is, the second its `away`), the teams' colours (`team`), the preset's own.
+ */
+export declare function resolveLighting(ask: LightingOptions | undefined | null, team?: {
+    home?: string;
+    away?: string;
+}): Lighting | undefined;
 /** How far the pool of light round the surface reaches beyond its box, in feet, and the share of the pool that is bright (the surface's own edge). The surface itself stays as drawn: the pool is brightest just outside its markings. */
 export declare const POOL: {
     readonly reach: 20;

package/dist/venue.lighting.js

@@ -4,19 +4,43 @@
 // Pure: data in, planes out.
 import { flat, n } from "./turn.kit.js";
 import { safeColor } from "./venue.boards.js";
-export const LIGHTING_PRESETS = ["night", "lightsDown"];
-/** The named colours of light: `wash` and `aisles` take these by name (ours, a little saturated, for a light seen on dark). */
+/** The named colours of light: `wash`, `aisles` and `colors` take these by name (ours, a little saturated, for a light seen on dark). */
 export const LIGHT_COLORS = { white: "#fff6e6", amber: "#ffb830", purple: "#9b4dff", magenta: "#ff2bd6", blue: "#2b7bff", cyan: "#27d6ff" };
+/**
+ * The named lightings. `night`: the calm dim house with small lights along the aisles. `game`: white light, the house half lit, a pool of light round the surface. `lightsDown`: the house nearly black, a white beam down each aisle. `intro`: the
+ * house dark, the home team's colour washed over the surface and the visitors' (the second colour) in the beams. `concert`: warm amber beams and a purple surface. (The `celebration` of the plan, colours chasing round the bowl, is a later one.)
+ */
+export const LIGHT_PRESETS = {
+    night: { house: "dim", aisles: "dots", pool: true },
+    game: { house: "half", aisles: "none", pool: true },
+    lightsDown: { house: "dark", aisles: "beams", pool: false },
+    intro: { house: "dark", aisles: "beams", pool: false, wash: "home", beam: "away", fallback: { home: "blue", away: "amber" } },
+    concert: { house: "dark", aisles: "beams", pool: false, wash: "purple", beam: "amber" },
+};
+export const LIGHTING_PRESETS = Object.keys(LIGHT_PRESETS);
 const colorOf = (value) => (typeof value === "string" && Object.hasOwn(LIGHT_COLORS, value) ? LIGHT_COLORS[value] : safeColor(value));
-/** The lighting an option asks for: a named preset, `true` for the first (night), `{ preset, aisles, wash }`, or `undefined` for none (false, nothing, an unknown name). */
-export function resolveLighting(ask) {
+/** The teams' colours the options have: a score's teams' `color`, over which a crowd's `home` and `away` stand. */
+export function teamColors(o, crowd) {
+    const teams = o;
+    return { home: safeColor(crowd?.home) ?? safeColor(teams.home?.color), away: safeColor(crowd?.away) ?? safeColor(teams.away?.color) };
+}
+/**
+ * The lighting an option asks for: a preset's name, `true` for the first (night), or `{ preset, colors, aisles, wash }`, or `undefined` for none (false, nothing, an unknown name). A colour comes from, in order: `wash` or `aisles`, `colors` (the first
+ * is what the preset's `home` is, the second its `away`), the teams' colours (`team`), the preset's own.
+ */
+export function resolveLighting(ask, team = {}) {
     if (ask === undefined || ask === null || ask === false)
         return undefined;
     const o = typeof ask === "object" ? ask : {};
     const name = typeof ask === "string" ? ask : ask === true ? "night" : o.preset ?? "night";
     if (!LIGHTING_PRESETS.includes(name))
         return undefined;
-    return { preset: name, aisles: colorOf(o.aisles) ?? LIGHT_COLORS.white, wash: colorOf(o.wash) };
+    const preset = name;
+    const base = LIGHT_PRESETS[preset];
+    const given = (Array.isArray(o.colors) ? o.colors : []).map(colorOf).filter((c) => c !== undefined);
+    const side = (which) => (which === "home" ? given[0] ?? team.home : given[1] ?? team.away) ?? LIGHT_COLORS[base.fallback?.[which] ?? (which === "home" ? "blue" : "amber")];
+    const pick = (token) => (token === undefined ? undefined : token === "home" || token === "away" ? side(token) : LIGHT_COLORS[token]);
+    return { preset, house: base.house, aisles: base.aisles, pool: base.pool, beam: colorOf(o.aisles) ?? pick(base.beam) ?? LIGHT_COLORS.white, wash: colorOf(o.wash) ?? pick(base.wash) };
 }
 /** How far the pool of light round the surface reaches beyond its box, in feet, and the share of the pool that is bright (the surface's own edge). The surface itself stays as drawn: the pool is brightest just outside its markings. */
 export const POOL = { reach: 20, edge: 0.7, strength: 0.34 };

package/dist/version.d.ts

@@ -1,2 +1,2 @@
 /** The package's version: the same as package.json's, and a test holds them to each other. */
-export declare const VERSION = "0.39.0";
+export declare const VERSION = "0.40.0";

package/dist/version.js

@@ -1,2 +1,2 @@
 /** The package's version: the same as package.json's, and a test holds them to each other. */
-export const VERSION = "0.39.0";
+export const VERSION = "0.40.0";

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@johnmorrisdotca/kyogijo-stadiums",
-  "version": "0.39.0",
+  "version": "0.40.0",
   "description": "Kyogijo Stadiums 競技場, 40 sports' surfaces as SVG, drawn to scale from the rulebooks: NFL, CFL and IFAF football fields, an NHL rink, an NBA court, MLB ballparks, soccer pitches, curling sheets, athletics stadiums, speed skating, short track and figure skating rinks, swimming pools, water polo fields, diving wells, artistic swimming areas, and the courts and fields of tennis, volleyball (indoor, beach and sitting), badminton, pickleball, table tennis, padel, squash, racquetball, sepak takraw, teqball, roundnet, netball, lacrosse, rugby, Australian football, Gaelic games, cricket, field hockey and handball, and the budo of judo, karate, kendo, sumo and kyudo with a dojo of tatami laid as real units, the MMA cage, with each team's name and logo on its side and the score in the middle, stands and a crowd, a pageant of flags, and a 3D view. Light and dark, accessible, a compact badge for lists, a helper for React and a custom element. Zero dependencies.",
   "keywords": [
     "sports",