// WimarGallery — nowoczesna, galeryjna strona Wimar (PL) // Pełnoekranowe hero, animowany pas realizacji, poziome scroll-snap galerie per kategoria, // immersyjne kadry pełnej szerokości, reveal on scroll. const { useState, useEffect, useRef, useCallback } = React; const GAL_ACCENT = "#ffcc00"; // ---------- DATA ---------- const GAL_PHOTOS = [ { src: "images/przemyslowa-1.jpg", t: "Parking przy hali, kostka ażurowa", cat: "Kostka przemysłowa" }, { src: "images/przemyslowa-4.jpg", t: "Plac przy obiekcie biurowym", cat: "Kostka przemysłowa" }, { src: "images/przemyslowa-6.jpg", t: "Parking firmowy z zielenią", cat: "Kostka przemysłowa" }, { src: "images/przemyslowa-3.jpg", t: "Parking handlowy, dwie kostki", cat: "Kostka przemysłowa" }, { src: "images/przemyslowa-8.jpg", t: "Plac z miejscami dla niepełnosprawnych", cat: "Kostka przemysłowa" }, { src: "images/przemyslowa-5.jpg", t: "Parking obiektu usługowego", cat: "Kostka przemysłowa" }, { src: "images/przemyslowa-2.jpg", t: "Nawierzchnia ażurowa z nasadzeniami", cat: "Kostka przemysłowa" }, { src: "images/przemyslowa-7.jpg", t: "Ciąg komunikacyjny przy markecie", cat: "Kostka przemysłowa" }, { src: "images/skarpa.jpg", t: "Umocnienie skarpy", cat: "Kostka przemysłowa" }, { src: "images/skarpa-2.jpg", t: "Skarpa z geokratą i chodnikiem", cat: "Kostka przemysłowa" }, { src: "images/podjazd-brynow.jpg", t: "Podjazd z kostki melanż", cat: "Podjazdy" }, { src: "images/podjazd-postojowy.jpg", t: "Podjazd z miejscami postojowymi", cat: "Podjazdy" }, { src: "images/podjazd-melanz.jpg", t: "Podjazd melanż z krawężnikiem", cat: "Podjazdy" }, { src: "images/podjazd-waski.jpg", t: "Podjazd dojazdowy do garażu", cat: "Podjazdy" }, { src: "images/podjazd-odwodnienie.jpg",t: "Podjazd z odwodnieniem liniowym",cat: "Podjazdy" }, { src: "images/podjazd-dojscie.jpg", t: "Podjazd z dojściem bocznym", cat: "Podjazdy" }, { src: "images/taras-donice.jpg", t: "Taras z donicami betonowymi", cat: "Tarasy" }, { src: "images/taras-chorzow.jpg", t: "Taras przydomowy", cat: "Tarasy" }, { src: "images/taras-altana.jpg", t: "Taras pod altaną", cat: "Tarasy" }, { src: "images/taras-balkon.jpg", t: "Taras od strony ogrodu", cat: "Tarasy" }, { src: "images/taras-nowy.jpg", t: "Taras ze stopniami", cat: "Tarasy" }, { src: "images/taras-murek.jpg", t: "Taras na murku oporowym", cat: "Tarasy" }, { src: "images/taras-budowa.jpg", t: "Taras z płyt wielkoformatowych", cat: "Tarasy" }, { src: "images/skwer-panorama.jpg", t: "Skwer z kostki granitowej", cat: "Place i skwery" }, { src: "images/skwer-lawki.jpg", t: "Skwer z małą architekturą", cat: "Place i skwery" }, { src: "images/skwer-plac.jpg", t: "Plac z kostki płukanej", cat: "Place i skwery" }, { src: "images/skwer-bytom.jpg", t: "Skwer ze schodami", cat: "Place i skwery" }, { src: "images/chodnik-cmentarz.jpg", t: "Chodnik z obrzeżem grafit", cat: "Place i skwery" }, { src: "images/parking-komercyjny.jpg", t: "Plac utwardzony", cat: "Place i skwery" }, { src: "images/schody-5.jpg", t: "Schody wejściowe z bloczków", cat: "Schody" }, { src: "images/schody-6.jpg", t: "Schody z murkiem i dojściem", cat: "Schody" }, { src: "images/schody-1.jpg", t: "Schody z okładziną granitową", cat: "Schody" }, { src: "images/schody-2.jpg", t: "Schody z pochylnią", cat: "Schody" }, { src: "images/oslona-1.jpg", t: "Osłona śmietnikowa", cat: "Osłony" }, { src: "images/oslona-3.jpg", t: "Osłona na odpady", cat: "Osłony" }, { src: "images/oslona-2.jpg", t: "Osłona drewniana", cat: "Osłony" }, ]; const GAL_CATS = [ { key: "Kostka przemysłowa", n: "01", desc: "Parkingi, place i nawierzchnie ażurowe przy obiektach komercyjnych i halach." }, { key: "Podjazdy", n: "02", desc: "Kostka melanż, antracyt i granit: podjazdy, opaski i chodniki boczne." }, { key: "Tarasy", n: "03", desc: "Płyty wielkoformatowe, donice betonowe, stopnie i obrzeża grafitowe." }, { key: "Place i skwery", n: "04", desc: "Reprezentacyjne place z kostki granitowej, mała architektura i klomby." }, { key: "Schody", n: "05", desc: "Budowa i renowacja schodów, okładziny granitowe i bloczki betonowe." }, { key: "Osłony", n: "06", desc: "Konstrukcje stalowo-drewniane na odpady, podbudowa i montaż pod klucz." }, ]; // ---------- REVEAL HOOK ---------- function useReveal() { useEffect(() => { const els = document.querySelectorAll("[data-reveal]"); const io = new IntersectionObserver((entries) => { entries.forEach((e) => { if (e.isIntersecting) { e.target.setAttribute("data-in", "1"); io.unobserve(e.target); } }); }, { threshold: 0.12, rootMargin: "0px 0px -8% 0px" }); els.forEach((el) => io.observe(el)); return () => io.disconnect(); }); } // ---------- NAV ---------- function GalNav() { const [solid, setSolid] = useState(false); useEffect(() => { const onScroll = () => setSolid(window.scrollY > window.innerHeight * 0.6); window.addEventListener("scroll", onScroll, { passive: true }); return () => window.removeEventListener("scroll", onScroll); }, []); const items = ["Realizacje", "Usługi", "Kontakt"]; return ( ); } // ---------- HERO ---------- function GalHero() { return (
Realizacja Wimar
Kostka · Tarasy · Schody · Place · Śląsk

