rj-spinner/fesm2015/rj-spinner.js

This library was generated with https://github.com/angular/angular-cli version 9.1.13.

import { __decorate } from 'tslib';
import { ɵɵdefineInjectable, Injectable, Component, NgModule } from '@angular/core';
import { Subject } from 'rxjs';
import { CommonModule } from '@angular/common';

let RjSpinnerService = class RjSpinnerService {
    constructor() {
        this.spinnerFlag = new Subject();
    }
    show() {
        this.spinnerFlag.next(true);
    }
    hide() {
        this.spinnerFlag.next(false);
    }
};
RjSpinnerService.ɵprov = ɵɵdefineInjectable({ factory: function RjSpinnerService_Factory() { return new RjSpinnerService(); }, token: RjSpinnerService, providedIn: "root" });
RjSpinnerService = __decorate([
    Injectable({
        providedIn: 'root'
    })
], RjSpinnerService);

let RjSpinnerComponent = class RjSpinnerComponent {
    constructor(rjSpinnerService) {
        this.rjSpinnerService = rjSpinnerService;
        this.showSpinner = false;
        this.rjSpinnerService.spinnerFlag.subscribe(res => {
            this.showSpinner = res;
        });
    }
    ngOnInit() {
    }
};
RjSpinnerComponent.ctorParameters = () => [
    { type: RjSpinnerService }
];
RjSpinnerComponent = __decorate([
    Component({
        selector: 'rj-spinner',
        template: `<div class="spinner-main" *ngIf="showSpinner">
  <div class="spinner"></div></div>
  `,
        styles: [`body {
      margin:0;
      padding:0;
    }
    .spinner-main {
      top: 0;
      left: 0;
      bottom: 0;
      right: 0;
      position: absolute;
      display: flex;
      align-items: center;
      justify-content: center;
      background: #0000001c;
    }
    .spinner {
      width: 40px;
      height: 40px;
      background-color: #333;
    
      margin: 100px auto;
      -webkit-animation: sk-rotateplane 1.2s infinite ease-in-out;
      animation: sk-rotateplane 1.2s infinite ease-in-out;
    }
    
    @-webkit-keyframes sk-rotateplane {
      0% { -webkit-transform: perspective(120px) }
      50% { -webkit-transform: perspective(120px) rotateY(180deg) }
      100% { -webkit-transform: perspective(120px) rotateY(180deg)  rotateX(180deg) }
    }
    
    @keyframes sk-rotateplane {
      0% { 
        transform: perspective(120px) rotateX(0deg) rotateY(0deg);
        -webkit-transform: perspective(120px) rotateX(0deg) rotateY(0deg) 
      } 50% { 
        transform: perspective(120px) rotateX(-180.1deg) rotateY(0deg);
        -webkit-transform: perspective(120px) rotateX(-180.1deg) rotateY(0deg) 
      } 100% { 
        transform: perspective(120px) rotateX(-180deg) rotateY(-179.9deg);
        -webkit-transform: perspective(120px) rotateX(-180deg) rotateY(-179.9deg);
      }
    }`]
    })
], RjSpinnerComponent);

let RjSpinnerModule = class RjSpinnerModule {
};
RjSpinnerModule = __decorate([
    NgModule({
        declarations: [RjSpinnerComponent],
        imports: [
            CommonModule
        ],
        exports: [RjSpinnerComponent]
    })
], RjSpinnerModule);

/*
 * Public API Surface of rj-spinner
 */

/**
 * Generated bundle index. Do not edit.
 */

export { RjSpinnerComponent, RjSpinnerModule, RjSpinnerService };
//# sourceMappingURL=rj-spinner.js.map