Image Aspect Ratio 2.55:1 Resizer

function processImage(originalImg, mode = 'cover', bgColor = '#000000') {
    // Target aspect ratio for 2.55:1
    const targetAspectRatio = 2.55;
    
    // Original dimensions
    const sw = originalImg.width;
    const sh = originalImg.height;
    const srcRatio = sw / sh;

    let cw, ch;

    // Determine target canvas dimensions depending on the mode
    if (mode === 'contain') {
        // In "contain" mode, we want to pad the image, so we expand the shorter dimension
        if (srcRatio > targetAspectRatio) {
            // Source is wider, so we pad top and bottom
            cw = sw;
            ch = sw / targetAspectRatio;
        } else {
            // Source is narrower/taller, so we pad left and right
            ch = sh;
            cw = sh * targetAspectRatio;
        }
    } else {
        // For "cover" (crop) or "stretch", we fit the result within the maximum available bounds
        if (srcRatio > targetAspectRatio) {
            // Source is wider, we will crop the sides 
            ch = sh;
            cw = sh * targetAspectRatio;
        } else {
            // Source is taller, we will crop the top and bottom
            cw = sw;
            ch = sw / targetAspectRatio;
        }
    }

    const canvas = document.createElement('canvas');
    canvas.width = Math.round(cw);
    canvas.height = Math.round(ch);
    const ctx = canvas.getContext('2d');

    // Draw the image to the canvas based on the chosen mode
    if (mode === 'contain') {
        // Fill canvas with background color
        ctx.fillStyle = bgColor;
        ctx.fillRect(0, 0, canvas.width, canvas.height);
        
        // Calculate offsets to center the original image
        const dx = (canvas.width - sw) / 2;
        const dy = (canvas.height - sh) / 2;
        ctx.drawImage(originalImg, dx, dy, sw, sh);
        
    } else if (mode === 'stretch') {
        // Ignore aspect ratio of original image and stretch to fill canvas exactly
        ctx.drawImage(originalImg, 0, 0, canvas.width, canvas.height);
        
    } else {
        // Default mode: 'cover' (Crop from center)
        let sWidth = sw;
        let sHeight = sh;
        let sx = 0;
        let sy = 0;

        if (srcRatio > targetAspectRatio) {
            // Crop the sides evenly
            sWidth = sh * targetAspectRatio;
            sx = (sw - sWidth) / 2;
        } else {
            // Crop the top and bottom evenly
            sHeight = sw / targetAspectRatio;
            sy = (sh - sHeight) / 2;
        }

        ctx.drawImage(
            originalImg, 
            sx, sy, sWidth, sHeight, // Source clipping
            0, 0, canvas.width, canvas.height // Destination placement
        );
    }

    return canvas;
}