diff options
Diffstat (limited to 'client/src/app/+signup/+register/register-step-channel.component.ts')
-rw-r--r-- | client/src/app/+signup/+register/register-step-channel.component.ts | 56 |
1 files changed, 56 insertions, 0 deletions
diff --git a/client/src/app/+signup/+register/register-step-channel.component.ts b/client/src/app/+signup/+register/register-step-channel.component.ts new file mode 100644 index 000000000..e434b91a7 --- /dev/null +++ b/client/src/app/+signup/+register/register-step-channel.component.ts | |||
@@ -0,0 +1,56 @@ | |||
1 | import { Component, EventEmitter, Input, OnInit, Output } from '@angular/core' | ||
2 | import { AuthService } from '@app/core' | ||
3 | import { FormReactive, UserService, VideoChannelValidatorsService } from '@app/shared' | ||
4 | import { FormValidatorService } from '@app/shared/forms/form-validators/form-validator.service' | ||
5 | import { FormGroup } from '@angular/forms' | ||
6 | import { pairwise } from 'rxjs/operators' | ||
7 | import { concat, of } from 'rxjs' | ||
8 | |||
9 | @Component({ | ||
10 | selector: 'my-register-step-channel', | ||
11 | templateUrl: './register-step-channel.component.html', | ||
12 | styleUrls: [ './register.component.scss' ] | ||
13 | }) | ||
14 | export class RegisterStepChannelComponent extends FormReactive implements OnInit { | ||
15 | @Input() username: string | ||
16 | @Output() formBuilt = new EventEmitter<FormGroup>() | ||
17 | |||
18 | constructor ( | ||
19 | protected formValidatorService: FormValidatorService, | ||
20 | private authService: AuthService, | ||
21 | private userService: UserService, | ||
22 | private videoChannelValidatorsService: VideoChannelValidatorsService | ||
23 | ) { | ||
24 | super() | ||
25 | } | ||
26 | |||
27 | get instanceHost () { | ||
28 | return window.location.host | ||
29 | } | ||
30 | |||
31 | ngOnInit () { | ||
32 | this.buildForm({ | ||
33 | displayName: this.videoChannelValidatorsService.VIDEO_CHANNEL_DISPLAY_NAME, | ||
34 | name: this.videoChannelValidatorsService.VIDEO_CHANNEL_NAME | ||
35 | }) | ||
36 | |||
37 | setTimeout(() => this.formBuilt.emit(this.form)) | ||
38 | |||
39 | concat( | ||
40 | of(''), | ||
41 | this.form.get('displayName').valueChanges | ||
42 | ).pipe(pairwise()) | ||
43 | .subscribe(([ oldValue, newValue ]) => this.onDisplayNameChange(oldValue, newValue)) | ||
44 | } | ||
45 | |||
46 | isSameThanUsername () { | ||
47 | return this.username && this.username === this.form.value['name'] | ||
48 | } | ||
49 | |||
50 | private onDisplayNameChange (oldDisplayName: string, newDisplayName: string) { | ||
51 | const name = this.form.value['name'] || '' | ||
52 | |||
53 | const newName = this.userService.getNewUsername(oldDisplayName, newDisplayName, name) | ||
54 | this.form.patchValue({ name: newName }) | ||
55 | } | ||
56 | } | ||