From 008f3601ca187ff4fbd1d8475fa8cf995e3da8ad Mon Sep 17 00:00:00 2001 From: RMidhunSuresh Date: Fri, 4 Jun 2021 23:19:25 +0530 Subject: [PATCH] Remove link support from Menu - Not needed anymore since every link item has been rewritten as a button. Signed-off-by: RMidhunSuresh --- src/domain/session/room/RoomViewModel.js | 8 +++- .../web/ui/css/themes/element/theme.css | 2 - src/platform/web/ui/general/Menu.js | 39 +++---------------- src/platform/web/ui/session/room/RoomView.js | 8 ++-- .../session/room/timeline/BaseMessageView.js | 4 +- 5 files changed, 18 insertions(+), 43 deletions(-) diff --git a/src/domain/session/room/RoomViewModel.js b/src/domain/session/room/RoomViewModel.js index 60cd0055..ef103255 100644 --- a/src/domain/session/room/RoomViewModel.js +++ b/src/domain/session/room/RoomViewModel.js @@ -36,7 +36,6 @@ export class RoomViewModel extends ViewModel { } this._clearUnreadTimout = null; this._closeUrl = this.urlCreator.urlUntilSegment("session"); - this._detailsUrl = this.urlCreator.urlForSegment("details"); } async load() { @@ -104,7 +103,6 @@ export class RoomViewModel extends ViewModel { get id() { return this._room.id; } get timelineViewModel() { return this._timelineVM; } get isEncrypted() { return this._room.isEncrypted; } - get detailsUrl() { return this._detailsUrl; } get error() { if (this._timelineError) { @@ -289,6 +287,12 @@ export class RoomViewModel extends ViewModel { get composerViewModel() { return this._composerVM; } + + toggleDetailsPanel() { + let path = this.navigation.path.until("room"); + path = path.with(this.navigation.segment("details", true)); + this.navigation.applyPath(path); + } } class ComposerViewModel extends ViewModel { diff --git a/src/platform/web/ui/css/themes/element/theme.css b/src/platform/web/ui/css/themes/element/theme.css index 6d747e96..4a397d13 100644 --- a/src/platform/web/ui/css/themes/element/theme.css +++ b/src/platform/web/ui/css/themes/element/theme.css @@ -673,10 +673,8 @@ button.link { background-color: transparent; text-align: left; padding: 8px 32px 8px 8px; - text-decoration: none; font-size: 1.6rem; height: 24px; - display: block; cursor: pointer; } diff --git a/src/platform/web/ui/general/Menu.js b/src/platform/web/ui/general/Menu.js index baf7b1a9..34a90c09 100644 --- a/src/platform/web/ui/general/Menu.js +++ b/src/platform/web/ui/general/Menu.js @@ -17,33 +17,15 @@ limitations under the License. import {TemplateView} from "./TemplateView.js"; export class Menu extends TemplateView { + static option(label, callback) { + return new MenuOption(label, callback); + } constructor(options) { super(); this._options = options; } - static optionWithButton(label, callback) { - const option = new MenuOption(label); - option.setCallback(callback); - return option; - } - - static optionWithLink(label, link) { - const option = new MenuOption(label); - option.setLink(link); - return option; - } - - _convertToDOM(t, option) { - if (option.callback) { - return t.button({ className: "menu-item", onClick: option.callback }, option.label); - } - else if (option.link) { - return t.a({ className: "menu-item", href: option.link }, option.label); - } - } - render(t) { return t.ul({className: "menu", role: "menu"}, this._options.map(o => { const className = { @@ -55,28 +37,19 @@ export class Menu extends TemplateView { } return t.li({ className, - }, this._convertToDOM(t, o)); + }, t.button({className:"menu-item", onClick: o.callback}, o.label)); })); } } class MenuOption { - constructor(label) { + constructor(label, callback) { this.label = label; + this.callback = callback; this.icon = null; this.destructive = false; } - setCallback(callback) { - this.callback = callback; - return this; - } - - setLink(link) { - this.link = link; - return this; - } - setIcon(className) { this.icon = className; return this; diff --git a/src/platform/web/ui/session/room/RoomView.js b/src/platform/web/ui/session/room/RoomView.js index c1a1ed74..13259a08 100644 --- a/src/platform/web/ui/session/room/RoomView.js +++ b/src/platform/web/ui/session/room/RoomView.js @@ -68,15 +68,15 @@ export class RoomView extends TemplateView { } else { const vm = this.value; const options = []; - options.push(Menu.optionWithLink(vm.i18n`Room details`, vm.detailsUrl)) + options.push(Menu.option(vm.i18n`Room details`, () => vm.toggleDetailsPanel())) if (vm.canLeave) { - options.push(Menu.optionWithButton(vm.i18n`Leave room`, () => vm.leaveRoom()).setDestructive()); + options.push(Menu.option(vm.i18n`Leave room`, () => vm.leaveRoom()).setDestructive()); } if (vm.canForget) { - options.push(Menu.optionWithButton(vm.i18n`Forget room`, () => vm.forgetRoom()).setDestructive()); + options.push(Menu.option(vm.i18n`Forget room`, () => vm.forgetRoom()).setDestructive()); } if (vm.canRejoin) { - options.push(Menu.optionWithButton(vm.i18n`Rejoin room`, () => vm.rejoinRoom())); + options.push(Menu.option(vm.i18n`Rejoin room`, () => vm.rejoinRoom())); } if (!options.length) { return; diff --git a/src/platform/web/ui/session/room/timeline/BaseMessageView.js b/src/platform/web/ui/session/room/timeline/BaseMessageView.js index 4ecde2ba..60b39048 100644 --- a/src/platform/web/ui/session/room/timeline/BaseMessageView.js +++ b/src/platform/web/ui/session/room/timeline/BaseMessageView.js @@ -93,9 +93,9 @@ export class BaseMessageView extends TemplateView { createMenuOptions(vm) { const options = []; if (vm.canAbortSending) { - options.push(Menu.optionWithButton(vm.i18n`Cancel`, () => vm.abortSending())); + options.push(Menu.option(vm.i18n`Cancel`, () => vm.abortSending())); } else if (vm.canRedact) { - options.push(Menu.optionWithButton(vm.i18n`Delete`, () => vm.redact()).setDestructive()); + options.push(Menu.option(vm.i18n`Delete`, () => vm.redact()).setDestructive()); } return options; }