@needle-tools/engine 2.52.0-pre → 2.54.2-pre

package/src/engine-components/export/usdz/extensions/Animation.ts

@@ -0,0 +1,306 @@
+import { GameObject } from "../../../Component";
+import { getParam } from "../../../../engine/engine_utils";
+import { Object3D, Color, Matrix4, MeshStandardMaterial, Vector3, Quaternion, Interpolant } from "three";
+//@ts-ignore
+import { USDZObject, buildMatrix } from "three/examples/jsm/exporters/USDZExporter"
+import { IUSDZExporterExtension } from "../Extension";
+
+const debug = getParam("debugusdzanimation");
+
+export interface UsdzAnimation {
+    createAnimation(ext: AnimationExtension, model: USDZObject, context);
+}
+
+export type AnimationClipCollection = Array<{ root: Object3D, clips: Array<THREE.AnimationClip> }>;
+
+export class RegisteredAnimationInfo {
+
+    get start(): number { return this.ext.getStartTime01(this.root, this.clip); }
+    get duration(): number { return this.clip.duration; }
+
+    private ext: AnimationExtension;
+    private root: Object3D;
+    private clip: THREE.AnimationClip;
+
+    constructor(ext: AnimationExtension, root: THREE.Object3D, clip: THREE.AnimationClip) {
+        this.ext = ext;
+        this.root = root;
+        this.clip = clip;
+    }
+}
+
+export class TransformData {
+    clip: THREE.AnimationClip;
+    pos?: THREE.KeyframeTrack;
+    rot?: THREE.KeyframeTrack;
+    scale?: THREE.KeyframeTrack;
+    get frameRate(): number { return 60; }
+
+    private ext: AnimationExtension;
+    private root: Object3D;
+    private target: Object3D;
+
+    constructor(ext: AnimationExtension, root: Object3D, target: Object3D, clip: THREE.AnimationClip) {
+        this.ext = ext;
+        this.root = root;
+        this.target = target;
+        this.clip = clip;
+    }
+
+    addTrack(track) {
+        if (track.name.endsWith("position")) this.pos = track;
+        if (track.name.endsWith("quaternion")) this.rot = track;
+        if (track.name.endsWith("scale")) this.scale = track;
+    }
+
+    getFrames(): number {
+        return Math.max(this.pos?.times?.length ?? 0, this.rot?.times?.length ?? 0, this.scale?.times?.length ?? 0);
+    }
+
+    getDuration(): number {
+        const times = this.pos?.times ?? this.rot?.times ?? this.scale?.times;
+        if (!times) return 0;
+        return times[times.length - 1];
+    }
+
+    getStartTime(arr: TransformData[]): number {
+        let sum = 0;
+        for (let i = 0; i < arr.length; i++) {
+            const entry = arr[i];
+            if (entry === this) {
+                return sum;
+            }
+            else sum += entry.getDuration();
+        }
+        return sum;
+    }
+}
+
+declare type AnimationDict = Map<Object3D, Array<TransformData>>;
+
+export class AnimationExtension implements IUSDZExporterExtension {
+
+    get extensionName(): string { return "animation" }
+    private dict: AnimationDict = new Map();
+    // private rootTargetMap: Map<Object3D, Object3D[]> = new Map();
+    private rootTargetMap: Map<Object3D, Object3D[]> = new Map();
+
+    getStartTime01(root: Object3D, clip: THREE.AnimationClip) {
+        const targets = this.rootTargetMap.get(root);
+        if (!targets) return Infinity;
+        let longestStartTime: number = -1;
+        for (const target of targets) {
+            const data = this.dict.get(target);
+            let startTimeInSeconds = 0;
+            if (data?.length) {
+                for (const entry of data) {
+                    if (entry.clip === clip) {
+                        break;
+                    }
+                    startTimeInSeconds += entry.getDuration();
+                }
+                longestStartTime = Math.max(longestStartTime, startTimeInSeconds);
+            }
+            else {
+                console.warn("No animation found on root", root, clip, data);
+            }
+        }
+        return longestStartTime;
+    }
+
+    registerAnimation(root: Object3D, clip: THREE.AnimationClip): RegisteredAnimationInfo | null {
+        if (!clip || !root) return null;
+        if (!this.rootTargetMap.has(root)) this.rootTargetMap.set(root, []);
+        // this.rootTargetMap.get(root)?.push(clip);
+
+        for (const track of clip.tracks) {
+            const trackName = track.name.split(".")[2];
+            const animationTarget = root.getObjectByName(trackName); // object name
+            if (!animationTarget) {
+                console.warn("no object found for track", track.name, "using " + root.name + " instead");
+                continue;
+                // // if no object was found it might be that we have a component that references an animation clip but wants to target another object
+                // // in that case UnityGLTF writes the name of the component as track targets because it doesnt know of the intented target
+                // animationTarget = root;
+            }
+            if (!this.dict.has(animationTarget)) {
+                this.dict.set(animationTarget, []);
+            }
+            const arr = this.dict.get(animationTarget);
+            if (!arr) continue;
+
+            let model = arr.find(x => x.clip === clip);
+            if (!model) {
+                model = new TransformData(this, root, animationTarget, clip);
+                arr.push(model);
+            }
+            model.addTrack(track);
+
+            const targets = this.rootTargetMap.get(root);
+            if (!targets?.includes(animationTarget)) targets?.push(animationTarget);
+        }
+
+        // get the entry for this object. 
+        // This doesnt work if we have clips animating multiple objects
+        const info = new RegisteredAnimationInfo(this, root, clip);
+        return info;
+    }
+
+    onAfterHierarchy(_context) {
+        if (debug)
+            console.log(this.dict);
+    }
+
+    private serializers: SerializeAnimation[] = [];
+
+    onAfterBuildDocument(_context: any) {
+        for (const ser of this.serializers) {
+            const parent = ser.model?.parent;
+            const isEmptyParent = parent?.isDynamic === true;
+            if (debug)
+                console.log(isEmptyParent, ser.model?.parent);
+            if (isEmptyParent) {
+                ser.registerCallback(parent);
+            }
+        }
+    }
+
+    onExportObject(object, model: USDZObject, _context) {
+
+        GameObject.foreachComponent(object, (comp) => {
+            const c = comp as unknown as UsdzAnimation;
+            if (typeof c.createAnimation === "function") {
+                c.createAnimation(this, model, _context);
+            }
+        }, false);
+
+        // we need to be able to retarget serialization to empty parents before actually serializing (we do that in another callback)
+        const ser = new SerializeAnimation(object, this.dict);
+        this.serializers.push(ser);
+        ser.registerCallback(model);
+    }
+
+}
+
+
+class SerializeAnimation {
+
+    object: Object3D;
+    dict: AnimationDict;
+    model: USDZObject;
+
+    private callback?: Function;
+
+    constructor(object: Object3D, dict: AnimationDict) {
+        this.object = object;
+        this.dict = dict;
+    }
+
+    registerCallback(model: USDZObject) {
+        if (this.model && this.callback) {
+            this.model.removeEventListener("serialize", this.callback);
+        }
+        if (!this.callback)
+            this.callback = this.onSerialize.bind(this);
+        if (debug)
+            console.log("REPARENT", model);
+        this.model = model;
+        this.model.addEventListener("serialize", this.callback);
+    }
+
+    onSerialize(writer, _context) {
+        if (debug)
+            console.log("SERIALIZE", this.model.name, this.object.type);
+        // do we have a track for this?
+        const object = this.object;
+        const arr = this.dict.get(object);
+        if (!arr) return;
+
+        // console.log("found data for", object, "exporting animation now");
+
+
+
+        // assumption: all tracks have the same time values
+        // TODO collect all time values and then use the interpolator to access
+
+        const composedTransform = new Matrix4();
+        const translation = new Vector3();
+        const rotation = new Quaternion();
+        const scale = new Vector3(1, 1, 1);
+
+        // TODO doesn't support individual time arrays right now
+        // could use these in case we don't have time values that are identical
+        /*
+        const translationInterpolant = o.pos?.createInterpolant() as THREE.Interpolant;
+        const rotationInterpolant = o.rot?.createInterpolant() as THREE.Interpolant;
+        const scaleInterpolant = o.scale?.createInterpolant() as THREE.Interpolant;
+        */
+
+        writer.appendLine("matrix4d xformOp:transform.timeSamples = {");
+        writer.indent++;
+
+        for (const transformData of arr) {
+            let timesArray = transformData.pos?.times;
+            if (!timesArray || transformData.rot && transformData.rot.times?.length > timesArray?.length) timesArray = transformData.rot?.times;
+            if (!timesArray || transformData.scale && transformData.scale.times?.length > timesArray?.length) timesArray = transformData.scale?.times;
+            if (!timesArray) {
+                console.error("got an animated object but no time values??", object, transformData);
+                continue;
+            }
+            const startTime = transformData.getStartTime(arr);
+
+            if (debug)
+                writer.appendLine(transformData.clip.name + ": start=" + startTime.toFixed(3) + ", length=" + transformData.getDuration().toFixed(3) + ", frames=" + transformData.getFrames());
+
+            // ignore until https://github.com/three-types/three-ts-types/pull/293 gets merged
+            //@ts-ignore
+            const positionInterpolant: Interpolant | undefined = transformData.pos?.createInterpolant();
+            //@ts-ignore
+            const rotationInterpolant: Interpolant | undefined = transformData.rot?.createInterpolant();
+            //@ts-ignore
+            const scaleInterpolant: Interpolant | undefined = transformData.scale?.createInterpolant();
+
+            if (!positionInterpolant) translation.set(object.position.x, object.position.y, object.position.z);
+            if (!rotationInterpolant) rotation.set(object.quaternion.x, object.quaternion.y, object.quaternion.z, object.quaternion.w);
+            if (!scaleInterpolant) scale.set(object.scale.x, object.scale.y, object.scale.z);
+
+            for (let index = 0; index < timesArray.length; index++) {
+                const time = timesArray[index];
+
+                if (positionInterpolant) {
+                    const pos = positionInterpolant.evaluate(time);
+                    translation.set(pos[0], pos[1], pos[2]);
+                }
+                if (rotationInterpolant) {
+                    const quat = rotationInterpolant.evaluate(time);
+                    rotation.set(quat[0], quat[1], quat[2], quat[3]);
+                }
+                if (scaleInterpolant) {
+                    const scale = scaleInterpolant.evaluate(time);
+                    scale.set(scale[0], scale[1], scale[2]);
+                }
+
+                composedTransform.compose(translation, rotation, scale);
+
+                let line = `${(startTime + time) * transformData.frameRate}: ${buildMatrix(composedTransform)},`;
+                if (debug) line = "#" + index + "\t" + line;
+                writer.appendLine(line);
+            }
+
+        }
+        writer.indent--;
+        writer.appendLine("}");
+
+        /*
+        let transform3 = new Matrix4();
+        transform3.compose(0.2,0,0);
+        const transform = buildMatrix(model.matrix);
+        const transform2 = buildMatrix(transform3.multiply(model.matrix));
+        
+        writer.appendLine(`matrix4d xformOp:transform.timeSamples = {
+            0: ${transform},
+            30: ${transform2}
+        }`);
+        */
+    }
+}

