npm - @fmsim/board - Versions diffs - 2.0.0-beta.11 → 2.0.0-beta.111 - Mend

@fmsim/board 2.0.0-beta.11 → 2.0.0-beta.111

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (126) hide show

package/dist/src/modeller/scene-viewer/ox-scene-viewer.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ox-scene-viewer.js","sourceRoot":"","sources":["../../../../src/modeller/scene-viewer/ox-scene-viewer.ts"],"names":[],"mappings":"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","sourcesContent":["import './confidential-overlay'\nimport './ox-scene-layer'\nimport './ox-scene-handler'\n\nimport { css, html, LitElement, PropertyValues } from 'lit'\nimport { customElement, property } from 'lit/decorators.js'\n\nimport { Component, create as createScene, FITMODE, Model, Properties, Scene, SCENE_MODE, SceneMode } from '@hatiolab/things-scene'\n\nimport OxSceneLayer from './ox-scene-layer'\n\n@customElement('ox-scene-viewer')\nexport default class OxSceneViewer extends LitElement {\n static styles = css`\n :host {\n outline: none;\n }\n `\n\n @property({ type: Object }) scene: Scene \| null = null\n @property({ type: Object }) model?: Model\n /* Scene Mode - mode 0 : view mode, mode 1 : edit mode, mode 2 : shift mode /\n @property({ type: Number }) mode: SceneMode = SCENE_MODE.VIEW\n @property({ type: Number }) screenSize: number = 13.3\n @property({ type: Object }) variables: Properties = {}\n @property({ type: Object }) data: any\n @property({ type: Object }) themes?: any\n /\n * 캔바스에 모델을 어떻게 적절하게 보여줄 것인지를 설정한다.\n \n @none 가로, 세로 스케일을 1로 고정하고, {0, 0}좌표로 translate시킨다.\n * @both 캔바스에 모델을 꼭 채우도록 가로, 세로 스케일을 조정하고, {0, 0}좌표로 translate시킨다.\n * @width 캔바스의 폭에 모델의 폭을 일치하도록 가로, 세로 스케일을 동일하게 조정하고, {0, 0}좌표로 translate시킨다.\n * @height 캔바스의 높이에 모델의 높이를 일치하도록 가로, 세로 스케일을 동일하게 조정하고, {0, 0}좌표로 translate시킨다.\n * @center 가로, 세로 스케일을 1로 고정하고 모델이 화면의 중앙에 위치하도록 translate시킨다.\n * @ratio 모델의 모든 부분이 캔바스에 최대 크기로 표현될 수 있도록 가로, 세로 동일한 스케일로 조정하고, {0, 0}좌표로 translate시킨다.\n /\n @property({ type: String }) fit: FITMODE = 'none'\n @property({ type: Array }) selected: Component[] = []\n @property({ type: Boolean }) disposeWhenDetached: boolean = false\n @property({ type: String }) baseUrl: string = ''\n @property({ type: Object }) provider: any\n @property({ type: String }) name: string = 'noname'\n @property({ type: Boolean }) enableInspector: boolean = true\n @property({ type: Boolean }) showInspector: boolean = false\n\n private lastOffsetWidth?: number\n\n disconnectedCallback() {\n super.disconnectedCallback()\n\n if (this.scene && this.disposeWhenDetached) {\n this._disposeScene()\n }\n }\n\n render() {\n return html` <slot></slot> `\n }\n\n updated(change: PropertyValues<this>) {\n change.has('model') && this._onModelChanged(this.model)\n change.has('mode') && this._onModeChanged(this.mode)\n change.has('screenSize') && this._onDisplayChanged(this.screenSize)\n change.has('data') && this._onDataChanged(this.data)\n change.has('baseUrl') && this._onBaseUrlChanged(this.baseUrl)\n }\n\n _setScene(scene: Scene \| null) {\n this.scene = scene\n this.dispatchEvent(\n new CustomEvent('scene-changed', {\n bubbles: true,\n composed: true,\n detail: { value: scene }\n })\n )\n }\n\n _setMode(mode: SceneMode) {\n this.mode = mode\n this.dispatchEvent(\n new CustomEvent('mode-changed', {\n bubbles: true,\n composed: true,\n detail: { value: mode }\n })\n )\n }\n\n _setVariables(variables: Properties) {\n this.variables = variables\n this.dispatchEvent(\n new CustomEvent('variables-changed', {\n bubbles: true,\n composed: true,\n detail: { value: variables }\n })\n )\n }\n\n _setSelected(selected: Component[]) {\n this.selected = selected\n this.dispatchEvent(\n new CustomEvent('selected-changed', {\n bubbles: true,\n composed: true,\n detail: { value: selected }\n })\n )\n }\n\n _disposeScene() {\n if (this.scene) {\n this.scene.off('selected', this._onSelectedChanged, this)\n this.scene.off('mode', this._onSceneModeChanged, this)\n\n if (this.provider) {\n this.scene.release && this.scene.release()\n } else {\n this.scene.dispose()\n }\n\n this._setScene(null)\n this._setSelected([])\n }\n }\n\n resize(force: boolean) {\n if (typeof this.scene == 'object') {\n if (force \|\| this.fit === 'both' \|\| Math.abs(this.offsetWidth - (this.lastOffsetWidth \|\| 0)) >= 1) {\n requestAnimationFrame(() => {\n if (this.scene) {\n this.scene.resize()\n this.scene.fit(this.fit)\n }\n })\n }\n\n this.lastOffsetWidth = this.offsetWidth\n }\n }\n\n _onModelChanged(model?: Model) {\n this._disposeScene()\n\n if (!model) {\n return\n }\n\n const layers = Array.from(this.querySelectorAll('ox-scene-layer')).map(layer => (layer as OxSceneLayer).getModel())\n\n const handlers = Array.from(this.querySelectorAll('ox-scene-handler')).map(handler => handler.getAttribute('type')).filter((t): t is string => t !== null)\n\n this._setScene(\n createScene({\n target: this,\n model: JSON.parse(JSON.stringify(model)),\n style: this.themes,\n layers,\n handlers,\n mode: this.mode,\n refProvider: this.provider\n })\n )\n\n if (this.provider) {\n this.provider.add(this.name, this.scene)\n }\n\n this.scene!.screen = this.screenSize\n\n / 이 컴포넌트의 폭이 값을 가지고 있으면 - 화면상에 자리를 잡고 보여지고 있음을 의미한다.\n * 이 때는 정상적으로 그려주고,\n * 그렇지 않으면, 다음 Resize Handling시에 처리하도록 한다.\n /\n this.resize(true)\n\n this._setVariables(model.variables \|\| {})\n\n this.scene!.on('selected', this._onSelectedChanged, this)\n this.scene!.on('mode', this._onSceneModeChanged, this)\n\n this._onModeChanged(this.mode)\n this._onDisplayChanged(this.screenSize)\n this._onBaseUrlChanged(this.baseUrl)\n\n this.focus()\n }\n\n _onDisplayChanged(screenSize: string \| number) {\n if (!this.scene) {\n return\n }\n\n if (screenSize) {\n this.scene.screen = parseFloat(String(screenSize))\n }\n }\n\n _onModeChanged(mode: SceneMode) {\n if (!this.scene) {\n return\n }\n this.scene.mode = Number(mode)\n }\n\n _onDataChanged(data: any) {\n if (!this.scene \|\| !data) {\n return\n }\n\n this.scene.data = data\n }\n\n _onSelectedChanged(after: Component[]) {\n /\n scene 컴포넌트의 속성을 속성 에디터(input box등)에서 변경하다가,\n scene의 다른 컴포넌트를 클릭해서 포커스(선택) 컴포넌트를 변경하게되면,\n 속성 에디터(input box등)의 value change 이벤트의 처리와 충돌(레이스)하게된다.\n \n 기대하는 순서는 먼저 속성 에디터의 value change 이벤트를 처리한 후에,\n selected 이벤트를 처리할 수 있도록 requestAnimationFrame으로 한 프레임을 지연하도록 하였다.\n */\n requestAnimationFrame(() => {\n this._setSelected(after)\n })\n }\n\n _onSceneModeChanged(after: SceneMode) {\n if (!this.scene) {\n return\n }\n\n if (this.mode !== after) {\n this._setMode(after)\n }\n\n if (after === 2) {\n this.style.cursor = 'all-scroll'\n } else if (after === 3) {\n this.style.cursor = 'crosshair'\n } else {\n this.style.cursor = 'default'\n }\n }\n\n _onBaseUrlChanged(after: string) {\n if (!this.scene) {\n return\n }\n\n this.scene.baseUrl = after\n }\n}\n"]}
1	+ {"version":3,"file":"ox-scene-viewer.js","sourceRoot":"","sources":["../../../../src/modeller/scene-viewer/ox-scene-viewer.ts"],"names":[],"mappings":"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","sourcesContent":["import './confidential-overlay'\nimport './ox-scene-layer'\nimport './ox-scene-handler'\n\nimport { css, html, LitElement, PropertyValues } from 'lit'\nimport { customElement, property } from 'lit/decorators.js'\n\nimport { Component, create as createScene, FITMODE, LoadTracker, Model, Properties, Scene, SCENE_MODE, SceneMode } from '@hatiolab/things-scene'\n\nimport OxSceneLayer from './ox-scene-layer'\n\n@customElement('ox-scene-viewer')\nexport default class OxSceneViewer extends LitElement {\n static styles = css`\n :host {\n outline: none;\n }\n `\n\n @property({ type: Object }) scene: Scene \| null = null\n @property({ type: Object }) model?: Model\n /* Scene Mode - mode 0 : view mode, mode 1 : edit mode, mode 2 : shift mode /\n @property({ type: Number }) mode: SceneMode = SCENE_MODE.VIEW\n @property({ type: Number }) screenSize: number = 13.3\n @property({ type: Object }) variables: Properties = {}\n @property({ type: Object }) data: any\n @property({ type: Object }) themes?: any\n /\n * 캔바스에 모델을 어떻게 적절하게 보여줄 것인지를 설정한다.\n \n @none 가로, 세로 스케일을 1로 고정하고, {0, 0}좌표로 translate시킨다.\n * @both 캔바스에 모델을 꼭 채우도록 가로, 세로 스케일을 조정하고, {0, 0}좌표로 translate시킨다.\n * @width 캔바스의 폭에 모델의 폭을 일치하도록 가로, 세로 스케일을 동일하게 조정하고, {0, 0}좌표로 translate시킨다.\n * @height 캔바스의 높이에 모델의 높이를 일치하도록 가로, 세로 스케일을 동일하게 조정하고, {0, 0}좌표로 translate시킨다.\n * @center 가로, 세로 스케일을 1로 고정하고 모델이 화면의 중앙에 위치하도록 translate시킨다.\n * @ratio 모델의 모든 부분이 캔바스에 최대 크기로 표현될 수 있도록 가로, 세로 동일한 스케일로 조정하고, {0, 0}좌표로 translate시킨다.\n /\n @property({ type: String }) fit: FITMODE = 'none'\n @property({ type: Array }) selected: Component[] = []\n @property({ type: Boolean }) disposeWhenDetached: boolean = false\n @property({ type: String }) baseUrl: string = ''\n @property({ type: Object }) provider: any\n @property({ type: Object }) loadTracker?: LoadTracker\n @property({ type: String }) name: string = 'noname'\n @property({ type: Boolean }) enableInspector: boolean = true\n @property({ type: Boolean }) showInspector: boolean = false\n\n private lastOffsetWidth?: number\n\n disconnectedCallback() {\n super.disconnectedCallback()\n\n if (this.scene && this.disposeWhenDetached) {\n this._disposeScene()\n }\n }\n\n render() {\n return html` <slot></slot> `\n }\n\n updated(change: PropertyValues<this>) {\n change.has('model') && this._onModelChanged(this.model)\n change.has('mode') && this._onModeChanged(this.mode)\n change.has('screenSize') && this._onDisplayChanged(this.screenSize)\n change.has('data') && this._onDataChanged(this.data)\n change.has('baseUrl') && this._onBaseUrlChanged(this.baseUrl)\n }\n\n _setScene(scene: Scene \| null) {\n this.scene = scene\n this.dispatchEvent(\n new CustomEvent('scene-changed', {\n bubbles: true,\n composed: true,\n detail: { value: scene }\n })\n )\n }\n\n _setMode(mode: SceneMode) {\n this.mode = mode\n this.dispatchEvent(\n new CustomEvent('mode-changed', {\n bubbles: true,\n composed: true,\n detail: { value: mode }\n })\n )\n }\n\n _setVariables(variables: Properties) {\n this.variables = variables\n this.dispatchEvent(\n new CustomEvent('variables-changed', {\n bubbles: true,\n composed: true,\n detail: { value: variables }\n })\n )\n }\n\n _setSelected(selected: Component[]) {\n this.selected = selected\n this.dispatchEvent(\n new CustomEvent('selected-changed', {\n bubbles: true,\n composed: true,\n detail: { value: selected }\n })\n )\n }\n\n _disposeScene() {\n if (this.scene) {\n this.scene.off('selected', this._onSelectedChanged, this)\n this.scene.off('mode', this._onSceneModeChanged, this)\n\n if (this.provider) {\n this.scene.release && this.scene.release()\n } else {\n this.scene.dispose()\n }\n\n this._setScene(null)\n this._setSelected([])\n }\n }\n\n resize(force: boolean) {\n if (typeof this.scene == 'object') {\n if (force \|\| this.fit === 'both' \|\| Math.abs(this.offsetWidth - (this.lastOffsetWidth \|\| 0)) >= 1) {\n requestAnimationFrame(() => {\n if (this.scene) {\n this.scene.resize()\n this.scene.fit(this.fit)\n }\n })\n }\n\n this.lastOffsetWidth = this.offsetWidth\n }\n }\n\n _onModelChanged(model?: Model) {\n this._disposeScene()\n\n if (!model) {\n return\n }\n\n const layers = Array.from(this.querySelectorAll('ox-scene-layer')).map(layer => (layer as OxSceneLayer).getModel())\n\n const handlers = Array.from(this.querySelectorAll('ox-scene-handler')).map(handler => handler.getAttribute('type')).filter((t): t is string => t !== null)\n\n this._setScene(\n createScene({\n target: this,\n model: JSON.parse(JSON.stringify(model)),\n style: this.themes,\n layers,\n handlers,\n mode: this.mode,\n refProvider: this.provider,\n loading: this.loadTracker ? { tracker: this.loadTracker } : undefined\n })\n )\n\n if (this.provider) {\n this.provider.add(this.name, this.scene)\n }\n\n this.scene!.screen = this.screenSize\n\n / 이 컴포넌트의 폭이 값을 가지고 있으면 - 화면상에 자리를 잡고 보여지고 있음을 의미한다.\n * 이 때는 정상적으로 그려주고,\n * 그렇지 않으면, 다음 Resize Handling시에 처리하도록 한다.\n /\n this.resize(true)\n\n this._setVariables(model.variables \|\| {})\n\n this.scene!.on('selected', this._onSelectedChanged, this)\n this.scene!.on('mode', this._onSceneModeChanged, this)\n\n this._onModeChanged(this.mode)\n this._onDisplayChanged(this.screenSize)\n this._onBaseUrlChanged(this.baseUrl)\n\n this.focus()\n }\n\n _onDisplayChanged(screenSize: string \| number) {\n if (!this.scene) {\n return\n }\n\n if (screenSize) {\n this.scene.screen = parseFloat(String(screenSize))\n }\n }\n\n _onModeChanged(mode: SceneMode) {\n if (!this.scene) {\n return\n }\n this.scene.mode = Number(mode)\n }\n\n _onDataChanged(data: any) {\n if (!this.scene \|\| !data) {\n return\n }\n\n this.scene.data = data\n }\n\n _onSelectedChanged(after: Component[]) {\n /\n scene 컴포넌트의 속성을 속성 에디터(input box등)에서 변경하다가,\n scene의 다른 컴포넌트를 클릭해서 포커스(선택) 컴포넌트를 변경하게되면,\n 속성 에디터(input box등)의 value change 이벤트의 처리와 충돌(레이스)하게된다.\n \n 기대하는 순서는 먼저 속성 에디터의 value change 이벤트를 처리한 후에,\n selected 이벤트를 처리할 수 있도록 requestAnimationFrame으로 한 프레임을 지연하도록 하였다.\n */\n requestAnimationFrame(() => {\n this._setSelected(after)\n })\n }\n\n _onSceneModeChanged(after: SceneMode) {\n if (!this.scene) {\n return\n }\n\n if (this.mode !== after) {\n this._setMode(after)\n }\n\n if (after === 2) {\n this.style.cursor = 'all-scroll'\n } else if (after === 3) {\n this.style.cursor = 'crosshair'\n } else {\n this.style.cursor = 'default'\n }\n }\n\n _onBaseUrlChanged(after: string) {\n if (!this.scene) {\n return\n }\n\n this.scene.baseUrl = after\n }\n}\n"]}

