@operato/property-panel 10.0.0-beta.5 → 10.0.0-beta.52
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.
- package/CHANGELOG.md +327 -0
- package/dist/src/ox-property-panel.d.ts +7 -0
- package/dist/src/ox-property-panel.js +62 -34
- package/dist/src/ox-property-panel.js.map +1 -1
- package/dist/src/property-panel/abstract-property.js +11 -2
- package/dist/src/property-panel/abstract-property.js.map +1 -1
- package/dist/src/property-panel/data-binding/data-binding-mapper.js +11 -3
- package/dist/src/property-panel/data-binding/data-binding-mapper.js.map +1 -1
- package/dist/src/property-panel/data-binding/data-binding-popup.d.ts +63 -0
- package/dist/src/property-panel/data-binding/data-binding-popup.js +1414 -0
- package/dist/src/property-panel/data-binding/data-binding-popup.js.map +1 -0
- package/dist/src/property-panel/data-binding/data-binding.d.ts +1 -0
- package/dist/src/property-panel/data-binding/data-binding.js +33 -2
- package/dist/src/property-panel/data-binding/data-binding.js.map +1 -1
- package/dist/src/property-panel/effects/property-event-tap.js +21 -1
- package/dist/src/property-panel/effects/property-event-tap.js.map +1 -1
- package/dist/src/property-panel/effects/property-shadow.js +14 -5
- package/dist/src/property-panel/effects/property-shadow.js.map +1 -1
- package/dist/src/property-panel/shapes/ox-placeholder-convert-editor.d.ts +20 -0
- package/dist/src/property-panel/shapes/ox-placeholder-convert-editor.js +125 -0
- package/dist/src/property-panel/shapes/ox-placeholder-convert-editor.js.map +1 -0
- package/dist/src/property-panel/shapes/placeholder-convert.d.ts +34 -0
- package/dist/src/property-panel/shapes/placeholder-convert.js +117 -0
- package/dist/src/property-panel/shapes/placeholder-convert.js.map +1 -0
- package/dist/src/property-panel/shapes/shapes.js +28 -10
- package/dist/src/property-panel/shapes/shapes.js.map +1 -1
- package/dist/src/property-panel/specifics/specifics.d.ts +1 -0
- package/dist/src/property-panel/specifics/specifics.js +2 -1
- package/dist/src/property-panel/specifics/specifics.js.map +1 -1
- package/dist/src/property-panel/styles/styles.js +2 -0
- package/dist/src/property-panel/styles/styles.js.map +1 -1
- package/dist/src/property-panel/threed/property-material3d.js +8 -1
- package/dist/src/property-panel/threed/property-material3d.js.map +1 -1
- package/dist/src/property-panel/threed/property-scene3d.d.ts +34 -7
- package/dist/src/property-panel/threed/property-scene3d.js +329 -246
- package/dist/src/property-panel/threed/property-scene3d.js.map +1 -1
- package/dist/src/property-panel/threed/threed.js +8 -0
- package/dist/src/property-panel/threed/threed.js.map +1 -1
- package/dist/tsconfig.tsbuildinfo +1 -1
- package/package.json +6 -5
- package/themes/grist-theme.css +1 -1
- package/translations/en.json +27 -1
- package/translations/ja.json +27 -1
- package/translations/ko.json +27 -1
- package/translations/ms.json +27 -1
- package/translations/zh.json +27 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"property-scene3d.js","sourceRoot":"","sources":["../../../../src/property-panel/threed/property-scene3d.ts"],"names":[],"mappings":"AAAA;;GAEG;;AAEH,OAAO,kCAAkC,CAAA;AAEzC,OAAO,0BAA0B,CAAA;AAEjC,OAAO,EAAE,GAAG,EAAE,IAAI,EAAE,MAAM,KAAK,CAAA;AAC/B,OAAO,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAA;AAG5C,OAAO,EAAE,kBAAkB,EAAE,MAAM,yCAAyC,CAAA;AAE5E,OAAO,EAAE,gBAAgB,EAAE,MAAM,yBAAyB,CAAA;AAE1D,MAAM,gBAAgB,GAA4C;IAChE,OAAO,EAAE;QACP,aAAa,EAAE,GAAG;QAClB,eAAe,EAAE,IAAI;QACrB,aAAa,EAAE,SAAS;QACxB,iBAAiB,EAAE,GAAG;KACvB;IACD,MAAM,EAAE;QACN,aAAa,EAAE,GAAG;QAClB,eAAe,EAAE,IAAI;QACrB,aAAa,EAAE,SAAS;QACxB,iBAAiB,EAAE,GAAG;KACvB;IACD,MAAM,EAAE;QACN,aAAa,EAAE,GAAG;QAClB,eAAe,EAAE,IAAI;QACrB,aAAa,EAAE,SAAS;QACxB,iBAAiB,EAAE,GAAG;KACvB;IACD,IAAI,EAAE;QACJ,aAAa,EAAE,GAAG;QAClB,eAAe,EAAE,IAAI;QACrB,aAAa,EAAE,SAAS;QACxB,iBAAiB,EAAE,GAAG;KACvB;IACD,IAAI,EAAE;QACJ,aAAa,EAAE,GAAG;QAClB,eAAe,EAAE,IAAI;QACrB,aAAa,EAAE,SAAS;QACxB,iBAAiB,EAAE,GAAG;KACvB;IACD,IAAI,EAAE;QACJ,aAAa,EAAE,GAAG;QAClB,eAAe,EAAE,KAAK;QACtB,aAAa,EAAE,SAAS;QACxB,iBAAiB,EAAE,CAAC;KACrB;CACF,CAAA;AAED;;;GAGG;AACH,MAAM,OAAO,eAAgB,SAAQ,gBAAgB;IAArD;;QA8G8B,UAAK,GAAiB,IAAI,CAAA;IA0UxD,CAAC;IAxUC,MAAM;QACJ,MAAM,KAAK,GAAG,IAAI,CAAC,KAAK,IAAI,EAAE,CAAA;QAE9B,OAAO,IAAI,CAAA;QACP,IAAI,CAAC,WAAW,CAAC,KAAK,CAAC,IAAI,IAAI,CAAC,aAAa,CAAC,KAAK,CAAC,IAAI,IAAI,CAAC,eAAe,CAAC,KAAK,CAAC;QACnF,IAAI,CAAC,UAAU,CAAC,KAAK,CAAC;QACtB,IAAI,CAAC,sBAAsB,CAAC,KAAK,CAAC,IAAI,IAAI,CAAC,eAAe,CAAC,KAAK,CAAC,IAAI,IAAI,CAAC,sBAAsB,EAAE;QAClG,IAAI,CAAC,YAAY,CAAC,KAAK,CAAC;KAC3B,CAAA;IACH,CAAC;IAEO,WAAW,CAAC,KAAiB;QACnC,OAAO,IAAI,CAAA;;;;8EAI+D,CAAC,CAAC,KAAK,CAAC,MAAM;;;;;cAK9E;YACA,EAAE,KAAK,EAAE,EAAE,EAAE,KAAK,EAAE,MAAM,EAAE;YAC5B,EAAE,KAAK,EAAE,OAAO,EAAE,KAAK,EAAE,OAAO,EAAE;YAClC,EAAE,KAAK,EAAE,MAAM,EAAE,KAAK,EAAE,gBAAgB,EAAE;SAC3C,CAAC,GAAG,CACH,CAAC,CAAC,EAAE,CACF,IAAI,CAAA,iBAAiB,CAAC,CAAC,KAAK,cAAc,CAAC,KAAK,CAAC,cAAc,IAAI,EAAE,CAAC,KAAK,CAAC,CAAC,KAAK;oBAC9E,CAAC,CAAC,KAAK;0BACD,CACb;;;;KAIR,CAAA;IACH,CAAC;IAEO,aAAa,CAAC,KAAiB;;QACrC,OAAO,IAAI,CAAA;;;;;;cAMD,CAAC,aAAa,EAAE,KAAK,EAAE,OAAO,EAAE,MAAM,EAAE,OAAO,EAAE,MAAM,CAAC,CAAC,GAAG,CAC5D,CAAC,CAAC,EAAE,CACF,IAAI,CAAA,iBAAiB,CAAC,cAAc,CAAC,KAAK,CAAC,iBAAiB,IAAI,aAAa,CAAC,KAAK,CAAC;oBAChF,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,WAAW,EAAE,GAAG,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC;0BAChC,CACb;;;;;;;;;;qBAUQ,MAAM,CAAC,MAAA,KAAK,CAAC,GAAG,mCAAI,EAAE,CAAC;;;;;;;;qBAQvB,MAAM,CAAC,MAAA,KAAK,CAAC,IAAI,mCAAI,GAAG,CAAC;;;;;;;;;;qBAUzB,MAAM,CAAC,MAAA,KAAK,CAAC,IAAI,mCAAI,GAAG,CAAC;;;4EAG8B,MAAM,CAAC,MAAA,KAAK,CAAC,GAAG,mCAAI,KAAK,CAAC;;;;QAI9F,IAAI,CAAC,gBAAgB,CAAC,KAAK,CAAC;KAC/B,CAAA;IACH,CAAC;IAEO,gBAAgB,CAAC,KAAiB;QACxC,MAAM,SAAS,GAAmB,KAAK,CAAC,eAAe,IAAI,EAAE,CAAA;QAE7D,OAAO,IAAI,CAAA;;;;;UAKL,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE;YACpC,MAAM,MAAM,GAAG,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,CAAA;YAC7B,OAAO,IAAI,CAAA;;qCAEgB,MAAM,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,EAAE;sBACrC,MAAM,CAAC,CAAC,CAAC,yDAAyD,CAAC,CAAC,CAAC,iCAAiC;uBACrG,CAAC,CAAa,EAAE,EAAE,GAAG,IAAI,MAAM,EAAE,CAAC;gBAAC,IAAI,CAAC,eAAe,CAAC,UAAU,EAAE,CAAC,CAAC,CAAC;gBAAC,MAAM,CAAC,GAAG,CAAC,CAAC,aAA4B,CAAC;gBAAC,CAAC,CAAC,SAAS,CAAC,GAAG,CAAC,OAAO,CAAC,CAAC;gBAAC,UAAU,CAAC,GAAG,EAAE,CAAC,CAAC,CAAC,SAAS,CAAC,MAAM,CAAC,OAAO,CAAC,EAAE,GAAG,CAAC,CAAA;YAAC,CAAC,CAAC,CAAC;6BAC5L,CAAC,CAAQ,EAAE,EAAE,GAAG,CAAC,CAAC,cAAc,EAAE,CAAC,CAAC,IAAI,MAAM;gBAAE,IAAI,CAAC,eAAe,CAAC,OAAO,EAAE,CAAC,CAAC,CAAA,CAAC,CAAC;2BACpF,CAAC,CAAa,EAAE,EAAE,CAAC,IAAI,CAAC,oBAAoB,CAAC,CAAC,EAAE,CAAC,CAAC;yBACpD,GAAG,EAAE,CAAC,IAAI,CAAC,kBAAkB,EAAE;4BAC5B,GAAG,EAAE,CAAC,IAAI,CAAC,kBAAkB,EAAE;eAC5C,CAAC;WACL,CAAA;QACH,CAAC,CAAC;;;;KAIL,CAAA;IACH,CAAC;IAKO,oBAAoB,CAAC,CAAa,EAAE,KAAa;QACvD,IAAI,CAAC,CAAC,MAAM,KAAK,CAAC;YAAE,OAAM;QAC1B,MAAM,MAAM,GAAG,CAAC,CAAC,aAA4B,CAAA;QAC7C,IAAI,CAAC,YAAY,GAAG,MAAM,CAAA;QAE1B,wBAAwB;QACxB,MAAM,CAAC,SAAS,CAAC,GAAG,CAAC,QAAQ,CAAC,CAAA;QAE9B,IAAI,CAAC,eAAe,GAAG,UAAU,CAAC,GAAG,EAAE;YACrC,IAAI,CAAC,eAAe,GAAG,SAAS,CAAA;YAChC,MAAM,CAAC,SAAS,CAAC,MAAM,CAAC,QAAQ,CAAC,CAAA;YACjC,IAAI,CAAC,eAAe,CAAC,MAAM,EAAE,KAAK,CAAC,CAAA;YAEnC,YAAY;YACZ,MAAM,CAAC,SAAS,CAAC,GAAG,CAAC,OAAO,CAAC,CAAA;YAC7B,UAAU,CAAC,GAAG,EAAE,CAAC,MAAM,CAAC,SAAS,CAAC,MAAM,CAAC,OAAO,CAAC,EAAE,GAAG,CAAC,CAAA;QACzD,CAAC,EAAE,GAAG,CAAC,CAAA;IACT,CAAC;IAEO,kBAAkB;QACxB,IAAI,IAAI,CAAC,eAAe,EAAE,CAAC;YACzB,YAAY,CAAC,IAAI,CAAC,eAAe,CAAC,CAAA;YAClC,IAAI,CAAC,eAAe,GAAG,SAAS,CAAA;QAClC,CAAC;QACD,IAAI,IAAI,CAAC,YAAY,EAAE,CAAC;YACtB,IAAI,CAAC,YAAY,CAAC,SAAS,CAAC,MAAM,CAAC,QAAQ,CAAC,CAAA;YAC5C,IAAI,CAAC,YAAY,GAAG,SAAS,CAAA;QAC/B,CAAC;IACH,CAAC;IAEO,eAAe,CAAC,MAAqC,EAAE,KAAa;;QAC1E,MAAM,IAAI,GAAG,MAAA,IAAI,CAAC,KAAK,0CAAE,IAAW,CAAA;QACpC,MAAM,GAAG,GAAG,IAAI,aAAJ,IAAI,uBAAJ,IAAI,CAAE,gBAAgB,CAAA;QAClC,IAAI,CAAC,GAAG;YAAE,OAAM;QAEhB,IAAI,MAAM,KAAK,MAAM,EAAE,CAAC;YACtB,GAAG,CAAC,gBAAgB,CAAC,KAAK,CAAC,CAAA;QAC7B,CAAC;aAAM,IAAI,MAAM,KAAK,UAAU,EAAE,CAAC;YACjC,GAAG,CAAC,aAAa,CAAC,KAAK,CAAC,CAAA;QAC1B,CAAC;aAAM,IAAI,MAAM,KAAK,OAAO,EAAE,CAAC;YAC9B,GAAG,CAAC,eAAe,CAAC,SAAS,CAAC,KAAK,CAAC,CAAA;YACpC,IAAI,CAAC,GAAG,CAAC,iBAAiB,EAAE,GAAG,CAAC,eAAe,CAAC,WAAW,EAAE,CAAC,CAAA;QAChE,CAAC;QAED,IAAI,CAAC,aAAa,EAAE,CAAA;IACtB,CAAC;IAEO,eAAe,CAAC,KAAiB;QACvC,OAAO,IAAI,CAAA;;;;oFAIqE,KAAK,CAAC,SAAS,KAAK,KAAK;;;;;cAK/F;YACA,EAAE,KAAK,EAAE,OAAO,EAAE,KAAK,EAAE,MAAM,EAAE;YACjC,EAAE,KAAK,EAAE,SAAS,EAAE,KAAK,EAAE,QAAQ,EAAE;YACrC,EAAE,KAAK,EAAE,MAAM,EAAE,KAAK,EAAE,KAAK,EAAE;SAChC,CAAC,GAAG,CACH,CAAC,CAAC,EAAE,CACF,IAAI,CAAA,iBAAiB,CAAC,CAAC,KAAK,cAAc,CAAC,KAAK,CAAC,SAAS,IAAI,OAAO,CAAC,KAAK,CAAC,CAAC,KAAK;oBAC9E,CAAC,CAAC,KAAK;0BACD,CACb;;;;KAIR,CAAA;IACH,CAAC;IAEO,UAAU,CAAC,KAAiB;QAClC,MAAM,UAAU,GAAG;YACjB,EAAE,KAAK,EAAE,EAAE,EAAE,KAAK,EAAE,MAAM,EAAE;YAC5B,EAAE,KAAK,EAAE,OAAO,EAAE,KAAK,EAAE,OAAO,EAAE;YAClC,EAAE,KAAK,EAAE,QAAQ,EAAE,KAAK,EAAE,QAAQ,EAAE;YACpC,EAAE,KAAK,EAAE,WAAW,EAAE,KAAK,EAAE,WAAW,EAAE;YAC1C,EAAE,KAAK,EAAE,SAAS,EAAE,KAAK,EAAE,SAAS,EAAE;YACtC,EAAE,KAAK,EAAE,QAAQ,EAAE,KAAK,EAAE,QAAQ,EAAE;YACpC,EAAE,KAAK,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,EAAE;SACjC,CAAA;QAED,OAAO,IAAI,CAAA;;;;;;cAMD,UAAU,CAAC,GAAG,CACd,CAAC,CAAC,EAAE,CAAC,IAAI,CAAA,iBAAiB,CAAC,CAAC,KAAK,cAAc,CAAC,KAAK,CAAC,GAAG,IAAI,EAAE,CAAC,KAAK,CAAC,CAAC,KAAK,IAAI,CAAC,CAAC,KAAK,WAAW,CACnG;;;YAGD,KAAK,CAAC,GAAG,KAAK,OAAO;YACrB,CAAC,CAAC,IAAI,CAAA;;8DAE4C,KAAK,CAAC,QAAQ,IAAI,SAAS;eAC1E;YACH,CAAC,CAAC,EAAE;;;KAGX,CAAA;IACH,CAAC;IAEO,sBAAsB,CAAC,KAAiB;;QAC9C,OAAO,IAAI,CAAA;;;;;;;;;;;;uBAYQ,MAAM,CAAC,MAAA,KAAK,CAAC,aAAa,mCAAI,GAAG,CAAC;;oBAErC,CAAC,MAAA,KAAK,CAAC,aAAa,mCAAI,GAAG,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC;;;;KAItD,CAAA;IACH,CAAC;IAEO,eAAe,CAAC,KAAiB;;QACvC,OAAO,IAAI,CAAA;;;;;;;;uBAQQ,KAAK,CAAC,eAAe,KAAK,KAAK;;;;;6DAKO,KAAK,CAAC,aAAa,IAAI,SAAS;;;;;;;;;;uBAUtE,MAAM,CAAC,MAAA,KAAK,CAAC,iBAAiB,mCAAI,GAAG,CAAC;;oBAEzC,CAAC,MAAA,KAAK,CAAC,iBAAiB,mCAAI,GAAG,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC;;;;KAI1D,CAAA;IACH,CAAC;IAEO,sBAAsB;QAC5B,OAAO,IAAI,CAAA;;;;;cAKD,MAAM,CAAC,OAAO,CAAC,gBAAgB,CAAC,CAAC,GAAG,CACpC,CAAC,CAAC,IAAI,EAAE,MAAM,CAAC,EAAE,EAAE,CACjB,IAAI,CAAA,kBAAkB,GAAG,EAAE,CAAC,IAAI,CAAC,oBAAoB,CAAC,MAAM,CAAC,IAAI,IAAI,WAAW,CACnF;;;;KAIR,CAAA;IACH,CAAC;IAEO,YAAY,CAAC,KAAiB;QACpC,OAAO,IAAI,CAAA;;;iBAGE,KAAK,CAAC,eAAe,IAAI,EAAE,aAAa,EAAE,IAAI,EAAE;2BACtC,IAAI,CAAC,sBAAsB;;;KAGjD,CAAA;IACH,CAAC;IAEO,oBAAoB,CAAC,MAA+B;QAC1D,IAAI,CAAC,aAAa,CAChB,IAAI,WAAW,CAAC,iBAAiB,EAAE;YACjC,OAAO,EAAE,IAAI;YACb,QAAQ,EAAE,IAAI;YACd,MAAM,EAAE,MAAM;SACf,CAAC,CACH,CAAA;IACH,CAAC;IAEO,sBAAsB,CAAC,CAAc;QAC3C,CAAC,CAAC,eAAe,EAAE,CAAA;QACnB,IAAI,CAAC,aAAa,CAChB,IAAI,WAAW,CAAC,iBAAiB,EAAE;YACjC,OAAO,EAAE,IAAI;YACb,QAAQ,EAAE,IAAI;YACd,MAAM,EAAE,EAAE,eAAe,EAAE,CAAC,CAAC,MAAM,CAAC,UAAU,EAAE;SACjD,CAAC,CACH,CAAA;IACH,CAAC;;AArbM,sBAAM,GAAG;IACd,kBAAkB;IAClB,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;KAuGF;CACF,AA1GY,CA0GZ;AAE2B;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;8CAAmB;AAClB;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;8CAA2B","sourcesContent":["/**\n * @license Copyright © HatioLab Inc. All rights reserved.\n */\n\nimport '@operato/input/ox-input-color.js'\n\nimport './property-material3d.js'\n\nimport { css, html } from 'lit'\nimport { property } from 'lit/decorators.js'\n\nimport { Properties, Scene } from '@hatiolab/things-scene'\nimport { PropertyGridStyles } from '@operato/styles/property-grid-styles.js'\n\nimport { AbstractProperty } from '../abstract-property.js'\n\nconst LIGHTING_PRESETS: Record<string, Record<string, unknown>> = {\n Neutral: {\n hemiIntensity: 0.6,\n dirLightEnabled: true,\n dirLightColor: '#ffffff',\n dirLightIntensity: 0.5\n },\n Studio: {\n hemiIntensity: 0.5,\n dirLightEnabled: true,\n dirLightColor: '#ffffff',\n dirLightIntensity: 0.6\n },\n Bright: {\n hemiIntensity: 0.8,\n dirLightEnabled: true,\n dirLightColor: '#ffffff',\n dirLightIntensity: 0.7\n },\n Warm: {\n hemiIntensity: 0.5,\n dirLightEnabled: true,\n dirLightColor: '#ffcc88',\n dirLightIntensity: 0.4\n },\n Cool: {\n hemiIntensity: 0.5,\n dirLightEnabled: true,\n dirLightColor: '#cce0ff',\n dirLightIntensity: 0.4\n },\n Flat: {\n hemiIntensity: 0.8,\n dirLightEnabled: false,\n dirLightColor: '#ffffff',\n dirLightIntensity: 0\n }\n}\n\n/**\n * Scene-level 3D settings for model-layer.\n * Includes 3D mode, camera, renderer, lighting, presets, and floor configuration.\n */\nexport class PropertyScene3D extends AbstractProperty {\n static styles = [\n PropertyGridStyles,\n css`\n .preset-buttons {\n grid-column: 1 / -1;\n display: flex;\n flex-wrap: wrap;\n gap: 4px;\n padding: 2px 0;\n }\n\n .preset-buttons button {\n flex: 1;\n min-width: 60px;\n padding: 4px 6px;\n border: 1px solid var(--md-sys-color-outline, #ccc);\n border-radius: 4px;\n background: var(--md-sys-color-surface, #fff);\n color: var(--md-sys-color-on-surface, #333);\n font-size: 11px;\n cursor: pointer;\n }\n\n .preset-buttons button:hover {\n background: var(--md-sys-color-primary-container, #e0e0e0);\n }\n\n .range-with-value {\n grid-column: 9 / -1;\n display: flex;\n align-items: center;\n gap: 4px;\n }\n\n .range-with-value input[type='range'] {\n flex: 1;\n border: none;\n background: transparent;\n padding: 0;\n }\n\n .range-with-value span {\n min-width: 2.5em;\n text-align: right;\n font-size: 11px;\n color: var(--md-sys-color-on-secondary-container);\n }\n\n .bookmark-slots {\n grid-column: 1 / -1;\n display: grid;\n grid-template-columns: repeat(9, 1fr);\n gap: 2px;\n padding: 4px 0 0;\n }\n\n .bookmark-slot {\n display: flex;\n align-items: center;\n justify-content: center;\n height: 24px;\n border-radius: 3px;\n font-size: 11px;\n font-weight: 600;\n cursor: pointer;\n color: var(--md-sys-color-outline, #999);\n background: var(--md-sys-color-surface-variant, #f0f0f0);\n border: 1px solid transparent;\n user-select: none;\n transition: all 0.12s ease;\n }\n\n .bookmark-slot:hover {\n background: var(--md-sys-color-secondary-container, #e0e0e0);\n }\n\n .bookmark-slot.filled {\n color: var(--md-sys-color-primary, #6750A4);\n background: var(--md-sys-color-primary-container, #EADDFF);\n border-color: var(--md-sys-color-primary, #6750A4);\n font-weight: 700;\n }\n\n .bookmark-slot:active {\n transform: scale(0.9);\n }\n\n .bookmark-slot.saving {\n animation: bookmark-fill 0.6s linear forwards;\n }\n\n @keyframes bookmark-fill {\n from { box-shadow: inset 24px 0 0 0 transparent; }\n to { box-shadow: inset 24px 0 0 0 var(--md-sys-color-primary-container, #EADDFF); }\n }\n\n .bookmark-slot.saved {\n animation: bookmark-saved 0.3s ease;\n }\n\n @keyframes bookmark-saved {\n 0% { transform: scale(1); }\n 50% { transform: scale(1.2); }\n 100% { transform: scale(1); }\n }\n `\n ]\n\n @property({ type: Object }) value?: Properties\n @property({ type: Object }) scene: Scene | null = null\n\n render() {\n const value = this.value || {}\n\n return html`\n ${this._renderMode(value)} ${this._renderCamera(value)} ${this._renderRenderer(value)}\n ${this._renderSky(value)}\n ${this._renderHemisphereLight(value)} ${this._renderKeyLight(value)} ${this._renderLightingPresets()}\n ${this._renderFloor(value)}\n `\n }\n\n private _renderMode(value: Properties) {\n return html`\n <fieldset>\n <legend>3D Mode</legend>\n <div class=\"property-grid\">\n <input id=\"cb-threed\" type=\"checkbox\" value-key=\"threed\" .checked=${!!value.threed} />\n <label for=\"cb-threed\">Enable 3D</label>\n\n <label>Viewer Auto</label>\n <select value-key=\"cameraAutoPlay\">\n ${[\n { value: '', label: 'None' },\n { value: 'orbit', label: 'Orbit' },\n { value: 'play', label: 'Play Bookmarks' }\n ].map(\n o =>\n html`<option value=${o.value} ?selected=${(value.cameraAutoPlay || '') === o.value}>\n ${o.label}\n </option>`\n )}\n </select>\n </div>\n </fieldset>\n `\n }\n\n private _renderCamera(value: Properties) {\n return html`\n <fieldset>\n <legend>Camera</legend>\n <div class=\"property-grid\">\n <label>View</label>\n <select value-key=\"initialCameraView\">\n ${['perspective', 'top', 'front', 'back', 'right', 'left'].map(\n v =>\n html`<option value=${v} ?selected=${(value.initialCameraView || 'perspective') === v}>\n ${v.charAt(0).toUpperCase() + v.slice(1)}\n </option>`\n )}\n </select>\n\n <label class=\"half-label\">FOV</label>\n <input\n class=\"half-editor\"\n type=\"number\"\n value-key=\"fov\"\n min=\"10\"\n max=\"120\"\n .value=${String(value.fov ?? 45)}\n />\n <label class=\"half-label\">Zoom</label>\n <input\n class=\"half-editor\"\n type=\"number\"\n value-key=\"zoom\"\n min=\"100\"\n .value=${String(value.zoom ?? 100)}\n />\n\n <label class=\"half-label\">Near</label>\n <input\n class=\"half-editor\"\n type=\"number\"\n value-key=\"near\"\n min=\"0.01\"\n step=\"0.01\"\n .value=${String(value.near ?? 0.1)}\n />\n <label class=\"half-label\">Far</label>\n <input class=\"half-editor\" type=\"number\" value-key=\"far\" .value=${String(value.far ?? 20000)} />\n </div>\n </fieldset>\n\n ${this._renderBookmarks(value)}\n `\n }\n\n private _renderBookmarks(value: Properties) {\n const bookmarks: (any | null)[] = value.cameraBookmarks || []\n\n return html`\n <fieldset>\n <legend>Bookmarks</legend>\n <div class=\"property-grid\">\n <div class=\"bookmark-slots\">\n ${[1, 2, 3, 4, 5, 6, 7, 8, 9].map(i => {\n const filled = !!bookmarks[i]\n return html`\n <div\n class=\"bookmark-slot ${filled ? 'filled' : ''}\"\n title=${filled ? 'Click: Go / Long-click: Overwrite / Right-click: Delete' : 'Long-click: Save current camera'}\n @click=${(e: MouseEvent) => { if (filled) { this._bookmarkAction('navigate', i); const t = e.currentTarget as HTMLElement; t.classList.add('saved'); setTimeout(() => t.classList.remove('saved'), 300) } }}\n @contextmenu=${(e: Event) => { e.preventDefault(); if (filled) this._bookmarkAction('clear', i) }}\n @mousedown=${(e: MouseEvent) => this._onBookmarkMouseDown(e, i)}\n @mouseup=${() => this._onBookmarkMouseUp()}\n @mouseleave=${() => this._onBookmarkMouseUp()}\n >${i}</div>\n `\n })}\n </div>\n </div>\n </fieldset>\n `\n }\n\n private _longPressTimer?: ReturnType<typeof setTimeout>\n private _pressTarget?: HTMLElement\n\n private _onBookmarkMouseDown(e: MouseEvent, index: number) {\n if (e.button !== 0) return\n const target = e.currentTarget as HTMLElement\n this._pressTarget = target\n\n // 롱클릭 시작: filling 애니메이션\n target.classList.add('saving')\n\n this._longPressTimer = setTimeout(() => {\n this._longPressTimer = undefined\n target.classList.remove('saving')\n this._bookmarkAction('save', index)\n\n // 저장 완료 피드백\n target.classList.add('saved')\n setTimeout(() => target.classList.remove('saved'), 300)\n }, 600)\n }\n\n private _onBookmarkMouseUp() {\n if (this._longPressTimer) {\n clearTimeout(this._longPressTimer)\n this._longPressTimer = undefined\n }\n if (this._pressTarget) {\n this._pressTarget.classList.remove('saving')\n this._pressTarget = undefined\n }\n }\n\n private _bookmarkAction(action: 'save' | 'navigate' | 'clear', index: number) {\n const root = this.scene?.root as any\n const cap = root?._threeCapability\n if (!cap) return\n\n if (action === 'save') {\n cap.saveCameraToSlot(index)\n } else if (action === 'navigate') {\n cap.animateToSlot(index)\n } else if (action === 'clear') {\n cap.bookmarkManager.clearSlot(index)\n root.set('cameraBookmarks', cap.bookmarkManager.exportSlots())\n }\n\n this.requestUpdate()\n }\n\n private _renderRenderer(value: Properties) {\n return html`\n <fieldset>\n <legend>Renderer</legend>\n <div class=\"property-grid\">\n <input id=\"cb-antialias\" type=\"checkbox\" value-key=\"antialias\" .checked=${value.antialias !== false} />\n <label for=\"cb-antialias\">Anti-alias</label>\n\n <label>Precision</label>\n <select value-key=\"precision\">\n ${[\n { value: 'highp', label: 'High' },\n { value: 'mediump', label: 'Medium' },\n { value: 'lowp', label: 'Low' }\n ].map(\n o =>\n html`<option value=${o.value} ?selected=${(value.precision || 'highp') === o.value}>\n ${o.label}\n </option>`\n )}\n </select>\n </div>\n </fieldset>\n `\n }\n\n private _renderSky(value: Properties) {\n const skyOptions = [\n { value: '', label: 'None' },\n { value: 'color', label: 'Color' },\n { value: 'studio', label: 'Studio' },\n { value: 'warehouse', label: 'Warehouse' },\n { value: 'factory', label: 'Factory' },\n { value: 'office', label: 'Office' },\n { value: 'home', label: 'Home' },\n ]\n\n return html`\n <fieldset>\n <legend>Sky</legend>\n <div class=\"property-grid\">\n <label>Preset</label>\n <select value-key=\"sky\">\n ${skyOptions.map(\n o => html`<option value=${o.value} ?selected=${(value.sky || '') === o.value}>${o.label}</option>`\n )}\n </select>\n\n ${value.sky === 'color'\n ? html`\n <label>Color</label>\n <ox-input-color value-key=\"skyColor\" .value=${value.skyColor || '#87ceeb'}> </ox-input-color>\n `\n : ''}\n </div>\n </fieldset>\n `\n }\n\n private _renderHemisphereLight(value: Properties) {\n return html`\n <fieldset>\n <legend>Hemisphere Light</legend>\n <div class=\"property-grid\">\n <label>Intensity</label>\n <div class=\"range-with-value\">\n <input\n type=\"range\"\n min=\"0\"\n max=\"3\"\n step=\"0.1\"\n value-key=\"hemiIntensity\"\n .value=${String(value.hemiIntensity ?? 0.6)}\n />\n <span>${(value.hemiIntensity ?? 0.6).toFixed(1)}</span>\n </div>\n </div>\n </fieldset>\n `\n }\n\n private _renderKeyLight(value: Properties) {\n return html`\n <fieldset>\n <legend>Key Light</legend>\n <div class=\"property-grid\">\n <input\n id=\"cb-dirlight\"\n type=\"checkbox\"\n value-key=\"dirLightEnabled\"\n .checked=${value.dirLightEnabled !== false}\n />\n <label for=\"cb-dirlight\">Enabled</label>\n\n <label>Color</label>\n <ox-input-color value-key=\"dirLightColor\" .value=${value.dirLightColor || '#ffffff'}> </ox-input-color>\n\n <label>Intensity</label>\n <div class=\"range-with-value\">\n <input\n type=\"range\"\n min=\"0\"\n max=\"3\"\n step=\"0.1\"\n value-key=\"dirLightIntensity\"\n .value=${String(value.dirLightIntensity ?? 0.5)}\n />\n <span>${(value.dirLightIntensity ?? 0.5).toFixed(1)}</span>\n </div>\n </div>\n </fieldset>\n `\n }\n\n private _renderLightingPresets() {\n return html`\n <fieldset>\n <legend>Lighting Presets</legend>\n <div class=\"property-grid\">\n <div class=\"preset-buttons\">\n ${Object.entries(LIGHTING_PRESETS).map(\n ([name, values]) =>\n html`<button @click=${() => this._applyLightingPreset(values)}>${name}</button>`\n )}\n </div>\n </div>\n </fieldset>\n `\n }\n\n private _renderFloor(value: Properties) {\n return html`\n <property-material3d\n legend=\"Floor Material\"\n .value=${value.floorMaterial3d || { receiveShadow: true }}\n @property-change=${this._onFloorMaterialChange}\n >\n </property-material3d>\n `\n }\n\n private _applyLightingPreset(values: Record<string, unknown>) {\n this.dispatchEvent(\n new CustomEvent('property-change', {\n bubbles: true,\n composed: true,\n detail: values\n })\n )\n }\n\n private _onFloorMaterialChange(e: CustomEvent) {\n e.stopPropagation()\n this.dispatchEvent(\n new CustomEvent('property-change', {\n bubbles: true,\n composed: true,\n detail: { floorMaterial3d: e.detail.material3d }\n })\n )\n }\n\n}\n"]}
|
|
1
|
+
{"version":3,"file":"property-scene3d.js","sourceRoot":"","sources":["../../../../src/property-panel/threed/property-scene3d.ts"],"names":[],"mappings":"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","sourcesContent":["/**\n * @license Copyright © HatioLab Inc. All rights reserved.\n */\n\nimport '@operato/input/ox-input-color.js'\nimport '@operato/i18n/ox-i18n.js'\n\nimport './property-material3d.js'\n\nimport { css, html } from 'lit'\nimport { property } from 'lit/decorators.js'\n\nimport { Properties, Scene } from '@hatiolab/things-scene'\nimport { PropertyGridStyles } from '@operato/styles/property-grid-styles.js'\n\nimport { AbstractProperty } from '../abstract-property.js'\n\n/**\n * Environment별 기본 조명 프로파일.\n * Environment 드롭다운에서 선택 시 sky 값과 함께 이 조명 필드들이 자동 적용된다.\n * Light Mood(아래)는 이 위에 얹는 오버라이드 역할.\n */\nconst ENVIRONMENT_DEFAULTS: Record<string, Record<string, unknown>> = {\n // 실내\n studio: {\n hemiSkyColor: '#ffffff', hemiGroundColor: '#888888', hemiIntensity: 3.0,\n dirLightEnabled: true, dirLightColor: '#ffffff', dirLightIntensity: 2.0,\n dirLightFollowCamera: true\n },\n warehouse: {\n hemiSkyColor: '#e0e4ea', hemiGroundColor: '#707880', hemiIntensity: 2.5,\n dirLightEnabled: true, dirLightColor: '#f8fafc', dirLightIntensity: 1.8,\n dirLightFollowCamera: true\n },\n factory: {\n hemiSkyColor: '#d8dce2', hemiGroundColor: '#606870', hemiIntensity: 2.0,\n dirLightEnabled: true, dirLightColor: '#e8eef2', dirLightIntensity: 2.0,\n dirLightFollowCamera: true\n },\n office: {\n hemiSkyColor: '#ffffff', hemiGroundColor: '#aaaaaa', hemiIntensity: 3.0,\n dirLightEnabled: true, dirLightColor: '#ffffff', dirLightIntensity: 1.5,\n dirLightFollowCamera: true\n },\n home: {\n hemiSkyColor: '#ffe8c8', hemiGroundColor: '#7a5a40', hemiIntensity: 2.0,\n dirLightEnabled: true, dirLightColor: '#ffd8a0', dirLightIntensity: 1.5,\n dirLightFollowCamera: true\n },\n // 실외 (날씨)\n sunny: {\n hemiSkyColor: '#87ceeb', hemiGroundColor: '#8b7355', hemiIntensity: 2.0,\n dirLightEnabled: true, dirLightColor: '#fff4cf', dirLightIntensity: 3.0,\n dirLightFollowCamera: false, dirLightAzimuth: 135, dirLightElevation: 60\n },\n cloudy: {\n hemiSkyColor: '#c8cbd0', hemiGroundColor: '#9ba1a8', hemiIntensity: 3.0,\n dirLightEnabled: true, dirLightColor: '#e8e8e8', dirLightIntensity: 0.6,\n dirLightFollowCamera: false, dirLightAzimuth: 120, dirLightElevation: 50\n },\n rainy: {\n hemiSkyColor: '#8a909a', hemiGroundColor: '#4a4f55', hemiIntensity: 1.5,\n dirLightEnabled: true, dirLightColor: '#b8c0c8', dirLightIntensity: 0.3,\n dirLightFollowCamera: false, dirLightAzimuth: 110, dirLightElevation: 40\n }\n}\n\n/**\n * Light Mood 프리셋 — Environment 기본값 위에 얹는 분위기 오버라이드.\n * Environment(지금 씬이 어디에 있는가)와 독립적으로 작동하며 sky는 건드리지 않는다.\n * 원자 조명 필드(hemi/dir)만 세팅.\n */\nconst LIGHTING_PRESETS: Record<string, Record<string, unknown>> = {\n Bright: { hemiIntensity: 3.0, dirLightEnabled: true, dirLightColor: '#ffffff', dirLightIntensity: 2.5 },\n Dim: { hemiIntensity: 0.5, dirLightEnabled: true, dirLightColor: '#fff5e0', dirLightIntensity: 0.5 },\n Warm: { hemiIntensity: 1.5, dirLightEnabled: true, dirLightColor: '#ffaa55', dirLightIntensity: 2.0 },\n Cool: { hemiIntensity: 1.5, dirLightEnabled: true, dirLightColor: '#88bbff', dirLightIntensity: 2.0 },\n Dramatic: { hemiIntensity: 0.3, dirLightEnabled: true, dirLightColor: '#ffffff', dirLightIntensity: 3.0 },\n Flat: { hemiIntensity: 3.0, dirLightEnabled: false, dirLightColor: '#ffffff', dirLightIntensity: 0 }\n}\n\n/**\n * Scene-level 3D settings for model-layer.\n * Includes 3D mode, camera, renderer, lighting, presets, and floor configuration.\n */\nexport class PropertyScene3D extends AbstractProperty {\n static styles = [\n PropertyGridStyles,\n css`\n .range-with-value {\n grid-column: 9 / -1;\n display: flex;\n align-items: center;\n gap: 4px;\n }\n\n .range-with-value input[type='range'] {\n flex: 1;\n border: none;\n background: transparent;\n padding: 0;\n }\n\n .range-with-value span {\n min-width: 2.5em;\n text-align: right;\n font-size: 11px;\n color: var(--md-sys-color-on-secondary-container);\n }\n\n .camera-actions {\n display: flex;\n justify-content: flex-end;\n margin-top: 6px;\n }\n\n .camera-actions button {\n font-size: 12px;\n padding: 4px 10px;\n border: 1px solid var(--md-sys-color-outline, #c4c7c5);\n border-radius: 4px;\n background: var(--md-sys-color-surface, #fff);\n color: var(--md-sys-color-on-surface, #1c1b1f);\n cursor: pointer;\n }\n\n .camera-actions button:hover {\n background: var(--md-sys-color-surface-variant, #e7e0ec);\n }\n `\n ]\n\n @property({ type: Object }) value?: Properties\n @property({ type: Object }) scene: Scene | null = null\n\n render() {\n const value = this.value || {}\n\n return html`\n ${this._renderMode(value)} ${this._renderPlacement(value)}\n ${this._renderCamera(value)}\n ${this._renderRenderer(value)} ${this._renderSky(value)}\n ${this._renderHemisphereLight(value)} ${this._renderKeyLight(value)} ${this._renderLightingPresets()}\n ${this._renderFloor(value)}\n `\n }\n\n /**\n * Camera 초기 설정 — Initial View(뷰 프리셋), FOV/Near/Far, 현재 카메라 저장 버튼.\n * 사용자가 씬을 3D로 돌려본 후 \"이 각도가 마음에 든다\" 싶으면\n * Save Current View로 현재 viewport의 position을 모델에 기록 → 다음 로드 시 같은 각도로 시작.\n */\n private _renderCamera(value: Properties) {\n const views = [\n { value: 'perspective', label: 'Perspective' },\n { value: 'top', label: 'Top' },\n { value: 'front', label: 'Front' },\n { value: 'back', label: 'Back' },\n { value: 'right', label: 'Right' },\n { value: 'left', label: 'Left' }\n ]\n const currentView = (value.initialCameraView as string) || 'perspective'\n const fov = Number(value.fov ?? 45)\n const near = Number(value.near ?? 0.1)\n const far = Number(value.far ?? 20000)\n\n return html`\n <fieldset>\n <legend>Camera</legend>\n <div class=\"property-grid\">\n <label>Initial View</label>\n <select value-key=\"initialCameraView\">\n ${views.map(\n v => html`<option value=${v.value} ?selected=${currentView === v.value}>${v.label}</option>`\n )}\n </select>\n\n <label>FOV</label>\n <input type=\"number\" value-key=\"fov\" step=\"1\" min=\"1\" max=\"170\" .value=${String(fov)} />\n\n <label>Near</label>\n <input type=\"number\" value-key=\"near\" step=\"0.1\" min=\"0.01\" .value=${String(near)} />\n\n <label>Far</label>\n <input type=\"number\" value-key=\"far\" step=\"100\" min=\"1\" .value=${String(far)} />\n </div>\n\n <div class=\"camera-actions\">\n <button type=\"button\" @click=${this._onSaveCameraView}>Save Current View</button>\n </div>\n </fieldset>\n `\n }\n\n /**\n * 현재 3D viewport의 카메라 상태를 모델에 저장한다.\n * scene의 getCameraState를 호출하여 view/cameraX/cameraY/cameraZ를 얻어 property-change로 전파.\n */\n private _onSaveCameraView() {\n const cap = (this.scene?.rootContainer as any)?.model_layer?._threeCapability\n if (!cap?.getCameraState) return\n const state = cap.getCameraState()\n if (!state) return\n\n this.dispatchEvent(\n new CustomEvent('property-change', {\n bubbles: true,\n composed: true,\n detail: {\n initialCameraView: state.view,\n cameraX: state.cameraX,\n cameraY: state.cameraY,\n cameraZ: state.cameraZ\n }\n })\n )\n }\n\n /**\n * Scene placement 모드 선택 — zPos 해석과 볼륨 origin 방향을 씬 전체에 일관 적용.\n * floor : zPos=바닥 높이, 볼륨이 위로 쌓임 (공장/창고/건축)\n * space : zPos=볼륨 중심 Y, 바닥 개념 없음 (우주/추상/전시)\n * inverted: zPos=천장, 볼륨이 아래로 매달림 (천장 설비, 베타)\n */\n private _renderPlacement(value: Properties) {\n const options = [\n { value: 'floor', label: 'Floor (default)' },\n { value: 'space', label: 'Space' },\n { value: 'inverted', label: 'Inverted (beta)' }\n ]\n const current = (value.placement as string) || 'floor'\n\n return html`\n <fieldset>\n <legend>Placement</legend>\n <div class=\"property-grid\">\n <label>Mode</label>\n <select value-key=\"placement\">\n ${options.map(\n o => html`<option value=${o.value} ?selected=${current === o.value}>${o.label}</option>`\n )}\n </select>\n </div>\n </fieldset>\n `\n }\n\n private _renderMode(value: Properties) {\n return html`\n <fieldset>\n <legend>3D Mode</legend>\n <div class=\"property-grid\">\n <input id=\"cb-threed\" type=\"checkbox\" value-key=\"threed\" .checked=${!!value.threed} />\n <label for=\"cb-threed\"><ox-i18n msgid=\"label.start-in-3d\">Start in 3D</ox-i18n></label>\n\n <label>Viewer Auto</label>\n <select value-key=\"cameraAutoPlay\">\n ${[\n { value: '', label: 'None' },\n { value: 'orbit', label: 'Orbit' },\n { value: 'play', label: 'Play Bookmarks' }\n ].map(\n o =>\n html`<option value=${o.value} ?selected=${(value.cameraAutoPlay || '') === o.value}>\n ${o.label}\n </option>`\n )}\n </select>\n\n <input\n id=\"cb-floor-constraint\"\n type=\"checkbox\"\n value-key=\"cameraFloorConstraint\"\n .checked=${!!value.cameraFloorConstraint}\n />\n <label for=\"cb-floor-constraint\"><ox-i18n msgid=\"label.keep-above-ground\">Keep Above Ground</ox-i18n></label>\n </div>\n </fieldset>\n `\n }\n\n private _renderRenderer(value: Properties) {\n const exposure = Number(value.exposure ?? 1.2)\n return html`\n <fieldset>\n <legend>Renderer</legend>\n <div class=\"property-grid\">\n <input id=\"cb-antialias\" type=\"checkbox\" value-key=\"antialias\" .checked=${value.antialias !== false} />\n <label for=\"cb-antialias\">Anti-alias</label>\n\n <label>Precision</label>\n <select value-key=\"precision\">\n ${[\n { value: 'highp', label: 'High' },\n { value: 'mediump', label: 'Medium' },\n { value: 'lowp', label: 'Low' }\n ].map(\n o =>\n html`<option value=${o.value} ?selected=${(value.precision || 'highp') === o.value}>\n ${o.label}\n </option>`\n )}\n </select>\n\n <label>Exposure</label>\n <div class=\"range-with-value\">\n <input\n type=\"range\"\n min=\"0.3\"\n max=\"2.5\"\n step=\"0.05\"\n value-key=\"exposure\"\n .value=${String(exposure)}\n />\n <span>${exposure.toFixed(2)}</span>\n </div>\n </div>\n </fieldset>\n `\n }\n\n /**\n * Environment 드롭다운 — 씬의 공간적 맥락을 정의.\n * 선택 시 sky 값과 함께 ENVIRONMENT_DEFAULTS의 기본 조명까지 한 번에 적용한다.\n * \"원클릭 전체 look\" — 사용자가 원하면 Light Mood/원자 컨트롤로 위에 얹어 조정.\n */\n private _renderSky(value: Properties) {\n const envOptions = [\n { value: '', label: 'None', group: 'basic' },\n { value: 'color', label: 'Color', group: 'basic' },\n { value: 'studio', label: 'Studio', group: 'indoor' },\n { value: 'warehouse', label: 'Warehouse', group: 'indoor' },\n { value: 'factory', label: 'Factory', group: 'indoor' },\n { value: 'office', label: 'Office', group: 'indoor' },\n { value: 'home', label: 'Home', group: 'indoor' },\n { value: 'sunny', label: 'Sunny', group: 'outdoor' },\n { value: 'cloudy', label: 'Cloudy', group: 'outdoor' },\n { value: 'rainy', label: 'Rainy', group: 'outdoor' }\n ]\n\n return html`\n <fieldset>\n <legend>Environment</legend>\n <div class=\"property-grid\">\n <label>Preset</label>\n <select @change=${this._onEnvironmentChange}>\n <optgroup label=\"Basic\">\n ${envOptions\n .filter(o => o.group === 'basic')\n .map(o => html`<option value=${o.value} ?selected=${(value.sky || '') === o.value}>${o.label}</option>`)}\n </optgroup>\n <optgroup label=\"Indoor\">\n ${envOptions\n .filter(o => o.group === 'indoor')\n .map(o => html`<option value=${o.value} ?selected=${(value.sky || '') === o.value}>${o.label}</option>`)}\n </optgroup>\n <optgroup label=\"Outdoor\">\n ${envOptions\n .filter(o => o.group === 'outdoor')\n .map(o => html`<option value=${o.value} ?selected=${(value.sky || '') === o.value}>${o.label}</option>`)}\n </optgroup>\n </select>\n\n ${value.sky === 'color'\n ? html`\n <label>Color</label>\n <ox-input-color value-key=\"skyColor\" .value=${value.skyColor || '#87ceeb'}> </ox-input-color>\n `\n : ''}\n </div>\n </fieldset>\n `\n }\n\n /**\n * Environment 선택 핸들러 — sky 필드만 바꾸는 게 아니라 ENVIRONMENT_DEFAULTS에\n * 정의된 hemi/dir 기본 조명까지 한 번의 property-change로 함께 적용한다.\n */\n private _onEnvironmentChange(e: Event) {\n const select = e.target as HTMLSelectElement\n const sky = select.value\n const detail: Record<string, unknown> = { sky }\n const defaults = ENVIRONMENT_DEFAULTS[sky]\n if (defaults) {\n Object.assign(detail, defaults)\n }\n this.dispatchEvent(\n new CustomEvent('property-change', {\n bubbles: true,\n composed: true,\n detail\n })\n )\n }\n\n private _renderHemisphereLight(value: Properties) {\n return html`\n <fieldset>\n <legend>Hemisphere Light</legend>\n <div class=\"property-grid\">\n <label>Sky</label>\n <ox-input-color value-key=\"hemiSkyColor\" .value=${value.hemiSkyColor || '#ffffff'}></ox-input-color>\n\n <label>Ground</label>\n <ox-input-color value-key=\"hemiGroundColor\" .value=${value.hemiGroundColor || '#444444'}></ox-input-color>\n\n <label>Intensity</label>\n <div class=\"range-with-value\">\n <input\n type=\"range\"\n min=\"0\"\n max=\"3\"\n step=\"0.1\"\n value-key=\"hemiIntensity\"\n .value=${String(value.hemiIntensity ?? 0.6)}\n />\n <span>${(value.hemiIntensity ?? 0.6).toFixed(1)}</span>\n </div>\n </div>\n </fieldset>\n `\n }\n\n private _renderKeyLight(value: Properties) {\n const followCamera = value.dirLightFollowCamera !== false\n const shadowEnabled = value.dirShadowEnabled !== false\n return html`\n <fieldset>\n <legend>Key Light</legend>\n <div class=\"property-grid\">\n <input\n id=\"cb-dirlight\"\n type=\"checkbox\"\n value-key=\"dirLightEnabled\"\n .checked=${value.dirLightEnabled !== false}\n />\n <label for=\"cb-dirlight\">Enabled</label>\n\n <label>Color</label>\n <ox-input-color value-key=\"dirLightColor\" .value=${value.dirLightColor || '#ffffff'}> </ox-input-color>\n\n <label>Intensity</label>\n <div class=\"range-with-value\">\n <input\n type=\"range\"\n min=\"0\"\n max=\"3\"\n step=\"0.1\"\n value-key=\"dirLightIntensity\"\n .value=${String(value.dirLightIntensity ?? 0.5)}\n />\n <span>${(value.dirLightIntensity ?? 0.5).toFixed(1)}</span>\n </div>\n\n <input\n id=\"cb-dirlight-follow\"\n type=\"checkbox\"\n value-key=\"dirLightFollowCamera\"\n .checked=${followCamera}\n />\n <label for=\"cb-dirlight-follow\">Follow Camera</label>\n\n ${!followCamera\n ? html`\n <label>Azimuth</label>\n <div class=\"range-with-value\">\n <input\n type=\"range\"\n min=\"0\"\n max=\"360\"\n step=\"5\"\n value-key=\"dirLightAzimuth\"\n .value=${String(value.dirLightAzimuth ?? 30)}\n />\n <span>${Math.round((value.dirLightAzimuth ?? 30) as number)}°</span>\n </div>\n\n <label>Elevation</label>\n <div class=\"range-with-value\">\n <input\n type=\"range\"\n min=\"0\"\n max=\"90\"\n step=\"5\"\n value-key=\"dirLightElevation\"\n .value=${String(value.dirLightElevation ?? 45)}\n />\n <span>${Math.round((value.dirLightElevation ?? 45) as number)}°</span>\n </div>\n `\n : ''}\n\n <input\n id=\"cb-dirlight-shadow\"\n type=\"checkbox\"\n value-key=\"dirShadowEnabled\"\n .checked=${shadowEnabled}\n />\n <label for=\"cb-dirlight-shadow\">Cast Shadow</label>\n\n ${shadowEnabled\n ? html`\n <label>Shadow Bias</label>\n <div class=\"range-with-value\">\n <input\n type=\"range\"\n min=\"-0.01\"\n max=\"0.01\"\n step=\"0.0001\"\n value-key=\"dirShadowBias\"\n .value=${String(value.dirShadowBias ?? -0.0005)}\n />\n <span>${(value.dirShadowBias ?? -0.0005).toFixed(4)}</span>\n </div>\n `\n : ''}\n </div>\n </fieldset>\n `\n }\n\n /**\n * Light Mood — Environment가 설정한 기본 조명 위에 얹는 분위기 오버라이드.\n * sky는 건드리지 않고 hemi/dir 값만 적용. Environment와 독립적으로 조합 가능.\n */\n private _renderLightingPresets() {\n return html`\n <fieldset>\n <legend>Light Mood</legend>\n <div class=\"property-grid\">\n <label>Apply</label>\n <select @change=${this._onPresetChange}>\n <option value=\"\" selected>Select...</option>\n ${Object.keys(LIGHTING_PRESETS).map(\n name => html`<option value=${name}>${name}</option>`\n )}\n </select>\n </div>\n </fieldset>\n `\n }\n\n private _onPresetChange(e: Event) {\n const select = e.target as HTMLSelectElement\n const name = select.value\n if (!name) return\n const preset = LIGHTING_PRESETS[name]\n if (preset) this._applyLightingPreset(preset)\n // 동일 preset을 다시 선택할 수 있도록 초기값으로 리셋\n select.value = ''\n }\n\n private _renderFloor(value: Properties) {\n return html`\n <property-material3d\n legend=\"Floor Material\"\n .value=${value.floorMaterial3d || { receiveShadow: true }}\n @property-change=${this._onFloorMaterialChange}\n >\n </property-material3d>\n `\n }\n\n private _applyLightingPreset(values: Record<string, unknown>) {\n this.dispatchEvent(\n new CustomEvent('property-change', {\n bubbles: true,\n composed: true,\n detail: values\n })\n )\n }\n\n private _onFloorMaterialChange(e: CustomEvent) {\n e.stopPropagation()\n this.dispatchEvent(\n new CustomEvent('property-change', {\n bubbles: true,\n composed: true,\n detail: { floorMaterial3d: e.detail.material3d }\n })\n )\n }\n\n}\n"]}
|
|
@@ -59,6 +59,14 @@ export class Property3D extends AbstractProperty {
|
|
|
59
59
|
</div>
|
|
60
60
|
</fieldset>
|
|
61
61
|
|
|
62
|
+
<fieldset>
|
|
63
|
+
<legend>Display</legend>
|
|
64
|
+
<div class="property-grid">
|
|
65
|
+
<input id="cb-screenFixed" type="checkbox" value-key="screenFixed" .checked=${!!value.screenFixed} />
|
|
66
|
+
<label for="cb-screenFixed">Screen Fixed (HUD)</label>
|
|
67
|
+
</div>
|
|
68
|
+
</fieldset>
|
|
69
|
+
|
|
62
70
|
<property-material3d .value=${value.material3d}></property-material3d>
|
|
63
71
|
`;
|
|
64
72
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"threed.js","sourceRoot":"","sources":["../../../../src/property-panel/threed/threed.ts"],"names":[],"mappings":"AAAA;;GAEG;;AAEH,OAAO,kCAAkC,CAAA;AACzC,OAAO,0BAA0B,CAAA;AAEjC,OAAO,0BAA0B,CAAA;AAEjC,OAAO,EAAE,IAAI,EAAE,MAAM,KAAK,CAAA;AAC1B,OAAO,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAA;AAG5C,OAAO,EAAE,kBAAkB,EAAE,MAAM,yCAAyC,CAAA;AAE5E,OAAO,EAAE,gBAAgB,EAAE,MAAM,yBAAyB,CAAA;AAE1D,MAAM,OAAO,UAAW,SAAQ,gBAAgB;IAAhD;;QAI8B,WAAM,GAAkB,IAAI,CAAA;QAC7B,aAAQ,GAAgB,EAAE,CAAA;
|
|
1
|
+
{"version":3,"file":"threed.js","sourceRoot":"","sources":["../../../../src/property-panel/threed/threed.ts"],"names":[],"mappings":"AAAA;;GAEG;;AAEH,OAAO,kCAAkC,CAAA;AACzC,OAAO,0BAA0B,CAAA;AAEjC,OAAO,0BAA0B,CAAA;AAEjC,OAAO,EAAE,IAAI,EAAE,MAAM,KAAK,CAAA;AAC1B,OAAO,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAA;AAG5C,OAAO,EAAE,kBAAkB,EAAE,MAAM,yCAAyC,CAAA;AAE5E,OAAO,EAAE,gBAAgB,EAAE,MAAM,yBAAyB,CAAA;AAE1D,MAAM,OAAO,UAAW,SAAQ,gBAAgB;IAAhD;;QAI8B,WAAM,GAAkB,IAAI,CAAA;QAC7B,aAAQ,GAAgB,EAAE,CAAA;IAoFvD,CAAC;IAlFC,YAAY;QACV,IAAI,CAAC,UAAU,CAAC,gBAAgB,CAAC,QAAQ,EAAE,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,CAAA;IAC3E,CAAC;IAED,MAAM;;QACJ,MAAM,KAAK,GAAG,IAAI,CAAC,KAAK,IAAI,EAAE,CAAA;QAC9B,MAAM,EAAE,IAAI,GAAG,CAAC,EAAE,GAAG,GAAG,CAAC,EAAE,KAAK,GAAG,EAAE,EAAE,MAAM,GAAG,EAAE,EAAE,GAAG,IAAI,CAAC,MAAM,IAAI,EAAE,CAAA;QAExE,OAAO,IAAI,CAAA;;;;;yFAK0E,MAAM,CAAC,KAAK,CAAC;;0FAEZ,MAAM,CAAC,MAAM,CAAC;;kFAEtB,MAAA,KAAK,CAAC,KAAK,mCAAI,CAAC;;;;;;;;wFAQV,MAAM,CAAC,IAAI,CAAC;;uFAEb,MAAM,CAAC,GAAG,CAAC;;iFAEjB,MAAA,KAAK,CAAC,IAAI,mCAAI,CAAC;;;;;;;;iFAQf,MAAA,KAAK,CAAC,SAAS,mCAAI,CAAC;;iFAEpB,MAAA,KAAK,CAAC,SAAS,mCAAI,CAAC;;gFAErB,MAAA,KAAK,CAAC,QAAQ,mCAAI,CAAC;;;;;;;wFAOX,CAAC,CAAC,KAAK,CAAC,WAAW;;;;;oCAKvE,KAAK,CAAC,UAAU;KAC/C,CAAA;IACH,CAAC;IAED,aAAa,CAAC,CAAQ;QACpB,IAAI,OAAO,GAAG,CAAC,CAAC,MAAqB,CAAA;QACrC,IAAI,GAAG,GAAG,OAAO,CAAC,YAAY,CAAC,WAAW,CAAC,CAAA;QAE3C,IAAI,CAAC,GAAG,EAAE,CAAC;YACT,OAAM;QACR,CAAC;QAED,IAAI,KAAK,GAAG,IAAI,CAAC,uBAAuB,CAAC,OAAO,CAAC,CAAA;QAEjD,IAAI,GAAG,CAAC,OAAO,CAAC,SAAS,CAAC,IAAI,CAAC,EAAE,CAAC;YAChC,IAAI,KAAK,CAAC,KAAK,CAAC;gBAAE,OAAM;YACxB,IAAI,CAAC,aAAa,CAChB,IAAI,WAAW,CAAC,eAAe,EAAE;gBAC/B,OAAO,EAAE,IAAI;gBACb,QAAQ,EAAE,IAAI;gBACd,MAAM,EAAE;oBACN,CAAC,GAAG,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,EAAE,KAAK;iBACvB;aACF,CAAC,CACH,CAAA;QACH,CAAC;aAAM,CAAC;YACN,IAAI,CAAC,kBAAkB,CAAC,GAAG,EAAE,KAAK,CAAC,CAAA;QACrC,CAAC;IACH,CAAC;;AAvFM,iBAAM,GAAG,CAAC,kBAAkB,CAAC,AAAvB,CAAuB;AAER;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;yCAAmB;AAClB;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;0CAA6B;AAC7B;IAA1B,QAAQ,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE,CAAC;4CAA2B","sourcesContent":["/**\n * @license Copyright © HatioLab Inc. All rights reserved.\n */\n\nimport '@operato/input/ox-input-angle.js'\nimport '@operato/i18n/ox-i18n.js'\n\nimport './property-material3d.js'\n\nimport { html } from 'lit'\nimport { property } from 'lit/decorators.js'\n\nimport { BOUNDS, Component, Properties } from '@hatiolab/things-scene'\nimport { PropertyGridStyles } from '@operato/styles/property-grid-styles.js'\n\nimport { AbstractProperty } from '../abstract-property.js'\n\nexport class Property3D extends AbstractProperty {\n static styles = [PropertyGridStyles]\n\n @property({ type: Object }) value?: Properties\n @property({ type: Object }) bounds: BOUNDS | null = null\n @property({ type: Array }) selected: Component[] = []\n\n firstUpdated() {\n this.renderRoot.addEventListener('change', this.onValueChange.bind(this))\n }\n\n render() {\n const value = this.value || {}\n const { left = 0, top = 0, width = '', height = '' } = this.bounds || {}\n\n return html`\n <fieldset>\n <legend>Size</legend>\n <div class=\"property-grid\">\n <label class=\"onethird-label\">W</label>\n <input class=\"onethird-editor\" type=\"number\" value-key=\"bounds.width\" .value=${String(width)} />\n <label class=\"onethird-label\">H</label>\n <input class=\"onethird-editor\" type=\"number\" value-key=\"bounds.height\" .value=${String(height)} />\n <label class=\"onethird-label\">D</label>\n <input class=\"onethird-editor\" type=\"number\" value-key=\"depth\" .value=${value.depth ?? 0} />\n </div>\n </fieldset>\n\n <fieldset>\n <legend>Position</legend>\n <div class=\"property-grid\">\n <label class=\"onethird-label\">X</label>\n <input class=\"onethird-editor\" type=\"number\" value-key=\"bounds.left\" .value=${String(left)} />\n <label class=\"onethird-label\">Y</label>\n <input class=\"onethird-editor\" type=\"number\" value-key=\"bounds.top\" .value=${String(top)} />\n <label class=\"onethird-label\">Z</label>\n <input class=\"onethird-editor\" type=\"number\" value-key=\"zPos\" .value=${value.zPos ?? 0} />\n </div>\n </fieldset>\n\n <fieldset>\n <legend>Rotation</legend>\n <div class=\"property-grid\">\n <label class=\"onethird-label\">RX</label>\n <ox-input-angle class=\"onethird-editor\" value-key=\"rotationX\" .value=${value.rotationX ?? 0}></ox-input-angle>\n <label class=\"onethird-label\">RY</label>\n <ox-input-angle class=\"onethird-editor\" value-key=\"rotationY\" .value=${value.rotationY ?? 0}></ox-input-angle>\n <label class=\"onethird-label\">RZ</label>\n <ox-input-angle class=\"onethird-editor\" value-key=\"rotation\" .value=${value.rotation ?? 0}></ox-input-angle>\n </div>\n </fieldset>\n\n <fieldset>\n <legend>Display</legend>\n <div class=\"property-grid\">\n <input id=\"cb-screenFixed\" type=\"checkbox\" value-key=\"screenFixed\" .checked=${!!value.screenFixed} />\n <label for=\"cb-screenFixed\">Screen Fixed (HUD)</label>\n </div>\n </fieldset>\n\n <property-material3d .value=${value.material3d}></property-material3d>\n `\n }\n\n onValueChange(e: Event) {\n var element = e.target as HTMLElement\n var key = element.getAttribute('value-key')\n\n if (!key) {\n return\n }\n\n var value = this.getValueFromEventTarget(element)\n\n if (key.indexOf('bounds.') == 0) {\n if (isNaN(value)) return\n this.dispatchEvent(\n new CustomEvent('bounds-change', {\n bubbles: true,\n composed: true,\n detail: {\n [key.substr(7)]: value\n }\n })\n )\n } else {\n this.onAfterValueChange(key, value)\n }\n }\n}\n"]}
|