Adds option to enable CSS backgrounds for printing.

BUG=113594 Review URL: https://chromiumcodereview.appspot.com/11818062 git-svn-id: svn://svn.chromium.org/chrome/trunk/src@176617 0039d316-1c4b-4281-b951-d872f2087c98
FairyWorld · Jan 14, 2013 · 19d1c2d · 19d1c2d
1 parent 57f6212
commit 19d1c2d
Show file tree

Hide file tree

Showing 20 changed files with 457 additions and 11 deletions.
diff --git a/chrome/app/generated_resources.grd b/chrome/app/generated_resources.grd
@@ -8766,6 +8766,9 @@ The following plug-in is unresponsive: <ph name="PLUGIN_NAME">$1
       <message name="IDS_PRINT_PREVIEW_OPTION_FIT_TO_PAGE" desc="Checkbox label shown in print preview page to auto fit the PDF page.">
         Fit to page
       </message>
+      <message name="IDS_PRINT_PREVIEW_OPTION_BACKGROUND_COLORS_AND_IMAGES" desc="Checkbox label shown in print preview page to print webpage backgrounds.">
+        Background colors and images
+      </message>
       <message name="IDS_PRINT_PREVIEW_MARGINS_LABEL" desc="Margins option label. Provides user the option to change the margins of the printed page.">
         Margins
       </message>

diff --git a/chrome/browser/printing/printing_message_filter.cc b/chrome/browser/printing/printing_message_filter.cc
@@ -78,6 +78,7 @@ void RenderParamsFromPrintSettings(const printing::PrintSettings& settings,
   params->date = settings.date;
   params->title = settings.title;
   params->url = settings.url;
+  params->should_print_backgrounds = settings.should_print_backgrounds;
 }
 
 }  // namespace

