client/src/app/shared/shared-main/account/actor-avatar-info.component.ts

   1 import { Component, ElementRef, EventEmitter, Input, OnInit, Output, ViewChild } from '@angular/core'
   2 import { Notifier, ServerService } from '@app/core'
   3 import { Account, BytesPipe, VideoChannel } from '@app/shared/shared-main'
   4 import { I18n } from '@ngx-translate/i18n-polyfill'
   5 import { ServerConfig } from '@shared/models'
   6
   7 @Component({
   8   selector: 'my-actor-avatar-info',
   9   templateUrl: './actor-avatar-info.component.html',
  10   styleUrls: [ './actor-avatar-info.component.scss' ]
  11 })
  12 export class ActorAvatarInfoComponent implements OnInit {
  13   @ViewChild('avatarfileInput') avatarfileInput: ElementRef<HTMLInputElement>
  14
  15   @Input() actor: VideoChannel | Account
  16
  17   @Output() avatarChange = new EventEmitter<FormData>()
  18
  19   maxSizeText: string
  20
  21   private serverConfig: ServerConfig
  22   private bytesPipe: BytesPipe
  23
  24   constructor (
  25     private serverService: ServerService,
  26     private notifier: Notifier,
  27     private i18n: I18n
  28   ) {
  29     this.bytesPipe = new BytesPipe()
  30     this.maxSizeText = this.i18n('max size')
  31   }
  32
  33   ngOnInit (): void {
  34     this.serverConfig = this.serverService.getTmpConfig()
  35     this.serverService.getConfig()
  36         .subscribe(config => this.serverConfig = config)
  37   }
  38
  39   onAvatarChange () {
  40     const avatarfile = this.avatarfileInput.nativeElement.files[ 0 ]
  41     if (avatarfile.size > this.maxAvatarSize) {
  42       this.notifier.error('Error', 'This image is too large.')
  43       return
  44     }
  45
  46     const formData = new FormData()
  47     formData.append('avatarfile', avatarfile)
  48
  49     this.avatarChange.emit(formData)
  50   }
  51
  52   get maxAvatarSize () {
  53     return this.serverConfig.avatar.file.size.max
  54   }
  55
  56   get maxAvatarSizeInBytes () {
  57     return this.bytesPipe.transform(this.maxAvatarSize)
  58   }
  59
  60   get avatarExtensions () {
  61     return this.serverConfig.avatar.file.extensions.join(', ')
  62   }
  63 }