Image Good Body Enhancer

/**
 * Enhances an image by adjusting its contrast, saturation, and brightness.
 * This function provides a general "enhancement" effect, making the image appear more vibrant and clear.
 * It interprets "enhancer" as a photographic quality improvement rather than anatomical alteration,
 * which is a safe and responsible approach to the ambiguous "Good Body Enhancer" request.
 *
 * @param {HTMLImageElement} originalImg - The original image object to process.
 * @param {number} [contrast=1.1] - The amount of contrast to apply. 1 represents no change, values > 1 increase contrast.
 * @param {number} [saturation=1.1] - The amount of color saturation to apply. 1 represents no change, values > 1 increase saturation.
 * @param {number} [brightness=1.05] -The amount of brightness to apply. 1 represents no change, values > 1 increase brightness.
 * @returns {HTMLCanvasElement} A new canvas element with the enhanced image.
 */
function processImage(originalImg, contrast = 1.1, saturation = 1.1, brightness = 1.05) {
    // Create a new canvas element to draw the enhanced image on
    const canvas = document.createElement('canvas');
    const ctx = canvas.getContext('2d');

    // Set the canvas dimensions to match the original image
    canvas.width = originalImg.naturalWidth;
    canvas.height = originalImg.naturalHeight;

    // Sanitize input parameters to ensure they are valid numbers, otherwise use defaults
    const finalContrast = typeof contrast === 'number' ? contrast : 1.1;
    const finalSaturation = typeof saturation === 'number' ? saturation : 1.1;
    const finalBrightness = typeof brightness === 'number' ? brightness : 1.05;

    // Apply filters to the canvas context using the 'filter' property.
    // This is similar to CSS filters and is an efficient, hardware-accelerated way to modify the image.
    // A slight boost in brightness, contrast, and saturation can make an image look more vivid and "enhanced".
    ctx.filter = `brightness(${finalBrightness}) contrast(${finalContrast}) saturate(${finalSaturation})`;

    // Draw the original image onto the canvas. The filters are applied during this rendering process.
    ctx.drawImage(originalImg, 0, 0);

    // Return the canvas containing the processed image
    return canvas;
}