import { Component, OnInit, Input } from '@angular/core';
import { CommonService } from 'src/app/hmg-common/services/common/common.service';
import { TranslatorService } from 'src/app/hmg-common/services/translator/translator.service';
import { Platform, Events } from '@ionic/angular';
import { isMonday } from 'date-fns';
import { Router, NavigationEnd } from '@angular/router';
import { NativeStorage } from '@ionic-native/native-storage/ngx';
// import { HomePage } from 'src/app/home/home.page';
import { NationalityService } from '../../services/nationality/nationality.service';
import { ProjectsService } from '../../services/projects/projects.service';
import { KeyboardService } from '../../services/keyboard/keyboard.service';
import { KeyboardStatusModel } from '../../services/keyboard/keyboard-status.model';
// import { NotificationsComponent } from 'src/app/eservices/notifications-center/notifications/notifications.component';
import { AuthenticationService } from '../../services/authentication/authentication.service';
// import { NotificationsCenterService } from 'src/app/eservices/notifications-center/service/notifications-center.service';

@Component({
  selector: 'tabs-bar',
  templateUrl: './tabs-bar.component.html',
  styleUrls: ['./tabs-bar.component.scss'],
})
export class TabsBarComponent implements OnInit {


  private static fullClass = 'tabs-container-full slideInUpSlow';
  private static partialClass = 'tabs-container-partial slideInUpSlow';

  private static home = 'home';
  private static family = 'family';
  private static notifications = 'notifications';
  private static file = 'file';
  private static language = 'language';

  public show = true;
  public isMenuOpened = false;
  public showClass = TabsBarComponent.fullClass;
  public active: string;
  public currentLanguage: string;
  public notificationsCount: number;
  public keyboardOpened = false;
  public showMedicalFile = true;
  constructor(
    public cs: CommonService,
    public ts: TranslatorService,
    public platform: Platform,
    public router: Router,
    public nativeStorage: NativeStorage,
    public events: Events,
    public projectsService: ProjectsService,
    public nationalityService: NationalityService,
    public keyboardService: KeyboardService
  ) { }

  private isSplitPanelAlwaysOpened = false;
  ngOnInit() {
    this.platform.ready().then(() => {
      this.monitorKeyboardChange();
      this.monitorNotificationsChange();
      this.monitorSizeChange();
      this.monitUrlChange();
      this.monitorFamilyMemberLogin();
      this.currentLanguage = TranslatorService.getCurrentLanguageName();
      // this.enableMedicalFile();
    });
  }

  /*
  show medical file after a while
  because of it's red color is itense with the splash screen
  */
  private enableMedicalFile() {
    this.showMedicalFile = false;
    setTimeout(() => this.showMedicalFile = true, 500);
  }
  /*
  hide the tabs bar when keyboard is opened
  */
  private monitorKeyboardChange() {
    this.keyboardOpened = KeyboardService.keyboardOpened;
    this.events.subscribe(KeyboardService.KEYBOARD_STATUS, (status: KeyboardStatusModel) => {
      this.keyboardOpened = status.opened;
    });
  }

  /*
  if main user logged in with family member we
  remove notifications count
  */
  private monitorFamilyMemberLogin() {
    this.events.subscribe(AuthenticationService.FAMILY_LOGIN_EVENT, (user) => {
      this.notificationsCount = null;
    });
  }




  /*
  change take partial or full width on different devices
  */
  private monitorSizeChange() {
    this.platform.resize.subscribe(() => {
      this.onResize();
    });
    this.onResize();
  }

  /*
 monitor notifications count update form 
 1- notifications center when user read new message
 2- home dash board
 3- push notifications
 */
  private monitorNotificationsChange() {

    // this.events.subscribe(NotificationsCenterService.NOTIFICATIONS_COUNT_EVENT, (count: number) => {
    //   this.notificationsCount = count;
    //   this.cs.setBadge(count);
    // });
  }

  /*
  update selected icons based on navigation
  */
  private monitUrlChange() {
    this.router.events.subscribe((val) => {
      // if (val instanceof NavigationEnd) {
      //   if (this.matchesURL(val, CommonService.HOME_URL, TabsBarComponent.home)) {
      //     this.cs.openHome();
      //   }
      // }
    });

  }
  private matchesURL(val: NavigationEnd, targets: string[], targetActive: string) {
    for (const target of targets) {
      if (val.urlAfterRedirects === target) {
        if (this.active !== targetActive) {
          this.active = targetActive;
          return true;
        }
      }
    }
    return false;
  }
  private fixedOpendLastTime = false;
  private onResize() {
    // if splitpanel always fixed opened
    this.isSplitPanelAlwaysOpened = this.platform.width() >= 992;
    setTimeout(() => {
      if (this.isSplitPanelAlwaysOpened) {
        this.isMenuOpened = true;
        this.fixedOpendLastTime = true;
        this.processTablet(true);
      } else {
        // this.processMobile( false);
        if (this.fixedOpendLastTime) {
          this.fixedOpendLastTime = false;
          this.processMobile(false);
        } else {
          this.processMobile(this.isMenuOpened);
        }
      }
    }, 100);

  }

  public menuOpened(opened: boolean) {
    this.platform.ready().then(() => {
      if (this.isSplitPanelAlwaysOpened) {
        this.processTablet(opened);
      } else {
        this.processMobile(opened);
      }
    });
  }


  private processMobile(opened: boolean) {
    this.isMenuOpened = opened;
    this.show = !opened;
    this.showClass = TabsBarComponent.fullClass;
  }

  public processTablet(opened: boolean) {
    this.show = true;
    this.showClass = TabsBarComponent.partialClass;
  }



  public onClick(name: string) {
    this.active = name;
    switch (this.active) {
      case TabsBarComponent.home:
        this.cs.openHome();
        break;
      case TabsBarComponent.language:
        this.switchLanguage();
        break;
    }
  }

  private switchLanguage() {
    this.nationalityService.cleanCache();
    this.projectsService.cleanCache();
    this.ts.switchLanguage();
    /*
   this.cs.presentConfirmDialog(this.ts.trPK('general', 'switch-lng'), () => {
     this.nationalityService.cleanCache();
     this.projectsService.cleanCache();
     this.ts.switchLanguage();
   });
   */
  }



}
