// // Define the selectors to check // const selectors = ['.dyn-list-widget-product-title', '.dyn-title-text']; // // Function to transform innerText to title case // function transformText(element) { // element.innerText = element.innerText.toLowerCase().replace(/\b(\w)/g, x => x.toUpperCase()); // } // // Callback function for the MutationObserver // const observerCallback = (mutations) => { // mutations.forEach(mutation => { // if (mutation.type === 'childList') { // // Check for each selector // selectors.forEach(selector => { // const elements = mutation.target.querySelectorAll(selector); // elements.forEach(element => transformText(element)); // }); // } // }); // }; // // Create a new MutationObserver instance // const observer = new MutationObserver(observerCallback); // // Start observing the document body or a specific node // observer.observe(document.body, { childList: true, subtree: true }); // Cart Themes // function addCartThemesButtonClass() { // document.querySelectorAll('.custom-card-info-btn-js').forEach((btn) => { // btn.classList.add('cart-themes-trigger'); // }); // } // addCartThemesButtonClass(); /** * cart v2 refayth */ // old // (function () { // // // // const THEME_ID = '158144200950'; // // const THEME_ID = '159269519606'; // const THEME_ID = '159008260342'; // function getRoot() { // return document.querySelector(`[data-theme-id="${THEME_ID}"]`); // } // function getCartBottom(root) { // return root?.querySelector('#dyn-cart-bottom-section'); // } // function injectShippingHeader(root) { // const container = root.querySelector('.tieredBarContainer'); // if (!container) return; // if (!container.querySelector('.dyn-cart-shipping-status')) { // const el = document.createElement('p'); // el.className = 'dyn-cart-shipping-status'; // el.innerHTML = ` // Current Shipping Method: // Standard (Free) // `; // container.prepend(el); // } // } // function sumTieredValues(root) { // if (!root) return 0; // const aEl = root.querySelector('.dyn-tieredbar-milestone-text'); // const bEl = root.querySelector('.dyn-money-format'); // if (!aEl || !bEl) { // console.log('[SUM] Missing elements', { aEl, bEl }); // return 0; // } // const parseMoney = (val) => { // if (!val) return 0; // return parseFloat( // val // .replace(/[^0-9.-]/g, '') // remove currency symbols, commas, spaces // .trim() // ) || 0; // }; // const a = parseMoney(aEl.textContent); // const b = parseMoney(bEl.textContent); // const sum = a + b; // console.log('[SUM] Parsed:', { a, b, sum }); // return sum; // } // function injectStartLabel(root) { // const bottom = root.querySelector('.dyn-tieredbar-5-message-container'); // if (!bottom) return; // if (!bottom.querySelector('.dyn-cart-shipping-label-start')) { // const el = document.createElement('span'); // el.className = 'dyn-cart-shipping-label-start'; // el.textContent = 'Standard'; // bottom.prepend(el); // } // } // function injectFreeShippingMessage(root) { // if (!root) return; // const messageContainer = root.querySelector('.dyn-tieredbar-5-message-container'); // if (!messageContainer) return; // const moneyInvest = messageContainer.querySelector('.dyn-tieredbar-5-moneyInvest'); // if (!moneyInvest) return; // const existingEl = moneyInvest.querySelector('.dyn-tieredbar-5-all-milestone-before-achieve-message'); // const targetMessage = messageContainer.querySelector('.dyn-tieredbar-5-target-message'); // // ========================= // // ❌ CASE 1: target DOES NOT exist → REMOVE injected message // // ========================= // if (!targetMessage) { // if (existingEl) { // existingEl.remove(); // console.log('[FREE SHIPPING] removed (target missing)'); // } // return; // } // // ========================= // // ❌ CASE 2: already exists → do nothing // // ========================= // if (existingEl) { // console.log('[FREE SHIPPING] already exists'); // return; // } // // ========================= // // ✅ CASE 3: inject message // // ========================= // // const sum = sumTieredValues(messageContainer); // const el = document.createElement('p'); // el.className = 'dyn-tieredbar-5-all-milestone-before-achieve-message'; // el.textContent = `Get free shipping with purchase of $150 or more!`; // moneyInvest.insertBefore(el, moneyInvest.firstChild); // console.log('[FREE SHIPPING] injected'); // } // function injectSubtotalExtras(root) { // const cart = getCartBottom(root); // if (!cart) { // return; // } // const container = cart.querySelector('.dyn-subtotal-and-savings-section'); // if (!container) { // return; // } // const anchor = container.querySelector('.nvd-d-flex.dyn-subtotal-container'); // if (!anchor) { // return; // } // // ========================= // // 🚚 SHIPPING ROW (idempotent) // // ========================= // let shippingRow = container.querySelector('.dyn-cart-extra-shipping'); // if (!shippingRow) { // shippingRow = document.createElement('div'); // shippingRow.className = 'dyn-cart-extra-shipping'; // shippingRow.innerHTML = ` //

