Image Brushed Aluminum Filter Effect Tool

function processImage(originalImg, grainAmount = 25, streakAmount = 40, brightness = -10, contrast = 1.4) {
    const canvas = document.createElement('canvas');
    const ctx = canvas.getContext('2d');
    
    const width = originalImg.naturalWidth || originalImg.width;
    const height = originalImg.naturalHeight || originalImg.height;

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

    // Draw the original image onto the canvas
    ctx.drawImage(originalImg, 0, 0, width, height);
    
    // Get image data
    const imageData = ctx.getImageData(0, 0, width, height);
    const data = imageData.data;

    // Pre-generate a noise profile for vertical variations (basis of main horizontal streaks)
    // This creates a random offset for each row.
    const verticalNoiseProfile = new Float32Array(height);
    for (let y = 0; y < height; y++) {
        verticalNoiseProfile[y] = (Math.random() - 0.5); // Random value between -0.5 and 0.5
    }

    const fineStreakScale = streakAmount * 0.4; // Defines the amplitude of finer horizontal variations within a streak
    const fineStreakPersistence = 0.7; // How much the fine streak detail carries over to the next pixel horizontally (0 to 1)

    // Process each pixel
    for (let y = 0; y < height; y++) {
        // Base streakiness for the entire current row
        const baseRowStreakiness = verticalNoiseProfile[y] * streakAmount;

        // Initialize the fine streak value for the beginning of the row
        let currentFineStreakVal = (Math.random() - 0.5) * fineStreakScale;

        for (let x = 0; x < width; x++) {
            const i = (y * width + x) * 4; // Index for the current pixel's red component
            
            const r = data[i];
            const g = data[i + 1];
            const b = data[i + 2];

            // 1. Convert to grayscale using luminance formula
            let gray = 0.299 * r + 0.587 * g + 0.114 * b;

            // 2. Apply streak effect
            // Update fine streak value with some persistence to create horizontal elongation
            // This uses an autoregressive model (AR1) to make the noise smoother along X
            currentFineStreakVal = currentFineStreakVal * fineStreakPersistence +
                                   (Math.random() - 0.5) * fineStreakScale * (1.0 - fineStreakPersistence);
            
            const streakEffect = baseRowStreakiness + currentFineStreakVal;
            gray += streakEffect;
            
            // 3. Add overall grain (isotropic noise)
            gray += (Math.random() - 0.5) * grainAmount;

            // 4. Apply brightness & contrast
            // Apply contrast first, then brightness
            if (contrast !== 1.0) { 
                gray = (gray - 128) * contrast + 128;
            }
            if (brightness !== 0) {
                gray += brightness;
            }
            
            // Clamp the gray value to the [0, 255] range
            gray = Math.max(0, Math.min(255, gray | 0)); // Use bitwise OR 0 for faster floor

            // Set RGB channels to the new gray value
            data[i] = gray;
            data[i + 1] = gray;
            data[i + 2] = gray;
            // Alpha (data[i + 3]) remains unchanged
        }
    }

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