LiveCardsOptionstype
How the live cards behave: the shared renderer's options (kazoku-ui's), and how long a turn takes, how long the pointer rests before a card goes live and how far ahead a still is made.
Import it
import type { LiveCardsOptions } from "@johnmorrisdotca/fuda-cards/live-3d";Definition
interface LiveCardsOptions<T extends ThreeLike = ThreeLike> extends Omit<SharedRendererOptions<T>, "scheduler" | "assets" | "clock" | "document"> {
turnSeconds?: number;
dwellMs?: number;
lookAheadPx?: number;
}Members
| Name | Type | Description |
|---|---|---|
turnSeconds (optional) | number | undefined | Seconds for one turn of the card in focus (12). 0 does not turn it. |
dwellMs (optional) | number | undefined | How long the pointer has to rest on a card before it goes live, in milliseconds (150), so moving the pointer across a page of cards starts nothing. A press or the keyboard does not wait. |
lookAheadPx (optional) | number | undefined | How far outside the view a card with no picture of its own gets its still made, in pixels (300). |
load | () => Promise<T> |
|
maxPixels (optional) | number | undefined | |
maxSide (optional) | number | undefined | |
maxRatio (optional) | number | undefined | |
stillSize (optional) | number | undefined | Longest side of a still, in pixels (320). |
stillBytes (optional) | number | undefined | Decoded bytes the stills may hold (32 MB). |
lingerMs (optional) | number | undefined | Milliseconds an unused shared asset is kept (1000). |
releaseMs (optional) | number | undefined | Milliseconds out of sight, in a hidden tab, after which the context is let go and the views show stills (30000). It comes back when the view does. |
antialias (optional) | boolean | undefined | |
onContext (optional) | ((state: "lost" | "restored" | "unavailable") => void) | undefined | Called when the context is lost or restored, or WebGL is not available. |
Examples
import type { LiveCardsOptions } from "@johnmorrisdotca/fuda-cards/live-3d";
const options: LiveCardsOptions = { load: () => import("three"), turnSeconds: 20, dwellMs: 250 };
console.log(options.turnSeconds);