@operato/scene-visualizer 9.1.1 → 10.0.0-beta.1

package/dist/threed/managers/light-manager.js

@@ -0,0 +1,37 @@
+import * as THREE from 'three';
+export class LightManager {
+    constructor() {
+        this.lights = [];
+    }
+    setup(scene, camera, config) {
+        const { hemisphere, directional, point } = config;
+        const hemiLight = new THREE.HemisphereLight(hemisphere.skyColor, hemisphere.groundColor, hemisphere.intensity);
+        scene.add(hemiLight);
+        this.lights.push(hemiLight);
+        if (directional) {
+            const dirLight = new THREE.DirectionalLight(directional.color, directional.intensity);
+            if (directional.attachToCamera) {
+                camera.add(dirLight);
+            }
+            else {
+                scene.add(dirLight);
+            }
+            this.lights.push(dirLight);
+        }
+        if (point) {
+            const pointLight = new THREE.PointLight(point.color, point.intensity, undefined, point.decay);
+            pointLight.power = point.power;
+            pointLight.castShadow = point.castShadow;
+            pointLight.position.set(...point.position);
+            pointLight.shadow.camera.near = point.shadowNear;
+            pointLight.shadow.camera.far = point.shadowFar;
+            scene.add(pointLight);
+            this.lights.push(pointLight);
+        }
+    }
+    destroy() {
+        this.lights.forEach(light => light.dispose());
+        this.lights = [];
+    }
+}
+//# sourceMappingURL=light-manager.js.map

package/dist/threed/managers/light-manager.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"light-manager.js","sourceRoot":"","sources":["../../../src/threed/managers/light-manager.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAG9B,MAAM,OAAO,YAAY;IAAzB;QACU,WAAM,GAAkB,EAAE,CAAA;IAmCpC,CAAC;IAjCC,KAAK,CAAC,KAAkB,EAAE,MAAoB,EAAE,MAAsB;QACpE,MAAM,EAAE,UAAU,EAAE,WAAW,EAAE,KAAK,EAAE,GAAG,MAAM,CAAA;QAEjD,MAAM,SAAS,GAAG,IAAI,KAAK,CAAC,eAAe,CAAC,UAAU,CAAC,QAAQ,EAAE,UAAU,CAAC,WAAW,EAAE,UAAU,CAAC,SAAS,CAAC,CAAA;QAC9G,KAAK,CAAC,GAAG,CAAC,SAAS,CAAC,CAAA;QACpB,IAAI,CAAC,MAAM,CAAC,IAAI,CAAC,SAAS,CAAC,CAAA;QAE3B,IAAI,WAAW,EAAE,CAAC;YAChB,MAAM,QAAQ,GAAG,IAAI,KAAK,CAAC,gBAAgB,CAAC,WAAW,CAAC,KAAK,EAAE,WAAW,CAAC,SAAS,CAAC,CAAA;YACrF,IAAI,WAAW,CAAC,cAAc,EAAE,CAAC;gBAC/B,MAAM,CAAC,GAAG,CAAC,QAAQ,CAAC,CAAA;YACtB,CAAC;iBAAM,CAAC;gBACN,KAAK,CAAC,GAAG,CAAC,QAAQ,CAAC,CAAA;YACrB,CAAC;YACD,IAAI,CAAC,MAAM,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAA;QAC5B,CAAC;QAED,IAAI,KAAK,EAAE,CAAC;YACV,MAAM,UAAU,GAAG,IAAI,KAAK,CAAC,UAAU,CAAC,KAAK,CAAC,KAAK,EAAE,KAAK,CAAC,SAAS,EAAE,SAAS,EAAE,KAAK,CAAC,KAAK,CAAC,CAAA;YAC7F,UAAU,CAAC,KAAK,GAAG,KAAK,CAAC,KAAK,CAAA;YAC9B,UAAU,CAAC,UAAU,GAAG,KAAK,CAAC,UAAU,CAAA;YACxC,UAAU,CAAC,QAAQ,CAAC,GAAG,CAAC,GAAG,KAAK,CAAC,QAAQ,CAAC,CAAA;YAC1C,UAAU,CAAC,MAAM,CAAC,MAAM,CAAC,IAAI,GAAG,KAAK,CAAC,UAAU,CAAA;YAChD,UAAU,CAAC,MAAM,CAAC,MAAM,CAAC,GAAG,GAAG,KAAK,CAAC,SAAS,CAAA;YAC9C,KAAK,CAAC,GAAG,CAAC,UAAU,CAAC,CAAA;YACrB,IAAI,CAAC,MAAM,CAAC,IAAI,CAAC,UAAU,CAAC,CAAA;QAC9B,CAAC;IACH,CAAC;IAED,OAAO;QACL,IAAI,CAAC,MAAM,CAAC,OAAO,CAAC,KAAK,CAAC,EAAE,CAAC,KAAK,CAAC,OAAO,EAAE,CAAC,CAAA;QAC7C,IAAI,CAAC,MAAM,GAAG,EAAE,CAAA;IAClB,CAAC;CACF","sourcesContent":["import * as THREE from 'three'\nimport { LightingConfig } from './types.js'\n\nexport class LightManager {\n  private lights: THREE.Light[] = []\n\n  setup(scene: THREE.Scene, camera: THREE.Camera, config: LightingConfig) {\n    const { hemisphere, directional, point } = config\n\n    const hemiLight = new THREE.HemisphereLight(hemisphere.skyColor, hemisphere.groundColor, hemisphere.intensity)\n    scene.add(hemiLight)\n    this.lights.push(hemiLight)\n\n    if (directional) {\n      const dirLight = new THREE.DirectionalLight(directional.color, directional.intensity)\n      if (directional.attachToCamera) {\n        camera.add(dirLight)\n      } else {\n        scene.add(dirLight)\n      }\n      this.lights.push(dirLight)\n    }\n\n    if (point) {\n      const pointLight = new THREE.PointLight(point.color, point.intensity, undefined, point.decay)\n      pointLight.power = point.power\n      pointLight.castShadow = point.castShadow\n      pointLight.position.set(...point.position)\n      pointLight.shadow.camera.near = point.shadowNear\n      pointLight.shadow.camera.far = point.shadowFar\n      scene.add(pointLight)\n      this.lights.push(pointLight)\n    }\n  }\n\n  destroy() {\n    this.lights.forEach(light => light.dispose())\n    this.lights = []\n  }\n}\n"]}

package/dist/threed/managers/renderer-manager.d.ts

@@ -0,0 +1,30 @@
+import * as THREE from 'three';
+import { EffectComposer } from 'three/examples/jsm/postprocessing/EffectComposer.js';
+import { CSS3DRenderer } from 'three/examples/jsm/renderers/CSS3DRenderer.js';
+import { RendererConfig } from './types.js';
+export declare class RendererManager {
+    private _renderer?;
+    private _css3DRenderer?;
+    private _css3DScene?;
+    private _composer?;
+    private _noSupportWebgl;
+    get renderer(): THREE.WebGLRenderer | undefined;
+    get css3DRenderer(): CSS3DRenderer;
+    get css3DScene(): THREE.Scene;
+    get composer(): EffectComposer | undefined;
+    get noSupportWebgl(): boolean;
+    get domElement(): HTMLCanvasElement | undefined;
+    setupWebGL(width: number, height: number, config: RendererConfig): boolean;
+    setupCSS3D(isViewMode: boolean, sceneAttr?: string): void;
+    private createCSS3DRenderer;
+    setupComposer(scene: THREE.Scene, camera: THREE.Camera, width: number, height: number): EffectComposer;
+    resize(width: number, height: number): void;
+    render(): void;
+    renderCSS3D(camera: THREE.Camera): void;
+    getSize(): {
+        width: number;
+        height: number;
+    };
+    destroy(): void;
+    disposeCSS3DScene(): void;
+}

package/dist/threed/managers/renderer-manager.js

@@ -0,0 +1,120 @@
+import * as THREE from 'three';
+import { EffectComposer } from 'three/examples/jsm/postprocessing/EffectComposer.js';
+import { RenderPass } from 'three/examples/jsm/postprocessing/RenderPass.js';
+import { CSS3DRenderer } from 'three/examples/jsm/renderers/CSS3DRenderer.js';
+export class RendererManager {
+    constructor() {
+        this._noSupportWebgl = false;
+    }
+    get renderer() {
+        return this._renderer;
+    }
+    get css3DRenderer() {
+        if (!this._css3DRenderer) {
+            this._css3DRenderer = this.createCSS3DRenderer();
+        }
+        return this._css3DRenderer;
+    }
+    get css3DScene() {
+        if (!this._css3DScene) {
+            this._css3DScene = new THREE.Scene();
+        }
+        return this._css3DScene;
+    }
+    get composer() {
+        return this._composer;
+    }
+    get noSupportWebgl() {
+        return this._noSupportWebgl;
+    }
+    get domElement() {
+        var _a;
+        return (_a = this._renderer) === null || _a === void 0 ? void 0 : _a.domElement;
+    }
+    setupWebGL(width, height, config) {
+        try {
+            const canvas = document.createElement('canvas');
+            const context = canvas.getContext('webgl2');
+            const renderer = new THREE.WebGLRenderer({
+                canvas,
+                context,
+                precision: config.precision,
+                alpha: true,
+                antialias: config.antialias
+            });
+            renderer.autoClear = true;
+            // @ts-ignore for three@0.150.1
+            renderer.outputColorSpace = THREE.SRGBColorSpace;
+            renderer.useLegacyLights = false;
+            renderer.toneMappingExposure = Math.pow(config.exposure, 5.0);
+            renderer.toneMapping = THREE.LinearToneMapping;
+            renderer.shadowMap.enabled = true;
+            renderer.setClearColor(0xffffff, 0);
+            renderer.setSize(width, height);
+            this._renderer = renderer;
+            this._noSupportWebgl = false;
+            return true;
+        }
+        catch (e) {
+            this._noSupportWebgl = true;
+            return false;
+        }
+    }
+    setupCSS3D(isViewMode, sceneAttr) {
+        const renderer = this.css3DRenderer;
+        const div = renderer.domElement;
+        div.style.position = 'absolute';
+        div.style.top = '0';
+        div.style.pointerEvents = 'none';
+        if (sceneAttr) {
+            div.setAttribute('scene', sceneAttr);
+        }
+        if (!isViewMode) {
+            div.style.pointerEvents = 'none';
+        }
+    }
+    createCSS3DRenderer() {
+        return new CSS3DRenderer();
+    }
+    setupComposer(scene, camera, width, height) {
+        this._composer = new EffectComposer(this._renderer);
+        this._composer.setSize(width, height);
+        const renderPass = new RenderPass(scene, camera);
+        this._composer.addPass(renderPass);
+        return this._composer;
+    }
+    resize(width, height) {
+        var _a, _b, _c;
+        (_a = this._renderer) === null || _a === void 0 ? void 0 : _a.setSize(width, height);
+        (_b = this._css3DRenderer) === null || _b === void 0 ? void 0 : _b.setSize(width, height);
+        (_c = this._composer) === null || _c === void 0 ? void 0 : _c.setSize(width, height);
+    }
+    render() {
+        var _a;
+        (_a = this._composer) === null || _a === void 0 ? void 0 : _a.render();
+    }
+    renderCSS3D(camera) {
+        var _a;
+        (_a = this._css3DRenderer) === null || _a === void 0 ? void 0 : _a.render(this.css3DScene, camera);
+    }
+    getSize() {
+        var _a;
+        const v = new THREE.Vector2();
+        (_a = this._renderer) === null || _a === void 0 ? void 0 : _a.getSize(v);
+        return { width: v.x, height: v.y };
+    }
+    destroy() {
+        var _a, _b;
+        (_a = this._composer) === null || _a === void 0 ? void 0 : _a.dispose();
+        (_b = this._renderer) === null || _b === void 0 ? void 0 : _b.dispose();
+        delete this._composer;
+        delete this._renderer;
+    }
+    disposeCSS3DScene() {
+        if (this._css3DScene) {
+            const children = [...this._css3DScene.children];
+            children.forEach(child => this._css3DScene.remove(child));
+        }
+    }
+}
+//# sourceMappingURL=renderer-manager.js.map

