| OLD | NEW |
| 1 // Copyright (c) 2012 The Chromium Authors. All rights reserved. | 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 | 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.exportPath('print_preview'); |
| 6 |
| 7 /** |
| 8 * CSS classes used by the component. |
| 9 * @enum {string} |
| 10 * @private |
| 11 */ |
| 12 print_preview.DestinationSettingsClasses_ = { |
| 13 CHANGE_BUTTON: 'destination-settings-change-button', |
| 14 ICON: 'destination-settings-icon', |
| 15 ICON_CLOUD: 'destination-settings-icon-cloud', |
| 16 ICON_CLOUD_SHARED: 'destination-settings-icon-cloud-shared', |
| 17 ICON_GOOGLE_PROMOTED: 'destination-settings-icon-google-promoted', |
| 18 ICON_LOCAL: 'destination-settings-icon-local', |
| 19 ICON_MOBILE: 'destination-settings-icon-mobile', |
| 20 ICON_MOBILE_SHARED: 'destination-settings-icon-mobile-shared', |
| 21 LOCATION: 'destination-settings-location', |
| 22 NAME: 'destination-settings-name', |
| 23 STALE: 'stale', |
| 24 THOBBER_NAME: 'destination-throbber-name' |
| 25 }; |
| 26 |
| 5 cr.define('print_preview', function() { | 27 cr.define('print_preview', function() { |
| 6 'use strict'; | 28 'use strict'; |
| 7 | 29 |
| 8 // TODO(rltoscano): This class needs a throbber while loading the destination | 30 // TODO(rltoscano): This class needs a throbber while loading the destination |
| 9 // or another solution is persist the settings of the printer so that next | 31 // or another solution is persist the settings of the printer so that next |
| 10 // load is fast. | 32 // load is fast. |
| 11 | 33 |
| 12 /** | 34 /** |
| 13 * Component used to render the print destination. | 35 * Component used to render the print destination. |
| 14 * @param {!print_preview.DestinationStore} destinationStore Used to determine | 36 * @param {!print_preview.DestinationStore} destinationStore Used to determine |
| 15 * the selected destination. | 37 * the selected destination. |
| 16 * @constructor | 38 * @constructor |
| 17 * @extends {print_preview.SettingsSection} | 39 * @extends {print_preview.SettingsSection} |
| 18 */ | 40 */ |
| 19 function DestinationSettings(destinationStore) { | 41 function DestinationSettings(destinationStore) { |
| 20 print_preview.SettingsSection.call(this); | 42 print_preview.SettingsSection.call(this); |
| 21 | 43 |
| 22 /** | 44 /** |
| 23 * Used to determine the selected destination. | 45 * Used to determine the selected destination. |
| 24 * @type {!print_preview.DestinationStore} | 46 * @type {!print_preview.DestinationStore} |
| 25 * @private | 47 * @private |
| 26 */ | 48 */ |
| 27 this.destinationStore_ = destinationStore; | 49 this.destinationStore_ = destinationStore; |
| 28 | 50 |
| 29 /** | 51 /** |
| 30 * Current CSS class of the destination icon. | 52 * Current CSS class of the destination icon. |
| 31 * @type {?DestinationSettings.Classes_} | 53 * @type {?print_preview.DestinationSettingsClasses_} |
| 32 * @private | 54 * @private |
| 33 */ | 55 */ |
| 34 this.iconClass_ = null; | 56 this.iconClass_ = null; |
| 35 } | 57 } |
| 36 | 58 |
| 37 /** | 59 /** |
| 38 * Event types dispatched by the component. | 60 * Event types dispatched by the component. |
| 39 * @enum {string} | 61 * @enum {string} |
| 40 */ | 62 */ |
| 41 DestinationSettings.EventType = { | 63 DestinationSettings.EventType = { |
| 42 CHANGE_BUTTON_ACTIVATE: | 64 CHANGE_BUTTON_ACTIVATE: |
| 43 'print_preview.DestinationSettings.CHANGE_BUTTON_ACTIVATE' | 65 'print_preview.DestinationSettings.CHANGE_BUTTON_ACTIVATE' |
| 44 }; | 66 }; |
| 45 | 67 |
| 46 /** | |
| 47 * CSS classes used by the component. | |
| 48 * @enum {string} | |
| 49 * @private | |
| 50 */ | |
| 51 DestinationSettings.Classes_ = { | |
| 52 CHANGE_BUTTON: 'destination-settings-change-button', | |
| 53 ICON: 'destination-settings-icon', | |
| 54 ICON_CLOUD: 'destination-settings-icon-cloud', | |
| 55 ICON_CLOUD_SHARED: 'destination-settings-icon-cloud-shared', | |
| 56 ICON_GOOGLE_PROMOTED: 'destination-settings-icon-google-promoted', | |
| 57 ICON_LOCAL: 'destination-settings-icon-local', | |
| 58 ICON_MOBILE: 'destination-settings-icon-mobile', | |
| 59 ICON_MOBILE_SHARED: 'destination-settings-icon-mobile-shared', | |
| 60 LOCATION: 'destination-settings-location', | |
| 61 NAME: 'destination-settings-name', | |
| 62 STALE: 'stale', | |
| 63 THOBBER_NAME: 'destination-throbber-name' | |
| 64 }; | |
| 65 | |
| 66 DestinationSettings.prototype = { | 68 DestinationSettings.prototype = { |
| 67 __proto__: print_preview.SettingsSection.prototype, | 69 __proto__: print_preview.SettingsSection.prototype, |
| 68 | 70 |
| 69 /** @override */ | 71 /** @override */ |
| 70 isAvailable: function() { | 72 isAvailable: function() { |
| 71 return true; | 73 return true; |
| 72 }, | 74 }, |
| 73 | 75 |
| 74 /** @override */ | 76 /** @override */ |
| 75 hasCollapsibleContent: function() { | 77 hasCollapsibleContent: function() { |
| 76 return false; | 78 return false; |
| 77 }, | 79 }, |
| 78 | 80 |
| 79 /** @override */ | 81 /** @override */ |
| 80 set isEnabled(isEnabled) { | 82 set isEnabled(isEnabled) { |
| 81 var changeButton = this.getElement().getElementsByClassName( | 83 var changeButton = this.getElement().getElementsByClassName( |
| 82 DestinationSettings.Classes_.CHANGE_BUTTON)[0]; | 84 print_preview.DestinationSettingsClasses_.CHANGE_BUTTON)[0]; |
| 83 changeButton.disabled = !isEnabled; | 85 changeButton.disabled = !isEnabled; |
| 84 }, | 86 }, |
| 85 | 87 |
| 86 /** @override */ | 88 /** @override */ |
| 87 enterDocument: function() { | 89 enterDocument: function() { |
| 88 print_preview.SettingsSection.prototype.enterDocument.call(this); | 90 print_preview.SettingsSection.prototype.enterDocument.call(this); |
| 89 var changeButton = this.getElement().getElementsByClassName( | 91 var changeButton = this.getElement().getElementsByClassName( |
| 90 DestinationSettings.Classes_.CHANGE_BUTTON)[0]; | 92 print_preview.DestinationSettingsClasses_.CHANGE_BUTTON)[0]; |
| 91 this.tracker.add( | 93 this.tracker.add( |
| 92 changeButton, 'click', this.onChangeButtonClick_.bind(this)); | 94 changeButton, 'click', this.onChangeButtonClick_.bind(this)); |
| 93 this.tracker.add( | 95 this.tracker.add( |
| 94 this.destinationStore_, | 96 this.destinationStore_, |
| 95 print_preview.DestinationStore.EventType.DESTINATION_SELECT, | 97 print_preview.DestinationStore.EventType.DESTINATION_SELECT, |
| 96 this.onDestinationSelect_.bind(this)); | 98 this.onDestinationSelect_.bind(this)); |
| 97 this.tracker_.add( | 99 this.tracker_.add( |
| 98 this.destinationStore_, | 100 this.destinationStore_, |
| 99 print_preview.DestinationStore.EventType. | 101 print_preview.DestinationStore.EventType. |
| 100 CACHED_SELECTED_DESTINATION_INFO_READY, | 102 CACHED_SELECTED_DESTINATION_INFO_READY, |
| (...skipping 14 matching lines...) Expand all Loading... |
| 115 * Called when the destination selection has changed. Updates UI elements. | 117 * Called when the destination selection has changed. Updates UI elements. |
| 116 * @private | 118 * @private |
| 117 */ | 119 */ |
| 118 onDestinationSelect_: function() { | 120 onDestinationSelect_: function() { |
| 119 var destinationSettingsBoxEl = | 121 var destinationSettingsBoxEl = |
| 120 this.getChildElement('.destination-settings-box'); | 122 this.getChildElement('.destination-settings-box'); |
| 121 | 123 |
| 122 var destination = this.destinationStore_.selectedDestination; | 124 var destination = this.destinationStore_.selectedDestination; |
| 123 if (destination != null) { | 125 if (destination != null) { |
| 124 var nameEl = this.getElement().getElementsByClassName( | 126 var nameEl = this.getElement().getElementsByClassName( |
| 125 DestinationSettings.Classes_.NAME)[0]; | 127 print_preview.DestinationSettingsClasses_.NAME)[0]; |
| 126 nameEl.textContent = destination.displayName; | 128 nameEl.textContent = destination.displayName; |
| 127 nameEl.title = destination.displayName; | 129 nameEl.title = destination.displayName; |
| 128 | 130 |
| 129 var iconEl = this.getElement().getElementsByClassName( | 131 var iconEl = this.getElement().getElementsByClassName( |
| 130 DestinationSettings.Classes_.ICON)[0]; | 132 print_preview.DestinationSettingsClasses_.ICON)[0]; |
| 131 iconEl.src = destination.iconUrl; | 133 iconEl.src = destination.iconUrl; |
| 132 | 134 |
| 133 var hint = destination.hint; | 135 var hint = destination.hint; |
| 134 var locationEl = this.getElement().getElementsByClassName( | 136 var locationEl = this.getElement().getElementsByClassName( |
| 135 DestinationSettings.Classes_.LOCATION)[0]; | 137 print_preview.DestinationSettingsClasses_.LOCATION)[0]; |
| 136 locationEl.textContent = hint; | 138 locationEl.textContent = hint; |
| 137 locationEl.title = hint; | 139 locationEl.title = hint; |
| 138 | 140 |
| 139 var offlineStatusText = destination.offlineStatusText; | 141 var offlineStatusText = destination.offlineStatusText; |
| 140 var offlineStatusEl = | 142 var offlineStatusEl = |
| 141 this.getChildElement('.destination-settings-offline-status'); | 143 this.getChildElement('.destination-settings-offline-status'); |
| 142 offlineStatusEl.textContent = offlineStatusText; | 144 offlineStatusEl.textContent = offlineStatusText; |
| 143 offlineStatusEl.title = offlineStatusText; | 145 offlineStatusEl.title = offlineStatusText; |
| 144 | 146 |
| 145 var isOffline = destination.isOffline; | 147 var isOffline = destination.isOffline; |
| 146 destinationSettingsBoxEl.classList.toggle( | 148 destinationSettingsBoxEl.classList.toggle( |
| 147 DestinationSettings.Classes_.STALE, isOffline); | 149 print_preview.DestinationSettingsClasses_.STALE, isOffline); |
| 148 setIsVisible(locationEl, !isOffline); | 150 setIsVisible(locationEl, !isOffline); |
| 149 setIsVisible(offlineStatusEl, isOffline); | 151 setIsVisible(offlineStatusEl, isOffline); |
| 150 } | 152 } |
| 151 | 153 |
| 152 setIsVisible( | 154 setIsVisible( |
| 153 this.getChildElement('.throbber-container'), | 155 this.getChildElement('.throbber-container'), |
| 154 this.destinationStore_.isAutoSelectDestinationInProgress); | 156 this.destinationStore_.isAutoSelectDestinationInProgress); |
| 155 setIsVisible(destinationSettingsBoxEl, !!destination); | 157 setIsVisible(destinationSettingsBoxEl, !!destination); |
| 156 }, | 158 }, |
| 157 | 159 |
| 158 onSelectedDestinationNameSet_: function() { | 160 onSelectedDestinationNameSet_: function() { |
| 159 var destinationName = | 161 var destinationName = |
| 160 this.destinationStore_.selectedDestination.displayName; | 162 this.destinationStore_.selectedDestination.displayName; |
| 161 var nameEl = this.getElement().getElementsByClassName( | 163 var nameEl = this.getElement().getElementsByClassName( |
| 162 DestinationSettings.Classes_.THOBBER_NAME)[0]; | 164 print_preview.DestinationSettingsClasses_.THOBBER_NAME)[0]; |
| 163 nameEl.textContent = destinationName; | 165 nameEl.textContent = destinationName; |
| 164 nameEl.title = destinationName; | 166 nameEl.title = destinationName; |
| 165 } | 167 } |
| 166 }; | 168 }; |
| 167 | 169 |
| 168 // Export | 170 // Export |
| 169 return { | 171 return { |
| 170 DestinationSettings: DestinationSettings | 172 DestinationSettings: DestinationSettings |
| 171 }; | 173 }; |
| 172 }); | 174 }); |
| OLD | NEW |