import {Injectable} from "@angular/core"; import {BehaviorSubject, Observable, Subscriber} from "rxjs"; import {ActivationStart, Router} from "@angular/router"; @Injectable({ providedIn: 'root' }) export class LayoutService { /** * Set this to true when sidebar items are ready. */ private openSubject: BehaviorSubject = new BehaviorSubject(false); /** * Add hasSidebar: false on data of route config, if sidebar is not needed. */ private hasSidebarSubject: BehaviorSubject = new BehaviorSubject(false); /** * Add hasHeader: false on data of route config, if header is not needed. */ private hasHeaderSubject: BehaviorSubject = new BehaviorSubject(false); /** * Add hasAdminMenu: true on data of route config, if global sidebar should be used. */ private hasAdminMenuSubject: BehaviorSubject = new BehaviorSubject(false); /** * Add isFrontPage: true on data of route config, if current route is for front page. */ private isFrontPageSubject: BehaviorSubject = new BehaviorSubject(false); /** * Add isSmallScreen: true on data of route config, if screen is small. */ private isSmallScreenSubject: BehaviorSubject = new BehaviorSubject(false); /** * Add isDashboard: false on data of route config, if page is for a stakeholder but not for dashboard. */ private isDashboardSubject: BehaviorSubject = new BehaviorSubject(true); sub: any; ngOnDestroy() { this.clearSubscriptions(); } clearSubscriptions() { if (this.sub instanceof Subscriber) { this.sub.unsubscribe(); } } constructor(private router: Router) { this.sub = this.router.events.subscribe(event => { if (event instanceof ActivationStart) { let data = event.snapshot.data; if (data['hasSidebar'] !== undefined && data['hasSidebar'] === false) { this.setHasSidebar(false); } else { this.setHasSidebar(true); } if (data['hasHeader'] !== undefined && data['hasHeader'] === false) { this.setHasHeader(false); } else { this.setHasHeader(true); } if (data['hasAdminMenu'] !== undefined && data['hasAdminMenu'] === true) { this.setHasAdminMenu(true); } else { this.setHasAdminMenu(false); } if (data['isFrontPage'] !== undefined && data['isFrontPage'] === true) { this.setFrontPage(true); } else { this.setFrontPage(false); } if (data['isSmallScreen'] !== undefined && data['isSmallScreen'] === true) { this.setSmallScreen(true); } else { this.setSmallScreen(false); } if (data['isDashboard'] !== undefined && data['isDashboard'] === false) { this.setDashboard(false); } else { this.setDashboard(true); } } }); } get open(): boolean { return this.openSubject.getValue(); } setOpen(value: boolean) { this.openSubject.next(value); } get hasSidebar(): Observable { return this.hasSidebarSubject.asObservable(); } setHasSidebar(value: boolean) { this.hasSidebarSubject.next(value); } get hasHeader(): Observable { return this.hasHeaderSubject.asObservable(); } setHasHeader(value: boolean) { this.hasHeaderSubject.next(value); } get hasAdminMenu(): Observable { return this.hasAdminMenuSubject.asObservable(); } setHasAdminMenu(value: boolean) { this.hasAdminMenuSubject.next(value); } get isFrontPage(): Observable { return this.isFrontPageSubject.asObservable(); } setFrontPage(value: boolean) { this.isFrontPageSubject.next(value); } get isDashboard(): Observable { return this.isDashboardSubject.asObservable(); } setDashboard(value: boolean) { this.isDashboardSubject.next(value); } get isSmallScreen(): boolean { return this.isSmallScreenSubject.getValue(); } setSmallScreen(value: boolean) { this.isSmallScreenSubject.next(value); } }