cordis/client/webapp/elements/member.ts
2021-10-30 12:26:41 -05:00

29 lines
1.2 KiB
TypeScript

import ClientController from "../client-controller";
import { Member } from "../data-types";
import IState from "./require/elements-state";
import ElementsUtil from "./require/elements-util";
import { $, $$, $$$, $$$$ } from './require/q-module';
export default function createMember(state: IState, server: ClientController, member: Member): HTMLElement {
const { document } = state;
$.setDocument(document);
let nameStyle = member.roleColor ? 'color: ' + member.roleColor : '';
let element = $.create({ class: 'member ' + member.status, 'meta-id': member.id, content: [
{ class: 'icon', content: [
{ tag: 'img', class: 'avatar', src: './img/loading.svg', alt: member.displayName },
{ class: 'status-circle' }
] },
{ class: 'text', content: [
{ class: 'name', style: nameStyle, content: member.displayName },
{ class: 'status-text', content: member.status }
] }
] }) as HTMLElement;
(async () => {
($$$(element, 'img.avatar') as HTMLImageElement).src =
await ElementsUtil.getImageBufferFromResourceFailSoftly(server, member.avatarResourceId);
})();
return element;
}