globalThis['zbThemes']['HOME'] = class HOME { featuredCategories = []; getCategoryProducts_categoryId_5850 = []; getRecentlyViewedProducts = []; getCategoryDetails_categoryId_5850 = {}; isAPIPage = true; webElements = ['zwe-slider']; device = "desktop"; constructor(bundleService, awsImageUrl, language, currencySymbol) { this.bundle = bundleService; this.awsUrl = awsImageUrl; this.language = language; this.currency = currencySymbol; globalThis['nextProducts_mgbn7qiq_hkudm'] = this.nextProducts_mgbn7qiq_hkudm.bind(this); globalThis['prevProducts_mgbn7qiq_hkudm'] = this.prevProducts_mgbn7qiq_hkudm.bind(this); globalThis['showProducts_mgbn7qiq_hkudm'] = this.showProducts_mgbn7qiq_hkudm.bind(this); } async zbOnInit(element,isInitial) { const document = element || globalThis?.safeDocument; const window = globalThis?.safeWindow; if(isInitial){ await this._getFeaturedCategories(); await this._fetchProductsByCategories_categoryId_5850(); await this._getRecentlyViewedProducts(); await this._getCategoryDetails_categoryId_5850(); } (() => { const defaultAnimations = { "textSlideIn7": [ { "opacity": 0, "transform": "translateX(-200%)", "offset": 0 }, { "opacity": 0, "offset": 0.2 }, { "transform": "translateX(5%)", "offset": 0.6 }, { "transform": "translateX(-2%)", "offset": 0.75 }, { "opacity": 1, "transform": "translateX(0%)", "offset": 1 } ] }; const animateElement = (elem, animation, time, direction, delay = 0, iterations = 1, easing = "ease-out", fill = "forwards") => { return elem.animate(animation, { delay, duration: time, direction, easing, iterations, fill }); }; const animatedElements = new Set(); const infiniteAnimations = new Map(); const activeAnimations = new Map(); const signal = window?.animationCleanupController?.signal; if(typeof window !== 'undefined') { const observer = new IntersectionObserver((entries) => { entries.forEach(entry => { const el = entry.target; const animationName = el.getAttribute("data-animation-name"); const getIterationCount = el.getAttribute("data-animation-iteration"); const iterationCount = Math.max(0, parseInt(getIterationCount ?? "1", 10) || 1); const animateType = el.getAttribute("data-animation"); const duration = Math.max(0, el.getAttribute("data-animation-duration") || 700); const delay = el.getAttribute("data-animation-delay"); const easing = el.getAttribute("data-animation-easing") ?? "ease-out"; const fill = el.getAttribute("data-animation-fill") ?? "forwards"; const direction = el.getAttribute("data-animation-direction") ?? "normal"; if (entry.isIntersecting) { if (animateType === "loop" && !infiniteAnimations.has(el)) { const animation = animateElement(el, defaultAnimations[animationName], duration, direction, delay, Infinity, easing, fill); infiniteAnimations.set(el, animation); signal.addEventListener('abort', () => { animation.cancel(); infiniteAnimations.delete(el); }, { once: true }); } else if (animateType === "in-once" && !animatedElements.has(el)) { animateElement(el, defaultAnimations[animationName], duration, "normal", delay, iterationCount, easing, fill); animatedElements.add(el); } else if (animateType === "in") { animateElement(el, defaultAnimations[animationName], duration, "normal", delay, iterationCount, easing, fill); } else if (animateType === "in-out" && !animatedElements.has(el)) { animateElement(el, defaultAnimations[animationName], duration, "normal", delay, iterationCount, easing, fill); } } else { if (animateType === "in-out" && animatedElements.has(el)) { animateElement(el, defaultAnimations[animationName], duration, "reverse", delay, iterationCount, easing, fill); } else if (animateType === "loop" && infiniteAnimations.has(el)) { const animation = infiniteAnimations.get(el); animation.cancel(); infiniteAnimations.delete(el); } } }); }, { threshold: 0 }); document.querySelectorAll("[data-animation='in'],[data-animation='in-out'],[data-animation='in-once'],[data-animation='loop']").forEach(el => { observer.observe(el); }); } })(); }; nextProducts_mgbn7qiq_hkudm(){ const rootElement = document.querySelector('#mgbn7qiq_hkudm'); const cards = Array.from(rootElement.querySelectorAll(`[data-id='fresh-fruits-products-slider'] .product-card-container`)); console.log('cards',cards); const total = cards.length; const visible = cards.filter(c => c.style.display === 'block'); if (!visible) return; const lastId = parseInt(visible[visible.length - 1].getAttribute('data-id').split('-').pop(), 10); console.log('lastId',lastId); const start = (lastId + 1) % total; console.log('start',start); cards.forEach((card, i) => { const offset = (i - start + total) % total; console.log('offset',offset); card.style.display = (offset < 3) ? 'block' : 'none'; }) }; prevProducts_mgbn7qiq_hkudm(){ const rootElement = document.querySelector('#mgbn7qiq_hkudm'); const cards = Array.from(rootElement.querySelectorAll(`[data-id='fresh-fruits-products-slider'] .product-card-container`)); const total = cards.length; const visible = cards.filter(c => c.style.display === 'block'); if (!visible.length) return; const firstId = parseInt(visible[0].getAttribute('data-id').split('-').pop(), 10); console.log('firstId',firstId); const start = ((firstId - 3) % total + total) % total; console.log('start',start); cards.forEach((card, i) => { const offset = (i - start + total) % total; card.style.display = (offset < 3) ? 'block' : 'none'; }); }; showProducts_mgbn7qiq_hkudm(){ const rootElement = document.querySelector('#mgbn7qiq_hkudm'); const cards = rootElement.querySelectorAll(`[data-id='fresh-fruits-products-slider'] .product-card-container`); cards.forEach((cards,idx) => { cards.style.display = (idx < 3) ? 'block' : 'none'; }); const prevIcon = rootElement.querySelector(`[data-id='arrow_left_icon']`); const nextIcon = rootElement.querySelector(`[data-id='arrow_right_icon']`); if (cards.length < 3) { if (prevIcon) prevIcon.style.display = 'none'; if (nextIcon) nextIcon.style.display = 'none'; } }; async HOME(child) { const awsUrl = this.awsUrl; const language = this.language; const currency = this.currency; let html = ""; // Section 1 try { html += `

`; } catch (err) { console.error("Error rendering section 1 (ZEN_BOOK-HOME-SECTION#1):", err); } // Section 2 try { html += `

Featured Category

${this.featuredCategories.map((data, i) => { const item = { ...data, index: i , length: this.featuredCategories?.length}; return `

${item?.categoryName}

SHOP CATEGORY

${item?.categoryName}

SHOP NOWarrow_right_alt

` }).join('')}

`; } catch (err) { console.error("Error rendering section 2 (ZEN_BOOK-HOME-SECTION#2):", err); } // Section 3 try { html += `

${this?.getCategoryDetails_categoryId_5850?.categoryName}

${this.getCategoryProducts_categoryId_5850.map((data, i) => { const item = { ...data, index: i , length: this.getCategoryProducts_categoryId_5850?.length}; return `

${item?.name}

${item?.description}

${currency}${item?.price}

View Product

` }).join('')}

keyboard_arrow_leftkeyboard_arrow_right

`; } catch (err) { console.error("Error rendering section 3 (ZEN_BOOK-HOME-SECTION#3):", err); } // Section 4 try { html += `

`; } catch (err) { console.error("Error rendering section 4 (ZEN_BOOK-HOME-SECTION#4):", err); } // Section 5 try { html += `

Recently Viewed Products

${this.getRecentlyViewedProducts.map((data, i) => { const item = { ...data, index: i , length: this.getRecentlyViewedProducts?.length}; return `

${item?.name}

${item?.price}

` }).join('')}

`; } catch (err) { console.error("Error rendering section 5 (ZEN_BOOK-HOME-SECTION#5):", err); } return html || ''; } async _getFeaturedCategories() { const apiInput = { input: { params: { storeId: this.bundle?.storeId }, query: { langCode: this.bundle?.langCode, locationId: this.bundle?.locationId } } }; try { const res = await this.bundle?.getFeaturedCategories?.(apiInput); this.featuredCategories = res?.i1_featuredCategories?.getCategories ?? []; return this.featuredCategories; } catch (error) { console.error('Error fetching getFeaturedCategories:', error); this.featuredCategories = []; return []; } } async _fetchProductsByCategories_categoryId_5850() { const apiInput = { input: { query: { offset: 0, locationId: this.bundle?.locationId, limit: 10, langCode: "en", categoryId: [ 5850 ], isFeaturedProduct: this.bundle?.isFeaturedProduct }, params: { storeId: this.bundle?.storeId } } }; try { const res = await this.bundle?.fetchProductsByCategories?.(apiInput); this.getCategoryProducts_categoryId_5850 = res?.i1_fetchProductList?.products ?? []; return this.getCategoryProducts; } catch (error) { console.error('Error fetching fetchProductsByCategories:', error); this.getCategoryProducts = []; return []; } } async _getRecentlyViewedProducts() { const apiInput = { input: { params: { storeId: this.bundle?.storeId }, query: { customerId: this.bundle?.customerId } } }; try { const res = await this.bundle?.getRecentlyViewedProducts?.(apiInput); this.getRecentlyViewedProducts = res?.i1_getRecentlyViewedProducts?.recentlyViewedProducts ?? []; return this.getRecentlyViewedProducts; } catch (error) { console.error('Error fetching getRecentlyViewedProducts:', error); this.getRecentlyViewedProducts = []; return []; } } async _getCategoryDetails_categoryId_5850() { const apiInput = { input: { params: { storeId: this.bundle?.storeId }, query: { categoryId: 5850 } } }; try { const res = await this.bundle?.getCategoryDetails?.(apiInput); this.getCategoryDetails_categoryId_5850 = res?.i1_getCategoryDetails?.categoryDeatils ?? {}; return this.getCategoryDetails; } catch (error) { console.error('Error fetching getCategoryDetails:', error); this.getCategoryDetails = {}; return {}; } } };

Choose Location

Featured Category

undefined

Recently Viewed Products