diff --git a/dashboard-ui/scripts/librarymenu.js b/dashboard-ui/scripts/librarymenu.js
index 947cf323ec..5c0ac9332b 100644
--- a/dashboard-ui/scripts/librarymenu.js
+++ b/dashboard-ui/scripts/librarymenu.js
@@ -33,7 +33,7 @@
html += '';
- html += '';
+ html += '';
if (!browserInfo.mobile && !Dashboard.isConnectMode()) {
html += '';
@@ -83,25 +83,15 @@
}
if (headerUserButton) {
- headerUserButton.src = url;
- headerUserButton.icon = null;
- headerUserButton.classList.add('headerUserButtonRound');
+ updateHeaderUserButton(headerUserButton, url, null);
hasImage = true;
}
}
}
if (headerUserButton && !hasImage) {
- headerUserButton.icon = 'person';
- headerUserButton.src = null;
- headerUserButton.removeAttribute('src');
- headerUserButton.classList.remove('headerUserButtonRound');
- // Looks like a bug in paper-icon-button that this doesn't get removed
- var headerUserButtonImg = headerUserButton.querySelector('img');
- if (headerUserButtonImg) {
- headerUserButtonImg.parentNode.removeChild(headerUserButtonImg);
- }
+ updateHeaderUserButton(headerUserButton, null, 'person');
}
if (user) {
updateLocalUser(user.localUser);
@@ -110,6 +100,30 @@
requiresUserRefresh = false;
}
+ function updateHeaderUserButton(headerUserButton, src, icon) {
+
+ var oldButton = headerUserButton;
+
+ // There seems to be a bug in paper-icon-button where it doesn't refresh it's display after switching between icon and src image
+ // So work around that by just replacing the element altogether
+
+ var headerUserButton = document.createElement('paper-icon-button');
+ headerUserButton.className = oldButton.className;
+ headerUserButton.addEventListener('click', onHeaderUserButtonClick);
+
+ if (src) {
+ headerUserButton.classList.add('headerUserButtonRound');
+ headerUserButton.src = src;
+ } else if (icon) {
+ headerUserButton.classList.remove('headerUserButtonRound');
+ header.icon = icon;
+ } else {
+ headerUserButton.classList.remove('headerUserButtonRound');
+ }
+
+ oldButton.parentNode.replaceChild(headerUserButton, oldButton);
+ }
+
function updateLocalUser(user) {
var header = document.querySelector('.viewMenuBar');
@@ -162,6 +176,10 @@
});
}
+ function onHeaderUserButtonClick(e) {
+ Dashboard.showUserFlyout(e.target);
+ }
+
function bindMenuEvents() {
var mainDrawerButton = document.querySelector('.mainDrawerButton');
@@ -180,6 +198,11 @@
headerVoiceButton.addEventListener('click', showVoice);
}
+ var headerUserButton = document.querySelector('.headerUserButton');
+ if (headerUserButton) {
+ headerUserButton.addEventListener('click', onHeaderUserButtonClick);
+ }
+
var viewMenuBar = document.querySelector(".viewMenuBar");
initHeadRoom(viewMenuBar);