Tweak Windows appearance (Linux still to come)

chrome/content/zotero-platform/mac/integration.css

@@ -0,0 +1,83 @@
+body {
+	line-height: 1.45em;
+}
+
+body[multiline="true"] {
+	line-height: 1.63em;
+}
+
+#quick-format-dialog {
+	background: transparent;
+	-moz-appearance: none;
+	padding: 0;
+}
+
+#quick-format-search {
+	height: 22px;
+	background: white;
+	-moz-appearance: searchfield;
+}
+
+#quick-format-search[multiline="true"] {
+	padding: 2px 2px 0 18px;
+	border: 1px solid rgba(0, 0, 0, 0.5);
+	border-radius: 10px;
+	-moz-appearance: none;
+}
+
+#quick-format-search:not([multiline="true"]) {
+	height: 22px !important;
+}
+
+#quick-format-search[multiline="true"] > #quick-format-iframe {
+	margin: -1px 0 0 0;
+}
+
+#quick-format-entry {
+	background: -moz-linear-gradient(-90deg, rgb(243,123,119) 0, rgb(180,47,38) 50%, rgb(156,36,27) 50%);
+	-moz-border-radius:15px;
+	padding: 10px;
+}
+
+#zotero-icon {
+	margin: 0 0 0 -13px;
+}
+
+#citation-properties menulist {
+	-moz-appearance: none; color: #fff;
+	text-shadow: 0 -1px 0 rgba(0,0,0,.5);
+	border-radius: 12px;
+	border: 1px solid rgba(0,0,0,.65);
+	background: -moz-linear-gradient(rgba(110,110,110,.9), rgba(70,70,70,.9) 49%, rgba(50,50,50,.9) 51%, rgba(40,40,40,.9));
+	box-shadow: inset 0 1px 0 rgba(255,255,255,.2), inset 0 0 1px rgba(255,255,255,.1), 0 1px 0 rgba(255,255,255,.1);
+	background-clip: padding-box;
+	background-origin: padding-box;
+	padding: 2px 9px;
+	border-radius: 3px;
+	min-height: 22px;
+	-moz-padding-start: 4px;
+	-moz-padding-end: 0;
+}
+
+#citation-properties menulist:-moz-focusring {
+	box-shadow: 0 0 1px -moz-mac-focusring inset, 0 0 4px 1px -moz-mac-focusring, 0 0 2px 1px -moz-mac-focusring;
+}
+
+#citation-properties menulist[open="true"],
+#citation-properties menulist:hover:active {
+	background: -moz-linear-gradient(rgba(40,40,40,.9), rgba(70,70,70,.9));
+	box-shadow: inset 0 0 3px rgba(0,0,0,.2), inset 0 1px 7px rgba(0,0,0,.4), 0 1px 0 rgba(255,255,255,.1);
+}
+
+#citation-properties menulist > .menulist-dropmarker {
+	-moz-appearance: none;
+	display: -moz-box;
+	background-color: transparent;
+	border: 0;
+	margin: 0;
+	padding: 0;
+}
+
+#citation-properties menulist > .menulist-dropmarker > .dropmarker-icon {
+	list-style-image: url("chrome://browser/skin/hud-style-dropmarker-double-arrows.png");
+}

chrome/content/zotero-platform/win/integration.css

@@ -0,0 +1,42 @@
+#quick-format-dialog {
+	background: transparent;
+	-moz-appearance: -moz-win-borderless-glass;
+	padding: 0;
+}
+
+#quick-format-search {
+	background: white;
+	padding: 2px 2px 2px 0;
+	border: 1px solid rgba(0, 0, 0, 0.5);
+	border-radius: 10px;
+	-moz-appearance: none;
+}
+
+#quick-format-dialog {
+	background: transparent;
+	-moz-appearance: none;
+	padding: 0;
+}
+
+#quick-format-search:not([multiline="true"]) {
+	height: 28px !important;
+}
+
+#quick-format-entry {
+	background: -moz-linear-gradient(-90deg, rgb(243,123,119) 0, rgb(180,47,38) 50%, rgb(156,36,27) 50%);
+	-moz-border-radius:15px;
+	padding: 10px;
+}
+
+#zotero-icon {
+	margin: 2px 0 0 2px;
+	-moz-appearance: none;
+}
+
+body {
+	line-height: 1.65em;
+}
+
+body[multiline="true"] {
+	padding-bottom: 2px;
+}

chrome/content/zotero/integration/quickFormat.js

