import {Component, Input, OnDestroy, OnInit} from '@angular/core';
import {MenuItem, MessageService, PrimeNGConfig} from "primeng/api";
import {Observable, Subject} from "rxjs";
import {User} from "../../model/user";
import {LogoutAction, UserState} from "../../states/user.state";
import {Select, Store} from "@ngxs/store";
import {ActivatedRoute, NavigationEnd, Router, RouterEvent} from "@angular/router";
import {filter, takeUntil} from "rxjs/operators";
import { LOCALE_ID, Inject } from '@angular/core';

export class LanguageTrans{
  public name?: string;
  public code?:string;
}
@Component({
  selector: 'app-header-menu',
  templateUrl: './header-menu.component.html',
  styleUrls: ['./header-menu.component.css']
})
export class HeaderMenuComponent implements OnInit,OnDestroy{

  items: MenuItem[] = [] ;
  public destroyed = new Subject<any>();
  // @ts-ignore
  public loggeduser: Observable<User> = this.store.select(UserState.userDetails);
  logged?:boolean
  selectedLanguage?:LanguageTrans;
  languages :LanguageTrans[] = [];

  @Input() hideheader?:string|null;
  constructor(private route:ActivatedRoute,private primengConfig: PrimeNGConfig, private store: Store, private router: Router,private messageService: MessageService,  @Inject(LOCALE_ID) public locale: string) {}
  initialise() {

    this.logged = this.isLogged();
    // @ts-ignore
    this.items = [
      {
        label: $localize `Home`,
        routerLink:'/home',
        styleClass:"pr-2 ",
      },
      {
        label: $localize `Add resource`,
        url:'#/resource/add',
        styleClass:"pr-2",
        target:"_blank"
      },
      {
        label: $localize `E-trainings`,
        url:'#/e_training',
        styleClass:"pr-2",
        target:"_blank"
      },
      {
        label: $localize `Approve`,
        routerLink:'/resource/approve',
        styleClass:"pr-2",
        visible:this.isUserAdmin()
      },
      {
        label:$localize `IPMWORKS Project`,
        url:'http://ipmworks.net',
        styleClass:"pr-2",
        target:"_blank"
      },
      {
        label: $localize`Help and Support`,
        routerLink:'/help',
        styleClass:"pr-2",
        target:"_blank"
      },
      {
        label: $localize `Logout`,
        command:(event) => {this.logout()},
        styleClass:"pr-2",
        visible:this.logged
      },
      {
        label: $localize `Admin Login`,
        routerLink:'/login',
        styleClass:"pr-2",
        visible:!this.logged
      }
    ]
  }
  ngOnInit(): void {
    this.languages = [
      { name: $localize `Dutch`, code: "nl" },
      { name: $localize `Danish`, code: "da" },
      { name: $localize `English`, "code": "en" },
      { name: $localize `Finnish`, code: "fi" },
      { name: $localize `French`, code: "fr" },
      { name: $localize `German`, code: "de" },
      { name: $localize `Greek`, code: "el" },
      { name: $localize `Italian`, code: "it" },
      { name: $localize `Polish`, code: "pl" },
      { name: $localize `Portuguese`, code: "pt" },
      { name: $localize `Serbian`, "code": "sr" },
      { name: $localize `Slovenian`, code: "sl" },
      { name: $localize `Spanish`, code: "es" }

    ]
    this.findSelectedLanguage();
    this.router.events.pipe(filter((event) => event instanceof NavigationEnd),
      takeUntil(this.destroyed)
    ).subscribe(() => {
      this.router.routeReuseStrategy.shouldReuseRoute = function() { return false; };
      this.initialise();
    });


  }
  public findSelectedLanguage(){
    console.log("locale:"+this.locale)
     var selected = this.languages.filter(l=>l.code===this.locale);
    if(selected.length !== 0){
      this.selectedLanguage =this.languages.filter(l=>l.code===this.locale)[0];
    }
  }
  public isUserAdmin() {
    var admin = false;
    this.loggeduser?.subscribe(user => {
      if(user == undefined || user.token == undefined){
        admin=false;
      }else{
        // @ts-ignore
        admin=user?.roles.includes("ADMIN")
      }
    });
    return admin;
  }
  public isLogged() {
    var logged = false;
    this.loggeduser?.subscribe(user => {
      if(user == undefined || user.token == undefined){
        logged=false;
      }else{
        logged = true;
      }
    });
    return logged;
  }
  ngOnDestroy(): void {
    //this.destroyed.next();
    //this.destroyed.complete();
  }


  public logout(): void {
    this.store.dispatch(new LogoutAction());
    this.router.navigate(['/home']);
    this.messageService.add({severity:"success", detail:"Goodbye!"})
  }
  public reloadTranslate(event:any):void{
      window.location.href= "/toolbox/"+this.selectedLanguage?.code;


  }
  }

























































