Arsharth/hydrogen-web
1
0
Fork 0
forked from mystiq/hydrogen-web
Code Issues Pull requests Projects Releases Packages Wiki Activity

Create navigation and add to right panel

Browse source 
Signed-off-by: RMidhunSuresh <rmidhunsuresh@gmail.com>
This commit is contained in:
RMidhunSuresh 2021-07-19 21:04:32 +05:30
parent fdd4caa0b7
commit e4bb20575b
3 changed files with 21 additions and 6 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

10
src/domain/navigation/index.js
View file

@ -39,7 +39,7 @@ function allowsChild(parent, child) {
case "room": case "room":
return type === "lightbox" || type === "right-panel"; return type === "lightbox" || type === "right-panel";
case "right-panel": case "right-panel":
return type === "details"|| type === "members"; return type === "details"|| type === "members" || type === "member";
default: default:
return false; return false;
} }
@ -87,9 +87,9 @@ function roomsSegmentWithRoom(rooms, roomId, path) {
} }
} }
function pushRightPanelSegment(array, segment) { function pushRightPanelSegment(array, segment, value = true) {
array.push(new Segment("right-panel")); array.push(new Segment("right-panel"));
array.push(new Segment(segment)); array.push(new Segment(segment, value));
} }
export function addPanelIfNeeded(navigation, path) { export function addPanelIfNeeded(navigation, path) {
@ -147,6 +147,10 @@ export function parseUrlPath(urlPath, currentNavPath, defaultSessionId) {
} }
} else if (type === "details" || type === "members") { } else if (type === "details" || type === "members") {
pushRightPanelSegment(segments, type); pushRightPanelSegment(segments, type);
} else if (type === "member") {
const userId = iterator.next().value;
if (!userId) { break; }
pushRightPanelSegment(segments, type, userId);
} else { } else {
// might be undefined, which will be turned into true by Segment // might be undefined, which will be turned into true by Segment
const value = iterator.next().value; const value = iterator.next().value;

13
src/domain/session/rightpanel/RightPanelViewModel.js
View file

@ -1,6 +1,7 @@
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"; import {MemberListViewModel} from "./MemberListViewModel.js";
import {MemberDetailsViewModel} from "./MemberDetailsViewModel.js";
export class RightPanelViewModel extends ViewModel { export class RightPanelViewModel extends ViewModel {
constructor(options) { constructor(options) {
@ -11,16 +12,24 @@ export class RightPanelViewModel extends ViewModel {
get activeViewModel() { return this._activeViewModel; } get activeViewModel() { return this._activeViewModel; }
async _getMemberArguments() { async _getMemberListArguments() {
const members = await this._room.loadMemberList(); const members = await this._room.loadMemberList();
const room = this._room; const room = this._room;
const powerLevelsObservable = await this._room.observePowerLevels(); const powerLevelsObservable = await this._room.observePowerLevels();
return {members, powerLevelsObservable, mediaRepository: room.mediaRepository}; return {members, powerLevelsObservable, mediaRepository: room.mediaRepository};
} }
async _getMemberDetailsArguments() {
const segment = this.navigation.path.get("member");
const userId = segment.value;
const observableMember = await this._room.observeMember(userId);
return {observableMember, mediaRepository: this._room.mediaRepository};
}
_setupNavigation() { _setupNavigation() {
this._hookUpdaterToSegment("details", RoomDetailsViewModel, () => { return {room: this._room}; }); this._hookUpdaterToSegment("details", RoomDetailsViewModel, () => { return {room: this._room}; });
this._hookUpdaterToSegment("members", MemberListViewModel, () => this._getMemberArguments()); this._hookUpdaterToSegment("members", MemberListViewModel, () => this._getMemberListArguments());
this._hookUpdaterToSegment("member", MemberDetailsViewModel, () => this._getMemberDetailsArguments());
} }
_hookUpdaterToSegment(segment, viewmodel, argCreator) { _hookUpdaterToSegment(segment, viewmodel, argCreator) {

4
src/platform/web/ui/session/rightpanel/RightPanelView.js
View file

@ -2,12 +2,14 @@ import {TemplateView} from "../../general/TemplateView.js";
import {RoomDetailsView} from "./RoomDetailsView.js"; import {RoomDetailsView} from "./RoomDetailsView.js";
import {MemberListView} from "./MemberListView.js"; import {MemberListView} from "./MemberListView.js";
import {LoadingView} from "../../general/LoadingView.js"; import {LoadingView} from "../../general/LoadingView.js";
import {MemberDetailsView} from "./MemberDetailsView.js";
export class RightPanelView extends TemplateView { export class RightPanelView extends TemplateView {
render(t) { render(t) {
const viewFromType = { const viewFromType = {
"room-details": RoomDetailsView, "room-details": RoomDetailsView,
"member-list": MemberListView "member-list": MemberListView,
"member-details": MemberDetailsView
}; };
return t.div({ className: "RightPanelView" }, return t.div({ className: "RightPanelView" },
[ [