mirrors/zotero
2
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

fx-compat: Restore quick search menu and update styles (#2684)

Browse source
This commit is contained in:
Abe Jellinek 2022-07-06 23:42:23 -04:00 committed by GitHub
parent bc41c3b7b0
commit 9a8e78aaf4
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
18 changed files with 197 additions and 155 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

5
chrome/content/zotero-platform/mac/overlay.css
View file

@ -69,11 +69,6 @@
margin-top: -4px;
}
#zotero-tb-search-menu-button {
margin: -6px 0 -6px -16px;
padding: 6px 0 6px 15px;
}
#zotero-tb-sync > .toolbarbutton-icon {
-moz-padding-start: 8px;
padding-top: 1px;

16
chrome/content/zotero-platform/unix/overlay.css
View file

@ -9,7 +9,7 @@
}
/* Dropmarker added automatically on Linux */
.toolbarbutton-menu-dropmarker, #zotero-tb-search-menu-button {
.toolbarbutton-menu-dropmarker {
list-style-image: none;
}
@ -17,20 +17,6 @@
margin-right: 4px;
}
#zotero-tb-search-menu-button {
-moz-appearance: toolbarbutton-dropdown !important;
width: 12px;
height: 12px;
}
#zotero-tb-search-menu-button .button-menu-dropmarker {
display: none;
}
#zotero-tb-search .textbox-search-icon {
visibility: hidden;
}
/* Fixes tabs missing styling on (GTK 3.20) Ubuntu 16.10. See https://bugzilla.mozilla.org/show_bug.cgi?id=1306425 */
tabpanels {
-moz-appearance: none;

15
chrome/content/zotero-platform/win/overlay.css
View file

@ -24,21 +24,6 @@
}
}
#zotero-tb-search-menu-button {
margin: 0 -1px 0 -4px;
padding: 5px 0 5px 5px;
border: 0;
background: transparent;
}
#zotero-tb-search-menu-button .button-menu-dropmarker {
display: none;
}
#zotero-tb-search .textbox-search-icon {
visibility: hidden;
}
#zotero-tb-sync-error {
margin-right: 4px;
padding-top: 4px;

131
chrome/content/zotero/elements/quickSearchTextbox.js Normal file
View file

