Print Preview: Display a throbber when the user requests the system print

chrome/browser/resources/print_preview/print_preview.js

Index: chrome/browser/resources/print_preview/print_preview.js
diff --git a/chrome/browser/resources/print_preview/print_preview.js b/chrome/browser/resources/print_preview/print_preview.js
index 0b6c7a6dec801939fcc644edf6bab6fa5a961958..adf22b0e7a5c29a5e468301033c38f3c68cba863 100644
--- a/chrome/browser/resources/print_preview/print_preview.js
+++ b/chrome/browser/resources/print_preview/print_preview.js
@@ -13,7 +13,7 @@ var totalPageCount;
 // requested more often than necessary.
 var previouslySelectedPages = [];
 
-// Timer id of the page range textfield. It is used to reset the timer whenever
+// Timer id of the page range text field. It is used to reset the timer whenever
 // needed.
 var timerId;
 
@@ -48,6 +48,10 @@ var isTabHidden = false;
 // True when draft preview data is requested for preview.
 var draftDocument = true;
 
+// True if the user has click 'Advanced...' in order to open the system print
+// dialog.
+var showingSystemDialog = false;
+
 /**
  * Window onload handler, sets up the page and starts print preview by getting
  * the printer list.
@@ -58,14 +62,16 @@ function onLoad() {
   $('cancel-button').addEventListener('click', handleCancelButtonClick);
 
   if (!checkCompatiblePluginExists()) {
+    disableInputElementsInSidebar();
     displayErrorMessageWithButton(localStrings.getString('noPlugin'),
                                   localStrings.getString('launchNativeDialog'),
-                                  showSystemDialog);
+                                  launchNativePrintDialog);
     $('mainview').parentElement.removeChild($('dummy-viewer'));
     return;
   }
 
-  $('system-dialog-link').addEventListener('click', showSystemDialog);
+  $('print-button').focus();

[dpapad, 2011/06/28 02:25:30]

Why remove the autofocus attribute from the html and add this here?

[James Hawkins, 2011/06/28 04:02:34]

autofocus is somewhat crappy and focuses disabled fields; we'd have to call
blur() when disabling input fields otherwise, which is even more hacky. Also,
all other WebUI explicitly sets focus using JS focus() (except for a loner in
bookmark manager).

+  $('system-dialog-link').addEventListener('click', onSystemDialogLinkClicked);
   $('mainview').parentElement.removeChild($('dummy-viewer'));
 
   $('printer-list').disabled = true;
@@ -169,13 +175,22 @@ function removeEventListeners() {
   $('portrait').onclick = null;
   $('printer-list').onchange = null;
 
-  // Controls that dont require preview rendering.
+  // Controls that don't require preview rendering.
   $('two-sided').onclick = null;
   $('color').onclick = null;
   $('bw').onclick = null;
 }
 
 /**
+ * Disables the input elements in the sidebar.
+ */
+function disableInputElementsInSidebar() {
+  var els = $('sidebar').querySelectorAll('input, button, select');
+  for (var i = 0; i < els.length; i++)
+    els[i].disabled = true;
+}
+
+/**
  * Asks the browser to close the preview tab.
  */
 function handleCancelButtonClick() {
@@ -183,9 +198,24 @@ function handleCancelButtonClick() {
 }
 
 /**
- * Asks the browser to show the native print dialog for printing.
+ * Disables the controls in the sidebar, shows the throbber and instructs the
+ * backend to open the native print dialog.
+ */
+function onSystemDialogLinkClicked() {
+  showingSystemDialog = true;
+  disableInputElementsInSidebar();
+  $('system-dialog-throbber').classList.remove('hidden');
+  chrome.send('showSystemDialog');
+}
+
+/**
+ * Similar to onSystemDialogLinkClicked(), but specific to the
+ * 'Launch native print dialog' UI.
  */
-function showSystemDialog() {
+function launchNativePrintDialog() {
+  showingSystemDialog = true;
+  $('error-button').disabled = true;
+  $('native-print-dialog-throbber').classList.remove('hidden');
   chrome.send('showSystemDialog');
 }
 
@@ -660,10 +690,6 @@ function updatePrintPreview(pageCount, jobTitle, modifiable, previewUid) {
  * @param {string} previewUid Preview unique identifier.
  */
 function createPDFPlugin(previewUid) {
-  // Enable the print button.
-  if (!$('printer-list').disabled)
-    $('print-button').disabled = false;
-
   var pdfViewer = $('pdf-viewer');
   if (pdfViewer) {
     // Need to call this before the reload(), where the plugin resets its
@@ -704,6 +730,9 @@ function checkCompatiblePluginExists() {
  * 2) The number of copies is valid (if applicable).
  */
 function updatePrintButtonState() {
+  if (showingSystemDialog)
+    return;
+
   if (getSelectedPrinterName() == PRINT_TO_PDF) {
     $('print-button').disabled = !isSelectedPagesValid();
   } else {