Twardy grunt
pod każdy projekt.

Ponad 200 zrealizowanych podjazdów, tarasów, schodów i skwerów. Dbałość o szczegóły i szybkość wykonania. Bezpłatna wycena.

Przewiń do galerii ↓
); } // ---------- MARQUEE ---------- function GalMarquee() { const picks = GAL_CATS.flatMap((c) => GAL_PHOTOS.filter((p) => p.cat === c.key).slice(0, 2)); const row = [...picks, ...picks]; return (
{row.map((ph, i) => (
{ph.t}
{ph.cat}
))}
); } // ---------- INTRO ---------- function GalIntro() { return (
/ Wimar · od 2003

Układamy kostkę przemysłową i osiedlową, budujemy tarasy, schody, place i skwery. Każda realizacja to równy spadek, czysta fuga i podbudowa, która nie pracuje przez lata.

); } // ---------- STATS ---------- function GalStats() { const stats = [["2003", "na rynku od roku"], ["200+", "zrealizowanych obiektów"], ["do 5 lat", "gwarancji na robociznę"]]; return (
{stats.map(([n, l], i) => (
{n}
{l}
))}
); } // ---------- CATEGORY SCROLLER ---------- function GalScroller({ cat }) { const ref = useRef(null); const photos = GAL_PHOTOS.filter((p) => p.cat === cat.key); const scrollBy = useCallback((dir) => { const el = ref.current; if (!el) return; const amount = dir * Math.min(el.clientWidth * 0.8, 600); const start = el.scrollLeft; const max = el.scrollWidth - el.clientWidth; const target = Math.max(0, Math.min(max, start + amount)); const dist = target - start; if (!dist) return; // scroll-snap mandatory fights programmatic scroll — disable during the animation const prevSnap = el.style.scrollSnapType; el.style.scrollSnapType = "none"; window.cancelAnimationFrame(el._raf); const dur = 460, t0 = performance.now(); const ease = (p) => 1 - Math.pow(1 - p, 3); const step = (now) => { const p = Math.min(1, (now - t0) / dur); el.scrollLeft = start + dist * ease(p); if (p < 1) { el._raf = window.requestAnimationFrame(step); } else { el.style.scrollSnapType = prevSnap || ""; } }; el._raf = window.requestAnimationFrame(step); }, []); return (
{cat.n}

{cat.key}

{cat.desc}

1 ? "visible" : "hidden" }}>
{photos.map((ph, i) => (
{ph.t}
{ph.t}
))}
); } // ---------- FEATURE BREAK (full-bleed) ---------- function GalFeature() { return (
Skwer osiedlowy
Realizacja · Skwer z kostki granitowej