@ -0,0 +1,131 @@
/*
***** 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";
{
// The search-textbox CE is defined lazily. Create one now to get
// search-textbox defined, allowing us to inherit from it.
if (!customElements.get("search-textbox")) {
delete document.createXULElement("search-textbox");
}
class QuickSearchTextbox extends customElements.get("search-textbox") {
_searchModes = {
titleCreatorYear: Zotero.getString('quickSearch.mode.titleCreatorYear'),
fields: Zotero.getString('quickSearch.mode.fieldsAndTags'),
everything: Zotero.getString('quickSearch.mode.everything')
};
_searchModePopup = null;
connectedCallback() {
super.connectedCallback();
if (this.delayConnectedCallback()) {
return;
}
let s1 = document.createElement("link");
s1.rel = "stylesheet";
s1.href = "chrome://zotero-platform/content/quickSearchTextbox.css";
this.shadowRoot.append(s1);
// Need to create an inner shadow DOM so that global.css styles,
// which we need for the menupopup, don't break the search textbox
let dropmarkerHost = document.createXULElement('hbox');
let dropmarkerShadow = dropmarkerHost.attachShadow({ mode: 'open' });
let s2 = document.createElement("link");
s2.rel = "stylesheet";
s2.href = "chrome://zotero-platform/content/quickSearchTextbox.css";
let s3 = document.createElement("link");
s3.rel = "stylesheet";
s3.href = "chrome://global/skin/global.css";
let dropmarker = document.createXULElement('button');
dropmarker.id = "zotero-tb-search-menu-button";
dropmarker.setAttribute("type", "menu");
dropmarker.append(this.searchModePopup);
dropmarkerShadow.append(s2, s3, dropmarker);
this.inputField.before(dropmarkerHost);
// If Alt-Up/Down, show popup
this.addEventListener('keypress', (event) => {
if (event.altKey && (event.keyCode == event.DOM_VK_UP || event.keyCode == event.DOM_VK_DOWN)) {
dropmarker.open = true;
event.preventDefault();
}
});
}
get searchModePopup() {
if (this._searchModePopup) {
return this._searchModePopup;
}
let popup = document.createXULElement('menupopup');
popup.id = "search-mode-popup";
for (let [mode, label] of Object.entries(this._searchModes)) {
let item = document.createXULElement('menuitem');
item.setAttribute('type', 'radio');
item.label = label;
item.value = mode;
item.addEventListener('command', () => {
Zotero.Prefs.set("search.quicksearch-mode", mode);
this.updateMode();
if (this.value) {
this.dispatchEvent(new Event('command'));
}
});
popup.append(item);
}
return this._searchModePopup = popup;
}
updateMode() {
let mode = Zotero.Prefs.get("search.quicksearch-mode");
if (!this._searchModes[mode]) {
Zotero.Prefs.set("search.quicksearch-mode", "fields");
mode = 'fields';
}
this.searchModePopup.querySelector(`menuitem[value="${mode}"]`)
.setAttribute('checked', 'true');
this.placeholder = this._searchModes[mode];
}
}
customElements.define("quick-search-textbox", QuickSearchTextbox);
}

2
chrome/content/zotero/searchDialog.xhtml
View file

@ -6,7 +6,7 @@
<!DOCTYPE bindings SYSTEM "chrome://zotero/locale/searchbox.dtd">
<window
title="Search"
title="&zotero.search.search;"
orient="vertical"
onload="doLoad();"
onunload="doUnload();"

2
chrome/content/zotero/xpcom/utilities_internal.js
View file

@ -1995,7 +1995,7 @@ Zotero.Utilities.Internal = {
*/
setFontSize: function (rootElement) {
var size = Zotero.Prefs.get('fontSize');
rootElement.style.fontSize = size + 'em';
rootElement.style.fontSize = rootElement.style['--zotero-font-size'] = size + 'em';
if (size <= 1) {
size = 'small';
}

94
chrome/content/zotero/xpcom/zotero.js
View file

@ -1591,99 +1591,11 @@ Services.scriptloader.loadSubScript("resource://zotero/polyfill.js");
this.updateQuickSearchBox = function (document) {
// TEMP: Fx78 -- search box is now <search-textbox> custom element. We may need to extend it
// to add a mode menu
return;
var searchBox = document.getElementById('zotero-tb-search');
if(!searchBox) return;
var mode = Zotero.Prefs.get("search.quicksearch-mode");
var prefix = 'zotero-tb-search-mode-';
var prefixLen = prefix.length;
var modes = {
titleCreatorYear: {
label: Zotero.getString('quickSearch.mode.titleCreatorYear')
},
fields: {
label: Zotero.getString('quickSearch.mode.fieldsAndTags')
},
everything: {
label: Zotero.getString('quickSearch.mode.everything')
}
};
if (!modes[mode]) {
Zotero.Prefs.set("search.quicksearch-mode", "fields");
mode = 'fields';
if (searchBox) {
searchBox.updateMode();
}
var hbox = document.getAnonymousNodes(searchBox)[0];
var input = hbox.getElementsByAttribute('class', 'textbox-input')[0];
// Already initialized, so just update selection
var button = hbox.getElementsByAttribute('id', 'zotero-tb-search-menu-button');
if (button.length) {
button = button[0];
var menupopup = button.firstChild;
for (let menuitem of menupopup.childNodes) {
if (menuitem.id.substr(prefixLen) == mode) {
menuitem.setAttribute('checked', true);
searchBox.placeholder = modes[mode].label;
return;
}
}
return;
}
// Otherwise, build menu
button = document.createElement('button');
button.id = 'zotero-tb-search-menu-button';
button.setAttribute('type', 'menu');
var menupopup = document.createXULElement('menupopup');
for (var i in modes) {
var menuitem = document.createXULElement('menuitem');
menuitem.setAttribute('id', prefix + i);
menuitem.setAttribute('label', modes[i].label);
menuitem.setAttribute('name', 'searchMode');
menuitem.setAttribute('type', 'radio');
//menuitem.setAttribute("tooltiptext", "");
menupopup.appendChild(menuitem);
if (mode == i) {
menuitem.setAttribute('checked', true);
menupopup.selectedItem = menuitem;
}
}
menupopup.addEventListener("command", function(event) {
var mode = event.target.id.substr(22);
Zotero.Prefs.set("search.quicksearch-mode", mode);
if (document.getElementById("zotero-tb-search").value == "") {
event.stopPropagation();
}
}, false);
button.appendChild(menupopup);
hbox.insertBefore(button, input);
searchBox.placeholder = modes[mode].label;
// If Alt-Up/Down, show popup
searchBox.addEventListener("keypress", function(event) {
if (event.altKey && (event.keyCode == event.DOM_VK_UP || event.keyCode == event.DOM_VK_DOWN)) {
document.getElementById('zotero-tb-search-menu-button').open = true;
event.stopPropagation();
}
}, false);
}
};
/*

3
chrome/content/zotero/zoteroPane.xhtml
View file

@ -86,6 +86,7 @@
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/tabs.js", this);
Services.scriptloader.loadSubScript("chrome://zotero/content/zoteroPane.js", this);
@ -849,7 +850,7 @@
<toolbarbutton id="zotero-tb-advanced-search" class="zotero-tb-button" tooltiptext="&zotero.toolbar.advancedSearch;" command="cmd_zotero_advancedSearch"/>
<spacer flex="1"/>
<image id="zotero-tb-search-spinner" class="zotero-spinner-14" style="display: none"/>
<search-textbox id="zotero-tb-search" timeout="250"
<quick-search-textbox id="zotero-tb-search" timeout="250"
onkeypress="ZoteroPane_Local.handleSearchKeypress(this, event)"
oninput="ZoteroPane_Local.handleSearchInput(this, event)"
oncommand="ZoteroPane_Local.search()"/>

21
chrome/skin/default/zotero/overlay.css
View file

@ -579,26 +579,6 @@
color: gray;
}
#zotero-tb-search
{
font-size: 11px !important;
margin-right: 0;
width: 172px;
}
#zotero-tb-search-menu-button {
margin: 0;
padding: 0;
-moz-appearance: none;
min-width: 0;
cursor: default;
list-style-image: url("chrome://zotero/skin/searchbar-dropmarker.png");
}
#zotero-tb-search-menu-button .button-icon {
width: 7px;
}
#zotero-toolbar
{
visibility: visible !important;
@ -762,5 +742,4 @@
#zotero-tb-sync-error[state=warning] { list-style-image: url(chrome://zotero/skin/warning@2x.png); }
#zotero-tb-sync { list-style-image: url(chrome://zotero/skin/arrow_rotate_static@2x.png); }
#zotero-tb-sync[status=animate] { list-style-image: url(chrome://zotero/skin/arrow_rotate_animated@2x.png); }
#zotero-tb-search-menu-button { list-style-image: url("chrome://zotero/skin/searchbar-dropmarker@2x.png"); }
}

5
chrome/skin/default/zotero/zotero.css
View file

@ -1,9 +1,4 @@
/* Font sizes */
*[zoteroFontSize=medium] #zotero-tb-search, *[zoteroFontSize=large] #zotero-tb-search
{
font-size: 1em !important;
}
*[zoteroFontSize=medium] treechildren::-moz-tree-row
{
height: 1.5em;

1
scss/_quickSearchTextbox.scss Normal file
View file

@ -0,0 +1 @@
@import "components/quickSearchTextbox";

27
scss/components/_quickSearchTextbox.scss Normal file
View file

@ -0,0 +1,27 @@
:host(#zotero-tb-search) {
font-size: var(--zotero-font-size) !important;
margin-right: 0;
width: 172px;
}
#zotero-tb-search-menu-button {
margin: 0;
padding: 0;
-moz-appearance: none;
min-width: 0;
cursor: default;
list-style-image: url("chrome://zotero/skin/searchbar-dropmarker.png");
}
#zotero-tb-search-menu-button .button-icon {
width: 7px;
}
#zotero-tb-search-menu-button .button-menu-dropmarker {
display: none; /* Hide automatic dropmarker */
}
/* BEGIN 2X BLOCK -- DO NOT EDIT MANUALLY -- USE 2XIZE */
@media (min-resolution: 1.25dppx) {
#zotero-tb-search-menu-button { list-style-image: url("chrome://zotero/skin/searchbar-dropmarker@2x.png"); }
}

