@fylib/adapter-angular 0.1.0

package/dist/effects/confetti.plugin.js

@@ -0,0 +1,151 @@
+import { animationEngine } from '@fylib/animation';
+let registered = false;
+function createCanvas() {
+    const existing = document.querySelector('#fy-confetti-canvas');
+    if (existing) {
+        return existing;
+    }
+    const canvas = document.createElement('canvas');
+    canvas.id = 'fy-confetti-canvas';
+    canvas.style.position = 'fixed';
+    canvas.style.top = '0';
+    canvas.style.left = '0';
+    canvas.style.pointerEvents = 'none';
+    canvas.style.zIndex = '9999';
+    canvas.width = window.innerWidth;
+    canvas.height = window.innerHeight;
+    window.addEventListener('resize', () => {
+        canvas.width = window.innerWidth;
+        canvas.height = window.innerHeight;
+    });
+    document.body.appendChild(canvas);
+    return canvas;
+}
+const activeLoops = new Map();
+function randomColor() {
+    const colors = ['#f97316', '#22c55e', '#3b82f6', '#e11d48', '#eab308', '#6366f1'];
+    const index = Math.floor(Math.random() * colors.length);
+    return colors[index];
+}
+function createParticles(count, width, height, speed = 1) {
+    const particles = [];
+    for (let i = 0; i < count; i++) {
+        particles.push({
+            x: Math.random() * width,
+            y: -Math.random() * height,
+            vx: (Math.random() - 0.5) * 4 * speed,
+            vy: (Math.random() * 4 + 2) * speed,
+            size: Math.random() * 8 + 4,
+            color: randomColor(),
+            rotation: Math.random() * Math.PI * 2,
+            vr: (Math.random() - 0.5) * 0.2
+        });
+    }
+    return particles;
+}
+function renderConfettiOnce(count, duration, speed = 1, loop = false, effectId) {
+    if (typeof window === 'undefined' || typeof document === 'undefined') {
+        return;
+    }
+    const canvas = createCanvas();
+    const ctx = canvas.getContext('2d');
+    if (!ctx) {
+        return;
+    }
+    // Se já existe um loop com esse ID, para ele antes de começar um novo
+    if (effectId && activeLoops.has(effectId)) {
+        activeLoops.get(effectId)?.stop();
+    }
+    const particles = createParticles(count, canvas.width, canvas.height, speed);
+    const start = performance.now();
+    let animationId;
+    let isRunning = true;
+    const stop = () => {
+        isRunning = false;
+        cancelAnimationFrame(animationId);
+        if (effectId)
+            activeLoops.delete(effectId);
+    };
+    if (effectId && loop) {
+        activeLoops.set(effectId, { stop });
+    }
+    function frame(now) {
+        if (!isRunning)
+            return;
+        const elapsed = now - start;
+        if (!ctx) {
+            return;
+        }
+        ctx.clearRect(0, 0, canvas.width, canvas.height);
+        // Stop recycling after duration, but let existing particles finish falling
+        const isRecycling = loop || elapsed < duration;
+        let anyVisible = false;
+        particles.forEach(p => {
+            p.x += p.vx;
+            p.y += p.vy;
+            p.vy += 0.05 * speed;
+            p.rotation += p.vr;
+            if (p.y - p.size > canvas.height) {
+                if (isRecycling) {
+                    p.y = -p.size;
+                    p.x = Math.random() * canvas.width;
+                    p.vy = (Math.random() * 4 + 2) * speed;
+                }
+            }
+            else {
+                anyVisible = true;
+            }
+        });
+        if (anyVisible || isRecycling) {
+            particles.forEach(p => {
+                if (!ctx) {
+                    return;
+                }
+                ctx.save();
+                ctx.translate(p.x, p.y);
+                ctx.rotate(p.rotation);
+                ctx.fillStyle = p.color;
+                ctx.fillRect(-p.size / 2, -p.size / 2, p.size, p.size);
+                ctx.restore();
+            });
+            animationId = requestAnimationFrame(frame);
+        }
+        else {
+            if (!ctx) {
+                return;
+            }
+            ctx.clearRect(0, 0, canvas.width, canvas.height);
+            if (effectId)
+                activeLoops.delete(effectId);
+        }
+    }
+    animationId = requestAnimationFrame(frame);
+}
+const confettiPlugin = {
+    name: 'confetti-renderer',
+    renderEffect(effect) {
+        if (effect.name === 'confetti' && effect.type === 'global') {
+            const params = effect.params || {};
+            if (params['stop'] && params['id']) {
+                activeLoops.get(params['id'])?.stop();
+                return;
+            }
+            const count = params['intensity'] || 80;
+            const duration = params['duration'] || 1200;
+            const speed = params['speed'] || 1;
+            const loop = !!params['loop'];
+            const id = params['id'];
+            renderConfettiOnce(count, duration, speed, loop, id);
+        }
+    }
+};
+export function registerConfettiPlugin() {
+    if (registered) {
+        return;
+    }
+    if (typeof window === 'undefined' || typeof document === 'undefined') {
+        return;
+    }
+    animationEngine.registerGlobalEffectPlugin(confettiPlugin);
+    registered = true;
+}

