@things-factory/figure-ui 10.1.16 → 10.1.17

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 (77) hide show
  1. package/client/modeller/figure-animations.ts +12 -12
  2. package/client/modeller/figure-canvas.ts +32 -48
  3. package/client/modeller/figure-capabilities.ts +10 -10
  4. package/client/modeller/figure-inspector.ts +39 -28
  5. package/client/modeller/figure-parts.ts +1 -1
  6. package/client/modeller/figure-preview.ts +122 -25
  7. package/client/modeller/figure-report.ts +24 -6
  8. package/client/modeller/figure-settings.ts +45 -2
  9. package/client/modeller/figure-side.ts +6 -6
  10. package/client/modeller/figure-source.ts +52 -32
  11. package/client/modeller/figure-thumbnail.ts +5 -5
  12. package/client/modeller/figure-view.ts +53 -0
  13. package/client/modeller/part-edits.ts +36 -36
  14. package/client/modeller/proposal.ts +25 -4
  15. package/client/pages/figure-modeller-page.ts +64 -58
  16. package/dist-client/modeller/figure-animations.d.ts +4 -4
  17. package/dist-client/modeller/figure-animations.js +10 -10
  18. package/dist-client/modeller/figure-animations.js.map +1 -1
  19. package/dist-client/modeller/figure-canvas.d.ts +7 -7
  20. package/dist-client/modeller/figure-canvas.js +27 -40
  21. package/dist-client/modeller/figure-canvas.js.map +1 -1
  22. package/dist-client/modeller/figure-capabilities.d.ts +2 -2
  23. package/dist-client/modeller/figure-capabilities.js +9 -9
  24. package/dist-client/modeller/figure-capabilities.js.map +1 -1
  25. package/dist-client/modeller/figure-inspector.d.ts +16 -5
  26. package/dist-client/modeller/figure-inspector.js +38 -27
  27. package/dist-client/modeller/figure-inspector.js.map +1 -1
  28. package/dist-client/modeller/figure-parts.d.ts +1 -1
  29. package/dist-client/modeller/figure-parts.js +1 -1
  30. package/dist-client/modeller/figure-parts.js.map +1 -1
  31. package/dist-client/modeller/figure-preview.d.ts +39 -0
  32. package/dist-client/modeller/figure-preview.js +112 -23
  33. package/dist-client/modeller/figure-preview.js.map +1 -1
  34. package/dist-client/modeller/figure-report.d.ts +9 -0
  35. package/dist-client/modeller/figure-report.js +23 -5
  36. package/dist-client/modeller/figure-report.js.map +1 -1
  37. package/dist-client/modeller/figure-settings.js +42 -2
  38. package/dist-client/modeller/figure-settings.js.map +1 -1
  39. package/dist-client/modeller/figure-side.d.ts +2 -2
  40. package/dist-client/modeller/figure-side.js +5 -5
  41. package/dist-client/modeller/figure-side.js.map +1 -1
  42. package/dist-client/modeller/figure-source.d.ts +17 -15
  43. package/dist-client/modeller/figure-source.js +40 -21
  44. package/dist-client/modeller/figure-source.js.map +1 -1
  45. package/dist-client/modeller/figure-thumbnail.d.ts +2 -2
  46. package/dist-client/modeller/figure-thumbnail.js +3 -3
  47. package/dist-client/modeller/figure-thumbnail.js.map +1 -1
  48. package/dist-client/modeller/figure-view.d.ts +45 -0
  49. package/dist-client/modeller/figure-view.js +27 -0
  50. package/dist-client/modeller/figure-view.js.map +1 -1
  51. package/dist-client/modeller/part-edits.d.ts +16 -16
  52. package/dist-client/modeller/part-edits.js +35 -35
  53. package/dist-client/modeller/part-edits.js.map +1 -1
  54. package/dist-client/modeller/proposal.d.ts +1 -1
  55. package/dist-client/modeller/proposal.js +15 -3
  56. package/dist-client/modeller/proposal.js.map +1 -1
  57. package/dist-client/pages/figure-modeller-page.d.ts +9 -10
  58. package/dist-client/pages/figure-modeller-page.js +60 -54
  59. package/dist-client/pages/figure-modeller-page.js.map +1 -1
  60. package/dist-client/tsconfig.tsbuildinfo +1 -1
  61. package/dist-server/tsconfig.tsbuildinfo +1 -1
  62. package/package.json +4 -4
  63. package/test/ai-proposal-contract.test.ts +393 -12
  64. package/test/expect.ts +55 -0
  65. package/test/figure-source.test.ts +562 -0
  66. package/test/i18n-prefix-guard.test.ts +1 -1
  67. package/{client/modeller → test}/part-edits.test.ts +50 -45
  68. package/translations/en.json +31 -28
  69. package/translations/ja.json +16 -21
  70. package/translations/ko.json +41 -38
  71. package/translations/ms.json +16 -21
  72. package/translations/zh.json +16 -21
  73. package/client/modeller/figure-ask.ts +0 -265
  74. package/client/modeller/figure-source.test.ts +0 -352
  75. package/dist-client/modeller/figure-ask.d.ts +0 -40
  76. package/dist-client/modeller/figure-ask.js +0 -282
  77. package/dist-client/modeller/figure-ask.js.map +0 -1
