Page MenuHomec4science

content-view-tab-component.component.ts
No OneTemporary

File Metadata

Created
Thu, Apr 25, 13:26

content-view-tab-component.component.ts

import {Component, OnDestroy, OnInit} from '@angular/core';
import {ActivatedRoute, Params, Router} from '@angular/router';
import {Subscription} from "rxjs/index";
import {TlnManuscript, TlnPage, TlnWord, TlnEntity, TlnQueryParams} from '../models/models';
import {NavigationServiceService} from "../services/navigation-service.service";
@Component({
selector: 'app-content-view-tab-component',
templateUrl: './content-view-tab-component.component.html',
styleUrls: ['./content-view-tab-component.component.scss']
})
export class ContentViewTabComponentComponent implements OnInit, OnDestroy {
// navigation tabs for the content view (manuscript view, page view, rhizome view)
navTabLinks: any[];
// navbar on th left for navigating
navBarOpenState: boolean;
navBarOpenMode = 'push'; // side || over || push
queryParams: TlnQueryParams;
queryParamSubscription: Subscription;
constructor(private router: Router,
private activatedRoute: ActivatedRoute,
private naviService: NavigationServiceService) {
// The links/tabs for routing the correct view-component
this.navTabLinks = [
{
label: 'Manuskriptansicht',
link: 'manuscript',
index: 0
}, {
label: 'Seitenansicht',
link: 'page',
index: 1
}, {
label: 'Rhizome-Ansicht',
link: 'rhizome',
index: 2
},
];
}
ngOnInit(): void {
// If url pasted or page refreshed --> resetting the chosen things according to the query params of the url;
this.queryParamSubscription = this.activatedRoute.queryParams.subscribe( (queryparams: Params ) => {
this.queryParams = new TlnQueryParams(queryparams.man,
queryparams.page,
queryparams.row,
queryparams.word,
queryparams.viewMode,
queryparams.navBarOpenState,
queryparams.navTreeIndex,
queryparams.manuscriptGroup);
}
);
// Create Navigation trees for the navBar from queryParams
if (this.activatedRoute.snapshot.queryParamMap.get('man')) {
this.naviService.createNavTreesFromUrlParams(this.activatedRoute.snapshot.queryParams);
} else { this.naviService.createNavTreesOnInit(); }
// Set the NavBarOpenstate to true if it is true in the url query param onInit.
if (this.activatedRoute.snapshot.queryParamMap.get('navBarOpenState') === 'true') { this.navBarOpenState = true; }
}
toggleNavDrawer() {
// set it locally
this.navBarOpenState = !this.navBarOpenState;
// set the route as well
const openStateString = this.navBarOpenState === null ? 'false' : (this.navBarOpenState ? 'true' : 'false');
this.naviService.setQueryParam('navBarOpenState', openStateString);
this.naviService.updateRoute();
}
ngOnDestroy() {
// unsubscribe if component destroyed so there is no memory leak
this.queryParamSubscription.unsubscribe();
}
}

Event Timeline