package/dist/threed/managers/renderer-manager.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"renderer-manager.js","sourceRoot":"","sources":["../../../src/threed/managers/renderer-manager.ts"],"names":[],"mappings":"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","sourcesContent":["import * as THREE from 'three'\nimport { EffectComposer } from 'three/examples/jsm/postprocessing/EffectComposer.js'\nimport { RenderPass } from 'three/examples/jsm/postprocessing/RenderPass.js'\nimport { CSS3DRenderer } from 'three/examples/jsm/renderers/CSS3DRenderer.js'\nimport { RendererConfig } from './types.js'\n\nexport class RendererManager {\n  private _renderer?: THREE.WebGLRenderer\n  private _css3DRenderer?: CSS3DRenderer\n  private _css3DScene?: THREE.Scene\n  private _composer?: EffectComposer\n  private _noSupportWebgl = false\n\n  get renderer() {\n    return this._renderer\n  }\n\n  get css3DRenderer() {\n    if (!this._css3DRenderer) {\n      this._css3DRenderer = this.createCSS3DRenderer()\n    }\n    return this._css3DRenderer\n  }\n\n  get css3DScene() {\n    if (!this._css3DScene) {\n      this._css3DScene = new THREE.Scene()\n    }\n    return this._css3DScene\n  }\n\n  get composer() {\n    return this._composer\n  }\n\n  get noSupportWebgl() {\n    return this._noSupportWebgl\n  }\n\n  get domElement() {\n    return this._renderer?.domElement\n  }\n\n  setupWebGL(width: number, height: number, config: RendererConfig): boolean {\n    try {\n      const canvas = document.createElement('canvas')\n      const context = canvas.getContext('webgl2')!\n\n      const renderer = new THREE.WebGLRenderer({\n        canvas,\n        context,\n        precision: config.precision,\n        alpha: true,\n        antialias: config.antialias\n      })\n\n      renderer.autoClear = true\n      // @ts-ignore for three@0.150.1\n      renderer.outputColorSpace = THREE.SRGBColorSpace\n      renderer.useLegacyLights = false\n      renderer.toneMappingExposure = Math.pow(config.exposure, 5.0)\n      renderer.toneMapping = THREE.LinearToneMapping\n      renderer.shadowMap.enabled = true\n      renderer.setClearColor(0xffffff, 0)\n      renderer.setSize(width, height)\n\n      this._renderer = renderer\n      this._noSupportWebgl = false\n      return true\n    } catch (e) {\n      this._noSupportWebgl = true\n      return false\n    }\n  }\n\n  setupCSS3D(isViewMode: boolean, sceneAttr?: string) {\n    const renderer = this.css3DRenderer\n    const div = renderer.domElement\n    div.style.position = 'absolute'\n    div.style.top = '0'\n    div.style.pointerEvents = 'none'\n\n    if (sceneAttr) {\n      div.setAttribute('scene', sceneAttr)\n    }\n\n    if (!isViewMode) {\n      div.style.pointerEvents = 'none'\n    }\n  }\n\n  private createCSS3DRenderer(): CSS3DRenderer {\n    return new CSS3DRenderer()\n  }\n\n  setupComposer(scene: THREE.Scene, camera: THREE.Camera, width: number, height: number) {\n    this._composer = new EffectComposer(this._renderer!)\n    this._composer.setSize(width, height)\n\n    const renderPass = new RenderPass(scene, camera)\n    this._composer.addPass(renderPass)\n\n    return this._composer\n  }\n\n  resize(width: number, height: number) {\n    this._renderer?.setSize(width, height)\n    this._css3DRenderer?.setSize(width, height)\n    this._composer?.setSize(width, height)\n  }\n\n  render() {\n    this._composer?.render()\n  }\n\n  renderCSS3D(camera: THREE.Camera) {\n    this._css3DRenderer?.render(this.css3DScene, camera)\n  }\n\n  getSize(): { width: number; height: number } {\n    const v = new THREE.Vector2()\n    this._renderer?.getSize(v)\n    return { width: v.x, height: v.y }\n  }\n\n  destroy() {\n    this._composer?.dispose()\n    this._renderer?.dispose()\n    delete this._composer\n    delete this._renderer\n  }\n\n  disposeCSS3DScene() {\n    if (this._css3DScene) {\n      const children = [...this._css3DScene.children]\n      children.forEach(child => this._css3DScene!.remove(child))\n    }\n  }\n}\n"]}

package/dist/threed/managers/scene-manager.d.ts

@@ -0,0 +1,15 @@
+import * as THREE from 'three';
+import { Component } from '@hatiolab/things-scene';
+export declare class SceneManager {
+    private _scene?;
+    private _mixer?;
+    private _clock?;
+    get scene(): THREE.Scene | undefined;
+    get mixer(): THREE.AnimationMixer | undefined;
+    setup(): THREE.Scene;
+    setupMixer(): THREE.AnimationMixer;
+    addFloor(component: Component): void;
+    addObject(obj3d: THREE.Object3D): void;
+    updateAnimation(): void;
+    destroy(): void;
+}

package/dist/threed/managers/scene-manager.js

@@ -0,0 +1,48 @@
+import * as THREE from 'three';
+import { createFloor } from '../floor/floor.js';
+import { disposeObject3D } from '../utils/dispose.js';
+export class SceneManager {
+    get scene() {
+        return this._scene;
+    }
+    get mixer() {
+        return this._mixer;
+    }
+    setup() {
+        this._scene = new THREE.Scene();
+        return this._scene;
+    }
+    setupMixer() {
+        this._clock = new THREE.Clock(true);
+        this._mixer = new THREE.AnimationMixer(this._scene);
+        return this._mixer;
+    }
+    addFloor(component) {
+        const floor = createFloor(component);
+        if (floor) {
+            this._scene.add(floor);
+        }
+    }
+    addObject(obj3d) {
+        this._scene.add(obj3d);
+    }
+    updateAnimation() {
+        if (this._mixer && this._clock) {
+            this._mixer.update(this._clock.getDelta());
+        }
+    }
+    destroy() {
+        if (this._mixer) {
+            this._mixer.stopAllAction();
+            this._mixer.uncacheRoot(this._scene);
+        }
+        if (this._scene) {
+            disposeObject3D(this._scene);
+            this._scene.clear();
+        }
+        delete this._scene;
+        delete this._mixer;
+        delete this._clock;
+    }
+}
+//# sourceMappingURL=scene-manager.js.map

package/dist/threed/managers/scene-manager.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"scene-manager.js","sourceRoot":"","sources":["../../../src/threed/managers/scene-manager.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAE9B,OAAO,EAAE,WAAW,EAAE,MAAM,mBAAmB,CAAA;AAC/C,OAAO,EAAE,eAAe,EAAE,MAAM,qBAAqB,CAAA;AAErD,MAAM,OAAO,YAAY;IAKvB,IAAI,KAAK;QACP,OAAO,IAAI,CAAC,MAAM,CAAA;IACpB,CAAC;IAED,IAAI,KAAK;QACP,OAAO,IAAI,CAAC,MAAM,CAAA;IACpB,CAAC;IAED,KAAK;QACH,IAAI,CAAC,MAAM,GAAG,IAAI,KAAK,CAAC,KAAK,EAAE,CAAA;QAC/B,OAAO,IAAI,CAAC,MAAM,CAAA;IACpB,CAAC;IAED,UAAU;QACR,IAAI,CAAC,MAAM,GAAG,IAAI,KAAK,CAAC,KAAK,CAAC,IAAI,CAAC,CAAA;QACnC,IAAI,CAAC,MAAM,GAAG,IAAI,KAAK,CAAC,cAAc,CAAC,IAAI,CAAC,MAAO,CAAC,CAAA;QACpD,OAAO,IAAI,CAAC,MAAM,CAAA;IACpB,CAAC;IAED,QAAQ,CAAC,SAAoB;QAC3B,MAAM,KAAK,GAAG,WAAW,CAAC,SAAS,CAAC,CAAA;QACpC,IAAI,KAAK,EAAE,CAAC;YACV,IAAI,CAAC,MAAO,CAAC,GAAG,CAAC,KAAK,CAAC,CAAA;QACzB,CAAC;IACH,CAAC;IAED,SAAS,CAAC,KAAqB;QAC7B,IAAI,CAAC,MAAO,CAAC,GAAG,CAAC,KAAK,CAAC,CAAA;IACzB,CAAC;IAED,eAAe;QACb,IAAI,IAAI,CAAC,MAAM,IAAI,IAAI,CAAC,MAAM,EAAE,CAAC;YAC/B,IAAI,CAAC,MAAM,CAAC,MAAM,CAAC,IAAI,CAAC,MAAM,CAAC,QAAQ,EAAE,CAAC,CAAA;QAC5C,CAAC;IACH,CAAC;IAED,OAAO;QACL,IAAI,IAAI,CAAC,MAAM,EAAE,CAAC;YAChB,IAAI,CAAC,MAAM,CAAC,aAAa,EAAE,CAAA;YAC3B,IAAI,CAAC,MAAM,CAAC,WAAW,CAAC,IAAI,CAAC,MAAO,CAAC,CAAA;QACvC,CAAC;QAED,IAAI,IAAI,CAAC,MAAM,EAAE,CAAC;YAChB,eAAe,CAAC,IAAI,CAAC,MAAM,CAAC,CAAA;YAC5B,IAAI,CAAC,MAAM,CAAC,KAAK,EAAE,CAAA;QACrB,CAAC;QAED,OAAO,IAAI,CAAC,MAAM,CAAA;QAClB,OAAO,IAAI,CAAC,MAAM,CAAA;QAClB,OAAO,IAAI,CAAC,MAAM,CAAA;IACpB,CAAC;CACF","sourcesContent":["import * as THREE from 'three'\nimport { Component } from '@hatiolab/things-scene'\nimport { createFloor } from '../floor/floor.js'\nimport { disposeObject3D } from '../utils/dispose.js'\n\nexport class SceneManager {\n  private _scene?: THREE.Scene\n  private _mixer?: THREE.AnimationMixer\n  private _clock?: THREE.Clock\n\n  get scene() {\n    return this._scene\n  }\n\n  get mixer() {\n    return this._mixer\n  }\n\n  setup() {\n    this._scene = new THREE.Scene()\n    return this._scene\n  }\n\n  setupMixer() {\n    this._clock = new THREE.Clock(true)\n    this._mixer = new THREE.AnimationMixer(this._scene!)\n    return this._mixer\n  }\n\n  addFloor(component: Component) {\n    const floor = createFloor(component)\n    if (floor) {\n      this._scene!.add(floor)\n    }\n  }\n\n  addObject(obj3d: THREE.Object3D) {\n    this._scene!.add(obj3d)\n  }\n\n  updateAnimation() {\n    if (this._mixer && this._clock) {\n      this._mixer.update(this._clock.getDelta())\n    }\n  }\n\n  destroy() {\n    if (this._mixer) {\n      this._mixer.stopAllAction()\n      this._mixer.uncacheRoot(this._scene!)\n    }\n\n    if (this._scene) {\n      disposeObject3D(this._scene)\n      this._scene.clear()\n    }\n\n    delete this._scene\n    delete this._mixer\n    delete this._clock\n  }\n}\n"]}

package/dist/threed/managers/types.d.ts

@@ -0,0 +1,36 @@
+export interface CameraConfig {
+    fov: number;
+    near: number;
+    far: number;
+    zoom: number;
+    cameraX?: number;
+    cameraY?: number;
+    cameraZ?: number;
+}
+export interface RendererConfig {
+    precision: string;
+    antialias: boolean;
+    exposure: number;
+}
+export interface LightingConfig {
+    hemisphere: {
+        skyColor: number;
+        groundColor: number;
+        intensity: number;
+    };
+    directional?: {
+        color: number;
+        intensity: number;
+        attachToCamera: boolean;
+    };
+    point?: {
+        color: number;
+        intensity: number;
+        decay: number;
+        power: number;
+        castShadow: boolean;
+        position: [number, number, number];
+        shadowNear: number;
+        shadowFar: number;
+    };
+}