package/dist-client/modeller/figure-animations.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"figure-animations.js","sourceRoot":"","sources":["../../client/modeller/figure-animations.ts"],"names":[],"mappings":"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","sourcesContent":["import { css, html, LitElement, nothing, type TemplateResult } from 'lit'\nimport { customElement, property, state } from 'lit/decorators.js'\nimport { live } from 'lit/directives/live.js'\n\nimport { i18next, localize } from '@operato/i18n'\nimport { ScrollbarStyles } from '@operato/styles'\n\nimport { AXES, CHANNEL_PATHS, CLIP_DRIVES, INTERPOLATIONS, LIMITS } from '@hatiolab/figure-model'\nimport type { ChannelPath, Vec3 } from '@hatiolab/figure-model'\n\nimport type { BoardModel, PartModel } from './figure-source.js'\n\n/**\n * 이 도형이 **어떻게 움직이는가.**\n *\n * ## 왜 탭 하나가 필요한가\n *\n * 움직임은 형식에 있고 런타임까지 서 있었다 — 검증이 촘촘히 보고, 청사진이 움직이는 부품을\n * 단독 묶음으로 빼고(합치면 따로 못 움직인다), 씬이 frameClock 을 구독해 실제로 돌린다.\n * 미리보기에도 clip 마다 슬라이더가 있었다.\n *\n * **만들 자리만 없었다.** 그래서 움직이는 도형을 얻는 길이 「AI 가 후보로 내놓는 것」 하나였고,\n * 채널 하나를 고치려면 손댈 화면이 없었다.\n *\n * ## 부품이 아니라 도형의 것이다\n *\n * clip 하나가 부품 여럿을 함께 움직인다 — 문 열림은 왼짝과 오른짝이 반대로 미끄러지는 것\n * 하나다. 그래서 부품을 고르고 「이 부품의 움직임」을 적는 형태가 될 수 없고, 속성 탭이 아니라\n * 자기 탭에 산다.\n *\n * ## 트윈은 타임라인을 재생하지 않는다\n *\n * 「문 열기 clip 을 재생하라」가 아니라 **「지금 40% 열려 있다」**다. 그래서 clip 마다 그 값을\n * 어떻게 받을지(`drive`)를 저작 시점에 정한다 — 도는 롤러는 배속을 받고, 열린 문은 0~1 위치를\n * 받는다. 이 선택이 화면에서 가장 설명이 필요한 자리다.\n */\n\ntype Clip = NonNullable<BoardModel['animations']>[number]\ntype Channel = Clip['channels'][number]\ntype Keyframe = Channel['keys'][number]\n\n/** A first-success motion: intent first, raw clip/channel editing second. */\ninterface MotionRecipe {\n id: 'conveyor' | 'gate' | 'pusher' | 'lift'\n name: string\n drive: Clip['drive']\n path: ChannelPath\n end: Vec3\n pivot?: Vec3\n}\n\nconst MOTION_RECIPES: readonly MotionRecipe[] = [\n { id: 'conveyor', name: 'conveyor-running', drive: 'loop', path: 'rotation', end: { x: 360, y: 0, z: 0 } },\n { id: 'gate', name: 'gate-open', drive: 'hold', path: 'rotation', end: { x: 0, y: 90, z: 0 }, pivot: { x: 0, y: 0, z: 0 } },\n { id: 'pusher', name: 'pusher-position', drive: 'hold', path: 'translation', end: { x: 100, y: 0, z: 0 } },\n { id: 'lift', name: 'lift-height', drive: 'hold', path: 'translation', end: { x: 0, y: 100, z: 0 } }\n]\n\n/** 새 clip 의 키 둘. **하나로 만들지 않는다** — 키 하나는 움직임이 아니라 자세다. */\nconst NEW_KEYS: Keyframe[] = [\n { at: 0, value: { x: 0, y: 0, z: 0 } },\n { at: 1, value: { x: 0, y: 0, z: 0 } }\n]\n\n/** `scale` 만 1 에서 시작한다 — 0 은 부품을 지운다. */\nfunction startValue(path: ChannelPath): Vec3 {\n return path === 'scale' ? { x: 1, y: 1, z: 1 } : { x: 0, y: 0, z: 0 }\n}\n\nfunction keysFor(path: ChannelPath): Keyframe[] {\n return NEW_KEYS.map(key => ({ at: key.at, value: startValue(path) }))\n}\n\n/** 이미 쓴 이름을 비켜 간다. `type` 처럼 저장되는 식별자는 아니지만 인스턴스가 이 이름으로 구동한다. */\nfunction freeName(taken: readonly Clip[]): string {\n const used = new Set(taken.map(clip => clip.name))\n for (let n = 1; ; n++) {\n const name = `clip-${n}`\n if (!used.has(name)) return name\n }\n}\n\nfunction freeRecipeName(taken: readonly Clip[], base: string): string {\n const used = new Set(taken.map(clip => clip.name))\n if (!used.has(base)) return base\n for (let n = 2; ; n++) if (!used.has(`${base}-${n}`)) return `${base}-${n}`\n}\n\n@customElement('figure-animations')\nexport class FigureAnimations extends localize(i18next)(LitElement) {\n static styles = [\n ScrollbarStyles,\n css`\n :host {\n display: flex;\n flex-direction: column;\n min-height: 0;\n overflow-y: auto;\n background-color: var(--md-sys-color-surface-container-lowest);\n color: var(--md-sys-color-on-surface);\n font: var(--label-font, inherit);\n font-size: 0.76rem;\n }\n\n section {\n display: flex;\n flex-direction: column;\n gap: var(--spacing-medium, 8px);\n padding: var(--spacing-large, 12px);\n border-bottom: 1px solid var(--md-sys-color-outline-variant);\n }\n\n /* 다른 탭들과 같은 눈금이다 */\n h3 {\n margin: 0 0 2px 0;\n font-size: var(--ui-t-micro, 11px);\n font-weight: 700;\n letter-spacing: 0.04em;\n text-transform: uppercase;\n color: var(--md-sys-color-on-surface-variant, var(--md-sys-color-on-surface));\n }\n\n p[quiet] {\n margin: 0;\n font-size: 0.72rem;\n line-height: 1.5;\n color: var(--md-sys-color-on-surface-variant);\n }\n\n div[recipes] { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; }\n button[recipe] { min-height: 54px; align-items: flex-start; flex-direction: column; text-align: left; }\n button[recipe] strong { font-size: 0.74rem; }\n button[recipe] span { color: var(--md-sys-color-on-surface-variant); font-size: 0.68rem; line-height: 1.35; }\n\n /* ── clip ─────────────────────────────────────────────────────── */\n\n div[clip] {\n display: flex;\n flex-direction: column;\n gap: var(--spacing-medium, 8px);\n padding: 8px;\n border: 1px solid var(--md-sys-color-outline-variant);\n border-radius: 4px;\n }\n div[clip][on] {\n border-color: var(--md-sys-color-primary);\n background-color: var(--md-sys-color-surface-container-low);\n }\n\n div[head] {\n display: flex;\n align-items: center;\n gap: 6px;\n }\n div[head] input[name] {\n flex: 1;\n min-width: 0;\n }\n\n /* ── channel ──────────────────────────────────────────────────── */\n\n div[channel] {\n display: flex;\n flex-direction: column;\n gap: 6px;\n padding: 6px 8px;\n border-left: 2px solid var(--md-sys-color-outline-variant);\n background-color: var(--md-sys-color-surface-container-lowest);\n }\n div[channel][orphan] {\n border-left-color: var(--md-sys-color-error);\n }\n\n div[row] {\n display: flex;\n align-items: center;\n gap: 6px;\n }\n div[row] > label {\n flex: none;\n min-width: 3.2em;\n color: var(--md-sys-color-on-surface-variant);\n }\n\n /* ── keyframe ─────────────────────────────────────────────────── */\n\n table[keys] {\n width: 100%;\n border-collapse: collapse;\n }\n table[keys] th {\n padding: 0 2px 2px;\n font-size: 0.68rem;\n font-weight: 600;\n text-align: left;\n color: var(--md-sys-color-on-surface-variant);\n }\n table[keys] td {\n padding: 1px 2px;\n }\n table[keys] input {\n width: 100%;\n min-width: 0;\n }\n table[keys] td[drop] {\n width: 1.6em;\n }\n\n input,\n select {\n box-sizing: border-box;\n padding: 3px 5px;\n font: inherit;\n font-size: 0.74rem;\n color: var(--md-sys-color-on-surface);\n background-color: var(--md-sys-color-surface-container-lowest);\n border: 1px solid var(--md-sys-color-outline-variant);\n border-radius: 3px;\n }\n input:focus,\n select:focus {\n outline: none;\n border-color: var(--md-sys-color-primary);\n }\n input[bad] {\n border-color: var(--md-sys-color-error);\n }\n\n button {\n display: inline-flex;\n align-items: center;\n gap: 3px;\n padding: 3px 8px;\n font: inherit;\n font-size: 0.72rem;\n color: var(--md-sys-color-on-surface);\n background-color: var(--md-sys-color-surface-container);\n border: 1px solid var(--md-sys-color-outline-variant);\n border-radius: 3px;\n cursor: pointer;\n }\n button:hover:not(:disabled) {\n background-color: var(--md-sys-color-surface-container-high);\n }\n button:disabled {\n opacity: 0.4;\n cursor: default;\n }\n button[plain] {\n padding: 1px 4px;\n background: none;\n border: none;\n color: var(--md-sys-color-on-surface-variant);\n }\n button[plain]:hover:not(:disabled) {\n color: var(--md-sys-color-error);\n background: none;\n }\n button md-icon {\n font-size: 14px;\n width: 14px;\n height: 14px;\n }\n\n /* ── 예산 ─────────────────────────────────────────────────────── */\n\n div[budget] {\n display: flex;\n align-items: baseline;\n gap: 6px;\n }\n div[budget] strong {\n font-size: 0.86rem;\n font-weight: 700;\n }\n div[budget][over] strong {\n color: var(--md-sys-color-error);\n }\n\n p[warn] {\n margin: 0;\n font-size: 0.7rem;\n line-height: 1.5;\n color: var(--md-sys-color-error);\n }\n `\n ]\n\n @property({ type: Object }) board?: BoardModel\n @property({ type: Array }) parts: PartModel[] = []\n\n /** 펼쳐 둔 clip. 이름이 아니라 자리로 잡는다 — 이름은 편집 중에 바뀐다. */\n @state() private open = 0\n @state() private recipeTarget = ''\n\n private get clips(): Clip[] {\n return this.board?.animations ?? []\n }\n\n /** 부품 이름 — 채널이 이것을 가리킨다. */\n private get partNames(): string[] {\n return this.parts.map(part => part.name).filter(name => !!name)\n }\n\n /**\n * 몇 부품이 움직이나 — 채널이 가리키는 **서로 다른 부품**의 수.\n *\n * clip 수가 아니다. 한 부품을 세 clip 이 움직여도 그 부품 하나가 단독 묶음이 될 뿐이다.\n * 청사진이 묶음을 가르는 기준과 같은 셈이어야 화면의 수와 판정의 수가 맞는다.\n */\n private get movingParts(): number {\n const moving = new Set<string>()\n for (const clip of this.clips) for (const channel of clip.channels) moving.add(channel.target)\n return moving.size\n }\n\n render(): TemplateResult {\n if (!this.board) return html``\n\n return html`\n <section>\n <h3>${i18next.t('figure.label.animation')}</h3>\n <p quiet>${i18next.t('figure.text.animation-is-driven-by-a-fact')}</p>\n </section>\n\n ${this.renderRecipes()}\n ${this.clips.length === 0 ? nothing : this.renderClips()}\n\n <section>\n <button @click=${() => this.addClip()} ?disabled=${this.partNames.length === 0}>\n <md-icon>add</md-icon>${i18next.t('figure.button.add-clip')}\n </button>\n ${this.partNames.length === 0\n ? html`<p quiet>${i18next.t('figure.text.animation-needs-a-named-part')}</p>`\n : nothing}\n </section>\n\n ${this.clips.length === 0 ? nothing : this.renderBudget()}\n `\n }\n\n /**\n * 빈 화면 — **이 탭이 무엇인지 가르치는 자리다.**\n *\n * 「clip 을 추가하세요」라고만 쓰면 처음 여는 사람은 clip 이 무엇인지 모른 채 단추를 누른다.\n * 그래서 무엇을 만들 수 있는지 예를 들고, 그것이 어떻게 움직이는지(사실이 들어온다)를 적는다.\n */\n private renderRecipes(): TemplateResult {\n return html`\n <section>\n <h3>${i18next.t('figure.label.motion-intent')}</h3>\n <p quiet>${i18next.t('figure.text.motion-intent-help')}</p>\n ${this.partNames.length\n ? html`<select .value=${this.recipeTarget} @change=${(e: Event) => (this.recipeTarget = (e.target as HTMLSelectElement).value)}>\n ${this.partNames.map(name => html`<option value=${name}>${name}</option>`)}\n </select>\n <div recipes>\n ${MOTION_RECIPES.map(recipe => html`\n <button recipe @click=${() => this.addRecipe(recipe)}>\n <strong>${i18next.t('figure.label.recipe-' + recipe.id)}</strong>\n <span>${i18next.t('figure.text.recipe-' + recipe.id)}</span>\n </button>\n `)}\n </div>`\n : html`<p quiet>${i18next.t('figure.text.animation-needs-a-named-part')}</p>`}\n </section>\n `\n }\n\n private renderClips(): TemplateResult {\n return html`\n <section>\n ${this.clips.map((clip, at) => this.renderClip(clip, at))}\n </section>\n `\n }\n\n private renderClip(clip: Clip, at: number): TemplateResult {\n const on = this.open === at\n const duplicate = this.clips.some((other, i) => i !== at && other.name === clip.name)\n const nameless = !clip.name?.trim()\n\n return html`\n <div clip ?on=${on}>\n <div head>\n <button plain @click=${() => (this.open = on ? -1 : at)} title=${i18next.t('figure.label.channels')}>\n <md-icon>${on ? 'expand_more' : 'chevron_right'}</md-icon>\n </button>\n <input\n name\n .value=${live(clip.name ?? '')}\n ?bad=${duplicate || nameless}\n placeholder=${i18next.t('figure.label.clip-name')}\n title=${duplicate ? i18next.t('figure.text.clip-name-taken') : i18next.t('figure.text.clip-name-is-how-it-is-driven')}\n @change=${(e: Event) => this.renameClip(at, (e.target as HTMLInputElement).value)}\n />\n <select\n .value=${live(clip.drive ?? 'loop')}\n title=${i18next.t('figure.text.drive-explained')}\n @change=${(e: Event) => this.setDrive(at, (e.target as HTMLSelectElement).value as Clip['drive'])}\n >\n ${CLIP_DRIVES.map(\n drive => html`<option value=${drive}>${i18next.t('figure.label.drive-' + drive)}</option>`\n )}\n </select>\n <button plain @click=${() => this.removeClip(at)} title=${i18next.t('figure.button.remove')}>\n <md-icon>close</md-icon>\n </button>\n </div>\n\n ${duplicate ? html`<p warn>${i18next.t('figure.text.clip-name-taken')}</p>` : nothing}\n ${nameless ? html`<p warn>${i18next.t('figure.text.clip-needs-a-name')}</p>` : nothing}\n ${on ? this.renderChannels(clip, at) : nothing}\n </div>\n `\n }\n\n private renderChannels(clip: Clip, at: number): TemplateResult {\n return html`\n <p quiet>${i18next.t('figure.text.drive-' + (clip.drive ?? 'loop') + '-note')}</p>\n\n ${clip.channels.length === 0 ? html`<p warn>${i18next.t('figure.text.clip-needs-a-channel')}</p>` : nothing}\n ${clip.channels.map((channel, j) => this.renderChannel(channel, at, j))}\n\n <button @click=${() => this.addChannel(at)}>\n <md-icon>add</md-icon>${i18next.t('figure.button.add-channel')}\n </button>\n `\n }\n\n /**\n * 채널 하나 — 어느 부품의 어느 속성을 움직이나.\n *\n * 없는 부품을 가리키는 채널은 붉게 낸다. 부품 이름을 바꾸면 그 순간 이렇게 되는데,\n * 검증은 저장할 때 말하고 여기서는 **그 자리에서** 보여 준다.\n */\n private renderChannel(channel: Channel, at: number, j: number): TemplateResult {\n const orphan = !this.partNames.includes(channel.target)\n const turning = channel.path === 'rotation'\n\n return html`\n <div channel ?orphan=${orphan}>\n <div row>\n <label>${i18next.t('figure.label.channel-target')}</label>\n <select\n .value=${live(channel.target ?? '')}\n @change=${(e: Event) => this.setChannel(at, j, { target: (e.target as HTMLSelectElement).value })}\n >\n ${orphan ? html`<option value=${channel.target}>${channel.target}</option>` : nothing}\n ${this.partNames.map(name => html`<option value=${name}>${name}</option>`)}\n </select>\n <button plain @click=${() => this.removeChannel(at, j)} title=${i18next.t('figure.button.remove')}>\n <md-icon>close</md-icon>\n </button>\n </div>\n\n ${orphan ? html`<p warn>${i18next.t('figure.text.channel-target-is-gone')}</p>` : nothing}\n\n <div row>\n <label>${i18next.t('figure.label.channel-path')}</label>\n <select\n .value=${live(channel.path)}\n @change=${(e: Event) => this.setPath(at, j, (e.target as HTMLSelectElement).value as ChannelPath)}\n >\n ${CHANNEL_PATHS.map(path => html`<option value=${path}>${i18next.t('figure.label.path-' + path)}</option>`)}\n </select>\n <select\n .value=${live(channel.interpolation ?? 'linear')}\n title=${i18next.t('figure.text.interpolation-explained')}\n @change=${(e: Event) =>\n this.setChannel(at, j, { interpolation: (e.target as HTMLSelectElement).value as Channel['interpolation'] })}\n >\n ${INTERPOLATIONS.map(\n one => html`<option value=${one}>${i18next.t('figure.label.interpolation-' + one)}</option>`\n )}\n </select>\n </div>\n\n <p quiet>${i18next.t('figure.text.path-' + channel.path + '-unit')}</p>\n\n ${turning ? this.renderPivot(channel, at, j) : nothing}\n ${this.renderKeys(channel, at, j)}\n </div>\n `\n }\n\n /**\n * 회전 중심 — **`rotation` 에서만 뜻이 있다.**\n *\n * 그래서 경로가 rotation 일 때만 낸다. 언제나 내면 저작자가 옮김·배율에도 적고, 검증이\n * 저장할 때 「쓰이지 않는다」고 알린다. 안 보이면 적을 일이 없다.\n */\n private renderPivot(channel: Channel, at: number, j: number): TemplateResult {\n const pivot = channel.pivot\n const on = pivot !== undefined\n\n return html`\n <div row>\n <label>${i18next.t('figure.label.channel-pivot')}</label>\n <button\n @click=${() => this.setChannel(at, j, { pivot: on ? undefined : { x: 0, y: 0, z: 0 } })}\n title=${i18next.t('figure.text.pivot-defaults-to-the-part-centre')}\n >\n ${i18next.t(on ? 'figure.button.pivot-clear' : 'figure.button.pivot-set')}\n </button>\n ${on\n ? AXES.map(\n axis => html`\n <input\n type=\"number\"\n step=\"1\"\n .value=${live(String(pivot![axis]))}\n aria-label=${axis}\n @change=${(e: Event) =>\n this.setChannel(at, j, {\n pivot: { ...pivot!, [axis]: Number((e.target as HTMLInputElement).value) || 0 }\n })}\n />\n `\n )\n : nothing}\n </div>\n `\n }\n\n /**\n * 키프레임 표.\n *\n * **둘 미만으로 못 내려간다.** 하나뿐이면 움직이는 것이 아니라 자세 하나이고, 형식이\n * 오류로 막는다. 저장하고 나서 알려 주는 것보다 지우는 단추를 죽이는 것이 낫다.\n *\n * 시각이 오름차순이어야 하는 것도 형식의 규칙이다. 여기서는 어긋난 줄을 붉게 내고 값을\n * 고치지는 않는다 — 저작자가 3 을 1 로 고치던 중일 수 있다.\n */\n private renderKeys(channel: Channel, at: number, j: number): TemplateResult {\n const keys = channel.keys ?? []\n\n return html`\n <table keys>\n <tr>\n <th>${i18next.t('figure.label.key-at')}</th>\n ${AXES.map(axis => html`<th>${axis}</th>`)}\n <th></th>\n </tr>\n ${keys.map((key, k) => {\n const backwards = k > 0 && key.at <= (keys[k - 1]!.at ?? 0)\n return html`\n <tr>\n <td>\n <input\n type=\"number\"\n step=\"0.1\"\n min=\"0\"\n ?bad=${backwards || key.at < 0}\n .value=${live(String(key.at))}\n title=${backwards ? i18next.t('figure.text.keys-must-rise') : ''}\n @change=${(e: Event) =>\n this.setKey(at, j, k, { at: Math.max(0, Number((e.target as HTMLInputElement).value) || 0) })}\n />\n </td>\n ${AXES.map(\n axis => html`\n <td>\n <input\n type=\"number\"\n step=${channel.path === 'scale' ? '0.1' : '1'}\n .value=${live(String(key.value[axis]))}\n aria-label=${axis}\n @change=${(e: Event) =>\n this.setKey(at, j, k, {\n value: { ...key.value, [axis]: Number((e.target as HTMLInputElement).value) || 0 }\n })}\n />\n </td>\n `\n )}\n <td drop>\n <button\n plain\n ?disabled=${keys.length <= 2}\n title=${keys.length <= 2 ? i18next.t('figure.text.two-keys-at-least') : i18next.t('figure.button.remove')}\n @click=${() => this.removeKey(at, j, k)}\n >\n <md-icon>close</md-icon>\n </button>\n </td>\n </tr>\n `\n })}\n </table>\n\n ${keys.some((key, k) => k > 0 && key.at <= (keys[k - 1]!.at ?? 0))\n ? html`<p warn>${i18next.t('figure.text.keys-must-rise')}</p>`\n : nothing}\n\n <button @click=${() => this.addKey(at, j)}>\n <md-icon>add</md-icon>${i18next.t('figure.button.add-key')}\n </button>\n `\n }\n\n /**\n * 움직이는 부품 예산.\n *\n * **넘어도 막지 않는다.** 움직이는 부품은 저마다 단독 묶음이라 draw call 이 늘고 프레임마다\n * 갱신이 는다 — 그 대가가 수로 보이면 저작자가 아낀다. 랜드마크 설비 하나는 정교해도 되고,\n * 그 값이 도면 예산에 드러나면 된다.\n */\n private renderBudget(): TemplateResult {\n const used = this.movingParts\n const over = used > LIMITS.animatedParts\n\n return html`\n <section>\n <h3>${i18next.t('figure.label.budget-animations')}</h3>\n <div budget ?over=${over}>\n <strong>${used}</strong>\n <span quiet>/ ${LIMITS.animatedParts}</span>\n </div>\n <p quiet>${i18next.t('figure.text.animated-parts-cost')}</p>\n ${over ? html`<p warn>${i18next.t('figure.text.animated-parts-over')}</p>` : nothing}\n </section>\n `\n }\n\n // ─── 고치기 ───────────────────────────────────────────────────────────────\n\n /**\n * 보드에 실어 올려보낸다.\n *\n * `animations` 는 도형 전체의 것이므로 부품 편집(`update-part`)이 아니라 `update-board` 로\n * 간다. 빈 배열은 칸을 지운다 — clip 을 다 지운 도형은 `animations: []` 가 아니라 없는 것이다.\n */\n private tell(animations: Clip[]): void {\n if (!this.board) return\n\n const board: BoardModel = { ...this.board }\n if (animations.length === 0) delete board.animations\n else board.animations = animations\n\n this.dispatchEvent(new CustomEvent('update-board', { detail: { board }, bubbles: true, composed: true }))\n }\n\n private patchClip(at: number, patch: Partial<Clip>): void {\n this.tell(this.clips.map((clip, i) => (i === at ? { ...clip, ...patch } : clip)))\n }\n\n private patchChannel(at: number, j: number, next: Channel): void {\n const clip = this.clips[at]\n if (!clip) return\n this.patchClip(at, { channels: clip.channels.map((channel, i) => (i === j ? next : channel)) })\n }\n\n private addClip(): void {\n const target = this.partNames[0]\n if (!target) return\n\n const clip: Clip = {\n name: freeName(this.clips),\n drive: 'loop',\n channels: [{ target, path: 'translation', keys: keysFor('translation') }]\n }\n\n this.open = this.clips.length\n this.tell([...this.clips, clip])\n }\n\n /** Recipe creates a valid, editable two-pose clip; it never saves or publishes the Figure. */\n private addRecipe(recipe: MotionRecipe): void {\n const target = this.recipeTarget || this.partNames[0]\n if (!target) return\n const channel: Channel = {\n target,\n path: recipe.path,\n keys: [{ at: 0, value: startValue(recipe.path) }, { at: 1, value: { ...recipe.end } }]\n }\n if (recipe.pivot) channel.pivot = { ...recipe.pivot }\n this.open = this.clips.length\n this.tell([...this.clips, { name: freeRecipeName(this.clips, recipe.name), drive: recipe.drive, channels: [channel] }])\n }\n\n private renameClip(at: number, name: string): void {\n this.patchClip(at, { name: name.trim() })\n }\n\n private setDrive(at: number, drive: Clip['drive']): void {\n this.patchClip(at, { drive })\n }\n\n private removeClip(at: number): void {\n if (this.open >= at) this.open = Math.max(0, this.open - 1)\n this.tell(this.clips.filter((_, i) => i !== at))\n }\n\n private addChannel(at: number): void {\n const clip = this.clips[at]\n const target = this.partNames[0]\n if (!clip || !target) return\n\n this.patchClip(at, {\n channels: [...clip.channels, { target, path: 'translation', keys: keysFor('translation') }]\n })\n }\n\n private setChannel(at: number, j: number, patch: Partial<Channel>): void {\n const channel = this.clips[at]?.channels[j]\n if (!channel) return\n\n const next: Channel = { ...channel, ...patch }\n /* `undefined` 를 얹는 것은 지우는 뜻이다. 남겨 두면 저장 형식에 빈 칸이 실린다. */\n if ('pivot' in patch && patch.pivot === undefined) delete next.pivot\n this.patchChannel(at, j, next)\n }\n\n /**\n * 경로를 바꾼다 — **값까지 함께 옮긴다.**\n *\n * 옮김·회전의 0 은 「제자리」인데 배율의 0 은 **부품을 지운다.** 경로만 바꾸고 값을 그대로\n * 두면 저작자는 부품이 사라진 것을 보고 도구가 고장 난 줄 안다. 그래서 옮김·회전 ↔ 배율을\n * 건널 때 시작값을 그 경로의 제자리로 되돌린다. 시각은 지킨다 — 저작자가 짠 박자다.\n */\n private setPath(at: number, j: number, path: ChannelPath): void {\n const channel = this.clips[at]?.channels[j]\n if (!channel) return\n\n const crossing = (channel.path === 'scale') !== (path === 'scale')\n const next: Channel = {\n ...channel,\n path,\n keys: crossing ? channel.keys.map(key => ({ at: key.at, value: startValue(path) })) : channel.keys\n }\n /* 회전이 아니면 회전 중심은 쓰이지 않는다. 남겨 두면 검증이 「쓰이지 않는다」고 알린다. */\n if (path !== 'rotation') delete next.pivot\n\n this.patchChannel(at, j, next)\n }\n\n private removeChannel(at: number, j: number): void {\n const clip = this.clips[at]\n if (!clip) return\n this.patchClip(at, { channels: clip.channels.filter((_, i) => i !== j) })\n }\n\n /** 마지막 키에서 1 초 뒤. 값은 그 키를 그대로 받는다 — 붙여 놓고 고치는 것이 짜기 쉽다. */\n private addKey(at: number, j: number): void {\n const channel = this.clips[at]?.channels[j]\n if (!channel) return\n\n const last = channel.keys[channel.keys.length - 1]\n const key: Keyframe = { at: (last?.at ?? 0) + 1, value: { ...(last?.value ?? startValue(channel.path)) } }\n this.patchChannel(at, j, { ...channel, keys: [...channel.keys, key] })\n }\n\n private setKey(at: number, j: number, k: number, patch: Partial<Keyframe>): void {\n const channel = this.clips[at]?.channels[j]\n if (!channel) return\n this.patchChannel(at, j, {\n ...channel,\n keys: channel.keys.map((key, i) => (i === k ? { ...key, ...patch } : key))\n })\n }\n\n /** 둘 미만으로 내려가지 않는다 — 단추가 이미 죽어 있지만 밖에서 불릴 수 있다. */\n private removeKey(at: number, j: number, k: number): void {\n const channel = this.clips[at]?.channels[j]\n if (!channel || channel.keys.length <= 2) return\n this.patchChannel(at, j, { ...channel, keys: channel.keys.filter((_, i) => i !== k) })\n }\n}\n"]}
1
+ {"version":3,"file":"figure-animations.js","sourceRoot":"","sources":["../../client/modeller/figure-animations.ts"],"names":[],"mappings":"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","sourcesContent":["import { css, html, LitElement, nothing, type TemplateResult } from 'lit'\nimport { customElement, property, state } from 'lit/decorators.js'\nimport { live } from 'lit/directives/live.js'\n\nimport { i18next, localize } from '@operato/i18n'\nimport { ScrollbarStyles } from '@operato/styles'\n\nimport { AXES, CHANNEL_PATHS, CLIP_DRIVES, INTERPOLATIONS, LIMITS } from '@hatiolab/figure-model'\nimport type { ChannelPath, Vec3 } from '@hatiolab/figure-model'\n\nimport type { FigureDraft, PartModel } from './figure-source.js'\n\n/**\n * 이 도형이 **어떻게 움직이는가.**\n *\n * ## 왜 탭 하나가 필요한가\n *\n * 움직임은 형식에 있고 런타임까지 서 있었다 — 검증이 촘촘히 보고, 청사진이 움직이는 부품을\n * 단독 묶음으로 빼고(합치면 따로 못 움직인다), 씬이 frameClock 을 구독해 실제로 돌린다.\n * 미리보기에도 clip 마다 슬라이더가 있었다.\n *\n * **만들 자리만 없었다.** 그래서 움직이는 도형을 얻는 길이 「AI 가 후보로 내놓는 것」 하나였고,\n * 채널 하나를 고치려면 손댈 화면이 없었다.\n *\n * ## 부품이 아니라 도형의 것이다\n *\n * clip 하나가 부품 여럿을 함께 움직인다 — 문 열림은 왼짝과 오른짝이 반대로 미끄러지는 것\n * 하나다. 그래서 부품을 고르고 「이 부품의 움직임」을 적는 형태가 될 수 없고, 속성 탭이 아니라\n * 자기 탭에 산다.\n *\n * ## 트윈은 타임라인을 재생하지 않는다\n *\n * 「문 열기 clip 을 재생하라」가 아니라 **「지금 40% 열려 있다」**다. 그래서 clip 마다 그 값을\n * 어떻게 받을지(`drive`)를 저작 시점에 정한다 — 도는 롤러는 배속을 받고, 열린 문은 0~1 위치를\n * 받는다. 이 선택이 화면에서 가장 설명이 필요한 자리다.\n */\n\ntype Clip = NonNullable<FigureDraft['animations']>[number]\ntype Channel = Clip['channels'][number]\ntype Keyframe = Channel['keys'][number]\n\n/** A first-success motion: intent first, raw clip/channel editing second. */\ninterface MotionRecipe {\n id: 'conveyor' | 'gate' | 'pusher' | 'lift'\n name: string\n drive: Clip['drive']\n path: ChannelPath\n end: Vec3\n pivot?: Vec3\n}\n\nconst MOTION_RECIPES: readonly MotionRecipe[] = [\n { id: 'conveyor', name: 'conveyor-running', drive: 'loop', path: 'rotation', end: { x: 360, y: 0, z: 0 } },\n { id: 'gate', name: 'gate-open', drive: 'hold', path: 'rotation', end: { x: 0, y: 90, z: 0 }, pivot: { x: 0, y: 0, z: 0 } },\n { id: 'pusher', name: 'pusher-position', drive: 'hold', path: 'translation', end: { x: 100, y: 0, z: 0 } },\n { id: 'lift', name: 'lift-height', drive: 'hold', path: 'translation', end: { x: 0, y: 100, z: 0 } }\n]\n\n/** 새 clip 의 키 둘. **하나로 만들지 않는다** — 키 하나는 움직임이 아니라 자세다. */\nconst NEW_KEYS: Keyframe[] = [\n { at: 0, value: { x: 0, y: 0, z: 0 } },\n { at: 1, value: { x: 0, y: 0, z: 0 } }\n]\n\n/** `scale` 만 1 에서 시작한다 — 0 은 부품을 지운다. */\nfunction startValue(path: ChannelPath): Vec3 {\n return path === 'scale' ? { x: 1, y: 1, z: 1 } : { x: 0, y: 0, z: 0 }\n}\n\nfunction keysFor(path: ChannelPath): Keyframe[] {\n return NEW_KEYS.map(key => ({ at: key.at, value: startValue(path) }))\n}\n\n/** 이미 쓴 이름을 비켜 간다. `type` 처럼 저장되는 식별자는 아니지만 인스턴스가 이 이름으로 구동한다. */\nfunction freeName(taken: readonly Clip[]): string {\n const used = new Set(taken.map(clip => clip.name))\n for (let n = 1; ; n++) {\n const name = `clip-${n}`\n if (!used.has(name)) return name\n }\n}\n\nfunction freeRecipeName(taken: readonly Clip[], base: string): string {\n const used = new Set(taken.map(clip => clip.name))\n if (!used.has(base)) return base\n for (let n = 2; ; n++) if (!used.has(`${base}-${n}`)) return `${base}-${n}`\n}\n\n@customElement('figure-animations')\nexport class FigureAnimations extends localize(i18next)(LitElement) {\n static styles = [\n ScrollbarStyles,\n css`\n :host {\n display: flex;\n flex-direction: column;\n min-height: 0;\n overflow-y: auto;\n background-color: var(--md-sys-color-surface-container-lowest);\n color: var(--md-sys-color-on-surface);\n font: var(--label-font, inherit);\n font-size: 0.76rem;\n }\n\n section {\n display: flex;\n flex-direction: column;\n gap: var(--spacing-medium, 8px);\n padding: var(--spacing-large, 12px);\n border-bottom: 1px solid var(--md-sys-color-outline-variant);\n }\n\n /* 다른 탭들과 같은 눈금이다 */\n h3 {\n margin: 0 0 2px 0;\n font-size: var(--ui-t-micro, 11px);\n font-weight: 700;\n letter-spacing: 0.04em;\n text-transform: uppercase;\n color: var(--md-sys-color-on-surface-variant, var(--md-sys-color-on-surface));\n }\n\n p[quiet] {\n margin: 0;\n font-size: 0.72rem;\n line-height: 1.5;\n color: var(--md-sys-color-on-surface-variant);\n }\n\n div[recipes] { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; }\n button[recipe] { min-height: 54px; align-items: flex-start; flex-direction: column; text-align: left; }\n button[recipe] strong { font-size: 0.74rem; }\n button[recipe] span { color: var(--md-sys-color-on-surface-variant); font-size: 0.68rem; line-height: 1.35; }\n\n /* ── clip ─────────────────────────────────────────────────────── */\n\n div[clip] {\n display: flex;\n flex-direction: column;\n gap: var(--spacing-medium, 8px);\n padding: 8px;\n border: 1px solid var(--md-sys-color-outline-variant);\n border-radius: 4px;\n }\n div[clip][on] {\n border-color: var(--md-sys-color-primary);\n background-color: var(--md-sys-color-surface-container-low);\n }\n\n div[head] {\n display: flex;\n align-items: center;\n gap: 6px;\n }\n div[head] input[name] {\n flex: 1;\n min-width: 0;\n }\n\n /* ── channel ──────────────────────────────────────────────────── */\n\n div[channel] {\n display: flex;\n flex-direction: column;\n gap: 6px;\n padding: 6px 8px;\n border-left: 2px solid var(--md-sys-color-outline-variant);\n background-color: var(--md-sys-color-surface-container-lowest);\n }\n div[channel][orphan] {\n border-left-color: var(--md-sys-color-error);\n }\n\n div[row] {\n display: flex;\n align-items: center;\n gap: 6px;\n }\n div[row] > label {\n flex: none;\n min-width: 3.2em;\n color: var(--md-sys-color-on-surface-variant);\n }\n\n /* ── keyframe ─────────────────────────────────────────────────── */\n\n table[keys] {\n width: 100%;\n border-collapse: collapse;\n }\n table[keys] th {\n padding: 0 2px 2px;\n font-size: 0.68rem;\n font-weight: 600;\n text-align: left;\n color: var(--md-sys-color-on-surface-variant);\n }\n table[keys] td {\n padding: 1px 2px;\n }\n table[keys] input {\n width: 100%;\n min-width: 0;\n }\n table[keys] td[drop] {\n width: 1.6em;\n }\n\n input,\n select {\n box-sizing: border-box;\n padding: 3px 5px;\n font: inherit;\n font-size: 0.74rem;\n color: var(--md-sys-color-on-surface);\n background-color: var(--md-sys-color-surface-container-lowest);\n border: 1px solid var(--md-sys-color-outline-variant);\n border-radius: 3px;\n }\n input:focus,\n select:focus {\n outline: none;\n border-color: var(--md-sys-color-primary);\n }\n input[bad] {\n border-color: var(--md-sys-color-error);\n }\n\n button {\n display: inline-flex;\n align-items: center;\n gap: 3px;\n padding: 3px 8px;\n font: inherit;\n font-size: 0.72rem;\n color: var(--md-sys-color-on-surface);\n background-color: var(--md-sys-color-surface-container);\n border: 1px solid var(--md-sys-color-outline-variant);\n border-radius: 3px;\n cursor: pointer;\n }\n button:hover:not(:disabled) {\n background-color: var(--md-sys-color-surface-container-high);\n }\n button:disabled {\n opacity: 0.4;\n cursor: default;\n }\n button[plain] {\n padding: 1px 4px;\n background: none;\n border: none;\n color: var(--md-sys-color-on-surface-variant);\n }\n button[plain]:hover:not(:disabled) {\n color: var(--md-sys-color-error);\n background: none;\n }\n button md-icon {\n font-size: 14px;\n width: 14px;\n height: 14px;\n }\n\n /* ── 예산 ─────────────────────────────────────────────────────── */\n\n div[budget] {\n display: flex;\n align-items: baseline;\n gap: 6px;\n }\n div[budget] strong {\n font-size: 0.86rem;\n font-weight: 700;\n }\n div[budget][over] strong {\n color: var(--md-sys-color-error);\n }\n\n p[warn] {\n margin: 0;\n font-size: 0.7rem;\n line-height: 1.5;\n color: var(--md-sys-color-error);\n }\n `\n ]\n\n @property({ type: Object }) draft?: FigureDraft\n @property({ type: Array }) parts: PartModel[] = []\n\n /** 펼쳐 둔 clip. 이름이 아니라 자리로 잡는다 — 이름은 편집 중에 바뀐다. */\n @state() private open = 0\n @state() private recipeTarget = ''\n\n private get clips(): Clip[] {\n return this.draft?.animations ?? []\n }\n\n /** 부품 이름 — 채널이 이것을 가리킨다. */\n private get partNames(): string[] {\n return this.parts.map(part => part.name).filter(name => !!name)\n }\n\n /**\n * 몇 부품이 움직이나 — 채널이 가리키는 **서로 다른 부품**의 수.\n *\n * clip 수가 아니다. 한 부품을 세 clip 이 움직여도 그 부품 하나가 단독 묶음이 될 뿐이다.\n * 청사진이 묶음을 가르는 기준과 같은 셈이어야 화면의 수와 판정의 수가 맞는다.\n */\n private get movingParts(): number {\n const moving = new Set<string>()\n for (const clip of this.clips) for (const channel of clip.channels) moving.add(channel.target)\n return moving.size\n }\n\n render(): TemplateResult {\n if (!this.draft) return html``\n\n return html`\n <section>\n <h3>${i18next.t('figure.label.animation')}</h3>\n <p quiet>${i18next.t('figure.text.animation-is-driven-by-a-fact')}</p>\n </section>\n\n ${this.renderRecipes()}\n ${this.clips.length === 0 ? nothing : this.renderClips()}\n\n <section>\n <button @click=${() => this.addClip()} ?disabled=${this.partNames.length === 0}>\n <md-icon>add</md-icon>${i18next.t('figure.button.add-clip')}\n </button>\n ${this.partNames.length === 0\n ? html`<p quiet>${i18next.t('figure.text.animation-needs-a-named-part')}</p>`\n : nothing}\n </section>\n\n ${this.clips.length === 0 ? nothing : this.renderBudget()}\n `\n }\n\n /**\n * 빈 화면 — **이 탭이 무엇인지 가르치는 자리다.**\n *\n * 「clip 을 추가하세요」라고만 쓰면 처음 여는 사람은 clip 이 무엇인지 모른 채 단추를 누른다.\n * 그래서 무엇을 만들 수 있는지 예를 들고, 그것이 어떻게 움직이는지(사실이 들어온다)를 적는다.\n */\n private renderRecipes(): TemplateResult {\n return html`\n <section>\n <h3>${i18next.t('figure.label.motion-intent')}</h3>\n <p quiet>${i18next.t('figure.text.motion-intent-help')}</p>\n ${this.partNames.length\n ? html`<select .value=${this.recipeTarget} @change=${(e: Event) => (this.recipeTarget = (e.target as HTMLSelectElement).value)}>\n ${this.partNames.map(name => html`<option value=${name}>${name}</option>`)}\n </select>\n <div recipes>\n ${MOTION_RECIPES.map(recipe => html`\n <button recipe @click=${() => this.addRecipe(recipe)}>\n <strong>${i18next.t('figure.label.recipe-' + recipe.id)}</strong>\n <span>${i18next.t('figure.text.recipe-' + recipe.id)}</span>\n </button>\n `)}\n </div>`\n : html`<p quiet>${i18next.t('figure.text.animation-needs-a-named-part')}</p>`}\n </section>\n `\n }\n\n private renderClips(): TemplateResult {\n return html`\n <section>\n ${this.clips.map((clip, at) => this.renderClip(clip, at))}\n </section>\n `\n }\n\n private renderClip(clip: Clip, at: number): TemplateResult {\n const on = this.open === at\n const duplicate = this.clips.some((other, i) => i !== at && other.name === clip.name)\n const nameless = !clip.name?.trim()\n\n return html`\n <div clip ?on=${on}>\n <div head>\n <button plain @click=${() => (this.open = on ? -1 : at)} title=${i18next.t('figure.label.channels')}>\n <md-icon>${on ? 'expand_more' : 'chevron_right'}</md-icon>\n </button>\n <input\n name\n .value=${live(clip.name ?? '')}\n ?bad=${duplicate || nameless}\n placeholder=${i18next.t('figure.label.clip-name')}\n title=${duplicate ? i18next.t('figure.text.clip-name-taken') : i18next.t('figure.text.clip-name-is-how-it-is-driven')}\n @change=${(e: Event) => this.renameClip(at, (e.target as HTMLInputElement).value)}\n />\n <select\n .value=${live(clip.drive ?? 'loop')}\n title=${i18next.t('figure.text.drive-explained')}\n @change=${(e: Event) => this.setDrive(at, (e.target as HTMLSelectElement).value as Clip['drive'])}\n >\n ${CLIP_DRIVES.map(\n drive => html`<option value=${drive}>${i18next.t('figure.label.drive-' + drive)}</option>`\n )}\n </select>\n <button plain @click=${() => this.removeClip(at)} title=${i18next.t('figure.button.remove')}>\n <md-icon>close</md-icon>\n </button>\n </div>\n\n ${duplicate ? html`<p warn>${i18next.t('figure.text.clip-name-taken')}</p>` : nothing}\n ${nameless ? html`<p warn>${i18next.t('figure.text.clip-needs-a-name')}</p>` : nothing}\n ${on ? this.renderChannels(clip, at) : nothing}\n </div>\n `\n }\n\n private renderChannels(clip: Clip, at: number): TemplateResult {\n return html`\n <p quiet>${i18next.t('figure.text.drive-' + (clip.drive ?? 'loop') + '-note')}</p>\n\n ${clip.channels.length === 0 ? html`<p warn>${i18next.t('figure.text.clip-needs-a-channel')}</p>` : nothing}\n ${clip.channels.map((channel, j) => this.renderChannel(channel, at, j))}\n\n <button @click=${() => this.addChannel(at)}>\n <md-icon>add</md-icon>${i18next.t('figure.button.add-channel')}\n </button>\n `\n }\n\n /**\n * 채널 하나 — 어느 부품의 어느 속성을 움직이나.\n *\n * 없는 부품을 가리키는 채널은 붉게 낸다. 부품 이름을 바꾸면 그 순간 이렇게 되는데,\n * 검증은 저장할 때 말하고 여기서는 **그 자리에서** 보여 준다.\n */\n private renderChannel(channel: Channel, at: number, j: number): TemplateResult {\n const orphan = !this.partNames.includes(channel.target)\n const turning = channel.path === 'rotation'\n\n return html`\n <div channel ?orphan=${orphan}>\n <div row>\n <label>${i18next.t('figure.label.channel-target')}</label>\n <select\n .value=${live(channel.target ?? '')}\n @change=${(e: Event) => this.setChannel(at, j, { target: (e.target as HTMLSelectElement).value })}\n >\n ${orphan ? html`<option value=${channel.target}>${channel.target}</option>` : nothing}\n ${this.partNames.map(name => html`<option value=${name}>${name}</option>`)}\n </select>\n <button plain @click=${() => this.removeChannel(at, j)} title=${i18next.t('figure.button.remove')}>\n <md-icon>close</md-icon>\n </button>\n </div>\n\n ${orphan ? html`<p warn>${i18next.t('figure.text.channel-target-is-gone')}</p>` : nothing}\n\n <div row>\n <label>${i18next.t('figure.label.channel-path')}</label>\n <select\n .value=${live(channel.path)}\n @change=${(e: Event) => this.setPath(at, j, (e.target as HTMLSelectElement).value as ChannelPath)}\n >\n ${CHANNEL_PATHS.map(path => html`<option value=${path}>${i18next.t('figure.label.path-' + path)}</option>`)}\n </select>\n <select\n .value=${live(channel.interpolation ?? 'linear')}\n title=${i18next.t('figure.text.interpolation-explained')}\n @change=${(e: Event) =>\n this.setChannel(at, j, { interpolation: (e.target as HTMLSelectElement).value as Channel['interpolation'] })}\n >\n ${INTERPOLATIONS.map(\n one => html`<option value=${one}>${i18next.t('figure.label.interpolation-' + one)}</option>`\n )}\n </select>\n </div>\n\n <p quiet>${i18next.t('figure.text.path-' + channel.path + '-unit')}</p>\n\n ${turning ? this.renderPivot(channel, at, j) : nothing}\n ${this.renderKeys(channel, at, j)}\n </div>\n `\n }\n\n /**\n * 회전 중심 — **`rotation` 에서만 뜻이 있다.**\n *\n * 그래서 경로가 rotation 일 때만 낸다. 언제나 내면 저작자가 옮김·배율에도 적고, 검증이\n * 저장할 때 「쓰이지 않는다」고 알린다. 안 보이면 적을 일이 없다.\n */\n private renderPivot(channel: Channel, at: number, j: number): TemplateResult {\n const pivot = channel.pivot\n const on = pivot !== undefined\n\n return html`\n <div row>\n <label>${i18next.t('figure.label.channel-pivot')}</label>\n <button\n @click=${() => this.setChannel(at, j, { pivot: on ? undefined : { x: 0, y: 0, z: 0 } })}\n title=${i18next.t('figure.text.pivot-defaults-to-the-part-centre')}\n >\n ${i18next.t(on ? 'figure.button.pivot-clear' : 'figure.button.pivot-set')}\n </button>\n ${on\n ? AXES.map(\n axis => html`\n <input\n type=\"number\"\n step=\"1\"\n .value=${live(String(pivot![axis]))}\n aria-label=${axis}\n @change=${(e: Event) =>\n this.setChannel(at, j, {\n pivot: { ...pivot!, [axis]: Number((e.target as HTMLInputElement).value) || 0 }\n })}\n />\n `\n )\n : nothing}\n </div>\n `\n }\n\n /**\n * 키프레임 표.\n *\n * **둘 미만으로 못 내려간다.** 하나뿐이면 움직이는 것이 아니라 자세 하나이고, 형식이\n * 오류로 막는다. 저장하고 나서 알려 주는 것보다 지우는 단추를 죽이는 것이 낫다.\n *\n * 시각이 오름차순이어야 하는 것도 형식의 규칙이다. 여기서는 어긋난 줄을 붉게 내고 값을\n * 고치지는 않는다 — 저작자가 3 을 1 로 고치던 중일 수 있다.\n */\n private renderKeys(channel: Channel, at: number, j: number): TemplateResult {\n const keys = channel.keys ?? []\n\n return html`\n <table keys>\n <tr>\n <th>${i18next.t('figure.label.key-at')}</th>\n ${AXES.map(axis => html`<th>${axis}</th>`)}\n <th></th>\n </tr>\n ${keys.map((key, k) => {\n const backwards = k > 0 && key.at <= (keys[k - 1]!.at ?? 0)\n return html`\n <tr>\n <td>\n <input\n type=\"number\"\n step=\"0.1\"\n min=\"0\"\n ?bad=${backwards || key.at < 0}\n .value=${live(String(key.at))}\n title=${backwards ? i18next.t('figure.text.keys-must-rise') : ''}\n @change=${(e: Event) =>\n this.setKey(at, j, k, { at: Math.max(0, Number((e.target as HTMLInputElement).value) || 0) })}\n />\n </td>\n ${AXES.map(\n axis => html`\n <td>\n <input\n type=\"number\"\n step=${channel.path === 'scale' ? '0.1' : '1'}\n .value=${live(String(key.value[axis]))}\n aria-label=${axis}\n @change=${(e: Event) =>\n this.setKey(at, j, k, {\n value: { ...key.value, [axis]: Number((e.target as HTMLInputElement).value) || 0 }\n })}\n />\n </td>\n `\n )}\n <td drop>\n <button\n plain\n ?disabled=${keys.length <= 2}\n title=${keys.length <= 2 ? i18next.t('figure.text.two-keys-at-least') : i18next.t('figure.button.remove')}\n @click=${() => this.removeKey(at, j, k)}\n >\n <md-icon>close</md-icon>\n </button>\n </td>\n </tr>\n `\n })}\n </table>\n\n ${keys.some((key, k) => k > 0 && key.at <= (keys[k - 1]!.at ?? 0))\n ? html`<p warn>${i18next.t('figure.text.keys-must-rise')}</p>`\n : nothing}\n\n <button @click=${() => this.addKey(at, j)}>\n <md-icon>add</md-icon>${i18next.t('figure.button.add-key')}\n </button>\n `\n }\n\n /**\n * 움직이는 부품 예산.\n *\n * **넘어도 막지 않는다.** 움직이는 부품은 저마다 단독 묶음이라 draw call 이 늘고 프레임마다\n * 갱신이 는다 — 그 대가가 수로 보이면 저작자가 아낀다. 랜드마크 설비 하나는 정교해도 되고,\n * 그 값이 도면 예산에 드러나면 된다.\n */\n private renderBudget(): TemplateResult {\n const used = this.movingParts\n const over = used > LIMITS.animatedParts\n\n return html`\n <section>\n <h3>${i18next.t('figure.label.budget-animations')}</h3>\n <div budget ?over=${over}>\n <strong>${used}</strong>\n <span quiet>/ ${LIMITS.animatedParts}</span>\n </div>\n <p quiet>${i18next.t('figure.text.animated-parts-cost')}</p>\n ${over ? html`<p warn>${i18next.t('figure.text.animated-parts-over')}</p>` : nothing}\n </section>\n `\n }\n\n // ─── 고치기 ───────────────────────────────────────────────────────────────\n\n /**\n * 초안에 실어 올려보낸다.\n *\n * `animations` 는 도형 전체의 것이므로 부품 편집(`update-part`)이 아니라 `update-draft` 로\n * 간다. 빈 배열은 칸을 지운다 — clip 을 다 지운 도형은 `animations: []` 가 아니라 없는 것이다.\n */\n private tell(animations: Clip[]): void {\n if (!this.draft) return\n\n const draft: FigureDraft = { ...this.draft }\n if (animations.length === 0) delete draft.animations\n else draft.animations = animations\n\n this.dispatchEvent(new CustomEvent('update-draft', { detail: { draft }, bubbles: true, composed: true }))\n }\n\n private patchClip(at: number, patch: Partial<Clip>): void {\n this.tell(this.clips.map((clip, i) => (i === at ? { ...clip, ...patch } : clip)))\n }\n\n private patchChannel(at: number, j: number, next: Channel): void {\n const clip = this.clips[at]\n if (!clip) return\n this.patchClip(at, { channels: clip.channels.map((channel, i) => (i === j ? next : channel)) })\n }\n\n private addClip(): void {\n const target = this.partNames[0]\n if (!target) return\n\n const clip: Clip = {\n name: freeName(this.clips),\n drive: 'loop',\n channels: [{ target, path: 'translation', keys: keysFor('translation') }]\n }\n\n this.open = this.clips.length\n this.tell([...this.clips, clip])\n }\n\n /** Recipe creates a valid, editable two-pose clip; it never saves or publishes the Figure. */\n private addRecipe(recipe: MotionRecipe): void {\n const target = this.recipeTarget || this.partNames[0]\n if (!target) return\n const channel: Channel = {\n target,\n path: recipe.path,\n keys: [{ at: 0, value: startValue(recipe.path) }, { at: 1, value: { ...recipe.end } }]\n }\n if (recipe.pivot) channel.pivot = { ...recipe.pivot }\n this.open = this.clips.length\n this.tell([...this.clips, { name: freeRecipeName(this.clips, recipe.name), drive: recipe.drive, channels: [channel] }])\n }\n\n private renameClip(at: number, name: string): void {\n this.patchClip(at, { name: name.trim() })\n }\n\n private setDrive(at: number, drive: Clip['drive']): void {\n this.patchClip(at, { drive })\n }\n\n private removeClip(at: number): void {\n if (this.open >= at) this.open = Math.max(0, this.open - 1)\n this.tell(this.clips.filter((_, i) => i !== at))\n }\n\n private addChannel(at: number): void {\n const clip = this.clips[at]\n const target = this.partNames[0]\n if (!clip || !target) return\n\n this.patchClip(at, {\n channels: [...clip.channels, { target, path: 'translation', keys: keysFor('translation') }]\n })\n }\n\n private setChannel(at: number, j: number, patch: Partial<Channel>): void {\n const channel = this.clips[at]?.channels[j]\n if (!channel) return\n\n const next: Channel = { ...channel, ...patch }\n /* `undefined` 를 얹는 것은 지우는 뜻이다. 남겨 두면 저장 형식에 빈 칸이 실린다. */\n if ('pivot' in patch && patch.pivot === undefined) delete next.pivot\n this.patchChannel(at, j, next)\n }\n\n /**\n * 경로를 바꾼다 — **값까지 함께 옮긴다.**\n *\n * 옮김·회전의 0 은 「제자리」인데 배율의 0 은 **부품을 지운다.** 경로만 바꾸고 값을 그대로\n * 두면 저작자는 부품이 사라진 것을 보고 도구가 고장 난 줄 안다. 그래서 옮김·회전 ↔ 배율을\n * 건널 때 시작값을 그 경로의 제자리로 되돌린다. 시각은 지킨다 — 저작자가 짠 박자다.\n */\n private setPath(at: number, j: number, path: ChannelPath): void {\n const channel = this.clips[at]?.channels[j]\n if (!channel) return\n\n const crossing = (channel.path === 'scale') !== (path === 'scale')\n const next: Channel = {\n ...channel,\n path,\n keys: crossing ? channel.keys.map(key => ({ at: key.at, value: startValue(path) })) : channel.keys\n }\n /* 회전이 아니면 회전 중심은 쓰이지 않는다. 남겨 두면 검증이 「쓰이지 않는다」고 알린다. */\n if (path !== 'rotation') delete next.pivot\n\n this.patchChannel(at, j, next)\n }\n\n private removeChannel(at: number, j: number): void {\n const clip = this.clips[at]\n if (!clip) return\n this.patchClip(at, { channels: clip.channels.filter((_, i) => i !== j) })\n }\n\n /** 마지막 키에서 1 초 뒤. 값은 그 키를 그대로 받는다 — 붙여 놓고 고치는 것이 짜기 쉽다. */\n private addKey(at: number, j: number): void {\n const channel = this.clips[at]?.channels[j]\n if (!channel) return\n\n const last = channel.keys[channel.keys.length - 1]\n const key: Keyframe = { at: (last?.at ?? 0) + 1, value: { ...(last?.value ?? startValue(channel.path)) } }\n this.patchChannel(at, j, { ...channel, keys: [...channel.keys, key] })\n }\n\n private setKey(at: number, j: number, k: number, patch: Partial<Keyframe>): void {\n const channel = this.clips[at]?.channels[j]\n if (!channel) return\n this.patchChannel(at, j, {\n ...channel,\n keys: channel.keys.map((key, i) => (i === k ? { ...key, ...patch } : key))\n })\n }\n\n /** 둘 미만으로 내려가지 않는다 — 단추가 이미 죽어 있지만 밖에서 불릴 수 있다. */\n private removeKey(at: number, j: number, k: number): void {\n const channel = this.clips[at]?.channels[j]\n if (!channel || channel.keys.length <= 2) return\n this.patchChannel(at, j, { ...channel, keys: channel.keys.filter((_, i) => i !== k) })\n }\n}\n"]}
package/dist-client/modeller/figure-canvas.d.ts CHANGED
@@ -1,9 +1,9 @@
1
1
  import { LitElement } from 'lit';
