// deck-slides.jsx — Vision Deck product showcases (live screens in tabbed carousels)
// Mounts a FeatureCarousel into each product slide's container.
(function () {
  const R = React, h = R.createElement;
  const S = window.SITE, CRM = window.CRM, AP = window.APPS, PAD = window.APPS_IPAD;
  const { WebFrame, FeatureCarousel } = window.DECKMOCKS;

  // helpers to build screen entries
  const web = (label, el, opts = {}) => {
    const vw = opts.vw || 1280, vh = opts.vh || 900;
    return { label, w: vw, h: vh + 40, el: h(WebFrame, { url: opts.url || 'primeways.co.uk', vw, vh }, el) };
  };
  const phone = (label, el) => ({ label, w: 402, h: 874, el });
  const crm = (label, el) => ({ label, w: 1340, h: 952, el });
  const pad = (label, comp) => ({ label, w: PAD.PADW + 30, h: PAD.PADH + 30, el: h(PAD.IPadDevice, null, h(comp)) });

  /* ---------------- WEBSITE ---------------- */
  const WEBSITE = [
    web('Homepage', h(S.Home), { vh: 920 }),
    web('Services', h(S.Services), { vh: 900, url: 'primeways.co.uk/services' }),
    web('Service Page', h(S.ServiceDetail), { vh: 900, url: 'primeways.co.uk/tarmac' }),
    web('AI Visualiser', h(S.Visualiser), { vh: 880, url: 'primeways.co.uk/visualiser' }),
    web('Build a Quote', h(S.QuoteBuilder), { vw: 980, vh: 720, url: 'primeways.co.uk/quote' }),
    web('Driveway Quiz', h(S.Quiz), { vh: 900, url: 'primeways.co.uk/find-your-driveway' }),
    web('Project Gallery', h(S.Gallery), { vh: 900, url: 'primeways.co.uk/gallery' }),
    web('Cost Guide', h(S.CostGuide), { vh: 900, url: 'primeways.co.uk/cost-guide' }),
    web('Reviews', h(S.Reviews), { vh: 900, url: 'primeways.co.uk/reviews' }),
    web('Contact', h(S.Contact), { vh: 900, url: 'primeways.co.uk/contact' }),
    phone('Mobile Site', h(IOSDevice, { width: 402, height: 874 }, h(S.MobileHome))),
  ];

  /* ---------------- CRM ---------------- */
  const CRMSCREENS = [
    crm('Dashboard', h(CRM.Dashboard)),
    crm('Lead Pipeline', h(CRM.Pipeline)),
    crm('Lead Detail', h(CRM.LeadDetail)),
    crm('Customer', h(CRM.Customer)),
    crm('Job Record', h(CRM.JobRecord)),
    crm('Photo Vault', h(CRM.PhotoVault)),
    crm('Quote Builder', h(CRM.QuoteBuilder)),
    crm('Follow-Up', h(CRM.FollowUp)),
    crm('Calendar', h(CRM.Calendar)),
    crm('Missed Call', h(CRM.MissedCall)),
    crm('Review Engine', h(CRM.ReviewAuto)),
    crm('AI Social', h(CRM.SocialGen)),
    crm('Settings', h(CRM.Settings)),
  ];

  /* ---------------- BUSINESS APP (phone) ---------------- */
  const BIZPHONE = [
    phone('Today', h(AP.biz.Home)),
    phone('Lead Inbox', h(AP.biz.Leads)),
    phone('Site Visit', h(AP.biz.SiteVisit)),
    phone('Job Photos', h(AP.biz.PhotoCapture)),
    phone('Checklist', h(AP.biz.Checklist)),
    phone('Messages', h(AP.biz.Messaging)),
    phone('Schedule', h(AP.biz.Schedule)),
    phone('AI Assistant', h(AP.biz.Assistant)),
    phone('Alerts', h(AP.biz.Notifications)),
    phone('Offline', h(AP.biz.Offline)),
  ];

  /* ---------------- BUSINESS APP (iPad) ---------------- */
  const BIZPAD = [
    pad('Dashboard', PAD.Dashboard),
    pad('Lead Inbox', PAD.Leads),
    pad('Site Visit', PAD.SiteVisit),
    pad('Schedule', PAD.Schedule),
  ];

  /* ---------------- CUSTOMER APP ---------------- */
  const CUST = [
    phone('Welcome', h(AP.cust.Welcome)),
    phone('Visualiser', h(AP.cust.Visualiser)),
    phone('Planner Quiz', h(AP.cust.Quiz)),
    phone('Request Quote', h(AP.cust.RequestQuote)),
    phone('My Project', h(AP.cust.MyProject)),
    phone('Timeline', h(AP.cust.Timeline)),
    phone('Documents', h(AP.cust.Documents)),
    phone('Messages', h(AP.cust.Messages)),
    phone('Aftercare', h(AP.cust.Aftercare)),
    phone('Refer', h(AP.cust.ReviewReferral)),
  ];

  const SLIDES = {
    'mount-website': {
      eyebrow: 'Part 01 · The Website', flip: false, onDark: false,
      title: 'A shopfront that sells while you sleep',
      lead: 'Your next customer is already searching. The new site meets them with real project photography, instant trust, and a guided path straight to a quote — so they call you first, not the firm down the road.',
      bullets: [['AI driveway visualiser', '— customers see their own home transformed before they enquire.'], ['Build-your-quote flow', '— capture quote-ready leads with all the detail you need.'], ['Project gallery & reviews', '— 20 years of craft, proving itself on every page.']],
      benefit: 'Turn curious browsers into booked quotes — 24 hours a day.',
      screens: WEBSITE,
    },
    'mount-crm': {
      eyebrow: 'Part 02 · The Command Centre', flip: true, onDark: false,
      title: 'Never lose another lead',
      lead: 'One screen for the whole business. Every enquiry from the website, every call, every quote and every job — lined up, tracked and chased automatically. You\u2019ll win more of the work you\u2019re already quoting for.',
      bullets: [['Lead pipeline', '— see exactly where every job stands, at a glance.'], ['Smart quote builder', '— polished, branded quotes out the door in minutes.'], ['Auto follow-up & missed-call text-back', '— no lead ever goes cold.']],
      benefit: 'Win more jobs from the leads you already get.',
      screens: CRMSCREENS,
    },
    'mount-bizphone': {
      eyebrow: 'Part 03 · Primeways Pro', flip: false, onDark: true,
      title: 'Run every job from the van',
      lead: 'The whole operation in your pocket. Take a new lead at the kerbside, run a site visit, snap before-and-after photos straight to the job, and tick off the checklist — all without a scrap of paper.',
      bullets: [['Site-visit mode', '— measurements, notes and photos in one tap.'], ['Job photo capture', '— every shot filed to the right customer, ready for marketing.'], ['Schedule & checklists', '— the team always knows what\u2019s next.']],
      benefit: 'Less paperwork. More driveways.',
      screens: BIZPHONE,
    },
    'mount-bizpad': {
      eyebrow: 'Part 03 · Primeways Pro · On iPad', flip: true, onDark: true,
      title: 'Win the job on the driveway',
      lead: 'The iPad rides with you to every quote. Sit at the kitchen table or stand on the drive, take your measurements and notes, snap the photos, and turn the screen round to show the customer their finished driveway in the visualiser — then build and send the quote before you leave.',
      bullets: [['Site-visit notes', '\u2014 measurements, photos and notes captured on the spot, no clipboard.'], ['Show, don\u2019t tell', '\u2014 walk them through their driveway design on a big, confident screen.'], ['Quote before you leave', '\u2014 a polished, branded quote built and sent from the doorstep.']],
      benefit: 'Win it on the doorstep — not three days later.',
      screens: BIZPAD,
    },
    'mount-cust': {
      eyebrow: 'Part 04 · The Customer App', flip: true, onDark: false,
      title: 'An experience they\u2019ll tell their neighbours about',
      lead: 'From first idea to finished drive, customers feel looked after the whole way. They design their driveway, watch the project progress in real time, and get aftercare reminders — the kind of service that turns one job into three.',
      bullets: [['Driveway visualiser', '— they picture the finished result on their own home.'], ['Live project timeline', '— no \u201cwhen are you starting?\u201d calls, ever.'], ['Aftercare & referrals', '— happy customers who send you their friends.']],
      benefit: 'Happy customers who come back — and bring others.',
      screens: CUST,
    },
  };

  function mountAll() {
    Object.keys(SLIDES).forEach((id) => {
      const node = document.getElementById(id);
      if (!node) return;
      ReactDOM.createRoot(node).render(h(FeatureCarousel, SLIDES[id]));
    });
  }

  window.DECKSLIDES = { mountAll, SLIDES };
})();
