mystiq/hydrogen-web
Archived
4
1
Fork 1
Code Issues Pull requests Projects Releases Packages Wiki Activity

Pass color as data attribute

Browse source 
Signed-off-by: RMidhunSuresh <rmidhunsuresh@gmail.com>
This commit is contained in:
RMidhunSuresh 2021-07-01 15:25:28 +05:30
parent 9ed6cd57f3
commit 03a913629f
1 changed files with 4 additions and 2 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

6
src/platform/web/ui/avatar.js
View file

@ -25,13 +25,13 @@ export function renderStaticAvatar(vm, size, extraClasses = undefined) {
let avatarClasses = classNames({ let avatarClasses = classNames({
avatar: true, avatar: true,
[`size-${size}`]: true, [`size-${size}`]: true,
[`usercolor${vm.avatarColorNumber}`]: true [`usercolor${vm.avatarColorNumber}`]: !hasAvatar
}); });
if (extraClasses) { if (extraClasses) {
avatarClasses += ` ${extraClasses}`; avatarClasses += ` ${extraClasses}`;
} }
const avatarContent = hasAvatar ? renderImg(vm, size) : text(vm.avatarLetter); const avatarContent = hasAvatar ? renderImg(vm, size) : text(vm.avatarLetter);
return tag.div({className: avatarClasses, 'data-avatar-letter': vm.avatarLetter}, [avatarContent]); return tag.div({className: avatarClasses, 'data-avatar-letter': vm.avatarLetter, 'data-avatar-color': vm.avatarColorNumber}, [avatarContent]);
} }
export function renderImg(vm, size) { export function renderImg(vm, size) {
@ -48,6 +48,8 @@ function isAvatarEvent(e) {
export function handleAvatarError(e) { export function handleAvatarError(e) {
if (!isAvatarEvent(e)) { return; } if (!isAvatarEvent(e)) { return; }
const parent = e.target.parentElement; const parent = e.target.parentElement;
const avatarColorNumber = parent.getAttribute("data-avatar-color");
parent.classList.add(`usercolor${avatarColorNumber}`);
const avatarLetter = parent.getAttribute("data-avatar-letter"); const avatarLetter = parent.getAttribute("data-avatar-letter");
parent.textContent = avatarLetter; parent.textContent = avatarLetter;
} }