@fmsim/machine 2.0.0-beta.12 → 2.0.0-beta.15

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.12",
+  "version": "2.0.0-beta.15",
   "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.12",
+    "@fmsim/api": "^2.0.0-beta.15",
     "@hatiolab/things-scene": "^10.0.0-beta.1"
   },
   "devDependencies": {
@@ -54,5 +55,5 @@
       "prettier --write"
     ]
   },
-  "gitHead": "1471d2752e75cace730894967d7f50717682c51c"
+  "gitHead": "3f3e35585bb26b34ba637ac9d570a325066494b5"
 }

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, 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 || {}
 
@@ -249,6 +283,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/factories/machine-3d.ts

@@ -643,111 +643,9 @@ const CARRIER_CONFIG: MCS3DConfig = {
 }
 
 class CarrierRealObject3D extends MCSRealObject3D {
-  private _animRaf: number | null = null
-  private _animStartTime = 0
-
   constructor(component: Component) {
     super(component, CARRIER_CONFIG)
   }
-
-  build() {
-    super.build()
-    this.startCarrierAnimation()
-  }
-
-  /**
-   * CARRIERSTATUS의 애니메이션 설정을 읽어 3D에서 직접 실행.
-   * things-scene의 delta 시스템과 독립적으로 동작.
-   */
-  private startCarrierAnimation() {
-    this.stopCarrierAnimation()
-
-    const comp = this.component as any
-    if (!comp.app?.isViewMode) return
-
-    const carrierStatus = comp.state?.CARRIERSTATUS
-    if (!carrierStatus) return
-
-    // 애니메이션 설정 가져오기
-    const config = comp.getAnimationConfig?.(carrierStatus)
-    if (!config?.animation) return
-
-    const { type, duration = 2000, scale: animScale = 1.3 } = config.animation
-    if (!type) return
-
-    this._animStartTime = performance.now()
-
-    // 애니메이션 대상: group(object3d) — mesh 개별 변환 대신 group 전체를 변환하여
-    // 회전/스케일 중심이 component의 3D 위치(= 2D 중심)와 정확히 일치하도록 함
-    const obj = this.object3d
-
-    const animate = () => {
-      if (!this._ownMesh) return
-
-      const elapsed = performance.now() - this._animStartTime
-      const progress = (elapsed % duration) / duration // 0~1 반복
-
-      switch (type) {
-        case 'heartbeat': {
-          const t = progress < 0.5 ? progress * 2 : (1 - progress) * 2
-          const s = 1 + (animScale - 1) * t
-          obj.scale.set(s, 1, s)
-          break
-        }
-        case 'rotation': {
-          obj.rotation.y = progress * Math.PI * 2
-          break
-        }
-        case 'vibration': {
-          const theta = config.animation.theta ?? 0.26
-          const current = Math.sin(progress * Math.PI * 2) * theta
-          obj.rotation.y = current
-          break
-        }
-        case 'fade': {
-          const alpha = 0.3 + 0.7 * (progress < 0.5 ? progress * 2 : (1 - progress) * 2)
-          obj.traverse((o: any) => {
-            if (o.material && !o.material.map) {
-              o.material.opacity = alpha
-              o.material.transparent = true
-            }
-          })
-          break
-        }
-      }
-
-      this._animRaf = requestAnimationFrame(animate)
-    }
-
-    this._animRaf = requestAnimationFrame(animate)
-  }
-
-  // 자체 애니메이션이 실행 중이면 things-scene의 syncAnimationDelta 비활성화
-  syncAnimationDelta() {
-    if (!this._animRaf) {
-      super.syncAnimationDelta()
-    }
-  }
-
-  private stopCarrierAnimation() {
-    if (this._animRaf) {
-      cancelAnimationFrame(this._animRaf)
-      this._animRaf = null
-    }
-    // group 스케일/회전 초기화
-    this.object3d.scale.set(1, 1, 1)
-    this.object3d.rotation.y = 0
-  }
-
-  update() {
-    this.stopCarrierAnimation()
-    super.update()
-  }
-
-  clear() {
-    this.stopCarrierAnimation()
-    return super.clear()
-  }
 }
 
 registerRealObjectFactory('Carrier', (component: Component) => new CarrierRealObject3D(component))

package/src/mcs-carrier-holder.ts

@@ -1,7 +1,5 @@
-import { Model, Properties } from '@hatiolab/things-scene'
 import { themesColorMap, themesAnimationMap } from '@fmsim/api'
 import MCSUnit from './mcs-unit.js'
