Refactoring for landingpage support

projects/common/src/fm/components/app/app.component.ts

@@ -1,17 +1,20 @@
 import { Component, OnInit, OnDestroy, Inject, ViewEncapsulation, RendererFactory2, PLATFORM_ID, ChangeDetectionStrategy, HostListener, Input } from '@angular/core';
 import { Router, NavigationStart, NavigationEnd, RouteConfigLoadStart, RouteConfigLoadEnd, ActivatedRoute, PRIMARY_OUTLET } from '@angular/router';
-import { Meta, Title, MetaDefinition } from '@angular/platform-browser';import { DOCUMENT } from "@angular/common";
-import { Subscription ,  Observable } from 'rxjs';
-import { distinctUntilChanged} from 'rxjs/operators';
+import { Meta, Title, MetaDefinition } from '@angular/platform-browser'; import { DOCUMENT } from "@angular/common";
+import { Subscription, Observable } from 'rxjs';
+import { distinctUntilChanged } from 'rxjs/operators';
 import { Store, Action } from '@ngrx/store';
 import { IUser } from '../../models/user';
+import { OAuthService, OAuthErrorEvent } from 'angular-oauth2-oidc';
 
 //AppCommon
 import { IEventMessage } from '../../models/event.message';
-import { IListItem} from '../../models/list.item';
+import { IListItem } from '../../models/list.item';
 import { EventService } from '../../services/event.service';
-import * as  commonActions  from '../../actions/app-common.actions';
+import { ItemTypeService } from '../../services/itemtype.service';
+import * as  commonActions from '../../actions/app-common.actions';
 import { HealthCheckService } from '../../services/healthcheck.service';
+import { AppConfig } from '../../shared/app.config';
 
 import * as appReducers from '../../reducers/app-common.reducer';
 
