@operato/scene-visualizer 9.2.2 → 10.0.0-beta.10

package/dist/vehicle.js

@@ -0,0 +1,133 @@
+import { __decorate } from "tslib";
+/*
+ * Copyright © HatioLab Inc. All rights reserved.
+ */
+import { RectPath, Shape, sceneComponent, RealObject } from '@hatiolab/things-scene';
+import * as THREE from 'three';
+import { RoundedBoxGeometry } from 'three/examples/jsm/geometries/RoundedBoxGeometry.js';
+const NATURE = {
+    mutable: false,
+    resizable: true,
+    rotatable: true,
+    properties: [
+        {
+            type: 'color',
+            label: 'platform-color',
+            name: 'platformColor',
+            property: 'platformColor'
+        }
+    ],
+    help: 'scene/component/vehicle'
+};
+const DEFAULT_PLATFORM_COLOR = '#333333';
+const DEFAULT_BODY_COLOR = '#f0f0f0';
+const BUMPER_COLOR = '#222222';
+export class Vehicle3D extends RealObject {
+    build() {
+        super.build();
+        var { width, height, depth, fillStyle, platformColor } = this.component.state;
+        var w = width;
+        var h = height;
+        var d = depth || 50;
+        // 비율: 하단 범퍼 10%, 본체 58%, 간격 4%, 플랫폼 28%
+        var bumperH = d * 0.10;
+        var bodyH = d * 0.58;
+        var gapH = d * 0.04;
+        var platH = d * 0.28;
+        var totalH = bumperH + bodyH + gapH + platH;
+        var cornerR = Math.min(w, h, bodyH) * 0.12;
+        // ── 하단 범퍼 밴드 (본체보다 약간 넓게 돌출) ──
+        var bumperPad = Math.min(w, h) * 0.03;
+        var bumperCornerR = Math.min(w + bumperPad * 2, h + bumperPad * 2, bumperH) * 0.2;
+        var bumperGeo = new RoundedBoxGeometry(w + bumperPad * 2, bumperH, h + bumperPad * 2, 4, bumperCornerR);
+        var bumperMat = new THREE.MeshStandardMaterial({
+            color: BUMPER_COLOR,
+            roughness: 0.8,
+            metalness: 0.1
+        });
+        var bumper = new THREE.Mesh(bumperGeo, bumperMat);
+        bumper.position.y = bumperH / 2;
+        bumper.castShadow = true;
+        this.object3d.add(bumper);
+        // ── 본체 (둥근 모서리, 밝은색) ──
+        var bodyGeo = new RoundedBoxGeometry(w, bodyH, h, 4, cornerR);
+        var bodyMat = new THREE.MeshStandardMaterial({
+            color: fillStyle || DEFAULT_BODY_COLOR,
+            roughness: 0.3,
+            metalness: 0.05
+        });
+        var body = new THREE.Mesh(bodyGeo, bodyMat);
+        body.position.y = bumperH + bodyH / 2;
+        body.castShadow = true;
+        this.object3d.add(body);
+        // ── 상단 플랫폼 (본체보다 약간 안쪽, 어두운색) ──
+        var platInset = Math.min(w, h) * 0.04;
+        var platCornerR = Math.min(w - platInset * 2, h - platInset * 2, platH) * 0.15;
+        var platGeo = new RoundedBoxGeometry(w - platInset * 2, platH, h - platInset * 2, 4, platCornerR);
+        var platMat = new THREE.MeshStandardMaterial({
+            color: platformColor || DEFAULT_PLATFORM_COLOR,
+            roughness: 0.5,
+            metalness: 0.15
+        });
+        var plat = new THREE.Mesh(platGeo, platMat);
+        plat.position.y = bumperH + bodyH + gapH + platH / 2;
+        plat.castShadow = true;
+        this.object3d.add(plat);
+        // 수직 중앙 정렬
+        this.object3d.children.forEach(child => {
+            child.position.y -= totalH / 2;
+        });
+    }
+}
+/* ── 2D 렌더 ── */
+function renderVehicle(ctx, x, y, w, h, fillStyle, platformColor) {
+    var r = Math.min(w, h) * 0.1;
+    var bumperH = Math.max(3, h * 0.10);
+    var platH = Math.max(4, h * 0.25);
+    var platInset = Math.min(w, h) * 0.04;
+    // 하단 범퍼 밴드 (본체보다 약간 넓게)
+    var bumperPad = Math.min(w, h) * 0.02;
+    ctx.fillStyle = BUMPER_COLOR;
+    ctx.beginPath();
+    ctx.roundRect(x - bumperPad, y + h - bumperH, w + bumperPad * 2, bumperH, [0, 0, r, r]);
+    ctx.fill();
+    // 본체 (둥근 사각형)
+    ctx.fillStyle = fillStyle || DEFAULT_BODY_COLOR;
+    ctx.beginPath();
+    ctx.roundRect(x, y + platH + 2, w, h - platH - bumperH - 2, r * 0.5);
+    ctx.fill();
+    ctx.strokeStyle = '#dddddd';
+    ctx.lineWidth = 0.5;
+    ctx.beginPath();
+    ctx.roundRect(x, y + platH + 2, w, h - platH - bumperH - 2, r * 0.5);
+    ctx.stroke();
+    // 상단 플랫폼 (약간 안쪽)
+    ctx.fillStyle = platformColor || DEFAULT_PLATFORM_COLOR;
+    ctx.beginPath();
+    ctx.roundRect(x + platInset, y, w - platInset * 2, platH, [r, r, 0, 0]);
+    ctx.fill();
+}
+let Vehicle = class Vehicle extends RectPath(Shape) {
+    is3dish() {
+        return true;
+    }
+    buildRealObject() {
+        return new Vehicle3D(this);
+    }
+    get nature() {
+        return NATURE;
+    }
+    render(ctx) {
+        var { left, top, width, height } = this.bounds;
+        var fillStyle = this.getState('fillStyle');
+        var platformColor = this.getState('platformColor');
+        renderVehicle(ctx, left, top, width, height, fillStyle, platformColor);
+        ctx.beginPath();
+        ctx.rect(left, top, width, height);
+    }
+};
+Vehicle = __decorate([
+    sceneComponent('vehicle')
+], Vehicle);
+export { Vehicle };
+//# sourceMappingURL=vehicle.js.map

