import { i, r, x } from './query-assigned-elements-fea1f631.js';
|
import { e } from './custom-element-30fc6381.js';
|
import { n, B as BaseElement } from './base.component-813fc7cf.js';
|
import { i as i$1 } from './query-1c86d710.js';
|
import { ColorPickerModel } from './color-picker.model.js';
|
import { TransitionHelper } from './transition.helper.js';
|
import '@dh-software/furnview-icons';
|
|
var css_248z = i`.close-symbol{cursor:pointer;height:100%;position:relative;width:100%}.close-symbol.loading{z-index:999}.close-symbol.loading:after,.close-symbol.loading:before{background:#fff}.close-symbol:after,.close-symbol:before{background:var(--close-symbol-background,#888);-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;content:" ";height:1px;margin:0;padding:0;position:absolute;top:50%;width:100%}.close-symbol:after:hover,.close-symbol:before:hover{background:var(--close-symbol-background-hover,#333)}.close-symbol:after{-webkit-transform:rotate(-45deg);-moz-transform:rotate(-45deg);transform:rotate(-45deg)}.close-symbol:before{-webkit-transform:rotate(45deg);-moz-transform:rotate(45deg);transform:rotate(45deg)}:host(.active) .circle-number-symbol{border:var(--circle-number-symbol-border-active,2px solid #000)}.circle-number-symbol{align-items:center;background:var(--circle-number-symbol-background,var(--primary-color,red));border:var(--circle-number-symbol-border,2px solid #fff);border-radius:50%;box-shadow:var(--circle-number-symbol-box-shadow,1px 2px 5px 0 #000);color:var(--circle-number-symbol-color,var(--primary-text-color,#000));display:flex;height:var(--circle-number-symbol-size,30px);justify-content:center;position:relative;width:var(--circle-number-symbol-size,30px)}.custom-symbol{cursor:pointer;display:flex;left:10px;position:relative}.custom-symbol.up:after{background-image:var(--custom-symbol-image-down,url("/webui/images/minus.svg"));content:"";height:18px}.custom-symbol.down:after{background-image:var(--custom-symbol-image-down,url("/webui/images/plus.svg"));content:"";height:18px}.custom-symbol:after{color:#1e1e1e;margin:auto 0;padding:0 0 2px;pointer-events:none;transform:translateX(-15px);width:18px}.accordion-symbol{cursor:pointer;display:flex;left:10px;position:relative}.accordion-symbol.up:after{content:"-";font-size:xx-large;transform:scaleX(2) translateX(-4px)}.accordion-symbol.down:after{content:"+";font-size:xx-large}.accordion-symbol:after{color:#1e1e1e;margin:auto 0;padding:0 0 2px;pointer-events:none;transform:translateX(-15px);width:18px}.chevron-symbol{cursor:pointer;left:10px;position:relative}.chevron-symbol.up:after{content:"<"}.chevron-symbol.down:after{content:">"}.chevron-symbol:after{color:inherit;font:17px Consolas,monospace;padding:0 0 2px;pointer-events:none;position:absolute;-webkit-transform:rotate(90deg) translateX(-100%);-moz-transform:rotate(90deg) translateX(-100%);-ms-transform:rotate(90deg) translateX(-100%);transform:rotate(90deg) translateX(-100%)}@media (width >= 980px){.only-mobile{display:none!important}}@media (width <= 980px){.only-desktop{display:none!important}}.bold{font-weight:var(--global-font-weight-bold,600)}*{font-family:var(--global-font,Roboto);font-weight:var(--global-font-weight,400);-webkit-user-select:none;-khtml-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.container{display:flex;margin:10px 0}.container.column{flex-direction:column}.container.column.reverse{flex-direction:column-reverse}.container.row{flex-direction:row}.container.row.reverse{flex-direction:row-reverse}.fluid{flex:1}.fluid.space-after{margin-right:55px}.hidden{display:none!important}.mobile-mode-hide,:host(.mobile-mode-hide){display:none!important}.invisible{visibility:hidden!important}.invisible-scroll,:host(.invisible-scroll){margin-right:-22px;overflow:hidden}.invisible-scroll>:first-child,:host(.invisible-scroll)>:first-child{box-sizing:content-box;overflow-x:hidden;overflow-y:scroll;padding-right:22px}.invisible-scroll.bottom,:host(.invisible-scroll.bottom){margin-right:unset;overflow:hidden}.invisible-scroll.bottom>:first-child,:host(.invisible-scroll.bottom)>:first-child{box-sizing:content-box;margin-bottom:-22px;overflow-x:scroll;overflow-y:hidden;padding-bottom:22px;padding-right:unset}:host([disabled]){filter:contrast(.5) grayscale(1);pointer-events:none}*{scrollbar-color:#5c5c5c hsla(0,0%,100%,.004);scrollbar-width:thin}[disabled]{filter:contrast(.5) grayscale(1);pointer-events:none}::-webkit-scrollbar{height:8px;width:8px}::-webkit-scrollbar,::-webkit-scrollbar-corner{background:hsla(0,0%,100%,0)}::-webkit-scrollbar-thumb{background:#5c5c5c;-webkit-border-radius:8px}::-webkit-scrollbar-button,::-webkit-scrollbar-button:horizontal:end:decrement,::-webkit-scrollbar-button:horizontal:end:increment,::-webkit-scrollbar-button:vertical:end:decrement,::-webkit-scrollbar-button:vertical:start:increment{background-color:transparent;border:none;color:transparent}:host{font-family:Calibri,Roboto,sans-serif;margin:0;width:100%}:host .colorWheelWrap{margin:10px auto;position:relative;width:210px}:host .colorWheelWrap .colorWheelclickArea{height:210px;position:absolute;width:210px;z-index:15}:host .colorWheelWrap .colorWheelCursorContainer{height:210px;position:absolute;width:210px}:host .colorWheelWrap .colorWheelCursorContainer #colorWheelCursor{background:url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAANIAAADSCAYAAAA/mZ5CAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyRpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMy1jMDExIDY2LjE0NTY2MSwgMjAxMi8wMi8wNi0xNDo1NjoyNyAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENTNiAoTWFjaW50b3NoKSIgeG1wTU06SW5zdGFuY2VJRD0ieG1wLmlpZDpDNUU5RUYyMTUzM0QxMUUyQjA0QTkwQTYxQUZDNEQ4OCIgeG1wTU06RG9jdW1lbnRJRD0ieG1wLmRpZDpDNUU5RUYyMjUzM0QxMUUyQjA0QTkwQTYxQUZDNEQ4OCI+IDx4bXBNTTpEZXJpdmVkRnJvbSBzdFJlZjppbnN0YW5jZUlEPSJ4bXAuaWlkOkM1RTlFRjFGNTMzRDExRTJCMDRBOTBBNjFBRkM0RDg4IiBzdFJlZjpkb2N1bWVudElEPSJ4bXAuZGlkOkM1RTlFRjIwNTMzRDExRTJCMDRBOTBBNjFBRkM0RDg4Ii8+IDwvcmRmOkRlc2NyaXB0aW9uPiA8L3JkZjpSREY+IDwveDp4bXBtZXRhPiA8P3hwYWNrZXQgZW5kPSJyIj8+2P30OQAAAhxJREFUeNrs08ENACAQAkHpv2g0tuDnTGZKgGzaLuBNhARCAiGBkAAhgZBASCAkQEggJBASCAkQEggJhARCAoQEQgIhgZCYdVByDzo/xRpCQkhCQkgISUgISUhCEhJCEhJCQkhCQkgISUgISUgICSEJCSEhJCEhJCEhJIQkJISEkISEkBCSkBCSkBASQhISQkJIQkJIQkJICElICAkhCQkhCUlIQkJIQkJICElICAkhCQkhCQkhISQhISSEJCSEJCSEhJCEhJAQkpAQkpCsICSEJCSEhJCEhJAQkpAQkpAQEkISEkJCSEJCSEJCSAhJSAgJIQkJIQlJSEJCSEJCSAhJSAgJIQkJIQkJISEkISEkhCQkhCQkhISQhISQEJKQEJKfhCQkhCQkhISQhISQEJKQEJKQEBJCEhIgJBASCAmEBAgJhARCAiEBQgIhgZBASICQQEggJBASICQQEggJEBIICYQEQgKEBEICIYGQACGBkEBIICRASCAkEBIICRASCAmEBEIChARCAiGBkAAhgZBASICQQEggJBASICQQEggJhAQICYQEQgIhAUICIYGQQEiAkEBIICQQEiAkEBIICYQkJBASCAmEBAgJhARCAiEBQgIhgZBASICQQEggJBASICQQEggJhAQICYQEQgIhAUICIYGQACGBkEBIICRASCAkEBIICRASCAmEBEIChARCAiGBkAAhgZDgM1uAAQCUoKCKoC5l9gAAAABJRU5ErkJggg==") no-repeat}:host .colorWheelWrap .colorWheel{background:url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAANIAAADSCAYAAAA/mZ5CAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyRpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMy1jMDExIDY2LjE0NTY2MSwgMjAxMi8wMi8wNi0xNDo1NjoyNyAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENTNiAoTWFjaW50b3NoKSIgeG1wTU06SW5zdGFuY2VJRD0ieG1wLmlpZDpDNUU5RUYyNTUzM0QxMUUyQjA0QTkwQTYxQUZDNEQ4OCIgeG1wTU06RG9jdW1lbnRJRD0ieG1wLmRpZDpDNUU5RUYyNjUzM0QxMUUyQjA0QTkwQTYxQUZDNEQ4OCI+IDx4bXBNTTpEZXJpdmVkRnJvbSBzdFJlZjppbnN0YW5jZUlEPSJ4bXAuaWlkOkM1RTlFRjIzNTMzRDExRTJCMDRBOTBBNjFBRkM0RDg4IiBzdFJlZjpkb2N1bWVudElEPSJ4bXAuZGlkOkM1RTlFRjI0NTMzRDExRTJCMDRBOTBBNjFBRkM0RDg4Ii8+IDwvcmRmOkRlc2NyaXB0aW9uPiA8L3JkZjpSREY+IDwveDp4bXBtZXRhPiA8P3hwYWNrZXQgZW5kPSJyIj8+ErkYiAAAID9JREFUeNrsnQuQG0eZx3sk7dPYkhNDxSGwk+OOkOfKMRUSDF45oSAvn7WYgvIBt3KIk6MuKcspHwWXS632UkWA88XaclKQSw7LQGII4aw9Y3BdKKx1EjioBGuBAxwOMhscnPNTWq+93l097vuknvVY1mN6diTNjL5/VZdeMyOpu3/9ff31Y6R8Ps9IJNL85KIssJ4kSQpCCpR5P4CfUQ4RSCT9igM0CUg+DlEc36NssWjjR66dZa2SHx4SkKL8rTCkAJRXknLHevJQFlhTCAzAhBCFIKFVChNEZJFIxqwSAnQS0jiUk0w5Qn0kkjGrlIKHNCSFcoNAIs1PSd5XIhFIJBKBRGq+RSLXzur9WQo2kEhkkUgkAolEIpBIJBKBZBdt3rxZhhSgnCCQSPOTDIlAIpBIJOeLwt9N0uFfLZC5tcFZ3vGl155W2G8Lk1T92uNOn+3yTc10+JYsSikXXOTKfMFSzez3RFhx9oPSvjKjUO4SSE4Exq8BRoWnr+SwfgApDiAlynxWWVfmJYAIr3ug5JMxVhzETfKEgNHM8TqKllGYqFd+8Vbf8uuPpgCeECuuH+rVeWrBKs2jD1WqXp7WqG8AcPgwDikCUMVOPdcpL/zYWbJeBJJl4EH3KshTikOREoCoEgxMAEK96tF8VwRgCnKA4wAVrb4lkBoOT1ADj1dbUeEz+dI24blx8wFJ9NwEf1R/+wAmgCpNUBFIzYSnVEHo70TBvRO5fF8DQUpxS1T6H8pBleBgpagGVBeFv2sDFIaEFWkXr2jeGqcENR1+kaCEUaskBCEPOtTaiUiFajukkwBWlGoCgSSs7/9cDkGKqC24DnjOq9gYdGCs/u7dzH6P6DljJbAL6fhXF4QhhaiGXCgKf5cAhJ1w3ilHXb7UcxpBOil4qfWXtp3BSj4ocM6mpZ4zQRELM3PUvQoe9gl8x8j0EQ/+vwOC/2cZfJfCGwdsVArRv4s/ezpGtYYskhagICSFuzI9mo8iGM7GCih4yWAjLBITi9ih0K0TtSjj0EfC88Iay4x5tB2sk0IWikBCgAKQErz/01PmkAH4XGbiYzxrZvKuY3WGwgh8igG3Lg6w+DhIpSKgWhkkDUD7dLhSEQMgsWOZziUNAEnonOxZyVOhwaimWIk1YgQU9ZEYB0g03Ix9JYxcrRHpj0A/yV+l4mqn8RT6H0uvPZ0oPYgvoQhs2bIlUibYoJ1+pD6vOBAM/aNheNgo4tZB38iv6RvpPg9/D/ShWiZs3hLjSP/20lXomvjuWfEbtcMsChJW4oQgSHjsqAoJT3iNFABjyrw3HspOllpMHs3DFGDn5vf5jLh1OqxRWRcSITo85C3sW750MJ0ikOwPkTqPLQXPA5e2FaAYELzMwKlc+1MLXTN6W2P8vphZwBgATAvuOYv0XKefBxuCely8fJb9CB6+ZeAnRDRuYQCACgFMjp4t4XI4RFigB3ilQZcncucNClawHaLXmsy1bWaVB1kRHnSbli2//qgMKQzJcrOtMfoGKQwJLdQy/psr/af07An3ew1Yo1GwRgmAJ8ytMp6/C147elDXkX0k7srFK7hw/dB3wUr+muh1F7lmHl/gmv37UstTT2iq9ZHMEs4E51YqNNfHyrOdM8fctxsAadXMEU+KlR+rQmjROjluSYfLgRAFa/SDYn+e7WYGrdIl8LDJ6pbHgKVSIEUhoet3Of7HzCnXG0asEUCU5C5dOSGkaK1C1EeyNkToPtSKSnl5QYcE+kqFkfzbbxiPOb1PydcoFdyw419d8D/s/JkeevpGUVZ9CQnm/3aAKcitkyMCES6HAOSHlGT6Q7t9YJVCOqwSArQe+lUyJMdDVCqcAgQJ3b71PC9qWSOfQOOE/ackAOUnkCwCEStGp3oFTx08nunYW6mjDWkIkr8VATICVG5G+loVl66S0NIdAJgCBFKTdc+K36hjKcKazru/lM0XKkApQGiBMMJH63D0ATWaSbk/b6BPpQYgbN/PtG0faWj0vdj6oTUKLPXMTRIVLcieI5mudy5tOzPOW9MowaMPKMwvPh0okjnlUpj42JyqQj9p/L6LCtas57ETIQKpDtq8eXNhdHzLli2pEojUgkscznQH+BKEfaLXzzM2i30gwsM4UPMYI9qEoXAOUaE84fl5MJUrf3LtjAn954SaoSUQMaaGVDPd6B4MC1wX3bj14BoGCYn5CWDAwdd+nqd6NQLnRbUQcQ2o1omXeYLZYKdZy4MELREOemKLlxj68Q3PVHAhVJgiTN8SbzwmABDFCAPTYMJyQss+qrMRC5WBaA6mP9z31mc4RFFeBwgkE2CKLeh7eZK5c+uqHFaAaSrv/tsaLeMwAOTnQQqSuTClIKH1GKpxaHDmqDtarV/lYdl166bjk1j2dvjvtgAJ3TnXoskVOg7tTWU7vpHJS/9YoRXsB4DCVOXrDhR6BjiXr1yofAggCukJTizJn1ihunkEkgkQMbGIUO/RbNc9OSbt1LyH7oYMENF+bY2DCS0+RlW1y/THACJZsDwH7ACTy2EQzcH0f5muawGmP+FlACDsD1FYuzmuHgZzCuNOsydd/2uwPC0Pk8vCEGHLNZ+I2jsAppUAUISqdNOBioElCuQz0ofmcZkgwCQTSAK690cr5cG+lxVWDHumDVwCzwnwa5AsoJ7HTsy7PPEar36isGcggaQDIvSrX4PHCICQNJD5KkQUlbMeTIbLE88FiDBIgTAFCKTqEGFro/rCg/A68efZ7pRA5k8QRLaBaUIvRNNH3QgPBopw30GcBha3mmWymkUqXcuCi/OSAJNcE6aca+rMi9e/eWp3gNw5i2tb513Kd9vvfDPLXFM6IMLnCJ9245kCTARSeWuEgYVyEZ3Cmn9cPzSdd6+uAFOauXLvz55c9AjTTCciWU/qtJ83XW97xM1y769YnkWIsE6oe26Uqg+sUphAKgkusNprWTYez3Rsm8i231uS+XN9Ij4KHiWYrA0RK077iVXoM6XzGWn1dHHmQ62907cCTH4C6ZziTN8SiN7JnOfbRzOdT/LMvyCwQDDZA6IKAYh0ZtI1NHPStZvp33vQEv2lpoOE0TkmuLp1Nu/a/OZs14FKgQWCyR4QlcI0O+H6dnZKepSJrSvr4WXduiABRAEmduuTc7EFJo1Ui84RTPaASAtTblraa/BrBnhovPVAKgl1i2rkiQ/tr9kKEUz2gEjVu79zFF38YYNfFwWY5Fa0SGiNjFTuwloWvQcTTPaASCN09ccMfCW6g/6WAwksSpz/cdFMC8K5QhNQCSbbQIRWKcUbSpHZD7hcYxm3aK0D0l/vvTUJKXI4050CKPwC5nwIjk8Y+U6CyfoQaWBKsnMb8dd087FBxnN+vWppCBI++hwPEgCErU0vDzIo+BrgwIG1VTVaoTE4LjKf7yaYrA+RBqYoq37L0cKeG3BccOaIJwjwKKw4hQjrVtjxIJW0NIXtawEmBawTdhTlCpmHmWbKJiUEk/Uh0ijEyq+yLey5AQAxDUDa2Q/hRlulhoLErVG56R6FWyfiTkCQ0M/dVJqhYI0Us34HwWQLiLT9Ja2GAaAwpGgZgLQNdNixIOnwe1WgwseznYO85dnBAxOmimCyNkQamPDauJlKOndWeggAwj61nnv/NtQqNQykKtaoLFAzedcQADVZz5aFYLI2RBqYIrPHPDszE+6Hmf6pQw21So20SEYCBU+JhroJJmdBpCqfY98xcFrDrFJDQBK0RqrG//PWvbFG/D6CydoQoa7Zdxi/b1TwtIZZpUZZpEiDziGYHAjRPOtEQ6xS3UGyujUimGwDkaWtUiMsUsDq1ohgsj5E86wbQduDBJYFLRLOWhjXeUpTrBHBZAuIRK1S4dalcI7f1iC9d/faECQ/gJGAJDN99yKNWKHyEEzWg0igjqgAyZBiv7jmMhlS2JYgAUBYADjyfACeK5Cif55dkKwBVNOtEcFkeYiqWaXCrUsRoJmj7gTCAwknwL4GaSs899sOpBK/FIMNG1WoACg/pHAZoCJWq0ytCpNVIapQVwoAZdKu1QCQD4BRVHjY+dsYhOwOEisD1S6ACa1UYiLbvg1ej1jJGrUyTDaASLVKO/JZ9sTscfdOvFVMbkbaz+tWT6ODDnUBibt1a3QciqHJgclc2/0AlKVvudIqMNkBIlUAT2z2hPvefI79HdM3xNJTL/euXhbJCPmWv3eR02GyE0So6399KMHEN+UPOhmkkZdXf88W9y9yKkx2g2geDbA9QBJw67RK2KnSOQ0mG0NkBKReDIfbwSI50q1zKkw2hwjdu7gV3DsrgDQGbp1ix0pod5jsDtE8GuKQHUASdevsXIC2hclBEFnCvTMVJJwOZMDM2v5O43aDyWEQGXXv/JYFCVy0JCQspH5IO3T8Odu6dXaFyWkQaZSo8Xma10mcTbOYw2dNkN6+69N+TABHHFKIQ7WMFTeAHHeaW2c3mBwMUSXPRoWnH8DxQQpBik0f8fh++jY5YOaXe0z+Mwc4UIyDA9amGwsOJw7GL3JPZzuk7FoekOhxgltXDiaosIzDFIDXKYKoYSBt5/Dg8zgAg94O9oX8AA4GGDAP5jZPgfcW33RESVkKJICntPPWw9PcDz+R7VBbiWSblPuuEnxacWCBWg6mFoAI+0mpn7/znYPZs66bWXEx6YDOflLCjO8307XTGwXB+XV9s3nXXzEHyypuXitApAogcvGGW+/WBqYFHMwESdTnTDKHq9kwtRJEXKIejmxFkHwEknVgakGIjIBkSYsk+qNSLVK4DYepRSFiNx1RRPs7su1BeqP/mwnWQmoUTK0KkUYiA7M9lgLp7bs+7WNid6Ieb8ECrjtMBJF4l8Gs8SSzLJKoW6e0aCHXDSaCyHDfW7YzSIkWLuiaMN1xxx3Xvu997/v+1VdffWjPnj0/fP311x+85ZZbji5fvvynN9xwwwqCyNRG2hSQzBqQFW1ZUy1e2GUHbRGSiYmJHx48eHChelwgEGDPPvssPl2STqeXxOPxF1euXHmmu7t7YO/evc8RRPO2SKZE7syySDglA28GhfOaRuvwZx1vmQCix3/5y1++qIWoVF6vlw0MDLD9+/d333bbbd+Fc0YIIkMWCW9gN8LrbNSML5Xy+Xxd/g0PQPh5kjWPGClZ/Eb/N1NU5kXdfPPNe/ft2/eRcp+hRYLPyp43OjrKHnzwwZdefPHFD1AunhdAUCv1KAdL4Q2OctMRpS79c1NcO+nZe6MXmsjuSq2Fkv/4EwQRF7pzYIk+YuTcvr4+tmHDhhWgoZdeemmQcrOomaPuYU19lHkKFMiS3nVhPub/EKgLSJIkBTU/pEAzWC6lhp/ZR0UorkOHDj0/PT1t+Hx09aDf9E/wlEAyuT4CB+hVBTUBiSRwEK/ZR8ITIWH/JcZPxguFmMmrCUlF3XrrrR87fPhw13yvEw6HXTfddNO/U47WBcjtGqu2C/iI6LFIUQ6Pv4YFIpkggOhhM66DLl53d/dH4elnKFfNF7AQ4oYmwRmJVASJmzFcw7GeIGqMjh079hdmXevqq69eRDlad/n09JG0fSIEy8/OhQbRNzzv/jKbN2/2qxfuul7yTXn0R/9w3ITKxFxdfPHFLsrXoj7S1e5rn5oxVB+3bNmSKNNXSmgYCdcCSSmhDiNrCR7t8FfwHwudsI6MGEjM2O0wSZSvujTb0SYEUkm+Jcp8nlC7PKzC9gjnjSMBeQq3PkHNe+gPBuC9ioUkPXtvQiRKkv/4ExIVN2OXXXbZ7BtvvFF1CKLaOFJJq5qH1tRFuVoIcQvVx778H8rWR6j7WOf3Qd2X+Os47zNdsAlqacaj2VqDJ2AInF+IInZ1Und394RZ1xofH89SjtZdiUpW31USnUDiVvGXMaSRm7Q45aH5Wrp0acKM66TTafbHP/7xZcrRhoDk5fGDin0kFaYEa/HZ2Q1zQUZH13q93vzExPwM07Zt29gll1xyD+WoueIsSJrXSe3raq4dqcF6z3ves2eeLh17/vnnf79nz55fUW42T6bMtct//IlAtc9dO8PaiavU59LoZz/72Z1XXHFF6tVXX/WKnosuXSgUmgbL9m7KyXM6scincK8KLYjSn36l7qsNTJv9DbCo4UGZnZskiI/l1sUvy62L0lIKdm5R3u7du3sApgsG/CpF7RCiYDCYueqqq37X1dX1Qavs6GoF7fIuL1epcemEOqSjcMBM68K4TIIIAxMneXAC5ybhBMpqG/XJVNznr2w9ePDg4uuuu+53HR0dNc8bHh5mt91222EArA0g+lfWIndb1wlRJe+ol9fJQV5H9yFwkBKWAYk1cT8xJ0CkLsobGxu78pZbbrkOgVqyZEkhnJ1KpdjIyAgbGhpi999/f/7GG2987emnn/7AT37yk0vx81a527qARBtpUzwjs5aaJ5jYNH4/QVR+ZSsPGlypOTbwwgsv4FL0SKXrWXXjfpuApJjxpWZZJNGC8xFE5i4PJ8tkuJFOWgYkA4GDPoLI/D0WCCb7WyQ1KiISoJAJIvNFMBWCCrrVn37FciCJ/iCZICKYzNQu73JRt27UrO82EyRR9y5AEBFMJkv0fypOAMlHEBFMJivgBJBEI3d+gohganKgIWk5kHLrookKH6W5L4q7sA6xvHudlO18WMp2Mfe3vuAjiAgms3R8kdc32dW9ZdbjWcf07fxrSYuEwm1gcXO+Tay4rmkxAOYDaMKQUpCCUq59J2PSQ6wYAg8SRASTGXrqHTejh7Nmuq1t80T3gp0AVQhSClK4P/0KLn1YzOvkJl5HR82czFq3LYvB2uAfC3FYKs2525H91CMhgqjqNdHvrzqzQfB6mN9hfs2Ug0DCRmJjhY/xfly4ODV2959+XJfJ0i6T4fFBikJCk3mA/7Fqd0ULEkRkmUxStbrUw+viAQBOQeggyZYFiRUjcbXg0coL0AUJIoLJBLdOb51TofJbFiRw09ASjZnYkhBEBJMeiXYP0uDixS0LElesVUCy+02+HASTaB0yfTOfeoAk+iNt6d455U55doeJ93V6HAdSK7h3TrvdpM1hEq07prt19bJIjIlv5xUkiAimBvWP6rJHY71AEq1gtnDvnH7jY7vBxN26XseCBO4dDnqN6zW1jEk/kHJt1xBEBJOITnd235hn0s5iHWqeW1dPi1SLfPzjO1he+pSU7YxK2Y4VLO9+2LNjSCaICCY9+spVH/VNt7V/7eRC7+0nFvqiOZfrU6w4ty7daGtUb5BiZeFhrB/gkSEpUq7jcVbcNEXdHDFCEBFMOhXm9QbTYGrBoscBKAUSNsb9FaBK2A4k7t6NqfDAax/AE4aEI8pKCUCqBqxklVoVIqvDhNaIXXjDLy+vUwiTH1IY3Dgfh2qYnZtvVxfVbdJqqQCQEC+UWlvz7sgMDIYIornfEWAmTlo1+BtCzEITXQGkCKu9/Vua17fo537zH3X/za5GAAQJLdB2HRBZwiq1uiWysmWqYI3Kac5CcfDsDRIrLv8VHXmOEEQEU42+kV55WQP2B2kESEagaIpVIoisDZOANWp4w1x3kKC/o/CAg6iiBBHBVAYI0dvfjEIfKeEEi2S0RVgDVilAEBFM3Bqhh7LRitaoYSDNwyqFCSKCaR5ANMQaNdIiGcmIUSnXkWr7+leCBFFrw/T5G9f7T3d1vYWJ74waaVReNAwkAas0Wtyyq8vH8q4BeB0DmGSCqDVhAojwmvHptva1JxZ5fTNtbRt0AtUwa9Roi1SrhcDMWQUARaVc+9fYuVm92LmMEUQtCxNeVx0+6cV96wAo/L5VNYCKNDIPGgoSt0pDJW/j1I3+wp532a4QPN/FLozM9IFVihBErQUTWCOsDwMlb2Pd2A4whSEFKwDVUGvUDIuktjBpDtB6gEsGgBReuQeqnDcIMAUIotaACSCSWfUhkDWQkgBTCqAJlAAVavR/bzhIAA7OewogQJCw/4ORuQNM3wItPN5HELUETHFWe8wIXb4DAF0ELRAH6nJ4VBwPEocpiUBAwszaKnBqj5H+EkFkL5gAjCgTW/k6COckMDDRDIiaBhKXn5tnUa3hVowgciBMAANaFSMDr7iXfKBZ/7dpIM3e9Tms3MMGT48ATH6CyFkwqaFug1838qX/3h5vOZA4TGhZxgyc6q3RESWI7AlTjInPpUONNyPAYBmQuDCEmRY8Z4xlO4+1PbktCclHENkCJqzo8UowbfjwptjJhYvOMGP3dQ2BNUq1NEhglbBzKDKnbohlu5KMSWt5hzShhYkgsixMSV7OF8CEEMHDQE5yrTu+yKewC8caq9YHgCjR7P9nBYuEMGFG1po+hFZrFUAks/PHm+ZgIojsB5MKkeawAYAJy3gZq72l2yhAFLHCf3NZKJ/DVTIO7wQos+LMh3KDtr2uPHvhrNv1AkFkH5juuXXTMxXKE2HCY/y87Cs1rCGr/C/LgARWKcXKb128CT4LAkRRVmXmQ05i13zj8rd7h6/oiVN1tT5Mp36bncjn2LoqhyFMUbA4WCfWl+lHY79IIZDKw4St1aa5gAKYd3gvCm5bjFWfPlTQlNv1jtI+E8l6QncuN8tW6zh0AI8FYLD8A+xchHe4maFuy4PEYYryFiiAYOmFqFyfiaqsNSESLE8VpiQkP29oI1b7Xw3b186IDECk1VgBxg332/qGw1bY166JEGm148n/2hqy6n9zWRgimc3vdi+ylOmMtH/1KZnsQHO19mNDvk/0P/TP8yzPIIAoE0iiLt6G+xXuF6cNnJ6Wsh2PgsHFOVtJgClI1blpEGEZJjNuz0OTXd1PGi1PrAtgkRQCyRhMSQMwpVnO8zcs73qAv8YpJ7sAphgk6jc1FiJ0R/cxvsJ1pq1989n2jnuFy7MIUdLK/9Vl9cLQwDShN9OlXNsXWZkN+jEIATD5qYrXHSAZUoKV2Z/7TGfXlzNu92qdME3YASJbgITaeHBc+cTrb77pzuenakKUKQzaVlrLgu8fAJjCVN3rBhG60Vjx+yoc0jOxYOFnanoaEptc8C7X773XuRU7/G/Lg6RO+7lkavqRrCS9v0LmqxDhsXrWsmwFmOLk6pkbUIAUY+X33CjVwIlFPn8VmNIszz7oWSDdzapMdCWQxCQzPu2nQp9JhQhbLpFBOlxUqABMAcJg3hAhFAkmFtqOAkypSuWJ7pxmOpHly8jS40iV1PbkNrXgUDhWhJG5RBV3oprGpWwXtqSx6fs+aTk3wsrjSKvuiqKlCF00kUZXzcg9gMe+99ygf8OHN51XnnboE9myj1QlAKFCFDYIEZNy7d/mneLXOh57OgKJ3D0dAEFCsLHh2TrZ3f0SMxbW7gVrFuXgBOwKkW0tklZ8wPU1g6cP8b30ekpci8Kd3sBCNX1WhJUsErdAYXbhPYrSi09NfBkq0xeNXhosU8LO9dDFbK6Zz96NreKQgVNH+X56pTdBm7vTG1moshao3L1/vScXLupglZc8VBOuQ0vaPY9cTihogAkLeZWAe6GuZanWyhNQRYhCVQDSKjzV0YER03GBMugHSxSClCKQrAMTugayzlYxBNYowPTdklMD1DNf6Bz+nuOB6t0Y8628e9udABECpPfev96pjs71TN9iO5xQ7AeAHLN2zOOkCgAwFRYH8uBDpY0nh+G4OFgYRfDyXinneRc8ngSYcIMOrATxsxvXKk6BhxUnlWJaM93W/nj39JTovX9xP+7oRRPpIVb5ruNDAFDEaY2PhzlQAEqUh8Nj7PxZDtgSopsWYeI3iB5nefcS/ryPp60A1Rj/HttBVQqP9rOz7R0fAJBGmVg0FC1XGEHhk1X7Sly5oN2DCpVk+6hdNfGZC+oS9eLAbTHAoDDx/dPWS9nOaI3zTIfK7KgdwCNzcEKsxrbAC6cm17VlMjsFvwLzWQar5ONBBC93tx3RF2opi1Ti6oVwOhA8+uB1klsjUYjGAaKUjvN6uUtZsFRScZ8JlDL1wO1NaYkve2gXgoiV2nfxRDrMBPbUPtX1ls6LTqXmY5UQVhmeR5nD5WEtIOwTaf14A5eIMGOL0uZcyK5Hf6C21kmeFPU5QJaaJywIip8nfB7ggZdS93WEiW1OH+T/YZ9oX2nVXdHYPgcFE1ratSsnsEh+7u7pbWXHp+/7pAwWRo9F0moTWCSRO23guFaSwzCnztyMryM/60u7F1zgKl40kUpyF03X7/JNTv6DO5f9F8EsWwxWKS6QX2jBIvu+Hk60Ur1qOZA0QAV4a1urgqznbt0uoYzNtd/B8u49giAxETcKQBJyuzzZ7Grv6cndon1DAEnRYZVaEiBVLtaiAiuTgIQwVbsX6SgcEzPg1o0BRO2C5xgJTghV2ozb/ZdMfPZBkMMxWgWgVXBMoFUhammQdAIV0fQVRCu4vwEgiZ6D/SbRfssaHiaPlLq8BBCBpAcotEYJ6BsFmXiUL2YApEQDQPIb/B6tVSrc+xdeywQQgaQHqKBBazR+duNaDAKITiUSjtwderhftCL7x4ZDChO/J5WaByEOUIxqCoGkFyi1YmO4fL1A30J1nYTWR009cLvRGdAi64C8Goupr69X3Nm0MGQAAClUM8rLQ1lQXWBdUrzixfiE1bJTarRuXdejP5CFgxPGlRSBFgdoLy7CXik0P8IbgwS3XiQCqWFQBXhrX3DrAKRAAwINhkDCgAMAkujdGEN4e0vgicNnKSppAqkpUOFrHpRQFTAAg1GJQihrXFaZ4CGQrAaWNqyMcGEgwM8rqzp9x1sni1St/6ROR1L4byp8F1olKjUCydKaeuB2bcU9T9ztk3nC5z4TQBrXfF+Kv5c89HA/WZoGqWWnCNlFTrqti5NF4W8SiUAikci1I5HIIpFIJAKJRCKQSCSricaRrNyBlSTtHgwJ6M8mKFcsWlYUbLA0SAiOzIqDrQhVEsorQDlDrh1JXDEODwLVx60UiUAiGRTCNAZQJSkrCCSSuAbBCqH/jbsYxSk7CCSSMeGG9MtYcaUqQhWiLLGeKGpnA3F3LgkQBdm59UQkskgkUQFE2EcyugsQqd7lQ+FvS8OD0KjLyHGRHkbwwpQzBBKJ5Ej9vwADADHZsbNIjawEAAAAAElFTkSuQmCC") no-repeat;height:210px;width:210px;z-index:9}:host .colorInputWrap{margin:10px auto;text-align:center;width:100%}:host .colorInputWrap .inputContainer{align-content:center;display:flex;justify-content:center;width:100%}:host .colorInputWrap #colorInput{background-color:#fff;border:1px solid #7d7d7d;font-size:12px;height:20px;margin:auto 0;text-align:center;text-transform:uppercase}:host .colorInputWrap #colorInput.error{background-color:#e4b1b1;border:1px solid #811f1f}:host .colorInputWrap #colorInputSubmit{cursor:pointer;display:inline;height:24px;margin:auto 0;width:24px}:host .colorInputWrap #colorInputSubmit:hover{background-color:grey}:host .colorInputWrap #colorInputSubmit img{height:inherit;width:inherit}:host .colorInputWrap .errorMsg{color:#811f1f;font-size:12px;margin:5px}:host .colorInputWrap #colorCurrent{background:#fff;border:1px solid #000;display:block;height:30px;margin:5px;width:30px}:host .colorGrid{margin:0 auto;padding:0 0 5px;width:auto}:host .colorGrid .colorField{background:#fff;border:1px solid #000;float:left;height:30px;margin:5px;width:30px}:host .colorGrid .colorField:hover{box-shadow:0 0 6px 2px #bbb}:host .colorGrid .colorField.active{box-shadow:0 0 6px 2px #ff7676}:host #colorWheelCursor{height:210px;position:absolute;width:210px;z-index:10}`;
|
|
var __defProp = Object.defineProperty;
|
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
var __getProtoOf = Object.getPrototypeOf;
|
var __reflectGet = Reflect.get;
|
var __decorateClass = (decorators, target, key, kind) => {
|
var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc(target, key) : target;
|
for (var i = decorators.length - 1, decorator; i >= 0; i--)
|
if (decorator = decorators[i])
|
result = (kind ? decorator(target, key, result) : decorator(result)) || result;
|
if (kind && result)
|
__defProp(target, key, result);
|
return result;
|
};
|
var __superStaticGet = (obj, member) => __reflectGet(__getProtoOf(obj), member, obj);
|
var __async = (__this, __arguments, generator) => {
|
return new Promise((resolve, reject) => {
|
var fulfilled = (value) => {
|
try {
|
step(generator.next(value));
|
} catch (e) {
|
reject(e);
|
}
|
};
|
var rejected = (value) => {
|
try {
|
step(generator.throw(value));
|
} catch (e) {
|
reject(e);
|
}
|
};
|
var step = (x) => x.done ? resolve(x.value) : Promise.resolve(x.value).then(fulfilled, rejected);
|
step((generator = generator.apply(__this, __arguments)).next());
|
});
|
};
|
let NcsPickerComponent = class extends BaseElement {
|
constructor() {
|
super();
|
this._preventEvent = false;
|
this._ncsMap = {};
|
this.currentCode = "";
|
this._disableFade = "";
|
this.manufacturer = "";
|
this.onColorFieldClick = (e) => {
|
e.stopPropagation();
|
e.preventDefault();
|
if (this.shadowRoot && this._ncsModel) {
|
const currentElement = e.currentTarget;
|
this._ncsCode = "NCS_" + currentElement.getAttribute("data-ncsvalue");
|
this.shadowRoot.querySelectorAll(".colorField.active").forEach((value) => {
|
value.classList.remove("active");
|
});
|
currentElement.classList.add("active");
|
this.RemoveErrorMessage("all");
|
this._ncsRGB = this._ncsMap[this._ncsCode.replace("NCS_", "")];
|
if (this.colorInput) {
|
this.colorInput.value = this._ncsCode.replace("NCS_", "");
|
}
|
if (this.colorCurrent)
|
this.colorCurrent.style.background = `rgb(${this._ncsRGB})`;
|
this.dispatchColorChange();
|
}
|
};
|
this.onWheelAreaClick = (e) => {
|
e.stopPropagation();
|
e.preventDefault();
|
if (!this.colorWheelCursor)
|
return;
|
const boundingClientRect = e.currentTarget.getBoundingClientRect();
|
e.x - boundingClientRect.top + window.scrollX;
|
e.y - boundingClientRect.left + window.scrollY;
|
const MiddleX = boundingClientRect.left + boundingClientRect.width / 2;
|
const MiddleY = boundingClientRect.top + boundingClientRect.height / 2;
|
const MouseX = e.pageX;
|
const MouseY = e.pageY;
|
const rad = Math.atan2(MouseX - MiddleX, MouseY - MiddleY);
|
let deg = rad * (180 / Math.PI) * -1 + 180;
|
deg = Math.round(deg / 9) * 9;
|
const AbstandMitte = Math.sqrt(Math.pow(MouseX - MiddleX, 2) + Math.pow(MouseY - MiddleY, 2));
|
let group = "N";
|
if (AbstandMitte <= 10) {
|
this.colorWheelCursor.classList.add("hidden");
|
group = "N";
|
} else {
|
let NCSColorClear = false;
|
this.colorWheelCursor.classList.remove("hidden");
|
if (deg % 90 == 0) {
|
NCSColorClear = true;
|
}
|
const ceilDeg = Math.ceil(deg / 10) * 10;
|
if (deg < 90 || deg == 360) {
|
if (NCSColorClear) {
|
group = "Y";
|
} else {
|
group = "Y" + ceilDeg + "R";
|
}
|
} else if (deg < 180) {
|
if (NCSColorClear) {
|
group = "R";
|
} else {
|
group = "R" + Math.abs(90 - ceilDeg) + "B";
|
}
|
} else if (deg < 270) {
|
if (NCSColorClear) {
|
group = "B";
|
} else {
|
group = "B" + Math.abs(180 - ceilDeg) + "G";
|
}
|
} else if (deg < 360) {
|
if (NCSColorClear) {
|
group = "G";
|
} else {
|
group = "G" + Math.abs(270 - ceilDeg) + "Y";
|
}
|
}
|
this.colorWheelCursor.style.transform = `rotate(${deg}deg)`;
|
}
|
this.GenerateColorGrid(group).then(() => {
|
this.dispatchEvent(new CustomEvent("onRender", {}));
|
});
|
};
|
this.onColorInputSubmit = (e) => {
|
e.stopPropagation();
|
e.preventDefault();
|
if (!this.colorInput)
|
return;
|
const InputValue = this.colorInput.value.toUpperCase().replace(/\s|NCS/gi, "");
|
if (this.CheckNCSCodeIsValid(InputValue)) {
|
this._ncsCode = "NCS_" + InputValue;
|
this.SetColorWheel();
|
this._ncsRGB = this._ncsMap[InputValue];
|
}
|
};
|
this.onFocusColorInput = (e) => {
|
e.stopPropagation();
|
e.preventDefault();
|
e.currentTarget.select();
|
};
|
this.onColorInput = (e) => __async(this, null, function* () {
|
if (!this.colorInput)
|
return;
|
const InputValue = this.colorInput.value.toUpperCase().replace(/\s|NCS/gi, "");
|
if (this.CheckNCSCodeIsValid(InputValue, true)) {
|
this._ncsCode = "NCS_" + InputValue;
|
this.SetColorWheel();
|
this._ncsRGB = this._ncsMap[InputValue];
|
}
|
});
|
}
|
getColorByCode(code_) {
|
return __async(this, null, function* () {
|
const codeDefine = code_.replace("NCS_", "");
|
yield this.getNcsColors();
|
return this._ncsMap[codeDefine];
|
});
|
}
|
dispatchColorChange() {
|
if (this._preventEvent) {
|
this._preventEvent = false;
|
return;
|
}
|
if (this._ncsCode) {
|
const ncsDefine = this._ncsCode.replace("NCS_", "");
|
const rgb = this._ncsMap[ncsDefine].split(",");
|
if (rgb) {
|
const colorChangeEvent = new CustomEvent("colorChange", {
|
detail: {
|
code: this._ncsCode,
|
rgba: {
|
r: rgb[0],
|
g: rgb[1],
|
b: rgb[2],
|
a: 1
|
}
|
},
|
bubbles: false
|
});
|
this.dispatchEvent(colorChangeEvent);
|
}
|
}
|
}
|
GenerateColorGrid(group) {
|
return __async(this, null, function* () {
|
var _a;
|
if (this.colorGrid && this._ncsModel) {
|
let currentColorField;
|
const currentNCSDefine = (_a = this._ncsCode) == null ? void 0 : _a.substr(4);
|
if (!this._disableFade)
|
yield TransitionHelper.fadeOut(this.colorGrid, 0.3);
|
this.colorGrid.innerHTML = "";
|
if (group) {
|
for (const color in this._ncsModel.colors[group]) {
|
const colorField = document.createElement("div");
|
colorField.classList.add("colorField");
|
colorField.style.backgroundColor = `rgb(${this._ncsModel.colors[group][color]})`;
|
colorField.setAttribute("data-ncsValue", color);
|
colorField.innerHTML = " ";
|
colorField.addEventListener("click", this.onColorFieldClick);
|
if (currentNCSDefine && color === currentNCSDefine) {
|
currentColorField = colorField;
|
}
|
this.colorGrid.appendChild(colorField);
|
}
|
}
|
if (currentColorField) {
|
currentColorField.click();
|
}
|
if (!this._disableFade)
|
yield TransitionHelper.fadeIn(this.colorGrid, 0.3);
|
}
|
});
|
}
|
CheckNCSCodeIsValid(NCSCode, showErrors = true) {
|
if (!this._ncsModel)
|
return false;
|
const RgxTest = /(S[0-9]{4}-[YRBGN])([0-9]{2}[YRBG])?(\[#TZ#\](.*))?$/;
|
NCSCode = NCSCode.toUpperCase();
|
if (!RgxTest.test(NCSCode)) {
|
if (showErrors)
|
this.ShowErrorMessage("ncsWrongFormat");
|
return false;
|
} else {
|
this.RemoveErrorMessage("ncsWrongFormat");
|
let ncsFound = false;
|
NCSCode = NCSCode.split("[#TZ#]")[0];
|
console.log("ncs code check: ", NCSCode);
|
for (const i in this._ncsModel.colors) {
|
for (const b in this._ncsModel.colors[i]) {
|
if (NCSCode === b) {
|
ncsFound = true;
|
}
|
}
|
}
|
if (ncsFound) {
|
this.RemoveErrorMessage("ncsNotFound");
|
return true;
|
} else {
|
if (showErrors)
|
this.ShowErrorMessage("ncsNotFound");
|
return false;
|
}
|
}
|
}
|
SetColorWheel() {
|
var _a, _b;
|
if (this.colorWheelCursor && this._ncsCode) {
|
const Farbe = this._ncsCode.split("-")[1];
|
const FistCharacter = Farbe.substr(0, 1);
|
if (FistCharacter != "N") {
|
(_a = this.colorWheelCursor) == null ? void 0 : _a.classList.remove("hidden");
|
const anteil = parseInt(Farbe.substr(1, 2));
|
let deg = anteil / 10 * 9;
|
if (FistCharacter == "R")
|
deg += 90;
|
else if (FistCharacter == "B")
|
deg += 180;
|
else if (FistCharacter == "G")
|
deg += 270;
|
this.colorWheelCursor.style.transform = `rotate(${deg}deg)`;
|
} else {
|
(_b = this.colorWheelCursor) == null ? void 0 : _b.classList.add("hidden");
|
}
|
this.GenerateColorGrid(Farbe);
|
}
|
}
|
ShowErrorMessage(Message) {
|
var _a, _b, _c, _d, _e;
|
if (this.shadowRoot) {
|
let ncsWrongFormat = this.shadowRoot.querySelector("#ncsWrongFormat");
|
let ncsNotFound = this.shadowRoot.querySelector("#ncsNotFound");
|
switch (Message.toUpperCase()) {
|
case "NCSWRONGFORMAT":
|
if (!ncsWrongFormat) {
|
ncsWrongFormat = document.createElement("p");
|
ncsWrongFormat.id = "ncsWrongFormat";
|
ncsWrongFormat.classList.add("errorMsg");
|
ncsWrongFormat.textContent = "ncs Code hat ein falsches Format.";
|
(_a = this.errorMsgWrap) == null ? void 0 : _a.appendChild(ncsWrongFormat);
|
(_b = this.colorInput) == null ? void 0 : _b.classList.add("error");
|
}
|
break;
|
case "NCSNOTFOUND":
|
if (!ncsNotFound) {
|
ncsNotFound = document.createElement("p");
|
ncsNotFound.id = "ncsNotFound";
|
ncsNotFound.classList.add("errorMsg");
|
ncsNotFound.textContent = "ncs Code wurde nicht gefunden.";
|
(_c = this.errorMsgWrap) == null ? void 0 : _c.appendChild(ncsNotFound);
|
(_d = this.colorInput) == null ? void 0 : _d.classList.add("error");
|
}
|
break;
|
}
|
if (ncsWrongFormat && ncsNotFound) {
|
(_e = this.colorInput) == null ? void 0 : _e.classList.remove("error");
|
}
|
}
|
}
|
RemoveErrorMessage(Message) {
|
var _a;
|
if (this.shadowRoot) {
|
let ncsWrongFormat = this.shadowRoot.querySelector("#ncsWrongFormat");
|
let ncsNotFound = this.shadowRoot.querySelector("#ncsNotFound");
|
switch (Message.toUpperCase()) {
|
case "NCSWRONGFORMAT":
|
ncsWrongFormat == null ? void 0 : ncsWrongFormat.remove();
|
break;
|
case "NCSNOTFOUND":
|
ncsNotFound == null ? void 0 : ncsNotFound.remove();
|
break;
|
default:
|
ncsWrongFormat = null;
|
ncsNotFound = null;
|
if (this.errorMsgWrap)
|
this.errorMsgWrap.innerHTML = "";
|
break;
|
}
|
if (!ncsWrongFormat && !ncsNotFound) {
|
(_a = this.colorInput) == null ? void 0 : _a.classList.remove("error");
|
}
|
}
|
}
|
getNcsColors() {
|
return __async(this, null, function* () {
|
this._ncsModel = yield ColorPickerModel.getNCS({ manufacturer: this.manufacturer });
|
if (this._ncsModel) {
|
const keys = Object.keys(this._ncsModel.colors);
|
keys.forEach((key) => {
|
if (this._ncsModel) {
|
Object.keys(this._ncsModel.colors[key]).forEach((rgbKey) => {
|
if (this._ncsModel)
|
this._ncsMap[rgbKey] = this._ncsModel.colors[key][rgbKey];
|
});
|
}
|
});
|
}
|
});
|
}
|
render() {
|
return x`
|
<!-- NCS Eingabe -->
|
<div class="colorInputWrap">
|
<div class="inputContainer">
|
<div id="colorCurrent"></div>
|
<input type="text" id="colorInput" @input=${this.onColorInput} @focus=${this.onFocusColorInput} @change=${this.onColorInput} value="" i18n-placeholder="enter_NCS_code" placeholder="NCS-Code eingeben"/>
|
<button id="colorInputSubmit" @click=${this.onColorInputSubmit}><span>≻</span></button>
|
</div>
|
<div id="errorMsgWrap"><!-- Hier werden Fehlermeldungen reingeschrieben --></div>
|
</div>
|
<!-- Farbton-Kreis -->
|
<div class="colorWheelWrap">
|
<div class="colorWheelclickArea" @click=${this.onWheelAreaClick}></div>
|
<div class="colorWheelCursorContainer">
|
<div id="colorWheelCursor"></div>
|
</div>
|
<div class="colorWheel"></div>
|
</div>
|
|
<!-- Farb-Nuancen -->
|
<div class="colorGrid"><!-- Hier werden Farb-Nuancen reingeschrieben --></div>
|
`;
|
}
|
updated(_changedProperties) {
|
var __superGet = (key) => super[key];
|
return __async(this, null, function* () {
|
__superGet("updated").call(this, _changedProperties);
|
this._preventEvent = true;
|
if (_changedProperties.has("manufacturer")) {
|
yield this.getNcsColors();
|
this._ncsCode = "";
|
this._ncsRGB = void 0;
|
this.currentCode = "";
|
yield this.GenerateColorGrid();
|
}
|
this._ncsCode = this.currentCode;
|
yield this.SetColorWheel();
|
this._preventEvent = false;
|
});
|
}
|
firstUpdated() {
|
return __async(this, null, function* () {
|
yield this.getNcsColors();
|
this.SetColorWheel();
|
});
|
}
|
};
|
NcsPickerComponent.styles = [
|
__superStaticGet(NcsPickerComponent, "styles") || [],
|
i`${r(css_248z)}`
|
];
|
__decorateClass([
|
n({ type: String, reflect: true })
|
], NcsPickerComponent.prototype, "currentCode", 2);
|
__decorateClass([
|
n({ type: Boolean, reflect: true, attribute: "disable-fade" })
|
], NcsPickerComponent.prototype, "_disableFade", 2);
|
__decorateClass([
|
n({ type: String, reflect: true })
|
], NcsPickerComponent.prototype, "manufacturer", 2);
|
__decorateClass([
|
i$1("#colorWheelCursor")
|
], NcsPickerComponent.prototype, "colorWheelCursor", 2);
|
__decorateClass([
|
i$1(".colorGrid")
|
], NcsPickerComponent.prototype, "colorGrid", 2);
|
__decorateClass([
|
i$1("#colorInput")
|
], NcsPickerComponent.prototype, "colorInput", 2);
|
__decorateClass([
|
i$1("#errorMsgWrap")
|
], NcsPickerComponent.prototype, "errorMsgWrap", 2);
|
__decorateClass([
|
i$1("#colorCurrent")
|
], NcsPickerComponent.prototype, "colorCurrent", 2);
|
NcsPickerComponent = __decorateClass([
|
e("fv-ncs-picker")
|
], NcsPickerComponent);
|
|
export { NcsPickerComponent };
|
