Image Gingerbread/Wish/Spoon Sticker Adder

function processImage(originalImg, stickerType = "gingerbread", sizeMultiplier = "0.3", position = "bottom-right") {
    // 1. Setup Canvas
    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);

    // 2. Parse configurations and strings
    let typeStr = String(stickerType).toLowerCase();
    let emoji = "";
    let text = "";

    // Determine sticker content based on typical "Держи ..." meme formats
    if (typeStr.includes("wish") || typeStr.includes("желани")) {
        emoji = "✨🎁";
        text = "ДЕРЖИ ЖЕЛАНИЕ!";
    } else if (typeStr.includes("spoon") || typeStr.includes("ложеч") || typeStr.includes("ложк")) {
        emoji = "🥄";
        text = "ДЕРЖИ ЛОЖЕЧКУ!";
    } else {
        emoji = "🍪";
        text = "ДЕРЖИ ПРЯНИК!";
    }

    let numSize = parseFloat(sizeMultiplier);
    if (isNaN(numSize) || numSize <= 0) numSize = 0.3;

    // 3. Layout Dimensions Calculation
    // Use the shortest dimension to avoid sticker escaping the screen vertically or horizontally
    const minDim = Math.min(canvas.width, canvas.height); 
    const baseFontSize = minDim * numSize * 0.25; 
    
    // Text metrics
    ctx.font = `bold ${baseFontSize}px Impact, "Comic Sans MS", sans-serif`;
    const textMetrics = ctx.measureText(text);
    const textWidth = textMetrics.width;

    // Emoji metrics
    const emojiFontSize = baseFontSize * 1.5;
    ctx.font = `${emojiFontSize}px "Apple Color Emoji", "Segoe UI Emoji", "Noto Color Emoji", sans-serif`;
    const emojiMetrics = ctx.measureText(emoji);
    const emojiWidth = emojiMetrics.width;

    // Total boundaries for the sticker 'pill'
    const padding = baseFontSize * 0.7;
    const srtW = textWidth + emojiWidth + padding * 3.5;
    const srtH = Math.max(baseFontSize, emojiFontSize) + padding * 1.5;

    // 4. Calculate coordinates based on requested position
    let x, y;
    const margin = padding * 1.5;

    // Resolve X position
    if (String(position).includes("left")) {
        x = srtW / 2 + margin;
    } else if (String(position).includes("center") && !String(position).includes("left") && !String(position).includes("right")) {
        x = canvas.width / 2;
    } else {
        // Default to right
        x = canvas.width - srtW / 2 - margin;
    }

    // Resolve Y position
    if (String(position).includes("top")) {
        y = srtH / 2 + margin;
    } else if (String(position).includes("center") && !String(position).includes("top") && !String(position).includes("bottom")) {
        y = canvas.height / 2;
    } else {
        // Default to bottom
        y = canvas.height - srtH / 2 - margin;
    }

    // Keep within bounds
    x = Math.max(srtW / 2, Math.min(canvas.width - srtW / 2, x));
    y = Math.max(srtH / 2, Math.min(canvas.height - srtH / 2, y));

    // 5. Draw the graphical Sticker
    ctx.save();
    ctx.translate(x, y);
    // Give it a playful tilt typical of digital stickers
    ctx.rotate(-6 * Math.PI / 180);

    // Setup sticker drop-shadow
    ctx.shadowColor = "rgba(0, 0, 0, 0.45)";
    ctx.shadowBlur = Math.max(4, minDim * 0.015);
    ctx.shadowOffsetY = Math.max(2, minDim * 0.01);

    // Pill background path
    ctx.fillStyle = "#ffffff";
    ctx.beginPath();
    const rx = -srtW / 2;
    const ry = -srtH / 2;
    const r = srtH / 2; 

    // Support both older browsers and newer roundRect API
    if (ctx.roundRect) {
        ctx.roundRect(rx, ry, srtW, srtH, r);
    } else {
        ctx.moveTo(rx + r, ry);
        ctx.lineTo(rx + srtW - r, ry);
        ctx.arcTo(rx + srtW, ry, rx + srtW, ry + r, r);
        ctx.lineTo(rx + srtW, ry + srtH - r);
        ctx.arcTo(rx + srtW, ry + srtH, rx + srtW - r, ry + srtH, r);
        ctx.lineTo(rx + r, ry + srtH);
        ctx.arcTo(rx, ry + srtH, rx, ry + srtH - r, r);
        ctx.lineTo(rx, ry + r);
        ctx.arcTo(rx, ry, rx + r, ry, r);
        ctx.closePath();
    }
    ctx.fill();

    // Minor border line to separate identical colors
    ctx.shadowColor = "transparent"; // disable shadow for interior components
    ctx.lineWidth = Math.max(1.5, baseFontSize * 0.05);
    ctx.strokeStyle = "#e2e8f0";
    ctx.stroke();

    // 6. Draw Content (Emoji + Text)
    ctx.textBaseline = "middle";
    ctx.textAlign = "left";

    // Draw Emoji
    ctx.font = `${emojiFontSize}px "Apple Color Emoji", "Segoe UI Emoji", "Noto Color Emoji", sans-serif`;
    ctx.fillText(emoji, rx + padding, 0);

    // Draw Meme Text
    ctx.font = `bold ${baseFontSize}px Impact, "Comic Sans MS", sans-serif`;
    ctx.fillStyle = "#1e293b";
    // Tweak X origin for the text slightly right of the emoji
    ctx.fillText(text, rx + padding * 2 + emojiWidth, 0);

    ctx.restore();

    return canvas;
}