/* global React */ const { useState, useEffect } = React; /* ============================================================ Shared chrome ============================================================ */ window.Nav = function Nav({ route, setRoute }) { const [open, setOpen] = useState(false); const TOOL_ROUTES = ['revscout-s', 'revtoolbox', 'emi', 'revfield', 'revsizer', 'optimize']; const toolLinks = [ { id: 'revscout-s', label: 'RevScout S', sub: 'Fruit count + size camera', badge: 'NEW' }, { id: 'revtoolbox', label: 'RevToolbox', sub: 'Data portal + satellite vigour' }, { id: 'emi', label: 'EMI Soil Scanning', sub: 'Soil conductivity at 3 depths' }, { id: 'revfield', label: 'RevField', sub: 'Pest & disease scouting' }, { id: 'revsizer', label: 'Rev-Sizer', sub: 'Hand-held caliper' }, { id: 'optimize', label: 'Precision Go-to Guide', sub: 'Putting the layers to work' }, ]; const toolActive = TOOL_ROUTES.includes(route); const [toolsOpen, setToolsOpen] = useState(false); const toolsRef = React.useRef(null); useEffect(() => { if (!toolsOpen) return; const onDoc = (e) => { if (toolsRef.current && !toolsRef.current.contains(e.target)) setToolsOpen(false); }; const onKey = (e) => { if (e.key === 'Escape') setToolsOpen(false); }; document.addEventListener('mousedown', onDoc); document.addEventListener('keydown', onKey); return () => { document.removeEventListener('mousedown', onDoc); document.removeEventListener('keydown', onKey); }; }, [toolsOpen]); useEffect(() => { setToolsOpen(false); }, [route]); const links = [ { id: 'home', label: 'Home' }, { id: 'pricing', label: 'Pricing' }, { id: 'contact', label: 'Contact' }, ]; // Close drawer on route change useEffect(() => { setOpen(false); }, [route]); // Lock body scroll when drawer open useEffect(() => { document.body.style.overflow = open ? 'hidden' : ''; return () => { document.body.style.overflow = ''; }; }, [open]); const go = (id) => (e) => { e.preventDefault(); setRoute(id); }; return ( ); }; window.Footer = function Footer({ setRoute }) { return ( ); }; /* ============================================================ HOME ============================================================ */ /* ============================================================ RevScoutHub — hub & spoke flow showing RevScout S at center, inputs feeding in from the left, outputs flowing to the right. ============================================================ */ window.RevScoutHub = function RevScoutHub({ setRoute }) { const hubRef = React.useRef(null); const progress = window.useScrollProgress(hubRef, { start: 0.15, end: 0.55 }); // Each spoke draws sequentially: 6 spokes share progress. const spokeP = (idx) => Math.max(0, Math.min(1, (progress * 6) - idx)); const inputs = [ { key: 'EMI', title: 'EMI soil scanning', copy: 'Underlying variation map. Where problems live.', viz:
, route: 'emi', color: 'var(--data-soil)' }, { key: 'SATELLITE', title: 'Canopy vigour mapping', copy: '4 yrs of NDVI at 10 m. 80 cm on demand.', viz:
, route: 'revtoolbox', color: 'var(--data-canopy)' }, { key: 'REVSCOUT', title: 'Fruit load mapping', copy: 'AI camera counts every fruit on every tree.', viz:
, route: 'revscout-s', color: 'var(--lime)' }, ]; const outputs = [ { key: 'REVSCOUT', title: 'Fruit size mapping', copy: 'Diameter measured per fruit, mapped to GPS.', viz:
, route: 'revsizer', color: 'var(--lime)' }, { key: 'GROWTH', title: 'Fruit size prediction', copy: 'Growth curves predict harvest sizes into your packhouse bins.', viz:
, route: 'revsizer', color: 'var(--data-yield)' }, { key: 'VRA', title: 'Variable rate application', copy: 'Export prescription files straight to your spreader or sprayer.', viz:
, route: 'revtoolbox', color: 'var(--data-vra)' }, ]; const Spoke = ({ side, items }) => (
{items.map((it, i) => { const handleKey = (e) => { if (e.key === 'Enter' || e.key === ' ') { e.preventDefault(); setRoute(it.route); } }; return (
setRoute(it.route)} onKeyDown={handleKey} tabIndex={0} role="button" aria-label={`${it.title} — ${it.copy}`} style={{ background: 'var(--paper)', border: '1px solid var(--line)', borderLeft: side === 'right' ? `3px solid ${it.color}` : '1px solid var(--line)', borderRight: side === 'left' ? `3px solid ${it.color}` : '1px solid var(--line)', borderRadius: 'var(--radius-lg)', padding: 14, display: 'grid', gridTemplateColumns: side === 'left' ? '1fr 76px' : '76px 1fr', gap: 14, alignItems: 'center', cursor: 'pointer', textAlign: side === 'left' ? 'right' : 'left', transition: 'transform 0.18s, box-shadow 0.18s', }} onMouseEnter={e => { e.currentTarget.style.transform = 'translateX(' + (side === 'left' ? '4px' : '-4px') + ')'; e.currentTarget.style.boxShadow = `0 8px 24px -10px ${it.color}55`; }} onMouseLeave={e => { e.currentTarget.style.transform = 'translateX(0)'; e.currentTarget.style.boxShadow = 'none'; }} > {side === 'right' && (
{it.viz}
)}
{side === 'left' ? '→ FEEDS IN' : 'FLOWS OUT →'} · {it.key}

{it.title}

{it.copy}

{side === 'left' && (
{it.viz}
)}
);})}
); return (
{/* Center node */}
setRoute('revscout-s')} onKeyDown={e => { if (e.key === 'Enter' || e.key === ' ') { e.preventDefault(); setRoute('revscout-s'); } }} tabIndex={0} role="button" aria-label="RevScout S — the centerpiece" style={{ aspectRatio: '1 / 1', maxWidth: 380, margin: '0 auto', width: '100%', borderRadius: '50%', background: 'radial-gradient(circle at 50% 40%, #243027 0%, #14181a 70%)', color: 'white', padding: 28, display: 'flex', flexDirection: 'column', justifyContent: 'center', alignItems: 'center', textAlign: 'center', cursor: 'pointer', position: 'relative', boxShadow: '0 0 0 1px rgba(184,220,115,0.25), 0 24px 64px rgba(28,65,0,0.28), 0 0 80px -20px rgba(184,220,115,0.45)', overflow: 'hidden', }}>
); }; window.HomePage = function HomePage({ setRoute }) { // Reveal fallback — guarantees [data-reveal] content appears on scroll even // in environments where IntersectionObserver callbacks aren't delivered. useEffect(() => { const reveal = () => { const vh = window.innerHeight || 800; document.querySelectorAll('[data-reveal]:not(.is-revealed)').forEach(el => { if (el.getBoundingClientRect().top < vh * 0.92) el.classList.add('is-revealed'); }); }; reveal(); window.addEventListener('scroll', reveal, { passive: true }); window.addEventListener('resize', reveal); const t = setTimeout(reveal, 200); return () => { window.removeEventListener('scroll', reveal); window.removeEventListener('resize', reveal); clearTimeout(t); }; }, []); const layers = [ { n: '01', phase: 'SOIL', tool: 'emi', toolLabel: 'EMI Soil Scanning', ramp: 'linear-gradient(90deg,#FFF7EC,#F6C68A,#E08A3C,#B5651D,#6B3410)', title: 'Where the variation begins.', copy: 'Electromagnetic induction maps soil conductivity at three depths — 25, 50 and 90 cm. Clay, moisture and structure, the ground every root has to work with, mapped before a single tree is judged.', meta: 'Soil EC · 8 zones · 18.9–22.8 mS/m', img: 'assets/home-block-ec.png', alt: 'Soil EC zone map of the block — orange conductivity ramp, eight zones over the orchard footprint', }, { n: '02', phase: 'CANOPY', tool: 'revtoolbox', toolLabel: 'RevToolbox & Satellite', ramp: 'linear-gradient(90deg,#F2F8EC,#B7D89A,#6FA84C,#2F7A2E,#14532D)', title: 'How each tree responds.', copy: 'Canopy vigour every few days across the whole season — the green morph you just watched fill in. Four years of NDVI history at 10 m, sharpened to 0.5 m on demand — the same block, read from above.', meta: 'Canopy NDVI · 8 zones · 0.33–0.59 idx', img: 'assets/home-block-vigour.png', alt: 'Canopy vigour zone map of the same block — green NDVI ramp, eight zones', }, { n: '03', phase: 'FRUIT SIZE', tool: 'revscout-s', toolLabel: 'RevScout S', ramp: 'linear-gradient(90deg,#A50026,#F46D43,#FEE08B,#A6D96A,#1A9850)', title: 'How big the fruit runs.', copy: 'RevScout S stereo-sizes every fruit on every tree as it drives the row. Mean diameter lands per tree, mapped straight to GPS — the same ground again, now in millimetres.', meta: 'Mean diameter · 8 zones · 57–65 mm', img: 'assets/home-block-fruitsize.png', alt: 'Fruit size zone map of the same block — eight zones, 57 to 65 mm', }, { n: '04', phase: 'YIELD', tool: 'revscout-s', toolLabel: 'RevScout S', ramp: 'linear-gradient(90deg,#A50026,#F46D43,#FEE08B,#A6D96A,#1A9850)', title: 'What it pays out.', copy: 'Count times size becomes modelled yield, mapped tree by tree — the top of the stack. This is where the soil signal at the very bottom finally shows its return.', meta: 'Modelled yield · 8 zones · 65–152', img: 'assets/home-block-yield.png', alt: 'Yield zone map of the same block — red-to-green ramp, eight zones', }, ]; return ( <> {/* ===== 3D scroll hero — "The Living Block" soil-to-fruit reveal of Block 110 (v3) ===== */} {/* ===== Thesis — frames what the hero just showed ===== */}
What you just watched

One block, read from the soil up.

Block 110 is a single orchard block, scanned the way we scan every block: the soil beneath it, the canopy growing over a season, the fruit it finally carries. Layer by layer of the same ground — measured, aligned, and stacked into one decision.

5×5 mSoil EC resolution
every 5 daysCanopy NDVI cadence
per treeFruit count & size
one portalAll the way to the spreader
{/* ===== The layers — same block, every read ===== */}
Every layer · one block

The same ground, read four ways.

{layers.map((L, i) => (
LAYER {L.n} · {L.phase}

{L.title}

{L.copy}

))} {/* Fruit-size forecast — the golden thread closes on a prediction */}
THE FORECAST · FRUIT SIZE OVER TIME

And where it's all heading.

Weekly caliper and camera readings on the same block build a growth curve per season. Plotted on days-after-bloom, this season sits against last — and the dashed projection lands a final harvest size weeks before the pick.

{/* ===== The platform — how the layers converge ===== */}
The platform

Three layers, one portal.

Soil, canopy and fruit don't live in three apps. They converge in RevToolbox — with RevScout S at the centre — and come out the other side as a prescription file your spreader runs, tree by tree.

{/* ===== Outcome — variable-rate from the stack ===== */}
The outcome

Work precisely, from the ground up.

APPLICATION · VARIABLE RATE

Nitrogen by tree, not by block

The same stack you watched build becomes a prescription map. Vigorous trees get less, weak trees get more — the spreader follows it row by row, and the block evens out by next season.

AVG REDUCTION−18% N use
YIELD UNIFORMITY+24%
{/* ===== CTA ===== */}

Want to see your blocks like this?

Book a 30-minute walk-through with one of our agronomists. We'll load your farm into RevToolbox and read it back to you — soil, canopy and fruit, layer by layer.

); };