Image Weathered Brass Filter Effect

function processImage(originalImg, tintR = 170, tintG = 130, tintB = 70, tintIntensity = 0.8, contrast = 30, brightness = -20) {
    // Ensure parameters are numeric for calculations
    const numTintR = Number(tintR);
    const numTintG = Number(tintG);
    const numTintB = Number(tintB);
    let numTintIntensity = Number(tintIntensity);
    const numContrast = Number(contrast);
    const numBrightness = Number(brightness);

    // Validate and clamp tintIntensity to the [0, 1] range
    numTintIntensity = Math.max(0, Math.min(1, numTintIntensity));

    const canvas = document.createElement('canvas');
    const ctx = canvas.getContext('2d');

    // Use naturalWidth/Height for true image dimensions, fallback to width/height
    canvas.width = originalImg.naturalWidth || originalImg.width;
    canvas.height = originalImg.naturalHeight || originalImg.height;

    // Draw the original image onto the canvas
    ctx.drawImage(originalImg, 0, 0, canvas.width, canvas.height);

    // Get image data
    const imageData = ctx.getImageData(0, 0, canvas.width, canvas.height);
    const data = imageData.data; // This is a Uint8ClampedArray

    // Calculate contrast factor
    // Map contrast from user range (-100 to 100) to internal calculation range
    const mappedContrast = (numContrast / 100) * 127; // Range roughly -127 to 127
    // Standard contrast formula factor
    const contrastFactor = (259 * (mappedContrast + 255)) / (255 * (259 - mappedContrast));

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

        // 1. Convert to grayscale (luminosity method)
        const gray = 0.299 * r + 0.587 * g + 0.114 * b;

        // 2. Apply Brass Tint
        // Calculate the "fully tinted" color based on the grayscale value and target tint color
        const r_fully_tinted = gray * (numTintR / 255.0);
        const g_fully_tinted = gray * (numTintG / 255.0);
        const b_fully_tinted = gray * (numTintB / 255.0);

        // Interpolate between pure grayscale and the "fully tinted" color
        let R_channel = gray * (1 - numTintIntensity) + r_fully_tinted * numTintIntensity;
        let G_channel = gray * (1 - numTintIntensity) + g_fully_tinted * numTintIntensity;
        let B_channel = gray * (1 - numTintIntensity) + b_fully_tinted * numTintIntensity;
        
        // 3. Apply Contrast
        R_channel = contrastFactor * (R_channel - 128) + 128;
        G_channel = contrastFactor * (G_channel - 128) + 128;
        B_channel = contrastFactor * (B_channel - 128) + 128;

        // 4. Apply Brightness
        R_channel += numBrightness;
        G_channel += numBrightness;
        B_channel += numBrightness;

        // 5. Assign new values. Uint8ClampedArray handles clamping to 0-255 and NaN to 0.
        data[i] = R_channel;
        data[i+1] = G_channel;
        data[i+2] = B_channel;
        // Alpha channel (data[i+3]) remains unchanged
    }

    // Put the modified image data back onto the canvas
    ctx.putImageData(imageData, 0, 0);

    return canvas;
}