package/dist/vehicle.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"vehicle.js","sourceRoot":"","sources":["../src/vehicle.ts"],"names":[],"mappings":"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","sourcesContent":["/*\n * Copyright © HatioLab Inc. All rights reserved.\n */\nimport { ComponentNature, RectPath, Shape, sceneComponent, RealObject } from '@hatiolab/things-scene'\nimport * as THREE from 'three'\nimport { RoundedBoxGeometry } from 'three/examples/jsm/geometries/RoundedBoxGeometry.js'\n\nconst NATURE: ComponentNature = {\n  mutable: false,\n  resizable: true,\n  rotatable: true,\n  properties: [\n    {\n      type: 'color',\n      label: 'platform-color',\n      name: 'platformColor',\n      property: 'platformColor'\n    }\n  ],\n  help: 'scene/component/vehicle'\n}\n\nconst DEFAULT_PLATFORM_COLOR = '#333333'\nconst DEFAULT_BODY_COLOR = '#f0f0f0'\nconst BUMPER_COLOR = '#222222'\n\nexport class Vehicle3D extends RealObject {\n  build() {\n    super.build()\n\n    var { width, height, depth, fillStyle, platformColor } = this.component.state\n\n    var w = width\n    var h = height\n    var d = depth || 50\n\n    // 비율: 하단 범퍼 10%, 본체 58%, 간격 4%, 플랫폼 28%\n    var bumperH = d * 0.10\n    var bodyH = d * 0.58\n    var gapH = d * 0.04\n    var platH = d * 0.28\n    var totalH = bumperH + bodyH + gapH + platH\n\n    var cornerR = Math.min(w, h, bodyH) * 0.12\n\n    // ── 하단 범퍼 밴드 (본체보다 약간 넓게 돌출) ──\n    var bumperPad = Math.min(w, h) * 0.03\n    var bumperCornerR = Math.min(w + bumperPad * 2, h + bumperPad * 2, bumperH) * 0.2\n    var bumperGeo = new RoundedBoxGeometry(w + bumperPad * 2, bumperH, h + bumperPad * 2, 4, bumperCornerR)\n    var bumperMat = new THREE.MeshStandardMaterial({\n      color: BUMPER_COLOR,\n      roughness: 0.8,\n      metalness: 0.1\n    })\n    var bumper = new THREE.Mesh(bumperGeo, bumperMat)\n    bumper.position.y = bumperH / 2\n    bumper.castShadow = true\n    this.object3d.add(bumper)\n\n    // ── 본체 (둥근 모서리, 밝은색) ──\n    var bodyGeo = new RoundedBoxGeometry(w, bodyH, h, 4, cornerR)\n    var bodyMat = new THREE.MeshStandardMaterial({\n      color: fillStyle || DEFAULT_BODY_COLOR,\n      roughness: 0.3,\n      metalness: 0.05\n    })\n    var body = new THREE.Mesh(bodyGeo, bodyMat)\n    body.position.y = bumperH + bodyH / 2\n    body.castShadow = true\n    this.object3d.add(body)\n\n    // ── 상단 플랫폼 (본체보다 약간 안쪽, 어두운색) ──\n    var platInset = Math.min(w, h) * 0.04\n    var platCornerR = Math.min(w - platInset * 2, h - platInset * 2, platH) * 0.15\n    var platGeo = new RoundedBoxGeometry(w - platInset * 2, platH, h - platInset * 2, 4, platCornerR)\n    var platMat = new THREE.MeshStandardMaterial({\n      color: platformColor || DEFAULT_PLATFORM_COLOR,\n      roughness: 0.5,\n      metalness: 0.15\n    })\n    var plat = new THREE.Mesh(platGeo, platMat)\n    plat.position.y = bumperH + bodyH + gapH + platH / 2\n    plat.castShadow = true\n    this.object3d.add(plat)\n\n    // 수직 중앙 정렬\n    this.object3d.children.forEach(child => {\n      child.position.y -= totalH / 2\n    })\n  }\n}\n\n/* ── 2D 렌더 ── */\n\nfunction renderVehicle(\n  ctx: CanvasRenderingContext2D,\n  x: number,\n  y: number,\n  w: number,\n  h: number,\n  fillStyle: string,\n  platformColor: string\n) {\n  var r = Math.min(w, h) * 0.1\n  var bumperH = Math.max(3, h * 0.10)\n  var platH = Math.max(4, h * 0.25)\n  var platInset = Math.min(w, h) * 0.04\n\n  // 하단 범퍼 밴드 (본체보다 약간 넓게)\n  var bumperPad = Math.min(w, h) * 0.02\n  ctx.fillStyle = BUMPER_COLOR\n  ctx.beginPath()\n  ctx.roundRect(x - bumperPad, y + h - bumperH, w + bumperPad * 2, bumperH, [0, 0, r, r])\n  ctx.fill()\n\n  // 본체 (둥근 사각형)\n  ctx.fillStyle = fillStyle || DEFAULT_BODY_COLOR\n  ctx.beginPath()\n  ctx.roundRect(x, y + platH + 2, w, h - platH - bumperH - 2, r * 0.5)\n  ctx.fill()\n\n  ctx.strokeStyle = '#dddddd'\n  ctx.lineWidth = 0.5\n  ctx.beginPath()\n  ctx.roundRect(x, y + platH + 2, w, h - platH - bumperH - 2, r * 0.5)\n  ctx.stroke()\n\n  // 상단 플랫폼 (약간 안쪽)\n  ctx.fillStyle = platformColor || DEFAULT_PLATFORM_COLOR\n  ctx.beginPath()\n  ctx.roundRect(x + platInset, y, w - platInset * 2, platH, [r, r, 0, 0])\n  ctx.fill()\n}\n\n@sceneComponent('vehicle')\nexport class Vehicle extends RectPath(Shape) {\n  is3dish() {\n    return true\n  }\n\n  buildRealObject(): RealObject | undefined {\n    return new Vehicle3D(this as any)\n  }\n\n  get nature() {\n    return NATURE\n  }\n\n  render(ctx: CanvasRenderingContext2D) {\n    var { left, top, width, height } = this.bounds\n    var fillStyle = this.getState('fillStyle')\n    var platformColor = this.getState('platformColor')\n\n    renderVehicle(ctx, left, top, width, height, fillStyle, platformColor)\n\n    ctx.beginPath()\n    ctx.rect(left, top, width, height)\n  }\n}\n"]}

