import {Component} from '@angular/core';
import {PagesService} from "@app/_services/pages.service";
import {AuthenticationService, ListsService} from "@app/_services";
import {Subscription} from "rxjs";
import { Router } from '@angular/router';
import { html } from '@environments/htmlenv';

@Component({
  selector: 'header',
  templateUrl: html.header||'header.component.html',
  styleUrls: ['header.component.scss']
})
export class HeaderComponent {
  public menuItems = <any>[];
  public user: any;
  public loading: boolean = false;
  public error: string = '';
  routeSubscription?: Subscription;
  subscription: Subscription;
  showMobileMenu = false;  

  constructor(
    private router:Router,
    private pagesService: PagesService, 
    public authenticationService: AuthenticationService, 
    private listsService: ListsService) {
    this.subscription = this.authenticationService.user.subscribe(user => {
      this.user = user;
    });
  }

  ngOnInit() {
    console.log(html.header)
    let showSettingSite = localStorage.getItem('showSettingSite');
    if (showSettingSite === null || showSettingSite === 'no') {
      localStorage.setItem('showSettingSite', 'no');
      this.listsService.result('showSettingSite').next(false);
    }   
  }

  ngOnDestroy() {
    this.subscription?.unsubscribe();
  }

  openMobileMenu(){
    this.router.navigate([{outlets: {slider: 'pages-menu'}}], {skipLocationChange: true}).then();
  }

  settingsSite() {
    let showSettingSite = localStorage.getItem('showSettingSite');
    showSettingSite = showSettingSite === 'yes' ? 'no' : 'yes';
    localStorage.setItem('showSettingSite', showSettingSite);
    this.listsService.result('showSettingSite').next(showSettingSite==='yes');
  }

  login() {
    this.authenticationService.popup('login');
  }

  toggle(){
    this.showMobileMenu = !this.showMobileMenu;
  }

}