import { Component, OnInit, Input } from '@angular/core';
import { Router, ActivatedRoute, NavigationEnd, Params, PRIMARY_OUTLET } from '@angular/router';
import { HBORBreadcrumbService } from '../services/hbor-breadcrumb.service';
import { Breadcrumb } from '../interfaces/breadcrumb';
import { filter } from 'rxjs/operators';


@Component({
  selector: 'hbor-breadcrumb',
  templateUrl: './breadcrumb.component.html',
  styleUrls: ['./breadcrumb.component.css'],
})
export class BreadcrumbComponent implements OnInit {
  @Input() disabled = false;
  public currentBreadcrumbs: Breadcrumb[];
  public breadcrumbs: Breadcrumb[];
  constructor(private hborBreadcrumbsService: HBORBreadcrumbService, private activatedRoute: ActivatedRoute, private router: Router) {
    hborBreadcrumbsService.get().subscribe((breadcrumbs: Breadcrumb[]) => {
      this.breadcrumbs = breadcrumbs as Breadcrumb[];
    });
  }

  ngOnInit() {
    const ROUTE_DATA_BREADCRUMB = 'breadcrumb';
    const ROUTE_PARAM_BREADCRUMB = 'breadcrumb';

    this.router.events.pipe(filter(event => event instanceof NavigationEnd)).subscribe(event => {
      this.currentBreadcrumbs = [];
      let currentRoute: ActivatedRoute = this.activatedRoute.root;
      let url = '';
      while (currentRoute.children.length > 0) {
        const childrenRoutes: ActivatedRoute[] = currentRoute.children;
        let breadCrumbLabel = '';

        childrenRoutes.forEach(route => {
          currentRoute = route;
          if (route.outlet !== PRIMARY_OUTLET) {
            return;
          }
          if (route.snapshot.data.hasOwnProperty(ROUTE_DATA_BREADCRUMB)) {
            breadCrumbLabel = route.snapshot.data[ROUTE_DATA_BREADCRUMB];
          } else if (route.snapshot.params.hasOwnProperty(ROUTE_PARAM_BREADCRUMB)) {
            breadCrumbLabel = route.snapshot.params['breadcrumb'].replace(/_/g, ' ')
          }

          const routeURL: string = route.snapshot.url.map(segment => segment.path).join('/');
          url += `/${routeURL}`;

          if (routeURL.length === 0) {
            route.snapshot.params = {};
          }

          const breadcrumb: Breadcrumb = {
            label: breadCrumbLabel,
            params: route.snapshot.params,
            url: url
          };
          this.currentBreadcrumbs.push(breadcrumb);
        });
        this.hborBreadcrumbsService.store(this.currentBreadcrumbs);
      }
    });
  }

  navigate(url: any) {
    this.router.navigate([url], { skipLocationChange: true });
  }
}