Monkey-patch toolbarbutton CE to display a native menu on macOS

This commit is contained in:
Abe Jellinek 2023-03-23 11:26:50 -04:00 committed by Adomas Venčkauskas
parent 8512402eca
commit 88ce834385
5 changed files with 27 additions and 68 deletions

View file

@ -69,7 +69,6 @@
// Custom elements
Services.scriptloader.loadSubScript("chrome://global/content/customElements.js", this);
Services.scriptloader.loadSubScript("chrome://zotero/content/elements/menuToolbarbutton.js", this);
</script>
<commandset id="mainCommandSet">
@ -353,7 +352,6 @@
<toolbarbutton id="tb-do" tooltiptext="&scaffold.toolbar.do.label;" oncommand="Scaffold.run('do')" class="zotero-tb-button" />
<toolbarseparator/>
<toolbarbutton
is="menu-toolbarbutton"
id="tb-template"
observes="code-tab-only"
tooltiptext="&scaffold.toolbar.template.label;"

View file

@ -40,6 +40,15 @@
max-width: 29px;
}
.zotero-tb-button[type=menu] > .toolbarbutton-menu-dropmarker {
-moz-default-appearance: none;
background-image: url("chrome://zotero/skin/searchbar-dropmarker.png");
width: 7px;
height: 4px;
background-repeat: no-repeat;
background-size: 100%;
}
/* A decent hack: reverse the effective order of the dropmarker and icon in RTL
mode so that the above CSS, which places the menubutton-start.png background
on the toolbarbutton-icon, will make sense. (Otherwise the dropmarker appears
@ -395,6 +404,7 @@ treechildren::-moz-tree-image {
@media (min-resolution: 1.25dppx) {
.zotero-tb-button,.zotero-tb-button:first-child,.zotero-tb-button:last-child { background: url("chrome://zotero/skin/mac/menubutton-end@2x.png") right center/auto 24px no-repeat; }
.zotero-tb-button > .toolbarbutton-icon { background: url("chrome://zotero/skin/mac/menubutton-start@2x.png") left center/auto 24px no-repeat; }
.zotero-tb-button[type=menu] > .toolbarbutton-menu-dropmarker { background-image: url("chrome://zotero/skin/searchbar-dropmarker@2x.png"); }
.zotero-tb-button:-moz-window-inactive > .toolbarbutton-icon { background: url("chrome://zotero/skin/mac/menubutton-start-inactive-window@2x.png") left center/auto 24px no-repeat; }
.zotero-tb-button:-moz-window-inactive,.zotero-tb-button:-moz-window-inactive:first-child,.zotero-tb-button:-moz-window-inactive:last-child { background: url("chrome://zotero/skin/mac/menubutton-end-inactive-window@2x.png") right center/auto 24px no-repeat; }
.zotero-tb-button[open="true"],.zotero-tb-button:not([disabled="true"]):hover:active { background: url("chrome://zotero/skin/mac/menubutton-end-pressed@2x.png") right center/auto 24px no-repeat; }

View file

@ -1,60 +0,0 @@
/*
***** BEGIN LICENSE BLOCK *****
Copyright © 2022 Corporation for Digital Scholarship
Vienna, Virginia, USA
https://www.zotero.org
This file is part of Zotero.
Zotero is free software: you can redistribute it and/or modify
it under the terms of the GNU Affero General Public License as published by
the Free Software Foundation, either version 3 of the License, or
(at your option) any later version.
Zotero is distributed in the hope that it will be useful,
but WITHOUT ANY WARRANTY; without even the implied warranty of
MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
GNU Affero General Public License for more details.
You should have received a copy of the GNU Affero General Public License
along with Zotero. If not, see <http://www.gnu.org/licenses/>.
***** END LICENSE BLOCK *****
*/
"use strict";
{
/**
* Extends MozToolbarbutton to use our own dropmarker image and native menus.
*/
class MenuToolbarbutton extends customElements.get('toolbarbutton') {
constructor() {
super();
this.addEventListener('mousedown', (event) => {
if (this.getAttribute('nonnativepopup') != 'true'
&& Zotero.Utilities.Internal.showNativeElementPopup(this)) {
event.preventDefault();
}
});
}
static get dropmarkerFragment() {
// Zotero.hiDPI[Suffix] may not have been initialized yet, so calculate it ourselves
let hiDPISuffix = window.devicePixelRatio > 1 ? '@2x' : '';
let frag = document.importNode(
MozXULElement.parseXULToFragment(`
<image src="chrome://zotero/skin/searchbar-dropmarker${hiDPISuffix}.png" width="7" height="4" class="toolbarbutton-menu-dropmarker"/>
`),
true
);
Object.defineProperty(this, "dropmarkerFragment", { value: frag });
return frag;
}
}
customElements.define("menu-toolbarbutton", MenuToolbarbutton, {
extends: "toolbarbutton",
});
}

