words.js

const text = `all around you is the image of the child. little cherubic forms are scattered, directionless, melding together as a fertile haze. there is one such form at mox: a baby just awoken from sleep, something that can't yet speak but tries endlessly, excitably. the two of you set forth to entertain it, taking turns talking and gesturing. you watch it, the two of you, smiling, and you watch each other watching it. you are both, in that moment, surely happier than you have been in many days. you remark later that when life has concocted a new and beautiful form of torture, you have a responsibility to at least see how it feels. watching someone talk to a baby is so evocative. it's a kind of unique performance, a little one man show that tells you everything. S on the couch does a classic peekaboo: fitting. strong enthusiasm, but maybe too unsteady to depart from form. you think about the kids she will homeschool, will bring to rationalist meetups and teach about copper refinement and gpu programming. you can feel your own fear, performing. this too is fitting. cynically: something that is perhaps not meant for you, that is just out of reach. the other day, you had been thinking about relationships as an expansion of your world, the one each person has inside their heads and lives in all the time. bringing someone in and letting them see how to feel what you feel. you think that in relationships you're maybe too prone to just being the visitor, letting yourself be brought inside another's, leaving your own one vacant. sublimation, in essence. it can be comforting to lose oneself like this. either way is of course a failure. a new thing must be built.

you wonder if this is in fact what it is like to be the child: to be the perpetual visitor. someone whose world hasn't formed yet, the baby is a fragile thing, does not exist as an entity apart. it becomes entirely subject to the world of the other.

people have an innate sense of this. that to engage with the child is to bear the weight of responsibility for creating a world for the child to rest in. this is what's so evocative, that everyone sees this responsibility. to play happily with the child is to have a positive vision for the world one could live in. to know and enact it, for years or only for a moment.

visions of repetition. you think of being encrusted, lying rooted like a barnacle as the layers become rigid around you. not unpleasant, until things pull and orbit, until eventually they snap. this is maybe a type of patience.

you think of V, before things got wrapped up in themselves. She lies immobile on the carpet and you feed her cabbage and eggs, lifting each forkful into her mouth, when her back hurts so bad after planes.

you walk with her later, along the highway to buy a futon, for the back. you talk rapidly, functionally, like you are laying out a great plan. her mother calls, and you eavesdrop, to practice your spanish. V and her mother are, you think, the only two native speakers in the world whose conversations you can understand clearly, you don't know why. happy in a rioplatense‑specific way. washed over with sadness. just speaking more slowly. after the call, the two of you try to talk in spanish then as you walk, but you're so scared of missing the words in response, of not knowing everything. you make her say it all again in english.

in the store, she chooses a bad futon, one that creates an unresolvable emotional dynamic. the tensions of her life will make her not want to sleep on it and the tensions of her back will make her need to, they will pull at her and it all might hurt forever. you wait to tell her this, though, until she's already bought it, and you're walking back along the highway. 

perhaps this was things already being wrapped up, always being so. you miss her. you send her photos, of you and A and salads. leaves, flakes of parmesan, smiles, all squished together. her in paris, you with faces she doesn't recognize in photos.

you then think, of course, of M. you can never do her justice: to think of her distinctly, as a thing with shape rather than a landscape, all‑encompassing, is something you haven't done in a long time. you think of her more as a negative space, made from the outlines, of tears, screams, lying prostrate, dark rooms that blur together. these things stretch out in your mind into a long, sub‑lucid haze. Years wrapped up in themselves.

in these ways you begin to falter, to wonder if all of it is not so different. you discuss wretchedness as a continual and essential state, a way of being that one inhabits. you need them to be different. in your head it all starts to appear again as a deep pit, the kind that used to fascinate you singularly, that you could attach yourself to the side of in a kind of desperation. you talk about this over sushi, always over sushi, about your worries, but they dissipate, are gone as soon as they are spoken.

in the morning you feel a renewed confidence. that it need not be so, that all the things you love are all the things that are good, that you could be happy forever, like a vast expanse.

there is a feeling, over sushi, when you can suddenly see a whole lifeworld moving away from you, like like a severed raft in the water. this teeming structure, whose vertices are everything you could ever want in the world. the entire emotional apparatus of a life, a particular one that would never be yours again.

you have conviction, these days, that there's nothing you truly want.

you are passionate about: going on short walks. stopping at the grocery store on the way home from work. making big salads with radicchio in your metal bowl that's exactly the right size. taking your headphones on and off every 5 minutes on repeat as you continually reevaluate whether the fresh air through your ears feels better than the music or the other way around. in essence, very little.

more than ever the tone of things is set by great tides, entirely outside of understanding. happiness and sadness washing you onto foreign shores, back and forth. being sick all the time has made you take nothing for granted. walking, or just sitting with coffee at your laptop, will be the happiest you've ever felt. this is a way of clinging to the raft.

mindfulness as a way of chasing of small euphorias: cope for being someone who doesn't want anything. yet maybe most people don't want like this, and so it's cope for something entirely different, for feeling like you need some overarching frame.

L is like this too you think, needs to feel a certain way about the world. she talks about it last week: feeling like the thread had been severed, that the faith was gone. but mostly she has it: a kind of totalizing outlook, perfect clarity. perhaps this is the one thing you truly understand about each other. 

it seems there is a wanting that's less actual desire and more an organizing principle. something more like ontology.

you tell J that it's time for you to leave. 

things are being swapped out for one another. interchange, hands hovering over wooden blocks, rotated around indefinitely. each time they swap somebody is dying, a dance that can only go on for so long, swapping and swapping until the pieces run out. you might need to go before it happens.

you know that there's some parallel world of true experience, where the two of you are really at the bar together eating devilled eggs. but you're not there, you're behind a wall, looking in. at the bar you try to talk to her about overwhelming misery, about fear, about the people who used to love you and why they don't anymore. why that's about fear.

she tells you she knows an old friend of yours, and in your mind you see this cloistered throughline of people you wish you were, that at times you can make contact with something better than yourself. you tell her to say hi for you. kept giggling and rolling around, hiding her face in the blankets. says that it was just how you looked.

you talk to S about symbols. obedience, and what it means when it rains. she also wants to have sex with you, but in a more abstracted way. there was a time long ago when it felt more real than anything else, but now it's less, it's not even there anymore, except as a substrate through which everything else happens. you have to study the emanations, like kabbalah. the other S says you're always calling things evil, and that's important to you, seeing the world as good and evil, but you aren't sure why. maybe it gives you a framework for the emanations, or makes it more real. you don't know how to say no to people. or how to say yes. S calls you comfortable with silence.

the whole day you remember the wounded animal. it's looking around for a place to die.

in the morning you have a little bowl filled with slices of smoked trout. thin and vibrant. dangled above the mouth, thread-like. and you imagine being a little palace cat, spoiled, perching atop columns and such. eating trout from little bowls.

things are opening up again, and you think about friendships where nobody can get hurt. appropriate levels of callousness. along parallel but separate lines is the value one gets from disdain. there is to be an unfurling.

at night: shakshuka again. your stomach will hurt again after - you know this when buying the ingredients. not because of the shakshuka, it is just delicious and you will eat too much. 

you hope to manage a renewed enthusiasm. to eat until it hurts. and as you talk you get that sense, like when a memory moves over that grey line from being a memory to just a memory of a memory - you look back and suddenly it's only there behind a foggy haze of abstraction. not that you don't remember it anymore but as you dredge it up for the first time in months it suddenly doesn't feel like it means anything to you anymore, like it's someone elses memories that you just still know how to talk about through some residual process. the story is still lodged there somewhere but you're missing the emotional conclusions attached. that's why you tried to write your essay six months ago, because you knew that everything flowed through your fingers like this and that now when you look back on V's comments, the ones telling you to flesh the scenes out into something with real depth, you won't be able to anymore, won't remember what any of it meant.

`.replace('\n', '');

