Image Resizer And Enhancer

function processImage(originalImg, width = 0, height = 0, brightness = 100, contrast = 100, saturation = 100, sharpenAmount = 0) {
    const canvas = document.createElement('canvas');
    const ctx = canvas.getContext('2d');
    
    // Default to proportional original size if width or height are 0 or not provided
    const targetWidth = width > 0 ? Number(width) : (originalImg.naturalWidth || originalImg.width);
    const targetHeight = height > 0 ? Number(height) : (originalImg.naturalHeight || originalImg.height);
    
    canvas.width = targetWidth;
    canvas.height = targetHeight;
    
    // Apply basic enhancement filters: Brightness, Contrast, Saturation
    ctx.filter = `brightness(${Number(brightness)}%) contrast(${Number(contrast)}%) saturate(${Number(saturation)}%)`;
    
    // Draw and resize the original image onto the canvas
    ctx.drawImage(originalImg, 0, 0, targetWidth, targetHeight);
    
    // Reset filter for any further context operations
    ctx.filter = 'none';
    
    // Apply convolution matrix for Sharpening if the amount is greater than 0
    if (sharpenAmount > 0) {
        const imageData = ctx.getImageData(0, 0, targetWidth, targetHeight);
        const data = imageData.data;
        const tempData = new Uint8ClampedArray(data);
        
        // Map sharpenAmount (0-100) to a convolution weight matrix
        // sharpenAmount of 50 translates to a=1 (standard sharpen)
        const a = Math.min(Math.max(Number(sharpenAmount), 0), 100) / 50; 
        const center = 1 + (4 * a);
        const edge = -a;
        
        // Loop through the image pixels (skipping the 1px border to avoid out-of-bounds)
        for (let y = 1; y < targetHeight - 1; y++) {
            for (let x = 1; x < targetWidth - 1; x++) {
                const i = (y * targetWidth + x) * 4;
                
                const top = ((y - 1) * targetWidth + x) * 4;
                const bottom = ((y + 1) * targetWidth + x) * 4;
                const left = (y * targetWidth + (x - 1)) * 4;
                const right = (y * targetWidth + (x + 1)) * 4;
                
                // Apply the matrix to RGB channels
                for (let c = 0; c < 3; c++) {
                    data[i + c] = 
                        (tempData[i + c] * center) +
                        (tempData[top + c] * edge) +
                        (tempData[bottom + c] * edge) +
                        (tempData[left + c] * edge) +
                        (tempData[right + c] * edge);
                }
                // Alpha channel (data[i + 3]) is deliberately kept unchanged
            }
        }
        
        // Put the modified pixel data back onto the canvas
        ctx.putImageData(imageData, 0, 0);
    }
    
    return canvas;
}