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 5cr.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 * @constructor 20 * @extends {print_preview.SettingsSection} 21 */ 22 function OtherOptionsSettings( 23 duplex, fitToPage, cssBackground, selectionOnly, headerFooter) { 24 print_preview.SettingsSection.call(this); 25 26 /** 27 * Duplex ticket item, used to read/write the duplex selection. 28 * @type {!print_preview.ticket_items.Duplex} 29 * @private 30 */ 31 this.duplexTicketItem_ = duplex; 32 33 /** 34 * Fit-to-page ticket item, used to read/write the fit-to-page selection. 35 * @type {!print_preview.ticket_items.FitToPage} 36 * @private 37 */ 38 this.fitToPageTicketItem_ = fitToPage; 39 40 /** 41 * Enable CSS backgrounds ticket item, used to read/write. 42 * @type {!print_preview.ticket_items.CssBackground} 43 * @private 44 */ 45 this.cssBackgroundTicketItem_ = cssBackground; 46 47 /** 48 * Print selection only ticket item, used to read/write. 49 * @type {!print_preview.ticket_items.SelectionOnly} 50 * @private 51 */ 52 this.selectionOnlyTicketItem_ = selectionOnly; 53 54 /** 55 * Header-footer ticket item, used to read/write. 56 * @type {!print_preview.ticket_items.HeaderFooter} 57 * @private 58 */ 59 this.headerFooterTicketItem_ = headerFooter; 60 61 /** 62 * Header footer container element. 63 * @type {HTMLElement} 64 * @private 65 */ 66 this.headerFooterContainer_ = null; 67 68 /** 69 * Header footer checkbox. 70 * @type {HTMLInputElement} 71 * @private 72 */ 73 this.headerFooterCheckbox_ = null; 74 75 /** 76 * Fit-to-page container element. 77 * @type {HTMLElement} 78 * @private 79 */ 80 this.fitToPageContainer_ = null; 81 82 /** 83 * Fit-to-page checkbox. 84 * @type {HTMLInputElement} 85 * @private 86 */ 87 this.fitToPageCheckbox_ = null; 88 89 /** 90 * Duplex container element. 91 * @type {HTMLElement} 92 * @private 93 */ 94 this.duplexContainer_ = null; 95 96 /** 97 * Duplex checkbox. 98 * @type {HTMLInputElement} 99 * @private 100 */ 101 this.duplexCheckbox_ = null; 102 103 /** 104 * Print CSS backgrounds container element. 105 * @type {HTMLElement} 106 * @private 107 */ 108 this.cssBackgroundContainer_ = null; 109 110 /** 111 * Print CSS backgrounds checkbox. 112 * @type {HTMLInputElement} 113 * @private 114 */ 115 this.cssBackgroundCheckbox_ = null; 116 117 /** 118 * Print selection only container element. 119 * @type {HTMLElement} 120 * @private 121 */ 122 this.selectionOnlyContainer_ = null; 123 124 /** 125 * Print selection only checkbox. 126 * @type {HTMLInputElement} 127 * @private 128 */ 129 this.selectionOnlyCheckbox_ = null; 130 }; 131 132 OtherOptionsSettings.prototype = { 133 __proto__: print_preview.SettingsSection.prototype, 134 135 /** @override */ 136 isAvailable: function() { 137 return this.headerFooterTicketItem_.isCapabilityAvailable() || 138 this.fitToPageTicketItem_.isCapabilityAvailable() || 139 this.duplexTicketItem_.isCapabilityAvailable() || 140 this.cssBackgroundTicketItem_.isCapabilityAvailable() || 141 this.selectionOnlyTicketItem_.isCapabilityAvailable(); 142 }, 143 144 /** @override */ 145 hasCollapsibleContent: function() { 146 return this.headerFooterTicketItem_.isCapabilityAvailable() || 147 this.fitToPageTicketItem_.isCapabilityAvailable() || 148 this.cssBackgroundTicketItem_.isCapabilityAvailable() || 149 this.selectionOnlyTicketItem_.isCapabilityAvailable(); 150 }, 151 152 /** @override */ 153 set isEnabled(isEnabled) { 154 this.headerFooterCheckbox_.disabled = !isEnabled; 155 this.fitToPageCheckbox_.disabled = !isEnabled; 156 this.duplexCheckbox_.disabled = !isEnabled; 157 this.cssBackgroundCheckbox_.disabled = !isEnabled; 158 }, 159 160 /** @override */ 161 enterDocument: function() { 162 print_preview.SettingsSection.prototype.enterDocument.call(this); 163 this.tracker.add( 164 this.headerFooterCheckbox_, 165 'click', 166 this.onHeaderFooterCheckboxClick_.bind(this)); 167 this.tracker.add( 168 this.fitToPageCheckbox_, 169 'click', 170 this.onFitToPageCheckboxClick_.bind(this)); 171 this.tracker.add( 172 this.duplexCheckbox_, 173 'click', 174 this.onDuplexCheckboxClick_.bind(this)); 175 this.tracker.add( 176 this.cssBackgroundCheckbox_, 177 'click', 178 this.onCssBackgroundCheckboxClick_.bind(this)); 179 this.tracker.add( 180 this.selectionOnlyCheckbox_, 181 'click', 182 this.onSelectionOnlyCheckboxClick_.bind(this)); 183 this.tracker.add( 184 this.duplexTicketItem_, 185 print_preview.ticket_items.TicketItem.EventType.CHANGE, 186 this.onDuplexChange_.bind(this)); 187 this.tracker.add( 188 this.fitToPageTicketItem_, 189 print_preview.ticket_items.TicketItem.EventType.CHANGE, 190 this.onFitToPageChange_.bind(this)); 191 this.tracker.add( 192 this.cssBackgroundTicketItem_, 193 print_preview.ticket_items.TicketItem.EventType.CHANGE, 194 this.onCssBackgroundChange_.bind(this)); 195 this.tracker.add( 196 this.selectionOnlyTicketItem_, 197 print_preview.ticket_items.TicketItem.EventType.CHANGE, 198 this.onSelectionOnlyChange_.bind(this)); 199 this.tracker.add( 200 this.headerFooterTicketItem_, 201 print_preview.ticket_items.TicketItem.EventType.CHANGE, 202 this.onHeaderFooterChange_.bind(this)); 203 }, 204 205 /** @override */ 206 exitDocument: function() { 207 print_preview.SettingsSection.prototype.exitDocument.call(this); 208 this.headerFooterContainer_ = null; 209 this.headerFooterCheckbox_ = null; 210 this.fitToPageContainer_ = null; 211 this.fitToPageCheckbox_ = null; 212 this.duplexContainer_ = null; 213 this.duplexCheckbox_ = null; 214 this.cssBackgroundContainer_ = null; 215 this.cssBackgroundCheckbox_ = null; 216 this.selectionOnlyContainer_ = null; 217 this.selectionOnlyCheckbox_ = null; 218 }, 219 220 /** @override */ 221 decorateInternal: function() { 222 this.headerFooterContainer_ = this.getElement().querySelector( 223 '.header-footer-container'); 224 this.headerFooterCheckbox_ = this.headerFooterContainer_.querySelector( 225 '.header-footer-checkbox'); 226 this.fitToPageContainer_ = this.getElement().querySelector( 227 '.fit-to-page-container'); 228 this.fitToPageCheckbox_ = this.fitToPageContainer_.querySelector( 229 '.fit-to-page-checkbox'); 230 this.duplexContainer_ = this.getElement().querySelector( 231 '.duplex-container'); 232 this.duplexCheckbox_ = this.duplexContainer_.querySelector( 233 '.duplex-checkbox'); 234 this.cssBackgroundContainer_ = this.getElement().querySelector( 235 '.css-background-container'); 236 this.cssBackgroundCheckbox_ = this.cssBackgroundContainer_.querySelector( 237 '.css-background-checkbox'); 238 this.selectionOnlyContainer_ = this.getElement().querySelector( 239 '.selection-only-container'); 240 this.selectionOnlyCheckbox_ = this.selectionOnlyContainer_.querySelector( 241 '.selection-only-checkbox'); 242 }, 243 244 /** @override */ 245 updateUiStateInternal: function() { 246 if (this.isAvailable()) { 247 setIsVisible(this.headerFooterContainer_, 248 this.headerFooterTicketItem_.isCapabilityAvailable() && 249 !this.collapseContent); 250 setIsVisible(this.fitToPageContainer_, 251 this.fitToPageTicketItem_.isCapabilityAvailable() && 252 !this.collapseContent); 253 setIsVisible(this.duplexContainer_, 254 this.duplexTicketItem_.isCapabilityAvailable()); 255 setIsVisible(this.cssBackgroundContainer_, 256 this.cssBackgroundTicketItem_.isCapabilityAvailable() && 257 !this.collapseContent); 258 setIsVisible(this.selectionOnlyContainer_, 259 this.selectionOnlyTicketItem_.isCapabilityAvailable() && 260 !this.collapseContent); 261 } 262 print_preview.SettingsSection.prototype.updateUiStateInternal.call(this); 263 }, 264 265 /** @override */ 266 isSectionVisibleInternal: function() { 267 return this.collapseContent ? 268 this.duplexTicketItem_.isCapabilityAvailable() : this.isAvailable(); 269 }, 270 271 /** 272 * Called when the header-footer checkbox is clicked. Updates the print 273 * ticket. 274 * @private 275 */ 276 onHeaderFooterCheckboxClick_: function() { 277 this.headerFooterTicketItem_.updateValue( 278 this.headerFooterCheckbox_.checked); 279 }, 280 281 /** 282 * Called when the fit-to-page checkbox is clicked. Updates the print 283 * ticket. 284 * @private 285 */ 286 onFitToPageCheckboxClick_: function() { 287 this.fitToPageTicketItem_.updateValue(this.fitToPageCheckbox_.checked); 288 }, 289 290 /** 291 * Called when the duplex checkbox is clicked. Updates the print ticket. 292 * @private 293 */ 294 onDuplexCheckboxClick_: function() { 295 this.duplexTicketItem_.updateValue(this.duplexCheckbox_.checked); 296 }, 297 298 /** 299 * Called when the print CSS backgrounds checkbox is clicked. Updates the 300 * print ticket store. 301 * @private 302 */ 303 onCssBackgroundCheckboxClick_: function() { 304 this.cssBackgroundTicketItem_.updateValue( 305 this.cssBackgroundCheckbox_.checked); 306 }, 307 308 /** 309 * Called when the print selection only is clicked. Updates the 310 * print ticket store. 311 * @private 312 */ 313 onSelectionOnlyCheckboxClick_: function() { 314 this.selectionOnlyTicketItem_.updateValue( 315 this.selectionOnlyCheckbox_.checked); 316 }, 317 318 /** 319 * Called when the duplex ticket item has changed. Updates the duplex 320 * checkbox. 321 * @private 322 */ 323 onDuplexChange_: function() { 324 this.duplexCheckbox_.checked = this.duplexTicketItem_.getValue(); 325 this.updateUiStateInternal(); 326 }, 327 328 /** 329 * Called when the fit-to-page ticket item has changed. Updates the 330 * fit-to-page checkbox. 331 * @private 332 */ 333 onFitToPageChange_: function() { 334 this.fitToPageCheckbox_.checked = this.fitToPageTicketItem_.getValue(); 335 this.updateUiStateInternal(); 336 }, 337 338 /** 339 * Called when the CSS background ticket item has changed. Updates the 340 * CSS background checkbox. 341 * @private 342 */ 343 onCssBackgroundChange_: function() { 344 this.cssBackgroundCheckbox_.checked = 345 this.cssBackgroundTicketItem_.getValue(); 346 this.updateUiStateInternal(); 347 }, 348 349 /** 350 * Called when the print selection only ticket item has changed. Updates the 351 * CSS background checkbox. 352 * @private 353 */ 354 onSelectionOnlyChange_: function() { 355 this.selectionOnlyCheckbox_.checked = 356 this.selectionOnlyTicketItem_.getValue(); 357 this.updateUiStateInternal(); 358 }, 359 360 /** 361 * Called when the header-footer ticket item has changed. Updates the 362 * header-footer checkbox. 363 * @private 364 */ 365 onHeaderFooterChange_: function() { 366 this.headerFooterCheckbox_.checked = 367 this.headerFooterTicketItem_.getValue(); 368 this.updateUiStateInternal(); 369 } 370 }; 371 372 // Export 373 return { 374 OtherOptionsSettings: OtherOptionsSettings 375 }; 376}); 377