10
scss/linux/_quickSearchTextbox.scss Normal file
View file

@ -0,0 +1,10 @@
#zotero-tb-search-menu-button {
list-style-image: none; /* Dropmarker added automatically on Linux */
-moz-appearance: toolbarbutton-dropdown !important;
width: 12px;
height: 12px;
}
#zotero-tb-search .textbox-search-icon {
visibility: hidden;
}

4
scss/mac/_quickSearchTextbox.scss Normal file
View file

@ -0,0 +1,4 @@
#zotero-tb-search-menu-button {
margin: -6px 0 -6px -18px;
padding: 6px 0 6px 15px;
}

2
scss/quickSearchTextbox-mac.scss Normal file
View file

@ -0,0 +1,2 @@
@import "quickSearchTextbox";
@import "mac/quickSearchTextbox";

2
scss/quickSearchTextbox-unix.scss Normal file
View file

@ -0,0 +1,2 @@
@import "quickSearchTextbox";
@import "linux/quickSearchTextbox";

2
scss/quickSearchTextbox-win.scss Normal file
View file

@ -0,0 +1,2 @@
@import "quickSearchTextbox";
@import "win/quickSearchTextbox";

10
scss/win/_quickSearchTextbox.scss Normal file
View file

@ -0,0 +1,10 @@
#zotero-tb-search-menu-button {
margin: 0 -1px 0 -4px;
padding: 5px 0 5px 5px;
border: 0;
background: transparent;
}
#zotero-tb-search .textbox-search-icon {
visibility: hidden;
}