Chromium Code Reviews| OLD | NEW |
|---|---|
| 1 // Copyright 2015 The Chromium Authors. All rights reserved. | 1 // Copyright 2015 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 // This Polymer element is used as a header for the media router interface. | 5 // This Polymer element is used as a header for the media router interface. |
| 6 Polymer({ | 6 Polymer({ |
| 7 is: 'media-router-header', | 7 is: 'media-router-header', |
| 8 | 8 |
| 9 properties: { | 9 properties: { |
| 10 /** | 10 /** |
| (...skipping 18 matching lines...) Expand all Loading... | |
| 29 /** | 29 /** |
| 30 * The header text to show. | 30 * The header text to show. |
| 31 * @type {string} | 31 * @type {string} |
| 32 */ | 32 */ |
| 33 headingText: { | 33 headingText: { |
| 34 type: String, | 34 type: String, |
| 35 value: '', | 35 value: '', |
| 36 }, | 36 }, |
| 37 | 37 |
| 38 /** | 38 /** |
| 39 * The current view that this header should reflect. | 39 * The height of the header when it shows the user email. |
| 40 * @type {?media_router.MediaRouterView} | 40 * @private {number} |
| 41 */ | 41 */ |
| 42 view: { | 42 headerWithEmailHeight_: { |
| 43 type: String, | 43 type: Number, |
| 44 value: null, | 44 readOnly: true, |
| 45 observer: 'updateHeaderCursorStyle_', | 45 value: 62, |
| 46 }, | 46 }, |
| 47 | 47 |
| 48 /** | 48 /** |
| 49 * Whether to show the user email in the header. | |
| 50 * @type {boolean} | |
| 51 */ | |
| 52 showEmail: { | |
| 53 type: Boolean, | |
| 54 value: false, | |
| 55 observer: 'maybeChangeHeaderHeight_', | |
| 56 }, | |
| 57 | |
| 58 /** | |
| 49 * The text to show in the tooltip. | 59 * The text to show in the tooltip. |
| 50 * @type {string} | 60 * @type {string} |
| 51 */ | 61 */ |
| 52 tooltip: { | 62 tooltip: { |
| 53 type: String, | 63 type: String, |
| 54 value: '', | 64 value: '', |
| 55 }, | 65 }, |
| 66 | |
| 67 /** | |
| 68 * The user email if they are signed in. | |
| 69 * @type {string} | |
| 70 */ | |
| 71 userEmail: { | |
| 72 type: String, | |
| 73 value: '', | |
| 74 }, | |
| 75 | |
| 76 /** | |
| 77 * The current view that this header should reflect. | |
| 78 * @type {?media_router.MediaRouterView} | |
| 79 */ | |
| 80 view: { | |
| 81 type: String, | |
| 82 value: null, | |
| 83 observer: 'updateHeaderCursorStyle_', | |
| 84 }, | |
| 56 }, | 85 }, |
| 57 | 86 |
| 58 attached: function() { | 87 attached: function() { |
| 59 // isRTL() only works after i18n_template.js runs to set <html dir>. | 88 // isRTL() only works after i18n_template.js runs to set <html dir>. |
| 60 // Set the back button icon based on text direction. | 89 // Set the back button icon based on text direction. |
| 61 this.arrowDropIcon_ = isRTL() ? 'arrow-forward' : 'arrow-back'; | 90 this.arrowDropIcon_ = isRTL() ? 'arrow-forward' : 'arrow-back'; |
| 62 }, | 91 }, |
| 63 | 92 |
| 64 /** | 93 /** |
| 65 * @param {?media_router.MediaRouterView} view The current view. | 94 * @param {?media_router.MediaRouterView} view The current view. |
| (...skipping 18 matching lines...) Expand all Loading... | |
| 84 /** | 113 /** |
| 85 * @param {?media_router.MediaRouterView} view The current view. | 114 * @param {?media_router.MediaRouterView} view The current view. |
| 86 * @return {boolean} Whether or not the back button should be hidden. | 115 * @return {boolean} Whether or not the back button should be hidden. |
| 87 * @private | 116 * @private |
| 88 */ | 117 */ |
| 89 computeBackButtonHidden_: function(view) { | 118 computeBackButtonHidden_: function(view) { |
| 90 return view != media_router.MediaRouterView.ROUTE_DETAILS; | 119 return view != media_router.MediaRouterView.ROUTE_DETAILS; |
| 91 }, | 120 }, |
| 92 | 121 |
| 93 /** | 122 /** |
| 123 * Returns whether given string is undefined, null, empty, or whitespace only. | |
| 124 * @param {?string} str String to be tested. | |
| 125 * @return {boolean} |true| if the string is undefined, null, empty, or | |
| 126 * whitespace. | |
| 127 * @private | |
| 128 */ | |
| 129 isEmptyOrWhitespace_: function(str) { | |
| 130 return str === undefined || str === null || (/^\s*$/).test(str); | |
| 131 }, | |
| 132 | |
| 133 /** | |
| 94 * Handles a click on the arrow button by firing an arrow-click event. | 134 * Handles a click on the arrow button by firing an arrow-click event. |
| 95 * | 135 * |
| 96 * @private | 136 * @private |
| 97 */ | 137 */ |
| 98 onHeaderOrArrowClick_: function() { | 138 onHeaderOrArrowClick_: function() { |
| 99 if (this.view == media_router.MediaRouterView.SINK_LIST || | 139 if (this.view == media_router.MediaRouterView.SINK_LIST || |
| 100 this.view == media_router.MediaRouterView.CAST_MODE_LIST) { | 140 this.view == media_router.MediaRouterView.CAST_MODE_LIST) { |
| 101 this.fire('header-or-arrow-click'); | 141 this.fire('header-or-arrow-click'); |
| 102 } | 142 } |
| 103 }, | 143 }, |
| (...skipping 10 matching lines...) Expand all Loading... | |
| 114 /** | 154 /** |
| 115 * Handles a click on the close button by firing a close-button-click event. | 155 * Handles a click on the close button by firing a close-button-click event. |
| 116 * | 156 * |
| 117 * @private | 157 * @private |
| 118 */ | 158 */ |
| 119 onCloseButtonClick_: function() { | 159 onCloseButtonClick_: function() { |
| 120 this.fire('close-button-click'); | 160 this.fire('close-button-click'); |
| 121 }, | 161 }, |
| 122 | 162 |
| 123 /** | 163 /** |
| 164 * Updates header height to accomodate email text. This is called on changes | |
| 165 * to |showEmail| and will return early if the value has not changed. | |
| 166 * | |
| 167 * @param {boolean} oldValue . | |
| 168 * @param {boolean} newValue . | |
| 169 * @private | |
| 170 */ | |
| 171 maybeChangeHeaderHeight_: function(oldValue, newValue) { | |
| 172 if (!!oldValue == !!newValue) { | |
| 173 return; | |
| 174 } | |
| 175 | |
| 176 // Ensures conditional templates are stamped. | |
| 177 this.async(function() { | |
| 178 var currentHeight = this.offsetHeight; | |
| 179 | |
| 180 this.$$('#header-toolbar').style.height = | |
| 181 this.showEmail && | |
| 182 !this.isEmptyOrWhitespace_(this.userEmail) ? | |
|
apacible
2016/02/25 00:16:02
nit: Fix indenting here and the next line. Also, d
amp
2016/02/25 03:01:14
Done.
182 does fit on the line above.
showone=Cod
| |
| 183 this.headerWithEmailHeight_ + 'px' : undefined; | |
| 184 | |
| 185 var newHeight = this.offsetHeight; | |
| 186 // Only fire if height actually changed. | |
| 187 if (currentHeight != newHeight) { | |
|
apacible
2016/02/25 00:16:02
nit: Use |this.offsetHeight| here rather than decl
amp
2016/02/25 03:01:15
Done.
| |
| 188 this.fire('header-height-changed'); | |
| 189 } | |
| 190 }); | |
| 191 }, | |
| 192 | |
| 193 /** | |
| 124 * Updates the cursor style for the header text when the view changes. When | 194 * Updates the cursor style for the header text when the view changes. When |
| 125 * the drop arrow is also shown, the header text is also clickable. | 195 * the drop arrow is also shown, the header text is also clickable. |
| 126 * | 196 * |
| 127 * @param {?media_router.MediaRouterView} view The current view. | 197 * @param {?media_router.MediaRouterView} view The current view. |
| 128 * @private | 198 * @private |
| 129 */ | 199 */ |
| 130 updateHeaderCursorStyle_: function(view) { | 200 updateHeaderCursorStyle_: function(view) { |
| 131 this.$$('#header-text').style.cursor = | 201 this.$$('#header-text').style.cursor = |
| 132 view == media_router.MediaRouterView.SINK_LIST || | 202 view == media_router.MediaRouterView.SINK_LIST || |
| 133 view == media_router.MediaRouterView.CAST_MODE_LIST ? | 203 view == media_router.MediaRouterView.CAST_MODE_LIST ? |
| 134 'pointer' : 'auto'; | 204 'pointer' : 'auto'; |
| 135 }, | 205 }, |
| 136 }); | 206 }); |
| OLD | NEW |