Create method to add sidebar element
Signed-off-by: RMidhunSuresh <rmidhunsuresh@gmail.com>
This commit is contained in:
parent
a23e2c361a
commit
0a4f8aff79
1 changed files with 17 additions and 3 deletions
|
@ -1,15 +1,29 @@
|
||||||
import { TemplateView } from "../../general/TemplateView.js";
|
import { TemplateView } from "../../general/TemplateView.js";
|
||||||
import { text } from "../../general/html.js";
|
import { text, classNames, tag } from "../../general/html.js";
|
||||||
import { AvatarView } from "../../avatar.js";
|
import { AvatarView } from "../../avatar.js";
|
||||||
|
|
||||||
export class RoomInfoView extends TemplateView {
|
export class RoomInfoView extends TemplateView {
|
||||||
|
|
||||||
render(t, vm) {
|
render(t, vm) {
|
||||||
|
const encryptionString = vm.isEncrypted ? "On" : "Off";
|
||||||
return t.div({ className: "RoomInfo" }, [
|
return t.div({ className: "RoomInfo" }, [
|
||||||
t.div({ className: "RoomAvatar" }, [t.view(new AvatarView(vm, 128))]),
|
t.div({ className: "RoomAvatar" }, [t.view(new AvatarView(vm, 128))]),
|
||||||
t.div({ className: "RoomName" }, [t.h2(vm.name)]),
|
t.div({ className: "RoomName" }, [t.h2(vm.name)]),
|
||||||
|
|
||||||
t.div({ className: "RoomId" }, [text(vm.roomId)]),
|
t.div({ className: "RoomId" }, [text(vm.roomId)]),
|
||||||
t.div({ className: "RoomMemberCount" }, [text(vm.memberCount)]),
|
|
||||||
t.div({ className: "RoomEncryption" }, [vm.isEncrypted ? "Encrypted" : "Not Encrypted"])
|
this._createSideBarRow("People", vm.memberCount, { MemberCount: true }),
|
||||||
|
|
||||||
|
this._createSideBarRow("Encryption", encryptionString, { EncryptionStatus: true })
|
||||||
|
]);
|
||||||
|
}
|
||||||
|
|
||||||
|
_createSideBarRow(label, value, labelClass, valueClass) {
|
||||||
|
const labelClassString = classNames({ SidebarLabel: true, ...labelClass });
|
||||||
|
const valueClassString = classNames({ SidebarValue: true, ...valueClass });
|
||||||
|
return tag.div({ className: "SidebarRow" }, [
|
||||||
|
tag.div({ className: labelClassString }, [text(label)]),
|
||||||
|
tag.div({ className: valueClassString }, [text(value)])
|
||||||
]);
|
]);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
Reference in a new issue