2
2
  import type { ViewSettings } from './figure-view.js';
3
- import type { BoardModel, PartModel } from './figure-source.js';
3
+ import type { FigureDraft, PartModel } from './figure-source.js';
4
4
  declare const FigureCanvas_base: (new (...args: any[]) => LitElement) & typeof LitElement;
5
5
  /**
6
- * 편집 캔버스 — 부품들을 보드 위에 세우고, 여기서 고치게 한다.
6
+ * 편집 캔버스 — 부품들을 기준 상자 위에 세우고, 여기서 고치게 한다.
7
7
  *
8
8
  * ## 미리보기가 아니다
9
9
  *
@@ -21,10 +21,10 @@ declare const FigureCanvas_base: (new (...args: any[]) => LitElement) & typeof L
21
21
  * 이제 부품 하나가 컴포넌트 하나다. 선택 · 기즈모 · 윤곽선 · 다중 선택 · 되돌리기가
22
22
  * 씬의 기본 동작으로 그냥 된다.
23
23
  *
24
- * ## 보드가 곧 기준 상자다
24
+ * ## 초안이 곧 기준 상자다
25
25
  *
26
- * 보드의 `width` · `height` · `depth` 가 `FigureSource.base` 다. 부품 좌표를 변환할 때
27
- * 보드 중심만 빼면 된다 — `figure-source.ts` 가 그 일을 한다.
26
+ * 초안의 `width` · `height` · `depth` 가 `FigureSource.base` 다. 부품 좌표를 변환할 때
27
+ * 상자 중심만 빼면 된다 — `figure-source.ts` 가 그 일을 한다.
28
28
  *
29
29
  * ## 다시 세우지 않는다
30
30
  *
@@ -39,10 +39,10 @@ export declare class FigureCanvas extends FigureCanvas_base {
39
39
  *
40
40
  * 한동안 `FigureSource` 로 받아 여기서 변환했다. 그런데 모델러 페이지가 갖고 있는 것이
41
41
  * 이미 씬 모델이므로, 그러면 값을 하나 고칠 때마다 왕복 변환이 한 번씩 일어난다.
42
- * 무손실이긴 하지만 하는 일이 없다 — 보드가 곧 보드이고 부품이 곧 컴포넌트다.
42
+ * 무손실이긴 하지만 하는 일이 없다 — 초안이 곧 판이고 부품이 곧 컴포넌트다.
43
43
  */
