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

   1 // Copyright (c) 2012 The Chromium Authors. All rights reserved.
   2 // Use of this source code is governed by a BSD-style license that can be
   3 // found in the LICENSE file.
   4
   5 cr.define('print_preview', function() {
   6   'use strict';
   7
   8   /**
   9    * UI component that renders checkboxes for various print options.
  10    * @param {!print_preview.ticket_items.Duplex} duplex Duplex ticket item.
  11    * @param {!print_preview.ticket_items.FitToPage} fitToPage Fit-to-page ticket
  12    *     item.
  13    * @param {!print_preview.ticket_items.CssBackground} cssBackground CSS
  14    *     background ticket item.
  15    * @param {!print_preview.ticket_items.SelectionOnly} selectionOnly Selection
  16    *     only ticket item.
  17    * @param {!print_preview.ticket_items.HeaderFooter} headerFooter Header
  18    *     footer ticket item.
  19    * @param {!print_preview.ticket_items.DistillPage} distillPage Print
  20    *     distill page ticket item.
  21    * @constructor
  22    * @extends {print_preview.SettingsSection}
  23    */
  24   function OtherOptionsSettings(
  25       duplex, fitToPage, cssBackground, selectionOnly,
  26       headerFooter, distillPage) {
  27     print_preview.SettingsSection.call(this);
  28
  29     /**
  30      * Duplex ticket item, used to read/write the duplex selection.
  31      * @type {!print_preview.ticket_items.Duplex}
  32      * @private
  33      */
  34     this.duplexTicketItem_ = duplex;
  35
  36     /**
  37      * Fit-to-page ticket item, used to read/write the fit-to-page selection.
  38      * @type {!print_preview.ticket_items.FitToPage}
  39      * @private
  40      */
  41     this.fitToPageTicketItem_ = fitToPage;
  42
  43     /**
  44      * Enable CSS backgrounds ticket item, used to read/write.
  45      * @type {!print_preview.ticket_items.CssBackground}
  46      * @private
  47      */
  48     this.cssBackgroundTicketItem_ = cssBackground;
  49
  50     /**
  51      * Print selection only ticket item, used to read/write.
  52      * @type {!print_preview.ticket_items.SelectionOnly}
  53      * @private
  54      */
  55     this.selectionOnlyTicketItem_ = selectionOnly;
  56
  57     /**
  58      * Header-footer ticket item, used to read/write.
  59      * @type {!print_preview.ticket_items.HeaderFooter}
  60      * @private
  61      */
  62     this.headerFooterTicketItem_ = headerFooter;
  63
  64     /**
  65      * Distill page ticket item, used to read/write.
  66      * @type {!print_preview.ticket_items.DistillPage}
  67      * @private
  68      */
  69     this.distillPageTicketItem_ = distillPage;
  70
  71      /**
  72      * Distill page container element.
  73      * @type {HTMLElement}
  74      * @private
  75      */
  76     this.distillPageContainer_ = null;
  77
  78     /**
  79      * Distill page checkbox.
  80      * @type {HTMLInputElement}
  81      * @private
  82      */
  83     this.distillPageCheckbox_ = null;
  84
  85      /**
  86      * Header footer container element.
  87      * @type {HTMLElement}
  88      * @private
  89      */
  90     this.headerFooterContainer_ = null;
  91
  92     /**
  93      * Header footer checkbox.
  94      * @type {HTMLInputElement}
  95      * @private
  96      */
  97     this.headerFooterCheckbox_ = null;
  98
  99     /**
 100      * Fit-to-page container element.
 101      * @type {HTMLElement}
 102      * @private
 103      */
 104     this.fitToPageContainer_ = null;
 105
 106     /**
 107      * Fit-to-page checkbox.
 108      * @type {HTMLInputElement}
 109      * @private
 110      */
 111     this.fitToPageCheckbox_ = null;
 112
 113     /**
 114      * Duplex container element.
 115      * @type {HTMLElement}
 116      * @private
 117      */
 118     this.duplexContainer_ = null;
 119
 120     /**
 121      * Duplex checkbox.
 122      * @type {HTMLInputElement}
 123      * @private
 124      */
 125     this.duplexCheckbox_ = null;
 126
 127     /**
 128      * Print CSS backgrounds container element.
 129      * @type {HTMLElement}
 130      * @private
 131      */
 132     this.cssBackgroundContainer_ = null;
 133
 134     /**
 135      * Print CSS backgrounds checkbox.
 136      * @type {HTMLInputElement}
 137      * @private
 138      */
 139     this.cssBackgroundCheckbox_ = null;
 140
 141     /**
 142      * Print selection only container element.
 143      * @type {HTMLElement}
 144      * @private
 145      */
 146     this.selectionOnlyContainer_ = null;
 147
 148     /**
 149      * Print selection only checkbox.
 150      * @type {HTMLInputElement}
 151      * @private
 152      */
 153     this.selectionOnlyCheckbox_ = null;
 154   };
 155
 156   OtherOptionsSettings.prototype = {
 157     __proto__: print_preview.SettingsSection.prototype,
 158
 159     /** @override */
 160     isAvailable: function() {
 161       return this.distillPageTicketItem_.isCapabilityAvailable() ||
 162              this.headerFooterTicketItem_.isCapabilityAvailable() ||
 163              this.fitToPageTicketItem_.isCapabilityAvailable() ||
 164              this.duplexTicketItem_.isCapabilityAvailable() ||
 165              this.cssBackgroundTicketItem_.isCapabilityAvailable() ||
 166              this.selectionOnlyTicketItem_.isCapabilityAvailable();
 167     },
 168
 169     /** @override */
 170     hasCollapsibleContent: function() {
 171       return this.headerFooterTicketItem_.isCapabilityAvailable() ||
 172              this.fitToPageTicketItem_.isCapabilityAvailable() ||
 173              this.cssBackgroundTicketItem_.isCapabilityAvailable() ||
 174              this.selectionOnlyTicketItem_.isCapabilityAvailable();
 175     },
 176
 177     /** @override */
 178     set isEnabled(isEnabled) {
 179       this.headerFooterCheckbox_.disabled = !isEnabled;
 180       this.fitToPageCheckbox_.disabled = !isEnabled;
 181       this.duplexCheckbox_.disabled = !isEnabled;
 182       this.distillPageCheckbox_.disabled = !isEnabled;
 183       this.cssBackgroundCheckbox_.disabled = !isEnabled;
 184     },
 185
 186     /** @override */
 187     enterDocument: function() {
 188       print_preview.SettingsSection.prototype.enterDocument.call(this);
 189       this.tracker.add(
 190           this.distillPageCheckbox_,
 191           'click',
 192           this.onDistillPageCheckboxClick_.bind(this));
 193       this.tracker.add(
 194           this.headerFooterCheckbox_,
 195           'click',
 196           this.onHeaderFooterCheckboxClick_.bind(this));
 197       this.tracker.add(
 198           this.fitToPageCheckbox_,
 199           'click',
 200           this.onFitToPageCheckboxClick_.bind(this));
 201       this.tracker.add(
 202           this.duplexCheckbox_,
 203           'click',
 204           this.onDuplexCheckboxClick_.bind(this));
 205       this.tracker.add(
 206           this.cssBackgroundCheckbox_,
 207           'click',
 208           this.onCssBackgroundCheckboxClick_.bind(this));
 209       this.tracker.add(
 210           this.selectionOnlyCheckbox_,
 211           'click',
 212           this.onSelectionOnlyCheckboxClick_.bind(this));
 213       this.tracker.add(
 214           this.duplexTicketItem_,
 215           print_preview.ticket_items.TicketItem.EventType.CHANGE,
 216           this.onDuplexChange_.bind(this));
 217       this.tracker.add(
 218           this.fitToPageTicketItem_,
 219           print_preview.ticket_items.TicketItem.EventType.CHANGE,
 220           this.onFitToPageChange_.bind(this));
 221       this.tracker.add(
 222           this.cssBackgroundTicketItem_,
 223           print_preview.ticket_items.TicketItem.EventType.CHANGE,
 224           this.onCssBackgroundChange_.bind(this));
 225       this.tracker.add(
 226           this.selectionOnlyTicketItem_,
 227           print_preview.ticket_items.TicketItem.EventType.CHANGE,
 228           this.onSelectionOnlyChange_.bind(this));
 229       this.tracker.add(
 230           this.headerFooterTicketItem_,
 231           print_preview.ticket_items.TicketItem.EventType.CHANGE,
 232           this.onHeaderFooterChange_.bind(this));
 233       this.tracker.add(
 234           this.distillPageTicketItem_,
 235           print_preview.ticket_items.TicketItem.EventType.CHANGE,
 236           this.onDistillPageChange_.bind(this));
 237     },
 238
 239     /** @override */
 240     exitDocument: function() {
 241       print_preview.SettingsSection.prototype.exitDocument.call(this);
 242       this.distillPageContainer_ = null;
 243       this.distillPageCheckbox_ = null;
 244       this.headerFooterContainer_ = null;
 245       this.headerFooterCheckbox_ = null;
 246       this.fitToPageContainer_ = null;
 247       this.fitToPageCheckbox_ = null;
 248       this.duplexContainer_ = null;
 249       this.duplexCheckbox_ = null;
 250       this.cssBackgroundContainer_ = null;
 251       this.cssBackgroundCheckbox_ = null;
 252       this.selectionOnlyContainer_ = null;
 253       this.selectionOnlyCheckbox_ = null;
 254     },
 255
 256     /** @override */
 257     decorateInternal: function() {
 258       this.distillPageContainer_ = this.getElement().querySelector(
 259           '.distill-page-container');
 260       this.distillPageCheckbox_ = this.distillPageContainer_.querySelector(
 261           '.distill-page-checkbox');
 262       this.headerFooterContainer_ = this.getElement().querySelector(
 263           '.header-footer-container');
 264       this.headerFooterCheckbox_ = this.headerFooterContainer_.querySelector(
 265           '.header-footer-checkbox');
 266       this.fitToPageContainer_ = this.getElement().querySelector(
 267           '.fit-to-page-container');
 268       this.fitToPageCheckbox_ = this.fitToPageContainer_.querySelector(
 269           '.fit-to-page-checkbox');
 270       this.duplexContainer_ = this.getElement().querySelector(
 271           '.duplex-container');
 272       this.duplexCheckbox_ = this.duplexContainer_.querySelector(
 273           '.duplex-checkbox');
 274       this.cssBackgroundContainer_ = this.getElement().querySelector(
 275           '.css-background-container');
 276       this.cssBackgroundCheckbox_ = this.cssBackgroundContainer_.querySelector(
 277           '.css-background-checkbox');
 278       this.selectionOnlyContainer_ = this.getElement().querySelector(
 279           '.selection-only-container');
 280       this.selectionOnlyCheckbox_ = this.selectionOnlyContainer_.querySelector(
 281           '.selection-only-checkbox');
 282     },
 283
 284     /** @override */
 285     updateUiStateInternal: function() {
 286       if (this.isAvailable()) {
 287         setIsVisible(this.distillPageContainer_,
 288                      this.distillPageTicketItem_.isCapabilityAvailable());
 289         setIsVisible(this.headerFooterContainer_,
 290                      this.headerFooterTicketItem_.isCapabilityAvailable() &&
 291                      !this.collapseContent);
 292         setIsVisible(this.fitToPageContainer_,
 293                      this.fitToPageTicketItem_.isCapabilityAvailable() &&
 294                      !this.collapseContent);
 295         setIsVisible(this.duplexContainer_,
 296                      this.duplexTicketItem_.isCapabilityAvailable());
 297         setIsVisible(this.cssBackgroundContainer_,
 298                      this.cssBackgroundTicketItem_.isCapabilityAvailable() &&
 299                      !this.collapseContent);
 300         setIsVisible(this.selectionOnlyContainer_,
 301                      this.selectionOnlyTicketItem_.isCapabilityAvailable() &&
 302                      !this.collapseContent);
 303       }
 304       print_preview.SettingsSection.prototype.updateUiStateInternal.call(this);
 305     },
 306
 307     /** @override */
 308     isSectionVisibleInternal: function() {
 309       if (this.collapseContent) {
 310         return this.distillPageTicketItem_.isCapabilityAvailable() ||
 311                this.duplexTicketItem_.isCapabilityAvailable();
 312       }
 313
 314       return this.isAvailable();
 315     },
 316
 317     /**
 318      * Called when the distill-page checkbox is clicked. Updates the print
 319      * ticket.
 320      * @private
 321      */
 322     onDistillPageCheckboxClick_: function() {
 323       this.distillPageTicketItem_.updateValue(
 324           this.distillPageCheckbox_.checked);
 325     },
 326
 327      /**
 328      * Called when the header-footer checkbox is clicked. Updates the print
 329      * ticket.
 330      * @private
 331      */
 332     onHeaderFooterCheckboxClick_: function() {
 333       this.headerFooterTicketItem_.updateValue(
 334           this.headerFooterCheckbox_.checked);
 335     },
 336
 337     /**
 338      * Called when the fit-to-page checkbox is clicked. Updates the print
 339      * ticket.
 340      * @private
 341      */
 342     onFitToPageCheckboxClick_: function() {
 343       this.fitToPageTicketItem_.updateValue(this.fitToPageCheckbox_.checked);
 344     },
 345
 346     /**
 347      * Called when the duplex checkbox is clicked. Updates the print ticket.
 348      * @private
 349      */
 350     onDuplexCheckboxClick_: function() {
 351       this.duplexTicketItem_.updateValue(this.duplexCheckbox_.checked);
 352     },
 353
 354     /**
 355      * Called when the print CSS backgrounds checkbox is clicked. Updates the
 356      * print ticket store.
 357      * @private
 358      */
 359     onCssBackgroundCheckboxClick_: function() {
 360       this.cssBackgroundTicketItem_.updateValue(
 361           this.cssBackgroundCheckbox_.checked);
 362     },
 363
 364     /**
 365      * Called when the print selection only is clicked. Updates the
 366      * print ticket store.
 367      * @private
 368      */
 369     onSelectionOnlyCheckboxClick_: function() {
 370       this.selectionOnlyTicketItem_.updateValue(
 371           this.selectionOnlyCheckbox_.checked);
 372     },
 373
 374     /**
 375      * Called when the duplex ticket item has changed. Updates the duplex
 376      * checkbox.
 377      * @private
 378      */
 379     onDuplexChange_: function() {
 380       this.duplexCheckbox_.checked = this.duplexTicketItem_.getValue();
 381       this.updateUiStateInternal();
 382     },
 383
 384     /**
 385      * Called when the fit-to-page ticket item has changed. Updates the
 386      * fit-to-page checkbox.
 387      * @private
 388      */
 389     onFitToPageChange_: function() {
 390       this.fitToPageCheckbox_.checked = this.fitToPageTicketItem_.getValue();
 391       this.updateUiStateInternal();
 392     },
 393
 394     /**
 395      * Called when the CSS background ticket item has changed. Updates the
 396      * CSS background checkbox.
 397      * @private
 398      */
 399     onCssBackgroundChange_: function() {
 400       this.cssBackgroundCheckbox_.checked =
 401           this.cssBackgroundTicketItem_.getValue();
 402       this.updateUiStateInternal();
 403     },
 404
 405     /**
 406      * Called when the print selection only ticket item has changed. Updates the
 407      * CSS background checkbox.
 408      * @private
 409      */
 410     onSelectionOnlyChange_: function() {
 411       this.selectionOnlyCheckbox_.checked =
 412           this.selectionOnlyTicketItem_.getValue();
 413       this.updateUiStateInternal();
 414     },
 415
 416     /**
 417      * Called when the header-footer ticket item has changed. Updates the
 418      * header-footer checkbox.
 419      * @private
 420      */
 421     onHeaderFooterChange_: function() {
 422       this.headerFooterCheckbox_.checked =
 423           this.headerFooterTicketItem_.getValue();
 424       this.updateUiStateInternal();
 425     },
 426
 427     /**
 428      * Called when the distill-page ticket item has changed. Updates the
 429      * distill-page checkbox.
 430      * @private
 431      */
 432     onDistillPageChange_: function() {
 433       this.distillPageCheckbox_.checked =
 434           this.distillPageTicketItem_.getValue();
 435       this.updateUiStateInternal();
 436     }
 437   };
 438
 439   // Export
 440   return {
 441     OtherOptionsSettings: OtherOptionsSettings
 442   };
 443 });