@@ -35,16 +35,16 @@ var Zotero_QuickFormat = new function () {
 	this.onDOMContentLoaded = function() {
 		io = window.arguments[0].wrappedJSObject;
 		
+		// Only hide chrome on Windows or Mac
+		if(Zotero.isMac || Zotero.isWin) {
+			document.documentElement.setAttribute("hidechrome", true);
+		}
+		
 		qfs = document.getElementById("quick-format-search");
 		qfi = document.getElementById("quick-format-iframe");
 		qfb = document.getElementById("quick-format-entry");
 		qfbHeight = qfb.scrollHeight;
 		referencePanel = document.getElementById("quick-format-reference-panel");
-		referencePanel.addEventListener("popuphidden", _refocusQfe, false);
-		referencePanel.addEventListener("popupshown", _refocusQfe, false);
-		referencePanel.addEventListener("focus", _refocusQfe, false);
-		referencePanel.addEventListener("activate", _refocusQfe, false);
-		referencePanel.addEventListener("keypress", _onReferencePanelKeypress, false);
 		referenceBox = document.getElementById("quick-format-reference-list");
 		qfiWindow = qfi.contentWindow;
 		qfiDocument = qfi.contentDocument;
@@ -103,6 +103,7 @@ var Zotero_QuickFormat = new function () {
 	function _refocusQfe() {
 		window.focus();
 		qfe.focus();
+		referencePanel.blur();
 	}
 	
 	/**
@@ -421,18 +422,19 @@ var Zotero_QuickFormat = new function () {
 		var numReferences = referenceBox.childNodes.length, height;
 		var qfeHeight = qfe.scrollHeight;
 		
-		if(qfeHeight > 20) {
+		if(qfeHeight > 30) {
-			var height = (22-16+qfeHeight+(qfs.style.height == "22px" ? 2 : -2));
+			qfe.setAttribute("multiline", true);
-			window.resizeTo(window.innerWidth, height+20);
-			qfs.style.height = height+"px";
-			qfe.style.lineHeight = "18px";
 			qfs.setAttribute("multiline", true);
-		} else {
+			qfeHeight = qfe.scrollHeight;
-			var height = 22;
+			var height = 4+qfeHeight;
-			window.resizeTo(window.innerWidth, height+20);
+			
 			qfs.style.height = height+"px";
-			qfe.style.lineHeight = "16px";
+			window.sizeToContent();
+		} else {
+			delete qfs.style.height;
+			qfe.removeAttribute("multiline");
 			qfs.removeAttribute("multiline");
+			window.sizeToContent();
 		}
 		
 		var panelShowing = referencePanel.state === "open" || referencePanel.state === "showing";
@@ -441,12 +443,12 @@ var Zotero_QuickFormat = new function () {
 			var height = referenceHeight ? Math.min(numReferences, SHOWN_REFERENCES)*referenceHeight+2 : 39;
 			
 			if(panelShowing && height !== referencePanel.clientHeight) {
-				referencePanel.sizeTo((window.innerWidth-30), height);
+				referencePanel.sizeTo((window.outerWidth-30), height);
 				/*if(curResizer) curResizer.stop();
 				curResizer = new Resizer(referencePanel, null, height, 30, 1000);
 				curResizer.animate();*/
 			} else {
-				referencePanel.sizeTo((window.innerWidth-30), height);
+				referencePanel.sizeTo((window.outerWidth-30), height);
 				referencePanel.openPopup(document.documentElement, "after_start", 15, null,
 					false, false, null);
 				
@@ -454,7 +456,6 @@ var Zotero_QuickFormat = new function () {
 					referenceHeight = referenceBox.firstChild.scrollHeight;
 					height = Math.min(numReferences, SHOWN_REFERENCES)*referenceHeight+2;
 					referencePanel.sizeTo((window.innerWidth-30), height);
-					window.setTimeout(_refocusQfe, 100);
 				}
 			}
 		} else {
@@ -634,79 +635,77 @@ var Zotero_QuickFormat = new function () {
 	 * Handle return or escape
 	 */
 	function _onQuickSearchKeyPress(event) {
-		try {
+		var keyCode = event.keyCode;
-			var keyCode = event.keyCode;
+		if(keyCode === event.DOM_VK_RETURN || keyCode === event.DOM_VK_ENTER) {
-			if(keyCode === event.DOM_VK_RETURN || keyCode === event.DOM_VK_ENTER) {
+			event.preventDefault();
+			if(!_bubbleizeSelected()) {
+				_accept();
+			}
+		} else if(keyCode === event.DOM_VK_TAB || event.charCode === 59 /* ; */) {
+			event.preventDefault();
+			_bubbleizeSelected();
+		} else if(keyCode === event.DOM_VK_BACK_SPACE) {
+			_resize();
+		} else if(keyCode === event.DOM_VK_UP) {
+			var selectedItem = referenceBox.selectedItem;
+			var previousSibling;
+			if((previousSibling = selectedItem.previousSibling)) {
+				referenceBox.selectedItem = previousSibling;
+				referenceBox.ensureElementIsVisible(previousSibling);
 				event.preventDefault();
-				if(!_bubbleizeSelected()) {
+			};
-					_accept();
+		} else if(keyCode === event.DOM_VK_DOWN) {
-				}
+			if((Zotero.isMac ? event.metaKey : event.ctrlKey)) {
-			} else if(keyCode === event.DOM_VK_TAB || event.charCode === 59 /* ; */) {
+				// If meta key is held down, show the citation properties panel
-				event.preventDefault();
+				var selection = qfiWindow.getSelection();
-				_bubbleizeSelected();
+				var range = selection.getRangeAt(0);
-			} else if(keyCode === event.DOM_VK_UP) {
+				
-				var selectedItem = referenceBox.selectedItem;
+				// Check whether the bubble is selected
-				var previousSibling;
+				var endContainer = range.endContainer;
-				if((previousSibling = selectedItem.previousSibling)) {
+				if(endContainer !== qfe) {
-					referenceBox.selectedItem = previousSibling;
+					if(range.endContainer.citationItem) {
-					referenceBox.ensureElementIsVisible(previousSibling);
+						_showCitationProperties(range.endContainer);
-					event.preventDefault();
+					} else if(endContainer.nodeType === Node.TEXT_NODE) {
-				};
+						if(endContainer.parentNode === qfe) {
-			} else if(keyCode === event.DOM_VK_DOWN) {
+							var node = endContainer;
-				if((Zotero.isMac ? event.metaKey : event.ctrlKey)) {
+							while((node = endContainer.previousSibling)) {
-					// If meta key is held down, show the citation properties panel
+								if(node.citationItem) {
-					var selection = qfiWindow.getSelection();
+									_showCitationProperties(node);
-					var range = selection.getRangeAt(0);
+									event.preventDefault();
-					
+									return;
-					// Check whether the bubble is selected
-					var endContainer = range.endContainer;
-					if(endContainer !== qfe) {
-						if(range.endContainer.citationItem) {
-							_showCitationProperties(range.endContainer);
-						} else if(endContainer.nodeType === Node.TEXT_NODE) {
-							if(endContainer.parentNode === qfe) {
-								var node = endContainer;
-								while((node = endContainer.previousSibling)) {
-									if(node.citationItem) {
-										_showCitationProperties(node);
-										event.preventDefault();
-										return;
-									}
 								}
 							}
 						}
+					}
+					event.preventDefault();
+					return;
+				}
+				
+				// Check whether there is a bubble in the range
+				var endOffset = range.endOffset;
+				var childNodes = qfe.childNodes;
+				for(var i=Math.min(endOffset, childNodes.length-1); i>=0; i--) {
+					var node = childNodes[i];
+					if(node.citationItem) {
+						_showCitationProperties(node);
 						event.preventDefault();
 						return;
 					}
-					
-					// Check whether there is a bubble in the range
-					var endOffset = range.endOffset;
-					var childNodes = qfe.childNodes;
-					for(var i=Math.min(endOffset, childNodes.length-1); i>=0; i--) {
-						var node = childNodes[i];
-						if(node.citationItem) {
-							_showCitationProperties(node);
-							event.preventDefault();
-							return;
-						}
-					}
-					
-					event.preventDefault();
-				} else {
-					var selectedItem = referenceBox.selectedItem;
-					var nextSibling;
-					if((nextSibling = selectedItem.nextSibling)) {
-						referenceBox.selectedItem = nextSibling;
-						referenceBox.ensureElementIsVisible(nextSibling);
-						event.preventDefault();
-					};
 				}
+				
+				event.preventDefault();
 			} else {
-				// Use a timeout so that _quickFormat gets called after update
+				var selectedItem = referenceBox.selectedItem;
-				window.setTimeout(_quickFormat, 0);
+				var nextSibling;
+				if((nextSibling = selectedItem.nextSibling)) {
+					referenceBox.selectedItem = nextSibling;
+					referenceBox.ensureElementIsVisible(nextSibling);
+					event.preventDefault();
+				};
 			}
-		} catch(e) {
+		} else {
-			Zotero.logError(e);
+			// Use a timeout so that _quickFormat gets called after update
+			window.setTimeout(_quickFormat, 0);
 		}
 	}
 	

chrome/content/zotero/integration/quickFormat.xul

@@ -25,22 +25,19 @@
 -->
 <?xml-stylesheet href="chrome://global/skin/" type="text/css"?>
 <?xml-stylesheet href="chrome://global/skin/browser.css" type="text/css"?>
-<?xml-stylesheet href="chrome://zotero/skin/zotero.css" type="text/css"?>
-<?xml-stylesheet href="chrome://zotero/skin/overlay.css" type="text/css"?>
-<?xml-stylesheet href="chrome://zotero-platform/content/overlay.css" type="text/css"?>
 <?xml-stylesheet href="chrome://zotero/skin/integration.css" type="text/css"?>
+<?xml-stylesheet href="chrome://zotero-platform/content/integration.css" type="text/css"?>
 <!DOCTYPE window SYSTEM "chrome://zotero/locale/zotero.dtd">
 
 <window
-	id="zotero-quick-format-dialog"
+	id="quick-format-dialog"
 	orient="vertical"
 	title="Quick Format Citation"
-	width="500" height="44"
+	width="600" height="42"
 	xmlns:html="http://www.w3.org/1999/xhtml"
 	xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"
 	persist="screenX screenY"
-	style="background: transparent; -moz-appearance:none; padding: 0"
+	onkeypress="Zotero_QuickFormat.onKeyPress(event)">
-	hidechrome="true" onkeypress="Zotero_QuickFormat.onKeyPress(event)">
 	
 	<script src="../include.js"/>
 	<script src="quickFormat.js"/>
@@ -60,13 +57,12 @@
 							oncommand="Zotero_QuickFormat.onClassicViewCommand()"/>
 					</menupopup>
 				</toolbarbutton>
-				<!-- javascript:encodeURIComponent('<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><link rel="stylesheet" type="text/css" href="chrome://zotero/skin/integration.css"/></head><body id="quick-format-editor"/></html>') -->
+				<iframe id="quick-format-iframe" ondragstart="event.stopPropagation()" src="data:application/xhtml+xml,%3C!DOCTYPE%20html%20PUBLIC%20%22-//W3C//DTD%20XHTML%201.0%20Strict//EN%22%20%22http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd%22%3E%3Chtml%20xmlns=%22http://www.w3.org/1999/xhtml%22%3E%3Chead%3E%3Clink%20rel=%22stylesheet%22%20type=%22text/css%22%20href=%22chrome://zotero/skin/integration.css%22/%3E%3Clink%20rel=%22stylesheet%22%20type=%22text/css%22%20href=%22chrome://zotero-platform/content/integration.css%22/%3E%3C/head%3E%3Cbody%20contenteditable=%22true%22%20id=%22quick-format-editor%22/%3E%3C/html%3E"
-				<iframe id="quick-format-iframe" ondragstart="event.stopPropagation()" src="data:application/xhtml+xml,%3C!DOCTYPE%20html%20PUBLIC%20%22-%2F%2FW3C%2F%2FDTD%20XHTML%201.0%20Strict%2F%2FEN%22%20%22http%3A%2F%2Fwww.w3.org%2FTR%2Fxhtml1%2FDTD%2Fxhtml1-strict.dtd%22%3E%3Chtml%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxhtml%22%3E%3Chead%3E%3Clink%20rel%3D%22stylesheet%22%20type%3D%22text%2Fcss%22%20href%3D%22chrome%3A%2F%2Fzotero%2Fskin%2Fintegration.css%22%2F%3E%3C%2Fhead%3E%3Cbody%20contenteditable%3D%22true%22%20id%3D%22quick-format-editor%22%2F%3E%3C%2Fhtml%3E"
 					tabindex="1" flex="1"/>
 			</hbox>
 		</hbox>
 	</vbox>
-	<panel id="quick-format-reference-panel" noautofocus="true" noautohide="true" norestorefocus="true" onfocus="window.focus()" onpopupshowing="window.focus()">
+	<panel id="quick-format-reference-panel" noautofocus="true" norestorefocus="true">
 		<richlistbox id="quick-format-reference-list" flex="1"/>
 	</panel>
 	<panel id="citation-properties" type="arrow" orient="vertical" onkeypress="Zotero_QuickFormat.onPanelKeyPress(event)">

chrome/skin/default/zotero/integration.css

@@ -122,10 +122,6 @@
 	border-color: #6d95e0;
 }
 
-.quick-format-bubble:hover {
-	background-color: #bbcef1;
-}
-
 .quick-format-bubble[selected="true"] {
 	-moz-border-radius: 8px !important;
 	background-color: #598bec;
@@ -135,30 +131,14 @@
 #quick-format-search {
 	margin: 0;
 	padding: 0;
-	background: white;
-	height: 22px;
 	padding-top: 0;
 	padding-bottom: 0;
-	-moz-appearance: searchfield;
-}
-
-#quick-format-search[multiline="true"] {
-	padding: 2px 2px 0 18px;
-	border: 1px solid rgba(0, 0, 0, 0.5);
-	border-radius: 10px;
-	-moz-appearance: none;
-}
-
-#quick-format-search[multiline="true"] > #quick-format-iframe {
-	margin: -1px 0 0 0;
 }
 
 body {
 	margin: 0 2px 0 2px;
 	padding: 0;
 	font: -moz-field;
-	font-size: 11px;
-	line-height: 16px;
 	overflow: hidden;
 }
 
@@ -167,7 +147,6 @@ body {
 	font: -moz-field;
 	-moz-user-focus: normal;
 	padding: 5px;
-	max-height: 39px;
 }
 
 .quick-format-item:not(:last-child) {
@@ -181,15 +160,10 @@ richlistitem[selected="true"] {
 	color: HighlightText;
 }
 
-#quick-format-entry {
-	background: -moz-linear-gradient(-90deg, rgb(243,123,119) 0, rgb(180,47,38) 50%, rgb(156,36,27) 50%);
-	-moz-border-radius:15px;
-	padding: 10px;
-}
-
 #quick-format-reference-panel {
 	margin: 0;
 	padding: 0;
+	border: none;
 	background: white;
 	opacity: 0.9;
 	-moz-user-focus: ignore;
@@ -201,50 +175,11 @@ richlistitem[selected="true"] {
 	-moz-user-focus: ignore;
 }
 
-#citation-properties menulist {
-	-moz-appearance: none; color: #fff;
-	text-shadow: 0 -1px 0 rgba(0,0,0,.5);
-	border-radius: 12px;
-	border: 1px solid rgba(0,0,0,.65);
-	background: -moz-linear-gradient(rgba(110,110,110,.9), rgba(70,70,70,.9) 49%, rgba(50,50,50,.9) 51%, rgba(40,40,40,.9));
-	box-shadow: inset 0 1px 0 rgba(255,255,255,.2), inset 0 0 1px rgba(255,255,255,.1), 0 1px 0 rgba(255,255,255,.1);
-	background-clip: padding-box;
-	background-origin: padding-box;
-	padding: 2px 9px;
-	border-radius: 3px;
-	min-height: 22px;
-	-moz-padding-start: 4px;
-	-moz-padding-end: 0;
-}
-
-#citation-properties menulist:-moz-focusring {
-	box-shadow: 0 0 1px -moz-mac-focusring inset, 0 0 4px 1px -moz-mac-focusring, 0 0 2px 1px -moz-mac-focusring;
-}
-
-#citation-properties menulist[open="true"],
-#citation-properties menulist:hover:active {
-	background: -moz-linear-gradient(rgba(40,40,40,.9), rgba(70,70,70,.9));
-	box-shadow: inset 0 0 3px rgba(0,0,0,.2), inset 0 1px 7px rgba(0,0,0,.4), 0 1px 0 rgba(255,255,255,.1);
-}
-
-#citation-properties menulist > .menulist-dropmarker {
-	-moz-appearance: none;
-	display: -moz-box;
-	background-color: transparent;
-	border: 0;
-	margin: 0;
-	padding: 0;
-}
-
-#citation-properties menulist > .menulist-dropmarker > .dropmarker-icon {
-	list-style-image: url("chrome://browser/skin/hud-style-dropmarker-double-arrows.png");
-}
-
 #zotero-icon {
 	list-style-image: url("chrome://zotero/skin/zotero-new-z-16px.png");
 	background-color: #fff;
-	margin: 0 0 0 -13px;
 	padding: 0;
+	margin: 0;
 }
 
 #zotero-icon .toolbarbutton-text {
@@ -254,6 +189,8 @@ richlistitem[selected="true"] {
 #zotero-icon .toolbarbutton-icon {
 	width: 16px;
 	height: 16px;
+	padding: 0;
+	margin: 0;
 }
 
 #citation-properties #suppress-author {