View file

@ -38,6 +38,23 @@ window.addEventListener('DOMContentLoaded', () => {
if (fileQuitItemUnix) fileQuitItemUnix.hidden = true;
if (editPreferencesSeparator) editPreferencesSeparator.hidden = true;
if (editPreferencesItem) editPreferencesItem.hidden = true;
// Monkey-patch the toolbarbutton CE so it shows a native menu popup
let MozToolbarbutton = customElements.get('toolbarbutton');
if (MozToolbarbutton) {
let originalRender = MozToolbarbutton.prototype.render;
MozToolbarbutton.prototype.render = function () {
originalRender();
this.addEventListener('mousedown', (event) => {
if (!event.defaultPrevented
&& !this.disabled
&& this.getAttribute('nonnativepopup') != 'true'
&& Zotero.Utilities.Internal.showNativeElementPopup(this)) {
event.preventDefault();
}
});
};
}
}
else {
// Set behavior on all non-macOS platforms

View file

@ -86,7 +86,6 @@
Services.scriptloader.loadSubScript("chrome://zotero/content/elements/tagsBox.js", this);
Services.scriptloader.loadSubScript("chrome://zotero/content/elements/relatedBox.js", this);
Services.scriptloader.loadSubScript("chrome://zotero/content/elements/attachmentBox.js", this);
Services.scriptloader.loadSubScript("chrome://zotero/content/elements/menuToolbarbutton.js", this);
Services.scriptloader.loadSubScript("chrome://zotero/content/elements/quickSearchTextbox.js", this);
Services.scriptloader.loadSubScript("chrome://zotero/content/elements/splitMenuButton.js", this);
@ -736,7 +735,6 @@
<hbox id="zotero-collections-toolbar" align="center">
<toolbarbutton id="zotero-tb-collection-add" class="zotero-tb-button" tooltiptext="&zotero.toolbar.newCollection.label;" command="cmd_zotero_newCollection"/>
<toolbarbutton
is="menu-toolbarbutton"
id="zotero-tb-library-add-menu"
class="zotero-tb-button"
tooltiptext="&zotero.toolbar.newLibrary.label;"
@ -758,7 +756,6 @@
<hbox id="zotero-items-toolbar" align="center">
<toolbarbutton
is="menu-toolbarbutton"
id="zotero-tb-add"
class="zotero-tb-button"
tooltiptext="&zotero.toolbar.newItem.label;"
@ -806,7 +803,6 @@
<!--<toolbarbutton id="zotero-tb-note-add" class="zotero-tb-button" tooltiptext="&zotero.toolbar.note.standalone;" oncommand="ZoteroPane_Local.newNote(event.shiftKey);"/>-->
<toolbarbutton
is="menu-toolbarbutton"
id="zotero-tb-note-add" class="zotero-tb-button" tooltiptext="&zotero.toolbar.newNote;"
type="menu"
wantdropmarker="true"
@ -817,7 +813,6 @@
</menupopup>
</toolbarbutton>
<toolbarbutton
is="menu-toolbarbutton"
id="zotero-tb-attachment-add"
class="zotero-tb-button"
tooltiptext="&zotero.items.menu.attach;"
@ -843,7 +838,6 @@
<hbox id="zotero-item-toolbar" flex="1" align="center">
<hbox align="center" pack="start" flex="1">
<toolbarbutton
is="menu-toolbarbutton"
id="zotero-tb-locate"
class="zotero-tb-button"
tooltiptext="&zotero.toolbar.openURL.label;"