ngx-sparklefall/dist/sparklefall.component.js

Angular directive and component for SparkleFall - Beautiful falling sparkle animations

var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
    return c > 3 && r && Object.defineProperty(target, key, r), r;
};
var __metadata = (this && this.__metadata) || function (k, v) {
    if (typeof Reflect === "object" && typeof Reflect.metadata === "function") return Reflect.metadata(k, v);
};
import { Component, Input, ElementRef, Output, EventEmitter } from '@angular/core';
import { CommonModule } from '@angular/common';
import SparkleFallLib from 'sparklefall';
let SparkleFallComponent = class SparkleFallComponent {
    elementRef;
    enabled = true;
    interval = 800;
    duration = 5000;
    sparkles = ['✨', '⭐', '💫', '🌟'];
    colors = null;
    minSize = 10;
    maxSize = 30;
    minDuration = 2;
    maxDuration = 5;
    wind = 0;
    spin = true;
    maxSparkles = 50;
    autoStart = true;
    zIndex = 9999;
    paused = false;
    wrapperClass = '';
    wrapperStyles = {};
    sparkleStart = new EventEmitter();
    sparkleStop = new EventEmitter();
    sparkleInstance;
    constructor(elementRef) {
        this.elementRef = elementRef;
    }
    ngOnInit() {
        if (this.enabled && !this.paused) {
            this.initializeSparkles();
        }
    }
    ngOnChanges(changes) {
        // Handle enabled state change
        if (changes['enabled']) {
            if (this.enabled && !this.sparkleInstance) {
                this.initializeSparkles();
            }
            else if (!this.enabled && this.sparkleInstance) {
                this.destroySparkles();
            }
        }
        // Handle pause state change
        if (changes['paused'] && this.sparkleInstance) {
            if (this.paused) {
                this.stop();
            }
            else {
                this.start();
            }
        }
        // Update configuration for other changes
        if (this.sparkleInstance && !changes['enabled'] && !changes['paused']) {
            const config = {};
            if (changes['interval'])
                config.interval = this.interval;
            if (changes['wind'])
                config.wind = this.wind;
            if (changes['maxSparkles'])
                config.maxSparkles = this.maxSparkles;
            if (changes['minSize'])
                config.minSize = this.minSize;
            if (changes['maxSize'])
                config.maxSize = this.maxSize;
            if (changes['minDuration'])
                config.minDuration = this.minDuration;
            if (changes['maxDuration'])
                config.maxDuration = this.maxDuration;
            if (changes['spin'])
                config.spin = this.spin;
            if (Object.keys(config).length > 0) {
                this.sparkleInstance.updateConfig(config);
            }
        }
    }
    ngOnDestroy() {
        this.destroySparkles();
    }
    initializeSparkles() {
        const wrapper = this.elementRef.nativeElement.querySelector('.sparklefall-wrapper');
        this.sparkleInstance = new SparkleFallLib({
            container: wrapper,
            interval: this.interval,
            duration: this.duration,
            sparkles: this.sparkles,
            colors: this.colors,
            minSize: this.minSize,
            maxSize: this.maxSize,
            minDuration: this.minDuration,
            maxDuration: this.maxDuration,
            wind: this.wind,
            spin: this.spin,
            maxSparkles: this.maxSparkles,
            autoStart: this.autoStart && !this.paused,
            zIndex: this.zIndex
        });
        if (this.autoStart && !this.paused) {
            this.sparkleStart.emit();
        }
    }
    destroySparkles() {
        if (this.sparkleInstance) {
            this.sparkleInstance.destroy();
            this.sparkleInstance = null;
            this.sparkleStop.emit();
        }
    }
    start() {
        if (this.sparkleInstance) {
            this.sparkleInstance.start();
            this.sparkleStart.emit();
        }
    }
    stop() {
        if (this.sparkleInstance) {
            this.sparkleInstance.stop();
            this.sparkleStop.emit();
        }
    }
    clear() {
        if (this.sparkleInstance) {
            this.sparkleInstance.clear();
            this.sparkleStop.emit();
        }
    }
    burst(count = 10) {
        if (this.sparkleInstance) {
            this.sparkleInstance.burst(count);
        }
    }
};
__decorate([
    Input(),
    __metadata("design:type", Object)
], SparkleFallComponent.prototype, "enabled", void 0);
__decorate([
    Input(),
    __metadata("design:type", Object)
], SparkleFallComponent.prototype, "interval", void 0);
__decorate([
    Input(),
    __metadata("design:type", Object)
], SparkleFallComponent.prototype, "duration", void 0);
__decorate([
    Input(),
    __metadata("design:type", Array)
], SparkleFallComponent.prototype, "sparkles", void 0);
__decorate([
    Input(),
    __metadata("design:type", Object)
], SparkleFallComponent.prototype, "colors", void 0);
__decorate([
    Input(),
    __metadata("design:type", Object)
], SparkleFallComponent.prototype, "minSize", void 0);
__decorate([
    Input(),
    __metadata("design:type", Object)
], SparkleFallComponent.prototype, "maxSize", void 0);
__decorate([
    Input(),
    __metadata("design:type", Object)
], SparkleFallComponent.prototype, "minDuration", void 0);
__decorate([
    Input(),
    __metadata("design:type", Object)
], SparkleFallComponent.prototype, "maxDuration", void 0);
__decorate([
    Input(),
    __metadata("design:type", Object)
], SparkleFallComponent.prototype, "wind", void 0);
__decorate([
    Input(),
    __metadata("design:type", Object)
], SparkleFallComponent.prototype, "spin", void 0);
__decorate([
    Input(),
    __metadata("design:type", Object)
], SparkleFallComponent.prototype, "maxSparkles", void 0);
__decorate([
    Input(),
    __metadata("design:type", Object)
], SparkleFallComponent.prototype, "autoStart", void 0);
__decorate([
    Input(),
    __metadata("design:type", Object)
], SparkleFallComponent.prototype, "zIndex", void 0);
__decorate([
    Input(),
    __metadata("design:type", Object)
], SparkleFallComponent.prototype, "paused", void 0);
__decorate([
    Input(),
    __metadata("design:type", Object)
], SparkleFallComponent.prototype, "wrapperClass", void 0);
__decorate([
    Input(),
    __metadata("design:type", Object)
], SparkleFallComponent.prototype, "wrapperStyles", void 0);
__decorate([
    Output(),
    __metadata("design:type", Object)
], SparkleFallComponent.prototype, "sparkleStart", void 0);
__decorate([
    Output(),
    __metadata("design:type", Object)
], SparkleFallComponent.prototype, "sparkleStop", void 0);
SparkleFallComponent = __decorate([
    Component({
        selector: 'sparkle-fall',
        standalone: true,
        imports: [CommonModule],
        template: `
    <div class="sparklefall-wrapper" [ngStyle]="wrapperStyles">
      <ng-content></ng-content>
    </div>
  `,
        styles: [`
    .sparklefall-wrapper {
      position: relative;
    }
  `]
    }),
    __metadata("design:paramtypes", [ElementRef])
], SparkleFallComponent);
export { SparkleFallComponent };