From 1b9f970d7fed49887e48a5dee68b31841d318d28 Mon Sep 17 00:00:00 2001 From: RMidhunSuresh Date: Fri, 17 Dec 2021 16:22:45 +0530 Subject: [PATCH] WIP: Render the whole view instead of messageBody --- .../web/ui/session/room/MessageComposer.js | 2 +- .../web/ui/session/room/TimelineView.ts | 19 +------- src/platform/web/ui/session/room/common.ts | 43 +++++++++++++++++++ .../session/room/timeline/BaseMessageView.js | 2 +- .../session/room/timeline/ReplyPreviewView.js | 7 +-- 5 files changed, 51 insertions(+), 22 deletions(-) create mode 100644 src/platform/web/ui/session/room/common.ts diff --git a/src/platform/web/ui/session/room/MessageComposer.js b/src/platform/web/ui/session/room/MessageComposer.js index 0d3d9755..cfd389f3 100644 --- a/src/platform/web/ui/session/room/MessageComposer.js +++ b/src/platform/web/ui/session/room/MessageComposer.js @@ -17,7 +17,7 @@ limitations under the License. import {TemplateView} from "../../general/TemplateView"; import {Popup} from "../../general/Popup.js"; import {Menu} from "../../general/Menu.js"; -import {viewClassForEntry} from "./TimelineView" +import {viewClassForEntry} from "./common" export class MessageComposer extends TemplateView { constructor(viewModel) { diff --git a/src/platform/web/ui/session/room/TimelineView.ts b/src/platform/web/ui/session/room/TimelineView.ts index da3dc537..68602c48 100644 --- a/src/platform/web/ui/session/room/TimelineView.ts +++ b/src/platform/web/ui/session/room/TimelineView.ts @@ -27,6 +27,7 @@ import {AnnouncementView} from "./timeline/AnnouncementView.js"; import {RedactedView} from "./timeline/RedactedView.js"; import {SimpleTile} from "../../../../../domain/session/room/timeline/tiles/SimpleTile.js"; import {BaseObservableList as ObservableList} from "../../../../../observable/list/BaseObservableList"; +import {viewClassForEntry} from "./common"; //import {TimelineViewModel} from "../../../../../domain/session/room/timeline/TimelineViewModel.js"; export interface TimelineViewModel extends IObservableValue { @@ -35,25 +36,9 @@ export interface TimelineViewModel extends IObservableValue { setVisibleTileRange(start?: SimpleTile, end?: SimpleTile); } -type TileView = GapView | AnnouncementView | TextMessageView | +export type TileView = GapView | AnnouncementView | TextMessageView | ImageView | VideoView | FileView | MissingAttachmentView | RedactedView; -type TileViewConstructor = (this: TileView, SimpleTile) => void; -export function viewClassForEntry(entry: SimpleTile): TileViewConstructor | undefined { - switch (entry.shape) { - case "gap": return GapView; - case "announcement": return AnnouncementView; - case "message": - case "message-status": - return TextMessageView; - case "image": return ImageView; - case "video": return VideoView; - case "file": return FileView; - case "missing-attachment": return MissingAttachmentView; - case "redacted": - return RedactedView; - } -} function bottom(node: HTMLElement): number { return node.offsetTop + node.clientHeight; diff --git a/src/platform/web/ui/session/room/common.ts b/src/platform/web/ui/session/room/common.ts new file mode 100644 index 00000000..764e2b6e --- /dev/null +++ b/src/platform/web/ui/session/room/common.ts @@ -0,0 +1,43 @@ +/* +Copyright 2021 The Matrix.org Foundation C.I.C. + +Licensed under the Apache License, Version 2.0 (the "License"); +you may not use this file except in compliance with the License. +You may obtain a copy of the License at + + http://www.apache.org/licenses/LICENSE-2.0 + +Unless required by applicable law or agreed to in writing, software +distributed under the License is distributed on an "AS IS" BASIS, +WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. +See the License for the specific language governing permissions and +limitations under the License. +*/ + +import {TextMessageView} from "./timeline/TextMessageView.js"; +import {ImageView} from "./timeline/ImageView.js"; +import {VideoView} from "./timeline/VideoView.js"; +import {FileView} from "./timeline/FileView.js"; +import {MissingAttachmentView} from "./timeline/MissingAttachmentView.js"; +import {AnnouncementView} from "./timeline/AnnouncementView.js"; +import {RedactedView} from "./timeline/RedactedView.js"; +import {SimpleTile} from "../../../../../domain/session/room/timeline/tiles/SimpleTile.js"; +import {GapView} from "./timeline/GapView.js"; +import type {TileView} from "./TimelineView"; + +type TileViewConstructor = (this: TileView, SimpleTile) => void; +export function viewClassForEntry(entry: SimpleTile): TileViewConstructor | undefined { + switch (entry.shape) { + case "gap": return GapView; + case "announcement": return AnnouncementView; + case "message": + case "message-status": + return TextMessageView; + case "image": return ImageView; + case "video": return VideoView; + case "file": return FileView; + case "missing-attachment": return MissingAttachmentView; + case "redacted": + return RedactedView; + } +} diff --git a/src/platform/web/ui/session/room/timeline/BaseMessageView.js b/src/platform/web/ui/session/room/timeline/BaseMessageView.js index 1fa14841..ca155785 100644 --- a/src/platform/web/ui/session/room/timeline/BaseMessageView.js +++ b/src/platform/web/ui/session/room/timeline/BaseMessageView.js @@ -54,7 +54,7 @@ export class BaseMessageView extends TemplateView { if (isContinuation && wasContinuation === false) { li.removeChild(li.querySelector(".Timeline_messageAvatar")); li.removeChild(li.querySelector(".Timeline_messageSender")); - } else if (!isContinuation) { + } else if (!isContinuation && this._interactive) { const avatar = tag.a({href: vm.memberPanelLink, className: "Timeline_messageAvatar"}, [renderStaticAvatar(vm, 30)]); const sender = tag.div({className: `Timeline_messageSender usercolor${vm.avatarColorNumber}`}, vm.displayName); li.insertBefore(avatar, li.firstChild); diff --git a/src/platform/web/ui/session/room/timeline/ReplyPreviewView.js b/src/platform/web/ui/session/room/timeline/ReplyPreviewView.js index 5581ae77..00767bdf 100644 --- a/src/platform/web/ui/session/room/timeline/ReplyPreviewView.js +++ b/src/platform/web/ui/session/room/timeline/ReplyPreviewView.js @@ -16,7 +16,7 @@ limitations under the License. import {renderStaticAvatar} from "../../../avatar"; import {TemplateView} from "../../../general/TemplateView"; -import {viewClassForEntry} from "../TimelineView"; +import {viewClassForEntry} from "../common"; export class ReplyPreviewView extends TemplateView { render(t, vm) { @@ -26,8 +26,9 @@ export class ReplyPreviewView extends TemplateView { _renderReplyPreview(t, vm) { // todo: this should probably be called viewClassForTile instead const viewClass = viewClassForEntry(vm); - const view = new viewClass(vm) - const rendered = this._renderContent(t, vm, view); + const view = new viewClass(vm, false) + // const rendered = this._renderContent(t, vm, view); + const rendered = view.render(t, vm); return this._renderReplyHeader(t, vm, [rendered]); }