Chuner Image Effect Generator

function processImage(originalImg, rgbShift = 5, scanlineIntensity = 0.2, noiseLevel = 15) {
    const canvas = document.createElement('canvas');
    const width = originalImg.width;
    const height = originalImg.height;
    canvas.width = width;
    canvas.height = height;
    
    const ctx = canvas.getContext('2d');
    ctx.drawImage(originalImg, 0, 0, width, height);
    
    const imgData = ctx.getImageData(0, 0, width, height);
    const data = imgData.data;
    
    // Clone image data for reference so we don't read modified pixels during the shift
    const copyData = new Uint8ClampedArray(data);
    
    const shift = Number(rgbShift) || 0;
    const intensity = Number(scanlineIntensity) || 0;
    const noiseAmt = Number(noiseLevel) || 0;
    
    for (let y = 0; y < height; y++) {
        // Create an alternating scanline pattern typical in "Tuner" effects
        const isScanline = (y % 4) < 2; 
        const scanlineMultiplier = isScanline ? (1 - intensity) : 1;
        
        for (let x = 0; x < width; x++) {
            const i = (y * width + x) * 4;
            
            // Chromatic aberration (RGB shift)
            const shiftRX = Math.min(width - 1, x + shift);
            const iR = (y * width + shiftRX) * 4;
            
            const shiftBX = Math.max(0, x - shift);
            const iB = (y * width + shiftBX) * 4;
            
            // Read shifted channels from the clean copy
            let r = copyData[iR];
            let g = copyData[i + 1];
            let b = copyData[iB + 2];
            
            // Static noise generation
            const noise = (Math.random() - 0.5) * 2 * noiseAmt;
            
            // Apply noise and scanline darkening, then clamp to 0-255 bounds
            data[i] = Math.min(255, Math.max(0, (r + noise) * scanlineMultiplier));
            data[i+1] = Math.min(255, Math.max(0, (g + noise) * scanlineMultiplier));
            data[i+2] = Math.min(255, Math.max(0, (b + noise) * scanlineMultiplier));
            data[i+3] = copyData[i+3]; // Keep original alpha
        }
    }
    
    ctx.putImageData(imgData, 0, 0);
    return canvas;
}