// Shipping (standard) //

// Calculated at checkout //

// `; // } // // ========================= // // 💰 TOTAL ROW (FIXED GUARD) // // ========================= // let totalRow = container.querySelector('.dyn-cart-extra-total'); // const priceElement = document.querySelector( // 'p.subtotal-amount span.dyn-money-format' // ); // let totalPrice; // if (priceElement) { // totalPrice = priceElement.textContent.trim(); // console.log('total price found:', totalPrice); // "$109.00" // } else { // console.log('Span with class "dyn-money-format" not found.'); // } // if (!totalRow) { // totalRow = document.createElement('div'); // totalRow.className = 'dyn-cart-extra-total'; // totalRow.innerHTML = ` //

// Estimated Total (before shipping & tax) //

// ${totalPrice} //

// `; // } // // ========================= // // 📌 FORCE ORDER (VERY IMPORTANT FIX) // // ========================= // // Always ensure correct placement order // if (shippingRow.parentNode !== container) { // anchor.insertAdjacentElement('afterend', shippingRow); // } // if (totalRow.parentNode !== container) { // shippingRow.insertAdjacentElement('afterend', totalRow); // } // } // function run() { // const root = getRoot(); // if (!root) { // return; // } // injectShippingHeader(root); // injectStartLabel(root); // injectSubtotalExtras(root); // injectFreeShippingMessage(root); // } // function observe() { // let scheduled = false; // const observer = new MutationObserver(() => { // if (scheduled) return; // scheduled = true; // requestAnimationFrame(() => { // scheduled = false; // run(); // }); // }); // observer.observe(document.body, { // childList: true, // subtree: true, // }); // } // run(); // observe(); // })(); // new (function () { const THEME_ID = '159643173110'; // ─── Config ────────────────────────────────────────────────────────────────── const FREE_SHIPPING_THRESHOLD_CENTS = 15000; // $150.00 const CART_EVENTS = [ 'dyn_cart_loaded', 'dyn_cart_changed', 'dyn_cart_add', 'dyn_cart_qty_inc', 'dyn_cart_qty_dec', 'dyn_cart_remove', ]; // ─── Shopify Money Helpers ──────────────────────────────────────────────────── function getMoneyFormat() { return (window.Shopify && window.Shopify.money_format) || '${{amount}}'; } function formatMoney(cents) { const format = getMoneyFormat(); const value = cents / 100; return format .replace('{{amount}}', value.toFixed(2)) .replace('{{amount_no_decimals}}', String(Math.round(value))) .replace('{{amount_with_comma_decimals}}', value.toFixed(2).replace('.', ',')) .replace('{{amount_no_decimals_with_space_separator}}', String(Math.round(value)).replace(/\B(?=(\d{3})+(?!\d))/g, '\u00a0')) .replace('{{amount_with_apostrophe_separator}}', value.toFixed(2).replace(/\B(?=(\d{3})+(?!\d))/g, "'")); } // ─── DOM Helpers ───────────────────────────────────────────────────────────── function getRoot() { const root = document.querySelector( '#nvd-cart[data-theme-id="' + THEME_ID + '"]' ); console.log('[getRoot]', root); return root; } /** * Only writes if the value actually changed. * * Without this guard every unconditional .textContent write is itself a DOM * mutation. The MutationObserver watching the same subtree sees it, fires * run() again, which writes again — infinite loop. With this guard the loop * terminates after at most two passes: first pass writes the new value, * second pass sees it is already correct and bails out with no write. */ function safeSetText(el, text) { if (!el) { console.log('[safeSetText] Element not found.'); return; } if (!text) { console.log('[safeSetText] Empty text, skipping.'); return; } if (el.textContent !== text) { console.log('[safeSetText] Updating text:', { old: el.textContent, new: text }); el.textContent = text; } else { console.log('[safeSetText] Text already up to date.'); } } // ─── Injectors ─────────────────────────────────────────────────────────────── function injectShippingHeader(root) { console.log('[injectShippingHeader] Started'); const container = root.querySelector('.tieredBarContainer'); console.log("root"); console.log(root); if (!container) { console.log('[injectShippingHeader] Container not found.'); return; } if (container.querySelector('.dyn-cart-shipping-status')) { console.log('[injectShippingHeader] Already injected.'); return; } console.log('[injectShippingHeader] Injecting header.'); const el = document.createElement('p'); el.className = 'dyn-cart-shipping-status'; el.innerHTML = 'Current Shipping Method: Standard (Free)'; container.prepend(el); console.log('[injectShippingHeader] Done.'); } function injectStartLabel(root) { console.log('[injectStartLabel] Started'); const container = root.querySelector('.dyn-tieredbar-5-message-container'); if (!container) { console.log('[injectStartLabel] Container not found.'); return; } if (container.querySelector('.dyn-cart-shipping-label-start')) { console.log('[injectStartLabel] Already exists.'); return; } console.log('[injectStartLabel] Injecting.'); const el = document.createElement('span'); el.className = 'dyn-cart-shipping-label-start'; el.textContent = 'Standard'; container.prepend(el); console.log('[injectStartLabel] Done.'); } function injectFreeShippingMessage(root) { const messageContainer = root.querySelector('.dyn-tieredbar-5-message-container'); console.log('[injectFreeShippingMessage] Started'); if (!messageContainer) { console.log('[injectFreeShippingMessage] Message container not found.'); return; } const moneyInvest = messageContainer.querySelector('.dyn-tieredbar-5-moneyInvest'); if (!moneyInvest) { console.log('[injectFreeShippingMessage] Money container not found.'); return; } const existingEl = moneyInvest.querySelector('.dyn-tieredbar-5-all-milestone-before-achieve-message'); const targetMessage = messageContainer.querySelector('.dyn-tieredbar-5-target-message'); if (!targetMessage) { console.log('[injectFreeShippingMessage] Target message missing.'); if (existingEl) { console.log('[injectFreeShippingMessage] Removing existing custom message.'); existingEl.remove(); } return; } if (existingEl) { console.log('[injectFreeShippingMessage] Already injected.'); return; } const el = document.createElement('p'); el.className = 'dyn-tieredbar-5-all-milestone-before-achieve-message'; el.textContent = 'Get free shipping with purchase of ' + formatMoney(FREE_SHIPPING_THRESHOLD_CENTS) + ' or more!'; console.log('[injectFreeShippingMessage] Injecting message.'); moneyInvest.insertBefore(el, moneyInvest.firstChild); console.log('[injectFreeShippingMessage] Done.'); } function injectDynamicSTLPrice(root) { const moneyEl = root.querySelector('.dyn-skip-the-line-price.dyn-money-format'); if (!moneyEl) return; const descEl = root.querySelector('.dyn-skip-the-line-description'); if (!descEl) return; // Only replace once — guard prevents re-running after placeholder is gone if (descEl.innerText.indexOf('{{price}}') === -1) return; const cleanPrice = moneyEl.innerText.trim(); if (!cleanPrice) return; descEl.innerText = descEl.innerText.replace('{{price}}', cleanPrice); } function injectSubtotalExtras(root) { const cart = root.querySelector('#dyn-cart-bottom-section'); if (!cart) return; const container = cart.querySelector('.dyn-subtotal-and-savings-section'); if (!container) return; const anchor = container.querySelector('.nvd-d-flex.dyn-subtotal-container'); if (!anchor) return; // Always read the live price from root — never document const priceEl = root.querySelector('p.subtotal-amount span.dyn-money-format'); const totalPrice = priceEl ? priceEl.textContent.trim() : ''; // ── Shipping row — static, create once ──────────────────────────────── let shippingRow = container.querySelector('.dyn-cart-extra-shipping'); if (!shippingRow) { shippingRow = document.createElement('div'); shippingRow.className = 'dyn-cart-extra-shipping'; shippingRow.innerHTML = '

