show placeholder in middle panel when no room is selected
This commit is contained in:
parent
16fed27a8a
commit
03df472c53
2 changed files with 27 additions and 22 deletions
19
src/ui/web/RoomPlaceholderView.js
Normal file
19
src/ui/web/RoomPlaceholderView.js
Normal file
|
@ -0,0 +1,19 @@
|
|||
import {tag} from "./html.js";
|
||||
|
||||
export default class RoomPlaceholderView {
|
||||
constructor() {
|
||||
this._root = null;
|
||||
}
|
||||
|
||||
mount() {
|
||||
this._root = tag.div(tag.h2("Choose a room on the left side."));
|
||||
return this._root;
|
||||
}
|
||||
|
||||
root() {
|
||||
return this._root;
|
||||
}
|
||||
|
||||
unmount() {}
|
||||
update() {}
|
||||
}
|
|
@ -1,11 +1,14 @@
|
|||
import ListView from "./ListView.js";
|
||||
import RoomTile from "./RoomTile.js";
|
||||
import RoomView from "./RoomView.js";
|
||||
import SwitchView from "./SwitchView.js";
|
||||
import RoomPlaceholderView from "./RoomPlaceholderView.js";
|
||||
import {tag} from "./html.js";
|
||||
|
||||
export default class SessionView {
|
||||
constructor(viewModel) {
|
||||
this._viewModel = viewModel;
|
||||
this._middleSwitcher = null;
|
||||
this._roomList = null;
|
||||
this._currentRoom = null;
|
||||
this._root = null;
|
||||
|
@ -27,41 +30,24 @@ export default class SessionView {
|
|||
},
|
||||
(room) => new RoomTile(room)
|
||||
);
|
||||
this._roomList.mount();
|
||||
this._root.appendChild(this._roomList.root());
|
||||
|
||||
this._updateCurrentRoom();
|
||||
this._root.appendChild(this._roomList.mount());
|
||||
this._middleSwitcher = new SwitchView(new RoomPlaceholderView());
|
||||
this._root.appendChild(this._middleSwitcher.mount());
|
||||
return this._root;
|
||||
}
|
||||
|
||||
unmount() {
|
||||
this._roomList.unmount();
|
||||
if (this._room) {
|
||||
this._room.unmount();
|
||||
}
|
||||
|
||||
this._middleSwitcher.unmount();
|
||||
this._viewModel.off("change", this._onViewModelChange);
|
||||
}
|
||||
|
||||
_onViewModelChange(prop) {
|
||||
if (prop === "currentRoom") {
|
||||
this._updateCurrentRoom();
|
||||
this._middleSwitcher.switch(new RoomView(this._viewModel.currentRoom));
|
||||
}
|
||||
}
|
||||
|
||||
// changing viewModel not supported for now
|
||||
update() {}
|
||||
|
||||
_updateCurrentRoom() {
|
||||
if (this._currentRoom) {
|
||||
this._currentRoom.root().remove();
|
||||
this._currentRoom.unmount();
|
||||
this._currentRoom = null;
|
||||
}
|
||||
if (this._viewModel.currentRoom) {
|
||||
this._currentRoom = new RoomView(this._viewModel.currentRoom);
|
||||
this._currentRoom.mount();
|
||||
this.root().appendChild(this._currentRoom.root());
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
Reference in a new issue