@configura/babylon-view 1.2.1 → 1.3.0-alpha.3

package/dist/utilities/utilitiesColor.js

@@ -1,48 +1,48 @@
-import { Color3 } from "@babylonjs/core/Maths/math.color.js";
-import { Color } from "@configura/web-core/dist/cm/basic/Color.js";
-import { ColorF } from "@configura/web-core/dist/cm/basic/ColorF.js";
-/**
- * Converts a number of different color formats into Color3 for use with Babylon.js
- * Returns White if object is undefined.
- */
-export function toColor3(object) {
-    if (object === undefined) {
-        return Color3.White();
-    }
-    if (typeof object === "number") {
-        // Assume object is a 24 bit integer
-        return Color3.FromInts((object >>> 16) & 0xff, (object >>> 8) & 0xff, object & 0xff);
-    }
-    if (typeof object === "string") {
-        // Assume object is a hex-string
-        return Color3.FromHexString(object);
-    }
-    if (object instanceof ColorF) {
-        // Object is a DEX ColorF (floats, 0-1)
-        return new Color3(object.r, object.g, object.b);
-    }
-    if (object instanceof Color) {
-        // Object is a DEX Color (integers 0-255)
-        return Color3.FromInts(object.r, object.g, object.b);
-    }
-    // Must be Color3 already
-    return object;
-}
-/**
- * in: r,g,b in [0,1], out: h in [0,360) and s,l in [0,1]
- * Original source: https://stackoverflow.com/a/54071699/1488048
- */
-export function rgb2hsl(r, g, b) {
-    let a = Math.max(r, g, b), n = a - Math.min(r, g, b), f = 1 - Math.abs(a + a - n - 1);
-    let h = n && (a === r ? (g - b) / n : a === g ? 2 + (b - r) / n : 4 + (r - g) / n);
-    return [60 * (h < 0 ? h + 6 : h), f ? n / f : 0, (a + a - n) / 2];
-}
-/**
- * input: h in [0,360] and s,v in [0,1] - output: r,g,b in [0,1]
- * Original source: https://stackoverflow.com/a/54014428/1488048
- */
-export function hsl2rgb(h, s, l) {
-    let a = s * Math.min(l, 1 - l);
-    let f = (n, k = (n + h / 30) % 12) => l - a * Math.max(Math.min(k - 3, 9 - k, 1), -1);
-    return [f(0), f(8), f(4)];
-}
+import { Color3 } from "@babylonjs/core/Maths/math.color.js";
+import { Color } from "@configura/web-core/dist/cm/basic/Color.js";
+import { ColorF } from "@configura/web-core/dist/cm/basic/ColorF.js";
+/**
+ * Converts a number of different color formats into Color3 for use with Babylon.js
+ * Returns White if object is undefined.
+ */
+export function toColor3(object) {
+    if (object === undefined) {
+        return Color3.White();
+    }
+    if (typeof object === "number") {
+        // Assume object is a 24 bit integer
+        return Color3.FromInts((object >>> 16) & 0xff, (object >>> 8) & 0xff, object & 0xff);
+    }
+    if (typeof object === "string") {
+        // Assume object is a hex-string
+        return Color3.FromHexString(object);
+    }
+    if (object instanceof ColorF) {
+        // Object is a DEX ColorF (floats, 0-1)
+        return new Color3(object.r, object.g, object.b);
+    }
+    if (object instanceof Color) {
+        // Object is a DEX Color (integers 0-255)
+        return Color3.FromInts(object.r, object.g, object.b);
+    }
+    // Must be Color3 already
+    return object;
+}
+/**
+ * in: r,g,b in [0,1], out: h in [0,360) and s,l in [0,1]
+ * Original source: https://stackoverflow.com/a/54071699/1488048
+ */
+export function rgb2hsl(r, g, b) {
+    let a = Math.max(r, g, b), n = a - Math.min(r, g, b), f = 1 - Math.abs(a + a - n - 1);
+    let h = n && (a === r ? (g - b) / n : a === g ? 2 + (b - r) / n : 4 + (r - g) / n);
+    return [60 * (h < 0 ? h + 6 : h), f ? n / f : 0, (a + a - n) / 2];
+}
+/**
+ * input: h in [0,360] and s,v in [0,1] - output: r,g,b in [0,1]
+ * Original source: https://stackoverflow.com/a/54014428/1488048
+ */
+export function hsl2rgb(h, s, l) {
+    let a = s * Math.min(l, 1 - l);
+    let f = (n, k = (n + h / 30) % 12) => l - a * Math.max(Math.min(k - 3, 9 - k, 1), -1);
+    return [f(0), f(8), f(4)];
+}