Kostka granitowa płukana, klomb z murkiem oporowym i mała architektura. Reprezentacyjna przestrzeń osiedlowa.

); } // ---------- USŁUGI ---------- function GalServices() { const rows = [ ["Kostka przemysłowa", "Place, parkingi i nawierzchnie obciążone, kostka na solidnej podbudowie."], ["Kostka osiedlowa", "Ciągi pieszo-jezdne, chodniki i drogi osiedlowe z kostki betonowej."], ["Kostka na posesji", "Podjazdy, opaski i ścieżki przydomowe: kostka melanż, antracyt, granit."], ["Tarasy", "Płyty wielkoformatowe i tarasowe, donice betonowe, stopnie i obrzeża."], ["Schody", "Budowa i renowacja schodów, okładziny granitowe i bloczki betonowe."], ["Place i skwery", "Reprezentacyjne place z kostki granitowej, mała architektura, klomby i murki."], ["Osłony śmietnikowe", "Konstrukcje stalowo-drewniane na odpady, podbudowa i montaż pod klucz."], ]; return (
/ Usługi

Pełen zakres

{rows.map(([t, d], i) => (
0{i + 1} {t} {d}
))}
); } // ---------- KONTAKT ---------- function GalContact() { const [form, setForm] = useState({ phone: "", email: "", msg: "", consent: false, company: "" }); const [errors, setErrors] = useState({}); const [sent, setSent] = useState(false); const [sending, setSending] = useState(false); const [sendError, setSendError] = useState(""); const loadedAt = useRef(Date.now()); function set(k, v) { setForm({ ...form, [k]: v }); if (errors[k]) setErrors({ ...errors, [k]: null }); } async function submit(e) { e.preventDefault(); const er = {}; const hasEmail = form.email.trim() !== ""; const hasPhone = form.phone.trim() !== ""; if (!hasEmail && !hasPhone) er.contact = "Podaj telefon lub e-mail"; if (hasEmail && !/^[^\s@]+@[^\s@]+\.[^\s@]+$/.test(form.email)) er.email = "Nieprawidłowy e-mail"; if (hasPhone && !/^[+\d\s-]{9,}$/.test(form.phone)) er.phone = "Nieprawidłowy numer"; if (form.msg.trim().length < 10) er.msg = "Opisz krótko zakres (min. 10 znaków)"; if (!form.consent) er.consent = "Wymagana zgoda"; setErrors(er); if (Object.keys(er).length) return; setSending(true); setSendError(""); try { const res = await fetch("/api/contact", { method: "POST", headers: { "Content-Type": "application/json" }, body: JSON.stringify({ phone: form.phone, email: form.email, msg: form.msg, consent: form.consent, company: form.company, elapsed: Date.now() - loadedAt.current, }), }); const data = await res.json().catch(() => ({})); if (data.success) setSent(true); else setSendError(data.error || "Nie udało się wysłać. Zadzwoń: +48 694 448 527."); } catch (_) { setSendError("Błąd połączenia. Zadzwoń: +48 694 448 527."); } finally { setSending(false); } } const field = (k) => ({ width: "100%", padding: "16px 0", background: "transparent", color: "#fff", border: "none", borderBottom: `1px solid ${errors[k] ? "#ff7a7a" : "rgba(255,255,255,0.22)"}`, fontFamily: "'Inter', sans-serif", fontSize: 17, outline: "none", borderRadius: 0, }); const lab = { display: "block", fontFamily: "'JetBrains Mono', monospace", fontSize: 11, letterSpacing: "0.14em", textTransform: "uppercase", color: "rgba(255,255,255,0.5)", marginBottom: 4 }; const err = { color: "#ff9a9a", fontSize: 12, fontFamily: "'Inter',sans-serif", marginTop: 6 }; return (
/ Kontakt

Wyceńmy
Twój teren.

Bezpłatna wycena. Działamy w: Siemianowice Śląskie, Chorzów, Bytom, Piekary Śląskie, Katowice i miasta ościenne.

{[["Telefon", "+48 694 448 527"], ["E-mail", "wimarws@wp.pl"], ["Siedziba", "ul. Bohaterów Westerplatte 20, Siemianowice Śląskie"], ["Adres firmy", "ul. Powstańców Śląskich 32b, Boronów"]].map(([k, v]) => (
{k}
{v}
))}
{sent ? (
✓

Dziękujemy!

Odezwiemy się z wyceną najszybciej, jak będziemy mogli.

) : (
set("company", e.target.value)} style={{ position: "absolute", left: "-9999px", width: 1, height: 1, opacity: 0 }} />
set("phone", e.target.value)} placeholder="+48 600 000 000" inputMode="tel" />{errors.phone &&
{errors.phone}
}
set("email", e.target.value)} placeholder="jan@example.com" inputMode="email" />{errors.email &&
{errors.email}
}
{errors.contact &&
{errors.contact}
}