package/src/engine-components/export/usdz/types.ts

@@ -0,0 +1,39 @@
+import { Object3D, Matrix4, Material, BufferGeometry } from "three";
+
+// keep in sync with USDZExporter.js
+
+/** implementation is in three */
+export declare class USDZDocument {
+    name: string;
+    get isDocumentRoot(): boolean;
+    add(obj: USDZObject);
+    remove(obj: USDZObject);
+    traverse(callback: (obj: USDZObject) => void);
+    findById(uuid: string): USDZObject | undefined;
+    get isDynamic(): boolean;
+}
+
+
+
+/** implementation is in three */
+export declare class USDZObject {
+    static createEmptyParent(parent: USDZObject);
+    uuid: string;
+    name: string;
+    matrix: Matrix4;
+    material: Material;
+    geometry: BufferGeometry;
+    parent: USDZObject | USDZDocument | null;
+    children: USDZObject[];
+    _eventListeners: { [event: string]: Function[] };
+    isDynamic: boolean;
+
+    is(obj: Object3D): boolean;
+    isEmpty(): boolean;
+    clone();
+    getPath();
+    add(child: USDZObject);
+    remove(child: USDZObject);
+    addEventListener(evt: string, listener: Function);
+    removeEventListener(evt: string, listener: Function);
+}

