@p100-web/core-three 100.0.63 → 100.0.65

package/dist/PCanvas.js

@@ -0,0 +1,992 @@
+import { Clock, Color, PerspectiveCamera, Raycaster, Scene, Vector2, WebGLRenderer, Group, MathUtils, SRGBColorSpace, } from "three";
+import { Group as TweenGroup } from "@tweenjs/tween.js";
+import ThreeJsPostProcessor from "./postprocessing/ThreeJsPostProcessor";
+import { PEvent, PostProcessingSystems, Workers, AdaptivePerformance, } from "@p100-web/core";
+const _pointer = new Vector2(-1000, -1000);
+const _size = new Vector2(0, 0);
+let _offset = 0;
+const _cameraColor = new Color(0x000000);
+const SLEEP_INTERVAL = 600;
+export default class PCanvas {
+    constructor(context) {
+        this._disposed = true;
+        this._canvas = null;
+        this._renderer = null;
+        this._controls = null;
+        // PP
+        this._composer = null;
+        this._updates = [];
+        this._clock = new Clock();
+        this._tweens = new TweenGroup();
+        this._startHoverId = null;
+        this._backgroundColor = new Color(0x000000);
+        this._cameraUpdate = null;
+        this._hoverCanvas = false;
+        this._hoverWindow = false;
+        this._isAdmin = false;
+        //
+        //  BACKGROUND / ENVIRONMENT
+        //
+        this._environment = null;
+        //
+        //  EXTERNAL EVENTS
+        //
+        this.onExternalEvent = (e) => {
+            const event = this.context.getExternalEvent(e.detail.name);
+            if (event) {
+                if (PEvent.Debug) {
+                    console.log("<[EXTERNAL IN-EVENT]> [" +
+                        event.name +
+                        "] [" +
+                        e.detail.payload +
+                        "]");
+                }
+                event.emit(e.detail.payload);
+            }
+            else {
+                this.context.error("Event not found");
+            }
+        };
+        this.onMouseEnter = (_event) => {
+            this._hoverCanvas = true;
+            this.updateHoverState();
+        };
+        this.onMouseExit = (_event) => {
+            this._hoverCanvas = false;
+            this.updateHoverState();
+        };
+        //
+        //  STATS
+        //
+        this._stats = null;
+        //
+        //  MOUSE
+        //
+        /**
+         * Event callback when mouse moves.
+         */
+        this.onMouseMove = (event) => {
+            _pointer.x = ((event.clientX - _offset) / _size.x) * 2 - 1;
+            _pointer.y = -(event.clientY / _size.y) * 2 + 1;
+            if (!this._hoverWindow)
+                this.onWindowEnter();
+            if (!this._hoverCanvas)
+                this.onMouseEnter(event);
+        };
+        this._wasDown = false;
+        /**
+         * User pressed down on canvas
+         */
+        this.onCanvasClickDown = (e) => {
+            e.preventDefault();
+            this._wasDown = true;
+            if (e.button === 0 && this._isRaycasting) {
+                if (this.hovered) {
+                    this._startHoverId = this.hovered.id;
+                }
+            }
+        };
+        /**
+         * User pressed up on canvas
+         */
+        this.onCanvasClickUp = (e) => {
+            if (!this._wasDown) {
+                return;
+            }
+            this._wasDown = false;
+            e.preventDefault();
+            if (e.button === 0 && this._isRaycasting) {
+                const hovered = this.hovered && this.hovered.id === this._startHoverId
+                    ? this.hovered
+                    : null;
+                if (!this._editor && hovered)
+                    hovered.collider?.native_onClick();
+                this.context.onClick(hovered, e.ctrlKey || e.metaKey, e.shiftKey);
+            }
+            this._startHoverId = null;
+        };
+        //
+        //  RENDER LOOP
+        //
+        this._hasUpdators = false;
+        // Keep track of ongoing animations
+        this._hasTweens = false;
+        //
+        //  Sleeping
+        //
+        this._isSleeping = false;
+        this._isSleepEnabled = false;
+        this._isHoveringAdmin = false;
+        this.onWindowHide = () => {
+            this._performanceCounter?.pause();
+        };
+        this.onWindowEnter = () => {
+            this._hoverWindow = true;
+            this.updateHoverState();
+        };
+        this.onWindowExit = () => {
+            this._hoverWindow = false;
+            this.updateHoverState();
+        };
+        //
+        //  SETTINGS
+        //
+        this._debug = false;
+        //
+        //  QUALITY
+        //
+        this._renderScale = 1;
+        //  private _isInteracting = false;
+        //  private _interactiveReduction = false;
+        this._maxScale = 1;
+        this._minScale = 1;
+        this._adaptiveQuality = false;
+        this._estimating = false;
+        this._baseQuality = 100;
+        this._currentQuality = -100;
+        this._estimatedQuality = 0;
+        this._performanceCounter = null;
+        //_skipFrameActive - true if we are currently dropping frames
+        this._skipFrameActive = false;
+        this.onPerformanceEstimated = (quality, fps, estimating) => {
+            // console.log(
+            //   "onPerformanceEstimated() document.hidden:",
+            //   document.hidden,
+            //   quality,
+            //   Math.round(fps),
+            //   estimating
+            // );
+            this._estimatedQuality = quality;
+            // Should we change quality level?
+            if (this._adaptiveQuality) {
+                // Did we stop estimating?
+                if (estimating === false && this._estimating) {
+                    this.context.clearWorkFlag(Workers.AdaptivePerformance);
+                    if (this._debug)
+                        console.log("[PCanvas] onPerformanceEstimated() STOPPED", Math.round(fps), quality);
+                }
+                else if (estimating && !this._estimating) {
+                    this.context.setWorkFlag(Workers.AdaptivePerformance);
+                    if (this._debug)
+                        console.log("[PCanvas] onPerformanceEstimated() STARTED", Math.round(fps), quality);
+                }
+                if (!this._skipFrameActive && quality <= 75 && fps < 50) {
+                    this.setSkipFrameActive(true);
+                    this.setQuality(100);
+                }
+                else if (this._currentQuality !== quality) {
+                    this.setQuality(quality);
+                }
+                this._estimating = estimating;
+            }
+            this.snooze();
+        };
+        //
+        //  WORKER/INTERACTION
+        //
+        this._isWorking = false;
+        this._isSceneRunning = false;
+        //
+        //  UPDATE
+        //
+        this._renderCounter = 0;
+        this._renderInterval = 2;
+        this.update = () => {
+            if (this._disposed) {
+                console.log("<<<<<<<<< DISPOSED >>>>>>>>>>>");
+                return;
+            }
+            if (this._hasTweens) {
+                this._tweens.update();
+                if (this._tweens.allStopped()) {
+                    this._tweens.removeAll();
+                    this._hasTweens = false;
+                    this.context.clearWorkFlag(Workers.Animating);
+                }
+            }
+            if (this._cameraUpdate)
+                this._cameraUpdate();
+            const delta = this._clock.getDelta();
+            if (this._hasUpdators) {
+                for (const update of this._updates) {
+                    update(delta);
+                }
+            }
+            if (this._isRaycasting) {
+                this.raycast();
+            }
+            this._stats?.update(delta);
+            if (this._renderCounter >= this._renderInterval) {
+                if (this._composer)
+                    this._composer.render();
+                else
+                    this._renderer.render(this._sceneNode, this._cameraNode);
+                this._renderCounter = 0;
+            }
+            if (!this._isSleeping) {
+                this._performanceCounter?.update(delta);
+            }
+            this._renderCounter++;
+        };
+        //
+        //  RAYCASTER
+        //
+        this._isRaycasting = false;
+        this._editor = false;
+        this.hovered = null;
+        this.colliders = [];
+        this.context = context;
+        this._isAdmin = context.isAdmin();
+        // Create a Scene
+        const scene = new Scene();
+        this._sceneNode = scene;
+        this._sceneNode.background = _cameraColor;
+        // Create a Camera
+        const cameraNode = new PerspectiveCamera(70, 1280 / 720, 0.1, 6);
+        this._cameraNode = cameraNode;
+        this._cameraNode.layers.mask = 1;
+        this._raycaster = new Raycaster();
+        this._raycaster.layers.mask = 2;
+        // Add root node
+        const rootNode = new Group();
+        this._rootNode = rootNode;
+        // Add nodes to scene
+        rootNode.add(cameraNode);
+        scene.add(rootNode);
+    }
+    render(canvas, width, height, settings) {
+        if (this._disposed === false)
+            throw new Error("PCanvas was already rendered");
+        if (canvas.dataset.rendered)
+            throw new Error("The canvas was disposed, create a new");
+        this._disposed = false;
+        this._cameraNode.near = settings.renderer.near;
+        this._cameraNode.far = settings.renderer.far;
+        const rendererArgs = settings.postProcessing?.enabled === PostProcessingSystems.THREEJS
+            ? {
+                powerPreference: "high-performance",
+                antialias: false,
+                stencil: settings.renderer.stencil,
+                depth: false,
+            }
+            : {
+                powerPreference: "high-performance",
+                antialias: settings.renderer.antialias,
+                stencil: settings.renderer.stencil,
+                depth: settings.renderer.depth,
+            };
+        const renderer = new WebGLRenderer({
+            ...rendererArgs,
+            canvas: canvas,
+        });
+        renderer.outputColorSpace = SRGBColorSpace;
+        _size.x = width;
+        _size.y = height;
+        this._renderer = renderer;
+        this._canvas = canvas;
+        // if (settings.postProcessing?.enabled === PostProcessingSystems.PMNDRS) {
+        //   renderer.toneMapping = NoToneMapping;
+        // } else {
+        renderer.toneMapping = settings.renderer.toneMapping;
+        renderer.toneMappingExposure = settings.renderer.toneMappingExposure;
+        //    }
+        this.setupShadows(settings.renderer.useShadows);
+        renderer.setSize(_size.x, _size.y, true);
+        renderer.setClearColor(_cameraColor);
+        renderer.clear();
+        if (settings.postProcessing?.enabled === PostProcessingSystems.THREEJS) {
+            this.setupPostProcessing(settings.postProcessing);
+        }
+        if (!this._cameraNode)
+            throw new Error("Missing camera");
+        this._cameraNode.aspect = width / height;
+        this._cameraNode.updateProjectionMatrix();
+        document.addEventListener("mouseenter", this.onWindowEnter);
+        document.addEventListener("mouseleave", this.onWindowExit);
+        document.addEventListener("visibilitychange", this.onWindowHide);
+        canvas.addEventListener("pointermove", this.onMouseMove);
+        canvas.addEventListener("mouseenter", this.onMouseEnter);
+        canvas.addEventListener("mouseleave", this.onMouseExit);
+        canvas.addEventListener("pointerdown", this.onCanvasClickDown);
+        canvas.addEventListener("pointerup", this.onCanvasClickUp);
+        canvas.addEventListener("p100-in-event", this.onExternalEvent);
+        this.startRenderLoop();
+    }
+    /**
+     * Should be called after render() and restore()
+     */
+    init(settings) {
+        // Set FOV
+        this.setFOV(settings.renderer.fov);
+        this._cameraNode.fov = settings.renderer.fov;
+        this._cameraNode.updateProjectionMatrix();
+        // Set background color
+        this.setBackgroundColor(settings.renderer.background);
+        // Work quality
+        if (settings.quality) {
+            this.initQualitySettings(settings.quality);
+        }
+    }
+    restore(canvas, settings) {
+        this.render(canvas, _size.width, _size.height, settings);
+    }
+    disable() { }
+    dispose() {
+        // console.log("[PCanvas] DISPOSE()");
+        if (this._disposed === true)
+            throw new Error("PCanvas was already disposed");
+        this.stopRenderLoop();
+        this._disposed = true;
+        if (this._adaptiveQuality) {
+            this._performanceCounter?.dispose();
+            this.context.clearWorkFlag(Workers.AdaptivePerformance);
+        }
+        if (this._controls) {
+            this._controls.dispose();
+            this._controls = null;
+        }
+        const renderer = this._renderer;
+        const canvas = this._canvas;
+        if (!canvas)
+            throw new Error("Missing canvas");
+        document.removeEventListener("mouseenter", this.onWindowEnter);
+        document.removeEventListener("mouseleave", this.onWindowExit);
+        document.removeEventListener("visibilitychange", this.onWindowHide);
+        canvas.removeEventListener("pointermove", this.onMouseMove);
+        canvas.removeEventListener("mouseenter", this.onMouseEnter);
+        canvas.removeEventListener("mouseleave", this.onMouseExit);
+        canvas.removeEventListener("pointerdown", this.onCanvasClickDown);
+        canvas.removeEventListener("pointerup", this.onCanvasClickUp);
+        canvas.removeEventListener("p100-in-event", this.onExternalEvent);
+        canvas.dataset.rendered = "true";
+        if (this._composer !== null) {
+            this._composer.dispose();
+        }
+        renderer.dispose();
+        renderer.forceContextLoss();
+        this._renderer = null;
+        this._composer?.dispose();
+        this._composer = null;
+    }
+    enable() {
+        if (this._renderer) {
+            //      this._renderer.shadowMap.needsUpdate = true;
+        }
+    }
+    getComposer() {
+        return this._composer;
+    }
+    getEnvironment() {
+        return this._environment;
+    }
+    setEnvironment(environment) {
+        if (this._environment !== null) {
+            this.context.error("Already had an environment");
+            return;
+        }
+        this._environment = environment;
+        this.updateEnvironment();
+    }
+    updateEnvironment() {
+        if (this._environment === null) {
+        }
+        else {
+            const scene = this._sceneNode;
+            if (this._environment.environment) {
+                scene.environment = this._environment.getTexture();
+                scene.environmentRotation.y = MathUtils.degToRad(180 + this._environment.rotation);
+                scene.environmentIntensity = this._environment.intensity;
+            }
+            else if (scene.environment === this._environment.getTexture()) {
+                scene.environment = null;
+            }
+            if (this._environment.background) {
+                scene.background = this._environment.getTexture();
+                scene.backgroundRotation.y = MathUtils.degToRad(180 + this._environment.rotation);
+                scene.backgroundIntensity = this._environment.intensity;
+            }
+            else if (scene.background === this._environment.getTexture()) {
+                scene.background = null;
+                scene.background = this._backgroundColor;
+            }
+        }
+    }
+    setBackgroundColor(bg) {
+        this._backgroundColor = new Color(bg);
+        const current = this._sceneNode.background;
+        if (current && current.isColor) {
+            this._sceneNode.background = this._backgroundColor;
+        }
+    }
+    clearEnvironment(environment) {
+        const scene = this._sceneNode;
+        if (this._environment !== environment) {
+            this.context.error("Clear environment called with invalid PEnvironment");
+            return;
+        }
+        if (this._environment === null) {
+            this.context.error("No environtment");
+            return;
+        }
+        if (this._environment.environment) {
+            scene.environment = null;
+        }
+        if (this._environment.background) {
+            scene.background = null;
+            scene.background = this._backgroundColor;
+        }
+        this._environment = null;
+    }
+    //
+    //  RENDERER
+    //
+    setToneMapping(value) {
+        this._renderer.toneMapping = value;
+    }
+    setToneMappingExposure(value) {
+        this._renderer.toneMappingExposure = value;
+    }
+    setFOV(fov) {
+        this._cameraNode.fov = fov;
+        this._cameraNode.updateProjectionMatrix();
+    }
+    setNearFar(near = -1, far = -1) {
+        if (near > 0)
+            this._cameraNode.near = near;
+        if (far > 0)
+            this._cameraNode.far = far;
+        this._cameraNode.updateProjectionMatrix();
+    }
+    //
+    //  SHADOWS
+    //
+    setupShadows(value) {
+        const renderer = this._renderer;
+        if (value > 0) {
+            // Enable
+            renderer.shadowMap.autoUpdate = false;
+            console.log("TODO: manual shadows");
+            renderer.shadowMap.enabled = true;
+            renderer.shadowMap.type = (value - 1);
+            renderer.shadowMap.needsUpdate = true;
+        }
+        else {
+            // Disable
+            renderer.shadowMap.enabled = false;
+            renderer.shadowMap.needsUpdate = true;
+            renderer.shadowMap.autoUpdate = false;
+        }
+        renderer.clear();
+    }
+    //
+    //  CONTROLS
+    //
+    getCameraNode() {
+        return this._cameraNode;
+    }
+    setCameraControls(controls) {
+        if (this._controls) {
+            this._controls.dispose();
+        }
+        this._controls = controls;
+    }
+    getCameraControls() {
+        return this._controls;
+    }
+    //
+    //  POST PROCESSING
+    //
+    setupPostProcessing(settings) {
+        // if (settings.enabled === PostProcessingSystems.PMNDRS) {
+        //   // this._composer = new PmndrsPostProcessor(
+        //   //   settings,
+        //   //   this._sceneNode,
+        //   //   this._renderer!,
+        //   //   this._cameraNode,
+        //   //   _size
+        //   // );
+        // } else if (settings.enabled === PostProcessingSystems.THREEJS) {
+        this._composer = new ThreeJsPostProcessor(settings, this._sceneNode, this._renderer, this._cameraNode, _size);
+        //    }
+    }
+    /**
+     * Base settings has changed for post processing
+     */
+    updatePostProcessingSettings(field, settings) {
+        if (this._composer === null)
+            return;
+        // Note: If we are updating all, then we will restart the context really soon
+        if (field === "postProcessing.samples") {
+            this._composer.updateAASamples(settings.samples);
+        }
+        else {
+            const needsResize = this._composer?.updatePostProcessing(settings, field);
+            if (needsResize) {
+                this._composer.resizeEffects();
+            }
+        }
+    }
+    //
+    //  DOM
+    //
+    /**
+     * Helper function to trigger events
+     */
+    emit(type, detail, bubbles) {
+        if (this._canvas !== null) {
+            this._canvas.dispatchEvent(new CustomEvent(type, {
+                bubbles: bubbles,
+                detail: detail,
+            }));
+        }
+    }
+    /**
+     * Add <canvas/> event listener
+     */
+    addEventListener(type, callback) {
+        this._canvas.addEventListener(type, callback);
+    }
+    /**
+     * Add <canvas/> event listener
+     */
+    removeEventListener(type, callback) {
+        this._canvas.removeEventListener(type, callback);
+    }
+    registerStats(updator) {
+        this._stats = updator;
+    }
+    //
+    //  WINDOW
+    //
+    /**
+     * Return mouse position
+     */
+    getPointer() {
+        return this._hoverCanvas ? _pointer : null;
+    }
+    getSize() {
+        return _size;
+    }
+    onWindowResize(width, height, resize) {
+        if (this._canvas) {
+            _offset = this._canvas.getBoundingClientRect().x;
+        }
+        _size.x = width;
+        _size.y = height;
+        this._renderer?.setSize(width, height, true);
+        if (this._composer !== null) {
+            if (resize)
+                this._composer.resize(width, height);
+            else
+                this._composer.setSize(width, height);
+        }
+        this.snooze();
+        if (this._cameraNode !== null) {
+            this._cameraNode.aspect = width / height;
+            this._cameraNode.updateProjectionMatrix();
+        }
+        if (this._isSleepEnabled) {
+            this._renderCounter = this._currentQuality;
+        }
+    }
+    //
+    //  THREE NODES
+    //
+    getThreeSceneNode() {
+        return this._sceneNode;
+    }
+    getThreeRenderer() {
+        return this._renderer;
+    }
+    getCanvasElement() {
+        return this._canvas;
+    }
+    getThreeRootNode() {
+        return this._rootNode;
+    }
+    getThreeCamera() {
+        return this._cameraNode;
+    }
+    registerUpdate(f) {
+        const oldCount = this._updates.length;
+        this._updates = [...this._updates, f];
+        this._hasUpdators = this._updates.length > 0;
+        if (oldCount === 0 && this._hasUpdators) {
+            this.context.setWorkFlag(Workers.Updators);
+        }
+    }
+    unregisterUpdate(f) {
+        this._updates = this._updates.filter((u) => u !== f);
+        this._hasUpdators = this._updates.length > 0;
+        if (!this._hasUpdators) {
+            this.context.clearWorkFlag(Workers.Updators);
+        }
+    }
+    startRenderLoop() {
+        if (!this._renderer)
+            throw new Error("No renderer");
+        // Start rendering
+        this._renderer.setAnimationLoop(this.update);
+    }
+    stopRenderLoop() {
+        if (!this._renderer)
+            throw new Error("No renderer");
+        // Stop rendering
+        this._renderer.setAnimationLoop(null);
+    }
+    addTween(tween) {
+        const didHaveTweens = this._hasTweens;
+        this._hasTweens = true;
+        this._tweens.add(tween);
+        if (!didHaveTweens && this._hasTweens) {
+            this.context.setWorkFlag(Workers.Animating);
+        }
+    }
+    setCameraUpdate(updateFunction) {
+        this._cameraUpdate = updateFunction;
+    }
+    updateHoverState() {
+        const isHoveringAdmin = this._isAdmin && this._hoverWindow && !this._hoverCanvas;
+        if (isHoveringAdmin !== this._isHoveringAdmin) {
+            if (isHoveringAdmin) {
+                this._isHoveringAdmin = true;
+                this.context.setWorkFlag(Workers.Admin);
+            }
+            else {
+                this._isHoveringAdmin = false;
+                this.context.clearWorkFlag(Workers.Admin);
+            }
+        }
+    }
+    isSleepEnabled() {
+        return this._isSleepEnabled;
+    }
+    setIsSleepEnabled(value) {
+        if (this._isSceneRunning)
+            this._renderInterval = this._skipFrameActive ? 2 : 1;
+        this._isSleepEnabled = value;
+        this.updateHoverState();
+        if (!value) {
+            this._isSleeping = false;
+            this.context.getOwner().setSleepState(false);
+        }
+    }
+    snooze() {
+        this._renderCounter = this._renderInterval;
+    }
+    updateRendererSettings(field, isettings) {
+        const settings = isettings.renderer;
+        if (field === "renderer" || field === "renderer.fov") {
+            this.setFOV(settings.fov);
+        }
+        if (field === "renderer" ||
+            field === "renderer.near" ||
+            field === "renderer.far") {
+            this.setNearFar(settings.near, settings.far);
+        }
+        if (field === "renderer" || field === "renderer.toneMapping") {
+            this.setToneMapping(settings.toneMapping);
+        }
+        if (field === "renderer" || field === "renderer.toneMappingExposure") {
+            this.setToneMappingExposure(settings.toneMappingExposure);
+        }
+    }
+    updateQualitySettings(field, isettings) {
+        const settings = isettings.quality;
+        if (field === "quality" || field === "quality.sleep") {
+            this.setIsSleepEnabled(settings.sleep);
+        }
+        if (field === "quality" || field === "quality.adaptive") {
+            this.setIsAdaptiveQualityEnabled(settings);
+            this.updateSkipFrameState(settings);
+        }
+        if (field === "quality" || field === "quality.minScale") {
+            this._minScale = settings.minScale;
+            this.updateRenderScale(false);
+        }
+        if (field === "quality" || field === "quality.maxScale") {
+            this._maxScale = settings.maxScale;
+            this.updateRenderScale(false);
+        }
+        if (field === "quality" || field === "quality.baseQuality") {
+            this._baseQuality = settings.baseQuality;
+            if (!this._adaptiveQuality) {
+                this._estimatedQuality = this._baseQuality;
+            }
+            this.setQuality(this._baseQuality);
+        }
+        if (field === "quality" || field === "quality.skipFrame") {
+            this.updateSkipFrameState(settings);
+        }
+        if (field === "quality" || field === "quality.debug") {
+            this._debug = settings.debug;
+            if (this._performanceCounter)
+                this._performanceCounter.debug = settings.debug;
+        }
+    }
+    initQualitySettings(settings) {
+        this.setIsSleepEnabled(settings.sleep);
+        this._maxScale = settings.maxScale;
+        this._minScale = settings.minScale;
+        this._baseQuality = settings.baseQuality;
+        this._debug = settings.debug;
+        this.setIsAdaptiveQualityEnabled(settings);
+        this.updateSkipFrameState(settings);
+    }
+    getRenderScale() {
+        return this._renderScale;
+    }
+    getCurrentQuality() {
+        return this._currentQuality;
+    }
+    getEstimatedQuality() {
+        return this._estimatedQuality;
+    }
+    getRenderInterval() {
+        return this._renderInterval;
+    }
+    updateSkipFrameState(settings) {
+        // Skip frame is automatically handled if we are in adaptive mode
+        if (this._adaptiveQuality) {
+            // Adaptive Quality
+            this._skipFrameActive = false;
+            if (this._isSceneRunning)
+                this._renderInterval = 1;
+        }
+        else {
+            // Manual Quality
+            this.setSkipFrameActive(settings.skipFrame);
+        }
+    }
+    setSkipFrameActive(value) {
+        if (value) {
+            // Turn on
+            this._skipFrameActive = true;
+            if (this._isSceneRunning)
+                this._renderInterval = 2;
+            if (this._debug)
+                console.log("[PCanvas] Skip Frame ON", this._renderInterval);
+        }
+        else {
+            this._skipFrameActive = false;
+            if (this._isSceneRunning)
+                this._renderInterval = 1;
+            // Turn off
+            if (this._debug)
+                console.log("[PCanvas] Skip Frame OFF", this._renderInterval);
+        }
+    }
+    setIsAdaptiveQualityEnabled(settings) {
+        this._adaptiveQuality = settings.adaptive;
+        this._estimating = this._adaptiveQuality;
+        if (settings.adaptive) {
+            this._estimatedQuality = 100;
+            this.setQuality(this._estimatedQuality);
+            this._performanceCounter = new AdaptivePerformance(this.onPerformanceEstimated);
+            this._performanceCounter.debug = settings.debug;
+            this.context.setWorkFlag(Workers.AdaptivePerformance);
+            if (this._isSceneRunning) {
+                this._performanceCounter.init(this._currentQuality);
+            }
+        }
+        else {
+            this._performanceCounter?.dispose();
+            this._performanceCounter = null;
+            this._estimatedQuality = this._baseQuality;
+            this.setQuality(this._baseQuality);
+            this.context.clearWorkFlag(Workers.AdaptivePerformance);
+        }
+    }
+    /**
+     * Quality is always clamped to steps of 0.05
+     */
+    setQuality(quality) {
+        if (this._currentQuality !== quality) {
+            this._performanceCounter?.setCurrentQuality(quality);
+            this._currentQuality = quality;
+            //
+            // POST PROCESSING
+            const resizePostProcessing = this._composer?.setCurrentQuality(quality) || false;
+            //
+            // RENDER SCALE
+            this.updateRenderScale(resizePostProcessing);
+        }
+    }
+    updateRenderScale(forced) {
+        const qualityScale = MathUtils.lerp(this._minScale, this._maxScale, this._currentQuality * 0.01);
+        const newScale = Math.min(Math.max(qualityScale, this._minScale), this._maxScale);
+        const resizePixelRatio = Math.abs(this._renderScale - newScale) >= 0.01;
+        if (forced || resizePixelRatio) {
+            if (resizePixelRatio) {
+                // console.log(
+                //   "[PCanvas] Change PixelRatio [",
+                //   this._renderScale.toFixed(2),
+                //   "] -> [",
+                //   newScale.toFixed(2),
+                //   "]"
+                // );
+                this._renderScale = newScale;
+            }
+            if (this._composer) {
+                this._composer.setPixelRatio(this._renderScale);
+                this.snooze();
+            }
+            else {
+                this._renderer.setPixelRatio(this._renderScale);
+                this.snooze();
+            }
+        }
+    }
+    onSceneRunning() {
+        if (this._debug)
+            console.log("[PCanvas] onSceneRunning()");
+        this._isSceneRunning = true;
+        this._renderInterval = this._skipFrameActive ? 2 : 1;
+        if (this._adaptiveQuality) {
+            this._performanceCounter.init(this._currentQuality);
+        }
+        else {
+            this.sleepCheck();
+        }
+    }
+    onWorkStarted(_workers) {
+        this._isWorking = true;
+        // if (this._debug)
+        //   console.log("[PCanvas] onWorkStarted()", Workers[_workers]);
+        if (this._isSleepEnabled && this._isSleeping) {
+            this._isSleeping = false;
+            this._renderInterval = this._skipFrameActive ? 2 : 1;
+            this.setQuality(this._estimatedQuality);
+            this.context.getOwner().setSleepState(false);
+        }
+    }
+    onWorkStopped(_workers) {
+        this._isWorking = false;
+        // if (this._debug)
+        //   console.log("[PCanvas] onWorkStopped: ", Workers[_workers]);
+        // Do we need to change sleep state?
+        this.sleepCheck();
+    }
+    sleepCheck() {
+        if (this._isSleepEnabled && !this._isSleeping && !this._isWorking) {
+            this.sleep();
+        }
+    }
+    sleep() {
+        // if (this._debug) console.log("[PCanvas] sleep()");
+        // This will force one last render
+        this._isSleeping = true;
+        this._renderInterval = SLEEP_INTERVAL;
+        this.setQuality(Math.min(100, this._estimatedQuality + 50));
+        this.context.getOwner().setSleepState(true);
+        this.snooze();
+    }
+    addCollider(object) {
+        this.colliders.push(object);
+    }
+    removeCollider(object) {
+        const index = this.colliders.indexOf(object);
+        if (index >= 0) {
+            this.colliders.splice(index, 1);
+        }
+    }
+    getRaycaster() {
+        return this._raycaster;
+    }
+    enableRaycaster() {
+        this._isRaycasting = true;
+        this.hovered = null;
+        this._startHoverId = null;
+        if (!this._rootNode) {
+            console.error("Warning: no root node!");
+        }
+    }
+    disableRaycaster() {
+        this._isRaycasting = false;
+        this._startHoverId = null;
+        if (this.hovered) {
+            //      console.log("disableRaycaster() while hovered");
+            this.setHovered(null, null);
+        }
+    }
+    updateEditorMode(editor) {
+        this._editor = editor;
+    }
+    raycast() {
+        const raycaster = this._raycaster;
+        // Get pointer, null if outside canvas
+        const pointer = this.getPointer();
+        if (pointer !== null) {
+            raycaster.setFromCamera(pointer, this._cameraNode);
+            const intersects = raycaster.intersectObjects(this.colliders, false);
+            this.onHover(intersects.length > 0 ? intersects : null);
+        }
+        else {
+            this.onHover(null);
+        }
+    }
+    /**
+     * Set current hovered object.
+     */
+    setHovered(node, point) {
+        const hovered = this.hovered;
+        if (node === null) {
+            // Skip if nothing is hovered
+            if (hovered === null) {
+                return;
+            }
+            this.snooze();
+            this.hovered = null;
+            //      EventSystem.emit("hover-exit", hovered.id, hovered.id, DataType.Node);
+            this.context.onHoverExit(hovered);
+            if (!this._editor) {
+                hovered.collider?.native_onHoverExit();
+            }
+        }
+        else {
+            // Skip if already hovered
+            if (hovered === node) {
+                // if (!this._editor && node.collider?.native_onHover) {
+                //   node.collider.native_onHover(point);
+                // }
+                return;
+            }
+            this.snooze();
+            // Did we have something hovered?
+            if (hovered) {
+                this.setHovered(null, null);
+            }
+            this.hovered = node;
+            this.context.onHoverEnter(node);
+            if (!this._editor) {
+                this.hovered?.collider?.native_onHoverEnter(point);
+            }
+        }
+    }
+    /**
+     * User hovers collider
+     */
+    onHover(intersects) {
+        let object3D = null;
+        let distance = 999999;
+        let point = null;
+        if (intersects !== null) {
+            for (const intersect of intersects) {
+                // Check that we hover a valid target
+                if (intersect.object.visible && intersect.distance < distance) {
+                    object3D = intersect.object;
+                    distance = intersect.distance;
+                    point = intersect.point;
+                }
+            }
+        }
+        if (object3D === null) {
+            this.setHovered(null, null);
+            return;
+        }
+        const collider = object3D.collider || object3D.userData.collider;
+        if (collider)
+            this.setHovered(collider.node, point);
+    }
+}
+//# sourceMappingURL=PCanvas.js.map