import { Location, DatePipe } from '@angular/common';
import {
  Component,
  ElementRef,
  OnInit,
  ViewChild,
  Output,
  EventEmitter
} from '@angular/core';
import { Router } from '@angular/router';

import { LOCALE } from '../app.constants';
import { SelectedMultiFactorMethod } from '../models';
import { TemplateUpdate } from '../models';
import {
  PaymentService,
  TemplateService,
  MultiFactorService
} from '../services';
import { ErrorStore } from '../stores';
import { AppState } from '../stores/app-state.store';

@Component({
  selector: 'app-authenticate-request',
  templateUrl: './authenticate-request.component.html',
  styleUrls: ['./authenticate-request.component.css']
})
export class AuthenticateRequestComponent implements OnInit {
  @Output() closeAuthRequest = new EventEmitter();
  @Output() openAuthMethod = new EventEmitter();
  @Output() openAuthRepeat = new EventEmitter();
  loadingHeader = 'Processing';
  loadingMessage = 'Please wait a moment.';
  isLoading = false;

  constructor(
    private multiFactorService: MultiFactorService,
    private app: AppState,
    private router: Router,
    private errorService: ErrorStore
  ) {}

  ngOnInit() {}

  toggleAuthRequest(event: Event) {
    this.closeAuthRequest.emit();
    this.app.useMfaModal = false;
  }

  toggleAuthMethod(event: Event) {
    this.closeAuthRequest.emit();
    this.openAuthMethod.emit();
  }

  toggleAuthRepeat(event: Event) {
    this.closeAuthRequest.emit();
    this.openAuthRepeat.emit();
  }

  stopPropagation(event: Event) {
    event.stopPropagation();
  }
}