package/src/engine-components/export/usdz/utils/animationutils.ts

@@ -0,0 +1,60 @@
+import { Animator } from "../../../Animator";
+import { Object3D, Color, AnimationClip, KeyframeTrack } from "three";
+import { AnimationExtension } from "../extensions/Animation";
+import { GameObject } from "../../../Component";
+import { getParam } from "../../../../engine/engine_utils";
+
+const debug = getParam("debugusdz");
+
+export function registerAnimatorsImplictly(root: Object3D, ext: AnimationExtension) {
+
+    // collect animators and their clips
+    const animationClips: { root: Object3D, clips: THREE.AnimationClip[] }[] = [];
+    const animators = GameObject.getComponentsInChildren(root, Animator);
+
+    // insert rest pose clip
+    let injectedRestPose = false;
+
+    if (debug)
+        console.log(animators);
+
+    for (const animator of animators) {
+        if (!animator || !animator.runtimeAnimatorController) continue;
+
+        if (debug)
+            console.log(animator);
+
+        const clips: THREE.AnimationClip[] = [];
+
+
+        for (const action of animator.runtimeAnimatorController.enumerateActions()) {
+            if (debug)
+                console.log(action);
+            const clip = action.getClip();
+
+            // we need to inject a rest pose clip so that the animation position is correct
+            // e.g. when the animation starts in the air and animates down we dont want the object to move under the ground
+            if (!injectedRestPose && clip.tracks.length > 0) {
+                injectedRestPose = true;
+                const track = clip.tracks[0];
+                const trackBaseName = track.name.substring(0, track.name.lastIndexOf("."));
+                const currentPositionTrack = new KeyframeTrack(trackBaseName + ".position", [0, .01], [0, 0, 0, 0, 0, 0]);
+                const currentRotationTrack = new KeyframeTrack(trackBaseName + ".quaternion", [0, .01], [0, 0, 0, 1, 0, 0, 0, 1]);
+                clips.push(new AnimationClip("rest", .01, [currentPositionTrack, currentRotationTrack]));
+            }
+
+            if (!clips.includes(clip))
+                clips.push(clip);
+        }
+
+        animationClips.push({ root: animator.gameObject, clips: clips });
+    }
+
+    if (debug)
+        console.log(animationClips);
+
+    for (const pair of animationClips) {
+        for (const clip of pair.clips)
+            ext.registerAnimation(pair.root, clip);
+    }
+}

