npm - @operato/scene-visualizer - Versions diffs - 10.0.0-beta.2 → 10.0.0-beta.4 - Mend

@operato/scene-visualizer 10.0.0-beta.2 → 10.0.0-beta.4

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 (9) hide show

package/dist/editors/property-editor-gltf-fill-targets.d.ts CHANGED Viewed

@@ -3,7 +3,7 @@ import { PropertyValues, TemplateResult } from 'lit';
 import { OxPropertyEditor, PropertySpec } from '@operato/property-editor';
 export default class GLTFFillTargetsEditor extends OxPropertyEditor {
     static styles: import("lit").CSSResult[];
-    src?: string;
+    src: string | undefined;
     private _meshNames;
     private _component;
     updated(changes: PropertyValues<this>): void;

package/dist/editors/property-editor-gltf-fill-targets.js CHANGED Viewed

@@ -64,8 +64,6 @@ let GLTFFillTargetsEditor = class GLTFFillTargetsEditor extends OxPropertyEditor
       }
     `
     ];
-    src;
-    _meshNames = [];
     _component = null;
     updated(changes) {
         if (changes.has('src')) {
@@ -100,24 +98,24 @@ let GLTFFillTargetsEditor = class GLTFFillTargetsEditor extends OxPropertyEditor
     editorTemplate(value, _spec) {
         const targets = Array.isArray(value) ? value : [];
         // GLTF 로드 완료 후 nodeNames가 채워지므로, 비어있으면 재시도
-        if (this._meshNames.length === 0) {
+        if (!this._meshNames?.length) {
             this._refreshMeshNames();
         }
         return html `
       <fieldset fullwidth>
         <legend><ox-i18n msgid="label.fill-targets">fillStyle Targets</ox-i18n></legend>
