From 0a4f8aff7961a5ca2b1ffa70e555d7c0d51b7026 Mon Sep 17 00:00:00 2001 From: RMidhunSuresh Date: Wed, 26 May 2021 15:36:29 +0530 Subject: [PATCH] Create method to add sidebar element Signed-off-by: RMidhunSuresh --- .../web/ui/session/rightpanel/RoomInfoView.js | 20 ++++++++++++++++--- 1 file changed, 17 insertions(+), 3 deletions(-) diff --git a/src/platform/web/ui/session/rightpanel/RoomInfoView.js b/src/platform/web/ui/session/rightpanel/RoomInfoView.js index f591e0c1..ef70762d 100644 --- a/src/platform/web/ui/session/rightpanel/RoomInfoView.js +++ b/src/platform/web/ui/session/rightpanel/RoomInfoView.js @@ -1,15 +1,29 @@ 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"; export class RoomInfoView extends TemplateView { + render(t, vm) { + const encryptionString = vm.isEncrypted ? "On" : "Off"; return t.div({ className: "RoomInfo" }, [ t.div({ className: "RoomAvatar" }, [t.view(new AvatarView(vm, 128))]), t.div({ className: "RoomName" }, [t.h2(vm.name)]), + 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)]) ]); } }