import { Component, OnInit, Input } from '@angular/core';

import { NgForm } from '@angular/forms';
import { Router } from "@angular/router";
import { FormBuilder, FormGroup, Validators } from '@angular/forms';
import { AppConstants } from "../../../app.constants";
import { ApiService } from "@shared/services/api.service";
import { SessionService } from "@shared/services/session.service";
import { FooterService } from "@shared/services/footer.service";
import { UtilityService } from "@shared/services/utility.service";
import { SideMenuService } from "@shared/services/side-menu.service";
import { HeaderService } from "@shared/services/header.service"

@Component({
  selector: 'app-admin-header',
  templateUrl: './admin-header.component.html',
  styleUrls: ['./admin-header.component.sass']
})
export class AdminHeaderComponent implements OnInit {

  public message:string='';
  public password: any='';
  public newPassword: any='';
  public confirmPassword: any='';
  public passModal: any;
  public submitted : Boolean;
  public showModal: Boolean;
  public showLoader: Boolean;
  public success: Boolean;
  public error: Boolean;
  public modalMsg: string='';
  public modalMsgConfirm: string='';
  public oldPass: string;
  public newPass: string;
  public form: any;
  public formElem: any;
  public confirmPass: string;

  @Input() adminDetails: any;

  constructor( public util: UtilityService,
    private _apiCallService: ApiService,
    private _SessionService: SessionService,
    private _Router: Router,
    public header: HeaderService,
    public sideMenu: SideMenuService,
    public footer: FooterService) {

  }
  ngOnInit() {
    this.sideMenu.show();
    this.footer.hide();
    this.util.setDarkBg();
    this.header.setDashHead();
    let count = 1; 
    let interval:any = setInterval( () => {
        if( count <= 2){
            this.adminDetails.profile_pic = this.adminDetails.profile_pic;
        } else {
            clearInterval(interval);
        }
        count = count + 1;
    }, 2000);
  };

  updatePass(form) { 
    this.modalMsg = "";
    this.modalMsgConfirm = "";
    this.error = false;
    if( form.value.newPass.length < 3 ){
        this.error = true;
        this.modalMsg = "Password entered should be minimum of 3 characters";
        return false;
    }else if( form.value.newPass.length > 10 ){ 
        this.error = true; 
        this.modalMsg = "New password entered should be a maximum of 10 characters"; 
        return false; 
    } else if( form.value.newPass !== form.value.confirmPass ){
        this.error = true;
        this.modalMsgConfirm = "Passwords do not match";
        return false;
    } else {
        this.modalMsg = "";
        this.modalMsgConfirm = "";
        this.error = false;
        this.showLoader = true;
        this._apiCallService.changePassword({ current_password: form.value.oldPass, new_password: form.value.newPass })
          .subscribe( (response) => {
              this.oldPass = "";
              this.newPass = "";
              this.confirmPass = "";
              this.showLoader = false;
              document.getElementById('myModal').style.display = "none";
              document.getElementById("user-wrapper").className =""; 
          }, (error) => {
              this.showLoader = false;
              this.error = true;
              this.modalMsg = error.message;
          });
        }
    }

  editProf() {
      this._Router.navigate(['/user/admin_details/edit_prof']);
  }
  openModal() {
      document.getElementById('myModal').style.display = "block";
      document.getElementById("user-wrapper").className ="forgot-password-wrapper";
  }
  closeModal() {
      document.getElementById('myModal').style.display = "none";
      document.getElementById("user-wrapper").className ="";
  }
}