@johnmorrisdotca/kyogijo-stadiums 0.4.0 → 0.6.0

package/dist/tenants.js

@@ -0,0 +1,46 @@
+import { TENANT_ARTICLES, TENANT_DATA, TENANT_NAMES_JA, TENANT_NO_SURFACE } from "./tenants.data.js";
+const toTenant = (placeId, data) => {
+    const article = TENANT_ARTICLES[placeId];
+    const source = {
+        ...(data.statements === undefined ? {} : { wikidata: data.statements }),
+        ...(data.listed === true && article !== undefined ? { wikipedia: article } : {}),
+        ...(data.years === undefined ? {} : { years: data.years }),
+    };
+    return {
+        club: data.club,
+        ...(data.clubJa === undefined ? {} : { clubJa: data.clubJa }),
+        ...(data.aliasesJa === undefined ? {} : { aliasesJa: data.aliasesJa }),
+        league: data.league,
+        sport: data.sport,
+        ...(data.from === undefined ? {} : { from: data.from }),
+        ...(data.to === undefined ? {} : { to: data.to }),
+        wikidata: data.wikidata,
+        source,
+    };
+};
+/** The tenants of every place that has any, by the place's key: the current ones first, by the year they came, then those that have left, the latest to leave first. */
+export const TENANTS = Object.freeze(Object.fromEntries(Object.entries(TENANT_DATA).map(([id, list]) => [id, Object.freeze(list.map((data) => toTenant(id, data)))])));
+/** The leagues of a list of tenants, each once, in the order they first come. */
+export const leaguesOf = (tenants) => [...new Set(tenants.map((tenant) => tenant.league))];
+/** True when a tenant played there in `year`; a year the data does not give for a bound does not shut it out. */
+export const playedIn = (tenant, year) => (tenant.from === undefined || tenant.from <= year) && (tenant.to === undefined || year <= tenant.to);
+/** The draw sport a tenant's sport is drawn as, and any league of its rulebook: the field of play a club's sport asks for. `undefined` where the package draws none. */
+export const SURFACE_OF_SPORT = Object.freeze({
+    baseball: { sport: "mlb" },
+    soccer: { sport: "soccer" },
+    "american-football": { sport: "nfl" },
+    "canadian-football": { sport: "cfl" },
+    basketball: { sport: "nba" },
+    "ice-hockey": { sport: "nhl" },
+    "rugby-union": { sport: "rugby" },
+    "rugby-league": { sport: "rugby", league: "nrl" },
+    "australian-football": { sport: "afl" },
+    lacrosse: undefined,
+    cricket: { sport: "cricket" },
+});
+/** True when the package draws a surface for the tenant's sport and league. */
+export const hasSurface = (tenant) => SURFACE_OF_SPORT[tenant.sport] !== undefined && !TENANT_NO_SURFACE.includes(tenant.league);
+/** The clubs whose name in Japanese is the everyday form and not Wikidata's label, by Wikidata item, with why and the source of each: `nameJaOf(tenant)` finds a tenant's. */
+export const TENANT_JAPANESE_NAMES = TENANT_NAMES_JA;
+/** The note on a tenant's name in Japanese, if its everyday form is a curated one. */
+export const nameJaOf = (tenant) => TENANT_NAMES_JA[tenant.wikidata];

package/dist/turn-entry.d.ts

@@ -0,0 +1,12 @@
+export { mountKyogijoTurn, turnSupported } from "./turn.dom.ts";
+export type { KyogijoTurn } from "./turn.dom.ts";
+export { buildTurn, floorOptions, openingView } from "./turn.model.ts";
+export type { TurnModel, TurnSettings } from "./turn.model.ts";
+export { layoutOf, planeMarkup, planeMatrix, turnMarkup, turnMarkupOf } from "./turn.markup.ts";
+export type { Layout } from "./turn.markup.ts";
+export { KYOGIJO_TURN_STYLE } from "./turn.style.ts";
+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.ts";
+export type { Box3, Mat4, Placement, TurnPreset, TurnToward, TurnView } from "./turn.camera.ts";
+export { describeUprights, heightUnit, planesOf, uprightsFor } from "./uprights.ts";
+export type { UprightOptions, Uprights } from "./uprights.ts";
+export type { Plane, PartKind, Upright, UprightKind, V3 } from "./turn.kit.ts";

