// site.jsx — Shared chrome: Nav, Footer, MarqueeBar, MascotStamp, QuickQuote, reveal hook const { useState, useEffect, useRef } = React; // Current page detection from const CURRENT = document.body.getAttribute('data-page') || 'accueil'; const NAV = [ { key: 'accueil', label: t('Accueil'), href: 'Les Bras Cassés.html' }, { key: 'formules', label: t('Formules'), href: 'Formules.html' }, { key: 'france', label: t('En France'), mega: 'france' }, { key: 'international', label: t('International'), mega: 'intl' }, { key: 'stockage', label: t('Stockage'), href: 'Stockage.html' }, { key: 'mutation', label: t('Mutation professionnelle'), dropdown: [ { label: t("Je suis un salarié"), href: "Mutations.html" }, { label: t("Je suis un militaire"), href: "Militaire.html" }, { label: t("Je suis une entreprise"), href: "Entreprise.html" }] }, { key: 'apropos', label: t('À propos'), href: 'Apropos.html' }]; // Mega-menu content for "En France" and "International" const MEGA = { france: { eyebrow: t("Déménagement en France"), title: t("De la Côte d'Azur\nà tout l'Hexagone."), blurb: t("Implantés à Nice, on déménage dans toute la région et partout en France — même équipe, même soin, du studio au grand volume."), cta: { label: t("Devis longue distance"), href: "Devis.html" }, columns: [ { title: t("Côte d'Azur"), links: [ ["Nice", "Demenagement-Nice.html"], ["Cannes", "Demenagement-Cannes.html"], ["Antibes", "Demenagement-Antibes.html"], ["Monaco", "Demenagement-Monaco.html"], ["Menton", "Demenagement-Menton.html"], ["Grasse", "Demenagement-Grasse.html"], ["Cagnes-sur-Mer", "Demenagement-Cagnes-sur-Mer.html"], ["Le Cannet", "Demenagement-Le-Cannet.html"], ["Saint-Laurent-du-Var", "Demenagement-Saint-Laurent-du-Var.html"], ["Mandelieu", "Demenagement-Mandelieu.html"]] }, { title: t("Longue distance"), links: [ ["Nice → Paris", "Demenagement-Nice-Paris.html"], ["Nice → Lyon", "Demenagement-Nice-Lyon.html"], ["Nice → Marseille", "Demenagement-Nice-Marseille.html"], ["Nice → Toulouse", "Demenagement-Nice-Toulouse.html"], ["Nice → Bordeaux", "Demenagement-Nice-Bordeaux.html"]] }, { title: t("Autres villes"), links: [ [t("Déménagement La Rochelle"), "Demenagement-La-Rochelle.html"]] }] }, intl: { eyebrow: t("Déménagement international"), title: t("Au-delà des\nfrontières."), blurb: t("Suisse, Italie, Espagne, Benelux : on organise le transport, les formalités douanières et le suivi jusqu'à destination."), cta: { label: t("Devis international"), href: "Devis.html" }, columns: [ { title: t("Suisse"), links: [["Genève", "Demenagement-Nice-Geneve.html"], ["Lausanne", "Demenagement-Nice-Lausanne.html"]] }, { title: t("Italie"), links: [["Milan", "Demenagement-Nice-Milan.html"], ["Turin", "Demenagement-Nice-Turin.html"]] }, { title: t("Espagne"), links: [["Barcelone", "Demenagement-Nice-Barcelone.html"], ["Madrid", "Demenagement-Nice-Madrid.html"]] }, { title: t("Benelux"), links: [["Bruxelles", "Demenagement-Nice-Bruxelles.html"], ["Luxembourg", "Demenagement-Nice-Luxembourg.html"]] }] } }; function Logo() { return ( LBC* — Les Bras Cassés ); } function MegaPanel({ data, onClose }) { return (
* {data.eyebrow}
{data.title}

{data.blurb}

