Update About dialog

- Replace Developers section with text that links to RRCHNM, the credits page, and Get Involved. - Remove dedicated zotero.org link - Only show link underlines on hover
Juris-M · Jul 8, 2017 · a7e2e73 · a7e2e73
1 parent 73ac743
commit a7e2e73
Show file tree

Hide file tree

Showing 3 changed files with 59 additions and 31 deletions.
diff --git a/chrome/content/zotero/about.xul b/chrome/content/zotero/about.xul
@@ -17,9 +17,6 @@
 
 	<vbox id="aboutcontent">
 		<label id="name" value="Zotero"/>
-		<hbox>
-			<label class="zotero-text-link" href="https://www.zotero.org" value="https://www.zotero.org"/>
-		</hbox>
 		<hbox>
 			<label id="version"/>
 			<label class="zotero-text-link" href="https://www.zotero.org/support/changelog" value="&zotero.whatsNew;"/>
@@ -29,29 +26,44 @@
 		</script>
 		<hbox>
 			<vbox id="column1">
-				<label class="subhead" value="&zotero.createdby;"/>
-				<vbox class="subcontent">
-					<label class="zotero-text-link" href="https://rrchnm.org/" value="Roy Rosenzweig Center for History and New Media"/>
-					<label value="George Mason University"/>
-					<label value="Fairfax, VA, USA"/>
-				</vbox>
-				<label class="subhead" value="&zotero.director;"/>
-				<vbox class="subcontent">
-					<label value="Sean Takats"/>
-				</vbox>
-				<label class="subhead" value="&zotero.developers;"/>
-				<vbox class="subcontent">
-					<label value="Dan Stillman"/>
-					<label value="Simon Kornblith"/>
-					<label value="Faolan Cheslack-Postava"/>
-				</vbox>
+				<div id="about-text" xmlns="http://www.w3.org/1999/xhtml">
+					<p id="created-by"></p>
+					<p id="get-involved"></p>
+					<script><![CDATA[
+						// Replace [links] in localized strings with spans with onclick handlers
+						//
+						// TODO: Use helper function in common with intro text in itemTreeView.js
+						document.getElementById('created-by').innerHTML =
+							Zotero.Utilities.htmlSpecialChars(Zotero.getString('about.createdBy'))
+							.replace(
+								/\[([^\]]+)](.+)\[([^\]]+)]/,
+								`<span data-href="https://rrchnm.org/">$1</span>`
+									+ '$2'
+									+ `<span data-href="https://www.zotero.org/support/credits_and_acknowledgments">$3</span>`
+							);
+						
+						document.getElementById('get-involved').innerHTML =
+							Zotero.Utilities.htmlSpecialChars(Zotero.getString('about.getInvolved'))
+							.replace(
+								/\[([^\]]+)]/,
+								`<span data-href="https://www.zotero.org/getinvolved/">$1</span>`
+							);
+						
+						// Activate text links
+						for (let span of document.getElementById('about-text').getElementsByTagName('span')) {
+							span.className = 'text-link';
+							span.onclick = function () {
+								window.opener.ZoteroPane.loadURI(this.getAttribute('data-href'));
+							};
+						}
+					]]></script>
+				</div>
 				<label class="subhead" value="&zotero.thanks;"/>
 				<vbox class="subcontent">
 					<label class="zotero-text-link" href="http://www.mellon.org/" value="Andrew W. Mellon Foundation"/>
 					<label class="zotero-text-link" href="http://www.imls.gov/" value="Institute of Museum and Library Services"/>
 					<label class="zotero-text-link" href="http://www.sloan.org/" value="Alfred P. Sloan Foundation"/>
 				</vbox>
-				<label class="zotero-text-link" href="https://www.zotero.org/support/credits_and_acknowledgments" value="&zotero.moreCreditsAndAcknowledgements;"/>
 			</vbox>
 			<vbox id="column2">
 				<label class="subhead" value="&zotero.citationProcessing;"/>

diff --git a/chrome/locale/en-US/zotero/zotero.properties b/chrome/locale/en-US/zotero/zotero.properties
@@ -67,6 +67,9 @@ general.operationInProgress = A Zotero operation is currently in progress.
 general.operationInProgress.waitUntilFinished = Please wait until it has finished.
 general.operationInProgress.waitUntilFinishedAndTryAgain = Please wait until it has finished and try again.
 
+about.createdBy = Zotero is a project of the [Roy Rosenzweig Center for History and New Media] and is developed by a [global community].
+about.getInvolved = Want to help? [Get involved] today!
+
 punctuation.openingQMark		= "
 punctuation.closingQMark		= "
 punctuation.colon				= :

diff --git a/chrome/skin/default/zotero/about.css b/chrome/skin/default/zotero/about.css
@@ -11,6 +11,15 @@ dialog
 	padding: 10px;
 }
 
+#column1 {
+	width: 33em;
+	padding-right: 2em;
+}
+
+#column2 {
+	margin-right: 1em;
+}
+
 #name
 {
 	font-size: large;
@@ -38,21 +47,25 @@ dialog
 	margin-bottom: 5px;
 }
 
-#zotero-translators-list {
-	margin: .3em 0;
-	height: 9em;
-	overflow: -moz-scrollbars-vertical;
+#about-text > p {
+	margin-left: .5em;
+	line-height: 1.4em;
 }
 
-#zotero-translators-list label.locale {
-	font-weight: bold;
-	margin-top: .5em;
+span.text-link {
+	cursor: pointer;
+	color: -moz-nativehyperlinktext;
+}
+
+span.text-link:hover {
+	text-decoration: underline;
 }
 
-#zotero-translators-list label.locale:first-child {
-	margin-top: 0;
+/* Remove default underline from XUL links */
+label.zotero-text-link {
+	text-decoration: none;
 }
 
-#zotero-translators-list label:not(.locale) {
-	margin-left: 1.25em;
+label.zotero-text-link:hover {
+	text-decoration: underline;
 }