package/dist/visualizer.d.ts

@@ -1,16 +1,16 @@
-import { Component, Properties, ComponentNature } from '@hatiolab/things-scene';
+import { Component, Properties, ComponentNature, RealObject, ThreeContainer } from '@hatiolab/things-scene';
 import * as THREE from 'three';
-import { RealObject } from './threed/real-object.js';
-import './three-layout.js';
-import { ThreeContainer } from './three-container.js';
-export declare class Visualizer extends ThreeContainer {
+import { Stock, type StockMaterialProvider } from './stock.js';
+export declare class Visualizer extends ThreeContainer implements StockMaterialProvider {
     _legendTarget?: Component;
+    _focused_stock?: Stock;
     _objects: {
         [id: string]: RealObject;
     };
     _stock_materials: THREE.Material[];
     _default_material?: THREE.Material;
     _empty_material?: THREE.Material;
+    get hideEmptyStock(): boolean;
     get legendTarget(): Component | undefined;
     putObject(id: string, object: RealObject): void;
     getObject(id: string): RealObject;

package/dist/visualizer.js

@@ -2,9 +2,7 @@
  * Copyright © HatioLab Inc. All rights reserved.
  */
 import { __decorate } from "tslib";
-import { ScenePopup, sceneComponent } from '@hatiolab/things-scene';
-import './three-layout.js';
-import { ThreeContainer } from './three-container.js';
+import { ScenePopup, sceneComponent, ThreeContainer } from '@hatiolab/things-scene';
 import { Stock } from './stock.js';
 const NATURE = {
     mutable: false,
@@ -144,15 +142,19 @@ const NATURE = {
 };
 const WEBGL_NO_SUPPORT_TEXT = 'WebGL no support';
 let Visualizer = class Visualizer extends ThreeContainer {
-    constructor() {
-        super(...arguments);
-        this._objects = {};
-        this._stock_materials = [];
+    _legendTarget;
+    _focused_stock;
+    _objects = {};
+    _stock_materials = [];
+    _default_material;
+    _empty_material;
+    get hideEmptyStock() {
+        return !!this.getState('hideEmptyStock');
     }
     get legendTarget() {
-        var { legendTarget } = this.state;
+        const { legendTarget } = this.state;
         if (!this._legendTarget && legendTarget) {
-            this._legendTarget = this.root.findById(legendTarget);
+            this._legendTarget = this.root.findById?.(legendTarget);
             this._legendTarget && this._legendTarget.on('change', this.onLegendTargetChanged, this);
         }
         return this._legendTarget;
@@ -192,25 +194,14 @@ let Visualizer = class Visualizer extends ThreeContainer {
         if (typeof this.data !== 'object') {
             return;
         }
-        var data = this.data;
-        var locationField = this.getState('locationField') || 'location';
+        let data = this.data;
+        const locationField = this.getState('locationField') || 'location';
         if (data instanceof Array) {
-            /**
-             *  Array type data
-             *  (e.g. data: [{
-             *    'location' : 'A0101-01',
-             *    'description': 'description1',
-             *    ...
-             *  }, {
-             *    ...
-             *  }])
-             */
             data = data.reduce((acc, value, i, arr) => {
-                var location = value[locationField];
+                const location = value[locationField];
                 if (!location) {
                     return acc;
                 }
-                // 하나의 로케이션에 여러 레코드 정보가 올 수 있으므로, 하나이 로케이션의 스탁정보를 items 배열에 담는다.
                 if (acc[location]) {
                     acc[location]['items'].push(value);
                 }
@@ -220,18 +211,10 @@ let Visualizer = class Visualizer extends ThreeContainer {
                 return acc;
             }, {});
         }
-        /**
-         *  Object type data
-         *  (e.g. data: {
-         *    'A0101-01': { items: [{ location: 'A0101-01', qty: 10, description: 'description', ... }, {...}] },
-         *    ...
-         *  })
-         */
-        for (var key in data) {
-            let id = key;
-            if (data.hasOwnProperty(id)) {
-                let d = data[id];
-                let object = this.getObject(id);
+        for (const key in data) {
+            if (data.hasOwnProperty(key)) {
+                const d = data[key];
+                const object = this.getObject(key);
                 if (object) {
                     ;
                     object.onchangeStockData(d);
@@ -244,43 +227,64 @@ let Visualizer = class Visualizer extends ThreeContainer {
             this.resetMaterials();
     }
     onmouseup(e) {
-        var _a;
-        if (this._controls) {
-            if (this._lastFocused) {
-                ;
-                this._lastFocused._focused = false;
-            }
-            const { popupScene, left, top, width, height } = this.state;
-            var ref = popupScene;
-            var pointer = this.transcoordC2S(e.offsetX, e.offsetY);
-            this._mouse.x = ((pointer.x - left) / width) * 2 - 1;
-            this._mouse.y = -((pointer.y - top) / height) * 2 + 1;
-            var object = this.getObjectByRaycast();
-            var realObject = object === null || object === void 0 ? void 0 : object.userData.context;
-            if (realObject) {
-                if (ref && realObject instanceof Stock) {
-                    ;
-                    realObject.onmouseup(e, this, (data) => {
-                        ScenePopup.show(this, ref, {
-                            data,
-                            modal: false,
-                            closable: true,
-                            output: false,
-                            location: this.state.popupPosition || 'right-top'
-                        });
-                    });
+        if (!this.controlsManager.isActive)
+            return;
+        // v10: ThreeContainer 기본 mouseup 처리 (기즈모, 선택 등)
+        super.onmouseup(e);
+        // Visualizer 고유: Stock 클릭 시 팝업 표시
+        const { popupScene } = this.state;
+        if (!popupScene)
+            return;
+        const camera = this.cameraManager.activeCamera;
+        const scene3d = this.sceneManager.scene;
+        if (!camera || !scene3d)
+            return;
+        // InstancedMesh 대응: raycasting 결과에서 instanceId로 Stock 찾기
+        const intersects = this.eventManager.getObjectsByRaycast(camera, scene3d);
+        let clickedStock;
+        for (const hit of intersects) {
+            if (hit.object.isInstancedMesh && hit.instanceId != null) {
+                // InstancedMesh의 부모 Rack에서 Stock 찾기
+                const rackObj3d = hit.object.parent;
+                const rackRealObject = rackObj3d?.userData?.context;
+                if (rackRealObject && 'stocks' in rackRealObject) {
+                    clickedStock = rackRealObject.stocks[hit.instanceId];
                 }
-                ;
-                realObject._focused = true;
-                realObject._focusedAt = performance.now();
-                this._lastFocused = realObject;
-                (_a = realObject.component) === null || _a === void 0 ? void 0 : _a.trigger('click', e);
+                break;
+            }
+            // 개별 mesh 모드 (하위 호환)
+            const realObject = hit.object?.userData?.context;
+            if (realObject && realObject instanceof Stock) {
+                clickedStock = realObject;
+                break;
             }
-            else {
-                ScenePopup.hide(this.root);
+        }
+        if (clickedStock) {
+            // 이전 focused 해제
+            if (this._focused_stock && this._focused_stock !== clickedStock) {
+                this._focused_stock._focused = false;
             }
+            clickedStock._focused = true;
+            clickedStock._focusedAt = performance.now();
+            this._focused_stock = clickedStock;
             this.invalidate();
-            e.stopPropagation();
+            clickedStock.onmouseup(e, this, (data) => {
+                ScenePopup.show(this, popupScene, {
+                    data,
+                    modal: false,
+                    closable: true,
+                    output: false,
+                    location: this.state.popupPosition || 'right-top'
+                });
+            });
+        }
+        else {
+            // 빈 공간 클릭 시 focused 해제
+            if (this._focused_stock) {
+                this._focused_stock._focused = false;
+                delete this._focused_stock;
+            }
+            ScenePopup.hide(this.root);
         }
     }
 };

package/dist/visualizer.js.map

@@ -1 +1 @@
-{"version":3,"file":"visualizer.js","sourceRoot":"","sources":["../src/visualizer.ts"],"names":[],"mappings":"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","sourcesContent":["/*\n * Copyright © HatioLab Inc. All rights reserved.\n */\n\nimport { Component, ScenePopup, Properties, ComponentNature, sceneComponent } from '@hatiolab/things-scene'\nimport * as THREE from 'three'\n\nimport { RealObject } from './threed/real-object.js'\nimport './three-layout.js'\nimport { ThreeContainer } from './three-container.js'\nimport { Stock } from './stock.js'\n\nconst NATURE: ComponentNature = {\n  mutable: false,\n  resizable: true,\n  rotatable: true,\n  properties: [\n    {\n      type: 'number',\n      label: 'fov',\n      name: 'fov',\n      property: 'fov'\n    },\n    {\n      type: 'number',\n      label: 'near',\n      name: 'near',\n      property: 'near'\n    },\n    {\n      type: 'number',\n      label: 'far',\n      name: 'far',\n      property: 'far'\n    },\n    {\n      type: 'number',\n      label: 'zoom',\n      name: 'zoom',\n      property: 'zoom'\n    },\n    {\n      type: 'number',\n      label: 'camera-x',\n      name: 'cameraX'\n    },\n    {\n      type: 'number',\n      label: 'camera-y',\n      name: 'cameraY'\n    },\n    {\n      type: 'number',\n      label: 'camera-z',\n      name: 'cameraZ'\n    },\n    {\n      type: 'select',\n      label: 'precision',\n      name: 'precision',\n      property: {\n        options: [\n          {\n            display: 'High',\n            value: 'highp'\n          },\n          {\n            display: 'Medium',\n            value: 'mediump'\n          },\n          {\n            display: 'Low',\n            value: 'lowp'\n          }\n        ]\n      }\n    },\n    {\n      type: 'checkbox',\n      label: 'anti-alias',\n      name: 'antialias',\n      property: 'antialias'\n    },\n    {\n      type: 'checkbox',\n      label: 'auto-rotate',\n      name: 'autoRotate',\n      property: 'autoRotate'\n    },\n    {\n      type: 'checkbox',\n      label: '3dmode',\n      name: 'threed',\n      property: 'threed'\n    },\n    {\n      type: 'checkbox',\n      label: 'debug',\n      name: 'debug',\n      property: 'debug'\n    },\n    {\n      type: 'string',\n      label: 'location-field',\n      name: 'locationField',\n      placeholder: 'location'\n    },\n    {\n      type: 'board-selector',\n      label: 'popup-scene',\n      name: 'popupScene'\n    },\n    {\n      type: 'id-input',\n      label: 'legend-target',\n      name: 'legendTarget',\n      property: {\n        component: 'legend'\n      }\n    },\n    {\n      type: 'number',\n      label: 'rotation-speed',\n      name: 'rotationSpeed'\n    },\n    {\n      type: 'checkbox',\n      label: 'hide-empty-stock',\n      name: 'hideEmptyStock'\n    },\n    {\n      type: 'select',\n      label: 'popup-position',\n      name: 'popupPosition',\n      property: {\n        options: [\n          { display: '', value: '' },\n          { display: 'CENTER', value: 'center' },\n          { display: 'LEFTTOP', value: 'left-top' },\n          { display: 'RIGHTTOP', value: 'right-top' },\n          { display: 'LEFTBOTTOM', value: 'left-bottom' },\n          { display: 'RIGHTBOTTOM', value: 'right-bottom' }\n        ]\n      }\n    }\n  ],\n  help: 'scene/component/visualizer'\n}\n\nconst WEBGL_NO_SUPPORT_TEXT = 'WebGL no support'\n\n@sceneComponent('visualizer')\nexport class Visualizer extends ThreeContainer {\n  _legendTarget?: Component\n\n  _objects: { [id: string]: RealObject } = {}\n\n  _stock_materials: THREE.Material[] = []\n  _default_material?: THREE.Material /* only for Stock */\n  _empty_material?: THREE.Material /* only for Stock */\n\n  get legendTarget() {\n    var { legendTarget } = this.state\n\n    if (!this._legendTarget && legendTarget) {\n      this._legendTarget = this.root.findById(legendTarget)\n      this._legendTarget && this._legendTarget.on('change', this.onLegendTargetChanged, this)\n    }\n\n    return this._legendTarget\n  }\n\n  putObject(id: string, object: RealObject) {\n    id && (this._objects[id] = object)\n  }\n\n  getObject(id: string): RealObject {\n    return this._objects[id]\n  }\n\n  /* Container Overides .. */\n\n  dispose() {\n    this._legendTarget && this._legendTarget.off('change', this.onLegendTargetChanged, this)\n    delete this._legendTarget\n\n    super.dispose()\n  }\n\n  get nature(): ComponentNature {\n    return NATURE\n  }\n\n  resetMaterials() {\n    this._stock_materials.forEach(m => {\n      if (m.dispose) m.dispose()\n    })\n\n    this._stock_materials = []\n  }\n\n  /* Event Handlers */\n\n  onchange(after: Properties, before: Properties) {\n    if (before.hasOwnProperty('legendTarget') || after.hasOwnProperty('legendTarget')) {\n      this._legendTarget && this._legendTarget.off('change', this.onLegendTargetChanged, this)\n      delete this._legendTarget\n      this.resetMaterials()\n    }\n\n    super.onchange(after, before)\n  }\n\n  onchangeData(): void {\n    if (typeof this.data !== 'object') {\n      return\n    }\n\n    var data = this.data\n    var locationField = this.getState('locationField') || 'location'\n\n    if (data instanceof Array) {\n      /**\n       *  Array type data\n       *  (e.g. data: [{\n       *    'location' : 'A0101-01',\n       *    'description': 'description1',\n       *    ...\n       *  }, {\n       *    ...\n       *  }])\n       */\n\n      data = data.reduce((acc, value, i, arr) => {\n        var location = value[locationField]\n\n        if (!location) {\n          return acc\n        }\n\n        // 하나의 로케이션에 여러 레코드 정보가 올 수 있으므로, 하나이 로케이션의 스탁정보를 items 배열에 담는다.\n        if (acc[location]) {\n          acc[location]['items'].push(value)\n        } else {\n          acc[location] = { items: [value] }\n        }\n\n        return acc\n      }, {})\n    }\n\n    /**\n     *  Object type data\n     *  (e.g. data: {\n     *    'A0101-01': { items: [{ location: 'A0101-01', qty: 10, description: 'description', ... }, {...}] },\n     *    ...\n     *  })\n     */\n    for (var key in data) {\n      let id = key\n      if (data.hasOwnProperty(id)) {\n        let d = data[id]\n        let object = this.getObject(id)\n        if (object) {\n          ;(object as Stock).onchangeStockData(d)\n        }\n      }\n    }\n  }\n\n  onLegendTargetChanged(after: { [key: string]: any }, before: { [key: string]: any }) {\n    if (after.hasOwnProperty('status') && before.hasOwnProperty('status')) this.resetMaterials()\n  }\n\n  onmouseup(e: MouseEvent) {\n    if (this._controls) {\n      if (this._lastFocused) {\n        ;(this._lastFocused as any)._focused = false\n      }\n\n      const { popupScene, left, top, width, height } = this.state\n\n      var ref = popupScene\n      var pointer = this.transcoordC2S(e.offsetX, e.offsetY)\n\n      this._mouse!.x = ((pointer.x - left) / width) * 2 - 1\n      this._mouse!.y = -((pointer.y - top) / height) * 2 + 1\n\n      var object = this.getObjectByRaycast()\n      var realObject = object?.userData.context\n\n      if (realObject) {\n        if (ref && realObject instanceof Stock) {\n          ;(realObject as any).onmouseup(e, this, (data: any) => {\n            ScenePopup.show(this, ref, {\n              data,\n              modal: false,\n              closable: true,\n              output: false,\n              location: this.state.popupPosition || 'right-top'\n            })\n          })\n        }\n\n        ;(realObject as any)._focused = true\n        ;(realObject as any)._focusedAt = performance.now()\n        this._lastFocused = realObject\n        realObject.component?.trigger('click', e)\n      } else {\n        ScenePopup.hide(this.root)\n      }\n\n      this.invalidate()\n\n      e.stopPropagation()\n    }\n  }\n}\n"]}
+{"version":3,"file":"visualizer.js","sourceRoot":"","sources":["../src/visualizer.ts"],"names":[],"mappings":"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","sourcesContent":["/*\n * Copyright © HatioLab Inc. All rights reserved.\n */\n\nimport { Component, ScenePopup, Properties, ComponentNature, sceneComponent, RealObject, ThreeContainer } from '@hatiolab/things-scene'\nimport * as THREE from 'three'\nimport { Stock, type StockMaterialProvider } from './stock.js'\n\nconst NATURE: ComponentNature = {\n  mutable: false,\n  resizable: true,\n  rotatable: true,\n  properties: [\n    {\n      type: 'number',\n      label: 'fov',\n      name: 'fov',\n      property: 'fov'\n    },\n    {\n      type: 'number',\n      label: 'near',\n      name: 'near',\n      property: 'near'\n    },\n    {\n      type: 'number',\n      label: 'far',\n      name: 'far',\n      property: 'far'\n    },\n    {\n      type: 'number',\n      label: 'zoom',\n      name: 'zoom',\n      property: 'zoom'\n    },\n    {\n      type: 'number',\n      label: 'camera-x',\n      name: 'cameraX'\n    },\n    {\n      type: 'number',\n      label: 'camera-y',\n      name: 'cameraY'\n    },\n    {\n      type: 'number',\n      label: 'camera-z',\n      name: 'cameraZ'\n    },\n    {\n      type: 'select',\n      label: 'precision',\n      name: 'precision',\n      property: {\n        options: [\n          {\n            display: 'High',\n            value: 'highp'\n          },\n          {\n            display: 'Medium',\n            value: 'mediump'\n          },\n          {\n            display: 'Low',\n            value: 'lowp'\n          }\n        ]\n      }\n    },\n    {\n      type: 'checkbox',\n      label: 'anti-alias',\n      name: 'antialias',\n      property: 'antialias'\n    },\n    {\n      type: 'checkbox',\n      label: 'auto-rotate',\n      name: 'autoRotate',\n      property: 'autoRotate'\n    },\n    {\n      type: 'checkbox',\n      label: '3dmode',\n      name: 'threed',\n      property: 'threed'\n    },\n    {\n      type: 'checkbox',\n      label: 'debug',\n      name: 'debug',\n      property: 'debug'\n    },\n    {\n      type: 'string',\n      label: 'location-field',\n      name: 'locationField',\n      placeholder: 'location'\n    },\n    {\n      type: 'board-selector',\n      label: 'popup-scene',\n      name: 'popupScene'\n    },\n    {\n      type: 'id-input',\n      label: 'legend-target',\n      name: 'legendTarget',\n      property: {\n        component: 'legend'\n      }\n    },\n    {\n      type: 'number',\n      label: 'rotation-speed',\n      name: 'rotationSpeed'\n    },\n    {\n      type: 'checkbox',\n      label: 'hide-empty-stock',\n      name: 'hideEmptyStock'\n    },\n    {\n      type: 'select',\n      label: 'popup-position',\n      name: 'popupPosition',\n      property: {\n        options: [\n          { display: '', value: '' },\n          { display: 'CENTER', value: 'center' },\n          { display: 'LEFTTOP', value: 'left-top' },\n          { display: 'RIGHTTOP', value: 'right-top' },\n          { display: 'LEFTBOTTOM', value: 'left-bottom' },\n          { display: 'RIGHTBOTTOM', value: 'right-bottom' }\n        ]\n      }\n    }\n  ],\n  help: 'scene/component/visualizer'\n}\n\nconst WEBGL_NO_SUPPORT_TEXT = 'WebGL no support'\n\n@sceneComponent('visualizer')\nexport class Visualizer extends ThreeContainer implements StockMaterialProvider {\n  _legendTarget?: Component\n  _focused_stock?: Stock\n\n  _objects: { [id: string]: RealObject } = {}\n\n  _stock_materials: THREE.Material[] = []\n  _default_material?: THREE.Material\n  _empty_material?: THREE.Material\n\n  get hideEmptyStock(): boolean {\n    return !!this.getState('hideEmptyStock')\n  }\n\n  get legendTarget() {\n    const { legendTarget } = this.state\n\n    if (!this._legendTarget && legendTarget) {\n      this._legendTarget = this.root.findById?.(legendTarget)\n      this._legendTarget && this._legendTarget.on('change', this.onLegendTargetChanged, this)\n    }\n\n    return this._legendTarget\n  }\n\n  putObject(id: string, object: RealObject) {\n    id && (this._objects[id] = object)\n  }\n\n  getObject(id: string): RealObject {\n    return this._objects[id]\n  }\n\n  /* Container Overides .. */\n\n  dispose() {\n    this._legendTarget && this._legendTarget.off('change', this.onLegendTargetChanged, this)\n    delete this._legendTarget\n\n    super.dispose()\n  }\n\n  get nature(): ComponentNature {\n    return NATURE\n  }\n\n  resetMaterials() {\n    this._stock_materials.forEach(m => {\n      if (m.dispose) m.dispose()\n    })\n\n    this._stock_materials = []\n  }\n\n  /* Event Handlers */\n\n  onchange(after: Properties, before: Properties) {\n    if (before.hasOwnProperty('legendTarget') || after.hasOwnProperty('legendTarget')) {\n      this._legendTarget && this._legendTarget.off('change', this.onLegendTargetChanged, this)\n      delete this._legendTarget\n      this.resetMaterials()\n    }\n\n    super.onchange(after, before)\n  }\n\n  onchangeData(): void {\n    if (typeof this.data !== 'object') {\n      return\n    }\n\n    let data = this.data as any\n    const locationField = this.getState('locationField') || 'location'\n\n    if (data instanceof Array) {\n      data = data.reduce((acc, value, i, arr) => {\n        const location = value[locationField]\n\n        if (!location) {\n          return acc\n        }\n\n        if (acc[location]) {\n          acc[location]['items'].push(value)\n        } else {\n          acc[location] = { items: [value] }\n        }\n\n        return acc\n      }, {})\n    }\n\n    for (const key in data) {\n      if (data.hasOwnProperty(key)) {\n        const d = data[key]\n        const object = this.getObject(key)\n        if (object) {\n          ;(object as Stock).onchangeStockData(d)\n        }\n      }\n    }\n  }\n\n  onLegendTargetChanged(after: { [key: string]: any }, before: { [key: string]: any }) {\n    if (after.hasOwnProperty('status') && before.hasOwnProperty('status')) this.resetMaterials()\n  }\n\n  onmouseup(e: MouseEvent) {\n    if (!this.controlsManager.isActive) return\n\n    // v10: ThreeContainer 기본 mouseup 처리 (기즈모, 선택 등)\n    super.onmouseup(e)\n\n    // Visualizer 고유: Stock 클릭 시 팝업 표시\n    const { popupScene } = this.state\n    if (!popupScene) return\n\n    const camera = this.cameraManager.activeCamera\n    const scene3d = this.sceneManager.scene\n    if (!camera || !scene3d) return\n\n    // InstancedMesh 대응: raycasting 결과에서 instanceId로 Stock 찾기\n    const intersects = this.eventManager.getObjectsByRaycast(camera, scene3d)\n    let clickedStock: Stock | undefined\n\n    for (const hit of intersects) {\n      if ((hit.object as any).isInstancedMesh && hit.instanceId != null) {\n        // InstancedMesh의 부모 Rack에서 Stock 찾기\n        const rackObj3d = hit.object.parent\n        const rackRealObject = rackObj3d?.userData?.context\n        if (rackRealObject && 'stocks' in rackRealObject) {\n          clickedStock = (rackRealObject as any).stocks[hit.instanceId]\n        }\n        break\n      }\n      // 개별 mesh 모드 (하위 호환)\n      const realObject = hit.object?.userData?.context\n      if (realObject && realObject instanceof Stock) {\n        clickedStock = realObject\n        break\n      }\n    }\n\n    if (clickedStock) {\n      // 이전 focused 해제\n      if (this._focused_stock && this._focused_stock !== clickedStock) {\n        this._focused_stock._focused = false\n      }\n      clickedStock._focused = true\n      clickedStock._focusedAt = performance.now()\n      this._focused_stock = clickedStock\n      this.invalidate()\n\n      clickedStock.onmouseup(e, this, (data: any) => {\n        ScenePopup.show(this as any, popupScene, {\n          data,\n          modal: false,\n          closable: true,\n          output: false,\n          location: this.state.popupPosition || 'right-top'\n        } as any)\n      })\n    } else {\n      // 빈 공간 클릭 시 focused 해제\n      if (this._focused_stock) {\n        this._focused_stock._focused = false\n        delete this._focused_stock\n      }\n      ScenePopup.hide(this.root as any)\n    }\n  }\n}\n"]}

package/package.json

@@ -2,7 +2,7 @@
   "name": "@operato/scene-visualizer",
   "description": "visualizer component for operato-scene",
   "author": "heartyoh",
-  "version": "9.2.2",
+  "version": "10.0.0-beta.10",
   "type": "module",
   "main": "dist/index.js",
   "module": "dist/index.js",
@@ -10,7 +10,7 @@
   "things-scene": true,
   "publishConfig": {
     "access": "public",
-    "@oprato:registry": "https://registry.npmjs.org"
+    "@operato:registry": "https://registry.npmjs.org"
   },
   "repository": {
     "type": "git",
@@ -22,34 +22,32 @@
     "serve:dev": "npm run serve",
     "start": "tsc && concurrently -k -r \"tsc --watch --preserveWatchOutput\" \"wds\"",
     "build": "tsc",
-    "prepublish": "tsc",
-    "lint": "eslint --ext .ts,.html . --ignore-path .gitignore && prettier \"**/*.ts\" --check --ignore-path .gitignore",
-    "format": "eslint --ext .ts,.html . --fix --ignore-path .gitignore && prettier \"**/*.ts\" --write --ignore-path .gitignore",
+    "prepublishOnly": "tsc",
+    "lint": "eslint src/ && prettier \"src/**/*.ts\" --check",
+    "format": "eslint src/ --fix && prettier \"src/**/*.ts\" --write",
     "migration": "things-factory-migration"
   },
   "dependencies": {
-    "@hatiolab/things-scene": "^9.0.0",
-    "@operato/i18n": "^9.0.0",
+    "@hatiolab/things-scene": "^10.0.0-beta.1",
+    "@operato/i18n": "^10.0.0-beta.1",
     "lit": "^3.1.2",
-    "three": "^0.172.0",
-    "tinycolor2": "^1.6.0"
+    "three": "^0.183.0"
   },
   "devDependencies": {
     "@hatiolab/prettier-config": "^1.0.0",
     "@material/web": "^2.0.0",
-    "@things-factory/builder": "^9.0.0",
-    "@things-factory/operato-board": "^9.0.0",
-    "@types/three": "^0.159.0",
-    "@types/tinycolor2": "^1.4.3",
-    "@typescript-eslint/eslint-plugin": "^4.33.0",
-    "@typescript-eslint/parser": "^4.33.0",
+    "@things-factory/builder": "^10.0.0-beta.1",
+    "@things-factory/operato-board": "^10.0.0-beta.1",
+    "@types/three": "^0.183.0",
+    "@typescript-eslint/eslint-plugin": "^8.0.0",
+    "@typescript-eslint/parser": "^8.0.0",
     "@web/dev-server": "^0.1.28",
     "concurrently": "^8.0.1",
     "eslint": "^9.18.0",
     "eslint-config-prettier": "^10.0.1",
     "husky": "^8.0.3",
-    "lint-staged": "^13.2.2",
-    "prettier": "^2.4.1",
+    "lint-staged": "^15.2.2",
+    "prettier": "^3.2.5",
     "tslib": "^2.3.1",
     "typescript": "^5.0.4"
   },
@@ -65,5 +63,5 @@
       "prettier --write"
     ]
   },
-  "gitHead": "ec08ba2c7c2cfa6c72cc2dc368e5e5927dec4750"
+  "gitHead": "c082970c7de1c9bb9f7a447d2723c0b06dfa8b37"
 }

package/translations/en.json

@@ -16,7 +16,13 @@
   "label.camera-x": "camera X",
   "label.camera-y": "camera Y",
   "label.camera-z": "camera Z",
+  "label.gltf-info": "GLTF Info",
   "label.gltf-file-info": "file info.",
+  "label.fill-targets": "Fill Targets",
+  "label.no-gltf-meshes": "No meshes available",
+  "label.original-ratio": "Original Ratio",
+  "label.fit-ratio": "Fit Ratio",
+  "label.play-targets": "Play Targets",
   "label.gamma-factor": "gamma factor",
   "label.section-digits": "section digits",
   "label.shelf-locations": "shelf locations",

package/translations/ja.json

@@ -16,7 +16,12 @@
   "label.camera-x": "カメラX",
   "label.camera-y": "カメラY",
   "label.camera-z": "カメラZ",
+  "label.gltf-info": "GLTF情報",
   "label.gltf-file-info": "ファイル情報",
+  "label.fill-targets": "カラー適用対象",
+  "label.no-gltf-meshes": "メッシュがありません",
+  "label.original-ratio": "元の比率",
+  "label.fit-ratio": "比率調整",
   "label.gamma-factor": "ガンマ係数",
   "label.section-digits": "セクションの桁数",
   "label.shelf-locations": "棚の位置",

package/translations/ko.json

@@ -16,7 +16,12 @@
   "label.camera-x": "카메라 X",
   "label.camera-y": "카메라 Y",
   "label.camera-z": "카메라 Z",
-  "label.gltf-info": "파일정보",
+  "label.gltf-info": "GLTF 정보",
+  "label.fill-targets": "색상 적용 대상",
+  "label.no-gltf-meshes": "메시가 없습니다",
+  "label.original-ratio": "원본 비율",
+  "label.fit-ratio": "비율 맞춤",
+  "label.play-targets": "재생 대상",
   "label.gamma-factor": "감마 인자",
   "label.section-digits": "섹션 넘버링",
   "label.shelf-locations": "선반 로케이션",

package/translations/ms.json

@@ -16,7 +16,12 @@
   "label.camera-x": "camera X",
   "label.camera-y": "camera Y",
   "label.camera-z": "camera Z",
+  "label.gltf-info": "GLTF Info",
   "label.gltf-file-info": "file info.",
+  "label.fill-targets": "Fill Targets",
+  "label.no-gltf-meshes": "No meshes available",
+  "label.original-ratio": "Original Ratio",
+  "label.fit-ratio": "Fit Ratio",
   "label.gamma-factor": "gamma factor",
   "label.section-digits": "section digits",
   "label.shelf-locations": "shelf locations",

package/translations/zh.json

@@ -16,7 +16,12 @@
   "label.camera-x": "摄像机X",
   "label.camera-y": "摄像机Y",
   "label.camera-z": "摄像机Z",
+  "label.gltf-info": "GLTF信息",
   "label.gltf-file-info": "文件信息",
+  "label.fill-targets": "颜色目标",
+  "label.no-gltf-meshes": "没有可用的网格",
+  "label.original-ratio": "原始比例",
+  "label.fit-ratio": "比例适配",
   "label.gamma-factor": "伽马因子",
   "label.section-digits": "部门数字",
   "label.shelf-locations": "货架位置",

package/dist/banner.d.ts

@@ -1,15 +0,0 @@
-import * as THREE from 'three';
-import { ComponentNature, Shape } from '@hatiolab/things-scene';
-import { RealObject } from './threed/real-object.js';
-export declare class Banner3D extends RealObject {
-    build(): void;
-    createCube(w: number, h: number, d: number): THREE.Mesh<THREE.BoxGeometry, THREE.MeshStandardMaterial, THREE.Object3DEventMap>;
-    createTextureBoard(w: number, h: number): THREE.Mesh<THREE.PlaneGeometry, THREE.MeshStandardMaterial, THREE.Object3DEventMap>;
-}
-declare const Banner_base: typeof Shape;
-export declare class Banner extends Banner_base {
-    is3dish(): boolean;
-    get nature(): ComponentNature;
-    buildRealObject(): RealObject | undefined;
-}
-export {};