{data.cta.label}→
{data.columns.map((col, i) =>
{col.title}
)}
); } function Nav() { const [open, setOpen] = useState(false); const [mega, setMega] = useState(null); const [drop, setDrop] = useState(null); const [mobileSub, setMobileSub] = useState(null); const closeTimer = React.useRef(null); const openMega = (key) => {clearTimeout(closeTimer.current);setMega(key);setDrop(null);}; const openDrop = (key) => {clearTimeout(closeTimer.current);setDrop(key);setMega(null);}; const scheduleClose = () => {clearTimeout(closeTimer.current);closeTimer.current = setTimeout(() => {setMega(null);setDrop(null);}, 160);}; useEffect(() => { const m = document.querySelector("main"); if (m && !m.id) { m.id = "contenu"; m.setAttribute("tabindex", "-1"); } }, []); return ( {t('Aller au contenu')}
{(CURRENT === 'accueil' || window.IS_EN) && FR / EN } 07 81 96 14 45 {t('Appeler')} {t('Devis gratuit')} {t('Devis gratuit')} →
{mega &&
openMega(mega)}>
}
{NAV.map((n) => n.mega ?
{mobileSub === n.mega &&
{MEGA[n.mega].columns.map((col, i) =>
{col.title}
{col.links.map((l, j) => {l[0]})} )}
}
: n.dropdown ?
{mobileSub === n.key &&
{n.dropdown.map((l, j) => {l.label})}
}
: {n.label} )} Devis gratuit →
); } function MarqueeBar() { const items = ["Nice", "Cannes", "Antibes", "Monaco", "Saint-Tropez", "Marseille", "Aix-en-Provence", "Toulon", "Menton", "Toute la France", "Devis sous 24h", "Assurance incluse"]; const Row = () => <> {items.map((c, i) => {c} )} ; return (
); } function RoadDivider() { return ( ); } function MascotStamp() { return (
Déménageurs niçois Le nom est la blague.
Mascotte LBC* Les Bras Cassés
Nice · PACA · France Le travail est sérieux.
); } // Email destination for lead notifications (FormSubmit.co — free, no account) const LEAD_EMAIL = "contact@lbcdemenagement.com"; const LEAD_ENDPOINT = "https://formsubmit.co/ajax/" + LEAD_EMAIL; // Address autocomplete powered by the French Base Adresse Nationale // (api-adresse.data.gouv.fr — free, no API key, CORS-enabled). function AddressField({ name, label, placeholder, defaultValue = "", className = "qq-field", inputClassName, hint, required, onValue, error }) { const [val, setVal] = useState(defaultValue); const [items, setItems] = useState([]); const [open, setOpen] = useState(false); const [hi, setHi] = useState(-1); const timer = useRef(null); const blurTimer = useRef(null); const query = (q) => { if (q.trim().length < 3) {setItems([]);setOpen(false);return;} fetch("https://api-adresse.data.gouv.fr/search/?limit=5&q=" + encodeURIComponent(q)). then((r) => r.json()). then((d) => { const labels = (d.features || []).map((f) => f.properties.label); setItems(labels);setOpen(labels.length > 0);setHi(-1); }). catch(() => {}); }; const onChange = (e) => { const v = e.target.value; setVal(v); if (onValue) onValue(v); clearTimeout(timer.current); timer.current = setTimeout(() => query(v), 250); }; const pick = (label) => {setVal(label);if (onValue) onValue(label);setItems([]);setOpen(false);}; const onKeyDown = (e) => { if (!open || items.length === 0) return; if (e.key === "ArrowDown") {e.preventDefault();setHi((i) => Math.min(items.length - 1, i + 1));} else if (e.key === "ArrowUp") {e.preventDefault();setHi((i) => Math.max(0, i - 1));} else if (e.key === "Enter" && hi >= 0) {e.preventDefault();pick(items[hi]);} else if (e.key === "Escape") {setOpen(false);} }; return (
{if (items.length) setOpen(true);}} onBlur={() => {blurTimer.current = setTimeout(() => setOpen(false), 150);}} /> {open && }
{hint && {hint}}
); } // Quick quote bar — Nextories style. variant: "light" | "dark" function QuickQuote({ variant = "light" }) { const go = (e) => { e.preventDefault(); const f = e.currentTarget; // Anti-spam honeypot: real users never fill this hidden field. if (f._honey && f._honey.value) { window.location.href = "Devis.html"; return; } const depart = f.depart.value.trim(); const arrivee = f.arrivee.value.trim(); const date = f.date.value.trim(); const tel = f.tel.value.trim(); const nom = f.nom.value.trim(); const surfaceEl = f.surface; const surface = surfaceEl.value; const surfaceLabel = surfaceEl.selectedIndex > 0 ? surfaceEl.options[surfaceEl.selectedIndex].text : ""; // Notify the owner immediately (fire-and-forget — keepalive survives the redirect). try { fetch(LEAD_ENDPOINT, { method: "POST", headers: { "Content-Type": "application/json", "Accept": "application/json" }, keepalive: true, body: JSON.stringify({ _subject: "🚚 Nouvelle demande de devis (barre rapide) — Les Bras Cassés", _template: "table", "Étape": "Barre rapide (page d'accueil)", "Nom": nom || "—", "Téléphone": tel || "—", "Adresse de départ": depart || "—", "Adresse d'arrivée": arrivee || "—", "Date souhaitée": date || "—", "Surface": surfaceLabel || "—" }) }).catch(() => {}); } catch (err) {} // Redirect to the full quote page with everything pre-filled. const p = new URLSearchParams(); if (depart) p.set("depart", depart); if (arrivee) p.set("arrivee", arrivee); if (date) p.set("date", date); if (tel) p.set("tel", tel); if (nom) p.set("nom", nom); if (surface) p.set("surface", surface); const qs = p.toString(); window.location.href = "Devis.html" + (qs ? "?" + qs : ""); }; return (
e.target.type = 'date'} onBlur={(e) => {if (!e.target.value) e.target.type = 'text';}} />
{ let d = e.target.value.replace(/[^\d+]/g, ''); if (d.startsWith('+33')) d = '0' + d.slice(3); d = d.replace(/\D/g, '').slice(0, 10); e.target.value = d.replace(/(\d{2})(?=\d)/g, '$1 ').trim(); }} />
✓ Gratuit & sans engagement ✓ Réponse sous 24h Ou appelez-nous : 07 81 96 14 45
); } // ---- SEO footer (cities + conseils) ---- const COTE_AZUR = [ ["Déménagement Nice", "Demenagement-Nice.html"], ["Déménagement Cannes", "Demenagement-Cannes.html"], ["Déménagement Antibes", "Demenagement-Antibes.html"], ["Déménagement Monaco", "Demenagement-Monaco.html"], ["Déménagement Menton", "Demenagement-Menton.html"], ["Déménagement Grasse", "Demenagement-Grasse.html"], ["Déménagement Cagnes-sur-Mer", "Demenagement-Cagnes-sur-Mer.html"], ["Déménagement Le Cannet", "Demenagement-Le-Cannet.html"], ["Déménagement Saint-Laurent-du-Var", "Demenagement-Saint-Laurent-du-Var.html"], ["Déménagement Mandelieu", "Demenagement-Mandelieu.html"]]; const FRANCE = []; const CONSEILS = [ { label: "Estimer le volume de votre déménagement", href: "Article.html?a=estimer-volume" }, { label: "Déménagement Nice → Paris : délais & organisation", href: "Article.html?a=demenagement-nice-paris-prix-delais" }, { label: "Réussir son déménagement Nice-Paris", href: "Article.html?a=demenagement-nice-paris-reussir" }, { label: "Déménagement international depuis Nice", href: "Article.html?a=demenagement-international-depuis-nice" }, { label: "Déménager à La Rochelle", href: "Article.html?a=demenagement-la-rochelle-guide" }, { label: "Villes aux démarches spéciales", href: "Article.html?a=villes-demarches-speciales-demenagement" }, { label: "Déménagement étudiant à Nice", href: "Article.html?a=demenagement-etudiant-nice" }, { label: "Déménager à Nice : stationnement & autorisations", href: "Article.html?a=demenager-nice" }, { label: "Bien choisir sa société de déménagement", href: "Article.html?a=choisir-demenageur" }]; function FooterSEO() { return (

