import {AfterViewChecked, Component, ElementRef, OnInit, ViewChild} from '@angular/core';
import {faqs} from './faqs';
import {ActivatedRoute} from '@angular/router';
import {Title} from '@angular/platform-browser';
import {Breadcrumb} from "../openaireLibrary/utils/breadcrumbs/breadcrumbs.component";

declare var UIkit: any;

@Component({
  selector: 'about',
  templateUrl: 'about.component.html',
  styleUrls: ['about.component.css'],
})
export class AboutComponent implements OnInit {
  @ViewChild('tabs') tabs: ElementRef;
  public architectureImage: string = "gray.png";
  public aggregationReadMore: boolean = false;
  public dedupClusteringReadMore: boolean = false;
  public dedupMatchingAndElectionReadMore: boolean = false;
  public enrichmentPropagationReadMore: boolean = false;
  public enrichmentMiningReadMore: boolean = false;

  public breadcrumbs: Breadcrumb[] = [
    {
      name: 'home',
      route: '/'
    },
    {
      name: 'about'
    }
  ];

  constructor(private title: Title,
              private route: ActivatedRoute) {
  }
  
  ngOnInit() {
    this.title.setTitle('OpenAIRE - Research Graph | About');
    this.route.fragment.subscribe(fragment => {
      setTimeout(() => {
        this.goTo(fragment);
      }, 100);
    });
  }
  
  goTo(id: string) {
    const yOffset = -100;
    const element = document.getElementById(id);
    if(element) {
      const y = element.getBoundingClientRect().top + window.pageYOffset + yOffset;
      window.scrollTo({top: y, behavior: 'smooth'});
    }
  }

  changeTab(index: number) {
    UIkit.switcher(this.tabs.nativeElement).show(index);
  }
}