blob: 76b6965662907932a9756f837690bb6c0a9b988f (
plain) (
blame)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
|
import { Component, Input } from '@angular/core'
import { Account } from '../shared-main/account/account.model'
@Component({
selector: 'my-account-avatar',
styleUrls: [ './account-avatar.component.scss' ],
templateUrl: './account-avatar.component.html'
})
export class AccountAvatarComponent {
@Input() account: {
name: string
avatar?: { url?: string, path: string }
url: string
}
@Input() size: '25' | '32' | '34' | '36' | '40' | '120' = '36'
// Use an external link
@Input() href: string
// Use routerLink
@Input() internalHref: string | string[]
@Input() set title (value) {
this._title = value
}
defaultAvatarUrl = Account.GET_DEFAULT_AVATAR_URL()
private _title: string
get title () {
return this._title || $localize`${this.account.name} (account page)`
}
get class () {
return `avatar avatar-${this.size}` + (this.avatarUrl ? '' : ` initial ${this.getColorTheme()}`)
}
get avatarUrl () {
return Account.GET_ACTOR_AVATAR_URL(this.account)
}
get initial () {
return this.account?.name.slice(0, 1)
}
private getColorTheme () {
const themes = {
abc: 'blue',
def: 'green',
ghi: 'purple',
jkl: 'gray',
mno: 'yellow',
pqr: 'orange',
stv: 'red',
wxyz: 'dark-blue'
}
const theme = Object.keys(themes).find(chars => chars.includes(this.initial))
return themes[theme]
}
}
|
