37 lines
1.3 KiB
JavaScript
37 lines
1.3 KiB
JavaScript
class Avatar extends Shadow {
|
|
constructor(person, size) {
|
|
super()
|
|
this.person = person
|
|
this.size = size
|
|
}
|
|
|
|
render() {
|
|
const { person, size } = this
|
|
if (person.image_path) {
|
|
img(`${config.SERVER}${person.image_path}`, `${size}em`, `${size}em`)
|
|
.borderRadius(50, pct)
|
|
.objectFit("cover")
|
|
.flexShrink(0)
|
|
} else {
|
|
const initials = [person.first_name?.[0], person.last_name?.[0]].filter(Boolean).join("").toUpperCase()
|
|
VStack(() => {
|
|
p(initials)
|
|
.margin(0).fontSize(size * 0.35, em).fontWeight("700")
|
|
.color("white").lineHeight("1")
|
|
})
|
|
.width(size, em).height(size, em).borderRadius(50, pct)
|
|
.background(this.avatarColor(`${person.first_name} ${person.last_name}`))
|
|
.justifyContent("center").alignItems("center").flexShrink(0)
|
|
}
|
|
}
|
|
|
|
avatarColor(name) {
|
|
const colors = ["#3b82f6", "#ef4444", "#10b981", "#f59e0b", "#8b5cf6", "#ec4899", "#06b6d4", "#84cc16"]
|
|
let hash = 0
|
|
for (let i = 0; i < (name || "").length; i++) hash = name.charCodeAt(i) + ((hash << 5) - hash)
|
|
return colors[Math.abs(hash) % colors.length]
|
|
}
|
|
}
|
|
|
|
register(Avatar)
|