var sentences = [];
for (const sentence of text.split(".")) {
    if (sentence.length) {
        sentences.push(sentence + ".")
    }
}

var assembled = "";
for (var i = 0; i < sentences.length; i++) {
    const idx = Math.floor(Math.random() * sentences.length);
    var taken = sentences.splice(idx, 1)
    assembled += taken;
}

const words = assembled.split(" ").map(x => x.trim().replaceAll('\n', '')).filter(x => x.length > 1);

var mouseX = window.innerWidth / 2;
var mouseY = window.innerHeight / 2;

const n = words.length;

var texts = []; // { el, x, y }
const container = document.getElementById("container");

window.addEventListener("load", async () => {
    const fragment = document.createDocumentFragment();
    for (let i = 0; i < n; i++) {
        const span = document.createElement("span");
        span.textContent = words[i] + " ";
        fragment.appendChild(span);
        texts.push({ el: span, x: 0, y: 0 });
    }
    container.appendChild(fragment); // single DOM write

    if (document.fonts && document.fonts.ready) {
        await document.fonts.ready;
    }
    updatePositions();
});

function updatePositions() {
    for (const item of texts) {
        const rect = item.el.getBoundingClientRect();
        item.x = rect.left + rect.width / 2;
        item.y = rect.top + rect.height / 2;
    }
}

