function processImage(originalImg, preserveDimension = 'auto') {
const targetRatio = 2.55; // Aspect ratio 2.55:1
const originalWidth = originalImg.width;
const originalHeight = originalImg.height;
const originalRatio = originalWidth / originalHeight;
let newWidth, newHeight;
// Determine the new dimensions based on the preserveDimension parameter
if (preserveDimension === 'width') {
newWidth = originalWidth;
newHeight = originalWidth / targetRatio;
} else if (preserveDimension === 'height') {
newHeight = originalHeight;
newWidth = originalHeight * targetRatio;
} else {
// 'auto' mode: keeps the larger pixel dimension and stretches the other to prevent resolution loss
if (originalRatio > targetRatio) {
// Original image is proportionally wider than 2.55
// Keep the width and increase the height to stretch
newWidth = originalWidth;
newHeight = originalWidth / targetRatio;
} else {
// Original image is proportionally taller than 2.55
// Keep the height and increase the width to stretch
newHeight = originalHeight;
newWidth = originalHeight * targetRatio;
}
}
// Create the canvas and set the calculated dimensions
const canvas = document.createElement('canvas');
canvas.width = Math.max(1, Math.round(newWidth));
canvas.height = Math.max(1, Math.round(newHeight));
// Draw and stretch the image to fit the new canvas size completely
const ctx = canvas.getContext('2d');
ctx.drawImage(originalImg, 0, 0, canvas.width, canvas.height);
return canvas;
}This tool allows users to adjust the dimensions of an image to fit a specific 2.55:1 aspect ratio. It provides options to resize the image by preserving either its width or height, or to automatically adjust dimensions to prevent resolution loss. This tool is useful for creators needing to format images for ultra-wide cinematic displays, specific panoramic presentations, or specialized digital signage that requires a non-standard wide aspect ratio.