package/dist/turn-entry.js

@@ -0,0 +1,7 @@
+// The 3D view: a surface as a floor that turns, with a net, a basket, a goal or a pair of posts standing on it.
+export { mountKyogijoTurn, turnSupported } from "./turn.dom.js";
+export { buildTurn, floorOptions, openingView } from "./turn.model.js";
+export { layoutOf, planeMarkup, planeMatrix, turnMarkup, turnMarkupOf } from "./turn.markup.js";
+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";

package/dist/turn.camera.d.ts

@@ -0,0 +1,116 @@
+/** How the scene is looked at: turned about the vertical (degrees, clockwise as the eye sees the floor), tipped back from straight overhead (degrees), and magnified. */
+export interface TurnView {
+    yaw: number;
+    pitch: number;
+    zoom: number;
+}
+/** The named viewpoints. */
+export type TurnPreset = "overhead" | "broadcast" | "end" | "corner";
+/** The viewpoints, in the order the controls and the number keys list them. */
+export declare const TURN_PRESET_NAMES: readonly TurnPreset[];
+/**
+ * The four viewpoints. `overhead` looks straight down; `broadcast` is the main camera, high on one side line and turned a little towards the near end so that the boards, the nets and the goals show their faces; `end` stands behind an end line, along the
+ * surface, which is where a net, a goal or a basket is best seen; `corner` is low, from a corner, with the nearest net or goal in front.
+ */
+export declare const TURN_PRESETS: Readonly<Record<TurnPreset, TurnView>>;
+/** The same four for a long, narrow surface (a football field, a hockey rink): turned less, because a diagonal view would shrink it in the box. */
+export declare const LONG_PRESETS: Readonly<Record<TurnPreset, TurnView>>;
+/**
+ * The same four for the net sports, whose net runs across the court: seen from the side line it is a stick, so the broadcast view stands high behind an end line, as a
+ * television camera does, and the end-on view is lower behind it. The corner view is the same.
+ */
+export declare const NET_PRESETS: Readonly<Record<TurnPreset, TurnView>>;
+/**
+ * The same four for a curling sheet, which is ten times as long as it is wide: from the side it is a strip across the box, so the broadcast and the corner views
+ * stay nearly square on to it, and the end view looks along it.
+ */
+export declare const CURLING_PRESETS: Readonly<Record<TurnPreset, TurnView>>;
+/** The four viewpoints of a sport. */
+export declare const presetsFor: (sport?: string) => Readonly<Record<TurnPreset, TurnView>>;
+/** The view a mount opens on. */
+export declare const TURN_DEFAULT: TurnPreset;
+export declare const PITCH_MAX = 84;
+export declare const ZOOM_MIN = 0.5;
+export declare const ZOOM_MAX = 4;
+/** An angle in degrees brought to the range -180 to 180. */
+export declare const wrap: (angle: number) => number;
+/** A view held to what the controls allow: the pitch from overhead to 84 degrees, the zoom from half to four times. A number that is not one is left as it was. */
+export declare function clampView(view: TurnView, fallback?: TurnView): TurnView;
+/** The angle equal to `to` that is nearest to `from`, so that a change of view turns the short way round. */
+export declare const nearest: (from: number, to: number) => number;
+/** The view a viewpoint name stands for in a sport, or `undefined` for a name that is not one. */
+export declare const presetView: (name: string | undefined, sport?: string) => TurnView | undefined;
+/** The name of the viewpoint a view is in a sport, or `undefined` when it is none of them (it has been turned by hand). */
+export declare function presetOf(view: TurnView, sport?: string): TurnPreset | undefined;
+/** The steps of the keys and the buttons, in degrees, and the factor of a zoom step. A held Shift takes the larger. */
+export declare const STEP: {
+    readonly yaw: 6;
+    readonly yawBig: 24;
+    readonly pitch: 4;
+    readonly pitchBig: 12;
+    readonly zoom: 1.2;
+};
+/** The view after a step of a key or a button. */
+export declare function step(view: TurnView, change: {
+    yaw?: number;
+    pitch?: number;
+    zoom?: number;
+}): TurnView;
+/** A side a key, a button or a drag takes the surface toward. */
+export type TurnToward = "left" | "right" | "up" | "down";
+/**
+ * The view after a step of `amount` degrees toward a side, the way a drag toward that side takes the view: left and right carry the near side to the left and to the right (the yaw rises and
+ * falls), up tips the surface as a drag up does and down as a drag down does (the pitch rises and falls). The arrow keys and the four turn buttons are this, so that a drag, a key and a button
+ * toward one side all move the surface the same way.
+ */
+export declare function nudge(view: TurnView, toward: TurnToward, amount: number): TurnView;
+/**
+ * The view after a drag of the pointer by (dx, dy) pixels, `degreesPerPixel` apart: the surface is taken hold of, so a drag to the right carries the side nearest the eye to the right (the
+ * yaw falls) and a drag down tips the top toward the eye (the pitch falls).
+ */
+export declare function drag(view: TurnView, dx: number, dy: number, tilt?: boolean, degreesPerPixel?: number): TurnView;
+/** A box in the scene, in pixels from the scene's middle, the floor at `z0` and the highest thing at `z1`. */
+export interface Box3 {
+    x0: number;
+    y0: number;
+    x1: number;
+    y1: number;
+    z0: number;
+    z1: number;
+}
+/** How a view is placed in a container: the scale (at a zoom of 1) that fits the scene, and where the middle of what is seen falls. */
+export interface Placement {
+    k: number;
+    tx: number;
+    ty: number;
+}
+/** Where a point of the scene falls on the screen, in pixels from the middle of the container, when the scene is placed as given and the eye is `distance` pixels away. */
+export declare function project(point: readonly [number, number, number], view: TurnView, at: Placement, distance: number): [number, number, number];
+/** The rectangle on the screen that a box covers. */
+export declare function covered(b: Box3, view: TurnView, at: Placement, distance: number): {
+    x0: number;
+    y0: number;
+    x1: number;
+    y1: number;
+};
+/**
+ * The placement that fits the scene in a container of width `w` and height `h` pixels, centred, with `pad` of its width and height left round it. The
+ * perspective bends the sum, so it is found by a few rounds of scaling and re-centring; six is plenty.
+ */
+export declare function fit(b: Box3, view: TurnView, w: number, h: number, distance: number, pad?: number): Placement;
+/** A 4 by 4 matrix, as CSS writes it in `matrix3d`: sixteen numbers, a column after a column. */
+export type Mat4 = readonly number[];
+/** Two matrices as one: `b` first, then `a`. */
+export declare function multiply(a: Mat4, b: Mat4): number[];
+/**
+ * The matrix that puts a point of the scene on the screen for a view in a placement: the scene (whose middle is the origin) is scaled, turned about the vertical,
+ * tipped back, shifted to where the fit puts it, and seen with a perspective `distance` pixels deep. This is `project`'s arithmetic as one matrix, so that an
+ * element can be given its whole place in one `matrix3d` and need no 3D context of the browser's: a browser that draws nested 3D layers flat still draws it right.
+ */
+export declare function cameraMatrix(view: TurnView, at: Placement, distance: number): number[];
+/** A matrix as the CSS `transform` that applies it. */
+export declare const matrix3d: (m: Mat4) => string;
+/** How far a point is from the eye's plane after the scene is turned and tipped, in pixels towards the eye: bigger is nearer. Planes are drawn far first. */
+export declare function depthOf(point: readonly [number, number, number], view: TurnView, at: Placement): number;
+/** How far the eye is from the screen, in pixels, for a container: a long lens, so that the floor keeps its shape and the heights lean a little. */
+export declare const eyeDistance: (w: number, h: number, lens?: number) => number;

