diff --git a/src/public/app/layouts/desktop_layout.js b/src/public/app/layouts/desktop_layout.js
index afb1bfedb..bc6ccf3c9 100644
--- a/src/public/app/layouts/desktop_layout.js
+++ b/src/public/app/layouts/desktop_layout.js
@@ -241,12 +241,12 @@ export default class DesktopLayout {
.class("horizontal")
.child(new LeftPaneToggleWidget())
.child(new LauncherContainer(isHorizontal))
- .child(new GlobalMenuWidget())
+ .child(new GlobalMenuWidget(true))
} else {
launcherPane = new FlexContainer("column")
.css("width", "53px")
.class("vertical")
- .child(new GlobalMenuWidget())
+ .child(new GlobalMenuWidget(false))
.child(new LauncherContainer(isHorizontal))
.child(new LeftPaneToggleWidget());
}
diff --git a/src/public/app/widgets/buttons/global_menu.js b/src/public/app/widgets/buttons/global_menu.js
index c93dd4c2a..63026db68 100644
--- a/src/public/app/widgets/buttons/global_menu.js
+++ b/src/public/app/widgets/buttons/global_menu.js
@@ -107,22 +107,6 @@ const TPL = `
@@ -265,18 +249,40 @@ const TPL = `
`;
export default class GlobalMenuWidget extends BasicWidget {
- constructor() {
+ constructor(isHorizontalLayout) {
super();
this.updateAvailableWidget = new UpdateAvailableWidget();
+ this.isHorizontalLayout = isHorizontalLayout;
}
doRender() {
this.$widget = $(TPL);
- this.dropdown = bootstrap.Dropdown.getOrCreateInstance(this.$widget.find("[data-bs-toggle='dropdown']"));
+ const $globalMenuButton = this.$widget.find(".global-menu-button")
+ if (!this.isHorizontalLayout) {
+ $globalMenuButton.prepend($(`\
+ `));
+ this.tooltip = new bootstrap.Tooltip(this.$widget.find("[data-bs-toggle='tooltip']"), { trigger: "hover" });
+ } else {
+ $globalMenuButton.toggleClass("bx bx-menu");
+ }
- this.tooltip = new bootstrap.Tooltip(this.$widget.find("[data-bs-toggle='tooltip']"), { trigger: "hover" });
+ this.dropdown = bootstrap.Dropdown.getOrCreateInstance(this.$widget.find("[data-bs-toggle='dropdown']"));
this.$widget.find(".show-about-dialog-button").on('click', () => this.triggerCommand("openAboutDialog"));
@@ -300,7 +306,7 @@ export default class GlobalMenuWidget extends BasicWidget {
if ($(e.target).children(".dropdown-menu").length === 1 || $(e.target).hasClass('dropdown-toggle')) {
e.stopPropagation();
}
- })
+ })
this.$widget.find(".global-menu-button-update-available").append(
this.updateAvailableWidget.render()
@@ -316,10 +322,14 @@ export default class GlobalMenuWidget extends BasicWidget {
this.$zoomState = this.$widget.find(".zoom-state");
this.$widget.on('show.bs.dropdown', () => {
this.updateZoomState();
- this.tooltip.hide();
- this.tooltip.disable();
+ if (this.tooltip) {
+ this.tooltip.hide();
+ this.tooltip.disable();
+ }
});
- this.$widget.on('hide.bs.dropdown', () => this.tooltip.enable());
+ if (this.tooltip) {
+ this.$widget.on('hide.bs.dropdown', () => this.tooltip.enable());
+ }
this.$widget.find(".zoom-buttons").on("click",
// delay to wait for the actual zoom change