]>
Commit | Line | Data |
---|---|---|
ecb4e35f | 1 | import { Component, ElementRef, OnInit, ViewChild } from '@angular/core' |
df98563e C |
2 | import { FormBuilder, FormGroup, Validators } from '@angular/forms' |
3 | import { Router } from '@angular/router' | |
ecb4e35f C |
4 | import { UserService } from '@app/shared' |
5 | import { NotificationsService } from 'angular2-notifications' | |
6 | import { ModalDirective } from 'ngx-bootstrap/modal' | |
df98563e C |
7 | import { AuthService } from '../core' |
8 | import { FormReactive } from '../shared' | |
b1794c53 C |
9 | |
10 | @Component({ | |
a840d396 | 11 | selector: 'my-login', |
d235f6b0 C |
12 | templateUrl: './login.component.html', |
13 | styleUrls: [ './login.component.scss' ] | |
b1794c53 C |
14 | }) |
15 | ||
4b2f33f3 | 16 | export class LoginComponent extends FormReactive implements OnInit { |
ecb4e35f C |
17 | @ViewChild('forgotPasswordModal') forgotPasswordModal: ModalDirective |
18 | @ViewChild('forgotPasswordEmailInput') forgotPasswordEmailInput: ElementRef | |
19 | ||
df98563e | 20 | error: string = null |
4b2f33f3 | 21 | |
df98563e | 22 | form: FormGroup |
4b2f33f3 C |
23 | formErrors = { |
24 | 'username': '', | |
25 | 'password': '' | |
df98563e | 26 | } |
4b2f33f3 C |
27 | validationMessages = { |
28 | 'username': { | |
df98563e | 29 | 'required': 'Username is required.' |
4b2f33f3 C |
30 | }, |
31 | 'password': { | |
32 | 'required': 'Password is required.' | |
33 | } | |
df98563e | 34 | } |
ecb4e35f | 35 | forgotPasswordEmail = '' |
192ea60b | 36 | |
df98563e | 37 | constructor ( |
4fd8aa32 | 38 | private authService: AuthService, |
ecb4e35f C |
39 | private userService: UserService, |
40 | private notificationsService: NotificationsService, | |
4b2f33f3 | 41 | private formBuilder: FormBuilder, |
4fd8aa32 | 42 | private router: Router |
4b2f33f3 | 43 | ) { |
df98563e | 44 | super() |
4b2f33f3 | 45 | } |
b1794c53 | 46 | |
df98563e | 47 | buildForm () { |
4b2f33f3 C |
48 | this.form = this.formBuilder.group({ |
49 | username: [ '', Validators.required ], | |
df98563e C |
50 | password: [ '', Validators.required ] |
51 | }) | |
4b2f33f3 | 52 | |
df98563e | 53 | this.form.valueChanges.subscribe(data => this.onValueChanged(data)) |
4b2f33f3 C |
54 | } |
55 | ||
df98563e C |
56 | ngOnInit () { |
57 | this.buildForm() | |
0f6da32b C |
58 | } |
59 | ||
df98563e C |
60 | login () { |
61 | this.error = null | |
4b2f33f3 | 62 | |
df98563e | 63 | const { username, password } = this.form.value |
4b2f33f3 C |
64 | |
65 | this.authService.login(username, password).subscribe( | |
80f8e364 | 66 | () => this.router.navigate(['/videos/list']), |
192ea60b | 67 | |
80f8e364 | 68 | err => this.error = err.message |
df98563e | 69 | ) |
b1794c53 | 70 | } |
ecb4e35f C |
71 | |
72 | askResetPassword () { | |
73 | this.userService.askResetPassword(this.forgotPasswordEmail) | |
74 | .subscribe( | |
75 | res => { | |
76 | const message = `An email with the reset password instructions will be sent to ${this.forgotPasswordEmail}.` | |
77 | this.notificationsService.success('Success', message) | |
78 | this.hideForgotPasswordModal() | |
79 | }, | |
80 | ||
81 | err => this.notificationsService.error('Error', err.message) | |
82 | ) | |
83 | } | |
84 | ||
85 | onForgotPasswordModalShown () { | |
86 | this.forgotPasswordEmailInput.nativeElement.focus() | |
87 | } | |
88 | ||
89 | openForgotPasswordModal () { | |
90 | this.forgotPasswordModal.show() | |
91 | } | |
92 | ||
93 | hideForgotPasswordModal () { | |
94 | this.forgotPasswordModal.hide() | |
95 | } | |
b1794c53 | 96 | } |