package/dist/utilities/utilitiesImage.d.ts

@@ -1,7 +1,7 @@
-import { Color } from "@configura/web-core/dist/cm/basic/Color.js";
-export declare function aggregateImage<T>(image: HTMLImageElement, aggregator: (imgData: ImageData) => T): T | undefined;
-export declare function calculateLightnessFromImage(image: HTMLImageElement): number | undefined;
-export declare function allPixelsAreColor(image: HTMLImageElement): false | Color;
-export declare function isLikelyBumpMap(image: HTMLImageElement, acceptableDeviationFromGray?: number): boolean;
-export declare function isLikelyNormalMap(image: HTMLImageElement): boolean;
+import { Color } from "@configura/web-core/dist/cm/basic/Color.js";
+export declare function aggregateImage<T>(image: HTMLImageElement, aggregator: (imgData: ImageData) => T): T | undefined;
+export declare function calculateLightnessFromImage(image: HTMLImageElement): number | undefined;
+export declare function allPixelsAreColor(image: HTMLImageElement): false | Color;
+export declare function isLikelyBumpMap(image: HTMLImageElement, acceptableDeviationFromGray?: number): boolean;
+export declare function isLikelyNormalMap(image: HTMLImageElement): boolean;
 //# sourceMappingURL=utilitiesImage.d.ts.map

package/dist/utilities/utilitiesImage.js

