Chromium Code Reviews
chromiumcodereview-hr@appspot.gserviceaccount.com (chromiumcodereview-hr) | Please choose your nickname with Settings | Help | Chromium Project | Gerrit Changes | Sign out
(102)

Issues Search
    My Issues | Starred     Open | Closed | All

Side by Side Diff: chrome/browser/resources/media_router/elements/media_router_header/media_router_header.js

Issue 1680743006: [Media Router] Show user email in header if cloud sink is present. (Closed) Base URL: https://chromium.googlesource.com/chromium/src.git@master
Patch Set: Address final comments Created 4 years, 10 months ago
Use n/p to move between diff chunks; N/P to move between comments. Draft comments are only viewable by you.
Jump to:
View unified diff | Download patch
« no previous file with comments | « chrome/browser/resources/media_router/elements/media_router_header/media_router_header.html ('k') | chrome/browser/resources/media_router/media_router.js » ('j') | chrome/browser/resources/media_router/media_router_ui_interface.js » ('J')
Toggle Intra-line Diffs ('i') | Expand Comments ('e') | Collapse Comments ('c') | Show Comments Hide Comments ('s')
OLDNEW
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
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
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
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 && !this.isEmptyOrWhitespace_(this.userEmail) ?
182 this.headerWithEmailHeight_ + 'px' : undefined;
183
184 // Only fire if height actually changed.
185 if (currentHeight != this.offsetHeight) {
186 this.fire('header-height-changed');
187 }
188 });
189 },
190
191 /**
124 * Updates the cursor style for the header text when the view changes. When 192 * 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. 193 * the drop arrow is also shown, the header text is also clickable.
126 * 194 *
127 * @param {?media_router.MediaRouterView} view The current view. 195 * @param {?media_router.MediaRouterView} view The current view.
128 * @private 196 * @private
129 */ 197 */
130 updateHeaderCursorStyle_: function(view) { 198 updateHeaderCursorStyle_: function(view) {
131 this.$$('#header-text').style.cursor = 199 this.$$('#header-text').style.cursor =
132 view == media_router.MediaRouterView.SINK_LIST || 200 view == media_router.MediaRouterView.SINK_LIST ||
133 view == media_router.MediaRouterView.CAST_MODE_LIST ? 201 view == media_router.MediaRouterView.CAST_MODE_LIST ?
134 'pointer' : 'auto'; 202 'pointer' : 'auto';
135 }, 203 },
136 }); 204 });
OLDNEW
« no previous file with comments | « chrome/browser/resources/media_router/elements/media_router_header/media_router_header.html ('k') | chrome/browser/resources/media_router/media_router.js » ('j') | chrome/browser/resources/media_router/media_router_ui_interface.js » ('J')

Powered by Google App Engine
This is Rietveld 408576698