package/dist/effects/extra-effects.plugin.d.ts

@@ -0,0 +1,3 @@
+import { GlobalEffectPlugin } from '@fylib/animation';
+export declare const extraEffectsPlugin: GlobalEffectPlugin;
+export declare function registerExtraEffectsPlugin(): void;

package/dist/effects/extra-effects.plugin.js

@@ -0,0 +1,288 @@
+import { animationEngine } from '@fylib/animation';
+let registered = false;
+const activeLoops = new Map();
+function createCanvas(id) {
+    if (typeof window === 'undefined' || typeof document === 'undefined')
+        return null;
+    const canvasId = `fy-${id}-canvas`;
+    const existing = document.querySelector(`#${canvasId}`);
+    if (existing)
+        return existing;
+    const canvas = document.createElement('canvas');
+    canvas.id = canvasId;
+    canvas.style.position = 'fixed';
+    canvas.style.top = '0';
+    canvas.style.left = '0';
+    canvas.style.pointerEvents = 'none';
+    canvas.style.zIndex = '9999';
+    canvas.width = window.innerWidth;
+    canvas.height = window.innerHeight;
+    window.addEventListener('resize', () => {
+        canvas.width = window.innerWidth;
+        canvas.height = window.innerHeight;
+    });
+    document.body.appendChild(canvas);
+    return canvas;
+}
+function renderSnow(count, speed, loop, id) {
+    const canvas = createCanvas('snow');
+    if (!canvas)
+        return;
+    const ctx = canvas.getContext('2d');
+    if (!ctx)
+        return;
+    const particles = [];
+    for (let i = 0; i < count; i++) {
+        particles.push({
+            x: Math.random() * canvas.width,
+            y: Math.random() * canvas.height,
+            vx: (Math.random() - 0.5) * speed,
+            vy: (Math.random() * 2 + 1) * speed,
+            radius: Math.random() * 3 + 1,
+            opacity: Math.random() * 0.5 + 0.3
+        });
+    }
+    let animationId;
+    const stop = () => {
+        cancelAnimationFrame(animationId);
+        activeLoops.delete(id);
+        ctx.clearRect(0, 0, canvas.width, canvas.height);
+    };
+    activeLoops.set(id, { stop });
+    function frame() {
+        ctx.clearRect(0, 0, canvas.width, canvas.height);
+        ctx.fillStyle = 'white';
+        particles.forEach(p => {
+            p.x += p.vx;
+            p.y += p.vy;
+            if (p.y > canvas.height) {
+                p.y = -p.radius;
+                p.x = Math.random() * canvas.width;
+            }
+            ctx.globalAlpha = p.opacity;
+            ctx.beginPath();
+            ctx.arc(p.x, p.y, p.radius, 0, Math.PI * 2);
+            ctx.fill();
+        });
+        animationId = requestAnimationFrame(frame);
+    }
+    frame();
+}
+function renderBubbles(count, speed, loop, id) {
+    const canvas = createCanvas('bubbles');
+    if (!canvas)
+        return;
+    const ctx = canvas.getContext('2d');
+    if (!ctx)
+        return;
+    const particles = [];
+    for (let i = 0; i < count; i++) {
+        particles.push({
+            x: Math.random() * canvas.width,
+            y: canvas.height + Math.random() * 100,
+            vy: -(Math.random() * 1 + 0.5) * speed,
+            radius: Math.random() * 15 + 5,
+            opacity: Math.random() * 0.3 + 0.1,
+            hue: 200 + Math.random() * 40 // Blueish
+        });
+    }
+    let animationId;
+    const stop = () => {
+        cancelAnimationFrame(animationId);
+        activeLoops.delete(id);
+        ctx.clearRect(0, 0, canvas.width, canvas.height);
+    };
+    activeLoops.set(id, { stop });
+    function frame() {
+        ctx.clearRect(0, 0, canvas.width, canvas.height);
+        particles.forEach(p => {
+            p.y += p.vy;
+            if (p.y < -p.radius) {
+                p.y = canvas.height + p.radius;
+                p.x = Math.random() * canvas.width;
+            }
+            ctx.strokeStyle = `hsla(${p.hue}, 70%, 70%, ${p.opacity})`;
+            ctx.lineWidth = 2;
+            ctx.beginPath();
+            ctx.arc(p.x, p.y, p.radius, 0, Math.PI * 2);
+            ctx.stroke();
+            // Reflection
+            ctx.beginPath();
+            ctx.arc(p.x - p.radius * 0.3, p.y - p.radius * 0.3, p.radius * 0.2, 0, Math.PI * 2);
+            ctx.fillStyle = `hsla(${p.hue}, 70%, 90%, ${p.opacity})`;
+            ctx.fill();
+        });
+        animationId = requestAnimationFrame(frame);
+    }
+    frame();
+}
+// --- MATRIX (Nexus) ---
+function renderMatrix(count, speed, loop, id) {
+    const canvas = createCanvas('matrix');
+    if (!canvas)
+        return;
+    const ctx = canvas.getContext('2d');
+    if (!ctx)
+        return;
+    const fontSize = 16;
+    const columns = Math.floor(canvas.width / fontSize);
+    const drops = new Array(columns).fill(1);
+    const chars = "0123456789ABCDEFHIJKLMNOPQRSTUVWXYZ@#$%^&*()".split("");
+    let animationId;
+    const stop = () => {
+        cancelAnimationFrame(animationId);
+        activeLoops.delete(id);
+        ctx.clearRect(0, 0, canvas.width, canvas.height);
+    };
+    activeLoops.set(id, { stop });
+    let lastTime = 0;
+    const interval = 50 / speed;
+    function frame(time) {
+        if (time - lastTime > interval) {
+            // Usar uma opacidade muito baixa para o rastro, para não escurecer a tela (overlay sutil)
+            ctx.fillStyle = "rgba(10, 15, 18, 0.03)";
+            ctx.fillRect(0, 0, canvas.width, canvas.height);
+            // Caracteres bem sutis
+            ctx.fillStyle = "rgba(34, 197, 94, 0.15)";
+            ctx.font = fontSize + "px monospace";
+            for (let i = 0; i < drops.length; i++) {
+                const text = chars[Math.floor(Math.random() * chars.length)];
+                ctx.fillText(text, i * fontSize, drops[i] * fontSize);
+                if (drops[i] * fontSize > canvas.height && Math.random() > 0.975) {
+                    drops[i] = 0;
+                }
+                drops[i]++;
+            }
+            lastTime = time;
+        }
+        animationId = requestAnimationFrame(frame);
+    }
+    frame(0);
+}
+function renderParticles(count, speed, loop, id, color = '#3b82f6') {
+    const canvas = createCanvas('particles');
+    if (!canvas)
+        return;
+    const ctx = canvas.getContext('2d');
+    if (!ctx)
+        return;
+    const particles = [];
+    for (let i = 0; i < count; i++) {
+        particles.push({
+            x: Math.random() * canvas.width,
+            y: Math.random() * canvas.height,
+            vx: (Math.random() - 0.5) * speed,
+            vy: (Math.random() - 0.5) * speed,
+            radius: Math.random() * 2 + 1,
+            color: color
+        });
+    }
+    let animationId;
+    const stop = () => {
+        cancelAnimationFrame(animationId);
+        activeLoops.delete(id);
+        ctx.clearRect(0, 0, canvas.width, canvas.height);
+    };
+    activeLoops.set(id, { stop });
+    function frame() {
+        ctx.clearRect(0, 0, canvas.width, canvas.height);
+        particles.forEach(p => {
+            p.x += p.vx;
+            p.y += p.vy;
+            if (p.x < 0 || p.x > canvas.width)
+                p.vx *= -1;
+            if (p.y < 0 || p.y > canvas.height)
+                p.vy *= -1;
+            ctx.beginPath();
+            ctx.arc(p.x, p.y, p.radius, 0, Math.PI * 2);
+            ctx.fillStyle = p.color;
+            ctx.globalAlpha = 0.3;
+            ctx.fill();
+        });
+        animationId = requestAnimationFrame(frame);
+    }
+    frame();
+}
+// --- STARS (Workbench 3) ---
+function renderStars(count, speed, loop, id) {
+    const canvas = createCanvas('stars');
+    if (!canvas)
+        return;
+    const ctx = canvas.getContext('2d');
+    if (!ctx)
+        return;
+    const stars = [];
+    for (let i = 0; i < count; i++) {
+        stars.push({
+            x: Math.random() * canvas.width,
+            y: Math.random() * canvas.height,
+            size: Math.random() * 1.5,
+            twinkle: Math.random() * 0.05 + 0.01,
+            opacity: Math.random()
+        });
+    }
+    let animationId;
+    const stop = () => {
+        cancelAnimationFrame(animationId);
+        activeLoops.delete(id);
+        ctx.clearRect(0, 0, canvas.width, canvas.height);
+    };
+    activeLoops.set(id, { stop });
+    function frame() {
+        ctx.clearRect(0, 0, canvas.width, canvas.height);
+        stars.forEach(s => {
+            s.opacity += s.twinkle;
+            if (s.opacity > 1 || s.opacity < 0)
+                s.twinkle *= -1;
+            ctx.globalAlpha = s.opacity;
+            ctx.fillStyle = 'white';
+            ctx.beginPath();
+            ctx.arc(s.x, s.y, s.size, 0, Math.PI * 2);
+            ctx.fill();
+        });
+        animationId = requestAnimationFrame(frame);
+    }
+    frame();
+}
+export const extraEffectsPlugin = {
+    name: 'extra-effects-renderer',
+    renderEffect(effect) {
+        if (effect.type !== 'global')
+            return;
+        const params = effect.params || {};
+        const id = params['id'] || 'default-extra-loop';
+        if (params['stop'] && params['id']) {
+            activeLoops.get(params['id'])?.stop();
+            return;
+        }
+        const count = params['intensity'] || 50;
+        const speed = params['speed'] || 1;
+        const loop = !!params['loop'];
+        switch (effect.name) {
+            case 'snow':
+                renderSnow(count, speed, loop, id);
+                break;
+            case 'bubbles':
+                renderBubbles(count, speed, loop, id);
+                break;
+            case 'matrix':
+                renderMatrix(count, speed, loop, id);
+                break;
+            case 'particles':
+                renderParticles(count, speed, loop, id);
+                break;
+            case 'stars':
+                renderStars(count, speed, loop, id);
+                break;
+            case 'aurora':
+                renderParticles(count, speed, loop, id, '#5ac8fa');
+                break; // Aurora uses light blue particles for now
+        }
+    }
+};
+export function registerExtraEffectsPlugin() {
+    if (registered)
+        return;
+    animationEngine.registerGlobalEffectPlugin(extraEffectsPlugin);
+    registered = true;
+}

