2018-01-30 12:27:07 +00:00
|
|
|
import { Component, ElementRef, OnInit, ViewChild } from '@angular/core'
|
2017-06-16 12:32:15 +00:00
|
|
|
import { FormBuilder, FormGroup, Validators } from '@angular/forms'
|
|
|
|
import { Router } from '@angular/router'
|
2018-01-30 12:27:07 +00:00
|
|
|
import { UserService } from '@app/shared'
|
|
|
|
import { NotificationsService } from 'angular2-notifications'
|
|
|
|
import { ModalDirective } from 'ngx-bootstrap/modal'
|
2017-06-16 12:32:15 +00:00
|
|
|
import { AuthService } from '../core'
|
|
|
|
import { FormReactive } from '../shared'
|
2016-03-22 14:51:54 +00:00
|
|
|
|
|
|
|
@Component({
|
2016-06-01 18:36:27 +00:00
|
|
|
selector: 'my-login',
|
2017-12-05 15:48:26 +00:00
|
|
|
templateUrl: './login.component.html',
|
|
|
|
styleUrls: [ './login.component.scss' ]
|
2016-03-22 14:51:54 +00:00
|
|
|
})
|
|
|
|
|
2016-09-09 20:16:51 +00:00
|
|
|
export class LoginComponent extends FormReactive implements OnInit {
|
2018-01-30 12:27:07 +00:00
|
|
|
@ViewChild('forgotPasswordModal') forgotPasswordModal: ModalDirective
|
|
|
|
@ViewChild('forgotPasswordEmailInput') forgotPasswordEmailInput: ElementRef
|
|
|
|
|
2017-06-16 12:32:15 +00:00
|
|
|
error: string = null
|
2016-09-09 20:16:51 +00:00
|
|
|
|
2017-06-16 12:32:15 +00:00
|
|
|
form: FormGroup
|
2016-09-09 20:16:51 +00:00
|
|
|
formErrors = {
|
|
|
|
'username': '',
|
|
|
|
'password': ''
|
2017-06-16 12:32:15 +00:00
|
|
|
}
|
2016-09-09 20:16:51 +00:00
|
|
|
validationMessages = {
|
|
|
|
'username': {
|
2017-06-16 12:32:15 +00:00
|
|
|
'required': 'Username is required.'
|
2016-09-09 20:16:51 +00:00
|
|
|
},
|
|
|
|
'password': {
|
|
|
|
'required': 'Password is required.'
|
|
|
|
}
|
2017-06-16 12:32:15 +00:00
|
|
|
}
|
2018-01-30 12:27:07 +00:00
|
|
|
forgotPasswordEmail = ''
|
2016-06-04 11:31:23 +00:00
|
|
|
|
2017-06-16 12:32:15 +00:00
|
|
|
constructor (
|
2016-05-27 15:49:18 +00:00
|
|
|
private authService: AuthService,
|
2018-01-30 12:27:07 +00:00
|
|
|
private userService: UserService,
|
|
|
|
private notificationsService: NotificationsService,
|
2016-09-09 20:16:51 +00:00
|
|
|
private formBuilder: FormBuilder,
|
2016-05-27 15:49:18 +00:00
|
|
|
private router: Router
|
2016-09-09 20:16:51 +00:00
|
|
|
) {
|
2017-06-16 12:32:15 +00:00
|
|
|
super()
|
2016-09-09 20:16:51 +00:00
|
|
|
}
|
2016-03-22 14:51:54 +00:00
|
|
|
|
2017-06-16 12:32:15 +00:00
|
|
|
buildForm () {
|
2016-09-09 20:16:51 +00:00
|
|
|
this.form = this.formBuilder.group({
|
|
|
|
username: [ '', Validators.required ],
|
2017-06-16 12:32:15 +00:00
|
|
|
password: [ '', Validators.required ]
|
|
|
|
})
|
2016-09-09 20:16:51 +00:00
|
|
|
|
2017-06-16 12:32:15 +00:00
|
|
|
this.form.valueChanges.subscribe(data => this.onValueChanged(data))
|
2016-09-09 20:16:51 +00:00
|
|
|
}
|
|
|
|
|
2017-06-16 12:32:15 +00:00
|
|
|
ngOnInit () {
|
|
|
|
this.buildForm()
|
2016-08-23 12:37:49 +00:00
|
|
|
}
|
|
|
|
|
2017-06-16 12:32:15 +00:00
|
|
|
login () {
|
|
|
|
this.error = null
|
2016-09-09 20:16:51 +00:00
|
|
|
|
2017-06-16 12:32:15 +00:00
|
|
|
const { username, password } = this.form.value
|
2016-09-09 20:16:51 +00:00
|
|
|
|
|
|
|
this.authService.login(username, password).subscribe(
|
2017-12-29 08:22:23 +00:00
|
|
|
() => this.router.navigate(['/videos/list']),
|
2016-06-04 11:31:23 +00:00
|
|
|
|
2017-12-29 08:22:23 +00:00
|
|
|
err => this.error = err.message
|
2017-06-16 12:32:15 +00:00
|
|
|
)
|
2016-03-22 14:51:54 +00:00
|
|
|
}
|
2018-01-30 12:27:07 +00:00
|
|
|
|
|
|
|
askResetPassword () {
|
|
|
|
this.userService.askResetPassword(this.forgotPasswordEmail)
|
|
|
|
.subscribe(
|
|
|
|
res => {
|
|
|
|
const message = `An email with the reset password instructions will be sent to ${this.forgotPasswordEmail}.`
|
|
|
|
this.notificationsService.success('Success', message)
|
|
|
|
this.hideForgotPasswordModal()
|
|
|
|
},
|
|
|
|
|
|
|
|
err => this.notificationsService.error('Error', err.message)
|
|
|
|
)
|
|
|
|
}
|
|
|
|
|
|
|
|
onForgotPasswordModalShown () {
|
|
|
|
this.forgotPasswordEmailInput.nativeElement.focus()
|
|
|
|
}
|
|
|
|
|
|
|
|
openForgotPasswordModal () {
|
|
|
|
this.forgotPasswordModal.show()
|
|
|
|
}
|
|
|
|
|
|
|
|
hideForgotPasswordModal () {
|
|
|
|
this.forgotPasswordModal.hide()
|
|
|
|
}
|
2016-03-22 14:51:54 +00:00
|
|
|
}
|