Writer Tools Text Generator

function processImage(
    originalImg,
    text = "Create Writer Tools Text",
    fontSize = 32,
    textColor = "#000000",
    bgColor = "rgba(255, 250, 240, 0.95)",
    padding = 20
) {
    const canvas = document.createElement("canvas");
    canvas.width = Math.max(originalImg.width, 200);
    canvas.height = Math.max(originalImg.height, 200);
    const ctx = canvas.getContext("2d");

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

    // Set font to a classic writer's typewriter style
    ctx.font = `${fontSize}px "Courier New", Courier, monospace`;
    ctx.textBaseline = "top";
    
    // Normalize newlines and prepare for auto-wrapping
    const textLines = text.replace(/\\n/g, '\n').split('\n');
    let wrappedLines = [];
    
    // Auto-wrap text bounded to canvas width
    const maxTextWidth = canvas.width - (padding * 4);
    
    for (let line of textLines) {
        const words = line.split(' ');
        let currentLine = '';
        
        for (let i = 0; i < words.length; i++) {
            const testLine = currentLine + words[i] + ' ';
            const metrics = ctx.measureText(testLine);
            const testWidth = metrics.width;
            
            if (testWidth > maxTextWidth && i > 0) {
                wrappedLines.push(currentLine.trim());
                currentLine = words[i] + ' ';
            } else {
                currentLine = testLine;
            }
        }
        wrappedLines.push(currentLine.trim());
    }

    // Measure total bounding box size based on wrapped lines
    let boxMaxWidth = 0;
    for (let wLine of wrappedLines) {
        const width = ctx.measureText(wLine).width;
        if (width > boxMaxWidth) boxMaxWidth = width;
    }
    
    const lineHeight = fontSize * 1.5;
    const boxWidth = boxMaxWidth + padding * 2;
    const boxHeight = (wrappedLines.length * lineHeight) + padding * 2;
    
    // Center the textbox horizontally and vertically over the image
    const startX = (canvas.width - boxWidth) / 2;
    const startY = (canvas.height - boxHeight) / 2;

    // Draw paper/note background with shadow
    ctx.fillStyle = bgColor;
    ctx.shadowColor = 'rgba(0, 0, 0, 0.5)';
    ctx.shadowBlur = 15;
    ctx.shadowOffsetX = 5;
    ctx.shadowOffsetY = 5;
    ctx.fillRect(Math.max(0, startX), Math.max(0, startY), boxWidth, boxHeight);
    
    // Reset shadow properties before drawing text
    ctx.shadowColor = 'transparent';
    ctx.shadowBlur = 0;
    ctx.shadowOffsetX = 0;
    ctx.shadowOffsetY = 0;

    // Print text lines over the drawn background
    ctx.fillStyle = textColor;
    wrappedLines.forEach((line, index) => {
        ctx.fillText(
            line, 
            Math.max(0, startX) + padding, 
            Math.max(0, startY) + padding + (index * lineHeight)
        );
    });

    return canvas;
}