Support loading view for all panels
Signed-off-by: RMidhunSuresh <rmidhunsuresh@gmail.com>
This commit is contained in:
parent
d64d07aee5
commit
bcfd1bd135
5 changed files with 15 additions and 11 deletions
|
@ -12,6 +12,8 @@ export class MemberListViewModel extends ViewModel {
|
|||
this.mediaRepository = options.mediaRepository;
|
||||
}
|
||||
|
||||
get type() { return "member-list"; }
|
||||
|
||||
_filterJoinedMembers(members) {
|
||||
return members.filterValues(member => member.membership === "join");
|
||||
}
|
||||
|
|
|
@ -11,6 +11,7 @@ export class RightPanelViewModel extends ViewModel {
|
|||
|
||||
get roomDetailsViewModel() { return this._roomDetailsViewModel; }
|
||||
get memberListViewModel() { return this._memberListViewModel; }
|
||||
get activeViewModel() { return this._roomDetailsViewModel ?? this._memberListViewModel; }
|
||||
|
||||
_setupNavigation() {
|
||||
const details = this.navigation.observe("details");
|
||||
|
|
|
@ -9,6 +9,10 @@ export class RoomDetailsViewModel extends ViewModel {
|
|||
this._room.on("change", this._onRoomChange);
|
||||
}
|
||||
|
||||
get type() {
|
||||
return "room-details";
|
||||
}
|
||||
|
||||
get roomId() {
|
||||
return this._room.id;
|
||||
}
|
||||
|
|
|
@ -1,16 +1,9 @@
|
|||
import {TemplateView} from "../../general/TemplateView.js";
|
||||
import {ListView} from "../../general/ListView.js";
|
||||
import {MemberTileView} from "./MemberTileView.js";
|
||||
import {spinner} from "../../common.js";
|
||||
|
||||
export class MemberListView extends TemplateView {
|
||||
render(t, vm) {
|
||||
return t.view(new ListView({list: vm.memberTileViewModels, className:"MemberListView"}, tileViewModel => new MemberTileView(tileViewModel)));
|
||||
}
|
||||
}
|
||||
|
||||
export class MemberListLoadingView extends TemplateView {
|
||||
render(t) {
|
||||
return t.div(["Loading ", spinner(t)]);
|
||||
}
|
||||
}
|
||||
|
|
|
@ -1,13 +1,17 @@
|
|||
import {TemplateView} from "../../general/TemplateView.js";
|
||||
import {RoomDetailsView} from "./RoomDetailsView.js";
|
||||
import {MemberListLoadingView, MemberListView} from "./MemberListView.js";
|
||||
import {MemberListView} from "./MemberListView.js";
|
||||
import {LoadingView} from "./LoadingView.js";
|
||||
|
||||
export class RightPanelView extends TemplateView {
|
||||
render(t) {
|
||||
const viewFromType = {
|
||||
"room-details": RoomDetailsView,
|
||||
"member-list": MemberListView
|
||||
};
|
||||
return t.div({ className: "RightPanelView" },
|
||||
[
|
||||
t.mapView(vm => vm.roomDetailsViewModel, roomDetailsViewModel => roomDetailsViewModel ? new RoomDetailsView(roomDetailsViewModel) : null),
|
||||
t.mapView(vm => vm.memberListViewModel, memberListViewModel => memberListViewModel ? new MemberListView(memberListViewModel) : new MemberListLoadingView())
|
||||
t.mapView(vm => vm.activeViewModel, vm => vm ? new viewFromType[vm.type](vm) : new LoadingView())
|
||||
]
|
||||
);
|
||||
}
|
||||
|
|
Reference in a new issue