@babylonjs/node-editor 5.13.3 → 5.15.0
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.
|
@@ -59,7 +59,7 @@ __webpack_require__.r(__webpack_exports__);
|
|
|
59
59
|
|
|
60
60
|
var ___CSS_LOADER_EXPORT___ = _node_modules_css_loader_dist_runtime_api_js__WEBPACK_IMPORTED_MODULE_1___default()((_node_modules_css_loader_dist_runtime_sourceMaps_js__WEBPACK_IMPORTED_MODULE_0___default()));
|
|
61
61
|
// Module
|
|
62
|
-
___CSS_LOADER_EXPORT___.push([module.id, "#graph-canvas {\n width: 100%;\n height: 100%;\n margin: 0;\n padding: 0;\n font: 14px \"acumin-pro\";\n user-select: none;\n overflow: hidden;\n cursor: move;\n background-image: linear-gradient(to right, #4f4e4f 1px, transparent 1px), linear-gradient(to bottom, #4f4e4f 1px, transparent 1px); }\n #graph-canvas #selection-container {\n pointer-events: none; }\n #graph-canvas #selection-container .selection-box {\n z-index: 10;\n position: absolute;\n background: rgba(72, 72, 196, 0.5);\n border: blue solid 2px; }\n #graph-canvas .port {\n border-radius: 20px;\n width: 20px;\n height: 20px;\n align-self: center; }\n #graph-canvas .port .img {\n width: 100%; }\n #graph-canvas .port img.selected {\n box-shadow: 0 0 0 2px;\n border-radius: 50%; }\n #graph-canvas .port:hover, #graph-canvas .port.selected {\n filter: brightness(2); }\n #graph-canvas .portLine {\n height: 24px;\n display: grid;\n grid-template-rows: 100%; }\n #graph-canvas .port-label {\n align-items: center; }\n #graph-canvas .inputsContainer {\n grid-row: 1;\n grid-column: 1; }\n #graph-canvas .inputsContainer .portLine {\n grid-template-columns: 12px calc(100% - 15px); }\n #graph-canvas .inputsContainer .portLine .port-label {\n grid-row: 1;\n grid-column: 2; }\n #graph-canvas .inputsContainer .portLine .port {\n grid-row: 1;\n grid-column: 1;\n transform: translateX(-12px); }\n #graph-canvas .outputsContainer {\n grid-row: 1;\n grid-column: 2; }\n #graph-canvas .outputsContainer .portLine {\n grid-template-columns: calc(100% - 10px) 12px; }\n #graph-canvas .outputsContainer .portLine .port-label {\n grid-row: 1;\n grid-column: 1;\n text-align: right; }\n #graph-canvas .outputsContainer .portLine .port {\n grid-row: 1;\n grid-column: 2;\n transform: translateX(2px); }\n #graph-canvas #graph-container {\n width: 100%;\n height: 100%;\n left: 0;\n top: 0;\n transform-origin: left top;\n display: grid;\n grid-template-rows: 100%;\n grid-template-columns: 100%; }\n #graph-canvas #graph-container #frame-container {\n overflow: visible;\n grid-row: 1;\n grid-column: 1;\n position: relative;\n width: 100%;\n height: 100%; }\n #graph-canvas #graph-container .frame-box {\n position: absolute;\n background: rgba(72, 72, 72, 0.7);\n display: grid;\n grid-template-rows: 40px calc(100% - 40px);\n grid-template-columns: 100%;\n box-sizing: border-box; }\n #graph-canvas #graph-container .frame-box.collapsed {\n height: auto !important;\n width: 200px !important;\n z-index: 3; }\n #graph-canvas #graph-container .frame-box.collapsed .frame-box-header {\n font-size: 16px;\n grid-template-columns: calc(100% - 37px) 30px 7px; }\n #graph-canvas #graph-container .frame-box.collapsed .frame-box-header .frame-box-header-collapse {\n margin-top: -2px; }\n #graph-canvas #graph-container .frame-box.collapsed .frame-box-header .frame-box-header-close {\n display: none; }\n #graph-canvas #graph-container .frame-box.collapsed .frame-comments.has-comments .frame-comment-span {\n white-space: nowrap;\n text-overflow: ellipsis;\n overflow: hidden; }\n #graph-canvas #graph-container .frame-box .frame-box-border {\n grid-row: 1 / span 2;\n grid-column: 1;\n width: 100%;\n height: 100%;\n border: transparent solid 4px;\n pointer-events: none;\n box-sizing: border-box; }\n #graph-canvas #graph-container .frame-box .frame-box-header {\n grid-row: 1;\n grid-column: 1;\n background: #484848;\n color: white;\n font-size: 24px;\n text-align: center;\n display: grid;\n grid-template-rows: 100%;\n grid-template-columns: calc(100% - 74px) 30px 7px 30px 7px;\n align-content: center;\n overflow: hidden; }\n #graph-canvas #graph-container .frame-box .frame-box-header .frame-box-header-button {\n cursor: pointer;\n align-self: center;\n transform-origin: 50% 50%;\n transform: scale(1);\n stroke: transparent;\n fill: white;\n display: grid; }\n #graph-canvas #graph-container .frame-box .frame-box-header .frame-box-header-button.down {\n transform: scale(0.9); }\n #graph-canvas #graph-container .frame-box .frame-box-header .frame-box-header-collapse {\n grid-column: 2;\n grid-row: 1; }\n #graph-canvas #graph-container .frame-box .frame-box-header .frame-box-header-close {\n grid-column: 4;\n grid-row: 1; }\n #graph-canvas #graph-container .frame-box .frame-box-header .frame-box-header-title {\n grid-column: 1;\n grid-row: 1;\n display: grid;\n height: 100%;\n width: 100%;\n align-self: stretch;\n align-items: center;\n margin-top: -2px; }\n #graph-canvas #graph-container .frame-box .port-container {\n margin-top: 6px;\n margin-bottom: 6px;\n margin-left: 4px;\n margin-right: 4px;\n color: white;\n grid-row: 2;\n grid-column: 1;\n display: grid;\n grid-template-rows: 100%;\n grid-template-columns: 50% 50%;\n z-index: 2; }\n #graph-canvas #graph-container .frame-box .frame-comments.has-comments {\n display: grid;\n grid-row: 2;\n grid-column: 1;\n padding: 0 10px;\n font-style: italic;\n word-wrap: break-word; }\n #graph-canvas #graph-container .frame-box.selected .frame-box-border {\n border-color: white; }\n #graph-canvas #graph-container .frame-box .right-handle {\n grid-area: 1 / 2 / 3 / 2;\n width: 4px;\n background-color: transparent;\n cursor: ew-resize; }\n #graph-canvas #graph-container .frame-box .right-handle::after {\n content: \"\";\n width: 8px;\n position: absolute;\n top: 0;\n bottom: 0;\n margin-left: -4px;\n cursor: ew-resize; }\n #graph-canvas #graph-container .frame-box .right-handle.collapsed {\n cursor: pointer; }\n #graph-canvas #graph-container .frame-box .top-right-corner-handle {\n background-color: transparent;\n height: 4px;\n z-index: 21;\n cursor: ne-resize;\n width: 4px;\n margin-left: -6px; }\n #graph-canvas #graph-container .frame-box .top-right-corner-handle::after {\n background-color: transparent;\n cursor: ne-resize;\n margin-left: unset;\n top: -4px;\n height: 10px;\n width: 10px; }\n #graph-canvas #graph-container .frame-box .bottom-right-corner-handle {\n background-color: transparent;\n height: 0px;\n z-index: 21;\n cursor: nw-resize;\n grid-area: 4 / 2 / 4 / 2;\n margin-left: -2px; }\n #graph-canvas #graph-container .frame-box .bottom-right-corner-handle::after {\n background-color: transparent;\n height: 10px;\n cursor: nw-resize;\n top: unset;\n bottom: -4px;\n width: 10px; }\n #graph-canvas #graph-container .frame-box .left-handle {\n grid-area: 1 / 1 / 3 / 1;\n width: 4px;\n background-color: transparent;\n cursor: ew-resize; }\n #graph-canvas #graph-container .frame-box .left-handle::before {\n content: \"\";\n width: 8px;\n position: absolute;\n top: 0;\n bottom: 0;\n margin-left: -4px; }\n #graph-canvas #graph-container .frame-box .top-left-corner-handle {\n background-color: transparent;\n height: 4px;\n z-index: 21;\n cursor: nw-resize;\n width: 4px;\n margin-left: -4px; }\n #graph-canvas #graph-container .frame-box .top-left-corner-handle::before {\n background-color: transparent;\n cursor: nw-resize;\n margin-left: unset;\n top: -4px;\n height: 10px;\n width: 10px; }\n #graph-canvas #graph-container .frame-box .bottom-left-corner-handle {\n background-color: transparent;\n height: 0px;\n z-index: 21;\n cursor: sw-resize;\n grid-area: 4 / 1 / 4 / 1; }\n #graph-canvas #graph-container .frame-box .bottom-left-corner-handle::before {\n background-color: transparent;\n height: 10px;\n cursor: sw-resize;\n top: unset;\n bottom: -4px;\n width: 10px; }\n #graph-canvas #graph-container .frame-box .top-handle {\n grid-area: 1 / 1 / 1 / 1;\n background-color: transparent;\n height: 4px;\n cursor: ns-resize; }\n #graph-canvas #graph-container .frame-box .top-handle::before {\n content: \"\";\n width: 100%;\n position: absolute;\n top: -4px;\n bottom: 100%;\n right: 0;\n left: 0;\n margin-bottom: -8px;\n cursor: ns-resize;\n height: 8px; }\n #graph-canvas #graph-container .frame-box .bottom-handle {\n grid-area: 3 / 1 / 3 / 1;\n background-color: transparent;\n height: 4px;\n cursor: ns-resize; }\n #graph-canvas #graph-container .frame-box .bottom-handle::after {\n content: \"\";\n width: 100%;\n position: absolute;\n top: 100%;\n bottom: 0;\n right: 0;\n left: 0;\n margin-top: -8px;\n cursor: ns-resize;\n height: 12px; }\n #graph-canvas #graph-container .frame-box.collapsed .top-handle,\n #graph-canvas #graph-container .frame-box.collapsed .top-right-corner-handle,\n #graph-canvas #graph-container .frame-box.collapsed .right-handle,\n #graph-canvas #graph-container .frame-box.collapsed .bottom-right-corner-handle,\n #graph-canvas #graph-container .frame-box.collapsed .bottom-handle,\n #graph-canvas #graph-container .frame-box.collapsed .bottom-left-corner-handle,\n #graph-canvas #graph-container .frame-box.collapsed .left-handle,\n #graph-canvas #graph-container .frame-box.collapsed .top-left-corner-handle {\n cursor: default; }\n #graph-canvas #graph-container .frame-box.collapsed .right-handle::after,\n #graph-canvas #graph-container .frame-box.collapsed .bottom-handle::after,\n #graph-canvas #graph-container .frame-box.collapsed .top-right-corner-handle::after,\n #graph-canvas #graph-container .frame-box.collapsed .bottom-right-corner-handle::after {\n cursor: default; }\n #graph-canvas #graph-container .frame-box.collapsed .left-handle::before,\n #graph-canvas #graph-container .frame-box.collapsed .top-handle::before,\n #graph-canvas #graph-container .frame-box.collapsed .top-left-corner-handle::before,\n #graph-canvas #graph-container .frame-box.collapsed .bottom-left-corner-handle::before {\n cursor: default; }\n #graph-canvas #graph-container #graph-svg-container {\n grid-row: 1;\n grid-column: 1;\n position: relative;\n width: 100%;\n height: 100%;\n overflow: visible;\n pointer-events: none;\n z-index: 2; }\n #graph-canvas #graph-container #graph-svg-container .link {\n stroke-width: 4px; }\n #graph-canvas #graph-container #graph-svg-container .link.selected {\n stroke: white !important;\n stroke-dasharray: 10, 2; }\n #graph-canvas #graph-container #graph-svg-container .link.hidden {\n display: none; }\n #graph-canvas #graph-container #graph-svg-container .selection-link {\n pointer-events: all;\n stroke-width: 16px;\n opacity: 0;\n transition: opacity 75ms;\n stroke: transparent;\n cursor: pointer; }\n #graph-canvas #graph-container #graph-svg-container .selection-link.hidden {\n display: none; }\n #graph-canvas #graph-container #graph-svg-container .selection-link:hover, #graph-canvas #graph-container #graph-svg-container .selection-link.selected {\n stroke: white !important;\n opacity: 0.4; }\n #graph-canvas #graph-container #graph-canvas-container {\n grid-row: 1;\n grid-column: 1;\n position: relative;\n width: 100%;\n height: 100%; }\n #graph-canvas #graph-container #graph-canvas-container .visual {\n z-index: 4;\n width: 200px;\n position: absolute;\n left: 0;\n top: 0;\n background: gray;\n border: 4px solid black;\n border-radius: 12px;\n display: grid;\n grid-template-rows: 30px auto;\n grid-template-columns: 100%;\n color: white; }\n #graph-canvas #graph-container #graph-canvas-container .visual.elbow-block {\n width: 40px;\n grid-template-rows: 0px 40px 0px;\n border: 0;\n border-radius: 40px;\n transform: translateY(-7px); }\n #graph-canvas #graph-container #graph-canvas-container .visual.elbow-block .selection-border {\n border-radius: 40px; }\n #graph-canvas #graph-container #graph-canvas-container .visual.elbow-block .header-container {\n display: none; }\n #graph-canvas #graph-container #graph-canvas-container .visual.elbow-block .connections {\n transform: translateY(7px); }\n #graph-canvas #graph-container #graph-canvas-container .visual.elbow-block .content {\n display: none; }\n #graph-canvas #graph-container #graph-canvas-container .visual.hidden {\n display: none; }\n #graph-canvas #graph-container #graph-canvas-container .visual .comments {\n position: absolute;\n top: -50px;\n width: 200px;\n height: 45px;\n overflow: hidden;\n font-style: italic;\n opacity: 0.8;\n display: grid;\n align-items: flex-end;\n pointer-events: none; }\n #graph-canvas #graph-container #graph-canvas-container .visual .selection-border {\n grid-row: 1 / span 3;\n grid-column: 1;\n margin: -4px;\n transition: border-color 100ms;\n border: 4px solid black;\n border-radius: 12px;\n transform: scale(1); }\n #graph-canvas #graph-container #graph-canvas-container .visual.selected .selection-border {\n border: 4px solid white; }\n #graph-canvas #graph-container #graph-canvas-container .visual .header-container {\n grid-row: 1;\n grid-column: 1;\n display: grid;\n grid-template-columns: 1fr auto;\n grid-template-rows: 100%;\n border: 4px solid black;\n border-top-right-radius: 7px;\n border-top-left-radius: 7px;\n background: black;\n color: white;\n transform: scaleX(1.01) translateY(-0.5px);\n transform-origin: center; }\n #graph-canvas #graph-container #graph-canvas-container .visual .header-container.constant {\n border-color: #464348;\n background: #464348; }\n #graph-canvas #graph-container #graph-canvas-container .visual .header-container.inspector {\n border-color: #66491b;\n background: #66491b; }\n #graph-canvas #graph-container #graph-canvas-container .visual .warning {\n grid-row: 1;\n grid-column: 1;\n display: none;\n z-index: 10;\n justify-self: end;\n align-self: center;\n margin-right: 5px; }\n #graph-canvas #graph-container #graph-canvas-container .visual .warning.visible {\n display: grid;\n width: 20px; }\n #graph-canvas #graph-container #graph-canvas-container .visual .header {\n grid-row: 1;\n grid-column: 1;\n font-size: 16px;\n text-align: center;\n margin-top: -1px;\n margin-left: -1px;\n margin-right: -1px;\n white-space: nowrap;\n text-overflow: ellipsis;\n overflow: hidden; }\n #graph-canvas #graph-container #graph-canvas-container .visual .connections {\n grid-row: 2;\n grid-column: 1;\n display: grid;\n grid-template-columns: 50% 50%;\n transform: scale(1); }\n #graph-canvas #graph-container #graph-canvas-container .visual .content {\n min-height: 20px;\n grid-row: 3;\n grid-column: 1; }\n #graph-canvas #graph-container #graph-canvas-container .visual .content.input-block {\n grid-row: 2;\n min-height: 34px;\n text-align: center;\n font-size: 18px;\n font-weight: bold;\n margin: 0 10px 5px;\n display: grid;\n align-content: center; }\n #graph-canvas #graph-container #graph-canvas-container .visual .content.input-block.small-font {\n font-size: 17px; }\n #graph-canvas #graph-container #graph-canvas-container .visual .content.output-block {\n min-height: 0px;\n height: 5px; }\n #graph-canvas #graph-container #graph-canvas-container .visual .content.clamp-block {\n grid-row: 2;\n height: 34px;\n text-align: center;\n font-size: 18px;\n font-weight: bold;\n margin: 0 10px; }\n #graph-canvas #graph-container #graph-canvas-container .visual .content.gradient-block {\n grid-row: 2;\n height: 34px; }\n #graph-canvas #graph-container #graph-canvas-container .visual .content.texture-block {\n grid-row: 2;\n height: 140px;\n width: 140px;\n overflow: hidden;\n border-bottom-left-radius: 7px;\n border: black 4px solid;\n border-left: 0px;\n border-bottom: 0px; }\n #graph-canvas #graph-container #graph-canvas-container .visual .content.texture-block img {\n width: 100%;\n height: 100%;\n pointer-events: none; }\n #graph-canvas #graph-container #graph-canvas-container .visual .content.texture-block img.empty {\n display: none; }\n #graph-canvas #graph-container #graph-canvas-container .visual .content.image-source-block {\n margin-top: 5px; }\n #graph-canvas #graph-container #graph-canvas-container .visual .content.regular-texture-block {\n margin-top: 60px; }\n #graph-canvas #graph-container #graph-canvas-container .visual .content.reduced-texture-block {\n margin-top: 30px; }\n #graph-canvas #graph-container #graph-canvas-container .visual .content.reflection-block {\n grid-row: 3; }\n #graph-canvas #graph-container #graph-canvas-container .visual .content.remap-block {\n height: 34px;\n text-align: center;\n font-size: 18px;\n font-weight: bold;\n margin: 0 10px; }\n #graph-canvas #graph-container #graph-canvas-container .visual .content.trigonometry-block {\n grid-row: 2;\n height: 34px;\n text-align: center;\n font-size: 18px;\n font-weight: bold;\n margin: 0 10px; }\n", "",{"version":3,"sources":["webpack://./../../../dev/sharedUiComponents/dist/nodeGraphSystem/scss/graphCanvas.scss"],"names":[],"mappings":"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","sourcesContent":["#graph-canvas {\r\n width: 100%;\r\n height: 100%;\r\n margin: 0;\r\n padding: 0;\r\n font: 14px \"acumin-pro\";\r\n user-select: none;\r\n overflow: hidden;\r\n cursor: move;\r\n background-image: linear-gradient(to right, #4f4e4f 1px, transparent 1px), linear-gradient(to bottom, #4f4e4f 1px, transparent 1px);\r\n\r\n #selection-container {\r\n pointer-events: none;\r\n\r\n .selection-box {\r\n z-index: 10;\r\n position: absolute;\r\n background: rgba(72, 72, 196, 0.5);\r\n border: blue solid 2px;\r\n }\r\n }\r\n\r\n .port {\r\n border-radius: 20px;\r\n width: 20px;\r\n height: 20px;\r\n align-self: center;\r\n\r\n .img {\r\n width: 100%;\r\n }\r\n\r\n img.selected {\r\n box-shadow: 0 0 0 2px;\r\n border-radius: 50%;\r\n }\r\n\r\n &:hover,\r\n &.selected {\r\n filter: brightness(2);\r\n }\r\n }\r\n\r\n .portLine {\r\n height: 24px;\r\n display: grid;\r\n grid-template-rows: 100%;\r\n }\r\n\r\n .port-label {\r\n align-items: center;\r\n }\r\n\r\n .inputsContainer {\r\n grid-row: 1;\r\n grid-column: 1;\r\n\r\n .portLine {\r\n grid-template-columns: 12px calc(100% - 15px);\r\n\r\n .port-label {\r\n grid-row: 1;\r\n grid-column: 2;\r\n }\r\n\r\n .port {\r\n grid-row: 1;\r\n grid-column: 1;\r\n transform: translateX(-12px);\r\n }\r\n }\r\n }\r\n\r\n .outputsContainer {\r\n grid-row: 1;\r\n grid-column: 2;\r\n\r\n .portLine {\r\n grid-template-columns: calc(100% - 10px) 12px;\r\n\r\n .port-label {\r\n grid-row: 1;\r\n grid-column: 1;\r\n text-align: right;\r\n }\r\n\r\n .port {\r\n grid-row: 1;\r\n grid-column: 2;\r\n transform: translateX(2px);\r\n }\r\n }\r\n }\r\n\r\n #graph-container {\r\n width: 100%;\r\n height: 100%;\r\n left: 0;\r\n top: 0;\r\n transform-origin: left top;\r\n display: grid;\r\n grid-template-rows: 100%;\r\n grid-template-columns: 100%;\r\n\r\n #frame-container {\r\n overflow: visible;\r\n grid-row: 1;\r\n grid-column: 1;\r\n position: relative;\r\n width: 100%;\r\n height: 100%;\r\n }\r\n\r\n .frame-box {\r\n position: absolute;\r\n background: rgba(72, 72, 72, 0.7);\r\n display: grid;\r\n grid-template-rows: 40px calc(100% - 40px);\r\n grid-template-columns: 100%;\r\n box-sizing: border-box;\r\n\r\n &.collapsed {\r\n height: auto !important;\r\n width: 200px !important;\r\n z-index: 3;\r\n\r\n .frame-box-header {\r\n font-size: 16px;\r\n grid-template-columns: calc(100% - 37px) 30px 7px;\r\n\r\n .frame-box-header-collapse {\r\n margin-top: -2px;\r\n }\r\n\r\n .frame-box-header-close {\r\n display: none;\r\n }\r\n }\r\n\r\n .frame-comments.has-comments {\r\n .frame-comment-span {\r\n white-space: nowrap;\r\n text-overflow: ellipsis;\r\n overflow: hidden;\r\n }\r\n }\r\n }\r\n\r\n .frame-box-border {\r\n grid-row: 1 / span 2;\r\n grid-column: 1;\r\n width: 100%;\r\n height: 100%;\r\n border: transparent solid 4px;\r\n pointer-events: none;\r\n box-sizing: border-box;\r\n }\r\n\r\n .frame-box-header {\r\n grid-row: 1;\r\n grid-column: 1;\r\n background: rgba(72, 72, 72, 1);\r\n color: white;\r\n font-size: 24px;\r\n text-align: center;\r\n display: grid;\r\n grid-template-rows: 100%;\r\n grid-template-columns: calc(100% - 74px) 30px 7px 30px 7px;\r\n align-content: center;\r\n overflow: hidden;\r\n\r\n .frame-box-header-button {\r\n cursor: pointer;\r\n align-self: center;\r\n transform-origin: 50% 50%;\r\n transform: scale(1);\r\n stroke: transparent;\r\n fill: white;\r\n display: grid;\r\n\r\n &.down {\r\n transform: scale(0.9);\r\n }\r\n }\r\n\r\n .frame-box-header-collapse {\r\n grid-column: 2;\r\n grid-row: 1;\r\n }\r\n\r\n .frame-box-header-close {\r\n grid-column: 4;\r\n grid-row: 1;\r\n }\r\n\r\n .frame-box-header-title {\r\n grid-column: 1;\r\n grid-row: 1;\r\n display: grid;\r\n height: 100%;\r\n width: 100%;\r\n align-self: stretch;\r\n align-items: center;\r\n margin-top: -2px;\r\n }\r\n }\r\n\r\n .port-container {\r\n margin-top: 6px;\r\n margin-bottom: 6px;\r\n margin-left: 4px;\r\n margin-right: 4px;\r\n color: white;\r\n grid-row: 2;\r\n grid-column: 1;\r\n display: grid;\r\n grid-template-rows: 100%;\r\n grid-template-columns: 50% 50%;\r\n z-index: 2;\r\n }\r\n\r\n .frame-comments.has-comments {\r\n display: grid;\r\n grid-row: 2;\r\n grid-column: 1;\r\n padding: 0 10px;\r\n font-style: italic;\r\n word-wrap: break-word;\r\n }\r\n\r\n &.selected {\r\n .frame-box-border {\r\n border-color: white;\r\n }\r\n }\r\n\r\n .right-handle {\r\n grid-area: 1 / 2 / 3 / 2;\r\n width: 4px;\r\n background-color: transparent;\r\n cursor: ew-resize;\r\n\r\n &::after {\r\n content: \"\";\r\n width: 8px;\r\n position: absolute;\r\n top: 0;\r\n bottom: 0;\r\n margin-left: -4px;\r\n cursor: ew-resize;\r\n }\r\n\r\n &.collapsed {\r\n cursor: pointer;\r\n }\r\n }\r\n\r\n .top-right-corner-handle {\r\n background-color: transparent;\r\n height: 4px;\r\n z-index: 21;\r\n cursor: ne-resize;\r\n width: 4px;\r\n margin-left: -6px;\r\n\r\n &::after {\r\n background-color: transparent;\r\n cursor: ne-resize;\r\n margin-left: unset;\r\n top: -4px;\r\n height: 10px;\r\n width: 10px;\r\n }\r\n }\r\n\r\n .bottom-right-corner-handle {\r\n background-color: transparent;\r\n height: 0px;\r\n z-index: 21;\r\n cursor: nw-resize;\r\n grid-area: 4 / 2 / 4 / 2;\r\n margin-left: -2px;\r\n\r\n &::after {\r\n background-color: transparent;\r\n height: 10px;\r\n cursor: nw-resize;\r\n top: unset;\r\n bottom: -4px;\r\n width: 10px;\r\n }\r\n }\r\n\r\n .left-handle {\r\n grid-area: 1 / 1 / 3 / 1;\r\n width: 4px;\r\n background-color: transparent;\r\n cursor: ew-resize;\r\n\r\n &::before {\r\n content: \"\";\r\n width: 8px;\r\n position: absolute;\r\n top: 0;\r\n bottom: 0;\r\n margin-left: -4px;\r\n }\r\n }\r\n\r\n .top-left-corner-handle {\r\n background-color: transparent;\r\n height: 4px;\r\n z-index: 21;\r\n cursor: nw-resize;\r\n width: 4px;\r\n margin-left: -4px;\r\n\r\n &::before {\r\n background-color: transparent;\r\n cursor: nw-resize;\r\n margin-left: unset;\r\n top: -4px;\r\n height: 10px;\r\n width: 10px;\r\n }\r\n }\r\n\r\n .bottom-left-corner-handle {\r\n background-color: transparent;\r\n height: 0px;\r\n z-index: 21;\r\n cursor: sw-resize;\r\n grid-area: 4 / 1 / 4 / 1;\r\n\r\n &::before {\r\n background-color: transparent;\r\n height: 10px;\r\n cursor: sw-resize;\r\n top: unset;\r\n bottom: -4px;\r\n width: 10px;\r\n }\r\n }\r\n\r\n .top-handle {\r\n grid-area: 1 / 1 / 1 / 1;\r\n background-color: transparent;\r\n height: 4px;\r\n cursor: ns-resize;\r\n\r\n &::before {\r\n content: \"\";\r\n width: 100%;\r\n position: absolute;\r\n top: -4px;\r\n bottom: 100%;\r\n right: 0;\r\n left: 0;\r\n margin-bottom: -8px;\r\n cursor: ns-resize;\r\n height: 8px;\r\n }\r\n }\r\n\r\n .bottom-handle {\r\n grid-area: 3 / 1 / 3 / 1;\r\n background-color: transparent;\r\n height: 4px;\r\n cursor: ns-resize;\r\n\r\n &::after {\r\n content: \"\";\r\n width: 100%;\r\n position: absolute;\r\n top: 100%;\r\n bottom: 0;\r\n right: 0;\r\n left: 0;\r\n margin-top: -8px;\r\n cursor: ns-resize;\r\n height: 12px;\r\n }\r\n }\r\n\r\n &.collapsed {\r\n .top-handle,\r\n .top-right-corner-handle,\r\n .right-handle,\r\n .bottom-right-corner-handle,\r\n .bottom-handle,\r\n .bottom-left-corner-handle,\r\n .left-handle,\r\n .top-left-corner-handle {\r\n cursor: default;\r\n }\r\n\r\n .right-handle,\r\n .bottom-handle,\r\n .top-right-corner-handle,\r\n .bottom-right-corner-handle {\r\n &::after {\r\n cursor: default;\r\n }\r\n }\r\n\r\n .left-handle,\r\n .top-handle,\r\n .top-left-corner-handle,\r\n .bottom-left-corner-handle {\r\n &::before {\r\n cursor: default;\r\n }\r\n }\r\n }\r\n }\r\n\r\n #graph-svg-container {\r\n grid-row: 1;\r\n grid-column: 1;\r\n position: relative;\r\n width: 100%;\r\n height: 100%;\r\n overflow: visible;\r\n pointer-events: none;\r\n z-index: 2;\r\n\r\n .link {\r\n stroke-width: 4px;\r\n &.selected {\r\n stroke: white !important;\r\n stroke-dasharray: 10, 2;\r\n }\r\n\r\n &.hidden {\r\n display: none;\r\n }\r\n }\r\n\r\n .selection-link {\r\n pointer-events: all;\r\n stroke-width: 16px;\r\n opacity: 0;\r\n transition: opacity 75ms;\r\n stroke: transparent;\r\n cursor: pointer;\r\n\r\n &.hidden {\r\n display: none;\r\n }\r\n\r\n &:hover,\r\n &.selected {\r\n stroke: white !important;\r\n opacity: 0.4;\r\n }\r\n }\r\n }\r\n\r\n #graph-canvas-container {\r\n grid-row: 1;\r\n grid-column: 1;\r\n position: relative;\r\n width: 100%;\r\n height: 100%;\r\n\r\n .visual {\r\n z-index: 4;\r\n width: 200px;\r\n position: absolute;\r\n left: 0;\r\n top: 0;\r\n background: gray;\r\n border: 4px solid black;\r\n border-radius: 12px;\r\n display: grid;\r\n grid-template-rows: 30px auto;\r\n grid-template-columns: 100%;\r\n color: white;\r\n\r\n &.elbow-block {\r\n width: 40px;\r\n grid-template-rows: 0px 40px 0px;\r\n border: 0;\r\n border-radius: 40px;\r\n transform: translateY(-7px);\r\n\r\n .selection-border {\r\n border-radius: 40px;\r\n }\r\n\r\n .header-container {\r\n display: none;\r\n }\r\n\r\n .connections {\r\n transform: translateY(7px);\r\n }\r\n\r\n .content {\r\n display: none;\r\n }\r\n }\r\n\r\n &.hidden {\r\n display: none;\r\n }\r\n\r\n .comments {\r\n position: absolute;\r\n top: -50px;\r\n width: 200px;\r\n height: 45px;\r\n overflow: hidden;\r\n font-style: italic;\r\n opacity: 0.8;\r\n display: grid;\r\n align-items: flex-end;\r\n pointer-events: none;\r\n }\r\n\r\n .selection-border {\r\n grid-row: 1 / span 3;\r\n grid-column: 1;\r\n margin: -4px;\r\n\r\n transition: border-color 100ms;\r\n\r\n border: 4px solid black;\r\n border-radius: 12px;\r\n transform: scale(1);\r\n }\r\n\r\n &.selected {\r\n .selection-border {\r\n border: 4px solid white;\r\n }\r\n }\r\n\r\n .header-container {\r\n grid-row: 1;\r\n grid-column: 1;\r\n display: grid;\r\n grid-template-columns: 1fr auto;\r\n grid-template-rows: 100%;\r\n border: 4px solid black;\r\n border-top-right-radius: 7px;\r\n border-top-left-radius: 7px;\r\n background: black;\r\n color: white;\r\n transform: scaleX(1.01) translateY(-0.5px);\r\n transform-origin: center;\r\n\r\n &.constant {\r\n border-color: #464348;\r\n background: #464348;\r\n }\r\n\r\n &.inspector {\r\n border-color: #66491b;\r\n background: #66491b;\r\n }\r\n }\r\n\r\n .warning {\r\n grid-row: 1;\r\n grid-column: 1;\r\n display: none;\r\n z-index: 10;\r\n justify-self: end;\r\n align-self: center;\r\n margin-right: 5px;\r\n\r\n &.visible {\r\n display: grid;\r\n width: 20px;\r\n }\r\n }\r\n\r\n .header {\r\n grid-row: 1;\r\n grid-column: 1;\r\n font-size: 16px;\r\n text-align: center;\r\n margin-top: -1px;\r\n margin-left: -1px;\r\n margin-right: -1px;\r\n white-space: nowrap;\r\n text-overflow: ellipsis;\r\n overflow: hidden;\r\n }\r\n\r\n .connections {\r\n grid-row: 2;\r\n grid-column: 1;\r\n\r\n display: grid;\r\n grid-template-columns: 50% 50%;\r\n transform: scale(1);\r\n }\r\n\r\n .content {\r\n min-height: 20px;\r\n grid-row: 3;\r\n grid-column: 1;\r\n\r\n &.input-block {\r\n grid-row: 2;\r\n min-height: 34px;\r\n text-align: center;\r\n font-size: 18px;\r\n font-weight: bold;\r\n margin: 0 10px 5px;\r\n display: grid;\r\n align-content: center;\r\n\r\n &.small-font {\r\n font-size: 17px;\r\n }\r\n }\r\n\r\n &.output-block {\r\n min-height: 0px;\r\n height: 5px;\r\n }\r\n\r\n &.clamp-block {\r\n grid-row: 2;\r\n height: 34px;\r\n text-align: center;\r\n font-size: 18px;\r\n font-weight: bold;\r\n margin: 0 10px;\r\n }\r\n\r\n &.gradient-block {\r\n grid-row: 2;\r\n height: 34px;\r\n }\r\n\r\n &.texture-block {\r\n grid-row: 2;\r\n height: 140px;\r\n width: 140px;\r\n overflow: hidden;\r\n border-bottom-left-radius: 7px;\r\n border: black 4px solid;\r\n border-left: 0px;\r\n border-bottom: 0px;\r\n\r\n img {\r\n width: 100%;\r\n height: 100%;\r\n pointer-events: none;\r\n\r\n &.empty {\r\n display: none;\r\n }\r\n }\r\n }\r\n\r\n &.image-source-block {\r\n margin-top: 5px;\r\n }\r\n\r\n &.regular-texture-block {\r\n margin-top: 60px;\r\n }\r\n\r\n &.reduced-texture-block {\r\n margin-top: 30px;\r\n }\r\n\r\n &.reflection-block {\r\n grid-row: 3;\r\n }\r\n\r\n &.remap-block {\r\n height: 34px;\r\n text-align: center;\r\n font-size: 18px;\r\n font-weight: bold;\r\n margin: 0 10px;\r\n }\r\n\r\n &.trigonometry-block {\r\n grid-row: 2;\r\n height: 34px;\r\n text-align: center;\r\n font-size: 18px;\r\n font-weight: bold;\r\n margin: 0 10px;\r\n }\r\n }\r\n }\r\n }\r\n }\r\n}\r\n"],"sourceRoot":""}]);
|
|
62
|
+
___CSS_LOADER_EXPORT___.push([module.id, "#graph-canvas {\n width: 100%;\n height: 100%;\n margin: 0;\n padding: 0;\n font: 14px \"acumin-pro\";\n user-select: none;\n overflow: hidden;\n cursor: move;\n background-image: linear-gradient(to right, #4f4e4f 1px, transparent 1px), linear-gradient(to bottom, #4f4e4f 1px, transparent 1px); }\n #graph-canvas #selection-container {\n pointer-events: none; }\n #graph-canvas #selection-container .selection-box {\n z-index: 10;\n position: absolute;\n background: rgba(72, 72, 196, 0.5);\n border: blue solid 2px; }\n #graph-canvas .port {\n border-radius: 20px;\n width: 20px;\n height: 20px;\n align-self: center; }\n #graph-canvas .port .img {\n width: 100%; }\n #graph-canvas .port img.selected {\n box-shadow: 0 0 0 2px;\n border-radius: 50%; }\n #graph-canvas .port:hover, #graph-canvas .port.selected {\n filter: brightness(2); }\n #graph-canvas .portLine {\n height: 24px;\n display: grid;\n grid-template-rows: 100%; }\n #graph-canvas .port-label {\n align-items: center; }\n #graph-canvas .inputsContainer {\n grid-row: 1;\n grid-column: 1; }\n #graph-canvas .inputsContainer .portLine {\n grid-template-columns: 12px calc(100% - 15px); }\n #graph-canvas .inputsContainer .portLine .port-label {\n grid-row: 1;\n grid-column: 2; }\n #graph-canvas .inputsContainer .portLine .port {\n grid-row: 1;\n grid-column: 1;\n transform: translateX(-12px); }\n #graph-canvas .outputsContainer {\n grid-row: 1;\n grid-column: 2; }\n #graph-canvas .outputsContainer .portLine {\n grid-template-columns: calc(100% - 10px) 12px; }\n #graph-canvas .outputsContainer .portLine .port-label {\n grid-row: 1;\n grid-column: 1;\n text-align: right; }\n #graph-canvas .outputsContainer .portLine .port {\n grid-row: 1;\n grid-column: 2;\n transform: translateX(2px); }\n #graph-canvas #graph-container {\n width: 100%;\n height: 100%;\n left: 0;\n top: 0;\n transform-origin: left top;\n display: grid;\n grid-template-rows: 100%;\n grid-template-columns: 100%; }\n #graph-canvas #graph-container #frame-container {\n overflow: visible;\n grid-row: 1;\n grid-column: 1;\n position: relative;\n width: 100%;\n height: 100%; }\n #graph-canvas #graph-container .frame-box {\n position: absolute;\n background: rgba(72, 72, 72, 0.7);\n display: grid;\n grid-template-rows: 40px calc(100% - 40px);\n grid-template-columns: 100%;\n box-sizing: border-box; }\n #graph-canvas #graph-container .frame-box.collapsed {\n height: auto !important;\n width: 200px !important;\n z-index: 3; }\n #graph-canvas #graph-container .frame-box.collapsed .frame-box-header {\n font-size: 16px;\n grid-template-columns: calc(100% - 37px) 30px 7px; }\n #graph-canvas #graph-container .frame-box.collapsed .frame-box-header .frame-box-header-collapse {\n margin-top: -2px; }\n #graph-canvas #graph-container .frame-box.collapsed .frame-box-header .frame-box-header-close {\n display: none; }\n #graph-canvas #graph-container .frame-box.collapsed .frame-comments.has-comments .frame-comment-span {\n white-space: nowrap;\n text-overflow: ellipsis;\n overflow: hidden; }\n #graph-canvas #graph-container .frame-box .frame-box-border {\n grid-row: 1 / span 2;\n grid-column: 1;\n width: 100%;\n height: 100%;\n border: transparent solid 4px;\n pointer-events: none;\n box-sizing: border-box; }\n #graph-canvas #graph-container .frame-box .frame-box-header {\n grid-row: 1;\n grid-column: 1;\n background: #484848;\n color: white;\n font-size: 24px;\n text-align: center;\n display: grid;\n grid-template-rows: 100%;\n grid-template-columns: calc(100% - 74px) 30px 7px 30px 7px;\n align-content: center;\n overflow: hidden; }\n #graph-canvas #graph-container .frame-box .frame-box-header .frame-box-header-button {\n cursor: pointer;\n align-self: center;\n transform-origin: 50% 50%;\n transform: scale(1);\n stroke: transparent;\n fill: white;\n display: grid; }\n #graph-canvas #graph-container .frame-box .frame-box-header .frame-box-header-button.down {\n transform: scale(0.9); }\n #graph-canvas #graph-container .frame-box .frame-box-header .frame-box-header-collapse {\n grid-column: 2;\n grid-row: 1; }\n #graph-canvas #graph-container .frame-box .frame-box-header .frame-box-header-close {\n grid-column: 4;\n grid-row: 1; }\n #graph-canvas #graph-container .frame-box .frame-box-header .frame-box-header-title {\n grid-column: 1;\n grid-row: 1;\n display: grid;\n height: 100%;\n width: 100%;\n align-self: stretch;\n align-items: center;\n margin-top: -2px; }\n #graph-canvas #graph-container .frame-box .port-container {\n margin-top: 6px;\n margin-bottom: 6px;\n margin-left: 4px;\n margin-right: 4px;\n color: white;\n grid-row: 2;\n grid-column: 1;\n display: grid;\n grid-template-rows: 100%;\n grid-template-columns: 50% 50%;\n z-index: 2; }\n #graph-canvas #graph-container .frame-box .frame-comments.has-comments {\n display: grid;\n grid-row: 2;\n grid-column: 1;\n padding: 0 10px;\n font-style: italic;\n word-wrap: break-word; }\n #graph-canvas #graph-container .frame-box.selected .frame-box-border {\n border-color: white; }\n #graph-canvas #graph-container .frame-box .right-handle {\n grid-area: 1 / 2 / 3 / 2;\n width: 4px;\n background-color: transparent;\n cursor: ew-resize; }\n #graph-canvas #graph-container .frame-box .right-handle::after {\n content: \"\";\n width: 8px;\n position: absolute;\n top: 0;\n bottom: 0;\n margin-left: -4px;\n cursor: ew-resize; }\n #graph-canvas #graph-container .frame-box .right-handle.collapsed {\n cursor: pointer; }\n #graph-canvas #graph-container .frame-box .top-right-corner-handle {\n background-color: transparent;\n height: 4px;\n z-index: 21;\n cursor: ne-resize;\n width: 4px;\n margin-left: -6px; }\n #graph-canvas #graph-container .frame-box .top-right-corner-handle::after {\n background-color: transparent;\n cursor: ne-resize;\n margin-left: unset;\n top: -4px;\n height: 10px;\n width: 10px; }\n #graph-canvas #graph-container .frame-box .bottom-right-corner-handle {\n background-color: transparent;\n height: 0px;\n z-index: 21;\n cursor: nw-resize;\n grid-area: 4 / 2 / 4 / 2;\n margin-left: -2px; }\n #graph-canvas #graph-container .frame-box .bottom-right-corner-handle::after {\n background-color: transparent;\n height: 10px;\n cursor: nw-resize;\n top: unset;\n bottom: -4px;\n width: 10px; }\n #graph-canvas #graph-container .frame-box .left-handle {\n grid-area: 1 / 1 / 3 / 1;\n width: 4px;\n background-color: transparent;\n cursor: ew-resize; }\n #graph-canvas #graph-container .frame-box .left-handle::before {\n content: \"\";\n width: 8px;\n position: absolute;\n top: 0;\n bottom: 0;\n margin-left: -4px; }\n #graph-canvas #graph-container .frame-box .top-left-corner-handle {\n background-color: transparent;\n height: 4px;\n z-index: 21;\n cursor: nw-resize;\n width: 4px;\n margin-left: -4px; }\n #graph-canvas #graph-container .frame-box .top-left-corner-handle::before {\n background-color: transparent;\n cursor: nw-resize;\n margin-left: unset;\n top: -4px;\n height: 10px;\n width: 10px; }\n #graph-canvas #graph-container .frame-box .bottom-left-corner-handle {\n background-color: transparent;\n height: 0px;\n z-index: 21;\n cursor: sw-resize;\n grid-area: 4 / 1 / 4 / 1; }\n #graph-canvas #graph-container .frame-box .bottom-left-corner-handle::before {\n background-color: transparent;\n height: 10px;\n cursor: sw-resize;\n top: unset;\n bottom: -4px;\n width: 10px; }\n #graph-canvas #graph-container .frame-box .top-handle {\n grid-area: 1 / 1 / 1 / 1;\n background-color: transparent;\n height: 4px;\n cursor: ns-resize; }\n #graph-canvas #graph-container .frame-box .top-handle::before {\n content: \"\";\n width: 100%;\n position: absolute;\n top: -4px;\n bottom: 100%;\n right: 0;\n left: 0;\n margin-bottom: -8px;\n cursor: ns-resize;\n height: 8px; }\n #graph-canvas #graph-container .frame-box .bottom-handle {\n grid-area: 3 / 1 / 3 / 1;\n background-color: transparent;\n height: 4px;\n cursor: ns-resize; }\n #graph-canvas #graph-container .frame-box .bottom-handle::after {\n content: \"\";\n width: 100%;\n position: absolute;\n top: 100%;\n bottom: 0;\n right: 0;\n left: 0;\n margin-top: -8px;\n cursor: ns-resize;\n height: 12px; }\n #graph-canvas #graph-container .frame-box.collapsed .top-handle,\n #graph-canvas #graph-container .frame-box.collapsed .top-right-corner-handle,\n #graph-canvas #graph-container .frame-box.collapsed .right-handle,\n #graph-canvas #graph-container .frame-box.collapsed .bottom-right-corner-handle,\n #graph-canvas #graph-container .frame-box.collapsed .bottom-handle,\n #graph-canvas #graph-container .frame-box.collapsed .bottom-left-corner-handle,\n #graph-canvas #graph-container .frame-box.collapsed .left-handle,\n #graph-canvas #graph-container .frame-box.collapsed .top-left-corner-handle {\n cursor: default; }\n #graph-canvas #graph-container .frame-box.collapsed .right-handle::after,\n #graph-canvas #graph-container .frame-box.collapsed .bottom-handle::after,\n #graph-canvas #graph-container .frame-box.collapsed .top-right-corner-handle::after,\n #graph-canvas #graph-container .frame-box.collapsed .bottom-right-corner-handle::after {\n cursor: default; }\n #graph-canvas #graph-container .frame-box.collapsed .left-handle::before,\n #graph-canvas #graph-container .frame-box.collapsed .top-handle::before,\n #graph-canvas #graph-container .frame-box.collapsed .top-left-corner-handle::before,\n #graph-canvas #graph-container .frame-box.collapsed .bottom-left-corner-handle::before {\n cursor: default; }\n #graph-canvas #graph-container #graph-svg-container {\n grid-row: 1;\n grid-column: 1;\n position: relative;\n width: 100%;\n height: 100%;\n overflow: visible;\n pointer-events: none;\n z-index: 2;\n filter: drop-shadow(7px 6px 2px rgba(0, 0, 0, 0.2)); }\n #graph-canvas #graph-container #graph-svg-container .link {\n stroke-width: 4px; }\n #graph-canvas #graph-container #graph-svg-container .link.selected {\n stroke: white !important;\n stroke-dasharray: 10, 2; }\n #graph-canvas #graph-container #graph-svg-container .link.hidden {\n display: none; }\n #graph-canvas #graph-container #graph-svg-container .selection-link {\n pointer-events: all;\n stroke-width: 16px;\n opacity: 0;\n transition: opacity 75ms;\n stroke: transparent;\n cursor: pointer; }\n #graph-canvas #graph-container #graph-svg-container .selection-link.hidden {\n display: none; }\n #graph-canvas #graph-container #graph-svg-container .selection-link:hover, #graph-canvas #graph-container #graph-svg-container .selection-link.selected {\n stroke: white !important;\n opacity: 0.4; }\n #graph-canvas #graph-container #graph-canvas-container {\n grid-row: 1;\n grid-column: 1;\n position: relative;\n width: 100%;\n height: 100%; }\n #graph-canvas #graph-container #graph-canvas-container .visual {\n z-index: 4;\n width: 200px;\n position: absolute;\n left: 0;\n top: 0;\n background: gray;\n border: 4px solid black;\n border-radius: 12px;\n display: grid;\n grid-template-rows: 30px auto;\n grid-template-columns: 100%;\n color: white;\n box-shadow: 7px 6px 2px rgba(0, 0, 0, 0.2); }\n #graph-canvas #graph-container #graph-canvas-container .visual.elbow-block {\n width: 40px;\n grid-template-rows: 0px 40px 0px;\n border: 0;\n border-radius: 40px;\n transform: translateY(-7px); }\n #graph-canvas #graph-container #graph-canvas-container .visual.elbow-block .selection-border {\n border-radius: 40px; }\n #graph-canvas #graph-container #graph-canvas-container .visual.elbow-block .header-container {\n display: none; }\n #graph-canvas #graph-container #graph-canvas-container .visual.elbow-block .connections {\n transform: translateY(7px); }\n #graph-canvas #graph-container #graph-canvas-container .visual.elbow-block .content {\n display: none; }\n #graph-canvas #graph-container #graph-canvas-container .visual.hidden {\n display: none; }\n #graph-canvas #graph-container #graph-canvas-container .visual .comments {\n position: absolute;\n top: -50px;\n width: 200px;\n height: 45px;\n overflow: hidden;\n font-style: italic;\n opacity: 0.8;\n display: grid;\n align-items: flex-end;\n pointer-events: none; }\n #graph-canvas #graph-container #graph-canvas-container .visual .selection-border {\n grid-row: 1 / span 3;\n grid-column: 1;\n margin: -4px;\n transition: border-color 100ms;\n border: 4px solid black;\n border-radius: 12px;\n transform: scale(1); }\n #graph-canvas #graph-container #graph-canvas-container .visual.selected .selection-border {\n border: 4px solid white; }\n #graph-canvas #graph-container #graph-canvas-container .visual .header-container {\n grid-row: 1;\n grid-column: 1;\n display: grid;\n grid-template-columns: 1fr auto;\n grid-template-rows: 100%;\n border: 4px solid black;\n border-top-right-radius: 7px;\n border-top-left-radius: 7px;\n background: black;\n color: white;\n transform: scaleX(1.01) translateY(-0.5px);\n transform-origin: center; }\n #graph-canvas #graph-container #graph-canvas-container .visual .header-container.constant {\n border-color: #464348;\n background: #464348; }\n #graph-canvas #graph-container #graph-canvas-container .visual .header-container.inspector {\n border-color: #66491b;\n background: #66491b; }\n #graph-canvas #graph-container #graph-canvas-container .visual .headerIcon {\n grid-row: 1;\n grid-column: 1;\n display: none;\n z-index: 10;\n justify-self: end;\n align-self: center;\n margin-right: 5px; }\n #graph-canvas #graph-container #graph-canvas-container .visual .headerIcon.visible {\n display: grid;\n width: 20px; }\n #graph-canvas #graph-container #graph-canvas-container .visual .header {\n grid-row: 1;\n grid-column: 1;\n font-size: 16px;\n text-align: center;\n margin-top: -1px;\n margin-left: -1px;\n margin-right: 20px;\n white-space: nowrap;\n text-overflow: ellipsis;\n overflow: hidden; }\n #graph-canvas #graph-container #graph-canvas-container .visual .connections {\n grid-row: 2;\n grid-column: 1;\n display: grid;\n grid-template-columns: 50% 50%;\n transform: scale(1); }\n #graph-canvas #graph-container #graph-canvas-container .visual .content {\n min-height: 20px;\n grid-row: 3;\n grid-column: 1; }\n #graph-canvas #graph-container #graph-canvas-container .visual .content.input-block {\n grid-row: 2;\n min-height: 34px;\n text-align: center;\n font-size: 18px;\n font-weight: bold;\n margin: 0 10px 5px;\n display: grid;\n align-content: center; }\n #graph-canvas #graph-container #graph-canvas-container .visual .content.input-block.small-font {\n font-size: 17px; }\n #graph-canvas #graph-container #graph-canvas-container .visual .content.output-block {\n min-height: 0px;\n height: 5px; }\n #graph-canvas #graph-container #graph-canvas-container .visual .content.clamp-block {\n grid-row: 2;\n height: 34px;\n text-align: center;\n font-size: 18px;\n font-weight: bold;\n margin: 0 10px; }\n #graph-canvas #graph-container #graph-canvas-container .visual .content.gradient-block {\n grid-row: 2;\n height: 34px; }\n #graph-canvas #graph-container #graph-canvas-container .visual .content.texture-block {\n grid-row: 2;\n height: 140px;\n width: 140px;\n overflow: hidden;\n border-bottom-left-radius: 7px;\n border: black 4px solid;\n border-left: 0px;\n border-bottom: 0px; }\n #graph-canvas #graph-container #graph-canvas-container .visual .content.texture-block img {\n width: 100%;\n height: 100%;\n pointer-events: none; }\n #graph-canvas #graph-container #graph-canvas-container .visual .content.texture-block img.empty {\n display: none; }\n #graph-canvas #graph-container #graph-canvas-container .visual .content.image-source-block {\n margin-top: 5px; }\n #graph-canvas #graph-container #graph-canvas-container .visual .content.regular-texture-block {\n margin-top: 60px; }\n #graph-canvas #graph-container #graph-canvas-container .visual .content.reduced-texture-block {\n margin-top: 30px; }\n #graph-canvas #graph-container #graph-canvas-container .visual .content.reflection-block {\n grid-row: 3; }\n #graph-canvas #graph-container #graph-canvas-container .visual .content.remap-block {\n height: 34px;\n text-align: center;\n font-size: 18px;\n font-weight: bold;\n margin: 0 10px; }\n #graph-canvas #graph-container #graph-canvas-container .visual .content.trigonometry-block {\n grid-row: 2;\n height: 34px;\n text-align: center;\n font-size: 18px;\n font-weight: bold;\n margin: 0 10px; }\n", "",{"version":3,"sources":["webpack://./../../../dev/sharedUiComponents/dist/nodeGraphSystem/scss/graphCanvas.scss"],"names":[],"mappings":"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","sourcesContent":["#graph-canvas {\r\n width: 100%;\r\n height: 100%;\r\n margin: 0;\r\n padding: 0;\r\n font: 14px \"acumin-pro\";\r\n user-select: none;\r\n overflow: hidden;\r\n cursor: move;\r\n background-image: linear-gradient(to right, #4f4e4f 1px, transparent 1px), linear-gradient(to bottom, #4f4e4f 1px, transparent 1px);\r\n\r\n #selection-container {\r\n pointer-events: none;\r\n\r\n .selection-box {\r\n z-index: 10;\r\n position: absolute;\r\n background: rgba(72, 72, 196, 0.5);\r\n border: blue solid 2px;\r\n }\r\n }\r\n\r\n .port {\r\n border-radius: 20px;\r\n width: 20px;\r\n height: 20px;\r\n align-self: center;\r\n\r\n .img {\r\n width: 100%;\r\n }\r\n\r\n img.selected {\r\n box-shadow: 0 0 0 2px;\r\n border-radius: 50%;\r\n }\r\n\r\n &:hover,\r\n &.selected {\r\n filter: brightness(2);\r\n }\r\n }\r\n\r\n .portLine {\r\n height: 24px;\r\n display: grid;\r\n grid-template-rows: 100%;\r\n }\r\n\r\n .port-label {\r\n align-items: center;\r\n }\r\n\r\n .inputsContainer {\r\n grid-row: 1;\r\n grid-column: 1;\r\n\r\n .portLine {\r\n grid-template-columns: 12px calc(100% - 15px);\r\n\r\n .port-label {\r\n grid-row: 1;\r\n grid-column: 2;\r\n }\r\n\r\n .port {\r\n grid-row: 1;\r\n grid-column: 1;\r\n transform: translateX(-12px);\r\n }\r\n }\r\n }\r\n\r\n .outputsContainer {\r\n grid-row: 1;\r\n grid-column: 2;\r\n\r\n .portLine {\r\n grid-template-columns: calc(100% - 10px) 12px;\r\n\r\n .port-label {\r\n grid-row: 1;\r\n grid-column: 1;\r\n text-align: right;\r\n }\r\n\r\n .port {\r\n grid-row: 1;\r\n grid-column: 2;\r\n transform: translateX(2px);\r\n }\r\n }\r\n }\r\n\r\n #graph-container {\r\n width: 100%;\r\n height: 100%;\r\n left: 0;\r\n top: 0;\r\n transform-origin: left top;\r\n display: grid;\r\n grid-template-rows: 100%;\r\n grid-template-columns: 100%;\r\n\r\n #frame-container {\r\n overflow: visible;\r\n grid-row: 1;\r\n grid-column: 1;\r\n position: relative;\r\n width: 100%;\r\n height: 100%;\r\n }\r\n\r\n .frame-box {\r\n position: absolute;\r\n background: rgba(72, 72, 72, 0.7);\r\n display: grid;\r\n grid-template-rows: 40px calc(100% - 40px);\r\n grid-template-columns: 100%;\r\n box-sizing: border-box;\r\n\r\n &.collapsed {\r\n height: auto !important;\r\n width: 200px !important;\r\n z-index: 3;\r\n\r\n .frame-box-header {\r\n font-size: 16px;\r\n grid-template-columns: calc(100% - 37px) 30px 7px;\r\n\r\n .frame-box-header-collapse {\r\n margin-top: -2px;\r\n }\r\n\r\n .frame-box-header-close {\r\n display: none;\r\n }\r\n }\r\n\r\n .frame-comments.has-comments {\r\n .frame-comment-span {\r\n white-space: nowrap;\r\n text-overflow: ellipsis;\r\n overflow: hidden;\r\n }\r\n }\r\n }\r\n\r\n .frame-box-border {\r\n grid-row: 1 / span 2;\r\n grid-column: 1;\r\n width: 100%;\r\n height: 100%;\r\n border: transparent solid 4px;\r\n pointer-events: none;\r\n box-sizing: border-box;\r\n }\r\n\r\n .frame-box-header {\r\n grid-row: 1;\r\n grid-column: 1;\r\n background: rgba(72, 72, 72, 1);\r\n color: white;\r\n font-size: 24px;\r\n text-align: center;\r\n display: grid;\r\n grid-template-rows: 100%;\r\n grid-template-columns: calc(100% - 74px) 30px 7px 30px 7px;\r\n align-content: center;\r\n overflow: hidden;\r\n\r\n .frame-box-header-button {\r\n cursor: pointer;\r\n align-self: center;\r\n transform-origin: 50% 50%;\r\n transform: scale(1);\r\n stroke: transparent;\r\n fill: white;\r\n display: grid;\r\n\r\n &.down {\r\n transform: scale(0.9);\r\n }\r\n }\r\n\r\n .frame-box-header-collapse {\r\n grid-column: 2;\r\n grid-row: 1;\r\n }\r\n\r\n .frame-box-header-close {\r\n grid-column: 4;\r\n grid-row: 1;\r\n }\r\n\r\n .frame-box-header-title {\r\n grid-column: 1;\r\n grid-row: 1;\r\n display: grid;\r\n height: 100%;\r\n width: 100%;\r\n align-self: stretch;\r\n align-items: center;\r\n margin-top: -2px;\r\n }\r\n }\r\n\r\n .port-container {\r\n margin-top: 6px;\r\n margin-bottom: 6px;\r\n margin-left: 4px;\r\n margin-right: 4px;\r\n color: white;\r\n grid-row: 2;\r\n grid-column: 1;\r\n display: grid;\r\n grid-template-rows: 100%;\r\n grid-template-columns: 50% 50%;\r\n z-index: 2;\r\n }\r\n\r\n .frame-comments.has-comments {\r\n display: grid;\r\n grid-row: 2;\r\n grid-column: 1;\r\n padding: 0 10px;\r\n font-style: italic;\r\n word-wrap: break-word;\r\n }\r\n\r\n &.selected {\r\n .frame-box-border {\r\n border-color: white;\r\n }\r\n }\r\n\r\n .right-handle {\r\n grid-area: 1 / 2 / 3 / 2;\r\n width: 4px;\r\n background-color: transparent;\r\n cursor: ew-resize;\r\n\r\n &::after {\r\n content: \"\";\r\n width: 8px;\r\n position: absolute;\r\n top: 0;\r\n bottom: 0;\r\n margin-left: -4px;\r\n cursor: ew-resize;\r\n }\r\n\r\n &.collapsed {\r\n cursor: pointer;\r\n }\r\n }\r\n\r\n .top-right-corner-handle {\r\n background-color: transparent;\r\n height: 4px;\r\n z-index: 21;\r\n cursor: ne-resize;\r\n width: 4px;\r\n margin-left: -6px;\r\n\r\n &::after {\r\n background-color: transparent;\r\n cursor: ne-resize;\r\n margin-left: unset;\r\n top: -4px;\r\n height: 10px;\r\n width: 10px;\r\n }\r\n }\r\n\r\n .bottom-right-corner-handle {\r\n background-color: transparent;\r\n height: 0px;\r\n z-index: 21;\r\n cursor: nw-resize;\r\n grid-area: 4 / 2 / 4 / 2;\r\n margin-left: -2px;\r\n\r\n &::after {\r\n background-color: transparent;\r\n height: 10px;\r\n cursor: nw-resize;\r\n top: unset;\r\n bottom: -4px;\r\n width: 10px;\r\n }\r\n }\r\n\r\n .left-handle {\r\n grid-area: 1 / 1 / 3 / 1;\r\n width: 4px;\r\n background-color: transparent;\r\n cursor: ew-resize;\r\n\r\n &::before {\r\n content: \"\";\r\n width: 8px;\r\n position: absolute;\r\n top: 0;\r\n bottom: 0;\r\n margin-left: -4px;\r\n }\r\n }\r\n\r\n .top-left-corner-handle {\r\n background-color: transparent;\r\n height: 4px;\r\n z-index: 21;\r\n cursor: nw-resize;\r\n width: 4px;\r\n margin-left: -4px;\r\n\r\n &::before {\r\n background-color: transparent;\r\n cursor: nw-resize;\r\n margin-left: unset;\r\n top: -4px;\r\n height: 10px;\r\n width: 10px;\r\n }\r\n }\r\n\r\n .bottom-left-corner-handle {\r\n background-color: transparent;\r\n height: 0px;\r\n z-index: 21;\r\n cursor: sw-resize;\r\n grid-area: 4 / 1 / 4 / 1;\r\n\r\n &::before {\r\n background-color: transparent;\r\n height: 10px;\r\n cursor: sw-resize;\r\n top: unset;\r\n bottom: -4px;\r\n width: 10px;\r\n }\r\n }\r\n\r\n .top-handle {\r\n grid-area: 1 / 1 / 1 / 1;\r\n background-color: transparent;\r\n height: 4px;\r\n cursor: ns-resize;\r\n\r\n &::before {\r\n content: \"\";\r\n width: 100%;\r\n position: absolute;\r\n top: -4px;\r\n bottom: 100%;\r\n right: 0;\r\n left: 0;\r\n margin-bottom: -8px;\r\n cursor: ns-resize;\r\n height: 8px;\r\n }\r\n }\r\n\r\n .bottom-handle {\r\n grid-area: 3 / 1 / 3 / 1;\r\n background-color: transparent;\r\n height: 4px;\r\n cursor: ns-resize;\r\n\r\n &::after {\r\n content: \"\";\r\n width: 100%;\r\n position: absolute;\r\n top: 100%;\r\n bottom: 0;\r\n right: 0;\r\n left: 0;\r\n margin-top: -8px;\r\n cursor: ns-resize;\r\n height: 12px;\r\n }\r\n }\r\n\r\n &.collapsed {\r\n .top-handle,\r\n .top-right-corner-handle,\r\n .right-handle,\r\n .bottom-right-corner-handle,\r\n .bottom-handle,\r\n .bottom-left-corner-handle,\r\n .left-handle,\r\n .top-left-corner-handle {\r\n cursor: default;\r\n }\r\n\r\n .right-handle,\r\n .bottom-handle,\r\n .top-right-corner-handle,\r\n .bottom-right-corner-handle {\r\n &::after {\r\n cursor: default;\r\n }\r\n }\r\n\r\n .left-handle,\r\n .top-handle,\r\n .top-left-corner-handle,\r\n .bottom-left-corner-handle {\r\n &::before {\r\n cursor: default;\r\n }\r\n }\r\n }\r\n }\r\n\r\n #graph-svg-container {\r\n grid-row: 1;\r\n grid-column: 1;\r\n position: relative;\r\n width: 100%;\r\n height: 100%;\r\n overflow: visible;\r\n pointer-events: none;\r\n z-index: 2;\r\n filter: drop-shadow(7px 6px 2px rgba(0, 0, 0, 0.2));\r\n\r\n .link {\r\n stroke-width: 4px;\r\n &.selected {\r\n stroke: white !important;\r\n stroke-dasharray: 10, 2;\r\n }\r\n\r\n &.hidden {\r\n display: none;\r\n }\r\n }\r\n\r\n .selection-link {\r\n pointer-events: all;\r\n stroke-width: 16px;\r\n opacity: 0;\r\n transition: opacity 75ms;\r\n stroke: transparent;\r\n cursor: pointer;\r\n\r\n &.hidden {\r\n display: none;\r\n }\r\n\r\n &:hover,\r\n &.selected {\r\n stroke: white !important;\r\n opacity: 0.4;\r\n }\r\n }\r\n }\r\n\r\n #graph-canvas-container {\r\n grid-row: 1;\r\n grid-column: 1;\r\n position: relative;\r\n width: 100%;\r\n height: 100%;\r\n\r\n .visual {\r\n z-index: 4;\r\n width: 200px;\r\n position: absolute;\r\n left: 0;\r\n top: 0;\r\n background: gray;\r\n border: 4px solid black;\r\n border-radius: 12px;\r\n display: grid;\r\n grid-template-rows: 30px auto;\r\n grid-template-columns: 100%;\r\n color: white;\r\n box-shadow: 7px 6px 2px rgba(0, 0, 0, 0.2);\r\n\r\n &.elbow-block {\r\n width: 40px;\r\n grid-template-rows: 0px 40px 0px;\r\n border: 0;\r\n border-radius: 40px;\r\n transform: translateY(-7px);\r\n\r\n .selection-border {\r\n border-radius: 40px;\r\n }\r\n\r\n .header-container {\r\n display: none;\r\n }\r\n\r\n .connections {\r\n transform: translateY(7px);\r\n }\r\n\r\n .content {\r\n display: none;\r\n }\r\n }\r\n\r\n &.hidden {\r\n display: none;\r\n }\r\n\r\n .comments {\r\n position: absolute;\r\n top: -50px;\r\n width: 200px;\r\n height: 45px;\r\n overflow: hidden;\r\n font-style: italic;\r\n opacity: 0.8;\r\n display: grid;\r\n align-items: flex-end;\r\n pointer-events: none;\r\n }\r\n\r\n .selection-border {\r\n grid-row: 1 / span 3;\r\n grid-column: 1;\r\n margin: -4px;\r\n\r\n transition: border-color 100ms;\r\n\r\n border: 4px solid black;\r\n border-radius: 12px;\r\n transform: scale(1);\r\n }\r\n\r\n &.selected {\r\n .selection-border {\r\n border: 4px solid white;\r\n }\r\n }\r\n\r\n .header-container {\r\n grid-row: 1;\r\n grid-column: 1;\r\n display: grid;\r\n grid-template-columns: 1fr auto;\r\n grid-template-rows: 100%;\r\n border: 4px solid black;\r\n border-top-right-radius: 7px;\r\n border-top-left-radius: 7px;\r\n background: black;\r\n color: white;\r\n transform: scaleX(1.01) translateY(-0.5px);\r\n transform-origin: center;\r\n\r\n &.constant {\r\n border-color: #464348;\r\n background: #464348;\r\n }\r\n\r\n &.inspector {\r\n border-color: #66491b;\r\n background: #66491b;\r\n }\r\n }\r\n\r\n .headerIcon {\r\n grid-row: 1;\r\n grid-column: 1;\r\n display: none;\r\n z-index: 10;\r\n justify-self: end;\r\n align-self: center;\r\n margin-right: 5px;\r\n\r\n &.visible {\r\n display: grid;\r\n width: 20px;\r\n }\r\n }\r\n\r\n .header {\r\n grid-row: 1;\r\n grid-column: 1;\r\n font-size: 16px;\r\n text-align: center;\r\n margin-top: -1px;\r\n margin-left: -1px;\r\n margin-right: 20px;\r\n white-space: nowrap;\r\n text-overflow: ellipsis;\r\n overflow: hidden;\r\n }\r\n\r\n .connections {\r\n grid-row: 2;\r\n grid-column: 1;\r\n\r\n display: grid;\r\n grid-template-columns: 50% 50%;\r\n transform: scale(1);\r\n }\r\n\r\n .content {\r\n min-height: 20px;\r\n grid-row: 3;\r\n grid-column: 1;\r\n\r\n &.input-block {\r\n grid-row: 2;\r\n min-height: 34px;\r\n text-align: center;\r\n font-size: 18px;\r\n font-weight: bold;\r\n margin: 0 10px 5px;\r\n display: grid;\r\n align-content: center;\r\n\r\n &.small-font {\r\n font-size: 17px;\r\n }\r\n }\r\n\r\n &.output-block {\r\n min-height: 0px;\r\n height: 5px;\r\n }\r\n\r\n &.clamp-block {\r\n grid-row: 2;\r\n height: 34px;\r\n text-align: center;\r\n font-size: 18px;\r\n font-weight: bold;\r\n margin: 0 10px;\r\n }\r\n\r\n &.gradient-block {\r\n grid-row: 2;\r\n height: 34px;\r\n }\r\n\r\n &.texture-block {\r\n grid-row: 2;\r\n height: 140px;\r\n width: 140px;\r\n overflow: hidden;\r\n border-bottom-left-radius: 7px;\r\n border: black 4px solid;\r\n border-left: 0px;\r\n border-bottom: 0px;\r\n\r\n img {\r\n width: 100%;\r\n height: 100%;\r\n pointer-events: none;\r\n\r\n &.empty {\r\n display: none;\r\n }\r\n }\r\n }\r\n\r\n &.image-source-block {\r\n margin-top: 5px;\r\n }\r\n\r\n &.regular-texture-block {\r\n margin-top: 60px;\r\n }\r\n\r\n &.reduced-texture-block {\r\n margin-top: 30px;\r\n }\r\n\r\n &.reflection-block {\r\n grid-row: 3;\r\n }\r\n\r\n &.remap-block {\r\n height: 34px;\r\n text-align: center;\r\n font-size: 18px;\r\n font-weight: bold;\r\n margin: 0 10px;\r\n }\r\n\r\n &.trigonometry-block {\r\n grid-row: 2;\r\n height: 34px;\r\n text-align: center;\r\n font-size: 18px;\r\n font-weight: bold;\r\n margin: 0 10px;\r\n }\r\n }\r\n }\r\n }\r\n }\r\n}\r\n"],"sourceRoot":""}]);
|
|
63
63
|
// Exports
|
|
64
64
|
___CSS_LOADER_EXPORT___.locals = {};
|
|
65
65
|
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (___CSS_LOADER_EXPORT___);
|
|
@@ -143,7 +143,7 @@ __webpack_require__.r(__webpack_exports__);
|
|
|
143
143
|
|
|
144
144
|
var ___CSS_LOADER_EXPORT___ = _node_modules_css_loader_dist_runtime_api_js__WEBPACK_IMPORTED_MODULE_1___default()((_node_modules_css_loader_dist_runtime_sourceMaps_js__WEBPACK_IMPORTED_MODULE_0___default()));
|
|
145
145
|
// Module
|
|
146
|
-
___CSS_LOADER_EXPORT___.push([module.id, ".right-panel #propertyTab {\n color: white;\n background: #333333; }\n .right-panel #propertyTab #header {\n height: 30px;\n font-size: 16px;\n color: white;\n background: #222222;\n grid-row: 1;\n text-align: center;\n display: grid;\n grid-template-columns: 30px 1fr;\n -webkit-user-select: none;\n -moz-user-select: none;\n -ms-user-select: none;\n user-select: none; }\n .right-panel #propertyTab #header #logo {\n position: relative;\n grid-column: 1;\n width: 24px;\n height: 24px;\n left: 0;\n display: flex;\n align-self: center;\n justify-self: center; }\n .right-panel #propertyTab #header #title {\n grid-column: 2;\n display: grid;\n align-items: center;\n text-align: center; }\n .right-panel #propertyTab .range {\n -webkit-appearance: none;\n width: 120px;\n height: 6px;\n background: #d3d3d3;\n border-radius: 5px;\n outline: none;\n opacity: 0.7;\n -webkit-transition: 0.2s;\n transition: opacity 0.2s; }\n .right-panel #propertyTab .range:hover {\n opacity: 1; }\n .right-panel #propertyTab .range::-webkit-slider-thumb {\n -webkit-appearance: none;\n appearance: none;\n width: 14px;\n height: 14px;\n border-radius: 50%;\n background: #337ab7;\n cursor: pointer; }\n .right-panel #propertyTab .range::-moz-range-thumb {\n width: 14px;\n height: 14px;\n border-radius: 50%;\n background: #337ab7;\n cursor: pointer; }\n .right-panel #propertyTab input[type=\"color\"] {\n -webkit-appearance: none;\n border: 1px solid rgba(255, 255, 255, 0.5);\n padding: 0;\n width: 30px;\n height: 20px; }\n .right-panel #propertyTab input[type=\"color\"]::-webkit-color-swatch-wrapper {\n padding: 0; }\n .right-panel #propertyTab input[type=\"color\"]::-webkit-color-swatch {\n border: none; }\n .right-panel #propertyTab .sliderLine {\n padding-left: 5px;\n height: 30px;\n display: grid;\n grid-template-rows: 100%;\n grid-template-columns: 1fr 50px auto; }\n .right-panel #propertyTab .sliderLine .label {\n grid-column: 1;\n display: flex;\n align-items: center; }\n .right-panel #propertyTab .sliderLine .slider {\n grid-column: 3;\n grid-row: 1;\n margin-right: 5px;\n width: 90%;\n display: flex;\n align-items: center; }\n .right-panel #propertyTab .sliderLine .floatLine {\n grid-column: 2;\n padding-left: 5px; }\n .right-panel #propertyTab .sliderLine .floatLine .label {\n grid-column: 1;\n display: flex;\n align-items: center; }\n .right-panel #propertyTab .sliderLine .floatLine .short {\n grid-column: 1;\n display: flex;\n align-items: center; }\n .right-panel #propertyTab .sliderLine .floatLine .short input {\n width: 35px; }\n .right-panel #propertyTab .sliderLine .floatLine .short input::-webkit-outer-spin-button,\n .right-panel #propertyTab .sliderLine .floatLine .short input::-webkit-inner-spin-button {\n -webkit-appearance: none;\n margin: 0; }\n .right-panel #propertyTab .sliderLine .floatLine .short input[type=\"number\"] {\n -moz-appearance: textfield; }\n .right-panel #propertyTab .textInputLine {\n padding-left: 5px;\n height: 30px;\n display: grid;\n grid-template-columns: 1fr 120px auto; }\n .right-panel #propertyTab .textInputLine .label {\n grid-column: 1;\n display: flex;\n align-items: center; }\n .right-panel #propertyTab .textInputLine .value {\n display: flex;\n align-items: center;\n grid-column: 2; }\n .right-panel #propertyTab .textInputLine .value input {\n width: calc(100% - 5px); }\n .right-panel #propertyTab .textInputArea {\n padding-left: 5px;\n height: 50px;\n display: grid;\n grid-template-columns: 1fr 120px; }\n .right-panel #propertyTab .textInputArea .label {\n grid-column: 1;\n display: flex;\n align-items: center; }\n .right-panel #propertyTab .textInputArea textarea {\n width: calc(150% - 5px);\n margin-left: -50%;\n height: 40px;\n resize: none; }\n .right-panel #propertyTab .textInputArea .value {\n display: flex;\n align-items: center;\n grid-column: 2; }\n .right-panel #propertyTab .paneContainer {\n margin-top: 3px;\n display: grid;\n grid-template-rows: 100%;\n grid-template-columns: 100%; }\n .right-panel #propertyTab .paneContainer .paneList {\n border-left: 3px solid transparent; }\n .right-panel #propertyTab .paneContainer:hover .paneList {\n border-left: 3px solid rgba(51, 122, 183, 0.8); }\n .right-panel #propertyTab .paneContainer:hover .paneContainer-content .header .title {\n border-left: 3px solid #337ab7; }\n .right-panel #propertyTab .paneContainer .paneContainer-highlight-border {\n grid-row: 1;\n grid-column: 1;\n opacity: 1;\n border: 3px solid red;\n transition: opacity 250ms;\n pointer-events: none; }\n .right-panel #propertyTab .paneContainer .paneContainer-highlight-border.transparent {\n opacity: 0; }\n .right-panel #propertyTab .paneContainer .paneContainer-content {\n grid-row: 1;\n grid-column: 1; }\n .right-panel #propertyTab .paneContainer .paneContainer-content .header {\n display: grid;\n grid-template-columns: 1fr auto;\n background: #555555;\n height: 30px;\n padding-right: 5px;\n cursor: pointer; }\n .right-panel #propertyTab .paneContainer .paneContainer-content .header .title {\n border-left: 3px solid transparent;\n padding-left: 5px;\n grid-column: 1;\n display: flex;\n align-items: center; }\n .right-panel #propertyTab .paneContainer .paneContainer-content .header .collapse {\n grid-column: 2;\n display: flex;\n align-items: center;\n justify-items: center;\n transform-origin: center; }\n .right-panel #propertyTab .paneContainer .paneContainer-content .header .collapse.closed {\n transform: rotate(180deg); }\n .right-panel #propertyTab .paneContainer .paneContainer-content .paneList > div:not(:last-child) {\n border-bottom: 0.5px solid rgba(255, 255, 255, 0.1); }\n .right-panel #propertyTab .paneContainer .paneContainer-content .fragment > div:not(:last-child) {\n border-bottom: 0.5px solid rgba(255, 255, 255, 0.1); }\n .right-panel #propertyTab .color-picker {\n height: calc(100% - 8px);\n margin: 4px;\n width: calc(100% - 8px); }\n .right-panel #propertyTab .color-picker .color-rect {\n height: calc(100% - 4px);\n border: 2px white solid;\n cursor: pointer;\n min-height: 18px; }\n .right-panel #propertyTab .color-picker .color-picker-cover {\n position: fixed;\n top: 0px;\n right: 0px;\n bottom: 0px;\n left: 0px;\n z-index: 1; }\n .right-panel #propertyTab .color-picker .color-picker-float {\n z-index: 2;\n position: absolute; }\n .right-panel #propertyTab .gradient-step {\n display: grid;\n grid-template-rows: 100%;\n grid-template-columns: 20px 30px 40px auto 20px 30px;\n padding-top: 5px;\n padding-left: 5px;\n padding-bottom: 5px; }\n .right-panel #propertyTab .gradient-step .step {\n grid-row: 1;\n grid-column: 1; }\n .right-panel #propertyTab .gradient-step .color {\n grid-row: 1;\n grid-column: 2;\n cursor: pointer; }\n .right-panel #propertyTab .gradient-step .step-value {\n margin-left: 5px;\n grid-row: 1;\n grid-column: 3;\n text-align: right;\n margin-right: 5px; }\n .right-panel #propertyTab .gradient-step .step-slider {\n grid-row: 1;\n grid-column: 4;\n display: grid;\n justify-content: stretch;\n align-content: center;\n margin-right: -5px;\n padding-left: 12px; }\n .right-panel #propertyTab .gradient-step .step-slider input {\n width: 90%; }\n .right-panel #propertyTab .gradient-step .gradient-copy {\n grid-row: 1;\n grid-column: 5;\n display: grid;\n align-content: center;\n justify-content: center; }\n .right-panel #propertyTab .gradient-step .gradient-copy .img {\n height: 20px;\n width: 20px; }\n .right-panel #propertyTab .gradient-step .gradient-copy .img:hover {\n cursor: pointer; }\n .right-panel #propertyTab .gradient-step .gradient-delete {\n grid-row: 1;\n grid-column: 6;\n display: grid;\n align-content: center;\n justify-content: center; }\n .right-panel #propertyTab .gradient-step .gradient-delete .img {\n height: 20px;\n width: 20px; }\n .right-panel #propertyTab .gradient-step .gradient-delete .img:hover {\n cursor: pointer; }\n .right-panel #propertyTab .floatLine {\n padding-left: 5px;\n height: 30px;\n display: grid;\n grid-template-columns: 1fr 120px; }\n .right-panel #propertyTab .floatLine .label {\n grid-column: 1;\n display: flex;\n align-items: center; }\n .right-panel #propertyTab .floatLine .value {\n grid-column: 2;\n display: flex;\n align-items: center; }\n .right-panel #propertyTab .floatLine .value input {\n width: 110px; }\n .right-panel #propertyTab .floatLine .short {\n grid-column: 2;\n display: flex;\n align-items: center; }\n .right-panel #propertyTab .floatLine .short input {\n width: 27px; }\n .right-panel #propertyTab .floatLine .short input::-webkit-outer-spin-button,\n .right-panel #propertyTab .floatLine .short input::-webkit-inner-spin-button {\n -webkit-appearance: none;\n margin: 0; }\n .right-panel #propertyTab .floatLine .short input[type=\"number\"] {\n -moz-appearance: textfield; }\n .right-panel #propertyTab .vector3Line {\n padding-left: 5px;\n display: grid; }\n .right-panel #propertyTab .vector3Line .firstLine {\n display: grid;\n grid-template-columns: 1fr auto 20px;\n height: 30px; }\n .right-panel #propertyTab .vector3Line .firstLine .label {\n grid-column: 1;\n display: flex;\n align-items: center; }\n .right-panel #propertyTab .vector3Line .firstLine .vector {\n grid-column: 2;\n display: flex;\n align-items: center;\n text-align: right;\n opacity: 0.8; }\n .right-panel #propertyTab .vector3Line .firstLine .expand {\n grid-column: 3;\n display: grid;\n align-items: center;\n justify-items: center;\n cursor: pointer; }\n .right-panel #propertyTab .vector3Line .secondLine {\n display: grid;\n padding-right: 5px;\n border-left: 1px solid #337ab7; }\n .right-panel #propertyTab .vector3Line .secondLine .no-right-margin {\n margin-right: 0; }\n .right-panel #propertyTab .vector3Line .secondLine .numeric {\n display: grid;\n grid-template-columns: 1fr auto; }\n .right-panel #propertyTab .vector3Line .secondLine .numeric-label {\n text-align: right;\n grid-column: 1;\n display: flex;\n align-items: center;\n justify-self: right;\n margin-right: 10px; }\n .right-panel #propertyTab .vector3Line .secondLine .numeric-value {\n width: 120px;\n grid-column: 2;\n display: flex;\n align-items: center;\n border: 1px solid #337ab7; }\n .right-panel #propertyTab .buttonLine {\n height: 30px;\n display: grid;\n align-items: center;\n justify-items: stretch;\n padding-bottom: 5px; }\n .right-panel #propertyTab .buttonLine.disabled {\n opacity: 0.3; }\n .right-panel #propertyTab .buttonLine input[type=\"file\"] {\n display: none; }\n .right-panel #propertyTab .buttonLine .file-upload {\n background: #222222;\n border: 1px solid #337ab7;\n margin: 5px 10px;\n color: white;\n padding: 4px 5px;\n padding-top: 0px;\n opacity: 0.9;\n cursor: pointer;\n text-align: center; }\n .right-panel #propertyTab .buttonLine .file-upload:hover {\n opacity: 1; }\n .right-panel #propertyTab .buttonLine .file-upload:active {\n transform: scale(0.98);\n transform-origin: 0.5 0.5; }\n .right-panel #propertyTab .buttonLine button {\n background: #222222;\n border: 1px solid #337ab7;\n margin: 5px 10px 5px 10px;\n color: white;\n padding: 4px 5px;\n opacity: 0.9; }\n .right-panel #propertyTab .buttonLine button:hover {\n opacity: 1; }\n .right-panel #propertyTab .buttonLine button:active {\n background: #282828; }\n .right-panel #propertyTab .buttonLine button:focus {\n border: 1px solid #337ab7;\n outline: 0px; }\n .right-panel #propertyTab .checkBoxLine {\n padding-left: 5px;\n height: 30px;\n display: grid;\n grid-template-columns: 1fr auto; }\n .right-panel #propertyTab .checkBoxLine .label {\n grid-column: 1;\n display: flex;\n align-items: center; }\n .right-panel #propertyTab .checkBoxLine .checkBox {\n grid-column: 2;\n display: flex;\n align-items: center; }\n .right-panel #propertyTab .checkBoxLine .checkBox .lbl {\n position: relative;\n display: block;\n height: 14px;\n width: 34px;\n margin-right: 5px;\n background: #898989;\n border-radius: 100px;\n cursor: pointer;\n transition: all 0.3s ease; }\n .right-panel #propertyTab .checkBoxLine .checkBox .lbl:after {\n position: absolute;\n left: 3px;\n top: 2px;\n display: block;\n width: 10px;\n height: 10px;\n border-radius: 100px;\n background: #fff;\n box-shadow: 0px 3px 3px rgba(0, 0, 0, 0.05);\n content: \"\";\n transition: all 0.15s ease; }\n .right-panel #propertyTab .checkBoxLine .checkBox .lbl:active:after {\n transform: scale(1.15, 0.85); }\n .right-panel #propertyTab .checkBoxLine .checkBox .cbx:checked ~ label {\n background: #337ab7; }\n .right-panel #propertyTab .checkBoxLine .checkBox .cbx:checked ~ label:after {\n left: 20px;\n background: #164975; }\n .right-panel #propertyTab .checkBoxLine .checkBox .cbx:checked ~ label.disabled {\n background: #164975;\n cursor: pointer; }\n .right-panel #propertyTab .checkBoxLine .checkBox .cbx:checked ~ label.disabled:after {\n left: 20px;\n background: #555555;\n cursor: pointer; }\n .right-panel #propertyTab .checkBoxLine .checkBox .cbx ~ label.disabled {\n background: #555555;\n cursor: pointer; }\n .right-panel #propertyTab .checkBoxLine .checkBox .hidden {\n display: none; }\n .right-panel #propertyTab .listLine {\n padding-left: 5px;\n height: 30px;\n display: grid;\n grid-template-columns: 1fr auto; }\n .right-panel #propertyTab .listLine .label {\n grid-column: 1;\n display: flex;\n align-items: center; }\n .right-panel #propertyTab .listLine .options {\n grid-column: 2;\n display: flex;\n align-items: center;\n margin-right: 5px; }\n .right-panel #propertyTab .listLine .options select {\n width: 115px; }\n .right-panel #propertyTab .color3Line {\n padding-left: 5px;\n display: grid; }\n .right-panel #propertyTab .color3Line .firstLine {\n height: 30px;\n display: grid;\n grid-template-columns: 1fr auto 20px 20px; }\n .right-panel #propertyTab .color3Line .firstLine .label {\n grid-column: 1;\n display: flex;\n align-items: center; }\n .right-panel #propertyTab .color3Line .firstLine .color3 {\n grid-column: 2;\n width: 50px;\n display: flex;\n align-items: center; }\n .right-panel #propertyTab .color3Line .firstLine .color3 input {\n margin-right: 5px; }\n .right-panel #propertyTab .color3Line .firstLine .copy {\n grid-column: 3;\n display: grid;\n align-items: center;\n justify-items: center;\n cursor: pointer; }\n .right-panel #propertyTab .color3Line .firstLine .copy img {\n height: 100%;\n width: 20px; }\n .right-panel #propertyTab .color3Line .firstLine .expand {\n grid-column: 4;\n display: grid;\n align-items: center;\n justify-items: center;\n cursor: pointer; }\n .right-panel #propertyTab .color3Line .firstLine .expand img {\n height: 100%;\n width: 20px; }\n .right-panel #propertyTab .color3Line .secondLine {\n display: grid;\n padding-right: 5px;\n border-left: 1px solid #337ab7; }\n .right-panel #propertyTab .color3Line .secondLine .numeric {\n display: grid;\n grid-template-columns: 1fr auto; }\n .right-panel #propertyTab .color3Line .secondLine .numeric-label {\n text-align: right;\n grid-column: 1;\n display: flex;\n align-items: center;\n justify-self: right;\n margin-right: 10px; }\n .right-panel #propertyTab .color3Line .secondLine .numeric-value {\n width: 120px;\n grid-column: 2;\n display: flex;\n align-items: center;\n border: 1px solid #337ab7; }\n .right-panel #propertyTab .textLine {\n padding-left: 5px;\n height: 30px;\n display: grid;\n grid-template-columns: 1fr auto; }\n .right-panel #propertyTab .textLine .label {\n grid-column: 1;\n display: flex;\n align-items: center; }\n .right-panel #propertyTab .textLine .link-value {\n grid-column: 2;\n white-space: nowrap;\n text-overflow: ellipsis;\n overflow: hidden;\n text-align: end;\n opacity: 0.8;\n margin: 5px;\n margin-top: 6px;\n max-width: 140px;\n text-decoration: underline;\n cursor: pointer; }\n .right-panel #propertyTab .textLine .value {\n grid-column: 2;\n white-space: nowrap;\n text-overflow: ellipsis;\n overflow: hidden;\n text-align: end;\n opacity: 0.8;\n margin: 5px;\n margin-top: 6px;\n max-width: 200px;\n -webkit-user-select: text;\n -moz-user-select: text;\n -ms-user-select: text;\n user-select: text; }\n .right-panel #propertyTab .textLine .value.check {\n color: green; }\n .right-panel #propertyTab .textLine .value.uncheck {\n color: red; }\n", "",{"version":3,"sources":["webpack://./../../../tools/nodeEditor/dist/components/propertyTab/propertyTab.scss"],"names":[],"mappings":"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","sourcesContent":[".right-panel {\r\n #propertyTab {\r\n $line-padding-left: 5px;\r\n color: white;\r\n background: #333333;\r\n\r\n #header {\r\n height: 30px;\r\n font-size: 16px;\r\n color: white;\r\n background: #222222;\r\n grid-row: 1;\r\n text-align: center;\r\n display: grid;\r\n grid-template-columns: 30px 1fr;\r\n -webkit-user-select: none;\r\n -moz-user-select: none;\r\n -ms-user-select: none;\r\n user-select: none;\r\n\r\n #logo {\r\n position: relative;\r\n grid-column: 1;\r\n width: 24px;\r\n height: 24px;\r\n left: 0;\r\n display: flex;\r\n align-self: center;\r\n justify-self: center;\r\n }\r\n\r\n #title {\r\n grid-column: 2;\r\n display: grid;\r\n align-items: center;\r\n text-align: center;\r\n }\r\n }\r\n\r\n .range {\r\n -webkit-appearance: none;\r\n width: 120px;\r\n height: 6px;\r\n background: #d3d3d3;\r\n border-radius: 5px;\r\n outline: none;\r\n opacity: 0.7;\r\n -webkit-transition: 0.2s;\r\n transition: opacity 0.2s;\r\n }\r\n\r\n .range:hover {\r\n opacity: 1;\r\n }\r\n\r\n .range::-webkit-slider-thumb {\r\n -webkit-appearance: none;\r\n appearance: none;\r\n width: 14px;\r\n height: 14px;\r\n border-radius: 50%;\r\n background: rgb(51, 122, 183);\r\n cursor: pointer;\r\n }\r\n\r\n .range::-moz-range-thumb {\r\n width: 14px;\r\n height: 14px;\r\n border-radius: 50%;\r\n background: rgb(51, 122, 183);\r\n cursor: pointer;\r\n }\r\n\r\n input[type=\"color\"] {\r\n -webkit-appearance: none;\r\n border: 1px solid rgba(255, 255, 255, 0.5);\r\n padding: 0;\r\n width: 30px;\r\n height: 20px;\r\n }\r\n input[type=\"color\"]::-webkit-color-swatch-wrapper {\r\n padding: 0;\r\n }\r\n input[type=\"color\"]::-webkit-color-swatch {\r\n border: none;\r\n }\r\n\r\n .sliderLine {\r\n padding-left: $line-padding-left;\r\n height: 30px;\r\n display: grid;\r\n grid-template-rows: 100%;\r\n grid-template-columns: 1fr 50px auto;\r\n\r\n .label {\r\n grid-column: 1;\r\n display: flex;\r\n align-items: center;\r\n }\r\n\r\n .slider {\r\n grid-column: 3;\r\n grid-row: 1;\r\n margin-right: 5px;\r\n width: 90%;\r\n display: flex;\r\n align-items: center;\r\n }\r\n\r\n .floatLine {\r\n grid-column: 2;\r\n padding-left: $line-padding-left;\r\n\r\n .label {\r\n grid-column: 1;\r\n display: flex;\r\n align-items: center;\r\n }\r\n\r\n .short {\r\n grid-column: 1;\r\n display: flex;\r\n align-items: center;\r\n\r\n input {\r\n width: 35px;\r\n }\r\n\r\n input::-webkit-outer-spin-button,\r\n input::-webkit-inner-spin-button {\r\n -webkit-appearance: none;\r\n margin: 0;\r\n }\r\n\r\n input[type=\"number\"] {\r\n -moz-appearance: textfield;\r\n }\r\n }\r\n }\r\n }\r\n\r\n .textInputLine {\r\n padding-left: $line-padding-left;\r\n height: 30px;\r\n display: grid;\r\n grid-template-columns: 1fr 120px auto;\r\n\r\n .label {\r\n grid-column: 1;\r\n display: flex;\r\n align-items: center;\r\n }\r\n\r\n .value {\r\n display: flex;\r\n align-items: center;\r\n grid-column: 2;\r\n\r\n input {\r\n width: calc(100% - 5px);\r\n }\r\n }\r\n }\r\n\r\n .textInputArea {\r\n padding-left: $line-padding-left;\r\n height: 50px;\r\n display: grid;\r\n grid-template-columns: 1fr 120px;\r\n\r\n .label {\r\n grid-column: 1;\r\n display: flex;\r\n align-items: center;\r\n }\r\n\r\n textarea {\r\n width: calc(150% - 5px);\r\n margin-left: -50%;\r\n height: 40px;\r\n resize: none;\r\n }\r\n\r\n .value {\r\n display: flex;\r\n align-items: center;\r\n grid-column: 2;\r\n }\r\n }\r\n\r\n .paneContainer {\r\n margin-top: 3px;\r\n display: grid;\r\n grid-template-rows: 100%;\r\n grid-template-columns: 100%;\r\n\r\n .paneList {\r\n border-left: 3px solid transparent;\r\n }\r\n\r\n &:hover {\r\n .paneList {\r\n border-left: 3px solid rgba(51, 122, 183, 0.8);\r\n }\r\n\r\n .paneContainer-content {\r\n .header {\r\n .title {\r\n border-left: 3px solid rgb(51, 122, 183);\r\n }\r\n }\r\n }\r\n }\r\n\r\n .paneContainer-highlight-border {\r\n grid-row: 1;\r\n grid-column: 1;\r\n opacity: 1;\r\n border: 3px solid red;\r\n transition: opacity 250ms;\r\n pointer-events: none;\r\n\r\n &.transparent {\r\n opacity: 0;\r\n }\r\n }\r\n\r\n .paneContainer-content {\r\n grid-row: 1;\r\n grid-column: 1;\r\n\r\n .header {\r\n display: grid;\r\n grid-template-columns: 1fr auto;\r\n background: #555555;\r\n height: 30px;\r\n padding-right: 5px;\r\n cursor: pointer;\r\n\r\n .title {\r\n border-left: 3px solid transparent;\r\n padding-left: 5px;\r\n grid-column: 1;\r\n display: flex;\r\n align-items: center;\r\n }\r\n\r\n .collapse {\r\n grid-column: 2;\r\n display: flex;\r\n align-items: center;\r\n justify-items: center;\r\n transform-origin: center;\r\n\r\n &.closed {\r\n transform: rotate(180deg);\r\n }\r\n }\r\n }\r\n\r\n .paneList > div:not(:last-child) {\r\n border-bottom: 0.5px solid rgba(255, 255, 255, 0.1);\r\n }\r\n\r\n .fragment > div:not(:last-child) {\r\n border-bottom: 0.5px solid rgba(255, 255, 255, 0.1);\r\n }\r\n }\r\n }\r\n\r\n .color-picker {\r\n height: calc(100% - 8px);\r\n margin: 4px;\r\n width: calc(100% - 8px);\r\n\r\n .color-rect {\r\n height: calc(100% - 4px);\r\n border: 2px white solid;\r\n cursor: pointer;\r\n min-height: 18px;\r\n }\r\n\r\n .color-picker-cover {\r\n position: fixed;\r\n top: 0px;\r\n right: 0px;\r\n bottom: 0px;\r\n left: 0px;\r\n z-index: 1;\r\n }\r\n\r\n .color-picker-float {\r\n z-index: 2;\r\n position: absolute;\r\n }\r\n }\r\n\r\n .gradient-step {\r\n display: grid;\r\n grid-template-rows: 100%;\r\n grid-template-columns: 20px 30px 40px auto 20px 30px;\r\n padding-top: 5px;\r\n padding-left: 5px;\r\n padding-bottom: 5px;\r\n\r\n .step {\r\n grid-row: 1;\r\n grid-column: 1;\r\n }\r\n\r\n .color {\r\n grid-row: 1;\r\n grid-column: 2;\r\n cursor: pointer;\r\n }\r\n\r\n .step-value {\r\n margin-left: 5px;\r\n grid-row: 1;\r\n grid-column: 3;\r\n text-align: right;\r\n margin-right: 5px;\r\n }\r\n\r\n .step-slider {\r\n grid-row: 1;\r\n grid-column: 4;\r\n display: grid;\r\n justify-content: stretch;\r\n align-content: center;\r\n margin-right: -5px;\r\n padding-left: 12px;\r\n\r\n input {\r\n width: 90%;\r\n }\r\n }\r\n\r\n .gradient-copy {\r\n grid-row: 1;\r\n grid-column: 5;\r\n display: grid;\r\n align-content: center;\r\n justify-content: center;\r\n\r\n .img {\r\n height: 20px;\r\n width: 20px;\r\n }\r\n .img:hover {\r\n cursor: pointer;\r\n }\r\n }\r\n .gradient-delete {\r\n grid-row: 1;\r\n grid-column: 6;\r\n display: grid;\r\n align-content: center;\r\n justify-content: center;\r\n .img {\r\n height: 20px;\r\n width: 20px;\r\n }\r\n .img:hover {\r\n cursor: pointer;\r\n }\r\n }\r\n }\r\n\r\n .floatLine {\r\n padding-left: $line-padding-left;\r\n height: 30px;\r\n display: grid;\r\n grid-template-columns: 1fr 120px;\r\n\r\n .label {\r\n grid-column: 1;\r\n display: flex;\r\n align-items: center;\r\n }\r\n\r\n .value {\r\n grid-column: 2;\r\n\r\n display: flex;\r\n align-items: center;\r\n\r\n input {\r\n width: 110px;\r\n }\r\n }\r\n\r\n .short {\r\n grid-column: 2;\r\n\r\n display: flex;\r\n align-items: center;\r\n\r\n input {\r\n width: 27px;\r\n }\r\n\r\n input::-webkit-outer-spin-button,\r\n input::-webkit-inner-spin-button {\r\n -webkit-appearance: none;\r\n margin: 0;\r\n }\r\n\r\n input[type=\"number\"] {\r\n -moz-appearance: textfield;\r\n }\r\n }\r\n }\r\n\r\n .vector3Line {\r\n padding-left: $line-padding-left;\r\n display: grid;\r\n\r\n .firstLine {\r\n display: grid;\r\n grid-template-columns: 1fr auto 20px;\r\n height: 30px;\r\n\r\n .label {\r\n grid-column: 1;\r\n display: flex;\r\n align-items: center;\r\n }\r\n\r\n .vector {\r\n grid-column: 2;\r\n display: flex;\r\n align-items: center;\r\n text-align: right;\r\n opacity: 0.8;\r\n }\r\n\r\n .expand {\r\n grid-column: 3;\r\n display: grid;\r\n align-items: center;\r\n justify-items: center;\r\n cursor: pointer;\r\n }\r\n }\r\n\r\n .secondLine {\r\n display: grid;\r\n padding-right: 5px;\r\n border-left: 1px solid rgb(51, 122, 183);\r\n\r\n .no-right-margin {\r\n margin-right: 0;\r\n }\r\n\r\n .numeric {\r\n display: grid;\r\n grid-template-columns: 1fr auto;\r\n }\r\n\r\n .numeric-label {\r\n text-align: right;\r\n grid-column: 1;\r\n display: flex;\r\n align-items: center;\r\n justify-self: right;\r\n margin-right: 10px;\r\n }\r\n\r\n .numeric-value {\r\n width: 120px;\r\n grid-column: 2;\r\n display: flex;\r\n align-items: center;\r\n border: 1px solid rgb(51, 122, 183);\r\n }\r\n }\r\n }\r\n\r\n .buttonLine {\r\n height: 30px;\r\n display: grid;\r\n align-items: center;\r\n justify-items: stretch;\r\n padding-bottom: 5px;\r\n\r\n &.disabled {\r\n opacity: 0.3;\r\n }\r\n\r\n input[type=\"file\"] {\r\n display: none;\r\n }\r\n\r\n .file-upload {\r\n background: #222222;\r\n border: 1px solid rgb(51, 122, 183);\r\n margin: 5px 10px;\r\n color: white;\r\n padding: 4px 5px;\r\n padding-top: 0px;\r\n opacity: 0.9;\r\n cursor: pointer;\r\n text-align: center;\r\n }\r\n\r\n .file-upload:hover {\r\n opacity: 1;\r\n }\r\n\r\n .file-upload:active {\r\n transform: scale(0.98);\r\n transform-origin: 0.5 0.5;\r\n }\r\n\r\n button {\r\n background: #222222;\r\n border: 1px solid rgb(51, 122, 183);\r\n margin: 5px 10px 5px 10px;\r\n color: white;\r\n padding: 4px 5px;\r\n opacity: 0.9;\r\n }\r\n\r\n button:hover {\r\n opacity: 1;\r\n }\r\n\r\n button:active {\r\n background: #282828;\r\n }\r\n\r\n button:focus {\r\n border: 1px solid rgb(51, 122, 183);\r\n outline: 0px;\r\n }\r\n }\r\n\r\n .checkBoxLine {\r\n padding-left: $line-padding-left;\r\n height: 30px;\r\n display: grid;\r\n grid-template-columns: 1fr auto;\r\n\r\n .label {\r\n grid-column: 1;\r\n display: flex;\r\n align-items: center;\r\n }\r\n\r\n .checkBox {\r\n grid-column: 2;\r\n\r\n display: flex;\r\n align-items: center;\r\n\r\n .lbl {\r\n position: relative;\r\n display: block;\r\n height: 14px;\r\n width: 34px;\r\n margin-right: 5px;\r\n background: #898989;\r\n border-radius: 100px;\r\n cursor: pointer;\r\n transition: all 0.3s ease;\r\n }\r\n\r\n .lbl:after {\r\n position: absolute;\r\n left: 3px;\r\n top: 2px;\r\n display: block;\r\n width: 10px;\r\n height: 10px;\r\n border-radius: 100px;\r\n background: #fff;\r\n box-shadow: 0px 3px 3px rgba(0, 0, 0, 0.05);\r\n content: \"\";\r\n transition: all 0.15s ease;\r\n }\r\n\r\n .lbl:active:after {\r\n transform: scale(1.15, 0.85);\r\n }\r\n\r\n .cbx:checked ~ label {\r\n background: rgb(51, 122, 183);\r\n }\r\n\r\n .cbx:checked ~ label:after {\r\n left: 20px;\r\n background: rgb(22, 73, 117);\r\n }\r\n\r\n .cbx:checked ~ label.disabled {\r\n background: rgb(22, 73, 117);\r\n cursor: pointer;\r\n }\r\n\r\n .cbx:checked ~ label.disabled:after {\r\n left: 20px;\r\n background: rgb(85, 85, 85);\r\n cursor: pointer;\r\n }\r\n\r\n .cbx ~ label.disabled {\r\n background: rgb(85, 85, 85);\r\n cursor: pointer;\r\n }\r\n\r\n .hidden {\r\n display: none;\r\n }\r\n }\r\n }\r\n\r\n .listLine {\r\n padding-left: $line-padding-left;\r\n height: 30px;\r\n display: grid;\r\n grid-template-columns: 1fr auto;\r\n\r\n .label {\r\n grid-column: 1;\r\n display: flex;\r\n align-items: center;\r\n }\r\n\r\n .options {\r\n grid-column: 2;\r\n\r\n display: flex;\r\n align-items: center;\r\n margin-right: 5px;\r\n\r\n select {\r\n width: 115px;\r\n }\r\n }\r\n }\r\n\r\n .color3Line {\r\n padding-left: $line-padding-left;\r\n display: grid;\r\n\r\n .firstLine {\r\n height: 30px;\r\n display: grid;\r\n grid-template-columns: 1fr auto 20px 20px;\r\n\r\n .label {\r\n grid-column: 1;\r\n display: flex;\r\n align-items: center;\r\n }\r\n\r\n .color3 {\r\n grid-column: 2;\r\n width: 50px;\r\n\r\n display: flex;\r\n align-items: center;\r\n\r\n input {\r\n margin-right: 5px;\r\n }\r\n }\r\n\r\n .copy {\r\n grid-column: 3;\r\n display: grid;\r\n align-items: center;\r\n justify-items: center;\r\n cursor: pointer;\r\n\r\n img {\r\n height: 100%;\r\n width: 20px;\r\n }\r\n }\r\n\r\n .expand {\r\n grid-column: 4;\r\n display: grid;\r\n align-items: center;\r\n justify-items: center;\r\n cursor: pointer;\r\n\r\n img {\r\n height: 100%;\r\n width: 20px;\r\n }\r\n }\r\n }\r\n\r\n .secondLine {\r\n display: grid;\r\n padding-right: 5px;\r\n border-left: 1px solid rgb(51, 122, 183);\r\n\r\n .numeric {\r\n display: grid;\r\n grid-template-columns: 1fr auto;\r\n }\r\n\r\n .numeric-label {\r\n text-align: right;\r\n grid-column: 1;\r\n display: flex;\r\n align-items: center;\r\n justify-self: right;\r\n margin-right: 10px;\r\n }\r\n\r\n .numeric-value {\r\n width: 120px;\r\n grid-column: 2;\r\n display: flex;\r\n align-items: center;\r\n border: 1px solid rgb(51, 122, 183);\r\n }\r\n }\r\n }\r\n\r\n .textLine {\r\n padding-left: $line-padding-left;\r\n height: 30px;\r\n display: grid;\r\n grid-template-columns: 1fr auto;\r\n\r\n .label {\r\n grid-column: 1;\r\n display: flex;\r\n align-items: center;\r\n }\r\n\r\n .link-value {\r\n grid-column: 2;\r\n white-space: nowrap;\r\n text-overflow: ellipsis;\r\n overflow: hidden;\r\n text-align: end;\r\n opacity: 0.8;\r\n margin: 5px;\r\n margin-top: 6px;\r\n max-width: 140px;\r\n text-decoration: underline;\r\n cursor: pointer;\r\n }\r\n\r\n .value {\r\n grid-column: 2;\r\n white-space: nowrap;\r\n text-overflow: ellipsis;\r\n overflow: hidden;\r\n text-align: end;\r\n opacity: 0.8;\r\n margin: 5px;\r\n margin-top: 6px;\r\n max-width: 200px;\r\n -webkit-user-select: text;\r\n -moz-user-select: text;\r\n -ms-user-select: text;\r\n user-select: text;\r\n\r\n &.check {\r\n color: green;\r\n }\r\n\r\n &.uncheck {\r\n color: red;\r\n }\r\n }\r\n }\r\n }\r\n}\r\n"],"sourceRoot":""}]);
|
|
146
|
+
___CSS_LOADER_EXPORT___.push([module.id, ".right-panel #propertyTab {\n color: white;\n background: #333333; }\n .right-panel #propertyTab #header {\n height: 30px;\n font-size: 16px;\n color: white;\n background: #222222;\n grid-row: 1;\n text-align: center;\n display: grid;\n grid-template-columns: 30px 1fr;\n -webkit-user-select: none;\n -moz-user-select: none;\n -ms-user-select: none;\n user-select: none; }\n .right-panel #propertyTab #header #logo {\n position: relative;\n grid-column: 1;\n width: 24px;\n height: 24px;\n left: 0;\n display: flex;\n align-self: center;\n justify-self: center; }\n .right-panel #propertyTab #header #title {\n grid-column: 2;\n display: grid;\n align-items: center;\n text-align: center; }\n .right-panel #propertyTab .range {\n -webkit-appearance: none;\n width: 120px;\n height: 6px;\n background: #d3d3d3;\n border-radius: 5px;\n outline: none;\n opacity: 0.7;\n -webkit-transition: 0.2s;\n transition: opacity 0.2s; }\n .right-panel #propertyTab .range:hover {\n opacity: 1; }\n .right-panel #propertyTab .range::-webkit-slider-thumb {\n -webkit-appearance: none;\n appearance: none;\n width: 14px;\n height: 14px;\n border-radius: 50%;\n background: #337ab7;\n cursor: pointer; }\n .right-panel #propertyTab .range::-moz-range-thumb {\n width: 14px;\n height: 14px;\n border-radius: 50%;\n background: #337ab7;\n cursor: pointer; }\n .right-panel #propertyTab input[type=\"color\"] {\n -webkit-appearance: none;\n border: 1px solid rgba(255, 255, 255, 0.5);\n padding: 0;\n width: 30px;\n height: 20px; }\n .right-panel #propertyTab input[type=\"color\"]::-webkit-color-swatch-wrapper {\n padding: 0; }\n .right-panel #propertyTab input[type=\"color\"]::-webkit-color-swatch {\n border: none; }\n .right-panel #propertyTab .sliderLine {\n padding-left: 5px;\n height: 30px;\n display: grid;\n grid-template-rows: 100%;\n grid-template-columns: 1fr 50px auto; }\n .right-panel #propertyTab .sliderLine .label {\n grid-column: 1;\n display: flex;\n align-items: center; }\n .right-panel #propertyTab .sliderLine .slider {\n grid-column: 3;\n grid-row: 1;\n margin-right: 5px;\n width: 90%;\n display: flex;\n align-items: center; }\n .right-panel #propertyTab .sliderLine .floatLine {\n grid-column: 2;\n padding-left: 5px; }\n .right-panel #propertyTab .sliderLine .floatLine .label {\n grid-column: 1;\n display: flex;\n align-items: center; }\n .right-panel #propertyTab .sliderLine .floatLine .short {\n grid-column: 1;\n display: flex;\n align-items: center; }\n .right-panel #propertyTab .sliderLine .floatLine .short input {\n width: 35px; }\n .right-panel #propertyTab .sliderLine .floatLine .short input::-webkit-outer-spin-button,\n .right-panel #propertyTab .sliderLine .floatLine .short input::-webkit-inner-spin-button {\n -webkit-appearance: none;\n margin: 0; }\n .right-panel #propertyTab .sliderLine .floatLine .short input[type=\"number\"] {\n -moz-appearance: textfield; }\n .right-panel #propertyTab .textInputLine {\n padding-left: 5px;\n height: 30px;\n display: grid;\n grid-template-columns: 1fr 120px auto; }\n .right-panel #propertyTab .textInputLine .label {\n grid-column: 1;\n display: flex;\n align-items: center; }\n .right-panel #propertyTab .textInputLine .value {\n display: flex;\n align-items: center;\n grid-column: 2; }\n .right-panel #propertyTab .textInputLine .value input {\n width: calc(100% - 5px);\n margin-right: 5px; }\n .right-panel #propertyTab .textInputArea {\n padding-left: 5px;\n height: 50px;\n display: grid;\n grid-template-columns: 1fr 120px; }\n .right-panel #propertyTab .textInputArea .label {\n grid-column: 1;\n display: flex;\n align-items: center; }\n .right-panel #propertyTab .textInputArea textarea {\n margin-right: 5px;\n margin-left: -50%;\n height: 40px;\n resize: none; }\n .right-panel #propertyTab .textInputArea .value {\n display: flex;\n align-items: center;\n grid-column: 2; }\n .right-panel #propertyTab .paneContainer {\n margin-top: 3px;\n display: grid;\n grid-template-rows: 100%;\n grid-template-columns: 100%; }\n .right-panel #propertyTab .paneContainer .paneList {\n border-left: 3px solid transparent; }\n .right-panel #propertyTab .paneContainer:hover .paneList {\n border-left: 3px solid rgba(51, 122, 183, 0.8); }\n .right-panel #propertyTab .paneContainer:hover .paneContainer-content .header .title {\n border-left: 3px solid #337ab7; }\n .right-panel #propertyTab .paneContainer .paneContainer-highlight-border {\n grid-row: 1;\n grid-column: 1;\n opacity: 1;\n border: 3px solid red;\n transition: opacity 250ms;\n pointer-events: none; }\n .right-panel #propertyTab .paneContainer .paneContainer-highlight-border.transparent {\n opacity: 0; }\n .right-panel #propertyTab .paneContainer .paneContainer-content {\n grid-row: 1;\n grid-column: 1; }\n .right-panel #propertyTab .paneContainer .paneContainer-content .header {\n display: grid;\n grid-template-columns: 1fr auto;\n background: #555555;\n height: 30px;\n padding-right: 5px;\n cursor: pointer; }\n .right-panel #propertyTab .paneContainer .paneContainer-content .header .title {\n border-left: 3px solid transparent;\n padding-left: 5px;\n grid-column: 1;\n display: flex;\n align-items: center; }\n .right-panel #propertyTab .paneContainer .paneContainer-content .header .collapse {\n grid-column: 2;\n display: flex;\n align-items: center;\n justify-items: center;\n transform-origin: center; }\n .right-panel #propertyTab .paneContainer .paneContainer-content .header .collapse.closed {\n transform: rotate(180deg); }\n .right-panel #propertyTab .paneContainer .paneContainer-content .paneList > div:not(:last-child) {\n border-bottom: 0.5px solid rgba(255, 255, 255, 0.1); }\n .right-panel #propertyTab .paneContainer .paneContainer-content .fragment > div:not(:last-child) {\n border-bottom: 0.5px solid rgba(255, 255, 255, 0.1); }\n .right-panel #propertyTab .color-picker {\n height: calc(100% - 8px);\n margin: 4px;\n width: calc(100% - 8px); }\n .right-panel #propertyTab .color-picker .color-rect {\n height: calc(100% - 4px);\n border: 2px white solid;\n cursor: pointer;\n min-height: 18px; }\n .right-panel #propertyTab .color-picker .color-picker-cover {\n position: fixed;\n top: 0px;\n right: 0px;\n bottom: 0px;\n left: 0px;\n z-index: 1; }\n .right-panel #propertyTab .color-picker .color-picker-float {\n z-index: 2;\n position: absolute; }\n .right-panel #propertyTab .gradient-step {\n display: grid;\n grid-template-rows: 100%;\n grid-template-columns: 20px 30px 40px auto 20px 30px;\n padding-top: 5px;\n padding-left: 5px;\n padding-bottom: 5px; }\n .right-panel #propertyTab .gradient-step .step {\n grid-row: 1;\n grid-column: 1; }\n .right-panel #propertyTab .gradient-step .color {\n grid-row: 1;\n grid-column: 2;\n cursor: pointer; }\n .right-panel #propertyTab .gradient-step .step-value {\n margin-left: 5px;\n grid-row: 1;\n grid-column: 3;\n text-align: right;\n margin-right: 5px; }\n .right-panel #propertyTab .gradient-step .step-slider {\n grid-row: 1;\n grid-column: 4;\n display: grid;\n justify-content: stretch;\n align-content: center;\n margin-right: -5px;\n padding-left: 12px; }\n .right-panel #propertyTab .gradient-step .step-slider input {\n width: 90%; }\n .right-panel #propertyTab .gradient-step .gradient-copy {\n grid-row: 1;\n grid-column: 5;\n display: grid;\n align-content: center;\n justify-content: center; }\n .right-panel #propertyTab .gradient-step .gradient-copy .img {\n height: 20px;\n width: 20px; }\n .right-panel #propertyTab .gradient-step .gradient-copy .img:hover {\n cursor: pointer; }\n .right-panel #propertyTab .gradient-step .gradient-delete {\n grid-row: 1;\n grid-column: 6;\n display: grid;\n align-content: center;\n justify-content: center; }\n .right-panel #propertyTab .gradient-step .gradient-delete .img {\n height: 20px;\n width: 20px; }\n .right-panel #propertyTab .gradient-step .gradient-delete .img:hover {\n cursor: pointer; }\n .right-panel #propertyTab .floatLine {\n padding-left: 5px;\n height: 30px;\n display: grid;\n grid-template-columns: 1fr 120px; }\n .right-panel #propertyTab .floatLine .label {\n grid-column: 1;\n display: flex;\n align-items: center; }\n .right-panel #propertyTab .floatLine .value {\n grid-column: 2;\n display: flex;\n align-items: center; }\n .right-panel #propertyTab .floatLine .value input {\n width: 110px; }\n .right-panel #propertyTab .floatLine .short {\n grid-column: 2;\n display: flex;\n align-items: center; }\n .right-panel #propertyTab .floatLine .short input {\n width: 27px; }\n .right-panel #propertyTab .floatLine .short input::-webkit-outer-spin-button,\n .right-panel #propertyTab .floatLine .short input::-webkit-inner-spin-button {\n -webkit-appearance: none;\n margin: 0; }\n .right-panel #propertyTab .floatLine .short input[type=\"number\"] {\n -moz-appearance: textfield; }\n .right-panel #propertyTab .vector3Line {\n padding-left: 5px;\n display: grid; }\n .right-panel #propertyTab .vector3Line .firstLine {\n display: grid;\n grid-template-columns: 1fr auto 20px;\n height: 30px; }\n .right-panel #propertyTab .vector3Line .firstLine .label {\n grid-column: 1;\n display: flex;\n align-items: center; }\n .right-panel #propertyTab .vector3Line .firstLine .vector {\n grid-column: 2;\n display: flex;\n align-items: center;\n text-align: right;\n opacity: 0.8; }\n .right-panel #propertyTab .vector3Line .firstLine .expand {\n grid-column: 3;\n display: grid;\n align-items: center;\n justify-items: center;\n cursor: pointer; }\n .right-panel #propertyTab .vector3Line .secondLine {\n display: grid;\n padding-right: 5px;\n border-left: 1px solid #337ab7; }\n .right-panel #propertyTab .vector3Line .secondLine .no-right-margin {\n margin-right: 0; }\n .right-panel #propertyTab .vector3Line .secondLine .numeric {\n display: grid;\n grid-template-columns: 1fr auto; }\n .right-panel #propertyTab .vector3Line .secondLine .numeric-label {\n text-align: right;\n grid-column: 1;\n display: flex;\n align-items: center;\n justify-self: right;\n margin-right: 10px; }\n .right-panel #propertyTab .vector3Line .secondLine .numeric-value {\n width: 120px;\n grid-column: 2;\n display: flex;\n align-items: center;\n border: 1px solid #337ab7; }\n .right-panel #propertyTab .buttonLine {\n height: 30px;\n display: grid;\n align-items: center;\n justify-items: stretch;\n padding-bottom: 5px; }\n .right-panel #propertyTab .buttonLine.disabled {\n opacity: 0.3; }\n .right-panel #propertyTab .buttonLine input[type=\"file\"] {\n display: none; }\n .right-panel #propertyTab .buttonLine .file-upload {\n background: #222222;\n border: 1px solid #337ab7;\n margin: 5px 10px;\n color: white;\n padding: 4px 5px;\n padding-top: 0px;\n opacity: 0.9;\n cursor: pointer;\n text-align: center; }\n .right-panel #propertyTab .buttonLine .file-upload:hover {\n opacity: 1; }\n .right-panel #propertyTab .buttonLine .file-upload:active {\n transform: scale(0.98);\n transform-origin: 0.5 0.5; }\n .right-panel #propertyTab .buttonLine button {\n background: #222222;\n border: 1px solid #337ab7;\n margin: 5px 10px 5px 10px;\n color: white;\n padding: 4px 5px;\n opacity: 0.9; }\n .right-panel #propertyTab .buttonLine button:hover {\n opacity: 1; }\n .right-panel #propertyTab .buttonLine button:active {\n background: #282828; }\n .right-panel #propertyTab .buttonLine button:focus {\n border: 1px solid #337ab7;\n outline: 0px; }\n .right-panel #propertyTab .checkBoxLine {\n padding-left: 5px;\n height: 30px;\n display: grid;\n grid-template-columns: 1fr auto; }\n .right-panel #propertyTab .checkBoxLine .label {\n grid-column: 1;\n display: flex;\n align-items: center; }\n .right-panel #propertyTab .checkBoxLine .checkBox {\n grid-column: 2;\n display: flex;\n align-items: center; }\n .right-panel #propertyTab .checkBoxLine .checkBox .lbl {\n position: relative;\n display: block;\n height: 14px;\n width: 34px;\n margin-right: 5px;\n background: #898989;\n border-radius: 100px;\n cursor: pointer;\n transition: all 0.3s ease; }\n .right-panel #propertyTab .checkBoxLine .checkBox .lbl:after {\n position: absolute;\n left: 3px;\n top: 2px;\n display: block;\n width: 10px;\n height: 10px;\n border-radius: 100px;\n background: #fff;\n box-shadow: 0px 3px 3px rgba(0, 0, 0, 0.05);\n content: \"\";\n transition: all 0.15s ease; }\n .right-panel #propertyTab .checkBoxLine .checkBox .lbl:active:after {\n transform: scale(1.15, 0.85); }\n .right-panel #propertyTab .checkBoxLine .checkBox .cbx:checked ~ label {\n background: #337ab7; }\n .right-panel #propertyTab .checkBoxLine .checkBox .cbx:checked ~ label:after {\n left: 20px;\n background: #164975; }\n .right-panel #propertyTab .checkBoxLine .checkBox .cbx:checked ~ label.disabled {\n background: #164975;\n cursor: pointer; }\n .right-panel #propertyTab .checkBoxLine .checkBox .cbx:checked ~ label.disabled:after {\n left: 20px;\n background: #555555;\n cursor: pointer; }\n .right-panel #propertyTab .checkBoxLine .checkBox .cbx ~ label.disabled {\n background: #555555;\n cursor: pointer; }\n .right-panel #propertyTab .checkBoxLine .checkBox .hidden {\n display: none; }\n .right-panel #propertyTab .listLine {\n padding-left: 5px;\n height: 30px;\n display: grid;\n grid-template-columns: 1fr auto; }\n .right-panel #propertyTab .listLine .label {\n grid-column: 1;\n display: flex;\n align-items: center; }\n .right-panel #propertyTab .listLine .options {\n grid-column: 2;\n display: flex;\n align-items: center;\n margin-right: 5px; }\n .right-panel #propertyTab .listLine .options select {\n width: 115px; }\n .right-panel #propertyTab .color3Line {\n padding-left: 5px;\n display: grid; }\n .right-panel #propertyTab .color3Line .firstLine {\n height: 30px;\n display: grid;\n grid-template-columns: 1fr auto 0px 20px 20px; }\n .right-panel #propertyTab .color3Line .firstLine .label {\n grid-column: 1;\n display: flex;\n align-items: center; }\n .right-panel #propertyTab .color3Line .firstLine .textInputLine {\n display: none; }\n .right-panel #propertyTab .color3Line .firstLine .color3 {\n grid-column: 2;\n width: 50px;\n display: flex;\n align-items: center; }\n .right-panel #propertyTab .color3Line .firstLine .color3 input {\n margin-right: 5px; }\n .right-panel #propertyTab .color3Line .firstLine .copy {\n grid-column: 4;\n display: grid;\n align-items: center;\n justify-items: center;\n cursor: pointer; }\n .right-panel #propertyTab .color3Line .firstLine .copy img {\n height: 100%;\n width: 24px; }\n .right-panel #propertyTab .color3Line .firstLine .expand {\n grid-column: 5;\n display: grid;\n align-items: center;\n justify-items: center;\n cursor: pointer; }\n .right-panel #propertyTab .color3Line .firstLine .expand img {\n height: 100%;\n width: 20px; }\n .right-panel #propertyTab .color3Line .secondLine {\n display: grid;\n padding-right: 5px;\n border-left: 1px solid #337ab7; }\n .right-panel #propertyTab .color3Line .secondLine .numeric {\n display: grid;\n grid-template-columns: 1fr auto; }\n .right-panel #propertyTab .color3Line .secondLine .numeric-label {\n text-align: right;\n grid-column: 1;\n display: flex;\n align-items: center;\n justify-self: right;\n margin-right: 10px; }\n .right-panel #propertyTab .color3Line .secondLine .numeric-value {\n width: 120px;\n grid-column: 2;\n display: flex;\n align-items: center;\n border: 1px solid #337ab7; }\n .right-panel #propertyTab .textLine {\n padding-left: 5px;\n height: 30px;\n display: grid;\n grid-template-columns: 1fr auto; }\n .right-panel #propertyTab .textLine .label {\n grid-column: 1;\n display: flex;\n align-items: center; }\n .right-panel #propertyTab .textLine .link-value {\n grid-column: 2;\n white-space: nowrap;\n text-overflow: ellipsis;\n overflow: hidden;\n text-align: end;\n opacity: 0.8;\n margin: 5px;\n margin-top: 6px;\n max-width: 140px;\n text-decoration: underline;\n cursor: pointer; }\n .right-panel #propertyTab .textLine .value {\n grid-column: 2;\n white-space: nowrap;\n text-overflow: ellipsis;\n overflow: hidden;\n text-align: end;\n opacity: 0.8;\n margin: 5px;\n margin-top: 6px;\n max-width: 200px;\n -webkit-user-select: text;\n -moz-user-select: text;\n -ms-user-select: text;\n user-select: text; }\n .right-panel #propertyTab .textLine .value.check {\n color: green; }\n .right-panel #propertyTab .textLine .value.uncheck {\n color: red; }\n", "",{"version":3,"sources":["webpack://./../../../tools/nodeEditor/dist/components/propertyTab/propertyTab.scss"],"names":[],"mappings":"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","sourcesContent":[".right-panel {\r\n #propertyTab {\r\n $line-padding-left: 5px;\r\n color: white;\r\n background: #333333;\r\n\r\n #header {\r\n height: 30px;\r\n font-size: 16px;\r\n color: white;\r\n background: #222222;\r\n grid-row: 1;\r\n text-align: center;\r\n display: grid;\r\n grid-template-columns: 30px 1fr;\r\n -webkit-user-select: none;\r\n -moz-user-select: none;\r\n -ms-user-select: none;\r\n user-select: none;\r\n\r\n #logo {\r\n position: relative;\r\n grid-column: 1;\r\n width: 24px;\r\n height: 24px;\r\n left: 0;\r\n display: flex;\r\n align-self: center;\r\n justify-self: center;\r\n }\r\n\r\n #title {\r\n grid-column: 2;\r\n display: grid;\r\n align-items: center;\r\n text-align: center;\r\n }\r\n }\r\n\r\n .range {\r\n -webkit-appearance: none;\r\n width: 120px;\r\n height: 6px;\r\n background: #d3d3d3;\r\n border-radius: 5px;\r\n outline: none;\r\n opacity: 0.7;\r\n -webkit-transition: 0.2s;\r\n transition: opacity 0.2s;\r\n }\r\n\r\n .range:hover {\r\n opacity: 1;\r\n }\r\n\r\n .range::-webkit-slider-thumb {\r\n -webkit-appearance: none;\r\n appearance: none;\r\n width: 14px;\r\n height: 14px;\r\n border-radius: 50%;\r\n background: rgb(51, 122, 183);\r\n cursor: pointer;\r\n }\r\n\r\n .range::-moz-range-thumb {\r\n width: 14px;\r\n height: 14px;\r\n border-radius: 50%;\r\n background: rgb(51, 122, 183);\r\n cursor: pointer;\r\n }\r\n\r\n input[type=\"color\"] {\r\n -webkit-appearance: none;\r\n border: 1px solid rgba(255, 255, 255, 0.5);\r\n padding: 0;\r\n width: 30px;\r\n height: 20px;\r\n }\r\n input[type=\"color\"]::-webkit-color-swatch-wrapper {\r\n padding: 0;\r\n }\r\n input[type=\"color\"]::-webkit-color-swatch {\r\n border: none;\r\n }\r\n\r\n .sliderLine {\r\n padding-left: $line-padding-left;\r\n height: 30px;\r\n display: grid;\r\n grid-template-rows: 100%;\r\n grid-template-columns: 1fr 50px auto;\r\n\r\n .label {\r\n grid-column: 1;\r\n display: flex;\r\n align-items: center;\r\n }\r\n\r\n .slider {\r\n grid-column: 3;\r\n grid-row: 1;\r\n margin-right: 5px;\r\n width: 90%;\r\n display: flex;\r\n align-items: center;\r\n }\r\n\r\n .floatLine {\r\n grid-column: 2;\r\n padding-left: $line-padding-left;\r\n\r\n .label {\r\n grid-column: 1;\r\n display: flex;\r\n align-items: center;\r\n }\r\n\r\n .short {\r\n grid-column: 1;\r\n display: flex;\r\n align-items: center;\r\n\r\n input {\r\n width: 35px;\r\n }\r\n\r\n input::-webkit-outer-spin-button,\r\n input::-webkit-inner-spin-button {\r\n -webkit-appearance: none;\r\n margin: 0;\r\n }\r\n\r\n input[type=\"number\"] {\r\n -moz-appearance: textfield;\r\n }\r\n }\r\n }\r\n }\r\n\r\n .textInputLine {\r\n padding-left: $line-padding-left;\r\n height: 30px;\r\n display: grid;\r\n grid-template-columns: 1fr 120px auto;\r\n\r\n .label {\r\n grid-column: 1;\r\n display: flex;\r\n align-items: center;\r\n }\r\n\r\n .value {\r\n display: flex;\r\n align-items: center;\r\n grid-column: 2;\r\n\r\n input {\r\n width: calc(100% - 5px);\r\n margin-right: 5px;\r\n }\r\n }\r\n }\r\n\r\n .textInputArea {\r\n padding-left: $line-padding-left;\r\n height: 50px;\r\n display: grid;\r\n grid-template-columns: 1fr 120px;\r\n\r\n .label {\r\n grid-column: 1;\r\n display: flex;\r\n align-items: center;\r\n }\r\n\r\n textarea {\r\n margin-right: 5px;\r\n margin-left: -50%;\r\n height: 40px;\r\n resize: none;\r\n }\r\n\r\n .value {\r\n display: flex;\r\n align-items: center;\r\n grid-column: 2;\r\n }\r\n }\r\n\r\n .paneContainer {\r\n margin-top: 3px;\r\n display: grid;\r\n grid-template-rows: 100%;\r\n grid-template-columns: 100%;\r\n\r\n .paneList {\r\n border-left: 3px solid transparent;\r\n }\r\n\r\n &:hover {\r\n .paneList {\r\n border-left: 3px solid rgba(51, 122, 183, 0.8);\r\n }\r\n\r\n .paneContainer-content {\r\n .header {\r\n .title {\r\n border-left: 3px solid rgb(51, 122, 183);\r\n }\r\n }\r\n }\r\n }\r\n\r\n .paneContainer-highlight-border {\r\n grid-row: 1;\r\n grid-column: 1;\r\n opacity: 1;\r\n border: 3px solid red;\r\n transition: opacity 250ms;\r\n pointer-events: none;\r\n\r\n &.transparent {\r\n opacity: 0;\r\n }\r\n }\r\n\r\n .paneContainer-content {\r\n grid-row: 1;\r\n grid-column: 1;\r\n\r\n .header {\r\n display: grid;\r\n grid-template-columns: 1fr auto;\r\n background: #555555;\r\n height: 30px;\r\n padding-right: 5px;\r\n cursor: pointer;\r\n\r\n .title {\r\n border-left: 3px solid transparent;\r\n padding-left: 5px;\r\n grid-column: 1;\r\n display: flex;\r\n align-items: center;\r\n }\r\n\r\n .collapse {\r\n grid-column: 2;\r\n display: flex;\r\n align-items: center;\r\n justify-items: center;\r\n transform-origin: center;\r\n\r\n &.closed {\r\n transform: rotate(180deg);\r\n }\r\n }\r\n }\r\n\r\n .paneList > div:not(:last-child) {\r\n border-bottom: 0.5px solid rgba(255, 255, 255, 0.1);\r\n }\r\n\r\n .fragment > div:not(:last-child) {\r\n border-bottom: 0.5px solid rgba(255, 255, 255, 0.1);\r\n }\r\n }\r\n }\r\n\r\n .color-picker {\r\n height: calc(100% - 8px);\r\n margin: 4px;\r\n width: calc(100% - 8px);\r\n\r\n .color-rect {\r\n height: calc(100% - 4px);\r\n border: 2px white solid;\r\n cursor: pointer;\r\n min-height: 18px;\r\n }\r\n\r\n .color-picker-cover {\r\n position: fixed;\r\n top: 0px;\r\n right: 0px;\r\n bottom: 0px;\r\n left: 0px;\r\n z-index: 1;\r\n }\r\n\r\n .color-picker-float {\r\n z-index: 2;\r\n position: absolute;\r\n }\r\n }\r\n\r\n .gradient-step {\r\n display: grid;\r\n grid-template-rows: 100%;\r\n grid-template-columns: 20px 30px 40px auto 20px 30px;\r\n padding-top: 5px;\r\n padding-left: 5px;\r\n padding-bottom: 5px;\r\n\r\n .step {\r\n grid-row: 1;\r\n grid-column: 1;\r\n }\r\n\r\n .color {\r\n grid-row: 1;\r\n grid-column: 2;\r\n cursor: pointer;\r\n }\r\n\r\n .step-value {\r\n margin-left: 5px;\r\n grid-row: 1;\r\n grid-column: 3;\r\n text-align: right;\r\n margin-right: 5px;\r\n }\r\n\r\n .step-slider {\r\n grid-row: 1;\r\n grid-column: 4;\r\n display: grid;\r\n justify-content: stretch;\r\n align-content: center;\r\n margin-right: -5px;\r\n padding-left: 12px;\r\n\r\n input {\r\n width: 90%;\r\n }\r\n }\r\n\r\n .gradient-copy {\r\n grid-row: 1;\r\n grid-column: 5;\r\n display: grid;\r\n align-content: center;\r\n justify-content: center;\r\n\r\n .img {\r\n height: 20px;\r\n width: 20px;\r\n }\r\n .img:hover {\r\n cursor: pointer;\r\n }\r\n }\r\n .gradient-delete {\r\n grid-row: 1;\r\n grid-column: 6;\r\n display: grid;\r\n align-content: center;\r\n justify-content: center;\r\n .img {\r\n height: 20px;\r\n width: 20px;\r\n }\r\n .img:hover {\r\n cursor: pointer;\r\n }\r\n }\r\n }\r\n\r\n .floatLine {\r\n padding-left: $line-padding-left;\r\n height: 30px;\r\n display: grid;\r\n grid-template-columns: 1fr 120px;\r\n\r\n .label {\r\n grid-column: 1;\r\n display: flex;\r\n align-items: center;\r\n }\r\n\r\n .value {\r\n grid-column: 2;\r\n\r\n display: flex;\r\n align-items: center;\r\n\r\n input {\r\n width: 110px;\r\n }\r\n }\r\n\r\n .short {\r\n grid-column: 2;\r\n\r\n display: flex;\r\n align-items: center;\r\n\r\n input {\r\n width: 27px;\r\n }\r\n\r\n input::-webkit-outer-spin-button,\r\n input::-webkit-inner-spin-button {\r\n -webkit-appearance: none;\r\n margin: 0;\r\n }\r\n\r\n input[type=\"number\"] {\r\n -moz-appearance: textfield;\r\n }\r\n }\r\n }\r\n\r\n .vector3Line {\r\n padding-left: $line-padding-left;\r\n display: grid;\r\n\r\n .firstLine {\r\n display: grid;\r\n grid-template-columns: 1fr auto 20px;\r\n height: 30px;\r\n\r\n .label {\r\n grid-column: 1;\r\n display: flex;\r\n align-items: center;\r\n }\r\n\r\n .vector {\r\n grid-column: 2;\r\n display: flex;\r\n align-items: center;\r\n text-align: right;\r\n opacity: 0.8;\r\n }\r\n\r\n .expand {\r\n grid-column: 3;\r\n display: grid;\r\n align-items: center;\r\n justify-items: center;\r\n cursor: pointer;\r\n }\r\n }\r\n\r\n .secondLine {\r\n display: grid;\r\n padding-right: 5px;\r\n border-left: 1px solid rgb(51, 122, 183);\r\n\r\n .no-right-margin {\r\n margin-right: 0;\r\n }\r\n\r\n .numeric {\r\n display: grid;\r\n grid-template-columns: 1fr auto;\r\n }\r\n\r\n .numeric-label {\r\n text-align: right;\r\n grid-column: 1;\r\n display: flex;\r\n align-items: center;\r\n justify-self: right;\r\n margin-right: 10px;\r\n }\r\n\r\n .numeric-value {\r\n width: 120px;\r\n grid-column: 2;\r\n display: flex;\r\n align-items: center;\r\n border: 1px solid rgb(51, 122, 183);\r\n }\r\n }\r\n }\r\n\r\n .buttonLine {\r\n height: 30px;\r\n display: grid;\r\n align-items: center;\r\n justify-items: stretch;\r\n padding-bottom: 5px;\r\n\r\n &.disabled {\r\n opacity: 0.3;\r\n }\r\n\r\n input[type=\"file\"] {\r\n display: none;\r\n }\r\n\r\n .file-upload {\r\n background: #222222;\r\n border: 1px solid rgb(51, 122, 183);\r\n margin: 5px 10px;\r\n color: white;\r\n padding: 4px 5px;\r\n padding-top: 0px;\r\n opacity: 0.9;\r\n cursor: pointer;\r\n text-align: center;\r\n }\r\n\r\n .file-upload:hover {\r\n opacity: 1;\r\n }\r\n\r\n .file-upload:active {\r\n transform: scale(0.98);\r\n transform-origin: 0.5 0.5;\r\n }\r\n\r\n button {\r\n background: #222222;\r\n border: 1px solid rgb(51, 122, 183);\r\n margin: 5px 10px 5px 10px;\r\n color: white;\r\n padding: 4px 5px;\r\n opacity: 0.9;\r\n }\r\n\r\n button:hover {\r\n opacity: 1;\r\n }\r\n\r\n button:active {\r\n background: #282828;\r\n }\r\n\r\n button:focus {\r\n border: 1px solid rgb(51, 122, 183);\r\n outline: 0px;\r\n }\r\n }\r\n\r\n .checkBoxLine {\r\n padding-left: $line-padding-left;\r\n height: 30px;\r\n display: grid;\r\n grid-template-columns: 1fr auto;\r\n\r\n .label {\r\n grid-column: 1;\r\n display: flex;\r\n align-items: center;\r\n }\r\n\r\n .checkBox {\r\n grid-column: 2;\r\n\r\n display: flex;\r\n align-items: center;\r\n\r\n .lbl {\r\n position: relative;\r\n display: block;\r\n height: 14px;\r\n width: 34px;\r\n margin-right: 5px;\r\n background: #898989;\r\n border-radius: 100px;\r\n cursor: pointer;\r\n transition: all 0.3s ease;\r\n }\r\n\r\n .lbl:after {\r\n position: absolute;\r\n left: 3px;\r\n top: 2px;\r\n display: block;\r\n width: 10px;\r\n height: 10px;\r\n border-radius: 100px;\r\n background: #fff;\r\n box-shadow: 0px 3px 3px rgba(0, 0, 0, 0.05);\r\n content: \"\";\r\n transition: all 0.15s ease;\r\n }\r\n\r\n .lbl:active:after {\r\n transform: scale(1.15, 0.85);\r\n }\r\n\r\n .cbx:checked ~ label {\r\n background: rgb(51, 122, 183);\r\n }\r\n\r\n .cbx:checked ~ label:after {\r\n left: 20px;\r\n background: rgb(22, 73, 117);\r\n }\r\n\r\n .cbx:checked ~ label.disabled {\r\n background: rgb(22, 73, 117);\r\n cursor: pointer;\r\n }\r\n\r\n .cbx:checked ~ label.disabled:after {\r\n left: 20px;\r\n background: rgb(85, 85, 85);\r\n cursor: pointer;\r\n }\r\n\r\n .cbx ~ label.disabled {\r\n background: rgb(85, 85, 85);\r\n cursor: pointer;\r\n }\r\n\r\n .hidden {\r\n display: none;\r\n }\r\n }\r\n }\r\n\r\n .listLine {\r\n padding-left: $line-padding-left;\r\n height: 30px;\r\n display: grid;\r\n grid-template-columns: 1fr auto;\r\n\r\n .label {\r\n grid-column: 1;\r\n display: flex;\r\n align-items: center;\r\n }\r\n\r\n .options {\r\n grid-column: 2;\r\n\r\n display: flex;\r\n align-items: center;\r\n margin-right: 5px;\r\n\r\n select {\r\n width: 115px;\r\n }\r\n }\r\n }\r\n\r\n .color3Line {\r\n padding-left: $line-padding-left;\r\n display: grid;\r\n\r\n .firstLine {\r\n height: 30px;\r\n display: grid;\r\n grid-template-columns: 1fr auto 0px 20px 20px;\r\n\r\n .label {\r\n grid-column: 1;\r\n display: flex;\r\n align-items: center;\r\n }\r\n\r\n .textInputLine {\r\n display: none;\r\n }\r\n\r\n .color3 {\r\n grid-column: 2;\r\n width: 50px;\r\n\r\n display: flex;\r\n align-items: center;\r\n\r\n input {\r\n margin-right: 5px;\r\n }\r\n }\r\n\r\n .copy {\r\n grid-column: 4;\r\n display: grid;\r\n align-items: center;\r\n justify-items: center;\r\n cursor: pointer;\r\n\r\n img {\r\n height: 100%;\r\n width: 24px;\r\n }\r\n }\r\n\r\n .expand {\r\n grid-column: 5;\r\n display: grid;\r\n align-items: center;\r\n justify-items: center;\r\n cursor: pointer;\r\n\r\n img {\r\n height: 100%;\r\n width: 20px;\r\n }\r\n }\r\n }\r\n\r\n .secondLine {\r\n display: grid;\r\n padding-right: 5px;\r\n border-left: 1px solid rgb(51, 122, 183);\r\n\r\n .numeric {\r\n display: grid;\r\n grid-template-columns: 1fr auto;\r\n }\r\n\r\n .numeric-label {\r\n text-align: right;\r\n grid-column: 1;\r\n display: flex;\r\n align-items: center;\r\n justify-self: right;\r\n margin-right: 10px;\r\n }\r\n\r\n .numeric-value {\r\n width: 120px;\r\n grid-column: 2;\r\n display: flex;\r\n align-items: center;\r\n border: 1px solid rgb(51, 122, 183);\r\n }\r\n }\r\n }\r\n\r\n .textLine {\r\n padding-left: $line-padding-left;\r\n height: 30px;\r\n display: grid;\r\n grid-template-columns: 1fr auto;\r\n\r\n .label {\r\n grid-column: 1;\r\n display: flex;\r\n align-items: center;\r\n }\r\n\r\n .link-value {\r\n grid-column: 2;\r\n white-space: nowrap;\r\n text-overflow: ellipsis;\r\n overflow: hidden;\r\n text-align: end;\r\n opacity: 0.8;\r\n margin: 5px;\r\n margin-top: 6px;\r\n max-width: 140px;\r\n text-decoration: underline;\r\n cursor: pointer;\r\n }\r\n\r\n .value {\r\n grid-column: 2;\r\n white-space: nowrap;\r\n text-overflow: ellipsis;\r\n overflow: hidden;\r\n text-align: end;\r\n opacity: 0.8;\r\n margin: 5px;\r\n margin-top: 6px;\r\n max-width: 200px;\r\n -webkit-user-select: text;\r\n -moz-user-select: text;\r\n -ms-user-select: text;\r\n user-select: text;\r\n\r\n &.check {\r\n color: green;\r\n }\r\n\r\n &.uncheck {\r\n color: red;\r\n }\r\n }\r\n }\r\n }\r\n}\r\n"],"sourceRoot":""}]);
|
|
147
147
|
// Exports
|
|
148
148
|
___CSS_LOADER_EXPORT___.locals = {};
|
|
149
149
|
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (___CSS_LOADER_EXPORT___);
|
|
@@ -61460,8 +61460,18 @@ class ColorComponentEntry extends react__WEBPACK_IMPORTED_MODULE_1__.Component {
|
|
|
61460
61460
|
}
|
|
61461
61461
|
this.props.onChange(valueAsNumber);
|
|
61462
61462
|
}
|
|
61463
|
+
lock() {
|
|
61464
|
+
if (this.props.lockObject) {
|
|
61465
|
+
this.props.lockObject.lock = true;
|
|
61466
|
+
}
|
|
61467
|
+
}
|
|
61468
|
+
unlock() {
|
|
61469
|
+
if (this.props.lockObject) {
|
|
61470
|
+
this.props.lockObject.lock = false;
|
|
61471
|
+
}
|
|
61472
|
+
}
|
|
61463
61473
|
render() {
|
|
61464
|
-
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", Object.assign({ className: "color-picker-component" }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", Object.assign({ className: "color-picker-component-value" }, { children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("input", { type: "number", step: 1, className: "numeric-input", value: this.props.value, onChange: (evt) => this.updateValue(evt.target.value), disabled: this.props.disabled }) })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", Object.assign({ className: "color-picker-component-label" }, { children: this.props.label }))] })));
|
|
61474
|
+
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", Object.assign({ className: "color-picker-component" }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", Object.assign({ className: "color-picker-component-value" }, { children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("input", { type: "number", step: 1, className: "numeric-input", value: this.props.value, onBlur: () => this.unlock(), onFocus: () => this.lock(), onChange: (evt) => this.updateValue(evt.target.value), disabled: this.props.disabled }) })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", Object.assign({ className: "color-picker-component-label" }, { children: this.props.label }))] })));
|
|
61465
61475
|
}
|
|
61466
61476
|
}
|
|
61467
61477
|
|
|
@@ -61597,19 +61607,19 @@ class ColorPicker extends react__WEBPACK_IMPORTED_MODULE_1__.Component {
|
|
|
61597
61607
|
} }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", Object.assign({ className: "color-picker-hue-slider", ref: this._hueRef, onPointerMove: (e) => this.onHuePointerMove(e), onPointerDown: (e) => this.onHuePointerDown(e), onPointerUp: (e) => this.onHuePointerUp(e) }, { children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", { className: "color-picker-hue-cursor", style: {
|
|
61598
61608
|
left: `${(hsv.r / 360.0) * 100}%`,
|
|
61599
61609
|
border: `1px solid ` + colorHexRef,
|
|
61600
|
-
} }) }))] })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", { className: "color-picker-alpha" }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", Object.assign({ className: "color-picker-rgb" }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", Object.assign({ className: "red" }, { children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_colorComponentEntry__WEBPACK_IMPORTED_MODULE_3__.ColorComponentEntry, { label: "R", min: 0, max: 255, value: Math.round(this.state.color.r * 255), onChange: (value) => {
|
|
61610
|
+
} }) }))] })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", { className: "color-picker-alpha" }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", Object.assign({ className: "color-picker-rgb" }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", Object.assign({ className: "red" }, { children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_colorComponentEntry__WEBPACK_IMPORTED_MODULE_3__.ColorComponentEntry, { lockObject: this.props.lockObject, label: "R", min: 0, max: 255, value: Math.round(this.state.color.r * 255), onChange: (value) => {
|
|
61601
61611
|
this.state.color.r = value / 255.0;
|
|
61602
61612
|
this.forceUpdate();
|
|
61603
|
-
} }) })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", Object.assign({ className: "green" }, { children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_colorComponentEntry__WEBPACK_IMPORTED_MODULE_3__.ColorComponentEntry, { label: "G", min: 0, max: 255, value: Math.round(this.state.color.g * 255), onChange: (value) => {
|
|
61613
|
+
} }) })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", Object.assign({ className: "green" }, { children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_colorComponentEntry__WEBPACK_IMPORTED_MODULE_3__.ColorComponentEntry, { lockObject: this.props.lockObject, label: "G", min: 0, max: 255, value: Math.round(this.state.color.g * 255), onChange: (value) => {
|
|
61604
61614
|
this.state.color.g = value / 255.0;
|
|
61605
61615
|
this.forceUpdate();
|
|
61606
|
-
} }) })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", Object.assign({ className: "blue" }, { children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_colorComponentEntry__WEBPACK_IMPORTED_MODULE_3__.ColorComponentEntry, { label: "B", min: 0, max: 255, value: Math.round(this.state.color.b * 255), onChange: (value) => {
|
|
61616
|
+
} }) })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", Object.assign({ className: "blue" }, { children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_colorComponentEntry__WEBPACK_IMPORTED_MODULE_3__.ColorComponentEntry, { lockObject: this.props.lockObject, label: "B", min: 0, max: 255, value: Math.round(this.state.color.b * 255), onChange: (value) => {
|
|
61607
61617
|
this.state.color.b = value / 255.0;
|
|
61608
61618
|
this.forceUpdate();
|
|
61609
|
-
} }) })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", Object.assign({ className: "alpha" + (hasAlpha ? "" : " grayed") }, { children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_colorComponentEntry__WEBPACK_IMPORTED_MODULE_3__.ColorComponentEntry, { label: "A", min: 0, max: 255, value: Math.round(this.state.alpha * 255), onChange: (value) => {
|
|
61619
|
+
} }) })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", Object.assign({ className: "alpha" + (hasAlpha ? "" : " grayed") }, { children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_colorComponentEntry__WEBPACK_IMPORTED_MODULE_3__.ColorComponentEntry, { lockObject: this.props.lockObject, label: "A", min: 0, max: 255, value: Math.round(this.state.alpha * 255), onChange: (value) => {
|
|
61610
61620
|
this.setState({ alpha: value / 255.0 });
|
|
61611
61621
|
this.forceUpdate();
|
|
61612
|
-
} }) }))] })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", Object.assign({ className: "color-picker-hex" }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", Object.assign({ className: "color-picker-hex-label" }, { children: "Hex" })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", Object.assign({ className: "color-picker-hex-value" }, { children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_hexColor__WEBPACK_IMPORTED_MODULE_4__.HexColor, { expectedLength: hasAlpha ? 8 : 6, value: colorHex, onChange: (value) => {
|
|
61622
|
+
} }) }))] })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", Object.assign({ className: "color-picker-hex" }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", Object.assign({ className: "color-picker-hex-label" }, { children: "Hex" })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", Object.assign({ className: "color-picker-hex-value" }, { children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_hexColor__WEBPACK_IMPORTED_MODULE_4__.HexColor, { lockObject: this.props.lockObject, expectedLength: hasAlpha ? 8 : 6, value: colorHex, onChange: (value) => {
|
|
61613
61623
|
if (hasAlpha) {
|
|
61614
61624
|
const color4 = core_Maths_math_color__WEBPACK_IMPORTED_MODULE_2__.Color4.FromHexString(value);
|
|
61615
61625
|
this.setState({ color: new core_Maths_math_color__WEBPACK_IMPORTED_MODULE_2__.Color3(color4.r, color4.g, color4.b), alpha: color4.a });
|
|
@@ -61650,18 +61660,33 @@ class HexColor extends react__WEBPACK_IMPORTED_MODULE_1__.Component {
|
|
|
61650
61660
|
}
|
|
61651
61661
|
return true;
|
|
61652
61662
|
}
|
|
61663
|
+
lock() {
|
|
61664
|
+
if (this.props.lockObject) {
|
|
61665
|
+
this.props.lockObject.lock = true;
|
|
61666
|
+
}
|
|
61667
|
+
}
|
|
61668
|
+
unlock() {
|
|
61669
|
+
if (this.props.lockObject) {
|
|
61670
|
+
this.props.lockObject.lock = false;
|
|
61671
|
+
}
|
|
61672
|
+
}
|
|
61653
61673
|
updateHexValue(valueString) {
|
|
61654
61674
|
if (valueString != "" && /^[0-9A-Fa-f]+$/g.test(valueString) == false) {
|
|
61655
61675
|
return;
|
|
61656
61676
|
}
|
|
61657
61677
|
this.setState({ hex: valueString });
|
|
61658
61678
|
if (valueString.length !== this.props.expectedLength) {
|
|
61659
|
-
|
|
61679
|
+
if (this.props.expectedLength === 8 && valueString.length === 6) {
|
|
61680
|
+
valueString = valueString + "FF";
|
|
61681
|
+
}
|
|
61682
|
+
else {
|
|
61683
|
+
return;
|
|
61684
|
+
}
|
|
61660
61685
|
}
|
|
61661
61686
|
this.props.onChange("#" + valueString);
|
|
61662
61687
|
}
|
|
61663
61688
|
render() {
|
|
61664
|
-
return (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("input", { type: "string", className: "hex-input", value: this.state.hex, onChange: (evt) => this.updateHexValue(evt.target.value) });
|
|
61689
|
+
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("input", { type: "string", className: "hex-input", value: this.state.hex, onBlur: () => this.unlock(), onFocus: () => this.lock(), onChange: (evt) => this.updateHexValue(evt.target.value) }));
|
|
61665
61690
|
}
|
|
61666
61691
|
}
|
|
61667
61692
|
|
|
@@ -61911,11 +61936,11 @@ class ColorLineComponent extends react__WEBPACK_IMPORTED_MODULE_1__.Component {
|
|
|
61911
61936
|
}
|
|
61912
61937
|
render() {
|
|
61913
61938
|
const chevron = this.state.isExpanded ? (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_fortawesome_react_fontawesome__WEBPACK_IMPORTED_MODULE_4__.FontAwesomeIcon, { icon: _fortawesome_free_solid_svg_icons__WEBPACK_IMPORTED_MODULE_5__.faMinus }) : (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_fortawesome_react_fontawesome__WEBPACK_IMPORTED_MODULE_4__.FontAwesomeIcon, { icon: _fortawesome_free_solid_svg_icons__WEBPACK_IMPORTED_MODULE_5__.faPlus });
|
|
61914
|
-
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", Object.assign({ className: "color3Line" }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", Object.assign({ className: "firstLine" }, { children: [this.props.icon && (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("img", { src: this.props.icon, title: this.props.iconLabel, alt: this.props.iconLabel, className: "icon" }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", Object.assign({ className: "label", title: this.props.label }, { children: this.props.label })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", Object.assign({ className: "color3" }, { children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_colorPickerComponent__WEBPACK_IMPORTED_MODULE_6__.ColorPickerLineComponent, { linearHint: this.props.isLinear, value: this.props.disableAlpha ? this._toColor3(this.state.color) : this.state.color, onColorChanged: (colorString) => {
|
|
61939
|
+
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", Object.assign({ className: "color3Line" }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", Object.assign({ className: "firstLine" }, { children: [this.props.icon && (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("img", { src: this.props.icon, title: this.props.iconLabel, alt: this.props.iconLabel, className: "icon" }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", Object.assign({ className: "label", title: this.props.label }, { children: this.props.label })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", Object.assign({ className: "color3" }, { children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_colorPickerComponent__WEBPACK_IMPORTED_MODULE_6__.ColorPickerLineComponent, { lockObject: this.props.lockObject, linearHint: this.props.isLinear, value: this.props.disableAlpha ? this._toColor3(this.state.color) : this.state.color, onColorChanged: (colorString) => {
|
|
61915
61940
|
this.setColorFromString(colorString);
|
|
61916
61941
|
} }) })), this.props.lockObject && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_textInputLineComponent__WEBPACK_IMPORTED_MODULE_7__.TextInputLineComponent, { lockObject: this.props.lockObject, label: "", value: this.state.color.toHexString(), onChange: (newValue) => {
|
|
61917
61942
|
this.setColorFromString(newValue);
|
|
61918
|
-
}, onPropertyChangedObservable: this.props.onPropertyChangedObservable })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", Object.assign({ className: "copy hoverIcon", onClick: () => this.copyToClipboard(), title: "Copy to clipboard" }, { children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("img", { src: _copy_svg__WEBPACK_IMPORTED_MODULE_9__, alt: "Copy" }) })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", Object.assign({ className: "expand hoverIcon", onClick: () => this.switchExpandState(), title: "Expand" }, { children: chevron }))] })), this.state.isExpanded && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", Object.assign({ className: "secondLine" }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_numericInputComponent__WEBPACK_IMPORTED_MODULE_3__.NumericInputComponent, { label: "r", value: this.state.color.r, onChange: (value) => this.updateStateR(value) }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_numericInputComponent__WEBPACK_IMPORTED_MODULE_3__.NumericInputComponent, { label: "g", value: this.state.color.g, onChange: (value) => this.updateStateG(value) }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_numericInputComponent__WEBPACK_IMPORTED_MODULE_3__.NumericInputComponent, { label: "b", value: this.state.color.b, onChange: (value) => this.updateStateB(value) }), this.props.disableAlpha || (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_numericInputComponent__WEBPACK_IMPORTED_MODULE_3__.NumericInputComponent, { label: "a", value: this.state.color.a, onChange: (value) => this.updateStateA(value) })] })))] })));
|
|
61943
|
+
}, onPropertyChangedObservable: this.props.onPropertyChangedObservable })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", Object.assign({ className: "copy hoverIcon", onClick: () => this.copyToClipboard(), title: "Copy to clipboard" }, { children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("img", { src: _copy_svg__WEBPACK_IMPORTED_MODULE_9__, alt: "Copy" }) })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", Object.assign({ className: "expand hoverIcon", onClick: () => this.switchExpandState(), title: "Expand" }, { children: chevron }))] })), this.state.isExpanded && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", Object.assign({ className: "secondLine" }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_numericInputComponent__WEBPACK_IMPORTED_MODULE_3__.NumericInputComponent, { lockObject: this.props.lockObject, label: "r", value: this.state.color.r, onChange: (value) => this.updateStateR(value) }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_numericInputComponent__WEBPACK_IMPORTED_MODULE_3__.NumericInputComponent, { lockObject: this.props.lockObject, label: "g", value: this.state.color.g, onChange: (value) => this.updateStateG(value) }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_numericInputComponent__WEBPACK_IMPORTED_MODULE_3__.NumericInputComponent, { lockObject: this.props.lockObject, label: "b", value: this.state.color.b, onChange: (value) => this.updateStateB(value) }), this.props.disableAlpha || ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_numericInputComponent__WEBPACK_IMPORTED_MODULE_3__.NumericInputComponent, { lockObject: this.props.lockObject, label: "a", value: this.state.color.a, onChange: (value) => this.updateStateA(value) }))] })))] })));
|
|
61919
61944
|
}
|
|
61920
61945
|
}
|
|
61921
61946
|
|
|
@@ -61989,7 +62014,7 @@ class ColorPickerLineComponent extends react__WEBPACK_IMPORTED_MODULE_1__.Compon
|
|
|
61989
62014
|
return;
|
|
61990
62015
|
}
|
|
61991
62016
|
this.setState({ pickerEnabled: false });
|
|
61992
|
-
} }, { children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", Object.assign({ className: "color-picker-float", ref: this._floatRef }, { children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_colorPicker_colorPicker__WEBPACK_IMPORTED_MODULE_2__.ColorPicker, { color: this.state.color, linearhint: this.props.linearHint, onColorChanged: (color) => {
|
|
62017
|
+
} }, { children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", Object.assign({ className: "color-picker-float", ref: this._floatRef }, { children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_colorPicker_colorPicker__WEBPACK_IMPORTED_MODULE_2__.ColorPicker, { lockObject: this.props.lockObject || {}, color: this.state.color, linearhint: this.props.linearHint, onColorChanged: (color) => {
|
|
61993
62018
|
const hex = color.toHexString();
|
|
61994
62019
|
this.setState({ hex, color });
|
|
61995
62020
|
this.props.onColorChanged(hex);
|
|
@@ -62183,7 +62208,7 @@ class FloatLineComponent extends react__WEBPACK_IMPORTED_MODULE_1__.Component {
|
|
|
62183
62208
|
this.props.onDragStop(valueAsNumber);
|
|
62184
62209
|
}
|
|
62185
62210
|
this.setState({ dragging: newDragging });
|
|
62186
|
-
} }))] })), this.props.unit] }))), this.props.useEuler && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_sliderLineComponent__WEBPACK_IMPORTED_MODULE_2__.SliderLineComponent, { label: this.props.label, minimum: 0, maximum: 360, step: 0.1, directValue: core_Misc_tools__WEBPACK_IMPORTED_MODULE_3__.Tools.ToDegrees(valueAsNumber), onChange: (value) => this.updateValue(core_Misc_tools__WEBPACK_IMPORTED_MODULE_3__.Tools.ToRadians(value).toString()) }))] }));
|
|
62211
|
+
} }))] })), this.props.unit] }))), this.props.useEuler && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_sliderLineComponent__WEBPACK_IMPORTED_MODULE_2__.SliderLineComponent, { lockObject: this.props.lockObject, label: this.props.label, minimum: 0, maximum: 360, step: 0.1, directValue: core_Misc_tools__WEBPACK_IMPORTED_MODULE_3__.Tools.ToDegrees(valueAsNumber), onChange: (value) => this.updateValue(core_Misc_tools__WEBPACK_IMPORTED_MODULE_3__.Tools.ToRadians(value).toString()) }))] }));
|
|
62187
62212
|
}
|
|
62188
62213
|
}
|
|
62189
62214
|
|
|
@@ -62363,7 +62388,7 @@ class MatrixLineComponent extends react__WEBPACK_IMPORTED_MODULE_1__.Component {
|
|
|
62363
62388
|
if (this.props.onModeChange) {
|
|
62364
62389
|
this.props.onModeChange(value);
|
|
62365
62390
|
}
|
|
62366
|
-
} }) })), this.state.mode === 0 && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", Object.assign({ className: "secondLine" }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_vector4LineComponent__WEBPACK_IMPORTED_MODULE_3__.Vector4LineComponent, { label: "Row #0", value: this.state.value.getRow(0), onChange: (value) => this.updateRow(value, 0) }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_vector4LineComponent__WEBPACK_IMPORTED_MODULE_3__.Vector4LineComponent, { label: "Row #1", value: this.state.value.getRow(1), onChange: (value) => this.updateRow(value, 1) }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_vector4LineComponent__WEBPACK_IMPORTED_MODULE_3__.Vector4LineComponent, { label: "Row #2", value: this.state.value.getRow(2), onChange: (value) => this.updateRow(value, 2) }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_vector4LineComponent__WEBPACK_IMPORTED_MODULE_3__.Vector4LineComponent, { label: "Row #3", value: this.state.value.getRow(3), onChange: (value) => this.updateRow(value, 3) })] }))), this.state.mode !== 0 && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", Object.assign({ className: "secondLine" }, { children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_sliderLineComponent__WEBPACK_IMPORTED_MODULE_5__.SliderLineComponent, { label: "Angle", minimum: 0, maximum: 2 * Math.PI, useEuler: true, step: 0.1, directValue: this.state.angle, onChange: (value) => this.updateBasedOnMode(value) }) })))] })));
|
|
62391
|
+
} }) })), this.state.mode === 0 && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", Object.assign({ className: "secondLine" }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_vector4LineComponent__WEBPACK_IMPORTED_MODULE_3__.Vector4LineComponent, { lockObject: this.props.lockObject, label: "Row #0", value: this.state.value.getRow(0), onChange: (value) => this.updateRow(value, 0) }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_vector4LineComponent__WEBPACK_IMPORTED_MODULE_3__.Vector4LineComponent, { lockObject: this.props.lockObject, label: "Row #1", value: this.state.value.getRow(1), onChange: (value) => this.updateRow(value, 1) }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_vector4LineComponent__WEBPACK_IMPORTED_MODULE_3__.Vector4LineComponent, { lockObject: this.props.lockObject, label: "Row #2", value: this.state.value.getRow(2), onChange: (value) => this.updateRow(value, 2) }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_vector4LineComponent__WEBPACK_IMPORTED_MODULE_3__.Vector4LineComponent, { lockObject: this.props.lockObject, label: "Row #3", value: this.state.value.getRow(3), onChange: (value) => this.updateRow(value, 3) })] }))), this.state.mode !== 0 && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", Object.assign({ className: "secondLine" }, { children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_sliderLineComponent__WEBPACK_IMPORTED_MODULE_5__.SliderLineComponent, { label: "Angle", lockObject: this.props.lockObject, minimum: 0, maximum: 2 * Math.PI, useEuler: true, step: 0.1, directValue: this.state.angle, onChange: (value) => this.updateBasedOnMode(value) }) })))] })));
|
|
62367
62392
|
}
|
|
62368
62393
|
}
|
|
62369
62394
|
|
|
@@ -62391,6 +62416,11 @@ class NumericInputComponent extends react__WEBPACK_IMPORTED_MODULE_1__.Component
|
|
|
62391
62416
|
this._localChange = false;
|
|
62392
62417
|
this.state = { value: this.props.value.toFixed(this.props.precision !== undefined ? this.props.precision : 3) };
|
|
62393
62418
|
}
|
|
62419
|
+
componentWillUnmount() {
|
|
62420
|
+
if (this.props.lockObject) {
|
|
62421
|
+
this.props.lockObject.lock = false;
|
|
62422
|
+
}
|
|
62423
|
+
}
|
|
62394
62424
|
shouldComponentUpdate(nextProps, nextState) {
|
|
62395
62425
|
if (this._localChange) {
|
|
62396
62426
|
return true;
|
|
@@ -62417,6 +62447,9 @@ class NumericInputComponent extends react__WEBPACK_IMPORTED_MODULE_1__.Component
|
|
|
62417
62447
|
onBlur() {
|
|
62418
62448
|
this._localChange = false;
|
|
62419
62449
|
const valueAsNumber = parseFloat(this.state.value);
|
|
62450
|
+
if (this.props.lockObject) {
|
|
62451
|
+
this.props.lockObject.lock = false;
|
|
62452
|
+
}
|
|
62420
62453
|
if (isNaN(valueAsNumber)) {
|
|
62421
62454
|
this.props.onChange(this.props.value);
|
|
62422
62455
|
return;
|
|
@@ -62424,7 +62457,11 @@ class NumericInputComponent extends react__WEBPACK_IMPORTED_MODULE_1__.Component
|
|
|
62424
62457
|
this.props.onChange(valueAsNumber);
|
|
62425
62458
|
}
|
|
62426
62459
|
render() {
|
|
62427
|
-
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", Object.assign({ className: "numeric" }, { children: [this.props.icon && (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("img", { src: this.props.icon, title: this.props.iconLabel, alt: this.props.iconLabel, className: "icon" }), this.props.label && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", Object.assign({ className: "numeric-label", title: this.props.label }, { children: `${this.props.label}: ` }))), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("input", { type: "number", step: this.props.step, className: "numeric-input", value: this.state.value, onChange: (evt) => this.updateValue(evt),
|
|
62460
|
+
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", Object.assign({ className: "numeric" }, { children: [this.props.icon && (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("img", { src: this.props.icon, title: this.props.iconLabel, alt: this.props.iconLabel, className: "icon" }), this.props.label && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", Object.assign({ className: "numeric-label", title: this.props.label }, { children: `${this.props.label}: ` }))), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("input", { type: "number", step: this.props.step, className: "numeric-input", value: this.state.value, onChange: (evt) => this.updateValue(evt), onFocus: () => {
|
|
62461
|
+
if (this.props.lockObject) {
|
|
62462
|
+
this.props.lockObject.lock = true;
|
|
62463
|
+
}
|
|
62464
|
+
}, onBlur: () => this.onBlur() })] })));
|
|
62428
62465
|
}
|
|
62429
62466
|
}
|
|
62430
62467
|
// eslint-disable-next-line @typescript-eslint/naming-convention
|
|
@@ -62767,7 +62804,7 @@ class TextInputLineComponent extends react__WEBPACK_IMPORTED_MODULE_1__.Componen
|
|
|
62767
62804
|
}
|
|
62768
62805
|
return 0;
|
|
62769
62806
|
}
|
|
62770
|
-
updateValue(value) {
|
|
62807
|
+
updateValue(value, valueToValidate) {
|
|
62771
62808
|
if (this.props.numbersOnly) {
|
|
62772
62809
|
if (/[^0-9.\p\x%-]/g.test(value)) {
|
|
62773
62810
|
return;
|
|
@@ -62795,8 +62832,8 @@ class TextInputLineComponent extends react__WEBPACK_IMPORTED_MODULE_1__.Componen
|
|
|
62795
62832
|
}
|
|
62796
62833
|
this._localChange = true;
|
|
62797
62834
|
const store = this.props.value !== undefined ? this.props.value : this.props.target[this.props.propertyName];
|
|
62798
|
-
if (this.props.validator) {
|
|
62799
|
-
if (this.props.validator(
|
|
62835
|
+
if (this.props.validator && valueToValidate) {
|
|
62836
|
+
if (this.props.validator(valueToValidate) == false) {
|
|
62800
62837
|
value = store;
|
|
62801
62838
|
}
|
|
62802
62839
|
}
|
|
@@ -62843,15 +62880,15 @@ class TextInputLineComponent extends react__WEBPACK_IMPORTED_MODULE_1__.Componen
|
|
|
62843
62880
|
}
|
|
62844
62881
|
this.updateValue(this.state.value);
|
|
62845
62882
|
}, onBlur: (evt) => {
|
|
62846
|
-
this.updateValue(evt.target.value);
|
|
62883
|
+
this.updateValue(evt.target.value, evt.target.value);
|
|
62847
62884
|
if (this.props.lockObject) {
|
|
62848
62885
|
this.props.lockObject.lock = false;
|
|
62849
62886
|
}
|
|
62850
|
-
} }) })), !this.props.multilines && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", Object.assign({ className: `value${this.props.noUnderline === true ? " noUnderline" : ""}${this.props.arrows ? " hasArrows" : ""}${this.state.dragging ? " dragging" : ""}` }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("input", { value: value, onBlur: () => {
|
|
62887
|
+
} }) })), !this.props.multilines && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", Object.assign({ className: `value${this.props.noUnderline === true ? " noUnderline" : ""}${this.props.arrows ? " hasArrows" : ""}${this.state.dragging ? " dragging" : ""}` }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("input", { value: value, onBlur: (evt) => {
|
|
62851
62888
|
if (this.props.lockObject) {
|
|
62852
62889
|
this.props.lockObject.lock = false;
|
|
62853
62890
|
}
|
|
62854
|
-
this.updateValue((this.props.value !== undefined ? this.props.value : this.props.target[this.props.propertyName]) || "");
|
|
62891
|
+
this.updateValue((this.props.value !== undefined ? this.props.value : this.props.target[this.props.propertyName]) || "", evt.target.value);
|
|
62855
62892
|
}, onFocus: () => {
|
|
62856
62893
|
if (this.props.lockObject) {
|
|
62857
62894
|
this.props.lockObject.lock = true;
|
|
@@ -62861,6 +62898,53 @@ class TextInputLineComponent extends react__WEBPACK_IMPORTED_MODULE_1__.Componen
|
|
|
62861
62898
|
}
|
|
62862
62899
|
|
|
62863
62900
|
|
|
62901
|
+
/***/ }),
|
|
62902
|
+
|
|
62903
|
+
/***/ "../../../dev/sharedUiComponents/dist/lines/textLineComponent.js":
|
|
62904
|
+
/*!***********************************************************************!*\
|
|
62905
|
+
!*** ../../../dev/sharedUiComponents/dist/lines/textLineComponent.js ***!
|
|
62906
|
+
\***********************************************************************/
|
|
62907
|
+
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
|
|
62908
|
+
|
|
62909
|
+
"use strict";
|
|
62910
|
+
__webpack_require__.r(__webpack_exports__);
|
|
62911
|
+
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
|
|
62912
|
+
/* harmony export */ "TextLineComponent": () => (/* binding */ TextLineComponent)
|
|
62913
|
+
/* harmony export */ });
|
|
62914
|
+
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react/jsx-runtime */ "../../../../node_modules/react/jsx-runtime.js");
|
|
62915
|
+
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! react */ "../../../../node_modules/react/index.js");
|
|
62916
|
+
|
|
62917
|
+
|
|
62918
|
+
class TextLineComponent extends react__WEBPACK_IMPORTED_MODULE_1__.Component {
|
|
62919
|
+
constructor(props) {
|
|
62920
|
+
super(props);
|
|
62921
|
+
}
|
|
62922
|
+
onLink() {
|
|
62923
|
+
if (this.props.url) {
|
|
62924
|
+
window.open(this.props.url, "_blank");
|
|
62925
|
+
return;
|
|
62926
|
+
}
|
|
62927
|
+
if (!this.props.onLink) {
|
|
62928
|
+
return;
|
|
62929
|
+
}
|
|
62930
|
+
this.props.onLink();
|
|
62931
|
+
}
|
|
62932
|
+
renderContent() {
|
|
62933
|
+
if (this.props.ignoreValue) {
|
|
62934
|
+
return null;
|
|
62935
|
+
}
|
|
62936
|
+
if (this.props.onLink || this.props.url) {
|
|
62937
|
+
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", Object.assign({ className: "link-value", title: this.props.value, onClick: () => this.onLink() }, { children: this.props.url ? "doc" : this.props.value || "no name" })));
|
|
62938
|
+
}
|
|
62939
|
+
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", Object.assign({ className: "value", title: this.props.value, style: { color: this.props.color ? this.props.color : "" } }, { children: this.props.value || "no name" })));
|
|
62940
|
+
}
|
|
62941
|
+
render() {
|
|
62942
|
+
var _a, _b, _c;
|
|
62943
|
+
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", Object.assign({ className: this.props.underline ? "textLine underline" : "textLine" + (this.props.additionalClass ? " " + this.props.additionalClass : "") }, { children: [this.props.icon && (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("img", { src: this.props.icon, title: this.props.iconLabel, alt: this.props.iconLabel, className: "icon" }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", Object.assign({ className: "label", title: (_b = (_a = this.props.tooltip) !== null && _a !== void 0 ? _a : this.props.label) !== null && _b !== void 0 ? _b : "" }, { children: (_c = this.props.label) !== null && _c !== void 0 ? _c : "" })), this.renderContent()] })));
|
|
62944
|
+
}
|
|
62945
|
+
}
|
|
62946
|
+
|
|
62947
|
+
|
|
62864
62948
|
/***/ }),
|
|
62865
62949
|
|
|
62866
62950
|
/***/ "../../../dev/sharedUiComponents/dist/lines/vector2LineComponent.js":
|
|
@@ -62935,7 +63019,7 @@ class Vector2LineComponent extends react__WEBPACK_IMPORTED_MODULE_1__.Component
|
|
|
62935
63019
|
}
|
|
62936
63020
|
render() {
|
|
62937
63021
|
const chevron = this.state.isExpanded ? (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_fortawesome_react_fontawesome__WEBPACK_IMPORTED_MODULE_3__.FontAwesomeIcon, { icon: _fortawesome_free_solid_svg_icons__WEBPACK_IMPORTED_MODULE_4__.faMinus }) : (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_fortawesome_react_fontawesome__WEBPACK_IMPORTED_MODULE_3__.FontAwesomeIcon, { icon: _fortawesome_free_solid_svg_icons__WEBPACK_IMPORTED_MODULE_4__.faPlus });
|
|
62938
|
-
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", Object.assign({ className: "vector3Line" }, { children: [this.props.icon && (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("img", { src: this.props.icon, title: this.props.iconLabel, alt: this.props.iconLabel, className: "icon" }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", Object.assign({ className: "firstLine", title: this.props.label }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", Object.assign({ className: "label" }, { children: this.props.label })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", Object.assign({ className: "vector" }, { children: `X: ${this.state.value.x.toFixed(2)}, Y: ${this.state.value.y.toFixed(2)}` })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", Object.assign({ className: "expand hoverIcon", onClick: () => this.switchExpandState(), title: "Expand" }, { children: chevron }))] })), this.state.isExpanded && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", Object.assign({ className: "secondLine" }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_numericInputComponent__WEBPACK_IMPORTED_MODULE_2__.NumericInputComponent, { label: "x", step: this.props.step, value: this.state.value.x, onChange: (value) => this.updateStateX(value) }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_numericInputComponent__WEBPACK_IMPORTED_MODULE_2__.NumericInputComponent, { label: "y", step: this.props.step, value: this.state.value.y, onChange: (value) => this.updateStateY(value) })] })))] })));
|
|
63022
|
+
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", Object.assign({ className: "vector3Line" }, { children: [this.props.icon && (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("img", { src: this.props.icon, title: this.props.iconLabel, alt: this.props.iconLabel, className: "icon" }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", Object.assign({ className: "firstLine", title: this.props.label }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", Object.assign({ className: "label" }, { children: this.props.label })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", Object.assign({ className: "vector" }, { children: `X: ${this.state.value.x.toFixed(2)}, Y: ${this.state.value.y.toFixed(2)}` })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", Object.assign({ className: "expand hoverIcon", onClick: () => this.switchExpandState(), title: "Expand" }, { children: chevron }))] })), this.state.isExpanded && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", Object.assign({ className: "secondLine" }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_numericInputComponent__WEBPACK_IMPORTED_MODULE_2__.NumericInputComponent, { lockObject: this.props.lockObject, label: "x", step: this.props.step, value: this.state.value.x, onChange: (value) => this.updateStateX(value) }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_numericInputComponent__WEBPACK_IMPORTED_MODULE_2__.NumericInputComponent, { lockObject: this.props.lockObject, label: "y", step: this.props.step, value: this.state.value.y, onChange: (value) => this.updateStateY(value) })] })))] })));
|
|
62939
63023
|
}
|
|
62940
63024
|
}
|
|
62941
63025
|
// eslint-disable-next-line @typescript-eslint/naming-convention
|
|
@@ -63032,7 +63116,7 @@ class Vector3LineComponent extends react__WEBPACK_IMPORTED_MODULE_1__.Component
|
|
|
63032
63116
|
render() {
|
|
63033
63117
|
const chevron = this.state.isExpanded ? (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_fortawesome_react_fontawesome__WEBPACK_IMPORTED_MODULE_3__.FontAwesomeIcon, { icon: _fortawesome_free_solid_svg_icons__WEBPACK_IMPORTED_MODULE_4__.faMinus }) : (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_fortawesome_react_fontawesome__WEBPACK_IMPORTED_MODULE_3__.FontAwesomeIcon, { icon: _fortawesome_free_solid_svg_icons__WEBPACK_IMPORTED_MODULE_4__.faPlus });
|
|
63034
63118
|
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", Object.assign({ className: "vector3Line" }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", Object.assign({ className: "firstLine" }, { children: [this.props.icon && (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("img", { src: this.props.icon, title: this.props.iconLabel, alt: this.props.iconLabel, className: "icon" }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", Object.assign({ className: "label", title: this.props.label }, { children: this.props.label })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", Object.assign({ className: "vector" }, { children: [!this.props.useEuler && `X: ${this.state.value.x.toFixed(2)}, Y: ${this.state.value.y.toFixed(2)}, Z: ${this.state.value.z.toFixed(2)}`, this.props.useEuler &&
|
|
63035
|
-
`X: ${core_Misc_tools__WEBPACK_IMPORTED_MODULE_6__.Tools.ToDegrees(this.state.value.x).toFixed(2)}, Y: ${core_Misc_tools__WEBPACK_IMPORTED_MODULE_6__.Tools.ToDegrees(this.state.value.y).toFixed(2)}, Z: ${core_Misc_tools__WEBPACK_IMPORTED_MODULE_6__.Tools.ToDegrees(this.state.value.z).toFixed(2)}`] })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", Object.assign({ className: "expand hoverIcon", onClick: () => this.switchExpandState(), title: "Expand" }, { children: chevron }))] })), this.state.isExpanded && !this.props.useEuler && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", Object.assign({ className: "secondLine" }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_lines_numericInputComponent__WEBPACK_IMPORTED_MODULE_2__.NumericInputComponent, { label: "x", step: this.props.step, value: this.state.value.x, onChange: (value) => this.updateStateX(value) }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_lines_numericInputComponent__WEBPACK_IMPORTED_MODULE_2__.NumericInputComponent, { label: "y", step: this.props.step, value: this.state.value.y, onChange: (value) => this.updateStateY(value) }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_lines_numericInputComponent__WEBPACK_IMPORTED_MODULE_2__.NumericInputComponent, { label: "z", step: this.props.step, value: this.state.value.z, onChange: (value) => this.updateStateZ(value) })] }))), this.state.isExpanded && this.props.useEuler && !this.props.noSlider && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", Object.assign({ className: "secondLine" }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_lines_sliderLineComponent__WEBPACK_IMPORTED_MODULE_5__.SliderLineComponent, { margin: true, label: "x", minimum: 0, maximum: 360, step: 0.1, directValue: core_Misc_tools__WEBPACK_IMPORTED_MODULE_6__.Tools.ToDegrees(this.state.value.x), onChange: (value) => this.updateStateX(core_Misc_tools__WEBPACK_IMPORTED_MODULE_6__.Tools.ToRadians(value)) }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_lines_sliderLineComponent__WEBPACK_IMPORTED_MODULE_5__.SliderLineComponent, { margin: true, label: "y", minimum: 0, maximum: 360, step: 0.1, directValue: core_Misc_tools__WEBPACK_IMPORTED_MODULE_6__.Tools.ToDegrees(this.state.value.y), onChange: (value) => this.updateStateY(core_Misc_tools__WEBPACK_IMPORTED_MODULE_6__.Tools.ToRadians(value)) }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_lines_sliderLineComponent__WEBPACK_IMPORTED_MODULE_5__.SliderLineComponent, { margin: true, label: "z", minimum: 0, maximum: 360, step: 0.1, directValue: core_Misc_tools__WEBPACK_IMPORTED_MODULE_6__.Tools.ToDegrees(this.state.value.z), onChange: (value) => this.updateStateZ(core_Misc_tools__WEBPACK_IMPORTED_MODULE_6__.Tools.ToRadians(value)) })] }))), this.state.isExpanded && this.props.useEuler && this.props.noSlider && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", Object.assign({ className: "secondLine" }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_lines_numericInputComponent__WEBPACK_IMPORTED_MODULE_2__.NumericInputComponent, { label: "x", step: this.props.step, value: core_Misc_tools__WEBPACK_IMPORTED_MODULE_6__.Tools.ToDegrees(this.state.value.x), onChange: (value) => this.updateStateX(core_Misc_tools__WEBPACK_IMPORTED_MODULE_6__.Tools.ToRadians(value)) }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_lines_numericInputComponent__WEBPACK_IMPORTED_MODULE_2__.NumericInputComponent, { label: "y", step: this.props.step, value: core_Misc_tools__WEBPACK_IMPORTED_MODULE_6__.Tools.ToDegrees(this.state.value.y), onChange: (value) => this.updateStateY(core_Misc_tools__WEBPACK_IMPORTED_MODULE_6__.Tools.ToRadians(value)) }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_lines_numericInputComponent__WEBPACK_IMPORTED_MODULE_2__.NumericInputComponent, { label: "z", step: this.props.step, value: core_Misc_tools__WEBPACK_IMPORTED_MODULE_6__.Tools.ToDegrees(this.state.value.z), onChange: (value) => this.updateStateZ(core_Misc_tools__WEBPACK_IMPORTED_MODULE_6__.Tools.ToRadians(value)) })] })))] })));
|
|
63119
|
+
`X: ${core_Misc_tools__WEBPACK_IMPORTED_MODULE_6__.Tools.ToDegrees(this.state.value.x).toFixed(2)}, Y: ${core_Misc_tools__WEBPACK_IMPORTED_MODULE_6__.Tools.ToDegrees(this.state.value.y).toFixed(2)}, Z: ${core_Misc_tools__WEBPACK_IMPORTED_MODULE_6__.Tools.ToDegrees(this.state.value.z).toFixed(2)}`] })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", Object.assign({ className: "expand hoverIcon", onClick: () => this.switchExpandState(), title: "Expand" }, { children: chevron }))] })), this.state.isExpanded && !this.props.useEuler && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", Object.assign({ className: "secondLine" }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_lines_numericInputComponent__WEBPACK_IMPORTED_MODULE_2__.NumericInputComponent, { label: "x", lockObject: this.props.lockObject, step: this.props.step, value: this.state.value.x, onChange: (value) => this.updateStateX(value) }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_lines_numericInputComponent__WEBPACK_IMPORTED_MODULE_2__.NumericInputComponent, { label: "y", lockObject: this.props.lockObject, step: this.props.step, value: this.state.value.y, onChange: (value) => this.updateStateY(value) }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_lines_numericInputComponent__WEBPACK_IMPORTED_MODULE_2__.NumericInputComponent, { label: "z", lockObject: this.props.lockObject, step: this.props.step, value: this.state.value.z, onChange: (value) => this.updateStateZ(value) })] }))), this.state.isExpanded && this.props.useEuler && !this.props.noSlider && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", Object.assign({ className: "secondLine" }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_lines_sliderLineComponent__WEBPACK_IMPORTED_MODULE_5__.SliderLineComponent, { lockObject: this.props.lockObject, margin: true, label: "x", minimum: 0, maximum: 360, step: 0.1, directValue: core_Misc_tools__WEBPACK_IMPORTED_MODULE_6__.Tools.ToDegrees(this.state.value.x), onChange: (value) => this.updateStateX(core_Misc_tools__WEBPACK_IMPORTED_MODULE_6__.Tools.ToRadians(value)) }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_lines_sliderLineComponent__WEBPACK_IMPORTED_MODULE_5__.SliderLineComponent, { lockObject: this.props.lockObject, margin: true, label: "y", minimum: 0, maximum: 360, step: 0.1, directValue: core_Misc_tools__WEBPACK_IMPORTED_MODULE_6__.Tools.ToDegrees(this.state.value.y), onChange: (value) => this.updateStateY(core_Misc_tools__WEBPACK_IMPORTED_MODULE_6__.Tools.ToRadians(value)) }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_lines_sliderLineComponent__WEBPACK_IMPORTED_MODULE_5__.SliderLineComponent, { lockObject: this.props.lockObject, margin: true, label: "z", minimum: 0, maximum: 360, step: 0.1, directValue: core_Misc_tools__WEBPACK_IMPORTED_MODULE_6__.Tools.ToDegrees(this.state.value.z), onChange: (value) => this.updateStateZ(core_Misc_tools__WEBPACK_IMPORTED_MODULE_6__.Tools.ToRadians(value)) })] }))), this.state.isExpanded && this.props.useEuler && this.props.noSlider && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", Object.assign({ className: "secondLine" }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_lines_numericInputComponent__WEBPACK_IMPORTED_MODULE_2__.NumericInputComponent, { lockObject: this.props.lockObject, label: "x", step: this.props.step, value: core_Misc_tools__WEBPACK_IMPORTED_MODULE_6__.Tools.ToDegrees(this.state.value.x), onChange: (value) => this.updateStateX(core_Misc_tools__WEBPACK_IMPORTED_MODULE_6__.Tools.ToRadians(value)) }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_lines_numericInputComponent__WEBPACK_IMPORTED_MODULE_2__.NumericInputComponent, { lockObject: this.props.lockObject, label: "y", step: this.props.step, value: core_Misc_tools__WEBPACK_IMPORTED_MODULE_6__.Tools.ToDegrees(this.state.value.y), onChange: (value) => this.updateStateY(core_Misc_tools__WEBPACK_IMPORTED_MODULE_6__.Tools.ToRadians(value)) }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_lines_numericInputComponent__WEBPACK_IMPORTED_MODULE_2__.NumericInputComponent, { lockObject: this.props.lockObject, label: "z", step: this.props.step, value: core_Misc_tools__WEBPACK_IMPORTED_MODULE_6__.Tools.ToDegrees(this.state.value.z), onChange: (value) => this.updateStateZ(core_Misc_tools__WEBPACK_IMPORTED_MODULE_6__.Tools.ToRadians(value)) })] })))] })));
|
|
63036
63120
|
}
|
|
63037
63121
|
}
|
|
63038
63122
|
// eslint-disable-next-line @typescript-eslint/naming-convention
|
|
@@ -63133,7 +63217,7 @@ class Vector4LineComponent extends react__WEBPACK_IMPORTED_MODULE_1__.Component
|
|
|
63133
63217
|
}
|
|
63134
63218
|
render() {
|
|
63135
63219
|
const chevron = this.state.isExpanded ? (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_fortawesome_react_fontawesome__WEBPACK_IMPORTED_MODULE_3__.FontAwesomeIcon, { icon: _fortawesome_free_solid_svg_icons__WEBPACK_IMPORTED_MODULE_4__.faMinus }) : (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_fortawesome_react_fontawesome__WEBPACK_IMPORTED_MODULE_3__.FontAwesomeIcon, { icon: _fortawesome_free_solid_svg_icons__WEBPACK_IMPORTED_MODULE_4__.faPlus });
|
|
63136
|
-
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", Object.assign({ className: "vector3Line" }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", Object.assign({ className: "firstLine" }, { children: [this.props.icon && (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("img", { src: this.props.icon, title: this.props.iconLabel, alt: this.props.iconLabel, className: "icon" }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", Object.assign({ className: "label", title: this.props.label }, { children: this.props.label })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", Object.assign({ className: "vector" }, { children: `X: ${this.state.value.x.toFixed(2)}, Y: ${this.state.value.y.toFixed(2)}, Z: ${this.state.value.z.toFixed(2)}, W: ${this.state.value.w.toFixed(2)}` })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", Object.assign({ className: "expand hoverIcon", onClick: () => this.switchExpandState(), title: "Expand" }, { children: chevron }))] })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", Object.assign({ className: "secondLine" }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_numericInputComponent__WEBPACK_IMPORTED_MODULE_2__.NumericInputComponent, { label: "x", step: this.props.step, value: this.state.value.x, onChange: (value) => this.updateStateX(value) }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_numericInputComponent__WEBPACK_IMPORTED_MODULE_2__.NumericInputComponent, { label: "y", step: this.props.step, value: this.state.value.y, onChange: (value) => this.updateStateY(value) }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_numericInputComponent__WEBPACK_IMPORTED_MODULE_2__.NumericInputComponent, { label: "z", step: this.props.step, value: this.state.value.z, onChange: (value) => this.updateStateZ(value) }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_numericInputComponent__WEBPACK_IMPORTED_MODULE_2__.NumericInputComponent, { label: "w", step: this.props.step, value: this.state.value.w, onChange: (value) => this.updateStateW(value) })] }))] })));
|
|
63220
|
+
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", Object.assign({ className: "vector3Line" }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", Object.assign({ className: "firstLine" }, { children: [this.props.icon && (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("img", { src: this.props.icon, title: this.props.iconLabel, alt: this.props.iconLabel, className: "icon" }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", Object.assign({ className: "label", title: this.props.label }, { children: this.props.label })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", Object.assign({ className: "vector" }, { children: `X: ${this.state.value.x.toFixed(2)}, Y: ${this.state.value.y.toFixed(2)}, Z: ${this.state.value.z.toFixed(2)}, W: ${this.state.value.w.toFixed(2)}` })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", Object.assign({ className: "expand hoverIcon", onClick: () => this.switchExpandState(), title: "Expand" }, { children: chevron }))] })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", Object.assign({ className: "secondLine" }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_numericInputComponent__WEBPACK_IMPORTED_MODULE_2__.NumericInputComponent, { lockObject: this.props.lockObject, label: "x", step: this.props.step, value: this.state.value.x, onChange: (value) => this.updateStateX(value) }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_numericInputComponent__WEBPACK_IMPORTED_MODULE_2__.NumericInputComponent, { lockObject: this.props.lockObject, label: "y", step: this.props.step, value: this.state.value.y, onChange: (value) => this.updateStateY(value) }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_numericInputComponent__WEBPACK_IMPORTED_MODULE_2__.NumericInputComponent, { lockObject: this.props.lockObject, label: "z", step: this.props.step, value: this.state.value.z, onChange: (value) => this.updateStateZ(value) }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_numericInputComponent__WEBPACK_IMPORTED_MODULE_2__.NumericInputComponent, { lockObject: this.props.lockObject, label: "w", step: this.props.step, value: this.state.value.w, onChange: (value) => this.updateStateW(value) })] }))] })));
|
|
63137
63221
|
}
|
|
63138
63222
|
}
|
|
63139
63223
|
// eslint-disable-next-line @typescript-eslint/naming-convention
|
|
@@ -63312,6 +63396,8 @@ class GraphCanvasComponent extends react__WEBPACK_IMPORTED_MODULE_1__.Component
|
|
|
63312
63396
|
this._oldY = -1;
|
|
63313
63397
|
this._frameIsMoving = false;
|
|
63314
63398
|
this._isLoading = false;
|
|
63399
|
+
this._copiedNodes = [];
|
|
63400
|
+
this._copiedFrames = [];
|
|
63315
63401
|
props.stateManager.onSelectionChangedObservable.add((options) => {
|
|
63316
63402
|
const { selection, forceKeepSelection, marqueeSelection = false } = options || {};
|
|
63317
63403
|
if (!selection) {
|
|
@@ -63504,6 +63590,216 @@ class GraphCanvasComponent extends react__WEBPACK_IMPORTED_MODULE_1__.Component
|
|
|
63504
63590
|
}
|
|
63505
63591
|
return false;
|
|
63506
63592
|
}
|
|
63593
|
+
populateConnectedEntriesBeforeRemoval(item, items, inputs, outputs) {
|
|
63594
|
+
inputs.push(...item.content.inputs.filter((i) => i.isConnected && items.every((selected) => { var _a; return selected.content.data !== ((_a = i.connectedPort) === null || _a === void 0 ? void 0 : _a.ownerData); })).map((i) => i.connectedPort));
|
|
63595
|
+
outputs.push(...item.content.outputs
|
|
63596
|
+
.filter((i) => i.isConnected)
|
|
63597
|
+
.map((i) => i.endpoints)
|
|
63598
|
+
.flat()
|
|
63599
|
+
.filter((i) => i && items.every((selected) => selected.content.data !== i.ownerData)));
|
|
63600
|
+
}
|
|
63601
|
+
automaticRewire(inputs, outputs) {
|
|
63602
|
+
if (outputs.length && inputs.length) {
|
|
63603
|
+
inputs.forEach((input) => {
|
|
63604
|
+
if (!input) {
|
|
63605
|
+
return;
|
|
63606
|
+
}
|
|
63607
|
+
const output = outputs[0];
|
|
63608
|
+
if (output && input.canConnectTo(output)) {
|
|
63609
|
+
const nodeInput = this.findNodeFromData(input.ownerData);
|
|
63610
|
+
const nodeOutput = this.findNodeFromData(output.ownerData);
|
|
63611
|
+
this.connectNodes(nodeInput, input, nodeOutput, output);
|
|
63612
|
+
outputs.shift();
|
|
63613
|
+
}
|
|
63614
|
+
});
|
|
63615
|
+
}
|
|
63616
|
+
}
|
|
63617
|
+
handleKeyDown(evt, onRemove, mouseLocationX, mouseLocationY, dataGenerator, rootElement) {
|
|
63618
|
+
if ((evt.keyCode === 46 || evt.keyCode === 8) && !this.props.stateManager.lockObject.lock) {
|
|
63619
|
+
// Delete
|
|
63620
|
+
const selectedItems = this.selectedNodes;
|
|
63621
|
+
const inputs = [];
|
|
63622
|
+
const outputs = [];
|
|
63623
|
+
if (selectedItems.length > 0) {
|
|
63624
|
+
for (const selectedItem of selectedItems) {
|
|
63625
|
+
if (evt.altKey) {
|
|
63626
|
+
this.populateConnectedEntriesBeforeRemoval(selectedItem, selectedItems, inputs, outputs);
|
|
63627
|
+
}
|
|
63628
|
+
selectedItem.dispose();
|
|
63629
|
+
onRemove(selectedItem.content);
|
|
63630
|
+
this.removeDataFromCache(selectedItem.content.data);
|
|
63631
|
+
}
|
|
63632
|
+
}
|
|
63633
|
+
if (this.selectedLink) {
|
|
63634
|
+
this.selectedLink.dispose();
|
|
63635
|
+
}
|
|
63636
|
+
if (this.selectedFrames.length) {
|
|
63637
|
+
for (const frame of this.selectedFrames) {
|
|
63638
|
+
if (frame.isCollapsed) {
|
|
63639
|
+
while (frame.nodes.length > 0) {
|
|
63640
|
+
onRemove(frame.nodes[0].content);
|
|
63641
|
+
this.removeDataFromCache(frame.nodes[0].content.data);
|
|
63642
|
+
frame.nodes[0].dispose();
|
|
63643
|
+
}
|
|
63644
|
+
frame.isCollapsed = false;
|
|
63645
|
+
}
|
|
63646
|
+
else {
|
|
63647
|
+
frame.nodes.forEach((node) => {
|
|
63648
|
+
node.enclosingFrameId = -1;
|
|
63649
|
+
});
|
|
63650
|
+
}
|
|
63651
|
+
frame.dispose();
|
|
63652
|
+
}
|
|
63653
|
+
}
|
|
63654
|
+
// Reconnect if required
|
|
63655
|
+
this.automaticRewire(inputs, outputs);
|
|
63656
|
+
this.props.stateManager.onSelectionChangedObservable.notifyObservers(null);
|
|
63657
|
+
this.props.stateManager.onRebuildRequiredObservable.notifyObservers(false);
|
|
63658
|
+
return;
|
|
63659
|
+
}
|
|
63660
|
+
if (!evt.ctrlKey || this.props.stateManager.lockObject.lock) {
|
|
63661
|
+
return;
|
|
63662
|
+
}
|
|
63663
|
+
if (evt.key === "c" || evt.key === "C") {
|
|
63664
|
+
// Copy
|
|
63665
|
+
this._copiedNodes = [];
|
|
63666
|
+
this._copiedFrames = [];
|
|
63667
|
+
if (this.selectedFrames.length) {
|
|
63668
|
+
for (const frame of this.selectedFrames) {
|
|
63669
|
+
frame.serialize(true);
|
|
63670
|
+
this._copiedFrames.push(frame);
|
|
63671
|
+
}
|
|
63672
|
+
return;
|
|
63673
|
+
}
|
|
63674
|
+
const selectedItems = this.selectedNodes;
|
|
63675
|
+
if (!selectedItems.length) {
|
|
63676
|
+
return;
|
|
63677
|
+
}
|
|
63678
|
+
const selectedItem = selectedItems[0];
|
|
63679
|
+
if (!selectedItem.content.data) {
|
|
63680
|
+
return;
|
|
63681
|
+
}
|
|
63682
|
+
this._copiedNodes = selectedItems.slice(0);
|
|
63683
|
+
}
|
|
63684
|
+
else if (evt.key === "v" || evt.key === "V") {
|
|
63685
|
+
// Paste
|
|
63686
|
+
const zoomLevel = this.zoom;
|
|
63687
|
+
let currentY = (mouseLocationY - rootElement.offsetTop - this.y - 20) / zoomLevel;
|
|
63688
|
+
if (this._copiedFrames.length) {
|
|
63689
|
+
for (const frame of this._copiedFrames) {
|
|
63690
|
+
// New frame
|
|
63691
|
+
const newFrame = new _graphFrame__WEBPACK_IMPORTED_MODULE_7__.GraphFrame(null, this, true);
|
|
63692
|
+
this.frames.push(newFrame);
|
|
63693
|
+
newFrame.width = frame.width;
|
|
63694
|
+
newFrame.height = frame.height;
|
|
63695
|
+
newFrame.width / 2;
|
|
63696
|
+
newFrame.name = frame.name;
|
|
63697
|
+
newFrame.color = frame.color;
|
|
63698
|
+
let currentX = (mouseLocationX - rootElement.offsetLeft - this.x) / zoomLevel;
|
|
63699
|
+
newFrame.x = currentX - newFrame.width / 2;
|
|
63700
|
+
newFrame.y = currentY;
|
|
63701
|
+
// Paste nodes
|
|
63702
|
+
if (frame.nodes.length) {
|
|
63703
|
+
currentX = newFrame.x + frame.nodes[0].x - frame.x;
|
|
63704
|
+
currentY = newFrame.y + frame.nodes[0].y - frame.y;
|
|
63705
|
+
this._frameIsMoving = true;
|
|
63706
|
+
const newNodes = this.pasteSelection(frame.nodes, currentX, currentY, dataGenerator);
|
|
63707
|
+
if (newNodes) {
|
|
63708
|
+
for (const node of newNodes) {
|
|
63709
|
+
newFrame.syncNode(node);
|
|
63710
|
+
}
|
|
63711
|
+
}
|
|
63712
|
+
this._frameIsMoving = false;
|
|
63713
|
+
}
|
|
63714
|
+
newFrame.adjustPorts();
|
|
63715
|
+
if (frame.isCollapsed) {
|
|
63716
|
+
newFrame.isCollapsed = true;
|
|
63717
|
+
}
|
|
63718
|
+
// Select
|
|
63719
|
+
this.props.stateManager.onSelectionChangedObservable.notifyObservers({ selection: newFrame, forceKeepSelection: true });
|
|
63720
|
+
return;
|
|
63721
|
+
}
|
|
63722
|
+
}
|
|
63723
|
+
if (!this._copiedNodes.length) {
|
|
63724
|
+
return;
|
|
63725
|
+
}
|
|
63726
|
+
const currentX = (mouseLocationX - rootElement.offsetLeft - this.x - GraphCanvasComponent.NodeWidth) / zoomLevel;
|
|
63727
|
+
this.pasteSelection(this._copiedNodes, currentX, currentY, dataGenerator, true);
|
|
63728
|
+
}
|
|
63729
|
+
}
|
|
63730
|
+
pasteSelection(copiedNodes, currentX, currentY, dataGenerator, selectNew = false) {
|
|
63731
|
+
let originalNode = null;
|
|
63732
|
+
const newNodes = [];
|
|
63733
|
+
// Copy to prevent recursive side effects while creating nodes.
|
|
63734
|
+
copiedNodes = copiedNodes.slice();
|
|
63735
|
+
// Cancel selection
|
|
63736
|
+
this.props.stateManager.onSelectionChangedObservable.notifyObservers(null);
|
|
63737
|
+
// Create new nodes
|
|
63738
|
+
for (const node of copiedNodes) {
|
|
63739
|
+
const data = node.content.data;
|
|
63740
|
+
if (!data) {
|
|
63741
|
+
continue;
|
|
63742
|
+
}
|
|
63743
|
+
const newNode = dataGenerator(node.content);
|
|
63744
|
+
let x = 0;
|
|
63745
|
+
let y = 0;
|
|
63746
|
+
if (originalNode) {
|
|
63747
|
+
x = currentX + node.x - originalNode.x;
|
|
63748
|
+
y = currentY + node.y - originalNode.y;
|
|
63749
|
+
}
|
|
63750
|
+
else {
|
|
63751
|
+
originalNode = node;
|
|
63752
|
+
x = currentX;
|
|
63753
|
+
y = currentY;
|
|
63754
|
+
}
|
|
63755
|
+
newNode.x = x;
|
|
63756
|
+
newNode.y = y;
|
|
63757
|
+
newNode.cleanAccumulation();
|
|
63758
|
+
newNodes.push(newNode);
|
|
63759
|
+
if (selectNew) {
|
|
63760
|
+
this.props.stateManager.onSelectionChangedObservable.notifyObservers({ selection: newNode, forceKeepSelection: true });
|
|
63761
|
+
}
|
|
63762
|
+
}
|
|
63763
|
+
// Relink
|
|
63764
|
+
const done = new Array(newNodes.length);
|
|
63765
|
+
for (let index = 0; index < newNodes.length; index++) {
|
|
63766
|
+
this.reconnectNewNodes(index, newNodes, copiedNodes, done);
|
|
63767
|
+
}
|
|
63768
|
+
return newNodes;
|
|
63769
|
+
}
|
|
63770
|
+
reconnectNewNodes(nodeIndex, newNodes, sourceNodes, done) {
|
|
63771
|
+
if (done[nodeIndex]) {
|
|
63772
|
+
return;
|
|
63773
|
+
}
|
|
63774
|
+
const currentNode = newNodes[nodeIndex];
|
|
63775
|
+
const sourceNode = sourceNodes[nodeIndex];
|
|
63776
|
+
for (let inputIndex = 0; inputIndex < sourceNode.content.inputs.length; inputIndex++) {
|
|
63777
|
+
const sourceInput = sourceNode.content.inputs[inputIndex];
|
|
63778
|
+
const currentInput = currentNode.content.inputs[inputIndex];
|
|
63779
|
+
if (!sourceInput.isConnected) {
|
|
63780
|
+
continue;
|
|
63781
|
+
}
|
|
63782
|
+
const sourceContent = this.findNodeFromData(sourceInput.connectedPort.ownerData).content;
|
|
63783
|
+
const activeNodes = sourceNodes.filter((s) => s.content.data === sourceContent);
|
|
63784
|
+
if (activeNodes.length > 0) {
|
|
63785
|
+
const activeNode = activeNodes[0];
|
|
63786
|
+
const indexInList = sourceNodes.indexOf(activeNode);
|
|
63787
|
+
// First make sure to connect the other one
|
|
63788
|
+
this.reconnectNewNodes(indexInList, newNodes, sourceNodes, done);
|
|
63789
|
+
// Then reconnect
|
|
63790
|
+
const outputIndex = sourceContent.outputs.indexOf(sourceInput.connectedPort);
|
|
63791
|
+
const newOutput = newNodes[indexInList].content.data.outputs[outputIndex];
|
|
63792
|
+
newOutput.connectTo(currentInput);
|
|
63793
|
+
}
|
|
63794
|
+
else {
|
|
63795
|
+
// Connect with outside nodes
|
|
63796
|
+
sourceInput.connectedPort.connectTo(currentInput);
|
|
63797
|
+
}
|
|
63798
|
+
this.connectPorts(currentInput.connectedPort, currentInput);
|
|
63799
|
+
}
|
|
63800
|
+
currentNode.refresh();
|
|
63801
|
+
done[nodeIndex] = true;
|
|
63802
|
+
}
|
|
63507
63803
|
getCachedData() {
|
|
63508
63804
|
return this._nodeDataContentList;
|
|
63509
63805
|
}
|
|
@@ -63515,6 +63811,14 @@ class GraphCanvasComponent extends react__WEBPACK_IMPORTED_MODULE_1__.Component
|
|
|
63515
63811
|
}
|
|
63516
63812
|
createNodeFromObject(nodeData, onNodeCreated, recursion = true) {
|
|
63517
63813
|
if (this._nodeDataContentList.indexOf(nodeData.data) !== -1) {
|
|
63814
|
+
// Links
|
|
63815
|
+
if (nodeData.inputs.length && recursion) {
|
|
63816
|
+
for (const input of nodeData.inputs) {
|
|
63817
|
+
if (input.isConnected) {
|
|
63818
|
+
this.connectPorts(input.connectedPort, input);
|
|
63819
|
+
}
|
|
63820
|
+
}
|
|
63821
|
+
}
|
|
63518
63822
|
return this.nodes.filter((n) => n.content.data === nodeData.data)[0];
|
|
63519
63823
|
}
|
|
63520
63824
|
onNodeCreated(nodeData.data);
|
|
@@ -63804,7 +64108,7 @@ class GraphCanvasComponent extends react__WEBPACK_IMPORTED_MODULE_1__.Component
|
|
|
63804
64108
|
onDown(evt) {
|
|
63805
64109
|
this._rootContainer.setPointerCapture(evt.pointerId);
|
|
63806
64110
|
// Selection?
|
|
63807
|
-
if (evt.currentTarget === this._hostCanvas &&
|
|
64111
|
+
if (evt.currentTarget === this._hostCanvas && this._multiKeyIsPressed) {
|
|
63808
64112
|
this._selectionBox = this.props.stateManager.hostDocument.createElement("div");
|
|
63809
64113
|
this._selectionBox.classList.add("selection-box");
|
|
63810
64114
|
this._selectionContainer.appendChild(this._selectionBox);
|
|
@@ -63959,7 +64263,7 @@ class GraphCanvasComponent extends react__WEBPACK_IMPORTED_MODULE_1__.Component
|
|
|
63959
64263
|
if (pointB.direction === _interfaces_portData__WEBPACK_IMPORTED_MODULE_9__.PortDataDirection.Output) {
|
|
63960
64264
|
return;
|
|
63961
64265
|
}
|
|
63962
|
-
// No destination so let's spin a new input
|
|
64266
|
+
// No destination so let's spin a new input node
|
|
63963
64267
|
const newDefaultInput = this.props.stateManager.createDefaultInputData(this.props.stateManager.data, this._candidateLink.portA.portData, this);
|
|
63964
64268
|
const pointName = newDefaultInput.name;
|
|
63965
64269
|
const emittedNodeData = newDefaultInput.data;
|
|
@@ -63978,7 +64282,7 @@ class GraphCanvasComponent extends react__WEBPACK_IMPORTED_MODULE_1__.Component
|
|
|
63978
64282
|
if (portData.connectedPort) {
|
|
63979
64283
|
const existingNodes = this.nodes.filter((n) => {
|
|
63980
64284
|
var _a;
|
|
63981
|
-
return n.content === ((_a = portData.connectedPort) === null || _a === void 0 ? void 0 : _a.ownerData);
|
|
64285
|
+
return n.content.data === ((_a = portData.connectedPort) === null || _a === void 0 ? void 0 : _a.ownerData);
|
|
63982
64286
|
});
|
|
63983
64287
|
const connectedNode = existingNodes[0];
|
|
63984
64288
|
if (connectedNode.x === 0 && connectedNode.y === 0) {
|
|
@@ -64029,7 +64333,7 @@ class GraphCanvasComponent extends react__WEBPACK_IMPORTED_MODULE_1__.Component
|
|
|
64029
64333
|
});
|
|
64030
64334
|
}
|
|
64031
64335
|
if (pointB.ownerData.inputsAreExclusive) {
|
|
64032
|
-
// Disconnect all inputs if
|
|
64336
|
+
// Disconnect all inputs if node has exclusive inputs
|
|
64033
64337
|
pointB.ownerData.inputs.forEach((i) => {
|
|
64034
64338
|
const links = nodeB.getLinksForPortData(i);
|
|
64035
64339
|
if (!linksToNotifyForDispose) {
|
|
@@ -64053,12 +64357,38 @@ class GraphCanvasComponent extends react__WEBPACK_IMPORTED_MODULE_1__.Component
|
|
|
64053
64357
|
connectNodes(nodeA, pointA, nodeB, pointB) {
|
|
64054
64358
|
pointA.connectTo(pointB);
|
|
64055
64359
|
this.connectPorts(pointA, pointB);
|
|
64056
|
-
// Need to potentially propagate the type of pointA to other ports of
|
|
64360
|
+
// Need to potentially propagate the type of pointA to other ports of nodes connected to owner of pointB
|
|
64057
64361
|
// We also need to check if we want to display the promotion warning
|
|
64058
64362
|
const visitedNodes = new Set([nodeA]);
|
|
64059
64363
|
const visitedLinks = new Set([nodeB.links[nodeB.links.length - 1]]);
|
|
64060
64364
|
(0,_tools__WEBPACK_IMPORTED_MODULE_12__.RefreshNode)(nodeB, visitedNodes, visitedLinks);
|
|
64061
64365
|
}
|
|
64366
|
+
drop(newNode, targetX, targetY, offsetX, offsetY) {
|
|
64367
|
+
let x = targetX - this.x - offsetX * this.zoom;
|
|
64368
|
+
let y = targetY - this.y - offsetY * this.zoom;
|
|
64369
|
+
newNode.x = x / this.zoom;
|
|
64370
|
+
newNode.y = y / this.zoom;
|
|
64371
|
+
newNode.cleanAccumulation();
|
|
64372
|
+
this.props.stateManager.onNewNodeCreatedObservable.notifyObservers(newNode);
|
|
64373
|
+
this.props.stateManager.onSelectionChangedObservable.notifyObservers(null);
|
|
64374
|
+
this.props.stateManager.onSelectionChangedObservable.notifyObservers({ selection: newNode });
|
|
64375
|
+
x -= GraphCanvasComponent.NodeWidth + 150;
|
|
64376
|
+
newNode.content.inputs.forEach((portData) => {
|
|
64377
|
+
if (portData.connectedPort) {
|
|
64378
|
+
const existingNodes = this.nodes.filter((n) => {
|
|
64379
|
+
var _a;
|
|
64380
|
+
return n.content.data === ((_a = portData.connectedPort) === null || _a === void 0 ? void 0 : _a.ownerData);
|
|
64381
|
+
});
|
|
64382
|
+
const connectedNode = existingNodes[0];
|
|
64383
|
+
if (connectedNode.x === 0 && connectedNode.y === 0) {
|
|
64384
|
+
connectedNode.x = x / this.zoom;
|
|
64385
|
+
connectedNode.y = y / this.zoom;
|
|
64386
|
+
connectedNode.cleanAccumulation();
|
|
64387
|
+
y += 80;
|
|
64388
|
+
}
|
|
64389
|
+
}
|
|
64390
|
+
});
|
|
64391
|
+
}
|
|
64062
64392
|
processEditorData(editorData) {
|
|
64063
64393
|
const frames = this._frames.splice(0);
|
|
64064
64394
|
for (const frame of frames) {
|
|
@@ -64084,8 +64414,8 @@ class GraphCanvasComponent extends react__WEBPACK_IMPORTED_MODULE_1__.Component
|
|
|
64084
64414
|
// Locations
|
|
64085
64415
|
for (const location of editorData.locations) {
|
|
64086
64416
|
for (const node of this.nodes) {
|
|
64087
|
-
const
|
|
64088
|
-
if (
|
|
64417
|
+
const data = node.content.data;
|
|
64418
|
+
if (data && data.uniqueId === location.blockId) {
|
|
64089
64419
|
node.x = location.x;
|
|
64090
64420
|
node.y = location.y;
|
|
64091
64421
|
node.cleanAccumulation();
|
|
@@ -64111,6 +64441,7 @@ class GraphCanvasComponent extends react__WEBPACK_IMPORTED_MODULE_1__.Component
|
|
|
64111
64441
|
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", Object.assign({ id: "graph-canvas", onWheel: (evt) => this.onWheel(evt), onPointerMove: (evt) => this.onMove(evt), onPointerDown: (evt) => this.onDown(evt), onPointerUp: (evt) => this.onUp(evt) }, { children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", Object.assign({ id: "graph-container" }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", { id: "graph-canvas-container" }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", { id: "frame-container" }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("svg", { id: "graph-svg-container" }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", { id: "selection-container" })] })) })));
|
|
64112
64442
|
}
|
|
64113
64443
|
}
|
|
64444
|
+
GraphCanvasComponent.NodeWidth = 100;
|
|
64114
64445
|
|
|
64115
64446
|
|
|
64116
64447
|
/***/ }),
|
|
@@ -65385,7 +65716,7 @@ class GraphFrame {
|
|
|
65385
65716
|
}
|
|
65386
65717
|
export() {
|
|
65387
65718
|
const state = this._ownerCanvas.stateManager;
|
|
65388
|
-
const json = state.exportData(state.data);
|
|
65719
|
+
const json = state.exportData(state.data, this);
|
|
65389
65720
|
_stringTools__WEBPACK_IMPORTED_MODULE_2__.StringTools.DownloadAsFile(state.hostDocument, json, this._name + ".json");
|
|
65390
65721
|
}
|
|
65391
65722
|
adjustPorts() {
|
|
@@ -65466,14 +65797,12 @@ __webpack_require__.r(__webpack_exports__);
|
|
|
65466
65797
|
/* harmony export */ });
|
|
65467
65798
|
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "../../../../node_modules/react/index.js");
|
|
65468
65799
|
/* harmony import */ var _nodePort__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./nodePort */ "../../../dev/sharedUiComponents/dist/nodeGraphSystem/nodePort.js");
|
|
65469
|
-
/* harmony import */ var _imgs_triangle_svg__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../imgs/triangle.svg */ "../../../dev/sharedUiComponents/dist/imgs/triangle.svg");
|
|
65470
65800
|
/* harmony import */ var _propertyLedger__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./propertyLedger */ "../../../dev/sharedUiComponents/dist/nodeGraphSystem/propertyLedger.js");
|
|
65471
65801
|
/* harmony import */ var _displayLedger__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./displayLedger */ "../../../dev/sharedUiComponents/dist/nodeGraphSystem/displayLedger.js");
|
|
65472
65802
|
|
|
65473
65803
|
|
|
65474
65804
|
|
|
65475
65805
|
|
|
65476
|
-
|
|
65477
65806
|
class GraphNode {
|
|
65478
65807
|
constructor(content, stateManager) {
|
|
65479
65808
|
this.content = content;
|
|
@@ -65643,13 +65972,13 @@ class GraphNode {
|
|
|
65643
65972
|
getPortForPortData(portData) {
|
|
65644
65973
|
for (const port of this._inputPorts) {
|
|
65645
65974
|
const attachedPoint = port.portData;
|
|
65646
|
-
if (attachedPoint === portData) {
|
|
65975
|
+
if (attachedPoint === portData || (attachedPoint.ownerData === portData.ownerData && attachedPoint.internalName === portData.internalName)) {
|
|
65647
65976
|
return port;
|
|
65648
65977
|
}
|
|
65649
65978
|
}
|
|
65650
65979
|
for (const port of this._outputPorts) {
|
|
65651
65980
|
const attachedPoint = port.portData;
|
|
65652
|
-
if (attachedPoint === portData) {
|
|
65981
|
+
if (attachedPoint === portData || (attachedPoint.ownerData === portData.ownerData && attachedPoint.internalName === portData.internalName)) {
|
|
65653
65982
|
return port;
|
|
65654
65983
|
}
|
|
65655
65984
|
}
|
|
@@ -65722,14 +66051,7 @@ class GraphNode {
|
|
|
65722
66051
|
}
|
|
65723
66052
|
this._comments.innerHTML = this.content.comments || "";
|
|
65724
66053
|
this._comments.title = this.content.comments || "";
|
|
65725
|
-
|
|
65726
|
-
if (warningMessage) {
|
|
65727
|
-
this._warning.classList.add("visible");
|
|
65728
|
-
this._warning.title = warningMessage;
|
|
65729
|
-
}
|
|
65730
|
-
else {
|
|
65731
|
-
this._warning.classList.remove("visible");
|
|
65732
|
-
}
|
|
66054
|
+
this.content.prepareHeaderIcon(this._headerIcon, this._headerIconImg);
|
|
65733
66055
|
}
|
|
65734
66056
|
_onDown(evt) {
|
|
65735
66057
|
// Check if this is coming from the port
|
|
@@ -65810,12 +66132,11 @@ class GraphNode {
|
|
|
65810
66132
|
this._header = root.ownerDocument.createElement("div");
|
|
65811
66133
|
this._header.classList.add("header");
|
|
65812
66134
|
this._headerContainer.appendChild(this._header);
|
|
65813
|
-
this.
|
|
65814
|
-
this.
|
|
65815
|
-
|
|
65816
|
-
|
|
65817
|
-
this.
|
|
65818
|
-
this._visual.appendChild(this._warning);
|
|
66135
|
+
this._headerIcon = root.ownerDocument.createElement("div");
|
|
66136
|
+
this._headerIcon.classList.add("headerIcon");
|
|
66137
|
+
this._headerIconImg = root.ownerDocument.createElement("img");
|
|
66138
|
+
this._headerIcon.appendChild(this._headerIconImg);
|
|
66139
|
+
this._visual.appendChild(this._headerIcon);
|
|
65819
66140
|
const selectionBorder = root.ownerDocument.createElement("div");
|
|
65820
66141
|
selectionBorder.classList.add("selection-border");
|
|
65821
66142
|
this._visual.appendChild(selectionBorder);
|
|
@@ -66016,7 +66337,7 @@ class NodeLink {
|
|
|
66016
66337
|
const pointA = this._portA.portData;
|
|
66017
66338
|
const nodeB = this._nodeB;
|
|
66018
66339
|
const pointB = this._portB.portData;
|
|
66019
|
-
if (stateManager.isElbowConnectionAllowed(this._portA, this._portB)) {
|
|
66340
|
+
if (!stateManager.isElbowConnectionAllowed(this._portA, this._portB)) {
|
|
66020
66341
|
return;
|
|
66021
66342
|
}
|
|
66022
66343
|
// Create an elbow at the clicked location
|
|
@@ -66025,8 +66346,8 @@ class NodeLink {
|
|
|
66025
66346
|
// Delete previous link
|
|
66026
66347
|
this.dispose();
|
|
66027
66348
|
// Connect to Elbow block
|
|
66028
|
-
this._graphCanvas.connectNodes(nodeA, pointA, newNode, newElbowBlock.input);
|
|
66029
|
-
this._graphCanvas.connectNodes(newNode, newElbowBlock.output, nodeB, pointB);
|
|
66349
|
+
this._graphCanvas.connectNodes(nodeA, pointA, newNode, newNode.getPortDataForPortDataContent(newElbowBlock.input));
|
|
66350
|
+
this._graphCanvas.connectNodes(newNode, newNode.getPortDataForPortDataContent(newElbowBlock.output), nodeB, pointB);
|
|
66030
66351
|
stateManager.onRebuildRequiredObservable.notifyObservers(true);
|
|
66031
66352
|
});
|
|
66032
66353
|
stateManager.onNewBlockRequiredObservable.notifyObservers({
|
|
@@ -67699,6 +68020,12 @@ __webpack_require__.r(__webpack_exports__);
|
|
|
67699
68020
|
class PreviewAreaComponent extends react__WEBPACK_IMPORTED_MODULE_1__.Component {
|
|
67700
68021
|
constructor(props) {
|
|
67701
68022
|
super(props);
|
|
68023
|
+
this._onPointerOverCanvas = () => {
|
|
68024
|
+
this.props.globalState.pointerOverCanvas = true;
|
|
68025
|
+
};
|
|
68026
|
+
this._onPointerOutCanvas = () => {
|
|
68027
|
+
this.props.globalState.pointerOverCanvas = false;
|
|
68028
|
+
};
|
|
67702
68029
|
this.state = { isLoading: true };
|
|
67703
68030
|
this._onIsLoadingChangedObserver = this.props.globalState.onIsLoadingChanged.add((state) => this.setState({ isLoading: state }));
|
|
67704
68031
|
this._onResetRequiredObserver = this.props.globalState.onResetRequiredObservable.add(() => {
|
|
@@ -67738,7 +68065,7 @@ class PreviewAreaComponent extends react__WEBPACK_IMPORTED_MODULE_1__.Component
|
|
|
67738
68065
|
{ label: "OneOne", value: core_Misc_dataStorage__WEBPACK_IMPORTED_MODULE_2__.ParticleSystem.BLENDMODE_ONEONE },
|
|
67739
68066
|
{ label: "Standard", value: core_Misc_dataStorage__WEBPACK_IMPORTED_MODULE_2__.ParticleSystem.BLENDMODE_STANDARD },
|
|
67740
68067
|
];
|
|
67741
|
-
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.Fragment, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", Object.assign({ id: "preview", style: { height: this.props.width + "px" } }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("canvas", { id: "preview-canvas" }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", Object.assign({ className: "waitPanel" + (this.state.isLoading ? "" : " hidden") }, { children: "Please wait, loading..." }))] })), this.props.globalState.mode === core_Misc_dataStorage__WEBPACK_IMPORTED_MODULE_2__.NodeMaterialModes.Particle && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", Object.assign({ id: "preview-config-bar", className: "extended" }, { children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_optionsLineComponent__WEBPACK_IMPORTED_MODULE_8__.OptionsLineComponent, { label: "Blend mode", options: blendModeOptions, target: this.props.globalState, propertyName: "particleSystemBlendMode", noDirectUpdate: true, onSelect: (value) => {
|
|
68068
|
+
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.Fragment, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", Object.assign({ id: "preview", style: { height: this.props.width + "px" } }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("canvas", { onPointerOver: this._onPointerOverCanvas, onPointerOut: this._onPointerOutCanvas, id: "preview-canvas" }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", Object.assign({ className: "waitPanel" + (this.state.isLoading ? "" : " hidden") }, { children: "Please wait, loading..." }))] })), this.props.globalState.mode === core_Misc_dataStorage__WEBPACK_IMPORTED_MODULE_2__.NodeMaterialModes.Particle && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", Object.assign({ id: "preview-config-bar", className: "extended" }, { children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_optionsLineComponent__WEBPACK_IMPORTED_MODULE_8__.OptionsLineComponent, { label: "Blend mode", options: blendModeOptions, target: this.props.globalState, propertyName: "particleSystemBlendMode", noDirectUpdate: true, onSelect: (value) => {
|
|
67742
68069
|
this.changeParticleSystemBlendMode(value);
|
|
67743
68070
|
} }) }))), this.props.globalState.mode === core_Misc_dataStorage__WEBPACK_IMPORTED_MODULE_2__.NodeMaterialModes.Material && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.Fragment, { children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", Object.assign({ id: "preview-config-bar" }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", Object.assign({ title: "Render without back face culling", onClick: () => this.changeBackFaceCulling(!this.props.globalState.backFaceCulling), className: "button back-face" + (!this.props.globalState.backFaceCulling ? " selected" : "") }, { children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("img", { src: _svgs_doubleSided_svg__WEBPACK_IMPORTED_MODULE_3__, alt: "" }) })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", Object.assign({ title: "Render with depth pre-pass", onClick: () => this.changeDepthPrePass(!this.props.globalState.depthPrePass), className: "button depth-pass" + (this.props.globalState.depthPrePass ? " selected" : "") }, { children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("img", { src: _svgs_depthPass_svg__WEBPACK_IMPORTED_MODULE_4__, alt: "" }) })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", Object.assign({ title: "Turn on/off hemispheric light", onClick: () => {
|
|
67744
68071
|
this.props.globalState.hemisphericLight = !this.props.globalState.hemisphericLight;
|
|
@@ -68421,16 +68748,16 @@ __webpack_require__.r(__webpack_exports__);
|
|
|
68421
68748
|
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! react */ "../../../../node_modules/react/index.js");
|
|
68422
68749
|
/* harmony import */ var _sharedComponents_lineContainerComponent__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../../sharedComponents/lineContainerComponent */ "../../../tools/nodeEditor/dist/sharedComponents/lineContainerComponent.js");
|
|
68423
68750
|
/* harmony import */ var _sharedComponents_checkBoxLineComponent__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../../sharedComponents/checkBoxLineComponent */ "../../../tools/nodeEditor/dist/sharedComponents/checkBoxLineComponent.js");
|
|
68424
|
-
/* harmony import */ var
|
|
68425
|
-
/* harmony import */ var
|
|
68426
|
-
/* harmony import */ var
|
|
68427
|
-
/* harmony import */ var
|
|
68428
|
-
/* harmony import */ var
|
|
68429
|
-
/* harmony import */ var
|
|
68430
|
-
/* harmony import */ var
|
|
68431
|
-
/* harmony import */ var
|
|
68432
|
-
/* harmony import */ var
|
|
68433
|
-
/* harmony import */ var
|
|
68751
|
+
/* harmony import */ var core_Materials_Node_Enums_nodeMaterialBlockConnectionPointTypes__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! core/Materials/Node/Enums/nodeMaterialBlockConnectionPointTypes */ "core/Misc/dataStorage");
|
|
68752
|
+
/* harmony import */ var core_Materials_Node_Enums_nodeMaterialBlockConnectionPointTypes__WEBPACK_IMPORTED_MODULE_4___default = /*#__PURE__*/__webpack_require__.n(core_Materials_Node_Enums_nodeMaterialBlockConnectionPointTypes__WEBPACK_IMPORTED_MODULE_4__);
|
|
68753
|
+
/* harmony import */ var _propertyTab_scss__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./propertyTab.scss */ "../../../tools/nodeEditor/dist/components/propertyTab/propertyTab.scss");
|
|
68754
|
+
/* harmony import */ var shared_ui_components_lines_vector2LineComponent__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! shared-ui-components/lines/vector2LineComponent */ "../../../dev/sharedUiComponents/dist/lines/vector2LineComponent.js");
|
|
68755
|
+
/* harmony import */ var shared_ui_components_lines_vector3LineComponent__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! shared-ui-components/lines/vector3LineComponent */ "../../../dev/sharedUiComponents/dist/lines/vector3LineComponent.js");
|
|
68756
|
+
/* harmony import */ var shared_ui_components_lines_vector4LineComponent__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! shared-ui-components/lines/vector4LineComponent */ "../../../dev/sharedUiComponents/dist/lines/vector4LineComponent.js");
|
|
68757
|
+
/* harmony import */ var shared_ui_components_lines_color3LineComponent__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! shared-ui-components/lines/color3LineComponent */ "../../../dev/sharedUiComponents/dist/lines/color3LineComponent.js");
|
|
68758
|
+
/* harmony import */ var shared_ui_components_lines_color4LineComponent__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! shared-ui-components/lines/color4LineComponent */ "../../../dev/sharedUiComponents/dist/lines/color4LineComponent.js");
|
|
68759
|
+
/* harmony import */ var shared_ui_components_lines_floatLineComponent__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! shared-ui-components/lines/floatLineComponent */ "../../../dev/sharedUiComponents/dist/lines/floatLineComponent.js");
|
|
68760
|
+
/* harmony import */ var shared_ui_components_lines_sliderLineComponent__WEBPACK_IMPORTED_MODULE_12__ = __webpack_require__(/*! shared-ui-components/lines/sliderLineComponent */ "../../../dev/sharedUiComponents/dist/lines/sliderLineComponent.js");
|
|
68434
68761
|
|
|
68435
68762
|
|
|
68436
68763
|
|
|
@@ -68456,22 +68783,22 @@ class InputsPropertyTabComponent extends react__WEBPACK_IMPORTED_MODULE_1__.Comp
|
|
|
68456
68783
|
}
|
|
68457
68784
|
renderInputBlock(block) {
|
|
68458
68785
|
switch (block.type) {
|
|
68459
|
-
case
|
|
68786
|
+
case core_Materials_Node_Enums_nodeMaterialBlockConnectionPointTypes__WEBPACK_IMPORTED_MODULE_4__.NodeMaterialBlockConnectionPointTypes.Float: {
|
|
68460
68787
|
const cantDisplaySlider = isNaN(block.min) || isNaN(block.max) || block.min === block.max;
|
|
68461
68788
|
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { children: [block.isBoolean && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_sharedComponents_checkBoxLineComponent__WEBPACK_IMPORTED_MODULE_3__.CheckBoxLineComponent, { label: block.name, target: block, propertyName: "value", onValueChanged: () => {
|
|
68462
68789
|
this.processInputBlockUpdate(block);
|
|
68463
|
-
} }, block.uniqueId)), !block.isBoolean && cantDisplaySlider && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(
|
|
68790
|
+
} }, block.uniqueId)), !block.isBoolean && cantDisplaySlider && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_floatLineComponent__WEBPACK_IMPORTED_MODULE_11__.FloatLineComponent, { lockObject: this.props.lockObject, label: block.name, target: block, propertyName: "value", onChange: () => this.processInputBlockUpdate(block) }, block.uniqueId)), !block.isBoolean && !cantDisplaySlider && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_sliderLineComponent__WEBPACK_IMPORTED_MODULE_12__.SliderLineComponent, { lockObject: this.props.lockObject, label: block.name, target: block, propertyName: "value", step: (block.max - block.min) / 100.0, minimum: block.min, maximum: block.max, onChange: () => this.processInputBlockUpdate(block) }, block.uniqueId))] }, block.uniqueId));
|
|
68464
68791
|
}
|
|
68465
|
-
case
|
|
68466
|
-
return (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(
|
|
68467
|
-
case
|
|
68468
|
-
return (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(
|
|
68469
|
-
case
|
|
68470
|
-
return (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(
|
|
68471
|
-
case
|
|
68472
|
-
return (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(
|
|
68473
|
-
case
|
|
68474
|
-
return (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(
|
|
68792
|
+
case core_Materials_Node_Enums_nodeMaterialBlockConnectionPointTypes__WEBPACK_IMPORTED_MODULE_4__.NodeMaterialBlockConnectionPointTypes.Color3:
|
|
68793
|
+
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_color3LineComponent__WEBPACK_IMPORTED_MODULE_9__.Color3LineComponent, { lockObject: this.props.lockObject, label: block.name, target: block, propertyName: "value", onChange: () => this.processInputBlockUpdate(block) }, block.uniqueId));
|
|
68794
|
+
case core_Materials_Node_Enums_nodeMaterialBlockConnectionPointTypes__WEBPACK_IMPORTED_MODULE_4__.NodeMaterialBlockConnectionPointTypes.Color4:
|
|
68795
|
+
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_color4LineComponent__WEBPACK_IMPORTED_MODULE_10__.Color4LineComponent, { lockObject: this.props.lockObject, label: block.name, target: block, propertyName: "value", onChange: () => this.processInputBlockUpdate(block) }, block.uniqueId));
|
|
68796
|
+
case core_Materials_Node_Enums_nodeMaterialBlockConnectionPointTypes__WEBPACK_IMPORTED_MODULE_4__.NodeMaterialBlockConnectionPointTypes.Vector2:
|
|
68797
|
+
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_vector2LineComponent__WEBPACK_IMPORTED_MODULE_6__.Vector2LineComponent, { lockObject: this.props.lockObject, label: block.name, target: block, propertyName: "value", onChange: () => this.processInputBlockUpdate(block) }, block.uniqueId));
|
|
68798
|
+
case core_Materials_Node_Enums_nodeMaterialBlockConnectionPointTypes__WEBPACK_IMPORTED_MODULE_4__.NodeMaterialBlockConnectionPointTypes.Vector3:
|
|
68799
|
+
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_vector3LineComponent__WEBPACK_IMPORTED_MODULE_7__.Vector3LineComponent, { lockObject: this.props.lockObject, label: block.name, target: block, propertyName: "value", onChange: () => this.processInputBlockUpdate(block) }, block.uniqueId));
|
|
68800
|
+
case core_Materials_Node_Enums_nodeMaterialBlockConnectionPointTypes__WEBPACK_IMPORTED_MODULE_4__.NodeMaterialBlockConnectionPointTypes.Vector4:
|
|
68801
|
+
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_vector4LineComponent__WEBPACK_IMPORTED_MODULE_8__.Vector4LineComponent, { lockObject: this.props.lockObject, label: block.name, target: block, propertyName: "value", onChange: () => this.processInputBlockUpdate(block) }, block.uniqueId));
|
|
68475
68802
|
}
|
|
68476
68803
|
return null;
|
|
68477
68804
|
}
|
|
@@ -68507,7 +68834,7 @@ __webpack_require__.r(__webpack_exports__);
|
|
|
68507
68834
|
|
|
68508
68835
|
class Color3PropertyTabComponent extends react__WEBPACK_IMPORTED_MODULE_1__.Component {
|
|
68509
68836
|
render() {
|
|
68510
|
-
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_color3LineComponent__WEBPACK_IMPORTED_MODULE_2__.Color3LineComponent, { label: "Value", target: this.props.inputBlock, propertyName: "value", onChange: () => {
|
|
68837
|
+
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_color3LineComponent__WEBPACK_IMPORTED_MODULE_2__.Color3LineComponent, { lockObject: this.props.lockObject, label: "Value", target: this.props.inputBlock, propertyName: "value", onChange: () => {
|
|
68511
68838
|
this.props.globalState.stateManager.onUpdateRequiredObservable.notifyObservers(this.props.inputBlock);
|
|
68512
68839
|
} }));
|
|
68513
68840
|
}
|
|
@@ -68535,7 +68862,7 @@ __webpack_require__.r(__webpack_exports__);
|
|
|
68535
68862
|
|
|
68536
68863
|
class Color4PropertyTabComponent extends react__WEBPACK_IMPORTED_MODULE_1__.Component {
|
|
68537
68864
|
render() {
|
|
68538
|
-
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_color4LineComponent__WEBPACK_IMPORTED_MODULE_2__.Color4LineComponent, { label: "Value", target: this.props.inputBlock, propertyName: "value", onChange: () => {
|
|
68865
|
+
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_color4LineComponent__WEBPACK_IMPORTED_MODULE_2__.Color4LineComponent, { lockObject: this.props.lockObject, label: "Value", target: this.props.inputBlock, propertyName: "value", onChange: () => {
|
|
68539
68866
|
this.props.globalState.stateManager.onUpdateRequiredObservable.notifyObservers(this.props.inputBlock);
|
|
68540
68867
|
} }));
|
|
68541
68868
|
}
|
|
@@ -68557,13 +68884,13 @@ __webpack_require__.r(__webpack_exports__);
|
|
|
68557
68884
|
/* harmony export */ });
|
|
68558
68885
|
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react/jsx-runtime */ "../../../../node_modules/react/jsx-runtime.js");
|
|
68559
68886
|
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! react */ "../../../../node_modules/react/index.js");
|
|
68560
|
-
/* harmony import */ var
|
|
68887
|
+
/* harmony import */ var shared_ui_components_lines_floatLineComponent__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! shared-ui-components/lines/floatLineComponent */ "../../../dev/sharedUiComponents/dist/lines/floatLineComponent.js");
|
|
68561
68888
|
|
|
68562
68889
|
|
|
68563
68890
|
|
|
68564
68891
|
class FloatPropertyTabComponent extends react__WEBPACK_IMPORTED_MODULE_1__.Component {
|
|
68565
68892
|
render() {
|
|
68566
|
-
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(
|
|
68893
|
+
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_floatLineComponent__WEBPACK_IMPORTED_MODULE_2__.FloatLineComponent, { lockObject: this.props.globalState.lockObject, label: "Value", target: this.props.inputBlock, propertyName: "value", onChange: () => {
|
|
68567
68894
|
if (this.props.inputBlock.isConstant) {
|
|
68568
68895
|
this.props.globalState.stateManager.onRebuildRequiredObservable.notifyObservers(true);
|
|
68569
68896
|
}
|
|
@@ -68594,7 +68921,7 @@ __webpack_require__.r(__webpack_exports__);
|
|
|
68594
68921
|
|
|
68595
68922
|
class MatrixPropertyTabComponent extends react__WEBPACK_IMPORTED_MODULE_1__.Component {
|
|
68596
68923
|
render() {
|
|
68597
|
-
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_matrixLineComponent__WEBPACK_IMPORTED_MODULE_2__.MatrixLineComponent, { label: "Value", target: this.props.inputBlock, propertyName: "value", onChange: () => {
|
|
68924
|
+
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_matrixLineComponent__WEBPACK_IMPORTED_MODULE_2__.MatrixLineComponent, { lockObject: this.props.lockObject, label: "Value", target: this.props.inputBlock, propertyName: "value", onChange: () => {
|
|
68598
68925
|
this.props.globalState.stateManager.onUpdateRequiredObservable.notifyObservers(this.props.inputBlock);
|
|
68599
68926
|
}, mode: this.props.inputBlock.matrixMode, onModeChange: (mode) => {
|
|
68600
68927
|
this.props.inputBlock.matrixMode = mode;
|
|
@@ -68624,7 +68951,7 @@ __webpack_require__.r(__webpack_exports__);
|
|
|
68624
68951
|
|
|
68625
68952
|
class Vector2PropertyTabComponent extends react__WEBPACK_IMPORTED_MODULE_1__.Component {
|
|
68626
68953
|
render() {
|
|
68627
|
-
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_vector2LineComponent__WEBPACK_IMPORTED_MODULE_2__.Vector2LineComponent, { label: "Value", target: this.props.inputBlock, propertyName: "value", onChange: () => {
|
|
68954
|
+
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_vector2LineComponent__WEBPACK_IMPORTED_MODULE_2__.Vector2LineComponent, { lockObject: this.props.lockObject, label: "Value", target: this.props.inputBlock, propertyName: "value", onChange: () => {
|
|
68628
68955
|
this.props.globalState.stateManager.onUpdateRequiredObservable.notifyObservers(this.props.inputBlock);
|
|
68629
68956
|
} }));
|
|
68630
68957
|
}
|
|
@@ -68652,7 +68979,7 @@ __webpack_require__.r(__webpack_exports__);
|
|
|
68652
68979
|
|
|
68653
68980
|
class Vector3PropertyTabComponent extends react__WEBPACK_IMPORTED_MODULE_1__.Component {
|
|
68654
68981
|
render() {
|
|
68655
|
-
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_vector3LineComponent__WEBPACK_IMPORTED_MODULE_2__.Vector3LineComponent, { label: "Value", target: this.props.inputBlock, propertyName: "value", onChange: () => {
|
|
68982
|
+
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_vector3LineComponent__WEBPACK_IMPORTED_MODULE_2__.Vector3LineComponent, { lockObject: this.props.lockObject, label: "Value", target: this.props.inputBlock, propertyName: "value", onChange: () => {
|
|
68656
68983
|
this.props.globalState.stateManager.onUpdateRequiredObservable.notifyObservers(this.props.inputBlock);
|
|
68657
68984
|
} }));
|
|
68658
68985
|
}
|
|
@@ -68680,7 +69007,7 @@ __webpack_require__.r(__webpack_exports__);
|
|
|
68680
69007
|
|
|
68681
69008
|
class Vector4PropertyTabComponent extends react__WEBPACK_IMPORTED_MODULE_1__.Component {
|
|
68682
69009
|
render() {
|
|
68683
|
-
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_vector4LineComponent__WEBPACK_IMPORTED_MODULE_2__.Vector4LineComponent, { label: "Value", target: this.props.inputBlock, propertyName: "value", onChange: () => {
|
|
69010
|
+
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_vector4LineComponent__WEBPACK_IMPORTED_MODULE_2__.Vector4LineComponent, { lockObject: this.props.lockObject, label: "Value", target: this.props.inputBlock, propertyName: "value", onChange: () => {
|
|
68684
69011
|
this.props.globalState.stateManager.onUpdateRequiredObservable.notifyObservers(this.props.inputBlock);
|
|
68685
69012
|
} }));
|
|
68686
69013
|
}
|
|
@@ -68709,28 +69036,28 @@ __webpack_require__.r(__webpack_exports__);
|
|
|
68709
69036
|
/* harmony import */ var core_Misc_tools__WEBPACK_IMPORTED_MODULE_5___default = /*#__PURE__*/__webpack_require__.n(core_Misc_tools__WEBPACK_IMPORTED_MODULE_5__);
|
|
68710
69037
|
/* harmony import */ var _serializationTools__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ../../serializationTools */ "../../../tools/nodeEditor/dist/serializationTools.js");
|
|
68711
69038
|
/* harmony import */ var _sharedComponents_checkBoxLineComponent__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ../../sharedComponents/checkBoxLineComponent */ "../../../tools/nodeEditor/dist/sharedComponents/checkBoxLineComponent.js");
|
|
68712
|
-
/* harmony import */ var
|
|
68713
|
-
/* harmony import */ var
|
|
68714
|
-
/* harmony import */ var
|
|
68715
|
-
/* harmony import */ var
|
|
68716
|
-
/* harmony import */ var
|
|
68717
|
-
/* harmony import */ var
|
|
68718
|
-
/* harmony import */ var
|
|
68719
|
-
/* harmony import */ var
|
|
68720
|
-
/* harmony import */ var
|
|
68721
|
-
/* harmony import */ var
|
|
68722
|
-
/* harmony import */ var
|
|
68723
|
-
/* harmony import */ var
|
|
68724
|
-
/* harmony import */ var
|
|
68725
|
-
/* harmony import */ var
|
|
68726
|
-
/* harmony import */ var
|
|
68727
|
-
/* harmony import */ var
|
|
68728
|
-
/* harmony import */ var
|
|
68729
|
-
/* harmony import */ var
|
|
68730
|
-
/* harmony import */ var
|
|
68731
|
-
/* harmony import */ var
|
|
68732
|
-
/* harmony import */ var
|
|
68733
|
-
/* harmony import */ var
|
|
69039
|
+
/* harmony import */ var _graphSystem_properties_framePropertyComponent__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ../../graphSystem/properties/framePropertyComponent */ "../../../tools/nodeEditor/dist/graphSystem/properties/framePropertyComponent.js");
|
|
69040
|
+
/* harmony import */ var _graphSystem_properties_frameNodePortPropertyComponent__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ../../graphSystem/properties/frameNodePortPropertyComponent */ "../../../tools/nodeEditor/dist/graphSystem/properties/frameNodePortPropertyComponent.js");
|
|
69041
|
+
/* harmony import */ var _graphSystem_properties_nodePortPropertyComponent__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! ../../graphSystem/properties/nodePortPropertyComponent */ "../../../tools/nodeEditor/dist/graphSystem/properties/nodePortPropertyComponent.js");
|
|
69042
|
+
/* harmony import */ var _preview_previewType__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! ../preview/previewType */ "../../../tools/nodeEditor/dist/components/preview/previewType.js");
|
|
69043
|
+
/* harmony import */ var _inputsPropertyTabComponent__WEBPACK_IMPORTED_MODULE_12__ = __webpack_require__(/*! ./inputsPropertyTabComponent */ "../../../tools/nodeEditor/dist/components/propertyTab/inputsPropertyTabComponent.js");
|
|
69044
|
+
/* harmony import */ var _log_logComponent__WEBPACK_IMPORTED_MODULE_13__ = __webpack_require__(/*! ../log/logComponent */ "../../../tools/nodeEditor/dist/components/log/logComponent.js");
|
|
69045
|
+
/* harmony import */ var _propertyTab_scss__WEBPACK_IMPORTED_MODULE_14__ = __webpack_require__(/*! ./propertyTab.scss */ "../../../tools/nodeEditor/dist/components/propertyTab/propertyTab.scss");
|
|
69046
|
+
/* harmony import */ var shared_ui_components_nodeGraphSystem_graphNode__WEBPACK_IMPORTED_MODULE_15__ = __webpack_require__(/*! shared-ui-components/nodeGraphSystem/graphNode */ "../../../dev/sharedUiComponents/dist/nodeGraphSystem/graphNode.js");
|
|
69047
|
+
/* harmony import */ var shared_ui_components_nodeGraphSystem_graphFrame__WEBPACK_IMPORTED_MODULE_16__ = __webpack_require__(/*! shared-ui-components/nodeGraphSystem/graphFrame */ "../../../dev/sharedUiComponents/dist/nodeGraphSystem/graphFrame.js");
|
|
69048
|
+
/* harmony import */ var shared_ui_components_nodeGraphSystem_nodePort__WEBPACK_IMPORTED_MODULE_17__ = __webpack_require__(/*! shared-ui-components/nodeGraphSystem/nodePort */ "../../../dev/sharedUiComponents/dist/nodeGraphSystem/nodePort.js");
|
|
69049
|
+
/* harmony import */ var shared_ui_components_nodeGraphSystem_tools__WEBPACK_IMPORTED_MODULE_18__ = __webpack_require__(/*! shared-ui-components/nodeGraphSystem/tools */ "../../../dev/sharedUiComponents/dist/nodeGraphSystem/tools.js");
|
|
69050
|
+
/* harmony import */ var shared_ui_components_lines_textInputLineComponent__WEBPACK_IMPORTED_MODULE_19__ = __webpack_require__(/*! shared-ui-components/lines/textInputLineComponent */ "../../../dev/sharedUiComponents/dist/lines/textInputLineComponent.js");
|
|
69051
|
+
/* harmony import */ var shared_ui_components_lines_vector2LineComponent__WEBPACK_IMPORTED_MODULE_20__ = __webpack_require__(/*! shared-ui-components/lines/vector2LineComponent */ "../../../dev/sharedUiComponents/dist/lines/vector2LineComponent.js");
|
|
69052
|
+
/* harmony import */ var shared_ui_components_lines_vector3LineComponent__WEBPACK_IMPORTED_MODULE_21__ = __webpack_require__(/*! shared-ui-components/lines/vector3LineComponent */ "../../../dev/sharedUiComponents/dist/lines/vector3LineComponent.js");
|
|
69053
|
+
/* harmony import */ var shared_ui_components_lines_vector4LineComponent__WEBPACK_IMPORTED_MODULE_22__ = __webpack_require__(/*! shared-ui-components/lines/vector4LineComponent */ "../../../dev/sharedUiComponents/dist/lines/vector4LineComponent.js");
|
|
69054
|
+
/* harmony import */ var shared_ui_components_lines_color3LineComponent__WEBPACK_IMPORTED_MODULE_23__ = __webpack_require__(/*! shared-ui-components/lines/color3LineComponent */ "../../../dev/sharedUiComponents/dist/lines/color3LineComponent.js");
|
|
69055
|
+
/* harmony import */ var shared_ui_components_lines_color4LineComponent__WEBPACK_IMPORTED_MODULE_24__ = __webpack_require__(/*! shared-ui-components/lines/color4LineComponent */ "../../../dev/sharedUiComponents/dist/lines/color4LineComponent.js");
|
|
69056
|
+
/* harmony import */ var shared_ui_components_lines_buttonLineComponent__WEBPACK_IMPORTED_MODULE_25__ = __webpack_require__(/*! shared-ui-components/lines/buttonLineComponent */ "../../../dev/sharedUiComponents/dist/lines/buttonLineComponent.js");
|
|
69057
|
+
/* harmony import */ var shared_ui_components_lines_optionsLineComponent__WEBPACK_IMPORTED_MODULE_26__ = __webpack_require__(/*! shared-ui-components/lines/optionsLineComponent */ "../../../dev/sharedUiComponents/dist/lines/optionsLineComponent.js");
|
|
69058
|
+
/* harmony import */ var shared_ui_components_lines_textLineComponent__WEBPACK_IMPORTED_MODULE_27__ = __webpack_require__(/*! shared-ui-components/lines/textLineComponent */ "../../../dev/sharedUiComponents/dist/lines/textLineComponent.js");
|
|
69059
|
+
/* harmony import */ var shared_ui_components_lines_floatLineComponent__WEBPACK_IMPORTED_MODULE_28__ = __webpack_require__(/*! shared-ui-components/lines/floatLineComponent */ "../../../dev/sharedUiComponents/dist/lines/floatLineComponent.js");
|
|
69060
|
+
/* harmony import */ var shared_ui_components_lines_sliderLineComponent__WEBPACK_IMPORTED_MODULE_29__ = __webpack_require__(/*! shared-ui-components/lines/sliderLineComponent */ "../../../dev/sharedUiComponents/dist/lines/sliderLineComponent.js");
|
|
68734
69061
|
|
|
68735
69062
|
|
|
68736
69063
|
|
|
@@ -68776,16 +69103,16 @@ class PropertyTabComponent extends react__WEBPACK_IMPORTED_MODULE_1__.Component
|
|
|
68776
69103
|
componentDidMount() {
|
|
68777
69104
|
this.props.globalState.stateManager.onSelectionChangedObservable.add((options) => {
|
|
68778
69105
|
const { selection } = options || {};
|
|
68779
|
-
if (selection instanceof
|
|
69106
|
+
if (selection instanceof shared_ui_components_nodeGraphSystem_graphNode__WEBPACK_IMPORTED_MODULE_15__.GraphNode) {
|
|
68780
69107
|
this.setState({ currentNode: selection, currentFrame: null, currentFrameNodePort: null, currentNodePort: null });
|
|
68781
69108
|
}
|
|
68782
|
-
else if (selection instanceof
|
|
69109
|
+
else if (selection instanceof shared_ui_components_nodeGraphSystem_graphFrame__WEBPACK_IMPORTED_MODULE_16__.GraphFrame) {
|
|
68783
69110
|
this.setState({ currentNode: null, currentFrame: selection, currentFrameNodePort: null, currentNodePort: null });
|
|
68784
69111
|
}
|
|
68785
|
-
else if ((0,
|
|
69112
|
+
else if ((0,shared_ui_components_nodeGraphSystem_tools__WEBPACK_IMPORTED_MODULE_18__.IsFramePortData)(selection)) {
|
|
68786
69113
|
this.setState({ currentNode: null, currentFrame: selection.frame, currentFrameNodePort: selection.port, currentNodePort: null });
|
|
68787
69114
|
}
|
|
68788
|
-
else if (selection instanceof
|
|
69115
|
+
else if (selection instanceof shared_ui_components_nodeGraphSystem_nodePort__WEBPACK_IMPORTED_MODULE_17__.NodePort) {
|
|
68789
69116
|
this.setState({ currentNode: null, currentFrame: null, currentFrameNodePort: null, currentNodePort: selection });
|
|
68790
69117
|
}
|
|
68791
69118
|
else {
|
|
@@ -68811,18 +69138,18 @@ class PropertyTabComponent extends react__WEBPACK_IMPORTED_MODULE_1__.Component
|
|
|
68811
69138
|
const cantDisplaySlider = isNaN(block.min) || isNaN(block.max) || block.min === block.max;
|
|
68812
69139
|
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { children: [block.isBoolean && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_sharedComponents_checkBoxLineComponent__WEBPACK_IMPORTED_MODULE_7__.CheckBoxLineComponent, { label: block.name, target: block, propertyName: "value", onValueChanged: () => {
|
|
68813
69140
|
this.processInputBlockUpdate(block);
|
|
68814
|
-
} }, block.uniqueId)), !block.isBoolean && cantDisplaySlider && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(
|
|
69141
|
+
} }, block.uniqueId)), !block.isBoolean && cantDisplaySlider && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_floatLineComponent__WEBPACK_IMPORTED_MODULE_28__.FloatLineComponent, { lockObject: this.props.lockObject, label: block.name, target: block, propertyName: "value", onChange: () => this.processInputBlockUpdate(block) }, block.uniqueId)), !block.isBoolean && !cantDisplaySlider && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_sliderLineComponent__WEBPACK_IMPORTED_MODULE_29__.SliderLineComponent, { lockObject: this.props.lockObject, label: block.name, target: block, propertyName: "value", step: (block.max - block.min) / 100.0, minimum: block.min, maximum: block.max, onChange: () => this.processInputBlockUpdate(block) }, block.uniqueId))] }, block.uniqueId));
|
|
68815
69142
|
}
|
|
68816
69143
|
case core_Misc_tools__WEBPACK_IMPORTED_MODULE_5__.NodeMaterialBlockConnectionPointTypes.Color3:
|
|
68817
|
-
return (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(
|
|
69144
|
+
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_color3LineComponent__WEBPACK_IMPORTED_MODULE_23__.Color3LineComponent, { lockObject: this.props.lockObject, label: block.name, target: block, propertyName: "value", onChange: () => this.processInputBlockUpdate(block) }, block.uniqueId));
|
|
68818
69145
|
case core_Misc_tools__WEBPACK_IMPORTED_MODULE_5__.NodeMaterialBlockConnectionPointTypes.Color4:
|
|
68819
|
-
return (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(
|
|
69146
|
+
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_color4LineComponent__WEBPACK_IMPORTED_MODULE_24__.Color4LineComponent, { lockObject: this.props.lockObject, label: block.name, target: block, propertyName: "value", onChange: () => this.processInputBlockUpdate(block) }, block.uniqueId));
|
|
68820
69147
|
case core_Misc_tools__WEBPACK_IMPORTED_MODULE_5__.NodeMaterialBlockConnectionPointTypes.Vector2:
|
|
68821
|
-
return (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(
|
|
69148
|
+
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_vector2LineComponent__WEBPACK_IMPORTED_MODULE_20__.Vector2LineComponent, { lockObject: this.props.lockObject, label: block.name, target: block, propertyName: "value", onChange: () => this.processInputBlockUpdate(block) }, block.uniqueId));
|
|
68822
69149
|
case core_Misc_tools__WEBPACK_IMPORTED_MODULE_5__.NodeMaterialBlockConnectionPointTypes.Vector3:
|
|
68823
|
-
return (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(
|
|
69150
|
+
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_vector3LineComponent__WEBPACK_IMPORTED_MODULE_21__.Vector3LineComponent, { lockObject: this.props.lockObject, label: block.name, target: block, propertyName: "value", onChange: () => this.processInputBlockUpdate(block) }, block.uniqueId));
|
|
68824
69151
|
case core_Misc_tools__WEBPACK_IMPORTED_MODULE_5__.NodeMaterialBlockConnectionPointTypes.Vector4:
|
|
68825
|
-
return (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(
|
|
69152
|
+
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_vector4LineComponent__WEBPACK_IMPORTED_MODULE_22__.Vector4LineComponent, { lockObject: this.props.lockObject, label: block.name, target: block, propertyName: "value", onChange: () => this.processInputBlockUpdate(block) }, block.uniqueId));
|
|
68826
69153
|
}
|
|
68827
69154
|
return null;
|
|
68828
69155
|
}
|
|
@@ -68850,15 +69177,15 @@ class PropertyTabComponent extends react__WEBPACK_IMPORTED_MODULE_1__.Component
|
|
|
68850
69177
|
}
|
|
68851
69178
|
customSave() {
|
|
68852
69179
|
this.setState({ uploadInProgress: true });
|
|
68853
|
-
this.props.globalState.onLogRequiredObservable.notifyObservers(new
|
|
69180
|
+
this.props.globalState.onLogRequiredObservable.notifyObservers(new _log_logComponent__WEBPACK_IMPORTED_MODULE_13__.LogEntry("Saving your material to Babylon.js snippet server...", false));
|
|
68854
69181
|
this.props.globalState
|
|
68855
69182
|
.customSave.action(_serializationTools__WEBPACK_IMPORTED_MODULE_6__.SerializationTools.Serialize(this.props.globalState.nodeMaterial, this.props.globalState))
|
|
68856
69183
|
.then(() => {
|
|
68857
|
-
this.props.globalState.onLogRequiredObservable.notifyObservers(new
|
|
69184
|
+
this.props.globalState.onLogRequiredObservable.notifyObservers(new _log_logComponent__WEBPACK_IMPORTED_MODULE_13__.LogEntry("Material saved successfully", false));
|
|
68858
69185
|
this.setState({ uploadInProgress: false });
|
|
68859
69186
|
})
|
|
68860
69187
|
.catch((err) => {
|
|
68861
|
-
this.props.globalState.onLogRequiredObservable.notifyObservers(new
|
|
69188
|
+
this.props.globalState.onLogRequiredObservable.notifyObservers(new _log_logComponent__WEBPACK_IMPORTED_MODULE_13__.LogEntry(err, true));
|
|
68862
69189
|
this.setState({ uploadInProgress: false });
|
|
68863
69190
|
});
|
|
68864
69191
|
}
|
|
@@ -68954,10 +69281,10 @@ class PropertyTabComponent extends react__WEBPACK_IMPORTED_MODULE_1__.Component
|
|
|
68954
69281
|
}
|
|
68955
69282
|
switch (value) {
|
|
68956
69283
|
case core_Misc_tools__WEBPACK_IMPORTED_MODULE_5__.NodeMaterialModes.Material:
|
|
68957
|
-
this.props.globalState.previewType =
|
|
69284
|
+
this.props.globalState.previewType = _preview_previewType__WEBPACK_IMPORTED_MODULE_11__.PreviewType.Sphere;
|
|
68958
69285
|
break;
|
|
68959
69286
|
case core_Misc_tools__WEBPACK_IMPORTED_MODULE_5__.NodeMaterialModes.Particle:
|
|
68960
|
-
this.props.globalState.previewType =
|
|
69287
|
+
this.props.globalState.previewType = _preview_previewType__WEBPACK_IMPORTED_MODULE_11__.PreviewType.Bubbles;
|
|
68961
69288
|
break;
|
|
68962
69289
|
}
|
|
68963
69290
|
this.props.globalState.listOfCustomPreviewFiles = [];
|
|
@@ -68973,13 +69300,13 @@ class PropertyTabComponent extends react__WEBPACK_IMPORTED_MODULE_1__.Component
|
|
|
68973
69300
|
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", Object.assign({ id: "propertyTab" }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", Object.assign({ id: "header" }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("img", { id: "logo", src: "https://www.babylonjs.com/Assets/logo-babylonjs-social-twitter.png" }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", Object.assign({ id: "title" }, { children: "NODE MATERIAL EDITOR" }))] })), ((_a = this.state.currentNode) === null || _a === void 0 ? void 0 : _a.renderProperties()) || ((_b = this.state.currentNodePort) === null || _b === void 0 ? void 0 : _b.node.renderProperties())] })));
|
|
68974
69301
|
}
|
|
68975
69302
|
if (this.state.currentFrameNodePort && this.state.currentFrame) {
|
|
68976
|
-
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(
|
|
69303
|
+
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_graphSystem_properties_frameNodePortPropertyComponent__WEBPACK_IMPORTED_MODULE_9__.FrameNodePortPropertyTabComponent, { globalState: this.props.globalState, stateManager: this.props.globalState.stateManager, frame: this.state.currentFrame, frameNodePort: this.state.currentFrameNodePort }));
|
|
68977
69304
|
}
|
|
68978
69305
|
if (this.state.currentNodePort) {
|
|
68979
|
-
return (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(
|
|
69306
|
+
return (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_graphSystem_properties_nodePortPropertyComponent__WEBPACK_IMPORTED_MODULE_10__.NodePortPropertyTabComponent, { stateManager: this.props.globalState.stateManager, nodePort: this.state.currentNodePort });
|
|
68980
69307
|
}
|
|
68981
69308
|
if (this.state.currentFrame) {
|
|
68982
|
-
return (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(
|
|
69309
|
+
return (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_graphSystem_properties_framePropertyComponent__WEBPACK_IMPORTED_MODULE_8__.FramePropertyTabComponent, { globalState: this.props.globalState, frame: this.state.currentFrame });
|
|
68983
69310
|
}
|
|
68984
69311
|
const gridSize = core_Misc_tools__WEBPACK_IMPORTED_MODULE_5__.DataStorage.ReadNumber("GridSize", 20);
|
|
68985
69312
|
const modeList = [
|
|
@@ -68997,7 +69324,7 @@ class PropertyTabComponent extends react__WEBPACK_IMPORTED_MODULE_1__.Component
|
|
|
68997
69324
|
{ label: "Maximized", value: core_Misc_tools__WEBPACK_IMPORTED_MODULE_5__.Constants.ALPHA_MAXIMIZED },
|
|
68998
69325
|
{ label: "Pre-multiplied", value: core_Misc_tools__WEBPACK_IMPORTED_MODULE_5__.Constants.ALPHA_PREMULTIPLIED },
|
|
68999
69326
|
];
|
|
69000
|
-
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", Object.assign({ id: "propertyTab" }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", Object.assign({ id: "header" }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("img", { id: "logo", src: "https://www.babylonjs.com/Assets/logo-babylonjs-social-twitter.png" }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", Object.assign({ id: "title" }, { children: "NODE MATERIAL EDITOR" }))] })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(_sharedComponents_lineContainerComponent__WEBPACK_IMPORTED_MODULE_2__.LineContainerComponent, Object.assign({ title: "GENERAL" }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(
|
|
69327
|
+
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", Object.assign({ id: "propertyTab" }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", Object.assign({ id: "header" }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("img", { id: "logo", src: "https://www.babylonjs.com/Assets/logo-babylonjs-social-twitter.png" }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", Object.assign({ id: "title" }, { children: "NODE MATERIAL EDITOR" }))] })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(_sharedComponents_lineContainerComponent__WEBPACK_IMPORTED_MODULE_2__.LineContainerComponent, Object.assign({ title: "GENERAL" }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_optionsLineComponent__WEBPACK_IMPORTED_MODULE_26__.OptionsLineComponent, { ref: this._modeSelect, label: "Mode", target: this, extractValue: () => this.props.globalState.mode, options: modeList, onSelect: (value) => this.changeMode(value), propertyName: "" }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_textLineComponent__WEBPACK_IMPORTED_MODULE_27__.TextLineComponent, { label: "Version", value: core_Misc_tools__WEBPACK_IMPORTED_MODULE_5__.Engine.Version }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_textLineComponent__WEBPACK_IMPORTED_MODULE_27__.TextLineComponent, { label: "Help", value: "doc.babylonjs.com", underline: true, onLink: () => this.props.globalState.hostDocument.defaultView.open("https://doc.babylonjs.com/how_to/node_material", "_blank") }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_textInputLineComponent__WEBPACK_IMPORTED_MODULE_19__.TextInputLineComponent, { label: "Comment", multilines: true, lockObject: this.props.globalState.lockObject, value: this.props.globalState.nodeMaterial.comment, target: this.props.globalState.nodeMaterial, propertyName: "comment" }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_buttonLineComponent__WEBPACK_IMPORTED_MODULE_25__.ButtonLineComponent, { label: "Reset to default", onClick: () => {
|
|
69001
69328
|
switch (this.props.globalState.mode) {
|
|
69002
69329
|
case core_Misc_tools__WEBPACK_IMPORTED_MODULE_5__.NodeMaterialModes.Material:
|
|
69003
69330
|
this.props.globalState.nodeMaterial.setToDefault();
|
|
@@ -69013,31 +69340,31 @@ class PropertyTabComponent extends react__WEBPACK_IMPORTED_MODULE_1__.Component
|
|
|
69013
69340
|
break;
|
|
69014
69341
|
}
|
|
69015
69342
|
this.props.globalState.onResetRequiredObservable.notifyObservers(true);
|
|
69016
|
-
} })] })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(_sharedComponents_lineContainerComponent__WEBPACK_IMPORTED_MODULE_2__.LineContainerComponent, Object.assign({ title: "UI" }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(
|
|
69343
|
+
} })] })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(_sharedComponents_lineContainerComponent__WEBPACK_IMPORTED_MODULE_2__.LineContainerComponent, Object.assign({ title: "UI" }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_buttonLineComponent__WEBPACK_IMPORTED_MODULE_25__.ButtonLineComponent, { label: "Zoom to fit", onClick: () => {
|
|
69017
69344
|
this.props.globalState.onZoomToFitRequiredObservable.notifyObservers();
|
|
69018
|
-
} }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(
|
|
69345
|
+
} }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_buttonLineComponent__WEBPACK_IMPORTED_MODULE_25__.ButtonLineComponent, { label: "Reorganize", onClick: () => {
|
|
69019
69346
|
this.props.globalState.onReOrganizedRequiredObservable.notifyObservers();
|
|
69020
69347
|
} })] })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(_sharedComponents_lineContainerComponent__WEBPACK_IMPORTED_MODULE_2__.LineContainerComponent, Object.assign({ title: "OPTIONS" }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_sharedComponents_checkBoxLineComponent__WEBPACK_IMPORTED_MODULE_7__.CheckBoxLineComponent, { label: "Embed textures when saving", isSelected: () => core_Misc_tools__WEBPACK_IMPORTED_MODULE_5__.DataStorage.ReadBoolean("EmbedTextures", true), onSelect: (value) => {
|
|
69021
69348
|
core_Misc_tools__WEBPACK_IMPORTED_MODULE_5__.DataStorage.WriteBoolean("EmbedTextures", value);
|
|
69022
|
-
} }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(
|
|
69349
|
+
} }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_sliderLineComponent__WEBPACK_IMPORTED_MODULE_29__.SliderLineComponent, { lockObject: this.props.lockObject, label: "Grid size", minimum: 0, maximum: 100, step: 5, decimalCount: 0, directValue: gridSize, onChange: (value) => {
|
|
69023
69350
|
core_Misc_tools__WEBPACK_IMPORTED_MODULE_5__.DataStorage.WriteNumber("GridSize", value);
|
|
69024
69351
|
this.props.globalState.stateManager.onGridSizeChanged.notifyObservers();
|
|
69025
69352
|
this.forceUpdate();
|
|
69026
69353
|
} }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_sharedComponents_checkBoxLineComponent__WEBPACK_IMPORTED_MODULE_7__.CheckBoxLineComponent, { label: "Show grid", isSelected: () => core_Misc_tools__WEBPACK_IMPORTED_MODULE_5__.DataStorage.ReadBoolean("ShowGrid", true), onSelect: (value) => {
|
|
69027
69354
|
core_Misc_tools__WEBPACK_IMPORTED_MODULE_5__.DataStorage.WriteBoolean("ShowGrid", value);
|
|
69028
69355
|
this.props.globalState.stateManager.onGridSizeChanged.notifyObservers();
|
|
69029
|
-
} })] })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(_sharedComponents_lineContainerComponent__WEBPACK_IMPORTED_MODULE_2__.LineContainerComponent, Object.assign({ title: "FILE" }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_sharedComponents_fileButtonLineComponent__WEBPACK_IMPORTED_MODULE_4__.FileButtonLineComponent, { label: "Load", onClick: (file) => this.load(file), accept: ".json" }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(
|
|
69356
|
+
} })] })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(_sharedComponents_lineContainerComponent__WEBPACK_IMPORTED_MODULE_2__.LineContainerComponent, Object.assign({ title: "FILE" }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_sharedComponents_fileButtonLineComponent__WEBPACK_IMPORTED_MODULE_4__.FileButtonLineComponent, { label: "Load", onClick: (file) => this.load(file), accept: ".json" }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_buttonLineComponent__WEBPACK_IMPORTED_MODULE_25__.ButtonLineComponent, { label: "Save", onClick: () => {
|
|
69030
69357
|
this.save();
|
|
69031
|
-
} }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(
|
|
69358
|
+
} }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_buttonLineComponent__WEBPACK_IMPORTED_MODULE_25__.ButtonLineComponent, { label: "Generate code", onClick: () => {
|
|
69032
69359
|
shared_ui_components_stringTools__WEBPACK_IMPORTED_MODULE_3__.StringTools.DownloadAsFile(this.props.globalState.hostDocument, this.props.globalState.nodeMaterial.generateCode(), "code.txt");
|
|
69033
|
-
} }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(
|
|
69360
|
+
} }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_buttonLineComponent__WEBPACK_IMPORTED_MODULE_25__.ButtonLineComponent, { label: "Export shaders", onClick: () => {
|
|
69034
69361
|
this.props.globalState.nodeMaterial.build();
|
|
69035
69362
|
shared_ui_components_stringTools__WEBPACK_IMPORTED_MODULE_3__.StringTools.DownloadAsFile(this.props.globalState.hostDocument, this.props.globalState.nodeMaterial.compiledShaders, "shaders.txt");
|
|
69036
|
-
} }), this.props.globalState.customSave && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(
|
|
69363
|
+
} }), this.props.globalState.customSave && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_buttonLineComponent__WEBPACK_IMPORTED_MODULE_25__.ButtonLineComponent, { label: this.props.globalState.customSave.label, isDisabled: this.state.uploadInProgress, onClick: () => {
|
|
69037
69364
|
this.customSave();
|
|
69038
|
-
} })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_sharedComponents_fileButtonLineComponent__WEBPACK_IMPORTED_MODULE_4__.FileButtonLineComponent, { label: "Load Frame", uploadName: "frame-upload", onClick: (file) => this.loadFrame(file), accept: ".json" })] })), !this.props.globalState.customSave && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(_sharedComponents_lineContainerComponent__WEBPACK_IMPORTED_MODULE_2__.LineContainerComponent, Object.assign({ title: "SNIPPET" }, { children: [this.props.globalState.nodeMaterial.snippetId && (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(
|
|
69365
|
+
} })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_sharedComponents_fileButtonLineComponent__WEBPACK_IMPORTED_MODULE_4__.FileButtonLineComponent, { label: "Load Frame", uploadName: "frame-upload", onClick: (file) => this.loadFrame(file), accept: ".json" })] })), !this.props.globalState.customSave && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(_sharedComponents_lineContainerComponent__WEBPACK_IMPORTED_MODULE_2__.LineContainerComponent, Object.assign({ title: "SNIPPET" }, { children: [this.props.globalState.nodeMaterial.snippetId && (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_textLineComponent__WEBPACK_IMPORTED_MODULE_27__.TextLineComponent, { label: "Snippet ID", value: this.props.globalState.nodeMaterial.snippetId }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_buttonLineComponent__WEBPACK_IMPORTED_MODULE_25__.ButtonLineComponent, { label: "Load from snippet server", onClick: () => this.loadFromSnippet() }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_buttonLineComponent__WEBPACK_IMPORTED_MODULE_25__.ButtonLineComponent, { label: "Save to snippet server", onClick: () => {
|
|
69039
69366
|
this.saveToSnippetServer();
|
|
69040
|
-
} })] }))), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(_sharedComponents_lineContainerComponent__WEBPACK_IMPORTED_MODULE_2__.LineContainerComponent, Object.assign({ title: "TRANSPARENCY" }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_sharedComponents_checkBoxLineComponent__WEBPACK_IMPORTED_MODULE_7__.CheckBoxLineComponent, { label: "Force alpha blending", target: this.props.globalState.nodeMaterial, propertyName: "forceAlphaBlending", onValueChanged: () => this.props.globalState.stateManager.onUpdateRequiredObservable.notifyObservers(null) }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(
|
|
69367
|
+
} })] }))), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(_sharedComponents_lineContainerComponent__WEBPACK_IMPORTED_MODULE_2__.LineContainerComponent, Object.assign({ title: "TRANSPARENCY" }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_sharedComponents_checkBoxLineComponent__WEBPACK_IMPORTED_MODULE_7__.CheckBoxLineComponent, { label: "Force alpha blending", target: this.props.globalState.nodeMaterial, propertyName: "forceAlphaBlending", onValueChanged: () => this.props.globalState.stateManager.onUpdateRequiredObservable.notifyObservers(null) }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_optionsLineComponent__WEBPACK_IMPORTED_MODULE_26__.OptionsLineComponent, { label: "Alpha mode", options: alphaModeOptions, target: this.props.globalState.nodeMaterial, propertyName: "alphaMode", onSelect: () => this.props.globalState.stateManager.onUpdateRequiredObservable.notifyObservers(null) })] })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_inputsPropertyTabComponent__WEBPACK_IMPORTED_MODULE_12__.InputsPropertyTabComponent, { lockObject: this.props.lockObject, globalState: this.props.globalState, inputs: this.props.globalState.nodeMaterial.getInputBlocks() })] })] })));
|
|
69041
69368
|
}
|
|
69042
69369
|
}
|
|
69043
69370
|
|
|
@@ -69095,6 +69422,7 @@ class GlobalState {
|
|
|
69095
69422
|
this.particleSystemBlendMode = core_Misc_observable__WEBPACK_IMPORTED_MODULE_0__.ParticleSystem.BLENDMODE_ONEONE;
|
|
69096
69423
|
this.listOfCustomPreviewFiles = [];
|
|
69097
69424
|
this.lockObject = new shared_ui_components_tabs_propertyGrids_lockObject__WEBPACK_IMPORTED_MODULE_4__.LockObject();
|
|
69425
|
+
this.pointerOverCanvas = false;
|
|
69098
69426
|
this.previewType = core_Misc_observable__WEBPACK_IMPORTED_MODULE_0__.DataStorage.ReadNumber("PreviewType", _components_preview_previewType__WEBPACK_IMPORTED_MODULE_1__.PreviewType.Box);
|
|
69099
69427
|
this.backFaceCulling = core_Misc_observable__WEBPACK_IMPORTED_MODULE_0__.DataStorage.ReadBoolean("BackFaceCulling", true);
|
|
69100
69428
|
this.depthPrePass = core_Misc_observable__WEBPACK_IMPORTED_MODULE_0__.DataStorage.ReadBoolean("DepthPrePass", false);
|
|
@@ -69162,9 +69490,7 @@ __webpack_require__.r(__webpack_exports__);
|
|
|
69162
69490
|
/* harmony import */ var _sharedComponents_popup__WEBPACK_IMPORTED_MODULE_14__ = __webpack_require__(/*! ./sharedComponents/popup */ "../../../tools/nodeEditor/dist/sharedComponents/popup.js");
|
|
69163
69491
|
/* harmony import */ var _main_scss__WEBPACK_IMPORTED_MODULE_15__ = __webpack_require__(/*! ./main.scss */ "../../../tools/nodeEditor/dist/main.scss");
|
|
69164
69492
|
/* harmony import */ var shared_ui_components_nodeGraphSystem_graphCanvas__WEBPACK_IMPORTED_MODULE_16__ = __webpack_require__(/*! shared-ui-components/nodeGraphSystem/graphCanvas */ "../../../dev/sharedUiComponents/dist/nodeGraphSystem/graphCanvas.js");
|
|
69165
|
-
/* harmony import */ var
|
|
69166
|
-
/* harmony import */ var shared_ui_components_nodeGraphSystem_typeLedger__WEBPACK_IMPORTED_MODULE_18__ = __webpack_require__(/*! shared-ui-components/nodeGraphSystem/typeLedger */ "../../../dev/sharedUiComponents/dist/nodeGraphSystem/typeLedger.js");
|
|
69167
|
-
|
|
69493
|
+
/* harmony import */ var shared_ui_components_nodeGraphSystem_typeLedger__WEBPACK_IMPORTED_MODULE_17__ = __webpack_require__(/*! shared-ui-components/nodeGraphSystem/typeLedger */ "../../../dev/sharedUiComponents/dist/nodeGraphSystem/typeLedger.js");
|
|
69168
69494
|
|
|
69169
69495
|
|
|
69170
69496
|
|
|
@@ -69191,10 +69517,24 @@ class GraphEditor extends react__WEBPACK_IMPORTED_MODULE_1__.Component {
|
|
|
69191
69517
|
super(props);
|
|
69192
69518
|
this._leftWidth = core_Materials_Node_nodeMaterialBlock__WEBPACK_IMPORTED_MODULE_2__.DataStorage.ReadNumber("LeftWidth", 200);
|
|
69193
69519
|
this._rightWidth = core_Materials_Node_nodeMaterialBlock__WEBPACK_IMPORTED_MODULE_2__.DataStorage.ReadNumber("RightWidth", 300);
|
|
69194
|
-
this._copiedNodes = [];
|
|
69195
|
-
this._copiedFrames = [];
|
|
69196
69520
|
this._mouseLocationX = 0;
|
|
69197
69521
|
this._mouseLocationY = 0;
|
|
69522
|
+
this.onWheel = (evt) => {
|
|
69523
|
+
if (this.props.globalState.pointerOverCanvas) {
|
|
69524
|
+
return evt.preventDefault();
|
|
69525
|
+
}
|
|
69526
|
+
if (evt.ctrlKey) {
|
|
69527
|
+
return evt.preventDefault();
|
|
69528
|
+
}
|
|
69529
|
+
if (Math.abs(evt.deltaX) < Math.abs(evt.deltaY)) {
|
|
69530
|
+
return;
|
|
69531
|
+
}
|
|
69532
|
+
const targetElem = evt.currentTarget;
|
|
69533
|
+
const scrollLeftMax = targetElem.scrollWidth - targetElem.offsetWidth;
|
|
69534
|
+
if (targetElem.scrollLeft + evt.deltaX < 0 || targetElem.scrollLeft + evt.deltaX > scrollLeftMax) {
|
|
69535
|
+
return evt.preventDefault();
|
|
69536
|
+
}
|
|
69537
|
+
};
|
|
69198
69538
|
this.handlePopUp = () => {
|
|
69199
69539
|
this.setState({
|
|
69200
69540
|
showPreviewPopUp: true,
|
|
@@ -69383,115 +69723,20 @@ class GraphEditor extends react__WEBPACK_IMPORTED_MODULE_1__.Component {
|
|
|
69383
69723
|
return this._graphCanvas.findNodeFromData(block);
|
|
69384
69724
|
};
|
|
69385
69725
|
this.props.globalState.hostDocument.addEventListener("keydown", (evt) => {
|
|
69386
|
-
|
|
69387
|
-
|
|
69388
|
-
|
|
69389
|
-
|
|
69390
|
-
|
|
69391
|
-
|
|
69392
|
-
|
|
69393
|
-
this._graphCanvas.removeDataFromCache(targetBlock);
|
|
69394
|
-
}
|
|
69395
|
-
if (this._graphCanvas.selectedLink) {
|
|
69396
|
-
this._graphCanvas.selectedLink.dispose();
|
|
69397
|
-
}
|
|
69398
|
-
if (this._graphCanvas.selectedFrames.length) {
|
|
69399
|
-
for (const frame of this._graphCanvas.selectedFrames) {
|
|
69400
|
-
if (frame.isCollapsed) {
|
|
69401
|
-
while (frame.nodes.length > 0) {
|
|
69402
|
-
const targetBlock = frame.nodes[0].content.data;
|
|
69403
|
-
this.props.globalState.nodeMaterial.removeBlock(targetBlock);
|
|
69404
|
-
this._graphCanvas.removeDataFromCache(targetBlock);
|
|
69405
|
-
frame.nodes[0].dispose();
|
|
69406
|
-
}
|
|
69407
|
-
frame.isCollapsed = false;
|
|
69408
|
-
}
|
|
69409
|
-
else {
|
|
69410
|
-
frame.nodes.forEach((node) => {
|
|
69411
|
-
node.enclosingFrameId = -1;
|
|
69412
|
-
});
|
|
69413
|
-
}
|
|
69414
|
-
frame.dispose();
|
|
69415
|
-
}
|
|
69416
|
-
}
|
|
69417
|
-
this.props.globalState.stateManager.onSelectionChangedObservable.notifyObservers(null);
|
|
69418
|
-
this.props.globalState.stateManager.onRebuildRequiredObservable.notifyObservers(false);
|
|
69419
|
-
return;
|
|
69420
|
-
}
|
|
69421
|
-
if (!evt.ctrlKey || this.props.globalState.lockObject.lock) {
|
|
69422
|
-
return;
|
|
69423
|
-
}
|
|
69424
|
-
if (evt.key === "c" || evt.key === "C") {
|
|
69425
|
-
// Copy
|
|
69426
|
-
this._copiedNodes = [];
|
|
69427
|
-
this._copiedFrames = [];
|
|
69428
|
-
if (this._graphCanvas.selectedFrames.length) {
|
|
69429
|
-
for (const frame of this._graphCanvas.selectedFrames) {
|
|
69430
|
-
frame.serialize(true);
|
|
69431
|
-
this._copiedFrames.push(frame);
|
|
69432
|
-
}
|
|
69433
|
-
return;
|
|
69434
|
-
}
|
|
69435
|
-
const selectedItems = this._graphCanvas.selectedNodes;
|
|
69436
|
-
if (!selectedItems.length) {
|
|
69437
|
-
return;
|
|
69438
|
-
}
|
|
69439
|
-
const selectedItem = selectedItems[0];
|
|
69440
|
-
if (!selectedItem.content.data) {
|
|
69441
|
-
return;
|
|
69442
|
-
}
|
|
69443
|
-
this._copiedNodes = selectedItems.slice(0);
|
|
69444
|
-
}
|
|
69445
|
-
else if (evt.key === "v" || evt.key === "V") {
|
|
69446
|
-
// Paste
|
|
69447
|
-
const rootElement = this.props.globalState.hostDocument.querySelector(".diagram-container");
|
|
69448
|
-
const zoomLevel = this._graphCanvas.zoom;
|
|
69449
|
-
let currentY = (this._mouseLocationY - rootElement.offsetTop - this._graphCanvas.y - 20) / zoomLevel;
|
|
69450
|
-
if (this._copiedFrames.length) {
|
|
69451
|
-
for (const frame of this._copiedFrames) {
|
|
69452
|
-
// New frame
|
|
69453
|
-
const newFrame = new shared_ui_components_nodeGraphSystem_graphFrame__WEBPACK_IMPORTED_MODULE_17__.GraphFrame(null, this._graphCanvas, true);
|
|
69454
|
-
this._graphCanvas.frames.push(newFrame);
|
|
69455
|
-
newFrame.width = frame.width;
|
|
69456
|
-
newFrame.height = frame.height;
|
|
69457
|
-
newFrame.width / 2;
|
|
69458
|
-
newFrame.name = frame.name;
|
|
69459
|
-
newFrame.color = frame.color;
|
|
69460
|
-
let currentX = (this._mouseLocationX - rootElement.offsetLeft - this._graphCanvas.x) / zoomLevel;
|
|
69461
|
-
newFrame.x = currentX - newFrame.width / 2;
|
|
69462
|
-
newFrame.y = currentY;
|
|
69463
|
-
// Paste nodes
|
|
69464
|
-
if (frame.nodes.length) {
|
|
69465
|
-
currentX = newFrame.x + frame.nodes[0].x - frame.x;
|
|
69466
|
-
currentY = newFrame.y + frame.nodes[0].y - frame.y;
|
|
69467
|
-
this._graphCanvas._frameIsMoving = true;
|
|
69468
|
-
const newNodes = this.pasteSelection(frame.nodes, currentX, currentY);
|
|
69469
|
-
if (newNodes) {
|
|
69470
|
-
for (const node of newNodes) {
|
|
69471
|
-
newFrame.syncNode(node);
|
|
69472
|
-
}
|
|
69473
|
-
}
|
|
69474
|
-
this._graphCanvas._frameIsMoving = false;
|
|
69475
|
-
}
|
|
69476
|
-
newFrame.adjustPorts();
|
|
69477
|
-
if (frame.isCollapsed) {
|
|
69478
|
-
newFrame.isCollapsed = true;
|
|
69479
|
-
}
|
|
69480
|
-
// Select
|
|
69481
|
-
this.props.globalState.stateManager.onSelectionChangedObservable.notifyObservers({ selection: newFrame, forceKeepSelection: true });
|
|
69482
|
-
return;
|
|
69483
|
-
}
|
|
69484
|
-
}
|
|
69485
|
-
if (!this._copiedNodes.length) {
|
|
69486
|
-
return;
|
|
69726
|
+
this._graphCanvas.handleKeyDown(evt, (nodeData) => {
|
|
69727
|
+
this.props.globalState.nodeMaterial.removeBlock(nodeData.data);
|
|
69728
|
+
}, this._mouseLocationX, this._mouseLocationY, (nodeData) => {
|
|
69729
|
+
const block = nodeData.data;
|
|
69730
|
+
const clone = block.clone(this.props.globalState.nodeMaterial.getScene());
|
|
69731
|
+
if (!clone) {
|
|
69732
|
+
return null;
|
|
69487
69733
|
}
|
|
69488
|
-
|
|
69489
|
-
|
|
69490
|
-
|
|
69491
|
-
}, false);
|
|
69734
|
+
return this.appendBlock(clone, false);
|
|
69735
|
+
}, this.props.globalState.hostDocument.querySelector(".diagram-container"));
|
|
69736
|
+
});
|
|
69492
69737
|
}
|
|
69493
69738
|
appendBlock(dataToAppend, recursion = true) {
|
|
69494
|
-
return this._graphCanvas.createNodeFromObject(dataToAppend instanceof core_Materials_Node_nodeMaterialBlock__WEBPACK_IMPORTED_MODULE_2__.NodeMaterialBlock ?
|
|
69739
|
+
return this._graphCanvas.createNodeFromObject(dataToAppend instanceof core_Materials_Node_nodeMaterialBlock__WEBPACK_IMPORTED_MODULE_2__.NodeMaterialBlock ? shared_ui_components_nodeGraphSystem_typeLedger__WEBPACK_IMPORTED_MODULE_17__.TypeLedger.NodeDataBuilder(dataToAppend, this._graphCanvas) : dataToAppend, (block) => {
|
|
69495
69740
|
if (this.props.globalState.nodeMaterial.attachedBlocks.indexOf(block) === -1) {
|
|
69496
69741
|
this.props.globalState.nodeMaterial.attachedBlocks.push(block);
|
|
69497
69742
|
}
|
|
@@ -69531,83 +69776,6 @@ class GraphEditor extends react__WEBPACK_IMPORTED_MODULE_1__.Component {
|
|
|
69531
69776
|
this._previewManager = null;
|
|
69532
69777
|
}
|
|
69533
69778
|
}
|
|
69534
|
-
reconnectNewNodes(nodeIndex, newNodes, sourceNodes, done) {
|
|
69535
|
-
if (done[nodeIndex]) {
|
|
69536
|
-
return;
|
|
69537
|
-
}
|
|
69538
|
-
const currentNode = newNodes[nodeIndex];
|
|
69539
|
-
const sourceNode = sourceNodes[nodeIndex];
|
|
69540
|
-
for (let inputIndex = 0; inputIndex < sourceNode.content.inputs.length; inputIndex++) {
|
|
69541
|
-
const sourceInput = sourceNode.content.inputs[inputIndex];
|
|
69542
|
-
const currentInput = currentNode.content.inputs[inputIndex];
|
|
69543
|
-
if (!sourceInput.isConnected) {
|
|
69544
|
-
continue;
|
|
69545
|
-
}
|
|
69546
|
-
const sourceBlock = this._graphCanvas.findNodeFromData(sourceInput.connectedPort.ownerData).content;
|
|
69547
|
-
const activeNodes = sourceNodes.filter((s) => s.content.data === sourceBlock);
|
|
69548
|
-
if (activeNodes.length > 0) {
|
|
69549
|
-
const activeNode = activeNodes[0];
|
|
69550
|
-
const indexInList = sourceNodes.indexOf(activeNode);
|
|
69551
|
-
// First make sure to connect the other one
|
|
69552
|
-
this.reconnectNewNodes(indexInList, newNodes, sourceNodes, done);
|
|
69553
|
-
// Then reconnect
|
|
69554
|
-
const outputIndex = sourceBlock.outputs.indexOf(sourceInput.connectedPort);
|
|
69555
|
-
const newOutput = newNodes[indexInList].content.data.outputs[outputIndex];
|
|
69556
|
-
newOutput.connectTo(currentInput);
|
|
69557
|
-
}
|
|
69558
|
-
else {
|
|
69559
|
-
// Connect with outside blocks
|
|
69560
|
-
sourceInput.connectedPort.connectTo(currentInput);
|
|
69561
|
-
}
|
|
69562
|
-
this._graphCanvas.connectPorts(currentInput.connectedPort, currentInput);
|
|
69563
|
-
}
|
|
69564
|
-
currentNode.refresh();
|
|
69565
|
-
done[nodeIndex] = true;
|
|
69566
|
-
}
|
|
69567
|
-
pasteSelection(copiedNodes, currentX, currentY, selectNew = false) {
|
|
69568
|
-
let originalNode = null;
|
|
69569
|
-
const newNodes = [];
|
|
69570
|
-
// Copy to prevent recursive side effects while creating nodes.
|
|
69571
|
-
copiedNodes = copiedNodes.slice();
|
|
69572
|
-
// Cancel selection
|
|
69573
|
-
this.props.globalState.stateManager.onSelectionChangedObservable.notifyObservers(null);
|
|
69574
|
-
// Create new nodes
|
|
69575
|
-
for (const node of copiedNodes) {
|
|
69576
|
-
const block = node.content.data;
|
|
69577
|
-
if (!block) {
|
|
69578
|
-
continue;
|
|
69579
|
-
}
|
|
69580
|
-
const clone = block.clone(this.props.globalState.nodeMaterial.getScene());
|
|
69581
|
-
if (!clone) {
|
|
69582
|
-
return;
|
|
69583
|
-
}
|
|
69584
|
-
const newNode = this.appendBlock(clone, false);
|
|
69585
|
-
let x = 0;
|
|
69586
|
-
let y = 0;
|
|
69587
|
-
if (originalNode) {
|
|
69588
|
-
x = currentX + node.x - originalNode.x;
|
|
69589
|
-
y = currentY + node.y - originalNode.y;
|
|
69590
|
-
}
|
|
69591
|
-
else {
|
|
69592
|
-
originalNode = node;
|
|
69593
|
-
x = currentX;
|
|
69594
|
-
y = currentY;
|
|
69595
|
-
}
|
|
69596
|
-
newNode.x = x;
|
|
69597
|
-
newNode.y = y;
|
|
69598
|
-
newNode.cleanAccumulation();
|
|
69599
|
-
newNodes.push(newNode);
|
|
69600
|
-
if (selectNew) {
|
|
69601
|
-
this.props.globalState.stateManager.onSelectionChangedObservable.notifyObservers({ selection: newNode, forceKeepSelection: true });
|
|
69602
|
-
}
|
|
69603
|
-
}
|
|
69604
|
-
// Relink
|
|
69605
|
-
const done = new Array(newNodes.length);
|
|
69606
|
-
for (let index = 0; index < newNodes.length; index++) {
|
|
69607
|
-
this.reconnectNewNodes(index, newNodes, copiedNodes, done);
|
|
69608
|
-
}
|
|
69609
|
-
return newNodes;
|
|
69610
|
-
}
|
|
69611
69779
|
zoomToFit() {
|
|
69612
69780
|
this._graphCanvas.zoomToFit();
|
|
69613
69781
|
}
|
|
@@ -69690,18 +69858,6 @@ class GraphEditor extends react__WEBPACK_IMPORTED_MODULE_1__.Component {
|
|
|
69690
69858
|
this._moveInProgress = false;
|
|
69691
69859
|
evt.currentTarget.releasePointerCapture(evt.pointerId);
|
|
69692
69860
|
}
|
|
69693
|
-
onWheel(evt) {
|
|
69694
|
-
if (evt.ctrlKey) {
|
|
69695
|
-
return evt.preventDefault();
|
|
69696
|
-
}
|
|
69697
|
-
if (Math.abs(evt.deltaX) < Math.abs(evt.deltaY)) {
|
|
69698
|
-
return;
|
|
69699
|
-
}
|
|
69700
|
-
const scrollLeftMax = this.scrollWidth - this.offsetWidth;
|
|
69701
|
-
if (this.scrollLeft + evt.deltaX < 0 || this.scrollLeft + evt.deltaX > scrollLeftMax) {
|
|
69702
|
-
return evt.preventDefault();
|
|
69703
|
-
}
|
|
69704
|
-
}
|
|
69705
69861
|
resizeColumns(evt, forLeft = true) {
|
|
69706
69862
|
if (!this._moveInProgress) {
|
|
69707
69863
|
return;
|
|
@@ -69745,7 +69901,7 @@ class GraphEditor extends react__WEBPACK_IMPORTED_MODULE_1__.Component {
|
|
|
69745
69901
|
if (storageData) {
|
|
69746
69902
|
const frameData = JSON.parse(storageData);
|
|
69747
69903
|
//edit position before loading.
|
|
69748
|
-
const newX = (targetX - this._graphCanvas.x -
|
|
69904
|
+
const newX = (targetX - this._graphCanvas.x - shared_ui_components_nodeGraphSystem_graphCanvas__WEBPACK_IMPORTED_MODULE_16__.GraphCanvasComponent.NodeWidth) / this._graphCanvas.zoom;
|
|
69749
69905
|
const newY = (targetY - this._graphCanvas.y - 20) / this._graphCanvas.zoom;
|
|
69750
69906
|
const oldX = frameData.editorData.frames[0].x;
|
|
69751
69907
|
const oldY = frameData.editorData.frames[0].y;
|
|
@@ -69786,37 +69942,14 @@ class GraphEditor extends react__WEBPACK_IMPORTED_MODULE_1__.Component {
|
|
|
69786
69942
|
newNode = this.appendBlock(block);
|
|
69787
69943
|
}
|
|
69788
69944
|
// Size exceptions
|
|
69789
|
-
let offsetX =
|
|
69945
|
+
let offsetX = shared_ui_components_nodeGraphSystem_graphCanvas__WEBPACK_IMPORTED_MODULE_16__.GraphCanvasComponent.NodeWidth;
|
|
69790
69946
|
let offsetY = 20;
|
|
69791
69947
|
if (blockType === "ElbowBlock") {
|
|
69792
69948
|
offsetX = 10;
|
|
69793
69949
|
offsetY = 10;
|
|
69794
69950
|
}
|
|
69795
69951
|
// Drop
|
|
69796
|
-
|
|
69797
|
-
let y = targetY - this._graphCanvas.y - offsetY * this._graphCanvas.zoom;
|
|
69798
|
-
newNode.x = x / this._graphCanvas.zoom;
|
|
69799
|
-
newNode.y = y / this._graphCanvas.zoom;
|
|
69800
|
-
newNode.cleanAccumulation();
|
|
69801
|
-
this.props.globalState.stateManager.onNewNodeCreatedObservable.notifyObservers(newNode);
|
|
69802
|
-
this.props.globalState.stateManager.onSelectionChangedObservable.notifyObservers(null);
|
|
69803
|
-
this.props.globalState.stateManager.onSelectionChangedObservable.notifyObservers({ selection: newNode });
|
|
69804
|
-
const block = newNode.content.data;
|
|
69805
|
-
x -= GraphEditor.NodeWidth + 150;
|
|
69806
|
-
block.inputs.forEach((connection) => {
|
|
69807
|
-
if (connection.connectedPoint) {
|
|
69808
|
-
const existingNodes = this._graphCanvas.nodes.filter((n) => {
|
|
69809
|
-
return n.content.data === connection.connectedPoint.ownerBlock;
|
|
69810
|
-
});
|
|
69811
|
-
const connectedNode = existingNodes[0];
|
|
69812
|
-
if (connectedNode.x === 0 && connectedNode.y === 0) {
|
|
69813
|
-
connectedNode.x = x / this._graphCanvas.zoom;
|
|
69814
|
-
connectedNode.y = y / this._graphCanvas.zoom;
|
|
69815
|
-
connectedNode.cleanAccumulation();
|
|
69816
|
-
y += 80;
|
|
69817
|
-
}
|
|
69818
|
-
}
|
|
69819
|
-
});
|
|
69952
|
+
this._graphCanvas.drop(newNode, targetX, targetY, offsetX, offsetY);
|
|
69820
69953
|
this.forceUpdate();
|
|
69821
69954
|
}
|
|
69822
69955
|
dropNewBlock(event) {
|
|
@@ -69840,10 +69973,9 @@ class GraphEditor extends react__WEBPACK_IMPORTED_MODULE_1__.Component {
|
|
|
69840
69973
|
event.preventDefault();
|
|
69841
69974
|
} }, { children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_nodeGraphSystem_graphCanvas__WEBPACK_IMPORTED_MODULE_16__.GraphCanvasComponent, { ref: this._graphCanvasRef, stateManager: this.props.globalState.stateManager, onEmitNewNode: (nodeData) => {
|
|
69842
69975
|
return this.appendBlock(nodeData.data);
|
|
69843
|
-
} }) })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", { id: "rightGrab", onPointerDown: (evt) => this.onPointerDown(evt), onPointerUp: (evt) => this.onPointerUp(evt), onPointerMove: (evt) => this.resizeColumns(evt, false) }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", Object.assign({ className: "right-panel" }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_components_propertyTab_propertyTabComponent__WEBPACK_IMPORTED_MODULE_4__.PropertyTabComponent, { globalState: this.props.globalState }), !this.state.showPreviewPopUp ? (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_components_preview_previewMeshControlComponent__WEBPACK_IMPORTED_MODULE_10__.PreviewMeshControlComponent, { globalState: this.props.globalState, togglePreviewAreaComponent: this.handlePopUp }) : null, !this.state.showPreviewPopUp ? (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_components_preview_previewAreaComponent__WEBPACK_IMPORTED_MODULE_11__.PreviewAreaComponent, { globalState: this.props.globalState, width: this._rightWidth }) : null] })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_components_log_logComponent__WEBPACK_IMPORTED_MODULE_6__.LogComponent, { globalState: this.props.globalState })] })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_sharedComponents_messageDialog__WEBPACK_IMPORTED_MODULE_7__.MessageDialogComponent, { globalState: this.props.globalState }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", Object.assign({ className: "blocker" }, { children: "Node Material Editor runs only on desktop" })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", Object.assign({ className: "wait-screen hidden" }, { children: "Processing...please wait" }))] })));
|
|
69976
|
+
} }) })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", { id: "rightGrab", onPointerDown: (evt) => this.onPointerDown(evt), onPointerUp: (evt) => this.onPointerUp(evt), onPointerMove: (evt) => this.resizeColumns(evt, false) }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", Object.assign({ className: "right-panel" }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_components_propertyTab_propertyTabComponent__WEBPACK_IMPORTED_MODULE_4__.PropertyTabComponent, { lockObject: this.props.globalState.lockObject, globalState: this.props.globalState }), !this.state.showPreviewPopUp ? (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_components_preview_previewMeshControlComponent__WEBPACK_IMPORTED_MODULE_10__.PreviewMeshControlComponent, { globalState: this.props.globalState, togglePreviewAreaComponent: this.handlePopUp }) : null, !this.state.showPreviewPopUp ? (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_components_preview_previewAreaComponent__WEBPACK_IMPORTED_MODULE_11__.PreviewAreaComponent, { globalState: this.props.globalState, width: this._rightWidth }) : null] })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_components_log_logComponent__WEBPACK_IMPORTED_MODULE_6__.LogComponent, { globalState: this.props.globalState })] })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_sharedComponents_messageDialog__WEBPACK_IMPORTED_MODULE_7__.MessageDialogComponent, { globalState: this.props.globalState }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", Object.assign({ className: "blocker" }, { children: "Node Material Editor runs only on desktop" })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", Object.assign({ className: "wait-screen hidden" }, { children: "Processing...please wait" }))] })));
|
|
69844
69977
|
}
|
|
69845
69978
|
}
|
|
69846
|
-
GraphEditor.NodeWidth = 100;
|
|
69847
69979
|
|
|
69848
69980
|
|
|
69849
69981
|
/***/ }),
|
|
@@ -69859,7 +69991,14 @@ __webpack_require__.r(__webpack_exports__);
|
|
|
69859
69991
|
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
|
|
69860
69992
|
/* harmony export */ "BlockNodeData": () => (/* binding */ BlockNodeData)
|
|
69861
69993
|
/* harmony export */ });
|
|
69862
|
-
/* harmony import */ var
|
|
69994
|
+
/* harmony import */ var core_Materials_Node_Enums_nodeMaterialBlockTargets__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! core/Materials/Node/Enums/nodeMaterialBlockTargets */ "core/Misc/dataStorage");
|
|
69995
|
+
/* harmony import */ var core_Materials_Node_Enums_nodeMaterialBlockTargets__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(core_Materials_Node_Enums_nodeMaterialBlockTargets__WEBPACK_IMPORTED_MODULE_0__);
|
|
69996
|
+
/* harmony import */ var _connectionPointPortData__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./connectionPointPortData */ "../../../tools/nodeEditor/dist/graphSystem/connectionPointPortData.js");
|
|
69997
|
+
/* harmony import */ var _imgs_triangle_svg__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../imgs/triangle.svg */ "../../../tools/nodeEditor/dist/imgs/triangle.svg");
|
|
69998
|
+
/* harmony import */ var _imgs_square_svg__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../imgs/square.svg */ "../../../tools/nodeEditor/dist/imgs/square.svg");
|
|
69999
|
+
|
|
70000
|
+
|
|
70001
|
+
|
|
69863
70002
|
|
|
69864
70003
|
class BlockNodeData {
|
|
69865
70004
|
constructor(data, nodeContainer) {
|
|
@@ -69868,12 +70007,12 @@ class BlockNodeData {
|
|
|
69868
70007
|
this._outputs = [];
|
|
69869
70008
|
if (data.inputs) {
|
|
69870
70009
|
this.data.inputs.forEach((input) => {
|
|
69871
|
-
this._inputs.push(new
|
|
70010
|
+
this._inputs.push(new _connectionPointPortData__WEBPACK_IMPORTED_MODULE_1__.ConnectionPointPortData(input, nodeContainer));
|
|
69872
70011
|
});
|
|
69873
70012
|
}
|
|
69874
70013
|
if (data.outputs) {
|
|
69875
70014
|
this.data.outputs.forEach((output) => {
|
|
69876
|
-
this._outputs.push(new
|
|
70015
|
+
this._outputs.push(new _connectionPointPortData__WEBPACK_IMPORTED_MODULE_1__.ConnectionPointPortData(output, nodeContainer));
|
|
69877
70016
|
});
|
|
69878
70017
|
}
|
|
69879
70018
|
}
|
|
@@ -69917,11 +70056,24 @@ class BlockNodeData {
|
|
|
69917
70056
|
dispose() {
|
|
69918
70057
|
this.data.dispose();
|
|
69919
70058
|
}
|
|
69920
|
-
|
|
69921
|
-
if (this.data.getClassName()
|
|
69922
|
-
|
|
70059
|
+
prepareHeaderIcon(iconDiv, img) {
|
|
70060
|
+
if (this.data.getClassName() === "ElbowBlock") {
|
|
70061
|
+
iconDiv.classList.remove("visible");
|
|
70062
|
+
return;
|
|
69923
70063
|
}
|
|
69924
|
-
|
|
70064
|
+
if (this.data.target === core_Materials_Node_Enums_nodeMaterialBlockTargets__WEBPACK_IMPORTED_MODULE_0__.NodeMaterialBlockTargets.Fragment) {
|
|
70065
|
+
iconDiv.classList.add("visible");
|
|
70066
|
+
iconDiv.title = "In the fragment shader";
|
|
70067
|
+
img.src = _imgs_square_svg__WEBPACK_IMPORTED_MODULE_3__;
|
|
70068
|
+
return;
|
|
70069
|
+
}
|
|
70070
|
+
if (this.data.target === core_Materials_Node_Enums_nodeMaterialBlockTargets__WEBPACK_IMPORTED_MODULE_0__.NodeMaterialBlockTargets.Vertex) {
|
|
70071
|
+
iconDiv.classList.add("visible");
|
|
70072
|
+
iconDiv.title = "In the vertex shader";
|
|
70073
|
+
img.src = _imgs_triangle_svg__WEBPACK_IMPORTED_MODULE_2__;
|
|
70074
|
+
return;
|
|
70075
|
+
}
|
|
70076
|
+
iconDiv.classList.remove("visible");
|
|
69925
70077
|
}
|
|
69926
70078
|
}
|
|
69927
70079
|
|
|
@@ -70028,6 +70180,9 @@ class ConnectionPointPortData {
|
|
|
70028
70180
|
this.data.connectTo(port.data);
|
|
70029
70181
|
this._connectedPort = port;
|
|
70030
70182
|
}
|
|
70183
|
+
canConnectTo(port) {
|
|
70184
|
+
return this.data.canConnectTo(port.data);
|
|
70185
|
+
}
|
|
70031
70186
|
disconnectFrom(port) {
|
|
70032
70187
|
this.data.disconnectFrom(port.data);
|
|
70033
70188
|
port.connectedPort = null;
|
|
@@ -70926,13 +71081,13 @@ class FramePropertyTabComponent extends react__WEBPACK_IMPORTED_MODULE_1__.Compo
|
|
|
70926
71081
|
configurableInputBlocks = configurableInputBlocks.sort((a, b) => {
|
|
70927
71082
|
return a.name.localeCompare(b.name);
|
|
70928
71083
|
});
|
|
70929
|
-
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", Object.assign({ id: "propertyTab" }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", Object.assign({ id: "header" }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("img", { id: "logo", src: "https://www.babylonjs.com/Assets/logo-babylonjs-social-twitter.png" }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", Object.assign({ id: "title" }, { children: "NODE MATERIAL EDITOR" }))] })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(_sharedComponents_lineContainerComponent__WEBPACK_IMPORTED_MODULE_2__.LineContainerComponent, Object.assign({ title: "GENERAL" }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_textInputLineComponent__WEBPACK_IMPORTED_MODULE_4__.TextInputLineComponent, { label: "Name", propertyName: "name", lockObject: this.props.globalState.lockObject, target: this.props.frame }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_color3LineComponent__WEBPACK_IMPORTED_MODULE_5__.Color3LineComponent, { label: "Color", target: this.props.frame, propertyName: "color" }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_textInputLineComponent__WEBPACK_IMPORTED_MODULE_4__.TextInputLineComponent, { lockObject: this.props.globalState.lockObject, label: "Comments", propertyName: "comments", target: this.props.frame }), !this.props.frame.isCollapsed && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_buttonLineComponent__WEBPACK_IMPORTED_MODULE_6__.ButtonLineComponent, { label: "Collapse", onClick: () => {
|
|
71084
|
+
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", Object.assign({ id: "propertyTab" }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", Object.assign({ id: "header" }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("img", { id: "logo", src: "https://www.babylonjs.com/Assets/logo-babylonjs-social-twitter.png" }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", Object.assign({ id: "title" }, { children: "NODE MATERIAL EDITOR" }))] })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(_sharedComponents_lineContainerComponent__WEBPACK_IMPORTED_MODULE_2__.LineContainerComponent, Object.assign({ title: "GENERAL" }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_textInputLineComponent__WEBPACK_IMPORTED_MODULE_4__.TextInputLineComponent, { label: "Name", propertyName: "name", lockObject: this.props.globalState.lockObject, target: this.props.frame }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_color3LineComponent__WEBPACK_IMPORTED_MODULE_5__.Color3LineComponent, { lockObject: this.props.globalState.lockObject, label: "Color", target: this.props.frame, propertyName: "color" }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_textInputLineComponent__WEBPACK_IMPORTED_MODULE_4__.TextInputLineComponent, { lockObject: this.props.globalState.lockObject, label: "Comments", propertyName: "comments", target: this.props.frame }), !this.props.frame.isCollapsed && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_buttonLineComponent__WEBPACK_IMPORTED_MODULE_6__.ButtonLineComponent, { label: "Collapse", onClick: () => {
|
|
70930
71085
|
this.props.frame.isCollapsed = true;
|
|
70931
71086
|
} })), this.props.frame.isCollapsed && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_buttonLineComponent__WEBPACK_IMPORTED_MODULE_6__.ButtonLineComponent, { label: "Expand", onClick: () => {
|
|
70932
71087
|
this.props.frame.isCollapsed = false;
|
|
70933
71088
|
} })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_buttonLineComponent__WEBPACK_IMPORTED_MODULE_6__.ButtonLineComponent, { label: "Export", onClick: () => {
|
|
70934
71089
|
this.props.frame.export();
|
|
70935
|
-
} })] })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_components_propertyTab_inputsPropertyTabComponent__WEBPACK_IMPORTED_MODULE_3__.InputsPropertyTabComponent, { globalState: this.props.globalState, inputs: configurableInputBlocks })] })] })));
|
|
71090
|
+
} })] })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_components_propertyTab_inputsPropertyTabComponent__WEBPACK_IMPORTED_MODULE_3__.InputsPropertyTabComponent, { lockObject: this.props.globalState.lockObject, globalState: this.props.globalState, inputs: configurableInputBlocks })] })] })));
|
|
70936
71091
|
}
|
|
70937
71092
|
}
|
|
70938
71093
|
|
|
@@ -70955,15 +71110,15 @@ __webpack_require__.r(__webpack_exports__);
|
|
|
70955
71110
|
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react/jsx-runtime */ "../../../../node_modules/react/jsx-runtime.js");
|
|
70956
71111
|
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! react */ "../../../../node_modules/react/index.js");
|
|
70957
71112
|
/* harmony import */ var _sharedComponents_lineContainerComponent__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../../sharedComponents/lineContainerComponent */ "../../../tools/nodeEditor/dist/sharedComponents/lineContainerComponent.js");
|
|
70958
|
-
/* harmony import */ var
|
|
70959
|
-
/* harmony import */ var
|
|
70960
|
-
/* harmony import */ var
|
|
70961
|
-
/* harmony import */ var
|
|
70962
|
-
/* harmony import */ var
|
|
70963
|
-
/* harmony import */ var
|
|
70964
|
-
/* harmony import */ var
|
|
70965
|
-
/* harmony import */ var
|
|
70966
|
-
/* harmony import */ var
|
|
71113
|
+
/* harmony import */ var _sharedComponents_checkBoxLineComponent__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../../sharedComponents/checkBoxLineComponent */ "../../../tools/nodeEditor/dist/sharedComponents/checkBoxLineComponent.js");
|
|
71114
|
+
/* harmony import */ var core_Materials_Node_nodeMaterialDecorator__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! core/Materials/Node/Enums/nodeMaterialBlockTargets */ "core/Misc/dataStorage");
|
|
71115
|
+
/* harmony import */ var core_Materials_Node_nodeMaterialDecorator__WEBPACK_IMPORTED_MODULE_4___default = /*#__PURE__*/__webpack_require__.n(core_Materials_Node_nodeMaterialDecorator__WEBPACK_IMPORTED_MODULE_4__);
|
|
71116
|
+
/* harmony import */ var shared_ui_components_lines_textInputLineComponent__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! shared-ui-components/lines/textInputLineComponent */ "../../../dev/sharedUiComponents/dist/lines/textInputLineComponent.js");
|
|
71117
|
+
/* harmony import */ var shared_ui_components_lines_vector2LineComponent__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! shared-ui-components/lines/vector2LineComponent */ "../../../dev/sharedUiComponents/dist/lines/vector2LineComponent.js");
|
|
71118
|
+
/* harmony import */ var shared_ui_components_lines_optionsLineComponent__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! shared-ui-components/lines/optionsLineComponent */ "../../../dev/sharedUiComponents/dist/lines/optionsLineComponent.js");
|
|
71119
|
+
/* harmony import */ var shared_ui_components_lines_textLineComponent__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! shared-ui-components/lines/textLineComponent */ "../../../dev/sharedUiComponents/dist/lines/textLineComponent.js");
|
|
71120
|
+
/* harmony import */ var shared_ui_components_lines_floatLineComponent__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! shared-ui-components/lines/floatLineComponent */ "../../../dev/sharedUiComponents/dist/lines/floatLineComponent.js");
|
|
71121
|
+
/* harmony import */ var shared_ui_components_lines_sliderLineComponent__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! shared-ui-components/lines/sliderLineComponent */ "../../../dev/sharedUiComponents/dist/lines/sliderLineComponent.js");
|
|
70967
71122
|
|
|
70968
71123
|
|
|
70969
71124
|
|
|
@@ -70990,22 +71145,22 @@ class GeneralPropertyTabComponent extends react__WEBPACK_IMPORTED_MODULE_1__.Com
|
|
|
70990
71145
|
}
|
|
70991
71146
|
render() {
|
|
70992
71147
|
const targetOptions = [
|
|
70993
|
-
{ label: "Neutral", value:
|
|
70994
|
-
{ label: "Vertex", value:
|
|
70995
|
-
{ label: "Fragment", value:
|
|
71148
|
+
{ label: "Neutral", value: core_Materials_Node_nodeMaterialDecorator__WEBPACK_IMPORTED_MODULE_4__.NodeMaterialBlockTargets.Neutral },
|
|
71149
|
+
{ label: "Vertex", value: core_Materials_Node_nodeMaterialDecorator__WEBPACK_IMPORTED_MODULE_4__.NodeMaterialBlockTargets.Vertex },
|
|
71150
|
+
{ label: "Fragment", value: core_Materials_Node_nodeMaterialDecorator__WEBPACK_IMPORTED_MODULE_4__.NodeMaterialBlockTargets.Fragment },
|
|
70996
71151
|
];
|
|
70997
71152
|
const block = this.props.nodeData.data;
|
|
70998
|
-
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.Fragment, { children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(_sharedComponents_lineContainerComponent__WEBPACK_IMPORTED_MODULE_2__.LineContainerComponent, Object.assign({ title: "GENERAL" }, { children: [(!block.isInput || !block.isAttribute) && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(
|
|
71153
|
+
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.Fragment, { children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(_sharedComponents_lineContainerComponent__WEBPACK_IMPORTED_MODULE_2__.LineContainerComponent, Object.assign({ title: "GENERAL" }, { children: [(!block.isInput || !block.isAttribute) && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_textInputLineComponent__WEBPACK_IMPORTED_MODULE_5__.TextInputLineComponent, { label: "Name", propertyName: "name", target: block, lockObject: this.props.stateManager.lockObject, onChange: () => this.props.stateManager.onUpdateRequiredObservable.notifyObservers(block), validator: (newName) => {
|
|
70999
71154
|
if (!block.validateBlockName(newName)) {
|
|
71000
71155
|
this.props.stateManager.onErrorMessageDialogRequiredObservable.notifyObservers(`"${newName}" is a reserved name, please choose another`);
|
|
71001
71156
|
return false;
|
|
71002
71157
|
}
|
|
71003
71158
|
return true;
|
|
71004
|
-
} })), block._originalTargetIsNeutral && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(
|
|
71159
|
+
} })), block._originalTargetIsNeutral && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_optionsLineComponent__WEBPACK_IMPORTED_MODULE_7__.OptionsLineComponent, { label: "Target", options: targetOptions, target: block, propertyName: "target", onSelect: () => {
|
|
71005
71160
|
this.forceUpdate();
|
|
71006
71161
|
this.props.stateManager.onUpdateRequiredObservable.notifyObservers(block);
|
|
71007
71162
|
this.props.stateManager.onRebuildRequiredObservable.notifyObservers(true);
|
|
71008
|
-
} })), !block._originalTargetIsNeutral && (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(
|
|
71163
|
+
} })), !block._originalTargetIsNeutral && (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_textLineComponent__WEBPACK_IMPORTED_MODULE_8__.TextLineComponent, { label: "Target", value: core_Materials_Node_nodeMaterialDecorator__WEBPACK_IMPORTED_MODULE_4__.NodeMaterialBlockTargets[block.target] }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_textLineComponent__WEBPACK_IMPORTED_MODULE_8__.TextLineComponent, { label: "Type", value: block.getClassName() }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_textInputLineComponent__WEBPACK_IMPORTED_MODULE_5__.TextInputLineComponent, { label: "Comments", propertyName: "comments", lockObject: this.props.stateManager.lockObject, target: block, onChange: () => this.props.stateManager.onUpdateRequiredObservable.notifyObservers(block) })] })) }));
|
|
71009
71164
|
}
|
|
71010
71165
|
}
|
|
71011
71166
|
class GenericPropertyTabComponent extends react__WEBPACK_IMPORTED_MODULE_1__.Component {
|
|
@@ -71039,30 +71194,30 @@ class GenericPropertyTabComponent extends react__WEBPACK_IMPORTED_MODULE_1__.Com
|
|
|
71039
71194
|
groups.push(groupName);
|
|
71040
71195
|
}
|
|
71041
71196
|
switch (type) {
|
|
71042
|
-
case
|
|
71043
|
-
components.push((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(
|
|
71197
|
+
case core_Materials_Node_nodeMaterialDecorator__WEBPACK_IMPORTED_MODULE_4__.PropertyTypeForEdition.Boolean: {
|
|
71198
|
+
components.push((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_sharedComponents_checkBoxLineComponent__WEBPACK_IMPORTED_MODULE_3__.CheckBoxLineComponent, { label: displayName, target: block, propertyName: propertyName, onValueChanged: () => this.forceRebuild(options.notifiers) }));
|
|
71044
71199
|
break;
|
|
71045
71200
|
}
|
|
71046
|
-
case
|
|
71201
|
+
case core_Materials_Node_nodeMaterialDecorator__WEBPACK_IMPORTED_MODULE_4__.PropertyTypeForEdition.Float: {
|
|
71047
71202
|
const cantDisplaySlider = isNaN(options.min) || isNaN(options.max) || options.min === options.max;
|
|
71048
71203
|
if (cantDisplaySlider) {
|
|
71049
|
-
components.push((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(
|
|
71204
|
+
components.push((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_floatLineComponent__WEBPACK_IMPORTED_MODULE_9__.FloatLineComponent, { lockObject: this.props.stateManager.lockObject, label: displayName, propertyName: propertyName, target: block, onChange: () => this.forceRebuild(options.notifiers) }));
|
|
71050
71205
|
}
|
|
71051
71206
|
else {
|
|
71052
|
-
components.push((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(
|
|
71207
|
+
components.push((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_sliderLineComponent__WEBPACK_IMPORTED_MODULE_10__.SliderLineComponent, { lockObject: this.props.stateManager.lockObject, label: displayName, target: block, propertyName: propertyName, step: Math.abs(options.max - options.min) / 100.0, minimum: Math.min(options.min, options.max), maximum: options.max, onChange: () => this.forceRebuild(options.notifiers) }));
|
|
71053
71208
|
}
|
|
71054
71209
|
break;
|
|
71055
71210
|
}
|
|
71056
|
-
case
|
|
71057
|
-
components.push((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(
|
|
71211
|
+
case core_Materials_Node_nodeMaterialDecorator__WEBPACK_IMPORTED_MODULE_4__.PropertyTypeForEdition.Int: {
|
|
71212
|
+
components.push((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_floatLineComponent__WEBPACK_IMPORTED_MODULE_9__.FloatLineComponent, { lockObject: this.props.stateManager.lockObject, digits: 0, step: "1", isInteger: true, label: displayName, propertyName: propertyName, target: block, onChange: () => this.forceRebuild(options.notifiers) }));
|
|
71058
71213
|
break;
|
|
71059
71214
|
}
|
|
71060
|
-
case
|
|
71061
|
-
components.push((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(
|
|
71215
|
+
case core_Materials_Node_nodeMaterialDecorator__WEBPACK_IMPORTED_MODULE_4__.PropertyTypeForEdition.Vector2: {
|
|
71216
|
+
components.push((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_vector2LineComponent__WEBPACK_IMPORTED_MODULE_6__.Vector2LineComponent, { lockObject: this.props.stateManager.lockObject, label: displayName, propertyName: propertyName, target: block, onChange: () => this.forceRebuild(options.notifiers) }));
|
|
71062
71217
|
break;
|
|
71063
71218
|
}
|
|
71064
|
-
case
|
|
71065
|
-
components.push((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(
|
|
71219
|
+
case core_Materials_Node_nodeMaterialDecorator__WEBPACK_IMPORTED_MODULE_4__.PropertyTypeForEdition.List: {
|
|
71220
|
+
components.push((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_optionsLineComponent__WEBPACK_IMPORTED_MODULE_7__.OptionsLineComponent, { label: displayName, options: options.options, target: block, propertyName: propertyName, onSelect: () => this.forceRebuild(options.notifiers) }));
|
|
71066
71221
|
break;
|
|
71067
71222
|
}
|
|
71068
71223
|
}
|
|
@@ -71216,10 +71371,10 @@ __webpack_require__.r(__webpack_exports__);
|
|
|
71216
71371
|
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! react */ "../../../../node_modules/react/index.js");
|
|
71217
71372
|
/* harmony import */ var core_Maths_math_color__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! core/Maths/math.color */ "core/Misc/dataStorage");
|
|
71218
71373
|
/* harmony import */ var core_Maths_math_color__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(core_Maths_math_color__WEBPACK_IMPORTED_MODULE_2__);
|
|
71219
|
-
/* harmony import */ var
|
|
71220
|
-
/* harmony import */ var
|
|
71221
|
-
/* harmony import */ var
|
|
71222
|
-
/* harmony import */ var
|
|
71374
|
+
/* harmony import */ var _imgs_delete_svg__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../../imgs/delete.svg */ "../../../tools/nodeEditor/dist/imgs/delete.svg");
|
|
71375
|
+
/* harmony import */ var _sharedComponents_copy_svg__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../../sharedComponents/copy.svg */ "../../../tools/nodeEditor/dist/sharedComponents/copy.svg");
|
|
71376
|
+
/* harmony import */ var shared_ui_components_lines_floatLineComponent__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! shared-ui-components/lines/floatLineComponent */ "../../../dev/sharedUiComponents/dist/lines/floatLineComponent.js");
|
|
71377
|
+
/* harmony import */ var shared_ui_components_lines_colorPickerComponent__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! shared-ui-components/lines/colorPickerComponent */ "../../../dev/sharedUiComponents/dist/lines/colorPickerComponent.js");
|
|
71223
71378
|
|
|
71224
71379
|
|
|
71225
71380
|
|
|
@@ -71247,16 +71402,16 @@ class GradientStepComponent extends react__WEBPACK_IMPORTED_MODULE_1__.Component
|
|
|
71247
71402
|
}
|
|
71248
71403
|
render() {
|
|
71249
71404
|
const step = this.props.step;
|
|
71250
|
-
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", Object.assign({ className: "gradient-step" }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", Object.assign({ className: "step" }, { children: `#${this.props.lineIndex}` })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", Object.assign({ className: "color" }, { children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(
|
|
71405
|
+
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", Object.assign({ className: "gradient-step" }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", Object.assign({ className: "step" }, { children: `#${this.props.lineIndex}` })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", Object.assign({ className: "color" }, { children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_colorPickerComponent__WEBPACK_IMPORTED_MODULE_6__.ColorPickerLineComponent, { lockObject: this.props.stateManager.lockObject, value: step.color, onColorChanged: (color) => {
|
|
71251
71406
|
this.updateColor(color);
|
|
71252
|
-
} }) })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", Object.assign({ className: "step-value" }, { children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(
|
|
71407
|
+
} }) })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", Object.assign({ className: "step-value" }, { children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_floatLineComponent__WEBPACK_IMPORTED_MODULE_5__.FloatLineComponent, { lockObject: this.props.stateManager.lockObject, smallUI: true, label: "", target: step, propertyName: "step", min: 0, max: 1, onEnter: () => {
|
|
71253
71408
|
this.props.onUpdateStep();
|
|
71254
71409
|
this.props.onCheckForReOrder();
|
|
71255
71410
|
this.forceUpdate();
|
|
71256
71411
|
} }) })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", Object.assign({ className: "step-slider" }, { children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("input", { className: "range", type: "range", step: 0.01, min: 0, max: 1.0, value: step.step, onPointerUp: () => this.onPointerUp(), onChange: (evt) => this.updateStep(parseFloat(evt.target.value)) }) })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", Object.assign({ className: "gradient-copy", onClick: () => {
|
|
71257
71412
|
if (this.props.onCopy)
|
|
71258
71413
|
this.props.onCopy();
|
|
71259
|
-
}, title: "Copy Step" }, { children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("img", { className: "img", src:
|
|
71414
|
+
}, title: "Copy Step" }, { children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("img", { className: "img", src: _sharedComponents_copy_svg__WEBPACK_IMPORTED_MODULE_4__ }) })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", Object.assign({ className: "gradient-delete", onClick: () => this.props.onDelete(), title: "Delete Step" }, { children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("img", { className: "img", src: _imgs_delete_svg__WEBPACK_IMPORTED_MODULE_3__ }) }))] })));
|
|
71260
71415
|
}
|
|
71261
71416
|
}
|
|
71262
71417
|
|
|
@@ -71282,11 +71437,11 @@ __webpack_require__.r(__webpack_exports__);
|
|
|
71282
71437
|
/* harmony import */ var _sharedComponents_lineContainerComponent__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../../sharedComponents/lineContainerComponent */ "../../../tools/nodeEditor/dist/sharedComponents/lineContainerComponent.js");
|
|
71283
71438
|
/* harmony import */ var _sharedComponents_checkBoxLineComponent__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../../sharedComponents/checkBoxLineComponent */ "../../../tools/nodeEditor/dist/sharedComponents/checkBoxLineComponent.js");
|
|
71284
71439
|
/* harmony import */ var _genericNodePropertyComponent__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ./genericNodePropertyComponent */ "../../../tools/nodeEditor/dist/graphSystem/properties/genericNodePropertyComponent.js");
|
|
71285
|
-
/* harmony import */ var
|
|
71286
|
-
/* harmony import */ var
|
|
71287
|
-
/* harmony import */ var
|
|
71288
|
-
/* harmony import */ var
|
|
71289
|
-
/* harmony import */ var
|
|
71440
|
+
/* harmony import */ var shared_ui_components_lines_textInputLineComponent__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! shared-ui-components/lines/textInputLineComponent */ "../../../dev/sharedUiComponents/dist/lines/textInputLineComponent.js");
|
|
71441
|
+
/* harmony import */ var shared_ui_components_lines_buttonLineComponent__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! shared-ui-components/lines/buttonLineComponent */ "../../../dev/sharedUiComponents/dist/lines/buttonLineComponent.js");
|
|
71442
|
+
/* harmony import */ var shared_ui_components_lines_optionsLineComponent__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! shared-ui-components/lines/optionsLineComponent */ "../../../dev/sharedUiComponents/dist/lines/optionsLineComponent.js");
|
|
71443
|
+
/* harmony import */ var shared_ui_components_lines_floatLineComponent__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! shared-ui-components/lines/floatLineComponent */ "../../../dev/sharedUiComponents/dist/lines/floatLineComponent.js");
|
|
71444
|
+
/* harmony import */ var shared_ui_components_lines_sliderLineComponent__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! shared-ui-components/lines/sliderLineComponent */ "../../../dev/sharedUiComponents/dist/lines/sliderLineComponent.js");
|
|
71290
71445
|
|
|
71291
71446
|
|
|
71292
71447
|
|
|
@@ -71400,7 +71555,7 @@ class ImageSourcePropertyTabComponent extends react__WEBPACK_IMPORTED_MODULE_1__
|
|
|
71400
71555
|
{ label: "Linear/Nearest & linear mip", value: core_Misc_tools__WEBPACK_IMPORTED_MODULE_3__.Texture.LINEAR_NEAREST_MIPLINEAR },
|
|
71401
71556
|
{ label: "Linear/Nearest & nearest mip", value: core_Misc_tools__WEBPACK_IMPORTED_MODULE_3__.Texture.LINEAR_NEAREST_MIPNEAREST }, // 9
|
|
71402
71557
|
];
|
|
71403
|
-
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_genericNodePropertyComponent__WEBPACK_IMPORTED_MODULE_6__.GeneralPropertyTabComponent, { stateManager: this.props.stateManager, nodeData: this.props.nodeData }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(_sharedComponents_lineContainerComponent__WEBPACK_IMPORTED_MODULE_4__.LineContainerComponent, Object.assign({ title: "PROPERTIES" }, { children: [texture && texture.updateSamplingMode && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(
|
|
71558
|
+
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_genericNodePropertyComponent__WEBPACK_IMPORTED_MODULE_6__.GeneralPropertyTabComponent, { stateManager: this.props.stateManager, nodeData: this.props.nodeData }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(_sharedComponents_lineContainerComponent__WEBPACK_IMPORTED_MODULE_4__.LineContainerComponent, Object.assign({ title: "PROPERTIES" }, { children: [texture && texture.updateSamplingMode && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_optionsLineComponent__WEBPACK_IMPORTED_MODULE_9__.OptionsLineComponent, { label: "Sampling", options: samplingMode, target: texture, noDirectUpdate: true, propertyName: "samplingMode", onSelect: (value) => {
|
|
71404
71559
|
texture.updateSamplingMode(value);
|
|
71405
71560
|
this.props.stateManager.onUpdateRequiredObservable.notifyObservers(block);
|
|
71406
71561
|
} })), texture && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_sharedComponents_checkBoxLineComponent__WEBPACK_IMPORTED_MODULE_5__.CheckBoxLineComponent, { label: "Clamp U", isSelected: () => texture.wrapU === core_Misc_tools__WEBPACK_IMPORTED_MODULE_3__.Texture.CLAMP_ADDRESSMODE, onSelect: (value) => {
|
|
@@ -71409,25 +71564,25 @@ class ImageSourcePropertyTabComponent extends react__WEBPACK_IMPORTED_MODULE_1__
|
|
|
71409
71564
|
} })), texture && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_sharedComponents_checkBoxLineComponent__WEBPACK_IMPORTED_MODULE_5__.CheckBoxLineComponent, { label: "Clamp V", isSelected: () => texture.wrapV === core_Misc_tools__WEBPACK_IMPORTED_MODULE_3__.Texture.CLAMP_ADDRESSMODE, onSelect: (value) => {
|
|
71410
71565
|
texture.wrapV = value ? core_Misc_tools__WEBPACK_IMPORTED_MODULE_3__.Texture.CLAMP_ADDRESSMODE : core_Misc_tools__WEBPACK_IMPORTED_MODULE_3__.Texture.WRAP_ADDRESSMODE;
|
|
71411
71566
|
this.props.stateManager.onUpdateRequiredObservable.notifyObservers(block);
|
|
71412
|
-
} })), texture && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(
|
|
71567
|
+
} })), texture && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_floatLineComponent__WEBPACK_IMPORTED_MODULE_10__.FloatLineComponent, { lockObject: this.props.stateManager.lockObject, label: "Offset U", target: texture, propertyName: "uOffset", onChange: () => {
|
|
71413
71568
|
this.props.stateManager.onUpdateRequiredObservable.notifyObservers(block);
|
|
71414
|
-
} })), texture && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(
|
|
71569
|
+
} })), texture && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_floatLineComponent__WEBPACK_IMPORTED_MODULE_10__.FloatLineComponent, { lockObject: this.props.stateManager.lockObject, label: "Offset V", target: texture, propertyName: "vOffset", onChange: () => {
|
|
71415
71570
|
this.props.stateManager.onUpdateRequiredObservable.notifyObservers(block);
|
|
71416
|
-
} })), texture && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(
|
|
71571
|
+
} })), texture && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_floatLineComponent__WEBPACK_IMPORTED_MODULE_10__.FloatLineComponent, { lockObject: this.props.stateManager.lockObject, label: "Scale U", target: texture, propertyName: "uScale", onChange: () => {
|
|
71417
71572
|
this.props.stateManager.onUpdateRequiredObservable.notifyObservers(block);
|
|
71418
|
-
} })), texture && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(
|
|
71573
|
+
} })), texture && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_floatLineComponent__WEBPACK_IMPORTED_MODULE_10__.FloatLineComponent, { lockObject: this.props.stateManager.lockObject, label: "Scale V", target: texture, propertyName: "vScale", onChange: () => {
|
|
71419
71574
|
this.props.stateManager.onUpdateRequiredObservable.notifyObservers(block);
|
|
71420
|
-
} })), texture && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(
|
|
71575
|
+
} })), texture && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_sliderLineComponent__WEBPACK_IMPORTED_MODULE_11__.SliderLineComponent, { lockObject: this.props.stateManager.lockObject, label: "Rotation U", target: texture, propertyName: "uAng", minimum: 0, maximum: Math.PI * 2, useEuler: true, step: 0.1, onChange: () => {
|
|
71421
71576
|
this.props.stateManager.onUpdateRequiredObservable.notifyObservers(block);
|
|
71422
|
-
} })), texture && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(
|
|
71577
|
+
} })), texture && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_sliderLineComponent__WEBPACK_IMPORTED_MODULE_11__.SliderLineComponent, { lockObject: this.props.stateManager.lockObject, label: "Rotation V", target: texture, propertyName: "vAng", minimum: 0, maximum: Math.PI * 2, useEuler: true, step: 0.1, onChange: () => {
|
|
71423
71578
|
this.props.stateManager.onUpdateRequiredObservable.notifyObservers(block);
|
|
71424
|
-
} })), texture && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(
|
|
71579
|
+
} })), texture && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_sliderLineComponent__WEBPACK_IMPORTED_MODULE_11__.SliderLineComponent, { lockObject: this.props.stateManager.lockObject, label: "Rotation W", target: texture, propertyName: "wAng", minimum: 0, maximum: Math.PI * 2, useEuler: true, step: 0.1, onChange: () => {
|
|
71425
71580
|
this.props.stateManager.onUpdateRequiredObservable.notifyObservers(block);
|
|
71426
71581
|
} }))] })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(_sharedComponents_lineContainerComponent__WEBPACK_IMPORTED_MODULE_4__.LineContainerComponent, Object.assign({ title: "SOURCE" }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_sharedComponents_checkBoxLineComponent__WEBPACK_IMPORTED_MODULE_5__.CheckBoxLineComponent, { label: "Embed static texture", isSelected: () => this.state.isEmbedded, onSelect: (value) => {
|
|
71427
71582
|
this.setState({ isEmbedded: value });
|
|
71428
71583
|
this.imageSourceBlock.texture = null;
|
|
71429
71584
|
this.updateAfterTextureLoad();
|
|
71430
|
-
} }), this.state.isEmbedded && (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_sharedComponents_fileButtonLineComponent__WEBPACK_IMPORTED_MODULE_2__.FileButtonLineComponent, { label: "Upload", onClick: (file) => this.replaceTexture(file), accept: ".jpg, .png, .tga, .dds, .env" }), !this.state.isEmbedded && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(
|
|
71585
|
+
} }), this.state.isEmbedded && (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_sharedComponents_fileButtonLineComponent__WEBPACK_IMPORTED_MODULE_2__.FileButtonLineComponent, { label: "Upload", onClick: (file) => this.replaceTexture(file), accept: ".jpg, .png, .tga, .dds, .env" }), !this.state.isEmbedded && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_textInputLineComponent__WEBPACK_IMPORTED_MODULE_7__.TextInputLineComponent, { lockObject: this.props.stateManager.lockObject, label: "Link", value: url, onChange: (newUrl) => this.replaceTextureWithUrl(newUrl) })), !this.state.isEmbedded && url && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_buttonLineComponent__WEBPACK_IMPORTED_MODULE_8__.ButtonLineComponent, { label: "Refresh", onClick: () => this.replaceTextureWithUrl(url + "?nocache=" + this._generateRandomForCache()) })), texture && (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_buttonLineComponent__WEBPACK_IMPORTED_MODULE_8__.ButtonLineComponent, { label: "Remove", onClick: () => this.removeTexture() })] })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_genericNodePropertyComponent__WEBPACK_IMPORTED_MODULE_6__.GenericPropertyTabComponent, { stateManager: this.props.stateManager, nodeData: this.props.nodeData })] }));
|
|
71431
71586
|
}
|
|
71432
71587
|
}
|
|
71433
71588
|
|
|
@@ -71447,22 +71602,22 @@ __webpack_require__.r(__webpack_exports__);
|
|
|
71447
71602
|
/* harmony export */ });
|
|
71448
71603
|
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react/jsx-runtime */ "../../../../node_modules/react/jsx-runtime.js");
|
|
71449
71604
|
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! react */ "../../../../node_modules/react/index.js");
|
|
71450
|
-
/* harmony import */ var
|
|
71451
|
-
/* harmony import */ var
|
|
71452
|
-
/* harmony import */ var
|
|
71453
|
-
/* harmony import */ var
|
|
71454
|
-
/* harmony import */ var
|
|
71455
|
-
/* harmony import */ var
|
|
71456
|
-
/* harmony import */ var
|
|
71457
|
-
/* harmony import */ var
|
|
71458
|
-
/* harmony import */ var
|
|
71459
|
-
/* harmony import */ var
|
|
71460
|
-
/* harmony import */ var
|
|
71461
|
-
/* harmony import */ var
|
|
71462
|
-
/* harmony import */ var
|
|
71463
|
-
/* harmony import */ var
|
|
71464
|
-
/* harmony import */ var
|
|
71465
|
-
/* harmony import */ var
|
|
71605
|
+
/* harmony import */ var _components_propertyTab_properties_floatPropertyTabComponent__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../../components/propertyTab/properties/floatPropertyTabComponent */ "../../../tools/nodeEditor/dist/components/propertyTab/properties/floatPropertyTabComponent.js");
|
|
71606
|
+
/* harmony import */ var _components_propertyTab_properties_vector2PropertyTabComponent__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../../components/propertyTab/properties/vector2PropertyTabComponent */ "../../../tools/nodeEditor/dist/components/propertyTab/properties/vector2PropertyTabComponent.js");
|
|
71607
|
+
/* harmony import */ var _components_propertyTab_properties_color3PropertyTabComponent__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../../components/propertyTab/properties/color3PropertyTabComponent */ "../../../tools/nodeEditor/dist/components/propertyTab/properties/color3PropertyTabComponent.js");
|
|
71608
|
+
/* harmony import */ var _components_propertyTab_properties_vector3PropertyTabComponent__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../../components/propertyTab/properties/vector3PropertyTabComponent */ "../../../tools/nodeEditor/dist/components/propertyTab/properties/vector3PropertyTabComponent.js");
|
|
71609
|
+
/* harmony import */ var _components_propertyTab_properties_vector4PropertyTabComponent__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ../../components/propertyTab/properties/vector4PropertyTabComponent */ "../../../tools/nodeEditor/dist/components/propertyTab/properties/vector4PropertyTabComponent.js");
|
|
71610
|
+
/* harmony import */ var _components_propertyTab_properties_matrixPropertyTabComponent__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ../../components/propertyTab/properties/matrixPropertyTabComponent */ "../../../tools/nodeEditor/dist/components/propertyTab/properties/matrixPropertyTabComponent.js");
|
|
71611
|
+
/* harmony import */ var _sharedComponents_lineContainerComponent__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ../../sharedComponents/lineContainerComponent */ "../../../tools/nodeEditor/dist/sharedComponents/lineContainerComponent.js");
|
|
71612
|
+
/* harmony import */ var core_Materials_Node_Enums_nodeMaterialBlockConnectionPointTypes__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! core/Materials/Node/Blocks/Input/animatedInputBlockTypes */ "core/Misc/dataStorage");
|
|
71613
|
+
/* harmony import */ var core_Materials_Node_Enums_nodeMaterialBlockConnectionPointTypes__WEBPACK_IMPORTED_MODULE_9___default = /*#__PURE__*/__webpack_require__.n(core_Materials_Node_Enums_nodeMaterialBlockConnectionPointTypes__WEBPACK_IMPORTED_MODULE_9__);
|
|
71614
|
+
/* harmony import */ var _genericNodePropertyComponent__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! ./genericNodePropertyComponent */ "../../../tools/nodeEditor/dist/graphSystem/properties/genericNodePropertyComponent.js");
|
|
71615
|
+
/* harmony import */ var _sharedComponents_checkBoxLineComponent__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! ../../sharedComponents/checkBoxLineComponent */ "../../../tools/nodeEditor/dist/sharedComponents/checkBoxLineComponent.js");
|
|
71616
|
+
/* harmony import */ var _components_propertyTab_properties_color4PropertyTabComponent__WEBPACK_IMPORTED_MODULE_12__ = __webpack_require__(/*! ../../components/propertyTab/properties/color4PropertyTabComponent */ "../../../tools/nodeEditor/dist/components/propertyTab/properties/color4PropertyTabComponent.js");
|
|
71617
|
+
/* harmony import */ var shared_ui_components_lines_textInputLineComponent__WEBPACK_IMPORTED_MODULE_13__ = __webpack_require__(/*! shared-ui-components/lines/textInputLineComponent */ "../../../dev/sharedUiComponents/dist/lines/textInputLineComponent.js");
|
|
71618
|
+
/* harmony import */ var shared_ui_components_lines_optionsLineComponent__WEBPACK_IMPORTED_MODULE_14__ = __webpack_require__(/*! shared-ui-components/lines/optionsLineComponent */ "../../../dev/sharedUiComponents/dist/lines/optionsLineComponent.js");
|
|
71619
|
+
/* harmony import */ var shared_ui_components_lines_floatLineComponent__WEBPACK_IMPORTED_MODULE_15__ = __webpack_require__(/*! shared-ui-components/lines/floatLineComponent */ "../../../dev/sharedUiComponents/dist/lines/floatLineComponent.js");
|
|
71620
|
+
/* harmony import */ var shared_ui_components_lines_sliderLineComponent__WEBPACK_IMPORTED_MODULE_16__ = __webpack_require__(/*! shared-ui-components/lines/sliderLineComponent */ "../../../dev/sharedUiComponents/dist/lines/sliderLineComponent.js");
|
|
71466
71621
|
|
|
71467
71622
|
|
|
71468
71623
|
|
|
@@ -71503,9 +71658,9 @@ class InputPropertyTabComponent extends react__WEBPACK_IMPORTED_MODULE_1__.Compo
|
|
|
71503
71658
|
renderValue(globalState) {
|
|
71504
71659
|
const inputBlock = this.props.nodeData.data;
|
|
71505
71660
|
switch (inputBlock.type) {
|
|
71506
|
-
case
|
|
71661
|
+
case core_Materials_Node_Enums_nodeMaterialBlockConnectionPointTypes__WEBPACK_IMPORTED_MODULE_9__.NodeMaterialBlockConnectionPointTypes.Float: {
|
|
71507
71662
|
const cantDisplaySlider = isNaN(inputBlock.min) || isNaN(inputBlock.max) || inputBlock.min === inputBlock.max;
|
|
71508
|
-
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.Fragment, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(
|
|
71663
|
+
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.Fragment, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_sharedComponents_checkBoxLineComponent__WEBPACK_IMPORTED_MODULE_11__.CheckBoxLineComponent, { label: "Is boolean", target: inputBlock, propertyName: "isBoolean" }), inputBlock.isBoolean && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_sharedComponents_checkBoxLineComponent__WEBPACK_IMPORTED_MODULE_11__.CheckBoxLineComponent, { label: "Value", isSelected: () => {
|
|
71509
71664
|
return inputBlock.value === 1;
|
|
71510
71665
|
}, onSelect: (value) => {
|
|
71511
71666
|
inputBlock.value = value ? 1 : 0;
|
|
@@ -71513,7 +71668,7 @@ class InputPropertyTabComponent extends react__WEBPACK_IMPORTED_MODULE_1__.Compo
|
|
|
71513
71668
|
this.props.stateManager.onRebuildRequiredObservable.notifyObservers(true);
|
|
71514
71669
|
}
|
|
71515
71670
|
this.props.stateManager.onUpdateRequiredObservable.notifyObservers(inputBlock);
|
|
71516
|
-
} })), !inputBlock.isBoolean && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(
|
|
71671
|
+
} })), !inputBlock.isBoolean && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_floatLineComponent__WEBPACK_IMPORTED_MODULE_15__.FloatLineComponent, { lockObject: this.props.stateManager.lockObject, label: "Min", target: inputBlock, propertyName: "min", onChange: () => {
|
|
71517
71672
|
if (inputBlock.value < inputBlock.min) {
|
|
71518
71673
|
inputBlock.value = inputBlock.min;
|
|
71519
71674
|
if (inputBlock.isConstant) {
|
|
@@ -71521,7 +71676,7 @@ class InputPropertyTabComponent extends react__WEBPACK_IMPORTED_MODULE_1__.Compo
|
|
|
71521
71676
|
}
|
|
71522
71677
|
}
|
|
71523
71678
|
this.forceUpdate();
|
|
71524
|
-
} })), !inputBlock.isBoolean && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(
|
|
71679
|
+
} })), !inputBlock.isBoolean && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_floatLineComponent__WEBPACK_IMPORTED_MODULE_15__.FloatLineComponent, { lockObject: this.props.stateManager.lockObject, label: "Max", target: inputBlock, propertyName: "max", onChange: () => {
|
|
71525
71680
|
if (inputBlock.value > inputBlock.max) {
|
|
71526
71681
|
inputBlock.value = inputBlock.max;
|
|
71527
71682
|
if (inputBlock.isConstant) {
|
|
@@ -71529,33 +71684,33 @@ class InputPropertyTabComponent extends react__WEBPACK_IMPORTED_MODULE_1__.Compo
|
|
|
71529
71684
|
}
|
|
71530
71685
|
}
|
|
71531
71686
|
this.forceUpdate();
|
|
71532
|
-
} })), !inputBlock.isBoolean && cantDisplaySlider && (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(
|
|
71687
|
+
} })), !inputBlock.isBoolean && cantDisplaySlider && (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_components_propertyTab_properties_floatPropertyTabComponent__WEBPACK_IMPORTED_MODULE_2__.FloatPropertyTabComponent, { globalState: globalState, inputBlock: inputBlock }), !inputBlock.isBoolean && !cantDisplaySlider && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_sliderLineComponent__WEBPACK_IMPORTED_MODULE_16__.SliderLineComponent, { lockObject: this.props.stateManager.lockObject, label: "Value", target: inputBlock, propertyName: "value", step: Math.abs(inputBlock.max - inputBlock.min) / 100.0, minimum: Math.min(inputBlock.min, inputBlock.max), maximum: inputBlock.max, onChange: () => {
|
|
71533
71688
|
if (inputBlock.isConstant) {
|
|
71534
71689
|
this.props.stateManager.onRebuildRequiredObservable.notifyObservers(true);
|
|
71535
71690
|
}
|
|
71536
71691
|
this.props.stateManager.onUpdateRequiredObservable.notifyObservers(inputBlock);
|
|
71537
71692
|
} }))] }));
|
|
71538
71693
|
}
|
|
71539
|
-
case
|
|
71540
|
-
return (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(
|
|
71541
|
-
case
|
|
71542
|
-
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.Fragment, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(
|
|
71694
|
+
case core_Materials_Node_Enums_nodeMaterialBlockConnectionPointTypes__WEBPACK_IMPORTED_MODULE_9__.NodeMaterialBlockConnectionPointTypes.Vector2:
|
|
71695
|
+
return (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_components_propertyTab_properties_vector2PropertyTabComponent__WEBPACK_IMPORTED_MODULE_3__.Vector2PropertyTabComponent, { lockObject: globalState.lockObject, globalState: globalState, inputBlock: inputBlock });
|
|
71696
|
+
case core_Materials_Node_Enums_nodeMaterialBlockConnectionPointTypes__WEBPACK_IMPORTED_MODULE_9__.NodeMaterialBlockConnectionPointTypes.Color3:
|
|
71697
|
+
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.Fragment, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_components_propertyTab_properties_color3PropertyTabComponent__WEBPACK_IMPORTED_MODULE_4__.Color3PropertyTabComponent, { lockObject: globalState.lockObject, globalState: globalState, inputBlock: inputBlock }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_sharedComponents_checkBoxLineComponent__WEBPACK_IMPORTED_MODULE_11__.CheckBoxLineComponent, { label: "Convert to gamma space", propertyName: "convertToGammaSpace", target: inputBlock, onValueChanged: () => {
|
|
71543
71698
|
this.props.stateManager.onUpdateRequiredObservable.notifyObservers(inputBlock);
|
|
71544
|
-
} }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(
|
|
71699
|
+
} }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_sharedComponents_checkBoxLineComponent__WEBPACK_IMPORTED_MODULE_11__.CheckBoxLineComponent, { label: "Convert to linear space", propertyName: "convertToLinearSpace", target: inputBlock, onValueChanged: () => {
|
|
71545
71700
|
this.props.stateManager.onUpdateRequiredObservable.notifyObservers(inputBlock);
|
|
71546
71701
|
} })] }));
|
|
71547
|
-
case
|
|
71548
|
-
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.Fragment, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(
|
|
71702
|
+
case core_Materials_Node_Enums_nodeMaterialBlockConnectionPointTypes__WEBPACK_IMPORTED_MODULE_9__.NodeMaterialBlockConnectionPointTypes.Color4:
|
|
71703
|
+
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.Fragment, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_components_propertyTab_properties_color4PropertyTabComponent__WEBPACK_IMPORTED_MODULE_12__.Color4PropertyTabComponent, { lockObject: globalState.lockObject, globalState: globalState, inputBlock: inputBlock }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_sharedComponents_checkBoxLineComponent__WEBPACK_IMPORTED_MODULE_11__.CheckBoxLineComponent, { label: "Convert to gamma space", propertyName: "convertToGammaSpace", target: inputBlock, onValueChanged: () => {
|
|
71549
71704
|
this.props.stateManager.onUpdateRequiredObservable.notifyObservers(inputBlock);
|
|
71550
|
-
} }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(
|
|
71705
|
+
} }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_sharedComponents_checkBoxLineComponent__WEBPACK_IMPORTED_MODULE_11__.CheckBoxLineComponent, { label: "Convert to linear space", propertyName: "convertToLinearSpace", target: inputBlock, onValueChanged: () => {
|
|
71551
71706
|
this.props.stateManager.onUpdateRequiredObservable.notifyObservers(inputBlock);
|
|
71552
71707
|
} })] }));
|
|
71553
|
-
case
|
|
71554
|
-
return (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(
|
|
71555
|
-
case
|
|
71556
|
-
return (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(
|
|
71557
|
-
case
|
|
71558
|
-
return (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(
|
|
71708
|
+
case core_Materials_Node_Enums_nodeMaterialBlockConnectionPointTypes__WEBPACK_IMPORTED_MODULE_9__.NodeMaterialBlockConnectionPointTypes.Vector3:
|
|
71709
|
+
return (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_components_propertyTab_properties_vector3PropertyTabComponent__WEBPACK_IMPORTED_MODULE_5__.Vector3PropertyTabComponent, { lockObject: globalState.lockObject, globalState: globalState, inputBlock: inputBlock });
|
|
71710
|
+
case core_Materials_Node_Enums_nodeMaterialBlockConnectionPointTypes__WEBPACK_IMPORTED_MODULE_9__.NodeMaterialBlockConnectionPointTypes.Vector4:
|
|
71711
|
+
return (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_components_propertyTab_properties_vector4PropertyTabComponent__WEBPACK_IMPORTED_MODULE_6__.Vector4PropertyTabComponent, { lockObject: globalState.lockObject, globalState: globalState, inputBlock: inputBlock });
|
|
71712
|
+
case core_Materials_Node_Enums_nodeMaterialBlockConnectionPointTypes__WEBPACK_IMPORTED_MODULE_9__.NodeMaterialBlockConnectionPointTypes.Matrix:
|
|
71713
|
+
return (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_components_propertyTab_properties_matrixPropertyTabComponent__WEBPACK_IMPORTED_MODULE_7__.MatrixPropertyTabComponent, { lockObject: globalState.lockObject, globalState: globalState, inputBlock: inputBlock });
|
|
71559
71714
|
}
|
|
71560
71715
|
return null;
|
|
71561
71716
|
}
|
|
@@ -71569,36 +71724,36 @@ class InputPropertyTabComponent extends react__WEBPACK_IMPORTED_MODULE_1__.Compo
|
|
|
71569
71724
|
let attributeOptions = [];
|
|
71570
71725
|
let animationOptions = [];
|
|
71571
71726
|
switch (inputBlock.type) {
|
|
71572
|
-
case
|
|
71727
|
+
case core_Materials_Node_Enums_nodeMaterialBlockConnectionPointTypes__WEBPACK_IMPORTED_MODULE_9__.NodeMaterialBlockConnectionPointTypes.Float:
|
|
71573
71728
|
animationOptions = [
|
|
71574
|
-
{ label: "None", value:
|
|
71575
|
-
{ label: "Time", value:
|
|
71729
|
+
{ label: "None", value: core_Materials_Node_Enums_nodeMaterialBlockConnectionPointTypes__WEBPACK_IMPORTED_MODULE_9__.AnimatedInputBlockTypes.None },
|
|
71730
|
+
{ label: "Time", value: core_Materials_Node_Enums_nodeMaterialBlockConnectionPointTypes__WEBPACK_IMPORTED_MODULE_9__.AnimatedInputBlockTypes.Time },
|
|
71576
71731
|
];
|
|
71577
71732
|
systemValuesOptions = [
|
|
71578
|
-
{ label: "Delta time", value:
|
|
71579
|
-
{ label: "Material alpha", value:
|
|
71733
|
+
{ label: "Delta time", value: core_Materials_Node_Enums_nodeMaterialBlockConnectionPointTypes__WEBPACK_IMPORTED_MODULE_9__.NodeMaterialSystemValues.DeltaTime },
|
|
71734
|
+
{ label: "Material alpha", value: core_Materials_Node_Enums_nodeMaterialBlockConnectionPointTypes__WEBPACK_IMPORTED_MODULE_9__.NodeMaterialSystemValues.MaterialAlpha },
|
|
71580
71735
|
];
|
|
71581
71736
|
break;
|
|
71582
|
-
case
|
|
71737
|
+
case core_Materials_Node_Enums_nodeMaterialBlockConnectionPointTypes__WEBPACK_IMPORTED_MODULE_9__.NodeMaterialBlockConnectionPointTypes.Matrix:
|
|
71583
71738
|
systemValuesOptions = [
|
|
71584
|
-
{ label: "World", value:
|
|
71585
|
-
{ label: "World x View", value:
|
|
71586
|
-
{ label: "World x View x Projection", value:
|
|
71587
|
-
{ label: "View", value:
|
|
71588
|
-
{ label: "View x Projection", value:
|
|
71589
|
-
{ label: "Projection", value:
|
|
71739
|
+
{ label: "World", value: core_Materials_Node_Enums_nodeMaterialBlockConnectionPointTypes__WEBPACK_IMPORTED_MODULE_9__.NodeMaterialSystemValues.World },
|
|
71740
|
+
{ label: "World x View", value: core_Materials_Node_Enums_nodeMaterialBlockConnectionPointTypes__WEBPACK_IMPORTED_MODULE_9__.NodeMaterialSystemValues.WorldView },
|
|
71741
|
+
{ label: "World x View x Projection", value: core_Materials_Node_Enums_nodeMaterialBlockConnectionPointTypes__WEBPACK_IMPORTED_MODULE_9__.NodeMaterialSystemValues.WorldViewProjection },
|
|
71742
|
+
{ label: "View", value: core_Materials_Node_Enums_nodeMaterialBlockConnectionPointTypes__WEBPACK_IMPORTED_MODULE_9__.NodeMaterialSystemValues.View },
|
|
71743
|
+
{ label: "View x Projection", value: core_Materials_Node_Enums_nodeMaterialBlockConnectionPointTypes__WEBPACK_IMPORTED_MODULE_9__.NodeMaterialSystemValues.ViewProjection },
|
|
71744
|
+
{ label: "Projection", value: core_Materials_Node_Enums_nodeMaterialBlockConnectionPointTypes__WEBPACK_IMPORTED_MODULE_9__.NodeMaterialSystemValues.Projection },
|
|
71590
71745
|
];
|
|
71591
71746
|
break;
|
|
71592
|
-
case
|
|
71593
|
-
systemValuesOptions = [{ label: "Fog color", value:
|
|
71747
|
+
case core_Materials_Node_Enums_nodeMaterialBlockConnectionPointTypes__WEBPACK_IMPORTED_MODULE_9__.NodeMaterialBlockConnectionPointTypes.Color3:
|
|
71748
|
+
systemValuesOptions = [{ label: "Fog color", value: core_Materials_Node_Enums_nodeMaterialBlockConnectionPointTypes__WEBPACK_IMPORTED_MODULE_9__.NodeMaterialSystemValues.FogColor }];
|
|
71594
71749
|
break;
|
|
71595
|
-
case
|
|
71750
|
+
case core_Materials_Node_Enums_nodeMaterialBlockConnectionPointTypes__WEBPACK_IMPORTED_MODULE_9__.NodeMaterialBlockConnectionPointTypes.Color4:
|
|
71596
71751
|
attributeOptions = [
|
|
71597
71752
|
{ label: "color", value: "color" },
|
|
71598
71753
|
{ label: "Instance Color", value: "instanceColor" },
|
|
71599
71754
|
];
|
|
71600
71755
|
break;
|
|
71601
|
-
case
|
|
71756
|
+
case core_Materials_Node_Enums_nodeMaterialBlockConnectionPointTypes__WEBPACK_IMPORTED_MODULE_9__.NodeMaterialBlockConnectionPointTypes.Vector2:
|
|
71602
71757
|
attributeOptions = [
|
|
71603
71758
|
{ label: "uv", value: "uv" },
|
|
71604
71759
|
{ label: "uv2", value: "uv2" },
|
|
@@ -71608,20 +71763,20 @@ class InputPropertyTabComponent extends react__WEBPACK_IMPORTED_MODULE_1__.Compo
|
|
|
71608
71763
|
{ label: "uv6", value: "uv6" },
|
|
71609
71764
|
];
|
|
71610
71765
|
break;
|
|
71611
|
-
case
|
|
71612
|
-
systemValuesOptions = [{ label: "Camera position", value:
|
|
71766
|
+
case core_Materials_Node_Enums_nodeMaterialBlockConnectionPointTypes__WEBPACK_IMPORTED_MODULE_9__.NodeMaterialBlockConnectionPointTypes.Vector3:
|
|
71767
|
+
systemValuesOptions = [{ label: "Camera position", value: core_Materials_Node_Enums_nodeMaterialBlockConnectionPointTypes__WEBPACK_IMPORTED_MODULE_9__.NodeMaterialSystemValues.CameraPosition }];
|
|
71613
71768
|
attributeOptions = [
|
|
71614
71769
|
{ label: "position", value: "position" },
|
|
71615
71770
|
{ label: "normal", value: "normal" },
|
|
71616
71771
|
];
|
|
71617
71772
|
break;
|
|
71618
|
-
case
|
|
71773
|
+
case core_Materials_Node_Enums_nodeMaterialBlockConnectionPointTypes__WEBPACK_IMPORTED_MODULE_9__.NodeMaterialBlockConnectionPointTypes.Vector4:
|
|
71619
71774
|
attributeOptions = [
|
|
71620
71775
|
{ label: "matricesIndices", value: "matricesIndices" },
|
|
71621
71776
|
{ label: "matricesWeights", value: "matricesWeights" },
|
|
71622
71777
|
{ label: "tangent", value: "tangent" },
|
|
71623
71778
|
];
|
|
71624
|
-
systemValuesOptions = [{ label: "Camera parameters", value:
|
|
71779
|
+
systemValuesOptions = [{ label: "Camera parameters", value: core_Materials_Node_Enums_nodeMaterialBlockConnectionPointTypes__WEBPACK_IMPORTED_MODULE_9__.NodeMaterialSystemValues.CameraParameters }];
|
|
71625
71780
|
break;
|
|
71626
71781
|
}
|
|
71627
71782
|
const modeOptions = [{ label: "User-defined", value: 0 }];
|
|
@@ -71636,7 +71791,7 @@ class InputPropertyTabComponent extends react__WEBPACK_IMPORTED_MODULE_1__.Compo
|
|
|
71636
71791
|
{ label: "Visible in the inspector", value: 1 },
|
|
71637
71792
|
{ label: "Constant", value: 2 },
|
|
71638
71793
|
];
|
|
71639
|
-
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(
|
|
71794
|
+
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_genericNodePropertyComponent__WEBPACK_IMPORTED_MODULE_10__.GeneralPropertyTabComponent, { stateManager: this.props.stateManager, nodeData: this.props.nodeData }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(_sharedComponents_lineContainerComponent__WEBPACK_IMPORTED_MODULE_8__.LineContainerComponent, Object.assign({ title: "PROPERTIES" }, { children: [inputBlock.isUniform && !inputBlock.isSystemValue && inputBlock.animationType === core_Materials_Node_Enums_nodeMaterialBlockConnectionPointTypes__WEBPACK_IMPORTED_MODULE_9__.AnimatedInputBlockTypes.None && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_optionsLineComponent__WEBPACK_IMPORTED_MODULE_14__.OptionsLineComponent, { label: "Type", options: typeOptions, target: inputBlock, noDirectUpdate: true, extractValue: (block) => {
|
|
71640
71795
|
if (block.visibleInInspector) {
|
|
71641
71796
|
return 1;
|
|
71642
71797
|
}
|
|
@@ -71662,11 +71817,11 @@ class InputPropertyTabComponent extends react__WEBPACK_IMPORTED_MODULE_1__.Compo
|
|
|
71662
71817
|
this.forceUpdate();
|
|
71663
71818
|
this.props.stateManager.onUpdateRequiredObservable.notifyObservers(inputBlock);
|
|
71664
71819
|
this.props.stateManager.onRebuildRequiredObservable.notifyObservers(true);
|
|
71665
|
-
}, propertyName: "" })), inputBlock.visibleInInspector && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(
|
|
71820
|
+
}, propertyName: "" })), inputBlock.visibleInInspector && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_textInputLineComponent__WEBPACK_IMPORTED_MODULE_13__.TextInputLineComponent, { label: "Group", propertyName: "groupInInspector", target: inputBlock, lockObject: this.props.stateManager.lockObject, onChange: () => {
|
|
71666
71821
|
this.forceUpdate();
|
|
71667
71822
|
this.props.stateManager.onUpdateRequiredObservable.notifyObservers(inputBlock);
|
|
71668
71823
|
this.props.stateManager.onRebuildRequiredObservable.notifyObservers(true);
|
|
71669
|
-
} })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(
|
|
71824
|
+
} })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_optionsLineComponent__WEBPACK_IMPORTED_MODULE_14__.OptionsLineComponent, { label: "Mode", options: modeOptions, target: inputBlock, noDirectUpdate: true, extractValue: (block) => {
|
|
71670
71825
|
if (block.isAttribute) {
|
|
71671
71826
|
return 1;
|
|
71672
71827
|
}
|
|
@@ -71691,24 +71846,24 @@ class InputPropertyTabComponent extends react__WEBPACK_IMPORTED_MODULE_1__.Compo
|
|
|
71691
71846
|
this.forceUpdate();
|
|
71692
71847
|
this.props.stateManager.onUpdateRequiredObservable.notifyObservers(inputBlock);
|
|
71693
71848
|
this.props.stateManager.onRebuildRequiredObservable.notifyObservers(true);
|
|
71694
|
-
}, propertyName: "" }), inputBlock.isAttribute && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(
|
|
71849
|
+
}, propertyName: "" }), inputBlock.isAttribute && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_optionsLineComponent__WEBPACK_IMPORTED_MODULE_14__.OptionsLineComponent, { label: "Attribute", valuesAreStrings: true, options: attributeOptions, target: inputBlock, propertyName: "name", onSelect: (value) => {
|
|
71695
71850
|
inputBlock.setAsAttribute(value);
|
|
71696
71851
|
this.forceUpdate();
|
|
71697
71852
|
this.props.stateManager.onUpdateRequiredObservable.notifyObservers(inputBlock);
|
|
71698
71853
|
this.props.stateManager.onRebuildRequiredObservable.notifyObservers(true);
|
|
71699
|
-
} })), inputBlock.isUniform && animationOptions.length > 0 && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(
|
|
71854
|
+
} })), inputBlock.isUniform && animationOptions.length > 0 && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_optionsLineComponent__WEBPACK_IMPORTED_MODULE_14__.OptionsLineComponent, { label: "Animation type", options: animationOptions, target: inputBlock, propertyName: "animationType", onSelect: () => {
|
|
71700
71855
|
this.forceUpdate();
|
|
71701
71856
|
this.props.stateManager.onUpdateRequiredObservable.notifyObservers(inputBlock);
|
|
71702
71857
|
this.props.stateManager.onRebuildRequiredObservable.notifyObservers(true);
|
|
71703
71858
|
} })), inputBlock.isUniform &&
|
|
71704
71859
|
!inputBlock.isSystemValue &&
|
|
71705
|
-
inputBlock.animationType ===
|
|
71706
|
-
this.renderValue(this.props.stateManager.data), inputBlock.isUniform && inputBlock.isSystemValue && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(
|
|
71860
|
+
inputBlock.animationType === core_Materials_Node_Enums_nodeMaterialBlockConnectionPointTypes__WEBPACK_IMPORTED_MODULE_9__.AnimatedInputBlockTypes.None &&
|
|
71861
|
+
this.renderValue(this.props.stateManager.data), inputBlock.isUniform && inputBlock.isSystemValue && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_optionsLineComponent__WEBPACK_IMPORTED_MODULE_14__.OptionsLineComponent, { label: "System value", options: systemValuesOptions, target: inputBlock, propertyName: "systemValue", onSelect: (value) => {
|
|
71707
71862
|
inputBlock.setAsSystemValue(value);
|
|
71708
71863
|
this.forceUpdate();
|
|
71709
71864
|
this.props.stateManager.onUpdateRequiredObservable.notifyObservers(inputBlock);
|
|
71710
71865
|
this.props.stateManager.onRebuildRequiredObservable.notifyObservers(true);
|
|
71711
|
-
} })), inputBlock.isUniform && !inputBlock.isSystemValue && inputBlock.animationType ===
|
|
71866
|
+
} })), inputBlock.isUniform && !inputBlock.isSystemValue && inputBlock.animationType === core_Materials_Node_Enums_nodeMaterialBlockConnectionPointTypes__WEBPACK_IMPORTED_MODULE_9__.AnimatedInputBlockTypes.None && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_sharedComponents_checkBoxLineComponent__WEBPACK_IMPORTED_MODULE_11__.CheckBoxLineComponent, { label: "Visible on frame", target: inputBlock, propertyName: "visibleOnFrame" }))] }))] }));
|
|
71712
71867
|
}
|
|
71713
71868
|
}
|
|
71714
71869
|
|
|
@@ -71814,8 +71969,8 @@ __webpack_require__.r(__webpack_exports__);
|
|
|
71814
71969
|
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! react */ "../../../../node_modules/react/index.js");
|
|
71815
71970
|
/* harmony import */ var _sharedComponents_lineContainerComponent__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../../sharedComponents/lineContainerComponent */ "../../../tools/nodeEditor/dist/sharedComponents/lineContainerComponent.js");
|
|
71816
71971
|
/* harmony import */ var _sharedComponents_checkBoxLineComponent__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../../sharedComponents/checkBoxLineComponent */ "../../../tools/nodeEditor/dist/sharedComponents/checkBoxLineComponent.js");
|
|
71817
|
-
/* harmony import */ var
|
|
71818
|
-
/* harmony import */ var
|
|
71972
|
+
/* harmony import */ var shared_ui_components_lines_textInputLineComponent__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! shared-ui-components/lines/textInputLineComponent */ "../../../dev/sharedUiComponents/dist/lines/textInputLineComponent.js");
|
|
71973
|
+
/* harmony import */ var shared_ui_components_lines_textLineComponent__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! shared-ui-components/lines/textLineComponent */ "../../../dev/sharedUiComponents/dist/lines/textLineComponent.js");
|
|
71819
71974
|
|
|
71820
71975
|
|
|
71821
71976
|
|
|
@@ -71834,7 +71989,7 @@ class NodePortPropertyTabComponent extends react__WEBPACK_IMPORTED_MODULE_1__.Co
|
|
|
71834
71989
|
this.props.stateManager.onExposePortOnFrameObservable.notifyObservers(this.props.nodePort.node);
|
|
71835
71990
|
}
|
|
71836
71991
|
render() {
|
|
71837
|
-
const info = this.props.nodePort.hasLabel() ? ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.Fragment, { children: [this.props.nodePort.hasLabel() && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(
|
|
71992
|
+
const info = this.props.nodePort.hasLabel() ? ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.Fragment, { children: [this.props.nodePort.hasLabel() && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_textInputLineComponent__WEBPACK_IMPORTED_MODULE_4__.TextInputLineComponent, { lockObject: this.props.stateManager.lockObject, label: "Port Label", propertyName: "portName", target: this.props.nodePort })), this.props.nodePort.node.enclosingFrameId !== -1 && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_sharedComponents_checkBoxLineComponent__WEBPACK_IMPORTED_MODULE_3__.CheckBoxLineComponent, { label: "Expose Port on Frame", target: this.props.nodePort, isSelected: () => this.props.nodePort.exposedOnFrame, onSelect: (value) => this.toggleExposeOnFrame(value), propertyName: "exposedOnFrame", disabled: this.props.nodePort.disabled }))] })) : ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_textLineComponent__WEBPACK_IMPORTED_MODULE_5__.TextLineComponent, { label: "This node is a constant input node and cannot be exposed to the frame.", value: " " }));
|
|
71838
71993
|
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", Object.assign({ id: "propertyTab" }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", Object.assign({ id: "header" }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("img", { id: "logo", src: "https://www.babylonjs.com/Assets/logo-babylonjs-social-twitter.png" }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", Object.assign({ id: "title" }, { children: "NODE MATERIAL EDITOR" }))] })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", { children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_sharedComponents_lineContainerComponent__WEBPACK_IMPORTED_MODULE_2__.LineContainerComponent, Object.assign({ title: "GENERAL" }, { children: info })) })] })));
|
|
71839
71994
|
}
|
|
71840
71995
|
}
|
|
@@ -71860,12 +72015,12 @@ __webpack_require__.r(__webpack_exports__);
|
|
|
71860
72015
|
/* harmony import */ var core_Misc_tools__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(core_Misc_tools__WEBPACK_IMPORTED_MODULE_3__);
|
|
71861
72016
|
/* harmony import */ var _sharedComponents_lineContainerComponent__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../../sharedComponents/lineContainerComponent */ "../../../tools/nodeEditor/dist/sharedComponents/lineContainerComponent.js");
|
|
71862
72017
|
/* harmony import */ var _sharedComponents_checkBoxLineComponent__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../../sharedComponents/checkBoxLineComponent */ "../../../tools/nodeEditor/dist/sharedComponents/checkBoxLineComponent.js");
|
|
71863
|
-
/* harmony import */ var
|
|
71864
|
-
/* harmony import */ var
|
|
71865
|
-
/* harmony import */ var
|
|
71866
|
-
/* harmony import */ var
|
|
71867
|
-
/* harmony import */ var
|
|
71868
|
-
/* harmony import */ var
|
|
72018
|
+
/* harmony import */ var _genericNodePropertyComponent__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ./genericNodePropertyComponent */ "../../../tools/nodeEditor/dist/graphSystem/properties/genericNodePropertyComponent.js");
|
|
72019
|
+
/* harmony import */ var shared_ui_components_lines_textInputLineComponent__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! shared-ui-components/lines/textInputLineComponent */ "../../../dev/sharedUiComponents/dist/lines/textInputLineComponent.js");
|
|
72020
|
+
/* harmony import */ var shared_ui_components_lines_buttonLineComponent__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! shared-ui-components/lines/buttonLineComponent */ "../../../dev/sharedUiComponents/dist/lines/buttonLineComponent.js");
|
|
72021
|
+
/* harmony import */ var shared_ui_components_lines_optionsLineComponent__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! shared-ui-components/lines/optionsLineComponent */ "../../../dev/sharedUiComponents/dist/lines/optionsLineComponent.js");
|
|
72022
|
+
/* harmony import */ var shared_ui_components_lines_floatLineComponent__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! shared-ui-components/lines/floatLineComponent */ "../../../dev/sharedUiComponents/dist/lines/floatLineComponent.js");
|
|
72023
|
+
/* harmony import */ var shared_ui_components_lines_sliderLineComponent__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! shared-ui-components/lines/sliderLineComponent */ "../../../dev/sharedUiComponents/dist/lines/sliderLineComponent.js");
|
|
71869
72024
|
|
|
71870
72025
|
|
|
71871
72026
|
|
|
@@ -72058,7 +72213,7 @@ class TexturePropertyTabComponent extends react__WEBPACK_IMPORTED_MODULE_1__.Com
|
|
|
72058
72213
|
{ label: "Linear/Nearest & linear mip", value: core_Misc_tools__WEBPACK_IMPORTED_MODULE_3__.Texture.LINEAR_NEAREST_MIPLINEAR },
|
|
72059
72214
|
{ label: "Linear/Nearest & nearest mip", value: core_Misc_tools__WEBPACK_IMPORTED_MODULE_3__.Texture.LINEAR_NEAREST_MIPNEAREST }, // 9
|
|
72060
72215
|
];
|
|
72061
|
-
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(
|
|
72216
|
+
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_genericNodePropertyComponent__WEBPACK_IMPORTED_MODULE_6__.GeneralPropertyTabComponent, { stateManager: this.props.stateManager, nodeData: this.props.nodeData }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(_sharedComponents_lineContainerComponent__WEBPACK_IMPORTED_MODULE_4__.LineContainerComponent, Object.assign({ title: "PROPERTIES" }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_sharedComponents_checkBoxLineComponent__WEBPACK_IMPORTED_MODULE_5__.CheckBoxLineComponent, { label: "Auto select UV", propertyName: "autoSelectUV", target: block, onValueChanged: () => {
|
|
72062
72217
|
this.props.stateManager.onUpdateRequiredObservable.notifyObservers(block);
|
|
72063
72218
|
} }), !isInReflectionMode && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_sharedComponents_checkBoxLineComponent__WEBPACK_IMPORTED_MODULE_5__.CheckBoxLineComponent, { label: "Convert to gamma space", propertyName: "convertToGammaSpace", target: block, onValueChanged: () => {
|
|
72064
72219
|
this.props.stateManager.onUpdateRequiredObservable.notifyObservers(block);
|
|
@@ -72069,10 +72224,10 @@ class TexturePropertyTabComponent extends react__WEBPACK_IMPORTED_MODULE_1__.Com
|
|
|
72069
72224
|
} })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_sharedComponents_checkBoxLineComponent__WEBPACK_IMPORTED_MODULE_5__.CheckBoxLineComponent, { label: "Disable multiplying by level", propertyName: "disableLevelMultiplication", target: block, onValueChanged: () => {
|
|
72070
72225
|
this.props.stateManager.onUpdateRequiredObservable.notifyObservers(block);
|
|
72071
72226
|
this.props.stateManager.onRebuildRequiredObservable.notifyObservers(true);
|
|
72072
|
-
} }), texture && texture.updateSamplingMode && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(
|
|
72227
|
+
} }), texture && texture.updateSamplingMode && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_optionsLineComponent__WEBPACK_IMPORTED_MODULE_9__.OptionsLineComponent, { label: "Sampling", options: samplingMode, target: texture, noDirectUpdate: true, propertyName: "samplingMode", onSelect: (value) => {
|
|
72073
72228
|
texture.updateSamplingMode(value);
|
|
72074
72229
|
this.props.stateManager.onUpdateRequiredObservable.notifyObservers(block);
|
|
72075
|
-
} })), texture && isInReflectionMode && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(
|
|
72230
|
+
} })), texture && isInReflectionMode && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_optionsLineComponent__WEBPACK_IMPORTED_MODULE_9__.OptionsLineComponent, { label: "Reflection mode", options: reflectionModeOptions, target: texture, propertyName: "coordinatesMode", onSelect: (value) => {
|
|
72076
72231
|
texture.coordinatesMode = value;
|
|
72077
72232
|
this.forceUpdate();
|
|
72078
72233
|
this.props.stateManager.onUpdateRequiredObservable.notifyObservers(block);
|
|
@@ -72082,25 +72237,25 @@ class TexturePropertyTabComponent extends react__WEBPACK_IMPORTED_MODULE_1__.Com
|
|
|
72082
72237
|
} })), texture && !isInReflectionMode && !isFrozenTexture && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_sharedComponents_checkBoxLineComponent__WEBPACK_IMPORTED_MODULE_5__.CheckBoxLineComponent, { label: "Clamp V", isSelected: () => texture.wrapV === core_Misc_tools__WEBPACK_IMPORTED_MODULE_3__.Texture.CLAMP_ADDRESSMODE, onSelect: (value) => {
|
|
72083
72238
|
texture.wrapV = value ? core_Misc_tools__WEBPACK_IMPORTED_MODULE_3__.Texture.CLAMP_ADDRESSMODE : core_Misc_tools__WEBPACK_IMPORTED_MODULE_3__.Texture.WRAP_ADDRESSMODE;
|
|
72084
72239
|
this.props.stateManager.onUpdateRequiredObservable.notifyObservers(block);
|
|
72085
|
-
} })), texture && !isInReflectionMode && !isFrozenTexture && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(
|
|
72240
|
+
} })), texture && !isInReflectionMode && !isFrozenTexture && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_floatLineComponent__WEBPACK_IMPORTED_MODULE_10__.FloatLineComponent, { lockObject: this.props.stateManager.lockObject, label: "Offset U", target: texture, propertyName: "uOffset", onChange: () => {
|
|
72086
72241
|
this.props.stateManager.onUpdateRequiredObservable.notifyObservers(block);
|
|
72087
|
-
} })), texture && !isInReflectionMode && !isFrozenTexture && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(
|
|
72242
|
+
} })), texture && !isInReflectionMode && !isFrozenTexture && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_floatLineComponent__WEBPACK_IMPORTED_MODULE_10__.FloatLineComponent, { lockObject: this.props.stateManager.lockObject, label: "Offset V", target: texture, propertyName: "vOffset", onChange: () => {
|
|
72088
72243
|
this.props.stateManager.onUpdateRequiredObservable.notifyObservers(block);
|
|
72089
|
-
} })), texture && !isInReflectionMode && !isFrozenTexture && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(
|
|
72244
|
+
} })), texture && !isInReflectionMode && !isFrozenTexture && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_floatLineComponent__WEBPACK_IMPORTED_MODULE_10__.FloatLineComponent, { lockObject: this.props.stateManager.lockObject, label: "Scale U", target: texture, propertyName: "uScale", onChange: () => {
|
|
72090
72245
|
this.props.stateManager.onUpdateRequiredObservable.notifyObservers(block);
|
|
72091
|
-
} })), texture && !isInReflectionMode && !isFrozenTexture && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(
|
|
72246
|
+
} })), texture && !isInReflectionMode && !isFrozenTexture && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_floatLineComponent__WEBPACK_IMPORTED_MODULE_10__.FloatLineComponent, { lockObject: this.props.stateManager.lockObject, label: "Scale V", target: texture, propertyName: "vScale", onChange: () => {
|
|
72092
72247
|
this.props.stateManager.onUpdateRequiredObservable.notifyObservers(block);
|
|
72093
|
-
} })), texture && !isInReflectionMode && !isFrozenTexture && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(
|
|
72248
|
+
} })), texture && !isInReflectionMode && !isFrozenTexture && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_sliderLineComponent__WEBPACK_IMPORTED_MODULE_11__.SliderLineComponent, { lockObject: this.props.stateManager.lockObject, label: "Rotation U", target: texture, propertyName: "uAng", minimum: 0, maximum: Math.PI * 2, useEuler: true, step: 0.1, onChange: () => {
|
|
72094
72249
|
this.props.stateManager.onUpdateRequiredObservable.notifyObservers(block);
|
|
72095
|
-
} })), texture && !isInReflectionMode && !isFrozenTexture && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(
|
|
72250
|
+
} })), texture && !isInReflectionMode && !isFrozenTexture && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_sliderLineComponent__WEBPACK_IMPORTED_MODULE_11__.SliderLineComponent, { lockObject: this.props.stateManager.lockObject, label: "Rotation V", target: texture, propertyName: "vAng", minimum: 0, maximum: Math.PI * 2, useEuler: true, step: 0.1, onChange: () => {
|
|
72096
72251
|
this.props.stateManager.onUpdateRequiredObservable.notifyObservers(block);
|
|
72097
|
-
} })), texture && !isInReflectionMode && !isFrozenTexture && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(
|
|
72252
|
+
} })), texture && !isInReflectionMode && !isFrozenTexture && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_sliderLineComponent__WEBPACK_IMPORTED_MODULE_11__.SliderLineComponent, { lockObject: this.props.stateManager.lockObject, label: "Rotation W", target: texture, propertyName: "wAng", minimum: 0, maximum: Math.PI * 2, useEuler: true, step: 0.1, onChange: () => {
|
|
72098
72253
|
this.props.stateManager.onUpdateRequiredObservable.notifyObservers(block);
|
|
72099
72254
|
} }))] })), !this.textureBlock.hasImageSource && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(_sharedComponents_lineContainerComponent__WEBPACK_IMPORTED_MODULE_4__.LineContainerComponent, Object.assign({ title: "SOURCE" }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_sharedComponents_checkBoxLineComponent__WEBPACK_IMPORTED_MODULE_5__.CheckBoxLineComponent, { label: "Embed static texture", isSelected: () => this.state.isEmbedded, onSelect: (value) => {
|
|
72100
72255
|
this.setState({ isEmbedded: value });
|
|
72101
72256
|
this.textureBlock.texture = null;
|
|
72102
72257
|
this.updateAfterTextureLoad();
|
|
72103
|
-
} }), isInReflectionMode && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_sharedComponents_checkBoxLineComponent__WEBPACK_IMPORTED_MODULE_5__.CheckBoxLineComponent, { label: "Load as cube texture", isSelected: () => this.state.loadAsCubeTexture, onSelect: (value) => this.setState({ loadAsCubeTexture: value }) })), isInReflectionMode && this.state.loadAsCubeTexture && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_sharedComponents_checkBoxLineComponent__WEBPACK_IMPORTED_MODULE_5__.CheckBoxLineComponent, { label: "\u00A0\u00A0\u00A0\u00A0\u00A0\u00A0Texture is prefiltered", isSelected: () => this.state.textureIsPrefiltered, onSelect: (value) => this.setState({ textureIsPrefiltered: value }) })), this.state.isEmbedded && (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_sharedComponents_fileButtonLineComponent__WEBPACK_IMPORTED_MODULE_2__.FileButtonLineComponent, { label: "Upload", onClick: (file) => this.replaceTexture(file), accept: ".jpg, .png, .tga, .dds, .env" }), !this.state.isEmbedded && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(
|
|
72258
|
+
} }), isInReflectionMode && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_sharedComponents_checkBoxLineComponent__WEBPACK_IMPORTED_MODULE_5__.CheckBoxLineComponent, { label: "Load as cube texture", isSelected: () => this.state.loadAsCubeTexture, onSelect: (value) => this.setState({ loadAsCubeTexture: value }) })), isInReflectionMode && this.state.loadAsCubeTexture && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_sharedComponents_checkBoxLineComponent__WEBPACK_IMPORTED_MODULE_5__.CheckBoxLineComponent, { label: "\u00A0\u00A0\u00A0\u00A0\u00A0\u00A0Texture is prefiltered", isSelected: () => this.state.textureIsPrefiltered, onSelect: (value) => this.setState({ textureIsPrefiltered: value }) })), this.state.isEmbedded && (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_sharedComponents_fileButtonLineComponent__WEBPACK_IMPORTED_MODULE_2__.FileButtonLineComponent, { label: "Upload", onClick: (file) => this.replaceTexture(file), accept: ".jpg, .png, .tga, .dds, .env" }), !this.state.isEmbedded && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_textInputLineComponent__WEBPACK_IMPORTED_MODULE_7__.TextInputLineComponent, { lockObject: this.props.stateManager.lockObject, label: "Link", value: url, onChange: (newUrl) => this.replaceTextureWithUrl(newUrl) })), !this.state.isEmbedded && url && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_buttonLineComponent__WEBPACK_IMPORTED_MODULE_8__.ButtonLineComponent, { label: "Refresh", onClick: () => this.replaceTextureWithUrl(url + "?nocache=" + this._generateRandomForCache()) })), texture && (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_buttonLineComponent__WEBPACK_IMPORTED_MODULE_8__.ButtonLineComponent, { label: "Remove", onClick: () => this.removeTexture() })] }))), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_genericNodePropertyComponent__WEBPACK_IMPORTED_MODULE_6__.GenericPropertyTabComponent, { stateManager: this.props.stateManager, nodeData: this.props.nodeData })] }));
|
|
72104
72259
|
}
|
|
72105
72260
|
}
|
|
72106
72261
|
|
|
@@ -72355,9 +72510,9 @@ __webpack_require__.r(__webpack_exports__);
|
|
|
72355
72510
|
/* harmony import */ var _serializationTools__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../serializationTools */ "../../../tools/nodeEditor/dist/serializationTools.js");
|
|
72356
72511
|
|
|
72357
72512
|
const RegisterExportData = (stateManager) => {
|
|
72358
|
-
stateManager.exportData = (data) => {
|
|
72513
|
+
stateManager.exportData = (data, frame) => {
|
|
72359
72514
|
const nodeMaterial = data.nodeMaterial;
|
|
72360
|
-
return _serializationTools__WEBPACK_IMPORTED_MODULE_0__.SerializationTools.Serialize(nodeMaterial, stateManager.data,
|
|
72515
|
+
return _serializationTools__WEBPACK_IMPORTED_MODULE_0__.SerializationTools.Serialize(nodeMaterial, stateManager.data, frame);
|
|
72361
72516
|
};
|
|
72362
72517
|
stateManager.getEditorDataMap = () => {
|
|
72363
72518
|
return stateManager.data.nodeMaterial.editorData.map;
|
|
@@ -72883,73 +73038,6 @@ class CheckBoxLineComponent extends react__WEBPACK_IMPORTED_MODULE_1__.Component
|
|
|
72883
73038
|
CheckBoxLineComponent._UniqueIdSeed = 0;
|
|
72884
73039
|
|
|
72885
73040
|
|
|
72886
|
-
/***/ }),
|
|
72887
|
-
|
|
72888
|
-
/***/ "../../../tools/nodeEditor/dist/sharedComponents/colorPickerComponent.js":
|
|
72889
|
-
/*!*******************************************************************************!*\
|
|
72890
|
-
!*** ../../../tools/nodeEditor/dist/sharedComponents/colorPickerComponent.js ***!
|
|
72891
|
-
\*******************************************************************************/
|
|
72892
|
-
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
|
|
72893
|
-
|
|
72894
|
-
"use strict";
|
|
72895
|
-
__webpack_require__.r(__webpack_exports__);
|
|
72896
|
-
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
|
|
72897
|
-
/* harmony export */ "ColorPickerLineComponent": () => (/* binding */ ColorPickerLineComponent)
|
|
72898
|
-
/* harmony export */ });
|
|
72899
|
-
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react/jsx-runtime */ "../../../../node_modules/react/jsx-runtime.js");
|
|
72900
|
-
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! react */ "../../../../node_modules/react/index.js");
|
|
72901
|
-
/* harmony import */ var shared_ui_components_colorPicker_colorPicker__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! shared-ui-components/colorPicker/colorPicker */ "../../../dev/sharedUiComponents/dist/colorPicker/colorPicker.js");
|
|
72902
|
-
|
|
72903
|
-
|
|
72904
|
-
|
|
72905
|
-
class ColorPickerLineComponent extends react__WEBPACK_IMPORTED_MODULE_1__.Component {
|
|
72906
|
-
constructor(props) {
|
|
72907
|
-
super(props);
|
|
72908
|
-
this.state = { pickerEnabled: false, color: this.props.value, hex: this.props.value.toHexString() };
|
|
72909
|
-
this._floatRef = react__WEBPACK_IMPORTED_MODULE_1__.createRef();
|
|
72910
|
-
this._floatHostRef = react__WEBPACK_IMPORTED_MODULE_1__.createRef();
|
|
72911
|
-
}
|
|
72912
|
-
syncPositions() {
|
|
72913
|
-
const div = this._floatRef.current;
|
|
72914
|
-
const host = this._floatHostRef.current;
|
|
72915
|
-
if (!div || !host) {
|
|
72916
|
-
return;
|
|
72917
|
-
}
|
|
72918
|
-
let top = host.getBoundingClientRect().top;
|
|
72919
|
-
const height = div.getBoundingClientRect().height;
|
|
72920
|
-
if (top + height + 10 > window.innerHeight) {
|
|
72921
|
-
top = window.innerHeight - height - 10;
|
|
72922
|
-
}
|
|
72923
|
-
div.style.top = top + "px";
|
|
72924
|
-
div.style.left = host.getBoundingClientRect().left - div.getBoundingClientRect().width + "px";
|
|
72925
|
-
}
|
|
72926
|
-
shouldComponentUpdate(nextProps, nextState) {
|
|
72927
|
-
if (nextProps.value.toHexString() !== this.props.value.toHexString()) {
|
|
72928
|
-
nextState.color = nextProps.value;
|
|
72929
|
-
nextState.hex = nextProps.value.toHexString();
|
|
72930
|
-
}
|
|
72931
|
-
return true;
|
|
72932
|
-
}
|
|
72933
|
-
componentDidUpdate() {
|
|
72934
|
-
this.syncPositions();
|
|
72935
|
-
}
|
|
72936
|
-
componentDidMount() {
|
|
72937
|
-
this.syncPositions();
|
|
72938
|
-
}
|
|
72939
|
-
setPickerState(enabled) {
|
|
72940
|
-
this.setState({ pickerEnabled: enabled });
|
|
72941
|
-
}
|
|
72942
|
-
render() {
|
|
72943
|
-
const color = this.state.color;
|
|
72944
|
-
this.props.globalState.lockObject.lock = this.state.pickerEnabled;
|
|
72945
|
-
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", Object.assign({ className: "color-picker" }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", { className: "color-rect", ref: this._floatHostRef, style: { background: this.state.hex }, onClick: () => this.setPickerState(true) }), this.state.pickerEnabled && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.Fragment, { children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", Object.assign({ className: "color-picker-cover", onClick: () => this.setPickerState(false) }, { children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", Object.assign({ className: "color-picker-float", onClick: (ev) => ev.stopPropagation(), ref: this._floatRef }, { children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_colorPicker_colorPicker__WEBPACK_IMPORTED_MODULE_2__.ColorPicker, { color: color, onColorChanged: (color) => {
|
|
72946
|
-
const hex = color.toHexString();
|
|
72947
|
-
this.props.onColorChanged(hex);
|
|
72948
|
-
} }) })) })) }))] })));
|
|
72949
|
-
}
|
|
72950
|
-
}
|
|
72951
|
-
|
|
72952
|
-
|
|
72953
73041
|
/***/ }),
|
|
72954
73042
|
|
|
72955
73043
|
/***/ "../../../tools/nodeEditor/dist/sharedComponents/draggableLineComponent.js":
|
|
@@ -73046,123 +73134,6 @@ class FileButtonLineComponent extends react__WEBPACK_IMPORTED_MODULE_1__.Compone
|
|
|
73046
73134
|
}
|
|
73047
73135
|
|
|
73048
73136
|
|
|
73049
|
-
/***/ }),
|
|
73050
|
-
|
|
73051
|
-
/***/ "../../../tools/nodeEditor/dist/sharedComponents/floatLineComponent.js":
|
|
73052
|
-
/*!*****************************************************************************!*\
|
|
73053
|
-
!*** ../../../tools/nodeEditor/dist/sharedComponents/floatLineComponent.js ***!
|
|
73054
|
-
\*****************************************************************************/
|
|
73055
|
-
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
|
|
73056
|
-
|
|
73057
|
-
"use strict";
|
|
73058
|
-
__webpack_require__.r(__webpack_exports__);
|
|
73059
|
-
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
|
|
73060
|
-
/* harmony export */ "FloatLineComponent": () => (/* binding */ FloatLineComponent)
|
|
73061
|
-
/* harmony export */ });
|
|
73062
|
-
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react/jsx-runtime */ "../../../../node_modules/react/jsx-runtime.js");
|
|
73063
|
-
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! react */ "../../../../node_modules/react/index.js");
|
|
73064
|
-
|
|
73065
|
-
|
|
73066
|
-
class FloatLineComponent extends react__WEBPACK_IMPORTED_MODULE_1__.Component {
|
|
73067
|
-
constructor(props) {
|
|
73068
|
-
super(props);
|
|
73069
|
-
this._localChange = false;
|
|
73070
|
-
this._onFocus = false;
|
|
73071
|
-
const currentValue = this.props.target[this.props.propertyName];
|
|
73072
|
-
this.state = { value: currentValue ? (this.props.isInteger ? currentValue.toFixed(0) : currentValue.toFixed(this.props.digits || 4)) : "0" };
|
|
73073
|
-
this._store = currentValue;
|
|
73074
|
-
let rexp = "(.*\\.";
|
|
73075
|
-
let numDigits = this.props.digits || 4;
|
|
73076
|
-
while (numDigits--) {
|
|
73077
|
-
rexp += ".";
|
|
73078
|
-
}
|
|
73079
|
-
rexp += ").+";
|
|
73080
|
-
this._regExp = new RegExp(rexp);
|
|
73081
|
-
}
|
|
73082
|
-
shouldComponentUpdate(nextProps, nextState) {
|
|
73083
|
-
if (this._localChange) {
|
|
73084
|
-
this._localChange = false;
|
|
73085
|
-
return true;
|
|
73086
|
-
}
|
|
73087
|
-
const newValue = nextProps.target[nextProps.propertyName];
|
|
73088
|
-
const newValueString = newValue ? (this.props.isInteger ? newValue.toFixed(0) : newValue.toFixed(this.props.digits || 4)) : "0";
|
|
73089
|
-
if (newValueString !== nextState.value) {
|
|
73090
|
-
nextState.value = newValueString;
|
|
73091
|
-
return true;
|
|
73092
|
-
}
|
|
73093
|
-
return false;
|
|
73094
|
-
}
|
|
73095
|
-
componentWillUnmount() {
|
|
73096
|
-
if (this._onFocus) {
|
|
73097
|
-
if (this.props.onEnter) {
|
|
73098
|
-
this.props.onEnter(this._store);
|
|
73099
|
-
}
|
|
73100
|
-
}
|
|
73101
|
-
}
|
|
73102
|
-
raiseOnPropertyChanged(newValue, previousValue) {
|
|
73103
|
-
if (this.props.onChange) {
|
|
73104
|
-
this.props.onChange(newValue);
|
|
73105
|
-
}
|
|
73106
|
-
if (!this.props.onPropertyChangedObservable) {
|
|
73107
|
-
return;
|
|
73108
|
-
}
|
|
73109
|
-
this.props.onPropertyChangedObservable.notifyObservers({
|
|
73110
|
-
object: this.props.target,
|
|
73111
|
-
property: this.props.propertyName,
|
|
73112
|
-
value: newValue,
|
|
73113
|
-
initialValue: previousValue,
|
|
73114
|
-
});
|
|
73115
|
-
}
|
|
73116
|
-
updateValue(valueString) {
|
|
73117
|
-
if (/[^0-9.-]/g.test(valueString)) {
|
|
73118
|
-
return;
|
|
73119
|
-
}
|
|
73120
|
-
valueString = valueString.replace(this._regExp, "$1");
|
|
73121
|
-
let valueAsNumber;
|
|
73122
|
-
if (this.props.isInteger) {
|
|
73123
|
-
valueAsNumber = parseInt(valueString);
|
|
73124
|
-
}
|
|
73125
|
-
else {
|
|
73126
|
-
valueAsNumber = parseFloat(valueString);
|
|
73127
|
-
}
|
|
73128
|
-
this._localChange = true;
|
|
73129
|
-
this.setState({ value: valueString });
|
|
73130
|
-
if (isNaN(valueAsNumber)) {
|
|
73131
|
-
return;
|
|
73132
|
-
}
|
|
73133
|
-
if (this.props.max != undefined && valueAsNumber > this.props.max) {
|
|
73134
|
-
valueAsNumber = this.props.max;
|
|
73135
|
-
}
|
|
73136
|
-
if (this.props.min != undefined && valueAsNumber < this.props.min) {
|
|
73137
|
-
valueAsNumber = this.props.min;
|
|
73138
|
-
}
|
|
73139
|
-
this.props.target[this.props.propertyName] = valueAsNumber;
|
|
73140
|
-
this.raiseOnPropertyChanged(valueAsNumber, this._store);
|
|
73141
|
-
this._store = valueAsNumber;
|
|
73142
|
-
}
|
|
73143
|
-
render() {
|
|
73144
|
-
const className = this.props.smallUI ? "short" : "value";
|
|
73145
|
-
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.Fragment, { children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", Object.assign({ className: this.props.additionalClass ? this.props.additionalClass + " floatLine" : "floatLine" }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", Object.assign({ className: "label", title: this.props.label }, { children: this.props.label })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", Object.assign({ className: className }, { children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("input", { type: "number", step: this.props.step || "0.01", className: "numeric-input", onBlur: () => {
|
|
73146
|
-
this._onFocus = false;
|
|
73147
|
-
this.props.globalState.lockObject.lock = false;
|
|
73148
|
-
if (this.props.onEnter) {
|
|
73149
|
-
this.props.onEnter(this._store);
|
|
73150
|
-
}
|
|
73151
|
-
}, onKeyDown: (evt) => {
|
|
73152
|
-
if (evt.keyCode !== 13) {
|
|
73153
|
-
return;
|
|
73154
|
-
}
|
|
73155
|
-
if (this.props.onEnter) {
|
|
73156
|
-
this.props.onEnter(this._store);
|
|
73157
|
-
}
|
|
73158
|
-
}, onFocus: () => {
|
|
73159
|
-
this.props.globalState.lockObject.lock = true;
|
|
73160
|
-
this._onFocus = true;
|
|
73161
|
-
}, value: this.state.value, onChange: (evt) => this.updateValue(evt.target.value) }) }))] })) }));
|
|
73162
|
-
}
|
|
73163
|
-
}
|
|
73164
|
-
|
|
73165
|
-
|
|
73166
73137
|
/***/ }),
|
|
73167
73138
|
|
|
73168
73139
|
/***/ "../../../tools/nodeEditor/dist/sharedComponents/lineContainerComponent.js":
|
|
@@ -73368,142 +73339,6 @@ class Popup {
|
|
|
73368
73339
|
}
|
|
73369
73340
|
|
|
73370
73341
|
|
|
73371
|
-
/***/ }),
|
|
73372
|
-
|
|
73373
|
-
/***/ "../../../tools/nodeEditor/dist/sharedComponents/sliderLineComponent.js":
|
|
73374
|
-
/*!******************************************************************************!*\
|
|
73375
|
-
!*** ../../../tools/nodeEditor/dist/sharedComponents/sliderLineComponent.js ***!
|
|
73376
|
-
\******************************************************************************/
|
|
73377
|
-
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
|
|
73378
|
-
|
|
73379
|
-
"use strict";
|
|
73380
|
-
__webpack_require__.r(__webpack_exports__);
|
|
73381
|
-
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
|
|
73382
|
-
/* harmony export */ "SliderLineComponent": () => (/* binding */ SliderLineComponent)
|
|
73383
|
-
/* harmony export */ });
|
|
73384
|
-
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react/jsx-runtime */ "../../../../node_modules/react/jsx-runtime.js");
|
|
73385
|
-
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! react */ "../../../../node_modules/react/index.js");
|
|
73386
|
-
/* harmony import */ var core_Misc_tools__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! core/Misc/tools */ "core/Misc/dataStorage");
|
|
73387
|
-
/* harmony import */ var core_Misc_tools__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(core_Misc_tools__WEBPACK_IMPORTED_MODULE_2__);
|
|
73388
|
-
/* harmony import */ var _floatLineComponent__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./floatLineComponent */ "../../../tools/nodeEditor/dist/sharedComponents/floatLineComponent.js");
|
|
73389
|
-
|
|
73390
|
-
|
|
73391
|
-
|
|
73392
|
-
|
|
73393
|
-
class SliderLineComponent extends react__WEBPACK_IMPORTED_MODULE_1__.Component {
|
|
73394
|
-
constructor(props) {
|
|
73395
|
-
super(props);
|
|
73396
|
-
this._localChange = false;
|
|
73397
|
-
if (this.props.directValue !== undefined) {
|
|
73398
|
-
this.state = {
|
|
73399
|
-
value: this.props.directValue,
|
|
73400
|
-
};
|
|
73401
|
-
}
|
|
73402
|
-
else {
|
|
73403
|
-
let value = this.props.target[this.props.propertyName];
|
|
73404
|
-
if (value === undefined) {
|
|
73405
|
-
value = this.props.maximum;
|
|
73406
|
-
}
|
|
73407
|
-
this.state = { value: value };
|
|
73408
|
-
}
|
|
73409
|
-
}
|
|
73410
|
-
shouldComponentUpdate(nextProps, nextState) {
|
|
73411
|
-
if (nextProps.directValue !== undefined) {
|
|
73412
|
-
nextState.value = nextProps.directValue;
|
|
73413
|
-
return true;
|
|
73414
|
-
}
|
|
73415
|
-
let currentState = nextProps.target[nextProps.propertyName];
|
|
73416
|
-
if (currentState === undefined) {
|
|
73417
|
-
currentState = nextProps.maximum;
|
|
73418
|
-
}
|
|
73419
|
-
if (currentState !== nextState.value || nextProps.minimum !== this.props.minimum || nextProps.maximum !== this.props.maximum || this._localChange) {
|
|
73420
|
-
nextState.value = Math.min(Math.max(currentState, nextProps.minimum), nextProps.maximum);
|
|
73421
|
-
this._localChange = false;
|
|
73422
|
-
return true;
|
|
73423
|
-
}
|
|
73424
|
-
return false;
|
|
73425
|
-
}
|
|
73426
|
-
onChange(newValueString) {
|
|
73427
|
-
this._localChange = true;
|
|
73428
|
-
let newValue = parseFloat(newValueString);
|
|
73429
|
-
if (this.props.useEuler) {
|
|
73430
|
-
newValue = core_Misc_tools__WEBPACK_IMPORTED_MODULE_2__.Tools.ToRadians(newValue);
|
|
73431
|
-
}
|
|
73432
|
-
if (this.props.target) {
|
|
73433
|
-
if (this.props.onPropertyChangedObservable) {
|
|
73434
|
-
this.props.onPropertyChangedObservable.notifyObservers({
|
|
73435
|
-
object: this.props.target,
|
|
73436
|
-
property: this.props.propertyName,
|
|
73437
|
-
value: newValue,
|
|
73438
|
-
initialValue: this.state.value,
|
|
73439
|
-
});
|
|
73440
|
-
}
|
|
73441
|
-
this.props.target[this.props.propertyName] = newValue;
|
|
73442
|
-
}
|
|
73443
|
-
if (this.props.onChange) {
|
|
73444
|
-
this.props.onChange(newValue);
|
|
73445
|
-
}
|
|
73446
|
-
this.setState({ value: newValue });
|
|
73447
|
-
}
|
|
73448
|
-
onInput(newValueString) {
|
|
73449
|
-
const newValue = parseFloat(newValueString);
|
|
73450
|
-
if (this.props.onInput) {
|
|
73451
|
-
this.props.onInput(newValue);
|
|
73452
|
-
}
|
|
73453
|
-
}
|
|
73454
|
-
prepareDataToRead(value) {
|
|
73455
|
-
if (this.props.useEuler) {
|
|
73456
|
-
return core_Misc_tools__WEBPACK_IMPORTED_MODULE_2__.Tools.ToDegrees(value);
|
|
73457
|
-
}
|
|
73458
|
-
return value;
|
|
73459
|
-
}
|
|
73460
|
-
render() {
|
|
73461
|
-
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", Object.assign({ className: "sliderLine" }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", Object.assign({ className: "label", title: this.props.label }, { children: this.props.label })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_floatLineComponent__WEBPACK_IMPORTED_MODULE_3__.FloatLineComponent, { globalState: this.props.globalState, smallUI: true, label: "", target: this.state, propertyName: "value", min: this.prepareDataToRead(this.props.minimum), max: this.prepareDataToRead(this.props.maximum), onEnter: () => {
|
|
73462
|
-
this.onChange(this.state.value);
|
|
73463
|
-
} }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", Object.assign({ className: "slider" }, { children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("input", { className: "range", type: "range", step: this.props.step, min: this.prepareDataToRead(this.props.minimum), max: this.prepareDataToRead(this.props.maximum), value: this.prepareDataToRead(this.state.value), onInput: (evt) => this.onInput(evt.target.value), onChange: (evt) => this.onChange(evt.target.value) }) }))] })));
|
|
73464
|
-
}
|
|
73465
|
-
}
|
|
73466
|
-
|
|
73467
|
-
|
|
73468
|
-
/***/ }),
|
|
73469
|
-
|
|
73470
|
-
/***/ "../../../tools/nodeEditor/dist/sharedComponents/textLineComponent.js":
|
|
73471
|
-
/*!****************************************************************************!*\
|
|
73472
|
-
!*** ../../../tools/nodeEditor/dist/sharedComponents/textLineComponent.js ***!
|
|
73473
|
-
\****************************************************************************/
|
|
73474
|
-
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
|
|
73475
|
-
|
|
73476
|
-
"use strict";
|
|
73477
|
-
__webpack_require__.r(__webpack_exports__);
|
|
73478
|
-
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
|
|
73479
|
-
/* harmony export */ "TextLineComponent": () => (/* binding */ TextLineComponent)
|
|
73480
|
-
/* harmony export */ });
|
|
73481
|
-
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react/jsx-runtime */ "../../../../node_modules/react/jsx-runtime.js");
|
|
73482
|
-
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! react */ "../../../../node_modules/react/index.js");
|
|
73483
|
-
|
|
73484
|
-
|
|
73485
|
-
class TextLineComponent extends react__WEBPACK_IMPORTED_MODULE_1__.Component {
|
|
73486
|
-
constructor(props) {
|
|
73487
|
-
super(props);
|
|
73488
|
-
}
|
|
73489
|
-
onLink() {
|
|
73490
|
-
if (!this.props.onLink) {
|
|
73491
|
-
return;
|
|
73492
|
-
}
|
|
73493
|
-
this.props.onLink();
|
|
73494
|
-
}
|
|
73495
|
-
renderContent() {
|
|
73496
|
-
if (this.props.onLink) {
|
|
73497
|
-
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", Object.assign({ className: "link-value", title: this.props.value, onClick: () => this.onLink() }, { children: this.props.value || "no name" })));
|
|
73498
|
-
}
|
|
73499
|
-
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", Object.assign({ className: "value", title: this.props.value, style: { color: this.props.color ? this.props.color : "" } }, { children: this.props.value || "no name" })));
|
|
73500
|
-
}
|
|
73501
|
-
render() {
|
|
73502
|
-
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", Object.assign({ className: this.props.underline ? "textLine underline" : "textLine" }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", Object.assign({ className: "label", title: this.props.label }, { children: this.props.label })), this.renderContent()] })));
|
|
73503
|
-
}
|
|
73504
|
-
}
|
|
73505
|
-
|
|
73506
|
-
|
|
73507
73342
|
/***/ }),
|
|
73508
73343
|
|
|
73509
73344
|
/***/ "../../../tools/nodeEditor/dist/sharedComponents/textureLineComponent.js":
|
|
@@ -73989,17 +73824,6 @@ var update = _node_modules_style_loader_dist_runtime_injectStylesIntoStyleTag_js
|
|
|
73989
73824
|
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (_node_modules_css_loader_dist_cjs_js_ruleSet_1_rules_3_use_1_node_modules_sass_loader_dist_cjs_js_ruleSet_1_rules_3_use_2_main_scss__WEBPACK_IMPORTED_MODULE_6__["default"] && _node_modules_css_loader_dist_cjs_js_ruleSet_1_rules_3_use_1_node_modules_sass_loader_dist_cjs_js_ruleSet_1_rules_3_use_2_main_scss__WEBPACK_IMPORTED_MODULE_6__["default"].locals ? _node_modules_css_loader_dist_cjs_js_ruleSet_1_rules_3_use_1_node_modules_sass_loader_dist_cjs_js_ruleSet_1_rules_3_use_2_main_scss__WEBPACK_IMPORTED_MODULE_6__["default"].locals : undefined);
|
|
73990
73825
|
|
|
73991
73826
|
|
|
73992
|
-
/***/ }),
|
|
73993
|
-
|
|
73994
|
-
/***/ "../../../dev/sharedUiComponents/dist/imgs/triangle.svg":
|
|
73995
|
-
/*!**************************************************************!*\
|
|
73996
|
-
!*** ../../../dev/sharedUiComponents/dist/imgs/triangle.svg ***!
|
|
73997
|
-
\**************************************************************/
|
|
73998
|
-
/***/ ((module) => {
|
|
73999
|
-
|
|
74000
|
-
"use strict";
|
|
74001
|
-
module.exports = "data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4NCjwhLS0gR2VuZXJhdG9yOiBBZG9iZSBJbGx1c3RyYXRvciAyNS40LjEsIFNWRyBFeHBvcnQgUGx1Zy1JbiAuIFNWRyBWZXJzaW9uOiA2LjAwIEJ1aWxkIDApICAtLT4NCjxzdmcgdmVyc2lvbj0iMS4xIiBpZD0iTGF5ZXJfMSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayIgeD0iMHB4IiB5PSIwcHgiDQoJIHZpZXdCb3g9IjAgMCAzMiAzMiIgc3R5bGU9ImVuYWJsZS1iYWNrZ3JvdW5kOm5ldyAwIDAgMzIgMzI7IiB4bWw6c3BhY2U9InByZXNlcnZlIj4NCjxzdHlsZSB0eXBlPSJ0ZXh0L2NzcyI+DQoJLnN0MHtmaWxsOiNGRkZGRkY7fQ0KPC9zdHlsZT4NCjxwYXRoIGNsYXNzPSJzdDAiIGQ9Ik0xOC44LDQuN2MtMS4yLTIuMi00LjUtMi4yLTUuNywwTDIuNCwyNC4yQzEuMiwyNi4zLDIuOCwyOSw1LjIsMjloMjEuNWMyLjUsMCw0LTIuNywyLjgtNC44TDE4LjgsNC43eiIvPg0KPC9zdmc+DQo=";
|
|
74002
|
-
|
|
74003
73827
|
/***/ }),
|
|
74004
73828
|
|
|
74005
73829
|
/***/ "../../../dev/sharedUiComponents/dist/lines/copy.svg":
|
|
@@ -74167,6 +73991,28 @@ module.exports = "data:image/svg+xml;base64,PHN2ZyB2aWV3Qm94PSIwIDAgMjQgMjQiIGZp
|
|
|
74167
73991
|
|
|
74168
73992
|
/***/ }),
|
|
74169
73993
|
|
|
73994
|
+
/***/ "../../../tools/nodeEditor/dist/imgs/square.svg":
|
|
73995
|
+
/*!******************************************************!*\
|
|
73996
|
+
!*** ../../../tools/nodeEditor/dist/imgs/square.svg ***!
|
|
73997
|
+
\******************************************************/
|
|
73998
|
+
/***/ ((module) => {
|
|
73999
|
+
|
|
74000
|
+
"use strict";
|
|
74001
|
+
module.exports = "data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz48c3ZnIGlkPSJMYXllcl81IiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyMCIgaGVpZ2h0PSIyMCIgdmlld0JveD0iMCAwIDIwIDIwIj48ZGVmcz48c3R5bGU+LmNscy0xe2ZpbGw6I2ZmZjt9PC9zdHlsZT48L2RlZnM+PHBhdGggY2xhc3M9ImNscy0xIiBkPSJNMy4xMiw1LjYxYzAtMS4zNywxLjExLTIuNDgsMi40OC0yLjQ4SDE0LjM5YzEuMzcsMCwyLjQ4LDEuMTEsMi40OCwyLjQ4VjE0LjM5YzAsMS4zNy0xLjExLDIuNDgtMi40OCwyLjQ4SDUuNjFjLTEuMzcsMC0yLjQ4LTEuMTEtMi40OC0yLjQ4VjUuNjFaIi8+PC9zdmc+";
|
|
74002
|
+
|
|
74003
|
+
/***/ }),
|
|
74004
|
+
|
|
74005
|
+
/***/ "../../../tools/nodeEditor/dist/imgs/triangle.svg":
|
|
74006
|
+
/*!********************************************************!*\
|
|
74007
|
+
!*** ../../../tools/nodeEditor/dist/imgs/triangle.svg ***!
|
|
74008
|
+
\********************************************************/
|
|
74009
|
+
/***/ ((module) => {
|
|
74010
|
+
|
|
74011
|
+
"use strict";
|
|
74012
|
+
module.exports = "data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz48c3ZnIGlkPSJMYXllcl81IiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyMCIgaGVpZ2h0PSIyMCIgdmlld0JveD0iMCAwIDIwIDIwIj48ZGVmcz48c3R5bGU+LmNscy0xe2ZpbGw6I2ZmZjt9PC9zdHlsZT48L2RlZnM+PHBhdGggY2xhc3M9ImNscy0xIiBkPSJNMi42MywxNS4yNmMtLjQ0LC44MywuMTYsMS44NCwxLjExLDEuODRoMTIuNTJjLjk1LDAsMS41NS0xLjAyLDEuMS0xLjg1TDExLjAyLDMuNTZjLS40OC0uODgtMS43NC0uODctMi4yMSwuMDFMMi42MywxNS4yNloiLz48L3N2Zz4=";
|
|
74013
|
+
|
|
74014
|
+
/***/ }),
|
|
74015
|
+
|
|
74170
74016
|
/***/ "../../../tools/nodeEditor/dist/sharedComponents/copy.svg":
|
|
74171
74017
|
/*!****************************************************************!*\
|
|
74172
74018
|
!*** ../../../tools/nodeEditor/dist/sharedComponents/copy.svg ***!
|