package/dist/threed/managers/types.js

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=types.js.map

package/dist/threed/managers/types.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.js","sourceRoot":"","sources":["../../../src/threed/managers/types.ts"],"names":[],"mappings":"","sourcesContent":["export interface CameraConfig {\n  fov: number\n  near: number\n  far: number\n  zoom: number\n  cameraX?: number\n  cameraY?: number\n  cameraZ?: number\n}\n\nexport interface RendererConfig {\n  precision: string\n  antialias: boolean\n  exposure: number\n}\n\nexport interface LightingConfig {\n  hemisphere: { skyColor: number; groundColor: number; intensity: number }\n  directional?: { color: number; intensity: number; attachToCamera: boolean }\n  point?: {\n    color: number\n    intensity: number\n    decay: number\n    power: number\n    castShadow: boolean\n    position: [number, number, number]\n    shadowNear: number\n    shadowFar: number\n  }\n}\n"]}

package/dist/threed/real-object-dom-element.js

@@ -16,6 +16,8 @@ export class RealObjectDomElement extends RealObject {
     build() {
         super.build();
         var element = this.component.element;
+        if (!element)
+            return;
         var { width, height } = this.component.bounds;
         element.style.width = width + 'px';
         element.style.height = height + 'px';
@@ -25,8 +27,11 @@ export class RealObjectDomElement extends RealObject {
     updateDimension() {
         super.updateDimension();
         var dimension = this.dimension;
-        this.component.element.style.width = dimension.width + 'px';
-        this.component.element.style.height = dimension.height + 'px';
+        var element = this.component.element;
+        if (!element)
+            return;
+        element.style.width = dimension.width + 'px';
+        element.style.height = dimension.height + 'px';
     }
     updateAlpha() {
         super.updateAlpha();
@@ -34,7 +39,10 @@ export class RealObjectDomElement extends RealObject {
         // dom element의 opacity에 alpha를 적용해야한다.
         // 하지만, 컬러톤의 반영 외에 transparent 기능은 하지 못하므로, 뒤에 있는 오브젝트를 보여주지 못한다.
         var { alpha = 1 } = this.component.state;
-        this.component.element.style.opacity = alpha;
+        var element = this.component.element;
+        if (element) {
+            element.style.opacity = String(alpha);
+        }
     }
 }
 //# sourceMappingURL=real-object-dom-element.js.map

package/dist/threed/real-object-dom-element.js.map

@@ -1 +1 @@
-{"version":3,"file":"real-object-dom-element.js","sourceRoot":"","sources":["../../src/threed/real-object-dom-element.ts"],"names":[],"mappings":"AAAA;;GAEG;AAIH,OAAO,EAAE,WAAW,EAAE,MAAM,+CAA+C,CAAA;AAC3E,OAAO,EAAE,UAAU,EAAE,MAAM,kBAAkB,CAAA;AAE7C,MAAM,OAAO,oBAAqB,SAAQ,UAAuB;IACrD,mBAAmB;QAC3B,OAAO,IAAI,WAAW,CAAE,IAAI,CAAC,SAAuD,CAAC,OAAO,CAAC,CAAA;IAC/F,CAAC;IAED,IAAI,EAAE;QACJ,IAAI,EAAE,IAAI,GAAG,CAAC,EAAE,GAAG,IAAI,CAAC,SAAS,CAAC,KAAK,CAAA;QACvC,IAAI,EAAE,MAAM,EAAE,GAAG,IAAI,CAAC,SAAS,CAAC,MAAM,CAAA;QACtC,IAAI,EAAE,EAAE,GAAG,CAAC,EAAE,GAAG,IAAI,CAAC,SAAS,CAAC,KAAK,EAAW,CAAA;QAEhD,OAAO,IAAI,GAAG,EAAE,GAAG,MAAM,GAAG,CAAC,CAAA;IAC/B,CAAC;IAED,KAAK;QACH,KAAK,CAAC,KAAK,EAAE,CAAA;QAEb,IAAI,OAAO,GAAI,IAAI,CAAC,SAAuD,CAAC,OAAO,CAAA;QAEnF,IAAI,EAAE,KAAK,EAAE,MAAM,EAAE,GAAG,IAAI,CAAC,SAAS,CAAC,MAAM,CAAA;QAE7C,OAAO,CAAC,KAAK,CAAC,KAAK,GAAG,KAAK,GAAG,IAAI,CAAA;QAClC,OAAO,CAAC,KAAK,CAAC,MAAM,GAAG,MAAM,GAAG,IAAI,CAAA;QAEpC,OAAO,CAAC,KAAK,CAAC,IAAI,GAAG,EAAE,CAAA;QACvB,OAAO,CAAC,KAAK,CAAC,GAAG,GAAG,EAAE,CAAA;IACxB,CAAC;IAED,eAAe;QACb,KAAK,CAAC,eAAe,EAAE,CAAA;QAEvB,IAAI,SAAS,GAAG,IAAI,CAAC,SAAS,CAC7B;QAAC,IAAI,CAAC,SAAuD,CAAC,OAAO,CAAC,KAAK,CAAC,KAAK,GAAG,SAAS,CAAC,KAAK,GAAG,IAAI,CAC1G;QAAC,IAAI,CAAC,SAAuD,CAAC,OAAO,CAAC,KAAK,CAAC,MAAM,GAAG,SAAS,CAAC,MAAM,GAAG,IAAI,CAAA;IAC/G,CAAC;IAED,WAAW;QACT,KAAK,CAAC,WAAW,EAAE,CAAA;QAEnB,sCAAsC;QACtC,uCAAuC;QACvC,iEAAiE;QACjE,IAAI,EAAE,KAAK,GAAG,CAAC,EAAE,GAAG,IAAI,CAAC,SAAS,CAAC,KAAK,CAEvC;QAAC,IAAI,CAAC,SAAuD,CAAC,OAAO,CAAC,KAAK,CAAC,OAAO,GAAG,KAAK,CAAA;IAC9F,CAAC;CACF","sourcesContent":["/*\n * Copyright © HatioLab Inc. All rights reserved.\n */\n\nimport { HTMLOverlayElement, HTMLOverlayContainer, DELTA } from '@hatiolab/things-scene'\n\nimport { CSS3DObject } from 'three/examples/jsm/renderers/CSS3DRenderer.js'\nimport { RealObject } from './real-object.js'\n\nexport class RealObjectDomElement extends RealObject<CSS3DObject> {\n  protected getObject3dInstance() {\n    return new CSS3DObject((this.component as HTMLOverlayElement | HTMLOverlayContainer).element)\n  }\n\n  get cz() {\n    var { zPos = 0 } = this.component.state\n    var { height } = this.component.bounds\n    var { tz = 0 } = this.component.delta() as DELTA\n\n    return zPos + tz + height / 2\n  }\n\n  build() {\n    super.build()\n\n    var element = (this.component as HTMLOverlayElement | HTMLOverlayContainer).element\n\n    var { width, height } = this.component.bounds\n\n    element.style.width = width + 'px'\n    element.style.height = height + 'px'\n\n    element.style.left = ''\n    element.style.top = ''\n  }\n\n  updateDimension() {\n    super.updateDimension()\n\n    var dimension = this.dimension\n    ;(this.component as HTMLOverlayElement | HTMLOverlayContainer).element.style.width = dimension.width + 'px'\n    ;(this.component as HTMLOverlayElement | HTMLOverlayContainer).element.style.height = dimension.height + 'px'\n  }\n\n  updateAlpha() {\n    super.updateAlpha()\n\n    // material의 opacity는 항상 0으로 유지되어야 하며,\n    // dom element의 opacity에 alpha를 적용해야한다.\n    // 하지만, 컬러톤의 반영 외에 transparent 기능은 하지 못하므로, 뒤에 있는 오브젝트를 보여주지 못한다.\n    var { alpha = 1 } = this.component.state\n\n    ;(this.component as HTMLOverlayElement | HTMLOverlayContainer).element.style.opacity = alpha\n  }\n}\n"]}
+{"version":3,"file":"real-object-dom-element.js","sourceRoot":"","sources":["../../src/threed/real-object-dom-element.ts"],"names":[],"mappings":"AAAA;;GAEG;AAIH,OAAO,EAAE,WAAW,EAAE,MAAM,+CAA+C,CAAA;AAC3E,OAAO,EAAE,UAAU,EAAE,MAAM,kBAAkB,CAAA;AAE7C,MAAM,OAAO,oBAAqB,SAAQ,UAAuB;IACrD,mBAAmB;QAC3B,OAAO,IAAI,WAAW,CAAE,IAAI,CAAC,SAAkE,CAAC,OAAQ,CAAC,CAAA;IAC3G,CAAC;IAED,IAAI,EAAE;QACJ,IAAI,EAAE,IAAI,GAAG,CAAC,EAAE,GAAG,IAAI,CAAC,SAAS,CAAC,KAAK,CAAA;QACvC,IAAI,EAAE,MAAM,EAAE,GAAG,IAAI,CAAC,SAAS,CAAC,MAAM,CAAA;QACtC,IAAI,EAAE,EAAE,GAAG,CAAC,EAAE,GAAG,IAAI,CAAC,SAAS,CAAC,KAAK,EAAW,CAAA;QAEhD,OAAO,IAAI,GAAG,EAAE,GAAG,MAAM,GAAG,CAAC,CAAA;IAC/B,CAAC;IAED,KAAK;QACH,KAAK,CAAC,KAAK,EAAE,CAAA;QAEb,IAAI,OAAO,GAAI,IAAI,CAAC,SAAkE,CAAC,OAAO,CAAA;QAC9F,IAAI,CAAC,OAAO;YAAE,OAAM;QAEpB,IAAI,EAAE,KAAK,EAAE,MAAM,EAAE,GAAG,IAAI,CAAC,SAAS,CAAC,MAAM,CAAA;QAE7C,OAAO,CAAC,KAAK,CAAC,KAAK,GAAG,KAAK,GAAG,IAAI,CAAA;QAClC,OAAO,CAAC,KAAK,CAAC,MAAM,GAAG,MAAM,GAAG,IAAI,CAAA;QAEpC,OAAO,CAAC,KAAK,CAAC,IAAI,GAAG,EAAE,CAAA;QACvB,OAAO,CAAC,KAAK,CAAC,GAAG,GAAG,EAAE,CAAA;IACxB,CAAC;IAED,eAAe;QACb,KAAK,CAAC,eAAe,EAAE,CAAA;QAEvB,IAAI,SAAS,GAAG,IAAI,CAAC,SAAS,CAAA;QAC9B,IAAI,OAAO,GAAI,IAAI,CAAC,SAAkE,CAAC,OAAO,CAAA;QAC9F,IAAI,CAAC,OAAO;YAAE,OAAM;QAEpB,OAAO,CAAC,KAAK,CAAC,KAAK,GAAG,SAAS,CAAC,KAAK,GAAG,IAAI,CAAA;QAC5C,OAAO,CAAC,KAAK,CAAC,MAAM,GAAG,SAAS,CAAC,MAAM,GAAG,IAAI,CAAA;IAChD,CAAC;IAED,WAAW;QACT,KAAK,CAAC,WAAW,EAAE,CAAA;QAEnB,sCAAsC;QACtC,uCAAuC;QACvC,iEAAiE;QACjE,IAAI,EAAE,KAAK,GAAG,CAAC,EAAE,GAAG,IAAI,CAAC,SAAS,CAAC,KAAK,CAAA;QAExC,IAAI,OAAO,GAAI,IAAI,CAAC,SAAkE,CAAC,OAAO,CAAA;QAC9F,IAAI,OAAO,EAAE,CAAC;YACZ,OAAO,CAAC,KAAK,CAAC,OAAO,GAAG,MAAM,CAAC,KAAK,CAAC,CAAA;QACvC,CAAC;IACH,CAAC;CACF","sourcesContent":["/*\n * Copyright © HatioLab Inc. All rights reserved.\n */\n\nimport { HTMLOverlayElement, HTMLOverlayContainer, DELTA } from '@hatiolab/things-scene'\n\nimport { CSS3DObject } from 'three/examples/jsm/renderers/CSS3DRenderer.js'\nimport { RealObject } from './real-object.js'\n\nexport class RealObjectDomElement extends RealObject<CSS3DObject> {\n  protected getObject3dInstance() {\n    return new CSS3DObject((this.component as unknown as HTMLOverlayElement | HTMLOverlayContainer).element!)\n  }\n\n  get cz() {\n    var { zPos = 0 } = this.component.state\n    var { height } = this.component.bounds\n    var { tz = 0 } = this.component.delta() as DELTA\n\n    return zPos + tz + height / 2\n  }\n\n  build() {\n    super.build()\n\n    var element = (this.component as unknown as HTMLOverlayElement | HTMLOverlayContainer).element\n    if (!element) return\n\n    var { width, height } = this.component.bounds\n\n    element.style.width = width + 'px'\n    element.style.height = height + 'px'\n\n    element.style.left = ''\n    element.style.top = ''\n  }\n\n  updateDimension() {\n    super.updateDimension()\n\n    var dimension = this.dimension\n    var element = (this.component as unknown as HTMLOverlayElement | HTMLOverlayContainer).element\n    if (!element) return\n\n    element.style.width = dimension.width + 'px'\n    element.style.height = dimension.height + 'px'\n  }\n\n  updateAlpha() {\n    super.updateAlpha()\n\n    // material의 opacity는 항상 0으로 유지되어야 하며,\n    // dom element의 opacity에 alpha를 적용해야한다.\n    // 하지만, 컬러톤의 반영 외에 transparent 기능은 하지 못하므로, 뒤에 있는 오브젝트를 보여주지 못한다.\n    var { alpha = 1 } = this.component.state\n\n    var element = (this.component as unknown as HTMLOverlayElement | HTMLOverlayContainer).element\n    if (element) {\n      element.style.opacity = String(alpha)\n    }\n  }\n}\n"]}

package/dist/threed/real-object-extrude.d.ts

@@ -5,6 +5,7 @@ export declare class RealObjectExtrude extends RealObject {
     _boundUVGenerator?: BoundUVGenerator;
     private _mainMesh?;
     private _sideMesh?;
+    clear(): THREE.Object3D<THREE.Object3DEventMap>;
     get shape(): any;
     get sideShape(): null;
     get boundUVGenerator(): BoundUVGenerator;

package/dist/threed/real-object-extrude.js

@@ -7,6 +7,11 @@ import { BoundUVGenerator } from './utils/bound-uv-generator.js';
 import { createCanvas } from './html/elements.js';
 import { applyAlpha } from './common.js';
 export class RealObjectExtrude extends RealObject {
+    clear() {
+        this._mainMesh = undefined;
+        this._sideMesh = undefined;
+        return super.clear();
+    }
     get shape() {
         return null;
     }
@@ -149,6 +154,8 @@ export class RealObjectExtrude extends RealObject {
         }
         const texture = RealObject.buildFillStyleTexture(this.component);
         if (texture) {
+            if (material.map)
+                material.map.dispose();
             material.map = texture;
         }
         else {

package/dist/threed/real-object-extrude.js.map

@@ -1 +1 @@
-{"version":3,"file":"real-object-extrude.js","sourceRoot":"","sources":["../../src/threed/real-object-extrude.ts"],"names":[],"mappings":"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","sourcesContent":["/*\n * Copyright © HatioLab Inc. All rights reserved.\n */\n\nimport * as THREE from 'three'\n\nimport { RealObject } from './real-object.js'\n\nimport { BoundUVGenerator } from './utils/bound-uv-generator.js'\nimport { createCanvas } from './html/elements.js'\nimport { applyAlpha } from './common.js'\n\nexport class RealObjectExtrude extends RealObject {\n  _boundUVGenerator?: BoundUVGenerator\n  private _mainMesh?: THREE.Mesh\n  private _sideMesh?: THREE.Mesh\n\n  get shape(): any {\n    return null\n  }\n\n  get sideShape() {\n    return null\n  }\n\n  get boundUVGenerator() {\n    if (!this._boundUVGenerator) this._boundUVGenerator = new BoundUVGenerator()\n\n    return this._boundUVGenerator\n  }\n\n  build() {\n    super.build()\n\n    var { depth = 1 } = this.component.state\n\n    // 다각형 그리기\n    var shape = this.shape\n    if (!shape) {\n      return\n    }\n\n    var boundUVGenerator = this.boundUVGenerator\n\n    if (boundUVGenerator) {\n      boundUVGenerator.setShape({\n        extrudedShape: shape,\n        extrudedOptions: {\n          depth\n        }\n      })\n    }\n\n    var geometry = this.createGeometry(shape)\n\n    var material = this.createMainMaterial()\n    this._mainMesh = this.createMainMesh(geometry, material as THREE.Material)\n    this._mainMesh.castShadow = true\n\n    this.object3d.add(this._mainMesh)\n\n    this._sideMesh = this.createSideMesh(geometry, shape /* FIXME , extrudeSettings */)\n    this._sideMesh.castShadow = true\n\n    this.object3d.add(this._sideMesh)\n\n    this.updateFillStyle()\n    this.updateStrokeStyle()\n  }\n\n  createGeometry(shape: THREE.Shape): THREE.BufferGeometry {\n    const { depth = 1 } = this.component.state\n\n    const extrudeSettings = {\n      steps: 1,\n      depth,\n      bevelEnabled: false,\n      UVGenerator: this.boundUVGenerator\n    } as THREE.ExtrudeGeometryOptions\n\n    var geometry = new THREE.ExtrudeGeometry(shape, extrudeSettings)\n    geometry.center()\n\n    return geometry as any\n  }\n\n  createMainMaterial() {\n    return new THREE.MeshStandardMaterial({\n      metalness: 0.5,\n      roughness: 0.5\n    })\n  }\n\n  createMainMesh(geometry: THREE.BufferGeometry, material: THREE.Material) {\n    var mesh = new THREE.Mesh(geometry, material)\n    mesh.rotation.x = -Math.PI / 2\n    mesh.rotation.y = -Math.PI\n    mesh.rotation.z = -Math.PI\n\n    return mesh\n  }\n\n  createSideMesh(geometry: THREE.BufferGeometry, shape: THREE.Shape) {\n    var { depth = 1, lineWidth = 0 } = this.component.state\n\n    var hole = new THREE.Path()\n    hole.setFromPoints(shape.getPoints())\n\n    var sideMaterial = new THREE.MeshStandardMaterial({\n      metalness: 0.5,\n      roughness: 0.5,\n      // prevent overlapped layers flickering\n      polygonOffset: true,\n      polygonOffsetFactor: -0.1\n    })\n\n    shape = this.sideShape || shape\n    shape.holes.push(hole)\n\n    var sideExtrudeSettings = {\n      steps: 1,\n      depth: depth + 1,\n      bevelEnabled: true,\n      bevelThickness: 0,\n      bevelSize: lineWidth,\n      bevelSizeSegments: 5\n    }\n\n    var sideGeometry = new THREE.ExtrudeGeometry(shape, sideExtrudeSettings)\n    sideGeometry.center()\n\n    var sideMesh = new THREE.Mesh(sideGeometry, sideMaterial)\n    sideMesh.rotation.x = -Math.PI / 2\n    sideMesh.rotation.y = -Math.PI\n    sideMesh.rotation.z = -Math.PI\n\n    return sideMesh\n  }\n\n  createTexture() {\n    function nextPowerOf2(n: number) {\n      var count = 0\n\n      if (n && !(n & (n - 1))) {\n        return n\n      }\n\n      while (n != 0) {\n        n >>= 1\n        count += 1\n      }\n\n      return 1 << count\n    }\n\n    var { width, height } = this.component.bounds\n\n    var poweredWidth = nextPowerOf2(width)\n    var poweredHeight = nextPowerOf2(height)\n\n    let canvas = createCanvas(poweredWidth, poweredHeight)\n    this.component.render(canvas.getContext('2d')!)\n\n    var texture = new THREE.CanvasTexture(canvas)\n\n    texture.needsUpdate = true\n    texture.wrapS = THREE.RepeatWrapping\n    texture.wrapT = THREE.RepeatWrapping\n    texture.offset.set(0, 1 - height / poweredHeight)\n    texture.repeat.set(width / poweredWidth, height / poweredHeight)\n    texture.minFilter = THREE.LinearFilter\n\n    return texture\n  }\n\n  updateAlpha() {\n    var { alpha = 1, fillStyle, strokeStyle } = this.component.state\n\n    this._mainMesh && applyAlpha(this._mainMesh.material, alpha, fillStyle)\n    this._sideMesh && applyAlpha(this._sideMesh.material, alpha, strokeStyle)\n  }\n\n  updateStrokeStyle() {\n    const material = this._sideMesh?.material as THREE.MeshStandardMaterial\n    if (!material) {\n      return\n    }\n\n    var { strokeStyle } = this.component.state\n\n    material.color.set(strokeStyle)\n  }\n\n  updateFillStyle() {\n    var { fillStyle, alpha = 1 } = this.component.state\n\n    var material = this._mainMesh?.material as THREE.MeshStandardMaterial\n    if (!material) {\n      return\n    }\n\n    const texture = RealObject.buildFillStyleTexture(this.component)\n\n    if (texture) {\n      material.map = texture\n    } else {\n      material.color.set(fillStyle)\n    }\n  }\n\n  updateDimension() {\n    var { width, height, depth } = this.dimension\n\n    if (!this._mainMesh || !this._sideMesh) return\n\n    this._mainMesh.geometry.computeBoundingBox()\n    let bbox = this._mainMesh.geometry.boundingBox\n\n    if (bbox) {\n      let originalWidth = bbox.max.x - bbox.min.x\n      let originalHeight = bbox.max.y - bbox.min.y\n      let originalDepth = bbox.max.z - bbox.min.z\n\n      this._mainMesh.scale.set(width / originalWidth, height / originalHeight, depth / originalDepth)\n      this._sideMesh.scale.set(width / originalWidth, height / originalHeight, depth / originalDepth)\n    }\n  }\n}\n"]}
+{"version":3,"file":"real-object-extrude.js","sourceRoot":"","sources":["../../src/threed/real-object-extrude.ts"],"names":[],"mappings":"AAAA;;GAEG;AAEH,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAE9B,OAAO,EAAE,UAAU,EAAE,MAAM,kBAAkB,CAAA;AAE7C,OAAO,EAAE,gBAAgB,EAAE,MAAM,+BAA+B,CAAA;AAChE,OAAO,EAAE,YAAY,EAAE,MAAM,oBAAoB,CAAA;AACjD,OAAO,EAAE,UAAU,EAAE,MAAM,aAAa,CAAA;AAExC,MAAM,OAAO,iBAAkB,SAAQ,UAAU;IAK/C,KAAK;QACH,IAAI,CAAC,SAAS,GAAG,SAAS,CAAA;QAC1B,IAAI,CAAC,SAAS,GAAG,SAAS,CAAA;QAC1B,OAAO,KAAK,CAAC,KAAK,EAAE,CAAA;IACtB,CAAC;IAED,IAAI,KAAK;QACP,OAAO,IAAI,CAAA;IACb,CAAC;IAED,IAAI,SAAS;QACX,OAAO,IAAI,CAAA;IACb,CAAC;IAED,IAAI,gBAAgB;QAClB,IAAI,CAAC,IAAI,CAAC,iBAAiB;YAAE,IAAI,CAAC,iBAAiB,GAAG,IAAI,gBAAgB,EAAE,CAAA;QAE5E,OAAO,IAAI,CAAC,iBAAiB,CAAA;IAC/B,CAAC;IAED,KAAK;QACH,KAAK,CAAC,KAAK,EAAE,CAAA;QAEb,IAAI,EAAE,KAAK,GAAG,CAAC,EAAE,GAAG,IAAI,CAAC,SAAS,CAAC,KAAK,CAAA;QAExC,UAAU;QACV,IAAI,KAAK,GAAG,IAAI,CAAC,KAAK,CAAA;QACtB,IAAI,CAAC,KAAK,EAAE,CAAC;YACX,OAAM;QACR,CAAC;QAED,IAAI,gBAAgB,GAAG,IAAI,CAAC,gBAAgB,CAAA;QAE5C,IAAI,gBAAgB,EAAE,CAAC;YACrB,gBAAgB,CAAC,QAAQ,CAAC;gBACxB,aAAa,EAAE,KAAK;gBACpB,eAAe,EAAE;oBACf,KAAK;iBACN;aACF,CAAC,CAAA;QACJ,CAAC;QAED,IAAI,QAAQ,GAAG,IAAI,CAAC,cAAc,CAAC,KAAK,CAAC,CAAA;QAEzC,IAAI,QAAQ,GAAG,IAAI,CAAC,kBAAkB,EAAE,CAAA;QACxC,IAAI,CAAC,SAAS,GAAG,IAAI,CAAC,cAAc,CAAC,QAAQ,EAAE,QAA0B,CAAC,CAAA;QAC1E,IAAI,CAAC,SAAS,CAAC,UAAU,GAAG,IAAI,CAAA;QAEhC,IAAI,CAAC,QAAQ,CAAC,GAAG,CAAC,IAAI,CAAC,SAAS,CAAC,CAAA;QAEjC,IAAI,CAAC,SAAS,GAAG,IAAI,CAAC,cAAc,CAAC,QAAQ,EAAE,KAAK,CAAC,6BAA6B,CAAC,CAAA;QACnF,IAAI,CAAC,SAAS,CAAC,UAAU,GAAG,IAAI,CAAA;QAEhC,IAAI,CAAC,QAAQ,CAAC,GAAG,CAAC,IAAI,CAAC,SAAS,CAAC,CAAA;QAEjC,IAAI,CAAC,eAAe,EAAE,CAAA;QACtB,IAAI,CAAC,iBAAiB,EAAE,CAAA;IAC1B,CAAC;IAED,cAAc,CAAC,KAAkB;QAC/B,MAAM,EAAE,KAAK,GAAG,CAAC,EAAE,GAAG,IAAI,CAAC,SAAS,CAAC,KAAK,CAAA;QAE1C,MAAM,eAAe,GAAG;YACtB,KAAK,EAAE,CAAC;YACR,KAAK;YACL,YAAY,EAAE,KAAK;YACnB,WAAW,EAAE,IAAI,CAAC,gBAAgB;SACH,CAAA;QAEjC,IAAI,QAAQ,GAAG,IAAI,KAAK,CAAC,eAAe,CAAC,KAAK,EAAE,eAAe,CAAC,CAAA;QAChE,QAAQ,CAAC,MAAM,EAAE,CAAA;QAEjB,OAAO,QAAe,CAAA;IACxB,CAAC;IAED,kBAAkB;QAChB,OAAO,IAAI,KAAK,CAAC,oBAAoB,CAAC;YACpC,SAAS,EAAE,GAAG;YACd,SAAS,EAAE,GAAG;SACf,CAAC,CAAA;IACJ,CAAC;IAED,cAAc,CAAC,QAA8B,EAAE,QAAwB;QACrE,IAAI,IAAI,GAAG,IAAI,KAAK,CAAC,IAAI,CAAC,QAAQ,EAAE,QAAQ,CAAC,CAAA;QAC7C,IAAI,CAAC,QAAQ,CAAC,CAAC,GAAG,CAAC,IAAI,CAAC,EAAE,GAAG,CAAC,CAAA;QAC9B,IAAI,CAAC,QAAQ,CAAC,CAAC,GAAG,CAAC,IAAI,CAAC,EAAE,CAAA;QAC1B,IAAI,CAAC,QAAQ,CAAC,CAAC,GAAG,CAAC,IAAI,CAAC,EAAE,CAAA;QAE1B,OAAO,IAAI,CAAA;IACb,CAAC;IAED,cAAc,CAAC,QAA8B,EAAE,KAAkB;QAC/D,IAAI,EAAE,KAAK,GAAG,CAAC,EAAE,SAAS,GAAG,CAAC,EAAE,GAAG,IAAI,CAAC,SAAS,CAAC,KAAK,CAAA;QAEvD,IAAI,IAAI,GAAG,IAAI,KAAK,CAAC,IAAI,EAAE,CAAA;QAC3B,IAAI,CAAC,aAAa,CAAC,KAAK,CAAC,SAAS,EAAE,CAAC,CAAA;QAErC,IAAI,YAAY,GAAG,IAAI,KAAK,CAAC,oBAAoB,CAAC;YAChD,SAAS,EAAE,GAAG;YACd,SAAS,EAAE,GAAG;YACd,uCAAuC;YACvC,aAAa,EAAE,IAAI;YACnB,mBAAmB,EAAE,CAAC,GAAG;SAC1B,CAAC,CAAA;QAEF,KAAK,GAAG,IAAI,CAAC,SAAS,IAAI,KAAK,CAAA;QAC/B,KAAK,CAAC,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,CAAA;QAEtB,IAAI,mBAAmB,GAAG;YACxB,KAAK,EAAE,CAAC;YACR,KAAK,EAAE,KAAK,GAAG,CAAC;YAChB,YAAY,EAAE,IAAI;YAClB,cAAc,EAAE,CAAC;YACjB,SAAS,EAAE,SAAS;YACpB,iBAAiB,EAAE,CAAC;SACrB,CAAA;QAED,IAAI,YAAY,GAAG,IAAI,KAAK,CAAC,eAAe,CAAC,KAAK,EAAE,mBAAmB,CAAC,CAAA;QACxE,YAAY,CAAC,MAAM,EAAE,CAAA;QAErB,IAAI,QAAQ,GAAG,IAAI,KAAK,CAAC,IAAI,CAAC,YAAY,EAAE,YAAY,CAAC,CAAA;QACzD,QAAQ,CAAC,QAAQ,CAAC,CAAC,GAAG,CAAC,IAAI,CAAC,EAAE,GAAG,CAAC,CAAA;QAClC,QAAQ,CAAC,QAAQ,CAAC,CAAC,GAAG,CAAC,IAAI,CAAC,EAAE,CAAA;QAC9B,QAAQ,CAAC,QAAQ,CAAC,CAAC,GAAG,CAAC,IAAI,CAAC,EAAE,CAAA;QAE9B,OAAO,QAAQ,CAAA;IACjB,CAAC;IAED,aAAa;QACX,SAAS,YAAY,CAAC,CAAS;YAC7B,IAAI,KAAK,GAAG,CAAC,CAAA;YAEb,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,CAAC;gBACxB,OAAO,CAAC,CAAA;YACV,CAAC;YAED,OAAO,CAAC,IAAI,CAAC,EAAE,CAAC;gBACd,CAAC,KAAK,CAAC,CAAA;gBACP,KAAK,IAAI,CAAC,CAAA;YACZ,CAAC;YAED,OAAO,CAAC,IAAI,KAAK,CAAA;QACnB,CAAC;QAED,IAAI,EAAE,KAAK,EAAE,MAAM,EAAE,GAAG,IAAI,CAAC,SAAS,CAAC,MAAM,CAAA;QAE7C,IAAI,YAAY,GAAG,YAAY,CAAC,KAAK,CAAC,CAAA;QACtC,IAAI,aAAa,GAAG,YAAY,CAAC,MAAM,CAAC,CAAA;QAExC,IAAI,MAAM,GAAG,YAAY,CAAC,YAAY,EAAE,aAAa,CAAC,CAAA;QACtD,IAAI,CAAC,SAAS,CAAC,MAAM,CAAC,MAAM,CAAC,UAAU,CAAC,IAAI,CAAE,CAAC,CAAA;QAE/C,IAAI,OAAO,GAAG,IAAI,KAAK,CAAC,aAAa,CAAC,MAAM,CAAC,CAAA;QAE7C,OAAO,CAAC,WAAW,GAAG,IAAI,CAAA;QAC1B,OAAO,CAAC,KAAK,GAAG,KAAK,CAAC,cAAc,CAAA;QACpC,OAAO,CAAC,KAAK,GAAG,KAAK,CAAC,cAAc,CAAA;QACpC,OAAO,CAAC,MAAM,CAAC,GAAG,CAAC,CAAC,EAAE,CAAC,GAAG,MAAM,GAAG,aAAa,CAAC,CAAA;QACjD,OAAO,CAAC,MAAM,CAAC,GAAG,CAAC,KAAK,GAAG,YAAY,EAAE,MAAM,GAAG,aAAa,CAAC,CAAA;QAChE,OAAO,CAAC,SAAS,GAAG,KAAK,CAAC,YAAY,CAAA;QAEtC,OAAO,OAAO,CAAA;IAChB,CAAC;IAED,WAAW;QACT,IAAI,EAAE,KAAK,GAAG,CAAC,EAAE,SAAS,EAAE,WAAW,EAAE,GAAG,IAAI,CAAC,SAAS,CAAC,KAAK,CAAA;QAEhE,IAAI,CAAC,SAAS,IAAI,UAAU,CAAC,IAAI,CAAC,SAAS,CAAC,QAAQ,EAAE,KAAK,EAAE,SAAS,CAAC,CAAA;QACvE,IAAI,CAAC,SAAS,IAAI,UAAU,CAAC,IAAI,CAAC,SAAS,CAAC,QAAQ,EAAE,KAAK,EAAE,WAAW,CAAC,CAAA;IAC3E,CAAC;IAED,iBAAiB;;QACf,MAAM,QAAQ,GAAG,MAAA,IAAI,CAAC,SAAS,0CAAE,QAAsC,CAAA;QACvE,IAAI,CAAC,QAAQ,EAAE,CAAC;YACd,OAAM;QACR,CAAC;QAED,IAAI,EAAE,WAAW,EAAE,GAAG,IAAI,CAAC,SAAS,CAAC,KAAK,CAAA;QAE1C,QAAQ,CAAC,KAAK,CAAC,GAAG,CAAC,WAAW,CAAC,CAAA;IACjC,CAAC;IAED,eAAe;;QACb,IAAI,EAAE,SAAS,EAAE,KAAK,GAAG,CAAC,EAAE,GAAG,IAAI,CAAC,SAAS,CAAC,KAAK,CAAA;QAEnD,IAAI,QAAQ,GAAG,MAAA,IAAI,CAAC,SAAS,0CAAE,QAAsC,CAAA;QACrE,IAAI,CAAC,QAAQ,EAAE,CAAC;YACd,OAAM;QACR,CAAC;QAED,MAAM,OAAO,GAAG,UAAU,CAAC,qBAAqB,CAAC,IAAI,CAAC,SAAS,CAAC,CAAA;QAEhE,IAAI,OAAO,EAAE,CAAC;YACZ,IAAI,QAAQ,CAAC,GAAG;gBAAE,QAAQ,CAAC,GAAG,CAAC,OAAO,EAAE,CAAA;YACxC,QAAQ,CAAC,GAAG,GAAG,OAAO,CAAA;QACxB,CAAC;aAAM,CAAC;YACN,QAAQ,CAAC,KAAK,CAAC,GAAG,CAAC,SAAS,CAAC,CAAA;QAC/B,CAAC;IACH,CAAC;IAED,eAAe;QACb,IAAI,EAAE,KAAK,EAAE,MAAM,EAAE,KAAK,EAAE,GAAG,IAAI,CAAC,SAAS,CAAA;QAE7C,IAAI,CAAC,IAAI,CAAC,SAAS,IAAI,CAAC,IAAI,CAAC,SAAS;YAAE,OAAM;QAE9C,IAAI,CAAC,SAAS,CAAC,QAAQ,CAAC,kBAAkB,EAAE,CAAA;QAC5C,IAAI,IAAI,GAAG,IAAI,CAAC,SAAS,CAAC,QAAQ,CAAC,WAAW,CAAA;QAE9C,IAAI,IAAI,EAAE,CAAC;YACT,IAAI,aAAa,GAAG,IAAI,CAAC,GAAG,CAAC,CAAC,GAAG,IAAI,CAAC,GAAG,CAAC,CAAC,CAAA;YAC3C,IAAI,cAAc,GAAG,IAAI,CAAC,GAAG,CAAC,CAAC,GAAG,IAAI,CAAC,GAAG,CAAC,CAAC,CAAA;YAC5C,IAAI,aAAa,GAAG,IAAI,CAAC,GAAG,CAAC,CAAC,GAAG,IAAI,CAAC,GAAG,CAAC,CAAC,CAAA;YAE3C,IAAI,CAAC,SAAS,CAAC,KAAK,CAAC,GAAG,CAAC,KAAK,GAAG,aAAa,EAAE,MAAM,GAAG,cAAc,EAAE,KAAK,GAAG,aAAa,CAAC,CAAA;YAC/F,IAAI,CAAC,SAAS,CAAC,KAAK,CAAC,GAAG,CAAC,KAAK,GAAG,aAAa,EAAE,MAAM,GAAG,cAAc,EAAE,KAAK,GAAG,aAAa,CAAC,CAAA;QACjG,CAAC;IACH,CAAC;CACF","sourcesContent":["/*\n * Copyright © HatioLab Inc. All rights reserved.\n */\n\nimport * as THREE from 'three'\n\nimport { RealObject } from './real-object.js'\n\nimport { BoundUVGenerator } from './utils/bound-uv-generator.js'\nimport { createCanvas } from './html/elements.js'\nimport { applyAlpha } from './common.js'\n\nexport class RealObjectExtrude extends RealObject {\n  _boundUVGenerator?: BoundUVGenerator\n  private _mainMesh?: THREE.Mesh\n  private _sideMesh?: THREE.Mesh\n\n  clear() {\n    this._mainMesh = undefined\n    this._sideMesh = undefined\n    return super.clear()\n  }\n\n  get shape(): any {\n    return null\n  }\n\n  get sideShape() {\n    return null\n  }\n\n  get boundUVGenerator() {\n    if (!this._boundUVGenerator) this._boundUVGenerator = new BoundUVGenerator()\n\n    return this._boundUVGenerator\n  }\n\n  build() {\n    super.build()\n\n    var { depth = 1 } = this.component.state\n\n    // 다각형 그리기\n    var shape = this.shape\n    if (!shape) {\n      return\n    }\n\n    var boundUVGenerator = this.boundUVGenerator\n\n    if (boundUVGenerator) {\n      boundUVGenerator.setShape({\n        extrudedShape: shape,\n        extrudedOptions: {\n          depth\n        }\n      })\n    }\n\n    var geometry = this.createGeometry(shape)\n\n    var material = this.createMainMaterial()\n    this._mainMesh = this.createMainMesh(geometry, material as THREE.Material)\n    this._mainMesh.castShadow = true\n\n    this.object3d.add(this._mainMesh)\n\n    this._sideMesh = this.createSideMesh(geometry, shape /* FIXME , extrudeSettings */)\n    this._sideMesh.castShadow = true\n\n    this.object3d.add(this._sideMesh)\n\n    this.updateFillStyle()\n    this.updateStrokeStyle()\n  }\n\n  createGeometry(shape: THREE.Shape): THREE.BufferGeometry {\n    const { depth = 1 } = this.component.state\n\n    const extrudeSettings = {\n      steps: 1,\n      depth,\n      bevelEnabled: false,\n      UVGenerator: this.boundUVGenerator\n    } as THREE.ExtrudeGeometryOptions\n\n    var geometry = new THREE.ExtrudeGeometry(shape, extrudeSettings)\n    geometry.center()\n\n    return geometry as any\n  }\n\n  createMainMaterial() {\n    return new THREE.MeshStandardMaterial({\n      metalness: 0.5,\n      roughness: 0.5\n    })\n  }\n\n  createMainMesh(geometry: THREE.BufferGeometry, material: THREE.Material) {\n    var mesh = new THREE.Mesh(geometry, material)\n    mesh.rotation.x = -Math.PI / 2\n    mesh.rotation.y = -Math.PI\n    mesh.rotation.z = -Math.PI\n\n    return mesh\n  }\n\n  createSideMesh(geometry: THREE.BufferGeometry, shape: THREE.Shape) {\n    var { depth = 1, lineWidth = 0 } = this.component.state\n\n    var hole = new THREE.Path()\n    hole.setFromPoints(shape.getPoints())\n\n    var sideMaterial = new THREE.MeshStandardMaterial({\n      metalness: 0.5,\n      roughness: 0.5,\n      // prevent overlapped layers flickering\n      polygonOffset: true,\n      polygonOffsetFactor: -0.1\n    })\n\n    shape = this.sideShape || shape\n    shape.holes.push(hole)\n\n    var sideExtrudeSettings = {\n      steps: 1,\n      depth: depth + 1,\n      bevelEnabled: true,\n      bevelThickness: 0,\n      bevelSize: lineWidth,\n      bevelSizeSegments: 5\n    }\n\n    var sideGeometry = new THREE.ExtrudeGeometry(shape, sideExtrudeSettings)\n    sideGeometry.center()\n\n    var sideMesh = new THREE.Mesh(sideGeometry, sideMaterial)\n    sideMesh.rotation.x = -Math.PI / 2\n    sideMesh.rotation.y = -Math.PI\n    sideMesh.rotation.z = -Math.PI\n\n    return sideMesh\n  }\n\n  createTexture() {\n    function nextPowerOf2(n: number) {\n      var count = 0\n\n      if (n && !(n & (n - 1))) {\n        return n\n      }\n\n      while (n != 0) {\n        n >>= 1\n        count += 1\n      }\n\n      return 1 << count\n    }\n\n    var { width, height } = this.component.bounds\n\n    var poweredWidth = nextPowerOf2(width)\n    var poweredHeight = nextPowerOf2(height)\n\n    let canvas = createCanvas(poweredWidth, poweredHeight)\n    this.component.render(canvas.getContext('2d')!)\n\n    var texture = new THREE.CanvasTexture(canvas)\n\n    texture.needsUpdate = true\n    texture.wrapS = THREE.RepeatWrapping\n    texture.wrapT = THREE.RepeatWrapping\n    texture.offset.set(0, 1 - height / poweredHeight)\n    texture.repeat.set(width / poweredWidth, height / poweredHeight)\n    texture.minFilter = THREE.LinearFilter\n\n    return texture\n  }\n\n  updateAlpha() {\n    var { alpha = 1, fillStyle, strokeStyle } = this.component.state\n\n    this._mainMesh && applyAlpha(this._mainMesh.material, alpha, fillStyle)\n    this._sideMesh && applyAlpha(this._sideMesh.material, alpha, strokeStyle)\n  }\n\n  updateStrokeStyle() {\n    const material = this._sideMesh?.material as THREE.MeshStandardMaterial\n    if (!material) {\n      return\n    }\n\n    var { strokeStyle } = this.component.state\n\n    material.color.set(strokeStyle)\n  }\n\n  updateFillStyle() {\n    var { fillStyle, alpha = 1 } = this.component.state\n\n    var material = this._mainMesh?.material as THREE.MeshStandardMaterial\n    if (!material) {\n      return\n    }\n\n    const texture = RealObject.buildFillStyleTexture(this.component)\n\n    if (texture) {\n      if (material.map) material.map.dispose()\n      material.map = texture\n    } else {\n      material.color.set(fillStyle)\n    }\n  }\n\n  updateDimension() {\n    var { width, height, depth } = this.dimension\n\n    if (!this._mainMesh || !this._sideMesh) return\n\n    this._mainMesh.geometry.computeBoundingBox()\n    let bbox = this._mainMesh.geometry.boundingBox\n\n    if (bbox) {\n      let originalWidth = bbox.max.x - bbox.min.x\n      let originalHeight = bbox.max.y - bbox.min.y\n      let originalDepth = bbox.max.z - bbox.min.z\n\n      this._mainMesh.scale.set(width / originalWidth, height / originalHeight, depth / originalDepth)\n      this._sideMesh.scale.set(width / originalWidth, height / originalHeight, depth / originalDepth)\n    }\n  }\n}\n"]}

package/dist/threed/real-object-gltf.js

@@ -4,6 +4,7 @@
 import * as THREE from 'three';
 import { error } from '@hatiolab/things-scene';
 import { RealObject } from './real-object.js';
+import { disposeObject3D } from './utils/dispose.js';
 import { GLTFLoader } from 'three/examples/jsm/loaders/GLTFLoader.js';
 import { DRACOLoader } from 'three/examples/jsm/loaders/DRACOLoader.js';
 import { KTX2Loader } from 'three/examples/jsm/loaders/KTX2Loader.js';
@@ -77,8 +78,11 @@ export class RealObjectGLTF extends RealObject {
         }
     }
     clear() {
-        // TODO gltf object 리소스 해제가 필요하면, 여기에 추가.
-        // 반복적으로 로딩하면 WebGL 리소스 부족으로 오류 발생.
+        if (this.pivot) {
+            disposeObject3D(this.pivot);
+        }
+        this.pivot = undefined;
+        this.objectSize = undefined;
         return super.clear();
     }
     updateDimension() {

package/dist/threed/real-object-gltf.js.map

@@ -1 +1 @@
-{"version":3,"file":"real-object-gltf.js","sourceRoot":"","sources":["../../src/threed/real-object-gltf.ts"],"names":[],"mappings":"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","sourcesContent":["/*\n * Copyright © HatioLab Inc. All rights reserved.\n */\n\nimport * as THREE from 'three'\nimport { error } from '@hatiolab/things-scene'\n\nimport { RealObject } from './real-object.js'\n\nimport { GLTF, GLTFLoader } from 'three/examples/jsm/loaders/GLTFLoader.js'\nimport { DRACOLoader } from 'three/examples/jsm/loaders/DRACOLoader.js'\nimport { KTX2Loader } from 'three/examples/jsm/loaders/KTX2Loader.js'\n// @ts-ignore\nimport { MeshoptDecoder } from 'three/examples/jsm/libs/meshopt_decoder.module.js'\nimport { Properties } from '@hatiolab/things-scene'\n\nexport class RealObjectGLTF extends RealObject {\n  private static _GLTFLoader = new GLTFLoader()\n\n  private pivot?: THREE.Object3D\n  private objectSize?: THREE.Vector3 = new THREE.Vector3()\n\n  static get GLTFLoader() {\n    return RealObjectGLTF._GLTFLoader\n  }\n\n  build() {\n    super.build()\n\n    var { src: source } = this.component.state\n\n    if (!source) {\n      this.clear()\n      return\n    }\n\n    let gltfLoader = new GLTFLoader()\n\n    // Optional: Provide a DRACOLoader instance to decode compressed mesh data\n    const dracoLoader = new DRACOLoader()\n    dracoLoader.setDecoderPath('/node_modules/three/examples/jsm/libs/draco/')\n    gltfLoader.setDRACOLoader(dracoLoader)\n\n    const ktx2Loader = new KTX2Loader()\n    ktx2Loader.setTranscoderPath(`/node_modules/three/examples/jsm/libs/basis/`)\n    ktx2Loader.detectSupport(this.threeContainer!.renderer3d!)\n    gltfLoader.setKTX2Loader(ktx2Loader)\n\n    gltfLoader.setMeshoptDecoder(MeshoptDecoder)\n\n    var fullsource = this.component.app.url(source)\n    gltfLoader.setCrossOrigin('use-credentials')\n\n    gltfLoader.load(\n      fullsource,\n      gltf => {\n        this.gltfLoaded(gltf)\n      },\n      xhr => {\n        console.log(Math.round((xhr.loaded / xhr.total) * 100) + '% loaded')\n      },\n      err => {\n        error('GLTFLoader.load', err)\n        this.clear()\n      }\n    )\n  }\n\n  private gltfLoaded(gltf: GLTF) {\n    let scene = gltf.scene\n\n    var animations = gltf.animations\n    var object = scene.clone()\n    object.userData.context = this\n\n    object.traverse((child: THREE.Object3D) => {\n      if ((child as any).isMesh) {\n        child.castShadow = true\n      }\n    })\n\n    var boundingBox = new THREE.Box3().setFromObject(object)\n    var center = boundingBox.getCenter(object.position)\n    this.objectSize = boundingBox.getSize(this.objectSize!)\n\n    center.multiplyScalar(-1)\n\n    // 오브젝트 공백을 최소로 하기위해서 clear() 를 최대한 pending함.\n    this.clear()\n\n    this.pivot = new THREE.Object3D()\n    this.object3d.add(this.pivot)\n    this.pivot.add(object)\n\n    this.updateDimension()\n\n    if (animations && animations.length) {\n      for (var i = 0; i < animations.length; i++) {\n        var animation = animations[i]\n        var action = this.threeContainer!.mixer!.clipAction(animation)\n        action.play()\n      }\n    } else {\n      console.log('no animations..')\n    }\n  }\n\n  clear() {\n    // TODO gltf object 리소스 해제가 필요하면, 여기에 추가.\n    // 반복적으로 로딩하면 WebGL 리소스 부족으로 오류 발생.\n\n    return super.clear()\n  }\n\n  updateDimension() {\n    var { width = 1, height = 1, depth = 1 } = this.component.state\n\n    var { x = 1, y = 1, z = 1 } = this.objectSize || {}\n\n    this.pivot && this.pivot.scale.set(width / x, depth / y, height / z)\n\n    this.component.invalidate()\n  }\n\n  updateSource() {\n    this.build()\n  }\n\n  onchange(after: Properties, before: Properties) {\n    super.onchange(after, before)\n\n    if ('src' in after) {\n      this.updateSource()\n    }\n  }\n}\n"]}
+{"version":3,"file":"real-object-gltf.js","sourceRoot":"","sources":["../../src/threed/real-object-gltf.ts"],"names":[],"mappings":"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","sourcesContent":["/*\n * Copyright © HatioLab Inc. All rights reserved.\n */\n\nimport * as THREE from 'three'\nimport { error } from '@hatiolab/things-scene'\n\nimport { RealObject } from './real-object.js'\nimport { disposeObject3D } from './utils/dispose.js'\n\nimport { GLTF, GLTFLoader } from 'three/examples/jsm/loaders/GLTFLoader.js'\nimport { DRACOLoader } from 'three/examples/jsm/loaders/DRACOLoader.js'\nimport { KTX2Loader } from 'three/examples/jsm/loaders/KTX2Loader.js'\n// @ts-ignore\nimport { MeshoptDecoder } from 'three/examples/jsm/libs/meshopt_decoder.module.js'\nimport { Properties } from '@hatiolab/things-scene'\n\nexport class RealObjectGLTF extends RealObject {\n  private static _GLTFLoader = new GLTFLoader()\n\n  private pivot?: THREE.Object3D\n  private objectSize?: THREE.Vector3 = new THREE.Vector3()\n\n  static get GLTFLoader() {\n    return RealObjectGLTF._GLTFLoader\n  }\n\n  build() {\n    super.build()\n\n    var { src: source } = this.component.state\n\n    if (!source) {\n      this.clear()\n      return\n    }\n\n    let gltfLoader = new GLTFLoader()\n\n    // Optional: Provide a DRACOLoader instance to decode compressed mesh data\n    const dracoLoader = new DRACOLoader()\n    dracoLoader.setDecoderPath('/node_modules/three/examples/jsm/libs/draco/')\n    gltfLoader.setDRACOLoader(dracoLoader)\n\n    const ktx2Loader = new KTX2Loader()\n    ktx2Loader.setTranscoderPath(`/node_modules/three/examples/jsm/libs/basis/`)\n    ktx2Loader.detectSupport(this.threeContainer!.renderer3d!)\n    gltfLoader.setKTX2Loader(ktx2Loader)\n\n    gltfLoader.setMeshoptDecoder(MeshoptDecoder)\n\n    var fullsource = this.component.app.url(source)\n    gltfLoader.setCrossOrigin('use-credentials')\n\n    gltfLoader.load(\n      fullsource,\n      gltf => {\n        this.gltfLoaded(gltf)\n      },\n      xhr => {\n        console.log(Math.round((xhr.loaded / xhr.total) * 100) + '% loaded')\n      },\n      err => {\n        error('GLTFLoader.load', err)\n        this.clear()\n      }\n    )\n  }\n\n  private gltfLoaded(gltf: GLTF) {\n    let scene = gltf.scene\n\n    var animations = gltf.animations\n    var object = scene.clone()\n    object.userData.context = this\n\n    object.traverse((child: THREE.Object3D) => {\n      if ((child as any).isMesh) {\n        child.castShadow = true\n      }\n    })\n\n    var boundingBox = new THREE.Box3().setFromObject(object)\n    var center = boundingBox.getCenter(object.position)\n    this.objectSize = boundingBox.getSize(this.objectSize!)\n\n    center.multiplyScalar(-1)\n\n    // 오브젝트 공백을 최소로 하기위해서 clear() 를 최대한 pending함.\n    this.clear()\n\n    this.pivot = new THREE.Object3D()\n    this.object3d.add(this.pivot)\n    this.pivot.add(object)\n\n    this.updateDimension()\n\n    if (animations && animations.length) {\n      for (var i = 0; i < animations.length; i++) {\n        var animation = animations[i]\n        var action = this.threeContainer!.mixer!.clipAction(animation)\n        action.play()\n      }\n    } else {\n      console.log('no animations..')\n    }\n  }\n\n  clear() {\n    if (this.pivot) {\n      disposeObject3D(this.pivot)\n    }\n    this.pivot = undefined\n    this.objectSize = undefined\n\n    return super.clear()\n  }\n\n  updateDimension() {\n    var { width = 1, height = 1, depth = 1 } = this.component.state\n\n    var { x = 1, y = 1, z = 1 } = this.objectSize || {}\n\n    this.pivot && this.pivot.scale.set(width / x, depth / y, height / z)\n\n    this.component.invalidate()\n  }\n\n  updateSource() {\n    this.build()\n  }\n\n  onchange(after: Properties, before: Properties) {\n    super.onchange(after, before)\n\n    if ('src' in after) {\n      this.updateSource()\n    }\n  }\n}\n"]}

package/dist/threed/real-object-mesh.js

@@ -4,6 +4,7 @@
 import * as THREE from 'three';
 import { applyAlpha } from './common.js';
 import { RealObject } from './real-object.js';
+import { disposeObject3D } from './utils/dispose.js';
 export class RealObjectMesh extends RealObject {
     getObject3dInstance() {
         return new THREE.Mesh();
@@ -29,6 +30,8 @@ export class RealObjectMesh extends RealObject {
         }
         const texture = RealObject.buildFillStyleTexture(this.component);
         if (texture) {
+            if (material.map)
+                material.map.dispose();
             texture.needsUpdate = true;
             material.map = texture;
         }
@@ -63,12 +66,7 @@ export class RealObjectMesh extends RealObject {
         });
     }
     clear() {
-        this.object3d.traverse((mesh) => {
-            if (mesh.isMesh) {
-                mesh.geometry.dispose();
-                (mesh.material.length ? mesh.material : [mesh.material]).forEach((m) => m.dispose && m.dispose());
-            }
-        });
+        disposeObject3D(this.object3d);
         return super.clear();
     }
 }

package/dist/threed/real-object-mesh.js.map

@@ -1 +1 @@
-{"version":3,"file":"real-object-mesh.js","sourceRoot":"","sources":["../../src/threed/real-object-mesh.ts"],"names":[],"mappings":"AAAA;;GAEG;AAEH,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAE9B,OAAO,EAAE,UAAU,EAAE,MAAM,aAAa,CAAA;AACxC,OAAO,EAAE,UAAU,EAAE,MAAM,kBAAkB,CAAA;AAE7C,MAAM,OAAgB,cAAe,SAAQ,UAAsB;IACvD,mBAAmB;QAC3B,OAAO,IAAI,KAAK,CAAC,IAAI,EAAE,CAAA;IACzB,CAAC;IAED,KAAK;QACH,KAAK,CAAC,KAAK,EAAE,CAAA;QAEb,IAAI,CAAC,aAAa,EAAE,CAAA;QACpB,IAAI,CAAC,aAAa,EAAE,CAAA;IACtB,CAAC;IAED,aAAa;IAEb,WAAW;QACT,IAAI,EAAE,KAAK,GAAG,CAAC,EAAE,SAAS,EAAE,GAAG,IAAI,CAAC,SAAS,CAAC,KAAK,CAAA;QAEnD,UAAU,CAAC,IAAI,CAAC,QAAQ,CAAC,QAAQ,EAAE,KAAK,EAAE,SAAS,CAAC,CAAA;IACtD,CAAC;IAED,YAAY;QACV,IAAI,CAAC,QAAQ,CAAC,OAAO,GAAG,CAAC,IAAI,CAAC,SAAS,CAAC,KAAK,CAAC,MAAM,CAAA;IACtD,CAAC;IAED,eAAe;QACb,IAAI,EAAE,SAAS,EAAE,GAAG,IAAI,CAAC,SAAS,CAAC,KAAK,CAAA;QACxC,IAAI,QAAQ,GAAG,IAAI,CAAC,QAAQ,CAAC,QAAsC,CAAA;QACnE,IAAI,CAAC,QAAQ,EAAE,CAAC;YACd,OAAM;QACR,CAAC;QAED,MAAM,OAAO,GAAG,UAAU,CAAC,qBAAqB,CAAC,IAAI,CAAC,SAAS,CAAC,CAAA;QAEhE,IAAI,OAAO,EAAE,CAAC;YACZ,OAAO,CAAC,WAAW,GAAG,IAAI,CAAA;YAC1B,QAAQ,CAAC,GAAG,GAAG,OAAO,CAAA;QACxB,CAAC;aAAM,IAAI,OAAO,SAAS,IAAI,QAAQ,EAAE,CAAC;YACxC,IAAI,SAAS,KAAK,aAAa,EAAE,CAAC;gBAChC,QAAQ,CAAC,KAAK,CAAC,GAAG,CAAC,SAAS,CAAC,CAAA;YAC/B,CAAC;iBAAM,CAAC;gBACN,QAAQ,CAAC,OAAO,GAAG,CAAC,CAAA;YACtB,CAAC;QACH,CAAC;IACH,CAAC;IAED,eAAe;QACb,IAAI,EAAE,KAAK,EAAE,MAAM,EAAE,GAAG,IAAI,CAAC,SAAS,CAAC,MAAM,CAAA;QAC7C,IAAI,EAAE,KAAK,GAAG,CAAC,EAAE,GAAG,IAAI,CAAC,SAAS,CAAC,KAAK,CAAA;QAExC,IAAI,CAAC,IAAI,CAAC,QAAQ,EAAE,CAAC;YACnB,OAAM;QACR,CAAC;QAED,IAAI,CAAC,QAAQ,CAAC,QAAQ,CAAC,kBAAkB,EAAE,CAAA;QAE3C,IAAI,IAAI,GAAG,IAAI,CAAC,QAAQ,CAAC,QAAQ,CAAC,WAAW,CAAA;QAE7C,IAAI,IAAI,EAAE,CAAC;YACT,IAAI,aAAa,GAAG,IAAI,CAAC,GAAG,CAAC,CAAC,GAAG,IAAI,CAAC,GAAG,CAAC,CAAC,CAAA;YAC3C,IAAI,aAAa,GAAG,IAAI,CAAC,GAAG,CAAC,CAAC,GAAG,IAAI,CAAC,GAAG,CAAC,CAAC,CAAA;YAC3C,IAAI,cAAc,GAAG,IAAI,CAAC,GAAG,CAAC,CAAC,GAAG,IAAI,CAAC,GAAG,CAAC,CAAC,CAAA;YAE5C,IAAI,CAAC,QAAQ,CAAC,KAAK,CAAC,GAAG,CAAC,KAAK,GAAG,aAAa,EAAE,KAAK,GAAG,aAAa,EAAE,MAAM,GAAG,cAAc,CAAC,CAAA;QAChG,CAAC;IACH,CAAC;IAID,aAAa;QACX,IAAI,CAAC,QAAQ,CAAC,QAAQ,GAAG,IAAI,KAAK,CAAC,oBAAoB,CAAC;YACtD,WAAW,EAAE,IAAI;YACjB,IAAI,EAAE,KAAK,CAAC,UAAU;SACvB,CAAC,CAAA;IACJ,CAAC;IAED,KAAK;QACH,IAAI,CAAC,QAAQ,CAAC,QAAQ,CAAC,CAAC,IAAS,EAAE,EAAE;YACnC,IAAI,IAAI,CAAC,MAAM,EAAE,CAAC;gBAChB,IAAI,CAAC,QAAQ,CAAC,OAAO,EAAE,CACtB;gBAAA,CAAC,IAAI,CAAC,QAAQ,CAAC,MAAM,CAAC,CAAC,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAM,EAAE,EAAE,CAAC,CAAC,CAAC,OAAO,IAAI,CAAC,CAAC,OAAO,EAAE,CAAC,CAAA;YACzG,CAAC;QACH,CAAC,CAAC,CAAA;QAEF,OAAO,KAAK,CAAC,KAAK,EAAE,CAAA;IACtB,CAAC;CACF","sourcesContent":["/*\n * Copyright © HatioLab Inc. All rights reserved.\n */\n\nimport * as THREE from 'three'\n\nimport { applyAlpha } from './common.js'\nimport { RealObject } from './real-object.js'\n\nexport abstract class RealObjectMesh extends RealObject<THREE.Mesh> {\n  protected getObject3dInstance() {\n    return new THREE.Mesh()\n  }\n\n  build() {\n    super.build()\n\n    this.buildGeometry()\n    this.buildMaterial()\n  }\n\n  /* overide */\n\n  updateAlpha() {\n    var { alpha = 1, fillStyle } = this.component.state\n\n    applyAlpha(this.object3d.material, alpha, fillStyle)\n  }\n\n  updateHidden() {\n    this.object3d.visible = !this.component.state.hidden\n  }\n\n  updateFillStyle() {\n    var { fillStyle } = this.component.state\n    var material = this.object3d.material as THREE.MeshStandardMaterial\n    if (!material) {\n      return\n    }\n\n    const texture = RealObject.buildFillStyleTexture(this.component)\n\n    if (texture) {\n      texture.needsUpdate = true\n      material.map = texture\n    } else if (typeof fillStyle == 'string') {\n      if (fillStyle !== 'transparent') {\n        material.color.set(fillStyle)\n      } else {\n        material.opacity = 0\n      }\n    }\n  }\n\n  updateDimension(): void {\n    var { width, height } = this.component.bounds\n    var { depth = 1 } = this.component.state\n\n    if (!this.object3d) {\n      return\n    }\n\n    this.object3d.geometry.computeBoundingBox()\n\n    let bbox = this.object3d.geometry.boundingBox\n\n    if (bbox) {\n      let originalWidth = bbox.max.x - bbox.min.x\n      let originalDepth = bbox.max.y - bbox.min.y\n      let originalHeight = bbox.max.z - bbox.min.z\n\n      this.object3d.scale.set(width / originalWidth, depth / originalDepth, height / originalHeight)\n    }\n  }\n\n  protected abstract buildGeometry(): void\n\n  buildMaterial(): void {\n    this.object3d.material = new THREE.MeshStandardMaterial({\n      transparent: true,\n      side: THREE.DoubleSide\n    })\n  }\n\n  clear() {\n    this.object3d.traverse((mesh: any) => {\n      if (mesh.isMesh) {\n        mesh.geometry.dispose()\n        ;(mesh.material.length ? mesh.material : [mesh.material]).forEach((m: any) => m.dispose && m.dispose())\n      }\n    })\n\n    return super.clear()\n  }\n}\n"]}
+{"version":3,"file":"real-object-mesh.js","sourceRoot":"","sources":["../../src/threed/real-object-mesh.ts"],"names":[],"mappings":"AAAA;;GAEG;AAEH,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAE9B,OAAO,EAAE,UAAU,EAAE,MAAM,aAAa,CAAA;AACxC,OAAO,EAAE,UAAU,EAAE,MAAM,kBAAkB,CAAA;AAC7C,OAAO,EAAE,eAAe,EAAE,MAAM,oBAAoB,CAAA;AAEpD,MAAM,OAAgB,cAAe,SAAQ,UAAsB;IACvD,mBAAmB;QAC3B,OAAO,IAAI,KAAK,CAAC,IAAI,EAAE,CAAA;IACzB,CAAC;IAED,KAAK;QACH,KAAK,CAAC,KAAK,EAAE,CAAA;QAEb,IAAI,CAAC,aAAa,EAAE,CAAA;QACpB,IAAI,CAAC,aAAa,EAAE,CAAA;IACtB,CAAC;IAED,aAAa;IAEb,WAAW;QACT,IAAI,EAAE,KAAK,GAAG,CAAC,EAAE,SAAS,EAAE,GAAG,IAAI,CAAC,SAAS,CAAC,KAAK,CAAA;QAEnD,UAAU,CAAC,IAAI,CAAC,QAAQ,CAAC,QAAQ,EAAE,KAAK,EAAE,SAAS,CAAC,CAAA;IACtD,CAAC;IAED,YAAY;QACV,IAAI,CAAC,QAAQ,CAAC,OAAO,GAAG,CAAC,IAAI,CAAC,SAAS,CAAC,KAAK,CAAC,MAAM,CAAA;IACtD,CAAC;IAED,eAAe;QACb,IAAI,EAAE,SAAS,EAAE,GAAG,IAAI,CAAC,SAAS,CAAC,KAAK,CAAA;QACxC,IAAI,QAAQ,GAAG,IAAI,CAAC,QAAQ,CAAC,QAAsC,CAAA;QACnE,IAAI,CAAC,QAAQ,EAAE,CAAC;YACd,OAAM;QACR,CAAC;QAED,MAAM,OAAO,GAAG,UAAU,CAAC,qBAAqB,CAAC,IAAI,CAAC,SAAS,CAAC,CAAA;QAEhE,IAAI,OAAO,EAAE,CAAC;YACZ,IAAI,QAAQ,CAAC,GAAG;gBAAE,QAAQ,CAAC,GAAG,CAAC,OAAO,EAAE,CAAA;YACxC,OAAO,CAAC,WAAW,GAAG,IAAI,CAAA;YAC1B,QAAQ,CAAC,GAAG,GAAG,OAAO,CAAA;QACxB,CAAC;aAAM,IAAI,OAAO,SAAS,IAAI,QAAQ,EAAE,CAAC;YACxC,IAAI,SAAS,KAAK,aAAa,EAAE,CAAC;gBAChC,QAAQ,CAAC,KAAK,CAAC,GAAG,CAAC,SAAS,CAAC,CAAA;YAC/B,CAAC;iBAAM,CAAC;gBACN,QAAQ,CAAC,OAAO,GAAG,CAAC,CAAA;YACtB,CAAC;QACH,CAAC;IACH,CAAC;IAED,eAAe;QACb,IAAI,EAAE,KAAK,EAAE,MAAM,EAAE,GAAG,IAAI,CAAC,SAAS,CAAC,MAAM,CAAA;QAC7C,IAAI,EAAE,KAAK,GAAG,CAAC,EAAE,GAAG,IAAI,CAAC,SAAS,CAAC,KAAK,CAAA;QAExC,IAAI,CAAC,IAAI,CAAC,QAAQ,EAAE,CAAC;YACnB,OAAM;QACR,CAAC;QAED,IAAI,CAAC,QAAQ,CAAC,QAAQ,CAAC,kBAAkB,EAAE,CAAA;QAE3C,IAAI,IAAI,GAAG,IAAI,CAAC,QAAQ,CAAC,QAAQ,CAAC,WAAW,CAAA;QAE7C,IAAI,IAAI,EAAE,CAAC;YACT,IAAI,aAAa,GAAG,IAAI,CAAC,GAAG,CAAC,CAAC,GAAG,IAAI,CAAC,GAAG,CAAC,CAAC,CAAA;YAC3C,IAAI,aAAa,GAAG,IAAI,CAAC,GAAG,CAAC,CAAC,GAAG,IAAI,CAAC,GAAG,CAAC,CAAC,CAAA;YAC3C,IAAI,cAAc,GAAG,IAAI,CAAC,GAAG,CAAC,CAAC,GAAG,IAAI,CAAC,GAAG,CAAC,CAAC,CAAA;YAE5C,IAAI,CAAC,QAAQ,CAAC,KAAK,CAAC,GAAG,CAAC,KAAK,GAAG,aAAa,EAAE,KAAK,GAAG,aAAa,EAAE,MAAM,GAAG,cAAc,CAAC,CAAA;QAChG,CAAC;IACH,CAAC;IAID,aAAa;QACX,IAAI,CAAC,QAAQ,CAAC,QAAQ,GAAG,IAAI,KAAK,CAAC,oBAAoB,CAAC;YACtD,WAAW,EAAE,IAAI;YACjB,IAAI,EAAE,KAAK,CAAC,UAAU;SACvB,CAAC,CAAA;IACJ,CAAC;IAED,KAAK;QACH,eAAe,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAA;QAE9B,OAAO,KAAK,CAAC,KAAK,EAAE,CAAA;IACtB,CAAC;CACF","sourcesContent":["/*\n * Copyright © HatioLab Inc. All rights reserved.\n */\n\nimport * as THREE from 'three'\n\nimport { applyAlpha } from './common.js'\nimport { RealObject } from './real-object.js'\nimport { disposeObject3D } from './utils/dispose.js'\n\nexport abstract class RealObjectMesh extends RealObject<THREE.Mesh> {\n  protected getObject3dInstance() {\n    return new THREE.Mesh()\n  }\n\n  build() {\n    super.build()\n\n    this.buildGeometry()\n    this.buildMaterial()\n  }\n\n  /* overide */\n\n  updateAlpha() {\n    var { alpha = 1, fillStyle } = this.component.state\n\n    applyAlpha(this.object3d.material, alpha, fillStyle)\n  }\n\n  updateHidden() {\n    this.object3d.visible = !this.component.state.hidden\n  }\n\n  updateFillStyle() {\n    var { fillStyle } = this.component.state\n    var material = this.object3d.material as THREE.MeshStandardMaterial\n    if (!material) {\n      return\n    }\n\n    const texture = RealObject.buildFillStyleTexture(this.component)\n\n    if (texture) {\n      if (material.map) material.map.dispose()\n      texture.needsUpdate = true\n      material.map = texture\n    } else if (typeof fillStyle == 'string') {\n      if (fillStyle !== 'transparent') {\n        material.color.set(fillStyle)\n      } else {\n        material.opacity = 0\n      }\n    }\n  }\n\n  updateDimension(): void {\n    var { width, height } = this.component.bounds\n    var { depth = 1 } = this.component.state\n\n    if (!this.object3d) {\n      return\n    }\n\n    this.object3d.geometry.computeBoundingBox()\n\n    let bbox = this.object3d.geometry.boundingBox\n\n    if (bbox) {\n      let originalWidth = bbox.max.x - bbox.min.x\n      let originalDepth = bbox.max.y - bbox.min.y\n      let originalHeight = bbox.max.z - bbox.min.z\n\n      this.object3d.scale.set(width / originalWidth, depth / originalDepth, height / originalHeight)\n    }\n  }\n\n  protected abstract buildGeometry(): void\n\n  buildMaterial(): void {\n    this.object3d.material = new THREE.MeshStandardMaterial({\n      transparent: true,\n      side: THREE.DoubleSide\n    })\n  }\n\n  clear() {\n    disposeObject3D(this.object3d)\n\n    return super.clear()\n  }\n}\n"]}

package/dist/threed/real-object-registry.d.ts

@@ -0,0 +1,7 @@
+import type { Component } from '@hatiolab/things-scene';
+import type { RealObject } from './real-object.js';
+type RealObjectFactory = (component: Component) => RealObject;
+export declare function registerRealObjectFactory(type: string, factory: RealObjectFactory): void;
+export declare function registerDefaultRealObjectFactory(factory: RealObjectFactory): void;
+export declare function createRealObjectFor(component: Component): RealObject | undefined;
+export {};