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

Show first-run banner on upgrade (#3807)

Browse source
This commit is contained in:
Abe Jellinek 2024-03-07 10:12:36 -05:00 committed by Dan Stillman
parent 1cdb364361
commit 5f717d3bde
9 changed files with 198 additions and 71 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

6
chrome/content/zotero/xpcom/prefs.js
View file

@ -44,7 +44,7 @@ Zotero.Prefs = new function() {
// Process pref version updates
var fromVersion = this.get('prefVersion');
var toVersion = 11;
var toVersion = 12;
if (!fromVersion) {
this.set('prefVersion', toVersion);
}
@ -138,6 +138,10 @@ Zotero.Prefs = new function() {
case 11:
await Zotero.LocateManager.migrateEngines();
break;
case 12:
Zotero.Prefs.set('firstRunGuidanceShown.z7Banner', false);
break;
}
}
this.set('prefVersion', toVersion);

31
chrome/content/zotero/zoteroPane.js
View file

@ -114,6 +114,7 @@ var ZoteroPane = new function()
zp.addEventListener('UIPropertiesChanged', () => {
this.collectionsView?.updateFontSize();
this.itemsView?.updateFontSize();
this.updatePostUpgradeBanner();
});
Zotero.UIProperties.registerRoot(document.getElementById('zotero-context-pane'));
this.itemPane = document.querySelector("#zotero-item-pane");
@ -629,6 +630,7 @@ var ZoteroPane = new function()
}
setTimeout(function () {
ZoteroPane.showPostUpgradeBanner();
ZoteroPane.showRetractionBanner();
ZoteroPane.showArchitectureWarning();
ZoteroPane.initSyncReminders(true);
@ -6143,6 +6145,35 @@ var ZoteroPane = new function()
};
this.showPostUpgradeBanner = function () {
if (Zotero.isBetaBuild || Zotero.Prefs.get('firstRunGuidanceShown.z7Banner')) {
return;
}
document.getElementById('post-upgrade-container').removeAttribute('collapsed');
this.updatePostUpgradeBanner();
};
this.updatePostUpgradeBanner = function () {
document.getElementById('post-upgrade-density').value = Zotero.Prefs.get('uiDensity');
};
this.hidePostUpgradeBanner = function (remindMeLater = false) {
document.getElementById('post-upgrade-container').setAttribute('collapsed', true);
if (remindMeLater) {
// The pref should already be false if the banner was showing, but just in case
Zotero.Prefs.set('firstRunGuidanceShown.z7Banner', false);
setTimeout(() => {
this.showPostUpgradeBanner();
}, 1000 * 60 * 60 * 24); // 24 hours
}
else {
Zotero.Prefs.set('firstRunGuidanceShown.z7Banner', true);
}
};
/**
* Sets the layout to either a three-vertical-pane layout and a layout where itemsPane is above itemPane
*/

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

@ -1081,23 +1081,62 @@
onkeyup="ZoteroPane_Local.handleKeyUp(event, this.id)"
onkeypress="ZoteroPane_Local.handleKeyPress(event)">
<vbox id="post-upgrade-container" collapsed="true" role="status">
<html:div id="post-upgrade-banner">
<html:div id="post-upgrade-centered">
<html:div
data-l10n-id="post-upgrade-message"
data-l10n-args='{"version": "7"}'>
<html:a
data-l10n-name="new-features-link"
id="post-upgrade-new-features-link"
class="link"
onclick="Zotero.launchURL(ZOTERO_CONFIG.NEW_FEATURES_URL)"
tabindex="0"
/>
</html:div>
<html:div>•</html:div>
<html:div data-l10n-id="post-upgrade-density"/>
<radiogroup
id="post-upgrade-density"
orient="horizontal"
oncommand="Zotero.Prefs.set('uiDensity', this.value)"
>
<radio value="comfortable" data-l10n-id="menu-ui-density-comfortable"/>
<radio value="compact" data-l10n-id="menu-ui-density-compact"/>
</radiogroup>
</html:div>
<html:div id="post-upgrade-buttons">
<button
data-l10n-id="post-upgrade-remind-me-later"
oncommand="ZoteroPane.hidePostUpgradeBanner(true)"
/>
<button
data-l10n-id="post-upgrade-done"
oncommand="ZoteroPane.hidePostUpgradeBanner(false)"
default="true"
/>
</html:div>
</html:div>
</vbox>
<vbox id="sync-reminder-container" collapsed="true" role="status">
<html:div id="sync-reminder-banner">
<html:div id="sync-reminder-message"/>
<html:a id="sync-reminder-action" class="sync-reminder-link"/>
<html:a id="sync-reminder-learn-more" class="sync-reminder-link"/>
<html:div id="sync-reminder-spacer"/>
<html:a id="sync-reminder-disable" class="sync-reminder-link"/>
<html:a id="sync-reminder-remind" class="sync-reminder-link"/>
<label is="text-link" id="sync-reminder-close">×</label>
<html:div id="sync-reminder-message" class="message"/>
<html:a id="sync-reminder-action" class="link"/>
<html:a id="sync-reminder-learn-more" class="link"/>
<html:div class="spacer"/>
<html:a id="sync-reminder-disable" class="link"/>
<html:a id="sync-reminder-remind" class="link"/>
<label is="text-link" id="sync-reminder-close" class="close-link">×</label>
</html:div>
</vbox>
<vbox id="retracted-items-container" collapsed="true" role="status">
<html:div id="retracted-items-banner">
<html:div id="retracted-items-message"/>
<html:div id="retracted-items-message" class="message"/>
<label is="text-link" id="retracted-items-link"/>
<label is="text-link" id="retracted-items-close">×</label>
<label is="text-link" id="retracted-items-close" class="close-link">×</label>
</html:div>
</vbox>

8
chrome/locale/en-US/zotero/zotero.ftl
View file

@ -12,6 +12,7 @@ general-choose-file = Choose File…
general-open-settings = Open Settings
general-help = Help
general-tag = Tag
general-done = Done
menu-file-show-in-finder =
.label = Show in Finder
@ -668,3 +669,10 @@ file-type-video = Video
file-type-presentation = Presentation
file-type-document = Document
file-type-ebook = Ebook
post-upgrade-message = Learn about the <a data-l10n-name="new-features-link">new features in { -app-name } { $version }</a>
post-upgrade-density = Choose your preferred layout density:
post-upgrade-remind-me-later =
.label = { general-remind-me-later }
post-upgrade-done =
.label = { general-done }

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

@ -333,67 +333,6 @@ TODO: Replace with SVG
height: 16px;
}
#retracted-items-banner, #sync-reminder-banner {
display: flex;
justify-content: center;
background: #d93425;
line-height: 2.2em;
font-weight: 600;
color: white;
font-size: 13.5px;
text-align: center;
padding: 0 2em;
position: relative;
white-space: nowrap;
overflow: hidden;
}
#sync-reminder-banner {
background: rgb(255, 234, 80);
border-bottom: #a9a9a9 .5px solid;
color: black;
}
#retracted-items-message, #sync-reminder-message {
margin-right: .8em;
}
#sync-reminder-spacer {
flex: 1;
}
#retracted-items-link, .sync-reminder-link, #retracted-items-close, #sync-reminder-close {
color: inherit;
border: none;
margin: 0;
}
#retracted-items-link {
margin-left: .3em;
}
.sync-reminder-link {
padding-left: 0.5em;
padding-right: 0.5em;
}
#retracted-items-link:active {
color: #f9e8e2;
}
.sync-reminder-link:active {
color: #4b4b4b;
}
#retracted-items-close, #sync-reminder-close {
text-decoration: none;
position: absolute;
cursor: pointer;
top: -2px;
right: 9px;
font-size: 22px;
}
/* Missing in Fx60 */
.autocomplete-richlistbox {
border: 1px solid transparent;

1
defaults/preferences/zotero.js
View file

@ -45,6 +45,7 @@ pref("extensions.zotero.showTrashWhenEmpty", true);
pref("extensions.zotero.trashAutoEmptyDays", 30);
pref("extensions.zotero.viewOnDoubleClick", true);
pref("extensions.zotero.firstRunGuidance", true);
pref("extensions.zotero.firstRunGuidanceShown.z7Banner", true);
pref("extensions.zotero.showConnectorVersionWarning", true);
pref("extensions.zotero.reopenPanesOnRestart", true);

1
resource/config.js
View file

@ -31,6 +31,7 @@ var ZOTERO_CONFIG = {
GET_INVOLVED_URL: 'https://www.zotero.org/getinvolved',
DICTIONARIES_URL: 'https://download.zotero.org/dictionaries/',
PLUGINS_URL: 'https://www.zotero.org/support/plugins',
NEW_FEATURES_URL: 'https://www.zotero.org/blog/zotero-7/'
};
if (typeof exports === 'object' && typeof module !== 'undefined') {

1
scss/_zotero.scss
View file

@ -63,6 +63,7 @@
@import "components/tabsMenu";
@import "components/newCollectionDialog";
@import "components/reader";
@import "components/banners";
// Elements
// --------------------------------------------------

103
scss/components/_banners.scss Normal file
View file

@ -0,0 +1,103 @@
#post-upgrade-banner, #retracted-items-banner, #sync-reminder-banner {
display: flex;
justify-content: center;
text-align: center;
position: relative;
white-space: nowrap;
overflow: hidden;
label[is="text-link"], .link {
color: inherit;
border: none;
margin: 0;
}
}
#post-upgrade-container {
background: var(--material-background);
}
#post-upgrade-banner {
background: var(--accent-blue30);
color: var(--fill-primary);
flex-wrap: wrap;
gap: 8px;
padding: 8px 12px;
.link {
color: var(--accent-blue);
text-decoration: underline;
cursor: pointer;
}
#post-upgrade-centered {
display: flex;
align-items: center;
justify-content: center;
flex-wrap: wrap;
gap: 8px;
flex: 1 auto;
}
#post-upgrade-new-features-link {
font-weight: bold;
}
#post-upgrade-buttons {
display: flex;
flex-wrap: wrap;
gap: 8px;
margin-inline-start: auto;
}
}
#retracted-items-banner, #sync-reminder-banner {
line-height: 2.2em;
font-size: 13.5px;
padding: 0 2em;
font-weight: 600;
.message {
margin-inline-end: .8em;
}
.spacer {
flex: 1;
}
.close-link {
text-decoration: none;
position: absolute;
cursor: pointer;
top: -2px;
inset-inline-end: 9px;
font-size: 22px;
}
}
#retracted-items-banner {
background: #d93425;
color: white;
label[is="text-link"] {
margin-inline-start: 0.3em;
&:active {
color: #f9e8e2;
}
}
}
#sync-reminder-banner {
background: rgb(255, 234, 80);
border-bottom: #a9a9a9 .5px solid;
color: black;
.link {
padding-inline: 0.5em;
&:active {
color: #4b4b4b;
}
}
}