window.addEventListener("resize", updatePositions);

// Simple 2D value noise
const _noiseP = new Uint8Array(512);
(function() {
    const p = new Uint8Array(256);
    for (let i = 0; i < 256; i++) p[i] = i;
    for (let i = 255; i > 0; i--) {
        const j = Math.floor(Math.random() * (i + 1));
        [p[i], p[j]] = [p[j], p[i]];
    }
    _noiseP.set(p); _noiseP.set(p, 256);
})();
function _fade(t) { return t * t * t * (t * (t * 6 - 15) + 10); }
function _lerp(a, b, t) { return a + t * (b - a); }
function _grad(hash, x, y) {
    const h = hash & 3;
    return ((h & 1) ? -x : x) + ((h & 2) ? -y : y);
}
function noise2d(x, y) {
    const xi = Math.floor(x) & 255, yi = Math.floor(y) & 255;
    const xf = x - Math.floor(x), yf = y - Math.floor(y);
    const u = _fade(xf), v = _fade(yf);
    const aa = _noiseP[_noiseP[xi] + yi], ab = _noiseP[_noiseP[xi] + yi + 1];
    const ba = _noiseP[_noiseP[xi + 1] + yi], bb = _noiseP[_noiseP[xi + 1] + yi + 1];
    return _lerp(
        _lerp(_grad(aa, xf, yf), _grad(ba, xf - 1, yf), u),
        _lerp(_grad(ab, xf, yf - 1), _grad(bb, xf - 1, yf - 1), u), v
    );
}

// Smoothed mouse velocity
var velX = 0, velY = 0;
var prevMouseX = mouseX, prevMouseY = mouseY;
var lastTime = 0;

