Image Emerald Glow Filter Effect Tool

function processImage(originalImg) {
    const canvas = document.createElement('canvas');
    const ctx = canvas.getContext('2d');

    // Ensure we use the natural dimensions of the image
    const width = originalImg.naturalWidth || originalImg.width;
    const height = originalImg.naturalHeight || originalImg.height;

    canvas.width = width;
    canvas.height = height;

    ctx.drawImage(originalImg, 0, 0, width, height);

    const imageData = ctx.getImageData(0, 0, width, height);
    const data = imageData.data;

    for (let i = 0; i < data.length; i += 4) {
        let r_orig = data[i];
        let g_orig = data[i + 1];
        let b_orig = data[i + 2];
        // Alpha data[i+3] is preserved

        // 1. Initial Emerald Color Transformation
        // Suppress red significantly
        let r_new = r_orig * 0.1;

        // Green channel is primary for emerald. Boost based on original green,
        // with minor contributions from blue/red, and a base green value.
        // Tuned to avoid oversaturation on mid-tones before glow.
        let g_new = Math.min(255, g_orig * 1.2 + b_orig * 0.15 + r_orig * 0.05 + 10);

        // Blue channel should complement green, generally being less than green.
        // Derived from the new green value and original blue.
        let b_new = Math.min(255, g_new * 0.5 + b_orig * 0.3 + 15);

        // 2. "Glow" Effect Application
        // Calculate a glow factor based on original luminance and greenness.
        // Pixels that were originally bright and/or green will glow more.
        const luminance = (r_orig * 0.299 + g_orig * 0.587 + b_orig * 0.114) / 255; // Normalized 0-1
        const greenFactor = g_orig / 255; // Normalized 0-1

        // Combine luminance and greenness for the glow intensity.
        // Averaging them gives a balanced influence.
        const glowFactor = (luminance + greenFactor) / 2; // Range 0-1

        // Boost green and blue channels based on the glowFactor.
        g_new = Math.min(255, g_new + glowFactor * 60); // Increase green for glow
        b_new = Math.min(255, b_new + glowFactor * 30); // Increase blue for glow (less than green boost)

        // Ensure blue does not overpower green in the final glow, to maintain emerald hue.
        // Emeralds typically have G > B. Cap blue at about 80% of green.
        b_new = Math.min(g_new * 0.8, b_new);

        // Suppress red further in glowing areas to purify the emerald color.
        r_new = Math.max(0, r_new - glowFactor * 50);

        // Assign the new বেঁচে থাকা (RGBA) values
        data[i] = r_new;
        data[i + 1] = g_new;
        data[i + 2] = b_new;
        // data[i + 3] (alpha) remains unchanged
    }

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