function anonymous(inputs,input,model,_model,initialModel,experienceId,_experienceId,domRef,experience,debug ) { return (async () => { if (!model.id.includes('C3_fc868495-4504-81f0-8005-47a0c5cf651c')) return; (function() { // Check if top.window.dataLayer exists if (!top.window.dataLayer) { console.log('No datalayer'); return; // Exit the script if dataLayer does not exist } // Helper function to push data to the dataLayer function pushToDataLayer(eventData) { top.window.dataLayer.push(eventData); } // New Tracking Code using FASTR_FRONTEND if (window.FASTR_FRONTEND && FASTR_FRONTEND.experiences) { // Iterate over each experience in FASTR_FRONTEND.experiences Object.keys(FASTR_FRONTEND.experiences).forEach(function(experienceIdWithSuffix) { var experience = FASTR_FRONTEND.experiences[experienceIdWithSuffix]; var model = experience.model || {}; var experienceName = model.experienceName || model.fileName || ''; var experienceType = model.type || 'experience'; // The experience ID in HTML does not have the '_0' suffix var experienceId = experienceIdWithSuffix.replace(/_0$/, ''); // Move the model.id check inside the loop after model is defined if (model.id && model.id.includes('C3_cb45c4a1-6129-814e-8004-c54efb80c044')) { return; // Skip this experience } // Function to track scene views function trackSceneView(sceneNumber) { var gClassName = ''; // Attempt to find the class name var anchor = experienceElement.querySelector('.fastr-shape-anchor'); if (anchor) { var gElement = anchor.querySelector('g'); if (gElement && gElement.className && gElement.className.baseVal) { gClassName = gElement.className.baseVal; } } var sceneValue = sceneNumber + ' ' + gClassName; var eventData = { event: 'zmags', zmags_exp: experienceName, zmags_exp_type: experienceType, zmags_int: 'view', zmags_scene: sceneValue }; pushToDataLayer(eventData); } // Get the experience element in the DOM var experienceElement = document.querySelector('[data-experience="' + experienceId + '"]'); if (experienceElement) { // Set up an observer to track when the experience comes into view var observer = new IntersectionObserver(function(entries) { entries.forEach(function(entry) { if (entry.isIntersecting) { var currentSceneNumber = experience.getCurrentScene(); trackSceneView(currentSceneNumber); // Listen for scene changes if (typeof experience.onSceneChange === 'function') { experience.onSceneChange(function(newSceneNumber) { trackSceneView(newSceneNumber); }); } // Add click event listener to track link clicks within the experience experienceElement.addEventListener('click', function(event) { var link = event.target.closest('a'); if (link) { var url = link.href.baseVal || link.href; var currentSceneNumber = experience.getCurrentScene(); // Find the closest ancestor with class 'fastr-shape-anchor' var anchor = event.target.closest('.fastr-shape-anchor'); var gClassName = ''; if (anchor) { // Find the element inside this anchor var gElement = anchor.querySelector('g'); if (gElement && gElement.className && gElement.className.baseVal) { gClassName = gElement.className.baseVal; } } var sceneValue = currentSceneNumber + ' ' + gClassName; var eventData = { event: 'zmags', zmags_exp: experienceName, zmags_exp_type: experienceType, zmags_int: 'click_link', zmags_scene: sceneValue, zmags_url: url }; pushToDataLayer(eventData); // Check if the link is a Quick View link if (url.includes('openQuickview')) { waitForModalAndExecuteAction(experienceElement, experienceId, experienceName); } } }); // Disconnect observer after initial tracking observer.disconnect(); } }); }, { threshold: 0 }); observer.observe(experienceElement); } }); // Function to wait for Quick View modal and execute action function waitForModalAndExecuteAction(container, experienceId, experienceName) { var checkModal = setInterval(function() { var quickViewModal = document.getElementById('quickViewModal'); if (quickViewModal && getComputedStyle(quickViewModal).display !== 'none') { clearInterval(checkModal); // Stop checking once the modal is found and visible // Now that the modal is visible, run the following code var qvsAnchors = document.querySelectorAll('a[id^="zmags-qv"]'); if (qvsAnchors.length > 0) { var href = qvsAnchors[qvsAnchors.length - 1].getAttribute('href'); var urlParams = new URLSearchParams(href.split('?')[1]); var pid = urlParams.get('pid'); trackQV(pid, experienceName, container); } } }, 200); // Check every 200 milliseconds } // Function to track Quick View function trackQV(prodID, experienceName, viewerContainer) { var currentSceneNumber = viewerContainer.dataset.sceneNumber || '1'; var sceneValue = currentSceneNumber + ' '; var event = { event: 'zmags', zmags_exp: experienceName, zmags_exp_type: 'experience', zmags_int: 'click_quickview', zmags_scene: sceneValue, zmags_url: prodID }; pushToDataLayer(event); trackAddToCart(prodID, experienceName); } // Function to track Add to Cart function trackAddToCart(prodID, experienceName) { var modal = document.getElementById('quickViewModal'); if (!modal) return; var addToCartButton = modal.querySelector('.add-to-cart.btn.btn-primary.new-quick-view-modal'); if (!addToCartButton) return; var productPriceElement = modal.querySelector('.value'); var productPrice = productPriceElement ? productPriceElement.textContent.trim() : ''; addToCartButton.addEventListener('click', function() { var event = { event: 'zmags', zmags_exp: experienceName, zmags_exp_type: 'experience', zmags_int: 'click_add_to_cart', zmags_url: prodID, zmags_value: productPrice }; pushToDataLayer(event); }); } } else { // Old Tracking Code using ZMAGS_ANALYTICS_API // Your original legacy code remains here, unchanged to ensure compatibility // [Include your provided legacy code below] window.ZMAGS_ANALYTICS_API = window.ZMAGS_ANALYTICS_API || {}; ZMAGS_ANALYTICS_API.EXPERIENCE_NAME_CACHE = {}; ZMAGS_ANALYTICS_API.INTERSECTION_OBSERVER = null; ZMAGS_ANALYTICS_API.PLUS_ICONS = [""]; ZMAGS_ANALYTICS_API.MUTATION_OBSERVER = null; ZMAGS_ANALYTICS_API.EXPERIENCE_TYPES = ["HERO", "BANNER", "MODULE", "VIDEO", "PDP"]; ZMAGS_ANALYTICS_API.EVENTS_FIRED = ZMAGS_ANALYTICS_API?.EVENTS_FIRED || { "click_events": [] }; ZMAGS_ANALYTICS_API.getExperienceName = function (contextWindow, experienceId) { if (!ZMAGS_ANALYTICS_API.EXPERIENCE_NAME_CACHE[experienceId]) { const expname = contextWindow?.[`${experienceId}_1_STATE`]?.viewer?.experiences?.[experienceId]?.model?.name || ""; ZMAGS_ANALYTICS_API.EXPERIENCE_NAME_CACHE[experienceId] = expname; } return ZMAGS_ANALYTICS_API.EXPERIENCE_NAME_CACHE[experienceId]; }; ZMAGS_ANALYTICS_API.customEvent = function (name, args) { top.window.dataLayer = top.window.dataLayer || []; let data = { event: name }; for (let key in args) { if (args.hasOwnProperty(key)) { data[key] = args[key]; } } top.window.dataLayer.push(data); }; ZMAGS_ANALYTICS_API.trackLink = function (link, experienceName) { const url = link.href; const scene = link.closest("[class^='scene-']")?.className || ""; const event = { "zmags_exp": experienceName, "zmags_exp_type": ZMAGS_ANALYTICS_API.EXPERIENCE_TYPES.filter(name => experienceName.toUpperCase().includes(name))[0] || "experience", "zmags_int": "click_link", "zmags_scene": scene, "zmags_url": url }; if (!document.hidden) { ZMAGS_ANALYTICS_API.customEvent("zmags", event); ZMAGS_ANALYTICS_API.EVENTS_FIRED['click_events'].push(event); } }; ZMAGS_ANALYTICS_API.trackAddToCart = function (prodID, experienceName) { var modal = document.getElementById('quickViewModal'); if (!modal) return; var addToCartButton = modal.querySelector('.add-to-cart.btn.btn-primary.new-quick-view-modal'); if (!addToCartButton) return; var productPrice = modal.querySelector('.value').textContent.trim(); addToCartButton.addEventListener('click', function () { var event = { "zmags_exp": experienceName, "zmags_exp_type": ZMAGS_ANALYTICS_API.EXPERIENCE_TYPES.filter(name => experienceName.toUpperCase().includes(name))[0] || "experience", "zmags_int": "click_add_to_cart", "zmags_url": prodID, "zmags_value": productPrice }; ZMAGS_ANALYTICS_API.customEvent("zmags", event); ZMAGS_ANALYTICS_API.EVENTS_FIRED['click_events'].push(event); }); }; ZMAGS_ANALYTICS_API.trackQV = function (prodID, experienceName, viewerContainer) { const currentScene = viewerContainer.querySelector('[class^="scene-"][style*="visibility: inherit"][style*="opacity:"]:not(.scene-background, .scene-overlay), [class^="scene-"][style*="visibility: visible"]:not(.scene-background, .scene-overlay), [class^="scene-"][style*="visibility:visible"]:not(.scene-background, .scene-overlay)')?.className || ""; const event = { "zmags_exp": experienceName, "zmags_exp_type": ZMAGS_ANALYTICS_API.EXPERIENCE_TYPES.filter(name => experienceName.toUpperCase().includes(name))[0] || "experience", "zmags_int": "click_quickview", "zmags_scene": currentScene, "zmags_url": prodID }; if (!document.hidden) { ZMAGS_ANALYTICS_API.customEvent("zmags", event); ZMAGS_ANALYTICS_API.EVENTS_FIRED['click_events'].push(event); } ZMAGS_ANALYTICS_API.trackAddToCart(prodID, experienceName); }; function waitForModalAndExecuteAction(container, experienceId, experienceName) { var checkModal = setInterval(function() { var quickViewModal = document.getElementById('quickViewModal'); if (quickViewModal && getComputedStyle(quickViewModal).display !== 'none') { clearInterval(checkModal); // Stop checking once the modal is found and visible // Now that the modal is visible, run the following code var qvsAnchors = document.querySelectorAll('a[id^="zmags-qv"]'); if (qvsAnchors.length > 0) { var href = qvsAnchors[qvsAnchors.length - 1].getAttribute('href'); var urlParams = new URLSearchParams(href.split('?')[1]); var pid = urlParams.get('pid'); ZMAGS_ANALYTICS_API.trackQV(pid, `${experienceId} - ${experienceName}`, container); } } }, 200); // Check every 200 milliseconds } ZMAGS_ANALYTICS_API.trackExperienceSceneView = function (viewerContainer, experienceId) { const observerConfig = { attributes: true, childList: true, }; const sceneContainers = Array.from(viewerContainer.querySelectorAll('.scene-background') || []).map(ele => { if (!ele.parentNode.dataset.analyticsInitiated) { ele.parentNode.dataset.experienceId = experienceId; ele.parentNode.dataset.analyticsInitiated = true; return ele.parentNode; } return null; }).filter(ele => ele !== null); sceneContainers.forEach((container) => { const experienceId = container.dataset.experienceId; const experienceName = ZMAGS_ANALYTICS_API.EXPERIENCE_NAME_CACHE[`${experienceId}`]; // We are not calling trackSceneChange here as per your original script container.addEventListener("click", function (event) { const anchorTag = event.target?.closest('a') || {}; if (anchorTag.tagName === "A" && !anchorTag.href.includes('openQuickview')) { ZMAGS_ANALYTICS_API.trackLink(anchorTag, `${experienceId} - ${experienceName}`); } else if (anchorTag.tagName === "A" && anchorTag.href.includes('openQuickview')) { waitForModalAndExecuteAction(container, experienceId, experienceName); } }); ZMAGS_ANALYTICS_API.MUTATION_OBSERVER.observe(container, observerConfig); }); }; ZMAGS_ANALYTICS_API.setupTracking = function (context, contextWindow) { const viewerContainers = context.querySelectorAll('[class^="zmags-viewer-container"][data-zmags-initiated]:not([data-analytics-initiated])'); for (let viewerContainer of viewerContainers) { const experienceId = viewerContainer.dataset.experience; ZMAGS_ANALYTICS_API.getExperienceName(contextWindow, experienceId); ZMAGS_ANALYTICS_API.INTERSECTION_OBSERVER.observe(viewerContainer); viewerContainer.dataset.analyticsInitiated = true; } const iframes = Array.from(context.querySelectorAll("iframe:not([data-analytics-error])")); iframes.forEach(function (iframe) { try { const iframeDoc = iframe.contentDocument || iframe.contentWindow.document; const iframeWindow = iframe.contentWindow; ZMAGS_ANALYTICS_API.setupTracking(iframeDoc, iframeWindow); } catch (e) { iframe.dataset.analyticsError = true; console.log("Failed to access iframe, probably because it is from a different origin."); } }); }; function isElementInViewport(element) { const sceneContainer = element.querySelectorAll('[class="scene-background"]')[0] || element; const rect = sceneContainer.getBoundingClientRect(); const viewportHeight = window.innerHeight || document.documentElement.clientHeight; return ((rect.top >= 0 && rect.top <= viewportHeight) || (rect.bottom >= 0 && rect.bottom <= viewportHeight)); } const mutationObserver = ZMAGS_ANALYTICS_API.MUTATION_OBSERVER || new MutationObserver((mutationsList, observer) => { const mutation = mutationsList[0]; if (!mutation) return; const viewerContainer = mutation.target; const experienceId = viewerContainer.dataset.experienceId; const experienceName = ZMAGS_ANALYTICS_API.EXPERIENCE_NAME_CACHE[`${experienceId}`]; if (isElementInViewport(viewerContainer)) { setTimeout(() => { // We are not calling trackSceneChange here as per your original script }, 500); } }); if (!ZMAGS_ANALYTICS_API.MUTATION_OBSERVER) ZMAGS_ANALYTICS_API.MUTATION_OBSERVER = mutationObserver; function handleIntersection(entries) { entries.forEach(entry => { if (entry.isIntersecting) { const viewerContainer = entry.target; const experienceId = viewerContainer.dataset.experience; // We are not calling trackSceneChange here as per your original script ZMAGS_ANALYTICS_API.trackExperienceSceneView(entry.target, experienceId); } }); } const options = { root: null, rootMargin: '0px', threshold: 0 }; const observer = ZMAGS_ANALYTICS_API.INTERSECTION_OBSERVER || new IntersectionObserver(handleIntersection, options); if (!ZMAGS_ANALYTICS_API.INTERSECTION_OBSERVER) ZMAGS_ANALYTICS_API.INTERSECTION_OBSERVER = observer; setInterval(function () { ZMAGS_ANALYTICS_API.setupTracking(document, window); }, 500); } })(); })() }