@needle-tools/engine 2.67.15-pre → 2.67.16

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@needle-tools/engine",
-    "version": "2.67.15-pre",
+    "version": "2.67.16",
     "description": "Needle Engine is a web-based runtime for 3D apps. It runs on your machine for development, and can be deployed anywhere. It is flexible, extensible, and collaboration and XR come naturally.",
     "main": "dist/needle-engine.umd.cjs",
     "module": "lib/needle-engine.js",

package/plugins/generate-font.js

@@ -60,7 +60,7 @@ generateBMFont(fontPath, opts,
         });
 
         const fileName = path.parse(font.filename).name;
-        const name = outputDir + "/" + fileName.toLocaleLowerCase() + "-msdf.json";
+        const name = outputDir + "/" + fileName + "-msdf.json";
         fs.writeFile(name, font.data, (err) => {
             if (err) throw err;
         });

package/src/engine/codegen/register_types.js

@@ -1,5 +1,5 @@
 import { TypeStore } from "./../engine_typestore"
-
+
 // Import types
 import { __Ignore } from "../../engine-components/codegen/components";
 import { AlignmentConstraint } from "../../engine-components/AlignmentConstraint";
@@ -179,7 +179,7 @@ import { XRGrabModel } from "../../engine-components/WebXRGrabRendering";
 import { XRGrabRendering } from "../../engine-components/WebXRGrabRendering";
 import { XRRig } from "../../engine-components/WebXRRig";
 import { XRState } from "../../engine-components/XRFlag";
-
+
 // Register types
 TypeStore.add("__Ignore", __Ignore);
 TypeStore.add("AlignmentConstraint", AlignmentConstraint);

package/src/engine-components/postprocessing/Effects/DepthOfField.ts

@@ -1,11 +1,10 @@
 import { DepthOfFieldEffect } from "postprocessing";
-import { PerspectiveCamera, Vector3 } from "three";
-import { getWorldPosition } from "../../../engine/engine_three_utils";
 import { serializable } from "../../../engine/engine_serialization";
 import { Mathf } from "../../../engine/engine_math";
 import { PostProcessingEffect } from "../PostProcessingEffect";
 import { VolumeParameter } from "../VolumeParameter";
 import { registerCustomEffectType } from "../VolumeProfile";
