29 lines
1.2 KiB
TypeScript
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;
|
||
|
|
}
|