shop-by_dept_home_class_decor_seasonality_spring_frame-material_resin (2024)

See Results

`; facetsHTML += facet; }); return facetsHTML;}function setAccordionInitialState() { // Select all accordion sections const accordionSections = document.querySelectorAll('.accordion__section'); // Convert NodeList to Array to use reverse method const sectionsArray = Array.from(accordionSections).reverse(); let lastCheckedSectionOpened = false; let isAnySectionAlreadyOpen = false; // First, check if any section is already open accordionSections.forEach(section => { if (section.classList.contains('open')) { isAnySectionAlreadyOpen = true; } }); sectionsArray.forEach(section => { const id = section.id.split('accordion-section-')[1]; const button = document.getElementById(`accordion-open-${id}`); // Check if any sub-input is checked within the section const anyChecked = section.querySelectorAll('input[type="checkbox"]:checked').length > 0; if (!isAnySectionAlreadyOpen) { if (anyChecked && !lastCheckedSectionOpened) { // Open the section and button, and mark as the last opened section.classList.add('open'); section.setAttribute('aria-hidden', 'false'); if (button) { button.classList.add('expanded'); button.setAttribute('aria-expanded', 'true'); } lastCheckedSectionOpened = true; // Prevent opening any other checked sections } else { // Close the section and button section.classList.remove('open'); section.setAttribute('aria-hidden', 'true'); if (button) { button.classList.remove('expanded'); button.setAttribute('aria-expanded', 'false'); } } } });}// this is a large function can use some refactoring but what it does is it takes the active filters and builds the function buildAccordManual(ArraySelections){ // console.log(ArraySelections) const accordionSections = document.querySelectorAll('.accordion__section'); accordionSections.forEach(section => { //section.setAttribute('aria-hidden', true) //section.classList.remove('open') }) ArraySelections.sort((a, b) => { let aName = Object.keys(a)[0].toLowerCase(); let bName = Object.keys(b)[0].toLowerCase(); let aIndex = orderList.indexOf(aName); let bIndex = orderList.indexOf(bName); if (aIndex === -1 && bIndex === -1) { return aName.localeCompare(bName); } if (aIndex === -1) return 1; if (bIndex === -1) return -1; return aIndex - bIndex; }); document.querySelectorAll('.accordion__section').forEach((section) => { section.innerHTML = ''; }); ArraySelections.forEach(facet => { let facetName = Object.keys(facet)[0]; let facetValues = facet[facetName]; // Sort facetValues alphabetically by their keys facetValues.sort((a, b) => { const keyA = Object.keys(a)[0].toLowerCase(); const keyB = Object.keys(b)[0].toLowerCase(); return keyA.localeCompare(keyB); }); const AccordSection = document.getElementById(`accordion-section-${facetName.toLowerCase()}`); if (AccordSection !== null) { AccordSection.insertAdjacentHTML("beforeEnd", ListedFacets(facetValues, facetName.toLowerCase())); } else { } }); accordionSections.forEach((section) => { // Extract the variable part from section's ID const idTokens = section.id.split('accordion-section-'); const relevantIdPart = idTokens.length > 1 ? idTokens[1] : null; if (relevantIdPart) { // Construct the corresponding button's ID const buttonId = `accordion-open-${relevantIdPart.toLowerCase()}`; const correspondingButton = document.getElementById(buttonId); // Check if section is empty if (section.innerHTML.trim() === '') { // Hide the section and button section.style.display = 'none'; if (correspondingButton) { correspondingButton.style.display = 'none'; } } else { // Make sure the section and button are visible section.style.display = 'block'; if (correspondingButton) { correspondingButton.style.display = 'flex'; } } } }); setAccordionInitialState() // Get all facet containers (assuming they have a class of accordion__section) const facetContainers = document.querySelectorAll('.accordion__section'); // Assume facetContainers is a NodeList or Array of your container elements. facetContainers.forEach(container => { // Get all selectionFilters within this container const filters = container.querySelectorAll('.selectionFilter'); let isChecked = false; // Loop through each filter to find checkboxes within them filters.forEach((filter) => { const childCheckboxes = filter.querySelectorAll('input[type="checkbox"]'); childCheckboxes.forEach((checkbox) => { if (checkbox.checked) { isChecked = true; } }); }); // Only proceed to add "See More" button if none of the child checkboxes are checked, // and if there are more than 10 filters if (!isChecked && filters.length > 10) { // Hide all but the first 10 filters initially for (let i = 10; i < filters.length; i++) { filters[i].style.display = 'none'; } // Create and append the "See More" button const showMoreButton = document.createElement('button'); showMoreButton.innerText = 'See More'; showMoreButton.addEventListener('click', function() { // Show all hidden filters for (let i = 10; i < filters.length; i++) { filters[i].style.display = 'block'; } // Remove the 'See More' button showMoreButton.style.display = 'none'; }); container.appendChild(showMoreButton); } }); }async function fetchAndBuildProductAttributes(removedFilter) { try { async function setupPage() { await collectFacets(); buildAccordManual(mergedFilters); runAfter() view_category() let checkboxes = document.querySelectorAll('.selectionFilter input[type=checkbox]'); checkboxes.forEach(checkbox => { checkbox.addEventListener('change', function(event) { const filterName = event.target.getAttribute('data-filtername'); // console.log(filterName); updateActiveFilters(filterName, event.target.id, event.target.checked); build(1); updateURLWithFacets(); }); }); } setupPage() } catch (error) { console.error(`An error occurred: ${error}`); } if(removedFilter){ // console.log(removedFilter) } }function ToggleMobalFiltersOpen(open){ if (open) { document.querySelector('.modalMobileFilters').classList.remove('Mobilehide') document.querySelector('body').style.overflow = 'hidden'; // console.log('Modal opened Toggled'); } else { } // document.querySelector('.modalMobileFilters').classList.remove('Mobilehide') // // console.log('Modal opened Toggled');}function ToggleMobalFiltersClose(){ document.querySelector('.modalMobileFilters').classList.add('Mobilehide') document.querySelector('body').style.overflow = 'auto'; // console.log('Modal closed');}document.querySelector('.mobileFilters').addEventListener('click', () => { // ToggleMobalFiltersOpen()})// Start of codeasync function customFieldsCollection(callCount = 0) { let afterCursorCustom = '' return new Promise(async (resolve, reject) => { try { if (callCount >= maxCalls) { resolve(customFieldsCollectArry); return; } await GraphQLCall(customFields(afterCursorCustom)).then(data => { CustomCallData = data customFieldsCollectArry.push(...data.data.site.search.searchProducts.products.edges); if (data.data.site.search.searchProducts.products.pageInfo.hasNextPage) { afterCursorCustom = data.data.site.search.searchProducts.products.pageInfo.endCursor; ArraySelections = customFieldsCollectArry resolve(customFieldsCollection(callCount + 1)); } else { ArraySelections = customFieldsCollectArry resolve(customFieldsCollectArry); } }); } catch (error) { reject(error); } });}// let DefaultFiltersDebug =[]async function collectFacets() { customFieldsCollectArry = [] ArraySelections = await customFieldsCollection(0); FiltersSet = extractCustomFieldsNew(ArraySelections, keysToCollect) mergedFilters = [] try { //console.log(DefaultFilters) // let DefaultFiltersDebug = DefaultFilters; let convertedDefaultFilters = DefaultFilters.map(item => { const name = item.node.name; let attributes; // Declare `attributes` here for broader scope if (item.node.attributes != undefined) { attributes = item.node.attributes.edges.map(edge => { return { [edge.node.value]: edge.node.productCount }; }); } else { attributes = []; // Assign a default value (e.g., an empty array) to handle the else case } return { [name]: attributes }; }); // console.log(convertedDefaultFilters); // console.log(FiltersSet) mergedFilters = [...FiltersSet, ...convertedDefaultFilters]; // console.log(mergedFilters) addClassObject(mergedFilters.find(obj => 'Class' in obj), imageList) // console.log(mergedFilters); } catch (error) { console.error("An error occurred:", error); }}async function collectFacetsOLD() { customFieldsCollectArry = [] ArraySelections = await customFieldsCollection(0); FiltersSet = extractCustomFieldsNew(ArraySelections, keysToCollect) mergedFilters = [] try { const convertedDefaultFilters = DefaultFilters.map(item => { const name = item.node.name; // console.log(name) const attributes = item.node.attributes.edges.map(edge => { return { [edge.node.value]: edge.node.productCount }; }); // console.log(attributes) return { [name]: attributes }; }); // console.log(convertedDefaultFilters) // console.log(FiltersSet) mergedFilters = [...FiltersSet, ...convertedDefaultFilters]; // console.log(mergedFilters) addClassObject(mergedFilters.find(obj => 'Class' in obj), imageList) // console.log(mergedFilters); } catch (error) { console.error("An error occurred:", error); }}function createFilterOption(Option) { const value = Option.node ? Option.node.value : Object.keys(Option)[0]; return `