@@ -1,107 +1,107 @@
-import { Color, ColorType } from "@configura/web-core/dist/cm/basic/Color.js";
-export function aggregateImage(image, aggregator) {
-    const canvas = document.createElement("canvas");
-    canvas.width = image.width;
-    canvas.height = image.height;
-    const context = canvas.getContext("2d");
-    if (context !== null) {
-        context.drawImage(image, 0, 0);
-        const imgData = context.getImageData(0, 0, image.width, image.height);
-        return aggregator(imgData);
-    }
-    return;
-}
-const CC = 4; // All imageData will be 4 channel (RGBA)
-export function calculateLightnessFromImage(image) {
-    return aggregateImage(image, (imgData) => {
-        let t = 0;
-        const data = imgData.data;
-        const size = data.length;
-        for (let i = 0; i < size; i += CC) {
-            const r = data[i];
-            const g = data[i + 1];
-            const b = data[i + 2];
-            t += Math.max(r, g, b) + Math.min(r, g, b);
-        }
-        const average = (2 * t) / (size * 255);
-        return average;
-    });
-}
-export function allPixelsAreColor(image) {
-    return (aggregateImage(image, (imgData) => {
-        const data = imgData.data;
-        const size = data.length;
-        if (size === 0) {
-            return false;
-        }
-        for (let i = 0; i < size; i++) {
-            if (i < CC) {
-                continue;
-            }
-            if (data[i] !== data[i % CC]) {
-                return false;
-            }
-        }
-        return new Color(ColorType.rgbaColor, data[0], data[1], data[2], data[3]);
-    }) || false);
-}
-export function isLikelyBumpMap(image, acceptableDeviationFromGray = 0) {
-    const isAcceptableDeviation = (c1, c2) => {
-        const pxAcceptableDeviation = acceptableDeviationFromGray * 255;
-        return Math.abs(c1 - c2) < pxAcceptableDeviation;
-    };
-    return (aggregateImage(image, (imgData) => {
-        const data = imgData.data;
-        const size = data.length;
-        const variationsInChannels = [false, false, false];
-        for (let i = 0; i < size; i += CC) {
-            const r = data[i];
-            const g = data[i + 1];
-            const b = data[i + 2];
-            if (isAcceptableDeviation(r, g) &&
-                isAcceptableDeviation(g, b) &&
-                isAcceptableDeviation(b, r)) {
-                continue;
-            }
-            if (i === 0) {
-                continue;
-            }
-            let variedChannelsCount = 0;
-            for (let j = 0; j < CC - 1; j++) {
-                if (data[i + j] !== data[j]) {
-                    variationsInChannels[j] = true;
-                }
-                if (variationsInChannels[j]) {
-                    variedChannelsCount++;
-                }
-            }
-            if (1 < variedChannelsCount) {
-                return false;
-            }
-        }
-        return true;
-    }) || false);
-}
-export function isLikelyNormalMap(image) {
-    // A normal map represents the local surface inclination (direction, slope) relative
-    // to the texture. In every pixel the values RGB represent the three base vectors XYZ.
-    // A complete flat surface will have all normals pointing straight out of the texture,
-    // in the Z-direction. This is the blue component. Therefore a normal map will normally
-    // look blueish. We here test that we have a certain amount more of blue than the other
-    // components to see if the is likely a normal-map.
-    const blueMoreThanRedAndGreenThreshold = 1.2;
-    return (aggregateImage(image, (imgData) => {
-        const data = imgData.data;
-        const size = data.length;
-        const channelSum = [0, 0, 0];
-        for (let i = 0; i < size; i++) {
-            const comp = i % CC;
-            if (comp === 3) {
-                continue;
-            }
-            channelSum[comp] += data[i];
-        }
-        const [r, g, b] = channelSum;
-        return (blueMoreThanRedAndGreenThreshold < b / r && blueMoreThanRedAndGreenThreshold < b / g);
-    }) || false);
-}
+import { Color, ColorType } from "@configura/web-core/dist/cm/basic/Color.js";
+export function aggregateImage(image, aggregator) {
+    const canvas = document.createElement("canvas");
+    canvas.width = image.width;
+    canvas.height = image.height;
+    const context = canvas.getContext("2d");
+    if (context !== null) {
+        context.drawImage(image, 0, 0);
+        const imgData = context.getImageData(0, 0, image.width, image.height);
+        return aggregator(imgData);
+    }
+    return;
+}
+const CC = 4; // All imageData will be 4 channel (RGBA)
+export function calculateLightnessFromImage(image) {
+    return aggregateImage(image, (imgData) => {
+        let t = 0;
+        const data = imgData.data;
+        const size = data.length;
+        for (let i = 0; i < size; i += CC) {
+            const r = data[i];
+            const g = data[i + 1];
+            const b = data[i + 2];
+            t += Math.max(r, g, b) + Math.min(r, g, b);
+        }
+        const average = (2 * t) / (size * 255);
+        return average;
+    });
+}
+export function allPixelsAreColor(image) {
+    return (aggregateImage(image, (imgData) => {
+        const data = imgData.data;
+        const size = data.length;
+        if (size === 0) {
+            return false;
+        }
+        for (let i = 0; i < size; i++) {
+            if (i < CC) {
+                continue;
+            }
+            if (data[i] !== data[i % CC]) {
+                return false;
+            }
+        }
+        return new Color(ColorType.rgbaColor, data[0], data[1], data[2], data[3]);
+    }) || false);
+}
+export function isLikelyBumpMap(image, acceptableDeviationFromGray = 0) {
+    const isAcceptableDeviation = (c1, c2) => {
+        const pxAcceptableDeviation = acceptableDeviationFromGray * 255;
+        return Math.abs(c1 - c2) < pxAcceptableDeviation;
+    };
+    return (aggregateImage(image, (imgData) => {
+        const data = imgData.data;
+        const size = data.length;
+        const variationsInChannels = [false, false, false];
+        for (let i = 0; i < size; i += CC) {
+            const r = data[i];
+            const g = data[i + 1];
+            const b = data[i + 2];
+            if (isAcceptableDeviation(r, g) &&
+                isAcceptableDeviation(g, b) &&
+                isAcceptableDeviation(b, r)) {
+                continue;
+            }
+            if (i === 0) {
+                continue;
+            }
+            let variedChannelsCount = 0;
+            for (let j = 0; j < CC - 1; j++) {
+                if (data[i + j] !== data[j]) {
+                    variationsInChannels[j] = true;
+                }
+                if (variationsInChannels[j]) {
+                    variedChannelsCount++;
+                }
+            }
+            if (1 < variedChannelsCount) {
+                return false;
+            }
+        }
+        return true;
+    }) || false);
+}
+export function isLikelyNormalMap(image) {
+    // A normal map represents the local surface inclination (direction, slope) relative
+    // to the texture. In every pixel the values RGB represent the three base vectors XYZ.
+    // A complete flat surface will have all normals pointing straight out of the texture,
+    // in the Z-direction. This is the blue component. Therefore a normal map will normally
+    // look blueish. We here test that we have a certain amount more of blue than the other
+    // components to see if the is likely a normal-map.
+    const blueMoreThanRedAndGreenThreshold = 1.2;
+    return (aggregateImage(image, (imgData) => {
+        const data = imgData.data;
+        const size = data.length;
+        const channelSum = [0, 0, 0];
+        for (let i = 0; i < size; i++) {
+            const comp = i % CC;
+            if (comp === 3) {
+                continue;
+            }
+            channelSum[comp] += data[i];
+        }
+        const [r, g, b] = channelSum;
+        return (blueMoreThanRedAndGreenThreshold < b / r && blueMoreThanRedAndGreenThreshold < b / g);
+    }) || false);
+}