-import Carrier from './carrier.js'
 
 export default class MCSCarrierHolder extends MCSUnit {
   static get properties(): any {
@@ -31,50 +29,56 @@ export default class MCSCarrierHolder extends MCSUnit {
     ]
   }
 
-  carrier?: Carrier | null
-
-  async ready() {
-    super.ready()
+  get showOverflow() {
+    return true
+  }
 
-    for (let component of this.components) {
-      this.removeComponent(component)
+  get hierarchy() {
+    return {
+      ...super.hierarchy,
+      components: []
     }
-
-    const { width, height } = this.state
-
-    this.carrier = Model.compile(
-      {
-        type: 'Carrier',
-        left: 0,
-        top: 0,
-        width,
-        height,
-        showText: this.getState('showCarrierText') || false
-      },
-      this.root.app
-    ) as any
-
-    this.addComponent(this.carrier!)
-
-    this.carrier!.data = this.data
   }
 
   dispose(): void {
-    this.carrier = null
-
+    ;(this.root as any)?.carrierManager?.update(this, {}, this.data)
     super.dispose()
   }
 
-  get hierarchy() {
-    return {
-      ...super.hierarchy,
-      components: []
+  async ready() {
+    super.ready()
+
+    const { CARRIERNAME, CARRIERTYPE = '', EMPTYTYPE, CARRIERSTATUS } = this.data || {}
+    
+    if(CARRIERNAME) {
+      ;(this.root as any).carrierManager.update(this, {
+        CARRIERNAME,
+        CARRIERTYPE,
+        EMPTYTYPE,
+        CARRIERSTATUS
+      }, undefined)
     }
   }
 
   onchangeData(after: Record<string, any>, before: Record<string, any>): void {
-    if (this.carrier) {
-      this.carrier.data = this.data
+    // CARRIERNAME, CARRIERTYPE = '', EMPTYTYPE, CARRIERSTATUS 이 변경되었을 때만 캐리어 관리자에게 알린다.
+    const { CARRIERNAME, CARRIERTYPE = '', EMPTYTYPE, CARRIERSTATUS } = after.data || {}
+    const { CARRIERNAME: beforeCARRIERNAME, CARRIERTYPE: beforeCARRIERTYPE = '', EMPTYTYPE: beforeEMPTYTYPE, CARRIERSTATUS: beforeCARRIERSTATUS } = before.data || {}
+    if(CARRIERNAME !== beforeCARRIERNAME ||
+      CARRIERTYPE !== beforeCARRIERTYPE ||
+      EMPTYTYPE !== beforeEMPTYTYPE ||
+      CARRIERSTATUS !== beforeCARRIERSTATUS) {
+      ;(this.root as any).carrierManager.update(this, {
+        CARRIERNAME,
+        CARRIERTYPE,
+        EMPTYTYPE,
+        CARRIERSTATUS
+      }, {
+        CARRIERNAME: beforeCARRIERNAME,
+        CARRIERTYPE: beforeCARRIERTYPE,
+        EMPTYTYPE: beforeEMPTYTYPE,
+        CARRIERSTATUS: beforeCARRIERSTATUS
+      })
     }
 
     super.onchangeData(after, before)

package/src/scene/root-container-override.ts

@@ -1,6 +1,7 @@
 import { Component, RootContainer } from '@hatiolab/things-scene'
 import { themesColorMap, themesColorRange, themesAnimationMap } from '@fmsim/api'
 import { Legend } from '../features/mcs-status-default'
+import CarrierManager from '../carrier-manager'
 
 // RootContainer 클래스 타입 확장
 declare module '@hatiolab/things-scene' {
@@ -26,6 +27,8 @@ declare module '@hatiolab/things-scene' {
     vehicleAnimation?: boolean
     // 캐시 관련 속성 추가
     _animationConfigCache?: Map<string, any>
+    _carrierManager?: CarrierManager
+    carrierManager: CarrierManager
   }
 }
 
@@ -326,3 +329,12 @@ Object.defineProperty(RootContainer.prototype, 'vehicleAnimation', {
     return !!vehicleAnimation
   }
 })
+
+Object.defineProperty(RootContainer.prototype, 'carrierManager', {
+  get: function () {
+    if (!this._carrierManager) {
+      this._carrierManager = new CarrierManager(this)
+    }
+    return this._carrierManager
+  }
+})