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

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 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
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 48 matching lines...) Expand 10 before | Expand all | Expand 10 after
114 /** 143 /**
115 * Handles a click on the close button by firing a close-button-click event. 144 * Handles a click on the close button by firing a close-button-click event.
116 * 145 *
117 * @private 146 * @private
118 */ 147 */
119 onCloseButtonClick_: function() { 148 onCloseButtonClick_: function() {
120 this.fire('close-button-click'); 149 this.fire('close-button-click');
121 }, 150 },
122 151
123 /** 152 /**
153 * Updates header height to accomodate email text. This is called on changes
154 * to |showEmail| and will return early if the value has not changed.
155 *
156 * @param {boolean} oldValue .
157 * @param {boolean} newValue .
158 * @private
159 */
160 maybeChangeHeaderHeight_: function(oldValue, newValue) {
161 if (oldValue == newValue) {
162 return;
163 }
164
165 // Ensures conditional templates are stamped.
166 this.async(function() {
167 var currentHeight = this.offsetHeight;
168
169 this.$$('#header-toolbar').style.height =
170 this.showEmail &&
171 !$('media-router-container').isEmptyOrWhitespace_(this.userEmail) ?
imcheng 2016/02/18 18:58:54 I am all for reusing code, but it seems a bit odd
amp 2016/02/20 02:00:55 Putting it in media_router.js would also require h
apacible 2016/02/23 21:51:00 After extraction you can make it accessible simila
172 this.headerWithEmailHeight_ + 'px' : undefined;
173
174 var newHeight = this.offsetHeight;
175 // Only fire if height actually changed.
176 if (currentHeight != newHeight) {
177 this.fire('header-height-changed');
178 }
179 });
180 },
181
182 /**
124 * Updates the cursor style for the header text when the view changes. When 183 * 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. 184 * the drop arrow is also shown, the header text is also clickable.
126 * 185 *
127 * @param {?media_router.MediaRouterView} view The current view. 186 * @param {?media_router.MediaRouterView} view The current view.
128 * @private 187 * @private
129 */ 188 */
130 updateHeaderCursorStyle_: function(view) { 189 updateHeaderCursorStyle_: function(view) {
131 this.$$('#header-text').style.cursor = 190 this.$$('#header-text').style.cursor =
132 view == media_router.MediaRouterView.SINK_LIST || 191 view == media_router.MediaRouterView.SINK_LIST ||
133 view == media_router.MediaRouterView.CAST_MODE_LIST ? 192 view == media_router.MediaRouterView.CAST_MODE_LIST ?
134 'pointer' : 'auto'; 193 'pointer' : 'auto';
135 }, 194 },
136 }); 195 });
OLDNEW

Powered by Google App Engine
This is Rietveld 408576698