diff --git a/dashboard-ui/scripts/librarymenu.js b/dashboard-ui/scripts/librarymenu.js index cdb274201b..57130948f0 100644 --- a/dashboard-ui/scripts/librarymenu.js +++ b/dashboard-ui/scripts/librarymenu.js @@ -47,7 +47,7 @@ html += ''; html += ''; - html += '
'; + html += '
'; html += '
'; var viewMenuBar = document.createElement('div'); @@ -652,6 +652,45 @@ return getParameterByName('topParentId') || null; } + function slideDownToShow(elem) { + + if (!elem.classList.contains('hide')) { + return; + } + + elem.classList.remove('hide'); + requestAnimationFrame(function () { + + var keyframes = [ + { height: '0', offset: 0 }, + { height: elem.clientHeight + 'px', offset: 1 }]; + var timing = { duration: 200, iterations: 1, easing: 'ease-out' }; + elem.animate(keyframes, timing); + }); + } + + function slideUpToHide(elem) { + + if (elem.classList.contains('hide')) { + return; + } + + var height = elem.clientHeight; + + requestAnimationFrame(function () { + + elem.innerHTML = ''; + + var keyframes = [ + { height: height + 'px', offset: 0 }, + { height: '0', offset: 1 }]; + var timing = { duration: 200, iterations: 1, easing: 'ease-out' }; + elem.animate(keyframes, timing).onfinish = function () { + elem.classList.add('hide'); + }; + }); + } + window.LibraryMenu = { getTopParentId: getTopParentId, @@ -727,8 +766,8 @@ mainDrawerPanel.classList.remove('withTallToolbar'); viewMenuBarTabs = document.querySelector('.viewMenuBarTabs'); - viewMenuBarTabs.innerHTML = ''; - viewMenuBarTabs.classList.add('hide'); + slideUpToHide(viewMenuBarTabs); + //viewMenuBarTabs.innerHTML = ''; LibraryMenu.tabType = null; } return; @@ -736,28 +775,35 @@ viewMenuBarTabs = document.querySelector('.viewMenuBarTabs'); - if (!LibraryMenu.tabType) { - viewMenuBarTabs.classList.remove('hide'); - } - if (LibraryMenu.tabType != type) { - require(['paper-tabs'], function () { + require(['paper-tabs'], function() { var noInk = browserInfo.animate ? '' : ' noink'; - viewMenuBarTabs.innerHTML = '' + builder().map(function (t) { + viewMenuBarTabs.innerHTML = '' + builder().map(function(t) { return '
' + t.name + '
'; }).join('') + ''; mainDrawerPanel.classList.add('withTallToolbar'); + + if (!LibraryMenu.tabType) { + //viewMenuBarTabs.classList.remove('hide'); + slideDownToShow(viewMenuBarTabs); + } + LibraryMenu.tabType = type; }); return; - } + } else { + viewMenuBarTabs.querySelector('paper-tabs').selected = selectedIndex; - viewMenuBarTabs.querySelector('paper-tabs').selected = selectedIndex; + if (!LibraryMenu.tabType) { + //viewMenuBarTabs.classList.remove('hide'); + slideDownToShow(viewMenuBarTabs); + } + } LibraryMenu.tabType = type; }, diff --git a/dashboard-ui/scripts/site.js b/dashboard-ui/scripts/site.js index 04b419873a..05e5f1f236 100644 --- a/dashboard-ui/scripts/site.js +++ b/dashboard-ui/scripts/site.js @@ -743,7 +743,7 @@ var Dashboard = { divider: true, name: Globalize.translate('TabLibrary'), href: "library.html", - pageIds: ['mediaLibraryPage', 'libraryPathMappingPage'], + pageIds: ['mediaLibraryPage', 'libraryPathMappingPage', 'librarySettingsPage'], icon: 'folder', color: '#009688' }, { diff --git a/dashboard-ui/scripts/userlibraryaccess.js b/dashboard-ui/scripts/userlibraryaccess.js index 5c8f4d5a6b..60394e1628 100644 --- a/dashboard-ui/scripts/userlibraryaccess.js +++ b/dashboard-ui/scripts/userlibraryaccess.js @@ -4,52 +4,46 @@ var html = ''; - html += '
'; + html += '
' + Globalize.translate('HeaderLibraries') + '
'; - html += '' + Globalize.translate('HeaderLibraries') + ''; + html += '
'; for (var i = 0, length = mediaFolders.length; i < length; i++) { var folder = mediaFolders[i]; - var id = 'mediaFolder' + i; - var isChecked = user.Policy.EnableAllFolders || user.Policy.EnabledFolders.indexOf(folder.Id) != -1; var checkedAttribute = isChecked ? ' checked="checked"' : ''; - html += ''; - html += ''; + html += '' + folder.Name + ''; } - html += '
'; + html += '
'; $('.folderAccess', page).html(html).trigger('create'); - $('#chkEnableAllFolders', page).checked(user.Policy.EnableAllFolders).checkboxradio('refresh').trigger('change'); + $('#chkEnableAllFolders', page).checked(user.Policy.EnableAllFolders).trigger('change'); } function loadChannels(page, user, channels) { var html = ''; - html += '
'; + html += '
' + Globalize.translate('HeaderChannels') + '
'; - html += '' + Globalize.translate('HeaderChannels') + ''; + html += '
'; for (var i = 0, length = channels.length; i < length; i++) { var folder = channels[i]; - var id = 'channels' + i; - var isChecked = user.Policy.EnableAllChannels || user.Policy.EnabledChannels.indexOf(folder.Id) != -1; var checkedAttribute = isChecked ? ' checked="checked"' : ''; - html += ''; - html += ''; + html += '' + folder.Name + ''; } - html += '
'; + html += ''; $('.channelAccess', page).show().html(html).trigger('create'); @@ -59,37 +53,31 @@ $('.channelAccessContainer', page).hide(); } - $('#chkEnableAllChannels', page).checked(user.Policy.EnableAllChannels).checkboxradio('refresh').trigger('change'); + $('#chkEnableAllChannels', page).checked(user.Policy.EnableAllChannels).trigger('change'); } function loadDevices(page, user, devices) { var html = ''; - html += '
'; + html += '
' + Globalize.translate('HeaderDevices') + '
'; - html += '' + Globalize.translate('HeaderDevices') + ''; + html += '
'; for (var i = 0, length = devices.length; i < length; i++) { var device = devices[i]; - var id = 'device' + i; - var checkedAttribute = user.Policy.EnableAllDevices || user.Policy.EnabledDevices.indexOf(device.Id) != -1 ? ' checked="checked"' : ''; - html += ''; - html += ''; + html += '' + device.Name + ' - ' + device.AppName + ''; } - html += '
'; + html += ''; $('.deviceAccess', page).show().html(html).trigger('create'); - $('#chkEnableAllDevices', page).checked(user.Policy.EnableAllDevices).checkboxradio('refresh').trigger('change'); + $('#chkEnableAllDevices', page).checked(user.Policy.EnableAllDevices).trigger('change'); if (user.Policy.IsAdministrator) { page.querySelector('.deviceAccessContainer').classList.add('hide'); @@ -125,29 +113,29 @@ user.Policy.EnableAllFolders = $('#chkEnableAllFolders', page).checked(); user.Policy.EnabledFolders = user.Policy.EnableAllFolders ? [] : - $('.chkFolder:checked', page).map(function () { - - return this.getAttribute('data-id'); - - }).get(); + $('.chkFolder', page).get().filter(function (c) { + return c.checked; + }).map(function (c) { + return c.getAttribute('data-id'); + }); user.Policy.EnableAllChannels = $('#chkEnableAllChannels', page).checked(); user.Policy.EnabledChannels = user.Policy.EnableAllChannels ? [] : - $('.chkChannel:checked', page).map(function () { - - return this.getAttribute('data-id'); - - }).get(); + $('.chkChannel', page).get().filter(function (c) { + return c.checked; + }).map(function (c) { + return c.getAttribute('data-id'); + }); user.Policy.EnableAllDevices = $('#chkEnableAllDevices', page).checked(); user.Policy.EnabledDevices = user.Policy.EnableAllDevices ? [] : - $('.chkDevice:checked', page).map(function () { - - return this.getAttribute('data-id'); - - }).get(); + $('.chkDevice', page).get().filter(function (c) { + return c.checked; + }).map(function (c) { + return c.getAttribute('data-id'); + }); // Legacy user.Policy.BlockedChannels = null; diff --git a/dashboard-ui/thirdparty/paper-button-style.css b/dashboard-ui/thirdparty/paper-button-style.css index 6ed55f83c7..674130c5b0 100644 --- a/dashboard-ui/thirdparty/paper-button-style.css +++ b/dashboard-ui/thirdparty/paper-button-style.css @@ -471,6 +471,10 @@ paper-textarea.mono textarea { background-color: #fff; } +.paperCheckboxList.paperList { + padding: .5em 1em; +} + .ui-body-b .paperList { background-color: #323232; } diff --git a/dashboard-ui/useredit.html b/dashboard-ui/useredit.html index a20e640f57..df67f26685 100644 --- a/dashboard-ui/useredit.html +++ b/dashboard-ui/useredit.html @@ -1,4 +1,4 @@ -
+
diff --git a/dashboard-ui/userlibraryaccess.html b/dashboard-ui/userlibraryaccess.html index 3cad8d173a..8c4e20d8de 100644 --- a/dashboard-ui/userlibraryaccess.html +++ b/dashboard-ui/userlibraryaccess.html @@ -1,4 +1,4 @@ -
+
@@ -11,40 +11,35 @@
-
${HeaderLibraryAccess}
+

${HeaderLibraryAccess}

- - -
${LibraryAccessHelp}
+ ${OptionEnableAccessToAllLibraries}

+
${LibraryAccessHelp}

-

-
-
${HeaderDeviceAccess}
+

${HeaderDeviceAccess}

- - + ${OptionEnableAccessFromAllDevices}