import { r as registerInstance, h, H as Host } from './index-3d16dafa.js';
import { a as api } from './api-0c31171f.js';
var ECatalogStatusTypes;
(function (ECatalogStatusTypes) {
ECatalogStatusTypes["REQUESTED"] = "REQUESTED";
ECatalogStatusTypes["DELIVERED"] = "DELIVERED";
ECatalogStatusTypes["GENERATED"] = "GENERATED";
ECatalogStatusTypes["FAILED"] = "FAILED";
})(ECatalogStatusTypes || (ECatalogStatusTypes = {}));
function resolveStatusColor(type) {
switch (type) {
case ECatalogStatusTypes.REQUESTED:
return "grey";
case ECatalogStatusTypes.FAILED:
return "red";
case ECatalogStatusTypes.GENERATED:
return "dark-blue";
case ECatalogStatusTypes.DELIVERED:
return "green";
default:
return "grey";
}
}
const getStatusText = ({ type, text }) => {
const statusColor = resolveStatusColor(type);
return `
${text}
`;
};
const row = (timeFormat) => ({ fileName, status, dateOfRequest, availability, downloadLink, }) => {
const statusText = getStatusText(status);
return `
${fileName} |
${statusText} |
|
${availability} |
${downloadLink !== ""
? `
`
: `
`}
|
`;
};
const eCatalogCss = ".ux-iws-e-catalog{min-height:400px;display:block}.ux-iws-e-catalog__headline{text-align:center;margin:50px auto;position:relative}@media only screen and (min-width: 768px){.ux-iws-e-catalog__headline{margin-bottom:60px}}@media only screen and (min-width: 1440px){.ux-iws-e-catalog__headline{margin-top:70px}}.ux-iws-e-catalog__results-button-container{bottom:0;width:100%;max-height:44px;display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;overflow:visible;margin-top:25px;text-align:center;-ms-flex-direction:column;flex-direction:column}.ux-iws-e-catalog__results-button-container .ux-spinner{display:-ms-flexbox;display:flex;-webkit-transform:translateY(-30px);transform:translateY(-30px)}.ux-iws-e-catalog__results-button-container>*:not(.ux-spinner){margin:0 auto}.ux-iws-e-catalog__no-results{width:66%;text-align:center;margin:30px auto 20px}.ux-iws-e-catalog__no-results .ux-text-normal{margin:5px auto}@media only screen and (min-width: 1440px){.ux-iws-e-catalog__no-results{margin-top:50px}}.ux-iws-e-catalog__no-results .ux-icon{font-size:100px}@media only screen and (min-width: 768px){.ux-iws-e-catalog__no-results .ux-icon{font-size:120px}}@media only screen and (min-width: 1440px){.ux-iws-e-catalog__no-results .ux-icon{font-size:150px;margin-bottom:-5px}}.ux-iws-e-catalog__no-results-button-container{margin-top:30px}.ux-iws-e-catalog td:first-child{font-family:\"Frutiger-Light\", sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility;font-weight:400}";
let ECatalog = class {
constructor(hostRef) {
registerInstance(this, hostRef);
this.baseClass = "ux-iws-e-catalog";
/** endpoint where data can be requested */
this.url = "";
/** CSS selector for the table */
this.tableSelector = "";
/** CSS selector for the element where the total number of eCatalogs should be placed */
this.totalNumberSelector = "";
/** CSS selector for the button container below the page title */
this.buttonContainerSelector = "";
/** CSS selector for the scroll-sensor */
this.scrollSensorSelector = "";
/** table element */
this.table = null;
/** table body element where the data should be put */
this.tableBody = null;
/** NodeList of DOM elements where the total number of eCatalogs should be put */
this.totalNumberElements = null;
/** URL for getting the next page */
this.nextPage = "";
/** DOM element where all the table rows should be put */
this.scrollSensor = null;
/** the button container below the page title */
this.buttonContainer = null;
this.isLoading = true;
this.hasData = false;
this.noDataHeadline = "";
this.noDataText = "";
this.appendCallToActionToPage = (buttonHTML) => {
if (!this.hasData) {
this.noResultsButtonContainer.innerHTML = buttonHTML;
this.buttonContainer.remove();
}
else {
this.buttonContainer.innerHTML = buttonHTML;
}
};
}
componentWillLoad() {
this.setTable();
this.setScrollSensor();
this.setButtonContainer();
this.setTotalNumberElements();
this.requestData(this.url);
}
/** Connect total number */
setTotalNumberElements() {
if (this.totalNumberSelector === "")
return;
this.totalNumberElements = document.querySelectorAll(this.totalNumberSelector);
}
updateNumbers(total) {
writeToElements(this.totalNumberElements, total.toString());
}
/** connect table */
setTable() {
var _a;
if (this.tableSelector === "")
return;
this.table = document.querySelector(this.tableSelector);
this.tableBody = (_a = this.table) === null || _a === void 0 ? void 0 : _a.querySelector("tbody");
}
setButtonContainer() {
if (this.buttonContainerSelector === "")
return;
this.buttonContainer = document.querySelector(this.buttonContainerSelector);
}
/** connect scroll-sensor */
setScrollSensor() {
if (this.scrollSensorSelector === "")
return;
this.scrollSensor = document.querySelector(this.scrollSensorSelector);
if (this.scrollSensor !== null) {
this.scrollSensor.addEventListener("uxInfiniteScrollSensorScrolledIntoView", () => {
this.requestData(this.nextPage);
});
}
}
/** post filter, date and sort settings to get data from the endpoint */
initialRequest() {
this.requestData(this.url);
}
/** Send the real request and handle response */
async requestData(url) {
var _a, _b;
if (url === "")
return;
const options = isMockUrl(url)
? {}
: {
method: "GET",
headers: {
"Content-Type": "application/x-www-form-urlencoded;charset=UTF-8",
},
};
const data = await api(url, options);
if (this.url === url) {
this.clearExistingData();
}
// simulating calll time in dev environment
if (isMockUrl(url))
await new Promise((resolve) => setTimeout(resolve, 2000));
if (data.items.length > 0) {
this.hasData = true;
this.isLoading = false;
}
else {
this.hasData = false;
this.isLoading = false;
this.noDataHeadline = (_a = data === null || data === void 0 ? void 0 : data.messages) === null || _a === void 0 ? void 0 : _a.noDataHeadline;
this.noDataText = (_b = data === null || data === void 0 ? void 0 : data.messages) === null || _b === void 0 ? void 0 : _b.noDataText;
}
this.dateFormat = data.timeFormat;
if (data.buttonHTML)
this.appendCallToActionToPage(data.buttonHTML);
this.appendItemsToTable(data.items);
if (data.totalCount)
this.updateNumbers(data.totalCount);
this.nextPage = data.nextPage || "";
if (this.nextPage !== "" && this.scrollSensor !== null) {
this.scrollSensor.hasFired = false;
}
}
clearExistingData() {
if (this.tableBody !== null)
this.tableBody.textContent = "";
}
appendItemsToTable(items) {
if (this.tableBody === null)
return;
this.tableBody.insertAdjacentHTML("beforeend", items.map(row(this.dateFormat)).join(""));
}
render() {
const { baseClass, isLoading, hasData, noDataHeadline, noDataText, } = this;
return (h(Host, { class: baseClass }, h("div", { class: "ux-u-margin-top-30", style: { display: isLoading ? "block" : "none" } }, h("div", { class: "ux-spinner" })), h("div", { style: {
display: !isLoading && hasData ? "block" : "none",
} }, h("slot", { name: "results" })), h("div", { style: {
display: !hasData && !isLoading ? "block" : "none",
} }, h("div", { class: `${baseClass}__no-results` }, h("ux-icon", { name: "documents-screen" }), h("div", { class: "ux-text-headline ux-text-headline--big ux-u-margin-top-15" }, noDataHeadline), h("p", { class: "ux-text-normal ux-text-normal--light-grey" }, noDataText), h("div", { class: `${baseClass}__no-results-button-container`, ref: (el) => (this.noResultsButtonContainer = el) })))));
}
static get watchers() { return {
"totalNumberSelector": ["setTotalNumberElements"],
"tableSelector": ["setTable"],
"buttonContainerSelector": ["setButtonContainer"],
"scrollSensorSelector": ["setScrollSensor"],
"url": ["initialRequest"]
}; }
};
function isMockUrl(url) {
return url.indexOf("mock-data/") > -1;
}
function writeToElements(nodes, text) {
if (nodes === null)
return;
[].forEach.call(nodes, (element) => (element.textContent = text));
}
ECatalog.style = eCatalogCss;
export { ECatalog as ux_iws_e_catalog };