package/dist/utilities/utilitiesSymRootIdentifier.d.ts

@@ -1,6 +1,6 @@
-import { RootNodeSource, Transform as ModelTransform } from "@configura/web-api";
-export declare function makeIdentifier(type: "uri" | "file", v: string): string;
-export declare function makeIdentifierFromRootNodeSource(source: RootNodeSource): string;
-export declare function isSameIdentifierAndTransform(identifier1: string, transform1: ModelTransform | undefined, identifier2: string, transform2: ModelTransform | undefined): boolean;
-export declare function isSameRootNodeSource(source1: RootNodeSource, source2: RootNodeSource): boolean;
+import { RootNodeSource, Transform as ModelTransform } from "@configura/web-api";
+export declare function makeIdentifier(type: "uri" | "file", v: string): string;
+export declare function makeIdentifierFromRootNodeSource(source: RootNodeSource): string;
+export declare function isSameIdentifierAndTransform(identifier1: string, transform1: ModelTransform | undefined, identifier2: string, transform2: ModelTransform | undefined): boolean;
+export declare function isSameRootNodeSource(source1: RootNodeSource, source2: RootNodeSource): boolean;
 //# sourceMappingURL=utilitiesSymRootIdentifier.d.ts.map

package/dist/utilities/utilitiesSymRootIdentifier.js

@@ -1,20 +1,20 @@
-import { isModel } from "@configura/web-api";
-import { modelTransformsEqual } from "./utilities3D.js";
-export function makeIdentifier(type, v) {
-    return `${type}${v}`;
-}
-export function makeIdentifierFromRootNodeSource(source) {
-    return isModel(source)
-        ? makeIdentifier("uri", source.uri)
-        : makeIdentifier("file", source.name);
-}
-export function isSameIdentifierAndTransform(identifier1, transform1, identifier2, transform2) {
-    return (identifier1 === identifier2 &&
-        ((transform1 === undefined && transform2 === undefined) ||
-            (transform1 !== undefined &&
-                transform2 !== undefined &&
-                modelTransformsEqual(transform1, transform2))));
-}
-export function isSameRootNodeSource(source1, source2) {
-    return isSameIdentifierAndTransform(makeIdentifierFromRootNodeSource(source1), isModel(source1) ? source1.t : undefined, makeIdentifierFromRootNodeSource(source2), isModel(source2) ? source2.t : undefined);
-}
+import { isModel } from "@configura/web-api";
+import { modelTransformsEqual } from "./utilities3D.js";
+export function makeIdentifier(type, v) {
+    return `${type}${v}`;
+}
+export function makeIdentifierFromRootNodeSource(source) {
+    return isModel(source)
+        ? makeIdentifier("uri", source.uri)
+        : makeIdentifier("file", source.name);
+}
+export function isSameIdentifierAndTransform(identifier1, transform1, identifier2, transform2) {
+    return (identifier1 === identifier2 &&
+        ((transform1 === undefined && transform2 === undefined) ||
+            (transform1 !== undefined &&
+                transform2 !== undefined &&
+                modelTransformsEqual(transform1, transform2))));
+}
+export function isSameRootNodeSource(source1, source2) {
+    return isSameIdentifierAndTransform(makeIdentifierFromRootNodeSource(source1), isModel(source1) ? source1.t : undefined, makeIdentifierFromRootNodeSource(source2), isModel(source2) ? source2.t : undefined);
+}

