]> git.immae.eu Git - github/Chocobozzz/PeerTube.git/blame - client/src/app/shared/shared-actor-image-edit/actor-avatar-edit.component.ts
Add Podcast RSS feeds (#5487)
[github/Chocobozzz/PeerTube.git] / client / src / app / shared / shared-actor-image-edit / actor-avatar-edit.component.ts
CommitLineData
cdeddff1 1import { Component, ElementRef, EventEmitter, Input, OnInit, Output, ViewChild } from '@angular/core'
67ed6552 2import { Notifier, ServerService } from '@app/core'
cdeddff1 3import { Account, VideoChannel } from '@app/shared/shared-main'
b4c3c51d 4import { getBytes } from '@root-helpers/bytes'
0ea2f79d 5import { imageToDataURL } from '@root-helpers/images'
52d9f792
C
6
7@Component({
cdeddff1
C
8 selector: 'my-actor-avatar-edit',
9 templateUrl: './actor-avatar-edit.component.html',
10 styleUrls: [
11 './actor-image-edit.scss',
12 './actor-avatar-edit.component.scss'
13 ]
52d9f792 14})
cdeddff1 15export class ActorAvatarEditComponent implements OnInit {
2f5d2ec5 16 @ViewChild('avatarfileInput') avatarfileInput: ElementRef<HTMLInputElement>
52d9f792
C
17
18 @Input() actor: VideoChannel | Account
cdeddff1
C
19 @Input() editable = true
20 @Input() displaySubscribers = true
21 @Input() displayUsername = true
27ec473f 22 @Input() previewImage = false
52d9f792
C
23
24 @Output() avatarChange = new EventEmitter<FormData>()
1ea7da81 25 @Output() avatarDelete = new EventEmitter<void>()
52d9f792 26
0e4ca570
C
27 avatarFormat = ''
28 maxAvatarSize = 0
29 avatarExtensions = ''
30
0ea2f79d 31 preview: string
27ec473f 32
52d9f792 33 constructor (
52d9f792 34 private serverService: ServerService,
66357162 35 private notifier: Notifier
123f6193 36 ) { }
52d9f792 37
ba430d75 38 ngOnInit (): void {
2989628b
C
39 const config = this.serverService.getHTMLConfig()
40
41 this.maxAvatarSize = config.avatar.file.size.max
42 this.avatarExtensions = config.avatar.file.extensions.join(', ')
43
44 this.avatarFormat = `${$localize`max size`}: 192*192px, ` +
45 `${getBytes(this.maxAvatarSize)} ${$localize`extensions`}: ${this.avatarExtensions}`
ba430d75
C
46 }
47
1ea7da81
RK
48 onAvatarChange (input: HTMLInputElement) {
49 this.avatarfileInput = new ElementRef(input)
50
9df52d66 51 const avatarfile = this.avatarfileInput.nativeElement.files[0]
52d9f792 52 if (avatarfile.size > this.maxAvatarSize) {
1ea7da81 53 this.notifier.error('Error', $localize`This image is too large.`)
52d9f792
C
54 return
55 }
56
57 const formData = new FormData()
58 formData.append('avatarfile', avatarfile)
52d9f792 59 this.avatarChange.emit(formData)
27ec473f
C
60
61 if (this.previewImage) {
0ea2f79d 62 imageToDataURL(avatarfile).then(result => this.preview = result)
27ec473f 63 }
52d9f792
C
64 }
65
1ea7da81 66 deleteAvatar () {
27ec473f 67 this.preview = undefined
1ea7da81
RK
68 this.avatarDelete.emit()
69 }
70
0e4ca570 71 hasAvatar () {
d0800f76 72 return !!this.preview || this.actor.avatars.length !== 0
1ea7da81 73 }
deb8b9cd 74
87fdea2f
C
75 getActorType () {
76 if ((this.actor as VideoChannel).ownerAccount) return 'channel'
746018f6 77
87fdea2f 78 return 'account'
746018f6 79 }
52d9f792 80}