package/dist/src/ox-board-component-info.d.ts CHANGED Viewed

@@ -6,6 +6,7 @@ import { LitElement, PropertyValues } from 'lit';
 export declare class BoardComponentInfo extends LitElement {
     static styles: import("lit").CSSResult[];
     component?: any;
+    playbackMode: boolean;
     detailInfo?: any;
     collapsed: boolean;
     loading: boolean;

package/dist/src/ox-board-component-info.js CHANGED Viewed

@@ -7,9 +7,46 @@ import { css, html, LitElement, nothing } from 'lit';
 import { customElement, property, state } from 'lit/decorators.js';
 import { ScrollbarStyles } from '@operato/styles';
 import { i18next } from '@operato/i18n';
+/**
+ * info panel 의 *value 셀* 렌더링. 1차 표시는 plain string 인데, multiCarriers
+ * 같이 *object array* 가 들어오면 `[object Object]` 로 뭉개진다.
+ *
+ *   - MULTICARRIERS: array of carrier info object → 각 항목을 한 줄씩
+ *     "CARRIERNAME (CARRIERTYPE / EMPTYTYPE)" 형식으로 (데이터 키는 모두 대문자 전제)
+ *   - 그 외 object/array → JSON 한 줄
+ *   - primitive → 그대로
+ */
+function formatCarrierItem(item) {
+    var _a, _b;
+    if (!item || typeof item !== 'object')
+        return String(item);
+    const name = (_b = (_a = item.CARRIERNAME) !== null && _a !== void 0 ? _a : item.CARRIERID) !== null && _b !== void 0 ? _b : '';
+    const meta = [item.CARRIERTYPE, item.EMPTYTYPE].filter(Boolean).join(' / ');
+    return meta ? `${name} (${meta})` : name;
+}
+function renderInfoValue(key, value) {
+    // MULTICARRIERS 는 객체(배열) 또는 JSON 문자열로 올 수 있음 — 문자열이면 파싱해서 표시.
+    if (key === 'MULTICARRIERS' && typeof value === 'string') {
+        try {
+            value = JSON.parse(value);
+        }
+        catch ( /* 파싱 실패 시 원문 표시 */_a) { /* 파싱 실패 시 원문 표시 */ }
+    }
+    if (Array.isArray(value)) {
+        if (key === 'MULTICARRIERS') {
+            return html `${value.map(item => html `<div>${formatCarrierItem(item)}</div>`)}`;
+        }
+        return html `${value.map((v, i) => html `<div>${i}: ${typeof v === 'object' ? JSON.stringify(v) : String(v)}</div>`)}`;
+    }
+    if (value !== null && typeof value === 'object') {
+        return JSON.stringify(value);
+    }
+    return value === null || value === undefined ? '' : String(value);
+}
 let BoardComponentInfo = class BoardComponentInfo extends LitElement {
     constructor() {
         super(...arguments);
+        this.playbackMode = false;
         this.collapsed = false;
         this.loading = false;
         this.dragEndHandler = this.onDragEnd.bind(this);
@@ -103,7 +140,7 @@ let BoardComponentInfo = class BoardComponentInfo extends LitElement {
                 ${infos.map(([key, value]) => html `
                     <tr>
                       <td subTh>${key}</td>
-                      <td>${value}</td>
+                      <td>${renderInfoValue(key, value)}</td>
                     </tr>
                   `)}
               `
@@ -115,7 +152,7 @@ let BoardComponentInfo = class BoardComponentInfo extends LitElement {
     async updated(changes) {
         if (changes.has('component')) {
             this.detailInfo = null;
-            if ('detailInfo' in this.component) {
+            if (!this.playbackMode && 'detailInfo' in this.component) {
                 try {
                     this.loading = true;
                     this.detailInfo = await this.component.detailInfo();
@@ -271,6 +308,9 @@ BoardComponentInfo.styles = [
 __decorate([
     property({ type: Object })
 ], BoardComponentInfo.prototype, "component", void 0);
+__decorate([
+    property({ type: Boolean })
+], BoardComponentInfo.prototype, "playbackMode", void 0);
 __decorate([
     state()
 ], BoardComponentInfo.prototype, "detailInfo", void 0);

package/dist/src/ox-board-component-info.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ox-board-component-info.js","sourceRoot":"","sources":["../../src/ox-board-component-info.ts"],"names":[],"mappings":"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","sourcesContent":["import '@material/web/icon/icon.js'\nimport '@material/web/progress/linear-progress.js'\nimport '@operato/property-editor/ox-properties-dynamic-view.js'\nimport '@operato/markdown'\n\nimport { css, html, LitElement, PropertyValues, nothing } from 'lit'\nimport { customElement, property, state } from 'lit/decorators.js'\n\nimport { ScrollbarStyles } from '@operato/styles'\nimport { i18next } from '@operato/i18n'\n\n@customElement('ox-board-component-info')\nexport class BoardComponentInfo extends LitElement {\n static styles = [\n ScrollbarStyles,\n css`\n :host {\n background-color: white;\n font-size: 12px;\n box-sizing: border-box;\n display: flex;\n flex-direction: column;\n border: 2px solid var(--primary-color);\n border-radius: 3px;\n\n --md-icon-size: 12px;\n }\n\n [header] {\n background-color: var(--primary-color);\n user-select: none;\n align-items: center;\n color: #eee;\n padding: 0 2px;\n\n display: flex;\n }\n\n md-icon {\n --md-icon-size: 14px;\n\n color: #555;\n align-self: center;\n padding: 0 2px;\n }\n\n [header] md-icon[close] {\n margin-left: auto;\n }\n\n [content] {\n overflow: auto;\n }\n\n table {\n border-collapse: collapse;\n background-color: #fff;\n width: 100%;\n margin: auto;\n }\n\n tr {\n border-bottom: var(--border-dark-color);\n }\n\n td {\n padding: var(--padding-narrow);\n border-right: var(--border-dark-color);\n font-size: 0.8em;\n }\n\n [subTh] {\n text-align: center !important;\n font-weight: bold;\n width: 60px;\n text-transform: capitalize;\n background-color: rgba(0, 0, 0, 0.05);\n }\n\n [split] {\n height: 10px;\n color: #eee;\n background-color: var(--primary-color);\n font-size: 0.8em;\n padding: 0;\n text-align: center;\n }\n\n [location] {\n display: flex;\n flex-direction: row;\n align-items: center;\n justify-content: center;\n }\n\n md-linear-progress {\n --md-linear-progress-active-indicator-color: red;\n --md-linear-progress-track-color: #ed788d;\n }\n `\n ]\n\n @property({ type: Object }) component?: any\n\n @state() detailInfo?: any\n @state() collapsed: boolean = false\n @state() loading: boolean = false\n\n private dragStart?: { x: number; y: number }\n\n private dragEndHandler = this.onDragEnd.bind(this) as EventListener\n private dragMoveHandler = this.onDragMove.bind(this) as EventListener\n\n connectedCallback(): void {\n super.connectedCallback()\n\n this.collapsed = sessionStorage.getItem('ox-board-component-info-collapsed') == 'true'\n\n document.addEventListener('mouseup', this.dragEndHandler)\n document.addEventListener('mousemove', this.dragMoveHandler)\n }\n\n disconnectedCallback(): void {\n super.disconnectedCallback()\n\n document.removeEventListener('mouseup', this.dragEndHandler)\n document.removeEventListener('mousemove', this.dragMoveHandler)\n }\n\n render() {\n const { state, data } = this.component \|\| {}\n const { id, type } = state \|\| {}\n const details = this.detailInfo \|\| data\n const infos: [key: string, value: string][] =\n details && Object.entries(details).filter(([key, value]) => key != 'ID')\n const identifiable = this.component?.isIdentifiable() \|\| false\n\n return html`\n <div header @mousedown=${this.onDragStart.bind(this)} draggable=\"false\">\n <md-icon @click=${() => (this.collapsed = !this.collapsed)} collapsed\n >${this.collapsed ? 'expand_more' : 'expand_less'}</md-icon\n >\n  Object Information\n <md-icon @click=${(e: MouseEvent) => this.dispatchEvent(new CustomEvent('close'))} close>close</md-icon>\n </div>\n ${this.loading\n ? html`<div>\n <md-linear-progress indeterminate></md-linear-progress>\n </div>`\n : nothing}\n\n <div content @wheel=${(e: WheelEvent) => this.onWheel(e)}>\n <table>\n ${identifiable\n ? html`\n <tr>\n <td subTh>\n <div\n location\n @click=${(e: MouseEvent) => {\n this.component.trigger('deco-border', { distance: 8, lineWidth: 4, color: '#f007' })\n this.component.rootModel?.centerTo(this.component, true /* animated /)\n\n return false\n }}\n >\n ${i18next.t('label.id')} <md-icon style=\"color:red;\">location_on</md-icon>\n </div>\n </td>\n <td>${id}</td>\n </tr>\n <tr>\n <td subTh>\n ${i18next.t('label.type')}${!identifiable\n ? html` <md-icon style=\"color:red;\">location_on</md-icon>`\n : html``}\n </td>\n <td>${type}</td>\n </tr>\n `\n : html`\n <tr>\n <td subTh>\n <div\n location\n @click=${(e: MouseEvent) => {\n this.component.trigger('deco-border', { distance: 8, lineWidth: 4, color: '#f007' })\n this.component.rootModel?.centerTo(this.component, true / animated */)\n\n return false\n }}\n >\n ${i18next.t('label.type')}${!identifiable ? html` <md-icon>location_on</md-icon>` : html``}\n </div>\n </td>\n <td>${type}</td>\n </tr>\n `}\n ${!this.collapsed && infos && !this.loading\n ? html`\n <tr>\n <td split colspan=\"2\">Details</td>\n </tr>\n\n ${infos.map(\n ([key, value]) => html`\n <tr>\n <td subTh>${key}</td>\n <td>${value}</td>\n </tr>\n `\n )}\n `\n : nothing}\n </table>\n </div>\n `\n }\n\n async updated(changes: PropertyValues<this>) {\n if (changes.has('component')) {\n this.detailInfo = null\n\n if ('detailInfo' in this.component) {\n try {\n this.loading = true\n this.detailInfo = await this.component.detailInfo()\n } catch (e) {\n console.error('failed to get detail information')\n } finally {\n this.loading = false\n }\n }\n }\n\n if (changes.has('collapsed')) {\n sessionStorage.setItem('ox-board-component-info-collapsed', this.collapsed ? 'true' : 'false')\n }\n }\n\n onWheel(e: WheelEvent) {\n const scrollableDiv = e.currentTarget! as HTMLElement\n const contentDiv = scrollableDiv.querySelector('table')!\n\n // 컨텐츠의 높이와 div의 높이를 비교하여 수평 스크롤을 동작시키거나 수직 스크롤을 동작시킴\n if (contentDiv.offsetHeight > scrollableDiv.offsetHeight) {\n // 수직 스크롤 가능한 경우\n scrollableDiv.scrollTop += e.deltaY\n } else {\n // 수직 스크롤이 없는 경우\n scrollableDiv.scrollLeft += e.deltaY\n }\n }\n\n onDragStart(e: MouseEvent) {\n e.stopPropagation()\n\n if (e.button == 0) {\n this.dragStart = {\n x: e.clientX,\n y: e.clientY\n }\n }\n\n return false\n }\n\n onDragMove(e: Event) {\n if (!this.dragStart) {\n return false\n }\n\n e.stopPropagation()\n e.preventDefault()\n\n var x = (e as MouseEvent).clientX,\n y = (e as MouseEvent).clientY\n\n const dragStart = { x, y }\n\n x -= this.dragStart.x\n y -= this.dragStart.y\n\n this.dragStart = dragStart\n\n this.style.left =\n Math.min(this.parentElement!.offsetWidth - this.offsetWidth, Math.max(0, this.offsetLeft + x)) + 'px'\n this.style.top =\n Math.min(this.parentElement!.offsetHeight - this.offsetHeight, Math.max(0, this.offsetTop + y)) + 'px'\n\n return false\n }\n\n onDragEnd(e: Event) {\n if (this.dragStart) {\n e.stopPropagation()\n e.preventDefault()\n\n delete this.dragStart\n }\n }\n}\n"]}
1	+ {"version":3,"file":"ox-board-component-info.js","sourceRoot":"","sources":["../../src/ox-board-component-info.ts"],"names":[],"mappings":"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","sourcesContent":["import '@material/web/icon/icon.js'\nimport '@material/web/progress/linear-progress.js'\nimport '@operato/property-editor/ox-properties-dynamic-view.js'\nimport '@operato/markdown'\n\nimport { css, html, LitElement, PropertyValues, nothing } from 'lit'\nimport { customElement, property, state } from 'lit/decorators.js'\n\nimport { ScrollbarStyles } from '@operato/styles'\nimport { i18next } from '@operato/i18n'\n\n/*\n info panel 의 value 셀 렌더링. 1차 표시는 plain string 인데, multiCarriers\n * 같이 object array 가 들어오면 `[object Object]` 로 뭉개진다.\n \n - MULTICARRIERS: array of carrier info object → 각 항목을 한 줄씩\n * \"CARRIERNAME (CARRIERTYPE / EMPTYTYPE)\" 형식으로 (데이터 키는 모두 대문자 전제)\n * - 그 외 object/array → JSON 한 줄\n * - primitive → 그대로\n /\nfunction formatCarrierItem(item: any): string {\n if (!item \|\| typeof item !== 'object') return String(item)\n const name = item.CARRIERNAME ?? item.CARRIERID ?? ''\n const meta = [item.CARRIERTYPE, item.EMPTYTYPE].filter(Boolean).join(' / ')\n return meta ? `${name} (${meta})` : name\n}\n\nfunction renderInfoValue(key: string, value: any) {\n // MULTICARRIERS 는 객체(배열) 또는 JSON 문자열로 올 수 있음 — 문자열이면 파싱해서 표시.\n if (key === 'MULTICARRIERS' && typeof value === 'string') {\n try { value = JSON.parse(value) } catch { / 파싱 실패 시 원문 표시 / }\n }\n if (Array.isArray(value)) {\n if (key === 'MULTICARRIERS') {\n return html`${value.map(item => html`<div>${formatCarrierItem(item)}</div>`)}`\n }\n return html`${value.map((v, i) => html`<div>${i}: ${typeof v === 'object' ? JSON.stringify(v) : String(v)}</div>`)}`\n }\n if (value !== null && typeof value === 'object') {\n return JSON.stringify(value)\n }\n return value === null \|\| value === undefined ? '' : String(value)\n}\n\n@customElement('ox-board-component-info')\nexport class BoardComponentInfo extends LitElement {\n static styles = [\n ScrollbarStyles,\n css`\n :host {\n background-color: white;\n font-size: 12px;\n box-sizing: border-box;\n display: flex;\n flex-direction: column;\n border: 2px solid var(--primary-color);\n border-radius: 3px;\n\n --md-icon-size: 12px;\n }\n\n [header] {\n background-color: var(--primary-color);\n user-select: none;\n align-items: center;\n color: #eee;\n padding: 0 2px;\n\n display: flex;\n }\n\n md-icon {\n --md-icon-size: 14px;\n\n color: #555;\n align-self: center;\n padding: 0 2px;\n }\n\n [header] md-icon[close] {\n margin-left: auto;\n }\n\n [content] {\n overflow: auto;\n }\n\n table {\n border-collapse: collapse;\n background-color: #fff;\n width: 100%;\n margin: auto;\n }\n\n tr {\n border-bottom: var(--border-dark-color);\n }\n\n td {\n padding: var(--padding-narrow);\n border-right: var(--border-dark-color);\n font-size: 0.8em;\n }\n\n [subTh] {\n text-align: center !important;\n font-weight: bold;\n width: 60px;\n text-transform: capitalize;\n background-color: rgba(0, 0, 0, 0.05);\n }\n\n [split] {\n height: 10px;\n color: #eee;\n background-color: var(--primary-color);\n font-size: 0.8em;\n padding: 0;\n text-align: center;\n }\n\n [location] {\n display: flex;\n flex-direction: row;\n align-items: center;\n justify-content: center;\n }\n\n md-linear-progress {\n --md-linear-progress-active-indicator-color: red;\n --md-linear-progress-track-color: #ed788d;\n }\n `\n ]\n\n @property({ type: Object }) component?: any\n @property({ type: Boolean }) playbackMode: boolean = false\n\n @state() detailInfo?: any\n @state() collapsed: boolean = false\n @state() loading: boolean = false\n\n private dragStart?: { x: number; y: number }\n\n private dragEndHandler = this.onDragEnd.bind(this) as EventListener\n private dragMoveHandler = this.onDragMove.bind(this) as EventListener\n\n connectedCallback(): void {\n super.connectedCallback()\n\n this.collapsed = sessionStorage.getItem('ox-board-component-info-collapsed') == 'true'\n\n document.addEventListener('mouseup', this.dragEndHandler)\n document.addEventListener('mousemove', this.dragMoveHandler)\n }\n\n disconnectedCallback(): void {\n super.disconnectedCallback()\n\n document.removeEventListener('mouseup', this.dragEndHandler)\n document.removeEventListener('mousemove', this.dragMoveHandler)\n }\n\n render() {\n const { state, data } = this.component \|\| {}\n const { id, type } = state \|\| {}\n const details = this.detailInfo \|\| data\n const infos: [key: string, value: string][] =\n details && Object.entries(details).filter(([key, value]) => key != 'ID')\n const identifiable = this.component?.isIdentifiable() \|\| false\n\n return html`\n <div header @mousedown=${this.onDragStart.bind(this)} draggable=\"false\">\n <md-icon @click=${() => (this.collapsed = !this.collapsed)} collapsed\n >${this.collapsed ? 'expand_more' : 'expand_less'}</md-icon\n >\n  Object Information\n <md-icon @click=${(e: MouseEvent) => this.dispatchEvent(new CustomEvent('close'))} close>close</md-icon>\n </div>\n ${this.loading\n ? html`<div>\n <md-linear-progress indeterminate></md-linear-progress>\n </div>`\n : nothing}\n\n <div content @wheel=${(e: WheelEvent) => this.onWheel(e)}>\n <table>\n ${identifiable\n ? html`\n <tr>\n <td subTh>\n <div\n location\n @click=${(e: MouseEvent) => {\n this.component.trigger('deco-border', { distance: 8, lineWidth: 4, color: '#f007' })\n this.component.rootModel?.centerTo(this.component, true / animated /)\n\n return false\n }}\n >\n ${i18next.t('label.id')} <md-icon style=\"color:red;\">location_on</md-icon>\n </div>\n </td>\n <td>${id}</td>\n </tr>\n <tr>\n <td subTh>\n ${i18next.t('label.type')}${!identifiable\n ? html` <md-icon style=\"color:red;\">location_on</md-icon>`\n : html``}\n </td>\n <td>${type}</td>\n </tr>\n `\n : html`\n <tr>\n <td subTh>\n <div\n location\n @click=${(e: MouseEvent) => {\n this.component.trigger('deco-border', { distance: 8, lineWidth: 4, color: '#f007' })\n this.component.rootModel?.centerTo(this.component, true / animated */)\n\n return false\n }}\n >\n ${i18next.t('label.type')}${!identifiable ? html` <md-icon>location_on</md-icon>` : html``}\n </div>\n </td>\n <td>${type}</td>\n </tr>\n `}\n ${!this.collapsed && infos && !this.loading\n ? html`\n <tr>\n <td split colspan=\"2\">Details</td>\n </tr>\n\n ${infos.map(\n ([key, value]) => html`\n <tr>\n <td subTh>${key}</td>\n <td>${renderInfoValue(key, value)}</td>\n </tr>\n `\n )}\n `\n : nothing}\n </table>\n </div>\n `\n }\n\n async updated(changes: PropertyValues<this>) {\n if (changes.has('component')) {\n this.detailInfo = null\n\n if (!this.playbackMode && 'detailInfo' in this.component) {\n try {\n this.loading = true\n this.detailInfo = await this.component.detailInfo()\n } catch (e) {\n console.error('failed to get detail information')\n } finally {\n this.loading = false\n }\n }\n }\n\n if (changes.has('collapsed')) {\n sessionStorage.setItem('ox-board-component-info-collapsed', this.collapsed ? 'true' : 'false')\n }\n }\n\n onWheel(e: WheelEvent) {\n const scrollableDiv = e.currentTarget! as HTMLElement\n const contentDiv = scrollableDiv.querySelector('table')!\n\n // 컨텐츠의 높이와 div의 높이를 비교하여 수평 스크롤을 동작시키거나 수직 스크롤을 동작시킴\n if (contentDiv.offsetHeight > scrollableDiv.offsetHeight) {\n // 수직 스크롤 가능한 경우\n scrollableDiv.scrollTop += e.deltaY\n } else {\n // 수직 스크롤이 없는 경우\n scrollableDiv.scrollLeft += e.deltaY\n }\n }\n\n onDragStart(e: MouseEvent) {\n e.stopPropagation()\n\n if (e.button == 0) {\n this.dragStart = {\n x: e.clientX,\n y: e.clientY\n }\n }\n\n return false\n }\n\n onDragMove(e: Event) {\n if (!this.dragStart) {\n return false\n }\n\n e.stopPropagation()\n e.preventDefault()\n\n var x = (e as MouseEvent).clientX,\n y = (e as MouseEvent).clientY\n\n const dragStart = { x, y }\n\n x -= this.dragStart.x\n y -= this.dragStart.y\n\n this.dragStart = dragStart\n\n this.style.left =\n Math.min(this.parentElement!.offsetWidth - this.offsetWidth, Math.max(0, this.offsetLeft + x)) + 'px'\n this.style.top =\n Math.min(this.parentElement!.offsetHeight - this.offsetHeight, Math.max(0, this.offsetTop + y)) + 'px'\n\n return false\n }\n\n onDragEnd(e: Event) {\n if (this.dragStart) {\n e.stopPropagation()\n e.preventDefault()\n\n delete this.dragStart\n }\n }\n}\n"]}

package/dist/src/ox-board-modeller.d.ts CHANGED Viewed

@@ -6,13 +6,13 @@ import './modeller/scene-viewer/ox-scene-layer.js';
 import './modeller/scene-viewer/ox-scene-property.js';
 import './modeller/scene-viewer/ox-scene-viewer.js';
 import './ox-board-viewer';
-import { LitElement } from 'lit';
-import { Scene, SceneMode } from '@hatiolab/things-scene';
+import { LitElement, PropertyValues } from 'lit';
+import { LoadTracker, Scene, SceneMode } from '@hatiolab/things-scene';
 import { ComponentToolbar } from './modeller/component-toolbar/component-toolbar';
 import { EditToolbar } from './modeller/edit-toolbar';
 import { PropertySidebar } from './modeller/property-sidebar/property-sidebar';
 import { ComponentGroup, ComponentTemplate } from './types';
-declare const BoardModeller_base: typeof LitElement & import("@open-wc/dedupe-mixin").Constructor<import("@open-wc/scoped-elements/types/src/types.js").ScopedElementsHost>;
+declare const BoardModeller_base: typeof LitElement & import("@open-wc/dedupe-mixin").Constructor<import("@open-wc/scoped-elements/types.js").ScopedElementsHost>;
 export declare class BoardModeller extends BoardModeller_base {
     static styles: import("lit").CSSResult[];
     static registerGroup(group: ComponentGroup): void;
@@ -28,6 +28,7 @@ export declare class BoardModeller extends BoardModeller_base {
     hideProperty: boolean;
     overlay: string;
     scene?: Scene;
+    loadTracker?: LoadTracker;
     componentGroupList: any[];
     fonts: any[];
     themes: any;
@@ -35,12 +36,14 @@ export declare class BoardModeller extends BoardModeller_base {
     private editToolbar;
     private group;
     private shortcutHandler?;
+    private _loadingOverlay?;
     constructor();
     static get scopedElements(): {
         'edit-toolbar': typeof EditToolbar;
         'property-sidebar': typeof PropertySidebar;
         'component-toolbar': typeof ComponentToolbar;
     };
+    updated(changes: PropertyValues<this>): void;
     render(): import("lit-html").TemplateResult<1>;
     connectedCallback(): void;
     disconnectedCallback(): void;

package/dist/src/ox-board-modeller.js CHANGED Viewed

@@ -10,12 +10,13 @@ import './ox-board-viewer';
 import { saveAs } from 'file-saver';
 import { css, html, LitElement } from 'lit';
 import { customElement, property, query } from 'lit/decorators.js';
-import { SCENE_MODE } from '@hatiolab/things-scene';
+import { LoadingOverlay, SCENE_MODE, dataLagTracker } from '@hatiolab/things-scene';
 import { ScopedElementsMixin } from '@open-wc/scoped-elements';
 import { OxPopup } from '@operato/popup';
 import { isMacOS, togglefullscreen } from '@operato/utils';
 import { navigate } from '@operato/shell';
 import { ComponentToolbar } from './modeller/component-toolbar/component-toolbar';
+import { SceneMonitorRenderer } from './scene-monitor-renderer';
 import { EditToolbar } from './modeller/edit-toolbar';
 import { PropertySidebar } from './modeller/property-sidebar/property-sidebar';
 const MACOS = isMacOS();
@@ -107,6 +108,20 @@ let BoardModeller = class BoardModeller extends ScopedElementsMixin(LitElement)
             'component-toolbar': ComponentToolbar
         };
     }
+    updated(changes) {
+        var _a;
+        if (changes.has('loadTracker') && this.loadTracker) {
+            if (!this._loadingOverlay) {
+                this._loadingOverlay = new LoadingOverlay();
+                this._loadingOverlay.renderer = new SceneMonitorRenderer();
+            }
+            this._loadingOverlay.attach(this.renderRoot, this.loadTracker, dataLagTracker);
+        }
+        // M키 로딩 오버레이(scene 내장)에 fmsim Scene Monitor 렌더러 주입.
+        if (changes.has('scene') && ((_a = this.scene) === null || _a === void 0 ? void 0 : _a.loadingOverlay)) {
+            this.scene.loadingOverlay.renderer = new SceneMonitorRenderer();
+        }
+    }
     render() {
         return html `
       <edit-toolbar
@@ -136,6 +151,7 @@ let BoardModeller = class BoardModeller extends ScopedElementsMixin(LitElement)
           <ox-scene-viewer
             id="scene"
             .scene=${this.scene}
+            .loadTracker=${this.loadTracker}
             @scene-changed=${(e) => {
             this.scene = e.detail.value;
         }}
@@ -299,6 +315,7 @@ BoardModeller.styles = [
       edit-toolbar {
         flex: 45px;
         max-height: 45px;
+        overflow: hidden;
       }
       div[content] {
@@ -375,6 +392,9 @@ __decorate([
 __decorate([
     property({ type: Object })
 ], BoardModeller.prototype, "scene", void 0);
+__decorate([
+    property({ type: Object })
+], BoardModeller.prototype, "loadTracker", void 0);
 __decorate([
     property({ type: Array })
 ], BoardModeller.prototype, "componentGroupList", void 0);

package/dist/src/ox-board-modeller.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ox-board-modeller.js","sourceRoot":"","sources":["../../src/ox-board-modeller.ts"],"names":[],"mappings":"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","sourcesContent":["import '@material/web/fab/fab.js'\nimport '@material/web/icon/icon.js'\n\nimport '@hatiolab/things-scene'\nimport './modeller/scene-viewer/ox-scene-handler.js'\nimport './modeller/scene-viewer/ox-scene-layer.js'\nimport './modeller/scene-viewer/ox-scene-property.js'\nimport './modeller/scene-viewer/ox-scene-viewer.js'\nimport './ox-board-viewer'\n\nimport { saveAs } from 'file-saver'\nimport { css, html, LitElement } from 'lit'\nimport { customElement, property, query } from 'lit/decorators.js'\n\nimport { Scene, SCENE_MODE, SceneMode } from '@hatiolab/things-scene'\nimport { ScopedElementsMixin } from '@open-wc/scoped-elements'\nimport { OxPopup } from '@operato/popup'\nimport { isMacOS, togglefullscreen } from '@operato/utils'\nimport { navigate } from '@operato/shell'\n\nimport { ComponentToolbar } from './modeller/component-toolbar/component-toolbar'\nimport { EditToolbar } from './modeller/edit-toolbar'\nimport { PropertySidebar } from './modeller/property-sidebar/property-sidebar'\nimport { ComponentGroup, ComponentTemplate } from './types'\n\nconst MACOS = isMacOS()\n\nconst ICON_PROPERTIES = new URL('../../icons/icon-properties.png', import.meta.url).href\nconst ICON_PROPERTIES_LINE_TYPE = new URL('../../icons/icon-properties-line-type.png', import.meta.url).href\nconst ICON_PROPERTIES_ARROW_TYPE = new URL('../../icons/icon-properties-arrow-type.png', import.meta.url).href\nconst ICON_PROPERTIES_LABEL = new URL('../../icons/icon-properties-label.png', import.meta.url).href\nconst ICON_PROPERTIES_PADDING = new URL('../../icons/icon-properties-padding.png', import.meta.url).href\n\nconst ICON_HTOOLBAR = new URL('../../icons/icon-htoolbar.png', import.meta.url).href\nconst ICON_FULLSCREEN = new URL('../../icons/icon-fullscreen.png', import.meta.url).href\nconst ICON_COLLAPSE = new URL('../../icons/icon-collapse.png', import.meta.url).href\nconst ICON_COLLAPSE_ACTIVE = new URL('../../icons/icon-collapse-active.png', import.meta.url).href\n\nconst ICON_SHELL_INSPECTOR = new URL('../../icons/icon-shell-inspector.png', import.meta.url).href\n\nvar Registry: ComponentGroup[] = []\n\n@customElement('ox-board-modeller')\nexport class BoardModeller extends ScopedElementsMixin(LitElement) {\n static styles = [\n css`\n :host {\n display: flex;\n flex-direction: column;\n\n height: 100%;\n overflow: hidden;\n\n font-family: 'Pretendard', 'Segoe UI', sans-serif;\n }\n\n edit-toolbar {\n flex: 45px;\n max-height: 45px;\n }\n\n div[content] {\n flex: 1;\n max-height: calc(100% - 45px);\n\n display: flex;\n flex-direction: row;\n }\n\n component-toolbar {\n max-height: 100%;\n }\n\n property-sidebar {\n overflow: hidden;\n }\n\n #scene-wrap {\n position: relative;\n\n flex: 1;\n display: flex;\n flex-direction: row;\n }\n\n ox-scene-viewer {\n flex: 1;\n width: 100%;\n height: 100%;\n }\n\n md-fab {\n position: absolute;\n right: 15px;\n bottom: 15px;\n z-index: 1000;\n }\n\n\n [brand] {\n display: flex;\n white-space: nowrap;\n flex-direction: row;\n align-items: center;\n gap: 3px;\n }\n `\n ]\n\n static registerGroup(group: ComponentGroup) {\n var found = Registry.find(inRegisterGroup => inRegisterGroup.name == group.name)\n\n if (found) {\n found = {\n ...found,\n ...group\n }\n } else {\n Registry.push(group)\n }\n }\n\n static registerTemplate(templates: ComponentTemplate[]): void {\n templates &&\n templates.forEach(template => {\n var groups: string[] = typeof template.group == 'string' ? [template.group] : template.group\n\n Registry.filter(group => groups.includes(group.name)).forEach(group => {\n if (!group.templates.find(inGroupTemplate => inGroupTemplate.type == template.type)) {\n group.templates.push(template)\n }\n })\n })\n }\n\n static get groups(): ComponentGroup[] {\n return Registry\n }\n\n static getGroup(name: string) {\n return Registry.find(group => group.name === name)\n }\n\n @property({ type: String }) boardName: string = ''\n @property({ type: Object }) model: any = null\n @property({ type: String }) baseUrl: string = ''\n @property({ type: Array }) selected: any[] = []\n @property({ type: Number }) mode: SceneMode = SCENE_MODE.EDIT\n @property({ type: Object }) provider: any = null\n @property({ type: Boolean }) hideProperty: boolean = false\n @property({ type: String }) overlay: string = ''\n @property({ type: Object }) scene?: Scene\n @property({ type: Array }) componentGroupList: any[] = []\n @property({ type: Array }) fonts: any[] = []\n @property({ type: Object }) themes: any = null\n @property({ type: Array }) propertyEditor: any[] = []\n\n @query('edit-toolbar') private editToolbar!: EditToolbar\n\n private group: string = ''\n private shortcutHandler?: (e: KeyboardEvent) => void\n\n constructor() {\n super()\n\n document.addEventListener('get-all-scene-component-ids', (e: Event) => {\n var { component, callback } = (e as CustomEvent).detail\n\n if (!this.scene) return\n\n var ids\n if (component) {\n ids = this.scene.findAll(component).map((c: any) => c.model.id)\n } else {\n ids = this.scene.ids.map(({ key }: { key: string }) => key)\n }\n\n ids = ids.filter(Boolean).sort()\n callback(ids)\n })\n\n this.style.setProperty('--url-icon-properties', `url(${ICON_PROPERTIES})`)\n this.style.setProperty('--url-icon-properties-label', `url(${ICON_PROPERTIES_LABEL})`)\n this.style.setProperty('--url-icon-properties-padding', `url(${ICON_PROPERTIES_PADDING})`)\n this.style.setProperty('--url-icon-properties-line-type', `url(${ICON_PROPERTIES_LINE_TYPE})`)\n this.style.setProperty('--url-icon-properties-arrow-type', `url(${ICON_PROPERTIES_ARROW_TYPE})`)\n\n this.style.setProperty('--url-icon-htoolbar', `url(${ICON_HTOOLBAR})`)\n this.style.setProperty('--url-icon-fullscreen', `url(${ICON_FULLSCREEN})`)\n this.style.setProperty('--url-icon-collapse', `url(${ICON_COLLAPSE})`)\n this.style.setProperty('--url-icon-collapse-active', `url(${ICON_COLLAPSE_ACTIVE})`)\n\n this.style.setProperty('--url-icon-shell-inspector', `url(${ICON_SHELL_INSPECTOR})`)\n }\n\n static get scopedElements() {\n return {\n 'edit-toolbar': EditToolbar,\n 'property-sidebar': PropertySidebar,\n 'component-toolbar': ComponentToolbar\n }\n }\n\n render() {\n return html`\n <edit-toolbar\n .scene=${this.scene}\n .selected=${this.selected}\n @hide-property-changed=${(e: CustomEvent) => (this.hideProperty = e.detail.value)}\n @open-preview=${() => this.preview()}\n @download-model=${() => this.downloadModel()}\n @modeller-fullscreen=${() => togglefullscreen(this)}\n >\n ${this.renderBrandingZone()}\n </edit-toolbar>\n\n <div content>\n <component-toolbar\n .scene=${this.scene}\n .mode=${this.mode}\n @mode-changed=${(e: CustomEvent) => {\n this.mode = e.detail.value\n }}\n .componentGroupList=${this.componentGroupList}\n .group=${this.group}\n >\n </component-toolbar>\n\n <div id=\"scene-wrap\">\n <ox-scene-viewer\n id=\"scene\"\n .scene=${this.scene}\n @scene-changed=${(e: CustomEvent) => {\n this.scene = e.detail.value\n }}\n .model=${this.model}\n .themes=${this.themes}\n .selected=${this.selected}\n @selected-changed=${(e: CustomEvent) => {\n this.selected = e.detail.value\n }}\n .mode=${this.mode}\n @mode-changed=${(e: CustomEvent) => {\n this.mode = e.detail.value\n }}\n fit=\"ratio\"\n .baseUrl=${this.baseUrl}\n @contextmenu=${() => this.onContextMenu()}\n .provider=${this.provider}\n name=\"modeller\"\n >\n <ox-scene-layer type=\"snap-guide-layer\"></ox-scene-layer>\n <ox-scene-layer type=\"selection-layer\"></ox-scene-layer>\n <ox-scene-layer type=\"modeling-layer\"></ox-scene-layer>\n <ox-scene-layer type=\"add-layer\"> </ox-scene-layer>\n <ox-scene-layer type=\"shift-layer\">\n <ox-scene-property name=\"text\" value=\"${this.overlay}\"></ox-scene-property>\n <ox-scene-property name=\"alpha\" value=\"0.3\"></ox-scene-property>\n <ox-scene-property name=\"fontFamily\" value=\"arial\"></ox-scene-property>\n <ox-scene-property name=\"fontSize\" value=\"30\" type=\"number\"></ox-scene-property>\n <ox-scene-property name=\"fontColor\" value=\"navy\"></ox-scene-property>\n <ox-scene-property name=\"textBaseline\" value=\"top\"></ox-scene-property>\n <ox-scene-property name=\"textAlign\" value=\"left\"></ox-scene-property>\n <ox-scene-property name=\"paddingTop\" value=\"50\" type=\"number\"></ox-scene-property>\n <ox-scene-property name=\"paddingLeft\" value=\"50\" type=\"number\"></ox-scene-property>\n </ox-scene-layer>\n <ox-scene-handler type=\"text-editor\"></ox-scene-handler>\n <ox-scene-handler type=\"move-handler\"></ox-scene-handler>\n </ox-scene-viewer>\n\n <md-fab @click=${() => this.onTapSave()} title=\"save\"><md-icon slot=\"icon\">save</md-icon></md-fab>\n </div>\n\n <property-sidebar\n .scene=${this.scene}\n .selected=${this.selected}\n .collapsed=${this.hideProperty}\n .fonts=${this.fonts}\n .propertyEditor=${this.propertyEditor}\n >\n </property-sidebar>\n </div>\n `\n }\n\n connectedCallback(): void {\n super.connectedCallback()\n this.bindShortcutEvent()\n }\n\n disconnectedCallback(): void {\n super.disconnectedCallback()\n this.unbindShortcutEvent()\n }\n\n close() {\n this.model = null\n this.requestUpdate()\n }\n\n onShortcut(e: KeyboardEvent) {\n if (MACOS) var ctrlKey = e.metaKey\n else var ctrlKey = e.ctrlKey\n\n switch (e.code) {\n case 'KeyS':\n if (ctrlKey) {\n this.onTapSave()\n e.preventDefault()\n }\n break\n }\n }\n\n preview() {\n const board = {\n id: 'preview',\n model: this.scene?.model ? JSON.parse(JSON.stringify(this.scene.model)) : null,\n style: this.scene?.rootContainer.style\n }\n\n OxPopup.open({\n template: html`\n <ox-board-viewer\n style=\"width:100%;height:100%;background:white;\"\n .provider=${this.provider}\n .board=${board}\n ></ox-board-viewer>\n `,\n style: 'width:90vw;height:90vh;',\n backdrop: true,\n preventCloseOnBlur: true\n })\n\n requestAnimationFrame(() => {\n dispatchEvent(new Event('resize'))\n })\n }\n\n downloadModel() {\n if (!this.scene) return\n\n var model = JSON.stringify(this.model, null, 2)\n var filename = (this.boardName \|\| 'NONAME') + '-' + Date.now() + '.json'\n saveAs(new Blob([model], { type: 'application/octet-stream' }), filename)\n }\n\n renderBrandingZone() {\n return html`\n <div brand>\n <md-icon\n @click=${() => {\n navigate('board-list')\n return false\n }}\n >home</md-icon\n >\n <div board_name>${this.boardName}</div>\n </div>\n `\n }\n\n onTapSave() {\n this.dispatchEvent(new CustomEvent('save-model', { bubbles: true, composed: true, detail: { model: this.model } }))\n }\n\n bindShortcutEvent() {\n // TODO: Global Hotkey에 대한 정의를 edit-toolbar에서 가져올 수 있도록 수정해야 함.\n const GLOBAL_HOTKEYS = ['Digit1', 'Digit2', 'F11', 'KeyD', 'KeyP', 'KeyS']\n\n this.shortcutHandler = (e: KeyboardEvent) => {\n const target = e.composedPath()[0] as HTMLElement\n var tagName = target.tagName\n var isInput = target.isContentEditable \|\| tagName == 'INPUT' \|\| tagName == 'SELECT' \|\| tagName == 'TEXTAREA'\n var isGlobalHotkey = GLOBAL_HOTKEYS.includes(e.code)\n\n if (!isGlobalHotkey && isInput) return\n if (!this.editToolbar.onShortcut(e)) this.onShortcut(e)\n }\n\n document.addEventListener('keydown', this.shortcutHandler)\n }\n\n unbindShortcutEvent() {\n if (this.shortcutHandler) {\n document.removeEventListener('keydown', this.shortcutHandler)\n delete this.shortcutHandler\n }\n }\n\n onContextMenu() {}\n}\n"]}
1	+ {"version":3,"file":"ox-board-modeller.js","sourceRoot":"","sources":["../../src/ox-board-modeller.ts"],"names":[],"mappings":"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","sourcesContent":["import '@material/web/fab/fab.js'\nimport '@material/web/icon/icon.js'\n\nimport '@hatiolab/things-scene'\nimport './modeller/scene-viewer/ox-scene-handler.js'\nimport './modeller/scene-viewer/ox-scene-layer.js'\nimport './modeller/scene-viewer/ox-scene-property.js'\nimport './modeller/scene-viewer/ox-scene-viewer.js'\nimport './ox-board-viewer'\n\nimport { saveAs } from 'file-saver'\nimport { css, html, LitElement, PropertyValues } from 'lit'\nimport { customElement, property, query } from 'lit/decorators.js'\n\nimport { LoadTracker, LoadingOverlay, Scene, SCENE_MODE, SceneMode, dataLagTracker } from '@hatiolab/things-scene'\nimport { ScopedElementsMixin } from '@open-wc/scoped-elements'\nimport { OxPopup } from '@operato/popup'\nimport { isMacOS, togglefullscreen } from '@operato/utils'\nimport { navigate } from '@operato/shell'\n\nimport { ComponentToolbar } from './modeller/component-toolbar/component-toolbar'\nimport { SceneMonitorRenderer } from './scene-monitor-renderer'\nimport { EditToolbar } from './modeller/edit-toolbar'\nimport { PropertySidebar } from './modeller/property-sidebar/property-sidebar'\nimport { ComponentGroup, ComponentTemplate } from './types'\n\nconst MACOS = isMacOS()\n\nconst ICON_PROPERTIES = new URL('../../icons/icon-properties.png', import.meta.url).href\nconst ICON_PROPERTIES_LINE_TYPE = new URL('../../icons/icon-properties-line-type.png', import.meta.url).href\nconst ICON_PROPERTIES_ARROW_TYPE = new URL('../../icons/icon-properties-arrow-type.png', import.meta.url).href\nconst ICON_PROPERTIES_LABEL = new URL('../../icons/icon-properties-label.png', import.meta.url).href\nconst ICON_PROPERTIES_PADDING = new URL('../../icons/icon-properties-padding.png', import.meta.url).href\n\nconst ICON_HTOOLBAR = new URL('../../icons/icon-htoolbar.png', import.meta.url).href\nconst ICON_FULLSCREEN = new URL('../../icons/icon-fullscreen.png', import.meta.url).href\nconst ICON_COLLAPSE = new URL('../../icons/icon-collapse.png', import.meta.url).href\nconst ICON_COLLAPSE_ACTIVE = new URL('../../icons/icon-collapse-active.png', import.meta.url).href\n\nconst ICON_SHELL_INSPECTOR = new URL('../../icons/icon-shell-inspector.png', import.meta.url).href\n\nvar Registry: ComponentGroup[] = []\n\n@customElement('ox-board-modeller')\nexport class BoardModeller extends ScopedElementsMixin(LitElement) {\n static styles = [\n css`\n :host {\n display: flex;\n flex-direction: column;\n\n height: 100%;\n overflow: hidden;\n\n font-family: 'Pretendard', 'Segoe UI', sans-serif;\n }\n\n edit-toolbar {\n flex: 45px;\n max-height: 45px;\n overflow: hidden;\n }\n\n div[content] {\n flex: 1;\n max-height: calc(100% - 45px);\n\n display: flex;\n flex-direction: row;\n }\n\n component-toolbar {\n max-height: 100%;\n }\n\n property-sidebar {\n overflow: hidden;\n }\n\n #scene-wrap {\n position: relative;\n\n flex: 1;\n display: flex;\n flex-direction: row;\n }\n\n ox-scene-viewer {\n flex: 1;\n width: 100%;\n height: 100%;\n }\n\n md-fab {\n position: absolute;\n right: 15px;\n bottom: 15px;\n z-index: 1000;\n }\n\n\n [brand] {\n display: flex;\n white-space: nowrap;\n flex-direction: row;\n align-items: center;\n gap: 3px;\n }\n `\n ]\n\n static registerGroup(group: ComponentGroup) {\n var found = Registry.find(inRegisterGroup => inRegisterGroup.name == group.name)\n\n if (found) {\n found = {\n ...found,\n ...group\n }\n } else {\n Registry.push(group)\n }\n }\n\n static registerTemplate(templates: ComponentTemplate[]): void {\n templates &&\n templates.forEach(template => {\n var groups: string[] = typeof template.group == 'string' ? [template.group] : template.group\n\n Registry.filter(group => groups.includes(group.name)).forEach(group => {\n if (!group.templates.find(inGroupTemplate => inGroupTemplate.type == template.type)) {\n group.templates.push(template)\n }\n })\n })\n }\n\n static get groups(): ComponentGroup[] {\n return Registry\n }\n\n static getGroup(name: string) {\n return Registry.find(group => group.name === name)\n }\n\n @property({ type: String }) boardName: string = ''\n @property({ type: Object }) model: any = null\n @property({ type: String }) baseUrl: string = ''\n @property({ type: Array }) selected: any[] = []\n @property({ type: Number }) mode: SceneMode = SCENE_MODE.EDIT\n @property({ type: Object }) provider: any = null\n @property({ type: Boolean }) hideProperty: boolean = false\n @property({ type: String }) overlay: string = ''\n @property({ type: Object }) scene?: Scene\n @property({ type: Object }) loadTracker?: LoadTracker\n @property({ type: Array }) componentGroupList: any[] = []\n @property({ type: Array }) fonts: any[] = []\n @property({ type: Object }) themes: any = null\n @property({ type: Array }) propertyEditor: any[] = []\n\n @query('edit-toolbar') private editToolbar!: EditToolbar\n\n private group: string = ''\n private shortcutHandler?: (e: KeyboardEvent) => void\n private _loadingOverlay?: LoadingOverlay\n\n constructor() {\n super()\n\n document.addEventListener('get-all-scene-component-ids', (e: Event) => {\n var { component, callback } = (e as CustomEvent).detail\n\n if (!this.scene) return\n\n var ids\n if (component) {\n ids = this.scene.findAll(component).map((c: any) => c.model.id)\n } else {\n ids = this.scene.ids.map(({ key }: { key: string }) => key)\n }\n\n ids = ids.filter(Boolean).sort()\n callback(ids)\n })\n\n this.style.setProperty('--url-icon-properties', `url(${ICON_PROPERTIES})`)\n this.style.setProperty('--url-icon-properties-label', `url(${ICON_PROPERTIES_LABEL})`)\n this.style.setProperty('--url-icon-properties-padding', `url(${ICON_PROPERTIES_PADDING})`)\n this.style.setProperty('--url-icon-properties-line-type', `url(${ICON_PROPERTIES_LINE_TYPE})`)\n this.style.setProperty('--url-icon-properties-arrow-type', `url(${ICON_PROPERTIES_ARROW_TYPE})`)\n\n this.style.setProperty('--url-icon-htoolbar', `url(${ICON_HTOOLBAR})`)\n this.style.setProperty('--url-icon-fullscreen', `url(${ICON_FULLSCREEN})`)\n this.style.setProperty('--url-icon-collapse', `url(${ICON_COLLAPSE})`)\n this.style.setProperty('--url-icon-collapse-active', `url(${ICON_COLLAPSE_ACTIVE})`)\n\n this.style.setProperty('--url-icon-shell-inspector', `url(${ICON_SHELL_INSPECTOR})`)\n }\n\n static get scopedElements() {\n return {\n 'edit-toolbar': EditToolbar,\n 'property-sidebar': PropertySidebar,\n 'component-toolbar': ComponentToolbar\n }\n }\n\n updated(changes: PropertyValues<this>) {\n if (changes.has('loadTracker') && this.loadTracker) {\n if (!this._loadingOverlay) {\n this._loadingOverlay = new LoadingOverlay()\n this._loadingOverlay.renderer = new SceneMonitorRenderer()\n }\n this._loadingOverlay.attach(this.renderRoot as HTMLElement, this.loadTracker, dataLagTracker)\n }\n // M키 로딩 오버레이(scene 내장)에 fmsim Scene Monitor 렌더러 주입.\n if (changes.has('scene') && this.scene?.loadingOverlay) {\n this.scene.loadingOverlay.renderer = new SceneMonitorRenderer()\n }\n }\n\n render() {\n return html`\n <edit-toolbar\n .scene=${this.scene}\n .selected=${this.selected}\n @hide-property-changed=${(e: CustomEvent) => (this.hideProperty = e.detail.value)}\n @open-preview=${() => this.preview()}\n @download-model=${() => this.downloadModel()}\n @modeller-fullscreen=${() => togglefullscreen(this)}\n >\n ${this.renderBrandingZone()}\n </edit-toolbar>\n\n <div content>\n <component-toolbar\n .scene=${this.scene}\n .mode=${this.mode}\n @mode-changed=${(e: CustomEvent) => {\n this.mode = e.detail.value\n }}\n .componentGroupList=${this.componentGroupList}\n .group=${this.group}\n >\n </component-toolbar>\n\n <div id=\"scene-wrap\">\n <ox-scene-viewer\n id=\"scene\"\n .scene=${this.scene}\n .loadTracker=${this.loadTracker}\n @scene-changed=${(e: CustomEvent) => {\n this.scene = e.detail.value\n }}\n .model=${this.model}\n .themes=${this.themes}\n .selected=${this.selected}\n @selected-changed=${(e: CustomEvent) => {\n this.selected = e.detail.value\n }}\n .mode=${this.mode}\n @mode-changed=${(e: CustomEvent) => {\n this.mode = e.detail.value\n }}\n fit=\"ratio\"\n .baseUrl=${this.baseUrl}\n @contextmenu=${() => this.onContextMenu()}\n .provider=${this.provider}\n name=\"modeller\"\n >\n <ox-scene-layer type=\"snap-guide-layer\"></ox-scene-layer>\n <ox-scene-layer type=\"selection-layer\"></ox-scene-layer>\n <ox-scene-layer type=\"modeling-layer\"></ox-scene-layer>\n <ox-scene-layer type=\"add-layer\"> </ox-scene-layer>\n <ox-scene-layer type=\"shift-layer\">\n <ox-scene-property name=\"text\" value=\"${this.overlay}\"></ox-scene-property>\n <ox-scene-property name=\"alpha\" value=\"0.3\"></ox-scene-property>\n <ox-scene-property name=\"fontFamily\" value=\"arial\"></ox-scene-property>\n <ox-scene-property name=\"fontSize\" value=\"30\" type=\"number\"></ox-scene-property>\n <ox-scene-property name=\"fontColor\" value=\"navy\"></ox-scene-property>\n <ox-scene-property name=\"textBaseline\" value=\"top\"></ox-scene-property>\n <ox-scene-property name=\"textAlign\" value=\"left\"></ox-scene-property>\n <ox-scene-property name=\"paddingTop\" value=\"50\" type=\"number\"></ox-scene-property>\n <ox-scene-property name=\"paddingLeft\" value=\"50\" type=\"number\"></ox-scene-property>\n </ox-scene-layer>\n <ox-scene-handler type=\"text-editor\"></ox-scene-handler>\n <ox-scene-handler type=\"move-handler\"></ox-scene-handler>\n </ox-scene-viewer>\n\n <md-fab @click=${() => this.onTapSave()} title=\"save\"><md-icon slot=\"icon\">save</md-icon></md-fab>\n </div>\n\n <property-sidebar\n .scene=${this.scene}\n .selected=${this.selected}\n .collapsed=${this.hideProperty}\n .fonts=${this.fonts}\n .propertyEditor=${this.propertyEditor}\n >\n </property-sidebar>\n </div>\n `\n }\n\n connectedCallback(): void {\n super.connectedCallback()\n this.bindShortcutEvent()\n }\n\n disconnectedCallback(): void {\n super.disconnectedCallback()\n this.unbindShortcutEvent()\n }\n\n close() {\n this.model = null\n this.requestUpdate()\n }\n\n onShortcut(e: KeyboardEvent) {\n if (MACOS) var ctrlKey = e.metaKey\n else var ctrlKey = e.ctrlKey\n\n switch (e.code) {\n case 'KeyS':\n if (ctrlKey) {\n this.onTapSave()\n e.preventDefault()\n }\n break\n }\n }\n\n preview() {\n const board = {\n id: 'preview',\n model: this.scene?.model ? JSON.parse(JSON.stringify(this.scene.model)) : null,\n style: this.scene?.rootContainer.style\n }\n\n OxPopup.open({\n template: html`\n <ox-board-viewer\n style=\"width:100%;height:100%;background:white;\"\n .provider=${this.provider}\n .board=${board}\n ></ox-board-viewer>\n `,\n style: 'width:90vw;height:90vh;',\n backdrop: true,\n preventCloseOnBlur: true\n })\n\n requestAnimationFrame(() => {\n dispatchEvent(new Event('resize'))\n })\n }\n\n downloadModel() {\n if (!this.scene) return\n\n var model = JSON.stringify(this.model, null, 2)\n var filename = (this.boardName \|\| 'NONAME') + '-' + Date.now() + '.json'\n saveAs(new Blob([model], { type: 'application/octet-stream' }), filename)\n }\n\n renderBrandingZone() {\n return html`\n <div brand>\n <md-icon\n @click=${() => {\n navigate('board-list')\n return false\n }}\n >home</md-icon\n >\n <div board_name>${this.boardName}</div>\n </div>\n `\n }\n\n onTapSave() {\n this.dispatchEvent(new CustomEvent('save-model', { bubbles: true, composed: true, detail: { model: this.model } }))\n }\n\n bindShortcutEvent() {\n // TODO: Global Hotkey에 대한 정의를 edit-toolbar에서 가져올 수 있도록 수정해야 함.\n const GLOBAL_HOTKEYS = ['Digit1', 'Digit2', 'F11', 'KeyD', 'KeyP', 'KeyS']\n\n this.shortcutHandler = (e: KeyboardEvent) => {\n const target = e.composedPath()[0] as HTMLElement\n var tagName = target.tagName\n var isInput = target.isContentEditable \|\| tagName == 'INPUT' \|\| tagName == 'SELECT' \|\| tagName == 'TEXTAREA'\n var isGlobalHotkey = GLOBAL_HOTKEYS.includes(e.code)\n\n if (!isGlobalHotkey && isInput) return\n if (!this.editToolbar.onShortcut(e)) this.onShortcut(e)\n }\n\n document.addEventListener('keydown', this.shortcutHandler)\n }\n\n unbindShortcutEvent() {\n if (this.shortcutHandler) {\n document.removeEventListener('keydown', this.shortcutHandler)\n delete this.shortcutHandler\n }\n }\n\n onContextMenu() {}\n}\n"]}