Image Nuclear Reactor Filter Effect Tool

function processImage(originalImg, intensity = 0.9, coreColorStr = "0,180,0", highlightColorStr = "150,255,150", noiseLevel = 0.05) {
    const canvas = document.createElement('canvas');
    const ctx = canvas.getContext('2d');

    const imgWidth = originalImg.naturalWidth;
    const imgHeight = originalImg.naturalHeight;

    // If image is not loaded or has no dimensions, return an empty canvas.
    if (!imgWidth || !imgHeight) {
        console.error("Image not loaded or has zero dimensions. Returning an empty canvas.");
        // Ensure canvas has a size, even if 0x0, to be a valid return.
        canvas.width = 0; 
        canvas.height = 0;
        return canvas;
    }

    canvas.width = imgWidth;
    canvas.height = imgHeight;

    ctx.drawImage(originalImg, 0, 0, imgWidth, imgHeight);

    let imageData;
    try {
        imageData = ctx.getImageData(0, 0, imgWidth, imgHeight);
    } catch (e) {
        // This can happen if the image is from a tainted origin (CORS)
        console.error("Could not get image data, possibly due to CORS policy. Error:", e);
        // Return the canvas with the original image drawn, as processing is not possible.
        return canvas;
    }
    
    const data = imageData.data;

    // Sanitize control parameters
    // Intensity: 0 (original image) to 1 (full effect)
    const cleanIntensity = Math.max(0, Math.min(1, Number(intensity)));
    // NoiseLevel: 0 (no noise) to 1 (significant noise), can be higher for more extreme noise.
    const cleanNoiseLevel = Math.max(0, Number(noiseLevel));

    const parseAndClampColor = (colorStrInput) => {
        // Ensure colorStrInput is a string before splitting
        const colorStr = String(colorStrInput);
        const arr = colorStr.split(',').map(c => Number(c.trim()));
        return [
            Math.max(0, Math.min(255, arr[0] || 0)), // Default to 0 if component is NaN or missing
            Math.max(0, Math.min(255, arr[1] || 0)),
            Math.max(0, Math.min(255, arr[2] || 0))
        ];
    };
    
    const coreColor = parseAndClampColor(coreColorStr);
    const highlightColor = parseAndClampColor(highlightColorStr);

    for (let i = 0; i < data.length; i += 4) {
        const r = data[i];
        const g = data[i+1];
        const b = data[i+2];
        const a = data[i+3];

        // Skip fully transparent pixels - they remain transparent
        if (a === 0) {
            continue;
        }

        // 1. Calculate Luminance (standard Rec. 709 weights for perceptual brightness)
        const luminance = 0.2126 * r + 0.7152 * g + 0.0722 * b;
        const t = luminance / 255; // Normalized luminance (0 to 1)

        // 2. Determine base effect color by interpolating between coreColor (for dark areas)
        //    and highlightColor (for bright areas) based on luminance.
        let effR = (1 - t) * coreColor[0] + t * highlightColor[0];
        let effG = (1 - t) * coreColor[1] + t * highlightColor[1];
        let effB = (1 - t) * coreColor[2] + t * highlightColor[2];

        // 3. Add noise to the effect color
        if (cleanNoiseLevel > 0) {
            // Noise value range is roughly +/- (50 * cleanNoiseLevel)
            // E.g., if cleanNoiseLevel is 0.1, noise is +/- 5.
            // If cleanNoiseLevel is 1, noise is +/- 50.
            const noise = (Math.random() - 0.5) * 100 * cleanNoiseLevel; 
            effR += noise;
            effG += noise;
            effB += noise;
        }

        // Clamp effect color components to [0, 255] after noise and interpolation
        effR = Math.max(0, Math.min(255, effR));
        effG = Math.max(0, Math.min(255, effG));
        effB = Math.max(0, Math.min(255, effB));

        // 4. Blend the original pixel color with the calculated effect color
        //    using the cleaned intensity factor.
        data[i]   = Math.max(0, Math.min(255, (1 - cleanIntensity) * r + cleanIntensity * effR));
        data[i+1] = Math.max(0, Math.min(255, (1 - cleanIntensity) * g + cleanIntensity * effG));
        data[i+2] = Math.max(0, Math.min(255, (1 - cleanIntensity) * b + cleanIntensity * effB));
        // Alpha channel is preserved from the original image
        data[i+3] = a; 
    }

    ctx.putImageData(imageData, 0, 0);
    return canvas;
}