`;}function createFilterGroup(Filter) { const name = Filter.node ? Filter.node.name : Object.keys(Filter)[0]; const attributes = Filter.node ? Filter.node.attributes.edges : Filter[name]; const optionsHTML = attributes.map(createFilterOption).join(''); return `

${name}

${optionsHTML}

`;}function additionalFacets(facetNumber, subFacetNumber){ if(atob(facetNumber) == 'arrayconnection:1'){ callFacets(facetNumber); }else{ callFacets(btoa('arrayconnection:' + facetNumber), subFacetNumber) }}function callFacets(AfterFacetCusor, facetCusor = ""){ let setAfterfacetNumber = ', after:' + facetNumber let setAfterAfterFacetCusor = facetCusor ? ', after:' + facetCusor : ''; facetsAdditions = `query { site { search { searchProducts( filters: { hideOutOfStock: true, ${searchFor()} productAttributes:[${att}] } sort: ${sortBySelection()} ) { filters(first: 1 ${facetNumber}) { edges { node { ... on ProductAttributeSearchFilter { __typename name filterName displayProductCount attributes(first: 50 ${setAfterAfterFacetCusor}) { edges { node { value productCount isSelected } cursor } pageInfo { hasNextPage hasPreviousPage startCursor endCursor } } isCollapsedByDefault } name } cursor } pageInfo { startCursor hasPreviousPage hasNextPage endCursor } } } } } }` }

  • Explore items based on your interests.

`) })}function buildCatalogFiltersEmptyPLP(filters) { var filterToUse = filters.length >= 2 ? filters[1] : filters[0]; var key = filterToUse.key; var onlyOneValue = filterToUse.value[0]; var catalogFilters = [{ 'property': "category_1", 'constraint': { 'type': 'string', 'operator': 'equals', 'operands': [ { 'type': 'constant', 'value': "home" }]}}]; return catalogFilters;} var PLACEMENTEmptyPLP = "EmptyPLP"; // var recommendation_idEmptyPLP = "65fdaf1e4f0fb4e107d50a80"; var recommendation_idEmptyPLP = "660711dd58ba72fc3a95b8f3"; var RCM_STATUSEmptyPLP = 0; let productsRecsArrayEmptyPLP = []; var onRecommendationsLoadedEmptyPLP = function (ProductsDataEmptyPLP) { if (RCM_STATUSEmptyPLP !== "TIMED_OUT") { RCM_STATUSEmptyPLP = "LOADED"; if (ProductsDataEmptyPLP && ProductsDataEmptyPLP.length > 11) { console.log("list of products to recommend " + JSON.stringify(ProductsDataEmptyPLP)); for (var i = 0; i < ProductsDataEmptyPLP.length; i++) { if (productsRecsArrayEmptyPLP.length >= 11) { break; } var item = ProductsDataEmptyPLP[i]; console.log(item.product_id); productsRecsArrayEmptyPLP.push(item.product_id); console.log("list of products to recommend " + JSON.stringify(productsRecsArrayEmptyPLP)); } } else {} } GraphQLCall(QureyBuiltrecsEmptyPLP(productsRecsArrayEmptyPLP)) .then(data => { recsProductsEmptyPLP = data.data.site.products.edges; buildRecsEmptyPLP(recsProductsEmptyPLP); }) .catch(error => { console.error("Failed to Build Products Page Review Build Function", error); }); }; var optionsRecsEmptyPLP = { recommendationId: recommendation_idEmptyPLP, size: 50, callback: onRecommendationsLoadedEmptyPLP, fillWithRandom: true, //catalogFilter: buildCatalogFiltersEmptyPLP(activeFilters), // Adds additional constrains to catalog when retrieving recommended items. Example: [{'property': 'gender', 'constraint': { 'type': 'string', 'operator': 'equals', 'operands': [{'type': 'constant', 'value': 'male'}]}}] catalogAttributesWhitelist: [], // Returns only specified attributes from catalog items. If empty or not set, returns everything. }; setTimeout(function () { if(plpProducts.length > 0){ console.log("Products are not empty. Hide Recommendations."); } else { document.querySelector('.productsPLP').style.display = 'grid'; exponea.getRecommendation(optionsRecsEmptyPLP); document.querySelector('.productRecommendations').style.display = 'none'; } }, 1000);

shop-by_dept_home_class_decor_seasonality_spring_frame-material_resin (2024)
Top Articles
Latest Posts
Article information

Author: Madonna Wisozk

Last Updated:

Views: 5992

Rating: 4.8 / 5 (68 voted)

Reviews: 83% of readers found this page helpful

Author information

Name: Madonna Wisozk

Birthday: 2001-02-23

Address: 656 Gerhold Summit, Sidneyberg, FL 78179-2512

Phone: +6742282696652

Job: Customer Banking Liaison

Hobby: Flower arranging, Yo-yoing, Tai chi, Rowing, Macrame, Urban exploration, Knife making

Introduction: My name is Madonna Wisozk, I am a attractive, healthy, thoughtful, faithful, open, vivacious, zany person who loves writing and wants to share my knowledge and understanding with you.