Image Zodiac Sign Filter Effect Tool

function processImage(
    originalImg,
    zodiacSign = "Aries",
    symbolColor = "rgba(255, 255, 255, 0.8)",
    symbolSizeScale = 0.2, // Relative to min(imageWidth, imageHeight)
    symbolXPercent = 50,   // Horizontal position as percentage (0-100)
    symbolYPercent = 50    // Vertical position as percentage (0-100)
) {
    const canvas = document.createElement('canvas');
    const ctx = canvas.getContext('2d');

    // Ensure image dimensions are valid
    const imgWidth = originalImg.naturalWidth || originalImg.width || 0;
    const imgHeight = originalImg.naturalHeight || originalImg.height || 0;

    canvas.width = imgWidth;
    canvas.height = imgHeight;

    // Draw the original image onto the canvas
    // Do not draw if image dimensions are zero
    if (imgWidth > 0 && imgHeight > 0) {
        ctx.drawImage(originalImg, 0, 0, imgWidth, imgHeight);
    } else {
        // If image is 0x0, there's nothing to draw or process.
        // Still return a canvas of 0x0 as per function signature.
        return canvas;
    }

    // Define Zodiac symbols
    const ZODIAC_SYMBOLS = {
        "aries": "♈",   // U+2648
        "taurus": "♉",  // U+2649
        "gemini": "♊",  // U+264A
        "cancer": "♋",  // U+264B
        "leo": "♌",     // U+264C
        "virgo": "♍",   // U+264D
        "libra": "♎",   // U+264E
        "scorpio": "♏", // U+264F
        "sagittarius": "♐", // U+2650
        "capricorn": "♑", // U+2651
        "aquarius": "♒", // U+2652
        "pisces": "♓"    // U+2653
    };

    // Normalize zodiacSign input
    const normalizedSign = String(zodiacSign).trim().toLowerCase();
    const symbol = ZODIAC_SYMBOLS[normalizedSign] || ZODIAC_SYMBOLS["aries"]; // Default to Aries

    // Validate and parse numeric parameters
    let finalSymbolSizeScale = Number(symbolSizeScale);
    if (isNaN(finalSymbolSizeScale) || finalSymbolSizeScale < 0) {
        finalSymbolSizeScale = 0.2; // Default if invalid (from original default)
    }

    let finalSymbolXPercent = Number(symbolXPercent);
    if (isNaN(finalSymbolXPercent)) {
        finalSymbolXPercent = 50; // Default if invalid
    }

    let finalSymbolYPercent = Number(symbolYPercent);
    if (isNaN(finalSymbolYPercent)) {
        finalSymbolYPercent = 50; // Default if invalid
    }
    
    // Validate symbolColor parameter
    let finalSymbolColor = symbolColor;
    if (typeof symbolColor !== 'string' || symbolColor.trim() === "") {
        finalSymbolColor = "rgba(255, 255, 255, 0.8)"; // Default if invalid
    }


    // Calculate properties for the symbol
    const baseSize = Math.min(imgWidth, imgHeight);
    const fontSize = baseSize * finalSymbolSizeScale;

    // Prevent drawing symbol if its size is effectively zero
    if (fontSize <= 0) {
        return canvas; // Return canvas with only the original image drawn
    }
    
    const x = imgWidth * (finalSymbolXPercent / 100);
    const y = imgHeight * (finalSymbolYPercent / 100);

    // Set text properties for drawing the symbol
    ctx.font = `${fontSize}px sans-serif`; // A generic font family is likely to support Unicode symbols
    ctx.fillStyle = finalSymbolColor;
    ctx.textAlign = "center";
    ctx.textBaseline = "middle";

    // Draw the symbol
    ctx.fillText(symbol, x, y);

    return canvas;
}