import {Component, Input, OnDestroy, OnInit, ViewChild} from '@angular/core'; import {ActivatedRoute, Router} from '@angular/router'; import {Session, User} from '../login/utils/helper.class'; import {ConfigurationService} from '../utils/configuration/configuration.service'; import {MenuItem, RootMenuItem} from './menu'; import {EnvProperties} from '../utils/properties/env-properties'; import {Subscription} from 'rxjs'; import {HelpContentService} from '../services/help-content.service'; import {properties} from "../../../environments/environment"; import {LayoutService} from "../dashboard/sharedComponents/sidebar/layout.service"; declare var UIkit; export interface Header { route?: string, url?: string, title: string, logoUrl: string, logoSmallUrl: string, position: 'left' | 'center' | 'right', badge: boolean stickyAnimation?: boolean menuPosition?: 'center' | 'right' } @Component({ selector: 'navbar', templateUrl: 'navigationBar.component.html' }) export class NavigationBarComponent implements OnInit, OnDestroy { @Input() portal: string = 'connect'; @Input() dark: boolean = false; @Input() onlyTop: boolean = false; @Input() logoPath: string = 'assets/common-assets/'; @Input() userMenu: boolean = true; @Input() showHomeMenuItem: boolean = false; @Input() communityId; @Input() showCommunityName: boolean = false; @Input() userMenuItems: MenuItem[]; @Input() menuItems: RootMenuItem []; @Input() header: Header; @Input() showMenu: boolean = true; @Input() homeurl: boolean = true; @Input() properties: EnvProperties = properties; @Input() user: User; @Input() enableSearch: boolean = false; @Input() searchRoute: string = '/search/find'; @Input() searchPlaceHolder: string = 'Search for research results'; @Input() showLogo: boolean = true; @Input() offCanvasFlip: boolean = false; keyword: string = ''; public isAuthorized: boolean = false; subs: Subscription[] = []; showEntity = {}; showPage = {}; public additionalMenuItems: MenuItem[] = []; public featuredMenuItems: MenuItem[] = []; constructor(private router: Router, private route: ActivatedRoute, private config: ConfigurationService, private _helpContentService: HelpContentService, private layoutService: LayoutService) {} ngOnInit() { this.initialize(); } ngOnDestroy() { for (let sub of this.subs) { sub.unsubscribe(); } } closeCanvas(element) { UIkit.offcanvas(element).hide(); } initialize() { if ((['provide', 'develop']).indexOf(this.portal) != -1) { this.header = { route: '/', url: null, title: this.portal, logoUrl: this.logoPath + 'logo-large-' + this.portal + '.png', logoSmallUrl: this.logoPath + 'logo-small-' + this.portal + '.png', position: 'left', menuPosition: 'right', badge: true }; } this.isAuthorized = Session.isClaimsCurator(this.user) || Session.isPortalAdministrator(this.user); if (this.properties.adminToolsAPIURL && this.communityId) { //this.config.getCommunityInformation(this.properties, this.communityId).subscribe(data => { this.subs.push(this.config.communityInformationState.subscribe(data => { if (data) { if (data['entities']) { for (let i = 0; i < data['entities'].length; i++) { this.showEntity['' + data['entities'][i]['pid'] + ''] = data['entities'][i]['isEnabled']; } } if (data['pages']) { for (let i = 0; i < data['pages'].length; i++) { this.showPage[data['pages'][i]['route']] = data['pages'][i]['isEnabled']; } } } }, error => { this.handleError('Error getting community information (e.g. pages,entities) for community with id: ' + this.communityId, error); })); } if(this.properties.environment == "development" && this.portal != 'connect' && this.portal != 'connect-admin' && this.properties.adminToolsPortalType == 'community') { this.subs.push( this._helpContentService.getMenuItems(this.portal).subscribe( data => { // Will divide all the custom menu items into 2 arrays. // One for the extra(added next to the hardcoded menu items in the existing nav bar) - additionalMenuItems // One for the featured(new nav bar below the existing one) - featuredMenuItems data.forEach(menuItem => { if(menuItem.isFeatured) { this.featuredMenuItems.push(menuItem); } else { this.additionalMenuItems.push(menuItem); } }); }, error => this.handleError("Server error fetching custom menu items", error) ) ); } } isEnabled(required, enabled) { if (!required) { return true; } for (let requiredEntity of required) { if (typeof enabled[requiredEntity] === 'undefined' || enabled[requiredEntity] == false) { return false; } } return true; } isAtleastOneEnabled(required, enabled) { if (!required || required.length == 0) { return true; } var count = required.length; for (let requiredEntity of required) { if (typeof enabled[requiredEntity] === 'undefined' || enabled[requiredEntity] == false) { count--; } } return (count > 0); } private handleError(message: string, error) { console.error('NavigationBar (component): ' + message, error); } get isHeaderLeft(): boolean { return this.header.position === 'left' || (this.header.position === 'center' && this.header.menuPosition === 'center' && this.menuItems.length > 0); } get currentRoute() { return { route: this.router.url.split('?')[0].split('#')[0], fragment: this.route.snapshot.fragment } } isTheActiveMenu(menu: MenuItem | RootMenuItem): boolean { if(menu instanceof MenuItem) { return MenuItem.isTheActiveMenu(menu, this.currentRoute, this.layoutService.activeMenuItem); } else { let item: MenuItem = menu.rootItem; item.items = menu.items; return MenuItem.isTheActiveMenu(item, this.currentRoute, this.layoutService.activeMenuItem); } } }