| OLD | NEW |
| 1 // Copyright 2014 The Chromium Authors. All rights reserved. | 1 // Copyright 2014 The Chromium Authors. All rights reserved. |
| 2 // Use of this source code is governed by a BSD-style license that can be | 2 // Use of this source code is governed by a BSD-style license that can be |
| 3 // found in the LICENSE file. | 3 // found in the LICENSE file. |
| 4 | 4 |
| 5 cr.define('print_preview', function() { | 5 cr.define('print_preview', function() { |
| 6 'use strict'; | 6 'use strict'; |
| 7 | 7 |
| 8 /** | 8 /** |
| 9 * Toggles visibility of the specified printing options sections. | 9 * Toggles visibility of the specified printing options sections. |
| 10 * @param {!print_preview.DestinationStore} destinationStore To listen for | 10 * @param {!print_preview.DestinationStore} destinationStore To listen for |
| (...skipping 25 matching lines...) Expand all Loading... |
| 36 * Used to record usage statistics. | 36 * Used to record usage statistics. |
| 37 * @private {!print_preview.PrintSettingsUiMetricsContext} | 37 * @private {!print_preview.PrintSettingsUiMetricsContext} |
| 38 */ | 38 */ |
| 39 this.metrics_ = new print_preview.PrintSettingsUiMetricsContext(); | 39 this.metrics_ = new print_preview.PrintSettingsUiMetricsContext(); |
| 40 }; | 40 }; |
| 41 | 41 |
| 42 /** | 42 /** |
| 43 * Which settings are visible to the user. | 43 * Which settings are visible to the user. |
| 44 * @enum {number} | 44 * @enum {number} |
| 45 */ | 45 */ |
| 46 MoreSettings.SettingsToShow = { | 46 MoreSettings.SettingsToShow = {MOST_POPULAR: 1, ALL: 2}; |
| 47 MOST_POPULAR: 1, | |
| 48 ALL: 2 | |
| 49 }; | |
| 50 | 47 |
| 51 MoreSettings.prototype = { | 48 MoreSettings.prototype = { |
| 52 __proto__: print_preview.Component.prototype, | 49 __proto__: print_preview.Component.prototype, |
| 53 | 50 |
| 54 /** @return {boolean} Returns {@code true} if settings are expanded. */ | 51 /** @return {boolean} Returns {@code true} if settings are expanded. */ |
| 55 get isExpanded() { | 52 get isExpanded() { |
| 56 return this.settingsToShow_ == MoreSettings.SettingsToShow.ALL; | 53 return this.settingsToShow_ == MoreSettings.SettingsToShow.ALL; |
| 57 }, | 54 }, |
| 58 | 55 |
| 59 /** @override */ | 56 /** @override */ |
| 60 enterDocument: function() { | 57 enterDocument: function() { |
| 61 print_preview.Component.prototype.enterDocument.call(this); | 58 print_preview.Component.prototype.enterDocument.call(this); |
| 62 | 59 |
| 63 this.tracker.add(this.getElement(), 'click', this.onClick_.bind(this)); | 60 this.tracker.add(this.getElement(), 'click', this.onClick_.bind(this)); |
| 64 this.tracker.add( | 61 this.tracker.add( |
| 65 this.destinationStore_, | 62 this.destinationStore_, |
| 66 print_preview.DestinationStore.EventType.DESTINATION_SELECT, | 63 print_preview.DestinationStore.EventType.DESTINATION_SELECT, |
| 67 this.onDestinationChanged_.bind(this)); | 64 this.onDestinationChanged_.bind(this)); |
| 68 this.tracker.add( | 65 this.tracker.add( |
| 69 this.destinationStore_, | 66 this.destinationStore_, print_preview.DestinationStore.EventType |
| 70 print_preview.DestinationStore.EventType. | 67 .SELECTED_DESTINATION_CAPABILITIES_READY, |
| 71 SELECTED_DESTINATION_CAPABILITIES_READY, | |
| 72 this.onDestinationCapabilitiesReady_.bind(this)); | 68 this.onDestinationCapabilitiesReady_.bind(this)); |
| 73 this.settingsSections_.forEach(function(section) { | 69 this.settingsSections_.forEach(function(section) { |
| 74 this.tracker.add( | 70 this.tracker.add( |
| 75 section, | 71 section, |
| 76 print_preview.SettingsSection.EventType.COLLAPSIBLE_CONTENT_CHANGED, | 72 print_preview.SettingsSection.EventType.COLLAPSIBLE_CONTENT_CHANGED, |
| 77 this.updateState_.bind(this)); | 73 this.updateState_.bind(this)); |
| 78 }.bind(this)); | 74 }.bind(this)); |
| 79 | 75 |
| 80 this.updateState_(true); | 76 this.updateState_(true); |
| 81 }, | 77 }, |
| 82 | 78 |
| 83 /** | 79 /** |
| 84 * Toggles "more/fewer options" state and notifies all the options sections | 80 * Toggles "more/fewer options" state and notifies all the options sections |
| 85 * to reflect the new state. | 81 * to reflect the new state. |
| 86 * @private | 82 * @private |
| 87 */ | 83 */ |
| 88 onClick_: function() { | 84 onClick_: function() { |
| 89 this.settingsToShow_ = | 85 this.settingsToShow_ = |
| 90 this.settingsToShow_ == MoreSettings.SettingsToShow.MOST_POPULAR ? | 86 this.settingsToShow_ == MoreSettings.SettingsToShow.MOST_POPULAR ? |
| 91 MoreSettings.SettingsToShow.ALL : | 87 MoreSettings.SettingsToShow.ALL : |
| 92 MoreSettings.SettingsToShow.MOST_POPULAR; | 88 MoreSettings.SettingsToShow.MOST_POPULAR; |
| 93 this.updateState_(false); | 89 this.updateState_(false); |
| 94 this.metrics_.record(this.isExpanded ? | 90 this.metrics_.record( |
| 95 print_preview.Metrics.PrintSettingsUiBucket.MORE_SETTINGS_CLICKED : | 91 this.isExpanded ? |
| 96 print_preview.Metrics.PrintSettingsUiBucket.LESS_SETTINGS_CLICKED); | 92 print_preview.Metrics.PrintSettingsUiBucket |
| 93 .MORE_SETTINGS_CLICKED : |
| 94 print_preview.Metrics.PrintSettingsUiBucket |
| 95 .LESS_SETTINGS_CLICKED); |
| 97 }, | 96 }, |
| 98 | 97 |
| 99 /** | 98 /** |
| 100 * Called when the destination selection has changed. Updates UI elements. | 99 * Called when the destination selection has changed. Updates UI elements. |
| 101 * @private | 100 * @private |
| 102 */ | 101 */ |
| 103 onDestinationChanged_: function() { | 102 onDestinationChanged_: function() { |
| 104 this.firstDestinationReady_ = true; | 103 this.firstDestinationReady_ = true; |
| 105 this.capabilitiesReady_ = false; | 104 this.capabilitiesReady_ = false; |
| 106 this.updateState_(false); | 105 this.updateState_(false); |
| (...skipping 24 matching lines...) Expand all Loading... |
| 131 if (!this.capabilitiesReady_) | 130 if (!this.capabilitiesReady_) |
| 132 return; | 131 return; |
| 133 | 132 |
| 134 var all = this.settingsToShow_ == MoreSettings.SettingsToShow.ALL; | 133 var all = this.settingsToShow_ == MoreSettings.SettingsToShow.ALL; |
| 135 this.getChildElement('.more-settings-label').textContent = | 134 this.getChildElement('.more-settings-label').textContent = |
| 136 loadTimeData.getString(all ? 'lessOptionsLabel' : 'moreOptionsLabel'); | 135 loadTimeData.getString(all ? 'lessOptionsLabel' : 'moreOptionsLabel'); |
| 137 var iconEl = this.getChildElement('.more-settings-icon'); | 136 var iconEl = this.getChildElement('.more-settings-icon'); |
| 138 iconEl.classList.toggle('more-settings-icon-plus', !all); | 137 iconEl.classList.toggle('more-settings-icon-plus', !all); |
| 139 iconEl.classList.toggle('more-settings-icon-minus', all); | 138 iconEl.classList.toggle('more-settings-icon-minus', all); |
| 140 | 139 |
| 141 var availableSections = this.settingsSections_.reduce( | 140 var availableSections = |
| 142 function(count, section) { | 141 this.settingsSections_.reduce(function(count, section) { |
| 143 return count + (section.isAvailable() ? 1 : 0); | 142 return count + (section.isAvailable() ? 1 : 0); |
| 144 }, 0); | 143 }, 0); |
| 145 | 144 |
| 146 // Magic 6 is chosen as the number of sections when it still feels like | 145 // Magic 6 is chosen as the number of sections when it still feels like |
| 147 // manageable and not too crowded. | 146 // manageable and not too crowded. |
| 148 var hasSectionsToToggle = | 147 var hasSectionsToToggle = availableSections > 6 && |
| 149 availableSections > 6 && | |
| 150 this.settingsSections_.some(function(section) { | 148 this.settingsSections_.some(function(section) { |
| 151 return section.hasCollapsibleContent(); | 149 return section.hasCollapsibleContent(); |
| 152 }); | 150 }); |
| 153 | 151 |
| 154 if (hasSectionsToToggle) | 152 if (hasSectionsToToggle) |
| 155 fadeInElement(this.getElement(), noAnimation); | 153 fadeInElement(this.getElement(), noAnimation); |
| 156 else | 154 else |
| 157 fadeOutElement(this.getElement()); | 155 fadeOutElement(this.getElement()); |
| 158 | 156 |
| 159 var collapseContent = | 157 var collapseContent = |
| 160 this.settingsToShow_ == MoreSettings.SettingsToShow.MOST_POPULAR && | 158 this.settingsToShow_ == MoreSettings.SettingsToShow.MOST_POPULAR && |
| 161 hasSectionsToToggle; | 159 hasSectionsToToggle; |
| 162 this.settingsSections_.forEach(function(section) { | 160 this.settingsSections_.forEach(function(section) { |
| 163 section.setCollapseContent(collapseContent, noAnimation); | 161 section.setCollapseContent(collapseContent, noAnimation); |
| 164 }); | 162 }); |
| 165 } | 163 } |
| 166 }; | 164 }; |
| 167 | 165 |
| 168 // Export | 166 // Export |
| 169 return { | 167 return {MoreSettings: MoreSettings}; |
| 170 MoreSettings: MoreSettings | |
| 171 }; | |
| 172 }); | 168 }); |
| OLD | NEW |