@needle-tools/engine 2.67.0-pre → 2.67.2-pre

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

@@ -16,18 +16,31 @@ export class PostProcessingHandler {
     private _lastVolumeComponents?: PostProcessingEffect[];
     private _effects: Array<Effect | Pass> = [];
 
+    get isActive() {
+        return this._isActive;
+    }
+
+    private _isActive: boolean = false;
+    private readonly context: Context;
 
-    apply(context: Context, components: PostProcessingEffect[]) {
-        this.onApply(context, components);
+    constructor(context: Context) {
+        this.context = context;
     }
 
-    unapply(context: Context) {
+    apply(components: PostProcessingEffect[]) {
+        this._isActive = true;
+        this.onApply(this.context, components);
+    }
+
+    unapply() {
+        this._isActive = false;
         if (this._lastVolumeComponents) {
             for (const component of this._lastVolumeComponents) {
                 component.unapply();
             }
             this._lastVolumeComponents.length = 0;
         }
+        const context = this.context;
         const active = context[activeKey] as PostProcessingHandler | null;
         if (active === this) {
             delete context[activeKey];
@@ -36,8 +49,8 @@ export class PostProcessingHandler {
             context.composer = null;
     }
 
-    dispose(context: Context) {
-        this.unapply(context);
+    dispose() {
+        this.unapply();
 
         for (const effect of this._effects) {
             effect.dispose();
@@ -71,7 +84,7 @@ export class PostProcessingHandler {
                     }
                     // apply or collect effects
                     const res = component.apply();
-                    if (res === undefined || res === null) continue;
+                    if (!res) continue;
                     if (Array.isArray(res)) {
                         this._effects.push(...res);
                     }
@@ -116,7 +129,7 @@ export class PostProcessingHandler {
             prev.dispose();
         composer.removeAllPasses();
         composer.addPass(new RenderPass(context.scene, cam));
-        
+
 
         if (debug)
             console.log("Set effects or passes", camera, effectsOrPasses, composer);

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

@@ -8,7 +8,6 @@ import { PostProcessingEffect } from "./PostProcessingEffect";
 import { VolumeParameter } from "./VolumeParameter";
 import { getEditorModificationCache } from "../../engine/engine_editor-sync";
 import { isDevEnvironment } from "../../engine/debug";
-// import { CustomPostProcessingEffect } from "./CustomPostProcessingEffect";
 
 const debug = getParam("debugpost");
 
@@ -17,7 +16,7 @@ export class Volume extends Behaviour implements IEditorModificationReceiver {
     @serializeable(VolumeProfile)
     sharedProfile?: VolumeProfile;
 
-    private _postprocessing: PostProcessingHandler = new PostProcessingHandler();
+    private _postprocessing?: PostProcessingHandler;
     private _effects: PostProcessingEffect[] = [];
 
     awake() {
@@ -36,22 +35,17 @@ export class Volume extends Behaviour implements IEditorModificationReceiver {
         }
     }
 
-    start() {
-        this.apply();
-        this.tryApplyCache();
-    }
-
-    onEnable() {
-        // We need to wait for the camera to be ready
-        if (this.__internalDidAwakeAndStart)
-            this.apply();
-    }
-
     onDisable() {
-        this._postprocessing?.unapply(this.context);
+        this._postprocessing?.unapply();
     }
 
     onBeforeRender(): void {
+        // Wait for the first frame to be rendered before creating because then we know we have a camera (issue 135)
+        if (this.context.mainCamera) {
+            if (!this._postprocessing || !this._postprocessing.isActive)
+                this.apply();
+        }
+
         if (!this.context.isInXR && this.context.composer && this.context.mainCamera) {
             this.context.composer.setRenderer(this.context.renderer);
             this.context.composer.setMainScene(this.context.scene);
@@ -60,14 +54,14 @@ export class Volume extends Behaviour implements IEditorModificationReceiver {
     }
 
     onDestroy(): void {
-        this._postprocessing?.dispose(this.context);
+        this._postprocessing?.dispose();
     }
 
     private _lastApplyTime?: number;
     private _rapidApplyCount = 0;
 
     private apply() {
-        if (debug) console.log("Apply PostProcessing", this);
+        if (debug) console.log("Apply PostProcessing", this, this.context.mainCamera?.name);
 
         if (isDevEnvironment()) {
             if (this._lastApplyTime !== undefined && Date.now() - this._lastApplyTime < 100) {
@@ -95,13 +89,16 @@ export class Volume extends Behaviour implements IEditorModificationReceiver {
                 if (comp.active) this._effects.push(comp);
             }
         }
+
         if (this._effects.length > 0) {
-            this._postprocessing.apply(this.context, this._effects);
+            if (!this._postprocessing)
+                this._postprocessing = new PostProcessingHandler(this.context);
+            this._postprocessing.apply(this._effects);
         }
     }
 
     private unapply() {
-        this._postprocessing.unapply(this.context);
+        this._postprocessing?.unapply();
     }
 
 

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

@@ -127,13 +127,18 @@ export class RectTransform extends BaseUIComponent {
         if (this.pivot && this.sizeDelta) {
             let tx = (this.pivot.x * 2 - 1);
             let ty = (this.pivot.y * 2 - 1);
-            // tx -= this.m_AnchoredPosition.x * .05;
-            ty -= this.anchoredPosition.y * .05;
-            const offx = this.sizeDelta.x * tx;
-            const offy = this.sizeDelta.y * ty;
+            tx -= this.anchoredPosition.x;// * .05;
+            ty -= this.anchoredPosition.y;// * .05;
+            const offx = tx;
+            const offy = ty;
             // console.log(this.name, this.pivot, tx, ty, "offset", offx, offy);
-            pos.x -= offx * .5;
-            pos.y -= offy * .5;
+            pos.x -= offx;
+            pos.y -= offy;
+            
+            // TODO update size from anchoring, width, height, sizeDelta
+            if (this.shadowComponent)
+            // console.log(this.shadowComponent)
+                 this.set({ width: this.sizeDelta.x, height: this.sizeDelta.y });
         }
     }