package/dist/effects/hearts.plugin.d.ts

@@ -0,0 +1 @@
+export declare function registerHeartsPlugin(): void;

package/dist/effects/hearts.plugin.js

@@ -0,0 +1,172 @@
+import { animationEngine } from '@fylib/animation';
+let registered = false;
+function createCanvas() {
+    const existing = document.querySelector('#fy-hearts-canvas');
+    if (existing) {
+        return existing;
+    }
+    const canvas = document.createElement('canvas');
+    canvas.id = 'fy-hearts-canvas';
+    canvas.style.position = 'fixed';
+    canvas.style.top = '0';
+    canvas.style.left = '0';
+    canvas.style.pointerEvents = 'none';
+    canvas.style.zIndex = '9999';
+    canvas.width = window.innerWidth;
+    canvas.height = window.innerHeight;
+    window.addEventListener('resize', () => {
+        canvas.width = window.innerWidth;
+        canvas.height = window.innerHeight;
+    });
+    document.body.appendChild(canvas);
+    return canvas;
+}
+const activeLoops = new Map();
+function getPuffyColors() {
+    // Cores do tema finey-puffy-1
+    return [
+        '#ff85a2', // primary (rosa vibrante)
+        '#ffb3c6', // secondary (rosa pastel)
+        '#a2d2ff', // success (azul candy)
+        '#ff4d6d', // danger (rosa forte)
+        '#ffe5ec', // warning (rosa claríssimo)
+        '#c8b6ff', // info (roxo lavanda)
+        '#ffccd5' // surface (rosa suave)
+    ];
+}
+function createParticles(count, width, height, speed = 1) {
+    const particles = [];
+    const colors = getPuffyColors();
+    for (let i = 0; i < count; i++) {
+        particles.push({
+            x: Math.random() * width,
+            y: -Math.random() * height,
+            vx: (Math.random() - 0.5) * 2 * speed,
+            vy: (Math.random() * 2 + 1.5) * speed,
+            size: Math.random() * 12 + 8,
+            color: colors[Math.floor(Math.random() * colors.length)],
+            rotation: Math.random() * Math.PI * 2,
+            vr: (Math.random() - 0.5) * 0.05,
+            opacity: Math.random() * 0.5 + 0.5
+        });
+    }
+    return particles;
+}
+function drawHeart(ctx, x, y, size, color, rotation) {
+    ctx.save();
+    ctx.translate(x, y);
+    ctx.rotate(rotation);
+    ctx.beginPath();
+    // Desenha o coração centralizado no (0,0)
+    const d = size;
+    ctx.moveTo(0, d / 4);
+    ctx.bezierCurveTo(0, 0, -d / 2, 0, -d / 2, d / 4);
+    ctx.bezierCurveTo(-d / 2, d / 2, 0, d * 0.75, 0, d);
+    ctx.bezierCurveTo(0, d * 0.75, d / 2, d / 2, d / 2, d / 4);
+    ctx.bezierCurveTo(d / 2, 0, 0, 0, 0, d / 4);
+    ctx.fillStyle = color;
+    ctx.fill();
+    ctx.restore();
+}
+function renderHeartsOnce(count, duration, speed = 1, loop = false, effectId) {
+    if (typeof window === 'undefined' || typeof document === 'undefined') {
+        return;
+    }
+    const canvas = createCanvas();
+    const ctx = canvas.getContext('2d');
+    if (!ctx) {
+        return;
+    }
+    // Se já existe um loop com esse ID, para ele antes de começar um novo
+    if (effectId && activeLoops.has(effectId)) {
+        activeLoops.get(effectId)?.stop();
+    }
+    const particles = createParticles(count, canvas.width, canvas.height, speed);
+    const start = performance.now();
+    let animationId;
+    let isRunning = true;
+    const stop = () => {
+        isRunning = false;
+        cancelAnimationFrame(animationId);
+        if (effectId)
+            activeLoops.delete(effectId);
+    };
+    if (effectId && loop) {
+        activeLoops.set(effectId, { stop });
+    }
+    function frame(now) {
+        if (!isRunning)
+            return;
+        const elapsed = now - start;
+        if (!ctx) {
+            return;
+        }
+        ctx.clearRect(0, 0, canvas.width, canvas.height);
+        const isRecycling = loop || elapsed < duration;
+        let anyVisible = false;
+        particles.forEach(p => {
+            p.x += p.vx;
+            p.y += p.vy;
+            p.vy += 0.02 * speed; // Gravidade proporcional à velocidade
+            p.rotation += p.vr;
+            if (p.y - p.size > canvas.height) {
+                if (isRecycling) {
+                    p.y = -p.size;
+                    p.x = Math.random() * canvas.width;
+                    p.vy = (Math.random() * 2 + 1.5) * speed;
+                }
+            }
+            else {
+                anyVisible = true;
+            }
+        });
+        if (anyVisible || isRecycling) {
+            particles.forEach(p => {
+                if (!ctx) {
+                    return;
+                }
+                ctx.globalAlpha = p.opacity;
+                drawHeart(ctx, p.x, p.y, p.size, p.color, p.rotation);
+            });
+            ctx.globalAlpha = 1.0;
+            animationId = requestAnimationFrame(frame);
+        }
+        else {
+            if (!ctx) {
+                return;
+            }
+            ctx.clearRect(0, 0, canvas.width, canvas.height);
+            if (effectId)
+                activeLoops.delete(effectId);
+        }
+    }
+    animationId = requestAnimationFrame(frame);
+}
+const heartsPlugin = {
+    name: 'hearts-renderer',
+    renderEffect(effect) {
+        if (effect.name === 'hearts' && effect.type === 'global') {
+            const params = effect.params || {};
+            if (params['stop'] && params['id']) {
+                activeLoops.get(params['id'])?.stop();
+                return;
+            }
+            const count = params['intensity'] || 40;
+            const duration = params['duration'] || 2000;
+            const speed = params['speed'] || 1;
+            const loop = !!params['loop'];
+            const id = params['id'];
+            renderHeartsOnce(count, duration, speed, loop, id);
+        }
+    }
+};
+export function registerHeartsPlugin() {
+    if (registered) {
+        return;
+    }
+    if (typeof window === 'undefined' || typeof document === 'undefined') {
+        return;
+    }
+    animationEngine.registerGlobalEffectPlugin(heartsPlugin);
+    registered = true;
+}

package/dist/effects/register-all.d.ts

@@ -0,0 +1 @@
+export declare function registerAllEffects(): void;

package/dist/effects/register-all.js

@@ -0,0 +1,16 @@
+import { registerConfettiPlugin } from './confetti.plugin';
+import { registerHeartsPlugin } from './hearts.plugin';
+import { registerUIEffectsPlugin } from './ui-effects.plugin';
+import { registerExtraEffectsPlugin } from './extra-effects.plugin';
+export function registerAllEffects() {
+    try {
+        if (typeof window === 'undefined' || typeof document === 'undefined') {
+            return;
+        }
+        registerConfettiPlugin();
+        registerHeartsPlugin();
+        registerExtraEffectsPlugin();
+        registerUIEffectsPlugin();
+    }
+    catch { }
+}

package/dist/effects/ui-effects.plugin.d.ts

@@ -0,0 +1 @@
+export declare function registerUIEffectsPlugin(): void;