@@ -34,34 +37,29 @@ export class AppComponent implements OnInit, OnDestroy {
 
   public currentFolder: Observable<IListItem>;
   public folderParents: Observable<IListItem[]>;
-  public fullScreen: Observable<boolean>;
-  public isOnline: Observable<boolean>;
-  public routeLoading: Observable<boolean>;
-  public menuVisible: Observable<boolean>;
-  public accountMenuVisible: Observable<boolean>;
-  public user:Observable<IUser>;
-  @Input() showUploadProgress: boolean =true;
+  public fullScreen: Observable<boolean> = this.store$.select(appReducers.selectGetFullScreen);
+  public isOnline: Observable<boolean> = this.store$.select(appReducers.SelectGetIsOnline);
+  public routeLoading: Observable<boolean> = this.store$.select(appReducers.selectGetRouteLoading);
+  public menuVisible: Observable<boolean> = this.store$.select(appReducers.SelectGetMenuVisible);
+  public accountMenuVisible: Observable<boolean> = this.store$.select(appReducers.SelectGetAccountMenuVisible);
+  public user: Observable<IUser> = this.store$.select(appReducers.SelectGetUser);
+  public isPageMode: Observable<boolean> =  this.store$.select(appReducers.SelectGetIsPageMode);
+  @Input() showUploadProgress: boolean = true;
 
   constructor(
-    private router: Router,
-    private activatedRoute: ActivatedRoute,
-    private title: Title,
-    private meta: Meta,
-    private store: Store<appReducers.State>,
-    private eventService: EventService,
-    private healthCheckService: HealthCheckService
-  ) {   
-    
-    //check health every 30 seconds
-    this.healthCheckService.check(30000).pipe(distinctUntilChanged()).subscribe((online) => {
-       if(online) {
-         this.store.dispatch(new commonActions.Online());
-       } else {
-         this.store.dispatch(new commonActions.Offline());
-       }
-    });   
+    public router: Router,
+    private activatedRoute$: ActivatedRoute,
+    private title$: Title,
+    private meta$: Meta,
+    private store$: Store<appReducers.State>,
+    private eventService$: EventService,
+    private healthCheckService$: HealthCheckService,
+    private itemTypeService$: ItemTypeService,
+    private oauthService$: OAuthService,
+    private appConfig$: AppConfig
+  ) {
   }
- 
+
 
   getActionFromEvent(event: IEventMessage): Action {
     var action: Action = null;
@@ -104,64 +102,98 @@ export class AppComponent implements OnInit, OnDestroy {
   }
 
   ngOnInit() {
-    this.fullScreen = this.store.select(appReducers.selectGetFullScreen);
-    this.isOnline = this.store.select(appReducers.SelectGetIsOnline);
-    this.routeLoading = this.store.select(appReducers.selectGetRouteLoading);
-    this.menuVisible = this.store.select(appReducers.SelectGetMenuVisible);
-    this.accountMenuVisible = this.store.select(appReducers.SelectGetAccountMenuVisible);
-    this.user = this.store.select(appReducers.SelectGetUser);
     this.InstallRouteEventHandler();
     this.InstallEventServiceEventHandler();
+    this.InstallAuthenticationEventHandler();
+    this.InstallHealthCheck();
+
+    //load item types
+    this.itemTypeService$.load(this.appConfig$)
   }
 
   @HostListener('document:keyup', ['$event'])
   onKeyUp(event: KeyboardEvent) {
     let x = event.keyCode;
     if (x === 27) {
-      this.store.dispatch(new commonActions.Escape(true,false));
-    }    
-  }  
+      this.store$.dispatch(new commonActions.Escape(true, false));
+    }
+  }
 
   ngOnDestroy() {
     // Subscription clean-up
-    if(this.routerSub$) this.routerSub$.unsubscribe();
-    if(this.eventSub$) this.eventSub$.unsubscribe();
+    if (this.routerSub$) this.routerSub$.unsubscribe();
+    if (this.eventSub$) this.eventSub$.unsubscribe();
+  }
+
+  private InstallAuthenticationEventHandler() {
+    // auth event handler
+    this.oauthService$.events.subscribe((event) => {
+      console.debug(event.type);
+      if (event.type == 'token_error' || event.type == 'silent_refresh_timeout' || event.type == 'logout') {
+        let e = event as OAuthErrorEvent;
+        let p = e.params as any;
+        if (event.type == 'silent_refresh_timeout' || event.type == 'logout' || (p.error && p.error == 'login_required')) {
+          console.debug("Session expired");
+          this.router.navigate(['loggedout'], { queryParams: { redirectTo: this.router.url } });
+        }
+      }
+    });
   }
 
   private InstallRouteEventHandler() {
     var other = this;
     this.routerSub$ = this.router.events.subscribe(event => {
       if (event instanceof RouteConfigLoadStart) {
-        other.store.dispatch(new commonActions.StartRouteLoading());
+        other.store$.dispatch(new commonActions.StartRouteLoading());
+      }
+      if (event instanceof NavigationEnd && (event.url == "/" || event.url.startsWith("/content") )) {
+        other.store$.dispatch(new commonActions.SetPageMode(true));
+      } else if (event instanceof NavigationEnd) {
+        other.store$.dispatch(new commonActions.SetPageMode(false));
       }
       if (event instanceof RouteConfigLoadEnd) {
-        other.store.dispatch(new commonActions.EndRouteLoading());
-      }      
-      if(event instanceof NavigationStart) {
-        other.store.dispatch(new commonActions.SetMenuVisible(false));
+        other.store$.dispatch(new commonActions.EndRouteLoading());
       }
-    });     
+      if (event instanceof NavigationStart) {
+        other.store$.dispatch(new commonActions.SetMenuVisible(false));
+      }
+    });
   }
 
   private InstallEventServiceEventHandler() {
     var other = this;
-    this.eventSub$ = this.eventService.event.subscribe(event => {
+    this.eventSub$ = this.eventService$.event.subscribe(event => {
       var action = other.getActionFromEvent(event);
-      if (action) other.store.dispatch(action);
+      if (action) other.store$.dispatch(action);
+    });
+  }
+
+  private InstallHealthCheck() {
+     //check health every 30 seconds
+     this.healthCheckService$.check(30000).pipe(distinctUntilChanged()).subscribe((online) => {
+      if (online) {
+        this.store$.dispatch(new commonActions.Online());
+      } else {
+        this.store$.dispatch(new commonActions.Offline());
+      }
     });
   }
 
   handleClick(event: MouseEvent) {
-    this.store.dispatch(new commonActions.Escape(false,true));
-  }  
+    this.store$.dispatch(new commonActions.Escape(false, true));
+  }
 
   handleStopBubble(event: MouseEvent) {
     event.stopPropagation();
-  }  
+  }
 
-  handleToggleMenu(event:MouseEvent) {
+  handleToggleMenu(event: MouseEvent) {
     event.stopPropagation();
-    this.store.dispatch(new commonActions.ToggleMenu());
+    this.store$.dispatch(new commonActions.ToggleMenu());
+  }
+
+  handleHome(event: MouseEvent) {
+    this.router.navigate(['/']);
   }
 }