Image Balance Adjuster Tool

function processImage(originalImg, rotationAngleDegree = 0, redBalance = 0, greenBalance = 0, blueBalance = 0) {
    const canvas = document.createElement('canvas');
    const ctx = canvas.getContext('2d');
    
    // Convert rotation angle to radians
    const angleRad = (Number(rotationAngleDegree) || 0) * Math.PI / 180;
    
    const width = originalImg.width;
    const height = originalImg.height;
    
    // Calculate new canvas dimensions to fully fit the rotated image
    const sin = Math.abs(Math.sin(angleRad));
    const cos = Math.abs(Math.cos(angleRad));
    const newWidth = Math.floor(width * cos + height * sin);
    const newHeight = Math.floor(height * cos + width * sin);
    
    canvas.width = newWidth;
    canvas.height = newHeight;
    
    // Translate to center, rotate, and draw the image to adjust horizon/level balance
    ctx.translate(newWidth / 2, newHeight / 2);
    ctx.rotate(angleRad);
    ctx.drawImage(originalImg, -width / 2, -height / 2);
    
    // Reset transform before working with Image Data
    ctx.setTransform(1, 0, 0, 1, 0, 0);
    
    const rOffset = Number(redBalance) || 0;
    const gOffset = Number(greenBalance) || 0;
    const bOffset = Number(blueBalance) || 0;
    
    // Apply color balance adjustments if requested
    if (rOffset !== 0 || gOffset !== 0 || bOffset !== 0) {
        const imageData = ctx.getImageData(0, 0, canvas.width, canvas.height);
        const data = imageData.data;
        
        for (let i = 0; i < data.length; i += 4) {
            // Skip fully transparent pixels (such as the empty background borders introduced from rotation)
            if (data[i + 3] === 0) continue;
            
            data[i] = Math.max(0, Math.min(255, data[i] + rOffset));         // Red
            data[i+1] = Math.max(0, Math.min(255, data[i+1] + gOffset));     // Green
            data[i+2] = Math.max(0, Math.min(255, data[i+2] + bOffset));     // Blue
        }
        
        ctx.putImageData(imageData, 0, 0);
    }
    
    return canvas;
}