{s.title}
{s.desc}
Pourquoi BoatsFun
Des sorties pensées pour chaque moment
Famille, amis, coucher de soleil ou célébration privée : trouvez l'expérience qui correspond à votre journée.
BoatsFun vous aide à choisir le bon bateau, la bonne ambiance et le bon moment pour profiter de l'eau simplement.
{EXP_SLIDES.map((s, i) =>
{s.tag}
)}
{/* COL 1 — vignettes horizontales, bas gauche (navigation) */}
);
}
// ============ COMPONENT ============
function Homepage() {
const [filter, setFilter] = React.useState("Tous");
const [openFaq, setOpenFaq] = React.useState(0);
// Slide actif du carousel "Plages horaires" — remonté ici pour piloter le fond de la section
const [tsCurrent, setTsCurrent] = React.useState(0);
// Slider mobile "Comment ça marche" (1 étape à la fois — desktop reste 3 visibles)
const [hiwStep, setHiwStep] = React.useState(0);
const hiwGo = (d) => setHiwStep((s) => (s + d + HOW.length) % HOW.length);
const filters = ["Tous", "Ponton", "Yacht", "Cruiser", "Speedboat"];
const visibleBoats = (filter === "Tous" ? BOATS_MTL : BOATS_MTL.filter((b) => b.type === filter)).slice(0, 6);
// Search bar (home) — état + redirection vers /bateaux
const homeRegions = React.useMemo(
() => (window.BFBoats && window.BFBoats.getRegions ? window.BFBoats.getRegions() : []),
[]
);
const homeSlots = (window.BFBoats && window.BFBoats.TIME_SLOTS) || ["Matin", "Après-midi", "Soir", "Journée entière"];
const [hRegion, setHRegion] = React.useState("");
const [hCap, setHCap] = React.useState("");
const [hDate, setHDate] = React.useState("");
const [hSlot, setHSlot] = React.useState("");
const [hCombine, setHCombine] = React.useState(false);
const submitSearch = (e) => {
if (e && e.preventDefault) e.preventDefault();
const params = new URLSearchParams();
if (hRegion) params.set("region", hRegion);
if (hCap) params.set("cap", hCap);
if (hDate) params.set("date", hDate);
if (hSlot) params.set("slot", hSlot);
if (hCombine) params.set("combine", "1");
const qs = params.toString();
window.BF.nav(qs ? `/bateaux?${qs}` : "/bateaux");
};
return (
{TIME_SLOTS.map((s, i) => (
))}
{/* COL 2 — grande image portrait centrée (crossfade) */}
{TIME_SLOTS.map((s, i) => (
))}
{/* COL 3 — texte centré verticalement + flèches dessous */}
{slot.title}
{slot.hours}
{slot.desc}
{/* ============ HEADER (partagé) ============ */}
Réservez un bateau à Montréal.
{/* ============ SEARCH BAR (glassmorphism overlay on hero) ============ */}
{/* ============ SÉPARATEUR ONDULÉ — transition douce vers le catalogue ============ */}
{/* ============ POPULAR BOATS ============ */}
{/* ============ TIME SLOTS — 3D curve carousel ============ */}
{/* ============ COMMENT ÇA MARCHE — section immersive lifestyle ============ */}
{if (window.BF && window.BF.nav) {e.preventDefault();window.BF.nav("/bateaux");}}}>
Voir les bateaux disponibles
{/* ============ MAKE AN OFFER ============ */}
Faites une offre,
{/* ============ WHY BOATSFUN — expérience (marquee + carousel bento) ============ */}
{/* ============ FAQ ============ */}
{/* ============ DEVENIR HÔTE — propriétaires marketplace (Vague 3) ============ */}
{/* ============ EMAIL ALERTS ============ */}
{/* ============ FOOTER (partagé) ============ */}
);
}
window.Homepage = Homepage;
})();
{/* HERO IMAGE — standard ![]()
, replace src to swap */}
Réservez un bateau à Montréal.
Ou faites une offre au propriétaire.
Réservez directement ou laissez les propriétaires venir à vous. Paiement sécurisé, dépôt 100 % remboursable.
À partir de 150 $ / heure
{/* Ligne secondaire : carte "Combiner" à gauche + réassurance à droite */}
Découvrez les bateaux disponibles près de vous
Comparez les options, choisissez votre date et envoyez votre demande en quelques minutes.
{filters.map((f) =>
)}
{visibleBoats.map((b, i) =>
{b.type.toUpperCase()}
{b.name}
{window.BFBoats.startingPriceLabel(b.lowestPricePerHour)}
Voir Plages horaires
Choisissez votre moment parfait
Chaque plage horaire offre une ambiance différente : sortie calme le matin, après-midi au soleil ou coucher de soleil sur l'eau.
Envie de plus ? Réservez la journée entière, du matin au coucher du soleil.
En 3 étapes
Comment ça marche
Réservez votre sortie en quelques étapes simples.
-
{HOW.map((s, i) =>
-
{s.title}
{s.desc}
)}
{HOW.map((s, i) =>
Faire une offre
Faites une offre,
obtenez votre prix.
Proposez un budget raisonnable pour une date précise. Si un propriétaire accepte, votre réservation est confirmée. Sinon, votre dépôt est remboursé.
{OFFER_FLOW.map((s) =>
)}
ÉTAPE 0{s.n}
{s.title}
Si aucune offre n'est acceptée, BoatsFun.com est uniquement responsable du remboursement du dépôt.
FAQ
Questions fréquentes
{FAQ.map((item, i) =>
)}
setOpenFaq(openFaq === i ? -1 : i)}>
{item.q}
{item.a}
Propriétaires
Votre bateau peut travailler pour vous.
Mettez votre bateau en location sur BoatsFun. Vous gardez le contrôle sur les tarifs, les dates et les locataires acceptés.
Vous fixez vos tarifs et vos disponibilités Paiements sécurisés et automatisés, sans avance Chaque locataire est vérifié par notre équipe avant la sortie
Vous fixez le prix
Acceptez ou refusez librement chaque offre reçue.
Paiement protégé
Fonds sécurisés en main tierce jusqu'à la sortie.
Calendrier flexible
Bloquez vos dates personnelles en un clic.
Support 7j/7
Une équipe locale à Montréal pour vous accompagner.
Alertes
Recevez les meilleures disponibilités par email
Soyez alerté lorsqu'un bateau devient disponible, qu'un prix baisse ou qu'une offre intéressante apparaît.
Pas de spam. Désabonnement en un clic.