${MessageNothingHere}
${MessagePleaseEnsureInternetMetadata}
diff --git a/dashboard-ui/scripts/indexpage.js b/dashboard-ui/scripts/indexpage.js
index 6650571a89..55a13224a8 100644
--- a/dashboard-ui/scripts/indexpage.js
+++ b/dashboard-ui/scripts/indexpage.js
@@ -1,4 +1,4 @@
-define(['libraryBrowser', 'jQuery'], function (libraryBrowser, $) {
+define(['libraryBrowser', 'jQuery'], function (libraryBrowser) {
var defaultFirstSection = 'smalllibrarytiles';
@@ -152,22 +152,23 @@
function showWelcomeIfNeeded(page, displayPreferences) {
if (displayPreferences.CustomPrefs[homePageTourKey] == homePageDismissValue) {
- $('.welcomeMessage', page).hide();
+ page.querySelector('.welcomeMessage').classList.add('hide');
} else {
Dashboard.hideLoadingMsg();
- var elem = $('.welcomeMessage', page).show();
+ var elem = page.querySelector('.welcomeMessage');
+ elem.classList.remove('hide');
if (displayPreferences.CustomPrefs[homePageTourKey]) {
- $('.tourHeader', elem).html(Globalize.translate('HeaderWelcomeBack'));
- $('.tourButtonText', elem).html(Globalize.translate('ButtonTakeTheTourToSeeWhatsNew'));
+ elem.querySelector('.tourHeader').innerHTML = Globalize.translate('HeaderWelcomeBack');
+ elem.querySelector('.tourButtonText').innerHTML = Globalize.translate('ButtonTakeTheTourToSeeWhatsNew');
} else {
- $('.tourHeader', elem).html(Globalize.translate('HeaderWelcomeToProjectWebClient'));
- $('.tourButtonText', elem).html(Globalize.translate('ButtonTakeTheTour'));
+ elem.querySelector('.tourHeader').innerHTML = Globalize.translate('HeaderWelcomeToProjectWebClient');
+ elem.querySelector('.tourButtonText').innerHTML = Globalize.translate('ButtonTakeTheTour');
}
}
}
@@ -205,7 +206,7 @@
newSlideShow.show();
dismissWelcome(page, userId);
- $('.welcomeMessage', page).hide();
+ page.querySelector('.welcomeMessage').classList.add('hide');
});
});
}
diff --git a/dashboard-ui/scripts/librarybrowser.js b/dashboard-ui/scripts/librarybrowser.js
index 0e01a04fc1..a6a7a97918 100644
--- a/dashboard-ui/scripts/librarybrowser.js
+++ b/dashboard-ui/scripts/librarybrowser.js
@@ -28,6 +28,33 @@
});
}
+ function animateSelectionBar(button) {
+
+ var elem = button.querySelector('.pageTabButtonSelectionBar');
+
+ var keyframes = [
+ { transform: 'translate3d(-100%, 0, 0)', offset: 0 },
+ { transform: 'none', offset: 1 }];
+
+ if (!elem.animate) {
+ return;
+ }
+ elem.animate(keyframes, {
+ duration: 160,
+ iterations: 1,
+ easing: 'ease-out'
+ });
+ }
+
+ function animateTabOnShow(newPanel, animateTabs, index) {
+
+ if (animateTabs && animateTabs.indexOf(index) != -1 && /*browserInfo.animate &&*/ newPanel.animate) {
+ setTimeout(function () {
+ fadeInRight(newPanel);
+ }, 160);
+ }
+ }
+
var libraryBrowser = (function (window, document, screen) {
// Regular Expressions for parsing tags and attributes
@@ -248,10 +275,11 @@
var buttons = tabs.querySelectorAll('.pageTabButton');
for (var i = 0, length = buttons.length; i < length; i++) {
- buttons[i].classList.add('mdl-button');
- buttons[i].classList.add('mdl-js-button');
- buttons[i].classList.add('mdl-js-ripple-effect');
- componentHandler.upgradeElement(buttons[i], 'MaterialButton');
+ //buttons[i].classList.add('mdl-button');
+ //buttons[i].classList.add('mdl-js-button');
+ var div = document.createElement('div');
+ div.classList.add('pageTabButtonSelectionBar');
+ buttons[i].appendChild(div);
}
tabs.classList.add('hiddenScrollX');
@@ -269,12 +297,11 @@
}
link.classList.add('is-active');
+ animateSelectionBar(link);
var index = parseInt(link.getAttribute('data-index'));
var newPanel = panels[index];
- if (animateTabs && animateTabs.indexOf(index) != -1 && /*browserInfo.animate &&*/ newPanel.animate) {
- fadeInRight(newPanel);
- }
+ animateTabOnShow(newPanel, animateTabs, index);
// If toCenter is called syncronously within the click event, it sometimes ends up canceling it
setTimeout(function () {
@@ -288,7 +315,7 @@
newPanel.classList.add('is-active');
//scrollHelper.toCenter(tabs, link, true);
- }, 100);
+ }, 160);
}
});
diff --git a/dashboard-ui/scripts/site.js b/dashboard-ui/scripts/site.js
index f267cae112..e027469a91 100644
--- a/dashboard-ui/scripts/site.js
+++ b/dashboard-ui/scripts/site.js
@@ -2714,49 +2714,57 @@ var AppInfo = {};
defineRoute({
path: '/mypreferencesdisplay.html',
dependencies: ['paper-button'],
- autoFocus: false
+ autoFocus: false,
+ transition: 'fade'
});
defineRoute({
path: '/mypreferenceshome.html',
dependencies: ['paper-button'],
- autoFocus: false
+ autoFocus: false,
+ transition: 'fade'
});
defineRoute({
path: '/mypreferenceslanguages.html',
dependencies: ['paper-button'],
- autoFocus: false
+ autoFocus: false,
+ transition: 'fade'
});
defineRoute({
path: '/mypreferencesmenu.html',
dependencies: ['paper-button'],
- autoFocus: false
+ autoFocus: false,
+ transition: 'fade'
});
defineRoute({
path: '/myprofile.html',
dependencies: ['paper-button'],
- autoFocus: false
+ autoFocus: false,
+ transition: 'fade'
});
defineRoute({
path: '/mysync.html',
dependencies: [],
- autoFocus: false
+ autoFocus: false,
+ transition: 'fade'
});
defineRoute({
path: '/mysyncjob.html',
dependencies: [],
- autoFocus: false
+ autoFocus: false,
+ transition: 'fade'
});
defineRoute({
path: '/mysyncsettings.html',
dependencies: [],
- autoFocus: false
+ autoFocus: false,
+ transition: 'fade'
});
defineRoute({
@@ -2784,7 +2792,8 @@ var AppInfo = {};
path: '/nowplaying.html',
dependencies: ['paper-icon-button-light', 'paper-slider', 'paper-button'],
controller: 'scripts/nowplayingpage',
- autoFocus: false
+ autoFocus: false,
+ transition: 'fade'
});
defineRoute({