package/dist/view/BaseView.d.ts

@@ -1,71 +1,71 @@
-import { Camera } from "@babylonjs/core/Cameras/camera.js";
-import "@babylonjs/core/Debug/debugLayer.js";
-import { Engine } from "@babylonjs/core/Engines/engine.js";
-import { Matrix, Vector3 } from "@babylonjs/core/Maths/math.vector.js";
-import { Scene } from "@babylonjs/core/scene.js";
-import { AggregatedLoadingObservable, EventListener, Observable } from "@configura/web-utilities";
-import { CameraCreator } from "../camera/CameraCreator.js";
-import { GradingApplier } from "../camera/GradingApplier.js";
-import { EngineCreator } from "../engine/EngineCreator.js";
-import { LightRig, LightRigCreator } from "../light/LightRigCreator.js";
-import { DummyMaterialCreator } from "../material/DummyMaterialCreator.js";
-import { CfgContentRootNode } from "../nodes/CfgContentRootNode.js";
-import { SceneCreator } from "../scene/SceneCreator.js";
-import { BaseViewConfiguration, BaseViewEventMap, CameraConfigurationProps, DetailLevel, ImageDumpCallback } from "./BaseViewConfiguration.js";
-import { RenderEnv } from "./RenderEnv.js";
-export declare const CET_TO_BABYLON_MATRIX: Matrix;
-export declare const BABYLON_TO_CET_MATRIX: Matrix;
-export declare const DEFAULT_DETAIL_LEVELS: DetailLevel[];
-export declare type BaseViewConstructorOptions<C extends Camera> = {
-    canvas: HTMLCanvasElement;
-    cameraCreator: CameraCreator<C>;
-    engineCreator?: EngineCreator;
-    lightRigCreator?: LightRigCreator;
-    sceneCreator?: SceneCreator;
-    gradingApplier?: GradingApplier;
-    dummyMaterialCreator?: DummyMaterialCreator;
-};
-export declare abstract class BaseView<C extends Camera, T extends BaseViewEventMap = BaseViewEventMap> {
-    protected _destroyed: boolean;
-    protected _viewportSize: [number, number] | undefined;
-    protected _canvas: HTMLCanvasElement;
-    protected _scene: Scene;
-    protected _engine: Engine;
-    protected _camera: C;
-    protected _lightRig: LightRig;
-    protected _inspectorActive: boolean;
-    private _cameraConfigurationObservable;
-    private _previousCameraConf;
-    protected _contentRoot: CfgContentRootNode;
-    private _needsRenderFrame;
-    private _dumpNextFrameToImage;
-    private _enginePauseSemaphore;
-    protected _errorObservable: Observable<Error>;
-    protected _loadingObservable: AggregatedLoadingObservable;
-    private _renderEnvironmentObservable;
-    protected _renderEnvironment: RenderEnv;
-    private _dummyMaterialCreator;
-    constructor(options: BaseViewConstructorOptions<C>);
-    destroy(): void;
-    pauseRendering(): void;
-    resumeRendering(): void;
-    private _hideInspector;
-    showInspector(target: HTMLElement | undefined): void;
-    setConfiguration(configuration: BaseViewConfiguration): void;
-    get cameraConfiguration(): CameraConfigurationProps;
-    protected get contentCenter(): Vector3;
-    private _boundNotifyCameraListeners;
-    protected notifyCameraListeners(): void;
-    addEventListener<K extends keyof T>(event: K, listener: EventListener<T, K>): void;
-    removeEventListener<K extends keyof T>(event: K, listener: EventListener<T, K>): void;
-    scheduleRerender(dumpNextFrameToImage?: ImageDumpCallback): void;
-    protected isContinuousRender(): boolean;
-    protected getNeededFrameRender(time: number): boolean;
-    protected browserTick(time: number): void;
-    protected renderFrame(time: number): void;
-    resizeViewport(width: number, height: number): void;
-    protected handleSizing(_force: boolean): void;
-    protected refreshCameraNearFar(): void;
-    protected notifyError: (e: any) => void;
-}
+import { Camera } from "@babylonjs/core/Cameras/camera.js";
+import "@babylonjs/core/Debug/debugLayer.js";
+import { Engine } from "@babylonjs/core/Engines/engine.js";
+import { Matrix, Vector3 } from "@babylonjs/core/Maths/math.vector.js";
+import { Scene } from "@babylonjs/core/scene.js";
+import { AggregatedLoadingObservable, EventListener, Observable } from "@configura/web-utilities";
+import { CameraCreator } from "../camera/CameraCreator.js";
+import { GradingApplier } from "../camera/GradingApplier.js";
+import { EngineCreator } from "../engine/EngineCreator.js";
+import { LightRig, LightRigCreator } from "../light/LightRigCreator.js";
+import { DummyMaterialCreator } from "../material/DummyMaterialCreator.js";
+import { CfgContentRootNode } from "../nodes/CfgContentRootNode.js";
+import { SceneCreator } from "../scene/SceneCreator.js";
+import { BaseViewConfiguration, BaseViewEventMap, CameraConfigurationProps, DetailLevel, ImageDumpCallback } from "./BaseViewConfiguration.js";
+import { RenderEnv } from "./RenderEnv.js";
+export declare const CET_TO_BABYLON_MATRIX: Matrix;
+export declare const BABYLON_TO_CET_MATRIX: Matrix;
+export declare const DEFAULT_DETAIL_LEVELS: DetailLevel[];
+export declare type BaseViewConstructorOptions<C extends Camera> = {
+    canvas: HTMLCanvasElement;
+    cameraCreator: CameraCreator<C>;
+    engineCreator?: EngineCreator;
+    lightRigCreator?: LightRigCreator;
+    sceneCreator?: SceneCreator;
+    gradingApplier?: GradingApplier;
+    dummyMaterialCreator?: DummyMaterialCreator;
+};
+export declare abstract class BaseView<C extends Camera, T extends BaseViewEventMap = BaseViewEventMap> {
+    protected _destroyed: boolean;
+    protected _viewportSize: [number, number] | undefined;
+    protected _canvas: HTMLCanvasElement;
+    protected _scene: Scene;
+    protected _engine: Engine;
+    protected _camera: C;
+    protected _lightRig: LightRig;
+    protected _inspectorActive: boolean;
+    private _cameraConfigurationObservable;
+    private _previousCameraConf;
+    protected _contentRoot: CfgContentRootNode;
+    private _needsRenderFrame;
+    private _dumpNextFrameToImage;
+    private _enginePauseSemaphore;
+    protected _errorObservable: Observable<Error>;
+    protected _loadingObservable: AggregatedLoadingObservable;
+    private _renderEnvironmentObservable;
+    protected _renderEnvironment: RenderEnv;
+    private _dummyMaterialCreator;
+    constructor(options: BaseViewConstructorOptions<C>);
+    destroy(): void;
+    pauseRendering(): void;
+    resumeRendering(): void;
+    private _hideInspector;
+    showInspector(target: HTMLElement | undefined): void;
+    setConfiguration(configuration: BaseViewConfiguration): void;
+    get cameraConfiguration(): CameraConfigurationProps;
+    protected get contentCenter(): Vector3;
+    private _boundNotifyCameraListeners;
+    protected notifyCameraListeners(): void;
+    addEventListener<K extends keyof T>(event: K, listener: EventListener<T, K>): void;
+    removeEventListener<K extends keyof T>(event: K, listener: EventListener<T, K>): void;
+    scheduleRerender(dumpNextFrameToImage?: ImageDumpCallback): void;
+    protected isContinuousRender(): boolean;
+    protected getNeededFrameRender(time: number): boolean;
+    protected browserTick(time: number): void;
+    protected renderFrame(time: number): void;
+    resizeViewport(width: number, height: number): void;
+    protected handleSizing(_force: boolean): void;
+    protected refreshCameraNearFar(): void;
+    protected notifyError: (e: any) => void;
+}
 //# sourceMappingURL=BaseView.d.ts.map