Shipping (standard)

' + '

Calculated at checkout

'; } // ── Total row — create once, update price if changed ────────────────── let totalRow = container.querySelector('.dyn-cart-extra-total'); if (!totalRow) { totalRow = document.createElement('div'); totalRow.className = 'dyn-cart-extra-total'; totalRow.innerHTML = '

' + 'Estimated Total (before shipping & tax)' + '

' + '

' + totalPrice + '

'; } else { // safeSetText: only writes if price actually changed — prevents observer loop safeSetText(totalRow.querySelector('.dyn-cart-estimated-total-amount'), totalPrice); } // ── Enforce order: anchor → shippingRow → totalRow ──────────────────── if (shippingRow.parentNode !== container) { anchor.insertAdjacentElement('afterend', shippingRow); } if (totalRow.parentNode !== container) { shippingRow.insertAdjacentElement('afterend', totalRow); } } // ─── Orchestrator ───────────────────────────────────────────────────────────── function run(root) { console.log('=============================='); console.log('[RUN] Started'); if (!root) { console.log('[RUN] No root found. Aborting.'); return; } console.log('[RUN] Root found.'); injectShippingHeader(root); injectStartLabel(root); injectSubtotalExtras(root); injectFreeShippingMessage(root); injectDynamicSTLPrice(root); console.log('[RUN] Finished'); console.log('=============================='); } // ─── Observer ─── function observe() { let scheduled = false; let observingRoot = false; const observer = new MutationObserver(function () { if (scheduled) return; scheduled = true; requestAnimationFrame(function () { scheduled = false; const root = getRoot(); console.log("root"); console.log(root); if (!root) return; // Narrow scope from body → root once root is available if (!observingRoot) { observer.disconnect(); observer.observe(root, { childList: true, subtree: true }); observingRoot = true; } run(root); }); }); observer.observe(document.body, { childList: true, subtree: true }); } // ─── Cart Event Listeners ───────────────────────────────────────────────────── // Bound on window (confirmed dispatch target) — covers all cart changes // even when MutationObserver might not detect them (e.g. data-only updates). function bindCartEvents() { console.log('[Cart Events] Binding listeners.'); CART_EVENTS.forEach(function (event) { console.log('[Cart Events] Listening for:', event); window.addEventListener(event, function () { console.log('[Cart Events] Event fired:', event); run(getRoot()); }); }); } // ─── Boot ───────────────────────────────────────────────────────────────────── console.log('=============================='); console.log('[BOOT] Script initialized.'); console.log('[BOOT] Initial run.'); run(getRoot()); console.log('[BOOT] Starting observer.'); observe(); console.log('[BOOT] Binding cart events.'); bindCartEvents(); console.log('[BOOT] Ready.'); console.log('=============================='); })(); /** cart v2 end */

Collection: Shop2App: Face Serum Trio | 3 piece