mystiq/hydrogen-web
Archived
4
1
Fork 1
Code Issues Pull requests Projects Releases Packages Wiki Activity

Make formatting consistent with the codebase

Browse source 
Signed-off-by: RMidhunSuresh <rmidhunsuresh@gmail.com>
This commit is contained in:
RMidhunSuresh 2021-06-07 15:33:55 +05:30
parent 0c5d118bfd
commit b2f2d51594
1 changed files with 18 additions and 19 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

37
src/platform/web/ui/session/rightpanel/RoomDetailsView.js
View file

@ -1,52 +1,51 @@
import { TemplateView } from "../../general/TemplateView.js"; import {TemplateView} from "../../general/TemplateView.js";
import { text, classNames, tag } from "../../general/html.js"; import {text, classNames, tag} from "../../general/html.js";
import { AvatarView } from "../../avatar.js"; import {AvatarView} from "../../avatar.js";
export class RoomDetailsView extends TemplateView { export class RoomDetailsView 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: "RoomDetailsView" }, [ return t.div({className: "RoomDetailsView"}, [
this._createButton(t, vm), this._createButton(t, vm),
t.div({ className: "RoomDetailsView_avatar" }, t.div({className: "RoomDetailsView_avatar"},
[ [
t.view(new AvatarView(vm, 52)), t.view(new AvatarView(vm, 52)),
t.mapView(vm => vm.isEncrypted, isEncrypted => new EncryptionIconView(isEncrypted)) t.mapView(vm => vm.isEncrypted, isEncrypted => new EncryptionIconView(isEncrypted))
]), ]),
t.div({ className: "RoomDetailsView_name" }, [t.h2(vm => vm.name)]), t.div({className: "RoomDetailsView_name"}, [t.h2(vm => vm.name)]),
this._createRoomAliasDisplay(vm), this._createRoomAliasDisplay(vm),
t.div({ className: "RoomDetailsView_rows" }, t.div({className: "RoomDetailsView_rows"},
[ [
this._createRightPanelRow(t, vm.i18n`People`, { MemberCount: true }, vm => vm.memberCount), this._createRightPanelRow(t, vm.i18n`People`, {MemberCount: true}, vm => vm.memberCount),
this._createRightPanelRow(t, vm.i18n`Encryption`, { EncryptionStatus: true }, encryptionString) this._createRightPanelRow(t, vm.i18n`Encryption`, {EncryptionStatus: true}, encryptionString)
]) ])
]); ]);
} }
_createRoomAliasDisplay(vm) { _createRoomAliasDisplay(vm) {
return vm.canonicalAlias ? tag.div({ className: "RoomDetailsView_id" }, [text(vm.canonicalAlias)]) : return vm.canonicalAlias ? tag.div({className: "RoomDetailsView_id"}, [text(vm.canonicalAlias)]) :
""; "";
} }
_createRightPanelRow(t, label, labelClass, value) { _createRightPanelRow(t, label, labelClass, value) {
const labelClassString = classNames({ RoomDetailsView_label: true, ...labelClass }); const labelClassString = classNames({RoomDetailsView_label: true, ...labelClass});
return t.div({ className: "RoomDetailsView_row" }, [ return t.div({className: "RoomDetailsView_row"}, [
t.div({ className: labelClassString }, [text(label)]), t.div({className: labelClassString}, [text(label)]),
t.div({ className: "RoomDetailsView_value" }, value) t.div({className: "RoomDetailsView_value"}, value)
]); ]);
} }
_createButton(t, vm) { _createButton(t, vm) {
return t.div({ className: "RoomDetailsView_buttons" }, return t.div({className: "RoomDetailsView_buttons"},
[ [
t.button({ className: "close button-utility", onClick: () => vm.closePanel() }) t.button({className: "close button-utility", onClick: () => vm.closePanel()})
]); ]);
} }
} }
class EncryptionIconView extends TemplateView { class EncryptionIconView extends TemplateView {
render(t, isEncrypted) { render(t, isEncrypted) {
return t.div({ className: "EncryptionIconView" }, return t.div({className: "EncryptionIconView"},
[t.div({ className: isEncrypted ? "EncryptionIconView_encrypted" : "EncryptionIconView_unencrypted" })]); [t.div({className: isEncrypted ? "EncryptionIconView_encrypted" : "EncryptionIconView_unencrypted"})]);
} }
} }