function updateOpacity(time) {
    const t = time * 0.001;
    const dt = lastTime ? (time - lastTime) * 0.001 : 0.016;
    lastTime = time;

    // Smooth velocity with exponential decay
    const rawVX = (mouseX - prevMouseX) / Math.max(dt, 0.001);
    const rawVY = (mouseY - prevMouseY) / Math.max(dt, 0.001);
    prevMouseX = mouseX; prevMouseY = mouseY;
    const smoothing = Math.exp(-8 * dt);
    velX = velX * smoothing + rawVX * (1 - smoothing);
    velY = velY * smoothing + rawVY * (1 - smoothing);
    const speed = Math.hypot(velX, velY);
    const velAngle = Math.atan2(velY, velX);

    // Orbiting sub-blobs
    const subBlobs = [
        { dist: 170, r: 160, speed: 0.3,  phase: 0 },
        { dist: 285, r: 70, speed: -0.2, phase: 1.1 },
        { dist: 185, r: 70, speed: -0.2, phase: 3.1 },
        { dist: 160, r: 55, speed: 0.15, phase: 4.2 },
    ];

    // Animate base radius with noise
    const baseRadius = 250 + 50 * noise2d(t * 0.3, 0.0) + 10 * noise2d(0.0, t * 0.5);
    const smoothBase = 18;

    // Velocity stretch factor
    const stretch = Math.min(speed * 0.08, 40);

    for (let i = 0; i < texts.length; i++) {
        const x = texts[i].x;
        const y = texts[i].y;

        const dx = x - mouseX;
        const dy = y - mouseY;
        const r = Math.hypot(dx, dy);
        const theta = Math.atan2(dy, dx);

        const ct = Math.cos(theta), st = Math.sin(theta);

        // Low-order shape: big slow lobes that make it clearly non-circular
        const lobeShape =
              55 * noise2d(ct * 1.0 + t * 0.15, st * 1.0 - t * 0.12)   // 1-lobe warp
            + 45 * noise2d(ct * 2.0 - t * 0.1 + 5.3, st * 2.0 + t * 0.18 + 8.1)  // 2-lobe
            + 130 * noise2d(ct * 3.0 + t * 0.22 + 13.0, st * 3.0 - t * 0.08 + 21.0); // 3-lobe

        // High-frequency detail on top
        let detailNoise = 0, amp = 15, freq = 6;
        for (let o = 0; o < 3; o++) {
            detailNoise += amp * noise2d(ct * freq + t * (0.3 + o * 0.15) + o * 31.7,
                                         st * freq - t * (0.25 + o * 0.1) + o * 17.3);
            amp *= 0.5; freq *= 2;
        }
        const boundaryNoise = lobeShape + detailNoise;

        // Velocity elongation: extend radius in direction of movement
        const velDot = speed > 10 ? Math.cos(theta - velAngle) : 0;
        const velBonus = Math.max(velDot, 0) * stretch;

        const effectiveRadius = baseRadius + boundaryNoise + velBonus;

        // Main blob contribution (sigmoid distance)
        const mainVal = 1 / (1 + Math.exp((r - effectiveRadius) / smoothBase));

        // Sub-blob contributions
        let subVal = 0;
        for (const blob of subBlobs) {
            const bAngle = blob.phase + t * blob.speed;
            const bx = mouseX + Math.cos(bAngle) * blob.dist;
            const by = mouseY + Math.sin(bAngle) * blob.dist;
            const bd = Math.hypot(x - bx, y - by);
            const bTheta = Math.atan2(y - by, x - bx);
            const bNoise = noise2d(Math.cos(bTheta) * 1.2 + t * 0.6 + blob.phase,
                                   Math.sin(bTheta) * 1.2 - t * 0.4) * 15;
            subVal = Math.max(subVal, 1 / (1 + Math.exp((bd - blob.r - bNoise) / 12)));
        }

        // Combine: soft union of main blob + sub-blobs
        const val = Math.max(mainVal, subVal * 0.55);
        texts[i].el.style.opacity = val > 0.1 ? val : 0.1;
    }
}

function minDx(x) { }

function updateTexts() {
    for (let i = 0; i < texts.length; i++) {
        if (texts[i].el.style.opacity == 0) continue;
        const orig = words[i];

        let newText = "";

        for (let j = 0; j < orig.length; j++) {
            const char = orig[j];
            if (Math.random() < 0.005) {
                newText += orig[Math.floor(Math.random() * orig.length)];
            } else {
                newText += char;
            }
        }

        if (Math.random() < 0.01) {
            texts[i].el.style.textDecoration = "line-through";
            texts[i].el.style.textDecorationThickness = "2px";
            texts[i].el.style.fontStyle = "normal";
        } else if (Math.random() < 0.01) {
            texts[i].el.style.fontStyle = "italic";
        } else {
            texts[i].el.style.textDecoration = "none";
            texts[i].el.style.fontStyle = "normal";
        }

        texts[i].el.textContent = newText + " ";
    }
}

const trail = [];
let trail_add_ms = 0;

// window.addEventListener("mousemove", (e) => {
//     mouseX = e.pageX;
//     mouseY = e.pageY;

//     if (Date.now() - trail_add_ms > 100) {
//         trail_add_ms = Date.now();
//         trail.unshift({ x: mouseX, y: mouseY });
//         if (trail.length > 5) {
//             trail.pop();
//         }
//     }
// });

function animateLoop(time) {
    updateOpacity(time);
    requestAnimationFrame(animateLoop);
}
requestAnimationFrame(animateLoop);



setInterval(() => {
    updateTexts();
}, 2000);

updateTexts();