import { Component, OnInit } from '@angular/core';
import { Router, CanActivate, ActivatedRouteSnapshot, RouterStateSnapshot, ActivatedRoute, NavigationEnd } from '@angular/router';
import {BreadcrumbModule,MenuItem} from 'primeng/primeng';

@Component({
  selector: 'breadcrumb',
  templateUrl: './breadcrumb.component.html',
  styleUrls: ['./breadcrumb.component.css']
})
export class BreadcrumbComponent implements OnInit {


  breadcrumbHome: MenuItem = {icon: 'fa fa-home', routerLink: "/welcome"};
  breadcrumbData: MenuItem[] = new Array<MenuItem>();


  constructor(private router: Router, private route: ActivatedRoute) {
    router.events.subscribe(
      event =>{
        console.log("Router event captured")
        console.log(event)
        

        if(event instanceof NavigationEnd){
          //this.breadcrumbData.push("")
          console.log(event.urlAfterRedirects);
          console.log(this.route);

          
          //this.breadcrumbData.length = 0;
          this.route.children.forEach( child => {
            let menuItem : MenuItem = this.guessMenuItemFromActivatedRoute(child, event);
            if(menuItem != null)
              this.breadcrumbData.push(menuItem);
          })

        }
      });

  }

  guessMenuItemFromActivatedRoute(activatedRoute : any, event : NavigationEnd) { //it's important to leave it as "any"
    let componentName = activatedRoute.component.name; 
    let params = activatedRoute.queryParams.getValue();
    let url = event.urlAfterRedirects.split("?")[0]; 

    let label = null;
    if(componentName == "ProjectsComponent") {
      label = "My Projects";
    }
    if(componentName == "DmpComponent"){
      label = "My Data Management Plans";
    }
    
    if(label != null)
      return {"label": label, "routerLink": url, "queryParams" : params };

    return null;
  }


  ngOnInit() {

  }

  getPaths(){

    return this.breadcrumbData;
  }



}