import { e } from './custom-element-30fc6381.js';
|
import { n, B as BaseElement } from './base.component-813fc7cf.js';
|
import { i as i$1 } from './query-1c86d710.js';
|
import { i, r, x } from './query-assigned-elements-fea1f631.js';
|
import { PropTransferModel } from './prop-transfer.model.js';
|
import { PTPropertyGroupComponent } from './pt-property-group.component.js';
|
import { ProgPropertyModel } from './prog-property.model.js';
|
import { PPPropertyValuesComponent } from './pp-property-values.component.js';
|
import { PPPropertyComponent } from './pp-property.component.js';
|
import { PPMode } from './pp-container.component.js';
|
import { ConfigurationService } from './configuration.service.js';
|
import '@dh-software/furnview-icons';
|
import './pt-property-item.component.js';
|
import './class-map-a0fb5d87.js';
|
import './pp-property-value.component.js';
|
import './ral-picker.component.js';
|
import './color-picker.model.js';
|
import './transition.helper.js';
|
import './ncs-picker.component.js';
|
import './sikkens-picker.component.js';
|
import './interface.js';
|
|
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}.pt-component{flex:1;margin-bottom:50px;overflow-x:hidden;overflow-y:auto;width:100%}:host([theme="1"]) .pt-component{align-content:flex-start;display:flex;flex-flow:wrap}:host{display:flex;flex-direction:column;width:100%}`;
|
|
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 PTThemeIndexClass$1 {
|
build(ppComponent, containerComponent, options) {
|
return __async$2(this, null, function* () {
|
const values = [];
|
yield PropTransferModel.traverse({
|
groupCallback: (manufacturer, program, group, items) => __async$2(this, null, function* () {
|
const valuesComponent = new PTPropertyGroupComponent();
|
if (items && options.grouped) {
|
items.forEach((item) => {
|
valuesComponent.addItem(item);
|
});
|
}
|
values.push(valuesComponent);
|
}),
|
itemsCallback: (item) => __async$2(this, null, function* () {
|
if (!options.grouped) {
|
const valuesComponent = new PTPropertyGroupComponent();
|
if (item) {
|
valuesComponent.addItem(item);
|
}
|
values.push(valuesComponent);
|
}
|
})
|
}, options);
|
ppComponent.innerHTML = "";
|
values.forEach((valueComponent) => {
|
ppComponent.appendChild(valueComponent);
|
});
|
});
|
}
|
}
|
const PTFurnviewThemeIndex = new PTThemeIndexClass$1();
|
|
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 PTThemeIndexClass {
|
build(ppComponent, containerComponent, options) {
|
return __async$1(this, null, function* () {
|
const values = [];
|
yield PropTransferModel.traverse({
|
groupCallback: (manufacturer, program, group, items) => __async$1(this, null, function* () {
|
const valuesComponent = new PTPropertyGroupComponent();
|
const progProperties = [];
|
items.forEach((item) => {
|
for (let i = 0; i < item.progProperties.length; i++) {
|
progProperties.indexOf(item.progProperties[i]) === -1 ? progProperties.push(item.progProperties[i]) : null;
|
}
|
});
|
if (items && options.grouped) {
|
items.forEach((item) => {
|
valuesComponent.addItem(item);
|
});
|
}
|
values.push(valuesComponent);
|
const filteredProgProperties = yield ProgPropertyModel.findMany(manufacturer, program, progProperties);
|
Object.values(filteredProgProperties).forEach((progPropertyModel) => {
|
const ppMenu = new PPPropertyComponent({ title: progPropertyModel.name, hideItemCount: containerComponent.hideItemCount });
|
const progPropertyValueList = Object.values(progPropertyModel.children);
|
const currentValue = progPropertyModel.currentValue;
|
if (currentValue) {
|
ppMenu.currentName = currentValue.name;
|
ppMenu.currentImage = currentValue.alternativeImageUrl;
|
}
|
const ppItems = new PPPropertyValuesComponent();
|
ppItems.id = "item_" + progPropertyModel.id;
|
values.push(ppMenu);
|
values.push(ppItems);
|
ppMenu.addEventListener("click", () => {
|
if (!ppMenu.active) {
|
ppComponent.querySelectorAll("fv-pp-property").forEach((property) => {
|
if (ppMenu !== property) {
|
property.classList.add("hidden");
|
}
|
});
|
ppMenu.active = true;
|
ppItems.active = true;
|
}
|
});
|
ppMenu.itemCount = progPropertyValueList.length;
|
for (let ppvI = 0; ppvI < progPropertyValueList.length; ppvI++) {
|
const progPropertyValueModel = progPropertyValueList[ppvI];
|
ppItems.addItem({
|
colorPicker: progPropertyModel.colorPicker,
|
imgUrl: progPropertyValueModel.alternativeImageUrl,
|
name: progPropertyValueModel.name,
|
manufacturer: progPropertyModel.manufacturerName.toLowerCase(),
|
program: progPropertyModel.programName.toLowerCase(),
|
key: progPropertyModel.id,
|
property: progPropertyValueModel.key,
|
propertyKey: progPropertyValueModel.propertyKey,
|
containerComponent
|
});
|
}
|
});
|
}),
|
itemsCallback: (item) => __async$1(this, null, function* () {
|
if (!options.grouped) {
|
const valuesComponent = new PTPropertyGroupComponent();
|
if (item) {
|
valuesComponent.addItem(item);
|
}
|
values.push(valuesComponent);
|
}
|
})
|
}, options);
|
ppComponent.innerHTML = "";
|
values.forEach((valueComponent) => {
|
ppComponent.appendChild(valueComponent);
|
});
|
});
|
}
|
}
|
const PTCombineThemeIndex = new PTThemeIndexClass();
|
|
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());
|
});
|
};
|
var PPTheme;
|
(function(PPTheme2) {
|
PPTheme2[PPTheme2["FURNVIEW"] = 1] = "FURNVIEW";
|
PPTheme2[PPTheme2["COMBINE"] = 99] = "COMBINE";
|
})(PPTheme || (PPTheme = {}));
|
let PTContainerComponent = class extends BaseElement {
|
constructor() {
|
super();
|
this.IsBusy = false;
|
this.theme = 1;
|
this.halfSize = false;
|
this.grouped = true;
|
this.hideItemCount = false;
|
this._ppModeSelection = false;
|
this._ppMode = PPMode.ALL;
|
}
|
get PPOptions() {
|
const propertyOptions = {};
|
switch (this._ppMode) {
|
default:
|
case PPMode.ALL:
|
break;
|
case PPMode.COMPONENT:
|
propertyOptions.modifyComponent = true;
|
break;
|
case PPMode.ELEMENT:
|
propertyOptions.modifyElement = true;
|
break;
|
}
|
return propertyOptions;
|
}
|
connectedCallback() {
|
var __superGet = (key) => super[key];
|
return __async(this, null, function* () {
|
__superGet("connectedCallback").call(this);
|
EventFactoryService.RefreshPropertyPanel.register(() => {
|
this.loadPropertyPanel();
|
});
|
yield RequestHelperService.fetchConfiguration();
|
yield CommunicationInterfaceService.IsAppReady;
|
if (this._ppModeSelection && this._ppModeDropdown) {
|
const config = yield ConfigurationService.Configuration;
|
if (!config.disable_properties_on_selection) {
|
if (this._ppModeDropdown.parentElement)
|
this._ppModeDropdown.parentElement.classList.remove("hidden");
|
this._ppModeDropdown.addEventListener("onChange", (evt) => {
|
this._ppMode = evt.detail.item.value;
|
});
|
this._ppModeDropdown.clearItems();
|
this._ppModeDropdown.addItems([
|
{
|
text: yield LocalesModel.get("1701"),
|
value: PPMode.ALL
|
},
|
{
|
text: yield LocalesModel.get("1702"),
|
value: PPMode.ELEMENT
|
},
|
{
|
text: yield LocalesModel.get("1703"),
|
value: PPMode.COMPONENT
|
}
|
], false);
|
}
|
}
|
yield this.loadPropertyPanel();
|
});
|
}
|
loadPropertyPanel() {
|
return __async(this, null, function* () {
|
var _a;
|
this.IsBusy = true;
|
const oldScrollTop = (_a = this._ptComponent) == null ? void 0 : _a.scrollTop;
|
if (this._ptComponent) {
|
switch (+this.theme) {
|
case 1:
|
yield PTFurnviewThemeIndex.build(this._ptComponent, this, { grouped: this.grouped, useSelection: true });
|
break;
|
case 99:
|
yield PTCombineThemeIndex.build(this._ptComponent, this, { grouped: this.grouped, useSelection: true });
|
break;
|
}
|
}
|
yield this.updateComplete;
|
if (this._ptComponent && typeof oldScrollTop === "number")
|
this._ptComponent.scrollTop = oldScrollTop;
|
this.IsBusy = false;
|
});
|
}
|
render() {
|
return x`
|
${this._ppModeSelection ? x`
|
<div class="hidden">
|
<fv-dropdown id="mode-dropdown"></fv-dropdown>
|
</div>
|
` : ""}
|
<div class="pt-component">
|
<slot></slot>
|
</div>`;
|
}
|
};
|
PTContainerComponent.styles = [
|
__superStaticGet(PTContainerComponent, "styles") || [],
|
i`${r(css_248z)}`
|
];
|
__decorateClass([
|
i$1("#mode-dropdown")
|
], PTContainerComponent.prototype, "_ppModeDropdown", 2);
|
__decorateClass([
|
i$1(".pt-component")
|
], PTContainerComponent.prototype, "_ptComponent", 2);
|
__decorateClass([
|
n({ type: Boolean, reflect: true })
|
], PTContainerComponent.prototype, "IsBusy", 2);
|
__decorateClass([
|
n({ type: PPTheme, reflect: true })
|
], PTContainerComponent.prototype, "theme", 2);
|
__decorateClass([
|
n({ type: Boolean, reflect: true })
|
], PTContainerComponent.prototype, "halfSize", 2);
|
__decorateClass([
|
n({ type: Boolean, reflect: true })
|
], PTContainerComponent.prototype, "grouped", 2);
|
__decorateClass([
|
n({ type: Boolean, reflect: true })
|
], PTContainerComponent.prototype, "hideItemCount", 2);
|
__decorateClass([
|
n({ type: Boolean, reflect: true, attribute: "mode-selection" })
|
], PTContainerComponent.prototype, "_ppModeSelection", 2);
|
PTContainerComponent = __decorateClass([
|
e("fv-pt-container")
|
], PTContainerComponent);
|
|
export { PTContainerComponent };
|
