@cardanvil/frame-kit 0.6.0 → 0.7.0

package/dist/layout/textStyle.js

@@ -0,0 +1,28 @@
+/** The color plain-text drop shadows are drawn in. */
+export const TEXT_SHADOW_COLOR = "#17191b";
+/** A box's outline, when it sets both an `outlineColor` and an `outlineWidth`. */
+export function textOutlineFor(box) {
+    return box.outlineColor && box.outlineWidth
+        ? { color: box.outlineColor, width: box.outlineWidth }
+        : undefined;
+}
+/**
+ * The drop shadow a plain-text box — title, type, P/T, nickname title,
+ * collector info — is drawn with: only when it asks for one with `shadow`,
+ * and never alongside an outline, which always wins. The offsets default to
+ * fractions of the box's `fontSize`, unless the box sets its own.
+ *
+ * Symbols read `shadow` differently (on unless turned off), so this is for
+ * plain text only.
+ */
+export function textShadowFor(box) {
+    if (!box.shadow || textOutlineFor(box)) {
+        return undefined;
+    }
+    return {
+        color: TEXT_SHADOW_COLOR,
+        offsetX: box.shadowOffsetX ?? -(box.fontSize * 0.029),
+        offsetY: box.shadowOffsetY ?? box.fontSize * 0.075,
+        blur: box.shadowBlur ?? 0,
+    };
+}

package/dist/layout/turn.d.ts

@@ -0,0 +1,54 @@
+import type { Bounds, Rotation } from "../schema/frame.js";
+/**
+ * The geometry of a turned box set — one whose `rotation` says the card is
+ * turned to read it (see `CardBoxesSchema`).
+ *
+ * Two spaces are in play. The **sheet** is the canvas as printed, and never
+ * turns. A set's **turned space** is that sheet as it lies once the card has
+ * been turned `rotation` degrees clockwise, which is where the set's boxes are
+ * measured. Everything here maps the second onto the first.
+ */
+export interface Size {
+    width: number;
+    height: number;
+}
+export interface Point {
+    x: number;
+    y: number;
+}
+/**
+ * A 2D affine transform in the order a canvas takes one:
+ * `x' = a·x + c·y + e`, `y' = b·x + d·y + f`.
+ */
+export type Matrix = readonly [
+    a: number,
+    b: number,
+    c: number,
+    d: number,
+    e: number,
+    f: number
+];
+/** The sheet as a turned set sees it: a quarter turn swaps its sides. */
+export declare function turnedSheetSize(sheet: Size, rotation: Rotation | undefined): Size;
+/**
+ * Where a turned set's origin lands on the sheet and how far it is rotated
+ * there, in degrees clockwise — the `x`, `y` and `rotation` of a node that
+ * draws the set. Turning the card clockwise to read a set means the set
+ * itself sits counter-clockwise on the sheet, hence the opposite sign.
+ */
+export declare function turnPlacement(sheet: Size, rotation: Rotation | undefined): Point & {
+    rotation: number;
+};
+/** {@link turnPlacement} as a matrix taking turned space to the sheet. */
+export declare function turnMatrix(sheet: Size, rotation: Rotation | undefined): Matrix;
+/** A point in a matrix's source space, in its target space. */
+export declare function applyMatrix(matrix: Matrix, point: Point): Point;
+/** The rectangle a turned set's box covers on the sheet. */
+export declare function turnedBoundsOnSheet(bounds: Bounds, sheet: Size, rotation: Rotation | undefined): Bounds;
+/**
+ * A direction in a turned set's space, as a direction on the sheet. Only the
+ * turn applies; a direction has no position to translate.
+ */
+export declare function turnedVectorOnSheet(vector: Point, rotation: Rotation | undefined): Point;
+/** The reverse of {@link turnedVectorOnSheet}. */
+export declare function sheetVectorInTurned(vector: Point, rotation: Rotation | undefined): Point;

package/dist/layout/turn.js

@@ -0,0 +1,107 @@
+/** The sheet as a turned set sees it: a quarter turn swaps its sides. */
+export function turnedSheetSize(sheet, rotation) {
+    return rotation === 90 || rotation === 270
+        ? { width: sheet.height, height: sheet.width }
+        : { width: sheet.width, height: sheet.height };
+}
+/**
+ * Where a turned set's origin lands on the sheet and how far it is rotated
+ * there, in degrees clockwise — the `x`, `y` and `rotation` of a node that
+ * draws the set. Turning the card clockwise to read a set means the set
+ * itself sits counter-clockwise on the sheet, hence the opposite sign.
+ */
+export function turnPlacement(sheet, rotation) {
+    switch (rotation) {
+        case 90:
+            return { x: 0, y: sheet.height, rotation: -90 };
+        case 180:
+            return { x: sheet.width, y: sheet.height, rotation: 180 };
+        case 270:
+            return { x: sheet.width, y: 0, rotation: 90 };
+        default:
+            return { x: 0, y: 0, rotation: 0 };
+    }
+}
+/** {@link turnPlacement} as a matrix taking turned space to the sheet. */
+export function turnMatrix(sheet, rotation) {
+    switch (rotation) {
+        case 90:
+            return [0, -1, 1, 0, 0, sheet.height];
+        case 180:
+            return [-1, 0, 0, -1, sheet.width, sheet.height];
+        case 270:
+            return [0, 1, -1, 0, sheet.width, 0];
+        default:
+            return [1, 0, 0, 1, 0, 0];
+    }
+}
+/** A point in a matrix's source space, in its target space. */
+export function applyMatrix(matrix, point) {
+    const [a, b, c, d, e, f] = matrix;
+    return {
+        x: a * point.x + c * point.y + e,
+        y: b * point.x + d * point.y + f,
+    };
+}
+/** The rectangle a turned set's box covers on the sheet. */
+export function turnedBoundsOnSheet(bounds, sheet, rotation) {
+    switch (rotation) {
+        case 90:
+            return {
+                x: bounds.y,
+                y: sheet.height - bounds.x - bounds.width,
+                width: bounds.height,
+                height: bounds.width,
+            };
+        case 180:
+            return {
+                x: sheet.width - bounds.x - bounds.width,
+                y: sheet.height - bounds.y - bounds.height,
+                width: bounds.width,
+                height: bounds.height,
+            };
+        case 270:
+            return {
+                x: sheet.width - bounds.y - bounds.height,
+                y: bounds.x,
+                width: bounds.height,
+                height: bounds.width,
+            };
+        default:
+            return {
+                x: bounds.x,
+                y: bounds.y,
+                width: bounds.width,
+                height: bounds.height,
+            };
+    }
+}
+/**
+ * A direction in a turned set's space, as a direction on the sheet. Only the
+ * turn applies; a direction has no position to translate.
+ */
+export function turnedVectorOnSheet(vector, rotation) {
+    switch (rotation) {
+        case 90:
+            return { x: vector.y, y: -vector.x };
+        case 180:
+            return { x: -vector.x, y: -vector.y };
+        case 270:
+            return { x: -vector.y, y: vector.x };
+        default:
+            return { x: vector.x, y: vector.y };
+    }
+}
+/** The reverse of {@link turnedVectorOnSheet}. */
+export function sheetVectorInTurned(vector, rotation) {
+    switch (rotation) {
+        case 90:
+            return { x: -vector.y, y: vector.x };
+        case 180:
+            return { x: -vector.x, y: -vector.y };
+        case 270:
+            return { x: vector.y, y: -vector.x };
+        default:
+            return { x: vector.x, y: vector.y };
+    }
+}