client/src/app/+signup/+register/register-step-channel.component.ts

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