Déménager partout sur la *Côte d'Azur

PACA · Région niçoise
{COTE_AZUR.map((c, i) => {c[0]})} Quartiers d'exception (Vieux-Nice…)
Longue distance · France
Déménagement Nice → Paris Déménagement Nice → Lyon Déménagement Nice → Marseille Déménagement Nice → Toulouse Déménagement Nice → Bordeaux Déménagement La Rochelle
Déménagement international
Nice → Genève Nice → Lausanne Nice → Bruxelles Nice → Luxembourg Nice → Barcelone Nice → Madrid Nice → Milan Nice → Turin

Nos conseils déménagement

{CONSEILS.map((c, i) => {c.label})}
Besoin d'un chiffrage ?
Obtenir mon devis gratuit→
); } function FloatWhatsApp() { const phone = "33781961445"; const msg = encodeURIComponent("Bonjour LBC ! Je souhaite un devis pour mon déménagement."); return ( Devis WhatsApp ); } // Notifications discrètes d'activité récente (social proof). Exemples crédibles, // présentés comme "activité récente" — pas de fausses identités vérifiables. const MOVE_PROOFS = [ { name: "Bernard M.", action: "a réservé son déménagement", place: "Nice → Cimiez", when: "il y a 3 h" }, { name: "Sophie L.", action: "a choisi la formule Mains libres", place: "Cagnes-sur-Mer", when: "il y a 5 h" }, { name: "Denise R.", action: "vient de demander un devis", place: "Antibes → Nice", when: "il y a 1 h" }, { name: "Jean-Marc P.", action: "a confirmé son déménagement", place: "Nice → Lyon", when: "hier" }, { name: "Catherine D.", action: "a choisi la formule Mains dans les poches", place: "Monaco", when: "il y a 6 h" }, { name: "Philippe G.", action: "a réservé son déménagement", place: "Le Cannet → Nice", when: "il y a 2 h" }, { name: "Nathalie B.", action: "vient de demander un devis", place: "Saint-Laurent-du-Var", when: "ce matin" }, { name: "Laurent F.", action: "a confirmé son déménagement", place: "Nice → Paris", when: "il y a 4 h" }, { name: "Martine C.", action: "a choisi la formule Coup de main", place: "Menton → Nice", when: "hier" }, { name: "Olivier T.", action: "a réservé son déménagement", place: "Cannes → Grasse", when: "il y a 8 h" }]; function SocialProof() { const [item, setItem] = useState(null); const [leaving, setLeaving] = useState(false); const timersRef = useRef([]); const stoppedRef = useRef(false); const clearTimers = () => {timersRef.current.forEach(clearTimeout);timersRef.current = [];}; useEffect(() => { if (sessionStorage.getItem("sp_done")) return; const t = (fn, ms) => {const id = setTimeout(fn, ms);timersRef.current.push(id);return id;}; let order; try {order = JSON.parse(sessionStorage.getItem("sp_order") || "null");} catch (e) {order = null;} if (!Array.isArray(order)) { order = MOVE_PROOFS.map((_, i) => i).sort(() => Math.random() - 0.5); sessionStorage.setItem("sp_order", JSON.stringify(order)); } let shown = parseInt(sessionStorage.getItem("sp_shown") || "0", 10); const MAX = 4,SHOW_MS = 6500,GAP_MS = 24000,FIRST_MS = 9000; const dismiss = () => {setLeaving(true);t(() => setItem(null), 420);}; const next = () => { if (stoppedRef.current || shown >= MAX) {sessionStorage.setItem("sp_done", "1");return;} const data = MOVE_PROOFS[order[shown % order.length]]; setLeaving(false); setItem({ ...data, key: Date.now() }); shown += 1; sessionStorage.setItem("sp_shown", String(shown)); t(dismiss, SHOW_MS); t(next, GAP_MS); }; t(next, FIRST_MS); return clearTimers; }, []); const close = () => { stoppedRef.current = true; sessionStorage.setItem("sp_done", "1"); clearTimers(); setLeaving(true); setTimeout(() => setItem(null), 420); }; if (!item) return null; const initial = (item.name.trim()[0] || "L").toUpperCase(); return (
{item.name} {item.action}
{item.place} · {item.when}
); } function useLiveliness() { useEffect(() => { const reduce = window.matchMedia && window.matchMedia("(prefers-reduced-motion: reduce)").matches; if (reduce) return; const cleanups = []; // 1) Mascotte : animation d'ambiance (CSS) — plus de suivi du curseur. // Les médaillons vivent via les keyframes bobble/sway/idle dans le CSS. // 2) Compteurs animés (stats) au scroll const counters = Array.from(document.querySelectorAll(".stat-num, .ap-stat-n, .stat-num-inline")); if (counters.length && "IntersectionObserver" in window) { const animate = (el) => { const node = Array.from(el.childNodes).find((n) => n.nodeType === 3 && /\d/.test(n.nodeValue)); if (!node) return; const target = parseInt(node.nodeValue.replace(/\s/g, ""), 10); if (isNaN(target)) return; const dur = 1100, t0 = performance.now(); const step = (t) => { const p = Math.min(1, (t - t0) / dur); const e = 1 - Math.pow(1 - p, 3); node.nodeValue = String(Math.round(e * target)); if (p < 1) requestAnimationFrame(step);else node.nodeValue = String(target); }; requestAnimationFrame(step); }; const io = new IntersectionObserver((entries) => { entries.forEach((en) => { if (en.isIntersecting) {animate(en.target);io.unobserve(en.target);} }); }, { threshold: 0.6 }); counters.forEach((c) => io.observe(c)); cleanups.push(() => io.disconnect()); } // 3) Tilt 3D léger sur les cartes const tiltCards = Array.from(document.querySelectorAll(".q-card, .formule-card")); const tiltHandlers = []; tiltCards.forEach((card) => { card.style.transformStyle = "preserve-3d"; card.style.transition = "transform .2s ease-out"; const move = (e) => { const r = card.getBoundingClientRect(); const px = (e.clientX - r.left) / r.width - 0.5; const py = (e.clientY - r.top) / r.height - 0.5; card.style.transform = "perspective(800px) rotateX(" + (-py * 5).toFixed(2) + "deg) rotateY(" + (px * 6).toFixed(2) + "deg) translateY(-3px)"; }; const leave = () => {card.style.transform = "";}; card.addEventListener("mousemove", move); card.addEventListener("mouseleave", leave); tiltHandlers.push([card, move, leave]); }); cleanups.push(() => tiltHandlers.forEach(([c, m, l]) => {c.removeEventListener("mousemove", m);c.removeEventListener("mouseleave", l);})); return () => cleanups.forEach((fn) => fn()); }, []); } function Footer() { useLiveliness(); return ( ); } // Scroll reveal — robust (immediate promote + observer + safety net) function useScrollReveal() { useEffect(() => { let io, safety; const promote = () => { const vh = window.innerHeight; document.querySelectorAll('.reveal, .reveal-stagger').forEach((el) => { const r = el.getBoundingClientRect(); if (r.top < vh * 0.95 && r.bottom > 0) el.classList.add('is-in'); }); }; const setup = () => { promote(); if ('IntersectionObserver' in window) { io = new IntersectionObserver((entries) => { entries.forEach((e) => {if (e.isIntersecting) {e.target.classList.add('is-in');io.unobserve(e.target);}}); }, { rootMargin: '0px 0px -8% 0px', threshold: 0.05 }); document.querySelectorAll('.reveal:not(.is-in), .reveal-stagger:not(.is-in)').forEach((el) => io.observe(el)); } safety = setTimeout(() => { document.querySelectorAll('.reveal, .reveal-stagger').forEach((el) => el.classList.add('is-in')); }, 700); }; const raf = requestAnimationFrame(() => requestAnimationFrame(setup)); return () => {cancelAnimationFrame(raf);clearTimeout(safety);if (io) io.disconnect();}; }, []); } Object.assign(window, { Logo, Nav, MarqueeBar, MascotStamp, RoadDivider, QuickQuote, AddressField, FooterSEO, Footer, SocialProof, useScrollReveal });