package/src/engine-components/export/usdz/utils/quicklook.ts

@@ -0,0 +1,43 @@
+import { Context } from "../../../../engine/engine_setup";
+
+
+export function ensureQuicklookLinkIsCreated(context: Context) : HTMLAnchorElement {
+    const existingLink = context.domElement.querySelector("link[rel='ar']");
+    if(existingLink) return existingLink as HTMLAnchorElement;
+
+    /*
+    generating this:
+    <div class="menu">
+      <button id="open-in-ar">Open in QuickLook</button>
+      <a style="display:none;" id="link" rel="ar" href="" download="asset.usdz">
+        <img id="button" width="100" src="files/arkit.png">
+      </a>
+    </div>
+    */
+
+    const div = document.createElement("div");
+    div.classList.add("menu");
+    div.classList.add("quicklook-menu");
+    div.style.display = "none";
+    div.style.visibility = "hidden";
+
+    const button = document.createElement("button");
+    button.id = "open-in-ar";
+    button.innerText = "Open in QuickLook";
+    div.appendChild(button);
+
+    const link = document.createElement("a");
+    link.id = "needle-usdz-link";
+    link.style.display = "none";
+    link.rel = "ar";
+    link.href = "";
+    div.appendChild(link);
+
+    const img = document.createElement("img");
+    img.id = "button";
+    // img.src = "files/arkit.png";
+    link.appendChild(img);
+
+    context.domElement.appendChild(div);
+    return link as HTMLAnchorElement;
+}

package/src/engine-components/export/usdz/utils/timeutils.ts

@@ -0,0 +1,20 @@
+
+
+
+export function getFormattedDate() {
+    var date = new Date();
+
+    const month = date.getMonth() + 1;
+    const day = date.getDate();
+    const hour = date.getHours();
+    const min = date.getMinutes();
+    const sec = date.getSeconds();
+
+    const s_month = (month < 10 ? "0" : "") + month;
+    const s_day = (day < 10 ? "0" : "") + day;
+    const s_hour = (hour < 10 ? "0" : "") + hour;
+    const s_min = (min < 10 ? "0" : "") + min;
+    const s_sec = (sec < 10 ? "0" : "") + sec;
+
+    return date.getFullYear() + s_month + s_day + "-" + s_hour + s_min + s_sec;
+}

