/* global React */ const { useState, useEffect, useRef, useCallback } = React; window.RES = (id, path) => (window.__resources && window.__resources[id]) ? window.__resources[id] : path; /* ---------------- Icons ---------------- */ const I = { play: (p) => , pause: (p) => , replay: (p) => , vol: (p) => , mute: (p) => , cc: (p) => , expand: (p) => , check: (p) => , x: (p) => , arrow: (p) => , user: (p) => , film: (p) => , bolt: (p) => , shield: (p) => , cal: (p) => , }; window.I = I; /* ---------------- helpers ---------------- */ const easeOut = (x) => 1 - Math.pow(1 - x, 3); function countUp(t, target, dur = 1.4) { if (t >= dur) return target; return target * easeOut(Math.max(0, t) / dur); } function fmtTime(s) { s = Math.max(0, Math.floor(s)); const m = Math.floor(s / 60), ss = s % 60; return m + ':' + String(ss).padStart(2, '0'); } /* ---------------- scene factory for steps ---------------- */ function StepScene({ num, title, bullets }) { return (
{num}
STEP {num}

{title}

); } /* ---------------- client logos (real, from the deck) ---------------- */ const LOGOS = [ ['skyview', 'Sky View Trading'], ['tuftneedle', 'Tuft & Needle'], ['proctorgallagher', 'Proctor Gallagher Institute'], ['groovefunnels', 'GrooveFunnels'], ['passionio', 'Passion.io'], ['lendi', 'Lendi'], ['ereleases', 'eReleases'], ['alliancesolar', 'Alliance Solar'], ['warriorbabe', 'WarriorBabe'], ['conway', 'Conway Consulting'], ['clickfunnels', 'ClickFunnels'], ['xeroshoes', 'Xero Shoes'], ['bodylastics', 'Bodylastics'], ['snow', 'SNOW'], ['covideo', 'Covideo'], ['closersio', 'Closers.io'], ]; window.LOGOS = LOGOS; /* ---------------- SCENES ---------------- */ const SCENES = [ { dur: 5, cap: "Done For You Ads Management - the same system behind thousands of client wins.", el: () => (
Done For You

Ads Management

Value-Driven Video Marketing - Run, Optimized & Scaled For You
)}, { dur: 6, cap: "It's the same system we've implemented for 3,000+ businesses to scale their leads & sales.", el: (t) => (
The Proven System
{Math.round(countUp(t, 3000)).toLocaleString()}+

Businesses Scaled
Their Leads & Sales

)}, { dur: 6, cap: "Companies we've helped grow - across coaching, e-commerce, and high-ticket services.", el: () => { const show = LOGOS.slice(0, 8); return (

Companies We've Helped Grow

{show.map((l, i) => (
{l[1]}
))}
); }}, { dur: 6, cap: "We also used this exact strategy to scale our own company onto the Inc. 5000.", el: (t) => { const tiles = [ { n: Math.round(countUp(t, 9)), s: '+', l: 'Figures Generated For Clients' }, { n: Math.round(countUp(t, 60)), s: '', l: 'Fastest-Growing in America (Inc. 5000)' }, { n: Math.round(countUp(t, 8)), s: '-Fig', l: 'Company We Scaled With This System' }, ]; return (
We Used It On Ourselves Too

Proven At Scale

{tiles.map((m, i) => (
{m.n}{m.s}
{m.l}
))}
); }}, { dur: 6, cap: "We've spent over $7.7 million on our own video ads - so we know exactly what works.", el: (t) => (
Battle-Tested Ad Spend
${countUp(t, 7.7).toFixed(1)}M

Spent On Our Own Video Ads

We don't guess. We deploy what's already working.
)}, { dur: 7, cap: "Led by Aleric Heck - Founder & CEO, video marketing expert, and author of 'Video Authority.'", el: () => (
Aleric Heck
Led By
Aleric Heck
)}, { dur: 5.5, cap: "Step 1 - we build your custom marketing game plan with a deep-dive audit.", el: () => }, { dur: 5.5, cap: "Step 2 - we script your video ads and generate AI ad creative with our software.", el: () => }, { dur: 5.5, cap: "Step 3 - your strategist sets up and launches your ads on YouTube and Meta.", el: () => }, { dur: 5.5, cap: "Step 4 - we run, optimize, and scale your ads for you, fully done for you.", el: () => }, { dur: 5.5, cap: "Plus a bonus - 1-on-1 organic content consulting to compound your growth.", el: () => (
★
BONUS

Organic Content Consulting

    {['1-on-1 Organic Content Consulting (1-1 Meetings)', 'Dedicated Organic Content Strategist', 'AI-Powered Data Analysis & Content Scripts'].map((b, i) => (
  • {b}
    • ))}
)}, { dur: 5, cap: "All designed to help you hit your goals - while you focus on running your business.", el: () => (
🚀

Designed To Help You
Achieve Your Goals

Focus on your business while we attract new leads & clients.
)}, { dur: 8, cap: "Most agencies don't specialize in video, lock you into long contracts, or skip organic. We're different.", el: () => (

Why We're Different

Most Agencies
    {['No video marketing focus', 'Only one platform (Meta)', "Don't support organic content", '6-12 month contracts'].map((x, i) => (
  • {x}
    • ))}
AdOutreach
    {['Specialize in video marketing', 'YouTube Ads + Meta Ads', '1-on-1 organic consulting included', 'Month-to-month - no lock-in'].map((x, i) => (
  • {x}
    • ))}
)}, { dur: 6, cap: "Here's everything you get - four done-for-you steps plus organic consulting.", el: () => (
Everything You Get

Done For You Ads Management

    {[['Marketing Game Plan & Strategy', 'STEP 1'], ['Video Ad Scripting & Content Plan', 'STEP 2'], ['Done For You Ads Setup & Launch', 'STEP 3'], ['DFY Management + Organic Consulting', 'STEP 4']].map((r, i) => (
  • {r[0]} {r[1]}
    • ))}
)}, { dur: 5, cap: "Spots are limited. If you're ready to scale, apply now.", el: () => (
Spots Are Limited

Apply Now

Let's build your done-for-you ad engine - together.
)}, ]; // cumulative timing const TIMINGS = (() => { let acc = 0; const arr = SCENES.map(s => { const start = acc; acc += s.dur; return { start, end: acc, dur: s.dur }; }); return { arr, total: acc }; })(); const TOTAL = TIMINGS.total; const YT_ID = 'yp6kebcC4JM'; const YT_DURATION = '7:25'; /* ---------------- Player ---------------- */ function VSLPlayer({ videoMode = 'animated', captionsDefault = true, onApply }) { const STORE = 'dfy_vsl_time_v1'; const [ytStarted, setYtStarted] = useState(false); const [elapsed, setElapsed] = useState(() => { const v = parseFloat(localStorage.getItem(STORE) || '0'); return isNaN(v) ? 0 : Math.min(v, TOTAL - 0.05); }); const [playing, setPlaying] = useState(false); const [started, setStarted] = useState(() => parseFloat(localStorage.getItem(STORE) || '0') > 0.1); const [captions, setCaptions] = useState(captionsDefault); const [muted, setMuted] = useState(false); const [rate, setRate] = useState(1); const [scrubbing, setScrubbing] = useState(false); const rafRef = useRef(0); const lastRef = useRef(0); const elapsedRef = useRef(elapsed); const rateRef = useRef(rate); elapsedRef.current = elapsed; rateRef.current = rate; useEffect(() => { setCaptions(captionsDefault); }, [captionsDefault]); // rAF playback loop useEffect(() => { if (!playing) return; lastRef.current = performance.now(); const tick = (now) => { const dt = (now - lastRef.current) / 1000; lastRef.current = now; let next = elapsedRef.current + dt * rateRef.current; if (next >= TOTAL) { next = TOTAL; setElapsed(next); setPlaying(false); return; } setElapsed(next); rafRef.current = requestAnimationFrame(tick); }; rafRef.current = requestAnimationFrame(tick); return () => cancelAnimationFrame(rafRef.current); }, [playing]); // persist useEffect(() => { const id = setTimeout(() => localStorage.setItem(STORE, String(elapsed)), 250); return () => clearTimeout(id); }, [elapsed]); const ended = elapsed >= TOTAL - 0.02; const sceneIdx = (() => { for (let i = 0; i < TIMINGS.arr.length; i++) if (elapsed < TIMINGS.arr[i].end) return i; return TIMINGS.arr.length - 1; })(); const sceneT = elapsed - TIMINGS.arr[sceneIdx].start; const start = useCallback(() => { if (ended) { setElapsed(0); } setStarted(true); setPlaying(true); }, [ended]); const toggle = useCallback(() => { if (!started) return start(); if (ended) { setElapsed(0); setPlaying(true); return; } setPlaying(p => !p); }, [started, ended, start]); // scrubbing const trackRef = useRef(null); const seekFromEvent = useCallback((clientX) => { const el = trackRef.current; if (!el) return; const r = el.getBoundingClientRect(); const ratio = Math.min(1, Math.max(0, (clientX - r.left) / r.width)); setElapsed(ratio * TOTAL); setStarted(true); }, []); const onScrubDown = (e) => { setScrubbing(true); seekFromEvent(e.clientX); }; useEffect(() => { if (!scrubbing) return; const mv = (e) => seekFromEvent(e.clientX); const up = () => setScrubbing(false); window.addEventListener('pointermove', mv); window.addEventListener('pointerup', up); return () => { window.removeEventListener('pointermove', mv); window.removeEventListener('pointerup', up); }; }, [scrubbing, seekFromEvent]); const cycleRate = () => setRate(r => (r === 1 ? 1.25 : r === 1.25 ? 1.5 : r === 1.5 ? 2 : 1)); const pct = (elapsed / TOTAL) * 100; const Scene = SCENES[sceneIdx].el; return (
{videoMode === 'youtube' ? ( ytStarted ? (