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

chrome/browser/resources/print_preview.js

 // Copyright (c) 2011 The Chromium Authors. All rights reserved.
 // Use of this source code is governed by a BSD-style license that can be
 // found in the LICENSE file.
 
 var localStrings = new LocalStrings();
 
 // The total page count of the previewed document regardless of which pages the
 // user has selected.
 var totalPageCount = -1;
 
 // The previously selected pages by the user. It is used in
 // onPageSelectionMayHaveChanged() to make sure that a new preview is not
 // 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;
 
 // Store the last selected printer index.
 var lastSelectedPrinterIndex = 0;
 
-// Indicates whether a preview has been requested but not received yet.
-var isPreviewStillLoading = true;
-
-// Currently selected printer capabilities.
-var printerCapabilities;
-
 // Used to disable some printing options when the preview is not modifiable.
 var previewModifiable = false;
 
 // Destination list special value constants.
 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.
  */
 function onLoad() {
   $('system-dialog-link').addEventListener('click', showSystemDialog);
   $('cancel-button').addEventListener('click', handleCancelButtonClick);
 
   if (!checkCompatiblePluginExists()) {
     displayErrorMessage(localStrings.getString('noPlugin'));
     $('mainview').parentElement.removeChild($('dummy-viewer'));
     return;
   }
   $('mainview').parentElement.removeChild($('dummy-viewer'));
 
   $('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() {
   chrome.send('closePrintPreviewTab');
 }
 
 /**
  * Asks the browser to show the native print dialog for printing.
  */
 function showSystemDialog() {
@@ skipping 37 matching lines @@
 
   // Regenerate the preview data based on selected printer settings.
   setDefaultValuesAndRegeneratePreview();
 }
 
 /**
  * Updates the controls with printer capabilities information.
  * @param {Object} settingInfo printer setting information.
  */
 function updateWithPrinterCapabilities(settingInfo) {
-  printerCapabilities = settingInfo;
-
-  if (isPreviewStillLoading)
-    return;
-
   var disableColorOption = settingInfo.disableColorOption;
   var setColorAsDefault = settingInfo.setColorAsDefault;
   var colorOption = $('color');
   var bwOption = $('bw');
 
   if (disableColorOption)
     $('color-options').classList.add("hidden");
   else
     $('color-options').classList.remove("hidden");
 
@@ skipping 154 matching lines @@
  * Asks the browser to print the preview PDF based on current print settings.
  */
 function printFile() {
   chrome.send('print', [getSettingsJSON()]);
 }
 
 /**
  * Asks the browser to generate a preview PDF based on current print settings.
  */
 function requestPrintPreview() {
-  isPreviewStillLoading = true;
-  setControlsDisabled(true);
+  removeEventListeners();
+  settingsState.save();
   $('dancing-dots').classList.remove('invisible');
   chrome.send('getPreview', [getSettingsJSON()]);
 }
 
 /**
  * Fill the printer list drop down.
  * Called from PrintPreviewHandler::SendPrinterList().
  * @param {Array} printers Array of printer info objects.
  * @param {number} defaultPrinterIndex The index of the default printer.
  */
@@ skipping 46 matching lines @@
     return;
   }
   pdfViewer.grayscale(!color);
 }
 
 /**
  * Display an error message in the center of the preview area.
  * @param (string) errorMessage The error message to be displayed.
  */
 function displayErrorMessage(errorMessage) {
-  isPreviewStillLoading = false;
   $('dancing-dots').classList.remove('invisible');
   $('dancing-dots-text').classList.add('hidden');
   $('error-text').innerHTML = errorMessage;
   $('error-text').classList.remove('hidden');
   setControlsDisabled(true);
 
   var pdfViewer = $('pdf-viewer');
   if (pdfViewer)
     $('mainview').removeChild(pdfViewer);
 }
 
 /**
  * Display an error message when print preview fails.
  * Called from PrintPreviewMessageHandler::OnPrintPreviewFailed().
  */
 function printPreviewFailed() {
   displayErrorMessage(localStrings.getString('previewFailed'));
 }
 
 /**
  * Called when the PDF plugin loads its document.
  */
 function onPDFLoad() {
   if (isLandscape())
     $('pdf-viewer').fitToWidth();
   else
     $('pdf-viewer').fitToHeight();
 
   $('dancing-dots').classList.add('invisible');
-  setControlsDisabled(false);
 
   if (!previewModifiable) {
     $('landscape').disabled = true;
     $('portrait').disabled = true;
   }
 
   updateCopiesButtonsState();
-  updateWithPrinterCapabilities(printerCapabilities);
 }
 
 /**
  * Update the print preview when new preview data is available.
  * Create the PDF plugin as needed.
  * Called from PrintPreviewUI::PreviewDataIsAvailable().
  * @param {number} pageCount The expected total pages count.
  * @param {string} jobTitle The print job title.
  * @param {boolean} modifiable If the preview is modifiable.
  *
  */
 function updatePrintPreview(pageCount, jobTitle, modifiable) {
+  var tempSettingsState = new SettingsState();
+  tempSettingsState.save();
+
   previewModifiable = modifiable;
 
   if (totalPageCount == -1)
     totalPageCount = pageCount;
 
   if (previouslySelectedPages.length == 0)
     for (var i = 0; i < totalPageCount; i++)
       previouslySelectedPages.push(i+1);
 
-  if (previouslySelectedLayout == null)
-    previouslySelectedLayout = $('portrait');
+  if (settingsState.deviceName != tempSettingsState.deviceName) {
+    updateControlsWithSelectedPrinterCapabilities();
+    return;

[James Hawkins, 2011/05/23 20:49:45]

You have returns on three of these cases, but not the third case. Inconsistent.

[dpapad, 2011/05/23 21:05:50]

This is intentional though. In case the page range field has changed while the
preview was generated and the current value is not valid we dont want to return,
we want to show the document and just display the "invalid page range" message.

[James Hawkins, 2011/05/23 21:12:30]

Ah sorry, thought the code below was in a separate method. Consider refactoring
this; it is a bit unreadable.

+  } 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);
 
   createPDFPlugin();
-  isPreviewStillLoading = false;
   updatePrintSummary();
+  addEventListeners();
 }
 
 /**
  * Create the PDF plugin or reload the existing one.
  */
 function createPDFPlugin() {
   // Enable the print button.
   if (!$('printer-list').disabled) {
     $('print-button').disabled = false;
   }
@@ skipping 189 matching lines @@
   $('individual-pages').focus();
 }
 
 /**
  * When the user switches printing orientation mode the page field selection is
  * reset to "all pages selected". After the change the number of pages will be
  * different and currently selected page numbers might no longer be valid.
  * 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();
 }
 
 /**
  * Sets the default values and sends a request to regenerate preview data.
  */
 function setDefaultValuesAndRegeneratePreview() {
   $('individual-pages').value = '';
   hideInvalidHint($('individual-pages-hint'));
@@ skipping 207 matching lines @@
     copiesField.value = 1;
   else {
     var newValue = getCopies() + sign * 1;
     if (newValue < copiesField.min || newValue > copiesField.max)
       return;
     copiesField.value = newValue;
   }
   copiesFieldChanged();
 }
 
+/**
+ * Class that represents the state of the print settings.
+ */
+function SettingsState() {

[James Hawkins, 2011/05/23 20:49:45]

s/SettingsState/PrintSettings/

SettingsState is too ambiguous.

[dpapad, 2011/05/23 21:05:50]

Done.

+  this.deviceName = '';
+  this.isLandscape = '';
+}
+
+/**
+ * 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();
+}