import { Component, OnInit } from '@angular/core';
import { MatDialog } from '@angular/material/dialog';
import { TranslateService } from '@ngx-translate/core';
import { AuthService } from '../../core/services/auth/auth.service';
import { UserDialogComponent } from '../misc/navigation/user-dialog/user-dialog.component';
import { Principal } from '../../core/model/auth/Principal';
import { AppRole } from '../../core/common/enum/app-role';
import { Router } from '@angular/router';
import { Location } from '@angular/common';
import { Route } from '@angular/compiler/src/core';

declare interface RouteInfo {
	path: string;
	title: string;
	icon: string;
}
declare interface GroupMenuItem {
	title: string;
	routes: RouteInfo[];
	requiresAuthentication: boolean;
	requiresAdmin: boolean;
	isGeneral: boolean;
}

export const GENERAL_ROUTES: RouteInfo[] = [
	{ path: '/home', title: 'SIDE-BAR.DASHBOARD', icon: 'dashboard' },
	{ path: '/about', title: 'SIDE-BAR.ABOUT', icon: 'info_outline' }
];
export const DMP_ROUTES: RouteInfo[] = [
	{ path: '/plans', title: 'SIDE-BAR.MY-DMPS', icon: 'view_agenda' },
	{ path: '/explore-plans', title: 'SIDE-BAR.PUBLIC-DMPS', icon: 'public' },
	{ path: '/quick-wizard', title: 'SIDE-BAR.QUICK-WIZARD', icon: 'play_circle_outline' },
	{ path: '/plans/new', title: 'SIDE-BAR.ADD-EXPERT', icon: 'playlist_add' }
];
export const DATASETS_ROUTES: RouteInfo[] = [
	{ path: '/datasets', title: 'SIDE-BAR.MY-DATASET-DESC', icon: 'library_books' },
	{ path: '/explore', title: 'SIDE-BAR.PUBLIC-DESC', icon: 'public' },
	{ path: '/datasetcreatewizard', title: 'SIDE-BAR.QUICK-WIZARD-DATASET', icon: "play_circle_outline" },
];

export const PUBLIC_ROUTES: RouteInfo[] = [
	{ path: '/explore-plans', title: 'SIDE-BAR.PUBLIC-DMPS', icon: 'public' },
	{ path: '/explore', title: 'SIDE-BAR.PUBLIC-DESC', icon: 'public' }
];

export const GRANTS_ROUTES: RouteInfo[] = [
	{ path: '/grants', title: 'SIDE-BAR.MY-GRANTS', icon: 'work_outline' }
];

// export const GRANTS_ROUTES: RouteInfo[] = [
// 	{ path: '/grants', title: 'SIDE-BAR.MY-GRANTS', icon: 'work_outline' }
// ];
export const ADMIN_ROUTES: RouteInfo[] = [
	{ path: '/dmp-profiles', title: 'SIDE-BAR.DMP-TEMPLATES', icon: 'library_books' },
	{ path: '/dataset-profiles', title: 'SIDE-BAR.DATASET-TEMPLATES', icon: 'library_books' },
	{ path: '/users', title: 'SIDE-BAR.USERS', icon: 'people' }
];
// export const HISTORY_ROUTES: RouteInfo[] = [
//   { path: '/typography', title: 'SIDE-BAR.HISTORY-VISITED',  icon: 'visibility'},
//   { path: '/icons', title: 'SIDE-BAR.HISTORY-EDITED',  icon: 'edit'}
// ];

@Component({
	selector: 'app-sidebar',
	templateUrl: './sidebar.component.html',
	styleUrls: ['./sidebar.component.css', './sidebar.component.scss']
})
export class SidebarComponent implements OnInit {
	generalItems: GroupMenuItem;
	dmpItems: GroupMenuItem;
	adminItems: GroupMenuItem;
	//   historyItems: GroupMenuItem;
	datasetItems: GroupMenuItem;
	grantItems: GroupMenuItem;
	publicItems: GroupMenuItem;
	groupMenuItems: GroupMenuItem[] = [];
	private toggleButton: any;

	constructor(
		public translate: TranslateService,
		private authentication: AuthService,
		private dialog: MatDialog,
		public router: Router,
		private location: Location) {

	}

	ngOnInit() {
		this.generalItems = {
			title: 'SIDE-BAR.GENERAL',
			routes: GENERAL_ROUTES,
			requiresAuthentication: false,
			requiresAdmin: false,
			isGeneral: true
		}
		this.groupMenuItems.push(this.generalItems);

		this.dmpItems = {
			title: 'SIDE-BAR.DMP',
			routes: DMP_ROUTES,
			requiresAuthentication: true,
			requiresAdmin: false,
			isGeneral: false
		}
		this.groupMenuItems.push(this.dmpItems);

		this.datasetItems = {
			title: 'SIDE-BAR.DATASETS',
			routes: DATASETS_ROUTES,
			requiresAuthentication: true,
			requiresAdmin: false,
			isGeneral: false
		}
		this.groupMenuItems.push(this.datasetItems);

		this.grantItems = {
			title: 'SIDE-BAR.GRANTS',
			routes: GRANTS_ROUTES,
			requiresAuthentication: true,
			requiresAdmin: false,
			isGeneral: false
		}
		this.groupMenuItems.push(this.grantItems);

		this.adminItems = {
			title: 'SIDE-BAR.ADMIN',
			routes: ADMIN_ROUTES,
			requiresAuthentication: true,
			requiresAdmin: true,
			isGeneral: false
		}
		this.groupMenuItems.push(this.adminItems);

		this.publicItems = {
			title: 'SIDE-BAR.PUBLIC',
			routes: PUBLIC_ROUTES,
			requiresAuthentication: false,
			requiresAdmin: false,
			isGeneral: false
		}
		this.groupMenuItems.push(this.publicItems);

		// this.historyItems = {
		// 	title: 'SIDE-BAR.HISTORY',
		// 	routes: HISTORY_ROUTES
		// }
		// this.groupMenuItems.push(this.historyItems);
	}

	public principalHasAvatar(): boolean {
		return this.authentication.current().avatarUrl != null;
	}

	public getPrincipalAvatar(): string {
		return this.authentication.current().avatarUrl;
	}

	public isAuthenticated(): boolean {
		const myBollean = this.isAdmin();
		return !(!this.authentication.current());
	}

	public isAdmin(): boolean {
		const principal: Principal = this.authentication.current();
		if (principal) {
			if (principal.authorities.find(role => role === AppRole.Admin)) {
				return true;
			}
			else {
				return false;
			}
		} else {
			return false;
		}
	}

	isLoginRouteActivated(): boolean {
		return this.location.path().indexOf('/login') > -1;
	}

	public logout(): void {
		this.authentication.logout();
	}

	showItem(value: GroupMenuItem) {
		if (this.isAuthenticated()) {
			if (value.requiresAdmin) {
				return this.isAdmin();
			}
			else {
				return value.isGeneral || value.requiresAuthentication;
			}
		}
		else {
			return !value.requiresAuthentication;
		}
	}

	openProfile() {
		const dialogRef = this.dialog.open(UserDialogComponent, {
			hasBackdrop: true,
			autoFocus: false,
			closeOnNavigation: true,
			disableClose: false,
			position: { top: '64px', right: '1em' }
		});
	}
}