https://beyondyoga.com/cdn/shop/t/2162/assets/components-image-filters.js?v=118052791421691779261790887701

1import{refreshElements}from"@theme/global-utilities";export class ImageFilters extends HTMLElement{constructor(){super(),this._selectors={container:"image-filters",imageFilter:"[js-image-filter]",imageFilterClear:"[js-image-filter-clear]",activeImageFilter:".active-image-filter",mainFilterInput:"[js-filter-input]"},this._refresh=["[js-image-filter]"],this._events={change:"filter:change"}}connectedCallback(){this.addEventListener("click",this._onDelegatedClick),document.addEventListener("filter:change",this._onFilterChange),this._cacheFilters(),this._syncImageFilterStates()}disconnectedCallback(){this.removeEventListener("click",this._onDelegatedClick),document.removeEventListener("filter:change",this._onFilterChange)}_cacheFilters(){this.imageFilters=this.querySelectorAll(this._selectors.imageFilter),this.imageFilterClears=this.querySelectorAll(this._selectors.imageFilterClear)}_onDelegatedClick=e=>{const t=e.target.closest(this._selectors.imageFilter);if(t&&this.contains(t))return e.preventDefault(),void this._imageFilterOnClick(t);const i=e.target.closest(this._selectors.imageFilterClear);i&&this.contains(i)&&this._imageFilterClearOnClick(i)};_imageFilterClearOnClick=e=>{if(e.classList.contains("active"))return;this._cacheFilters();const t=new Set;this.imageFilters.forEach(e=>{const i=this._parseFilterUrl(e.dataset.filterUrl);this._getFilterInputsForParams(i).forEach(e=>{t.add(e)})}),t.forEach(e=>{e.checked&&(e.checked=!1,e.dispatchEvent(new Event("input",{bubbles:!0})))}),this._syncImageFilterStates()};_normalizeFilterUrl(e){if(!e)return"";const t=e.trim(),i=t.indexOf("?");return-1!==i?t.slice(i+1).replace(/^&/,""):t.replace(/^&/,"")}_updateImageFiltersState=(e=!1)=>{this._cacheFilters();const t=e?e.querySelector("#FilterDrawer filter-sort"):document.querySelector("#FilterDrawer filter-sort");if(this.imageFilters.forEach(e=>{const i=this._normalizeFilterUrl(e.dataset.filterUrl);if(!i)return;const r=i.split("&").filter(Boolean);let l=!1,s=!1;for(const e of r){const i=e.split("=");if(i.length>=2){const e=i[0],r=i.slice(1).join("=").trim(),a=this._findFilterInput(t,e,r);if(a&&(s=!0,!a.hasAttribute("disabled"))){l=!0;break}}}l||!s?e.removeAttribute("disabled"):e.setAttribute("disabled","")}),this.imageFilterClears.length>0){const e=!!this.querySelector(`${this._selectors.imageFilter} ${this._selectors.activeImageFilter}`);this.imageFilterClears.forEach(t=>{const i=!e;t.classList.toggle("active",i),this._setImageFilterActiveState(t,i)})}};_onFilterChange=e=>{const{parsedHTML:t}=e.detail,i=t.querySelector(this._selectors.container);refreshElements(this._refresh,i,this),this._syncImageFilterStates(t)};_parseFilterUrl(e){return this._normalizeFilterUrl(e).split("&").filter(Boolean).map(e=>{const t=e.indexOf("=");return-1===t?null:{name:e.slice(0,t).trim(),value:e.slice(t+1).trim()}}).filter(Boolean)}_normalizeValue(e){let t=String(e||"");try{t=decodeURIComponent(t)}catch(e){}return t.replace(/"/gi,'"').replace(/["“”″″'′]/g,"").replace(/[–—]/g,"-").replace(/\s*-\s*/g,"-").replace(/\s+/g," ").trim().toLowerCase()}_inputLabelText(e,t){const i=t.id?e.querySelector(`label[for="${t.id}"]`):null;if(!i)return"";const r=i.querySelector(".filter-value-label__text");return(r?r.textContent:i.getAttribute("aria-label"))||""}_findFilterInput(e,t,i){if(!e)return null;const r=[...e.querySelectorAll(this._selectors.mainFilterInput)].filter(e=>e.name===t),l=r.find(e=>e.value===i);if(l)return l;const s=this._normalizeValue(i);return s&&r.find(t=>this._normalizeValue(t.value)===s||this._normalizeValue(this._inputLabelText(e,t))===s)||null}_getFilterInputsForParams(e){const t=document.querySelector("#FilterDrawer [js-filter-form]");return t?e.map(({name:e,value:i})=>this._findFilterInput(t,e,i)).filter(Boolean):[]}_setImageFilterActiveState(e,t){const i=e.querySelector(".collection-nav-filter__text");i&&i.classList.toggle("active-image-filter",t)}_syncImageFilterStates(e=!1){this._cacheFilters(),this.imageFilters.forEach(e=>{const t=e.dataset.filterUrl,i=this._parseFilterUrl(t),r=this._getFilterInputsForParams(i),l=i.length>0&&r.length===i.length&&r.every(e=>e.checked);this._setImageFilterActiveState(e,l)}),this._updateImageFiltersState(e)}_imageFilterOnClick=e=>

1{const t=e.dataset.filterUrl,i=this._parseFilterUrl(t);if(0===i.length)return void this._imageFilterClearOnClick(e);const r=this._getFilterInputsForParams(i);if(r.length!==i.length)return;const l=!r.every(e=>e.checked);r.forEach(e=>{e.hasAttribute("disabled")&&l||e.checked!==l&&(e.checked=l,e.dispatchEvent(new Event("input",{bubbles:!0})))}),this._syncImageFilterStates()}}customElements.get("image-filters")||customElements.define("image-filters",ImageFilters);