Create RightPanel from SessionViewModel

- Also remove old methods used in RoomDetails

Signed-off-by: RMidhunSuresh <rmidhunsuresh@gmail.com>
This commit is contained in:
RMidhunSuresh 2021-06-17 14:19:55 +05:30
parent 7500bbeaad
commit 8b01ca502e
2 changed files with 27 additions and 26 deletions

View file

@ -17,7 +17,6 @@ limitations under the License.
import {LeftPanelViewModel} from "./leftpanel/LeftPanelViewModel.js";
import {RoomViewModel} from "./room/RoomViewModel.js";
import {RoomDetailsViewModel} from "./rightpanel/RoomDetailsViewModel.js";
import {UnknownRoomViewModel} from "./room/UnknownRoomViewModel.js";
import {InviteViewModel} from "./room/InviteViewModel.js";
import {LightboxViewModel} from "./room/LightboxViewModel.js";
@ -27,6 +26,7 @@ import {SettingsViewModel} from "./settings/SettingsViewModel.js";
import {ViewModel} from "../ViewModel.js";
import {RoomViewModelObservable} from "./RoomViewModelObservable.js";
import {MemberListViewModel} from "./rightpanel/MemberListViewModel.js";
import { RightPanelViewModel } from "./rightpanel/RightPanelViewModel.js";
export class SessionViewModel extends ViewModel {
constructor(options) {
@ -64,7 +64,7 @@ export class SessionViewModel extends ViewModel {
if (!this._gridViewModel) {
this._updateRoom(roomId);
}
this._updateRoomDetails();
this._updateRightPanel();
}));
if (!this._gridViewModel) {
this._updateRoom(currentRoomId.get());
@ -82,13 +82,13 @@ export class SessionViewModel extends ViewModel {
}));
this._updateLightbox(lightbox.get());
const details = this.navigation.observe("details");
this.track(details.subscribe(() => this._updateRoomDetails()));
this._updateRoomDetails();
// const members = this.navigation.observe("members");
// this.track(members.subscribe(() => this._toggleMemberListPanel()));
// this._toggleMemberListPanel();
const members = this.navigation.observe("members");
this.track(members.subscribe(() => this._toggleMemberListPanel()));
this._toggleMemberListPanel();
const rightpanel = this.navigation.observe("rightpanel");
this.track(rightpanel.subscribe(() => this._updateRightPanel()));
this._updateRightPanel();
}
get id() {
@ -123,14 +123,14 @@ export class SessionViewModel extends ViewModel {
return this._roomViewModelObservable?.get();
}
get roomDetailsViewModel() {
return this._roomDetailsViewModel;
}
get memberListViewModel() {
return this._memberListViewModel;
}
get rightPanelViewModel() {
return this._rightPanelViewModel;
}
_updateGrid(roomIds) {
const changed = !(this._gridViewModel && roomIds);
const currentRoomId = this.navigation.path.get("room");
@ -265,17 +265,6 @@ export class SessionViewModel extends ViewModel {
return room;
}
_updateRoomDetails() {
this._roomDetailsViewModel = this.disposeTracked(this._roomDetailsViewModel);
const enable = !!this.navigation.path.get("details")?.value;
if (enable) {
const room = this._roomFromNavigation();
if (!room) { return; }
this._roomDetailsViewModel = this.track(new RoomDetailsViewModel(this.childOptions({room})));
}
this.emitChange("roomDetailsViewModel");
}
async _toggleMemberListPanel() {
this._memberListViewModel = this.disposeTracked(this._memberListViewModel);
const enable = !!this.navigation.path.get("members")?.value;
@ -289,4 +278,15 @@ export class SessionViewModel extends ViewModel {
}
this.emitChange("memberListViewModel");
}
_updateRightPanel() {
this._rightPanelViewModel = this.disposeTracked(this._rightPanelViewModel);
const enable = !!this.navigation.path.get("rightpanel")?.value;
if (enable) {
const room = this._roomFromNavigation();
this._rightPanelViewModel = this.track(new RightPanelViewModel(this.childOptions({room})));
}
this.emitChange("rightPanelViewModel");
}
}

View file

@ -27,6 +27,7 @@ import {RoomGridView} from "./RoomGridView.js";
import {SettingsView} from "./settings/SettingsView.js";
import {RoomDetailsView} from "./rightpanel/RoomDetailsView.js";
import {MemberListView} from "./rightpanel/MemberListView.js";
import {RightPanelView} from "./rightpanel/RightPanelView.js";
export class SessionView extends TemplateView {
render(t, vm) {
@ -34,7 +35,7 @@ export class SessionView extends TemplateView {
className: {
"SessionView": true,
"middle-shown": vm => !!vm.activeMiddleViewModel,
"right-shown": vm => !!vm.roomDetailsViewModel
"right-shown": vm => !!vm.rightPanelViewModel
},
}, [
t.view(new SessionStatusView(vm.sessionStatusViewModel)),
@ -56,9 +57,9 @@ export class SessionView extends TemplateView {
return new StaticView(t => t.div({className: "room-placeholder"}, t.h2(vm.i18n`Choose a room on the left side.`)));
}
}),
t.mapView(vm => vm.roomDetailsViewModel, roomDetailsViewModel => roomDetailsViewModel ? new RoomDetailsView(roomDetailsViewModel) : null),
t.mapView(vm => vm.memberListViewModel, memberListViewModel => memberListViewModel ? new MemberListView(memberListViewModel) : null),
t.mapView(vm => vm.lightboxViewModel, lightboxViewModel => lightboxViewModel ? new LightboxView(lightboxViewModel) : null)
t.mapView(vm => vm.lightboxViewModel, lightboxViewModel => lightboxViewModel ? new LightboxView(lightboxViewModel) : null),
t.mapView(vm => vm.rightPanelViewModel, rightPanelViewModel => rightPanelViewModel ? new RightPanelView(rightPanelViewModel) : null)
]);
}
}