Print Preview: Making the UI not block when preview is generated

chrome/browser/resources/print_preview.js

Index: chrome/browser/resources/print_preview.js
diff --git a/chrome/browser/resources/print_preview.js b/chrome/browser/resources/print_preview.js
index b9b935f8406d619802c192c6899e5381c9d9f776..100ab3390d839c65907aa7340a94a0ef757ce0da 100644
--- a/chrome/browser/resources/print_preview.js
+++ b/chrome/browser/resources/print_preview.js
@@ -13,11 +13,6 @@ var totalPageCount = -1;
 // requested more often than necessary.
 var previouslySelectedPages = [];
 
-// The previously selected layout mode. It is used in order to prevent the
-// preview from updating when the user clicks on the already selected layout
-// mode.
-var previouslySelectedLayout = null;
-
 // Timer id of the page range textfield. It is used to reset the timer whenever
 // needed.
 var timerId;
@@ -38,6 +33,9 @@ var previewModifiable = false;
 const PRINT_TO_PDF = 'Print To PDF';
 const MANAGE_PRINTERS = 'Manage Printers';
 
+// State of the print preview settings.
+var settingsState = new SettingsState();
+
 /**
  * Window onload handler, sets up the page and starts print preview by getting
  * the printer list.
@@ -55,33 +53,66 @@ function onLoad() {
 
   $('printer-list').disabled = true;
   $('print-button').disabled = true;
-  $('print-button').addEventListener('click', printFile);
-  $('all-pages').addEventListener('click', onPageSelectionMayHaveChanged);
-  $('copies').addEventListener('input', copiesFieldChanged);
-  $('print-pages').addEventListener('click', handleIndividualPagesCheckbox);
-  $('individual-pages').addEventListener('blur', function() {
-      clearTimeout(timerId);
-      onPageSelectionMayHaveChanged();
-  });
-  $('individual-pages').addEventListener('focus', addTimerToPageRangeField);
-  $('individual-pages').addEventListener('input', resetPageRangeFieldTimer);
-  $('two-sided').addEventListener('click', handleTwoSidedClick)
-  $('landscape').addEventListener('click', onLayoutModeToggle);
-  $('portrait').addEventListener('click', onLayoutModeToggle);
-  $('color').addEventListener('click', function() { setColor(true); });
-  $('bw').addEventListener('click', function() { setColor(false); });
-  $('printer-list').addEventListener(
-      'change', updateControlsWithSelectedPrinterCapabilities);
-  $('increment').addEventListener('click',
-                                  function() { onCopiesButtonsClicked(1); });
-  $('decrement').addEventListener('click',
-                                  function() { onCopiesButtonsClicked(-1); });
   $('controls').onsubmit = function() { return false; };
   $('dancing-dots').classList.remove('invisible');
   chrome.send('getPrinters');
 }
 
 /**
+ * Adds event listeners to the settings controls.
+ */
+function addEventListeners() {
+  var individualPages = $('individual-pages');
+  $('print-button').onclick = printFile;
+  $('all-pages').onclick = onPageSelectionMayHaveChanged;
+
+  // Controls that require preview rendering.
+  $('print-pages').onclick = handleIndividualPagesCheckbox;
+  individualPages.onblur = function() {
+      clearTimeout(timerId);
+      onPageSelectionMayHaveChanged();
+  };
+  individualPages.onfocus = addTimerToPageRangeField;
+  individualPages.oninput = resetPageRangeFieldTimer;
+  $('landscape').onclick = onLayoutModeToggle;
+  $('portrait').onclick = onLayoutModeToggle;
+  $('printer-list').onchange = updateControlsWithSelectedPrinterCapabilities;
+
+  // Controls that dont require preview rendering.
+  $('copies').oninput = copiesFieldChanged;
+  $('two-sided').onclick = handleTwoSidedClick;
+  $('color').onclick = function() { setColor(true); };
+  $('bw').onclick = function() { setColor(false); };
+  $('increment').onclick = function() { onCopiesButtonsClicked(1); };
+  $('decrement').onclick = function() { onCopiesButtonsClicked(-1); };
+}
+
+/**
+ * Removes event listeners from the settings controls.
+ */
+function removeEventListeners() {
+  var individualPages = $('individual-pages');
+
+  // Controls that require preview rendering.
+  $('print-pages').onclick = null;
+  individualPages.onblur = null;
+  individualPages.onfocus = null;
+  individualPages.oninput = null;
+  clearTimeout(timerId);
+  $('landscape').onclick = null;
+  $('portrait').onclick = null;
+  $('printer-list').onchange = null;
+
+  // Controls that dont require preview rendering.
+  $('copies').oninput = null;
+  $('two-sided').onclick = null;
+  $('color').onclick = null;
+  $('bw').onclick = null;
+  $('increment').onclick = null;
+  $('decrement').onclick = null;
+}
+
+/**
  * Asks the browser to close the preview tab.
  */
 function handleCancelButtonClick() {
@@ -318,8 +349,9 @@ function printFile() {
  * Asks the browser to generate a preview PDF based on current print settings.
  */
 function requestPrintPreview() {
+  removeEventListeners();
   isPreviewStillLoading = true;
-  setControlsDisabled(true);
+  settingsState.save();
   $('dancing-dots').classList.remove('invisible');
   chrome.send('getPreview', [getSettingsJSON()]);
 }
@@ -437,6 +469,9 @@ function onPDFLoad() {
  *
  */
 function updatePrintPreview(pageCount, jobTitle, modifiable) {
+  var tempSettingsState = new SettingsState();
+  tempSettingsState.save();
+
   previewModifiable = modifiable;
 
   if (totalPageCount == -1)
@@ -446,8 +481,22 @@ function updatePrintPreview(pageCount, jobTitle, modifiable) {
     for (var i = 0; i < totalPageCount; i++)
       previouslySelectedPages.push(i+1);
 
-  if (previouslySelectedLayout == null)
-    previouslySelectedLayout = $('portrait');
+  if (settingsState.deviceName != tempSettingsState.deviceName) {
+    updateControlsWithSelectedPrinterCapabilities();
+    return;
+  } else if (settingsState.isLandscape != tempSettingsState.isLandscape) {
+    requestPrintPreview();
+    return;
+  } else if (getSelectedPagesValidityLevel() != 1) {
+    pageRangesFieldChanged();
+  } else if (getSelectedPagesValidityLevel() == 1) {
+    var currentlySelectedPages = getSelectedPagesSet();
+    if (!areArraysEqual(previouslySelectedPages, currentlySelectedPages)) {
+      previouslySelectedPages = currentlySelectedPages;
+      requestPrintPreview();
+      return;
+    }
+  }
 
   // Update the current tab title.
   document.title = localStrings.getStringF('printPreviewTitleFormat', jobTitle);
@@ -455,6 +504,7 @@ function updatePrintPreview(pageCount, jobTitle, modifiable) {
   createPDFPlugin();
   isPreviewStillLoading = false;
   updatePrintSummary();
+  addEventListeners();
 }
 
 /**
@@ -664,14 +714,10 @@ function handleIndividualPagesCheckbox() {
  * Even if they are still valid the content of these pages will be different.
  */
 function onLayoutModeToggle() {
-  var currentlySelectedLayout = $('portrait').checked ? $('portrait') :
-      $('landscape');
-
   // If the chosen layout is same as before, nothing needs to be done.
-  if (previouslySelectedLayout == currentlySelectedLayout)
+  if (settingsState.isLandscape == isLandscape())
     return;
 
-  previouslySelectedLayout = currentlySelectedLayout;
   $('individual-pages').classList.remove('invalid');
   setDefaultValuesAndRegeneratePreview();
 }
@@ -899,3 +945,23 @@ function onCopiesButtonsClicked(sign) {
   copiesFieldChanged();
 }
 
+/**
+ * Class that represents the state of the print settings.
+ */
+function SettingsState() {
+  this.deviceName = '';
+  this.isLandscape = '';

[dpapad, 2011/05/23 18:00:58]

I think that more state variables (defined at the top of this file) could be
eventually moved in this class.

+}
+
+/**
+ * Takes a snapshot of the print settings.
+ */
+SettingsState.prototype.save = function() {
+  var printerList = $('printer-list')
+  var selectedPrinter = printerList.selectedIndex;
+  if (selectedPrinter >= 0)
+    this.deviceName = printerList.options[selectedPrinter].value;
+  else
+    this.deviceName = '';
+  this.isLandscape = isLandscape();
+}