package/src/engine-components/ui/Button.ts

@@ -31,21 +31,21 @@ export enum Transition {
     Animation
 }
 
-declare class ButtonColors {
+class ButtonColors {
     @serializable()
-    colorMultiplier: 1;
+    colorMultiplier!: 1;
     @serializable(RGBAColor)
-    disabledColor: RGBAColor;
+    disabledColor!: RGBAColor;
     @serializable()
-    fadeDuration: number;
+    fadeDuration!: number;
     @serializable(RGBAColor)
-    highlightedColor: RGBAColor;
+    highlightedColor!: RGBAColor;
     @serializable(RGBAColor)
-    normalColor: RGBAColor;
+    normalColor!: RGBAColor;
     @serializable(RGBAColor)
-    pressedColor: RGBAColor;
+    pressedColor!: RGBAColor;
     @serializable(RGBAColor)
-    selectedColor: RGBAColor;
+    selectedColor!: RGBAColor;
 }
 
 declare type AnimationTriggers = {

package/src/engine-components/ui/Graphic.ts

@@ -3,7 +3,7 @@ import * as ThreeMeshUI from 'three-mesh-ui'
 import { RGBAColor } from "../js-extensions/RGBAColor"
 import { BaseUIComponent } from "./BaseUIComponent";
 import { serializable } from '../../engine/engine_serialization_decorator';
-import { Color, Texture } from 'three';
+import { Color, LinearEncoding, sRGBEncoding, Texture } from 'three';
 import { RectTransform } from './RectTransform';
 import { onChange, scheduleAction } from "./Utils"
 import { GameObject } from '../Component';
@@ -126,10 +126,24 @@ export class Graphic extends BaseUIComponent implements IGraphic {
     }
     protected onAfterCreated() { }
 
+    /** used internally to ensure textures assigned to UI use linear encoding */
+    static textureCache: Map<Texture, Texture> = new Map();
+
     protected async setTexture(tex: Texture | null | undefined) {
         if (!tex) return;
         this.setOptions({ backgroundOpacity: 0 });
         if (tex) {
+            // workaround for https://github.com/needle-tools/needle-engine-support/issues/109
+            if(tex.encoding === sRGBEncoding) {
+                if(Graphic.textureCache.has(tex)) {
+                    tex = Graphic.textureCache.get(tex)!;
+                } else {
+                    const clone = tex.clone();
+                    clone.encoding = LinearEncoding;
+                    Graphic.textureCache.set(tex, clone);
+                    tex = clone;
+                }
+            }
             this.setOptions({ backgroundTexture: tex, borderRadius: 0, backgroundOpacity: this.color.alpha, backgroundSize: "stretch" });
         }
     }

package/src/engine-components/ui/InputField.ts

@@ -1,10 +1,13 @@
 import { Behaviour, GameObject } from "../Component";
-import { IPointerClickHandler, IPointerEventHandler } from "./PointerEvents";
+import { IPointerClickHandler, IPointerEventHandler, PointerEventData } from "./PointerEvents";
 import { FrameEvent } from "../../engine/engine_setup";
 import { serializable } from "../../engine/engine_serialization_decorator";
 import { Text } from "./Text";
-import { getParam } from "../../engine/engine_utils";
+import { getParam, isiOS } from "../../engine/engine_utils";
 import { EventList } from "../EventList";
+import { showBalloonMessage } from "../../engine/debug/debug";
+import { Physics } from "../../engine/engine_physics";
+import { tryGetUIComponent } from "./Utils";
 
 const debug = getParam("debuginputfield");
 
@@ -36,6 +39,7 @@ export class InputField extends Behaviour implements IPointerEventHandler {
     private static htmlField: HTMLInputElement | null = null;
 
     private inputEventFn: any;
+    private _iosEventFn: any;
 
     start() {
         if (debug)
@@ -45,6 +49,7 @@ export class InputField extends Behaviour implements IPointerEventHandler {
     onEnable() {
         if (!InputField.htmlField) {
             InputField.htmlField = document.createElement("input");
+            InputField.htmlField.style.caretColor = "transparent";
             InputField.htmlField.classList.add("ar");
             document.body.appendChild(InputField.htmlField);
         }
@@ -57,6 +62,10 @@ export class InputField extends Behaviour implements IPointerEventHandler {
         if (this.placeholder && this.textComponent?.text.length) {
             GameObject.setActive(this.placeholder.gameObject, false);
         }
+        if (isiOS()) {
+            this._iosEventFn = this.processInputOniOS.bind(this);
+            window.addEventListener("touchend", this._iosEventFn);
+        }
     }
 
     onDisable() {
@@ -64,6 +73,9 @@ export class InputField extends Behaviour implements IPointerEventHandler {
         InputField.htmlField?.removeEventListener("keyup", this.inputEventFn);
         // InputField.htmlField?.removeEventListener("change", this.inputEventFn);
         this.onDeselected();
+        if (this._iosEventFn) {
+            window.removeEventListener("touchend", this._iosEventFn);
+        }
     }
 
     onPointerClick(_args) {
@@ -187,6 +199,17 @@ export class InputField extends Behaviour implements IPointerEventHandler {
         }
     }
 
+    private processInputOniOS() {
+        // focus() on safari ios doesnt open the keyboard when not processed from dom event
+        // so we try in a touch end event if this is hit
+        const hits = this.context.physics.raycast();
+        if (!hits.length) return;
+        const hit = hits[0];
+        const obj = hit.object;
+        const component = tryGetUIComponent(obj);
+        if (component?.gameObject === this.gameObject || component?.gameObject.parent === this.gameObject)
+            this.selectInputField();
+    }
 
 
     // private static _lastDeletionTime: number = 0;

package/src/engine-components/ui/Utils.ts

@@ -1,18 +1,19 @@
 
 import { FrontSide, DoubleSide, BackSide, TetrahedronGeometry } from "three"
 import { FrameEvent } from "../../engine/engine_setup";
-import { Behaviour, GameObject } from "../Component";
-import { $shadowDomOwner } from "./BaseUIComponent";
+import { Behaviour } from "../Component";
+import { $shadowDomOwner, BaseUIComponent } from "./BaseUIComponent";
 
-// export function makeNonRaycastable(obj: THREE.Object3D | null | undefined, recursive: boolean = false) {
-//     if (!obj) return;
-//     obj.layers.mask = 2;
-//     if (recursive && obj.children) {
-//         for (const ch of obj.children) {
-//             if (recursive) makeNonRaycastable(ch, true);
-//         }
-//     }
-// }
+export function tryGetUIComponent(obj: THREE.Object3D): BaseUIComponent | null {
+    const owner = obj[$shadowDomOwner];
+    if (owner) {
+        return owner;
+    }
+    if(obj.parent) {
+        return tryGetUIComponent(obj.parent);
+    }
+    return null;
+}
 
 export function isUIObject(obj: THREE.Object3D) {
     return obj["isUI"] === true || typeof obj[$shadowDomOwner] === "object";
@@ -54,6 +55,7 @@ export declare type RevocableProxy = {
 
 // TODO: change to use utils Watch since a revocable proxy makes a object completely useless once it is revoked
 /** internal method to proxy a field to detect changes */
+/**@deprecated use watcher instead */
 export function onChange<T extends object>(caller: T, field: string, callback: (newValue: any, oldValue: any) => void): RevocableProxy {
 
     if (caller[field] === undefined) {
@@ -84,12 +86,13 @@ export function onChange<T extends object>(caller: T, field: string, callback: (
 
 
 declare type ScheduleCache = { [key: number]: { [key: string]: Generator | null } };
+const $scheduledActionKey = Symbol("Scheduled action");
 
 // use to schedule a callback at a specific moment in the frame
-/** internal method to schedula a function at a specific moment in the update loop */
+/** internal method to schedule a function at a specific moment in the update loop */
 export function scheduleAction(caller: Behaviour, action: Function, timing: FrameEvent = FrameEvent.OnBeforeRender) {
-    let cache: ScheduleCache = caller["__scheduledActions"];
-    if (!cache) cache = caller["__scheduledActions"] = {};
+    let cache: ScheduleCache = caller[$scheduledActionKey];
+    if (!cache) cache = caller[$scheduledActionKey] = {};
 
     const key = action.name;
     if (!cache[timing]) cache[timing] = {};