+import { isMobileDevice } from "../../../engine/engine_utils";
 
 export enum DepthOfFieldMode {
     Off = 0,
@@ -20,7 +19,7 @@ export class DepthOfField extends PostProcessingEffect {
     }
 
     @serializable()
-    mode! : DepthOfFieldMode;
+    mode!: DepthOfFieldMode;
 
     @serializable(VolumeParameter)
     focusDistance!: VolumeParameter;
@@ -34,13 +33,16 @@ export class DepthOfField extends PostProcessingEffect {
     @serializable(VolumeParameter)
     gaussianMaxRadius!: VolumeParameter;
 
+    @serializable(VolumeParameter)
+    resolutionScale?: VolumeParameter;
+
     init() {
         this.focalLength.valueProcessor = v => {
             const t = v / 300;
             const max = 2;// this.context.mainCameraComponent?.farClipPlane ?? 10;
             return Mathf.lerp(max, .01, t);
         };
-        
+
         const maxBokehScale = 20;
         this.aperture.valueProcessor = v => {
             const t = 1 - v / 32;
@@ -49,7 +51,16 @@ export class DepthOfField extends PostProcessingEffect {
     }
 
     onCreateEffect() {
-        if(this.mode === DepthOfFieldMode.Off) return undefined;
+        if (this.mode === DepthOfFieldMode.Off) return undefined;
+
+        const factor = 1 / window.devicePixelRatio;
+
+        if (this.resolutionScale === undefined) {
+            let defaultValue = 1;
+            if(isMobileDevice()) defaultValue = .6;
+            this.resolutionScale = new VolumeParameter(defaultValue * factor);
+        }
+
         // console.log(this.focusDistance.overrideState, this.focusDistance.value);
         // const depth = new DepthEffect({
         //     inverted: true,
@@ -59,7 +70,7 @@ export class DepthOfField extends PostProcessingEffect {
             worldFocusRange: .2,
             focalLength: 1,
             bokehScale: 20,
-            resolutionScale: 1,
+            resolutionScale: this.resolutionScale.value,
         });
 
         this.focusDistance.onValueChanged = v => {
@@ -68,6 +79,7 @@ export class DepthOfField extends PostProcessingEffect {
         this.focalLength.onValueChanged = v => dof.circleOfConfusionMaterial.worldFocusRange = v;
         this.aperture.onValueChanged = v => dof.bokehScale = v;
 
+        if (this.resolutionScale) this.resolutionScale.onValueChanged = v => dof.resolution.scale = v;
 
         return [dof];
     }

package/src/engine-components/postprocessing/VolumeParameter.ts

@@ -5,6 +5,11 @@ export declare type VolumeParameterValueProcessor = (value: any) => any;
 
 export class VolumeParameter {
 
+    constructor(value?: any) {
+        this._value = value;
+        this._defaultValue = value;
+    }
+
     @serializable()
     get overrideState(): boolean {
         return this._active;

package/src/engine-components/timeline/PlayableDirector.ts

@@ -6,7 +6,7 @@ import { AudioSource } from '../AudioSource';
 import { SignalReceiver } from './SignalAsset';
 import * as Models from "./TimelineModels";
 import * as Tracks from "./TimelineTracks";
-import { deepClone, getParam } from '../../engine/engine_utils';
+import { deepClone, delay, getParam } from '../../engine/engine_utils';
 import { GuidsMap } from '../../engine/engine_types';
 import { Object3D } from 'three';
 import { isLocalNetwork } from '../../engine/engine_networking_utils';
@@ -87,6 +87,8 @@ export class PlayableDirector extends Behaviour {
     get speed(): number { return this._speed; }
     set speed(value: number) { this._speed = value; }
 
+    /** When enabled the timeline will wait for audio tracks to load at the current time before starting to play */
+    waitForAudio: boolean = true;
 
     private _visibilityChangeEvt?: any;
     private _clonedPlayableAsset: boolean = false;
@@ -151,13 +153,28 @@ export class PlayableDirector extends Behaviour {
         this.setupAndCreateTrackHandlers();
     }
 
-    play() {
+    async play() {
         if (!this.isValid()) return;
         const pauseChanged = this._isPaused == true;
         this._isPaused = false;
         if (pauseChanged) this.invokePauseChangedMethodsOnTracks();
         if (this._isPlaying) return;
         this._isPlaying = true;
+        if (this.waitForAudio) {
+            // Make sure audio tracks have loaded at the current time
+            const promises: Array<Promise<any>> = [];
+            for (const track of this._audioTracks) {
+                const promise = track.loadAudio(this._time, 1, 0);
+                if (promise)
+                    promises.push(promise);
+            }
+            if (promises.length > 0) {
+                await Promise.all(promises);
+                if (!this._isPlaying) return;
+            }
+            while(this._audioTracks.length > 0 && this._isPlaying && !AudioSource.userInteractionRegistered && this.waitForAudio) 
+                await delay(200);
+        }
         this._internalUpdateRoutine = this.startCoroutine(this.internalUpdate());
     }
 

package/src/engine-components/timeline/TimelineTracks.ts

@@ -657,6 +657,9 @@ export class AudioTrackHandler extends TrackHandler {
     }
 
     private static _currentlyLoading: Map<string, Promise<AudioBuffer | null>> = new Map();
+    public static dispose() {
+        AudioTrackHandler._currentlyLoading.clear();
+    }
     
     private handleAudioLoading(model: Models.ClipModel, audio: THREE.Audio): Promise<AudioBuffer | null> | null {
         if (!this._audioLoader) {
@@ -665,8 +668,12 @@ export class AudioTrackHandler extends TrackHandler {
         // TODO: maybe we should cache the loaders / buffers here by path
         const path = this.getAudioFilePath(model.asset.clip);
 
-        if(AudioTrackHandler._currentlyLoading.get(path)) {
-            return AudioTrackHandler._currentlyLoading.get(path)!;
+        if (AudioTrackHandler._currentlyLoading.get(path)) {
+            const promise = AudioTrackHandler._currentlyLoading.get(path)!
+            promise.then((buffer) => {
+                if (buffer) audio.setBuffer(buffer);
+            });
+            return promise;
         }
         
         if (debug) console.warn("LOAD audio track", path, this.director.sourceId);

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

@@ -176,7 +176,6 @@ export class Text extends Graphic {
             fontSize: fontSize,
             fontKerning: "normal",
         };
-        this.font = this.font?.toLocaleLowerCase();
         this.setFont(textOpts, this.fontStyle);
         return textOpts;
     }