Add offline indicator
Also adds a function to the offline service to "actually" determinate if we are offline or not
This commit is contained in:
parent
b130a28a4c
commit
488690dc8d
@ -1,4 +1,5 @@
|
||||
import { Injectable } from '@angular/core';
|
||||
import { WebsocketService } from './websocket.service';
|
||||
|
||||
/**
|
||||
* This service handles everything connected with being offline.
|
||||
@ -18,7 +19,16 @@ export class OfflineService {
|
||||
|
||||
/**
|
||||
*/
|
||||
public constructor() {}
|
||||
public constructor(private socketService: WebsocketService) {}
|
||||
|
||||
/**
|
||||
* Determines of you are either in Offline mode or not connected via websocket
|
||||
*
|
||||
* @returns whether the client is offline or not connected
|
||||
*/
|
||||
public isOffline(): boolean {
|
||||
return this.offline || !this.socketService.isConnected;
|
||||
}
|
||||
|
||||
/**
|
||||
* Sets the offline flag. Restores the DataStoreService to the last known configuration.
|
||||
|
@ -1,5 +1,10 @@
|
||||
<div id="container" [osResized]="resizeSubject" [ngStyle]="containerStyle" #container>
|
||||
<div id="projector" [ngStyle]="projectorStyle">
|
||||
<div id="offline-indicator" *ngIf="isOffline()">
|
||||
<mat-icon>
|
||||
fiber_manual_record
|
||||
</mat-icon>
|
||||
</div>
|
||||
<div id="header" [ngStyle]="headerFooterStyle" *ngIf="projector && projector.show_header_footer">
|
||||
<!-- projector logo -->
|
||||
<img *ngIf="enableLogo && projectorLogo" src="{{ projectorLogo }}" class="projector-logo-main" />
|
||||
@ -16,7 +21,12 @@
|
||||
</div>
|
||||
|
||||
<div *ngFor="let slide of slides">
|
||||
<os-slide-container [slideData]="slide" [scroll]="scroll" [scale]="scale" [projector]="projector"></os-slide-container>
|
||||
<os-slide-container
|
||||
[slideData]="slide"
|
||||
[scroll]="scroll"
|
||||
[scale]="scale"
|
||||
[projector]="projector"
|
||||
></os-slide-container>
|
||||
</div>
|
||||
|
||||
<div id="footer" [ngStyle]="headerFooterStyle" *ngIf="projector && projector.show_header_footer">
|
||||
|
@ -8,6 +8,17 @@
|
||||
background-color: lightgoldenrodyellow;
|
||||
position: relative;
|
||||
|
||||
#offline-indicator {
|
||||
top: 5;
|
||||
right: 0;
|
||||
color: red;
|
||||
position: absolute;
|
||||
z-index: 100;
|
||||
.mat-icon {
|
||||
font-size: 14pt;
|
||||
}
|
||||
}
|
||||
|
||||
#projector {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
|
@ -8,6 +8,7 @@ import { BaseComponent } from 'app/base.component';
|
||||
import { ConfigService } from 'app/core/ui-services/config.service';
|
||||
import { ViewProjector } from 'app/site/projector/models/view-projector';
|
||||
import { Size } from 'app/site/projector/size';
|
||||
import { OfflineService } from 'app/core/core-services/offline.service';
|
||||
import { SlideData, ProjectorDataService } from 'app/core/core-services/projector-data.service';
|
||||
import { ProjectorRepositoryService } from 'app/core/repositories/projector/projector-repository.service';
|
||||
|
||||
@ -160,7 +161,8 @@ export class ProjectorComponent extends BaseComponent implements OnDestroy {
|
||||
translate: TranslateService,
|
||||
private projectorDataService: ProjectorDataService,
|
||||
private projectorRepository: ProjectorRepositoryService,
|
||||
private configService: ConfigService
|
||||
private configService: ConfigService,
|
||||
private offlineService: OfflineService
|
||||
) {
|
||||
super(titleService, translate);
|
||||
// projector logo / background-image
|
||||
@ -192,6 +194,15 @@ export class ProjectorComponent extends BaseComponent implements OnDestroy {
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* determine if the server is offline
|
||||
*
|
||||
* @returns whether the client is offlien
|
||||
*/
|
||||
public isOffline(): boolean {
|
||||
return this.offlineService.isOffline();
|
||||
}
|
||||
|
||||
/**
|
||||
* Scales the projector to the right format.
|
||||
*/
|
||||
|
Loading…
Reference in New Issue
Block a user