https://abo.holzkurier.com/theme/4be93e49b32bb9b9b1ec49ecc6f8f60a/…/storefront.listing.plugin.886e19.js

1"use strict";(self.webpackChunk=self.webpackChunk||[]).push([[81181],{1181(e,t,s){s.r(t),s.d(t,{default:()=>n});var i=s(4335),r=s(9068),a=s(9749),l=s(4059);class n extends i.A{static #e=this.options={dataUrl:"",filterUrl:"",params:{},filterPanelSelector:".filter-panel",cmsProductListingSelector:".cms-element-product-listing",cmsProductListingWrapperSelector:".cms-element-product-listing-wrapper",cmsProductListingResultsSelector:".js-listing-wrapper",activeFilterContainerSelector:".filter-panel-active-container",activeFilterLabelClasses:"filter-active btn",activeFilterLabelSelector:".filter-active",activeFilterLabelPreviewClass:"filter-active-preview",resetAllFilterButtonClasses:"filter-reset-all btn btn-outline-danger",resetAllFilterButtonSelector:".filter-reset-all",loadingIndicatorClass:"is-loading",loadingElementLoaderClass:"has-element-loader",ariaLiveSelector:".filter-panel-aria-live",ariaLiveUpdates:!0,disableEmptyFilter:!1,snippets:{resetAllButtonText:"Reset all",resetAllFiltersAriaLabel:"Reset all filters",removeFilterAriaLabel:"Remove filter"},scrollTopListingWrapper:!0,scrollOffset:15,ignoreHashOnlyPopstate:!0};init(){this._registry=[],this.httpClient=new r.A,this._urlFilterParams=Object.fromEntries(new URLSearchParams(window.location.search).entries()),this._filterPanel=document.querySelector(this.options.filterPanelSelector),this._filterPanelActive=!!this._filterPanel,this._filterPanelActive&&(this._showResetAll=!1,this.activeFilterContainer=document.querySelector(this.options.activeFilterContainerSelector),this.ariaLiveContainer=document.querySelector(this.options.ariaLiveSelector)),this._cmsProductListingWrapper=document.querySelector(this.options.cmsProductListingWrapperSelector),this._cmsProductListingWrapperActive=!!this._cmsProductListingWrapper,this._allFiltersInitializedDebounce=l.A.debounce(this.sendDisabledFiltersRequest.bind(this),100),this._lastPathWithoutHash=this._getPathWithoutHash(),this._registerEvents()}refreshRegistry(){let e=this._registry.filter(e=>document.body.contains(e.el));this.init(),this._registry=e,window.PluginManager.initializePlugins()}changeListing(){let e=!(arguments.length>0)||void 0===arguments[0]||arguments[0],t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{};this._buildRequest(e,t),this._filterPanelActive&&this._buildLabels()}registerFilter(e){this._registry.push(e),this._setFilterState(e),this.options.disableEmptyFilter&&this._allFiltersInitializedDebounce()}_setFilterState(e){Object.keys(this._urlFilterParams).length>0&&"function"==typeof e.setValuesFromUrl&&e.setValuesFromUrl(this._urlFilterParams)&&this._filterPanelActive&&(this._showResetAll=!0,this._buildLabels())}deregisterFilter(e){this._registry=this._registry.filter(t=>t!==e)}_fetchValuesOfRegisteredFilters(){let e={};return this._registry.forEach(t=>{let s=t.getValues();Object.keys(s).forEach(t=>{Object.prototype.hasOwnProperty.call(e,t)?Object.values(s[t]).forEach(s=>{e[t].push(s)}):e[t]=s[t]})}),e}_mapFilters(e){let t={};return Object.keys(e).forEach(s=>{let i=e[s];Array.isArray(i)&&(i=i.join("|")),`${i}`.length&&(t[s]=i)}),t}_buildRequest(){let e=!(arguments.length>0)||void 0===arguments[0]||arguments[0],t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{},s=this._fetchValuesOfRegisteredFilters(),i=this._mapFilters(s);this._filterPanelActive&&(this._showResetAll=!!Object.keys(i).length),this.options.params&&Object.keys(this.options.params).forEach(e=>{i[e]=this.options.params[e]}),Object.entries(t).forEach(e=>{let[t,s]=e;i[t]=s});let r=new URLSearchParams(i);this.sendDataRequest(r),delete i.slots,delete i["no-aggregations"],delete i["reduce-aggregations"],delete i["only-aggregations"],r=new URLSearchParams(i),e&&this._updateHistory(r),this.options.scrollTopListingWrapper&&this._scrollTopOfListing()}_scrollTopOfListing(){let e=this._cmsProductListingWrapper.getBoundingClientRect();if(e.top>=0)return;let t=e.top+window.scrollY-this.options.scrollOffset;window.scrollTo({top:t,behavior:"smooth"})}_getDisabledFiltersParamsFromParams(e){let t=Object.assign({},{"only-aggregations":1,"reduce-aggregations":1},e);return delete t.p,delete t.order,delete t["no-aggregations"],new URLSearchParams(t)}_updateHistory(e){let t=this._buildUrl(window.location.pathname,e);window.history.pushState({},"",t),this._lastPathWithoutHash=this._getPathWithoutHash()}_buildLabels(){let e="";

1this._registry.forEach(t=>{let s=t.getLabels();s.length&&s.forEach(t=>{e+=this.getLabelTemplate(t)})}),this.activeFilterContainer.innerHTML=e;let t=this.activeFilterContainer.querySelectorAll(this.options.activeFilterLabelSelector);e.length&&(this._registerLabelEvents(t),this.createResetAllButton())}_registerLabelEvents(e){e.forEach(e=>{e.addEventListener("click",()=>this.resetFilter(e))})}createResetAllButton(){this.activeFilterContainer.insertAdjacentHTML("beforeend",this.getResetAllButtonTemplate());let e=this.activeFilterContainer.querySelector(this.options.resetAllFilterButtonSelector);e.removeEventListener("click",this.resetAllFilter.bind(this)),e.addEventListener("click",this.resetAllFilter.bind(this)),this._showResetAll||e.remove()}resetFilter(e){this._registry.forEach(t=>{t.reset(e.dataset.id)}),this._buildRequest(),this._buildLabels()}resetAllFilter(){this._registry.forEach(e=>{e.resetAll()}),this._buildRequest(),this._buildLabels()}getLabelTemplate(e){return`
2        <button
3            class="${this.options.activeFilterLabelClasses}"
4            data-id="${e.id}"
5            title="${this.options.snippets.removeFilterAriaLabel}: ${e.label}"
6            aria-label="${this.options.snippets.removeFilterAriaLabel}: ${e.label}">
7            ${this.getLabelPreviewTemplate(e)}
8            ${e.label}
9            <span aria-hidden="true" class="ms-1 fs-4">&times;</span>
10        </button>
11        `}getLabelPreviewTemplate(e){let t=this.options.activeFilterLabelPreviewClass;return e.previewHex?`
12                <span class="${t}" style="background-color: ${e.previewHex};"></span>
13            `:e.previewImageUrl?`
14                <span class="${t}" style="background-image: url('${e.previewImageUrl}');"></span>
15            `:""}getResetAllButtonTemplate(){return`
16        <button class="${this.options.resetAllFilterButtonClasses}" aria-label="${this.options.snippets.resetAllFiltersAriaLabel}">
17            ${this.options.snippets.resetAllButtonText}
18        </button>
19        `}addLoadingIndicatorClass(){this._filterPanel.classList.add(this.options.loadingIndicatorClass)}removeLoadingIndicatorClass(){this._filterPanel.classList.remove(this.options.loadingIndicatorClass)}addLoadingElementLoaderClass(){this._cmsProductListingWrapper.classList.add(this.options.loadingElementLoaderClass)}removeLoadingElementLoaderClass(){this._cmsProductListingWrapper.classList.remove(this.options.loadingElementLoaderClass)}sendDataRequest(e){this._filterPanelActive&&this.addLoadingIndicatorClass(),this._cmsProductListingWrapperActive&&this.addLoadingElementLoaderClass(),this.options.disableEmptyFilter&&this.sendDisabledFiltersRequest(),fetch(this._buildUrl(this.options.dataUrl,e),{headers:{"X-Requested-With":"XMLHttpRequest"}}).then(e=>e.text()).then(e=>{this.renderResponse(e),this._filterPanelActive&&(this.removeLoadingIndicatorClass(),this._updateAriaLive()),this._cmsProductListingWrapperActive&&this.removeLoadingElementLoaderClass()})}sendDisabledFiltersRequest(){let e=this._fetchValuesOfRegisteredFilters(),t=this._mapFilters(e);this.options.params&&Object.keys(this.options.params).forEach(e=>{t[e]=this.options.params[e]}),this._allFiltersInitializedDebounce=()=>{};let s=this._getDisabledFiltersParamsFromParams(t);fetch(this._buildUrl(this.options.filterUrl,s),{headers:{"X-Requested-With":"XMLHttpRequest"}}).then(e=>e.json()).then(e=>{this._registry.forEach(t=>{"function"==typeof t.refreshDisabledState&&t.refreshDisabledState(e,s)})})}renderResponse(e){a.A.replaceFromMarkup(e,this.options.cmsProductListingSelector),this._registry.forEach(e=>{"function"==typeof e.afterContentChange&&e.afterContentChange()}),window.PluginManager.initializePlugins(),this.$emitter.publish("Listing/afterRenderResponse",{response:e})}_updateAriaLive(){if(!this.options.ariaLiveUpdates||!this.ariaLiveContainer)return;let e=this.el.querySelector(this.options.cmsProductListingResultsSelector);this.ariaLiveContainer.innerHTML=e.dataset.ariaLiveText}_registerEvents(){window.onpopstate=this._onWindowPopstate.bind(this)}_onWindowPopstate(){if(this.options.ignoreHashOnlyPopstate&&this._lastPathWithoutHash){let e=this._getPathWithoutHash();if(this._lastPathWithoutHash===e)return}

19this.refreshRegistry(),this._registry.forEach(e=>{0===Object.keys(this._urlFilterParams).length&&(this._urlFilterParams.p=1),this._setFilterState(e)}),this.options.disableEmptyFilter&&this._allFiltersInitializedDebounce(),this.changeListing(!1)}_getPathWithoutHash(){return window.location.pathname+window.location.search}_buildUrl(e,t){let s=arguments.length>2&&void 0!==arguments[2]?arguments[2]:window.location.origin,i=new URL(e,s);return t.size>0&&t.forEach((e,t)=>{i.searchParams.append(t,e)}),i.toString()}}},9068(e,t,s){s.d(t,{A:()=>i});class i{constructor(){this._request=null,this._errorHandlingInternal=!1}get(e,t){let s=arguments.length>2&&void 0!==arguments[2]?arguments[2]:"application/json",i=this._createPreparedRequest("GET",e,s);return this._sendRequest(i,null,t)}post(e,t,s){let i=arguments.length>3&&void 0!==arguments[3]?arguments[3]:"application/json";i=this._getContentType(t,i);let r=this._createPreparedRequest("POST",e,i);return this._sendRequest(r,t,s)}delete(e,t,s){let i=arguments.length>3&&void 0!==arguments[3]?arguments[3]:"application/json";i=this._getContentType(t,i);let r=this._createPreparedRequest("DELETE",e,i);return this._sendRequest(r,t,s)}patch(e,t,s){let i=arguments.length>3&&void 0!==arguments[3]?arguments[3]:"application/json";i=this._getContentType(t,i);let r=this._createPreparedRequest("PATCH",e,i);return this._sendRequest(r,t,s)}abort(){if(this._request)return this._request.abort()}setErrorHandlingInternal(e){this._errorHandlingInternal=e}_registerOnLoaded(e,t){t&&(!0===this._errorHandlingInternal?(e.addEventListener("load",()=>{t(e.responseText,e)}),e.addEventListener("abort",()=>{console.warn(`the request to ${e.responseURL} was aborted`)}),e.addEventListener("error",()=>{console.warn(`the request to ${e.responseURL} failed with status ${e.status}`)}),e.addEventListener("timeout",()=>{console.warn(`the request to ${e.responseURL} timed out`)})):e.addEventListener("loadend",()=>{t(e.responseText,e)}))}_sendRequest(e,t,s){return this._registerOnLoaded(e,s),e.send(t),e}_getContentType(e,t){return e instanceof FormData&&(t=!1),t}_createPreparedRequest(e,t,s){return this._request=new XMLHttpRequest,this._request.open(e,t),this._request.setRequestHeader("X-Requested-With","XMLHttpRequest"),s&&this._request.setRequestHeader("Content-type",s),this._request}}},9749(e,t,s){s.d(t,{A:()=>r});let i=Object.freeze(new class{constructor(){this._domParser=new DOMParser}replaceFromMarkup(e,t){let s=e;"string"==typeof s&&(s=this._createMarkupFromString(s)),"string"==typeof t&&(t=[t]),this._replaceSelectors(s,t)}replaceElement(e,t){return("string"==typeof e&&(e=document.querySelectorAll(e)),"string"==typeof t&&(t=document.querySelectorAll(t)),e instanceof NodeList&&t instanceof NodeList&&t.length>e.length)?(t.forEach(t=>{e.forEach(e=>{e.innerHTML&&e.className===t.className&&(t.innerHTML=e.innerHTML)})}),!0):e instanceof NodeList&&e.length?(e.forEach((e,s)=>{e.innerHTML&&(t[s].innerHTML=e.innerHTML)}),!0):t instanceof NodeList&&t.length?(t.forEach(t=>{e.innerHTML&&(t.innerHTML=e.innerHTML)}),!0):!!t&&!!e&&!!e.innerHTML&&(t.innerHTML=e.innerHTML,!0)}_replaceSelectors(e,t){t.forEach(t=>{let s=e.querySelectorAll(t),i=document.querySelectorAll(t);this.replaceElement(s,i)})}_createMarkupFromString(e){return this._domParser.parseFromString(e,"text/html")}});class r{static replaceFromMarkup(e,t){i.replaceFromMarkup(e,t)}static replaceElement(e,t){return i.replaceElement(e,t)}}}}]);