// Generated SVG cover artwork for releases and podcast chapters.
// Six visual archetypes, deterministically chosen per `seed` (release id /
// chapter id). The goal is "looks like a real ambient / experimental record
// cover" — monochrome, abstract, textured. When `accent` is set, a faint hint
// of that hue is mixed into one layer.
// --- Seeded RNG (mulberry32) -----------------------------------------------
const hashSeed = (s) => {
let h = 2166136261 >>> 0;
for (let i = 0; i < s.length; i++) {
h ^= s.charCodeAt(i);
h = Math.imul(h, 16777619);
}
return h >>> 0;
};
const makeRng = (seed) => {
let a = seed || 1;
return () => {
a |= 0; a = (a + 0x6D2B79F5) | 0;
let t = Math.imul(a ^ (a >>> 15), 1 | a);
t = (t + Math.imul(t ^ (t >>> 7), 61 | t)) ^ t;
return ((t ^ (t >>> 14)) >>> 0) / 4294967296;
};
};
// --- 6 visual archetypes ---------------------------------------------------
// Each returns the SVG inner markup as JSX, given (rng, accent).
// Background is always a base dark rectangle drawn by Artwork.
const Archetypes = {
// A — Tidal rings: concentric circles, off-center, organic distortion
tides: (rng, accent) => {
const cx = 50 + (rng() - .5) * 40;
const cy = 50 + (rng() - .5) * 40;
const rings = 22 + Math.floor(rng() * 14);
const baseFreq = (0.012 + rng() * 0.018).toFixed(4);
const fid = 'art-tides-' + Math.floor(rng() * 1e6);
return (
<>
{Array.from({ length: rings }).map((_, i) => {
const r = 4 + i * (90 / rings);
const op = 0.04 + (1 - i / rings) * 0.4;
const stroke = i % 7 === 0 && accent ? accent : '#dadada';
return ;
})}
);
},
// B — Cumulus: turbulence cloud field with a single warmer point
cumulus: (rng, accent) => {
const fid = 'art-cum-' + Math.floor(rng() * 1e6);
const baseFreq = (0.008 + rng() * 0.012).toFixed(4);
const sx = 30 + rng() * 40, sy = 30 + rng() * 40;
return (
<>
);
},
// C — Strata: horizontal bands at varied opacity
strata: (rng, accent) => {
const bands = 12 + Math.floor(rng() * 18);
const horizon = 30 + rng() * 50;
const fid = 'art-st-' + Math.floor(rng() * 1e6);
return (
<>
{Array.from({ length: bands }).map((_, i) => {
const y = (i / bands) * 100 + rng() * (100 / bands);
const op = 0.04 + rng() * 0.14;
return ;
})}
);
},
// D — Spire: vertical beam of light, top-down fade, grain overlay
spire: (rng, accent) => {
const cx = 30 + rng() * 40;
const w = 10 + rng() * 25;
const fid = 'art-sp-' + Math.floor(rng() * 1e6);
return (
<>
);
},
// E — Particle field: scattered dots, denser in one corner
particles: (rng, accent) => {
const n = 240 + Math.floor(rng() * 200);
const cx = rng() < .5 ? 20 + rng() * 20 : 60 + rng() * 20;
const cy = rng() < .5 ? 20 + rng() * 20 : 60 + rng() * 20;
const fid = 'art-p-' + Math.floor(rng() * 1e6);
const pts = [];
for (let i = 0; i < n; i++) {
// bias toward (cx, cy)
const bx = (rng() + rng() + rng()) / 3;
const by = (rng() + rng() + rng()) / 3;
const x = cx + (bx - 0.5) * 120;
const y = cy + (by - 0.5) * 120;
const r = 0.18 + rng() * 0.6;
const op = 0.2 + rng() * 0.6;
pts.push([x, y, r, op]);
}
return (
<>
{pts.map(([x, y, r, op], i) => (
))}
);
},
// F — Eclipse: dark disc on subtle gradient, off-center
eclipse: (rng, accent) => {
const cx = 40 + rng() * 20;
const cy = 40 + rng() * 20;
const r = 28 + rng() * 18;
const fid = 'art-ec-' + Math.floor(rng() * 1e6);
return (
<>
);
},
};
const ARCHES = Object.keys(Archetypes); // 6 entries
// --- Public component ------------------------------------------------------
const Artwork = ({ seed = 'default', accent, style, className = '', corner, archetype }) => {
const seedNum = hashSeed(String(seed));
const rng = makeRng(seedNum);
// First roll picks the archetype (consume one random first so changes
// in later archetype code don't reshuffle which seed → which archetype)
const pick = archetype || ARCHES[Math.floor(rng() * ARCHES.length)];
const inner = Archetypes[pick](rng, accent);
return (
{corner &&
{corner}
}
);
};
window.MOTD_ART = { Artwork };