@fmsim/machine 2.0.0-beta.3 → 2.0.0-beta.30

package/jest.config.js

@@ -0,0 +1,10 @@
+module.exports = {
+  rootDir: '../../',
+  roots: ['<rootDir>/packages/machine'],
+  moduleFileExtensions: ['ts', 'tsx', 'js', 'json'],
+  transform: {
+    '^.+\\.tsx?$': 'babel-jest'
+  },
+  testRegex: 'packages/machine/.*\\.test\\.tsx?$',
+  testEnvironment: 'node'
+}

package/package.json

@@ -2,7 +2,7 @@
   "name": "@fmsim/machine",
   "description": "Layout View를 구성하는 설비(machine)들과 유닛을 구현한 모듈입니다.",
   "author": "heartyoh",
-  "version": "2.0.0-beta.3",
+  "version": "2.0.0-beta.30",
   "main": "dist/index.js",
   "module": "dist/index.js",
   "things-scene": true,
@@ -22,10 +22,11 @@
     "prepublish": "tsc; exit 0",
     "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",
+    "test": "jest --config jest.config.js",
     "migration": "things-factory-migration"
   },
   "dependencies": {
-    "@fmsim/api": "^2.0.0-beta.3",
+    "@fmsim/api": "^2.0.0-beta.29",
     "@hatiolab/things-scene": "^10.0.0-beta.1"
   },
   "devDependencies": {
@@ -54,5 +55,5 @@
       "prettier --write"
     ]
   },
-  "gitHead": "29cf1d4f43eb48dc030aaeb188f2dce65ecff95f"
+  "gitHead": "e411167ccba03a7da574b27730922fd699298dc6"
 }

package/src/carrier-manager.ts

@@ -0,0 +1,116 @@
+import { Model } from '@hatiolab/things-scene'
+import type Carrier from './carrier'
+import type MCSCarrierHolder from './mcs-carrier-holder'
+
+const DYING_TIMEOUT = 1000
+
+export default class CarrierManager {
+  private carriers: Map<string, Carrier> = new Map()
+  private dyingTimers: Map<string, ReturnType<typeof setTimeout>> = new Map()
+  private root: any
+
+  constructor(root: any) {
+    this.root = root
+  }
+
+  get(carrierName: string): Carrier | undefined {
+    return this.carriers.get(carrierName)
+  }
+
+  update(holder: MCSCarrierHolder, after: Record<string, any>, before: Record<string, any>): void {
+    const afterName = after?.CARRIERNAME
+    const beforeName = before?.CARRIERNAME
+
+    // 이전에는 캐리어가 있었는데 새 데이터에는 없다 → dying 후보
+    if (beforeName && (beforeName !== afterName || !afterName)) {
+      const carrier = this.carriers.get(beforeName)
+      if (carrier && carrier.parent === holder) {
+        this.scheduleDying(beforeName)
+      }
+      return
+    }
+
+    if (!afterName) {
+      return
+    }
+
+    // dying 상태면 구출
+    const wasDying = this.dyingTimers.has(afterName)
+    this.cancelDying(afterName)
+
+    const { width, height } = holder.state
+    let carrier = this.carriers.get(afterName)
+
+    if (!carrier) {
+      // 새로 생성
+      carrier = Model.compile(
+        {
+          id: afterName,
+          type: 'Carrier',
+          left: 0,
+          top: 0,
+          width,
+          height,
+          showText: holder.getState('showCarrierText') || false
+        },
+        this.root.app
+      ) as unknown as Carrier
+
+      this.carriers.set(afterName, carrier)
+      holder.addComponent(carrier, { silent: true })
+    } else if (carrier.parent !== holder && (!beforeName && afterName)) {
+      // CARRIERNAME이 새로 나타남 (이전엔 없었음) → 다른 holder로 이동
+      ;(holder as any).reparent(carrier, { animated: true, duration: 2000, ease: 'inout' })
+    }
+
+    if (carrier.parent === holder) {
+      carrier.data = after
+    }
+  }
+
+  private scheduleDying(carrierName: string): void {
+    this.cancelDying(carrierName)
+
+    const timer = setTimeout(() => {
+      this.dyingTimers.delete(carrierName)
+
+      const carrier = this.carriers.get(carrierName)
+      if (carrier) {
+        this.carriers.delete(carrierName)
+        if (!carrier.disposed) {
+          carrier.removeSelf(true)
+        }
+      }
+    }, DYING_TIMEOUT)
+
+    this.dyingTimers.set(carrierName, timer)
+  }
+
+  private cancelDying(carrierName: string): void {
+    const timer = this.dyingTimers.get(carrierName)
+    if (timer) {
+      clearTimeout(timer)
+      this.dyingTimers.delete(carrierName)
+    }
+  }
+
+  onCarrierDisposed(carrierName: string): void {
+    this.cancelDying(carrierName)
+    this.carriers.delete(carrierName)
+  }
+
+  dispose(): void {
+    for (const timer of this.dyingTimers.values()) {
+      clearTimeout(timer)
+    }
+    this.dyingTimers.clear()
+
+    for (const carrier of this.carriers.values()) {
+      if (!carrier.disposed) {
+        carrier.removeSelf(true)
+      }
+    }
+
+    this.carriers.clear()
+  }
+}

