Check network connection and background colorchange

src/app/app.module.ts

@@ -34,6 +34,7 @@ import {MatDatepickerModule} from '@angular/material/datepicker';
 // import { FCM } from 'cordova-plugin-fcm-with-dependecy-updated/ionic/ngx';
 import {MAT_DATE_FORMATS, MAT_DATE_LOCALE} from '@angular/material/core';
 import { NgxMatDateFormats, NGX_MAT_DATE_FORMATS } from '@angular-material-components/datetime-picker';
+import { Network } from '@ionic-native/network/ngx';
 
 
 import {
@@ -100,6 +101,7 @@ import { ScreenOrientation } from '@ionic-native/screen-orientation/ngx';
     WebsocketService,
     ChatService,
     ScreenOrientation,
+    Network
   ],
   bootstrap: [AppComponent],
   schemas: [CUSTOM_ELEMENTS_SCHEMA]

src/app/home/home.page.ts

@@ -14,6 +14,7 @@ import { ToDayEventStorage } from '../store/to-day-event-storage.service';
 import { DocumentCounterService } from 'src/app/OtherService/document-counter.service'
 import { PermissionService } from '../OtherService/permission.service';
 import { TotalDocumentService, TotalDocumentStore } from '../store/total-document.service';
+import { NetworkService } from '../services/network.service';
 
 
 // import * as Sentry from "@sentry/browser";
@@ -74,6 +75,7 @@ export class HomePage implements OnInit {
     private platform: Platform,
     private activeroute: ActivatedRoute,
     public documentCounterService: DocumentCounterService,
+    private network: NetworkService,
     public p: PermissionService) {
 
     this.router.events.subscribe((val) => {
@@ -87,7 +89,8 @@ export class HomePage implements OnInit {
   }
 
   ngOnInit() {
-
+    /* this.network.checkNetworkConnection;
+    this.network.checkNetworkDisconnection; */
     console.log('Active route ', this.router.url)
     if (this.platform.is('desktop') || this.platform.is('mobileweb')) {
       console.log('Notifications not supported')
@@ -99,6 +102,8 @@ export class HomePage implements OnInit {
 
   }
 
+  
+
   mobilefirstConnect() {
 
     if(window['WLAuthorizationManager']) {

src/app/services/socket/synchro.service.ts

@@ -55,6 +55,7 @@ export class SynchroService {
 	}
 
 	private onopen = () =>{
+    document.body.style.setProperty(`--color`, "#0782C9");
     console.log('open ======================= welcome to socket server')
 
 	}
@@ -85,6 +86,7 @@ export class SynchroService {
 				// event.code is usually 1006 in this case
 				console.log('[close] Connection died');
         console.log('Reconnect')
+        document.body.style.setProperty(`--color`, "#eeeb30");
         this.connect()
 			}
 		}, 100);