mirror of
https://github.com/vector-im/hydrogen-web.git
synced 2024-12-24 12:04:57 +01:00
Update on changes to vm
Signed-off-by: RMidhunSuresh <rmidhunsuresh@gmail.com>
This commit is contained in:
parent
008f3601ca
commit
efd37d811f
@ -5,6 +5,7 @@ export class RoomInfoViewModel extends ViewModel {
|
|||||||
constructor(options) {
|
constructor(options) {
|
||||||
super(options);
|
super(options);
|
||||||
this._room = options.room;
|
this._room = options.room;
|
||||||
|
this._room.on("change", () => this.emitChange());
|
||||||
}
|
}
|
||||||
|
|
||||||
get roomId() {
|
get roomId() {
|
||||||
|
@ -5,18 +5,20 @@ 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 ? vm.i18n`On` : vm.i18n`Off`;
|
const encryptionString = () => vm.isEncrypted ? vm.i18n`On` : vm.i18n`Off`;
|
||||||
|
|
||||||
return t.div({ className: "RoomInfo" }, [
|
return t.div({ className: "RoomInfo" }, [
|
||||||
this._createButton(t, vm),
|
this._createButton(t, vm),
|
||||||
t.div({ className: "RoomAvatar" },
|
t.div({ className: "RoomAvatar" },
|
||||||
[t.view(new AvatarView(vm, 52)), this._createEncryptionIcon(vm.isEncrypted)]),
|
[
|
||||||
t.div({ className: "RoomName" }, [t.h2(vm.name)]),
|
t.view(new AvatarView(vm, 52)),
|
||||||
|
t.mapView(vm => vm.isEncrypted, isEncrypted => new EncryptionAvatarView(isEncrypted))
|
||||||
|
]),
|
||||||
|
t.div({ className: "RoomName" }, [t.h2(vm => vm.name)]),
|
||||||
this._createRoomAliasDisplay(vm),
|
this._createRoomAliasDisplay(vm),
|
||||||
t.div({ className: "SidebarRow_collection" },
|
t.div({ className: "SidebarRow_collection" },
|
||||||
[
|
[
|
||||||
this._createSideBarRow(vm.i18n`People`, vm.memberCount, { MemberCount: true }),
|
this._createSideBarRow(t, vm.i18n`People`, vm => vm.memberCount, { MemberCount: true }),
|
||||||
this._createSideBarRow(vm.i18n`Encryption`, encryptionString, { EncryptionStatus: true })
|
this._createSideBarRow(t, vm.i18n`Encryption`, encryptionString, { EncryptionStatus: true })
|
||||||
])
|
])
|
||||||
]);
|
]);
|
||||||
}
|
}
|
||||||
@ -26,20 +28,15 @@ export class RoomInfoView extends TemplateView {
|
|||||||
"";
|
"";
|
||||||
}
|
}
|
||||||
|
|
||||||
_createSideBarRow(label, value, labelClass, valueClass) {
|
_createSideBarRow(t, label, value, labelClass, valueClass) {
|
||||||
const labelClassString = classNames({ SidebarLabel: true, ...labelClass });
|
const labelClassString = classNames({ SidebarLabel: true, ...labelClass });
|
||||||
const valueClassString = classNames({ SidebarValue: true, ...valueClass });
|
const valueClassString = classNames({ SidebarValue: true, ...valueClass });
|
||||||
return tag.div({ className: "SidebarRow" }, [
|
return t.div({ className: "SidebarRow" }, [
|
||||||
tag.div({ className: labelClassString }, [text(label)]),
|
t.div({ className: labelClassString }, [text(label)]),
|
||||||
tag.div({ className: valueClassString }, [text(value)])
|
t.div({ className: valueClassString }, value)
|
||||||
]);
|
]);
|
||||||
}
|
}
|
||||||
|
|
||||||
_createEncryptionIcon(isEncrypted) {
|
|
||||||
return tag.div({ className: "RoomEncryption" },
|
|
||||||
[tag.div({ className: isEncrypted ? "encrypted" : "unencrypted" })])
|
|
||||||
}
|
|
||||||
|
|
||||||
_createButton(t, vm) {
|
_createButton(t, vm) {
|
||||||
return t.div({ className: "buttons" },
|
return t.div({ className: "buttons" },
|
||||||
[
|
[
|
||||||
@ -47,3 +44,10 @@ export class RoomInfoView extends TemplateView {
|
|||||||
]);
|
]);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
class EncryptionAvatarView extends TemplateView{
|
||||||
|
render(t, isEncrypted) {
|
||||||
|
return t.div({ className: "RoomEncryption" },
|
||||||
|
[t.div({ className: isEncrypted ? "encrypted" : "unencrypted" })]);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
Loading…
Reference in New Issue
Block a user