mirrors/vector-im-hydrogen-web
1
0
Fork 0
mirror of https://github.com/vector-im/hydrogen-web.git synced 2024-12-23 19:45:05 +01:00
Code Issues Projects Releases Wiki Activity

show placeholder in middle panel when no room is selected

Browse Source
This commit is contained in:
Bruno Windels 2019-06-15 17:50:15 +02:00
parent 16fed27a8a
commit 03df472c53
2 changed files with 27 additions and 22 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

19
src/ui/web/RoomPlaceholderView.js Normal file
View 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() {}
}

30
src/ui/web/SessionView.js
View File

@ -1,11 +1,14 @@
import ListView from "./ListView.js"; import ListView from "./ListView.js";
import RoomTile from "./RoomTile.js"; import RoomTile from "./RoomTile.js";
import RoomView from "./RoomView.js"; import RoomView from "./RoomView.js";
import SwitchView from "./SwitchView.js";
import RoomPlaceholderView from "./RoomPlaceholderView.js";
import {tag} from "./html.js"; import {tag} from "./html.js";
export default class SessionView { export default class SessionView {
constructor(viewModel) { constructor(viewModel) {
this._viewModel = viewModel; this._viewModel = viewModel;
this._middleSwitcher = null;
this._roomList = null; this._roomList = null;
this._currentRoom = null; this._currentRoom = null;
this._root = null; this._root = null;
@ -27,41 +30,24 @@ export default class SessionView {
}, },
(room) => new RoomTile(room) (room) => new RoomTile(room)
); );
this._roomList.mount(); this._root.appendChild(this._roomList.mount());
this._root.appendChild(this._roomList.root()); this._middleSwitcher = new SwitchView(new RoomPlaceholderView());
this._root.appendChild(this._middleSwitcher.mount());
this._updateCurrentRoom();
return this._root; return this._root;
} }
unmount() { unmount() {
this._roomList.unmount(); this._roomList.unmount();
if (this._room) { this._middleSwitcher.unmount();
this._room.unmount();
}
this._viewModel.off("change", this._onViewModelChange); this._viewModel.off("change", this._onViewModelChange);
} }
_onViewModelChange(prop) { _onViewModelChange(prop) {
if (prop === "currentRoom") { if (prop === "currentRoom") {
this._updateCurrentRoom(); this._middleSwitcher.switch(new RoomView(this._viewModel.currentRoom));
} }
} }
// changing viewModel not supported for now // changing viewModel not supported for now
update() {} 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());
}
}
} }