package/src/carrier.ts

@@ -37,6 +37,40 @@ export default class Carrier extends MCSStatusMixin(ParentObjectMixin(Shape)) {
 
   set path(path) {}
 
+
+  added(parent: any) {
+    super.added(parent)
+
+    // 새 부모에 맞춰 크기 및 상태 갱신
+    if (parent) {
+      const { width, height } = parent.state || {}
+      if (width && height) {
+        this.set({ width, height })
+      }
+    }
+
+    this.syncStateFromData()
+
+    // 3D 오브젝트 최초 생성 (동기적 — reparent()에서 _realObject 필요)
+    if ((this.root as any)?.threed && !this._realObject) {
+      ;(this.root as any).model_layer?._threeCapability?.addObject(this)
+    }
+
+    // reparent 애니메이션은 things-scene의 reparent()가 처리
+  }
+
+  /**
+   * data로부터 carrier 상태를 동기화 (생성 시, 부모 변경 시 공통 사용)
+   */
+  private syncStateFromData(): void {
+    const { CARRIERNAME, CARRIERTYPE = '', EMPTYTYPE, CARRIERSTATUS } = this.data || {}
+
+    this.setState('id', CARRIERNAME)
+    this.setState('EMPTYTYPE', EMPTYTYPE)
+    this.setState('CARRIERTYPE', CARRIERTYPE)
+    this.setState('CARRIERSTATUS', CARRIERSTATUS)
+  }
+
   onchangeData(after: Record<string, any>, before: Record<string, any>): void {
     const { CARRIERNAME, CARRIERTYPE = '', EMPTYTYPE, CARRIERSTATUS } = this.data || {}
 
@@ -46,7 +80,7 @@ export default class Carrier extends MCSStatusMixin(ParentObjectMixin(Shape)) {
     this.setState('CARRIERSTATUS', CARRIERSTATUS)
 
     // TODO carrierstatus에 따라서 매핑되는 애니메이션 테마 수행
-    if (after.data.CARRIERSTATUS !== before.data?.CARRIERSTATUS) {
+    if (after.data?.CARRIERSTATUS !== before.data?.CARRIERSTATUS) {
       const { CARRIERSTATUS: lastCarrierStatus } = before.data || {}
       const lastAnimationConfig = lastCarrierStatus && this.getAnimationConfig(lastCarrierStatus)
 
@@ -129,16 +163,22 @@ export default class Carrier extends MCSStatusMixin(ParentObjectMixin(Shape)) {
       }
 
       // 캐시에 없으면 파싱하고 저장
-      const theme = (this.root as any)?.style[carrierAnimationName]
+      let theme = (this.root as any)?.style?.[carrierAnimationName]
       if (theme) {
+        // theme이 string이면 먼저 파싱
+        if (typeof theme === 'string') {
+          try { theme = JSON5.parse(theme) } catch { return ANIMATION_DEFAULT }
+        }
+        if (typeof theme !== 'object' || theme === null) return ANIMATION_DEFAULT
+
         // 문자열 형태의 설정들을 미리 파싱
         const parsedTheme = {}
         for (const [status, config] of Object.entries(theme)) {
-          if (typeof config === 'string') {
+          if (typeof config === 'string' && config.trim()) {
             try {
               parsedTheme[status] = JSON5.parse(config)
             } catch (e) {
-              console.error('JSON5 parse error:', e)
+              console.error('JSON5 parse error:', e, 'input:', JSON.stringify(config), 'status:', status, 'theme:', carrierAnimationName)
               parsedTheme[status] = config
             }
           } else {
@@ -249,6 +289,12 @@ export default class Carrier extends MCSStatusMixin(ParentObjectMixin(Shape)) {
     }
   }
 
+  dispose(): void {
+    ;(this.root as any)?._carrierManager?.onCarrierDisposed(this.state.id)
+
+    super.dispose()
+  }
+
   async detailInfo() {
     const { type, id } = this.state
 

package/src/conveyor-join.ts

@@ -119,8 +119,11 @@ export default class ConveyorJoin extends ConveyorMixin(MCSTransport) {
     if (normx * normx + normy * normy < 0.25 && ratiox * ratiox + ratioy * ratioy > 0.25) {
       const angle = normalizeAngle(Math.atan2(-normy, normx) - Math.PI / 2)
 
-      if (angle >= startAngle && angle <= endAngle) {
-        return true
+      if (startAngle <= endAngle) {
+        if (angle >= startAngle && angle <= endAngle) return true
+      } else {
+        // wraparound: startAngle > endAngle (예: π → 0)
+        if (angle >= startAngle || angle <= endAngle) return true
       }
     }
 

package/src/conveyor.ts

@@ -14,6 +14,14 @@ const NATURE: ComponentNature = {
         options: ['', 'conveyor', 'belt', 'rail']
       }
     },
+    {
+      type: 'select',
+      label: 'conveyor-orientation',
+      name: 'orientation',
+      property: {
+        options: ['', 'horizontal', 'vertical']
+      }
+    },
     ...MCSTransport.properties
   ]
 }

package/src/factories/agv-3d.ts

@@ -15,7 +15,7 @@
 
 import * as THREE from 'three'
 import { RoundedBoxGeometry } from 'three/examples/jsm/geometries/RoundedBoxGeometry.js'
-import { RealObjectGroup, registerRealObjectFactory } from '@hatiolab/things-scene'
+import { RealObjectGroup, registerRealObjectFactory, disposeObject3D } from '@hatiolab/things-scene'
 import type { Component } from '@hatiolab/things-scene'
 import { TRANSPORT_SURFACE_HEIGHT } from './machine-3d.js'
 
@@ -24,6 +24,7 @@ const PLATFORM_COLOR = 0x333333
 const DEFAULT_BODY_COLOR = 0x6688cc
 
 export class AGV3D extends RealObjectGroup {
+  private _ownMeshes: THREE.Mesh[] = []
   get effectiveDepth(): number {
     const { depth } = this.component.state
     return depth || TRANSPORT_SURFACE_HEIGHT
@@ -40,14 +41,14 @@ export class AGV3D extends RealObjectGroup {
     //    '#F0F0F0'은 상태 미설정 시 기본 fallback — 무시하고 defaultColor 사용
     try {
       const sc = comp.statusColor
-      if (typeof sc === 'string' && sc && sc.toUpperCase() !== '#F0F0F0') return new THREE.Color(sc).getHex()
+      if (typeof sc === 'string' && sc && sc.toUpperCase() !== '#F0F0F0' && sc !== 'transparent') return new THREE.Color(sc).getHex()
     } catch {
       /* statusColor 미구현 시 무시 */
     }
 
     // 2) state.fillStyle fallback
     const { fillStyle } = this.component.state
-    if (fillStyle && typeof fillStyle === 'string') {
+    if (fillStyle && typeof fillStyle === 'string' && fillStyle !== 'transparent') {
       try {
         return new THREE.Color(fillStyle).getHex()
       } catch {
@@ -88,7 +89,6 @@ export class AGV3D extends RealObjectGroup {
     bumper.position.y = bumperH / 2
     bumper.castShadow = true
     bumper.receiveShadow = true
-    this.object3d.add(bumper)
 
     // ── 본체 (둥근 모서리, statusColor 적용) ──
     const bodyColor = this.resolveColor()
@@ -102,7 +102,6 @@ export class AGV3D extends RealObjectGroup {
     body.position.y = bumperH + bodyH / 2
     body.castShadow = true
     body.receiveShadow = true
-    this.object3d.add(body)
 
     // ── 상단 플랫폼 (본체보다 안쪽, 어두운색) ──
     const platInset = Math.min(w, h) * 0.04
@@ -117,17 +116,46 @@ export class AGV3D extends RealObjectGroup {
     plat.position.y = bumperH + bodyH + gapH + platH / 2
     plat.castShadow = true
     plat.receiveShadow = true
-    this.object3d.add(plat)
+
+    this._ownMeshes = [bumper, body, plat]
+    for (const m of this._ownMeshes) this.object3d.add(m)
   }
 
   updateDimension() {}
-  updateAlpha() {}
+
+  update() {
+    // 자신의 mesh만 제거 (Carrier 등 자식 컴포넌트 3D 보존)
+    for (const m of this._ownMeshes) {
+      this.object3d.remove(m)
+      disposeObject3D(m)
+    }
+    this._ownMeshes = []
+
+    this.build()
+    this.updateTransform()
+    this.updateAlpha()
+    this.updateHidden()
+  }
+
+  updateAlpha() {
+    const { alpha = 1 } = this.component.state
+    for (const m of this._ownMeshes) {
+      const materials = Array.isArray(m.material) ? m.material : [m.material]
+      for (const mat of materials) {
+        ;(mat as THREE.MeshStandardMaterial).opacity = alpha
+        ;(mat as THREE.MeshStandardMaterial).transparent = alpha < 1
+      }
+    }
+  }
 
   onchange(after: Record<string, unknown>, before: Record<string, unknown>) {
-    if ('width' in after || 'height' in after || 'depth' in after || 'fillStyle' in after || 'strokeStyle' in after) {
+    if ('width' in after || 'height' in after || 'depth' in after ||
+        'fillStyle' in after || 'strokeStyle' in after || 'id' in after ||
+        'EMPTYTYPE' in after || 'CARRIERSTATUS' in after) {
       this.update()
       return
     }
+
     super.onchange(after, before)
   }
 }