Schoolelium Image Effect Generator

function processImage(
    originalImg, 
    inflatePower = "2.5", 
    glitchShift = "15", 
    noiseLevel = "30", 
    posterizeLevels = "5"
) {
    const canvas = document.createElement('canvas');
    const ctx = canvas.getContext('2d');
    
    // Set up canvas dimensions
    const w = originalImg.width;
    const h = originalImg.height;
    canvas.width = w;
    canvas.height = h;

    // Draw initial image
    ctx.drawImage(originalImg, 0, 0);

    // Get pixel data to manipulate
    const imgData = ctx.getImageData(0, 0, w, h);
    const data = imgData.data;
    const tempData = new Uint8ClampedArray(data);

    // Helium/Bulge distortion parameters (Schoolelium effect)
    const cx = w / 2;
    const cy = h / 2;
    const maxR = Math.min(w, h) * 0.6; 
    
    // Convert string parameters to numbers
    let pow = 1 / Math.max(0.1, parseFloat(inflatePower));
    let shift = parseInt(glitchShift, 10);
    let nLvl = parseInt(noiseLevel, 10);
    let pLvls = Math.max(2, parseInt(posterizeLevels, 10));

    for (let y = 0; y < h; y++) {
        for (let x = 0; x < w; x++) {
            
            // 1. Calculate Bulge (Helium) Displacement
            const dx = x - cx;
            const dy = y - cy;
            const dist = Math.sqrt(dx * dx + dy * dy);

            let sx = x;
            let sy = y;

            if (dist < maxR && dist > 0) {
                const r = dist / maxR;
                const r_new = Math.pow(r, pow);
                const new_dist = r_new * maxR;

                sx = cx + (dx / dist) * new_dist;
                sy = cy + (dy / dist) * new_dist;
            }

            // 2. Calculate Chromatic Aberration (Glitch offset mappings)
            let sx_r = Math.max(0, Math.min(w - 1, sx - shift));
            let sx_b = Math.max(0, Math.min(w - 1, sx + shift));

            sx = Math.round(sx);
            sy = Math.round(sy);
            sx_r = Math.round(sx_r);
            sx_b = Math.round(sx_b);
            sy = Math.max(0, Math.min(h - 1, sy));
            sx = Math.max(0, Math.min(w - 1, sx));

            // Map indexes for the 1D pixel array
            const dstIdx = (y * w + x) * 4;
            const srcIdx_R = (sy * w + sx_r) * 4;
            const srcIdx_G = (sy * w + sx) * 4;
            const srcIdx_B = (sy * w + sx_b) * 4;

            let r_val = tempData[srcIdx_R];
            let g_val = tempData[srcIdx_G + 1];
            let b_val = tempData[srcIdx_B + 2];

            // 3. Apply "Horrible" Posterization (Reduces color palette)
            r_val = Math.round(r_val / 255 * pLvls) / pLvls * 255;
            g_val = Math.round(g_val / 255 * pLvls) / pLvls * 255;
            b_val = Math.round(b_val / 255 * pLvls) / pLvls * 255;

            // 4. Over-saturate and Blow Out Contrast (Deep-fried)
            r_val = r_val > 127 ? r_val + 40 : r_val - 40;
            g_val = g_val > 127 ? g_val + 40 : g_val - 40;
            b_val = b_val > 127 ? b_val + 40 : b_val - 40;

            // 5. Inject Static Noise
            const noise = (Math.random() - 0.5) * nLvl * 2;
            r_val += noise;
            g_val += noise;
            b_val += noise;

            // Write back to canvas data array (Uint8ClampedArray clamps automatically 0-255)
            data[dstIdx] = r_val;
            data[dstIdx + 1] = g_val;
            data[dstIdx + 2] = b_val;
            data[dstIdx + 3] = tempData[srcIdx_G + 3]; 
        }
    }

    // Paint the newly mutated pixels back onto the canvas
    ctx.putImageData(imgData, 0, 0);

    return canvas;
}