Create memberlist view from rightpanel
Signed-off-by: RMidhunSuresh <rmidhunsuresh@gmail.com>
This commit is contained in:
parent
f3c7ab337d
commit
a765d7fc7d
2 changed files with 25 additions and 2 deletions
|
@ -1,5 +1,6 @@
|
||||||
import {ViewModel} from "../../ViewModel.js";
|
import {ViewModel} from "../../ViewModel.js";
|
||||||
import {RoomDetailsViewModel} from "./RoomDetailsViewModel.js";
|
import {RoomDetailsViewModel} from "./RoomDetailsViewModel.js";
|
||||||
|
import {MemberListViewModel} from "./MemberListViewModel.js";
|
||||||
|
|
||||||
export class RightPanelViewModel extends ViewModel {
|
export class RightPanelViewModel extends ViewModel {
|
||||||
constructor(options) {
|
constructor(options) {
|
||||||
|
@ -9,11 +10,16 @@ export class RightPanelViewModel extends ViewModel {
|
||||||
}
|
}
|
||||||
|
|
||||||
get roomDetailsViewModel() { return this._roomDetailsViewModel; }
|
get roomDetailsViewModel() { return this._roomDetailsViewModel; }
|
||||||
|
get memberListViewModel() { return this._memberListViewModel; }
|
||||||
|
|
||||||
_setupNavigation() {
|
_setupNavigation() {
|
||||||
const details = this.navigation.observe("details");
|
const details = this.navigation.observe("details");
|
||||||
this.track(details.subscribe(() => this._toggleRoomDetailsPanel()));
|
this.track(details.subscribe(() => this._toggleRoomDetailsPanel()));
|
||||||
this._toggleRoomDetailsPanel();
|
this._toggleRoomDetailsPanel();
|
||||||
|
|
||||||
|
const members = this.navigation.observe("members");
|
||||||
|
this.track(members.subscribe(() => this._toggleMemberListPanel()));
|
||||||
|
this._toggleMemberListPanel();
|
||||||
}
|
}
|
||||||
|
|
||||||
_toggleRoomDetailsPanel() {
|
_toggleRoomDetailsPanel() {
|
||||||
|
@ -25,4 +31,17 @@ export class RightPanelViewModel extends ViewModel {
|
||||||
}
|
}
|
||||||
this.emitChange("roomDetailsViewModel");
|
this.emitChange("roomDetailsViewModel");
|
||||||
}
|
}
|
||||||
|
|
||||||
|
async _toggleMemberListPanel() {
|
||||||
|
this._memberListViewModel = this.disposeTracked(this._memberListViewModel);
|
||||||
|
const enable = !!this.navigation.path.get("members")?.value;
|
||||||
|
if (enable) {
|
||||||
|
const list = await this._room.loadMemberList();
|
||||||
|
const members = list.members;
|
||||||
|
this._memberListViewModel = this.track(
|
||||||
|
new MemberListViewModel(this.childOptions({members}))
|
||||||
|
);
|
||||||
|
}
|
||||||
|
this.emitChange("memberListViewModel");
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -1,10 +1,14 @@
|
||||||
import {TemplateView} from "../../general/TemplateView.js";
|
import {TemplateView} from "../../general/TemplateView.js";
|
||||||
import {RoomDetailsView} from "./RoomDetailsView.js";
|
import {RoomDetailsView} from "./RoomDetailsView.js";
|
||||||
|
import {MemberListView} from "./MemberListView.js";
|
||||||
|
|
||||||
export class RightPanelView extends TemplateView {
|
export class RightPanelView extends TemplateView {
|
||||||
render(t, vm) {
|
render(t, vm) {
|
||||||
return t.div({className: "RightPanelView"},
|
return t.div({className: "RightPanelView"},
|
||||||
t.mapView(vm => vm.roomDetailsViewModel, roomDetailsViewModel => roomDetailsViewModel ? new RoomDetailsView(roomDetailsViewModel) : null)
|
[
|
||||||
|
t.mapView(vm => vm.roomDetailsViewModel, roomDetailsViewModel => roomDetailsViewModel ? new RoomDetailsView(roomDetailsViewModel) : null),
|
||||||
|
t.mapView(vm => vm.memberListViewModel, memberListViewModel => memberListViewModel ? new MemberListView(memberListViewModel) : null)
|
||||||
|
]
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
Reference in a new issue