mystiq/hydrogen-web
Archived
4
1
Fork 1
Code Issues Pull requests Packages Projects Releases Wiki Activity

Add link support to menu

Browse source 
Signed-off-by: RMidhunSuresh <rmidhunsuresh@gmail.com>
This commit is contained in:
RMidhunSuresh 2021-05-31 22:53:00 +05:30
parent 426d0779ee
commit 1e96b58f85
2 changed files with 33 additions and 8 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

35
src/platform/web/ui/general/Menu.js
View file

@ -15,10 +15,19 @@ limitations under the License.
*/
import {TemplateView} from "./TemplateView.js";
import { tag } from "./html.js";
export class Menu extends TemplateView {
static option(label, callback) {
return new MenuOption(label, callback);
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;
}
constructor(options) {
@ -26,6 +35,15 @@ export class Menu extends TemplateView {
this._options = options;
}
_convertToDOM(option) {
if (option.callback) {
return tag.button({ onClick: option.callback }, option.label);
}
else if (option.link) {
return tag.a({ href: option.link }, option.label);
}
}
render(t) {
return t.ul({className: "menu", role: "menu"}, this._options.map(o => {
const className = {
@ -37,19 +55,26 @@ export class Menu extends TemplateView {
}
return t.li({
className,
}, t.button({onClick: o.callback}, o.label));
}, this._convertToDOM(o));
}));
}
}
class MenuOption {
constructor(label, callback) {
constructor(label) {
this.label = label;
this.callback = callback;
this.icon = null;
this.destructive = false;
}
setCallback(callback) {
this.callback = callback;
}
setLink(link) {
this.link = link;
}
setIcon(className) {
this.icon = className;
return this;

6
src/platform/web/ui/session/room/RoomView.js
View file

@ -69,13 +69,13 @@ export class RoomView extends TemplateView {
const vm = this.value;
const options = [];
if (vm.canLeave) {
options.push(Menu.option(vm.i18n`Leave room`, () => vm.leaveRoom()).setDestructive());
options.push(Menu.optionWithButton(vm.i18n`Leave room`, () => vm.leaveRoom()).setDestructive());
}
if (vm.canForget) {
options.push(Menu.option(vm.i18n`Forget room`, () => vm.forgetRoom()).setDestructive());
options.push(Menu.optionWithButton(vm.i18n`Forget room`, () => vm.forgetRoom()).setDestructive());
}
if (vm.canRejoin) {
options.push(Menu.option(vm.i18n`Rejoin room`, () => vm.rejoinRoom()));
options.push(Menu.optionWithButton(vm.i18n`Rejoin room`, () => vm.rejoinRoom()));
}
if (!options.length) {
return;