ngx-pwa
Version:
Provides functionality around the progressive web app functionality in angular. Most notably the an approach to cache POST, UPDATE and DELETE requests.
58 lines • 9.73 kB
JavaScript
import { CommonModule } from '@angular/common';
import { Component, Inject, Input } from '@angular/core';
import { NGX_PWA_OFFLINE_SERVICE } from '../../services/offline.service';
import { NgxPwaSynchronizeBadgeComponent } from '../synchronize-badge/synchronize-badge.component';
import * as i0 from "@angular/core";
/**
* Shows a offline warning when the user is not online.
*/
export class NgxPwaOfflineStatusBarComponent {
offlineService;
/**
* The message to display when the user is offline.
* @default 'Offline'
*/
offlineMessage;
/**
* The message to display when the user has changes that aren't synced to the api.
* @default 'Unsaved Changes'
*/
unsavedChangesMessage;
/**
* Whether or not to display a badge that shows the amount of cached requests and can open a dialog to sync changes to the server.
*/
displayUnsavedChangesSynchronizeBadge;
/**
* Configuration data for the Synchronize Dialog.
*/
synchronizeDialogData;
constructor(offlineService) {
this.offlineService = offlineService;
}
ngOnInit() {
this.offlineMessage = this.offlineMessage ?? 'Offline';
this.unsavedChangesMessage = this.unsavedChangesMessage ?? 'Unsaved Changes';
this.displayUnsavedChangesSynchronizeBadge = this.displayUnsavedChangesSynchronizeBadge ?? true;
}
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: NgxPwaOfflineStatusBarComponent, deps: [{ token: NGX_PWA_OFFLINE_SERVICE }], target: i0.ɵɵFactoryTarget.Component });
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: NgxPwaOfflineStatusBarComponent, isStandalone: true, selector: "ngx-pwa-offline-status-bar", inputs: { offlineMessage: "offlineMessage", unsavedChangesMessage: "unsavedChangesMessage", displayUnsavedChangesSynchronizeBadge: "displayUnsavedChangesSynchronizeBadge", synchronizeDialogData: "synchronizeDialogData" }, ngImport: i0, template: "@if (offlineService.isOffline) {\n <div>\n {{offlineMessage}}\n @if (displayUnsavedChangesSynchronizeBadge) {\n <ngx-pwa-synchronize-badge [synchronizeDialogData]=\"synchronizeDialogData\"></ngx-pwa-synchronize-badge>\n }\n </div>\n}\n@else if (offlineService.cachedRequests.length) {\n <div>\n {{unsavedChangesMessage}}\n @if (displayUnsavedChangesSynchronizeBadge) {\n <ngx-pwa-synchronize-badge [synchronizeDialogData]=\"synchronizeDialogData\"></ngx-pwa-synchronize-badge>\n }\n </div>\n}", styles: ["div{background-color:orange;font-weight:bolder;letter-spacing:1px;text-transform:uppercase;height:50px;display:flex;justify-content:center;align-items:center}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: NgxPwaSynchronizeBadgeComponent, selector: "ngx-pwa-synchronize-badge", inputs: ["synchronizeDialogData"] }] });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: NgxPwaOfflineStatusBarComponent, decorators: [{
type: Component,
args: [{ selector: 'ngx-pwa-offline-status-bar', standalone: true, imports: [
CommonModule,
NgxPwaSynchronizeBadgeComponent
], template: "@if (offlineService.isOffline) {\n <div>\n {{offlineMessage}}\n @if (displayUnsavedChangesSynchronizeBadge) {\n <ngx-pwa-synchronize-badge [synchronizeDialogData]=\"synchronizeDialogData\"></ngx-pwa-synchronize-badge>\n }\n </div>\n}\n@else if (offlineService.cachedRequests.length) {\n <div>\n {{unsavedChangesMessage}}\n @if (displayUnsavedChangesSynchronizeBadge) {\n <ngx-pwa-synchronize-badge [synchronizeDialogData]=\"synchronizeDialogData\"></ngx-pwa-synchronize-badge>\n }\n </div>\n}", styles: ["div{background-color:orange;font-weight:bolder;letter-spacing:1px;text-transform:uppercase;height:50px;display:flex;justify-content:center;align-items:center}\n"] }]
}], ctorParameters: () => [{ type: undefined, decorators: [{
type: Inject,
args: [NGX_PWA_OFFLINE_SERVICE]
}] }], propDecorators: { offlineMessage: [{
type: Input
}], unsavedChangesMessage: [{
type: Input
}], displayUnsavedChangesSynchronizeBadge: [{
type: Input
}], synchronizeDialogData: [{
type: Input
}] } });
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoib2ZmbGluZS1zdGF0dXMtYmFyLmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL25neC1wd2Evc3JjL2NvbXBvbmVudHMvb2ZmbGluZS1zdGF0dXMtYmFyL29mZmxpbmUtc3RhdHVzLWJhci5jb21wb25lbnQudHMiLCIuLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9uZ3gtcHdhL3NyYy9jb21wb25lbnRzL29mZmxpbmUtc3RhdHVzLWJhci9vZmZsaW5lLXN0YXR1cy1iYXIuY29tcG9uZW50Lmh0bWwiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFFLFlBQVksRUFBRSxNQUFNLGlCQUFpQixDQUFDO0FBQy9DLE9BQU8sRUFBRSxTQUFTLEVBQUUsTUFBTSxFQUFFLEtBQUssRUFBVSxNQUFNLGVBQWUsQ0FBQztBQUdqRSxPQUFPLEVBQXdCLHVCQUF1QixFQUFFLE1BQU0sZ0NBQWdDLENBQUM7QUFDL0YsT0FBTyxFQUFFLCtCQUErQixFQUFFLE1BQU0sa0RBQWtELENBQUM7O0FBRW5HOztHQUVHO0FBV0gsTUFBTSxPQUFPLCtCQUErQjtJQTZCM0I7SUE1QmI7OztPQUdHO0lBRUgsY0FBYyxDQUFVO0lBRXhCOzs7T0FHRztJQUVILHFCQUFxQixDQUFVO0lBRS9COztPQUVHO0lBRUgscUNBQXFDLENBQVc7SUFFaEQ7O09BRUc7SUFFSCxxQkFBcUIsQ0FBeUI7SUFFOUMsWUFFYSxjQUFrQztRQUFsQyxtQkFBYyxHQUFkLGNBQWMsQ0FBb0I7SUFDM0MsQ0FBQztJQUVMLFFBQVE7UUFDSixJQUFJLENBQUMsY0FBYyxHQUFHLElBQUksQ0FBQyxjQUFjLElBQUksU0FBUyxDQUFDO1FBQ3ZELElBQUksQ0FBQyxxQkFBcUIsR0FBRyxJQUFJLENBQUMscUJBQXFCLElBQUksaUJBQWlCLENBQUM7UUFDN0UsSUFBSSxDQUFDLHFDQUFxQyxHQUFHLElBQUksQ0FBQyxxQ0FBcUMsSUFBSSxJQUFJLENBQUM7SUFDcEcsQ0FBQzt3R0FwQ1EsK0JBQStCLGtCQTRCNUIsdUJBQXVCOzRGQTVCMUIsK0JBQStCLG9UQ3BCNUMsMGpCQWVDLHlORENPLFlBQVksK0JBQ1osK0JBQStCOzs0RkFHMUIsK0JBQStCO2tCQVYzQyxTQUFTOytCQUNJLDRCQUE0QixjQUcxQixJQUFJLFdBQ1A7d0JBQ0wsWUFBWTt3QkFDWiwrQkFBK0I7cUJBQ2xDOzswQkE4QkksTUFBTTsyQkFBQyx1QkFBdUI7eUNBdEJuQyxjQUFjO3NCQURiLEtBQUs7Z0JBUU4scUJBQXFCO3NCQURwQixLQUFLO2dCQU9OLHFDQUFxQztzQkFEcEMsS0FBSztnQkFPTixxQkFBcUI7c0JBRHBCLEtBQUsiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBDb21tb25Nb2R1bGUgfSBmcm9tICdAYW5ndWxhci9jb21tb24nO1xuaW1wb3J0IHsgQ29tcG9uZW50LCBJbmplY3QsIElucHV0LCBPbkluaXQgfSBmcm9tICdAYW5ndWxhci9jb3JlJztcblxuaW1wb3J0IHsgU3luY2hyb25pemVEaWFsb2dEYXRhIH0gZnJvbSAnLi4vLi4vbW9kZWxzL3N5bmNocm9uaXplLWRpYWxvZy1kYXRhLm1vZGVsJztcbmltcG9ydCB7IE5neFB3YU9mZmxpbmVTZXJ2aWNlLCBOR1hfUFdBX09GRkxJTkVfU0VSVklDRSB9IGZyb20gJy4uLy4uL3NlcnZpY2VzL29mZmxpbmUuc2VydmljZSc7XG5pbXBvcnQgeyBOZ3hQd2FTeW5jaHJvbml6ZUJhZGdlQ29tcG9uZW50IH0gZnJvbSAnLi4vc3luY2hyb25pemUtYmFkZ2Uvc3luY2hyb25pemUtYmFkZ2UuY29tcG9uZW50JztcblxuLyoqXG4gKiBTaG93cyBhIG9mZmxpbmUgd2FybmluZyB3aGVuIHRoZSB1c2VyIGlzIG5vdCBvbmxpbmUuXG4gKi9cbkBDb21wb25lbnQoe1xuICAgIHNlbGVjdG9yOiAnbmd4LXB3YS1vZmZsaW5lLXN0YXR1cy1iYXInLFxuICAgIHRlbXBsYXRlVXJsOiAnLi9vZmZsaW5lLXN0YXR1cy1iYXIuY29tcG9uZW50Lmh0bWwnLFxuICAgIHN0eWxlVXJsczogWycuL29mZmxpbmUtc3RhdHVzLWJhci5jb21wb25lbnQuc2NzcyddLFxuICAgIHN0YW5kYWxvbmU6IHRydWUsXG4gICAgaW1wb3J0czogW1xuICAgICAgICBDb21tb25Nb2R1bGUsXG4gICAgICAgIE5neFB3YVN5bmNocm9uaXplQmFkZ2VDb21wb25lbnRcbiAgICBdXG59KVxuZXhwb3J0IGNsYXNzIE5neFB3YU9mZmxpbmVTdGF0dXNCYXJDb21wb25lbnQ8T2ZmbGluZVNlcnZpY2VUeXBlIGV4dGVuZHMgTmd4UHdhT2ZmbGluZVNlcnZpY2U+IGltcGxlbWVudHMgT25Jbml0IHtcbiAgICAvKipcbiAgICAgKiBUaGUgbWVzc2FnZSB0byBkaXNwbGF5IHdoZW4gdGhlIHVzZXIgaXMgb2ZmbGluZS5cbiAgICAgKiBAZGVmYXVsdCAnT2ZmbGluZSdcbiAgICAgKi9cbiAgICBASW5wdXQoKVxuICAgIG9mZmxpbmVNZXNzYWdlITogc3RyaW5nO1xuXG4gICAgLyoqXG4gICAgICogVGhlIG1lc3NhZ2UgdG8gZGlzcGxheSB3aGVuIHRoZSB1c2VyIGhhcyBjaGFuZ2VzIHRoYXQgYXJlbid0IHN5bmNlZCB0byB0aGUgYXBpLlxuICAgICAqIEBkZWZhdWx0ICdVbnNhdmVkIENoYW5nZXMnXG4gICAgICovXG4gICAgQElucHV0KClcbiAgICB1bnNhdmVkQ2hhbmdlc01lc3NhZ2UhOiBzdHJpbmc7XG5cbiAgICAvKipcbiAgICAgKiBXaGV0aGVyIG9yIG5vdCB0byBkaXNwbGF5IGEgYmFkZ2UgdGhhdCBzaG93cyB0aGUgYW1vdW50IG9mIGNhY2hlZCByZXF1ZXN0cyBhbmQgY2FuIG9wZW4gYSBkaWFsb2cgdG8gc3luYyBjaGFuZ2VzIHRvIHRoZSBzZXJ2ZXIuXG4gICAgICovXG4gICAgQElucHV0KClcbiAgICBkaXNwbGF5VW5zYXZlZENoYW5nZXNTeW5jaHJvbml6ZUJhZGdlITogYm9vbGVhbjtcblxuICAgIC8qKlxuICAgICAqIENvbmZpZ3VyYXRpb24gZGF0YSBmb3IgdGhlIFN5bmNocm9uaXplIERpYWxvZy5cbiAgICAgKi9cbiAgICBASW5wdXQoKVxuICAgIHN5bmNocm9uaXplRGlhbG9nRGF0YT86IFN5bmNocm9uaXplRGlhbG9nRGF0YTtcblxuICAgIGNvbnN0cnVjdG9yKFxuICAgICAgICBASW5qZWN0KE5HWF9QV0FfT0ZGTElORV9TRVJWSUNFKVxuICAgICAgICByZWFkb25seSBvZmZsaW5lU2VydmljZTogT2ZmbGluZVNlcnZpY2VUeXBlXG4gICAgKSB7IH1cblxuICAgIG5nT25Jbml0KCk6IHZvaWQge1xuICAgICAgICB0aGlzLm9mZmxpbmVNZXNzYWdlID0gdGhpcy5vZmZsaW5lTWVzc2FnZSA/PyAnT2ZmbGluZSc7XG4gICAgICAgIHRoaXMudW5zYXZlZENoYW5nZXNNZXNzYWdlID0gdGhpcy51bnNhdmVkQ2hhbmdlc01lc3NhZ2UgPz8gJ1Vuc2F2ZWQgQ2hhbmdlcyc7XG4gICAgICAgIHRoaXMuZGlzcGxheVVuc2F2ZWRDaGFuZ2VzU3luY2hyb25pemVCYWRnZSA9IHRoaXMuZGlzcGxheVVuc2F2ZWRDaGFuZ2VzU3luY2hyb25pemVCYWRnZSA/PyB0cnVlO1xuICAgIH1cbn0iLCJAaWYgKG9mZmxpbmVTZXJ2aWNlLmlzT2ZmbGluZSkge1xuICAgIDxkaXY+XG4gICAgICAgIHt7b2ZmbGluZU1lc3NhZ2V9fVxuICAgICAgICBAaWYgKGRpc3BsYXlVbnNhdmVkQ2hhbmdlc1N5bmNocm9uaXplQmFkZ2UpIHtcbiAgICAgICAgICAgIDxuZ3gtcHdhLXN5bmNocm9uaXplLWJhZGdlIFtzeW5jaHJvbml6ZURpYWxvZ0RhdGFdPVwic3luY2hyb25pemVEaWFsb2dEYXRhXCI+PC9uZ3gtcHdhLXN5bmNocm9uaXplLWJhZGdlPlxuICAgICAgICB9XG4gICAgPC9kaXY+XG59XG5AZWxzZSBpZiAob2ZmbGluZVNlcnZpY2UuY2FjaGVkUmVxdWVzdHMubGVuZ3RoKSB7XG4gICAgPGRpdj5cbiAgICAgICAge3t1bnNhdmVkQ2hhbmdlc01lc3NhZ2V9fVxuICAgICAgICBAaWYgKGRpc3BsYXlVbnNhdmVkQ2hhbmdlc1N5bmNocm9uaXplQmFkZ2UpIHtcbiAgICAgICAgICAgIDxuZ3gtcHdhLXN5bmNocm9uaXplLWJhZGdlIFtzeW5jaHJvbml6ZURpYWxvZ0RhdGFdPVwic3luY2hyb25pemVEaWFsb2dEYXRhXCI+PC9uZ3gtcHdhLXN5bmNocm9uaXplLWJhZGdlPlxuICAgICAgICB9XG4gICAgPC9kaXY+XG59Il19