ngx-beacon-notify 1.4.2 → 1.4.4
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
|
@@ -1,9 +1,10 @@
|
|
|
1
1
|
import * as i0 from '@angular/core';
|
|
2
|
-
import { InjectionToken, EventEmitter, Injectable, Inject, Component, Pipe, Input, ViewChild, NgModule } from '@angular/core';
|
|
2
|
+
import { InjectionToken, EventEmitter, PLATFORM_ID, Injectable, Inject, Component, Pipe, Input, ViewChild, NgModule } from '@angular/core';
|
|
3
|
+
import { trigger, transition, style, animate } from '@angular/animations';
|
|
3
4
|
import { Buffer } from 'buffer';
|
|
4
|
-
import * as i1 from '@angular/platform-browser';
|
|
5
5
|
import * as i3 from '@angular/common';
|
|
6
|
-
import { CommonModule } from '@angular/common';
|
|
6
|
+
import { isPlatformBrowser, CommonModule } from '@angular/common';
|
|
7
|
+
import * as i1 from '@angular/platform-browser';
|
|
7
8
|
|
|
8
9
|
const BEACON_GLOBAL_CONFIG = new InjectionToken('IBeaconGlobalConfig');
|
|
9
10
|
const BEACON_OVERLAY_COLOR = '#000000DD';
|
|
@@ -12,6 +13,7 @@ const BEACON_TYPE_KEYS = ['a.a', 'a.e', 'a.i', 'a.s', 'a.w'];
|
|
|
12
13
|
|
|
13
14
|
class BeaconNotifyService {
|
|
14
15
|
sanitizer;
|
|
16
|
+
platformId;
|
|
15
17
|
globalConfig;
|
|
16
18
|
beaconDefaultIconKeys = BEACON_TYPE_KEYS;
|
|
17
19
|
beaconConfigMap = {
|
|
@@ -70,8 +72,9 @@ class BeaconNotifyService {
|
|
|
70
72
|
beaconEventTaskMaster = new EventEmitter();
|
|
71
73
|
beaconLibrary = [];
|
|
72
74
|
beaconLibraryQueue = [];
|
|
73
|
-
constructor(sanitizer, globalConfig) {
|
|
75
|
+
constructor(sanitizer, platformId, globalConfig) {
|
|
74
76
|
this.sanitizer = sanitizer;
|
|
77
|
+
this.platformId = platformId;
|
|
75
78
|
this.globalConfig = globalConfig;
|
|
76
79
|
this.globalConfig && this.resolveGlobalConfig(this.globalConfig);
|
|
77
80
|
// Resolve events
|
|
@@ -453,7 +456,8 @@ class BeaconNotifyService {
|
|
|
453
456
|
// Register beacon in event library
|
|
454
457
|
this.beaconSubscribedEventLibrary[beaconId] = Object.create({});
|
|
455
458
|
// Check for duplicate if set to prevent or proceed if turned off
|
|
456
|
-
if (
|
|
459
|
+
if (isPlatformBrowser(this.platformId) &&
|
|
460
|
+
(this.beaconAllowDuplicate || (([undefined, false].includes(this.beaconGlobalDuplicate) && this.isNewBeaconADuplicate(signature) == !1) || this.beaconGlobalDuplicate))) {
|
|
457
461
|
const beaconObject = {
|
|
458
462
|
bid: beaconId,
|
|
459
463
|
mid: this.beaconManualId,
|
|
@@ -613,7 +617,7 @@ class BeaconNotifyService {
|
|
|
613
617
|
const duplicate = this.beaconLibrary.find(x => x.signature == signature);
|
|
614
618
|
return Boolean(duplicate);
|
|
615
619
|
}
|
|
616
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.1.2", ngImport: i0, type: BeaconNotifyService, deps: [{ token: i1.DomSanitizer }, { token: BEACON_GLOBAL_CONFIG }], target: i0.ɵɵFactoryTarget.Injectable });
|
|
620
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.1.2", ngImport: i0, type: BeaconNotifyService, deps: [{ token: i1.DomSanitizer }, { token: PLATFORM_ID }, { token: BEACON_GLOBAL_CONFIG }], target: i0.ɵɵFactoryTarget.Injectable });
|
|
617
621
|
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.1.2", ngImport: i0, type: BeaconNotifyService, providedIn: 'root' });
|
|
618
622
|
}
|
|
619
623
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.1.2", ngImport: i0, type: BeaconNotifyService, decorators: [{
|
|
@@ -622,6 +626,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.1.2", ngImpor
|
|
|
622
626
|
providedIn: 'root'
|
|
623
627
|
}]
|
|
624
628
|
}], ctorParameters: () => [{ type: i1.DomSanitizer }, { type: undefined, decorators: [{
|
|
629
|
+
type: Inject,
|
|
630
|
+
args: [PLATFORM_ID]
|
|
631
|
+
}] }, { type: undefined, decorators: [{
|
|
625
632
|
type: Inject,
|
|
626
633
|
args: [BEACON_GLOBAL_CONFIG]
|
|
627
634
|
}] }] });
|
|
@@ -840,11 +847,27 @@ class BeaconNotifyComponent {
|
|
|
840
847
|
}
|
|
841
848
|
}
|
|
842
849
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.1.2", ngImport: i0, type: BeaconNotifyComponent, deps: [{ token: BeaconNotifyService }, { token: i1.DomSanitizer }], target: i0.ɵɵFactoryTarget.Component });
|
|
843
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.1.2", type: BeaconNotifyComponent, selector: "app-beacon", inputs: { beacon: "beacon" }, viewQueries: [{ propertyName: "currentBeacon", first: true, predicate: ["beaconControl"], descendants: true, static: true }], ngImport: i0, template: "<div #beaconControl \n\t\t[id]=\"'bc_' + beacon.bid\"\n\t\t(mouseenter)=\"autoClose(false, beaconControl)\" \n\t\t(mouseleave)=\"autoClose(true, beaconControl)\"\n\t\t(click)=\"beacon.preventClickClose ? null : closeBeacon(beaconControl, beacon)\"\n\t\t[attr.data-beacon-static]=\"beacon.static\"\n\t\tclass=\"beacon-message-control {{ (beacon.static !== true && beacon.fixed !== true) ? beacon.animationClass : '' }} {{ beacon.replacementClass || beacon.type }} {{ beacon.styleClass }}\"\n\t\t[class.beacon-message-control-no-hover-effect]=\"beacon.noHoverEffect\">\n\t<div class=\"beacon-message-header\">\n\t\t<div>\n\t\t\t<span *ngIf=\"beacon.fontIcon\"><i [class]=\"beacon.icon\"></i></span>\n\t\t\t<span *ngIf=\"!beacon.fontIcon && beaconDefaultIconKeys.includes(beacon.icon)\" class=\"beacon-message-svg-control\">\n\t\t\t\t<app-beacon-icon-alert *ngIf=\"beacon.icon | beaconTypeResolve:'alert'\"></app-beacon-icon-alert>\n\t\t\t\t<app-beacon-icon-error *ngIf=\"beacon.icon | beaconTypeResolve:'error'\"></app-beacon-icon-error>\n\t\t\t\t<app-beacon-icon-info *ngIf=\"beacon.icon | beaconTypeResolve:'info'\"></app-beacon-icon-info>\n\t\t\t\t<app-beacon-icon-success *ngIf=\"beacon.icon | beaconTypeResolve:'success'\"></app-beacon-icon-success>\n\t\t\t\t<app-beacon-icon-warning *ngIf=\"beacon.icon | beaconTypeResolve:'warning'\"></app-beacon-icon-warning>\n\t\t\t</span>\n\t\t\t<span *ngIf=\"!beacon.fontIcon && beacon.icon && !beaconDefaultIconKeys.includes(beacon.icon)\" class=\"beacon-message-svg-control\" [innerHTML]=\"beacon.svgIcon\"></span>\n\t\t\t<span class=\"beacon-message-title\">{{ beacon.title }}</span>\n\t\t</div>\n\t\t<div>\n\t\t\t<div *ngIf=\"!beacon.fixed\" class=\"beacon-message-close\" (click)=\"closeBeacon(beaconControl, beacon)\">\n\t\t\t\t<svg width=\"10\" height=\"10\" viewBox=\"0 0 78 78\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n\t\t\t <rect y=\"7.07104\" width=\"10\" height=\"100\" rx=\"5\" transform=\"rotate(-45 0 7.07104)\" />\n\t\t\t <rect x=\"70.7109\" width=\"10\" height=\"100\" rx=\"5\" transform=\"rotate(45 70.7109 0)\" />\n\t\t\t\t</svg>\n\t\t\t</div>\n\t\t</div>\n\t</div>\n\t<div class=\"beacon-message-divider\"></div>\n\t<div class=\"beacon-message-body\" [innerHTML]=\"beacon.bodyHtml\"></div>\n\t<div class=\"beacon-message-divider\" *ngIf=\"beacon.buttons?.one || beacon.buttons?.two\"></div>\n\n\t<div class=\"beacon-message-footer\" *ngIf=\"beacon.buttons && beacon.buttons?.one && beacon.buttons?.two\">\n\t\t<div><button (click)=\"beaconButtonClick($event, 1)\">{{ beacon.buttons?.one?.text }}</button></div>\n\t\t<div><button (click)=\"beaconButtonClick($event, 2)\">{{ beacon.buttons?.two?.text }}</button></div>\n\t</div>\n\n\t<div class=\"beacon-message-footer\" *ngIf=\"beacon.buttons && beacon.buttons?.one && !beacon?.buttons?.two\">\n\t\t<div [class]=\"beacon.buttons?.one?.position ? ('beacon-message-button-container-' + beacon?.buttons?.one?.position) : ''\">\n\t\t\t<button (click)=\"beaconButtonClick($event, 1)\">{{ beacon.buttons?.one?.text }}</button>\n\t\t</div>\n\t</div>\n\n</div>", styles: [".beacon-message-svg-control{position:relative;top:0}.beacon-message-title{display:inline-flex;padding-right:5px}.beacon-message-control{width:270px;height:auto;background:#eee;margin:6px;border-radius:4px;position:relative;z-index:4000;cursor:pointer}.beacon-message-control:hover{box-shadow:0 0 20px #4443}.beacon-message-control-no-hover-effect{box-shadow:none!important}.beacon-message-control-animate{-webkit-animation:beacon-fade-out .5s 7s linear forwards;animation:beacon-fade-out .5s 7s linear forwards}.beacon-message-header,.beacon-message-body,.beacon-message-footer{padding:8px;font-size:15px}.beacon-message-header{display:flex;font-size:15px}.beacon-message-header>div:first-child{flex-grow:1;display:flex;place-items:flex-start;word-break:break-word}.beacon-message-header>div:first-child i{font-size:20px;margin-right:7px;margin-top:2px}.beacon-message-header>div:last-child{flex-grow:0}.beacon-message-divider{border-top:1px solid #44444433}.beacon-message-close{height:22px;width:22px;border:1px solid #444444;display:flex;place-items:center;place-content:center;border-radius:100%;cursor:pointer;opacity:.3}.beacon-message-close svg rect{fill:#444}.beacon-message-close:hover{opacity:.7}.beacon-message-alert{background:#eee;color:#5e5e5e}.beacon-message-alert .beacon-message-footer button{border:1px solid #5E5E5E;color:#5e5e5e}.beacon-message-alert .beacon-message-footer button:hover{background:#5e5e5e;color:#fff}.beacon-message-success{background:#f0fff0;color:#698b69}.beacon-message-success .beacon-message-divider{border-color:#698b6933}.beacon-message-success .beacon-message-footer button{border:1px solid #698B69;color:#698b69}.beacon-message-success .beacon-message-footer button:hover{background:#698b69;color:#fff}.beacon-message-error{background:#ffe4e1;color:#b22222}.beacon-message-error .beacon-message-divider{border-color:#ee3b3b33}.beacon-message-error .beacon-message-footer button{border:1px solid #B22222;color:#b22222}.beacon-message-error .beacon-message-footer button:hover{background:#b22222;color:#fff}.beacon-message-warning{background:#fffacd;color:#b8860b}.beacon-message-warning .beacon-message-divider{border-color:#ffd70088}.beacon-message-warning .beacon-message-footer button{border:1px solid #B8860B;color:#b8860b}.beacon-message-warning .beacon-message-footer button:hover{background:#b8860b;color:#fff}.beacon-message-info{background:#bfefff;color:#4a708b}.beacon-message-info .beacon-message-divider{border-color:#5cacee33}.beacon-message-info .beacon-message-footer button{border:1px solid #4A708B;color:#4a708b}.beacon-message-info .beacon-message-footer button:hover{background:#4a708b;color:#fff}.beacon-message-footer{display:flex}.beacon-message-footer>div:first-child{flex-grow:1}.beacon-message-footer>div:last-child{flex-grow:1;text-align:right}.beacon-message-footer button{padding:4px 7px;border-radius:5px;-webkit-border-radius:5px;-moz-border-radius:5px;background:transparent;cursor:pointer}.beacon-message-footer .beacon-message-button-container-left{text-align:left!important}.beacon-message-footer .beacon-message-button-container-center{text-align:center!important}.beacon-message-footer .beacon-message-button-container-right{text-align:right!important}@keyframes beacon-fade-out{90%{opacity:0;display:none}to{opacity:0;display:none}}\n"], dependencies: [{ kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: BeaconIconAlertComponent, selector: "app-beacon-icon-alert" }, { kind: "component", type: BeaconIconErrorComponent, selector: "app-beacon-icon-error" }, { kind: "component", type: BeaconIconInfoComponent, selector: "app-beacon-icon-info" }, { kind: "component", type: BeaconIconSuccessComponent, selector: "app-beacon-icon-success" }, { kind: "component", type: BeaconIconWarningComponent, selector: "app-beacon-icon-warning" }, { kind: "pipe", type: BeaconTypeResolvePipe, name: "beaconTypeResolve" }]
|
|
850
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.1.2", type: BeaconNotifyComponent, selector: "app-beacon", inputs: { beacon: "beacon" }, viewQueries: [{ propertyName: "currentBeacon", first: true, predicate: ["beaconControl"], descendants: true, static: true }], ngImport: i0, template: "<div #beaconControl \n\t\t[id]=\"'bc_' + beacon.bid\"\n\t\t(mouseenter)=\"autoClose(false, beaconControl)\" \n\t\t(mouseleave)=\"autoClose(true, beaconControl)\"\n\t\t(click)=\"beacon.preventClickClose ? null : closeBeacon(beaconControl, beacon)\"\n\t\t[attr.data-beacon-static]=\"beacon.static\"\n\t\tclass=\"beacon-message-control {{ (beacon.static !== true && beacon.fixed !== true) ? beacon.animationClass : '' }} {{ beacon.replacementClass || beacon.type }} {{ beacon.styleClass }}\"\n\t\t[class.beacon-message-control-no-hover-effect]=\"beacon.noHoverEffect\"\n\t\t[@fadeInOut]>\n\t<div class=\"beacon-message-header\">\n\t\t<div>\n\t\t\t<span *ngIf=\"beacon.fontIcon\"><i [class]=\"beacon.icon\"></i></span>\n\t\t\t<span *ngIf=\"!beacon.fontIcon && beaconDefaultIconKeys.includes(beacon.icon)\" class=\"beacon-message-svg-control\">\n\t\t\t\t<app-beacon-icon-alert *ngIf=\"beacon.icon | beaconTypeResolve:'alert'\"></app-beacon-icon-alert>\n\t\t\t\t<app-beacon-icon-error *ngIf=\"beacon.icon | beaconTypeResolve:'error'\"></app-beacon-icon-error>\n\t\t\t\t<app-beacon-icon-info *ngIf=\"beacon.icon | beaconTypeResolve:'info'\"></app-beacon-icon-info>\n\t\t\t\t<app-beacon-icon-success *ngIf=\"beacon.icon | beaconTypeResolve:'success'\"></app-beacon-icon-success>\n\t\t\t\t<app-beacon-icon-warning *ngIf=\"beacon.icon | beaconTypeResolve:'warning'\"></app-beacon-icon-warning>\n\t\t\t</span>\n\t\t\t<span *ngIf=\"!beacon.fontIcon && beacon.icon && !beaconDefaultIconKeys.includes(beacon.icon)\" class=\"beacon-message-svg-control\" [innerHTML]=\"beacon.svgIcon\"></span>\n\t\t\t<span class=\"beacon-message-title\">{{ beacon.title }}</span>\n\t\t</div>\n\t\t<div>\n\t\t\t<div *ngIf=\"!beacon.fixed\" class=\"beacon-message-close\" (click)=\"closeBeacon(beaconControl, beacon)\">\n\t\t\t\t<svg width=\"10\" height=\"10\" viewBox=\"0 0 78 78\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n\t\t\t <rect y=\"7.07104\" width=\"10\" height=\"100\" rx=\"5\" transform=\"rotate(-45 0 7.07104)\" />\n\t\t\t <rect x=\"70.7109\" width=\"10\" height=\"100\" rx=\"5\" transform=\"rotate(45 70.7109 0)\" />\n\t\t\t\t</svg>\n\t\t\t</div>\n\t\t</div>\n\t</div>\n\t<div class=\"beacon-message-divider\"></div>\n\t<div class=\"beacon-message-body\" [innerHTML]=\"beacon.bodyHtml\"></div>\n\t<div class=\"beacon-message-divider\" *ngIf=\"beacon.buttons?.one || beacon.buttons?.two\"></div>\n\n\t<div class=\"beacon-message-footer\" *ngIf=\"beacon.buttons && beacon.buttons?.one && beacon.buttons?.two\">\n\t\t<div><button (click)=\"beaconButtonClick($event, 1)\">{{ beacon.buttons?.one?.text }}</button></div>\n\t\t<div><button (click)=\"beaconButtonClick($event, 2)\">{{ beacon.buttons?.two?.text }}</button></div>\n\t</div>\n\n\t<div class=\"beacon-message-footer\" *ngIf=\"beacon.buttons && beacon.buttons?.one && !beacon?.buttons?.two\">\n\t\t<div [class]=\"beacon.buttons?.one?.position ? ('beacon-message-button-container-' + beacon?.buttons?.one?.position) : ''\">\n\t\t\t<button (click)=\"beaconButtonClick($event, 1)\">{{ beacon.buttons?.one?.text }}</button>\n\t\t</div>\n\t</div>\n\n</div>", styles: [".beacon-message-svg-control{position:relative;top:0}.beacon-message-title{display:inline-flex;padding-right:5px}.beacon-message-control{width:270px;height:auto;background:#eee;margin:6px;border-radius:4px;position:relative;z-index:4000;cursor:pointer}.beacon-message-control:hover{box-shadow:0 0 20px #4443}.beacon-message-control-no-hover-effect{box-shadow:none!important}.beacon-message-control-animate{-webkit-animation:beacon-fade-out .5s 7s linear forwards;animation:beacon-fade-out .5s 7s linear forwards}.beacon-message-header,.beacon-message-body,.beacon-message-footer{padding:8px;font-size:15px}.beacon-message-header{display:flex;font-size:15px}.beacon-message-header>div:first-child{flex-grow:1;display:flex;place-items:flex-start;word-break:break-word}.beacon-message-header>div:first-child i{font-size:20px;margin-right:7px;margin-top:2px}.beacon-message-header>div:last-child{flex-grow:0}.beacon-message-divider{border-top:1px solid #44444433}.beacon-message-close{height:22px;width:22px;border:1px solid #444444;display:flex;place-items:center;place-content:center;border-radius:100%;cursor:pointer;opacity:.3}.beacon-message-close svg rect{fill:#444}.beacon-message-close:hover{opacity:.7}.beacon-message-alert{background:#eee;color:#5e5e5e}.beacon-message-alert .beacon-message-footer button{border:1px solid #5E5E5E;color:#5e5e5e}.beacon-message-alert .beacon-message-footer button:hover{background:#5e5e5e;color:#fff}.beacon-message-success{background:#f0fff0;color:#698b69}.beacon-message-success .beacon-message-divider{border-color:#698b6933}.beacon-message-success .beacon-message-footer button{border:1px solid #698B69;color:#698b69}.beacon-message-success .beacon-message-footer button:hover{background:#698b69;color:#fff}.beacon-message-error{background:#ffe4e1;color:#b22222}.beacon-message-error .beacon-message-divider{border-color:#ee3b3b33}.beacon-message-error .beacon-message-footer button{border:1px solid #B22222;color:#b22222}.beacon-message-error .beacon-message-footer button:hover{background:#b22222;color:#fff}.beacon-message-warning{background:#fffacd;color:#b8860b}.beacon-message-warning .beacon-message-divider{border-color:#ffd70088}.beacon-message-warning .beacon-message-footer button{border:1px solid #B8860B;color:#b8860b}.beacon-message-warning .beacon-message-footer button:hover{background:#b8860b;color:#fff}.beacon-message-info{background:#bfefff;color:#4a708b}.beacon-message-info .beacon-message-divider{border-color:#5cacee33}.beacon-message-info .beacon-message-footer button{border:1px solid #4A708B;color:#4a708b}.beacon-message-info .beacon-message-footer button:hover{background:#4a708b;color:#fff}.beacon-message-footer{display:flex}.beacon-message-footer>div:first-child{flex-grow:1}.beacon-message-footer>div:last-child{flex-grow:1;text-align:right}.beacon-message-footer button{padding:4px 7px;border-radius:5px;-webkit-border-radius:5px;-moz-border-radius:5px;background:transparent;cursor:pointer}.beacon-message-footer .beacon-message-button-container-left{text-align:left!important}.beacon-message-footer .beacon-message-button-container-center{text-align:center!important}.beacon-message-footer .beacon-message-button-container-right{text-align:right!important}@keyframes beacon-fade-out{90%{opacity:0;display:none}to{opacity:0;display:none}}\n"], dependencies: [{ kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: BeaconIconAlertComponent, selector: "app-beacon-icon-alert" }, { kind: "component", type: BeaconIconErrorComponent, selector: "app-beacon-icon-error" }, { kind: "component", type: BeaconIconInfoComponent, selector: "app-beacon-icon-info" }, { kind: "component", type: BeaconIconSuccessComponent, selector: "app-beacon-icon-success" }, { kind: "component", type: BeaconIconWarningComponent, selector: "app-beacon-icon-warning" }, { kind: "pipe", type: BeaconTypeResolvePipe, name: "beaconTypeResolve" }], animations: [
|
|
851
|
+
trigger('fadeInOut', [
|
|
852
|
+
transition(':enter', [
|
|
853
|
+
style({ opacity: 0 }),
|
|
854
|
+
animate('300ms ease-in', style({ opacity: 1 })),
|
|
855
|
+
]),
|
|
856
|
+
transition(':leave', [animate('300ms ease-out', style({ opacity: 0 }))]),
|
|
857
|
+
]),
|
|
858
|
+
] });
|
|
844
859
|
}
|
|
845
860
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.1.2", ngImport: i0, type: BeaconNotifyComponent, decorators: [{
|
|
846
861
|
type: Component,
|
|
847
|
-
args: [{ selector: 'app-beacon',
|
|
862
|
+
args: [{ selector: 'app-beacon', animations: [
|
|
863
|
+
trigger('fadeInOut', [
|
|
864
|
+
transition(':enter', [
|
|
865
|
+
style({ opacity: 0 }),
|
|
866
|
+
animate('300ms ease-in', style({ opacity: 1 })),
|
|
867
|
+
]),
|
|
868
|
+
transition(':leave', [animate('300ms ease-out', style({ opacity: 0 }))]),
|
|
869
|
+
]),
|
|
870
|
+
], template: "<div #beaconControl \n\t\t[id]=\"'bc_' + beacon.bid\"\n\t\t(mouseenter)=\"autoClose(false, beaconControl)\" \n\t\t(mouseleave)=\"autoClose(true, beaconControl)\"\n\t\t(click)=\"beacon.preventClickClose ? null : closeBeacon(beaconControl, beacon)\"\n\t\t[attr.data-beacon-static]=\"beacon.static\"\n\t\tclass=\"beacon-message-control {{ (beacon.static !== true && beacon.fixed !== true) ? beacon.animationClass : '' }} {{ beacon.replacementClass || beacon.type }} {{ beacon.styleClass }}\"\n\t\t[class.beacon-message-control-no-hover-effect]=\"beacon.noHoverEffect\"\n\t\t[@fadeInOut]>\n\t<div class=\"beacon-message-header\">\n\t\t<div>\n\t\t\t<span *ngIf=\"beacon.fontIcon\"><i [class]=\"beacon.icon\"></i></span>\n\t\t\t<span *ngIf=\"!beacon.fontIcon && beaconDefaultIconKeys.includes(beacon.icon)\" class=\"beacon-message-svg-control\">\n\t\t\t\t<app-beacon-icon-alert *ngIf=\"beacon.icon | beaconTypeResolve:'alert'\"></app-beacon-icon-alert>\n\t\t\t\t<app-beacon-icon-error *ngIf=\"beacon.icon | beaconTypeResolve:'error'\"></app-beacon-icon-error>\n\t\t\t\t<app-beacon-icon-info *ngIf=\"beacon.icon | beaconTypeResolve:'info'\"></app-beacon-icon-info>\n\t\t\t\t<app-beacon-icon-success *ngIf=\"beacon.icon | beaconTypeResolve:'success'\"></app-beacon-icon-success>\n\t\t\t\t<app-beacon-icon-warning *ngIf=\"beacon.icon | beaconTypeResolve:'warning'\"></app-beacon-icon-warning>\n\t\t\t</span>\n\t\t\t<span *ngIf=\"!beacon.fontIcon && beacon.icon && !beaconDefaultIconKeys.includes(beacon.icon)\" class=\"beacon-message-svg-control\" [innerHTML]=\"beacon.svgIcon\"></span>\n\t\t\t<span class=\"beacon-message-title\">{{ beacon.title }}</span>\n\t\t</div>\n\t\t<div>\n\t\t\t<div *ngIf=\"!beacon.fixed\" class=\"beacon-message-close\" (click)=\"closeBeacon(beaconControl, beacon)\">\n\t\t\t\t<svg width=\"10\" height=\"10\" viewBox=\"0 0 78 78\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n\t\t\t <rect y=\"7.07104\" width=\"10\" height=\"100\" rx=\"5\" transform=\"rotate(-45 0 7.07104)\" />\n\t\t\t <rect x=\"70.7109\" width=\"10\" height=\"100\" rx=\"5\" transform=\"rotate(45 70.7109 0)\" />\n\t\t\t\t</svg>\n\t\t\t</div>\n\t\t</div>\n\t</div>\n\t<div class=\"beacon-message-divider\"></div>\n\t<div class=\"beacon-message-body\" [innerHTML]=\"beacon.bodyHtml\"></div>\n\t<div class=\"beacon-message-divider\" *ngIf=\"beacon.buttons?.one || beacon.buttons?.two\"></div>\n\n\t<div class=\"beacon-message-footer\" *ngIf=\"beacon.buttons && beacon.buttons?.one && beacon.buttons?.two\">\n\t\t<div><button (click)=\"beaconButtonClick($event, 1)\">{{ beacon.buttons?.one?.text }}</button></div>\n\t\t<div><button (click)=\"beaconButtonClick($event, 2)\">{{ beacon.buttons?.two?.text }}</button></div>\n\t</div>\n\n\t<div class=\"beacon-message-footer\" *ngIf=\"beacon.buttons && beacon.buttons?.one && !beacon?.buttons?.two\">\n\t\t<div [class]=\"beacon.buttons?.one?.position ? ('beacon-message-button-container-' + beacon?.buttons?.one?.position) : ''\">\n\t\t\t<button (click)=\"beaconButtonClick($event, 1)\">{{ beacon.buttons?.one?.text }}</button>\n\t\t</div>\n\t</div>\n\n</div>", styles: [".beacon-message-svg-control{position:relative;top:0}.beacon-message-title{display:inline-flex;padding-right:5px}.beacon-message-control{width:270px;height:auto;background:#eee;margin:6px;border-radius:4px;position:relative;z-index:4000;cursor:pointer}.beacon-message-control:hover{box-shadow:0 0 20px #4443}.beacon-message-control-no-hover-effect{box-shadow:none!important}.beacon-message-control-animate{-webkit-animation:beacon-fade-out .5s 7s linear forwards;animation:beacon-fade-out .5s 7s linear forwards}.beacon-message-header,.beacon-message-body,.beacon-message-footer{padding:8px;font-size:15px}.beacon-message-header{display:flex;font-size:15px}.beacon-message-header>div:first-child{flex-grow:1;display:flex;place-items:flex-start;word-break:break-word}.beacon-message-header>div:first-child i{font-size:20px;margin-right:7px;margin-top:2px}.beacon-message-header>div:last-child{flex-grow:0}.beacon-message-divider{border-top:1px solid #44444433}.beacon-message-close{height:22px;width:22px;border:1px solid #444444;display:flex;place-items:center;place-content:center;border-radius:100%;cursor:pointer;opacity:.3}.beacon-message-close svg rect{fill:#444}.beacon-message-close:hover{opacity:.7}.beacon-message-alert{background:#eee;color:#5e5e5e}.beacon-message-alert .beacon-message-footer button{border:1px solid #5E5E5E;color:#5e5e5e}.beacon-message-alert .beacon-message-footer button:hover{background:#5e5e5e;color:#fff}.beacon-message-success{background:#f0fff0;color:#698b69}.beacon-message-success .beacon-message-divider{border-color:#698b6933}.beacon-message-success .beacon-message-footer button{border:1px solid #698B69;color:#698b69}.beacon-message-success .beacon-message-footer button:hover{background:#698b69;color:#fff}.beacon-message-error{background:#ffe4e1;color:#b22222}.beacon-message-error .beacon-message-divider{border-color:#ee3b3b33}.beacon-message-error .beacon-message-footer button{border:1px solid #B22222;color:#b22222}.beacon-message-error .beacon-message-footer button:hover{background:#b22222;color:#fff}.beacon-message-warning{background:#fffacd;color:#b8860b}.beacon-message-warning .beacon-message-divider{border-color:#ffd70088}.beacon-message-warning .beacon-message-footer button{border:1px solid #B8860B;color:#b8860b}.beacon-message-warning .beacon-message-footer button:hover{background:#b8860b;color:#fff}.beacon-message-info{background:#bfefff;color:#4a708b}.beacon-message-info .beacon-message-divider{border-color:#5cacee33}.beacon-message-info .beacon-message-footer button{border:1px solid #4A708B;color:#4a708b}.beacon-message-info .beacon-message-footer button:hover{background:#4a708b;color:#fff}.beacon-message-footer{display:flex}.beacon-message-footer>div:first-child{flex-grow:1}.beacon-message-footer>div:last-child{flex-grow:1;text-align:right}.beacon-message-footer button{padding:4px 7px;border-radius:5px;-webkit-border-radius:5px;-moz-border-radius:5px;background:transparent;cursor:pointer}.beacon-message-footer .beacon-message-button-container-left{text-align:left!important}.beacon-message-footer .beacon-message-button-container-center{text-align:center!important}.beacon-message-footer .beacon-message-button-container-right{text-align:right!important}@keyframes beacon-fade-out{90%{opacity:0;display:none}to{opacity:0;display:none}}\n"] }]
|
|
848
871
|
}], ctorParameters: () => [{ type: BeaconNotifyService }, { type: i1.DomSanitizer }], propDecorators: { beacon: [{
|
|
849
872
|
type: Input
|
|
850
873
|
}], currentBeacon: [{
|