'+hintText+'

'; pf.appendChild(ol); // Tap/click opens modal // On mobile the horizontal scroll container eats click events, so we // detect taps via touchstart/touchend and call preventDefault to stop // the ghost click from double-firing. var _tx, _ty; pf.addEventListener('touchstart', function(e){ _tx = e.touches[0].clientX; _ty = e.touches[0].clientY; }, {passive:true}); pf.addEventListener('touchend', function(e){ var dx = Math.abs(e.changedTouches[0].clientX - _tx); var dy = Math.abs(e.changedTouches[0].clientY - _ty); if(dx < 10 && dy < 10){ e.preventDefault(); openModal(ad); } }); pf.addEventListener('click', function(){ openModal(ad); }); } if(frameObserver) frameObserver.observe(pf); return pf; } // Passive, always-on auto-scrolling creative marquee (not clickable, not // draggable). Two identical sets (A+B) sit back to back; once we scroll // past set A's width we silently jump back by that width, so the loop // reads as endless. function initCreativeMarquee(){ // Transform-based (not scrollLeft-based) so it moves reliably on every // browser/device, including iOS Safari, regardless of the wrapper's // overflow setting. var track = document.getElementById('creativeMarqueeTrack'); var setA = document.getElementById('creativeSetA'); if(!track || !setA) return; var speed = 0.55; // px per frame var pos = 0; function loopWidth(){ return setA.scrollWidth + 14; } // + track gap function tick(){ pos += speed; var w = loopWidth(); if(pos >= w) pos -= w; track.style.transform = 'translateX(' + (-pos) + 'px)'; requestAnimationFrame(tick); } requestAnimationFrame(tick); } // Niche lookup (sourced from Framer CMS) var nicheMap = { 'Baybella': 'Skincare & Beauty', 'Isle of Wild': 'Fashion & Apparel', 'Vanilla Shore': 'Jewellery & Accessories', 'High Roller Society': 'Giveaways & Competitions', 'Suswar': 'Fashion & Apparel', 'A Life Plus': 'Food & Beverages', 'Euphorium Store': 'Fashion & Apparel', 'SDF Australia': 'Fashion & Apparel', 'Sunpure Superfoods': 'Supplements', 'Purrlys': 'Pets', 'We Love Acne': 'Skincare & Beauty', 'Kingdom of Strength': 'Fashion & Apparel', 'Sage Pig Collection': 'Health & Wellness', 'DryStep': 'Fashion & Apparel', 'Harmoni Rituals': 'Food & Beverage', 'Spot Free Rinse': 'Automotive', 'DAUS The Label': 'Fashion & Apparel', 'Skinformé': 'Skincare & Beauty', 'The Skinformé Academy': 'Education & Training', 'Rustic Vibes Furniture': 'Home & Living', 'Calan Collective': 'Fashion & Apparel', 'Nasiba': 'Fashion & Apparel', 'Moonface Clothing': 'Fashion & Apparel', 'House of Lacuna': 'Fashion & Apparel', 'Cērra Candles': 'Home & Living', 'Naughty Naturopath Mum': 'Health & Wellness', 'Pure NMN': 'Supplements' }; // Show 6 skeleton cards while fetching var PAGE = 3; // desktop row size: cards always render in complete rows of 3 var INITIAL = 6; // rows shown before Show More var STEP = 6; // cards revealed per Show More click // Case studies are shown in a fixed, hand-picked order so the widest // spread of industries appears as early as possible (most people only // read the first few). A Life Plus, Isle of Wild and Vanilla Shore lead // (Food & Beverages / Fashion / Jewellery), then each following group of // three keeps repeats of the same niche (there are more apparel brands // than any other niche) as far apart as possible. var caseOrder = [ 'A Life Plus', 'Harmoni Rituals', 'Baybella', 'Isle of Wild', 'Vanilla Shore', 'Purrlys', 'Sunpure Superfoods', 'Kingdom of Strength', 'We Love Acne', 'Sage Pig Collection', 'Euphorium Store', 'High Roller Society', 'SDF Australia', 'Suswar', 'Spot Free Rinse', 'DAUS The Label', 'Skinformé', 'The Skinformé Academy', 'Rustic Vibes Furniture', 'Calan Collective', 'Nasiba', 'Moonface Clothing', 'House of Lacuna', 'Cērra Candles', 'Naughty Naturopath Mum', 'Pure NMN' ]; function sortByCaseOrder(docs){ function norm(n){ return (n||'').replace(/\u00ae|\u2122/g,'').trim(); } return docs.slice().sort(function(a,b){ var ia = caseOrder.indexOf(norm(a.brandName)); if(ia === -1) ia = caseOrder.length; var ib = caseOrder.indexOf(norm(b.brandName)); if(ib === -1) ib = caseOrder.length; return ia - ib; }); } var skeletons = []; for(var s=0;s' +'

' +'

'; grid.appendChild(sk); skeletons.push(sk); } fetch(url) .then(function(r){ return r.json(); }) .then(function(data){ // Remove skeletons skeletons.forEach(function(sk){ if(sk.parentNode) sk.parentNode.removeChild(sk); }); var docs = sortByCaseOrder(data.result || []); var setA = document.getElementById("creativeSetA"); var setB = document.getElementById("creativeSetB"); if(setA && setB){ // One ad per brand (not deduped by niche) so every brand we have // creative for shows up in the top carousel. All top-carousel // clips are video (Josh's call), and served from our own // pre-compressed local copies (assets/creative-teasers/{slug}.mp4) // instead of the full-size Sanity CDN originals - since these // frames never open up large, a small heavily-compressed local // file looks identical here but loads far faster and doesn't // depend on Sanity's CDN response time. var teaserAds = []; docs.forEach(function(doc){ if(!doc.brandName) return; var slug = doc.brandName.replace(/\s+/g,'-').toLowerCase(); teaserAds.push({ mediaType:'video', localSrc:'https://growth.ecomrepublic.com/assets/creative-teasers/'+slug+'.mp4' }); }); // Build set A for real (lazy-loaded via the observer below), then // mirror each frame into set B by cloning the DOM node once its // media has actually loaded. The clone reuses the already-resolved // /

Proof that earnsits place in the plan.

Proof that earns
its place in the plan.