44
44
  figureId?: string;
45
- board?: BoardModel;
45
+ draft?: FigureDraft;
46
46
  /** 보기 설정. 자산이 아니라 작업대다 — 저장되지 않는다(`figure-view.ts`). */
47
47
  view: ViewSettings;
48
48
  parts: PartModel[];
package/dist-client/modeller/figure-canvas.js CHANGED
@@ -4,18 +4,7 @@ import { customElement, property, query, state } from 'lit/decorators.js';
4
4
  import { i18next, localize } from '@operato/i18n';
5
5
  import { create, Model } from '@hatiolab/things-scene';
6
6
  import { gridStep } from './part-edits.js';
7
- import { DEFAULT_VIEW, WORKBENCH } from './figure-view.js';
8
- function toScenePlacement(placement) {
9
- switch (placement) {
10
- case 'ceiling':
11
- return 'inverted';
12
- case 'center':
13
- return 'space';
14
- case 'floor':
15
- default:
16
- return 'floor';
17
- }
18
- }
7
+ import { DEFAULT_VIEW, sceneLook, WORKBENCH } from './figure-view.js';
19
8
  /**
20
9
  * 판의 종이 색 — 거의 흰색.
21
10
  *
@@ -44,7 +33,7 @@ function changedKeys(now, wanted) {
44
33
  return any ? diff : null;
45
34
  }
46
35
  /**
47
- * 편집 캔버스 — 부품들을 보드 위에 세우고, 여기서 고치게 한다.
36
+ * 편집 캔버스 — 부품들을 기준 상자 위에 세우고, 여기서 고치게 한다.
48
37
  *
49
38
  * ## 미리보기가 아니다
50
39
  *
@@ -62,10 +51,10 @@ function changedKeys(now, wanted) {
62
51
  * 이제 부품 하나가 컴포넌트 하나다. 선택 · 기즈모 · 윤곽선 · 다중 선택 · 되돌리기가
63
52
  * 씬의 기본 동작으로 그냥 된다.
64
53
  *
65
- * ## 보드가 곧 기준 상자다
54
+ * ## 초안이 곧 기준 상자다
66
55
  *
67
- * 보드의 `width` · `height` · `depth` 가 `FigureSource.base` 다. 부품 좌표를 변환할 때
68
- * 보드 중심만 빼면 된다 — `figure-source.ts` 가 그 일을 한다.
56
+ * 초안의 `width` · `height` · `depth` 가 `FigureSource.base` 다. 부품 좌표를 변환할 때
57
+ * 상자 중심만 빼면 된다 — `figure-source.ts` 가 그 일을 한다.
69
58
  *
70
59
  * ## 다시 세우지 않는다
71
60
  *
@@ -201,7 +190,7 @@ let FigureCanvas = class FigureCanvas extends localize(i18next)(LitElement) {
201
190
  return;
202
191
  if (changed.has('revision'))
203
192
  this.standing = undefined;
204
- if (changed.has('board') || changed.has('parts') || changed.has('figureId') || changed.has('revision'))
193
+ if (changed.has('draft') || changed.has('parts') || changed.has('figureId') || changed.has('revision'))
205
194
  this.standUp();
206
195
  if (changed.has('view'))
207
196
  this.applyView();
@@ -228,8 +217,8 @@ let FigureCanvas = class FigureCanvas extends localize(i18next)(LitElement) {
228
217
  * 숫자 하나 고칠 때마다 화면이 처음으로 돌아간다.
229
218
  */