diff --git a/chrome/browser/resources/print_preview/data/app_state.js b/chrome/browser/resources/print_preview/data/app_state.js
@@ -79,6 +79,13 @@ cr.define('print_preview', function() {
      * @private
      */
     this.isCollateEnabled_ = null;
+
+    /**
+     * Whether printing CSS backgrounds is enabled.
+     * @type {?boolean}
+     * @private
+     */
+    this.isCssBackgroundEnabled_ = null;
   };
 
   /**
@@ -106,7 +113,8 @@ cr.define('print_preview', function() {
     IS_DUPLEX_ENABLED: 'isDuplexEnabled',
     IS_HEADER_FOOTER_ENABLED: 'isHeaderFooterEnabled',
     IS_LANDSCAPE_ENABLED: 'isLandscapeEnabled',
-    IS_COLLATE_ENABLED: 'isCollateEnabled'
+    IS_COLLATE_ENABLED: 'isCollateEnabled',
+    IS_CSS_BACKGROUND_ENABLED: 'isCssBackgroundEnabled'
   };
 
   /**
@@ -168,6 +176,11 @@ cr.define('print_preview', function() {
       return this.isCollateEnabled_;
     },
 
+    /** @return {?boolean} Whether printing CSS backgrounds is enabled. */
+    get isCssBackgroundEnabled() {
+      return this.isCssBackgroundEnabled_;
+    },
+
     /**
      * Initializes the app state from a serialized string returned by the native
      * layer.
@@ -216,6 +229,10 @@ cr.define('print_preview', function() {
         if (state.hasOwnProperty(AppState.Field_.IS_COLLATE_ENABLED)) {
           this.isCollateEnabled_ = state[AppState.Field_.IS_COLLATE_ENABLED];
         }
+        if (state.hasOwnProperty(AppState.Field_.IS_CSS_BACKGROUND_ENABLED)) {
+          this.isCssBackgroundEnabled_ =
+              state[AppState.Field_.IS_CSS_BACKGROUND_ENABLED];
+        }
       }
     },
 
@@ -303,6 +320,16 @@ cr.define('print_preview', function() {
       this.persist_();
     },
 
+    /**
+     * Persists whether printing CSS backgrounds is enabled.
+     * @param {?boolean} isCssBackgroundEnabled Whether printing CSS
+     *     backgrounds is enabled.
+     */
+    persistIsCssBackgroundEnabled: function(isCssBackgroundEnabled) {
+      this.isCssBackgroundEnabled_ = isCssBackgroundEnabled;
+      this.persist_();
+    },
+
     /**
      * Calls into the native layer to persist the application state.
      * @private
@@ -325,6 +352,8 @@ cr.define('print_preview', function() {
           this.isHeaderFooterEnabled_;
       obj[AppState.Field_.IS_LANDSCAPE_ENABLED] = this.isLandscapeEnabled_;
       obj[AppState.Field_.IS_COLLATE_ENABLED] = this.isCollateEnabled_;
+      obj[AppState.Field_.IS_CSS_BACKGROUND_ENABLED] =
+          this.isCssBackgroundEnabled_;
       chrome.send(AppState.NATIVE_FUNCTION_NAME_, [JSON.stringify(obj)]);
     }
   };

diff --git a/chrome/browser/resources/print_preview/data/print_ticket_store.js b/chrome/browser/resources/print_preview/data/print_ticket_store.js
@@ -151,6 +151,14 @@ cr.define('print_preview', function() {
     this.fitToPage_ = new print_preview.ticket_items.FitToPage(
         this.documentInfo_, this.destinationStore_);
 
+    /**
+     * Print CSS backgrounds ticket item.
+     * @type {!print_preview.ticket_items.CssBackground}
+     * @private
+     */
+    this.cssBackground_ =
+        new print_preview.ticket_items.CssBackground(this.documentInfo_);
+
     /**
      * Keeps track of event listeners for the print ticket store.
      * @type {!EventTracker}
@@ -289,6 +297,8 @@ cr.define('print_preview', function() {
       this.headerFooter_.updateValue(this.appState_.isHeaderFooterEnabled);
       this.landscape_.updateValue(this.appState_.isLandscapeEnabled);
       this.collate_.updateValue(this.appState_.isCollateEnabled);
+      this.cssBackground_.updateValue(
+          this.appState_.isCssBackgroundEnabled);
     },
 
     /** @return {boolean} Whether the ticket store has the copies capability. */
@@ -608,6 +618,34 @@ cr.define('print_preview', function() {
       }
     },
 
+    /**
+     * @return {boolean} Whether the print CSS backgrounds capability is
+     *     available.
+     */
+    hasCssBackgroundCapability: function() {
+      return this.cssBackground_.isCapabilityAvailable();
+    },
+
+    /**
+     * @return {boolean} Whether the print CSS backgrounds capability is
+     *     enabled.
+     */
+    isCssBackgroundEnabled: function() {
+      return this.cssBackground_.getValue();
+    },
+
+    /**
+     * @param {boolean} isCssBackgroundEnabled Whether to enable the
+     *     print CSS backgrounds capability.
+     */
+    updateCssBackground: function(isCssBackgroundEnabled) {
+      if (this.cssBackground_.getValue() != isCssBackgroundEnabled) {
+        this.cssBackground_.updateValue(isCssBackgroundEnabled);
+        this.appState_.persistIsCssBackgroundEnabled(isCssBackgroundEnabled);
+        cr.dispatchSimpleEvent(this, PrintTicketStore.EventType.TICKET_CHANGE);
+      }
+    },
+
     /**
      * @return {boolean} {@code true} if the stored print ticket is valid,
      *     {@code false} otherwise.

diff --git a/chrome/browser/resources/print_preview/data/ticket_items/css_background.js b/chrome/browser/resources/print_preview/data/ticket_items/css_background.js
@@ -0,0 +1,55 @@
+// Copyright (c) 2012 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.
+
+cr.define('print_preview.ticket_items', function() {
+  'use strict';
+
+  /**
+   * Ticket item whose value is a {@code boolean} that represents whether to
+   * print CSS backgrounds.
+   * @param {!print_preview.DocumentInfo} documentInfo Information about the
+   *     document to print.
+   * @constructor
+   * @extends {print_preview.ticket_items.TicketItem}
+   */
+  function CssBackground(documentInfo) {
+    print_preview.ticket_items.TicketItem.call(this);
+
+    /**
+     * Information about the document to print.
+     * @type {!print_preview.DocumentInfo}
+     * @private
+     */
+    this.documentInfo_ = documentInfo;
+  };
+
+  CssBackground.prototype = {
+    __proto__: print_preview.ticket_items.TicketItem.prototype,
+
+    /** @override */
+    wouldValueBeValid: function(value) {
+      return true;
+    },
+
+    /** @override */
+    isCapabilityAvailable: function() {
+      return this.documentInfo_.isModifiable;
+    },
+
+    /** @override */
+    getDefaultValueInternal: function() {
+      return false;
+    },
+
+    /** @override */
+    getCapabilityNotAvailableValueInternal: function() {
+      return false;
+    }
+  };
+
+  // Export
+  return {
+    CssBackground: CssBackground
+  };
+});
diff --git a/chrome/browser/resources/print_preview/native_layer.js b/chrome/browser/resources/print_preview/native_layer.js
@@ -168,7 +168,8 @@ cr.define('print_preview', function() {
         'duplex': printTicketStore.isDuplexEnabled() ?
             NativeLayer.DuplexMode.LONG_EDGE : NativeLayer.DuplexMode.SIMPLEX,
         'copies': printTicketStore.getCopies(),
-        'collate': printTicketStore.isCollateEnabled()
+        'collate': printTicketStore.isCollateEnabled(),
+        'shouldPrintBackgrounds': printTicketStore.isCssBackgroundEnabled()
       };
 
       // Set 'cloudPrintID' only if the destination is not local.
@@ -225,6 +226,7 @@ cr.define('print_preview', function() {
             NativeLayer.DuplexMode.LONG_EDGE : NativeLayer.DuplexMode.SIMPLEX,
         'copies': printTicketStore.getCopies(),
         'collate': printTicketStore.isCollateEnabled(),
+        'shouldPrintBackgrounds': printTicketStore.isCssBackgroundEnabled(),
         'previewModifiable': printTicketStore.isDocumentModifiable,
         'printToPDF': destination.id ==
             print_preview.Destination.GooglePromotedId.SAVE_AS_PDF,

diff --git a/chrome/browser/resources/print_preview/preview_generator.js b/chrome/browser/resources/print_preview/preview_generator.js
@@ -90,6 +90,13 @@ cr.define('print_preview', function() {
      */
     this.marginsType_ = print_preview.ticket_items.MarginsType.Value.DEFAULT;
 
+    /**
+     * Whether the document should have element CSS backgrounds printed.
+     * @type {boolean}
+     * @private
+     */
+    this.isCssBackgroundEnabled_ = false;
+
     /**
      * Destination that was selected for the last preview.
      * @type {print_preview.Destination}
@@ -153,6 +160,8 @@ cr.define('print_preview', function() {
       this.isFitToPageEnabled_ = this.printTicketStore_.isFitToPageEnabled();
       this.pageNumberSet_ = this.printTicketStore_.getPageNumberSet();
       this.marginsType_ = this.printTicketStore_.getMarginsType();
+      this.isCssBackgroundEnabled_ =
+          this.printTicketStore_.isCssBackgroundEnabled();
       this.selectedDestination_ = this.destinationStore_.selectedDestination;
 
       this.inFlightRequestId_++;
@@ -256,6 +265,8 @@ cr.define('print_preview', function() {
               print_preview.ticket_items.MarginsType.Value.CUSTOM &&
               !ticketStore.getCustomMargins().equals(
                   ticketStore.getDocumentMargins())) ||
+          (ticketStore.isCssBackgroundEnabled() !=
+              this.isCssBackgroundEnabled_) ||
           (this.selectedDestination_ !=
               this.destinationStore_.selectedDestination);
     },

diff --git a/chrome/browser/resources/print_preview/print_preview.js b/chrome/browser/resources/print_preview/print_preview.js
@@ -895,6 +895,7 @@ cr.define('print_preview', function() {
 <include src="data/ticket_items/margins_type.js"/>
 <include src="data/ticket_items/page_range.js"/>
 <include src="data/ticket_items/fit_to_page.js"/>
+<include src="data/ticket_items/css_background.js"/>
 
 <include src="native_layer.js"/>
 <include src="print_preview_animations.js"/>

diff --git a/chrome/browser/resources/print_preview/settings/other_options_settings.html b/chrome/browser/resources/print_preview/settings/other_options_settings.html
@@ -20,5 +20,11 @@ <h1 i18n-content="optionsLabel"></h1>
         <span i18n-content="optionTwoSided"></span>
       </label>
     </div>
+    <div class="css-background-container checkbox">
+      <label aria-live="polite">
+        <input class="css-background-checkbox" type="checkbox">
+        <span i18n-content="optionBackgroundColorsAndImages"></span>
+      </label>
+    </div>
   </div>
 </div>
diff --git a/chrome/browser/resources/print_preview/settings/other_options_settings.js b/chrome/browser/resources/print_preview/settings/other_options_settings.js
@@ -63,6 +63,20 @@ cr.define('print_preview', function() {
      * @private
      */
     this.duplexCheckbox_ = null;
+
+    /**
+     * Print CSS backgrounds container element.
+     * @type {HTMLElement}
+     * @private
+     */
+    this.cssBackgroundContainer_ = null;
+
+    /**
+     * Print CSS backgrounds checkbox.
+     * @type {HTMLInputElement}
+     * @private
+     */
+    this.cssBackgroundCheckbox_ = null;
   };
 
   OtherOptionsSettings.prototype = {
@@ -73,6 +87,7 @@ cr.define('print_preview', function() {
       this.headerFooterCheckbox_.disabled = !isEnabled;
       this.fitToPageCheckbox_.disabled = !isEnabled;
       this.duplexCheckbox_.disabled = !isEnabled;
+      this.cssBackgroundCheckbox_.disabled = !isEnabled;
     },
 
     /** @override */
@@ -90,6 +105,10 @@ cr.define('print_preview', function() {
           this.duplexCheckbox_,
           'click',
           this.onDuplexCheckboxClick_.bind(this));
+      this.tracker.add(
+          this.cssBackgroundCheckbox_,
+          'click',
+          this.onCssBackgroundCheckboxClick_.bind(this));
       this.tracker.add(
           this.printTicketStore_,
           print_preview.PrintTicketStore.EventType.INITIALIZE,
@@ -117,6 +136,8 @@ cr.define('print_preview', function() {
       this.fitToPageCheckbox_ = null;
       this.duplexContainer_ = null;
       this.duplexCheckbox_ = null;
+      this.cssBackgroundContainer_ = null;
+      this.cssBackgroundCheckbox_ = null;
     },
 
     /** @override */
@@ -133,6 +154,10 @@ cr.define('print_preview', function() {
           '.duplex-container');
       this.duplexCheckbox_ = this.duplexContainer_.querySelector(
           '.duplex-checkbox');
+      this.cssBackgroundContainer_ = this.getElement().querySelector(
+          '.css-background-container');
+      this.cssBackgroundCheckbox_ = this.cssBackgroundContainer_.querySelector(
+          '.css-background-checkbox');
     },
 
     /**
@@ -162,9 +187,19 @@ cr.define('print_preview', function() {
       this.printTicketStore_.updateDuplex(this.duplexCheckbox_.checked);
     },
 
+    /**
+     * Called when the print CSS backgrounds checkbox is clicked. Updates the
+     * print ticket store.
+     * @private
+     */
+    onCssBackgroundCheckboxClick_: function() {
+      this.printTicketStore_.updateCssBackground(
+          this.cssBackgroundCheckbox_.checked);
+    },
+
     /**
      * Called when the print ticket store has changed. Hides or shows the
-     * setting.
+     * settings.
      * @private
      */
     onPrintTicketStoreChange_: function() {
@@ -182,9 +217,15 @@ cr.define('print_preview', function() {
                    this.printTicketStore_.hasDuplexCapability());
       this.duplexCheckbox_.checked = this.printTicketStore_.isDuplexEnabled();
 
+      setIsVisible(this.cssBackgroundContainer_,
+                   this.printTicketStore_.hasCssBackgroundCapability());
+      this.cssBackgroundCheckbox_.checked =
+          this.printTicketStore_.isCssBackgroundEnabled();
+
       if (this.printTicketStore_.hasHeaderFooterCapability() ||
           this.printTicketStore_.hasFitToPageCapability() ||
-          this.printTicketStore_.hasDuplexCapability()) {
+          this.printTicketStore_.hasDuplexCapability() ||
+          this.printTicketStore_.hasCssBackgroundCapability()) {
         fadeInOption(this.getElement());
       } else {
         fadeOutOption(this.getElement());