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

Guidance panel for new save icon

Browse source 
For new installations, a panel will show for the Z icon with a ">"
button to go to a second panel for the save icon. For existing
installations, a panel will show just for the save icon. In both cases,
the panels are non-auto-hiding but are dismissed if clicked on or when a
new content page is loaded.

There's also a new close button, but it's not enabled currently. Might
be useful for panels with embedded links where an accidental click on
the panel alone shouldn't close the panel (like the Firefox customize
mode wizard).
This commit is contained in:
Dan Stillman 2015-06-24 20:01:01 -04:00
parent a909951106
commit 4868095820
10 changed files with 215 additions and 65 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

149
chrome/content/zotero/bindings/guidancepanel.xml
View file

@ -29,32 +29,63 @@
xmlns:xul="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul">
<binding id="guidancepanel">
<resources>
<stylesheet src="chrome://zotero/skin/bindings/guidancepanel.css"/>
</resources>
<implementation>
<!--
@param {Object} [options]
@param {String} [options.text] - Text to use in place of firstRunGuidance.<about>
@param {DOMElement} [options.forEl] - Anchor node
@param {Boolean} [options.force] - Show even if already shown, and don't update
firstRunGuidanceShown.<about> pref
-->
<method name="show">
<parameter name="forEl"/>
<parameter name="text"/>
<parameter name="options"/>
<body>
<![CDATA[
Components.utils.import("resource://gre/modules/Services.jsm");
if(!Zotero.Prefs.get("firstRunGuidance")) return;
var about = this.getAttribute("about"),
pref = "firstRunGuidanceShown."+about,
shown = false;
options = options || {};
let text = options.text;
let useLastText = options.useLastText || false;
let forEl = options.forEl || document.getElementById(this.getAttribute("for"));
let force = options.force || false;
if (!forEl) return;
// Don't show two panels at once
if (Zotero.guidanceBeingShown) {
return;
}
var about = this.getAttribute("about");
var pref = false;
if (about) {
pref = "firstRunGuidanceShown." + about;
let shown = false;
try {
shown = Zotero.Prefs.get(pref);
} catch(e) {};
if(shown) return;
if (shown && !force) {
return;
}
}
Zotero.guidanceBeingShown = true;
var x = this.getAttribute("x"),
y = this.getAttribute("y"),
position = this.getAttribute("position"),
panel = document.getAnonymousNodes(this)[0];
if(!forEl) forEl = document.getElementById(this.getAttribute("for"));
if(!text) text = Zotero.getString("firstRunGuidance."+about);
if (!useLastText) {
if (!text) {
text = Zotero.getString("firstRunGuidance." + about);
}
text = text.split("\n");
var descriptionNode = panel.lastChild;
var descriptionNode = this.id('panel-description');
while (descriptionNode.hasChildNodes()) {
descriptionNode.removeChild(descriptionNode.firstChild);
@ -66,34 +97,62 @@
if(text.length) descriptionNode.appendChild(document.createElementNS(
"http://www.w3.org/1999/xhtml", "br"));
}
}
this.setAttribute('onpopuphidden', 'this.hidden = true');
this.setAttribute(
"onpopuphidden",
"this.hidden = true; "
+ "Zotero.guidanceBeingShown = false; "
+ (this.getAttribute("onpopuphidden") || "")
);
var me = this;
this._initNavButton('back', options.back);
this._initNavButton('forward', options.forward);
var self = this;
var f = function() {
if(me.hasAttribute("foregroundonly") && Services.ww.activeWindow != window) return;
me.hidden = false;
if (self.hasAttribute("foregroundonly") && Services.ww.activeWindow != window) return;
// Hide panel if content page changes
if (self.getAttribute('hideonpagechange') == "true") {
let popupShownListener = function () {
self.removeEventListener("popupshown", popupShownListener);
let appcontent = document.getElementById('appcontent');
let pageHideListener = function () {
appcontent.removeEventListener("pagehide", pageHideListener);
self.hide();
};
appcontent.addEventListener("pagehide", pageHideListener);
};
self.addEventListener("popupshown", popupShownListener);
}
self.hidden = false;
panel.openPopup(forEl, position ? position : "after_start",
x ? parseInt(x, 10) : 0, y ? parseInt(y, 10) : 0, false, false, null);
if (pref) {
Zotero.Prefs.set(pref, true);
}
};
if(this.hasAttribute("delay")) {
if(this.hasAttribute("delay") && !force) {
window.setTimeout(f, this.getAttribute("delay"));
} else {
f();
}
if (this.hasAttribute("noautohide")) {
var listener = function() {
let listener = function () {
panel.removeEventListener("click", listener);
panel.hidePopup();
panel.removeEventListener("click", listener, false);
}
panel.addEventListener("click", listener, false);
};
panel.addEventListener("click", listener);
}
]]>
</body>
</method>
<method name="hide">
<body>
<![CDATA[
@ -101,12 +160,62 @@
]]>
</body>
</method>
<method name="_initNavButton">
<parameter name="dir"/>
<parameter name="nextID"/>
<body><![CDATA[
if (!nextID) {
nextID = this.getAttribute(dir);
}
if (!nextID) {
return;
}
var nextElem = document.getElementById(nextID);
button = this.id(dir + '-button');
button.hidden = false;
var listener = function (event) {
button.removeEventListener("click", listener);
this.hide();
var data = {
force: true
};
// Point the next panel back to this one
data[dir == 'back' ? 'forward' : 'back'] = this.getAttribute('id');
// When going backwards, don't regenerate text
if (dir == 'back') {
data.useLastText = true;
}
nextElem.show(data);
event.stopPropagation();
}.bind(this);
button.addEventListener("click", listener);
]]></body>
</method>
<method name="id">
<parameter name="id"/>
<body><![CDATA[
return document.getAnonymousNodes(this)[0].getElementsByAttribute('anonid', id)[0];
]]></body>
</method>
</implementation>
<content>
<xul:panel orient="horizontal" style="max-width: 400px" type="arrow" align="top" xbl:inherits="noautohide">
<xul:panel type="arrow" align="top" xbl:inherits="noautohide">
<xul:stack>
<xul:hbox align="center">
<xul:image src="chrome://zotero/skin/zotero-new-z-48px.png" style="margin-right: 10px; width: 48px; height: 48px;"/>
<xul:description flex="1"></xul:description>
<xul:description anonid="panel-description" flex="1"></xul:description>
</xul:hbox>
<xul:hbox anonid="close-button-box">
<xul:toolbarbutton anonid="close-button" class="close-icon" hidden="true"/>
</xul:hbox>
<xul:hbox anonid="nav-buttons">
<xul:toolbarbutton anonid="back-button" oncommand="hide()" hidden="true"/>
<xul:toolbarbutton anonid="forward-button" oncommand="hide()" hidden="true"/>
</xul:hbox>
</xul:stack>
</xul:panel>
</content>
</binding>

8
chrome/content/zotero/bindings/itembox.xml
View file

@ -1874,10 +1874,14 @@
if(field === 'creator') {
// Reset creator mode settings here so that flex attribute gets reset
this.switchCreatorMode(row, (otherFields.fieldMode ? 1 : 0), true);
Zotero.debug("HERE");
if(Zotero.ItemTypes.getName(this.item.itemTypeID) === "bookSection") {
Zotero.debug("YES");
var creatorTypeLabels = document.getAnonymousNodes(this)[0].getElementsByClassName("creator-type-label");
document.getElementById("zotero-author-guidance").show(creatorTypeLabels[creatorTypeLabels.length-1]);
Zotero.debug(creatorTypeLabels[creatorTypeLabels.length-1] + "");
document.getElementById("zotero-author-guidance").show({
forEl: creatorTypeLabels[creatorTypeLabels.length-1]
});
}
}

8
chrome/content/zotero/browser.js
View file

@ -441,14 +441,6 @@ var Zotero_Browser = new function() {
button.tooltipText = tooltiptext;
if (state == tab.CAPTURE_STATE_TRANSLATABLE) {
button.classList.add('translate');
// Show guidance panel if necessary
if (inToolbar) {
button.addEventListener("load", function() {
document.getElementById("zotero-status-image-guidance").show();
});
}
// TODO: Different guidance for web pages?
}
else {
button.classList.remove('translate');

7
chrome/content/zotero/icon.js
View file

@ -61,9 +61,10 @@ CustomizableUI.addListener({
var shortcut = Zotero.getString(
Zotero.isMac ? "general.keys.cmdShift" : "general.keys.ctrlShift"
) + Zotero.Prefs.get("keys.openZotero");
document.getElementById("zotero-toolbar-button-guidance").show(
null, Zotero.getString(property, shortcut)
);
document.getElementById("zotero-main-button-guidance").show({
text: Zotero.getString(property, shortcut)
});
document.getElementById("zotero-save-button-guidance").show();
}
else if (id == getSingleID('save')) {
Zotero_Browser.updateStatus();

9
chrome/content/zotero/overlay.xul
View file

@ -50,9 +50,12 @@
<stack id="zotero-pane-stack" persist="savedHeight" savedHeight="300" hidden="true"/>
<zoteroguidancepanel id="zotero-toolbar-button-guidance" about="toolbarButton" for="zotero-toolbar-main-button"
position="bottomcenter topleft" delay="2000" foregroundonly="true"/>
<zoteroguidancepanel id="zotero-status-image-guidance" about="saveIcon" for="zotero-toolbar-save-button" x="17"/>
<zoteroguidancepanel id="zotero-main-button-guidance" about="toolbarButton" for="zotero-toolbar-main-button"
position="bottomcenter topleft" delay="2000" foregroundonly="true" noautohide="true"
hideonpagechange="true" forward="zotero-save-button-guidance"/>
<zoteroguidancepanel id="zotero-save-button-guidance" about="saveButton" for="zotero-toolbar-save-button"
position="bottomcenter topleft" x="-8" delay="2000" foregroundonly="true" noautohide="true"
hideonpagechange="true"/>
<!-- Annotation Toolbar -->
<toolbar id="zotero-annotate-tb" crop="end" insertbefore="content" hidden="true">

2
chrome/locale/en-US/zotero/zotero.properties
View file

@ -999,12 +999,12 @@ connector.error.title = Zotero Connector Error
connector.standaloneOpen = Your database cannot be accessed because Zotero Standalone is currently open. Please view your items in Zotero Standalone.
connector.loadInProgress = Zotero Standalone was launched but is not accessible. If you experienced an error opening Zotero Standalone, restart Firefox.
firstRunGuidance.saveIcon = Zotero has found a reference on this page. Click this icon in the address bar to save the reference to your Zotero library.
firstRunGuidance.authorMenu = Zotero lets you specify editors and translators, too. You can turn an author into an editor or translator by selecting from this menu.
firstRunGuidance.quickFormat = Type a title or author to search for a reference.\n\nAfter you've made your selection, click the bubble or press Ctrl-\u2193 to add page numbers, prefixes, or suffixes. You can also include a page number along with your search terms to add it directly.\n\nYou can edit citations directly in the word processor document.
firstRunGuidance.quickFormatMac = Type a title or author to search for a reference.\n\nAfter you've made your selection, click the bubble or press Cmd-\u2193 to add page numbers, prefixes, or suffixes. You can also include a page number along with your search terms to add it directly.\n\nYou can edit citations directly in the word processor document.
firstRunGuidance.toolbarButton.new = Click here to open Zotero, or use the %S keyboard shortcut.
firstRunGuidance.toolbarButton.upgrade = The Zotero icon can now be found in the Firefox toolbar. Click the icon to open Zotero, or use the %S keyboard shortcut.
firstRunGuidance.saveButton = Click this button to save any web page to your Zotero library. On some pages, Zotero will be able to save full details, including author and date.
styles.bibliography = Bibliography
styles.editor.save = Save Citation Style

51
chrome/skin/default/zotero/bindings/guidancepanel.css Normal file
View file

@ -0,0 +1,51 @@
stack {
max-width: 400px;
margin: 0;
padding: 0;
}
*[anonid=nav-buttons] {
-moz-box-align: end;
-moz-box-pack: end;
}
*[anonid=nav-buttons] > toolbarbutton {
width: 22px;
height: 22px;
border: 1px solid lightgray;
border-radius: 3px;
background-position: 5px 5px;
background-size: 10px;
background-repeat: no-repeat;
margin: 0;
margin-bottom: -7px;
}
*[anonid=nav-buttons] > toolbarbutton:hover {
border-color: var(--toolbarbutton-hover-bordercolor);
box-shadow: var(--toolbarbutton-hover-boxshadow);
}
*[anonid=nav-buttons] > toolbarbutton:active:hover {
border-color: var(--toolbarbutton-active-bordercolor);
box-shadow: var(--toolbarbutton-active-boxshadow);
transition-duration: 10ms;
}
*[anonid=back-button] {
background-image: url("chrome://zotero/skin/chevron-left_808080_32.png");
}
*[anonid=forward-button] {
margin-right: -16px;
background-image: url("chrome://zotero/skin/chevron-right_808080_32.png");
}
*[anonid=close-button-box] {
-moz-box-align: start;
-moz-box-pack: end;
}
*[anonid=close-button] {
margin: -16px -16px;
}

BIN
chrome/skin/default/zotero/chevron-left_808080_32.png Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 347 B

BIN
chrome/skin/default/zotero/chevron-right_808080_32.png Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 353 B

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

@ -1,13 +1,3 @@
#zotero-status-image {
width: 16px;
height: 16px;
margin-right: 3px;
}
#zotero-status-image:not(.translate):not(:hover) {
filter: grayscale(100%);
}
#zotero-pane
{
min-height: 32px; /* must match value in ZoteroPane.updateTagSelectorSize() */