230
219
  standUp() {
231
- const board = this.board;
232
- if (!board) {
220
+ const draft = this.draft;
221
+ if (!draft) {
233
222
  this.teardown();
234
223
  this.cannot = i18next.t('figure.text.canvas-appears-once-a-part-exists');
235
224
  return;
@@ -240,7 +229,7 @@ let FigureCanvas = class FigureCanvas extends localize(i18next)(LitElement) {
240
229
  this.cannot = i18next.t('figure.text.canvas-appears-once-a-part-exists');
241
230
  return;
242
231
  }
243
- const signature = `${this.figureId ?? ''}:${board.width}x${board.height}x${board.depth}:${board.placement ?? 'floor'}`;
232
+ const signature = `${this.figureId ?? ''}:${draft.width}x${draft.height}x${draft.depth}`;
244
233
  if (this.scene && this.standing === signature) {
245
234
  this.syncParts();
246
235
  return;
@@ -251,10 +240,9 @@ let FigureCanvas = class FigureCanvas extends localize(i18next)(LitElement) {
251
240
  target: this.stage,
252
241
  model: {
253
242
  type: 'model-layer',
254
- width: board.width,
255
- height: board.height,
256
- depth: board.depth,
257
- placement: toScenePlacement(board.placement),
243
+ width: draft.width,
244
+ height: draft.height,
245
+ depth: draft.depth,
258
246
  threed: true,
259
247
  environment: 'studio',
260
248
  /*
@@ -269,7 +257,7 @@ let FigureCanvas = class FigureCanvas extends localize(i18next)(LitElement) {
269
257
  보드는 이 값을 안 주므로 안 보인다.
270
258
  */
271
259
  ...this.sceneView(),
272
- gridStep: gridStep(board),
260
+ gridStep: gridStep(draft),
273
261
  sky: 'color',
274
262
  /*
275
263
  판의 면 — 2D 는 밝은 종이, 3D 는 없음.
@@ -344,8 +332,7 @@ let FigureCanvas = class FigureCanvas extends localize(i18next)(LitElement) {
344
332
  * 이름이다. 표를 두면 씬이 새 설정을 받아도 이쪽이 모른다.
345
333
  */
346
334
  sceneView() {
347
- const { grid, gridLabels, floor, environment, skyColor, ...light } = this.view ?? DEFAULT_VIEW;
348
- return { grid, gridLabels, floor, environment, skyColor, ...light };
335
+ return sceneLook(this.view ?? DEFAULT_VIEW);
349
336
  }
350
337
  /**
351
338
  * 설정이 바뀌면 **씬에 그대로 넣는다.** 다시 세우지 않는다.
@@ -355,11 +342,11 @@ let FigureCanvas = class FigureCanvas extends localize(i18next)(LitElement) {
355
342
  * 밝기 하나 끄는 동안 화면이 계속 처음으로 돌아간다.
356
343
  */
357
344
  applyView() {
358
- const board = this.scene?.root;
359
- if (!board)
345
+ const draft = this.scene?.root;
346
+ if (!draft)
360
347
  return;
361
- board.set?.(this.sceneView());
362
- board.invalidate?.();
348
+ draft.set?.(this.sceneView());
349
+ draft.invalidate?.();
363
350
  }
364
351
  /**
365
352
  * 부품 목록을 씬에 맞춘다. **다시 세우지 않고 바뀐 것만 고친다.**
@@ -409,9 +396,9 @@ let FigureCanvas = class FigureCanvas extends localize(i18next)(LitElement) {
409
396
  * 목록이 바뀌면 엉뚱한 부품을 가리킨다.
410
397
  */
411
398
  watchScene() {
412
- const board = this.scene?.root;
413
- const root = board?.root;
414
- if (!board || !root?.on || this.viewOnly)
399
+ const draft = this.scene?.root;
400
+ const root = draft?.root;
401
+ if (!draft || !root?.on || this.viewOnly)
415
402
  return;
416
403
  root.on('selected', (after) => {
417
404
  const chosen = after?.[0];
@@ -428,7 +415,7 @@ let FigureCanvas = class FigureCanvas extends localize(i18next)(LitElement) {
428
415
  뒤에 붙여 부모에게 넘긴다. 첫 인자를 컴포넌트로 읽으면 아무 일도 안 일어난다 —
429
416
  실제로 그랬다.
430
417
  */
431
- board.on?.('change', (...args) => {
418
+ draft.on?.('change', (...args) => {
432
419
  const hint = args[args.length - 1];
433
420
  const changed = hint?.origin;
434
421
  const name = changed?.state?.name;
@@ -443,13 +430,13 @@ let FigureCanvas = class FigureCanvas extends localize(i18next)(LitElement) {
443
430
  }
444
431
  /** 목록에서 고른 것을 캔버스의 선택에 맞춘다. */
445
432
  showPicked() {
446
- const board = this.scene?.root;
447
- const root = board?.root;
448
- if (!board || !root)
433
+ const draft = this.scene?.root;
434
+ const root = draft?.root;
435
+ if (!draft || !root)
449
436
  return;
450
437
  const component = this.picked ? this.partsOnBoard().get(this.picked) : undefined;
451
438
  root.selected = component ? [component] : [];
452
- board.invalidate?.();
439
+ draft.invalidate?.();
453
440
  }
454
441
  tell(what, detail) {
455
442
  this.dispatchEvent(new CustomEvent(what, { detail, bubbles: true, composed: true }));
@@ -467,7 +454,7 @@ __decorate([
467
454
  __decorate([
468
455
  property({ type: Object }),
469
456
  __metadata("design:type", Object)
470
- ], FigureCanvas.prototype, "board", void 0);
457
+ ], FigureCanvas.prototype, "draft", void 0);
471
458
  __decorate([
472
459
  property({ type: Object }),
473
460
  __metadata("design:type", Object)
package/dist-client/modeller/figure-canvas.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"figure-canvas.js","sourceRoot":"","sources":["../../client/modeller/figure-canvas.ts"],"names":[],"mappings":"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","sourcesContent":["import { css, html, LitElement, unsafeCSS } from 'lit'\nimport { customElement, property, query, state } from 'lit/decorators.js'\n\nimport { i18next, localize } from '@operato/i18n'\nimport { create, Model } from '@hatiolab/things-scene'\n\nimport { gridStep } from './part-edits.js'\nimport { DEFAULT_VIEW, WORKBENCH } from './figure-view.js'\nimport type { ViewSettings } from './figure-view.js'\nimport type { BoardModel, PartModel } from './figure-source.js'\nimport type { FigurePlacement } from '@hatiolab/figure-model'\n\nfunction toScenePlacement(placement?: FigurePlacement): 'floor' | 'inverted' | 'space' {\n switch (placement) {\n case 'ceiling':\n return 'inverted'\n case 'center':\n return 'space'\n case 'floor':\n default:\n return 'floor'\n }\n}\n\n/**\n * 판의 종이 색 — 거의 흰색.\n *\n * 2D 편집 도구(손잡이 · 안내선 · 선택 테)가 어두운 색으로 그려진다. 종이가 어두우면\n * 그것들이 안 보여 편집을 할 수 없다. 순백이 아닌 것은 판의 가장자리가 작업면과\n * 구별되게 하려는 것이다.\n */\nconst PAPER = '#f4f4f4'\n\n/**\n * 달라진 값만 골라 낸다. 같은 것뿐이면 `null`.\n *\n * 값 비교는 JSON 으로 한다 — 경로(`path`)처럼 배열인 값이 있어서 얕은 비교로는 늘\n * 다르다고 나온다.\n */\nfunction changedKeys(\n now: Record<string, unknown>,\n wanted: Record<string, unknown>\n): Record<string, unknown> | null {\n const diff: Record<string, unknown> = {}\n let any = false\n\n for (const [key, value] of Object.entries(wanted)) {\n const before = now[key]\n const same =\n before === value || (before !== undefined && JSON.stringify(before) === JSON.stringify(value))\n if (!same) {\n diff[key] = value\n any = true\n }\n }\n\n return any ? diff : null\n}\n\n/** 씬이 돌려주는 것 중 우리가 쓰는 부분. */\ninterface SceneHandle {\n dispose?: () => void\n resize?: () => void\n /** 모델 전체가 보이게 화면에 맞춘다. 'ratio' 는 비율을 지키며 맞춘다. */\n fit?: (type?: string) => void\n /**\n * **판**이다 — 루트가 아니다.\n *\n * `create()` 가 돌려주는 `root` 는 `model-layer` 이고, 그 위에 진짜 루트가 하나 더\n * 있다. 부품은 판에 붙고, 선택 알림은 루트가 낸다. 둘을 섞으면 알림이 안 온다 —\n * 실제로 그랬다.\n */\n root?: SceneBoard\n}\n\ninterface SceneBoard {\n invalidate?: () => void\n /** 보기 설정을 넣는 자리. 씬이 스스로 반응한다. */\n set?: (patch: Record<string, unknown>) => void\n /** 3D 카메라를 모델 전체가 보이게 맞춘다. 10.1.4 부터 있다. */\n fitCameraToModel?: (margin?: number) => void\n components?: SceneComponent[]\n selected?: SceneComponent[]\n app?: unknown\n addComponent?: (component: unknown) => void\n removeComponent?: (component: unknown) => void\n on?: (event: string, handler: (...args: unknown[]) => void) => void\n /** 판 위의 루트. 선택 알림이 여기서 난다. */\n root?: {\n selected?: SceneComponent[]\n on?: (event: string, handler: (...args: unknown[]) => void) => void\n }\n}\n\ninterface SceneComponent {\n state: Record<string, unknown>\n set: (props: Record<string, unknown> | string, value?: unknown) => void\n on?: (event: string, handler: (...args: unknown[]) => void) => void\n removeSelf?: (completely?: boolean) => void\n dispose?: () => void\n}\n\n/**\n * 편집 캔버스 — 부품들을 보드 위에 세우고, 여기서 고치게 한다.\n *\n * ## 미리보기가 아니다\n *\n * 한동안 이름이 figure-preview 였다. 원본을 컴파일해 컴포넌트 하나로 세우던 시절에는\n * 정말 보기만 하는 화면이었다. 부품을 컴포넌트로 바꾸면서 편집이 여기서 일어나게 되었다.\n * 부품을 고르고, 2D 로 바꿔 편집하고, 기즈모로 끄는 일이 전부 이 안에서 일어난다.\n * 이름만 남아 있었다.\n *\n * ## 부품이 컴포넌트다\n *\n * 한동안 원본 데이터를 컴파일해 **컴포넌트 하나**로 놓고, 그 안에서 부품을 찾아 다뤘다.\n * 배포용 형태를 편집 화면에 그대로 쓴 것이다. 그래서 어느 부품이 선택됐나 · 무엇을 감쌀까 ·\n * 무엇을 끌까를 전부 따로 뚫어야 했다.\n *\n * 이제 부품 하나가 컴포넌트 하나다. 선택 · 기즈모 · 윤곽선 · 다중 선택 · 되돌리기가\n * 씬의 기본 동작으로 그냥 된다.\n *\n * ## 보드가 곧 기준 상자다\n *\n * 보드의 `width` · `height` · `depth` 가 `FigureSource.base` 다. 부품 좌표를 변환할 때\n * 보드 중심만 빼면 된다 — `figure-source.ts` 가 그 일을 한다.\n *\n * ## 다시 세우지 않는다\n *\n * 부품이 바뀌면 씬을 통째로 다시 세우지 않고 **바뀐 컴포넌트만 고친다.** 다시 세우면\n * 고른 것과 카메라가 날아가서, 숫자 하나 고칠 때마다 화면이 처음으로 돌아간다.\n * 판 크기가 바뀔 때만 다시 세운다 — 판은 씬을 만들 때 정해진다.\n */\n@customElement('figure-canvas')\nexport class FigureCanvas extends localize(i18next)(LitElement) {\n static styles = css`\n /*\n 판 바깥을 우리가 칠한다.\n\n 무대에는 셋이 있다 — 판의 면(2D 는 종이, 3D 는 바닥판), 판 바깥, 좌표 바탕.\n 어느 것도 원본 데이터에 저장되지 않는다. 보려고 만든 것이므로 편집하기 좋게 잡는다.\n\n 2D 에는 바깥을 칠하는 사람이 없다. 씬의 2D 는 캔버스를 투명으로 지우고\n 끝이라(layer.ts 의 clearRect), 뒤에 있는 것이 그대로 비친다. 테마 토큰을\n 깔아 두었더니 어두운 데서 까맣게 나왔다.\n\n 3D 하늘과 같은 값을 쓴다. 갈리면 2D 로 갔을 때 바탕색이 바뀐다.\n */\n :host {\n position: relative;\n display: flex;\n overflow: hidden;\n background-color: ${unsafeCSS(WORKBENCH)};\n }\n\n /*\n 씬이 이 칸을 자기 것으로 삼으면서 인라인 스타일로 position: relative 를 박는다.\n\n 그러면 우리가 CSS 로 준 position: absolute 가 밀리고, 같이 준 inset: 0 도 함께 뜻을\n 잃는다. relative 인 블록은 상위 배치에서 크기를 받는데, 자식(캔버스)이 전부 절대 배치라\n 내용 폭이 0 이다. 그래서 폭 0 짜리 칸이 되고 캔버스도 폭 0 이 된다.\n\n 화면은 그냥 회색으로 남는다. 게다가 마우스 좌표를 NDC 로 바꿀 때 폭으로 나누므로\n 값이 무한대가 되어 기즈모를 집을 수 없다 — \"기즈모가 안 잡힌다\"의 실제 원인이\n 이것이었다.\n\n 그래서 width 와 height 를 직접 준다. 인라인으로 position 이 무엇으로 바뀌든 칸은\n 부모를 채운다.\n */\n div[stage] {\n position: absolute;\n inset: 0;\n width: 100%;\n height: 100%;\n }\n\n /* 세울 수 없는 상태를 빈 화면으로 두지 않는다 — 왜 안 보이는지 말한다 */\n div[cannot] {\n position: absolute;\n inset: 0;\n display: flex;\n align-items: center;\n justify-content: center;\n padding: var(--spacing-large, 12px);\n text-align: center;\n font: var(--label-font, inherit);\n line-height: 1.6;\n color: var(--md-sys-color-on-surface-variant, var(--md-sys-color-on-surface));\n background-color: ${unsafeCSS(WORKBENCH)};\n }\n `\n\n /**\n * 편집 중인 내용. **씬 모델 그대로 받는다.**\n *\n * 한동안 `FigureSource` 로 받아 여기서 변환했다. 그런데 모델러 페이지가 갖고 있는 것이\n * 이미 씬 모델이므로, 그러면 값을 하나 고칠 때마다 왕복 변환이 한 번씩 일어난다.\n * 무손실이긴 하지만 하는 일이 없다 — 보드가 곧 보드이고 부품이 곧 컴포넌트다.\n */\n @property({ type: String }) figureId?: string\n @property({ type: Object }) board?: BoardModel\n /** 보기 설정. 자산이 아니라 작업대다 — 저장되지 않는다(`figure-view.ts`). */\n @property({ type: Object }) view: ViewSettings = DEFAULT_VIEW\n @property({ type: Array }) parts: PartModel[] = []\n @property({ type: Number }) revision = 0\n /** 지금 고른 부품 이름. 목록에서 고른 것을 캔버스에 알린다. */\n @property({ type: String }) picked?: string\n\n /**\n * 보기 전용 — 씬에서 일어난 일을 밖에 알리지 않는다.\n *\n * AI 후보를 나란히 세울 때 쓴다. 후보는 아직 편집 대상이 아닌데, 씬은 컴포넌트를\n * 만들면서 상태를 정리하고 그때 변경 이벤트를 낸다. 그 이벤트가 그대로 올라가면\n * **후보의 값이 편집 중인 데이터를 덮어쓴다** — 실제로 그랬다. 받지 않기로 한 부품\n * 위치가 오류보고없이 반영되어 있었고, 후보를 버려도 되돌아오지 않았다.\n */\n @property({ type: Boolean }) viewOnly = false\n\n @query('div[stage]') private stage!: HTMLDivElement\n\n /** 세울 수 없는 사유. 없으면 세운 것이다. */\n @state() private cannot = ''\n\n private scene?: SceneHandle\n\n /**\n * 지금 세워진 것을 그림으로 낸다 — 카드에 쓸 썸네일.\n *\n * 부르는 쪽은 이 부품을 **숨은 자리에 480×360 으로 하나 더 세워** 부른다\n * (`figure-thumbnail.ts`). 보이는 저작면을 찍지 않는 이유는, 저작자가 돌려 둔 각도와 확대,\n * 그리고 창 크기에 따라 달라지는 칸 비율이 그대로 카드에 박히기 때문이다 — 나사를 확대해 보던\n * 중에 저장하면 그 자산의 얼굴이 나사가 된다. 목록은 견주는 자리라 프레임이 일정해야 한다.\n *\n * 못 찍으면 `undefined` 다. 빈 그림을 만들어 「그림이 있다」고 말하지 않는다.\n */\n async snapshot(width = 480, height = 360): Promise<string | undefined> {\n /*\n **3D 를 낼 수 있을 때만 찍는다.**\n\n 씬의 `toDataURL` 은 **2D 씬을 렌더한다.** 그것으로 찍어 보니 흰 종이 한 장이 나왔다\n (480×291 · 834바이트 · 순백 — 2D 판의 면인 `fillStyle: PAPER` 이 화면 전체였다). 3D 픽셀은\n `model-layer.renderer3d`(THREE.WebGLRenderer) 쪽에 있고, 그 렌더러는\n `preserveDrawingBuffer: false` 라 **그린 직후 같은 task 에서** 읽어야 한다. 그 절차를 아는\n 것은 씬이므로, things-scene 이 그 일을 공개 API 로 내주면 여기서 부른다.\n\n 아직 없으면 `undefined` 다. 흰 종이를 썸네일이라고 저장하면 카드가 「그림이 있다」고 말하면서\n 아무것도 보여 주지 않고, 저장할 때마다 판 번호만 올라간다 — 없는 것보다 나쁘다.\n */\n const layer = this.scene?.root as\n | (SceneBoard & {\n snapshot3d?: (\n width?: number,\n height?: number,\n type?: string,\n quality?: number\n ) => Promise<string | undefined>\n })\n | undefined\n\n if (!layer?.snapshot3d) {\n return undefined\n }\n\n try {\n /*\n 알파가 필요 없고 카드에 들어갈 그림이라 webp 로 찍는다. png 는 같은 그림이 서너 배 무겁고,\n 그 무게가 도형마다 DB 와 목록 응답에 실린다. webp 를 못 만드는 브라우저는 캔버스가 알아서\n png 를 돌려준다 — 우리가 판정하지 않는다.\n */\n const url = await layer.snapshot3d(width, height, 'image/webp', 0.85)\n return typeof url === 'string' && url.startsWith('data:') ? url : undefined\n } catch (e) {\n /* 원인을 지어내지 않는다. 못 찍은 것이 저장을 막지는 않는다. */\n console.warn(`[thumbnail] 찍지 못했습니다 — ${(e as Error).message}`)\n return undefined\n }\n }\n /** 지금 씬이 서 있는 판. 이것이 달라지면 다시 세운다. */\n private standing?: string\n /** 칸 크기를 따라가게 지켜본다. 안 지켜보면 0x0 으로 고정된다. */\n private watcher?: ResizeObserver\n\n render() {\n return html`\n <div stage></div>\n ${this.cannot ? html`<div cannot>${this.cannot}</div>` : ''}\n `\n }\n\n willUpdate(changed: Map<string, unknown>) {\n if (!this.hasUpdated) return\n\n if (changed.has('revision')) this.standing = undefined\n if (changed.has('board') || changed.has('parts') || changed.has('figureId') || changed.has('revision')) this.standUp()\n if (changed.has('view')) this.applyView()\n if (changed.has('picked')) this.showPicked()\n }\n\n firstUpdated() {\n this.standUp()\n\n // 씬은 세울 때의 칸 크기를 읽는다. 저작면이 아직 배치되기 전이면 0x0 으로 굳어\n // **캔버스는 붙었는데 아무것도 안 보이는** 상태가 된다 — 실제로 그렇게 났다.\n this.watcher = new ResizeObserver(() => this.scene?.resize?.())\n this.watcher.observe(this)\n }\n\n disconnectedCallback() {\n super.disconnectedCallback()\n this.watcher?.disconnect()\n this.watcher = undefined\n this.teardown()\n }\n\n /**\n * 받은 것을 씬에 반영한다.\n *\n * **판이 그대로면 다시 세우지 않는다.** 다시 세우면 고른 것과 카메라가 날아가서,\n * 숫자 하나 고칠 때마다 화면이 처음으로 돌아간다.\n */\n private standUp() {\n const board = this.board\n if (!board) {\n this.teardown()\n this.cannot = i18next.t('figure.text.canvas-appears-once-a-part-exists')\n return\n }\n\n // 새 Figure의 빈 초안에서는 이전 자산의 씬을 반드시 버린다.\n if (this.parts.length === 0) {\n this.teardown()\n this.cannot = i18next.t('figure.text.canvas-appears-once-a-part-exists')\n return\n }\n\n const signature = `${this.figureId ?? ''}:${board.width}x${board.height}x${board.depth}:${board.placement ?? 'floor'}`\n if (this.scene && this.standing === signature) {\n this.syncParts()\n return\n }\n\n this.teardown()\n\n try {\n this.scene = create({\n target: this.stage,\n model: {\n type: 'model-layer',\n width: board.width,\n height: board.height,\n depth: board.depth,\n placement: toScenePlacement(board.placement),\n threed: true,\n environment: 'studio',\n /*\n 표본을 화면보다 더 쓴다. MSAA 만으로는 실루엣의 계단이 남는다 — 픽셀\n 비율만 올려 보니 눈에 띄게 매끄러워졌다. 저작면은 작은 칸에 자산 하나라\n 그릴 것이 적으니 표본을 더 써도 된다.\n */\n pixelRatio: Math.min(3, (window.devicePixelRatio || 1) * 2),\n /*\n 좌표 바탕을 씬에게 맡긴다. 우리가 만들어 얹었더니 2D 로 갔다 오면\n 사라졌다 — 그때 씬이 통째로 다시 서면서 새 THREE.Scene 을 만들기 때문이다.\n 보드는 이 값을 안 주므로 안 보인다.\n */\n ...this.sceneView(),\n gridStep: gridStep(board),\n sky: 'color',\n /*\n 판의 면 — 2D 는 밝은 종이, 3D 는 없음.\n\n 종이는 밝아야 한다: 2D 편집 손잡이와 안내선이 어두운 색이다. 바닥판은\n 없어야 한다: 좌표 모눈과 겹쳐 싸우고 원점 아래쪽을 가린다.\n */\n fillStyle: PAPER,\n components: this.parts.map(part => ({ ...part }))\n },\n // **편집 모드**로 만든다. 보드의 3D 모델러가 그 모드에서 카메라 시점 버튼 ·\n // 기즈모 모드 · 도움말 · 단축키를 띄운다.\n mode: 1\n }) as SceneHandle\n\n this.standing = signature\n this.watchScene()\n this.scene.resize?.()\n /*\n 열자마자 모델 전체가 보이게 맞춘다.\n\n 카메라는 2D 뷰포트에서 만들어진다. 그런데 그 뷰포트의 처음 배율은 컨테이너\n 크기에서 오지 모델 크기에서 오지 않는다. 그래서 가로로 긴 모델(컨베이어가\n 그렇다)을 열면 화면 밖으로 나가 벨트 한 조각만 보였다.\n\n **다시 세울 때만 맞춘다.** 창 크기가 바뀔 때마다 맞추면 사용자가 돌려 둔 시점과\n 확대가 매번 되돌아간다.\n */\n this.scene.fit?.('ratio')\n /*\n 3D 카메라는 2D 쪽 fit 으로 안 움직인다. 처음 3D 로 설 때 모델 크기를 보지 않기\n 때문이다. 씬이 내주는 자리로 따로 맞춘다.\n\n `?.` 로 부르는 것은 배포된 판에 아직 없을 수 있어서다. 없으면 2D 만 맞고 3D 는\n 기본 시점으로 선다 — 여기서 카메라 계산을 흉내 내지 않는다.\n */\n this.scene.root?.fitCameraToModel?.()\n this.cannot = ''\n } catch (e) {\n // 원인을 지어내지 않는다 — 던진 말을 그대로 보여 준다.\n this.cannot = (e as Error).message\n }\n }\n\n /**\n * 지금 판 위에 있는 부품 컴포넌트를 이름으로 찾는다.\n *\n * **참조를 들고 있지 않는다.** 전에는 세울 때 한 번 색인해 두고 계속 그 Map 을 썼다.\n * 그런데 씬은 우리 모르게 판을 다시 세울 때가 있다 — 2D 와 3D 를 오갈 때가 그렇다.\n * 그러면 Map 안의 것들은 부모가 없는 죽은 객체가 되고, 그 뒤로는\n *\n * - 목록에서 골라도 선택이 안 된다. 루트의 `selected` 게터가 부모 없는 것을\n * 걸러 내므로 빈 배열이 되고, 테두리도 기즈모도 붙지 않는다\n * - 속성을 고쳐도 3D 가 안 따라온다. 죽은 객체에 값을 넣기 때문이다\n *\n * 둘 다 오류보고없이 일어난다. 실제로 화면에서 「기즈모가 안 잡힌다」로 나타났다.\n *\n * 부품은 많아야 20개다. 매번 순회하는 값이 참조를 갖고 있다가 틀리는 값보다 훨씬 싸다.\n */\n private partsOnBoard(): Map<string, SceneComponent> {\n const found = new Map<string, SceneComponent>()\n for (const component of this.scene?.root?.components ?? []) {\n const name = component.state?.name\n if (typeof name === 'string') found.set(name, component)\n }\n return found\n }\n\n /**\n * 보기 설정을 씬이 아는 이름으로 낸다.\n *\n * 옮겨 적는 표를 두지 않는다 — `ViewSettings` 의 이름이 곧 `model-layer` 의 상태\n * 이름이다. 표를 두면 씬이 새 설정을 받아도 이쪽이 모른다.\n */\n private sceneView(): Record<string, unknown> {\n const { grid, gridLabels, floor, environment, skyColor, ...light } = this.view ?? DEFAULT_VIEW\n\n return { grid, gridLabels, floor, environment, skyColor, ...light }\n }\n\n /**\n * 설정이 바뀌면 **씬에 그대로 넣는다.** 다시 세우지 않는다.\n *\n * 씬이 이 값들에 스스로 반응한다(`three-capability` 의 `onchange`) — 조명 · 반사 ·\n * 바닥 · 좌표 바탕이 그 자리에서 바뀐다. 다시 세우면 고른 것과 카메라가 날아가서,\n * 밝기 하나 끄는 동안 화면이 계속 처음으로 돌아간다.\n */\n private applyView(): void {\n const board = this.scene?.root\n if (!board) return\n\n board.set?.(this.sceneView())\n board.invalidate?.()\n }\n\n /**\n * 부품 목록을 씬에 맞춘다. **다시 세우지 않고 바뀐 것만 고친다.**\n *\n * 다시 세우면 고른 것과 카메라가 날아가서, 숫자 하나 고칠 때마다 화면이 처음으로\n * 돌아간다.\n */\n private syncParts() {\n const root = this.scene?.root\n if (!root) return\n\n const wanted = new Map(this.parts.map(part => [part.name, part]))\n const standing = this.partsOnBoard()\n\n // 없어진 것을 제거한다\n for (const [name, component] of standing) {\n if (!wanted.has(name)) {\n root.removeComponent?.(component)\n component.dispose?.()\n }\n }\n\n for (const part of this.parts) {\n const found = standing.get(part.name)\n if (found) {\n /*\n **달라진 값만 넣는다.**\n\n 같은 값을 다시 넣어도 씬은 변경 이벤트를 낸다. 그 이벤트가 다시 편집 데이터를\n 만들고, 그것이 다시 여기로 돌아오면 끝없이 반복된다. 기즈모를 끄는 중이라면 그\n 되먹임이 끌기와 싸운다.\n */\n const diff = changedKeys(found.state, part as unknown as Record<string, unknown>)\n if (diff) found.set(diff)\n continue\n }\n // 새 부품. 씬의 공장으로 만들어 판에 붙인다.\n const made = Model.compile({ ...part }, root.app as never) as SceneComponent | null\n if (made) root.addComponent?.(made)\n }\n\n root.invalidate?.()\n }\n\n /**\n * 씬에서 일어난 일을 밖에 알린다.\n *\n * **자리가 아니라 이름으로 알린다.** 목록의 몇 번째인지로 알리면, 알림이 오는 사이에\n * 목록이 바뀌면 엉뚱한 부품을 가리킨다.\n */\n private watchScene() {\n const board = this.scene?.root\n const root = board?.root\n if (!board || !root?.on || this.viewOnly) return\n\n root.on('selected', (after: unknown) => {\n const chosen = (after as SceneComponent[] | undefined)?.[0]\n const name = chosen?.state?.name\n if (typeof name === 'string') this.tell('pick-part', { name })\n })\n\n /*\n 기즈모로 끌거나 2D 에서 옮기면 컴포넌트 상태가 바뀐다. 그것을 그대로 올려 보낸다 —\n 씬이 쓰는 용어 그대로다. 저장 형식으로 옮기는 일은 변환 함수가 한다.\n\n **바뀜은 판으로 올라오고, 바뀐 컴포넌트는 끝 인자의 `origin` 에 있다.** 자식이\n `trigger('change', after, before)` 를 하면 씬이 `{ origin, name, deliverer }` 를\n 뒤에 붙여 부모에게 넘긴다. 첫 인자를 컴포넌트로 읽으면 아무 일도 안 일어난다 —\n 실제로 그랬다.\n */\n board.on?.('change', (...args: unknown[]) => {\n const hint = args[args.length - 1] as { origin?: SceneComponent } | undefined\n const changed = hint?.origin\n const name = changed?.state?.name\n if (typeof name !== 'string') return\n\n const was = this.parts.find(part => part.name === name)\n if (!was) return\n\n // 씬 모델 그대로 올려 보낸다. 모델러 페이지가 갖고 있는 것도 씬 모델이라 변환할 것이 없다.\n this.tell('part-changed', { name, part: { ...was, ...changed!.state } as PartModel })\n })\n }\n\n /** 목록에서 고른 것을 캔버스의 선택에 맞춘다. */\n private showPicked() {\n const board = this.scene?.root\n const root = board?.root\n if (!board || !root) return\n\n const component = this.picked ? this.partsOnBoard().get(this.picked) : undefined\n root.selected = component ? [component] : []\n board.invalidate?.()\n }\n\n private tell(what: string, detail: object) {\n this.dispatchEvent(new CustomEvent(what, { detail, bubbles: true, composed: true }))\n }\n\n private teardown() {\n this.scene?.dispose?.()\n this.scene = undefined\n this.standing = undefined\n }\n}\n"]}
1
+ {"version":3,"file":"figure-canvas.js","sourceRoot":"","sources":["../../client/modeller/figure-canvas.ts"],"names":[],"mappings":"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","sourcesContent":["import { css, html, LitElement, unsafeCSS } from 'lit'\nimport { customElement, property, query, state } from 'lit/decorators.js'\n\nimport { i18next, localize } from '@operato/i18n'\nimport { create, Model } from '@hatiolab/things-scene'\n\nimport { gridStep } from './part-edits.js'\nimport { DEFAULT_VIEW, sceneLook, WORKBENCH } from './figure-view.js'\nimport type { ViewSettings } from './figure-view.js'\nimport type { FigureDraft, PartModel } from './figure-source.js'\n\n/**\n * 판의 종이 색 — 거의 흰색.\n *\n * 2D 편집 도구(손잡이 · 안내선 · 선택 테)가 어두운 색으로 그려진다. 종이가 어두우면\n * 그것들이 안 보여 편집을 할 수 없다. 순백이 아닌 것은 판의 가장자리가 작업면과\n * 구별되게 하려는 것이다.\n */\nconst PAPER = '#f4f4f4'\n\n/**\n * 달라진 값만 골라 낸다. 같은 것뿐이면 `null`.\n *\n * 값 비교는 JSON 으로 한다 — 경로(`path`)처럼 배열인 값이 있어서 얕은 비교로는 늘\n * 다르다고 나온다.\n */\nfunction changedKeys(\n now: Record<string, unknown>,\n wanted: Record<string, unknown>\n): Record<string, unknown> | null {\n const diff: Record<string, unknown> = {}\n let any = false\n\n for (const [key, value] of Object.entries(wanted)) {\n const before = now[key]\n const same =\n before === value || (before !== undefined && JSON.stringify(before) === JSON.stringify(value))\n if (!same) {\n diff[key] = value\n any = true\n }\n }\n\n return any ? diff : null\n}\n\n/** 씬이 돌려주는 것 중 우리가 쓰는 부분. */\ninterface SceneHandle {\n dispose?: () => void\n resize?: () => void\n /** 모델 전체가 보이게 화면에 맞춘다. 'ratio' 는 비율을 지키며 맞춘다. */\n fit?: (type?: string) => void\n /**\n * **판**이다 — 루트가 아니다.\n *\n * `create()` 가 돌려주는 `root` 는 `model-layer` 이고, 그 위에 진짜 루트가 하나 더\n * 있다. 부품은 판에 붙고, 선택 알림은 루트가 낸다. 둘을 섞으면 알림이 안 온다 —\n * 실제로 그랬다.\n */\n root?: SceneLayer\n}\n\ninterface SceneLayer {\n invalidate?: () => void\n /** 보기 설정을 넣는 자리. 씬이 스스로 반응한다. */\n set?: (patch: Record<string, unknown>) => void\n /** 3D 카메라를 모델 전체가 보이게 맞춘다. 10.1.4 부터 있다. */\n fitCameraToModel?: (margin?: number) => void\n components?: SceneComponent[]\n selected?: SceneComponent[]\n app?: unknown\n addComponent?: (component: unknown) => void\n removeComponent?: (component: unknown) => void\n on?: (event: string, handler: (...args: unknown[]) => void) => void\n /** 판 위의 루트. 선택 알림이 여기서 난다. */\n root?: {\n selected?: SceneComponent[]\n on?: (event: string, handler: (...args: unknown[]) => void) => void\n }\n}\n\ninterface SceneComponent {\n state: Record<string, unknown>\n set: (props: Record<string, unknown> | string, value?: unknown) => void\n on?: (event: string, handler: (...args: unknown[]) => void) => void\n removeSelf?: (completely?: boolean) => void\n dispose?: () => void\n}\n\n/**\n * 편집 캔버스 — 부품들을 기준 상자 위에 세우고, 여기서 고치게 한다.\n *\n * ## 미리보기가 아니다\n *\n * 한동안 이름이 figure-preview 였다. 원본을 컴파일해 컴포넌트 하나로 세우던 시절에는\n * 정말 보기만 하는 화면이었다. 부품을 컴포넌트로 바꾸면서 편집이 여기서 일어나게 되었다.\n * 부품을 고르고, 2D 로 바꿔 편집하고, 기즈모로 끄는 일이 전부 이 안에서 일어난다.\n * 이름만 남아 있었다.\n *\n * ## 부품이 컴포넌트다\n *\n * 한동안 원본 데이터를 컴파일해 **컴포넌트 하나**로 놓고, 그 안에서 부품을 찾아 다뤘다.\n * 배포용 형태를 편집 화면에 그대로 쓴 것이다. 그래서 어느 부품이 선택됐나 · 무엇을 감쌀까 ·\n * 무엇을 끌까를 전부 따로 뚫어야 했다.\n *\n * 이제 부품 하나가 컴포넌트 하나다. 선택 · 기즈모 · 윤곽선 · 다중 선택 · 되돌리기가\n * 씬의 기본 동작으로 그냥 된다.\n *\n * ## 초안이 곧 기준 상자다\n *\n * 초안의 `width` · `height` · `depth` 가 `FigureSource.base` 다. 부품 좌표를 변환할 때\n * 상자 중심만 빼면 된다 — `figure-source.ts` 가 그 일을 한다.\n *\n * ## 다시 세우지 않는다\n *\n * 부품이 바뀌면 씬을 통째로 다시 세우지 않고 **바뀐 컴포넌트만 고친다.** 다시 세우면\n * 고른 것과 카메라가 날아가서, 숫자 하나 고칠 때마다 화면이 처음으로 돌아간다.\n * 판 크기가 바뀔 때만 다시 세운다 — 판은 씬을 만들 때 정해진다.\n */\n@customElement('figure-canvas')\nexport class FigureCanvas extends localize(i18next)(LitElement) {\n static styles = css`\n /*\n 판 바깥을 우리가 칠한다.\n\n 무대에는 셋이 있다 — 판의 면(2D 는 종이, 3D 는 바닥판), 판 바깥, 좌표 바탕.\n 어느 것도 원본 데이터에 저장되지 않는다. 보려고 만든 것이므로 편집하기 좋게 잡는다.\n\n 2D 에는 바깥을 칠하는 사람이 없다. 씬의 2D 는 캔버스를 투명으로 지우고\n 끝이라(layer.ts 의 clearRect), 뒤에 있는 것이 그대로 비친다. 테마 토큰을\n 깔아 두었더니 어두운 데서 까맣게 나왔다.\n\n 3D 하늘과 같은 값을 쓴다. 갈리면 2D 로 갔을 때 바탕색이 바뀐다.\n */\n :host {\n position: relative;\n display: flex;\n overflow: hidden;\n background-color: ${unsafeCSS(WORKBENCH)};\n }\n\n /*\n 씬이 이 칸을 자기 것으로 삼으면서 인라인 스타일로 position: relative 를 박는다.\n\n 그러면 우리가 CSS 로 준 position: absolute 가 밀리고, 같이 준 inset: 0 도 함께 뜻을\n 잃는다. relative 인 블록은 상위 배치에서 크기를 받는데, 자식(캔버스)이 전부 절대 배치라\n 내용 폭이 0 이다. 그래서 폭 0 짜리 칸이 되고 캔버스도 폭 0 이 된다.\n\n 화면은 그냥 회색으로 남는다. 게다가 마우스 좌표를 NDC 로 바꿀 때 폭으로 나누므로\n 값이 무한대가 되어 기즈모를 집을 수 없다 — \"기즈모가 안 잡힌다\"의 실제 원인이\n 이것이었다.\n\n 그래서 width 와 height 를 직접 준다. 인라인으로 position 이 무엇으로 바뀌든 칸은\n 부모를 채운다.\n */\n div[stage] {\n position: absolute;\n inset: 0;\n width: 100%;\n height: 100%;\n }\n\n /* 세울 수 없는 상태를 빈 화면으로 두지 않는다 — 왜 안 보이는지 말한다 */\n div[cannot] {\n position: absolute;\n inset: 0;\n display: flex;\n align-items: center;\n justify-content: center;\n padding: var(--spacing-large, 12px);\n text-align: center;\n font: var(--label-font, inherit);\n line-height: 1.6;\n color: var(--md-sys-color-on-surface-variant, var(--md-sys-color-on-surface));\n background-color: ${unsafeCSS(WORKBENCH)};\n }\n `\n\n /**\n * 편집 중인 내용. **씬 모델 그대로 받는다.**\n *\n * 한동안 `FigureSource` 로 받아 여기서 변환했다. 그런데 모델러 페이지가 갖고 있는 것이\n * 이미 씬 모델이므로, 그러면 값을 하나 고칠 때마다 왕복 변환이 한 번씩 일어난다.\n * 무손실이긴 하지만 하는 일이 없다 — 초안이 곧 판이고 부품이 곧 컴포넌트다.\n */\n @property({ type: String }) figureId?: string\n @property({ type: Object }) draft?: FigureDraft\n /** 보기 설정. 자산이 아니라 작업대다 — 저장되지 않는다(`figure-view.ts`). */\n @property({ type: Object }) view: ViewSettings = DEFAULT_VIEW\n @property({ type: Array }) parts: PartModel[] = []\n @property({ type: Number }) revision = 0\n /** 지금 고른 부품 이름. 목록에서 고른 것을 캔버스에 알린다. */\n @property({ type: String }) picked?: string\n\n /**\n * 보기 전용 — 씬에서 일어난 일을 밖에 알리지 않는다.\n *\n * AI 후보를 나란히 세울 때 쓴다. 후보는 아직 편집 대상이 아닌데, 씬은 컴포넌트를\n * 만들면서 상태를 정리하고 그때 변경 이벤트를 낸다. 그 이벤트가 그대로 올라가면\n * **후보의 값이 편집 중인 데이터를 덮어쓴다** — 실제로 그랬다. 받지 않기로 한 부품\n * 위치가 오류보고없이 반영되어 있었고, 후보를 버려도 되돌아오지 않았다.\n */\n @property({ type: Boolean }) viewOnly = false\n\n @query('div[stage]') private stage!: HTMLDivElement\n\n /** 세울 수 없는 사유. 없으면 세운 것이다. */\n @state() private cannot = ''\n\n private scene?: SceneHandle\n\n /**\n * 지금 세워진 것을 그림으로 낸다 — 카드에 쓸 썸네일.\n *\n * 부르는 쪽은 이 부품을 **숨은 자리에 480×360 으로 하나 더 세워** 부른다\n * (`figure-thumbnail.ts`). 보이는 저작면을 찍지 않는 이유는, 저작자가 돌려 둔 각도와 확대,\n * 그리고 창 크기에 따라 달라지는 칸 비율이 그대로 카드에 박히기 때문이다 — 나사를 확대해 보던\n * 중에 저장하면 그 자산의 얼굴이 나사가 된다. 목록은 견주는 자리라 프레임이 일정해야 한다.\n *\n * 못 찍으면 `undefined` 다. 빈 그림을 만들어 「그림이 있다」고 말하지 않는다.\n */\n async snapshot(width = 480, height = 360): Promise<string | undefined> {\n /*\n **3D 를 낼 수 있을 때만 찍는다.**\n\n 씬의 `toDataURL` 은 **2D 씬을 렌더한다.** 그것으로 찍어 보니 흰 종이 한 장이 나왔다\n (480×291 · 834바이트 · 순백 — 2D 판의 면인 `fillStyle: PAPER` 이 화면 전체였다). 3D 픽셀은\n `model-layer.renderer3d`(THREE.WebGLRenderer) 쪽에 있고, 그 렌더러는\n `preserveDrawingBuffer: false` 라 **그린 직후 같은 task 에서** 읽어야 한다. 그 절차를 아는\n 것은 씬이므로, things-scene 이 그 일을 공개 API 로 내주면 여기서 부른다.\n\n 아직 없으면 `undefined` 다. 흰 종이를 썸네일이라고 저장하면 카드가 「그림이 있다」고 말하면서\n 아무것도 보여 주지 않고, 저장할 때마다 판 번호만 올라간다 — 없는 것보다 나쁘다.\n */\n const layer = this.scene?.root as\n | (SceneLayer & {\n snapshot3d?: (\n width?: number,\n height?: number,\n type?: string,\n quality?: number\n ) => Promise<string | undefined>\n })\n | undefined\n\n if (!layer?.snapshot3d) {\n return undefined\n }\n\n try {\n /*\n 알파가 필요 없고 카드에 들어갈 그림이라 webp 로 찍는다. png 는 같은 그림이 서너 배 무겁고,\n 그 무게가 도형마다 DB 와 목록 응답에 실린다. webp 를 못 만드는 브라우저는 캔버스가 알아서\n png 를 돌려준다 — 우리가 판정하지 않는다.\n */\n const url = await layer.snapshot3d(width, height, 'image/webp', 0.85)\n return typeof url === 'string' && url.startsWith('data:') ? url : undefined\n } catch (e) {\n /* 원인을 지어내지 않는다. 못 찍은 것이 저장을 막지는 않는다. */\n console.warn(`[thumbnail] 찍지 못했습니다 — ${(e as Error).message}`)\n return undefined\n }\n }\n /** 지금 씬이 서 있는 판. 이것이 달라지면 다시 세운다. */\n private standing?: string\n /** 칸 크기를 따라가게 지켜본다. 안 지켜보면 0x0 으로 고정된다. */\n private watcher?: ResizeObserver\n\n render() {\n return html`\n <div stage></div>\n ${this.cannot ? html`<div cannot>${this.cannot}</div>` : ''}\n `\n }\n\n willUpdate(changed: Map<string, unknown>) {\n if (!this.hasUpdated) return\n\n if (changed.has('revision')) this.standing = undefined\n if (changed.has('draft') || changed.has('parts') || changed.has('figureId') || changed.has('revision')) this.standUp()\n if (changed.has('view')) this.applyView()\n if (changed.has('picked')) this.showPicked()\n }\n\n firstUpdated() {\n this.standUp()\n\n // 씬은 세울 때의 칸 크기를 읽는다. 저작면이 아직 배치되기 전이면 0x0 으로 굳어\n // **캔버스는 붙었는데 아무것도 안 보이는** 상태가 된다 — 실제로 그렇게 났다.\n this.watcher = new ResizeObserver(() => this.scene?.resize?.())\n this.watcher.observe(this)\n }\n\n disconnectedCallback() {\n super.disconnectedCallback()\n this.watcher?.disconnect()\n this.watcher = undefined\n this.teardown()\n }\n\n /**\n * 받은 것을 씬에 반영한다.\n *\n * **판이 그대로면 다시 세우지 않는다.** 다시 세우면 고른 것과 카메라가 날아가서,\n * 숫자 하나 고칠 때마다 화면이 처음으로 돌아간다.\n */\n private standUp() {\n const draft = this.draft\n if (!draft) {\n this.teardown()\n this.cannot = i18next.t('figure.text.canvas-appears-once-a-part-exists')\n return\n }\n\n // 새 Figure의 빈 초안에서는 이전 자산의 씬을 반드시 버린다.\n if (this.parts.length === 0) {\n this.teardown()\n this.cannot = i18next.t('figure.text.canvas-appears-once-a-part-exists')\n return\n }\n\n const signature = `${this.figureId ?? ''}:${draft.width}x${draft.height}x${draft.depth}`\n if (this.scene && this.standing === signature) {\n this.syncParts()\n return\n }\n\n this.teardown()\n\n try {\n this.scene = create({\n target: this.stage,\n model: {\n type: 'model-layer',\n width: draft.width,\n height: draft.height,\n depth: draft.depth,\n threed: true,\n environment: 'studio',\n /*\n 표본을 화면보다 더 쓴다. MSAA 만으로는 실루엣의 계단이 남는다 — 픽셀\n 비율만 올려 보니 눈에 띄게 매끄러워졌다. 저작면은 작은 칸에 자산 하나라\n 그릴 것이 적으니 표본을 더 써도 된다.\n */\n pixelRatio: Math.min(3, (window.devicePixelRatio || 1) * 2),\n /*\n 좌표 바탕을 씬에게 맡긴다. 우리가 만들어 얹었더니 2D 로 갔다 오면\n 사라졌다 — 그때 씬이 통째로 다시 서면서 새 THREE.Scene 을 만들기 때문이다.\n 보드는 이 값을 안 주므로 안 보인다.\n */\n ...this.sceneView(),\n gridStep: gridStep(draft),\n sky: 'color',\n /*\n 판의 면 — 2D 는 밝은 종이, 3D 는 없음.\n\n 종이는 밝아야 한다: 2D 편집 손잡이와 안내선이 어두운 색이다. 바닥판은\n 없어야 한다: 좌표 모눈과 겹쳐 싸우고 원점 아래쪽을 가린다.\n */\n fillStyle: PAPER,\n components: this.parts.map(part => ({ ...part }))\n },\n // **편집 모드**로 만든다. 보드의 3D 모델러가 그 모드에서 카메라 시점 버튼 ·\n // 기즈모 모드 · 도움말 · 단축키를 띄운다.\n mode: 1\n }) as SceneHandle\n\n this.standing = signature\n this.watchScene()\n this.scene.resize?.()\n /*\n 열자마자 모델 전체가 보이게 맞춘다.\n\n 카메라는 2D 뷰포트에서 만들어진다. 그런데 그 뷰포트의 처음 배율은 컨테이너\n 크기에서 오지 모델 크기에서 오지 않는다. 그래서 가로로 긴 모델(컨베이어가\n 그렇다)을 열면 화면 밖으로 나가 벨트 한 조각만 보였다.\n\n **다시 세울 때만 맞춘다.** 창 크기가 바뀔 때마다 맞추면 사용자가 돌려 둔 시점과\n 확대가 매번 되돌아간다.\n */\n this.scene.fit?.('ratio')\n /*\n 3D 카메라는 2D 쪽 fit 으로 안 움직인다. 처음 3D 로 설 때 모델 크기를 보지 않기\n 때문이다. 씬이 내주는 자리로 따로 맞춘다.\n\n `?.` 로 부르는 것은 배포된 판에 아직 없을 수 있어서다. 없으면 2D 만 맞고 3D 는\n 기본 시점으로 선다 — 여기서 카메라 계산을 흉내 내지 않는다.\n */\n this.scene.root?.fitCameraToModel?.()\n this.cannot = ''\n } catch (e) {\n // 원인을 지어내지 않는다 — 던진 말을 그대로 보여 준다.\n this.cannot = (e as Error).message\n }\n }\n\n /**\n * 지금 판 위에 있는 부품 컴포넌트를 이름으로 찾는다.\n *\n * **참조를 들고 있지 않는다.** 전에는 세울 때 한 번 색인해 두고 계속 그 Map 을 썼다.\n * 그런데 씬은 우리 모르게 판을 다시 세울 때가 있다 — 2D 와 3D 를 오갈 때가 그렇다.\n * 그러면 Map 안의 것들은 부모가 없는 죽은 객체가 되고, 그 뒤로는\n *\n * - 목록에서 골라도 선택이 안 된다. 루트의 `selected` 게터가 부모 없는 것을\n * 걸러 내므로 빈 배열이 되고, 테두리도 기즈모도 붙지 않는다\n * - 속성을 고쳐도 3D 가 안 따라온다. 죽은 객체에 값을 넣기 때문이다\n *\n * 둘 다 오류보고없이 일어난다. 실제로 화면에서 「기즈모가 안 잡힌다」로 나타났다.\n *\n * 부품은 많아야 20개다. 매번 순회하는 값이 참조를 갖고 있다가 틀리는 값보다 훨씬 싸다.\n */\n private partsOnBoard(): Map<string, SceneComponent> {\n const found = new Map<string, SceneComponent>()\n for (const component of this.scene?.root?.components ?? []) {\n const name = component.state?.name\n if (typeof name === 'string') found.set(name, component)\n }\n return found\n }\n\n /**\n * 보기 설정을 씬이 아는 이름으로 낸다.\n *\n * 옮겨 적는 표를 두지 않는다 — `ViewSettings` 의 이름이 곧 `model-layer` 의 상태\n * 이름이다. 표를 두면 씬이 새 설정을 받아도 이쪽이 모른다.\n */\n private sceneView(): Record<string, unknown> {\n return sceneLook(this.view ?? DEFAULT_VIEW)\n }\n\n /**\n * 설정이 바뀌면 **씬에 그대로 넣는다.** 다시 세우지 않는다.\n *\n * 씬이 이 값들에 스스로 반응한다(`three-capability` 의 `onchange`) — 조명 · 반사 ·\n * 바닥 · 좌표 바탕이 그 자리에서 바뀐다. 다시 세우면 고른 것과 카메라가 날아가서,\n * 밝기 하나 끄는 동안 화면이 계속 처음으로 돌아간다.\n */\n private applyView(): void {\n const draft = this.scene?.root\n if (!draft) return\n\n draft.set?.(this.sceneView())\n draft.invalidate?.()\n }\n\n /**\n * 부품 목록을 씬에 맞춘다. **다시 세우지 않고 바뀐 것만 고친다.**\n *\n * 다시 세우면 고른 것과 카메라가 날아가서, 숫자 하나 고칠 때마다 화면이 처음으로\n * 돌아간다.\n */\n private syncParts() {\n const root = this.scene?.root\n if (!root) return\n\n const wanted = new Map(this.parts.map(part => [part.name, part]))\n const standing = this.partsOnBoard()\n\n // 없어진 것을 제거한다\n for (const [name, component] of standing) {\n if (!wanted.has(name)) {\n root.removeComponent?.(component)\n component.dispose?.()\n }\n }\n\n for (const part of this.parts) {\n const found = standing.get(part.name)\n if (found) {\n /*\n **달라진 값만 넣는다.**\n\n 같은 값을 다시 넣어도 씬은 변경 이벤트를 낸다. 그 이벤트가 다시 편집 데이터를\n 만들고, 그것이 다시 여기로 돌아오면 끝없이 반복된다. 기즈모를 끄는 중이라면 그\n 되먹임이 끌기와 싸운다.\n */\n const diff = changedKeys(found.state, part as unknown as Record<string, unknown>)\n if (diff) found.set(diff)\n continue\n }\n // 새 부품. 씬의 공장으로 만들어 판에 붙인다.\n const made = Model.compile({ ...part }, root.app as never) as SceneComponent | null\n if (made) root.addComponent?.(made)\n }\n\n root.invalidate?.()\n }\n\n /**\n * 씬에서 일어난 일을 밖에 알린다.\n *\n * **자리가 아니라 이름으로 알린다.** 목록의 몇 번째인지로 알리면, 알림이 오는 사이에\n * 목록이 바뀌면 엉뚱한 부품을 가리킨다.\n */\n private watchScene() {\n const draft = this.scene?.root\n const root = draft?.root\n if (!draft || !root?.on || this.viewOnly) return\n\n root.on('selected', (after: unknown) => {\n const chosen = (after as SceneComponent[] | undefined)?.[0]\n const name = chosen?.state?.name\n if (typeof name === 'string') this.tell('pick-part', { name })\n })\n\n /*\n 기즈모로 끌거나 2D 에서 옮기면 컴포넌트 상태가 바뀐다. 그것을 그대로 올려 보낸다 —\n 씬이 쓰는 용어 그대로다. 저장 형식으로 옮기는 일은 변환 함수가 한다.\n\n **바뀜은 판으로 올라오고, 바뀐 컴포넌트는 끝 인자의 `origin` 에 있다.** 자식이\n `trigger('change', after, before)` 를 하면 씬이 `{ origin, name, deliverer }` 를\n 뒤에 붙여 부모에게 넘긴다. 첫 인자를 컴포넌트로 읽으면 아무 일도 안 일어난다 —\n 실제로 그랬다.\n */\n draft.on?.('change', (...args: unknown[]) => {\n const hint = args[args.length - 1] as { origin?: SceneComponent } | undefined\n const changed = hint?.origin\n const name = changed?.state?.name\n if (typeof name !== 'string') return\n\n const was = this.parts.find(part => part.name === name)\n if (!was) return\n\n // 씬 모델 그대로 올려 보낸다. 모델러 페이지가 갖고 있는 것도 씬 모델이라 변환할 것이 없다.\n this.tell('part-changed', { name, part: { ...was, ...changed!.state } as PartModel })\n })\n }\n\n /** 목록에서 고른 것을 캔버스의 선택에 맞춘다. */\n private showPicked() {\n const draft = this.scene?.root\n const root = draft?.root\n if (!draft || !root) return\n\n const component = this.picked ? this.partsOnBoard().get(this.picked) : undefined\n root.selected = component ? [component] : []\n draft.invalidate?.()\n }\n\n private tell(what: string, detail: object) {\n this.dispatchEvent(new CustomEvent(what, { detail, bubbles: true, composed: true }))\n }\n\n private teardown() {\n this.scene?.dispose?.()\n this.scene = undefined\n this.standing = undefined\n }\n}\n"]}
package/dist-client/modeller/figure-capabilities.d.ts CHANGED
@@ -1,9 +1,9 @@
1
1
  import { LitElement } from 'lit';
2
- import type { BoardModel, PartModel } from './figure-source.js';
2
+ import type { FigureDraft, PartModel } from './figure-source.js';
3
3
  declare const FigureCapabilities_base: (new (...args: any[]) => LitElement) & typeof LitElement;
4
4
  export declare class FigureCapabilities extends FigureCapabilities_base {
5
5
  static styles: import("lit").CSSResult[];
6
- board?: BoardModel;
6
+ draft?: FigureDraft;
7
7
  parts: PartModel[];
8
8
  render(): import("lit-html").TemplateResult<1>;
9
9
  /**