Image Text Label Adder

function processImage(
    originalImg, 
    text = "Не входить", 
    positionX = 50, 
    positionY = 50, 
    fontSize = 48, 
    fontColor = "#ffffff", 
    bgColor = "rgba(0, 0, 0, 0.6)", 
    padding = 20, 
    fontFamily = "Arial, sans-serif",
    borderRadius = 12
) {
    // Parse numeric inputs just in case they are passed as strings
    positionX = Number(positionX);
    positionY = Number(positionY);
    fontSize = Number(fontSize);
    padding = Number(padding);
    borderRadius = Number(borderRadius);

    const canvas = document.createElement('canvas');
    canvas.width = originalImg.width;
    canvas.height = originalImg.height;
    const ctx = canvas.getContext('2d');

    // Draw the original image
    ctx.drawImage(originalImg, 0, 0);

    // Support for multiple lines if the user inputs literal \n or actual line breaks
    const textString = String(text).replace(/\\n/g, '\n');
    const lines = textString.split('\n');

    ctx.font = `bold ${fontSize}px ${fontFamily}`;
    ctx.textBaseline = 'top';
    ctx.textAlign = 'left';

    // Calculate bounding box dimensions
    let maxTextWidth = 0;
    lines.forEach(line => {
        const metrics = ctx.measureText(line);
        if (metrics.width > maxTextWidth) {
            maxTextWidth = metrics.width;
        }
    });

    const lineHeight = fontSize * 1.2;
    const totalTextHeight = lines.length * lineHeight;
    
    const boxWidth = maxTextWidth + (padding * 2);
    const boxHeight = totalTextHeight + (padding * 2);

    // Ensure the box stays within canvas bounds if it exceeds
    if (positionX + boxWidth > canvas.width) {
        positionX = Math.max(0, canvas.width - boxWidth);
    }
    if (positionY + boxHeight > canvas.height) {
        positionY = Math.max(0, canvas.height - boxHeight);
    }

    // Draw the background label box
    if (bgColor && bgColor.toLowerCase() !== 'transparent') {
        ctx.fillStyle = bgColor;
        if (typeof ctx.roundRect === 'function') {
            ctx.beginPath();
            ctx.roundRect(positionX, positionY, boxWidth, boxHeight, borderRadius);
            ctx.fill();
        } else {
            // Fallback for older browsers that don't support roundRect
            ctx.fillRect(positionX, positionY, boxWidth, boxHeight);
        }
    }

    // Draw the text
    ctx.fillStyle = fontColor;
    lines.forEach((line, index) => {
        const lineY = positionY + padding + (index * lineHeight);
        ctx.fillText(line, positionX + padding, lineY);
    });

    return canvas;
}