AI Powered Image Tool Idea Generator

function processImage(originalImg, seedText = "Random", themeColor = "#00ffcc") {
    // Canvas setup with minimum dimension constraints for legibility
    const minWidth = 800;
    const minHeight = 600;
    const canvasWidth = Math.max(originalImg.width, minWidth);
    const canvasHeight = Math.max(originalImg.height, minHeight);
    
    const canvas = document.createElement('canvas');
    canvas.width = canvasWidth;
    canvas.height = canvasHeight;
    const ctx = canvas.getContext('2d');

    // 1. Draw and scale original image (cover mode)
    const scale = Math.max(canvasWidth / originalImg.width, canvasHeight / originalImg.height);
    const imgW = originalImg.width * scale;
    const imgH = originalImg.height * scale;
    const dx = (canvasWidth - imgW) / 2;
    const dy = (canvasHeight - imgH) / 2;
    ctx.drawImage(originalImg, dx, dy, imgW, imgH);

    // 2. Add dark tech/cyber overlay gradient
    const grad = ctx.createLinearGradient(0, 0, 0, canvasHeight);
    grad.addColorStop(0, 'rgba(10, 15, 30, 0.85)');
    grad.addColorStop(1, 'rgba(10, 15, 30, 0.98)');
    ctx.fillStyle = grad;
    ctx.fillRect(0, 0, canvasWidth, canvasHeight);

    // 3. Draw cyber grid
    ctx.strokeStyle = 'rgba(255, 255, 255, 0.05)';
    ctx.lineWidth = 1;
    const gridSize = 40;
    for (let x = 0; x <= canvasWidth; x += gridSize) {
        ctx.beginPath();
        ctx.moveTo(x, 0);
        ctx.lineTo(x, canvasHeight);
        ctx.stroke();
    }
    for (let y = 0; y <= canvasHeight; y += gridSize) {
        ctx.beginPath();
        ctx.moveTo(0, y);
        ctx.lineTo(canvasWidth, y);
        ctx.stroke();
    }

    // 4. Content Generation logic (Pseudo-Random Generation)
    const seedStr = String(seedText || "Random");
    let rs = 0;
    if (seedStr !== "Random" && seedStr.trim() !== "") {
        for (let i = 0; i < seedStr.length; i++) {
            rs = (rs * 31 + seedStr.charCodeAt(i)) % 100000;
        }
    } else {
        rs = Math.floor(Math.random() * 100000);
    }

    const prng = () => {
        rs = (rs * 9301 + 49297) % 233280;
        return rs / 233280;
    };

    // Dictionary data
    const prefixes = ["AI-Powered", "Neural", "Smart", "Auto", "Deep", "Quantum", "Cyber", "Hyper", "Vision", "Semantic", "Cognitive"];
    const subjects = ["Image", "Pixel", "Background", "Art", "Portrait", "Color Palette", "Object", "Resolution", "Vector", "Canvas", "Texture", "Layer"];
    const actions = ["Generator", "Creator", "Enhancer", "Upscaler", "Studio", "Remover", "Extractor", "Synthesizer", "AI", "Engine", "Transformer", "Analyzer"];

    const verbs = ["Uses cutting-edge transformer models to", "Leverages advanced GANs to", "Employs deep learning algorithms to", "Utilizes optimized neural networks to", "Applies next-gen AI models to"];
    const goals = ["enhance visual fidelity", "generate stunning artistic effects", "automate complex design workflows", "segment semantic visual elements", "upscale low-resolution graphics", "synthesize photorealistic textures"];
    const endings = ["in mere seconds.", "with a single click.", "entirely effortlessly.", "for professional creative studios.", "with zero manual intervention."];

    const generatedName = prefixes[Math.floor(prng() * prefixes.length)] + " " +
                          subjects[Math.floor(prng() * subjects.length)] + " " +
                          actions[Math.floor(prng() * actions.length)];

    const generatedDesc = verbs[Math.floor(prng() * verbs.length)] + " " +
                          goals[Math.floor(prng() * goals.length)] + " " +
                          endings[Math.floor(prng() * endings.length)];

    const fakeHash = Math.floor(prng() * 0xFFFFFFFF).toString(16).toUpperCase().padStart(8, '0');

    // 5. Draw Card UI
    const cardW = canvasWidth * 0.75;
    const cardH = Math.min(canvasHeight * 0.55, 450);
    const cx = canvasWidth / 2;
    const cy = canvasHeight / 2;
    const padding = cardH * 0.08;

    ctx.save();
    ctx.translate(cx, cy);

    // Fallback theme color if an invalid one is somehow passed
    let tColor = String(themeColor);
    if (!tColor.match(/^#[0-9a-fA-F]{3,8}$/) && !tColor.match(/^[a-zA-Z]+$/)) {
        tColor = "#00ffcc";
    }

    // Card background & glowing border
    ctx.shadowColor = tColor;
    ctx.shadowBlur = 25;
    ctx.strokeStyle = tColor;
    ctx.lineWidth = 2;
    ctx.beginPath();
    ctx.roundRect(-cardW / 2, -cardH / 2, cardW, cardH, 15);
    ctx.stroke();

    ctx.shadowBlur = 0;
    ctx.fillStyle = 'rgba(0, 0, 0, 0.75)';
    ctx.fill();

    // 6. Draw Text Content
    ctx.textAlign = 'center';

    // Header Label
    const headerFontSize = Math.max(14, cardH * 0.05);
    ctx.font = `bold ${headerFontSize}px monospace`;
    ctx.fillStyle = tColor;
    const headerY = -cardH/2 + padding + headerFontSize;
    ctx.fillText("✨ AI TOOL CREATOR STUDIO ✨", 0, headerY);

    // Divider Line
    const lineY = headerY + 15;
    ctx.strokeStyle = tColor;
    ctx.lineWidth = 1;
    ctx.beginPath();
    ctx.moveTo(-cardW/3, lineY);
    ctx.lineTo(cardW/3, lineY);
    ctx.stroke();

    // Generated Idea Name
    let nameFontSize = Math.max(24, cardH * 0.12);
    ctx.font = `bold ${nameFontSize}px sans-serif`;
    let titleMetrics = ctx.measureText(generatedName);
    
    // Scale down if title is too wide
    while (titleMetrics.width > cardW - padding * 4 && nameFontSize > 18) {
        nameFontSize -= 2;
        ctx.font = `bold ${nameFontSize}px sans-serif`;
        titleMetrics = ctx.measureText(generatedName);
    }
    
    ctx.fillStyle = '#ffffff';
    const nameY = lineY + padding * 1.5 + nameFontSize;
    ctx.fillText(generatedName, 0, nameY);

    // Description text (wrapped)
    const descFontSize = Math.max(16, cardH * 0.05);
    ctx.font = `${descFontSize}px sans-serif`;
    ctx.fillStyle = '#cccccc';
    
    const words = generatedDesc.split(' ');
    let line = '';
    let currY = nameY + padding * 1.2 + descFontSize;
    
    for (let n = 0; n < words.length; n++) {
        const testLine = line + words[n] + ' ';
        const metrics = ctx.measureText(testLine);
        if (metrics.width > cardW - padding * 3 && n > 0) {
            ctx.fillText(line.trim(), 0, currY);
            line = words[n] + ' ';
            currY += descFontSize * 1.5;
        } else {
            line = testLine;
        }
    }
    ctx.fillText(line.trim(), 0, currY);

    // Footer stats
    const footerFontSize = Math.max(10, cardH * 0.035);
    ctx.font = `${footerFontSize}px monospace`;
    ctx.fillStyle = tColor;
    ctx.textAlign = 'left';
    ctx.fillText(`STATUS: ONLINE  |  SEED: ${rs}  |  MODEL: v2.4.1`, -cardW/2 + padding, cardH/2 - padding);
    
    ctx.textAlign = 'right';
    ctx.fillText(`HASH: ${fakeHash}`, cardW/2 - padding, cardH/2 - padding);

    ctx.restore();

    // 7. Render horizontal scanlines on top for authentic cyber feel
    ctx.fillStyle = 'rgba(0,0,0,0.15)';
    for (let i = 0; i < canvasHeight; i += 4) {
        ctx.fillRect(0, i, canvasWidth, 2);
    }

    return canvas;
}