-        ${this._meshNames.length > 0
+        ${(this._meshNames?.length ?? 0) > 0
             ? html `<div class="toolbar">
                 <button type="button" @click=${() => this._setAll(true)}>All</button>
                 <button type="button" @click=${() => this._setAll(false)}>None</button>
               </div>`
             : ''}
         <div class="node-list">
-          ${this._meshNames.length === 0
+          ${(this._meshNames?.length ?? 0) === 0
             ? html `<div class="empty">
                 <ox-i18n msgid="label.no-gltf-meshes">No meshes available</ox-i18n>
               </div>`
-            : this._meshNames.map(name => html `
+            : (this._meshNames ?? []).map(name => html `
                   <label
                     class="node-item"
                     @mouseenter=${() => this._highlightNode(name)}
@@ -139,7 +137,7 @@ let GLTFFillTargetsEditor = class GLTFFillTargetsEditor extends OxPropertyEditor
     `;
     }
     _setAll(select) {
-        const newValue = select ? [...this._meshNames] : undefined;
+        const newValue = select ? [...(this._meshNames ?? [])] : undefined;
         this.dispatchEvent(new CustomEvent('i-need-selected', {
             bubbles: true,
             composed: true,

package/dist/editors/property-editor-gltf-fill-targets.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"property-editor-gltf-fill-targets.js","sourceRoot":"","sources":["../../src/editors/property-editor-gltf-fill-targets.ts"],"names":[],"mappings":"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","sourcesContent":["/\n Copyright © HatioLab Inc. All rights reserved.\n \n GLTF fillStyle 타겟 노드 선택 에디터.\n * Specific 탭에서 GLTF 모델의 Mesh 노드 목록을 체크박스로 표시하고,\n * 선택된 노드 이름을 fillStyleTargets 배열로 저장한다.\n * 마우스 오버 시 해당 노드를 OutlinePass로 강조한다.\n */\n\nimport '@operato/i18n/ox-i18n.js'\n\nimport { css, html, PropertyValues, TemplateResult } from 'lit'\nimport { customElement, property, state } from 'lit/decorators.js'\n\nimport { OxPropertyEditor, PropertySpec } from '@operato/property-editor'\n\n@customElement('property-editor-gltf-fill-targets')\nexport default class GLTFFillTargetsEditor extends OxPropertyEditor {\n static styles = [\n ...OxPropertyEditor.styles,\n css`\n .node-list {\n display: flex;\n flex-direction: column;\n gap: 1px;\n max-height: 200px;\n overflow-y: auto;\n font-size: 12px;\n }\n\n .node-item {\n display: flex;\n align-items: center;\n gap: 4px;\n padding: 2px 4px;\n cursor: pointer;\n border-radius: 2px;\n }\n\n .node-item:hover {\n background: rgba(242, 101, 34, 0.15);\n }\n\n .toolbar {\n display: flex;\n gap: 2px;\n margin-bottom: 2px;\n }\n\n .toolbar button {\n font-size: 11px;\n padding: 1px 6px;\n border: 1px solid var(--md-sys-color-outline, #ccc);\n border-radius: 2px;\n background: transparent;\n color: var(--md-sys-color-on-surface, #333);\n cursor: pointer;\n }\n\n .toolbar button:hover {\n background: rgba(0, 0, 0, 0.06);\n }\n\n .empty {\n color: var(--md-sys-color-outline, #999);\n font-size: 11px;\n padding: 4px;\n }\n `\n ]\n\n @property({ type: String }) src?: string\n\n @state() private _meshNames: string[] = []\n\n private _component: any = null\n\n updated(changes: PropertyValues<this>) {\n if (changes.has('src')) {\n this.dispatchEvent(\n new CustomEvent('i-need-selected', {\n bubbles: true,\n composed: true,\n detail: {\n callback: (selected: any[]) => {\n this._component = selected?.[0]\n this._refreshMeshNames()\n }\n }\n })\n )\n }\n }\n\n private _refreshMeshNames() {\n if (!this._component) {\n this._meshNames = []\n return\n }\n\n const ro = this._component.realObject as any\n if (!ro?.getNode) {\n this._meshNames = []\n return\n }\n\n // Mesh 노드만 필터링 — 그룹/본 등은 fillStyle 적용 대상이 아님\n this._meshNames = (this._component.nodeNames ?? []).filter((name: string) => {\n const node = ro.getNode(name)\n return node?.isMesh\n })\n }\n\n editorTemplate(value: any, _spec: PropertySpec): TemplateResult {\n const targets: string[] = Array.isArray(value) ? value : []\n\n // GLTF 로드 완료 후 nodeNames가 채워지므로, 비어있으면 재시도\n if (this._meshNames.length === 0) {\n this._refreshMeshNames()\n }\n\n return html`\n <fieldset fullwidth>\n <legend><ox-i18n msgid=\"label.fill-targets\">fillStyle Targets</ox-i18n></legend>\n ${this._meshNames.length > 0\n ? html`<div class=\"toolbar\">\n <button type=\"button\" @click=${() => this._setAll(true)}>All</button>\n <button type=\"button\" @click=${() => this._setAll(false)}>None</button>\n </div>`\n : ''}\n <div class=\"node-list\">\n ${this._meshNames.length === 0\n ? html`<div class=\"empty\">\n <ox-i18n msgid=\"label.no-gltf-meshes\">No meshes available</ox-i18n>\n </div>`\n : this._meshNames.map(\n name => html`\n <label\n class=\"node-item\"\n @mouseenter=${() => this._highlightNode(name)}\n @mouseleave=${() => this._clearHighlight()}\n >\n <input\n type=\"checkbox\"\n .checked=${targets.includes(name)}\n @change=${(e: Event) => {\n e.stopPropagation()\n this._onToggle(name, (e.target as HTMLInputElement).checked)\n }}\n />\n <span>${name}</span>\n </label>\n `\n )}\n </div>\n </fieldset>\n `\n }\n\n private _setAll(select: boolean) {\n const newValue = select ? [...this._meshNames] : undefined\n\n this.dispatchEvent(\n new CustomEvent('i-need-selected', {\n bubbles: true,\n composed: true,\n detail: {\n callback: (selected: any[]) => {\n selected[0].set('fillStyleTargets', newValue)\n }\n }\n })\n )\n }\n\n private _onToggle(name: string, checked: boolean) {\n const current = [...(Array.isArray(this.value) ? this.value : [])]\n if (checked) {\n if (!current.includes(name)) current.push(name)\n } else {\n const idx = current.indexOf(name)\n if (idx >= 0) current.splice(idx, 1)\n }\n\n const newValue = current.length > 0 ? current : undefined\n\n this.dispatchEvent(\n new CustomEvent('i-need-selected', {\n bubbles: true,\n composed: true,\n detail: {\n callback: (selected: any[]) => {\n selected[0].set('fillStyleTargets', newValue)\n }\n }\n })\n )\n }\n\n // --- Outline 강조 ---\n\n private _highlightNode(name: string) {\n const ro = this._component?.realObject as any\n if (!ro?.getNode) return\n\n const node = ro.getNode(name)\n if (!node) return\n\n this._getRendererManager()?.setOutlineObjects([node])\n this._component?.invalidate()\n }\n\n private _clearHighlight() {\n const ro = this._component?.realObject as any\n if (!ro) return\n\n // 선택 상태의 아웃라인 복원 (전체 GLTF 오브젝트)\n this._getRendererManager()?.setOutlineObjects(ro.object3d ? [ro.object3d] : [])\n this._component?.invalidate()\n }\n\n private _getRendererManager(): any {\n const ro = this._component?.realObject as any\n const container = ro?.threeContainer as any\n // ThreeContainer._capability 또는 ModelLayer._threeCapability\n return container?._capability?.rendererManager ?? container?._threeCapability?.rendererManager ?? null\n }\n}\n"]}
1	+ {"version":3,"file":"property-editor-gltf-fill-targets.js","sourceRoot":"","sources":["../../src/editors/property-editor-gltf-fill-targets.ts"],"names":[],"mappings":"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","sourcesContent":["/\n Copyright © HatioLab Inc. All rights reserved.\n \n GLTF fillStyle 타겟 노드 선택 에디터.\n * Specific 탭에서 GLTF 모델의 Mesh 노드 목록을 체크박스로 표시하고,\n * 선택된 노드 이름을 fillStyleTargets 배열로 저장한다.\n * 마우스 오버 시 해당 노드를 OutlinePass로 강조한다.\n */\n\nimport '@operato/i18n/ox-i18n.js'\n\nimport { css, html, PropertyValues, TemplateResult } from 'lit'\nimport { customElement, property, state } from 'lit/decorators.js'\n\nimport { OxPropertyEditor, PropertySpec } from '@operato/property-editor'\n\n@customElement('property-editor-gltf-fill-targets')\nexport default class GLTFFillTargetsEditor extends OxPropertyEditor {\n static styles = [\n ...OxPropertyEditor.styles,\n css`\n .node-list {\n display: flex;\n flex-direction: column;\n gap: 1px;\n max-height: 200px;\n overflow-y: auto;\n font-size: 12px;\n }\n\n .node-item {\n display: flex;\n align-items: center;\n gap: 4px;\n padding: 2px 4px;\n cursor: pointer;\n border-radius: 2px;\n }\n\n .node-item:hover {\n background: rgba(242, 101, 34, 0.15);\n }\n\n .toolbar {\n display: flex;\n gap: 2px;\n margin-bottom: 2px;\n }\n\n .toolbar button {\n font-size: 11px;\n padding: 1px 6px;\n border: 1px solid var(--md-sys-color-outline, #ccc);\n border-radius: 2px;\n background: transparent;\n color: var(--md-sys-color-on-surface, #333);\n cursor: pointer;\n }\n\n .toolbar button:hover {\n background: rgba(0, 0, 0, 0.06);\n }\n\n .empty {\n color: var(--md-sys-color-outline, #999);\n font-size: 11px;\n padding: 4px;\n }\n `\n ]\n\n @property({ type: String }) declare src: string \| undefined\n\n @state() declare private _meshNames: string[]\n\n private _component: any = null\n\n updated(changes: PropertyValues<this>) {\n if (changes.has('src')) {\n this.dispatchEvent(\n new CustomEvent('i-need-selected', {\n bubbles: true,\n composed: true,\n detail: {\n callback: (selected: any[]) => {\n this._component = selected?.[0]\n this._refreshMeshNames()\n }\n }\n })\n )\n }\n }\n\n private _refreshMeshNames() {\n if (!this._component) {\n this._meshNames = []\n return\n }\n\n const ro = this._component.realObject as any\n if (!ro?.getNode) {\n this._meshNames = []\n return\n }\n\n // Mesh 노드만 필터링 — 그룹/본 등은 fillStyle 적용 대상이 아님\n this._meshNames = ((this._component.nodeNames as string[]) ?? []).filter((name: string) => {\n const node = ro.getNode(name)\n return node?.isMesh\n })\n }\n\n editorTemplate(value: any, _spec: PropertySpec): TemplateResult {\n const targets: string[] = Array.isArray(value) ? value : []\n\n // GLTF 로드 완료 후 nodeNames가 채워지므로, 비어있으면 재시도\n if (!this._meshNames?.length) {\n this._refreshMeshNames()\n }\n\n return html`\n <fieldset fullwidth>\n <legend><ox-i18n msgid=\"label.fill-targets\">fillStyle Targets</ox-i18n></legend>\n ${(this._meshNames?.length ?? 0) > 0\n ? html`<div class=\"toolbar\">\n <button type=\"button\" @click=${() => this._setAll(true)}>All</button>\n <button type=\"button\" @click=${() => this._setAll(false)}>None</button>\n </div>`\n : ''}\n <div class=\"node-list\">\n ${(this._meshNames?.length ?? 0) === 0\n ? html`<div class=\"empty\">\n <ox-i18n msgid=\"label.no-gltf-meshes\">No meshes available</ox-i18n>\n </div>`\n : (this._meshNames ?? []).map(\n name => html`\n <label\n class=\"node-item\"\n @mouseenter=${() => this._highlightNode(name)}\n @mouseleave=${() => this._clearHighlight()}\n >\n <input\n type=\"checkbox\"\n .checked=${targets.includes(name)}\n @change=${(e: Event) => {\n e.stopPropagation()\n this._onToggle(name, (e.target as HTMLInputElement).checked)\n }}\n />\n <span>${name}</span>\n </label>\n `\n )}\n </div>\n </fieldset>\n `\n }\n\n private _setAll(select: boolean) {\n const newValue = select ? [...(this._meshNames ?? [])] : undefined\n\n this.dispatchEvent(\n new CustomEvent('i-need-selected', {\n bubbles: true,\n composed: true,\n detail: {\n callback: (selected: any[]) => {\n selected[0].set('fillStyleTargets', newValue)\n }\n }\n })\n )\n }\n\n private _onToggle(name: string, checked: boolean) {\n const current = [...(Array.isArray(this.value) ? this.value : [])]\n if (checked) {\n if (!current.includes(name)) current.push(name)\n } else {\n const idx = current.indexOf(name)\n if (idx >= 0) current.splice(idx, 1)\n }\n\n const newValue = current.length > 0 ? current : undefined\n\n this.dispatchEvent(\n new CustomEvent('i-need-selected', {\n bubbles: true,\n composed: true,\n detail: {\n callback: (selected: any[]) => {\n selected[0].set('fillStyleTargets', newValue)\n }\n }\n })\n )\n }\n\n // --- Outline 강조 ---\n\n private _highlightNode(name: string) {\n const ro = this._component?.realObject as any\n if (!ro?.getNode) return\n\n const node = ro.getNode(name)\n if (!node) return\n\n this._getRendererManager()?.setOutlineObjects([node])\n this._component?.invalidate()\n }\n\n private _clearHighlight() {\n const ro = this._component?.realObject as any\n if (!ro) return\n\n // 선택 상태의 아웃라인 복원 (전체 GLTF 오브젝트)\n this._getRendererManager()?.setOutlineObjects(ro.object3d ? [ro.object3d] : [])\n this._component?.invalidate()\n }\n\n private _getRendererManager(): any {\n const ro = this._component?.realObject as any\n const container = ro?.threeContainer as any\n // ThreeContainer._capability 또는 ModelLayer._threeCapability\n return container?._capability?.rendererManager ?? container?._threeCapability?.rendererManager ?? null\n }\n}\n"]}

package/dist/editors/property-editor-gltf-info.d.ts CHANGED Viewed

@@ -6,11 +6,18 @@ import { OxPropertyEditor, PropertySpec } from '@operato/property-editor';
 import { Component } from '@hatiolab/things-scene';
 export default class GLTFInfoEditor extends OxPropertyEditor {
     static styles: import("lit").CSSResult[];
-    src?: string;
+    src: string | undefined;
     width: number;
     height: number;
     depth: number;
+    constructor();
     editorTemplate(value: any, spec: PropertySpec): TemplateResult;
+    private _applyAction;
+    /**
+     * 현재 컴포넌트의 W/H/D 중 가장 큰 값을 기준으로,
+     * 원래 모델의 비율에 맞게 나머지 치수를 조절한다.
+     */
+    private _applyProportional;
     updated(changes: PropertyValues<this>): void;
     fetchSourceInfo(component: Component, src: string): Promise<unknown>;
 }

package/dist/editors/property-editor-gltf-info.js CHANGED Viewed

@@ -35,16 +35,23 @@ let GLTFInfoEditor = class GLTFInfoEditor extends OxPropertyEditor {
         font-weight: bold;
       }
-      div[info] md-elevated-button {
+      .buttons {
+        display: flex;
+        gap: 4px;
         margin-left: auto;
+      }
+      .buttons md-elevated-button {
         --md-icon-size: 24px;
       }
     `
     ];
-    src;
-    width = 0;
-    height = 0;
-    depth = 0;
+    constructor() {
+        super();
+        this.width = 0;
+        this.height = 0;
+        this.depth = 0;
+    }
     editorTemplate(value, spec) {
         const valid = this.width && this.height && this.depth;
         var property = spec.property || {};
@@ -58,32 +65,81 @@ let GLTFInfoEditor = class GLTFInfoEditor extends OxPropertyEditor {
             <div label>[W x H x D] :</div>
             ${valid
             ? html ` <div value>${this.width} x ${this.height} x ${this.depth}</div>
-                  <md-elevated-button
-                    @click=${(e) => {
-                this.dispatchEvent(new CustomEvent('i-need-selected', {
-                    bubbles: true,
-                    composed: true,
-                    detail: {
-                        callback: (selected) => {
-                            typeof action === 'function' &&
-                                action(selected[0], {
-                                    width: this.width,
-                                    height: this.height,
-                                    depth: this.depth
-                                });
-                        }
-                    }
-                }));
+                  <div class="buttons">
+                    <md-elevated-button
+                      title="원래 크기로 설정"
+                      @click=${() => {
+                this._applyAction(action, {
+                    width: this.width,
+                    height: this.height,
+                    depth: this.depth
+                });
             }}
-                  >
-                    <md-icon>autorenew</md-icon>
-                  </md-elevated-button>`
+                    >
+                      <md-icon>autorenew</md-icon>
+                    </md-elevated-button>
+                    <md-elevated-button
+                      title="현재 크기에 비율 맞춤"
+                      @click=${() => this._applyProportional(action)}
+                    >
+                      <md-icon>aspect_ratio</md-icon>
+                    </md-elevated-button>
+                  </div>`
             : html ` <div></div> `}
           </div>
         </div>
       </fieldset>
     `;
     }
+    _applyAction(action, dimension) {
+        this.dispatchEvent(new CustomEvent('i-need-selected', {
+            bubbles: true,
+            composed: true,
+            detail: {
+                callback: (selected) => {
+                    typeof action === 'function' && action(selected[0], dimension);
+                }
+            }
+        }));
+    }
+    /**
+     * 현재 컴포넌트의 W/H/D 중 가장 큰 값을 기준으로,
+     * 원래 모델의 비율에 맞게 나머지 치수를 조절한다.
+     */
+    _applyProportional(action) {
+        this.dispatchEvent(new CustomEvent('i-need-selected', {
+            bubbles: true,
+            composed: true,
+            detail: {
+                callback: (selected) => {
+                    const component = selected[0];
+                    if (!component || typeof action !== 'function')
+                        return;
+                    const { width: cw = 1, height: ch = 1, depth: cd = 1 } = component.state;
+                    const { width: ow, height: oh, depth: od } = this; // 원래 모델 치수
+                    if (!ow || !oh || !od)
+                        return;
+                    // 현재 치수 중 가장 큰 값과, 그에 대응하는 원래 모델 치수로 scale 계산
+                    const maxCurrent = Math.max(cw, ch, cd);
+                    let scale;
+                    if (maxCurrent === cw) {
+                        scale = cw / ow;
+                    }
+                    else if (maxCurrent === ch) {
+                        scale = ch / oh;
+                    }
+                    else {
+                        scale = cd / od;
+                    }
+                    action(component, {
+                        width: Math.round(ow * scale),
+                        height: Math.round(oh * scale),
+                        depth: Math.round(od * scale)
+                    });
+                }
+            }
+        }));
+    }
     updated(changes) {
         if (changes.has('src')) {
             this.dispatchEvent(new CustomEvent('i-need-selected', {

package/dist/editors/property-editor-gltf-info.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"property-editor-gltf-info.js","sourceRoot":"","sources":["../../src/editors/property-editor-gltf-info.ts"],"names":[],"mappings":"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","sourcesContent":["import '@material/web/icon/icon.js'\nimport '@material/web/button/elevated-button.js'\nimport '@operato/i18n/ox-i18n.js'\n\nimport { css, html, PropertyValues, TemplateResult } from 'lit'\nimport { customElement, property, state } from 'lit/decorators.js'\n\nimport { OxPropertyEditor, PropertySpec } from '@operato/property-editor'\nimport { Component } from '@hatiolab/things-scene'\n\nimport * as THREE from 'three'\nimport { GLTFLoader } from 'three/examples/jsm/loaders/GLTFLoader.js'\n\nconst EXT_SPECGLOSS = 'KHR_materials_pbrSpecularGlossiness'\n\nclass SpecGlossCompat {\n name = EXT_SPECGLOSS\n extendMaterialParams() {\n return Promise.resolve()\n }\n}\n\nfunction registerSpecGlossCompat(loader: GLTFLoader) {\n loader.register(() => new SpecGlossCompat())\n}\n\n@customElement('property-editor-gltf-info')\nexport default class GLTFInfoEditor extends OxPropertyEditor {\n static styles = [\n ...OxPropertyEditor.styles,\n css`\n div[info] {\n display: flex;\n flex-direction: row;\n font-size: 12px;\n }\n\n div[info] * {\n align-self: center;\n }\n\n div[info] title {\n font-weight: bold;\n }\n\n div[info] md-elevated-button {\n margin-left: auto;\n --md-icon-size: 24px;\n }\n `\n ]\n\n @property({ type: String }) src?: string\n\n @state() width: number = 0\n @state() height: number = 0\n @state() depth: number = 0\n\n editorTemplate(value: any, spec: PropertySpec): TemplateResult {\n const valid = this.width && this.height && this.depth\n\n var property = spec.property \|\| {}\n var { action } = property\n\n return html`\n <fieldset fullwidth>\n <legend><ox-i18n msgid=\"label.gltf-info\">GLTF info.</ox-i18n></legend>\n\n <div>\n <div info>\n <div label>[W x H x D] :</div>\n ${valid\n ? html` <div value>${this.width} x ${this.height} x ${this.depth}</div>\n <md-elevated-button\n @click=${(e: MouseEvent) => {\n this.dispatchEvent(\n new CustomEvent('i-need-selected', {\n bubbles: true,\n composed: true,\n detail: {\n callback: (selected: any[]) => {\n typeof action === 'function' &&\n action(selected[0], {\n width: this.width,\n height: this.height,\n depth: this.depth\n })\n }\n }\n })\n )\n }}\n >\n <md-icon>autorenew</md-icon>\n </md-elevated-button>`\n : html` <div></div> `}\n </div>\n </div>\n </fieldset>\n `\n }\n\n updated(changes: PropertyValues<this>) {\n if (changes.has('src')) {\n this.dispatchEvent(\n new CustomEvent('i-need-selected', {\n bubbles: true,\n composed: true,\n detail: {\n callback: async (selected: any[]) => {\n await this.fetchSourceInfo(selected[0], this.src!)\n }\n }\n })\n )\n }\n }\n\n async fetchSourceInfo(component: Component, src: string) {\n if (!src \|\| !src.trim()) {\n return\n }\n\n try {\n const path = component.app.url(src)\n\n let gltfLoader = new GLTFLoader()\n registerSpecGlossCompat(gltfLoader)\n\n gltfLoader.setCrossOrigin('use-credentials')\n\n return new Promise((resolve: any) => {\n gltfLoader.load(path, gltf => {\n var box = new THREE.Box3().setFromObject(gltf.scene)\n var { x, y, z } = box.getSize(new THREE.Vector3())\n\n this.width = Math.floor(x)\n this.depth = Math.floor(y)\n this.height = Math.floor(z)\n\n resolve()\n })\n })\n } catch (e) {\n console.error(e)\n return\n }\n }\n}\n"]}
1	+ {"version":3,"file":"property-editor-gltf-info.js","sourceRoot":"","sources":["../../src/editors/property-editor-gltf-info.ts"],"names":[],"mappings":";AAAA,OAAO,4BAA4B,CAAA;AACnC,OAAO,yCAAyC,CAAA;AAChD,OAAO,0BAA0B,CAAA;AAEjC,OAAO,EAAE,GAAG,EAAE,IAAI,EAAkC,MAAM,KAAK,CAAA;AAC/D,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,KAAK,EAAE,MAAM,mBAAmB,CAAA;AAElE,OAAO,EAAE,gBAAgB,EAAgB,MAAM,0BAA0B,CAAA;AAGzE,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,EAAE,UAAU,EAAE,MAAM,0CAA0C,CAAA;AAErE,MAAM,aAAa,GAAG,qCAAqC,CAAA;AAE3D,MAAM,eAAe;IACnB,IAAI,GAAG,aAAa,CAAA;IACpB,oBAAoB;QAClB,OAAO,OAAO,CAAC,OAAO,EAAE,CAAA;IAC1B,CAAC;CACF;AAED,SAAS,uBAAuB,CAAC,MAAkB;IACjD,MAAM,CAAC,QAAQ,CAAC,GAAG,EAAE,CAAC,IAAI,eAAe,EAAE,CAAC,CAAA;AAC9C,CAAC;AAGc,IAAM,cAAc,GAApB,MAAM,cAAe,SAAQ,gBAAgB;IAC1D,MAAM,CAAC,MAAM,GAAG;QACd,GAAG,gBAAgB,CAAC,MAAM;QAC1B,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;KAwBF;KACF,CAAA;IAQD;QACE,KAAK,EAAE,CAAA;QACP,IAAI,CAAC,KAAK,GAAG,CAAC,CAAA;QACd,IAAI,CAAC,MAAM,GAAG,CAAC,CAAA;QACf,IAAI,CAAC,KAAK,GAAG,CAAC,CAAA;IAChB,CAAC;IAED,cAAc,CAAC,KAAU,EAAE,IAAkB;QAC3C,MAAM,KAAK,GAAG,IAAI,CAAC,KAAK,IAAI,IAAI,CAAC,MAAM,IAAI,IAAI,CAAC,KAAK,CAAA;QAErD,IAAI,QAAQ,GAAG,IAAI,CAAC,QAAQ,IAAI,EAAE,CAAA;QAClC,IAAI,EAAE,MAAM,EAAE,GAAG,QAAQ,CAAA;QAEzB,OAAO,IAAI,CAAA;;;;;;;cAOD,KAAK;YACL,CAAC,CAAC,IAAI,CAAA,eAAe,IAAI,CAAC,KAAK,MAAM,IAAI,CAAC,MAAM,MAAM,IAAI,CAAC,KAAK;;;;+BAI/C,GAAG,EAAE;gBACZ,IAAI,CAAC,YAAY,CAAC,MAAM,EAAE;oBACxB,KAAK,EAAE,IAAI,CAAC,KAAK;oBACjB,MAAM,EAAE,IAAI,CAAC,MAAM;oBACnB,KAAK,EAAE,IAAI,CAAC,KAAK;iBAClB,CAAC,CAAA;YACJ,CAAC;;;;;;+BAMQ,GAAG,EAAE,CAAC,IAAI,CAAC,kBAAkB,CAAC,MAAM,CAAC;;;;yBAI3C;YACX,CAAC,CAAC,IAAI,CAAA,eAAe;;;;KAI9B,CAAA;IACH,CAAC;IAEO,YAAY,CAAC,MAAW,EAAE,SAA2D;QAC3F,IAAI,CAAC,aAAa,CAChB,IAAI,WAAW,CAAC,iBAAiB,EAAE;YACjC,OAAO,EAAE,IAAI;YACb,QAAQ,EAAE,IAAI;YACd,MAAM,EAAE;gBACN,QAAQ,EAAE,CAAC,QAAe,EAAE,EAAE;oBAC5B,OAAO,MAAM,KAAK,UAAU,IAAI,MAAM,CAAC,QAAQ,CAAC,CAAC,CAAC,EAAE,SAAS,CAAC,CAAA;gBAChE,CAAC;aACF;SACF,CAAC,CACH,CAAA;IACH,CAAC;IAED;;;OAGG;IACK,kBAAkB,CAAC,MAAW;QACpC,IAAI,CAAC,aAAa,CAChB,IAAI,WAAW,CAAC,iBAAiB,EAAE;YACjC,OAAO,EAAE,IAAI;YACb,QAAQ,EAAE,IAAI;YACd,MAAM,EAAE;gBACN,QAAQ,EAAE,CAAC,QAAe,EAAE,EAAE;oBAC5B,MAAM,SAAS,GAAG,QAAQ,CAAC,CAAC,CAAC,CAAA;oBAC7B,IAAI,CAAC,SAAS,IAAI,OAAO,MAAM,KAAK,UAAU;wBAAE,OAAM;oBAEtD,MAAM,EAAE,KAAK,EAAE,EAAE,GAAG,CAAC,EAAE,MAAM,EAAE,EAAE,GAAG,CAAC,EAAE,KAAK,EAAE,EAAE,GAAG,CAAC,EAAE,GAAG,SAAS,CAAC,KAAK,CAAA;oBACxE,MAAM,EAAE,KAAK,EAAE,EAAE,EAAE,MAAM,EAAE,EAAE,EAAE,KAAK,EAAE,EAAE,EAAE,GAAG,IAAI,CAAA,CAAC,WAAW;oBAE7D,IAAI,CAAC,EAAE,IAAI,CAAC,EAAE,IAAI,CAAC,EAAE;wBAAE,OAAM;oBAE7B,8CAA8C;oBAC9C,MAAM,UAAU,GAAG,IAAI,CAAC,GAAG,CAAC,EAAE,EAAE,EAAE,EAAE,EAAE,CAAC,CAAA;oBACvC,IAAI,KAAa,CAAA;oBAEjB,IAAI,UAAU,KAAK,EAAE,EAAE,CAAC;wBACtB,KAAK,GAAG,EAAE,GAAG,EAAE,CAAA;oBACjB,CAAC;yBAAM,IAAI,UAAU,KAAK,EAAE,EAAE,CAAC;wBAC7B,KAAK,GAAG,EAAE,GAAG,EAAE,CAAA;oBACjB,CAAC;yBAAM,CAAC;wBACN,KAAK,GAAG,EAAE,GAAG,EAAE,CAAA;oBACjB,CAAC;oBAED,MAAM,CAAC,SAAS,EAAE;wBAChB,KAAK,EAAE,IAAI,CAAC,KAAK,CAAC,EAAE,GAAG,KAAK,CAAC;wBAC7B,MAAM,EAAE,IAAI,CAAC,KAAK,CAAC,EAAE,GAAG,KAAK,CAAC;wBAC9B,KAAK,EAAE,IAAI,CAAC,KAAK,CAAC,EAAE,GAAG,KAAK,CAAC;qBAC9B,CAAC,CAAA;gBACJ,CAAC;aACF;SACF,CAAC,CACH,CAAA;IACH,CAAC;IAED,OAAO,CAAC,OAA6B;QACnC,IAAI,OAAO,CAAC,GAAG,CAAC,KAAK,CAAC,EAAE,CAAC;YACvB,IAAI,CAAC,aAAa,CAChB,IAAI,WAAW,CAAC,iBAAiB,EAAE;gBACjC,OAAO,EAAE,IAAI;gBACb,QAAQ,EAAE,IAAI;gBACd,MAAM,EAAE;oBACN,QAAQ,EAAE,KAAK,EAAE,QAAe,EAAE,EAAE;wBAClC,MAAM,IAAI,CAAC,eAAe,CAAC,QAAQ,CAAC,CAAC,CAAC,EAAE,IAAI,CAAC,GAAI,CAAC,CAAA;oBACpD,CAAC;iBACF;aACF,CAAC,CACH,CAAA;QACH,CAAC;IACH,CAAC;IAED,KAAK,CAAC,eAAe,CAAC,SAAoB,EAAE,GAAW;QACrD,IAAI,CAAC,GAAG,IAAI,CAAC,GAAG,CAAC,IAAI,EAAE,EAAE,CAAC;YACxB,OAAM;QACR,CAAC;QAED,IAAI,CAAC;YACH,MAAM,IAAI,GAAG,SAAS,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,CAAA;YAEnC,IAAI,UAAU,GAAG,IAAI,UAAU,EAAE,CAAA;YACjC,uBAAuB,CAAC,UAAU,CAAC,CAAA;YAEnC,UAAU,CAAC,cAAc,CAAC,iBAAiB,CAAC,CAAA;YAE5C,OAAO,IAAI,OAAO,CAAC,CAAC,OAAY,EAAE,EAAE;gBAClC,UAAU,CAAC,IAAI,CAAC,IAAI,EAAE,IAAI,CAAC,EAAE;oBAC3B,IAAI,GAAG,GAAG,IAAI,KAAK,CAAC,IAAI,EAAE,CAAC,aAAa,CAAC,IAAI,CAAC,KAAK,CAAC,CAAA;oBACpD,IAAI,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,GAAG,GAAG,CAAC,OAAO,CAAC,IAAI,KAAK,CAAC,OAAO,EAAE,CAAC,CAAA;oBAElD,IAAI,CAAC,KAAK,GAAG,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,CAAA;oBAC1B,IAAI,CAAC,KAAK,GAAG,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,CAAA;oBAC1B,IAAI,CAAC,MAAM,GAAG,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,CAAA;oBAE3B,OAAO,EAAE,CAAA;gBACX,CAAC,CAAC,CAAA;YACJ,CAAC,CAAC,CAAA;QACJ,CAAC;QAAC,OAAO,CAAC,EAAE,CAAC;YACX,OAAO,CAAC,KAAK,CAAC,CAAC,CAAC,CAAA;YAChB,OAAM;QACR,CAAC;IACH,CAAC;;AA5JmC;IAAnC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;2CAAgC;AAE1C;IAAhB,KAAK,EAAE;6CAAsB;AACb;IAAhB,KAAK,EAAE;8CAAuB;AACd;IAAhB,KAAK,EAAE;6CAAsB;AAlCX,cAAc;IADlC,aAAa,CAAC,2BAA2B,CAAC;GACtB,cAAc,CA2LlC;eA3LoB,cAAc","sourcesContent":["import '@material/web/icon/icon.js'\nimport '@material/web/button/elevated-button.js'\nimport '@operato/i18n/ox-i18n.js'\n\nimport { css, html, PropertyValues, TemplateResult } from 'lit'\nimport { customElement, property, state } from 'lit/decorators.js'\n\nimport { OxPropertyEditor, PropertySpec } from '@operato/property-editor'\nimport { Component } from '@hatiolab/things-scene'\n\nimport * as THREE from 'three'\nimport { GLTFLoader } from 'three/examples/jsm/loaders/GLTFLoader.js'\n\nconst EXT_SPECGLOSS = 'KHR_materials_pbrSpecularGlossiness'\n\nclass SpecGlossCompat {\n name = EXT_SPECGLOSS\n extendMaterialParams() {\n return Promise.resolve()\n }\n}\n\nfunction registerSpecGlossCompat(loader: GLTFLoader) {\n loader.register(() => new SpecGlossCompat())\n}\n\n@customElement('property-editor-gltf-info')\nexport default class GLTFInfoEditor extends OxPropertyEditor {\n static styles = [\n ...OxPropertyEditor.styles,\n css`\n div[info] {\n display: flex;\n flex-direction: row;\n font-size: 12px;\n }\n\n div[info] * {\n align-self: center;\n }\n\n div[info] title {\n font-weight: bold;\n }\n\n .buttons {\n display: flex;\n gap: 4px;\n margin-left: auto;\n }\n\n .buttons md-elevated-button {\n --md-icon-size: 24px;\n }\n `\n ]\n\n @property({ type: String }) declare src: string \| undefined\n\n @state() declare width: number\n @state() declare height: number\n @state() declare depth: number\n\n constructor() {\n super()\n this.width = 0\n this.height = 0\n this.depth = 0\n }\n\n editorTemplate(value: any, spec: PropertySpec): TemplateResult {\n const valid = this.width && this.height && this.depth\n\n var property = spec.property \|\| {}\n var { action } = property\n\n return html`\n <fieldset fullwidth>\n <legend><ox-i18n msgid=\"label.gltf-info\">GLTF info.</ox-i18n></legend>\n\n <div>\n <div info>\n <div label>[W x H x D] :</div>\n ${valid\n ? html` <div value>${this.width} x ${this.height} x ${this.depth}</div>\n <div class=\"buttons\">\n <md-elevated-button\n title=\"원래 크기로 설정\"\n @click=${() => {\n this._applyAction(action, {\n width: this.width,\n height: this.height,\n depth: this.depth\n })\n }}\n >\n <md-icon>autorenew</md-icon>\n </md-elevated-button>\n <md-elevated-button\n title=\"현재 크기에 비율 맞춤\"\n @click=${() => this._applyProportional(action)}\n >\n <md-icon>aspect_ratio</md-icon>\n </md-elevated-button>\n </div>`\n : html` <div></div> `}\n </div>\n </div>\n </fieldset>\n `\n }\n\n private _applyAction(action: any, dimension: { width: number; height: number; depth: number }) {\n this.dispatchEvent(\n new CustomEvent('i-need-selected', {\n bubbles: true,\n composed: true,\n detail: {\n callback: (selected: any[]) => {\n typeof action === 'function' && action(selected[0], dimension)\n }\n }\n })\n )\n }\n\n /*\n 현재 컴포넌트의 W/H/D 중 가장 큰 값을 기준으로,\n * 원래 모델의 비율에 맞게 나머지 치수를 조절한다.\n /\n private _applyProportional(action: any) {\n this.dispatchEvent(\n new CustomEvent('i-need-selected', {\n bubbles: true,\n composed: true,\n detail: {\n callback: (selected: any[]) => {\n const component = selected[0]\n if (!component \|\| typeof action !== 'function') return\n\n const { width: cw = 1, height: ch = 1, depth: cd = 1 } = component.state\n const { width: ow, height: oh, depth: od } = this // 원래 모델 치수\n\n if (!ow \|\| !oh \|\| !od) return\n\n // 현재 치수 중 가장 큰 값과, 그에 대응하는 원래 모델 치수로 scale 계산\n const maxCurrent = Math.max(cw, ch, cd)\n let scale: number\n\n if (maxCurrent === cw) {\n scale = cw / ow\n } else if (maxCurrent === ch) {\n scale = ch / oh\n } else {\n scale = cd / od\n }\n\n action(component, {\n width: Math.round(ow scale),\n height: Math.round(oh * scale),\n depth: Math.round(od * scale)\n })\n }\n }\n })\n )\n }\n\n updated(changes: PropertyValues<this>) {\n if (changes.has('src')) {\n this.dispatchEvent(\n new CustomEvent('i-need-selected', {\n bubbles: true,\n composed: true,\n detail: {\n callback: async (selected: any[]) => {\n await this.fetchSourceInfo(selected[0], this.src!)\n }\n }\n })\n )\n }\n }\n\n async fetchSourceInfo(component: Component, src: string) {\n if (!src \|\| !src.trim()) {\n return\n }\n\n try {\n const path = component.app.url(src)\n\n let gltfLoader = new GLTFLoader()\n registerSpecGlossCompat(gltfLoader)\n\n gltfLoader.setCrossOrigin('use-credentials')\n\n return new Promise((resolve: any) => {\n gltfLoader.load(path, gltf => {\n var box = new THREE.Box3().setFromObject(gltf.scene)\n var { x, y, z } = box.getSize(new THREE.Vector3())\n\n this.width = Math.floor(x)\n this.depth = Math.floor(y)\n this.height = Math.floor(z)\n\n resolve()\n })\n })\n } catch (e) {\n console.error(e)\n return\n }\n }\n}\n"]}

package/dist/editors/property-editor-location-increase-pattern.js CHANGED Viewed

@@ -204,10 +204,6 @@ let LocationIncreasePatternEditor = class LocationIncreasePatternEditor extends
       </fieldset>
     `;
     }
-    startSection = 1;
-    startUnit = 1;
-    skipNumbering = true;
-    _specificPropEl = null;
     connectedCallback() {
         super.connectedCallback();
         if (this.property && this.property.event) {

package/dist/editors/property-editor-location-increase-pattern.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"property-editor-location-increase-pattern.js","sourceRoot":"","sources":["../../src/editors/property-editor-location-increase-pattern.ts"],"names":[],"mappings":"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","sourcesContent":["import '@operato/i18n/ox-i18n.js'\n\nimport { css, html, TemplateResult } from 'lit'\nimport { customElement, property } from 'lit/decorators.js'\n\nimport { OxPropertyEditor, PropertySpec } from '@operato/property-editor'\n\n@customElement('property-editor-location-increase-pattern')\nexport default class LocationIncreasePatternEditor extends OxPropertyEditor {\n static styles = [\n ...OxPropertyEditor.styles,\n css`\n fieldset {\n border: none;\n border-bottom: 1px solid #cfd8dc;\n color: var(--md-sys-color-secondary);\n font-size: 12px;\n padding: 0 0 10px 0;\n margin: 0 0 10px 0;\n }\n\n fieldset legend {\n padding: 5px 0 0 5px;\n font-size: 11px;\n color: #e46c2e;\n font-weight: bold;\n text-transform: capitalize;\n }\n\n .property-grid {\n display: grid;\n grid-template-columns: repeat(10, 1fr);\n grid-gap: 5px;\n grid-auto-rows: minmax(24px, auto);\n margin: 10px 0 0 0;\n }\n\n .property-grid > * {\n line-height: 1.5;\n }\n\n .property-grid > label {\n grid-column: span 3;\n text-align: right;\n text-transform: capitalize;\n }\n\n .property-grid > input {\n grid-column: span 7;\n padding: 0;\n margin: 0;\n }\n\n .property-grid > .checkbox-row {\n grid-column: span 10;\n\n display: grid;\n grid-template-columns: repeat(10, 1fr);\n grid-gap: 5px;\n grid-auto-rows: minmax(24px, auto);\n align-items: center;\n }\n\n .checkbox-row > input {\n grid-column: span 4 / auto;\n order: 1;\n place-self: center end;\n }\n\n .checkbox-row > label {\n grid-column: span 6;\n text-align: left;\n }\n\n #pattern-set {\n overflow: hidden;\n grid-column: 1 / -1;\n display: grid;\n grid-template-columns: repeat(4, 1fr);\n gap: 10px;\n }\n\n #pattern-set button {\n background: url('data:image/png;base64,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')\n no-repeat;\n display: block;\n width: 55px;\n height: 40px;\n min-width: inherit;\n border: 1px solid transparent;\n border-radius: 8px;\n transition: all 0.2s;\n padding: 0;\n cursor: pointer;\n margin: 0 auto;\n justify-self: center;\n }\n\n #pattern-set button:hover {\n border-color: var(--md-sys-color-primary);\n box-shadow: 0 2px 4px rgba(33, 150, 243, 0.2);\n }\n\n #pattern-set button:active {\n background-color: rgba(var(--md-sys-color-primary), 0.2);\n transform: scale(0.98);\n }\n\n #pattern-set button[data-value='+u+s'] {\n background-position: 50% 3px;\n }\n #pattern-set button[data-value='+u-s'] {\n background-position: 50% -97px;\n }\n #pattern-set button[data-value='-u+s'] {\n background-position: 50% -197px;\n }\n #pattern-set button[data-value='-u-s'] {\n background-position: 50% -297px;\n }\n #pattern-set button[data-value='+s+u'] {\n background-position: 50% -397px;\n }\n #pattern-set button[data-value='+s-u'] {\n background-position: 50% -497px;\n }\n #pattern-set button[data-value='-s+u'] {\n background-position: 50% -597px;\n }\n #pattern-set button[data-value='-s-u'] {\n background-position: 50% -697px;\n }\n #pattern-set button[data-value='cw'] {\n background-position: 50% -797px;\n }\n #pattern-set button[data-value='ccw'] {\n background-position: 50% -897px;\n }\n #pattern-set button[data-value='zigzag'] {\n background-position: 50% -997px;\n }\n #pattern-set button[data-value='zigzag-reverse'] {\n background-position: 50% -1097px;\n }\n\n label {\n order: initial;\n }\n\n input {\n order: initial;\n }\n\n #skip-numbering {\n order: initial;\n grid-column: span 4;\n }\n\n label[for='skip-numbering'] {\n order: 1;\n grid-column: span 5;\n text-align: left;\n }\n `\n ]\n\n editorTemplate(value: any, spec: PropertySpec): TemplateResult {\n // TODO: background image change to use the url-loader\n return html`\n <fieldset fullwidth>\n <legend><ox-i18n msgid=\"label.location-increase-pattern\">Increase Pattern</ox-i18n></legend>\n\n <div class=\"property-grid\">\n <label> <ox-i18n msgid=\"label.start-section\">Start Section</ox-i18n> </label>\n <input\n type=\"number\"\n data-start-section\n value=\"${this.startSection}\"\n @change=${(e: Event) => (this.startSection = (e.target! as HTMLInputElement).valueAsNumber)}\n />\n\n <label> <ox-i18n msgid=\"label.start-unit\">Start Unit</ox-i18n> </label>\n <input\n type=\"number\"\n data-start-unit\n value=\"${this.startUnit}\"\n @change=${(e: Event) => (this.startUnit = (e.target! as HTMLInputElement).valueAsNumber)}\n />\n\n <div class=\"checkbox-row\" fullwidth>\n <input id=\"skip-numbering\" type=\"checkbox\" data-skip-numbering ?checked=\"${this.skipNumbering}\" />\n <label for=\"skip-numbering\">\n <ox-i18n msgid=\"label.skip-numbering\">Skip Numbering</ox-i18n>\n </label>\n </div>\n\n <div\n id=\"pattern-set\"\n class=\"property-grid location-increase-pattern-btn\"\n @click=${(e: Event) => this._onTapType(e)}\n >\n <button data-value=\"cw\" type=\"button\"></button>\n <button data-value=\"ccw\" type=\"button\"></button>\n <button data-value=\"zigzag\" type=\"button\"></button>\n <button data-value=\"zigzag-reverse\" type=\"button\"></button>\n </div>\n </div>\n </fieldset>\n `\n }\n\n @property({ type: Number }) startSection: number = 1\n @property({ type: Number }) startUnit: number = 1\n @property({ type: Boolean }) skipNumbering: boolean = true\n @property({ type: Object }) _specificPropEl: HTMLElement \| null = null\n\n connectedCallback() {\n super.connectedCallback()\n if (this.property && this.property.event) {\n Object.entries(this.property.event).forEach(entry => {\n if (entry[0]) {\n document.addEventListener(entry[0] as any, entry[1] as any)\n }\n })\n }\n }\n\n disconnectedCallback() {\n super.disconnectedCallback()\n\n if (this.property && this.property.event) {\n Object.entries(this.property.event).forEach(entry => {\n if (entry[0]) {\n document.removeEventListener(entry[0] as any, entry[1] as any)\n }\n })\n }\n }\n\n _onTapType(e: Event) {\n var target = e.target as HTMLElement\n\n const increasingDirection = target?.closest('[data-value]')?.getAttribute('data-value')\n if (!increasingDirection) {\n return\n }\n\n this.dispatchEvent(\n new CustomEvent('i-need-selected', {\n bubbles: true,\n composed: true,\n detail: {\n callback: (selected: any[]) => {\n const table = selected[0].parent\n table.increaseLocation(increasingDirection, this.skipNumbering, this.startSection, this.startUnit)\n }\n }\n })\n )\n\n e.stopPropagation()\n }\n}\n"]}
1	+ {"version":3,"file":"property-editor-location-increase-pattern.js","sourceRoot":"","sources":["../../src/editors/property-editor-location-increase-pattern.ts"],"names":[],"mappings":"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","sourcesContent":["import '@operato/i18n/ox-i18n.js'\n\nimport { css, html, TemplateResult } from 'lit'\nimport { customElement, property } from 'lit/decorators.js'\n\nimport { OxPropertyEditor, PropertySpec } from '@operato/property-editor'\n\n@customElement('property-editor-location-increase-pattern')\nexport default class LocationIncreasePatternEditor extends OxPropertyEditor {\n static styles = [\n ...OxPropertyEditor.styles,\n css`\n fieldset {\n border: none;\n border-bottom: 1px solid #cfd8dc;\n color: var(--md-sys-color-secondary);\n font-size: 12px;\n padding: 0 0 10px 0;\n margin: 0 0 10px 0;\n }\n\n fieldset legend {\n padding: 5px 0 0 5px;\n font-size: 11px;\n color: #e46c2e;\n font-weight: bold;\n text-transform: capitalize;\n }\n\n .property-grid {\n display: grid;\n grid-template-columns: repeat(10, 1fr);\n grid-gap: 5px;\n grid-auto-rows: minmax(24px, auto);\n margin: 10px 0 0 0;\n }\n\n .property-grid > * {\n line-height: 1.5;\n }\n\n .property-grid > label {\n grid-column: span 3;\n text-align: right;\n text-transform: capitalize;\n }\n\n .property-grid > input {\n grid-column: span 7;\n padding: 0;\n margin: 0;\n }\n\n .property-grid > .checkbox-row {\n grid-column: span 10;\n\n display: grid;\n grid-template-columns: repeat(10, 1fr);\n grid-gap: 5px;\n grid-auto-rows: minmax(24px, auto);\n align-items: center;\n }\n\n .checkbox-row > input {\n grid-column: span 4 / auto;\n order: 1;\n place-self: center end;\n }\n\n .checkbox-row > label {\n grid-column: span 6;\n text-align: left;\n }\n\n #pattern-set {\n overflow: hidden;\n grid-column: 1 / -1;\n display: grid;\n grid-template-columns: repeat(4, 1fr);\n gap: 10px;\n }\n\n #pattern-set button {\n background: url('data:image/png;base64,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')\n no-repeat;\n display: block;\n width: 55px;\n height: 40px;\n min-width: inherit;\n border: 1px solid transparent;\n border-radius: 8px;\n transition: all 0.2s;\n padding: 0;\n cursor: pointer;\n margin: 0 auto;\n justify-self: center;\n }\n\n #pattern-set button:hover {\n border-color: var(--md-sys-color-primary);\n box-shadow: 0 2px 4px rgba(33, 150, 243, 0.2);\n }\n\n #pattern-set button:active {\n background-color: rgba(var(--md-sys-color-primary), 0.2);\n transform: scale(0.98);\n }\n\n #pattern-set button[data-value='+u+s'] {\n background-position: 50% 3px;\n }\n #pattern-set button[data-value='+u-s'] {\n background-position: 50% -97px;\n }\n #pattern-set button[data-value='-u+s'] {\n background-position: 50% -197px;\n }\n #pattern-set button[data-value='-u-s'] {\n background-position: 50% -297px;\n }\n #pattern-set button[data-value='+s+u'] {\n background-position: 50% -397px;\n }\n #pattern-set button[data-value='+s-u'] {\n background-position: 50% -497px;\n }\n #pattern-set button[data-value='-s+u'] {\n background-position: 50% -597px;\n }\n #pattern-set button[data-value='-s-u'] {\n background-position: 50% -697px;\n }\n #pattern-set button[data-value='cw'] {\n background-position: 50% -797px;\n }\n #pattern-set button[data-value='ccw'] {\n background-position: 50% -897px;\n }\n #pattern-set button[data-value='zigzag'] {\n background-position: 50% -997px;\n }\n #pattern-set button[data-value='zigzag-reverse'] {\n background-position: 50% -1097px;\n }\n\n label {\n order: initial;\n }\n\n input {\n order: initial;\n }\n\n #skip-numbering {\n order: initial;\n grid-column: span 4;\n }\n\n label[for='skip-numbering'] {\n order: 1;\n grid-column: span 5;\n text-align: left;\n }\n `\n ]\n\n editorTemplate(value: any, spec: PropertySpec): TemplateResult {\n // TODO: background image change to use the url-loader\n return html`\n <fieldset fullwidth>\n <legend><ox-i18n msgid=\"label.location-increase-pattern\">Increase Pattern</ox-i18n></legend>\n\n <div class=\"property-grid\">\n <label> <ox-i18n msgid=\"label.start-section\">Start Section</ox-i18n> </label>\n <input\n type=\"number\"\n data-start-section\n value=\"${this.startSection}\"\n @change=${(e: Event) => (this.startSection = (e.target! as HTMLInputElement).valueAsNumber)}\n />\n\n <label> <ox-i18n msgid=\"label.start-unit\">Start Unit</ox-i18n> </label>\n <input\n type=\"number\"\n data-start-unit\n value=\"${this.startUnit}\"\n @change=${(e: Event) => (this.startUnit = (e.target! as HTMLInputElement).valueAsNumber)}\n />\n\n <div class=\"checkbox-row\" fullwidth>\n <input id=\"skip-numbering\" type=\"checkbox\" data-skip-numbering ?checked=\"${this.skipNumbering}\" />\n <label for=\"skip-numbering\">\n <ox-i18n msgid=\"label.skip-numbering\">Skip Numbering</ox-i18n>\n </label>\n </div>\n\n <div\n id=\"pattern-set\"\n class=\"property-grid location-increase-pattern-btn\"\n @click=${(e: Event) => this._onTapType(e)}\n >\n <button data-value=\"cw\" type=\"button\"></button>\n <button data-value=\"ccw\" type=\"button\"></button>\n <button data-value=\"zigzag\" type=\"button\"></button>\n <button data-value=\"zigzag-reverse\" type=\"button\"></button>\n </div>\n </div>\n </fieldset>\n `\n }\n\n @property({ type: Number }) declare startSection: number\n @property({ type: Number }) declare startUnit: number\n @property({ type: Boolean }) declare skipNumbering: boolean\n @property({ type: Object }) declare _specificPropEl: HTMLElement \| null\n\n connectedCallback() {\n super.connectedCallback()\n if (this.property && this.property.event) {\n Object.entries(this.property.event).forEach(entry => {\n if (entry[0]) {\n document.addEventListener(entry[0] as any, entry[1] as any)\n }\n })\n }\n }\n\n disconnectedCallback() {\n super.disconnectedCallback()\n\n if (this.property && this.property.event) {\n Object.entries(this.property.event).forEach(entry => {\n if (entry[0]) {\n document.removeEventListener(entry[0] as any, entry[1] as any)\n }\n })\n }\n }\n\n _onTapType(e: Event) {\n var target = e.target as HTMLElement\n\n const increasingDirection = target?.closest('[data-value]')?.getAttribute('data-value')\n if (!increasingDirection) {\n return\n }\n\n this.dispatchEvent(\n new CustomEvent('i-need-selected', {\n bubbles: true,\n composed: true,\n detail: {\n callback: (selected: any[]) => {\n const table = selected[0].parent\n table.increaseLocation(increasingDirection, this.skipNumbering, this.startSection, this.startUnit)\n }\n }\n })\n )\n\n e.stopPropagation()\n }\n}\n"]}

package/package.json CHANGED Viewed

@@ -2,7 +2,7 @@
   "name": "@operato/scene-visualizer",
   "description": "visualizer component for operato-scene",
   "author": "heartyoh",
-  "version": "10.0.0-beta.2",
+  "version": "10.0.0-beta.4",
   "type": "module",
   "main": "dist/index.js",
   "module": "dist/index.js",
@@ -63,5 +63,5 @@
       "prettier --write"
     ]
   },
-  "gitHead": "350ece104754d007967cf8e3f54d0d157465e94a"
+  "gitHead": "934cd74528c987fcce55b753b9f225dca33f405b"
 }