/* ============ Yhden miehen levyraati — reusable components ============ */
/* ---- Logo: official Yhden miehen levyraati vinyl mark ---- */
function Logo({ size = 84 }) {
return (
);
}
/* ---- Album cover with vinyl disc emerging from the right edge ---- */
function AlbumCover({ review, size = "md", style = "vinyl-right" }) {
const sz = size === "lg" ? 460 : size === "sm" ? 200 : 280;
const hue = review?.coverHue ?? 30;
const label = review?.work || "album";
const id = React.useId().replace(/:/g, "");
if (review?.cardImg) {
return (
);
}
return (
);
}
/* ---- Concert ticket frame ---- */
function ConcertTicket({ concert, size = "md" }) {
const sz = size === "lg" ? 480 : size === "sm" ? 220 : 300;
const hue = concert?.coverHue ?? 20;
const id = React.useId().replace(/:/g, "");
if (concert?.cardImg) {
return (
);
}
return (
);
}
/* ---- Header ---- */
function Header({ route, navigate }) {
const [open, setOpen] = React.useState(false);
const items = [
{ id: "home", label: "Etusivu" },
{ id: "podcast", label: "Podcast" },
{ id: "levyarviot", label: "Levyarviot" },
{ id: "keikkaraportit", label: "Keikkaraportit" },
{ id: "_brs", label: "Bad Record Store", external: true, href: "https://www.badrecordstore.fi/?ref=yhdenmiehenlevyraati" },
{ id: "info", label: "Info" },
{ id: "yhteys", label: "Yhteys" },
];
const activeRoot = route.split("/")[0];
return (
);
}
/* ---- Footer ---- */
function Footer({ navigate }) {
return (
);
}
/* ---- Article card ---- */
function ReviewCard({ review, navigate }) {
return (
navigate(`levyarviot/${review.slug}`)}>
{review.dateShort}
{review.title}
Lue lisää →
);
}
function ConcertCard({ concert, navigate }) {
return (
navigate(`keikkaraportit/${concert.slug}`)}>
{concert.dateShort}
{concert.title}
Lue lisää →
);
}
/* ---- Bad Record Store promo ---- */
function BadRecordPromo() {
return (
Yhteistyössä
Levyt omaksi?
Koodilla YML15 saat -15 % kaikista tuotteista ensimmäisellä ostoksellasi.
Bad Record Store →
);
}
/* ---- Instagram feed (live grid via /api/instagram, falls back to placeholders) ---- */
function getPostImage(post) {
if (post.media_type === "VIDEO") return post.thumbnail_url || null;
return post.media_url || post.thumbnail_url || null;
}
function InstagramGrid() {
const [posts, setPosts] = React.useState(null); // null = still loading
React.useEffect(() => {
fetch("/api/instagram")
.then((r) => r.json())
.then((data) => setPosts(Array.isArray(data.data) ? data.data : []))
.catch(() => setPosts([]));
}, []);
const realPhotos = [
"assets/ig/ig-1.jpg",
"assets/ig/ig-2.jpg",
"assets/ig/ig-3.jpg",
"assets/ig/ig-4.jpg",
"assets/ig/ig-5.jpg",
"assets/ig/ig-6.jpg",
];
const profileUrl = "https://www.instagram.com/yhdenmiehenlevyraati/";
const tiles = Array.from({ length: 9 }, (_, i) => {
const post = posts && posts[i];
if (post) {
return { photo: getPostImage(post), link: post.permalink || profileUrl, hue: i * 41 % 360 };
}
// While loading (posts === null) show the local placeholder photos;
// once loaded, any slot without a real post falls back to a plain tile.
return { photo: posts === null ? realPhotos[i] || null : null, link: profileUrl, hue: i * 41 % 360 };
});
return (
);
}
/* ---- Contact form ---- */
function ContactForm() {
const [form, setForm] = React.useState({ firstName: "", lastName: "", email: "", message: "", honeypot: "" });
const [status, setStatus] = React.useState("idle"); // idle | sending | sent | error
function update(field) {
return (e) => setForm((f) => ({ ...f, [field]: e.target.value }));
}
async function submit(e) {
e.preventDefault();
setStatus("sending");
try {
const res = await fetch("/api/contact", {
method: "POST",
headers: { "Content-Type": "application/json" },
body: JSON.stringify(form),
});
if (!res.ok) throw new Error("Lähetys epäonnistui");
setStatus("sent");
setForm({ firstName: "", lastName: "", email: "", message: "", honeypot: "" });
setTimeout(() => setStatus("idle"), 4000);
} catch (err) {
setStatus("error");
}
}
return (
);
}
/* ---- Spotify embed (real iframe for podcast show and albums; placeholder as fallback) ---- */
function SpotifyEmbed({ showId, embedUrl, type = "show", height = 232 }) {
const consent = useCookieConsent();
const src = type === "show" ?
`https://open.spotify.com/embed/show/${showId}?utm_source=generator` :
embedUrl;
if (src && consent && consent.embeds) {
return (
);
}
/* Embed exists but the user hasn't consented to third-party cookies yet */
if (src) {
return (
Tämä sisältö on Spotifyn upottama soitin, joka vaatii evästeiden hyväksymisen.
);
}
/* Fallback placeholder — no embed URL available for this album yet */
return (
Kuuntele Spotifyssa
open.spotify.com
);
}
Object.assign(window, {
Logo, AlbumCover, ConcertTicket,
Header, Footer,
ReviewCard, ConcertCard,
BadRecordPromo, InstagramGrid, ContactForm, SpotifyEmbed,
});