Image Of Cafe Baranka

async function processImage(originalImg, textColor = '#6B4F4B', backgroundColor = '#FDF5E6', barankaColor = '#D2B48C', fontSize = 48, fontFamily = 'Comfortaa') {

    /**
     * Dynamically loads a Google Font into the document.
     * @param {string} family - The name of the font family.
     */
    const loadFont = async (family) => {
        const fontId = `google-font-${family.replace(/\s/g, '-')}`;
        if (document.getElementById(fontId)) {
            // Font link already exists, assume it's loaded or loading.
            return;
        }

        const link = document.createElement('link');
        link.id = fontId;
        link.rel = 'stylesheet';
        link.href = `https://fonts.googleapis.com/css2?family=${family.replace(/\s/g, '+')}:wght@400;700&display=swap`;
        document.head.appendChild(link);

        try {
            await document.fonts.load(`12px "${family}"`);
            await document.fonts.load(`bold 12px "${family}"`);
        } catch (e) {
            console.error(`Font ${family} could not be loaded.`, e);
            // The browser will use a fallback font.
        }
    };

    // Load the required font
    await loadFont(fontFamily);

    // Create a canvas element
    const canvas = document.createElement('canvas');
    const ctx = canvas.getContext('2d');

    // Set canvas dimensions
    const width = originalImg ? originalImg.width : 600;
    const height = originalImg ? originalImg.height : 400;
    canvas.width = width;
    canvas.height = height;

    // --- Draw Background ---
    if (originalImg) {
        ctx.drawImage(originalImg, 0, 0, width, height);
        // Add a semi-transparent overlay to make text more readable
        ctx.fillStyle = 'rgba(255, 253, 250, 0.75)';
        ctx.fillRect(0, 0, width, height);
    } else {
        ctx.fillStyle = backgroundColor;
        ctx.fillRect(0, 0, width, height);
    }

    // --- Draw Baranka Graphic ---
    const barankaCenterX = width / 3;
    const barankaCenterY = height / 2;
    const barankaOuterRadius = Math.min(width, height) / 3.5;
    const barankaInnerRadius = barankaOuterRadius * 0.6;

    // Draw shadow for the baranka
    ctx.save();
    ctx.shadowColor = 'rgba(0, 0, 0, 0.25)';
    ctx.shadowBlur = 15;
    ctx.shadowOffsetX = 5;
    ctx.shadowOffsetY = 5;
    
    // Draw the main baranka shape (a torus)
    ctx.beginPath();
    ctx.arc(barankaCenterX, barankaCenterY, barankaOuterRadius, 0, Math.PI * 2, false);
    ctx.arc(barankaCenterX, barankaCenterY, barankaInnerRadius, 0, Math.PI * 2, true); // Create the hole
    ctx.fillStyle = barankaColor;
    ctx.fill();
    ctx.restore();

    // Add a stroke for definition
    ctx.strokeStyle = '#8B4513'; // SaddleBrown
    ctx.lineWidth = 3;
    ctx.stroke();

    // Draw poppy seeds
    ctx.fillStyle = '#333';
    for (let i = 0; i < 60; i++) {
        const angle = Math.random() * 2 * Math.PI;
        // Distribute seeds within the baranka's ring
        const radius = barankaInnerRadius + Math.random() * (barankaOuterRadius - barankaInnerRadius);
        const x = barankaCenterX + Math.cos(angle) * radius;
        const y = barankaCenterY + Math.sin(angle) * radius;
        ctx.beginPath();
        ctx.arc(x, y, 1.5 + Math.random() * 1, 0, Math.PI * 2);
        ctx.fill();
    }

    // --- Draw Text ---
    const textX = width * 0.68;
    const textY = height / 2;

    ctx.fillStyle = textColor;
    ctx.textAlign = 'center';
    ctx.textBaseline = 'middle';

    // Draw "Кафе" (Cafe)
    const cafeFontSize = fontSize * 0.7;
    ctx.font = `${cafeFontSize}px "${fontFamily}", cursive`;
    ctx.fillText("Кафе", textX, textY - fontSize * 0.7);

    // Draw "Баранка" (Baranka)
    ctx.font = `bold ${fontSize}px "${fontFamily}", cursive`;
    ctx.fillText("Баранка", textX, textY + fontSize * 0.2);

    // Add a decorative underline
    ctx.strokeStyle = textColor;
    ctx.lineWidth = 2;
    ctx.beginPath();
    ctx.moveTo(textX - 60, textY + fontSize * 0.8);
    ctx.lineTo(textX + 60, textY + fontSize * 0.8);
    ctx.stroke();

    // Return the final canvas
    return canvas;
}