package/dist/turn.camera.js

@@ -0,0 +1,184 @@
+// The eye of the 3D view: where it looks from, and what that does to the scene. The scene is turned by `rotateZ(yaw)` about the vertical through its middle
+// and then tipped back by `rotateX(pitch)`; a perspective on the container does the rest. Everything here is arithmetic on numbers, so the same view can be
+// worked out in Node, tested, and handed to a stylesheet as one `transform`.
+//
+// CSS has x to the right, y down and z towards the eye, and the scene is built that way: the floor lies in the x-y plane facing the eye, heights are z.
+/** The viewpoints, in the order the controls and the number keys list them. */
+export const TURN_PRESET_NAMES = ["overhead", "broadcast", "end", "corner"];
+/**
+ * The four viewpoints. `overhead` looks straight down; `broadcast` is the main camera, high on one side line and turned a little towards the near end so that the boards, the nets and the goals show their faces; `end` stands behind an end line, along the
+ * surface, which is where a net, a goal or a basket is best seen; `corner` is low, from a corner, with the nearest net or goal in front.
+ */
+export const TURN_PRESETS = {
+    overhead: { yaw: 0, pitch: 0, zoom: 1 },
+    broadcast: { yaw: -20, pitch: 62, zoom: 1 },
+    end: { yaw: -90, pitch: 68, zoom: 1 },
+    corner: { yaw: -38, pitch: 70, zoom: 1 },
+};
+/** The same four for a long, narrow surface (a football field, a hockey rink): turned less, because a diagonal view would shrink it in the box. */
+export const LONG_PRESETS = { ...TURN_PRESETS, broadcast: { yaw: -9, pitch: 62, zoom: 1 } };
+/** The sports with surfaces more than twice as long as they are wide, whose viewpoints are `LONG_PRESETS`. */
+const LONG_SPORTS = ["nfl", "cfl", "ifaf", "nhl"];
+/**
+ * The same four for the net sports, whose net runs across the court: seen from the side line it is a stick, so the broadcast view stands high behind an end line, as a
+ * television camera does, and the end-on view is lower behind it. The corner view is the same.
+ */
+export const NET_PRESETS = {
+    overhead: TURN_PRESETS.overhead,
+    broadcast: { yaw: -90, pitch: 54, zoom: 1 },
+    end: { yaw: -90, pitch: 74, zoom: 1 },
+    corner: TURN_PRESETS.corner,
+};
+/**
+ * The same four for a curling sheet, which is ten times as long as it is wide: from the side it is a strip across the box, so the broadcast and the corner views
+ * stay nearly square on to it, and the end view looks along it.
+ */
+export const CURLING_PRESETS = {
+    overhead: TURN_PRESETS.overhead,
+    broadcast: { yaw: 0, pitch: 62, zoom: 1 },
+    end: { yaw: -90, pitch: 70, zoom: 1 },
+    corner: { yaw: -24, pitch: 62, zoom: 1 },
+};
+/** The sports whose net runs across the court and whose viewpoints are `NET_PRESETS`. */
+const NET_SPORTS = ["tennis", "volleyball", "badminton", "pickleball", "tabletennis", "padel", "sepaktakraw", "teqball"];
+/** The four viewpoints of a sport. */
+export const presetsFor = (sport) => (sport === "curling" ? CURLING_PRESETS : sport !== undefined && NET_SPORTS.includes(sport) ? NET_PRESETS : sport !== undefined && LONG_SPORTS.includes(sport) ? LONG_PRESETS : TURN_PRESETS);
+/** The view a mount opens on. */
+export const TURN_DEFAULT = "corner";
+export const PITCH_MAX = 84;
+export const ZOOM_MIN = 0.5;
+export const ZOOM_MAX = 4;
+const clamp = (value, low, high) => Math.min(high, Math.max(low, value));
+/** An angle in degrees brought to the range -180 to 180. */
+export const wrap = (angle) => ((((angle + 180) % 360) + 360) % 360) - 180;
+/** A view held to what the controls allow: the pitch from overhead to 84 degrees, the zoom from half to four times. A number that is not one is left as it was. */
+export function clampView(view, fallback = TURN_PRESETS[TURN_DEFAULT]) {
+    const finite = (value, otherwise) => (Number.isFinite(value) ? value : otherwise);
+    return {
+        yaw: wrap(finite(view.yaw, fallback.yaw)),
+        pitch: clamp(finite(view.pitch, fallback.pitch), 0, PITCH_MAX),
+        zoom: clamp(finite(view.zoom, fallback.zoom), ZOOM_MIN, ZOOM_MAX),
+    };
+}
+/** The angle equal to `to` that is nearest to `from`, so that a change of view turns the short way round. */
+export const nearest = (from, to) => from + wrap(to - from);
+/** The view a viewpoint name stands for in a sport, or `undefined` for a name that is not one. */
+export const presetView = (name, sport) => (name !== undefined && TURN_PRESET_NAMES.includes(name) ? { ...presetsFor(sport)[name] } : undefined);
+/** The name of the viewpoint a view is in a sport, or `undefined` when it is none of them (it has been turned by hand). */
+export function presetOf(view, sport) {
+    return TURN_PRESET_NAMES.find((name) => {
+        const p = presetsFor(sport)[name];
+        return Math.abs(wrap(view.yaw - p.yaw)) < 0.5 && Math.abs(view.pitch - p.pitch) < 0.5 && Math.abs(view.zoom - p.zoom) < 0.01;
+    });
+}
+/** The steps of the keys and the buttons, in degrees, and the factor of a zoom step. A held Shift takes the larger. */
+export const STEP = { yaw: 6, yawBig: 24, pitch: 4, pitchBig: 12, zoom: 1.2 };
+/** The view after a step of a key or a button. */
+export function step(view, change) {
+    return clampView({ yaw: view.yaw + (change.yaw ?? 0), pitch: view.pitch + (change.pitch ?? 0), zoom: view.zoom * (change.zoom ?? 1) });
+}
+/**
+ * The view after a step of `amount` degrees toward a side, the way a drag toward that side takes the view: left and right carry the near side to the left and to the right (the yaw rises and
+ * falls), up tips the surface as a drag up does and down as a drag down does (the pitch rises and falls). The arrow keys and the four turn buttons are this, so that a drag, a key and a button
+ * toward one side all move the surface the same way.
+ */
+export function nudge(view, toward, amount) {
+    switch (toward) {
+        case "left": return step(view, { yaw: amount });
+        case "right": return step(view, { yaw: -amount });
+        case "up": return step(view, { pitch: amount });
+        default: return step(view, { pitch: -amount });
+    }
+}
+/**
+ * The view after a drag of the pointer by (dx, dy) pixels, `degreesPerPixel` apart: the surface is taken hold of, so a drag to the right carries the side nearest the eye to the right (the
+ * yaw falls) and a drag down tips the top toward the eye (the pitch falls).
+ */
+export function drag(view, dx, dy, tilt = true, degreesPerPixel = 0.4) {
+    return clampView({ ...view, yaw: view.yaw - dx * degreesPerPixel, pitch: tilt ? view.pitch - dy * degreesPerPixel * 0.75 : view.pitch });
+}
+const RAD = Math.PI / 180;
+/** Where a point of the scene falls on the screen, in pixels from the middle of the container, when the scene is placed as given and the eye is `distance` pixels away. */
+export function project(point, view, at, distance) {
+    const k = at.k * view.zoom;
+    const [x, y, z] = [point[0] * k, point[1] * k, point[2] * k];
+    const yaw = view.yaw * RAD;
+    const pitch = view.pitch * RAD;
+    const x2 = x * Math.cos(yaw) - y * Math.sin(yaw);
+    const y2 = x * Math.sin(yaw) + y * Math.cos(yaw);
+    const y3 = y2 * Math.cos(pitch) - z * Math.sin(pitch);
+    const z3 = y2 * Math.sin(pitch) + z * Math.cos(pitch);
+    const X = x2 + at.tx;
+    const Y = y3 + at.ty;
+    // A point at or behind the eye cannot be seen: it is pushed to the edge of the world instead of flipping.
+    const f = distance / Math.max(distance - z3, distance * 0.05);
+    return [X * f, Y * f, f];
+}
+/** The corners of a box. */
+const corners = (b) => [b.x0, b.x1].flatMap((x) => [b.y0, b.y1].flatMap((y) => [b.z0, b.z1].map((z) => [x, y, z])));
+/** The rectangle on the screen that a box covers. */
+export function covered(b, view, at, distance) {
+    const shown = corners(b).map((c) => project(c, view, at, distance));
+    return { x0: Math.min(...shown.map((p) => p[0])), x1: Math.max(...shown.map((p) => p[0])), y0: Math.min(...shown.map((p) => p[1])), y1: Math.max(...shown.map((p) => p[1])) };
+}
+/**
+ * The placement that fits the scene in a container of width `w` and height `h` pixels, centred, with `pad` of its width and height left round it. The
+ * perspective bends the sum, so it is found by a few rounds of scaling and re-centring; six is plenty.
+ */
+export function fit(b, view, w, h, distance, pad = 0.03) {
+    const at = { k: 0.5, tx: 0, ty: 0 };
+    const flat = { ...view, zoom: 1 };
+    for (let i = 0; i < 8; i += 1) {
+        const r = covered(b, flat, at, distance);
+        const cw = r.x1 - r.x0;
+        const ch = r.y1 - r.y0;
+        if (cw <= 0 || ch <= 0)
+            break;
+        at.k *= Math.min((w * (1 - 2 * pad)) / cw, (h * (1 - 2 * pad)) / ch);
+        const c = covered(b, flat, at, distance);
+        at.tx -= (c.x0 + c.x1) / 2;
+        at.ty -= (c.y0 + c.y1) / 2;
+    }
+    return at;
+}
+/** Two matrices as one: `b` first, then `a`. */
+export function multiply(a, b) {
+    const out = new Array(16).fill(0);
+    for (let col = 0; col < 4; col += 1)
+        for (let row = 0; row < 4; row += 1)
+            for (let k = 0; k < 4; k += 1)
+                out[col * 4 + row] += a[k * 4 + row] * b[col * 4 + k];
+    return out;
+}
+const translation = (x, y, z) => [1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, x, y, z, 1];
+/**
+ * The matrix that puts a point of the scene on the screen for a view in a placement: the scene (whose middle is the origin) is scaled, turned about the vertical,
+ * tipped back, shifted to where the fit puts it, and seen with a perspective `distance` pixels deep. This is `project`'s arithmetic as one matrix, so that an
+ * element can be given its whole place in one `matrix3d` and need no 3D context of the browser's: a browser that draws nested 3D layers flat still draws it right.
+ */
+export function cameraMatrix(view, at, distance) {
+    const k = at.k * view.zoom;
+    const [yaw, pitch] = [view.yaw * RAD, view.pitch * RAD];
+    const [cy, sy, cp, sp] = [Math.cos(yaw), Math.sin(yaw), Math.cos(pitch), Math.sin(pitch)];
+    const scale = [k, 0, 0, 0, 0, k, 0, 0, 0, 0, k, 0, 0, 0, 0, 1];
+    const rotateZ = [cy, sy, 0, 0, -sy, cy, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1];
+    const rotateX = [1, 0, 0, 0, 0, cp, sp, 0, 0, -sp, cp, 0, 0, 0, 0, 1];
+    const eye = [1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, -1 / distance, 0, 0, 0, 1];
+    let m = multiply(eye, translation(at.tx, at.ty, 0));
+    m = multiply(m, rotateX);
+    m = multiply(m, rotateZ);
+    return multiply(m, scale);
+}
+const num = (value) => String(Math.round(value * 10000) / 10000);
+/** A matrix as the CSS `transform` that applies it. */
+export const matrix3d = (m) => `matrix3d(${m.map(num).join(",")})`;
+/** How far a point is from the eye's plane after the scene is turned and tipped, in pixels towards the eye: bigger is nearer. Planes are drawn far first. */
+export function depthOf(point, view, at) {
+    const k = at.k * view.zoom;
+    const [x, y, z] = [point[0] * k, point[1] * k, point[2] * k];
+    const yaw = view.yaw * RAD;
+    const y2 = x * Math.sin(yaw) + y * Math.cos(yaw);
+    return y2 * Math.sin(view.pitch * RAD) + z * Math.cos(view.pitch * RAD);
+}
+/** How far the eye is from the screen, in pixels, for a container: a long lens, so that the floor keeps its shape and the heights lean a little. */
+export const eyeDistance = (w, h, lens = 1.7) => lens * Math.max(w, h);

