ngx-gem-spaas
Version:
This library contains services, components, images and styles to provide a unified look and way-of-working throughout GEM SPaaS.
67 lines • 10.4 kB
JavaScript
import { Component, HostListener, Input } from '@angular/core';
import { BaseComponent } from "ngx-gem-spaas";
import * as i0 from "@angular/core";
import * as i1 from "../_services/crossbar.service";
import * as i2 from "@angular/material/tooltip";
/**
* This component creates the connection to the crossbar websocket server and
* shows a state indicator in the bottom left corner of your app.
* */
export class CrossbarStateComponent extends BaseComponent {
constructor(crossbarService) {
super();
this.crossbarService = crossbarService;
this.fromBottomPx = 14;
this.crossbarActive = false;
}
onFocus() {
// ALSO CHECK IF TAB IS VISIBLE
if (document.visibilityState !== 'hidden') {
this.crossbarConnect();
}
}
ngOnInit() {
this.crossbarConnect();
}
ngOnDestroy() {
this.crossbarService.stopConnection();
super.ngOnDestroy();
}
// ********************************************************************************************************
// LOADING DATA
// ********************************************************************************************************
crossbarConnect() {
if (!this.crossbarService.crossbar || !this.crossbarService.crossbar.isConnected || !this.crossbarService.crossbar.isOpen) {
this.crossbarService.startConnection();
this.wsCrossbarSubscribe();
}
else {
this.crossbarActive = true;
}
}
wsCrossbarSubscribe() {
this.crossbarService.onNewWsMessage()
.subscribe((responseData) => {
if (responseData.type === 'connected') {
// DO NOTHING, JUST WS CONNECTING
this.crossbarActive = true;
}
else if (responseData.type === 'error' || responseData.type === 'disconnected') {
// DO NOTHING, ERROR OR DISCONNECT => XBAR RECONNECTS AUTOMATICALLY
this.crossbarActive = false;
}
});
}
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: CrossbarStateComponent, deps: [{ token: i1.CrossbarService }], target: i0.ɵɵFactoryTarget.Component }); }
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: CrossbarStateComponent, selector: "spaas-crossbar", inputs: { fromBottomPx: "fromBottomPx" }, host: { listeners: { "window:focus": "onFocus($event)" } }, usesInheritance: true, ngImport: i0, template: "<div [class.nok]=\"!crossbarActive\"\r\n [class.ok]=\"crossbarActive\"\r\n [style.bottom.px]=\"fromBottomPx\"\r\n class=\"ws-state\"\r\n matTooltip=\"{{crossbarActive ? 'live update OK' : 'live update NOK'}}\">\r\n</div>\r\n", styles: [""], dependencies: [{ kind: "directive", type: i2.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: CrossbarStateComponent, decorators: [{
type: Component,
args: [{ selector: 'spaas-crossbar', template: "<div [class.nok]=\"!crossbarActive\"\r\n [class.ok]=\"crossbarActive\"\r\n [style.bottom.px]=\"fromBottomPx\"\r\n class=\"ws-state\"\r\n matTooltip=\"{{crossbarActive ? 'live update OK' : 'live update NOK'}}\">\r\n</div>\r\n" }]
}], ctorParameters: () => [{ type: i1.CrossbarService }], propDecorators: { fromBottomPx: [{
type: Input
}], onFocus: [{
type: HostListener,
args: ['window:focus', ['$event']]
}] } });
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiY3Jvc3NiYXItc3RhdGUuY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvbmd4LWdlbS1zcGFhcy9jcm9zc2Jhci9zcmMvY3Jvc3NiYXItc3RhdGUvY3Jvc3NiYXItc3RhdGUuY29tcG9uZW50LnRzIiwiLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvbmd4LWdlbS1zcGFhcy9jcm9zc2Jhci9zcmMvY3Jvc3NiYXItc3RhdGUvY3Jvc3NiYXItc3RhdGUuY29tcG9uZW50Lmh0bWwiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFDLFNBQVMsRUFBRSxZQUFZLEVBQUUsS0FBSyxFQUFvQixNQUFNLGVBQWUsQ0FBQztBQUVoRixPQUFPLEVBQUMsYUFBYSxFQUFDLE1BQU0sZUFBZSxDQUFDOzs7O0FBUTVDOzs7S0FHSztBQUNMLE1BQU0sT0FBTyxzQkFBdUIsU0FBUSxhQUFhO0lBTXZELFlBQ1UsZUFBZ0M7UUFFeEMsS0FBSyxFQUFFLENBQUM7UUFGQSxvQkFBZSxHQUFmLGVBQWUsQ0FBaUI7UUFMakMsaUJBQVksR0FBRyxFQUFFLENBQUM7UUFFM0IsbUJBQWMsR0FBRyxLQUFLLENBQUM7SUFNdkIsQ0FBQztJQUV5QyxPQUFPO1FBQy9DLCtCQUErQjtRQUMvQixJQUFJLFFBQVEsQ0FBQyxlQUFlLEtBQUssUUFBUSxFQUFFLENBQUM7WUFDMUMsSUFBSSxDQUFDLGVBQWUsRUFBRSxDQUFDO1FBQ3pCLENBQUM7SUFDSCxDQUFDO0lBRUQsUUFBUTtRQUNOLElBQUksQ0FBQyxlQUFlLEVBQUUsQ0FBQztJQUN6QixDQUFDO0lBR1EsV0FBVztRQUNsQixJQUFJLENBQUMsZUFBZSxDQUFDLGNBQWMsRUFBRSxDQUFDO1FBQ3RDLEtBQUssQ0FBQyxXQUFXLEVBQUUsQ0FBQTtJQUNyQixDQUFDO0lBR0QsMkdBQTJHO0lBQzNHLGVBQWU7SUFDZiwyR0FBMkc7SUFFbkcsZUFBZTtRQUNyQixJQUFJLENBQUMsSUFBSSxDQUFDLGVBQWUsQ0FBQyxRQUFRLElBQUksQ0FBQyxJQUFJLENBQUMsZUFBZSxDQUFDLFFBQVEsQ0FBQyxXQUFXLElBQUksQ0FBQyxJQUFJLENBQUMsZUFBZSxDQUFDLFFBQVEsQ0FBQyxNQUFNLEVBQUUsQ0FBQztZQUMxSCxJQUFJLENBQUMsZUFBZSxDQUFDLGVBQWUsRUFBRSxDQUFDO1lBQ3ZDLElBQUksQ0FBQyxtQkFBbUIsRUFBRSxDQUFDO1FBQzdCLENBQUM7YUFBTSxDQUFDO1lBQ04sSUFBSSxDQUFDLGNBQWMsR0FBRyxJQUFJLENBQUM7UUFDN0IsQ0FBQztJQUNILENBQUM7SUFFTyxtQkFBbUI7UUFDekIsSUFBSSxDQUFDLGVBQWUsQ0FBQyxjQUFjLEVBQUU7YUFDbEMsU0FBUyxDQUNSLENBQUMsWUFBWSxFQUFFLEVBQUU7WUFDZixJQUFJLFlBQVksQ0FBQyxJQUFJLEtBQUssV0FBVyxFQUFFLENBQUM7Z0JBQ3RDLGlDQUFpQztnQkFDakMsSUFBSSxDQUFDLGNBQWMsR0FBRyxJQUFJLENBQUM7WUFDN0IsQ0FBQztpQkFBTSxJQUFJLFlBQVksQ0FBQyxJQUFJLEtBQUssT0FBTyxJQUFJLFlBQVksQ0FBQyxJQUFJLEtBQUssY0FBYyxFQUFFLENBQUM7Z0JBQ2pGLG1FQUFtRTtnQkFDbkUsSUFBSSxDQUFDLGNBQWMsR0FBRyxLQUFLLENBQUM7WUFDOUIsQ0FBQztRQUNILENBQUMsQ0FDRixDQUFDO0lBQ04sQ0FBQzsrR0F4RFUsc0JBQXNCO21HQUF0QixzQkFBc0IsbUxDZG5DLGtQQU1BOzs0RkRRYSxzQkFBc0I7a0JBVmxDLFNBQVM7K0JBQ0UsZ0JBQWdCO29GQVdqQixZQUFZO3NCQUFwQixLQUFLO2dCQVVvQyxPQUFPO3NCQUFoRCxZQUFZO3VCQUFDLGNBQWMsRUFBRSxDQUFDLFFBQVEsQ0FBQyIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7Q29tcG9uZW50LCBIb3N0TGlzdGVuZXIsIElucHV0LCBPbkRlc3Ryb3ksIE9uSW5pdH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XHJcbmltcG9ydCB7Q3Jvc3NiYXJTZXJ2aWNlfSBmcm9tIFwiLi4vX3NlcnZpY2VzL2Nyb3NzYmFyLnNlcnZpY2VcIjtcclxuaW1wb3J0IHtCYXNlQ29tcG9uZW50fSBmcm9tIFwibmd4LWdlbS1zcGFhc1wiO1xyXG5cclxuQENvbXBvbmVudCh7XHJcbiAgc2VsZWN0b3I6ICdzcGFhcy1jcm9zc2JhcicsXHJcbiAgc3R5bGVVcmxzOiBbJy4vY3Jvc3NiYXItc3RhdGUuY29tcG9uZW50LnNjc3MnXSxcclxuICB0ZW1wbGF0ZVVybDogJy4vY3Jvc3NiYXItc3RhdGUuY29tcG9uZW50Lmh0bWwnLFxyXG59KVxyXG5cclxuLyoqXHJcbiAqIFRoaXMgY29tcG9uZW50IGNyZWF0ZXMgdGhlIGNvbm5lY3Rpb24gdG8gdGhlIGNyb3NzYmFyIHdlYnNvY2tldCBzZXJ2ZXIgYW5kXHJcbiAqIHNob3dzIGEgc3RhdGUgaW5kaWNhdG9yIGluIHRoZSBib3R0b20gbGVmdCBjb3JuZXIgb2YgeW91ciBhcHAuXHJcbiAqICovXHJcbmV4cG9ydCBjbGFzcyBDcm9zc2JhclN0YXRlQ29tcG9uZW50IGV4dGVuZHMgQmFzZUNvbXBvbmVudCBpbXBsZW1lbnRzIE9uSW5pdCwgT25EZXN0cm95IHtcclxuXHJcbiAgQElucHV0KCkgZnJvbUJvdHRvbVB4ID0gMTQ7XHJcblxyXG4gIGNyb3NzYmFyQWN0aXZlID0gZmFsc2U7XHJcblxyXG4gIGNvbnN0cnVjdG9yKFxyXG4gICAgcHJpdmF0ZSBjcm9zc2JhclNlcnZpY2U6IENyb3NzYmFyU2VydmljZSxcclxuICApIHtcclxuICAgIHN1cGVyKCk7XHJcbiAgfVxyXG5cclxuICBASG9zdExpc3RlbmVyKCd3aW5kb3c6Zm9jdXMnLCBbJyRldmVudCddKSBvbkZvY3VzKCk6IHZvaWQge1xyXG4gICAgLy8gQUxTTyBDSEVDSyBJRiBUQUIgSVMgVklTSUJMRVxyXG4gICAgaWYgKGRvY3VtZW50LnZpc2liaWxpdHlTdGF0ZSAhPT0gJ2hpZGRlbicpIHtcclxuICAgICAgdGhpcy5jcm9zc2JhckNvbm5lY3QoKTtcclxuICAgIH1cclxuICB9XHJcblxyXG4gIG5nT25Jbml0KCk6IHZvaWQge1xyXG4gICAgdGhpcy5jcm9zc2JhckNvbm5lY3QoKTtcclxuICB9XHJcblxyXG5cclxuICBvdmVycmlkZSBuZ09uRGVzdHJveSgpIHtcclxuICAgIHRoaXMuY3Jvc3NiYXJTZXJ2aWNlLnN0b3BDb25uZWN0aW9uKCk7XHJcbiAgICBzdXBlci5uZ09uRGVzdHJveSgpXHJcbiAgfVxyXG5cclxuXHJcbiAgLy8gKioqKioqKioqKioqKioqKioqKioqKioqKioqKioqKioqKioqKioqKioqKioqKioqKioqKioqKioqKioqKioqKioqKioqKioqKioqKioqKioqKioqKioqKioqKioqKioqKioqKioqKipcclxuICAvLyBMT0FESU5HIERBVEFcclxuICAvLyAqKioqKioqKioqKioqKioqKioqKioqKioqKioqKioqKioqKioqKioqKioqKioqKioqKioqKioqKioqKioqKioqKioqKioqKioqKioqKioqKioqKioqKioqKioqKioqKioqKioqKioqKlxyXG5cclxuICBwcml2YXRlIGNyb3NzYmFyQ29ubmVjdCgpOiB2b2lkIHtcclxuICAgIGlmICghdGhpcy5jcm9zc2JhclNlcnZpY2UuY3Jvc3NiYXIgfHwgIXRoaXMuY3Jvc3NiYXJTZXJ2aWNlLmNyb3NzYmFyLmlzQ29ubmVjdGVkIHx8ICF0aGlzLmNyb3NzYmFyU2VydmljZS5jcm9zc2Jhci5pc09wZW4pIHtcclxuICAgICAgdGhpcy5jcm9zc2JhclNlcnZpY2Uuc3RhcnRDb25uZWN0aW9uKCk7XHJcbiAgICAgIHRoaXMud3NDcm9zc2JhclN1YnNjcmliZSgpO1xyXG4gICAgfSBlbHNlIHtcclxuICAgICAgdGhpcy5jcm9zc2JhckFjdGl2ZSA9IHRydWU7XHJcbiAgICB9XHJcbiAgfVxyXG5cclxuICBwcml2YXRlIHdzQ3Jvc3NiYXJTdWJzY3JpYmUoKTogdm9pZCB7XHJcbiAgICB0aGlzLmNyb3NzYmFyU2VydmljZS5vbk5ld1dzTWVzc2FnZSgpXHJcbiAgICAgIC5zdWJzY3JpYmUoXHJcbiAgICAgICAgKHJlc3BvbnNlRGF0YSkgPT4ge1xyXG4gICAgICAgICAgaWYgKHJlc3BvbnNlRGF0YS50eXBlID09PSAnY29ubmVjdGVkJykge1xyXG4gICAgICAgICAgICAvLyBETyBOT1RISU5HLCBKVVNUIFdTIENPTk5FQ1RJTkdcclxuICAgICAgICAgICAgdGhpcy5jcm9zc2JhckFjdGl2ZSA9IHRydWU7XHJcbiAgICAgICAgICB9IGVsc2UgaWYgKHJlc3BvbnNlRGF0YS50eXBlID09PSAnZXJyb3InIHx8IHJlc3BvbnNlRGF0YS50eXBlID09PSAnZGlzY29ubmVjdGVkJykge1xyXG4gICAgICAgICAgICAvLyBETyBOT1RISU5HLCBFUlJPUiBPUiBESVNDT05ORUNUID0+IFhCQVIgUkVDT05ORUNUUyBBVVRPTUFUSUNBTExZXHJcbiAgICAgICAgICAgIHRoaXMuY3Jvc3NiYXJBY3RpdmUgPSBmYWxzZTtcclxuICAgICAgICAgIH1cclxuICAgICAgICB9XHJcbiAgICAgICk7XHJcbiAgfVxyXG5cclxuICAvLyAqKioqKioqKioqKioqKioqKioqKioqKioqKioqKioqKioqKioqKioqKioqKioqKioqKioqKioqKioqKioqKioqKioqKioqKioqKioqKioqKioqKioqKioqKioqKioqKioqKioqKioqKlxyXG4gIC8vIENIQU5HSU5HIERBVEFcclxuICAvLyAqKioqKioqKioqKioqKioqKioqKioqKioqKioqKioqKioqKioqKioqKioqKioqKioqKioqKioqKioqKioqKioqKioqKioqKioqKioqKioqKioqKioqKioqKioqKioqKioqKioqKioqKlxyXG5cclxuICAvLyAqKioqKioqKioqKioqKioqKioqKioqKioqKioqKioqKioqKioqKioqKioqKioqKioqKioqKioqKioqKioqKioqKioqKioqKioqKioqKioqKioqKioqKioqKioqKioqKioqKioqKioqKlxyXG4gIC8vIFVJXHJcbiAgLy8gKioqKioqKioqKioqKioqKioqKioqKioqKioqKioqKioqKioqKioqKioqKioqKioqKioqKioqKioqKioqKioqKioqKioqKioqKioqKioqKioqKioqKioqKioqKioqKioqKioqKioqKipcclxuXHJcbiAgLy8gRVZFTlQgTElTVEVORVJTXHJcblxyXG4gIC8vIE1JU0NFTExBTkVPVVNcclxuXHJcbn1cclxuIiwiPGRpdiBbY2xhc3Mubm9rXT1cIiFjcm9zc2JhckFjdGl2ZVwiXHJcbiAgICAgW2NsYXNzLm9rXT1cImNyb3NzYmFyQWN0aXZlXCJcclxuICAgICBbc3R5bGUuYm90dG9tLnB4XT1cImZyb21Cb3R0b21QeFwiXHJcbiAgICAgY2xhc3M9XCJ3cy1zdGF0ZVwiXHJcbiAgICAgbWF0VG9vbHRpcD1cInt7Y3Jvc3NiYXJBY3RpdmUgPyAnbGl2ZSB1cGRhdGUgT0snIDogJ2xpdmUgdXBkYXRlIE5PSyd9fVwiPlxyXG48L2Rpdj5cclxuIl19