-import { Component, Input, OnChanges } from '@angular/core'
+import { Component, Input, OnChanges, OnInit } from '@angular/core'
import { VideoChannel } from '../shared-main'
import { Account } from '../shared-main/account/account.model'
styleUrls: [ './actor-avatar.component.scss' ],
templateUrl: './actor-avatar.component.html'
})
-export class ActorAvatarComponent implements OnChanges {
+export class ActorAvatarComponent implements OnInit, OnChanges {
private _title: string
@Input() actor: ActorInput
}
classes: string[] = []
+ defaultAvatarUrl: string
+ avatarUrl: string
- get alt () {
- if (this.isAccount()) return $localize`Account avatar`
- if (this.isChannel()) return $localize`Channel avatar`
+ ngOnInit () {
+ this.buildDefaultAvatarUrl()
- return ''
+ this.buildAvatarUrl()
+ this.buildClasses()
}
- get defaultAvatarUrl () {
- if (this.isChannel()) return VideoChannel.GET_DEFAULT_AVATAR_URL(this.getSizeNumber())
-
- // account or unlogged
- return Account.GET_DEFAULT_AVATAR_URL(this.getSizeNumber())
- }
-
- get avatarUrl () {
- if (!this.actor) return ''
-
- if (this.isAccount()) return Account.GET_ACTOR_AVATAR_URL(this.actor, this.getSizeNumber())
- if (this.isChannel()) return VideoChannel.GET_ACTOR_AVATAR_URL(this.actor, this.getSizeNumber())
-
- return ''
+ ngOnChanges () {
+ this.buildAvatarUrl()
+ this.buildClasses()
}
- ngOnChanges () {
+ private buildClasses () {
this.classes = [ 'avatar' ]
if (this.size) {
}
}
+ private buildDefaultAvatarUrl () {
+ this.defaultAvatarUrl = this.isChannel()
+ ? VideoChannel.GET_DEFAULT_AVATAR_URL(this.getSizeNumber())
+ : Account.GET_DEFAULT_AVATAR_URL(this.getSizeNumber())
+ }
+
+ private buildAvatarUrl () {
+ if (!this.actor) {
+ this.avatarUrl = ''
+ return
+ }
+
+ if (this.isAccount()) {
+ this.avatarUrl = Account.GET_ACTOR_AVATAR_URL(this.actor, this.getSizeNumber())
+ return
+ }
+
+ if (this.isChannel()) {
+ this.avatarUrl = VideoChannel.GET_ACTOR_AVATAR_URL(this.actor, this.getSizeNumber())
+ return
+ }
+
+ this.avatarUrl = ''
+ }
+
displayImage () {
if (this.actorType === 'unlogged') return true
+ if (this.previewImage) return true
return !!(this.actor && this.avatarUrl)
}
displayActorInitial () {
- return this.actor && !this.avatarUrl
+ return !this.displayImage() && this.actor && !this.avatarUrl
}
displayPlaceholder () {
// Keep consistency with CSS
const themes = {
'0123456789abc': 'blue',
- def: 'green',
- ghi: 'purple',
- jkl: 'gray',
- mno: 'yellow',
- pqr: 'orange',
- stvu: 'red',
- wxyz: 'dark-blue'
+ 'def': 'green',
+ 'ghi': 'purple',
+ 'jkl': 'gray',
+ 'mno': 'yellow',
+ 'pqr': 'orange',
+ 'stvu': 'red',
+ 'wxyz': 'dark-blue'
}
const theme = Object.keys(themes)
.find(chars => chars.includes(initialLowercase))
- return themes[theme]
+ return themes[theme] || 'blue'
}
}