import { Component, OnInit, Output, EventEmitter, Input } from '@angular/core';
import { ActivatedRoute, Router } from '@angular/router';
import { FormGroup, FormBuilder, Validators } from '@angular/forms';
import { Store, select } from '@ngrx/store';
import { Member } from '@overflow/commons-typescript/model/member';

@Component({
  selector: 'of-member-signin',
  templateUrl: './member-signin.component.html',
})
export class MemberSigninComponent implements OnInit {
  @Input() member: Member;
  @Input() signinError: string;
  @Output() resetPassword = new EventEmitter();
  @Output() signup = new EventEmitter();
  @Output() signin = new EventEmitter<{email: string, password: string}>();

  errorMessage: string | null;

  signinForm: FormGroup;
  formErrors = {
    'email': '',
    'password': ''
  };

  constructor(
    private formBuilder: FormBuilder,
  ) {
  }

  ngOnInit() {
    this.initForm();
  }

  initForm() {
    this.signinForm = this.formBuilder.group({
      'email': [
        '',
        [
          Validators.required,
          Validators.email
        ]
      ],
      'password': [
        '',
        [
          Validators.pattern('^(?=.*[0-9])(?=.*[a-zA-Z])([a-zA-Z0-9]+)$'),
          Validators.minLength(6),
          Validators.maxLength(25)
        ]
      ],
    });
  }

  signinFormSubmit() {
    const formValue = Object.assign({}, this.signinForm.value);
    this.signin.emit(formValue);
  }

}