2022-07-01 10:27:47 +02:00
|
|
|
import {Component, Input, OnDestroy, OnInit} from '@angular/core';
|
2017-12-19 13:53:46 +01:00
|
|
|
import {ActivatedRoute, Router} from '@angular/router';
|
2019-09-13 09:01:19 +02:00
|
|
|
import {Session, User} from '../login/utils/helper.class';
|
2019-07-01 16:22:11 +02:00
|
|
|
import {ConfigurationService} from '../utils/configuration/configuration.service';
|
|
|
|
import {MenuItem, RootMenuItem} from './menu';
|
|
|
|
import {EnvProperties} from '../utils/properties/env-properties';
|
2020-10-14 11:54:21 +02:00
|
|
|
import {Subscription} from 'rxjs';
|
2022-01-13 13:09:10 +01:00
|
|
|
import {HelpContentService} from '../services/help-content.service';
|
2022-02-28 17:00:57 +01:00
|
|
|
import {properties} from "../../../environments/environment";
|
2022-03-28 10:40:21 +02:00
|
|
|
import {LayoutService} from "../dashboard/sharedComponents/sidebar/layout.service";
|
2020-10-14 11:54:21 +02:00
|
|
|
|
2022-02-28 13:38:26 +01:00
|
|
|
declare var UIkit;
|
|
|
|
|
2020-10-14 11:54:21 +02:00
|
|
|
export interface Header {
|
|
|
|
route?: string,
|
|
|
|
url?: string,
|
|
|
|
title: string,
|
|
|
|
logoUrl: string,
|
|
|
|
logoSmallUrl: string,
|
|
|
|
position: 'left' | 'center' | 'right',
|
|
|
|
badge: boolean
|
2021-04-12 17:33:39 +02:00
|
|
|
stickyAnimation?: boolean
|
2022-02-18 15:57:25 +01:00
|
|
|
menuPosition?: 'center' | 'right'
|
2020-10-14 11:54:21 +02:00
|
|
|
}
|
2019-07-01 16:22:11 +02:00
|
|
|
|
2017-12-19 13:53:46 +01:00
|
|
|
@Component({
|
|
|
|
selector: 'navbar',
|
|
|
|
templateUrl: 'navigationBar.component.html'
|
|
|
|
})
|
2021-04-12 17:33:39 +02:00
|
|
|
export class NavigationBarComponent implements OnInit, OnDestroy {
|
2020-10-14 11:54:21 +02:00
|
|
|
@Input() portal: string = 'connect';
|
2020-08-05 15:27:13 +02:00
|
|
|
@Input() dark: boolean = false;
|
2022-02-28 17:00:57 +01:00
|
|
|
@Input() onlyTop: boolean = false;
|
2020-10-14 11:54:21 +02:00
|
|
|
@Input() logoPath: string = 'assets/common-assets/';
|
2019-09-13 09:01:19 +02:00
|
|
|
@Input() userMenu: boolean = true;
|
|
|
|
@Input() showHomeMenuItem: boolean = false;
|
2018-02-05 14:14:59 +01:00
|
|
|
@Input() communityId;
|
2019-09-13 09:01:19 +02:00
|
|
|
@Input() showCommunityName: boolean = false;
|
|
|
|
@Input() userMenuItems: MenuItem[];
|
|
|
|
@Input() menuItems: RootMenuItem [];
|
2020-10-14 11:54:21 +02:00
|
|
|
@Input() header: Header;
|
2019-09-13 09:01:19 +02:00
|
|
|
@Input() showMenu: boolean = true;
|
|
|
|
@Input() homeurl: boolean = true;
|
2022-02-28 17:00:57 +01:00
|
|
|
@Input() properties: EnvProperties = properties;
|
2019-09-13 09:01:19 +02:00
|
|
|
@Input() user: User;
|
|
|
|
@Input() enableSearch: boolean = false;
|
2020-10-14 11:54:21 +02:00
|
|
|
@Input() searchRoute: string = '/search/find';
|
|
|
|
@Input() searchPlaceHolder: string = 'Search for research results';
|
2020-06-16 21:59:51 +02:00
|
|
|
@Input() showLogo: boolean = true;
|
2020-10-06 10:12:14 +02:00
|
|
|
@Input() offCanvasFlip: boolean = false;
|
2020-10-14 11:54:21 +02:00
|
|
|
keyword: string = '';
|
2017-12-19 13:53:46 +01:00
|
|
|
public isAuthorized: boolean = false;
|
2020-07-13 00:19:30 +02:00
|
|
|
subs: Subscription[] = [];
|
2019-09-13 09:01:19 +02:00
|
|
|
showEntity = {};
|
|
|
|
showPage = {};
|
2022-02-18 15:57:25 +01:00
|
|
|
|
2022-03-02 11:27:48 +01:00
|
|
|
public additionalMenuItems: MenuItem[] = [];
|
|
|
|
public featuredMenuItems: MenuItem[] = [];
|
2022-02-18 15:57:25 +01:00
|
|
|
|
2019-09-13 09:01:19 +02:00
|
|
|
constructor(private router: Router,
|
|
|
|
private route: ActivatedRoute,
|
2022-01-13 13:09:10 +01:00
|
|
|
private config: ConfigurationService,
|
2022-03-28 10:40:21 +02:00
|
|
|
private _helpContentService: HelpContentService,
|
|
|
|
private layoutService: LayoutService) {}
|
2022-01-13 13:09:10 +01:00
|
|
|
|
2017-12-19 13:53:46 +01:00
|
|
|
ngOnInit() {
|
2020-10-14 11:54:21 +02:00
|
|
|
this.initialize();
|
2017-12-19 13:53:46 +01:00
|
|
|
}
|
2022-02-18 15:57:25 +01:00
|
|
|
|
2019-09-13 09:01:19 +02:00
|
|
|
ngOnDestroy() {
|
2020-07-13 00:19:30 +02:00
|
|
|
for (let sub of this.subs) {
|
|
|
|
sub.unsubscribe();
|
2020-06-10 13:05:59 +02:00
|
|
|
}
|
2017-12-19 13:53:46 +01:00
|
|
|
}
|
2022-02-28 13:38:26 +01:00
|
|
|
|
|
|
|
closeCanvas(element) {
|
|
|
|
UIkit.offcanvas(element).hide();
|
|
|
|
}
|
2022-02-18 15:57:25 +01:00
|
|
|
|
2019-09-13 09:01:19 +02:00
|
|
|
initialize() {
|
2020-10-14 13:36:18 +02:00
|
|
|
if ((['provide', 'develop']).indexOf(this.portal) != -1) {
|
2020-10-14 11:54:21 +02:00
|
|
|
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',
|
2022-02-18 15:57:25 +01:00
|
|
|
menuPosition: 'right',
|
2020-10-14 11:54:21 +02:00
|
|
|
badge: true
|
|
|
|
};
|
2020-10-06 10:12:14 +02:00
|
|
|
}
|
2019-09-13 09:01:19 +02:00
|
|
|
this.isAuthorized = Session.isClaimsCurator(this.user) || Session.isPortalAdministrator(this.user);
|
2022-07-01 10:27:47 +02:00
|
|
|
if ((this.properties.adminToolsAPIURL && this.communityId) || properties.adminToolsPortalType == "community") {
|
2020-07-13 00:19:30 +02:00
|
|
|
//this.config.getCommunityInformation(this.properties, this.communityId).subscribe(data => {
|
|
|
|
this.subs.push(this.config.communityInformationState.subscribe(data => {
|
2020-10-14 11:54:21 +02:00
|
|
|
if (data) {
|
2022-07-01 10:27:47 +02:00
|
|
|
this.showEntity = {};
|
|
|
|
this.showPage = {};
|
2021-04-12 17:33:39 +02:00
|
|
|
if (data['entities']) {
|
2022-02-28 13:38:26 +01:00
|
|
|
for (let i = 0; i < data['entities'].length; i++) {
|
2022-02-18 15:57:25 +01:00
|
|
|
|
2020-12-07 11:22:24 +01:00
|
|
|
this.showEntity['' + data['entities'][i]['pid'] + ''] = data['entities'][i]['isEnabled'];
|
|
|
|
}
|
2020-10-14 11:54:21 +02:00
|
|
|
}
|
2021-04-12 17:33:39 +02:00
|
|
|
if (data['pages']) {
|
2022-02-28 13:38:26 +01:00
|
|
|
for (let i = 0; i < data['pages'].length; i++) {
|
2020-12-07 11:22:24 +01:00
|
|
|
this.showPage[data['pages'][i]['route']] = data['pages'][i]['isEnabled'];
|
2022-02-18 15:57:25 +01:00
|
|
|
|
2020-12-07 11:22:24 +01:00
|
|
|
}
|
2020-10-14 11:54:21 +02:00
|
|
|
}
|
2019-09-13 09:01:19 +02:00
|
|
|
}
|
2020-10-14 11:54:21 +02:00
|
|
|
},
|
|
|
|
error => {
|
|
|
|
this.handleError('Error getting community information (e.g. pages,entities) for community with id: ' + this.communityId, error);
|
|
|
|
}));
|
2018-02-05 16:13:55 +01:00
|
|
|
}
|
2022-07-15 12:43:11 +02:00
|
|
|
if(this.portal != 'connect' && this.portal != 'connect-admin' && this.properties.adminToolsPortalType == 'community') {
|
2022-01-13 13:09:10 +01:00
|
|
|
this.subs.push(
|
|
|
|
this._helpContentService.getMenuItems(this.portal).subscribe(
|
|
|
|
data => {
|
2022-07-15 12:43:11 +02:00
|
|
|
this.featuredMenuItems = data.featuredMenuItems;
|
|
|
|
this.additionalMenuItems = data.menuItems;
|
2022-01-13 13:09:10 +01:00
|
|
|
},
|
|
|
|
error => this.handleError("Server error fetching custom menu items", error)
|
|
|
|
)
|
|
|
|
);
|
|
|
|
}
|
2017-12-19 13:53:46 +01:00
|
|
|
}
|
2022-02-28 13:38:26 +01:00
|
|
|
|
2019-09-13 09:01:19 +02:00
|
|
|
isEnabled(required, enabled) {
|
|
|
|
if (!required) {
|
|
|
|
return true;
|
|
|
|
}
|
2022-02-18 15:57:25 +01:00
|
|
|
|
|
|
|
|
2019-09-13 09:01:19 +02:00
|
|
|
for (let requiredEntity of required) {
|
2020-10-14 11:54:21 +02:00
|
|
|
if (typeof enabled[requiredEntity] === 'undefined' || enabled[requiredEntity] == false) {
|
2019-09-13 09:01:19 +02:00
|
|
|
return false;
|
2018-02-05 14:14:59 +01:00
|
|
|
}
|
2019-09-13 09:01:19 +02:00
|
|
|
}
|
|
|
|
return true;
|
|
|
|
}
|
2022-02-18 15:57:25 +01:00
|
|
|
|
2019-09-13 09:01:19 +02:00
|
|
|
isAtleastOneEnabled(required, enabled) {
|
|
|
|
if (!required || required.length == 0) {
|
2018-02-05 14:14:59 +01:00
|
|
|
return true;
|
|
|
|
}
|
2022-02-18 15:57:25 +01:00
|
|
|
|
2019-09-13 09:01:19 +02:00
|
|
|
var count = required.length;
|
|
|
|
for (let requiredEntity of required) {
|
2020-10-14 11:54:21 +02:00
|
|
|
if (typeof enabled[requiredEntity] === 'undefined' || enabled[requiredEntity] == false) {
|
2019-09-13 09:01:19 +02:00
|
|
|
count--;
|
2018-12-07 12:07:19 +01:00
|
|
|
}
|
|
|
|
}
|
2022-02-28 13:38:26 +01:00
|
|
|
return (count > 0);
|
2019-09-13 09:01:19 +02:00
|
|
|
}
|
2022-02-18 15:57:25 +01:00
|
|
|
|
2019-09-13 09:01:19 +02:00
|
|
|
private handleError(message: string, error) {
|
2020-10-14 11:54:21 +02:00
|
|
|
console.error('NavigationBar (component): ' + message, error);
|
2019-09-13 09:01:19 +02:00
|
|
|
}
|
2022-02-28 17:00:57 +01:00
|
|
|
|
|
|
|
get isHeaderLeft(): boolean {
|
|
|
|
return this.header.position === 'left' || (this.header.position === 'center' && this.header.menuPosition === 'center' && this.menuItems.length > 0);
|
|
|
|
}
|
2022-02-18 15:57:25 +01:00
|
|
|
|
2021-04-12 17:35:49 +02:00
|
|
|
get currentRoute() {
|
|
|
|
return {
|
|
|
|
route: this.router.url.split('?')[0].split('#')[0],
|
|
|
|
fragment: this.route.snapshot.fragment
|
|
|
|
}
|
|
|
|
}
|
2022-02-18 15:57:25 +01:00
|
|
|
|
2022-03-28 10:40:21 +02:00
|
|
|
isTheActiveMenu(menu: MenuItem | RootMenuItem): boolean {
|
2022-06-21 18:37:21 +02:00
|
|
|
if(menu instanceof MenuItem || !menu.rootItem) {
|
|
|
|
return MenuItem.isTheActiveMenu(<MenuItem> menu, this.currentRoute, this.layoutService.activeMenuItem);
|
2022-03-28 10:40:21 +02:00
|
|
|
} else {
|
|
|
|
let item: MenuItem = menu.rootItem;
|
|
|
|
item.items = menu.items;
|
|
|
|
return MenuItem.isTheActiveMenu(item, this.currentRoute, this.layoutService.activeMenuItem);
|
2019-06-25 15:26:24 +02:00
|
|
|
}
|
2021-01-11 14:54:07 +01:00
|
|
|
}
|
2017-12-19 13:53:46 +01:00
|
|
|
}
|