import { i, x, r } from './query-assigned-elements-fea1f631.js';
|
import { e } from './custom-element-30fc6381.js';
|
import { n, B as BaseElement, C as ComponentService } from './base.component-813fc7cf.js';
|
import { o } from './class-map-a0fb5d87.js';
|
import { EventHandlerDispatchEvent } from './event.handler.model.js';
|
import './loading.component.js';
|
import { i as i$1 } from './query-1c86d710.js';
|
import './dot-flashing-loader.component.js';
|
import './rotating-dots-loader.component.js';
|
import { KeyFrameEffectService } from './key-frame-effect.service.js';
|
import { CardDataService } from './card.data.service.js';
|
import './toolbar.component.js';
|
import { ToggleToolbarComponent } from './toggle-toolbar.component.js';
|
import { StyleHelper } from './style.helper.js';
|
import { ImageService } from './image.service.js';
|
import { SVGIconComponent } from './svg-icon.component.js';
|
import { PopupComponent } from './popup.component.js';
|
import './popup-closer.component.js';
|
import './hr-item.component.js';
|
import { HRListComponent } from './hr-list.component.js';
|
import { ConfiguratorFormComponent } from './configurator.form.component.js';
|
import { AsyncBaseElement } from './async.base.component.js';
|
import { CardContainerUpdate } from './card-container-definitions.js';
|
import { CardContainerEvents, CardContainerPreFillEvent, UpdatedEvent, CardContainerPostFillEvent } from './card-container-events.js';
|
import { CardDataUpdateEvent } from './card-data-service-update-events.js';
|
import { CardContainerSettings } from './card-container-settings.js';
|
import { CardContainerStates } from './card-container-states.js';
|
import { CardContainerAdditionalData } from './card-container-additional-data.js';
|
import { CardContainersSharedData } from './card-containers-shared-data.js';
|
import './input.mask.component.js';
|
import { BaseMaskElement } from './mask.component.js';
|
import './information.mask.component.js';
|
import './open-cloud-id.mask.component.js';
|
import './share-link-per-mail.component.js';
|
import './request-appointment.component.js';
|
import { ProgPropertyModel } from './prog-property.model.js';
|
import { Perspectives, ZoomType } from './interface.js';
|
import './reset.mask.component.js';
|
import './step-based.mask.component.js';
|
import './container-mask.component.js';
|
import './messageNoCalc.mask.component.js';
|
import './iwoFurn.mask.component.js';
|
import './save-dialog.mask.component.js';
|
import './send-offer-request-mask.component.js';
|
import './file-upload-mask.component.js';
|
import './accordion.component.js';
|
import { AccordionItemComponent } from './accordion-item.component.js';
|
import './accordion-layer.component.js';
|
import { SliderComponent } from './slider.component.js';
|
import { EquipmentListComponent } from './equipment-list.component.js';
|
import { ClockController } from './clock.controller.js';
|
|
var css_248z$c = 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}@media (width >= 980px){.center-container>.content-container>.modal-header .manufacturer-logo-container .manufacturer-logo{left:50px;position:absolute;top:50px;width:200px}}@media (width <= 980px){.center-container>.content-container>.modal-header .manufacturer-logo-container{margin:15px auto 15px 15px}.center-container>.content-container>.modal-header .manufacturer-logo-container .manufacturer-logo{width:130px}}@keyframes modalFadeIn{0%{opacity:0;visibility:hidden}to{opacity:1;visibility:visible}}@keyframes modalFadeOut{0%{opacity:1;visibility:visible}to{opacity:0;visibility:hidden}}:host([active]:not(.fade-in):not(.fade-out)){opacity:1;visibility:visible}:host(:not(.fade-in):not(.fade-out)){opacity:0;visibility:hidden}:host(.fade-in){animation:modalFadeIn 1s ease-in forwards}:host(.fade-out){animation:modalFadeOut 1s ease-out forwards}:host[fullScreen]{background-color:var(--modal-background-color,#fff)}:host{display:flex;height:100%;margin:var(--modal-margin,unset);opacity:0;padding:var(--modal-padding,unset);position:absolute;width:100%;z-index:99}:host .background-filter{background:#000;height:100%;opacity:.6;position:absolute;width:100%;z-index:-1}:host fv-dimmer{z-index:1}fv-modal-container{display:flex;height:100%;position:absolute;width:100%;z-index:99}fv-modal-container.hidden{display:none}.center-container{display:flex;height:100%;width:100%}.center-container>.content-container.bg-image:before{background-color:var(--modal-background-color,#fff);background-image:var(--image-background);background-size:cover;content:"";filter:brightness(.4);height:100%;left:0;position:absolute;top:0;width:100%}.center-container>.content-container{background:var(--modal-background,#fff);box-shadow:var(--modal-box-shadow,0 0 7px 2px #464646);display:grid;grid-template-areas:"header" "content";grid-template-rows:minmax(0,min-content) 1fr;margin:auto;min-height:var(--modal-content-min-height,100px);min-width:var(--modal-content-min-width,200px);overflow:var(--modal-content-overflow,hidden);position:relative;z-index:1}.center-container>.content-container>.modal-header{position:var(--modal-header-position,unset);z-index:99999}.center-container>.content-container>.modal-header>.cancel-button{bottom:var(--modal-header-cancel-button-bottom,unset);left:var(--modal-header-cancel-button-left,unset);position:var(--modal-header-cancel-button-position,unset);right:var(--modal-header-cancel-button-right,unset);top:var(--modal-header-cancel-button-top,unset)}.center-container>.content-container.fullScreen{height:100%;width:100%}.center-container>.content-container.fullScreen>.modal-header>.cancel-button{margin:15px 25px 15px auto}.center-container>.content-container>.content{grid-area:content;margin:var(--modal-content-margin,unset);overflow:var(--modal-content-overflow,hidden);position:relative}.center-container>.content-container>.modal-header{display:flex;grid-area:header}.center-container>.content-container>.modal-header .manufacturer-logo-container{height:36px;position:relative}.center-container>.content-container>.modal-header>.cancel-button{background-color:var(--modal-cancel-button-background-color,transparent);cursor:pointer;display:flex;height:var(--modal-cancel-button-height,48px);margin:5px 5px 5px auto;width:var(--modal-cancel-button-width,48px)}.center-container>.content-container>.modal-header>.cancel-button:hover{background-color:var(--modal-cancel-button-background-color-hover,hsla(0,0%,94%,.1))}.center-container>.content-container>.modal-header span{font-size:20px;font-weight:var(--global-font-weight-bold,600);margin:auto}:host(.custom-position){bottom:var(--modal-custom-pos-bottom,unset);height:fit-content;left:var(--modal-custom-pos-left,unset);right:var(--modal-custom-pos-right,unset);top:var(--modal-custom-pos-top,unset);width:fit-content}:host(.custom-dimensions){height:var(--modal-custom-height,unset);width:var(--modal-custom-width,unset)}:host(.custom-dimensions) .center-container .content-container{height:100%;width:var(--modal-content-container-width,100%)}:host(.custom-z){z-index:var(--select-article-z-index, )}:host(.speech-bubble){background:var(--modal-speech-bubble-background,transparent);clip-path:polygon(var(--modal-speech-bubble-path,0 0,calc(100% - var(--modal-speech-bubble-default-path-arrow-size, 23px)) 0,100% var(--modal-speech-bubble-default-path-arrow-size,23px),calc(100% - var(--modal-speech-bubble-default-path-arrow-size, 23px)) 46px,calc(100% - var(--modal-speech-bubble-default-path-arrow-size, 23px)) 100%,0 100%))}:host(.speech-bubble) .center-container{padding:var(--modal-speech-bubble-padding,0 0 2em 0)}@media (width <= 520px){:host{margin:var(--modal-margin-mobile,unset);padding:var(--modal-padding-mobile,var(--modal-padding,unset))}:host .center-container .content-container .modal-header .cancel-button{position:var(--modal-mobile-header-cancel-button-position,var(--modal-header-cancel-button-position,unset))}:host(.custom-position){bottom:var(--modal-mobile-custom-pos-bottom,var(--modal-custom-pos-bottom,unset));left:var(--modal-mobile-custom-pos-left,var(--modal-custom-pos-left,unset));right:var(--modal-mobile-custom-pos-right,var(--modal-custom-pos-right,unset));top:var(--modal-mobile-custom-pos-top,var(--modal-custom-pos-top,unset))}:host(.custom-dimensions){height:var(--modal-mobile-custom-height,var(--modal-custom-height,unset));width:var(--modal-mobile-custom-width,var(--modal-custom-width,unset))}}@media (width >= 520px) and (width <= 980px){:host{margin:var(--modal-margin-mobile,unset);padding:var(--modal-padding-mobile,var(--modal-padding,unset))}:host .center-container .content-container .modal-header .cancel-button{position:var(--modal-mobile-header-cancel-button-position,var(--modal-header-cancel-button-position,unset))}:host(.custom-position){bottom:var(--modal-mobile-custom-pos-bottom,var(--modal-custom-pos-bottom,unset));left:var(--modal-mobile-custom-pos-left,var(--modal-custom-pos-left,unset));right:var(--modal-mobile-custom-pos-right,var(--modal-custom-pos-right,unset));top:var(--modal-mobile-custom-pos-top,var(--modal-custom-pos-top,unset))}:host(.custom-dimensions){height:var(--modal-mobile-custom-height,var(--modal-custom-height,unset));width:var(--modal-mobile-custom-width,var(--modal-custom-width,unset))}}`;
|
|
var css_248z$b = 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}@keyframes fadeIn{0%{opacity:0;visibility:hidden}to{opacity:1;visibility:visible}}@keyframes fadeOut{0%{opacity:1;visibility:visible}to{visibility:hidden}}@media (width >= 980px){:host .content-container>.content>.content{margin:auto auto auto 116px;padding:0 30px 25px}:host .content-container>.content>.content .head-text{font-size:48px}:host .content-container>.content>.content .main-text{font-size:48px}:host .content-container>.content>.footer{font-size:1.3rem}}@media (width <= 980px){:host .content-container>.content>.content{margin:auto auto auto 58px;padding:0 30px 25px}:host .content-container>.content>.content .head-text{font-size:1.5rem}:host .content-container>.content>.content .main-text{font-size:1.5rem}:host .content-container>.content>.footer{font-size:1rem}}:host{height:100%;width:100%;z-index:999}:host .content-container.bg-image:before{background-color:var(--modal-background-color,#fff)}:host .content-container>.content{display:grid;gap:50px;grid-template-areas:"content" "footer";grid-template-columns:1fr;grid-template-rows:1fr 100px;height:100%;padding:initial!important;width:100%}:host .content-container>.content>.content{align-items:center;color:#fff;display:grid;grid-area:content;grid-template-columns:1fr;grid-template-rows:115px 1fr}:host .content-container>.content>.content .head-text{font-weight:var(--global-font-weight-bold,600)}:host .content-container>.content>.content .head-text.fade-in{animation:modalFadeIn .25s ease-in forwards}:host .content-container>.content>.content .head-text.fade-out{animation:modalFadeOut .25s ease-out forwards}:host .content-container>.content>.content .head-text:empty{display:none}:host .content-container>.content>.content .main-text{font-weight:var(--global-font-weight,400)}:host .content-container>.content>.content .main-text.fade-in{animation:modalFadeIn .25s ease-in forwards}:host .content-container>.content>.content .main-text.fade-out{animation:modalFadeOut .25s ease-out forwards}:host .content-container>.content>.content .main-text:empty{display:none}:host .content-container>.content>.footer{color:#fff;display:grid;grid-area:footer;grid-template-columns:1fr;grid-template-rows:repeat(auto-fill,1fr);height:100%;justify-content:center;justify-items:center;text-align:center;width:100%}:host(.hide-loading-content) .content-container>.content>.content{display:none}`;
|
|
var __defProp$e = Object.defineProperty;
|
var __getOwnPropDesc$e = Object.getOwnPropertyDescriptor;
|
var __getProtoOf$e = Object.getPrototypeOf;
|
var __reflectGet$e = Reflect.get;
|
var __decorateClass$e = (decorators, target, key, kind) => {
|
var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$e(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$e(target, key, result);
|
return result;
|
};
|
var __superStaticGet$e = (obj, member) => __reflectGet$e(__getProtoOf$e(obj), member, obj);
|
var __async$f = (__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 LoadingModalComponent = class extends ModalComponent {
|
constructor() {
|
super();
|
this.clockInterval = 5e3;
|
this._textIndex = 0;
|
this.fullScreen = true;
|
this.hasBackground = true;
|
this.changeText = () => __async$f(this, null, function* () {
|
if (this.active) {
|
this._textIndex++;
|
if (!window.LocalesModel.exists("modal.loading.main-text." + this._textIndex)) {
|
this._textIndex = 0;
|
}
|
if (this.mainText) {
|
this.mainText.classList.add("fade-out");
|
this.mainText.textContent = window.LocalesModel.translate("modal.loading.main-text." + this._textIndex, "");
|
this.mainText.classList.remove("fade-out");
|
}
|
if (this.headText) {
|
this.headText.classList.add("fade-out");
|
this.headText.textContent = window.LocalesModel.translate("modal.loading.head-text." + this._textIndex, "");
|
this.headText.classList.remove("fade-out");
|
}
|
}
|
return this.active;
|
});
|
this._clockController = new ClockController(this, this.clockInterval, this.changeText);
|
}
|
firstUpdated(_changedProperties) {
|
var __superGet = (key) => super[key];
|
return __async$f(this, null, function* () {
|
__superGet("firstUpdated").call(this, _changedProperties);
|
yield CommunicationInterfaceService.IsAppReady;
|
this.hide(true, true);
|
});
|
}
|
render() {
|
return super.build(x`
|
<div class="content" part="loadingContent">
|
<slot>
|
<div part="loadingHeadText" class="head-text" i18n="modal.loading.head-text.0"></div>
|
<div part="loadingMainText" class="main-text" i18n="modal.loading.main-text.0"></div>
|
</slot>
|
</div>
|
<div class="footer">
|
<div class="text" i18n="modal.loading.footer-text"></div>
|
<fv-dot-flashing-loader></fv-dot-flashing-loader>
|
</div>
|
`);
|
}
|
};
|
LoadingModalComponent.styles = [
|
__superStaticGet$e(LoadingModalComponent, "styles") || [],
|
i`${r(css_248z$b)}`
|
];
|
__decorateClass$e([
|
i$1(".head-text")
|
], LoadingModalComponent.prototype, "headText", 2);
|
__decorateClass$e([
|
i$1(".main-text")
|
], LoadingModalComponent.prototype, "mainText", 2);
|
LoadingModalComponent = __decorateClass$e([
|
e("fv-loading-modal")
|
], LoadingModalComponent);
|
|
var css_248z$a = 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{background-color:var(--steps-background-color,transparent);display:flex;flex:var(--steps-flex,initial);height:var(--steps-height,100%);order:var(--steps-desktop-order,initial);overflow:hidden;position:relative;width:var(--steps-width,100%)}:host .steps{display:inline-block;height:100%;width:100%}:host .steps slot{align-items:stretch;display:flex;flex-direction:row;flex-wrap:nowrap;height:100%;justify-content:var(--steps-justify-content,flex-start);width:100%}:host .previous-button{display:none}:host .next-button{display:none}:host .custom-previous-button{display:none}:host .custom-next-button{display:none}:host(.evenly-spaced){--step-width:auto;--step-margin:auto}:host(.docked){--icon-step-img-justify-content:center;overflow:initial}:host(.show-previous-button) .previous-button{display:block}:host(.show-next-button) .next-button{display:block}:host(.overflowing){overflow-x:auto}:host(.hide-scrollbar){scrollbar-width:none;-ms-scrollbar-width:none}:host(.hide-scrollbar)::-webkit-scrollbar{display:none}@media (width <= 520px){:host(.mobile-show-next-previous-buttons) .previous-button{display:block}:host(.mobile-show-next-previous-buttons) .next-button{display:block}:host(.mobile-show-custom-previous-button) .custom-previous-button{display:block}:host(.mobile-show-custom-next-button) .custom-next-button{display:block}:host{order:var(--steps-mobile-order,initial);padding:var(--steps-mobile-padding,0 0 10px 0)}}@media (width >= 520px) and (width <= 980px){:host(.mobile-show-next-previous-buttons) .previous-button{display:block}:host(.mobile-show-next-previous-buttons) .next-button{display:block}:host(.mobile-show-custom-previous-button) .custom-previous-button{display:block}:host(.mobile-show-custom-next-button) .custom-next-button{display:block}:host{order:var(--steps-mobile-order,initial);padding:var(--steps-mobile-padding,0 0 10px 0)}}`;
|
|
var css_248z$9 = 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{-webkit-tap-highlight-color:rgba(255,255,255,0);border-bottom:var(--step-border-bottom,none);border-left:var(--step-border-left,none);border-right:var(--step-border-right,none);border-top:var(--step-border-top,none);color:var(--step-text-color,var(--primary-text-color,#000));cursor:pointer;display:inline-block;float:left;font-style:var(--step-font-style,unset);font-variant:var(--step-font-variant,unset);height:100%;margin:var(--step-margin,unset);max-width:var(--step-max-width,none);min-width:var(--step-min-width,none);user-select:none;width:var(--step-width,100%)}:host .step-container{align-items:var(--step-container-align-items,unset);background-color:var(--step-background-color,transparent);display:var(--step-container-display,block);height:var(--container-height,inherit);justify-content:var(--step-container-justify-content,unset);width:var(--step-container-width,100%)}:host .step-container .inner-container{align-items:center;border-bottom:var(--step-span-inner-container-border-bottom,unset);display:flex;flex-direction:row;flex-wrap:nowrap;gap:var(--step-text-icon-gap,initial);height:var(--inner-container-height,inherit);justify-content:center;position:relative;white-space:nowrap}:host .step-container .inner-container .text .text-span{border-bottom:var(--step-span-border-bottom,unset)}:host .step-container .inner-container .text .mobile-text-span{display:none}:host .step-container .inner-container .img div:not(.icon-image):not(.icon){margin-right:10px}:host .step-container .inner-container .img .icon-image{background-position:var(--step-image-background-position,none);background-repeat:var(--step-image-background-repeat,none);background-size:var(--step-image-background-size,none);filter:var(--step-image-filter,none);height:var(--step-image-height,none);width:var(--step-image-width,none)}:host(.custom) .inner-container{display:none!important}:host(.active.underline) .step-container .inner-container .text .text-span{font-weight:var(--step-active-font-weight,var(--global-font-weight-bold,600))!important;text-decoration:underline}:host(.hide-desktop-text) .step-container .inner-container .text .text-span{display:none}:host(.active:not(.underline)){border-bottom:var(--step-active-border-bottom,none);border-left:var(--step-active-border-left,none);border-right:var(--step-active-border-right,none);border-top:var(--step-active-border-top,none);color:var(--step-active-text-color,var(--primary-color,red))}:host(.active:not(.underline)) .step-container{background-color:var(--step-active-background-color,transparent);height:var(--active-container-height,var(--container-height,inherit));width:var(--active-step-container-width,var(--step-container-width,unset))}:host(.active:not(.underline)) .step-container .inner-container{border-bottom:var(--step-span-active-border-bottom,unset);height:var(--active-inner-container-height,var(--inner-container-height,inherit))}:host(.active:not(.underline)) .step-container .inner-container .img .icon-image{filter:var(--step-active-image-filter,var(--step-image-filter,none))}:host(.notched:not(.underline)){position:relative}:host(.notched:not(.underline)) .step-container{clip-path:polygon(0 0,calc(100% - var(--step-notch-width, 15px)) 0,calc(100% - var(--step-notch-width, 15px)) var(--step-notch-distance-top,30%),100% var(--step-notch-tip-distance-top,50%),calc(100% - var(--step-notch-width, 15px)) calc(100% - var(--step-notch-distance-bottom, 30%)),calc(100% - var(--step-notch-width, 15px)) 100%,0 100%,0 calc(100% - var(--step-notch-distance-bottom, 30%) + 1px),calc(var(--step-notch-width, 15px) + 1px) var(--step-notch-tip-distance-top,50%),0 calc(var(--step-notch-distance-top, 30%) - 1px));width:calc(100% + var(--step-notch-width, 15px) - var(--step-gap, 1px))}:host(.notched:not(.underline)) .step-container .inner-container{align-items:center;display:flex;flex-direction:row;flex-wrap:nowrap;height:var(--step-notched-container-height,100%);justify-content:center;white-space:nowrap}:host(.notched:not(.underline)) .step-container .inner-container .text{padding-left:calc(var(--step-notch-width, 15px) + var(--step-notch-text-space-left-right, 0px));padding-right:calc(var(--step-notch-width, 15px) + var(--step-notch-text-space-left-right, 0px))}:host(.first.notched) .step-container{clip-path:polygon(0 0,calc(100% - var(--step-notch-width, 15px)) 0,calc(100% - var(--step-notch-width, 15px)) var(--step-notch-distance-top,30%),100% var(--step-notch-tip-distance-top,50%),calc(100% - var(--step-notch-width, 15px)) calc(100% - var(--step-notch-distance-bottom, 30%)),calc(100% - var(--step-notch-width, 15px)) 100%,0 100%)}:host(.first.notched) .step-container .inner-container .text{padding-left:0}:host(.last:not(.notched)){padding:var(--step-last-padding,0 15px 0 0)}:host(.last.notched) .step-container{clip-path:polygon(0 0,100% 0,100% 100%,0 100%,0 calc(100% - var(--step-notch-distance-bottom, 30%) + 1px),calc(var(--step-notch-width, 15px) + 1px) var(--step-notch-tip-distance-top,50%),0 calc(var(--step-notch-distance-top, 30%) - 1px));width:100%}:host(.last.notched) .step-container .inner-container{width:100%}:host(.last.notched) .step-container .inner-container .text{padding-right:0}:host([disabled]){opacity:.5;pointer-events:all!important}:host([disabled]) .step-container{background:transparent!important}:host(.hide-while-empty-content){display:none}@media (width <= 520px){:host(.active) .step-container{background-color:var(--step-active-background-color,transparent);height:inherit;width:100%}:host(.active) .step-container .inner-container .mobile-text-span{border-bottom:var(--step-span-active-border-bottom-mobile,var(--step-span-active-border-bottom,unset))}:host{max-width:var(--step-max-width-mobile,var(--step-max-width,none));min-width:var(--step-min-width-mobile,var(--step-min-width,none))}:host(.mobile-hide-notch.notched){padding-left:var(--step-gap,1px);padding-right:var(--step-gap,1px)}:host(.mobile-hide-notch.notched) .step-container{width:100%!important}:host(.mobile-hide-notch.notched.first){padding-left:0}:host(.mobile-hide-notch.notched.last){padding-right:0}:host(.show-mobile-text) .step-container .inner-container .text .text-span{display:none}:host(.show-mobile-text) .step-container .inner-container .text .mobile-text-span{border-bottom:var(--step-span-border-bottom-mobile,var(--step-span-border-bottom,unset));display:block}:host(.hide-desktop-text) .step-container .inner-container .text .text-span{display:block}:host(.mobile-hide-step-slot) .step-container .inner-container .step-content{display:none}:host(.mobile-hide-inactive){display:none!important}:host(.mobile-hide-inactive.active){display:inline-block!important}:host(.mobile-hide-inactive.active.notched){position:relative}:host(.mobile-hide-inactive.active.notched) .step-container{clip-path:polygon(0 0,100% 0,100% 100%,0 100%)!important;width:100%}:host(.mobile-hide-inactive.active.notched) .step-container .inner-container .text{padding-left:0;padding-right:0}}@media (width >= 520px) and (width <= 980px){:host(.active) .step-container{background-color:var(--step-active-background-color,transparent);height:inherit;width:100%}:host(.active) .step-container .inner-container .mobile-text-span{border-bottom:var(--step-span-active-border-bottom-mobile,var(--step-span-active-border-bottom,unset))}:host{max-width:var(--step-max-width-mobile,var(--step-max-width,none));min-width:var(--step-min-width-mobile,var(--step-min-width,none))}:host(.mobile-hide-notch.notched){padding-left:var(--step-gap,1px);padding-right:var(--step-gap,1px)}:host(.mobile-hide-notch.notched) .step-container{width:100%!important}:host(.mobile-hide-notch.notched.first){padding-left:0}:host(.mobile-hide-notch.notched.last){padding-right:0}:host(.show-mobile-text) .step-container .inner-container .text .text-span{display:none}:host(.show-mobile-text) .step-container .inner-container .text .mobile-text-span{border-bottom:var(--step-span-border-bottom-mobile,var(--step-span-border-bottom,unset));display:block}:host(.hide-desktop-text) .step-container .inner-container .text .text-span{display:block}:host(.mobile-hide-step-slot) .step-container .inner-container .step-content{display:none}:host(.mobile-hide-inactive){display:none!important}:host(.mobile-hide-inactive.active){display:inline-block!important}:host(.mobile-hide-inactive.active.notched){position:relative}:host(.mobile-hide-inactive.active.notched) .step-container{clip-path:polygon(0 0,100% 0,100% 100%,0 100%)!important;width:100%}:host(.mobile-hide-inactive.active.notched) .step-container .inner-container .text{padding-left:0;padding-right:0}}`;
|
|
var __defProp$d = Object.defineProperty;
|
var __getOwnPropDesc$d = Object.getOwnPropertyDescriptor;
|
var __getProtoOf$d = Object.getPrototypeOf;
|
var __reflectGet$d = Reflect.get;
|
var __decorateClass$d = (decorators, target, key, kind) => {
|
var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$d(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$d(target, key, result);
|
return result;
|
};
|
var __superStaticGet$d = (obj, member) => __reflectGet$d(__getProtoOf$d(obj), member, obj);
|
let StepComponent = class extends BaseElement {
|
constructor() {
|
super();
|
this.text = "";
|
this.mobileText = "";
|
this.icon = "";
|
this.index = -1;
|
this._showIndex = false;
|
this._disabled = false;
|
this.addEventListener("click", () => {
|
const steps = this.parentElement;
|
if (!this.classList.contains("only-action")) {
|
const event = new CustomEvent("fv-step-clicked", {
|
detail: { id: this.id, "index": this.index.toString(), currentTarget: this },
|
bubbles: true,
|
composed: true
|
});
|
steps == null ? void 0 : steps.dispatchEvent(event);
|
this.classList.add("active");
|
}
|
});
|
}
|
updateIndex() {
|
const steps = this.parentElement;
|
if (this._showIndex) {
|
let index = this.index;
|
let current = 0;
|
const allSteps = Array.from(steps.querySelectorAll("fv-step"));
|
for (const step of allSteps) {
|
if (step.classList.contains("hide-while-empty-content")) {
|
current++;
|
} else if (index === step.index) {
|
index = index - current;
|
break;
|
}
|
}
|
if (this._circleNumberSymbol) {
|
this._circleNumberSymbol.textContent = (index + 1).toString();
|
}
|
}
|
}
|
checkStepTargetElementVisibility(element_) {
|
let emptyElements = 0;
|
let disabledElements = 0;
|
const steps = this.parentElement;
|
if (steps && steps instanceof StepsComponent && this.index > -1) {
|
const elements = new Array();
|
if (element_) {
|
elements.push(element_);
|
} else {
|
elements.push(...steps.getTargetContentsList(this.index));
|
}
|
if (steps.hideEmptyContent) {
|
this.classList.remove("hide-while-empty-content");
|
}
|
if (steps.autoDisableSteps) {
|
this._disabled = false;
|
}
|
for (const element of elements) {
|
if (element) {
|
if (steps.hideEmptyContent && element.isEmpty()) {
|
++emptyElements;
|
}
|
if (steps.autoDisableSteps && element.classList.contains("step-disabled")) {
|
++disabledElements;
|
}
|
}
|
}
|
if (steps.hideEmptyContent && emptyElements == elements.length) {
|
this.classList.add("hide-while-empty-content");
|
}
|
if (steps.autoDisableSteps && elements.length != 0 && disabledElements == elements.length) {
|
this._disabled = true;
|
}
|
this.updateIndex();
|
steps.dispatchEvent(new CustomEvent("fv-steps-request-step-activated-events", { detail: { "requesting-step-index": this.index } }));
|
}
|
}
|
firstUpdated(_changedProperties) {
|
super.firstUpdated(_changedProperties);
|
window.addEventListener("onUpdated", (e) => {
|
this.checkStepTargetElementVisibility();
|
});
|
}
|
buildIcon() {
|
if (this._showIndex) {
|
return x`<div class="circle-number-symbol">${this.index + 1}</div>`;
|
}
|
const image = this.style.getPropertyValue("--icon-image");
|
if (image) {
|
return x`<img class="icon-image" src="${image}" part="image"/>`;
|
}
|
return x`<div class="icon ${this.icon}"></div>`;
|
}
|
buildText() {
|
return x`
|
<span class="text-span" i18n="${this.text}">${this.text}</span>
|
<span class="mobile-text-span" i18n="${this.mobileText}">${this.mobileText}</span>
|
`;
|
}
|
build(additional) {
|
this.classList.remove("show-mobile-text");
|
this.checkStepTargetElementVisibility();
|
if (this.mobileText.length > 0)
|
this.classList.add("show-mobile-text");
|
const textAboveImage = this.classList.contains("text-above-image");
|
return x`
|
<div class="step-container">
|
${this.classList.contains("prevent-default") ? x`` : x`
|
<div class="inner-container">
|
<div part="${textAboveImage ? "text" : "img"}" class="upper-container ${textAboveImage ? "text" : "img"}">
|
${textAboveImage ? this.buildText() : this.buildIcon()}
|
</div>
|
<div part="${!textAboveImage ? "text" : "img"}" class="lower-container ${!textAboveImage ? "text" : "img"}">
|
${textAboveImage ? this.buildIcon() : this.buildText()}
|
</div>
|
<slot name=step-content class="step-content"></slot>
|
</div>
|
`}
|
${additional}
|
</div>
|
`;
|
}
|
render() {
|
return this.build(x`<slot></slot>`);
|
}
|
};
|
StepComponent.styles = [
|
__superStaticGet$d(StepComponent, "styles") || [],
|
i`${r(css_248z$9)}`
|
];
|
__decorateClass$d([
|
i$1(".circle-number-symbol")
|
], StepComponent.prototype, "_circleNumberSymbol", 2);
|
__decorateClass$d([
|
n({ type: String, reflect: true })
|
], StepComponent.prototype, "text", 2);
|
__decorateClass$d([
|
n({ type: String, reflect: true, attribute: "mobile-text" })
|
], StepComponent.prototype, "mobileText", 2);
|
__decorateClass$d([
|
n({ type: String, reflect: true })
|
], StepComponent.prototype, "icon", 2);
|
__decorateClass$d([
|
n({ type: Number, reflect: true, attribute: "index" })
|
], StepComponent.prototype, "index", 2);
|
__decorateClass$d([
|
n({ type: Boolean, reflect: true, attribute: "show-index" })
|
], StepComponent.prototype, "_showIndex", 2);
|
__decorateClass$d([
|
n({ type: Boolean, reflect: true, attribute: "disabled" })
|
], StepComponent.prototype, "_disabled", 2);
|
StepComponent = __decorateClass$d([
|
e("fv-step")
|
], StepComponent);
|
|
var css_248z$8 = 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{-webkit-tap-highlight-color:rgba(255,255,255,0);border-bottom:var(--step-border-bottom,none);border-left:var(--step-border-left,none);border-right:var(--step-border-right,none);border-top:var(--step-border-top,none);color:var(--step-text-color,var(--primary-text-color,#000));cursor:pointer;display:inline-block;float:left;font-style:var(--step-font-style,unset);font-variant:var(--step-font-variant,unset);margin:var(--step-margin,unset);max-width:var(--step-max-width,none);min-width:var(--step-min-width,none);user-select:none;width:var(--step-width,100%)}:host .step-container{align-items:var(--step-container-align-items,unset);background-color:var(--step-background-color,transparent);display:var(--step-container-display,block);height:var(--container-height,inherit);justify-content:var(--step-container-justify-content,unset);width:var(--step-container-width,100%)}:host .step-container .inner-container{align-items:center;border-bottom:var(--step-span-inner-container-border-bottom,unset);display:flex;flex-direction:row;flex-wrap:nowrap;gap:var(--step-text-icon-gap,initial);height:var(--inner-container-height,inherit);justify-content:center;position:relative;white-space:nowrap}:host .step-container .inner-container .text .text-span{border-bottom:var(--step-span-border-bottom,unset)}:host .step-container .inner-container .text .mobile-text-span{display:none}:host .step-container .inner-container .img div:not(.icon-image):not(.icon){margin-right:10px}:host .step-container .inner-container .img .icon-image{background-position:var(--step-image-background-position,none);background-repeat:var(--step-image-background-repeat,none);background-size:var(--step-image-background-size,none);filter:var(--step-image-filter,none);height:var(--step-image-height,none);width:var(--step-image-width,none)}:host(.custom) .inner-container{display:none!important}:host(.active.underline) .step-container .inner-container .text .text-span{font-weight:var(--step-active-font-weight,var(--global-font-weight-bold,600))!important;text-decoration:underline}:host(.hide-desktop-text) .step-container .inner-container .text .text-span{display:none}:host(.active:not(.underline)){border-bottom:var(--step-active-border-bottom,none);border-left:var(--step-active-border-left,none);border-right:var(--step-active-border-right,none);border-top:var(--step-active-border-top,none);color:var(--step-active-text-color,var(--primary-color,red))}:host(.active:not(.underline)) .step-container{background-color:var(--step-active-background-color,transparent);height:var(--active-container-height,var(--container-height,inherit));width:var(--active-step-container-width,var(--step-container-width,unset))}:host(.active:not(.underline)) .step-container .inner-container{border-bottom:var(--step-span-active-border-bottom,unset);height:var(--active-inner-container-height,var(--inner-container-height,inherit))}:host(.active:not(.underline)) .step-container .inner-container .img .icon-image{filter:var(--step-active-image-filter,var(--step-image-filter,none))}:host(.notched:not(.underline)){position:relative}:host(.notched:not(.underline)) .step-container{clip-path:polygon(0 0,calc(100% - var(--step-notch-width, 15px)) 0,calc(100% - var(--step-notch-width, 15px)) var(--step-notch-distance-top,30%),100% var(--step-notch-tip-distance-top,50%),calc(100% - var(--step-notch-width, 15px)) calc(100% - var(--step-notch-distance-bottom, 30%)),calc(100% - var(--step-notch-width, 15px)) 100%,0 100%,0 calc(100% - var(--step-notch-distance-bottom, 30%) + 1px),calc(var(--step-notch-width, 15px) + 1px) var(--step-notch-tip-distance-top,50%),0 calc(var(--step-notch-distance-top, 30%) - 1px));width:calc(100% + var(--step-notch-width, 15px) - var(--step-gap, 1px))}:host(.notched:not(.underline)) .step-container .inner-container{align-items:center;display:flex;flex-direction:row;flex-wrap:nowrap;height:var(--step-notched-container-height,100%);justify-content:center;white-space:nowrap}:host(.notched:not(.underline)) .step-container .inner-container .text{padding-left:calc(var(--step-notch-width, 15px) + var(--step-notch-text-space-left-right, 0px));padding-right:calc(var(--step-notch-width, 15px) + var(--step-notch-text-space-left-right, 0px))}:host(.first.notched) .step-container{clip-path:polygon(0 0,calc(100% - var(--step-notch-width, 15px)) 0,calc(100% - var(--step-notch-width, 15px)) var(--step-notch-distance-top,30%),100% var(--step-notch-tip-distance-top,50%),calc(100% - var(--step-notch-width, 15px)) calc(100% - var(--step-notch-distance-bottom, 30%)),calc(100% - var(--step-notch-width, 15px)) 100%,0 100%)}:host(.first.notched) .step-container .inner-container .text{padding-left:0}:host(.last:not(.notched)){padding:var(--step-last-padding,0 15px 0 0)}:host(.last.notched) .step-container{clip-path:polygon(0 0,100% 0,100% 100%,0 100%,0 calc(100% - var(--step-notch-distance-bottom, 30%) + 1px),calc(var(--step-notch-width, 15px) + 1px) var(--step-notch-tip-distance-top,50%),0 calc(var(--step-notch-distance-top, 30%) - 1px));width:100%}:host(.last.notched) .step-container .inner-container{width:100%}:host(.last.notched) .step-container .inner-container .text{padding-right:0}:host([disabled]){opacity:.5;pointer-events:all!important}:host([disabled]) .step-container{background:transparent!important}:host(.hide-while-empty-content){display:none}@media (width <= 520px){:host(.active) .step-container{background-color:var(--step-active-background-color,transparent);height:inherit;width:100%}:host(.active) .step-container .inner-container .mobile-text-span{border-bottom:var(--step-span-active-border-bottom-mobile,var(--step-span-active-border-bottom,unset))}:host{max-width:var(--step-max-width-mobile,var(--step-max-width,none));min-width:var(--step-min-width-mobile,var(--step-min-width,none))}:host(.mobile-hide-notch.notched){padding-left:var(--step-gap,1px);padding-right:var(--step-gap,1px)}:host(.mobile-hide-notch.notched) .step-container{width:100%!important}:host(.mobile-hide-notch.notched.first){padding-left:0}:host(.mobile-hide-notch.notched.last){padding-right:0}:host(.show-mobile-text) .step-container .inner-container .text .text-span{display:none}:host(.show-mobile-text) .step-container .inner-container .text .mobile-text-span{border-bottom:var(--step-span-border-bottom-mobile,var(--step-span-border-bottom,unset));display:block}:host(.hide-desktop-text) .step-container .inner-container .text .text-span{display:block}:host(.mobile-hide-step-slot) .step-container .inner-container .step-content{display:none}:host(.mobile-hide-inactive){display:none!important}:host(.mobile-hide-inactive.active){display:inline-block!important}:host(.mobile-hide-inactive.active.notched){position:relative}:host(.mobile-hide-inactive.active.notched) .step-container{clip-path:polygon(0 0,100% 0,100% 100%,0 100%)!important;width:100%}:host(.mobile-hide-inactive.active.notched) .step-container .inner-container .text{padding-left:0;padding-right:0}}@media (width >= 520px) and (width <= 980px){:host(.active) .step-container{background-color:var(--step-active-background-color,transparent);height:inherit;width:100%}:host(.active) .step-container .inner-container .mobile-text-span{border-bottom:var(--step-span-active-border-bottom-mobile,var(--step-span-active-border-bottom,unset))}:host{max-width:var(--step-max-width-mobile,var(--step-max-width,none));min-width:var(--step-min-width-mobile,var(--step-min-width,none))}:host(.mobile-hide-notch.notched){padding-left:var(--step-gap,1px);padding-right:var(--step-gap,1px)}:host(.mobile-hide-notch.notched) .step-container{width:100%!important}:host(.mobile-hide-notch.notched.first){padding-left:0}:host(.mobile-hide-notch.notched.last){padding-right:0}:host(.show-mobile-text) .step-container .inner-container .text .text-span{display:none}:host(.show-mobile-text) .step-container .inner-container .text .mobile-text-span{border-bottom:var(--step-span-border-bottom-mobile,var(--step-span-border-bottom,unset));display:block}:host(.hide-desktop-text) .step-container .inner-container .text .text-span{display:block}:host(.mobile-hide-step-slot) .step-container .inner-container .step-content{display:none}:host(.mobile-hide-inactive){display:none!important}:host(.mobile-hide-inactive.active){display:inline-block!important}:host(.mobile-hide-inactive.active.notched){position:relative}:host(.mobile-hide-inactive.active.notched) .step-container{clip-path:polygon(0 0,100% 0,100% 100%,0 100%)!important;width:100%}:host(.mobile-hide-inactive.active.notched) .step-container .inner-container .text{padding-left:0;padding-right:0}}:host{height:100%}:host(.docked){font-size:smaller}:host(.docked) div[part=text]{display:none!important}:host(.docked) img[part=image]{height:inherit!important}:host(.centered){padding:var(--icon-step-centered-padding,1em)}:host(.centered) .inner-container{display:flex;flex-direction:column;height:inherit;justify-content:center;width:100%}:host(.centered) .inner-container .icon-image{height:auto;margin:auto;max-height:40px;max-width:40px;padding:5px;width:auto}:host(.centered) .inner-container .upper-container{display:flex;flex-direction:column;height:inherit;justify-content:var(--icon-step-img-justify-content,flex-end);text-align:center;width:100%}:host(.centered) .inner-container .lower-container{display:flex;flex-direction:column;font-size:var(--icon-step-text-height,1em);justify-content:flex-start;line-height:var(--icon-step-text-height,1em);text-align:center}:host(.active) .underline-active{text-decoration:underline}`;
|
|
var __defProp$c = Object.defineProperty;
|
var __getOwnPropDesc$c = Object.getOwnPropertyDescriptor;
|
var __getProtoOf$c = Object.getPrototypeOf;
|
var __reflectGet$c = Reflect.get;
|
var __decorateClass$c = (decorators, target, key, kind) => {
|
var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$c(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$c(target, key, result);
|
return result;
|
};
|
var __superStaticGet$c = (obj, member) => __reflectGet$c(__getProtoOf$c(obj), member, obj);
|
let IconStepComponent = class extends StepComponent {
|
constructor() {
|
super();
|
}
|
render() {
|
return super.build(x`<slot></slot>`);
|
}
|
updated(_changedProperties) {
|
super.updated(_changedProperties);
|
if (this.classList.contains("underline")) {
|
let container = void 0;
|
const textAboveImage = this.classList.contains("text-above-image");
|
if (textAboveImage) {
|
container = this.renderRoot.querySelector(".upper-container");
|
} else {
|
container = this.renderRoot.querySelector(".lower-container");
|
}
|
container == null ? void 0 : container.classList.add("underline-active");
|
}
|
}
|
};
|
IconStepComponent.styles = [
|
__superStaticGet$c(IconStepComponent, "styles") || [],
|
i`${r(css_248z$8)}`
|
];
|
IconStepComponent = __decorateClass$c([
|
e("fv-icon-step")
|
], IconStepComponent);
|
|
var __defProp$b = Object.defineProperty;
|
var __getOwnPropDesc$b = Object.getOwnPropertyDescriptor;
|
var __getProtoOf$b = Object.getPrototypeOf;
|
var __reflectGet$b = Reflect.get;
|
var __decorateClass$b = (decorators, target, key, kind) => {
|
var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$b(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$b(target, key, result);
|
return result;
|
};
|
var __superStaticGet$b = (obj, member) => __reflectGet$b(__getProtoOf$b(obj), member, obj);
|
var __async$e = (__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 StepsComponent = class extends BaseElement {
|
constructor() {
|
super();
|
this.stepTargetSelectors = {};
|
this.stepActivatedEvents = {};
|
this.hideEmptyContent = false;
|
this.autoDisableSteps = false;
|
this.startIndex = 0;
|
this._allowedIndices = this.getAvailableIndices();
|
this._currentIndex = this.startIndex;
|
this.addEventListener("fv-step-clicked", (e) => __async$e(this, null, function* () {
|
if (e.detail && e.detail["index"]) {
|
this._nextIndex = e.detail["index"];
|
} else {
|
return false;
|
}
|
if (this._currentAction)
|
yield this._currentAction;
|
const stepEventHandler = () => __async$e(this, null, function* () {
|
if (e.detail && e.detail["index"]) {
|
if (typeof e.detail["index"] == "string") {
|
this._currentIndex = parseInt(e.detail["index"]);
|
} else {
|
this._currentIndex = e.detail["index"];
|
}
|
} else {
|
return false;
|
}
|
yield this.deactivateAll();
|
if (this.stepTargetSelectors[this._currentIndex]) {
|
const targetSelector = this.stepTargetSelectors[this._currentIndex];
|
if (targetSelector.modal) {
|
yield EventHandlerService.dispatchAsyncEvent("open-modal", targetSelector.modal);
|
}
|
if (targetSelector.element) {
|
yield EventHandlerService.dispatchAsyncEvent("set-attribute", {
|
components: [targetSelector.element],
|
attribute: "hide-element",
|
value: false
|
});
|
}
|
if (targetSelector.elements) {
|
yield EventHandlerService.dispatchAsyncEvent("set-attribute", {
|
components: targetSelector.elements,
|
attribute: "hide-element",
|
value: false
|
});
|
}
|
}
|
if (e.detail.currentTarget) {
|
e.detail.currentTarget.dispatchEvent(new CustomEvent("step-index-changed", {
|
detail: {}
|
}));
|
e.detail.currentTarget.classList.add("active");
|
}
|
yield this.triggerStepActivatedEvents(true);
|
return true;
|
});
|
if (e.detail["index"] && this._nextIndex === e.detail["index"]) {
|
this._currentAction = stepEventHandler();
|
}
|
}));
|
window.addEventListener("onUpdated", (e) => {
|
if (e.detail instanceof StepComponent) {
|
return;
|
}
|
this._allowedIndices = this.getAvailableIndices();
|
});
|
this.addEventListener("fv-steps-request-step-activated-events", (e) => __async$e(this, null, function* () {
|
if (this._currentIndex == e.detail["requesting-step-index"]) {
|
yield this.triggerStepActivatedEvents(false);
|
}
|
}));
|
}
|
dispatchEventList(events, currentActiveIndex, userInteraction) {
|
return __async$e(this, null, function* () {
|
for (const stepActivatedEvent of events) {
|
if (stepActivatedEvent["do-not-call-on"] && stepActivatedEvent["do-not-call-on"].includes(currentActiveIndex))
|
continue;
|
if ((stepActivatedEvent == null ? void 0 : stepActivatedEvent.needsInteraction) && !userInteraction)
|
continue;
|
yield EventHandlerService.dispatchAsyncEvent(stepActivatedEvent.id, stepActivatedEvent.data ? stepActivatedEvent.data : {});
|
}
|
});
|
}
|
triggerStepActivatedEvents(userInteraction = false) {
|
return __async$e(this, null, function* () {
|
const eventsToCall = this.stepActivatedEvents[this._currentIndex.toFixed(0)];
|
if (eventsToCall != void 0 && eventsToCall.length > 0) {
|
yield this.dispatchEventList(eventsToCall, this._currentIndex.toFixed(0), userInteraction);
|
}
|
const availableIndex = this.getAvailableIndices();
|
if (this.stepActivatedEvents["any"] != void 0 && this.stepActivatedEvents["any"].length > 0) {
|
yield this.dispatchEventList(this.stepActivatedEvents["any"], this._currentIndex.toFixed(0), userInteraction);
|
}
|
if (availableIndex.at(0) == this._currentIndex) {
|
if (this.stepActivatedEvents["first"] != void 0 && this.stepActivatedEvents["first"].length > 0) {
|
yield this.dispatchEventList(this.stepActivatedEvents["first"], this._currentIndex.toFixed(0), userInteraction);
|
}
|
}
|
if (availableIndex.at(availableIndex.length - 1) == this._currentIndex) {
|
if (this.stepActivatedEvents["last"] != void 0 && this.stepActivatedEvents["last"].length > 0) {
|
yield this.dispatchEventList(this.stepActivatedEvents["last"], this._currentIndex.toFixed(0), userInteraction);
|
}
|
}
|
});
|
}
|
getAvailableIndices() {
|
const availableIndex = new Array();
|
const steps = this.querySelectorAll("fv-step");
|
steps.forEach((step) => {
|
if (step.classList.contains("hide-while-empty-content") == false) {
|
const index = step.getAttribute("index");
|
if (index != void 0) {
|
availableIndex.push(parseInt(index));
|
}
|
}
|
});
|
return availableIndex.sort((a, b) => a - b);
|
}
|
UpdateActivation() {
|
return __async$e(this, null, function* () {
|
yield CommunicationInterfaceService.IsAppReady;
|
yield CardDataService.WaitForAllCardContainerFetchPromises();
|
this.activate(this._allowedIndices[0]);
|
});
|
}
|
updated(_changedProperties) {
|
if (_changedProperties.has("_allowedIndices")) {
|
const oldValue = _changedProperties.get("_allowedIndices");
|
const changed = !(Array.isArray(this._allowedIndices) && Array.isArray(oldValue) && this._allowedIndices.length === oldValue.length && this._allowedIndices.every((val, index) => val === oldValue[index]));
|
if (changed) {
|
this.UpdateActivation();
|
}
|
}
|
super.updated(_changedProperties);
|
}
|
getTargetContentsList(index_) {
|
if (this.stepTargetSelectors[index_]) {
|
if (this.stepTargetSelectors[index_].element) {
|
const targetContents = new Array();
|
if (this.stepTargetSelectors[index_].element["ignore-default-target-content"] == false || this.stepTargetSelectors[index_].element["ignore-default-target-content"] == void 0) {
|
const target = ComponentService.find(this.stepTargetSelectors[index_].element.name, this.stepTargetSelectors[index_].element.selector);
|
if (target != void 0) {
|
targetContents.push(target);
|
}
|
}
|
const targetContentAlternatives = this.stepTargetSelectors[index_].element["additional-target-contents"];
|
if (targetContentAlternatives) {
|
for (const targetContentAlternative of targetContentAlternatives) {
|
if (targetContentAlternative.name.length > 0) {
|
const alternative = ComponentService.find(targetContentAlternative.name, targetContentAlternative.selector);
|
if (alternative != void 0) {
|
targetContents.push(alternative);
|
}
|
}
|
}
|
}
|
return targetContents;
|
}
|
}
|
return [];
|
}
|
previous() {
|
let selector = "";
|
this.classList.forEach((value) => {
|
selector += ".";
|
selector += value;
|
});
|
StepsComponent.previous({
|
"steps-component": "fv-steps",
|
"selector": selector
|
});
|
}
|
next() {
|
let selector = "";
|
this.classList.forEach((value) => {
|
selector += ".";
|
selector += value;
|
});
|
StepsComponent.next({
|
"steps-component": "fv-steps",
|
"selector": selector
|
});
|
}
|
render() {
|
return x`
|
<span class="previous-button" @click="${this.previous}">
|
<slot name="previous-button"></slot>
|
</span>
|
<span class="custom-previous-button">
|
<slot name="custom-previous-button"></slot>
|
</span>
|
|
<span class="steps"><slot></slot></span>
|
|
<span class="next-button" @click="${this.next}">
|
<slot name="next-button"></slot>
|
</span>
|
<span class="custom-next-button">
|
<slot name="custom-next-button"></slot>
|
</span>
|
`;
|
}
|
firstUpdated(_changedProperties) {
|
super.firstUpdated(_changedProperties);
|
this.activateFirst();
|
}
|
activateFirst() {
|
return __async$e(this, null, function* () {
|
yield CommunicationInterfaceService.IsAppReady;
|
this.activate(this.startIndex);
|
});
|
}
|
deactivateAll() {
|
return __async$e(this, null, function* () {
|
const activeElements = this.querySelectorAll(".active");
|
activeElements.forEach((element) => {
|
element.classList.remove("active");
|
});
|
const elements = [];
|
const targetSelectorKeys = Object.keys(this.stepTargetSelectors);
|
for (const key of targetSelectorKeys) {
|
const targetSelector = this.stepTargetSelectors[key];
|
if (targetSelector.modal) {
|
yield EventHandlerService.dispatchAsyncEvent("close-modal", targetSelector.modal);
|
}
|
if (targetSelector.element) {
|
elements.push(targetSelector.element);
|
}
|
if (targetSelector.elements) {
|
elements.push(...targetSelector.elements);
|
}
|
}
|
if (elements.length > 0) {
|
yield EventHandlerService.dispatchAsyncEvent("set-attribute", {
|
components: elements,
|
attribute: "hide-element",
|
value: true
|
});
|
}
|
});
|
}
|
activate(index_) {
|
const step = this.querySelector("[index='" + index_ + "']");
|
step == null ? void 0 : step.dispatchEvent(new Event("click"));
|
}
|
get activeIndex() {
|
const activeElements = this.querySelectorAll(".active");
|
for (let index = 0; index < activeElements.length; ++index) {
|
const element = activeElements.item(index);
|
if (element && element.hasAttribute("index")) {
|
return parseInt(element.getAttribute("index"));
|
}
|
}
|
return -1;
|
}
|
getPreviousStepIndex() {
|
let startIndex = this.activeIndex - 1;
|
const min = Math.min(...this._allowedIndices);
|
while (!this._allowedIndices.includes(startIndex) && startIndex > min) {
|
startIndex--;
|
}
|
return startIndex;
|
}
|
getNextStepIndex() {
|
let startIndex = this.activeIndex + 1;
|
const max = Math.max(...this._allowedIndices);
|
while (!this._allowedIndices.includes(startIndex) && startIndex < max) {
|
startIndex++;
|
}
|
return startIndex;
|
}
|
static next(data) {
|
const _stepsComponent = ComponentService.find(data["steps-component"], data.selector);
|
if (_stepsComponent) {
|
_stepsComponent.activate(_stepsComponent.getNextStepIndex());
|
}
|
}
|
static previous(data) {
|
const _stepsComponent = ComponentService.find(data["steps-component"], data.selector);
|
if (_stepsComponent) {
|
_stepsComponent.activate(_stepsComponent.getPreviousStepIndex());
|
}
|
}
|
static activateFirst(data) {
|
const _stepsComponent = ComponentService.find(data["steps-component"], data.selector);
|
if (_stepsComponent) {
|
_stepsComponent.activateFirst();
|
}
|
}
|
static activate(data, index) {
|
const _stepsComponent = ComponentService.find(data["steps-component"], data.selector);
|
if (_stepsComponent) {
|
_stepsComponent.activate(index);
|
}
|
}
|
};
|
StepsComponent.styles = [
|
__superStaticGet$b(StepsComponent, "styles") || [],
|
i`${r(css_248z$a)}`
|
];
|
__decorateClass$b([
|
n({ type: Object, reflect: true, attribute: "step-target-selectors" })
|
], StepsComponent.prototype, "stepTargetSelectors", 2);
|
__decorateClass$b([
|
n({ type: Object, reflect: true, attribute: "step-activated-events" })
|
], StepsComponent.prototype, "stepActivatedEvents", 2);
|
__decorateClass$b([
|
n({ type: Boolean, reflect: true, attribute: "hide-empty-content" })
|
], StepsComponent.prototype, "hideEmptyContent", 2);
|
__decorateClass$b([
|
n({ type: Boolean, reflect: true, attribute: "auto-disable-steps" })
|
], StepsComponent.prototype, "autoDisableSteps", 2);
|
__decorateClass$b([
|
n({ type: Number, reflect: true, attribute: "start-index" })
|
], StepsComponent.prototype, "startIndex", 2);
|
__decorateClass$b([
|
n({ type: Number, attribute: false })
|
], StepsComponent.prototype, "_allowedIndices", 2);
|
StepsComponent = __decorateClass$b([
|
e("fv-steps")
|
], StepsComponent);
|
|
var css_248z$7 = 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{display:inline-block}:host .button{-webkit-tap-highlight-color:rgba(255,255,255,0);align-items:center;background:var(--toolbar-button-background,transparent);border:var(--toolbar-button-border,none);border-radius:var(--toolbar-button-border-radius,.35em);color:var(--toolbar-button-color,unset);cursor:var(--toolbar-button-cursor,pointer);display:flex;font-size:var(--toolbar-button-font-size,1em);font-weight:var(--toolbar-button-font-weight, );height:var(--toolbar-button-height,3em);justify-content:center;margin:var(--toolbar-button-margin,0);outline:none;padding:var(--toolbar-button-padding,2.5em);pointer-events:auto;width:var(--toolbar-button-width,3em)}:host .button.active{background:var(--toolbar-button-active-background,#d3d3d3);color:var(--toolbar-button-active-color,unset)}:host .button .image{height:var(--toolbar-button-image-height,21px);min-height:var(--toolbar-button-image-min-height,0);min-width:var(--toolbar-button-image-min-width,0);width:var(--toolbar-button-image-width,21px)}:host .button .icon{align-items:center;border-radius:var(--toolbar-button-icon-border-radius,1em);display:flex;flex-direction:column;flex-wrap:nowrap;font-size:var(--toolbar-button-icon-font-size,1.2em);font-weight:var(--toolbar-button-icon-font-weight,var(--global-font-weight-bold,600));height:var(--toolbar-button-icon-height,80%);justify-content:center;width:var(--toolbar-button-icon-width,80%)}:host(.left){float:left}:host(.right){float:right}:host(.disabled-in-config){display:none!important}:host(.invalid-image-src){display:none!important}:host(.docked) .button-container{margin:auto}:host(.docked) button[part=button]{font-size:revert;padding:0}@media (width <= 520px){:host .button{height:var(--toolbar-mobile-button-height,var(--toolbar-button-height,3em));margin:var(--toolbar-mobile-button-margin,var(--toolbar-button-margin,0));padding:var(--toolbar-mobile-button-padding,var(--toolbar-button-padding,2.5em));width:var(--toolbar-mobile-button-width,var(--toolbar-button-width,3em))}:host .button .icon{font-size:var(--toolbar-mobile-button-icon-font-size,var(--toolbar-button-font-size,1em))}}@media (width >= 520px) and (width <= 980px){:host .button{height:var(--toolbar-mobile-button-height,var(--toolbar-button-height,3em));margin:var(--toolbar-mobile-button-margin,var(--toolbar-button-margin,0));padding:var(--toolbar-mobile-button-padding,var(--toolbar-button-padding,2.5em));width:var(--toolbar-mobile-button-width,var(--toolbar-button-width,3em))}:host .button .icon{font-size:var(--toolbar-mobile-button-icon-font-size,var(--toolbar-button-font-size,1em))}}`;
|
|
var __defProp$a = Object.defineProperty;
|
var __getOwnPropDesc$a = Object.getOwnPropertyDescriptor;
|
var __getProtoOf$a = Object.getPrototypeOf;
|
var __reflectGet$a = Reflect.get;
|
var __decorateClass$a = (decorators, target, key, kind) => {
|
var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$a(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$a(target, key, result);
|
return result;
|
};
|
var __superStaticGet$a = (obj, member) => __reflectGet$a(__getProtoOf$a(obj), member, obj);
|
var __async$d = (__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 ToolbarButtonComponent = class extends BaseElement {
|
constructor() {
|
super();
|
this.titleText = "";
|
this.configId = "";
|
this.icon = "";
|
this.activeIcon = "";
|
this.handleActive = false;
|
this.preventClickOnActive = false;
|
this.activeIsLoading = false;
|
this.eventId = "";
|
this.initialActive = false;
|
}
|
set active(value) {
|
const button = this.renderRoot.querySelector(".button");
|
if (button) {
|
if (value) {
|
button.classList.add("active");
|
this.requestUpdate();
|
return;
|
}
|
button.classList.remove("active");
|
}
|
this.requestUpdate();
|
}
|
get active() {
|
const button = this.renderRoot.querySelector(".button");
|
if (button) {
|
return button.classList.contains("active");
|
}
|
return false;
|
}
|
clickEvent(e) {
|
return __async$d(this, null, function* () {
|
if (this.preventClickOnActive && this.active) {
|
e.stopPropagation();
|
e.preventDefault();
|
e.stopImmediatePropagation();
|
return;
|
}
|
if (this.handleActive) {
|
this.active = !this.active;
|
}
|
if (this.eventId) {
|
let classes = "[event-id='" + this.eventId + "'][title-text='" + this.titleText + "'] ";
|
this.classList.forEach((className) => {
|
classes += ".";
|
classes += className;
|
});
|
if (EventHandlerService.dispatch(this.eventId, {
|
components: [{
|
name: "fv-toolbar-button",
|
selector: classes
|
}]
|
}))
|
return;
|
}
|
this.dispatchEvent(new CustomEvent("fv-toolbar-button-clicked", {
|
detail: { "button-type": this.eventId },
|
bubbles: true,
|
composed: true
|
}));
|
});
|
}
|
dblclickEvent(e) {
|
return __async$d(this, null, function* () {
|
return;
|
});
|
}
|
build(inner) {
|
if (window.g_configuration == void 0 || window.g_configuration[this.configId] === false) {
|
this.classList.add("disabled-in-config");
|
return x``;
|
}
|
this.classList.remove("disabled-in-config");
|
if (this.classList.contains("invalid-image-src")) {
|
return x``;
|
}
|
return x`
|
<div class="button-container">
|
<button @click=${this.clickEvent} @dblclick="${this.dblclickEvent}" part="button" class="button" title="${this.titleText}">
|
${inner}
|
</button>
|
</div>
|
`;
|
}
|
getImageIcon() {
|
if (this.handleActive && this.active) {
|
const iconActive = StyleHelper.getVar(this, "--toolbar-icon-active");
|
if (iconActive.length > 0) {
|
return iconActive;
|
}
|
}
|
return StyleHelper.getVar(this, "--toolbar-icon");
|
}
|
getAttributeIcon() {
|
if (this.handleActive && this.active && this.activeIcon.length > 0) {
|
return this.activeIcon;
|
}
|
return this.icon;
|
}
|
render() {
|
const icon = this.getImageIcon();
|
if (icon) {
|
if (ImageService.getExtension(icon) === "svg") {
|
const svgIcon = new SVGIconComponent();
|
svgIcon.classList.add("image");
|
svgIcon.classList[this.active ? "add" : "remove"]("active");
|
svgIcon._src = icon;
|
return this.build(x`${svgIcon}`);
|
}
|
return this.build(x`<img class="image" src=${icon}/>`);
|
} else if (this.icon) {
|
return this.build(x`<i class="icon ${this.getAttributeIcon()}" part="icon"></i>`);
|
}
|
return this.build(x`<slot></slot>`);
|
}
|
firstUpdated(_changedProperties) {
|
var __superGet = (key) => super[key];
|
return __async$d(this, null, function* () {
|
const imageSrc = this.getImageIcon();
|
if (imageSrc.length > 0) {
|
const imageValid = yield this.checkImageSource(imageSrc);
|
if (!imageValid) {
|
this.classList.add("invalid-image-src");
|
}
|
}
|
if (this.initialActive) {
|
this.active = true;
|
}
|
__superGet("firstUpdated").call(this, _changedProperties);
|
});
|
}
|
checkImageSource(src) {
|
return __async$d(this, null, function* () {
|
return new Promise((resolve) => {
|
const img = new Image();
|
img.onload = () => {
|
resolve(true);
|
};
|
img.onerror = () => {
|
resolve(false);
|
};
|
img.src = src;
|
});
|
});
|
}
|
};
|
ToolbarButtonComponent.styles = [
|
__superStaticGet$a(ToolbarButtonComponent, "styles") || [],
|
i`${r(css_248z$7)}`
|
];
|
__decorateClass$a([
|
n({ type: String, reflect: true, attribute: "title-text" })
|
], ToolbarButtonComponent.prototype, "titleText", 2);
|
__decorateClass$a([
|
n({ type: String, reflect: true, attribute: "config-id" })
|
], ToolbarButtonComponent.prototype, "configId", 2);
|
__decorateClass$a([
|
n({ type: String, reflect: true, attribute: "icon" })
|
], ToolbarButtonComponent.prototype, "icon", 2);
|
__decorateClass$a([
|
n({ type: String, reflect: true, attribute: "active-icon" })
|
], ToolbarButtonComponent.prototype, "activeIcon", 2);
|
__decorateClass$a([
|
n({ type: Boolean, reflect: true, attribute: "handle-active" })
|
], ToolbarButtonComponent.prototype, "handleActive", 2);
|
__decorateClass$a([
|
n({ type: Boolean, reflect: true, attribute: "prevent-click-on-active" })
|
], ToolbarButtonComponent.prototype, "preventClickOnActive", 2);
|
__decorateClass$a([
|
n({ type: Boolean, reflect: true, attribute: "active-is-loading" })
|
], ToolbarButtonComponent.prototype, "activeIsLoading", 2);
|
__decorateClass$a([
|
n({ type: String, reflect: true, attribute: "event-id" })
|
], ToolbarButtonComponent.prototype, "eventId", 2);
|
__decorateClass$a([
|
n({ type: Boolean, reflect: true, attribute: "initial-active" })
|
], ToolbarButtonComponent.prototype, "initialActive", 2);
|
ToolbarButtonComponent = __decorateClass$a([
|
e("fv-toolbar-button")
|
], ToolbarButtonComponent);
|
|
var __defProp$9 = Object.defineProperty;
|
var __getOwnPropDesc$9 = Object.getOwnPropertyDescriptor;
|
var __getProtoOf$9 = Object.getPrototypeOf;
|
var __reflectGet$9 = Reflect.get;
|
var __decorateClass$9 = (decorators, target, key, kind) => {
|
var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$9(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$9(target, key, result);
|
return result;
|
};
|
var __superStaticGet$9 = (obj, member) => __reflectGet$9(__getProtoOf$9(obj), member, obj);
|
var __async$c = (__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 HrModeToolbarButtonComponent = class extends ToolbarButtonComponent {
|
constructor() {
|
super();
|
this.popupSelector = "";
|
this.listSelector = "";
|
this.popupCloserSelector = "";
|
this.hrThemeCount = 0;
|
this.configId = "new_hr_mode";
|
this.addEventListener("connected", () => __async$c(this, null, function* () {
|
yield RequestHelperService.fetchConfiguration();
|
const themes = yield CommunicationMessageService.getHRThemes();
|
this.hrThemeCount = Object.keys(themes).length;
|
this.requestUpdate();
|
}));
|
this.addEventListener("fv-toolbar-button-clicked", () => {
|
var _a, _b;
|
let popupComponent = ComponentService.find("FV-POPUP", this.popupSelector ? this.popupSelector : "");
|
if (popupComponent == void 0) {
|
popupComponent = new PopupComponent();
|
document.body.append(popupComponent);
|
}
|
const element = this.renderRoot.querySelector("button");
|
if (element == void 0)
|
return;
|
popupComponent.owner = element;
|
if (this.classList.contains("prevent-pointer")) {
|
popupComponent.pointer = false;
|
}
|
let hrListComponent = ComponentService.find("FV-HR-LIST", this.listSelector ? this.listSelector : "");
|
if (hrListComponent == void 0) {
|
hrListComponent = new HRListComponent();
|
popupComponent.append(hrListComponent);
|
}
|
const hidePopup = (e) => {
|
var _a2, _b2;
|
popupComponent.hide();
|
this.active = false;
|
hrListComponent.removeEventListener("onChange", hidePopup);
|
(_b2 = (_a2 = CommunicationInterfaceService.FurnviewWebViewer) == null ? void 0 : _a2.contentWindow) == null ? void 0 : _b2.removeEventListener("mousedown", hidePopup);
|
};
|
hrListComponent.addEventListener("onChange", hidePopup);
|
(_b = (_a = CommunicationInterfaceService.FurnviewWebViewer) == null ? void 0 : _a.contentWindow) == null ? void 0 : _b.addEventListener("mousedown", hidePopup, { passive: true, capture: true });
|
if (popupComponent.IsActive) {
|
popupComponent.hide();
|
} else {
|
popupComponent.show();
|
hrListComponent.onResize();
|
}
|
});
|
}
|
connectedCallback() {
|
super.connectedCallback();
|
this.dispatchEvent(new CustomEvent("connected"));
|
}
|
build(inner) {
|
if (this.hrThemeCount < 1) {
|
this.classList.add("disabled-in-config");
|
return x``;
|
}
|
return super.build(inner);
|
}
|
render() {
|
const icon = this.getImageIcon();
|
if (icon) {
|
return this.build(x`<img class="image" src=${icon}/>`);
|
} else if (this.icon) {
|
return this.build(x`<i class="icon ${this.icon}" part="icon hr-mode"></i>`);
|
}
|
return this.build(x`<slot></slot>`);
|
}
|
};
|
HrModeToolbarButtonComponent.styles = __superStaticGet$9(HrModeToolbarButtonComponent, "styles") || [];
|
__decorateClass$9([
|
n({ type: String, reflect: true, attribute: "popup-selector" })
|
], HrModeToolbarButtonComponent.prototype, "popupSelector", 2);
|
__decorateClass$9([
|
n({ type: String, reflect: true, attribute: "list-selector" })
|
], HrModeToolbarButtonComponent.prototype, "listSelector", 2);
|
__decorateClass$9([
|
n({ type: String, reflect: true, attribute: "popup-closer-selector" })
|
], HrModeToolbarButtonComponent.prototype, "popupCloserSelector", 2);
|
HrModeToolbarButtonComponent = __decorateClass$9([
|
e("fv-hr-mode-toolbar-button")
|
], HrModeToolbarButtonComponent);
|
|
var __defProp$8 = Object.defineProperty;
|
var __getOwnPropDesc$8 = Object.getOwnPropertyDescriptor;
|
var __getProtoOf$8 = Object.getPrototypeOf;
|
var __reflectGet$8 = Reflect.get;
|
var __decorateClass$8 = (decorators, target, key, kind) => {
|
var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$8(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$8(target, key, result);
|
return result;
|
};
|
var __superStaticGet$8 = (obj, member) => __reflectGet$8(__getProtoOf$8(obj), member, obj);
|
var __async$b = (__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 AnimationToolbarButtonComponent = class extends ToolbarButtonComponent {
|
clickEvent(e) {
|
var __superGet = (key) => super[key];
|
return __async$b(this, null, function* () {
|
__superGet("clickEvent").call(this, e);
|
const status = yield CommunicationMessageService.getAnimationStatus();
|
if (status.running) {
|
yield CommunicationMessageService.setAnimationMode(status.mode, true);
|
if (this.handleActive) {
|
this.active = status.mode;
|
}
|
return;
|
}
|
yield CommunicationMessageService.setAnimationMode(!status.mode, false);
|
if (this.handleActive) {
|
this.active = !status.mode;
|
}
|
});
|
}
|
constructor() {
|
super();
|
this.configId = "toolbar_button_animation";
|
}
|
connectedCallback() {
|
super.connectedCallback();
|
}
|
render() {
|
return super.render();
|
}
|
};
|
AnimationToolbarButtonComponent.styles = __superStaticGet$8(AnimationToolbarButtonComponent, "styles") || [];
|
AnimationToolbarButtonComponent = __decorateClass$8([
|
e("fv-animation-toolbar-button")
|
], AnimationToolbarButtonComponent);
|
|
var css_248z$6 = 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{align-items:var(--card-align-items,center);aspect-ratio:var(--card-aspect-ratio,1/1);background:var(--card-background,#fff);border:var(--card-border,unset);border-radius:var(--card-border-radius,unset);box-shadow:var(--card-box-shadow,unset);color:var(--card-text-color,var(--primary-color,red));cursor:var(--card-cursor,pointer);display:flex;flex-direction:var(--card-flex-direction,column);font-size:var(--card-font-size,unset);justify-content:var(--card-justify-content,center);margin:var(--card-margin,unset);max-height:var(--card-max-height,initial);max-width:var(--card-max-width,initial);min-height:var(--card-min-height,initial);min-width:var(--card-min-width,initial);overflow:hidden;padding:var(--card-padding,unset);position:relative;width:var(--card-width,15vw)}:host(:hover){background:var(--card-hover-background,var(--card-background,#fff));border:var(--card-hover-border,var(--card-border,unset));border-radius:var(--card-hover-border-radius,var(--card-border-radius,unset));box-shadow:var(--card-hover-box-shadow,var(--card-box-shadow,unset));color:var(--card-hover-text-color,var(--card-text-color,var(--primary-color,red)));font-size:var(--card-hover-font-size,var(--card-font-size,unset));margin:var(--card-hover-margin,var(--card-margin,unset));padding:var(--card-hover-padding,var(--card-padding,unset))}:host(.active){background:var(--card-active-background,var(--card-background,#fff));border:var(--card-active-border,var(--card-border,unset));border-radius:var(--card-active-border-radius,var(--card-border-radius,unset))}:host(.active:hover){background:var(--card-active-hover-background,var(--card-active-background,var(--card-background,#fff)));border:var(--card-active-hover-border,var(--card-active-border,var(--card-border,unset)));border-radius:var(--card-active-hover-border-radius,var(--card-active-border-radius,var(--card-border-radius,unset)))}:host(.disabled-card){background:var(--card-disabled-background,var(--card-background,#fff));border:var(--card-disabled-border,var(--card-border,unset));border-radius:var(--card-disabled-border-radius,var(--card-border-radius,unset))}:host(.disabled-card:hover){background:var(--card-disabled-hover-background,var(--card-disabled-background,var(--card-background,#fff)));border:var(--card-disabled-hover-border,var(--card-disabled-border,var(--card-border,unset)));border-radius:var(--card-disabled-hover-border-radius,var(--card-disabled-border-radius,var(--card-border-radius,unset)))}:host(.zoom-on-hover){transform:scale(1);transition:transform var(--card-hover-zoom-transition-time,.7s)}:host(.zoom-on-hover:hover){transform:scale(var(--card-hover-zoom,1.3))!important}:host(.grid-card){display:grid;gap:var(--grid-card-gap,0);grid-template-columns:var(--grid-card-columns,repeat(var(--grid-card-auto-column-count,4),calc(100%/var(--grid-card-auto-column-count, 4))));grid-template-rows:var(--grid-card-rows,unset)}@media (width <= 520px){:host(.grid-card){display:grid;gap:var(--grid-card-mobile-gap,var(--grid-card-gap,0));grid-template-columns:var(--grid-card-mobile-columns,repeat(var(--grid-card-mobile-auto-column-count,var(--grid-card-auto-column-count,4)),calc(100%/var(--grid-card-mobile-auto-column-count, var(--grid-card-auto-column-count, 4)))));grid-template-rows:var(--grid-card-mobile-rows,var(--grid-card-rows,unset))}:host{aspect-ratio:var(--card-mobile-aspect-ratio,var(--card-aspect-ratio,1/1));max-height:var(--card-mobile-max-height,var(--card-max-height,initial));max-width:var(--card-mobile-max-width,var(--card-max-width,initial));min-height:var(--card-mobile-min-height,var(--card-min-height,initial));min-width:var(--card-mobile-min-width,var(--card-min-width,initial));padding:var(--card-mobile-padding,var(--card-padding,unset))}:host(:hover){padding:var(--card-mobile-hover-padding,var(--card-mobile-padding,var(--card-padding,unset)))}}@media (width >= 520px) and (width <= 980px){:host(.grid-card){display:grid;gap:var(--grid-card-mobile-gap,var(--grid-card-gap,0));grid-template-columns:var(--grid-card-mobile-columns,repeat(var(--grid-card-mobile-auto-column-count,var(--grid-card-auto-column-count,4)),calc(100%/var(--grid-card-mobile-auto-column-count, var(--grid-card-auto-column-count, 4)))));grid-template-rows:var(--grid-card-mobile-rows,var(--grid-card-rows,unset))}:host{aspect-ratio:var(--card-mobile-aspect-ratio,var(--card-aspect-ratio,1/1));max-height:var(--card-mobile-max-height,var(--card-max-height,initial));max-width:var(--card-mobile-max-width,var(--card-max-width,initial));min-height:var(--card-mobile-min-height,var(--card-min-height,initial));min-width:var(--card-mobile-min-width,var(--card-min-width,initial));padding:var(--card-mobile-padding,var(--card-padding,unset))}:host(:hover){padding:var(--card-mobile-hover-padding,var(--card-mobile-padding,var(--card-padding,unset)))}}`;
|
|
var __defProp$7 = Object.defineProperty;
|
var __getOwnPropDesc$7 = Object.getOwnPropertyDescriptor;
|
var __getProtoOf$7 = Object.getPrototypeOf;
|
var __reflectGet$7 = Reflect.get;
|
var __decorateClass$7 = (decorators, target, key, kind) => {
|
var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$7(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$7(target, key, result);
|
return result;
|
};
|
var __superStaticGet$7 = (obj, member) => __reflectGet$7(__getProtoOf$7(obj), member, obj);
|
var __async$a = (__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());
|
});
|
};
|
class CardClickEvent extends CustomEvent {
|
constructor(data) {
|
super("cardclick", { detail: data, bubbles: true });
|
}
|
}
|
class CardClickedEvent extends CustomEvent {
|
constructor(data) {
|
super("cardclicked", { detail: data, bubbles: true });
|
}
|
}
|
const _BaseCard = class extends BaseElement {
|
constructor() {
|
super(false);
|
this.data = {};
|
this._cardContainerClickData = void 0;
|
this.UpdatePostLocalesModelRead();
|
this.addEventListener("click", (e) => {
|
this.clicked();
|
});
|
}
|
get imageSrc() {
|
let src = "";
|
if (this.data.image != void 0) {
|
if (this.data.image != void 0) {
|
if (this.data.image.prefix != void 0 && this.data.image.prefix.length > 0) {
|
src += this.data.image.prefix;
|
}
|
if (this.data.image.file != void 0 && this.data.image.file.length > 0) {
|
src += this.data.image.file;
|
}
|
}
|
}
|
return src;
|
}
|
set cardContainerClickData(data) {
|
this._cardContainerClickData = data;
|
}
|
UpdatePostLocalesModelRead() {
|
return __async$a(this, null, function* () {
|
yield LocalesModel.IsFileRead();
|
this.requestUpdate();
|
});
|
}
|
UpdateDrag() {
|
DragDropHelperService.removeElement(this);
|
if (this.data.dragable && this._cardContainerClickData != void 0 && this.data != void 0) {
|
const dragData = CardDataService.GetFormattedCardDragData(this.data, this._cardContainerClickData.context);
|
if (dragData != void 0) {
|
let imgSrc = this.imageSrc;
|
if (imgSrc.length < 1) {
|
imgSrc = "nix";
|
}
|
this.setAttribute("drag-image", imgSrc);
|
DragDropHelperService.addElement(this, dragData, ComponentService.findScrollableParent(this));
|
}
|
}
|
}
|
collectAdditionalCardClickEventKeyValuePairs() {
|
if (this.data.additional == void 0 || this.data.additional["selected-filters"] == void 0)
|
return new Array();
|
if (this._cardContainerClickData == void 0)
|
return new Array();
|
const buttonsFilter = this.data.additional["selected-filters"];
|
if (buttonsFilter == void 0)
|
return new Array();
|
let relevantValues = this._cardContainerClickData.context.settings.Card["card-click-events-relevant-selection-filter-values"];
|
if (relevantValues == void 0) {
|
relevantValues = this._cardContainerClickData.context.settings.Card["card-click-events-relevant-buttons-filter-values"];
|
console.warn("'card-click-events-relevant-buttons-filter-values' was replaced with 'card-click-events-relevant-selection-filter-values'! Still works (fow now), but do not use in new projects!");
|
if (relevantValues == void 0)
|
return new Array();
|
}
|
const additional = new Array();
|
for (const buttonFilter of buttonsFilter) {
|
for (const levelKey of buttonFilter.filter) {
|
const relevantValue = relevantValues.find((value) => {
|
return levelKey == value["card-data-level-key"];
|
});
|
if (relevantValue == void 0)
|
continue;
|
additional.push({
|
key: relevantValue.placeholder,
|
data: relevantValue["card-data-level-key"].toString()
|
});
|
}
|
}
|
return additional;
|
}
|
clicked() {
|
return __async$a(this, null, function* () {
|
if (this._cardContainerClickData != void 0 && this._cardContainerClickData["handle-click"]) {
|
if (this.data.click) {
|
const additionalKeys = this.collectAdditionalCardClickEventKeyValuePairs();
|
for (const preCardClickEvent of this._cardContainerClickData.context.settings.Card["pre-click-events"]) {
|
const preClickEventData = preCardClickEvent.data ? CardDataService.PrepareClickedCardEventData(preCardClickEvent.data, this.data.click, additionalKeys) : {};
|
preClickEventData["clicked-card"] = { "data": this.data };
|
yield EventHandlerService.dispatchAsyncEvent(preCardClickEvent.id, preClickEventData);
|
}
|
this._cardContainerClickData.container.dispatchEvent(new CardClickEvent({ data: this.data, settings: this._cardContainerClickData.context.settings }));
|
yield CardDataService.ClickCard(this.data, this._cardContainerClickData.context);
|
this._cardContainerClickData.container.dispatchEvent(new CardClickedEvent({ data: this.data, settings: this._cardContainerClickData.context.settings }));
|
if (this._cardContainerClickData.context.settings.Behaviour["mark-selected"]) {
|
this.classList.add("selected");
|
}
|
for (const postCardClickEvent of this._cardContainerClickData.context.settings.Card["post-click-events"]) {
|
const postClickEventData = postCardClickEvent.data ? CardDataService.PrepareClickedCardEventData(postCardClickEvent.data, this.data.click, additionalKeys) : {};
|
postClickEventData["clicked-card"] = { "data": this.data };
|
yield EventHandlerService.dispatchAsyncEvent(postCardClickEvent.id, postClickEventData);
|
}
|
}
|
}
|
});
|
}
|
render() {
|
this.UpdateDrag();
|
return x``;
|
}
|
updated(changedProperties) {
|
super.updated(changedProperties);
|
if (this.data.active) {
|
this.classList.add("active");
|
} else {
|
this.classList.remove("active");
|
}
|
if (this.data.disabled) {
|
this.classList.add("disabled-card");
|
} else {
|
this.classList.remove("disabled-card");
|
}
|
}
|
};
|
let BaseCard = _BaseCard;
|
BaseCard.styles = [
|
__superStaticGet$7(_BaseCard, "styles") || [],
|
i`${r(css_248z$6)}`
|
];
|
__decorateClass$7([
|
n({ type: Object, reflect: true, attribute: "data" })
|
], BaseCard.prototype, "data", 2);
|
|
class InternalCardContainerList {
|
constructor() {
|
this._containers = new Array();
|
}
|
Get(id) {
|
for (const container of this._containers) {
|
if (container.id == id || container.id == "slot-" + id) {
|
return container;
|
}
|
}
|
return void 0;
|
}
|
Remove(container) {
|
this._containers.splice(this._containers.indexOf(container), 1);
|
}
|
_CreateSlot(id, card, details) {
|
const slot = document.createElement("slot");
|
slot.id = "slot-" + id;
|
if (details["slot-name"].length > 0) {
|
slot.name = details["slot-name"];
|
} else {
|
slot.name = card.click && card.click["level-key"] ? card.click["level-key"] + "" : "";
|
}
|
this._containers.push(slot);
|
return slot;
|
}
|
_updateElementDetails(container, card, details) {
|
if (details.settings != void 0) {
|
const settings = new CardContainerSettings();
|
if (details["fetch-parameters"]) {
|
settings.parameters = details["fetch-parameters"];
|
} else {
|
settings.parameters = details.settings;
|
}
|
settings.fetchFilter = {
|
"level-key-filter": settings.Fetch.filter["level-key-filter"],
|
"property-keys": {
|
keys: [card.click && card.click["level-key"] ? card.click["level-key"] + "" : ""]
|
},
|
"suspend-until-triggered": settings.Fetch["suspend-until-triggered"]
|
};
|
container.FetchParameters = settings.ToJson();
|
}
|
if (details["style-vars"] != void 0) {
|
const newContainerStyleVarsKeys = Object.keys(details["style-vars"]);
|
newContainerStyleVarsKeys.forEach((key) => {
|
if (key.startsWith("--")) {
|
if (container && details["style-vars"]) {
|
container.style.setProperty(key, details["style-vars"][key]);
|
}
|
}
|
});
|
}
|
if (details.modules) {
|
for (const module of details.modules) {
|
ConstructionService.loadModule(module, container);
|
}
|
}
|
if (details.classes) {
|
container.classList.add(...details.classes);
|
}
|
}
|
_CreateElement(id, card, details) {
|
const container = document.createElement(details.tag);
|
container.id = id;
|
this._updateElementDetails(container, card, details);
|
this._containers.push(container);
|
return container;
|
}
|
Add(id, card, details) {
|
if (details.tag.length < 1) {
|
return this._CreateSlot(id, card, details);
|
}
|
return this._CreateElement(id, card, details);
|
}
|
Update(container, card, details) {
|
if (container instanceof BaseCardContainer) {
|
if (details.tag.length < 1) {
|
this.Remove(container);
|
container = this.Add(container.id, card, details);
|
return;
|
}
|
this._updateElementDetails(container, card, details);
|
container.Refetch();
|
return;
|
}
|
if (container instanceof HTMLSlotElement) {
|
if (details.tag.length > 0) {
|
this.Remove(container);
|
container = this.Add(container.id, card, details);
|
return;
|
}
|
if (details["slot-name"].length > 0) {
|
container.name = details["slot-name"];
|
} else {
|
container.name = card.click && card.click["level-key"] ? card.click["level-key"] + "" : "";
|
}
|
return;
|
}
|
}
|
}
|
|
var __async$9 = (__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());
|
});
|
};
|
class CardElementCreator {
|
constructor() {
|
this.displayElements = new Array();
|
}
|
createUniqueCardIdentifierFromKeys(levelKey, nextLevelKey, debugData) {
|
let key = levelKey != void 0 ? levelKey : "";
|
if (typeof levelKey === "number") {
|
key = levelKey.toFixed(0);
|
}
|
if (key.length > 0) {
|
key = key.replaceAll(" ", "");
|
}
|
let nextKey = nextLevelKey != void 0 ? nextLevelKey : "";
|
if (typeof nextLevelKey === "number") {
|
nextKey = nextLevelKey.toFixed(0);
|
}
|
if (nextKey.length > 0) {
|
nextKey = nextKey.replaceAll(" ", "");
|
}
|
if (key.length < 1 && nextKey.length < 1) {
|
console.error("BaseCardContainer - Error! could not create UniqueCardIdentifier debug-data:", debugData);
|
}
|
return key + "-" + nextKey;
|
}
|
createCard(data, context, container) {
|
if (data == void 0)
|
return void 0;
|
const card = document.createElement(context.settings.Card.tag);
|
card.classList.add(...container.mobile ? context.settings.Card["mobile-classes"] : context.settings.Card.classes);
|
card.classList.add(this.createUniqueCardIdentifierFromKeys(data.click ? data.click["level-key"] : "", data.click ? data.click["next-level-key"] : "", data));
|
card.cardContainerClickData = {
|
"handle-click": true,
|
context,
|
container
|
};
|
data.dragable = context.settings.Card.dragable;
|
data.tooltip = context.settings.Card.tooltip;
|
card.data = data;
|
card.data.translate = context.settings.Card.translate;
|
if (data.modules) {
|
for (const module of data.modules) {
|
ConstructionService.loadModule(module, card);
|
}
|
}
|
return card;
|
}
|
pushCardElementToInterimArray(displayElements, card, context, container) {
|
const cardElement = this.createCard(card, context, container);
|
if (cardElement) {
|
displayElements.push(cardElement);
|
}
|
}
|
createDisplayElements(levels, context, container) {
|
this.displayElements = new Array();
|
if (levels.size == 1) {
|
const keys = levels.keys();
|
if (keys) {
|
const next = keys.next();
|
if (next && next.value) {
|
const level = levels.get(next.value);
|
if (level) {
|
level.cards.forEach((card) => {
|
this.pushCardElementToInterimArray(this.displayElements, card, context, container);
|
});
|
if (level.cards.length === 0) {
|
this.pushCardElementToInterimArray(this.displayElements, null, context, container);
|
}
|
}
|
}
|
}
|
} else if (levels.size > 1) {
|
const styleVarsAll = context.settings.Levels["style-vars-all"];
|
const styleVarsAllKeys = Object.keys(styleVarsAll);
|
levels.forEach((level, levelKey) => {
|
if (level.title && level.title.length > 0 && context.settings.Levels.titled) {
|
const levelTitleElement = document.createElement("fv-label");
|
levelTitleElement.setAttribute("i18n", level.title);
|
levelTitleElement.innerText = level.title;
|
levelTitleElement.classList.add("level-title");
|
if (context.settings.Levels["single-value-invisible"] && level.cards.length == 1) {
|
levelTitleElement.classList.add("invisible");
|
}
|
this.displayElements.push(levelTitleElement);
|
}
|
const levelElement = document.createElement(context.settings.Levels.tag);
|
levelElement.classList.add("level");
|
if (context.settings.Levels["single-value-invisible"] && level.cards.length == 1) {
|
levelElement.classList.add("invisible");
|
}
|
if (level.cards.length < 1) {
|
levelElement.setAttribute("hide-element", "");
|
}
|
const styleVars = context.settings.Levels["style-vars"][levelKey];
|
if (styleVars) {
|
const styleVarKeys = Object.keys(styleVars);
|
styleVarKeys.forEach((key) => {
|
if (key.startsWith("--")) {
|
levelElement.style.setProperty(key, styleVars[key]);
|
}
|
});
|
}
|
styleVarsAllKeys.forEach((key) => {
|
if (key.startsWith("--")) {
|
levelElement.style.setProperty(key, styleVarsAll[key]);
|
}
|
});
|
const levelChildElements = new Array();
|
level.cards.forEach((card) => {
|
this.pushCardElementToInterimArray(levelChildElements, card, context, container);
|
});
|
if (level.cards.length === 0) {
|
this.pushCardElementToInterimArray(this.displayElements, null, context, container);
|
}
|
levelChildElements.forEach((childElement) => {
|
levelElement.appendChild(childElement);
|
});
|
let levelKeyTxt = levelKey;
|
if (typeof levelKeyTxt == "number") {
|
levelKeyTxt = levelKeyTxt.toString();
|
}
|
levelElement.setAttribute("level", levelKeyTxt);
|
this.displayElements.push(levelElement);
|
});
|
}
|
}
|
get Elements() {
|
return this.displayElements;
|
}
|
CreateRenderedCards(levels, context, container) {
|
this.createDisplayElements(levels, context, container);
|
const filled = this.Elements.length > 0;
|
const fillStateEvents = filled ? container.events["fill-state-filled"] : container.events["fill-state-empty"];
|
if (fillStateEvents != void 0) {
|
window.dispatchEvent(new EventHandlerDispatchEvent({
|
async: false,
|
events: fillStateEvents
|
}));
|
}
|
if (filled == false) {
|
container.classList.add("empty");
|
} else if (container.Settings.Behaviour["single-card-hide"] && this.Elements.length < 2) {
|
container.classList.add("empty");
|
} else {
|
container.classList.remove("empty");
|
}
|
const containerTag = container.mobile ? context.settings.AutomaticContainer.mobile.tag : context.settings.AutomaticContainer.tag;
|
const containerClasses = container.mobile ? context.settings.AutomaticContainer.mobile.classes : context.settings.AutomaticContainer.classes;
|
const containerStyleVars = container.mobile ? context.settings.AutomaticContainer.mobile["style-vars"] : context.settings.AutomaticContainer["style-vars"];
|
const containerStyleVarsKeys = Object.keys(containerStyleVars);
|
const containerElement = document.createElement(containerTag);
|
containerElement.classList.add(...containerClasses);
|
containerElement.style.boxSizing = "border-box";
|
containerStyleVarsKeys.forEach((key) => {
|
if (key.startsWith("--")) {
|
containerElement.style.setProperty(key, containerStyleVars[key]);
|
}
|
});
|
this.Elements.forEach((element) => {
|
containerElement.appendChild(element);
|
});
|
let renderResult = void 0;
|
if (filled) {
|
renderResult = x`${containerElement}`;
|
}
|
return renderResult;
|
}
|
}
|
class CardElementSliderFilterCreator extends CardElementCreator {
|
constructor() {
|
super(...arguments);
|
this.dimensions = new Array();
|
this.activeDimensions = new Array();
|
}
|
createDisplayElements(levels, context, container) {
|
var _a, _b;
|
this.dimensions = new Array();
|
this.activeDimensions = new Array();
|
for (const [key, level] of levels) {
|
for (const card of level.cards) {
|
if ((_a = card.click) == null ? void 0 : _a["level-key"]) {
|
const levelKey = +((_b = card.click) == null ? void 0 : _b["level-key"]);
|
this.dimensions.push(levelKey);
|
if (!card.disabled) {
|
this.activeDimensions.push(levelKey);
|
}
|
}
|
}
|
}
|
if (this.dimensions.length == 0 && this.activeDimensions.length == 0) {
|
this.displayElements = new Array();
|
return;
|
}
|
if (container.useCards !== void 0 && container.useCards === true) {
|
return super.createDisplayElements(levels, context, container);
|
}
|
this.displayElements = new Array();
|
this.displayElements.push(container.getBaseSliderState(this.dimensions, this.activeDimensions));
|
return;
|
}
|
get Dimensions() {
|
return this.dimensions;
|
}
|
get ActiveDimensions() {
|
return this.activeDimensions;
|
}
|
}
|
class CardElementAccordionCreator extends CardElementCreator {
|
constructor() {
|
super(...arguments);
|
this._internalContainers = new InternalCardContainerList();
|
}
|
pushCardElementToInterimArray(displayElements, card, context, container) {
|
if (card == void 0)
|
return;
|
const cardElement = this.createCard(card, context, container);
|
if (cardElement == void 0)
|
return;
|
cardElement.slot = "header";
|
const id = card.click && card.click["level-key"] ? card.click["level-key"] + "" : "";
|
const details = {
|
tag: container.cardContainersToCreate.tag,
|
settings: container.cardContainersToCreate.settings,
|
"fetch-parameters": container.cardContainersToCreate["fetch-parameters"] != void 0 ? container.cardContainersToCreate["fetch-parameters"] : void 0,
|
"style-vars": container.cardContainersToCreate["style-vars"] != void 0 ? container.cardContainersToCreate["style-vars"] : {},
|
modules: container.cardContainersToCreate.modules != void 0 ? container.cardContainersToCreate.modules : [],
|
classes: container.cardContainersToCreate.classes != void 0 ? container.cardContainersToCreate.classes : [],
|
"slot-name": container.overwriteToggleContainerSlotName
|
};
|
let _container = this._internalContainers.Get(id);
|
if (_container == void 0) {
|
_container = this._internalContainers.Add(id, card, details);
|
} else {
|
this._internalContainers.Update(_container, card, details);
|
}
|
const levelIdentifier = card.click && card.click["level-key"] ? card.click["level-key"] + "" : "no-level";
|
const item = document.createElement("fv-accordion-item");
|
item.allowCloseOfForcedOpen = true;
|
item.headerAsSlot = true;
|
item.AddHeaderClickDefer(() => __async$9(this, null, function* () {
|
yield CardDataService.WaitForAllCardContainerFetchPromises();
|
}));
|
item.setAttribute("level-identifier", levelIdentifier);
|
if (card.image) {
|
item.Image = card.image.prefix + card.image.file;
|
}
|
item.appendChild(cardElement);
|
if (_container != void 0) {
|
item.appendChild(_container);
|
}
|
if (levelIdentifier == container.Open) {
|
item.AddConnectedCallbackAction(() => __async$9(this, null, function* () {
|
item.forceOpen();
|
}));
|
}
|
displayElements.push(item);
|
}
|
}
|
|
var css_248z$5 = 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{align-items:var(--card-container-align-items,unset);display:var(--card-container-display,unset);flex-direction:var(--card-container-flex-direction,unset);gap:var(--card-container-gap,unset);grid-template-columns:var(--card-container-grid-template-columns,unset);grid-template-rows:var(--card-container-grid-template-rows,unset);height:var(--card-container-height,unset);justify-content:var(--card-container-justify-content,unset);overflow:var(--card-container-overflow,unset);position:var(--card-container-position,relative);width:var(--card-container-width,unset);z-index:var(--card-container-z-index,unset)}:host .back-button{left:0;position:absolute;top:0}:host .loader-slot{display:none}:host(.empty){display:none}:host(.empty.show-loader){display:block}:host(.empty.show-loader.not-loading-hide-before) .before-slot{display:none}:host(.empty.show-loader.loading){height:var(--card-container-loading-height,unset)}:host(.empty.show-loader.loading) .loader-slot{display:contents}:host(.empty.empty-show-anyway){display:var(--card-container-display,unset)}@media (width <= 520px){:host{overflow:var(--card-container-mobile-overflow,var(--card-container-overflow,unset))}}@media (width >= 520px) and (width <= 980px){:host{overflow:var(--card-container-mobile-overflow,var(--card-container-overflow,unset))}}`;
|
|
var __defProp$6 = Object.defineProperty;
|
var __getOwnPropDesc$6 = Object.getOwnPropertyDescriptor;
|
var __getProtoOf$6 = Object.getPrototypeOf;
|
var __reflectGet$6 = Reflect.get;
|
var __decorateClass$6 = (decorators, target, key, kind) => {
|
var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$6(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$6(target, key, result);
|
return result;
|
};
|
var __superStaticGet$6 = (obj, member) => __reflectGet$6(__getProtoOf$6(obj), member, obj);
|
var __async$8 = (__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());
|
});
|
};
|
const _BaseCardContainer = class extends AsyncBaseElement {
|
constructor(observeLocales = true) {
|
super(observeLocales);
|
this.events = {};
|
this.showBeforeSlot = true;
|
this.filter = void 0;
|
this.cardCreator = new CardElementCreator();
|
this.states = new CardContainerStates(this);
|
this.cardData = void 0;
|
this.filteredFetchResult = void 0;
|
this.additionalData = new CardContainerAdditionalData(this);
|
_BaseCardContainer.shared.AddTagName(this.tagName);
|
this.addHideStateUpdatedEventListener((hidden, parentStateChanged) => {
|
if (this.events["hide-show-ignore-parent-change"] == true && parentStateChanged) {
|
return;
|
}
|
if (this.events["hide-show-only-after-first-fill"]) {
|
if (this.LastRenderResult == void 0)
|
return;
|
}
|
const dispatch = (events) => {
|
if (events == void 0)
|
return;
|
window.dispatchEvent(new EventHandlerDispatchEvent({
|
async: false,
|
events
|
}));
|
};
|
if (this.events.hide || this.events.show) {
|
dispatch(hidden ? this.events.hide : this.events.show);
|
}
|
if (!hidden) {
|
CardDataService.CheckUpdate(CardDataUpdateEvent.CardContainerVisible, {}, this.Context).then((update) => {
|
if (update == CardContainerUpdate.NONE || update == CardContainerUpdate.FILTER) {
|
this.requestUpdate();
|
} else if (update == CardContainerUpdate.FETCH) {
|
this.Refetch();
|
}
|
});
|
}
|
});
|
this.settings = new CardContainerSettings();
|
this.addEventListener(CardContainerEvents.BackToStart, (event) => {
|
var _a, _b;
|
(_a = this.filter) == null ? void 0 : _a.Clear();
|
this.hideElement = false;
|
(_b = event.detail) == null ? void 0 : _b["post-event"]();
|
CardDataService.WaitForAllCardContainerFetchPromises().then(() => {
|
CardContainerEventContainer.RefreshAll(true, true);
|
CardContainerEventContainer.RefreshBackButtons();
|
});
|
});
|
this.addEventListener(CardContainerEvents.TriggerCardClick, (event) => {
|
if (event.detail == void 0)
|
return;
|
for (const levelKeyToOpen of event.detail) {
|
const cardElements = this.renderRoot.querySelectorAll(this.Settings.Card.tag);
|
cardElements.forEach((element) => {
|
if (element instanceof BaseCard) {
|
if (element.data.click == void 0)
|
return;
|
if (element.data.click["level-key"] != levelKeyToOpen)
|
return;
|
element.click();
|
}
|
});
|
}
|
});
|
}
|
set _legacysettigns(value) {
|
console.warn("BaseCardContainer> settings attribute is deprecated! use fetch-parameters instead!");
|
this.FetchParameters = value;
|
this.Refetch();
|
}
|
set ShowBeforeSlot(state) {
|
if (state == void 0)
|
return;
|
this.showBeforeSlot = state;
|
}
|
get ShowBeforeSlot() {
|
return this.showBeforeSlot;
|
}
|
connectedCallback() {
|
var _a;
|
super.connectedCallback();
|
CardDataService.Register(this);
|
this.settings.Initialize(this.FetchParameters);
|
(_a = this.Filter) == null ? void 0 : _a.Init(this.Context);
|
if (this.Filter != void 0) {
|
CardDataService.InitFilterSelectionParams(this.Context);
|
}
|
}
|
disconnectedCallback() {
|
super.disconnectedCallback();
|
CardDataService.Remove(this);
|
}
|
static get Shared() {
|
return _BaseCardContainer.shared;
|
}
|
get FilteredFetchResult() {
|
return this.filteredFetchResult;
|
}
|
get CardData() {
|
return this.cardData;
|
}
|
get Settings() {
|
return this.settings;
|
}
|
get Filter() {
|
return this.filter;
|
}
|
get States() {
|
return this.states;
|
}
|
get AdditionalData() {
|
return this.additionalData;
|
}
|
get Context() {
|
return {
|
settings: this.Settings,
|
states: this.States,
|
filter: this.Filter,
|
cards: this.CardData,
|
dispatchEvent: (event) => this.dispatchEvent(event)
|
};
|
}
|
Fetch(parameters) {
|
return __async$8(this, null, function* () {
|
this.states.UnrenderedFetch = true;
|
this.Settings.parameters = parameters;
|
this.States.ReadSelectedFiltersFromTargets();
|
return yield CardDataService.Fetch(this.Context);
|
});
|
}
|
CreateCards(result) {
|
if (!this.states.UnrenderedFetch) {
|
this.States.ReadSelectedFiltersFromTargets();
|
}
|
this.states.UnrenderedFetch = false;
|
this.filteredFetchResult = CardDataService.Filter(result, this.Context, this.Filter == void 0 ? new Array() : this.Filter.Filter);
|
return CardDataService.CreateCards(this.filteredFetchResult, this.Context);
|
}
|
renderComplete(result, renderResult) {
|
this.dispatchEvent(new CardContainerPreFillEvent());
|
if (result == void 0) {
|
return super.renderComplete(result, renderResult);
|
}
|
const old = this.cardData;
|
this.cardData = this.CreateCards(result);
|
if (this.Filter != void 0) {
|
this.Filter.PurgeRemovedCards(this.cardData);
|
}
|
if (this.LastRenderResult && old == this.cardData) {
|
return this.LastRenderResult;
|
}
|
const renderedCards = this.cardCreator.CreateRenderedCards(this.cardData, this.Context, this);
|
return super.renderComplete(result, x`
|
<slot class="loader-slot" name="loader"></slot>
|
${this.ShowBeforeSlot ? x`<slot class="before-slot" name="before"></slot>` : x``}
|
${renderedCards}
|
`);
|
}
|
updated(_changedProperties) {
|
super.updated(_changedProperties);
|
window.dispatchEvent(new UpdatedEvent(this));
|
this.dispatchEvent(new CardContainerPostFillEvent());
|
}
|
};
|
let BaseCardContainer = _BaseCardContainer;
|
BaseCardContainer.styles = [
|
__superStaticGet$6(_BaseCardContainer, "styles") || [],
|
i`${r(css_248z$5)}`
|
];
|
BaseCardContainer.shared = new CardContainersSharedData();
|
__decorateClass$6([
|
n({ type: Object, reflect: true, attribute: "settings" })
|
], BaseCardContainer.prototype, "_legacysettigns", 1);
|
__decorateClass$6([
|
n({ type: Object, reflect: true, attribute: "events" })
|
], BaseCardContainer.prototype, "events", 2);
|
|
class CardContainerEventContainer {
|
static RefreshAll(refetch, includeHidden, selectionResultFilterResetTargets = void 0, selectionResultFilterResetExcludes = void 0, forceSwapSelectedProgramBeforeRefetch = "") {
|
let components = BaseCardContainer.Shared.AllContainers;
|
if (selectionResultFilterResetTargets) {
|
const resetTargetElements = new Array();
|
for (const resetTarget of selectionResultFilterResetTargets) {
|
resetTargetElements.push(...ComponentService.findAll(resetTarget.tag, resetTarget.query));
|
}
|
for (const resetTargetElement of resetTargetElements) {
|
if (resetTargetElement.Filter != void 0) {
|
resetTargetElement.Filter.Reset(false, resetTargetElement.Context);
|
}
|
}
|
}
|
if (selectionResultFilterResetExcludes) {
|
const excluded = [];
|
for (const excludedResetTarget of selectionResultFilterResetExcludes) {
|
excluded.push(...ComponentService.findAll(excludedResetTarget.tag, excludedResetTarget.query));
|
}
|
components = components.filter((x) => !excluded.includes(x));
|
}
|
if (refetch) {
|
for (const component of components) {
|
if (component.hideElement && includeHidden == false)
|
continue;
|
if (forceSwapSelectedProgramBeforeRefetch !== void 0 && forceSwapSelectedProgramBeforeRefetch !== "") {
|
component.Settings.Program = forceSwapSelectedProgramBeforeRefetch;
|
}
|
component.Refetch();
|
}
|
} else {
|
for (const component of components) {
|
if (component.hideElement && includeHidden == false)
|
continue;
|
component.requestUpdate();
|
}
|
}
|
}
|
static RefreshBackButtons() {
|
const backButtons = ComponentService.findAll("fv-card-container-back-button");
|
for (const backButton of backButtons) {
|
backButton.requestUpdate();
|
}
|
}
|
static ResetSelectionResultFilter(data) {
|
const query = data.query ? data.query : void 0;
|
const cardContainer = ComponentService.find(data.tag, query);
|
if (cardContainer && cardContainer.Filter != void 0) {
|
cardContainer.Filter.Reset(true, cardContainer.Context);
|
}
|
}
|
static SetShowBeforeSlot(data) {
|
const query = data.query ? data.query : void 0;
|
const cardContainer = ComponentService.find(data.tag, query);
|
if (cardContainer) {
|
cardContainer.ShowBeforeSlot = data.state;
|
}
|
}
|
static Clear(data) {
|
const query = data.query ? data.query : void 0;
|
const containers = ComponentService.findAll(data.tag, query);
|
if (containers) {
|
for (const container of containers) {
|
if (container.Filter) {
|
container.Filter.Reset(true, container.Context);
|
}
|
container.requestUpdate();
|
}
|
}
|
}
|
static Refetch(data) {
|
const query = data.query ? data.query : void 0;
|
const containers = ComponentService.findAll(data.tag, query);
|
if (containers) {
|
for (const container of containers) {
|
container.Refetch();
|
}
|
}
|
}
|
}
|
|
var css_248z$4 = 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([active]){align-items:center;display:flex;flex-direction:column;justify-content:center}:host{height:100%;position:absolute;width:100%}:host .container{align-items:center;background:var(--mask-container-background,transparent);border-radius:var(--mask-container-border-radius,unset);box-shadow:var(--mask-container-box-shadow,none);color:var(--mask-container-text-color,inherit);display:flex;flex-direction:column;font-size:var(--mask-font-size,inherit);height:fit-content;justify-content:center;line-height:var(--mask-font-size,inherit);max-width:var(--mask-container-max-width,none);padding:var(--mask-container-padding-top,none) var(--mask-container-padding-right,none) var(--mask-container-padding-bottom,none) var(--mask-container-padding-left,none);width:fit-content}:host .container .text{text-align:var(--mask-text-align,start)}:host .container .buttons-container{display:flex;flex-direction:row;justify-content:var(--mask-buttons-justify-content,center);padding-top:var(--mask-buttons-padding-top,unset);width:100%}:host .container .buttons-container .button{background-color:var(--mask-button-color,inherit);border-radius:var(--mask-button-border-radius,unset);box-shadow:var(--mask-button-box-shadow,none);color:var(--mask-button-text-color,inherit);cursor:pointer;font-size:var(--mask-button-font-size,var(--mask-font-size,inherit));font-weight:var(--mask-font-weight,inherit);padding:var(--mask-button-padding,unset)}:host .container .buttons-container .button span{border:0;color:var(--mask-button-text-color,inherit);font-size:var(--mask-button-font-size,var(--mask-font-size,inherit));font-weight:var(--mask-font-weight,inherit);margin:0;padding:0}:host .container .buttons-container .button .loader-slot.hidden{display:none}:host(.hover-click) .container .buttons-container .button:hover{background-color:var(--mask-buttons-hover-background-color,unset)}:host(.hover-click) .container .buttons-container .button:active{background-color:var(--mask-buttons-click-background-color,unset);border:var(--mask-buttons-click-border,unset);transition:all .1s ease-in-out}`;
|
|
var __defProp$5 = Object.defineProperty;
|
var __getOwnPropDesc$5 = Object.getOwnPropertyDescriptor;
|
var __getProtoOf$5 = Object.getPrototypeOf;
|
var __reflectGet$5 = Reflect.get;
|
var __decorateClass$5 = (decorators, target, key, kind) => {
|
var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$5(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$5(target, key, result);
|
return result;
|
};
|
var __superStaticGet$5 = (obj, member) => __reflectGet$5(__getProtoOf$5(obj), member, obj);
|
var __async$7 = (__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 RestartCheckMaskComponent = class extends BaseMaskElement {
|
constructor() {
|
super();
|
this.mask = "restart-check";
|
}
|
leave(e_) {
|
EventHandlerService.dispatchAsyncEvent("reload-window", {});
|
e_.preventDefault();
|
e_.stopImmediatePropagation();
|
e_.stopPropagation();
|
}
|
save(e_) {
|
return __async$7(this, null, function* () {
|
e_.preventDefault();
|
e_.stopImmediatePropagation();
|
e_.stopPropagation();
|
if (this.saveButtonLoader) {
|
this.saveButtonLoader.classList.remove("hidden");
|
}
|
yield EventHandlerService.dispatchAsyncEvent("save", {});
|
yield EventHandlerService.dispatchAsyncEvent("reload-window", {});
|
});
|
}
|
cancel(e_) {
|
return __async$7(this, null, function* () {
|
var _a;
|
e_.preventDefault();
|
e_.stopImmediatePropagation();
|
e_.stopPropagation();
|
(_a = this.Modal) == null ? void 0 : _a.hide();
|
});
|
}
|
render() {
|
return this.build(x`
|
<div class="container">
|
<div class="text" i18n="fv.modal.reload.text"></div>
|
<div class="buttons-container">
|
<div class="button save-button" @click="${this.save}"><span i18n="1008"></span><span><slot class="loader-slot hidden" name="loader"></slot></span></div>
|
<div class="button" @click="${this.leave}" i18n="21016"></div>
|
<div class="button" @click="${this.cancel}" i18n="1939"></div>
|
</div>
|
</div>
|
`);
|
}
|
updated(_changedProperties) {
|
super.updated(_changedProperties);
|
if (this.container && this.container.hasAttribute("listening") == false) {
|
this.container.setAttribute("listening", "true");
|
this.container.addEventListener("click", (e) => {
|
e.preventDefault();
|
e.stopImmediatePropagation();
|
e.stopPropagation();
|
});
|
}
|
}
|
};
|
RestartCheckMaskComponent.styles = [
|
__superStaticGet$5(RestartCheckMaskComponent, "styles") || [],
|
i`${r(css_248z$4)}`
|
];
|
__decorateClass$5([
|
i$1(".container")
|
], RestartCheckMaskComponent.prototype, "container", 2);
|
__decorateClass$5([
|
i$1(".loader-slot")
|
], RestartCheckMaskComponent.prototype, "saveButtonLoader", 2);
|
RestartCheckMaskComponent = __decorateClass$5([
|
e("fv-restart-check-mask")
|
], RestartCheckMaskComponent);
|
|
var css_248z$3 = 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([active]){align-items:center;display:flex;flex-direction:column;justify-content:center}:host{height:100%;position:absolute;width:100%}:host .properties-container{max-width:var(--select-property-mask-container-max-width,unset)}:host .properties-container .property-values-container{display:grid;gap:var(--select-property-mask-properties-gap,unset);grid-template-columns:repeat(var(--select-property-mask-property-columns,2),auto);justify-content:center}:host .properties-container .property-values-container .property-button{align-items:center;background:var(--select-property-mask-properties-button-background,unset);cursor:pointer;display:flex;flex-direction:row;gap:var(--select-property-mask-properties-button-img-txt-gap,unset);justify-content:flex-start;padding:var(--select-property-mask-properties-button-padding,unset)}:host .properties-container .property-values-container .property-button .img-container img{width:var(--select-property-mask-properties-button-img-width,unset)}@media (width <= 980px){:host .properties-container{max-width:var(--select-property-mask-container-max-width-mobile,var(--select-property-mask-container-max-width,unset))}:host .properties-container .property-values-container{grid-template-columns:repeat(var(--select-property-mask-property-columns-mobile,1),auto)!important}}`;
|
|
var __defProp$4 = Object.defineProperty;
|
var __getOwnPropDesc$4 = Object.getOwnPropertyDescriptor;
|
var __getProtoOf$4 = Object.getPrototypeOf;
|
var __reflectGet$4 = Reflect.get;
|
var __decorateClass$4 = (decorators, target, key, kind) => {
|
var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$4(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$4(target, key, result);
|
return result;
|
};
|
var __superStaticGet$4 = (obj, member) => __reflectGet$4(__getProtoOf$4(obj), member, obj);
|
var __async$6 = (__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 SelectPropertyMaskComponent = class extends BaseMaskElement {
|
constructor() {
|
super();
|
this.mask = "select-property";
|
this.program = "";
|
this.propertyUseRelevant = false;
|
this.filter = [];
|
this.loading = true;
|
this.closeEvents = [];
|
this.properties = [];
|
this.FindProperties();
|
}
|
checkFilter(source, filter) {
|
if (filter === void 0)
|
return false;
|
if (filter.length < 1)
|
return true;
|
if (source === void 0)
|
return false;
|
for (let index = 0; index < source.length; ++index) {
|
if (filter.includes(source[index]))
|
return true;
|
}
|
return false;
|
}
|
FindProperties() {
|
return __async$6(this, null, function* () {
|
var _a;
|
if (this.program.length < 1)
|
this.program = window.g_article.prog;
|
const propertiesHirarchy = yield ProgPropertyModel.find(window.g_article.manu, this.program, false, this.propertyUseRelevant, false);
|
this.properties = [];
|
(_a = propertiesHirarchy.propertyKeyOrder) == null ? void 0 : _a.forEach((propertykey) => {
|
const property2 = propertiesHirarchy.children[propertykey];
|
if (this.checkFilter([property2.id], this.filter)) {
|
this.properties.push(property2);
|
}
|
});
|
this.loading = false;
|
});
|
}
|
getPropertyButtonClick(key, property2, propertyKey) {
|
return (event) => __async$6(this, null, function* () {
|
this.loading = true;
|
yield CommunicationMessageService.modifyProperty(JSON.stringify({
|
manufacturer: window.g_article.manu,
|
program: this.program,
|
key,
|
property: property2,
|
propertyKey
|
}));
|
for (const event2 of this.closeEvents) {
|
yield EventHandlerService.dispatchAsyncEvent(event2.id, event2.data ? event2.data : {});
|
}
|
const modal = this.parentElement;
|
if (modal && modal.hide) {
|
modal.hide();
|
}
|
event.preventDefault();
|
event.stopImmediatePropagation();
|
event.stopPropagation();
|
this.loading = false;
|
});
|
}
|
createPropertyButton(propertyValue, id) {
|
const propertytext = LocalesModel.exists("property.text.above." + propertyValue.key);
|
const propertyname = LocalesModel.exists("property.name.prefix." + propertyValue.key);
|
return x`
|
<div class="property-button" @click="${this.getPropertyButtonClick(id, propertyValue.key, propertyValue.propertyKey)}">
|
<div class="img-container"><img src="${propertyValue.alternativeImageUrl}"/></div>
|
<div class="txt-container">
|
${propertytext ? x`<div class="text-above" i18n="property.text.above.${propertyValue.key}"></div>` : x``}
|
<div class="text-inline">
|
${propertyname ? x`<div class="prefix" i18n="property.name.prefix.${propertyValue.key}"></div>` : x``}
|
<div class="property-name">${propertyValue.name}</div>
|
</div>
|
</div>
|
</div>
|
`;
|
}
|
createPropertyButtons(property2) {
|
const propertyKeys = Object.keys(property2.children);
|
return x`
|
<div class="property-values-container">
|
${propertyKeys.map((propertyKey) => this.createPropertyButton(property2.children[propertyKey], property2.id))}
|
</div>
|
`;
|
}
|
render() {
|
if (this.properties.length < 1 || this.loading)
|
return x`<slot name="loader"></slot>`;
|
return x`
|
<div class="properties-container">
|
${this.properties.map((property2) => this.createPropertyButtons(property2))}
|
</div>
|
`;
|
}
|
};
|
SelectPropertyMaskComponent.styles = [
|
__superStaticGet$4(SelectPropertyMaskComponent, "styles") || [],
|
i`${r(css_248z$3)}`
|
];
|
__decorateClass$4([
|
n({ type: String, reflect: true, attribute: "program" })
|
], SelectPropertyMaskComponent.prototype, "program", 2);
|
__decorateClass$4([
|
n({ type: Boolean, reflect: true, attribute: "property-use-relevant" })
|
], SelectPropertyMaskComponent.prototype, "propertyUseRelevant", 2);
|
__decorateClass$4([
|
n({ type: Array, reflect: true, attribute: "filter" })
|
], SelectPropertyMaskComponent.prototype, "filter", 2);
|
__decorateClass$4([
|
n({ type: Boolean, reflect: true })
|
], SelectPropertyMaskComponent.prototype, "loading", 2);
|
__decorateClass$4([
|
n({ type: Array, reflect: true, attribute: "close-events" })
|
], SelectPropertyMaskComponent.prototype, "closeEvents", 2);
|
SelectPropertyMaskComponent = __decorateClass$4([
|
e("fv-select-property-mask")
|
], SelectPropertyMaskComponent);
|
|
var css_248z$2 = 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{padding:0}:host([active]){align-items:center;display:flex;flex-direction:column;justify-content:center}:host([active]) .headline-container{align-items:center;display:flex;flex-direction:column;justify-content:center;position:relative;width:100%}:host([active]) .headline-container .headline-back-button{left:var(--select-article-back-button-corner-distance,0);position:absolute;top:var(--select-article-back-button-corner-distance,0)}:host([active]) .articles-container{background:var(--mask-container-background,transparent);box-shadow:var(--mask-container-box-shadow,none);color:var(--mask-container-text-color,inherit);display:grid;font-size:var(--mask-font-size,inherit);gap:var(--select-article-gap,none);grid-auto-rows:max-content;grid-template-columns:repeat(var(--select-article-columns,2),auto);line-height:var(--mask-font-size,inherit);margin:unset;max-width:var(--mask-container-max-width,none);overflow-x:var(--select-article-overflow-x,unset);overflow-y:var(--select-article-overflow-y,unset);padding:var(--mask-container-padding-top,none) var(--mask-container-padding-right,none) var(--mask-container-padding-bottom,none) var(--mask-container-padding-left,none)}:host([active]) .loading-container{align-items:center;background:var(--mask-container-background,transparent);box-shadow:var(--mask-container-box-shadow,none);display:flex;font-size:var(--mask-font-size,inherit);justify-content:center;line-height:var(--mask-font-size,inherit);max-width:var(--mask-container-max-width,none);padding:var(--mask-container-padding-top,none) var(--mask-container-padding-right,none) var(--mask-container-padding-bottom,none) var(--mask-container-padding-left,none)}:host(.screen-filling){height:100%;position:absolute;width:100%}:host(.screen-filling) .articles-container{height:var(--select-article-screen-filling-articles-container-height,fit-content);width:fit-content}`;
|
|
var __defProp$3 = Object.defineProperty;
|
var __getOwnPropDesc$3 = Object.getOwnPropertyDescriptor;
|
var __getProtoOf$3 = Object.getPrototypeOf;
|
var __reflectGet$3 = Reflect.get;
|
var __decorateClass$3 = (decorators, target, key, kind) => {
|
var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$3(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$3(target, key, result);
|
return result;
|
};
|
var __superStaticGet$3 = (obj, member) => __reflectGet$3(__getProtoOf$3(obj), member, obj);
|
var __async$5 = (__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 SelectArticleMaskComponent = class extends BaseMaskElement {
|
constructor() {
|
super();
|
this.categories = [];
|
this._program = "";
|
this.closeWithoutOptions = false;
|
this.articleDimensions = {
|
unit: "cm",
|
digits: 1
|
};
|
this.newArticleOptionSettings = {
|
show: false
|
};
|
this.vplacerContext = void 0;
|
this.clearScene = false;
|
this.newScene = false;
|
this.preventFurtherPlacements = false;
|
this.mask = "select-article-mask";
|
this.articles = [];
|
this.nodePrefix = "";
|
this.closeEvents = [];
|
this.showLoader = false;
|
this.init();
|
}
|
getValueInArticleDimensionUnit(value) {
|
switch (this.articleDimensions.unit) {
|
case "cm":
|
return value * 0.1;
|
case "mm":
|
default:
|
return value;
|
}
|
}
|
set program(prog) {
|
this._program = prog;
|
}
|
get program() {
|
return this._program.length > 0 ? this._program : window.g_article.prog;
|
}
|
init() {
|
return __async$5(this, null, function* () {
|
yield CommunicationInterfaceService.IsAppReady;
|
if (this.categories.length > 0) {
|
const articles = yield CommunicationMessageService.getArticleByCategories(window.g_article.manu, this.program, this.categories);
|
this.nodePrefix = yield CommunicationMessageService.getNodePrefix();
|
if (articles) {
|
this.articles = articles;
|
if (this.newArticleOptionSettings && this.newArticleOptionSettings.show) {
|
if (this.newArticleOptionSettings.last) {
|
this.articles.push({
|
i18nDes: this.newArticleOptionSettings.i18nDes ? this.newArticleOptionSettings.i18nDes : "fv-select-article-no-article-option-description",
|
img: this.newArticleOptionSettings.img ? this.newArticleOptionSettings.img : ""
|
});
|
} else if (this.newArticleOptionSettings.index != void 0) {
|
this.articles.splice(this.newArticleOptionSettings.index, 0, {
|
i18nDes: this.newArticleOptionSettings.i18nDes ? this.newArticleOptionSettings.i18nDes : "fv-select-article-no-article-option-description",
|
img: this.newArticleOptionSettings.img ? this.newArticleOptionSettings.img : ""
|
});
|
}
|
}
|
} else if (this.closeWithoutOptions) {
|
yield this.close();
|
}
|
this.requestUpdate();
|
}
|
});
|
}
|
close(clearScene = false, newPlaning = false) {
|
return __async$5(this, null, function* () {
|
if (newPlaning) {
|
yield CommunicationMessageService.newPlanning();
|
} else if (clearScene) {
|
yield CommunicationMessageService.clearScene();
|
}
|
for (const event of this.closeEvents) {
|
yield EventHandlerService.dispatchAsyncEvent(event.id, event.data ? event.data : {});
|
}
|
const modal = this.parentElement;
|
if (modal && modal.hide) {
|
modal.hide();
|
this.showLoader = false;
|
}
|
if (this.preventFurtherPlacements) {
|
yield CommunicationMessageService.resetSceneAction();
|
yield CommunicationMessageService.resetCameraView(false);
|
}
|
});
|
}
|
loadArticle(event) {
|
return __async$5(this, null, function* () {
|
const articleNumber = event.target.getAttribute("article");
|
if (articleNumber && articleNumber.length > 0) {
|
this.showLoader = true;
|
if (this.vplacerContext) {
|
yield CommunicationMessageService.setVPlacerContextInfoData(this.vplacerContext);
|
}
|
if (this.clearScene) {
|
yield CommunicationMessageService.clearScene();
|
}
|
yield CommunicationMessageService.loadArticle(window.g_article.manu, this.program, articleNumber);
|
yield this.close();
|
}
|
});
|
}
|
getArticleText(article) {
|
if (article.Des && article.Des.length > 0) {
|
return article.Des;
|
} else if (article.artText && article.artText.length > 0) {
|
return article.artText;
|
} else if (article.ArtNr && article.ArtNr.length > 0) {
|
return article.ArtNr;
|
}
|
return "";
|
}
|
getDimensionInformation(group, article) {
|
const dimension = [];
|
if (group && group.dimension) {
|
for (const axis of group.dimension) {
|
switch (axis) {
|
case "x":
|
dimension.push(this.getValueInArticleDimensionUnit(parseFloat(article.kataWidth)));
|
break;
|
case "y":
|
dimension.push(this.getValueInArticleDimensionUnit(parseFloat(article.kataDepth)));
|
break;
|
case "z":
|
dimension.push(this.getValueInArticleDimensionUnit(parseFloat(article.kataHeight)));
|
break;
|
}
|
}
|
}
|
return {
|
dimension,
|
icon: group && group["icon-class"] ? group["icon-class"] : "",
|
src: group && group["icon-img-src"] ? group["icon-img-src"] : "",
|
divider: group && group["axis-divider"] ? group["axis-divider"] : ""
|
};
|
}
|
createArticleOption(option_) {
|
const article = option_;
|
if (article && article.ArtNr) {
|
const dimensionInfomations = [];
|
if (this.articleDimensions.groups && this.articleDimensions.groups.length > 0) {
|
for (const group of this.articleDimensions.groups) {
|
dimensionInfomations.push(this.getDimensionInformation(group, article));
|
}
|
}
|
return x`
|
<fv-card @click="${this.loadArticle}"
|
article="${article.ArtNr}"
|
data="${JSON.stringify({ image: { prefix: this.nodePrefix, file: article.imgName }, dimensions: dimensionInfomations, txt: { txt: this.getArticleText(article) } })}">
|
<slot name="button" slot="button"></slot>
|
<slot name="additional" slot="additional"></slot>
|
</fv-card>
|
`;
|
}
|
const option = option_;
|
if (option && option.i18nDes) {
|
const emptyOptionClick = () => {
|
this.close(this.clearScene, this.newScene);
|
};
|
return x`
|
<fv-card @click="${emptyOptionClick}"
|
article=""
|
data="${JSON.stringify({ image: { prefix: "", file: option.img }, txt: { title: option.i18nDes, subtitle: "", txt: "" } })}">
|
</fv-card>
|
`;
|
}
|
return x``;
|
}
|
createArticleOptions() {
|
return x`
|
${this.articles.map((article) => {
|
return this.createArticleOption(article);
|
})}
|
`;
|
}
|
createHeadline() {
|
return x`
|
<div class="headline-container">
|
<div class="headline-back-button"><slot name="back-button"></slot></div>
|
<div class="headline-logo"><slot name="logo"></slot></div>
|
<div class="headline-title"><slot name="title"></slot></div>
|
</div>
|
`;
|
}
|
render() {
|
if (this.articles == void 0 || this.articles && this.articles.length < 1 || this.showLoader) {
|
return x`<div class="loading-container"><slot name="loader"></slot></div>`;
|
}
|
return x`
|
${this.createHeadline()}
|
<div class="articles-container">${this.createArticleOptions()}</div>
|
`;
|
}
|
};
|
SelectArticleMaskComponent.styles = [
|
__superStaticGet$3(SelectArticleMaskComponent, "styles") || [],
|
i`${r(css_248z$2)}`
|
];
|
__decorateClass$3([
|
n({ type: Array, reflect: true, attribute: "categories" })
|
], SelectArticleMaskComponent.prototype, "categories", 2);
|
__decorateClass$3([
|
n({ type: String, reflect: true, attribute: "program" })
|
], SelectArticleMaskComponent.prototype, "_program", 2);
|
__decorateClass$3([
|
n({ type: Boolean, reflect: true, attribute: "close-without-options" })
|
], SelectArticleMaskComponent.prototype, "closeWithoutOptions", 2);
|
__decorateClass$3([
|
n({ type: Object, reflect: true, attribute: "article-dimensions" })
|
], SelectArticleMaskComponent.prototype, "articleDimensions", 2);
|
__decorateClass$3([
|
n({ type: Object, reflect: true, attribute: "new-article-option-settings" })
|
], SelectArticleMaskComponent.prototype, "newArticleOptionSettings", 2);
|
__decorateClass$3([
|
n({ type: Object, reflect: true, attribute: "vplacer-context" })
|
], SelectArticleMaskComponent.prototype, "vplacerContext", 2);
|
__decorateClass$3([
|
n({ type: Boolean, reflect: true, attribute: "clear-scene" })
|
], SelectArticleMaskComponent.prototype, "clearScene", 2);
|
__decorateClass$3([
|
n({ type: Boolean, reflect: true, attribute: "new-scene" })
|
], SelectArticleMaskComponent.prototype, "newScene", 2);
|
__decorateClass$3([
|
n({ type: Boolean, reflect: true, attribute: "prevent-further-placements" })
|
], SelectArticleMaskComponent.prototype, "preventFurtherPlacements", 2);
|
__decorateClass$3([
|
n({ type: Array, reflect: true, attribute: "close-events" })
|
], SelectArticleMaskComponent.prototype, "closeEvents", 2);
|
__decorateClass$3([
|
n({ type: Boolean, reflect: true, attribute: "show-loader" })
|
], SelectArticleMaskComponent.prototype, "showLoader", 2);
|
SelectArticleMaskComponent = __decorateClass$3([
|
e("fv-select-article-mask")
|
], SelectArticleMaskComponent);
|
|
var css_248z$1 = 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}`;
|
|
var __defProp$2 = Object.defineProperty;
|
var __getOwnPropDesc$2 = Object.getOwnPropertyDescriptor;
|
var __getProtoOf$2 = Object.getPrototypeOf;
|
var __reflectGet$2 = Reflect.get;
|
var __decorateClass$2 = (decorators, target, key, kind) => {
|
var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$2(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$2(target, key, result);
|
return result;
|
};
|
var __superStaticGet$2 = (obj, member) => __reflectGet$2(__getProtoOf$2(obj), member, obj);
|
var __async$4 = (__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 PerspectiveControlMaskComponent = class extends BaseMaskElement {
|
constructor() {
|
super();
|
this.mask = "perspective-control";
|
this.perspectives = [];
|
this.settings = {
|
animated: true,
|
"zoom-type": ZoomType.ZOOMAUTO_FRONTCLIP
|
};
|
this.loading = false;
|
this.closeAfterChoice = false;
|
this.applyEvents = [];
|
this.resetOnChange = false;
|
this.activePerspective = Perspectives.Front;
|
EventFactoryService.ChangePrice.register(() => {
|
if (this.resetOnChange) {
|
this.ApplyPerspective(this.activePerspective);
|
}
|
});
|
if (PerspectiveControlMaskComponent.windowKeyListenerRegistered === false) {
|
window.addEventListener("keydown", (e) => {
|
if (this.active && (this.perspectives.length == 0 || this.perspectives.length == Object.keys(PerspectiveControlMaskComponent.SearchPerspectives).length)) {
|
if (e.location == e.DOM_KEY_LOCATION_NUMPAD) {
|
switch (e.key) {
|
case "5":
|
case "Clear":
|
this.ApplyPerspective(Perspectives.Top);
|
break;
|
case "2":
|
case "ArrowDown":
|
this.ApplyPerspective(Perspectives.Front);
|
break;
|
case "8":
|
case "ArrowUp":
|
this.ApplyPerspective(Perspectives.Back);
|
break;
|
case "6":
|
case "ArrowRight":
|
this.ApplyPerspective(Perspectives.Right);
|
break;
|
case "4":
|
case "ArrowLeft":
|
this.ApplyPerspective(Perspectives.Left);
|
break;
|
case "1":
|
case "End":
|
this.ApplyPerspective(Perspectives.TopLeftFront);
|
break;
|
case "3":
|
case "PageDown":
|
this.ApplyPerspective(Perspectives.TopRightFront);
|
break;
|
case "7":
|
case "Home":
|
this.ApplyPerspective(Perspectives.TopLeftBack);
|
break;
|
case "9":
|
case "PageUp":
|
this.ApplyPerspective(Perspectives.TopRightBack);
|
break;
|
}
|
}
|
}
|
});
|
PerspectiveControlMaskComponent.windowKeyListenerRegistered = true;
|
}
|
}
|
ApplyPerspective(perspective_) {
|
return __async$4(this, null, function* () {
|
this.loading = true;
|
const zoomparams = {
|
Perspective: perspective_,
|
direction: [0, 0, 0],
|
type: this.settings["zoom-type"],
|
animated: this.settings.animated
|
};
|
yield CommunicationMessageService.setCameraZoom(zoomparams);
|
this.loading = false;
|
if (this.closeAfterChoice) {
|
for (const event of this.applyEvents) {
|
yield EventHandlerService.dispatchAsyncEvent(event.id, event.data ? event.data : {});
|
}
|
const modal = this.parentElement;
|
if (modal && modal.hide) {
|
modal.hide();
|
this.active = false;
|
}
|
}
|
this.activePerspective = perspective_;
|
});
|
}
|
PerspectiveButtonClick(e) {
|
if (e.target) {
|
const perspective = e.target.getAttribute("perspective");
|
if (perspective) {
|
const perspectiveValue = PerspectiveControlMaskComponent.SearchPerspectives[perspective];
|
if (perspectiveValue) {
|
this.ApplyPerspective(PerspectiveControlMaskComponent.SearchPerspectives[perspective]);
|
} else {
|
console.error("perspective (" + perspective + ") does not exist!");
|
}
|
} else {
|
console.error("perspective not set on PerspectiveButton");
|
}
|
}
|
}
|
createPerspectiveButton(perspective) {
|
return x`
|
<fv-button perspective="${perspective}" @click="${this.PerspectiveButtonClick}" i18n="perspective-${perspective}">
|
${perspective}
|
</fv-button>
|
`;
|
}
|
CreateAllPerspectiveButtons() {
|
const allPerspectives = Object.keys(PerspectiveControlMaskComponent.SearchPerspectives);
|
return x`${allPerspectives.map((perspective) => this.createPerspectiveButton(perspective))}`;
|
}
|
build(content) {
|
if (this.loading) {
|
super.build(x`<slot name="loader"></slot>${content ? content : x``}`);
|
}
|
return super.build(content);
|
}
|
render() {
|
if (this.perspectives.length < 1) {
|
return this.build(x`<div>${this.CreateAllPerspectiveButtons()}</div>`);
|
}
|
return this.build(x`<div>${this.perspectives.map((perspective) => this.createPerspectiveButton(perspective))}</div>`);
|
}
|
};
|
PerspectiveControlMaskComponent.styles = [
|
__superStaticGet$2(PerspectiveControlMaskComponent, "styles") || [],
|
i`${r(css_248z$1)}`
|
];
|
PerspectiveControlMaskComponent.SearchPerspectives = {
|
"TopLeftFront": Perspectives.TopLeftFront,
|
"TopRightFront": Perspectives.TopRightFront,
|
"TopLeftBack": Perspectives.TopLeftBack,
|
"TopRightBack": Perspectives.TopRightBack,
|
"Left": Perspectives.Left,
|
"Right": Perspectives.Right,
|
"Front": Perspectives.Front,
|
"Back": Perspectives.Back,
|
"Top": Perspectives.Top
|
};
|
PerspectiveControlMaskComponent.windowKeyListenerRegistered = false;
|
__decorateClass$2([
|
n({ type: Array, reflect: true })
|
], PerspectiveControlMaskComponent.prototype, "perspectives", 2);
|
__decorateClass$2([
|
n({ type: Object, reflect: true })
|
], PerspectiveControlMaskComponent.prototype, "settings", 2);
|
__decorateClass$2([
|
n({ type: Boolean, reflect: true })
|
], PerspectiveControlMaskComponent.prototype, "loading", 2);
|
__decorateClass$2([
|
n({ type: Boolean, reflect: true, attribute: "close-after-choice" })
|
], PerspectiveControlMaskComponent.prototype, "closeAfterChoice", 2);
|
__decorateClass$2([
|
n({ type: Array, reflect: true, attribute: "apply-events" })
|
], PerspectiveControlMaskComponent.prototype, "applyEvents", 2);
|
__decorateClass$2([
|
n({ type: Boolean, reflect: true, attribute: "reset-on-change" })
|
], PerspectiveControlMaskComponent.prototype, "resetOnChange", 2);
|
PerspectiveControlMaskComponent = __decorateClass$2([
|
e("fv-perspective-control-mask")
|
], PerspectiveControlMaskComponent);
|
|
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([active]){align-items:center;display:flex;flex-direction:column;justify-content:center;position:fixed;z-index:999999999}:host{height:100%;position:absolute;width:100%}:host .container{align-items:center;background:var(--mask-container-background,transparent);border-radius:var(--mask-container-border-radius,unset);box-shadow:var(--mask-container-box-shadow,none);color:var(--mask-container-text-color,inherit);display:flex;flex-direction:column;font-size:var(--mask-font-size,inherit);height:fit-content;justify-content:center;line-height:var(--mask-font-size,inherit);max-width:fit-content;padding:var(--mask-container-padding-top,none) var(--mask-container-padding-right,none) var(--mask-container-padding-bottom,none) var(--mask-container-padding-left,none);width:fit-content}:host .container .text{text-align:var(--mask-text-align,start)}:host .container .buttons-container{display:flex;flex-direction:row;gap:1rem;justify-content:var(--mask-buttons-justify-content,center);padding-top:var(--mask-buttons-padding-top,unset);width:100%}:host .container .buttons-container .button{background-color:var(--mask-button-color,inherit);border-radius:var(--mask-button-border-radius,unset);box-shadow:var(--mask-button-box-shadow,none);color:var(--mask-button-text-color,inherit);cursor:pointer;font-size:var(--mask-button-font-size,var(--mask-font-size,inherit));font-weight:var(--mask-font-weight,inherit);padding:var(--mask-button-padding,unset)}:host .container .buttons-container .button span{border:0;color:var(--mask-button-text-color,inherit);font-size:var(--mask-button-font-size,var(--mask-font-size,inherit));font-weight:var(--mask-font-weight,inherit);margin:0;padding:0}:host .container .buttons-container .button .loader-slot.hidden{display:none}:host(.hover-click) .container .buttons-container .button:hover{background-color:var(--mask-buttons-hover-background-color,unset)}:host(.hover-click) .container .buttons-container .button:hover:active{background-color:var(--mask-buttons-click-background-color,unset);border:var(--mask-buttons-click-border,unset);transition:all .1s ease-in-out}`;
|
|
var __defProp$1 = Object.defineProperty;
|
var __getOwnPropDesc$1 = Object.getOwnPropertyDescriptor;
|
var __getProtoOf$1 = Object.getPrototypeOf;
|
var __reflectGet$1 = Reflect.get;
|
var __decorateClass$1 = (decorators, target, key, kind) => {
|
var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$1(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$1(target, key, result);
|
return result;
|
};
|
var __superStaticGet$1 = (obj, member) => __reflectGet$1(__getProtoOf$1(obj), member, obj);
|
var __async$3 = (__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 ProgramSelectionConfirmationMaskComponent = class extends BaseMaskElement {
|
constructor() {
|
super(...arguments);
|
this.mask = "program-selection-confirmation";
|
}
|
change(ev) {
|
var _a;
|
this._cancel(ev);
|
(_a = this.responseDefer) == null ? void 0 : _a.resolve([true]);
|
}
|
saveAndChange(ev) {
|
return __async$3(this, null, function* () {
|
this._cancel(ev);
|
if (this.saveButtonLoader) {
|
this.saveButtonLoader.classList.remove("hidden");
|
}
|
yield EventHandlerService.dispatchAsyncEvent("save", {});
|
if (this.saveButtonLoader) {
|
this.saveButtonLoader.classList.add("hidden");
|
}
|
this.change(ev);
|
});
|
}
|
abort(ev) {
|
return __async$3(this, null, function* () {
|
var _a;
|
this._cancel(ev);
|
(_a = this.responseDefer) == null ? void 0 : _a.resolve([false]);
|
});
|
}
|
_cancel(ev) {
|
ev.preventDefault();
|
ev.stopImmediatePropagation();
|
ev.stopPropagation();
|
}
|
render() {
|
return this.build(x`
|
<div class="container">
|
<div class="text" i18n="fv.modal.programselection.info"></div>
|
<div class="buttons-container">
|
<div class="button" i18n="fv.modal.programselection.change" @click="${this.change}"></div>
|
<div class="button save-button" @click="${this.saveAndChange}">
|
<span i18n="fv.modal.programselection.save"></span>
|
<span>
|
<slot class="loader-slot hidden" name="loader"></slot>
|
</span>
|
</div>
|
<div class="button" i18n="fv.modal.programselection.cancel" @click="${this.abort}"></div>
|
</div>
|
</div>
|
`);
|
}
|
updated(_changedProperties) {
|
super.updated(_changedProperties);
|
if (this.container && this.container.hasAttribute("listening") == false) {
|
this.container.setAttribute("listening", "true");
|
this.container.addEventListener("click", (e) => {
|
e.preventDefault();
|
e.stopImmediatePropagation();
|
e.stopPropagation();
|
});
|
}
|
}
|
set ResponseDefer(defer) {
|
this.responseDefer = defer;
|
}
|
};
|
ProgramSelectionConfirmationMaskComponent.styles = [
|
__superStaticGet$1(ProgramSelectionConfirmationMaskComponent, "styles") || [],
|
i`${r(css_248z)}`
|
];
|
__decorateClass$1([
|
n({ type: Object })
|
], ProgramSelectionConfirmationMaskComponent.prototype, "responseDefer", 2);
|
__decorateClass$1([
|
i$1(".container")
|
], ProgramSelectionConfirmationMaskComponent.prototype, "container", 2);
|
__decorateClass$1([
|
i$1(".loader-slot")
|
], ProgramSelectionConfirmationMaskComponent.prototype, "saveButtonLoader", 2);
|
ProgramSelectionConfirmationMaskComponent = __decorateClass$1([
|
e("fv-program-selection-confirmation")
|
], ProgramSelectionConfirmationMaskComponent);
|
|
var __async$2 = (__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());
|
});
|
};
|
class EventHandlerServiceClass {
|
constructor() {
|
this.accessoires = false;
|
this.front = void 0;
|
window.addEventListener("triggereventhandlereventevent", (event) => {
|
if (event.detail && event.detail.events) {
|
EventHandlerService.dispatchEventList(event.detail.events, event.detail.async);
|
}
|
});
|
this._events = new Map();
|
this.register("send-cloud-id-to-owner", () => __async$2(this, null, function* () {
|
this.dispatch("send-to-owner", { message: (yield UtilService.getPDF(true)).cloudID });
|
}));
|
this.register("send-to-owner", (messageData) => __async$2(this, null, function* () {
|
let parent = window;
|
while (parent.parent && parent !== parent.parent) {
|
parent = parent.parent;
|
}
|
parent.postMessage(messageData.message, "*");
|
}));
|
this.register("camera-zoom-in", () => __async$2(this, null, function* () {
|
yield CommunicationMessageService.cameraZoom(1);
|
}));
|
this.register("camera-zoom-out", () => __async$2(this, null, function* () {
|
yield CommunicationMessageService.cameraZoom(-1);
|
}));
|
this.register("reset-camera", () => __async$2(this, null, function* () {
|
yield CommunicationMessageService.resetCameraView(true);
|
}));
|
this.register("undo", () => __async$2(this, null, function* () {
|
yield CommunicationMessageService.undo();
|
}));
|
this.register("redo", () => __async$2(this, null, function* () {
|
alert("TODO: implement redo!");
|
}));
|
this.register("save", (data_) => __async$2(this, null, function* () {
|
yield CommunicationMessageService.downloadPDF(data_ && data_.custom ? data_.custom : false);
|
}));
|
this.register("download-generated-file", (data_) => __async$2(this, null, function* () {
|
var _a, _b;
|
if (data_.currentTarget) {
|
data_.currentTarget.classList.add("loading");
|
}
|
let data;
|
if (data_.fileType) {
|
switch (data_.fileType) {
|
case "skp":
|
case "obj":
|
case "xml":
|
data = yield UtilService.generateExport(data_.fileType);
|
break;
|
case "pdf":
|
default:
|
data = yield UtilService.getPDF(!!data_.lastCloudID);
|
break;
|
}
|
const { url, cloudID } = data;
|
const extensionMap = {
|
skp: "skp",
|
obj: "zip",
|
xml: "xml",
|
pdf: "pdf"
|
};
|
const extension = (_a = extensionMap[data_.fileType]) != null ? _a : "pdf";
|
(_b = window.UtilService) == null ? void 0 : _b.SaveToDisk(url, `planning_${cloudID}.${extension}`);
|
}
|
if (data_.currentTarget) {
|
data_.currentTarget.classList.remove("loading");
|
}
|
}));
|
this.register("trigger-animation", () => __async$2(this, null, function* () {
|
yield CommunicationMessageService.triggerAnimation();
|
}));
|
this.register("toggle-front-state", (data_) => __async$2(this, null, function* () {
|
this.dispatch("front-state", data_);
|
}));
|
this.register("front-state", (data_) => __async$2(this, null, function* () {
|
if (data_["default-state"] != void 0 && this.front == void 0) {
|
this.front = data_["default-state"];
|
}
|
let front = data_.value !== void 0 ? data_.value : !this.front;
|
if (data_["prioritise-accessoires"]) {
|
front = !this.accessoires;
|
}
|
yield CommunicationMessageService.frontState(front);
|
this.front = data_["prioritise-accessoires"] ? void 0 : front;
|
}));
|
this.register("toggle-accessoires", (data_) => __async$2(this, null, function* () {
|
let frontState = this.accessoires;
|
if (data_["prioritise-front-state"] && this.front != void 0) {
|
frontState = this.front;
|
}
|
yield CommunicationMessageService.frontState(frontState);
|
this.front = this.front != void 0 ? frontState : void 0;
|
this.accessoires = !this.accessoires;
|
yield CommunicationMessageService.setAccessories(this.accessoires);
|
}));
|
this.register("show-ar-modal", () => __async$2(this, null, function* () {
|
const arModal = ComponentService.find("FV-AR-MODAL");
|
if (arModal) {
|
arModal.show();
|
}
|
}));
|
this.register("toggle-dimensions", () => __async$2(this, null, function* () {
|
yield CommunicationMessageService.toggleMeasurement();
|
}));
|
this.register("take-screenshot", (data_) => __async$2(this, null, function* () {
|
yield CommunicationMessageService.downloadScreenshot(data_.logo ? data_.logo : void 0);
|
}));
|
this.register("show-share-component", () => __async$2(this, null, function* () {
|
yield CommunicationMessageService.showShareComponent();
|
}));
|
this.register("communicator-message", (data_) => __async$2(this, null, function* () {
|
const data = {
|
command: data_.command,
|
args: data_.parameters ? data_.parameters : []
|
};
|
if (data.command) {
|
return yield CommunicationMessageService.CommunicatorMessage(data.command, ...data.args);
|
}
|
}));
|
this.register("open-modal", (data_) => __async$2(this, null, function* () {
|
ModalComponent.openModal(data_);
|
}));
|
this.register("close-modal", (data_) => __async$2(this, null, function* () {
|
ModalComponent.closeModal(data_);
|
}));
|
this.register("toggle-modal", (data_) => __async$2(this, null, function* () {
|
ModalComponent.toggleModal(data_);
|
}));
|
this.register("toggle-classes", (data_) => __async$2(this, null, function* () {
|
yield EventHandlerServiceClass.EachComponentInService(data_, (component) => __async$2(this, null, function* () {
|
for (const removeClass of data_.classes) {
|
if (component.classList.contains(removeClass)) {
|
component.classList.remove(removeClass);
|
} else {
|
component.classList.add(removeClass);
|
}
|
}
|
}));
|
}));
|
this.register("add-classes", (data_) => __async$2(this, null, function* () {
|
yield EventHandlerServiceClass.EachComponentInService(data_, (component) => __async$2(this, null, function* () {
|
for (const addClass of data_.classes) {
|
component.classList.add(addClass);
|
}
|
}));
|
}));
|
this.register("remove-classes", (data_) => __async$2(this, null, function* () {
|
yield EventHandlerServiceClass.EachComponentInService(data_, (component) => __async$2(this, null, function* () {
|
for (const removeClass of data_.classes) {
|
component.classList.remove(removeClass);
|
}
|
}));
|
}));
|
this.register("steps-next", (data_) => __async$2(this, null, function* () {
|
StepsComponent.next(data_);
|
}));
|
this.register("steps-previous", (data_) => __async$2(this, null, function* () {
|
StepsComponent.previous(data_);
|
}));
|
this.register("steps-first", (data_) => __async$2(this, null, function* () {
|
StepsComponent.activateFirst(data_);
|
}));
|
this.register("toggle-toolbar", (data_) => __async$2(this, null, function* () {
|
yield EventHandlerServiceClass.EachComponent(data_, (name, selector) => __async$2(this, null, function* () {
|
ToggleToolbarComponent.toggle(selector);
|
}));
|
}));
|
this.register("toolbar-button-set-active", (data_) => __async$2(this, null, function* () {
|
yield EventHandlerServiceClass.EachComponentInService(data_, (component) => __async$2(this, null, function* () {
|
if (data_.value != void 0)
|
component.active = data_.value;
|
}));
|
}));
|
this.register("webcab-toggle-dimension-visuals", () => __async$2(this, null, function* () {
|
const webuiComponent = ComponentService.find("fv-webcab-ui");
|
if (webuiComponent) {
|
yield webuiComponent.SetDisableDimensionVisuals(!(yield webuiComponent.GetDisableDimensionVisuals()));
|
}
|
}));
|
this.register("webcab-refresh-cabinets-toggle-ui", () => __async$2(this, null, function* () {
|
const webcabCabinetsToggleUiComponents = ComponentService.findAll("fv-webcab-ui-cabinets-toggle");
|
for (const webcabCabinetsToggleUiComponent of webcabCabinetsToggleUiComponents) {
|
yield webcabCabinetsToggleUiComponent.refresh();
|
}
|
}));
|
this.register("set-attribute", (data_) => __async$2(this, null, function* () {
|
yield EventHandlerServiceClass.EachComponentInService(data_, (component) => __async$2(this, null, function* () {
|
if (typeof data_.value === "boolean" && data_.value)
|
component.setAttribute(data_.attribute, "");
|
else if (typeof data_.value === "boolean" && !data_.value)
|
component.removeAttribute(data_.attribute);
|
else if (typeof data_.value === "object")
|
component.setAttribute(data_.attribute, JSON.stringify(data_.value));
|
else {
|
component.setAttribute(data_.attribute, data_.value);
|
}
|
}));
|
}));
|
this.register("toggle-attribute", (data_) => __async$2(this, null, function* () {
|
yield EventHandlerServiceClass.EachComponentInService(data_, (component) => __async$2(this, null, function* () {
|
if (typeof data_.value === "boolean" && data_.value)
|
component.toggleAttribute(data_.attribute);
|
else {
|
let attributeValue = data_.value;
|
if (typeof data_.value === "object") {
|
attributeValue = JSON.stringify(attributeValue);
|
}
|
if (component.getAttribute(data_.attribute) == attributeValue) {
|
component.removeAttribute(data_.attribute);
|
} else {
|
component.setAttribute(data_.attribute, attributeValue);
|
}
|
}
|
}));
|
}));
|
this.register("delete-fitting", (data_) => __async$2(this, null, function* () {
|
if (data_.level == void 0)
|
return;
|
yield CommunicationMessageService.dhTodo([
|
"1",
|
{
|
params: [(data_.level + 1).toString()],
|
manu: window.g_article.manu,
|
kataManu: window.g_article.manu
|
}
|
]);
|
}));
|
this.register("move-fitting", (data_) => __async$2(this, null, function* () {
|
if (data_.level == void 0)
|
return;
|
yield CommunicationMessageService.dhTodo([
|
"1",
|
{
|
params: [(data_.level + 2).toString()],
|
manu: window.g_article.manu,
|
kataManu: window.g_article.manu
|
}
|
]);
|
}));
|
this.register("set-selectable", (data_) => __async$2(this, null, function* () {
|
if (data_.type && Array.isArray(data_.type)) {
|
yield CommunicationMessageService.setSelectableMultiTypes(data_.type);
|
return;
|
}
|
if (data_.type && data_.type.length > 0) {
|
yield CommunicationMessageService.setSelectable(data_.type);
|
if (data_.action && data_.action.length > 0) {
|
yield CommunicationMessageService.setSelectionActionGroup(data_.action);
|
}
|
} else {
|
yield CommunicationMessageService.setSelectable();
|
}
|
}));
|
this.register("update-filtered-catalogs", (data_) => __async$2(this, null, function* () {
|
yield EventHandlerServiceClass.EachComponentInService(data_, (component) => __async$2(this, null, function* () {
|
if (component.Update) {
|
yield component.Update();
|
}
|
}));
|
}));
|
this.register("open-link", (data_) => __async$2(this, null, function* () {
|
if (data_["new-tab"] && data_.link) {
|
window.open(data_.link);
|
return;
|
}
|
if (data_.link) {
|
window.location = data_.link;
|
}
|
}));
|
this.register("scroll-to-top", (data_) => __async$2(this, null, function* () {
|
const scroll = (target) => {
|
const options = {
|
top: 0,
|
left: 0,
|
behavior: data_.behavior ? data_.behavior : "auto"
|
};
|
target.scrollTo(options);
|
};
|
if (data_["tag"] && data_["tag"].length > 0) {
|
if (data_["selector"] && data_["selector"].length > 0) {
|
const components = ComponentService.findAll(data_["tag"], data_["selector"]);
|
for (const component of components) {
|
scroll(component);
|
}
|
}
|
} else if (data_["selector"] && data_["selector"].length > 0) {
|
const target = document.querySelector(data_["selector"]);
|
if (target) {
|
scroll(target);
|
}
|
}
|
}));
|
this.register("send-to-cart", (data_) => __async$2(this, null, function* () {
|
const externalParameters = data_["external-parameters"];
|
let parameters = [];
|
if (externalParameters) {
|
parameters = externalParameters.map((descriptor) => {
|
const element = ComponentService.find(descriptor.tag);
|
return { parameter: descriptor.name, value: element[descriptor.property] };
|
});
|
}
|
yield CommunicationMessageService.addToCart(parameters);
|
}));
|
this.register("card-container-set-show-before-slot", (data) => __async$2(this, null, function* () {
|
CardContainerEventContainer.SetShowBeforeSlot(data);
|
}));
|
this.register("card-containers-reset-selection-result-filter", (data_) => __async$2(this, null, function* () {
|
CardContainerEventContainer.ResetSelectionResultFilter(data_);
|
}));
|
this.register("refresh-all-card-containers", (data) => __async$2(this, null, function* () {
|
const refetch = data["refetch"] == void 0 ? false : data["refetch"];
|
const includeHidden = data["include-hidden"] == void 0 ? false : data["include-hidden"];
|
const selectionResultFilterResetTargets = data["selection-result-filter-reset-targets"];
|
const selectionResultFilterResetExcludes = data["selection-result-filter-reset-excludes"];
|
CardContainerEventContainer.RefreshAll(refetch, includeHidden, selectionResultFilterResetTargets, selectionResultFilterResetExcludes);
|
}));
|
this.register("refetch-card-container", (data_) => __async$2(this, null, function* () {
|
CardContainerEventContainer.Refetch(data_);
|
}));
|
this.register("clear-card-container", (data) => __async$2(this, null, function* () {
|
CardContainerEventContainer.Clear(data);
|
}));
|
this.register("refresh-all-configurator-forms", () => __async$2(this, null, function* () {
|
const forms = ComponentService.findAll("fv-configurator-form");
|
for (const form of forms) {
|
ConfiguratorFormComponent.Refresh("true", form, false, form.preventRefresh, form.preventRegenAll);
|
}
|
}));
|
this.register("refresh-all-filtered-catalogs", () => __async$2(this, null, function* () {
|
const forms = ComponentService.findAll("fv-filtered-catalog");
|
for (const form of forms) {
|
form.Update(true);
|
}
|
}));
|
this.register("toggle-api-state-reset-camera-save", (data) => __async$2(this, null, function* () {
|
if (data.group && data.target) {
|
if (ConfiguratorFormComponent.Groups.includes(data.group)) {
|
const group = ConfiguratorFormComponent.Data[data.group];
|
if (Object.keys(group).includes(data.target)) {
|
const target = group[data.target];
|
if (target.state != void 0) {
|
yield ConfiguratorApi.SetApiData({
|
groups: [{
|
name: data.group,
|
modifications: [{
|
target: data.target,
|
type: "int",
|
value: 1
|
}]
|
}]
|
});
|
yield CommunicationMessageService.resetCameraView(false);
|
setTimeout(() => __async$2(this, null, function* () {
|
yield CommunicationMessageService.frontState(true);
|
yield CommunicationMessageService.downloadPDF(data && data.custom ? data.custom : false);
|
yield ConfiguratorApi.SetApiData({
|
groups: [{
|
name: data.group,
|
modifications: [{
|
target: data.target,
|
type: "int",
|
value: target.state ? 1 : 0
|
}]
|
}]
|
});
|
}), 1e3);
|
}
|
}
|
}
|
}
|
}));
|
this.register("configurator-set-api-state", (data) => __async$2(this, null, function* () {
|
if (data.group && data.target) {
|
if (ConfiguratorFormComponent.Groups.includes(data.group)) {
|
const group = ConfiguratorFormComponent.Data[data.group];
|
if (Object.keys(group).includes(data.target)) {
|
yield ConfiguratorApi.SetApiData({
|
groups: [{
|
name: data.group,
|
modifications: [{
|
target: data.target,
|
type: "int",
|
value: data.state ? 1 : 0
|
}]
|
}]
|
});
|
}
|
}
|
}
|
}));
|
this.register("configurator-api-state-toggle", (data) => __async$2(this, null, function* () {
|
if (data.group && data.target) {
|
if (ConfiguratorFormComponent.Groups.includes(data.group)) {
|
const group = ConfiguratorFormComponent.Data[data.group];
|
if (Object.keys(group).includes(data.target)) {
|
const target = group[data.target];
|
if (target.state != void 0) {
|
yield ConfiguratorApi.SetApiData({
|
groups: [{
|
name: data.group,
|
modifications: [{
|
target: data.target,
|
type: "int",
|
value: target.state ? 0 : 1
|
}]
|
}]
|
});
|
yield this.dispatchAsyncEvent("refresh-all-configurator-forms", {});
|
}
|
}
|
}
|
}
|
}));
|
this.register("reload-window", (data) => __async$2(this, null, function* () {
|
window.location.reload();
|
}));
|
this.register("set-fp-variable", (data) => __async$2(this, null, function* () {
|
yield CommunicationInterfaceService.IsAppReady;
|
yield CommunicationMessageService.dhTodo(["3", {
|
params: ["-1", "0", data.key, data.type, data.value],
|
manu: window.g_article.manu,
|
kataManu: window.g_article.manu
|
}]);
|
}));
|
this.register("set-property", (data) => __async$2(this, null, function* () {
|
yield CommunicationMessageService.modifyProperty(JSON.stringify(data.property), data.options);
|
}));
|
this.register("set-attribute-on-url-with-cloud-id", (data) => {
|
const url = new URL(window.location.href);
|
if (url.searchParams.has("cloudId")) {
|
this.dispatch("set-attribute", data);
|
}
|
});
|
this.register("gtm-push", (data_) => __async$2(this, null, function* () {
|
var _a;
|
const pushData = {
|
event: data_.event
|
};
|
Object.keys(data_).forEach((key) => {
|
if (key !== "event") {
|
let dotSplit = data_[key].split(".");
|
let bufferValue = window.g_dataInterface[dotSplit[0]];
|
dotSplit = dotSplit.slice(1);
|
dotSplit.forEach((dotKey) => {
|
if (bufferValue) {
|
bufferValue = bufferValue[dotKey];
|
}
|
});
|
pushData[key] = bufferValue || data_[key];
|
}
|
});
|
(_a = window.gtm_s) == null ? void 0 : _a.push(pushData);
|
}));
|
this.register("set-camera-zoom", (data) => __async$2(this, null, function* () {
|
const zoomData = data["zoom"];
|
if (typeof zoomData.Perspective === "string") {
|
const newPerspective = PerspectiveControlMaskComponent.SearchPerspectives[zoomData.Perspective];
|
if (newPerspective) {
|
zoomData.Perspective = newPerspective;
|
}
|
}
|
yield CommunicationMessageService.setCameraZoom(zoomData);
|
}));
|
this.register("place-article", (data) => __async$2(this, null, function* () {
|
yield CommunicationMessageService.placePO({
|
manufacturer: window.g_article.manu,
|
program: data.program,
|
extParameter: {},
|
articleNumber: data["article-number"]
|
});
|
}));
|
this.register("update-visibility", (data_) => __async$2(this, null, function* () {
|
yield EventHandlerServiceClass.EachComponentInService(data_, (component) => __async$2(this, null, function* () {
|
component.updateVisibility();
|
}));
|
}));
|
this.register("update-accordion-heights", (data_) => __async$2(this, null, function* () {
|
yield EventHandlerServiceClass.EachComponentInService(data_, (component) => __async$2(this, null, function* () {
|
if (component instanceof AccordionItemComponent) {
|
component.requestHeightUpdate();
|
}
|
}));
|
}));
|
this.register("update-slider-ranges", (data_) => __async$2(this, null, function* () {
|
yield EventHandlerServiceClass.EachComponentInService(data_, (component) => __async$2(this, null, function* () {
|
if (component instanceof SliderComponent) {
|
component.requestUpdate();
|
}
|
}));
|
}));
|
this.register("execute-custom-event", (data_) => __async$2(this, null, function* () {
|
yield CommunicationMessageService.executeCustomEvent(data_ == null ? void 0 : data_.command, data_ == null ? void 0 : data_.instanceIdent, data_ == null ? void 0 : data_.parameters);
|
}));
|
this.register("set-element-selected", (data_) => __async$2(this, null, function* () {
|
yield CommunicationMessageService.selectObjectInScene(data_.instanceIdent);
|
}));
|
this.register("set-language", (data_) => __async$2(this, null, function* () {
|
const langCode = data_ == null ? void 0 : data_.langCode;
|
if (langCode) {
|
yield CommunicationMessageService.setLanguage(langCode);
|
yield LocalesModel.setLanguage(langCode);
|
CardContainerEventContainer.RefreshAll(true, false);
|
yield CardDataService.WaitForAllCardContainerFetchPromises();
|
yield EquipmentListComponent.Reload();
|
window.dispatchEvent(new CustomEvent("language-changed", { detail: langCode, bubbles: true, composed: true }));
|
}
|
}));
|
}
|
static EachComponent(data, action) {
|
return __async$2(this, null, function* () {
|
const components = data.components ? data.components : [];
|
if (data.component) {
|
components.push({
|
"name": data.component,
|
"selector": data.selector ? data.selector : "",
|
"all": data.all ? data.all : false
|
});
|
}
|
for (let index = 0; index < components.length; ++index) {
|
const component = components[index];
|
yield action(component.name, component.selector, component.all);
|
}
|
});
|
}
|
static EachComponentInService(data, action) {
|
return __async$2(this, null, function* () {
|
return yield this.EachComponent(data, (name, selector, all) => __async$2(this, null, function* () {
|
const components = ComponentService.findAll(name, selector ? selector : "");
|
if (components.length < 1)
|
return;
|
if (all === false || all === void 0) {
|
const component = components[0];
|
if (component)
|
yield action(component);
|
return;
|
}
|
for (let index = 0; index < components.length; ++index) {
|
yield action(components[index]);
|
}
|
}));
|
});
|
}
|
DispatchPostEvents(data) {
|
return __async$2(this, null, function* () {
|
if (data && data["post-events"]) {
|
const events = data["post-events"];
|
for (let index = 0; index < events.length; ++index) {
|
const event = events[index];
|
if (data["dispatch-post-events-synchronized-in-order"] || data["post-events-sync"]) {
|
yield this.dispatchAsyncEvent(event.id, event.data ? event.data : {});
|
continue;
|
}
|
return this.dispatch(event.id, event.data ? event.data : {});
|
}
|
}
|
});
|
}
|
getEvent(key) {
|
if (key.length > 0) {
|
if (this._events.has(key)) {
|
const event = this._events.get(key);
|
if (typeof event == "function") {
|
return event;
|
}
|
}
|
}
|
return void 0;
|
}
|
dispatchAsyncEvent(key, data_) {
|
return __async$2(this, null, function* () {
|
const event = this.getEvent(key);
|
if (event) {
|
yield event(data_);
|
yield this.DispatchPostEvents(data_);
|
return true;
|
}
|
console.error("Components-Event does not exist:", key);
|
return false;
|
});
|
}
|
dispatch(key, data_) {
|
const event = this.getEvent(key);
|
if (event) {
|
return event(data_).then(() => {
|
return this.DispatchPostEvents(data_);
|
});
|
}
|
console.error("Components-Event does not exist:", key);
|
return false;
|
}
|
dispatchEventList(events, asynchronously) {
|
return __async$2(this, null, function* () {
|
if (events && events.length > 0) {
|
if (asynchronously) {
|
for (const event of events) {
|
this.dispatch(event.id, event.data ? event.data : {});
|
}
|
return;
|
}
|
for (const event of events) {
|
yield this.dispatchAsyncEvent(event.id, event.data ? event.data : {});
|
}
|
}
|
});
|
}
|
register(key, event) {
|
this._events.set(key, event);
|
}
|
}
|
const EventHandlerService = new EventHandlerServiceClass();
|
window.EventHandlerService = EventHandlerService;
|
|
var __async$1 = (__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());
|
});
|
};
|
class UtilServiceClass {
|
generateExport(type_) {
|
return __async$1(this, null, function* () {
|
const exportInfo = yield CommunicationMessageService.generateExport(type_);
|
return {
|
url: `${exportInfo.server}/downloadExport/${exportInfo.sessionId}/${exportInfo.file}/${type_}`,
|
cloudID: exportInfo.cloudId
|
};
|
});
|
}
|
getPDF(useLastCloudID = false) {
|
return __async$1(this, null, function* () {
|
const printInfo = yield CommunicationMessageService.printPDF(useLastCloudID);
|
return {
|
url: `${printInfo.server}/downloadPDF/${printInfo.sessionId}/${printInfo.pdf}`,
|
cloudID: printInfo.cloudId
|
};
|
});
|
}
|
openCloudId(cloudId_, resetUiVars_ = false) {
|
return __async$1(this, null, function* () {
|
if (cloudId_) {
|
if (resetUiVars_) {
|
yield CommunicationMessageService.resetCurrentUserinterfaceManuProg();
|
}
|
yield window.CommunicationMessageService.openCloudId(cloudId_);
|
EventHandlerService.dispatch("close-modal", {});
|
}
|
});
|
}
|
delay(ms) {
|
return __async$1(this, null, function* () {
|
return new Promise((resolve) => setTimeout(resolve, ms));
|
});
|
}
|
querySelectorAllWithShadowRoots(selector, startNode = document) {
|
const elements = Array.from(startNode.querySelectorAll(selector));
|
const shadowElements = Array.from(document.querySelectorAll("*")).filter((element) => element.shadowRoot).reduce((acc, element) => {
|
var _a;
|
const shadowRootElements = ((_a = element["shadowRoot"]) == null ? void 0 : _a.querySelectorAll(selector)) || [];
|
return [...acc, ...Array.from(shadowRootElements)];
|
}, new Array());
|
return [...elements, ...shadowElements];
|
}
|
querySelectorWithShadowRoots(selector, startNode = document) {
|
return this.querySelectorAllWithShadowRoots(selector, startNode)[0];
|
}
|
replaceValueInObject(object, placeholder, replaceValue) {
|
const keys = Object.keys(object);
|
for (const key of keys) {
|
const value = object[key];
|
if (value === placeholder) {
|
object[key] = replaceValue;
|
} else if (value && typeof value === "object") {
|
this.replaceValueInObject(value, placeholder, replaceValue);
|
} else if (value && Array.isArray(value)) {
|
for (const content of value) {
|
if (content && typeof content === "object") {
|
this.replaceValueInObject(content, placeholder, replaceValue);
|
}
|
}
|
}
|
}
|
}
|
checkCssQuerySyntax(query) {
|
const cssRegex = /^(\*|#[\w-]+|\.[\w-]+|[\w-]+|\[\w+(=\w+)?\])(:\w+)?(>\w+)?(\s\w+)?$/;
|
return cssRegex.test(query);
|
}
|
ncrToUTF8(ncr) {
|
if (ncr && ncr.length > 0) {
|
return ncr.replace(/&#([0-9]+);/g, function(b) {
|
return String.fromCodePoint(parseInt(b.slice(2, -1)));
|
});
|
}
|
return ncr;
|
}
|
}
|
const UtilService = new UtilServiceClass();
|
|
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 ModalComponent = class extends BaseElement {
|
constructor() {
|
super();
|
this.hasBackground = false;
|
this.active = false;
|
this.cancelable = false;
|
this.cancelableOverwrite = void 0;
|
this.closeOnVPlacerCancel = false;
|
this.dimmed = false;
|
this.fade = false;
|
this.fullScreen = false;
|
this.logoUrl = "";
|
this.onCloseEvent = void 0;
|
this.showMasksOnce = false;
|
this.isLoading = false;
|
this.closedModals = [];
|
this.hiddenClasses = [];
|
this.addEventListener("close-modal", () => {
|
this.hide();
|
});
|
this.addEventListener("logo-url-updated", (event_) => {
|
this.logoUrl = event_.detail;
|
});
|
this._fadeIn = KeyFrameEffectService.addAnimation("fadeIn", this, [
|
{
|
"visiblity": "hidden",
|
"opacity": "0"
|
},
|
{
|
"visiblity": "visible",
|
"opacity": "1"
|
}
|
], (ev) => {
|
this.style.removeProperty("visibility");
|
this.style.setProperty("visibility", "visible");
|
});
|
this.initEventFactoryEvents();
|
}
|
get Cancelable() {
|
let cancelable = this.cancelable;
|
if (this.cancelableOnce != void 0) {
|
cancelable = this.cancelableOnce;
|
} else if (this.cancelableOverwrite != void 0) {
|
cancelable = this.cancelableOverwrite;
|
}
|
return cancelable;
|
}
|
initEventFactoryEvents() {
|
return __async(this, null, function* () {
|
yield CommunicationInterfaceService.IsAppReady;
|
EventFactoryService.VPlacerCancel.register(() => {
|
if (!this.closeOnVPlacerCancel)
|
return;
|
this.hide();
|
});
|
});
|
}
|
cancel(userCancel = true) {
|
this.dispatchEvent(new Event("close-modal"));
|
if (userCancel) {
|
const allMasks = this.querySelectorAll("[mask][active]");
|
for (let index = 0; index < allMasks.length; ++index) {
|
const mask = allMasks.item(index);
|
const maskName = mask.getAttribute("class");
|
if (maskName && this.closedModals.indexOf(maskName) === -1) {
|
this.closedModals.push(maskName);
|
}
|
}
|
}
|
}
|
build(content) {
|
const contentClass = { cancelable: this.cancelable, content: true };
|
const contentContainerClass = {
|
fullScreen: this.fullScreen,
|
"content-container": true,
|
"bg-image": this.hasBackground
|
};
|
return x`
|
${this.dimmed ? x`<fv-dimmer></fv-dimmer>` : ""}
|
<div class="center-container">
|
<div class="${o(contentContainerClass)}">
|
<fv-loading class="loading"></fv-loading>
|
<div class="modal-header">
|
${this.logoUrl.length > 0 ? x`
|
<div class="manufacturer-logo-container">
|
<img class="manufacturer-logo" src="${this.logoUrl}">
|
</div>` : x``}
|
${this.Cancelable ? x`
|
<div class="cancel-button" @click="${this.cancel}">
|
<span class="close-symbol"></span>
|
</div>` : ""}
|
</div>
|
<div class="${o(contentClass)}" part="content">
|
${content}
|
</div>
|
</div>
|
</div>
|
<div class="background-blur hidden"></div>
|
`;
|
}
|
attributeChangedCallback(name, _old, value) {
|
super.attributeChangedCallback(name, _old, value);
|
if (name === "active") {
|
this.hideElement = value == void 0 ? true : false;
|
}
|
}
|
firstUpdated(_changedProperties) {
|
var _a, _b;
|
super.firstUpdated(_changedProperties);
|
(_b = (_a = window.EventFactoryService) == null ? void 0 : _a.OpenModal) == null ? void 0 : _b.register((parameters) => {
|
window.dispatchEvent(new EventHandlerDispatchEvent({
|
async: false,
|
events: [{
|
id: "open-modal",
|
data: Object.assign({}, parameters)
|
}]
|
}));
|
});
|
}
|
render() {
|
return this.build(x`
|
<slot></slot>`);
|
}
|
setContent(element) {
|
const content = this.shadowRoot ? this.shadowRoot.querySelector(".content") : null;
|
if (content) {
|
content.innerHTML = "";
|
content.appendChild(element);
|
}
|
}
|
setLoading(visible_) {
|
this.isLoading = !!visible_;
|
let loadingComponent = this.querySelector(".loading");
|
let closeSymbol = this.querySelector(".close-symbol");
|
if (!closeSymbol && this.shadowRoot) {
|
closeSymbol = this.shadowRoot.querySelector(".close-symbol");
|
}
|
if (!loadingComponent && this.shadowRoot) {
|
loadingComponent = this.shadowRoot.querySelector(".loading");
|
}
|
if (loadingComponent) {
|
if (visible_) {
|
if (closeSymbol)
|
closeSymbol.classList.add("loading");
|
loadingComponent.show();
|
} else {
|
if (closeSymbol)
|
closeSymbol.classList.remove("loading");
|
loadingComponent.hide();
|
}
|
}
|
}
|
getMask(mask_) {
|
const allMasks = this.querySelectorAll("[mask]");
|
for (let index = 0; index < allMasks.length; ++index) {
|
const mask = allMasks.item(index);
|
if (mask.getAttribute("mask") === mask_) {
|
return mask;
|
}
|
}
|
return void 0;
|
}
|
selectMask(mask_, maskData_, maskQuery_) {
|
const allMasks = this.querySelectorAll("[mask]");
|
allMasks.forEach((mask) => {
|
mask.hide();
|
});
|
let result = false;
|
allMasks.forEach((mask) => {
|
if (mask.getAttribute("mask") !== mask_)
|
return;
|
const query2 = maskQuery_ ? maskQuery_ : "*";
|
if (!UtilService.checkCssQuerySyntax(query2) || !mask.matches(query2))
|
return;
|
mask.maskData = maskData_ ? maskData_ : mask.maskData;
|
mask.show();
|
result = true;
|
});
|
return result;
|
}
|
open(mask_, maskData_, maskQuery_, dimmed_ = this.dimmed, fade_ = this.fade, cancelableOverwrite_ = void 0, force_ = void 0) {
|
if (this.showMasksOnce && maskQuery_ && !force_) {
|
const className = maskQuery_.split(".").join("");
|
if (className && this.closedModals.indexOf(className) > -1) {
|
this.cancel(false);
|
return;
|
}
|
}
|
if (mask_) {
|
if (this.selectMask(mask_, maskData_, maskQuery_)) {
|
this.cancelableOverwrite = cancelableOverwrite_;
|
this.show(dimmed_, fade_);
|
}
|
} else {
|
this.cancelableOverwrite = cancelableOverwrite_;
|
this.show(dimmed_, fade_);
|
}
|
}
|
toggle(mask_, maskData_, maskQuery_, dimmed_ = this.dimmed, fade_ = this.fade, cancelableOverwrite_ = void 0, force_ = void 0) {
|
if (this.active) {
|
const mask = this.getMask(mask_);
|
if (mask && mask.active) {
|
this.hide(dimmed_, fade_);
|
return;
|
}
|
}
|
this.open(mask_, maskData_, maskQuery_, dimmed_, fade_, cancelableOverwrite_, force_);
|
}
|
show(dimmed = this.dimmed, fade = this.fade) {
|
if (!this.active) {
|
this.classList.remove("fade-out");
|
if (fade) {
|
this.classList.add("fade-in");
|
}
|
this.dimmed = dimmed;
|
this.active = true;
|
}
|
this.requestUpdate();
|
}
|
hide(dimmed = this.dimmed, fade = this.fade) {
|
if (this.active) {
|
if (this.onCloseEvent) {
|
window.dispatchEvent(new EventHandlerDispatchEvent({
|
async: false,
|
events: [{
|
id: this.onCloseEvent.id,
|
data: this.onCloseEvent.data ? this.onCloseEvent.data : {}
|
}]
|
}));
|
}
|
this.cancelableOverwrite = void 0;
|
this.cancelableOnce = void 0;
|
this.classList.remove("fade-in");
|
if (fade) {
|
this.classList.add("fade-out");
|
}
|
this.dimmed = dimmed;
|
this.active = false;
|
this.dispatchEvent(new CustomEvent("onHide", {}));
|
}
|
}
|
static ReadQueryFromContainer(tag, query2, defaultReturn) {
|
if (tag == void 0 || query2 == void 0)
|
return defaultReturn;
|
const container = ComponentService.find(tag, query2);
|
if (container == void 0)
|
return defaultReturn;
|
const maskQuery = container.getAttribute("modal-mask-query");
|
if (maskQuery && maskQuery.length > 0)
|
return maskQuery;
|
return defaultReturn;
|
}
|
static openModal(data_) {
|
if (data_) {
|
const query2 = data_.query ? data_.query : void 0;
|
const modal = ComponentService.find(data_.tag || "fv-modal", query2);
|
if (modal) {
|
const dimmed = data_.dimmed != void 0 ? data_.dimmed : modal.dimmed;
|
const fade = data_.fade != void 0 ? data_.fade : modal.fade;
|
const query3 = ModalComponent.ReadQueryFromContainer(data_["mask-query-container-tag"], data_["mask-query-container-query"], data_["mask-query"]);
|
modal.open(data_["mask"], data_["data"], query3, dimmed, fade, data_.cancelable, data_.force);
|
}
|
}
|
}
|
static closeModal(data_) {
|
if (data_) {
|
const query2 = data_.query ? data_.query : void 0;
|
const modal = ComponentService.find(data_.tag || "fv-modal", query2);
|
if (modal) {
|
const dimmed = data_.dimmed != void 0 ? data_.dimmed : modal.dimmed;
|
const fade = data_.fade != void 0 ? data_.fade : modal.fade;
|
modal.hide(dimmed, fade);
|
}
|
}
|
}
|
static toggleModal(data_) {
|
if (data_) {
|
const query2 = data_.query ? data_.query : void 0;
|
const modal = ComponentService.find(data_.tag || "fv-modal", query2);
|
if (modal && data_["mask"]) {
|
const dimmed = data_.dimmed != void 0 ? data_.dimmed : modal.dimmed;
|
const fade = data_.fade != void 0 ? data_.fade : modal.fade;
|
const query3 = ModalComponent.ReadQueryFromContainer(data_["mask-query-container-tag"], data_["mask-query-container-query"], data_["mask-query"]);
|
modal.toggle(data_["mask"], data_["data"], query3, dimmed, fade, data_.cancelable, data_.force);
|
}
|
}
|
}
|
};
|
ModalComponent.styles = [
|
__superStaticGet(ModalComponent, "styles") || [],
|
i`${r(css_248z$c)}`
|
];
|
__decorateClass([
|
n({ type: Boolean, reflect: true })
|
], ModalComponent.prototype, "active", 2);
|
__decorateClass([
|
n({ type: Boolean, reflect: true })
|
], ModalComponent.prototype, "cancelable", 2);
|
__decorateClass([
|
n({ type: Boolean, reflect: true, attribute: "close-on-vplacer-cancel" })
|
], ModalComponent.prototype, "closeOnVPlacerCancel", 2);
|
__decorateClass([
|
n({ type: Boolean, reflect: true })
|
], ModalComponent.prototype, "dimmed", 2);
|
__decorateClass([
|
n({ type: Boolean })
|
], ModalComponent.prototype, "fade", 2);
|
__decorateClass([
|
n({ type: Boolean, reflect: true })
|
], ModalComponent.prototype, "fullScreen", 2);
|
__decorateClass([
|
n({ type: String, reflect: true, attribute: "logo-url" })
|
], ModalComponent.prototype, "logoUrl", 2);
|
__decorateClass([
|
n({ type: Object, reflect: true, attribute: "on-close-event" })
|
], ModalComponent.prototype, "onCloseEvent", 2);
|
__decorateClass([
|
n({ type: Boolean, attribute: "show-masks-once" })
|
], ModalComponent.prototype, "showMasksOnce", 2);
|
ModalComponent = __decorateClass([
|
e("fv-modal")
|
], ModalComponent);
|
|
export { AnimationToolbarButtonComponent as A, BaseCardContainer as B, CardElementAccordionCreator as C, EventHandlerService as E, HrModeToolbarButtonComponent as H, IconStepComponent as I, LoadingModalComponent as L, ModalComponent as M, PerspectiveControlMaskComponent as P, RestartCheckMaskComponent as R, StepsComponent as S, ToolbarButtonComponent as T, UtilService as U, CardContainerEventContainer as a, CardElementSliderFilterCreator as b, BaseCard as c, StepComponent as d, CardClickEvent as e, CardClickedEvent as f, InternalCardContainerList as g, CardElementCreator as h, SelectPropertyMaskComponent as i, SelectArticleMaskComponent as j, ProgramSelectionConfirmationMaskComponent as k };
|
