import {Component, OnInit} from '@angular/core';
import {NgForm} from '@angular/forms';
import {ActivatedRoute, Router} from '@angular/router';
import {Article, Role, User} from '../models/models';
import {AuthService} from '../_services/auth-service/auth.service';
import {TokenStorageService} from '../_services/jwt-service/token-storage.service';

@Component({
  selector: 'app-register',
  templateUrl: './register.component.html',
  styleUrls: ['./register.component.scss'],
})
export class RegisterComponent implements OnInit {
  form: any = {};
  // role:String;
  // user: User;
  user = new User(
    0,
    '',
    '',
    '',
    '',
    '',
    new Array<Role>(),
    new Array<Article>(),
    new Array<Article>()
  );
  // user: User;
  roleRequest: string;
  isSuccessful = false;
  isSignUpFailed = false;
  errorMessage = '';
  isLoggedIn = false;
  roles = [
    {
      name: 'ROLE_USER',
      value: 'ROLE_USER',
      checked: false,
    },
    {
      name: 'ROLE_ADMIN',
      value: 'ROLE_ADMIN',
      checked: false,
    },
  ];

  constructor(
    private authService: AuthService,
    private tokenStorage: TokenStorageService,
    private route: ActivatedRoute,
    private router: Router
  ) {
  }

  ngOnInit(): void {
    // if (this.tokenStorage.getUser() !== undefined) {
    //   this.isLoggedIn = true;
    this.roleRequest = this.route.snapshot.params['role'];
    // } else {
    //   this.isLoggedIn = false;
    // }
    console.log('isLoggedIn', this.isLoggedIn);

  }

  onSubmit(): void {
    console.log('before register', this.user);
    if (!this.isAdminRequest()) {
      // this.user.roles = new Array<Role>(new Role("ROLE_USER"));
      this.user.roles.push(new Role('ROLE_USER'));
    }
    this.authService.register(this.user).subscribe(
      (data) => {
        console.log(data);
        this.isSuccessful = true;
        this.isSignUpFailed = false;
        if (this.isAdminRequest()) {
          this.router.navigate(['admin']);
        } else {
          this.router.navigate(['login']);
        }
      },
      (err) => {
        this.errorMessage = err.error.message;
        this.isSignUpFailed = true;
      }
    );
    return;
  }

  updateRole(role: string) {
    // console.log(role);
    // const rolee   = new Role(role);
    // console.log(rolee);
    this.user.roles.push(new Role(role));
  }

  get selectedOptions() {
    return this.roles.filter((opt) => opt.checked).map((opt) => opt.value);
  }

  isAdminRequest() {
    return this.roleRequest === 'ROLE_ADMIN';
  }

  goBackFromRegister() {
    if (this.isAdminRequest()) {
      this.router.navigate(['admin']);
    } else {
      this.router.navigate(['home']);
    }
  }

  goToLogin() {
    this.router.navigate(['/login']);
  }

  logout(): void {
    this.tokenStorage.signOut();
    this.router.navigate(['/register']);
    // window.location.reload();
  }
}