package/dist/turn.dom.d.ts

@@ -0,0 +1,40 @@
+import { type TurnPreset, type TurnView } from "./turn.camera.ts";
+import { type TurnSettings } from "./turn.model.ts";
+import type { ScoreOptions, SurfaceOptions } from "./types.ts";
+/** What `mountKyogijoTurn` gives back. */
+export interface KyogijoTurn {
+    /** `3d`, or `flat` where the browser cannot draw the 3D view (or there is nothing to turn): the flat drawing is shown and the rest of this does nothing. */
+    readonly mode: "3d" | "flat";
+    /** The view now: where it is going if it is gliding. */
+    view(): TurnView;
+    /** Turn to a view (the parts of it given): it glides there unless `glide` is false or the reader prefers reduced motion. */
+    set(view: Partial<TurnView>, glide?: boolean): void;
+    /** Go to one of the four viewpoints: `overhead`, `broadcast`, `end` or `corner`. */
+    preset(name: TurnPreset): void;
+    /** Back to the opening view. */
+    reset(): void;
+    /** Draw again with new options (a score that moved, a look that changed), keeping the view. */
+    update(options: SurfaceOptions | ScoreOptions): void;
+    /** The flat drawing that is the floor, or `null` after `destroy`. */
+    svg(): SVGSVGElement | null;
+    /** Stop listening and empty the container. */
+    destroy(): void;
+}
+/** True where the page can draw a plane in 3D by one `matrix3d`: that is, nearly everywhere with a stylesheet. */
+export declare function turnSupported(win?: {
+    CSS?: {
+        supports?: (property: string, value: string) => boolean;
+    } | null;
+} | undefined): boolean;
+/**
+ * Mount a surface as a 3D view in a container, over the static drawing it would otherwise hold: the drawing is the floor, tilted and turned by the pointer, the
+ * touch, the wheel and the keys, with what stands on the surface (a net and its posts, a basket, a goal, the posts of a football field) standing on it.
+ * @example
+ * ```ts no-run
+ * import { mountKyogijoTurn } from "@johnmorrisdotca/kyogijo-stadiums/turn";
+ * const view = mountKyogijoTurn(document.querySelector("#court")!, { sport: "volleyball", home: { name: "Harbour City Gulls", score: 3 }, away: { name: "Prairie Ridge Bison", score: 2 } }, { preset: "end" });
+ * view.preset("corner");
+ * view.set({ yaw: 60, pitch: 40 });
+ * ```
+ */
+export declare function mountKyogijoTurn(host: HTMLElement, options: SurfaceOptions | ScoreOptions, settings?: TurnSettings): KyogijoTurn;