Page MenuHomec4science
Files F60639157

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

File Metadata

Created
Wed, May 1, 15:46

content-view-tab-component.component.ts
View Options

import {Component, OnInit} from '@angular/core';
import {ActivatedRoute, Params, Router} from '@angular/router';
import {Subscription} from "rxjs/index";
import { 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'],
providers: [ NavigationServiceService ]
})
export class ContentViewTabComponentComponent implements OnInit {
// 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: 'tln-viewer',
index: 1
}, {
label: 'Rhizome-Ansicht',
link: 'rhizome',
index: 2
},
];
}
ngOnInit() {
this.setParamsOnInit();
// If url pasted or page refreshed --> resetting this.queryparams to the query params of the url;
// needed for active routing in the nav tabs & for general use in the template
this.queryParamSubscription = this.activatedRoute.queryParams.subscribe( (queryParams: Params ) => {
this.queryParams = new TlnQueryParams(
queryParams.navBarOpenState,
queryParams.navTabIndex,
queryParams.manuscript,
queryParams.page,
queryParams.selectedLines,
queryParams.selectedWords,
queryParams.viewMode,
queryParams.fullscreen,
queryParams.zoom
);
});
}
setParamsOnInit() {
// Set the NavBarOpenstate to false if it is false in the url query param onInit. In every other case we toggle it open actively.
if (this.activatedRoute.snapshot.queryParamMap.get('navBarOpenState') === 'false' || !this.activatedRoute.snapshot.queryParamMap.get('navBarOpenState') ) {
this.navBarOpenState = false; } else {
this.navBarOpenState = true; }
this.naviService.queryParams.navBarOpenState = this.navBarOpenState;
// viewMode
if (!this.activatedRoute.snapshot.queryParamMap.get('viewMode')) {
this.naviService.queryParams.viewMode = 'Transkription/Faksimile';
}
this.naviService.updateRoute();
}
toggleNavDrawer() {
this.navBarOpenState = !this.navBarOpenState;
this.naviService.queryParams.navBarOpenState = this.navBarOpenState;
this.naviService.updateRoute();
}
goFullScreen() {
this.naviService.queryParams.fullscreen = true;
this.naviService.updateRoute();
}
changeNavTree(index: number) {
if (index < 2) { // only two trees so far
this.naviService.queryParams.navTabIndex = index;
this.naviService.updateRoute();
}
}
}

Event Timeline

c4science · Help