Image Text Overlay Adder

function processImage(
    originalImg,
    text = "Обзор текст\nОбразец Текст",
    fontSize = 60,
    fontFamily = "Impact",
    textColor = "#FFFFFF",
    strokeColor = "#000000",
    strokeWidth = 4,
    horizontalAlign = "center",
    verticalAlign = "bottom",
    isBold = 0,
    isItalic = 0
) {
    const canvas = document.createElement('canvas');
    const ctx = canvas.getContext('2d');
    
    canvas.width = originalImg.width;
    canvas.height = originalImg.height;
    
    ctx.drawImage(originalImg, 0, 0);
    
    if (!text) return canvas;
    
    // Support literal \n characters typed in by the user
    const lines = String(text).replace(/\\n/g, '\n').split('\n');
    
    const maxTextWidth = canvas.width * 0.9;
    let currentFontSize = Number(fontSize);
    
    const fontStyles = [];
    if (Number(isItalic) !== 0) fontStyles.push("italic");
    if (Number(isBold) !== 0) fontStyles.push("bold");
    const fontPrefix = fontStyles.length > 0 ? fontStyles.join(" ") + " " : "";
    
    // Auto-scale font size if it exceeds the image width
    let allLinesFit = false;
    while (!allLinesFit && currentFontSize > 10) {
        ctx.font = `${fontPrefix}${currentFontSize}px ${fontFamily}`;
        allLinesFit = true;
        for (let line of lines) {
            if (ctx.measureText(line).width > maxTextWidth) {
                allLinesFit = false;
                currentFontSize -= 2;
                break;
            }
        }
    }
    
    ctx.font = `${fontPrefix}${currentFontSize}px "${fontFamily}"`;
    ctx.textAlign = horizontalAlign === "left" ? "left" : horizontalAlign === "right" ? "right" : "center";
    ctx.textBaseline = "middle";
    
    const lineHeight = currentFontSize * 1.2;
    const totalHeight = lines.length * lineHeight;
    
    // Calculate Y position
    let startY;
    if (verticalAlign === "top") {
        startY = currentFontSize + 10;
    } else if (verticalAlign === "bottom") {
        startY = canvas.height - totalHeight - 10 + currentFontSize / 2;
    } else { // center
        startY = (canvas.height - totalHeight) / 2 + currentFontSize / 2;
    }
    
    // Calculate X position
    let startX;
    if (horizontalAlign === "left") {
        startX = canvas.width * 0.05;
    } else if (horizontalAlign === "right") {
        startX = canvas.width * 0.95;
    } else { // center
        startX = canvas.width / 2;
    }
    
    ctx.fillStyle = String(textColor);
    ctx.strokeStyle = String(strokeColor);
    
    // Scale stroke width proportionally if the font was scaled down
    const actualStrokeWidth = (currentFontSize / Number(fontSize)) * Number(strokeWidth);
    ctx.lineWidth = actualStrokeWidth;
    ctx.lineJoin = "round";
    ctx.miterLimit = 2;
    
    // Draw text lines
    lines.forEach((line, index) => {
        const y = startY + index * lineHeight;
        if (actualStrokeWidth > 0) {
            ctx.strokeText(line, startX, y);
        }
        ctx.fillText(line, startX, y);
    });
    
    return canvas;
}