Add DPI option selection to Print Preview.

chrome/browser/resources/print_preview/settings/settings_section_select.js

Index: chrome/browser/resources/print_preview/settings/settings_section_select.js
diff --git a/chrome/browser/resources/print_preview/settings/media_size_settings.js b/chrome/browser/resources/print_preview/settings/settings_section_select.js
similarity index 73%
copy from chrome/browser/resources/print_preview/settings/media_size_settings.js
copy to chrome/browser/resources/print_preview/settings/settings_section_select.js
index be730721a53b357d5d20fb3b5054e7f921697a36..a5d5a11d7b575dadf7059926887d3c9573a941a6 100644
--- a/chrome/browser/resources/print_preview/settings/media_size_settings.js
+++ b/chrome/browser/resources/print_preview/settings/settings_section_select.js
@@ -6,20 +6,21 @@ cr.define('print_preview', function() {
   'use strict';
 
   /**
-   * Encapsulates all settings and logic related to the media size selection UI.
-   * @param {!print_preview.ticket_items.MediaSize} ticketItem Used to read and
-   *     write the media size ticket item.
+   * Base class for the printer option element visualizing the generic selection
+   * based option.
+   * @param {!print_preview.ticket_items.TicketItem} ticketItem Ticket item
+   *     visualized by this component.
    * @constructor
    * @extends {print_preview.SettingsSection}
    */
-  function MediaSizeSettings(ticketItem) {
+  function SettingsSectionSelect(ticketItem) {
     print_preview.SettingsSection.call(this);
 
-    /** @private {!print_preview.ticket_items.MediaSize} */
+    /** @private {!print_preview.ticket_items.TicketItem} */
     this.ticketItem_ = ticketItem;
   };
 
-  MediaSizeSettings.prototype = {
+  SettingsSectionSelect.prototype = {
     __proto__: print_preview.SettingsSection.prototype,
 
     /** @override */
@@ -40,20 +41,20 @@ cr.define('print_preview', function() {
     /** @override */
     enterDocument: function() {
       print_preview.SettingsSection.prototype.enterDocument.call(this);
-      this.tracker.add(this.select_, 'change', this.onSelectChange_.bind(this));
-      this.tracker.add(
-          this.ticketItem_,
-          print_preview.ticket_items.TicketItem.EventType.CHANGE,
-          this.onTicketItemChange_.bind(this));
+      this.tracker.add(assert(this.select_),
+                       'change',
+                       this.onSelectChange_.bind(this));
+      this.tracker.add(this.ticketItem_,
+                       print_preview.ticket_items.TicketItem.EventType.CHANGE,
+                       this.onTicketItemChange_.bind(this));
     },
 
     /**
-     * @return {HTMLSelectElement} Select element containing media size options.
+     * @return {HTMLSelectElement} Select element containing option items.
      * @private
      */
     get select_() {
-      return this.getElement().getElementsByClassName(
-          'media-size-settings-select')[0];
+      return this.getElement().querySelector('.settings-select');
     },
 
     /**
@@ -76,7 +77,6 @@ cr.define('print_preview', function() {
       var indexToSelect = select.selectedIndex;
       if (!sameContent) {
         select.innerHTML = '';
-        // TODO: Better heuristics for the display name and options grouping.
         this.ticketItem_.capability.option.forEach(function(option, index) {
           var selectOption = document.createElement('option');
           var displayName = option.custom_display_name;
@@ -100,12 +100,12 @@ cr.define('print_preview', function() {
                 getItemForLocale(items, navigator.language, false) ||
                 getItemForLocale(items, navigator.language, true);
           }
-          selectOption.text = displayName || option.name;
+          selectOption.text = displayName ||
+                              this.getDefaultDisplayName_(option);
           selectOption.value = JSON.stringify(option);
           select.appendChild(selectOption);
-          if (option.is_default) {
+          if (option.is_default)
             indexToSelect = index;
-          }
         });
       }
       // Try to select current ticket item.
@@ -121,13 +121,22 @@ cr.define('print_preview', function() {
     },
 
     /**
+     * @param {!Object} option Option to get the default display name for.
+     * @return {string} Default option display name.
+     * @private
+     */
+    getDefaultDisplayName_: function(option) {
+      throw Error('Abstract method not overridden');
+    },
+
+    /**
      * Called when the select element is changed. Updates the print ticket.
      * @private
      */
     onSelectChange_: function() {
       var select = this.select_;
-      var mediaSize = JSON.parse(select.options[select.selectedIndex].value);
-      this.ticketItem_.updateValue(mediaSize);
+      this.ticketItem_.updateValue(
+          JSON.parse(select.options[select.selectedIndex].value));
     },
 
     /**
@@ -143,6 +152,6 @@ cr.define('print_preview', function() {
 
   // Export
   return {
-    MediaSizeSettings: MediaSizeSettings
+    SettingsSectionSelect: SettingsSectionSelect
   };
 });