diff --git a/static/js/folderBrowser.js b/static/js/folderBrowser.js index 02fe195d..e7c664f6 100644 --- a/static/js/folderBrowser.js +++ b/static/js/folderBrowser.js @@ -1,18 +1,31 @@ // vim: et:ts=4:sw=4:sts=4:ft=javascript 'use strict'; pandora.ui.folderBrowser = function(id, section) { - var that = Ox.SplitPanel({ - elements: [ - { - element: pandora.ui.folderBrowserBar(id, section), - size: 24 - }, - { - element: pandora.$ui.folderList[id] = pandora.ui.folderBrowserList(id, section) + var that = Ox.Element(); + pandora.$ui.folderList[id] = pandora.ui.folderBrowserList(id, section) + .bindEvent({ + init: function(data) { + if (data.items) { + that.setElement( + Ox.SplitPanel({ + elements: [ + { + element: pandora.ui.folderBrowserBar(id, section), + size: 24 + }, + { + element: pandora.$ui.folderList[id] + } + ], + orientation: 'vertical' + }) + ); + } else { + // if there are no items, then the placeholder is already there + pandora.$ui.folderPlaceholder[id].updateText('public'); + } } - ], - orientation: 'vertical' - }); + }); return that; }; diff --git a/static/js/folderBrowserList.js b/static/js/folderBrowserList.js index 78e05d75..bdc8e405 100644 --- a/static/js/folderBrowserList.js +++ b/static/js/folderBrowserList.js @@ -191,11 +191,12 @@ pandora.ui.folderBrowserList = function(id, section) { init: function(data) { pandora.site.sectionFolders[section][i].items = data.items; pandora.$ui.folder[i].$content.css({ - height: 40 + data.items * 16 + 'px' + height: (data.items ? 40 + data.items * 16 : 16) + 'px' }); pandora.$ui.folderList[id].css({ height: 16 + data.items * 16 + 'px' }); + pandora.$ui.folderPlaceholder[id][data.items ? 'hide' : 'show'](); pandora.resizeFolders(); }, paste: function(data) { diff --git a/static/js/folderList.js b/static/js/folderList.js index e777c38e..7498ae24 100644 --- a/static/js/folderList.js +++ b/static/js/folderList.js @@ -8,6 +8,7 @@ pandora.ui.folderList = function(id, section) { folderItems = section == 'items' ? 'Lists' : Ox.toTitleCase(section), folderItem = folderItems.slice(0, -1), canEditFeatured = pandora.site.capabilities['canEditFeatured' + folderItems][pandora.user.level], + $placeholder, that; var columns, items; if (id != 'volumes') { @@ -267,8 +268,11 @@ pandora.ui.folderList = function(id, section) { max: 1, min: 0, pageLength: 1000, - // won't work, getListData looks up data in $folderList - //selected: pandora.getListData().folder == id ? [ui._list] : [], + // works when switching back from browser, but won't work on load, since + // getListData relies on $folderList, so selectList is called in init handler + selected: pandora.getListData().folder == id + ? [ui[ui.section == 'items' ? '_list' : ui.section.slice(0, -1)]] + : [], sort: [{key: 'position', operator: '+'}], sortable: id != 'featured' || canEditFeatured, unique: id != 'volumes' ? 'id' : 'name' @@ -377,11 +381,12 @@ pandora.ui.folderList = function(id, section) { if (pandora.site.sectionFolders[section][i]) { pandora.site.sectionFolders[section][i].items = data.items; pandora.$ui.folder[i].$content.css({ - height: data.items * 16 + 'px' + height: (data.items || 1) * 16 + 'px' }); pandora.$ui.folderList[id].css({ height: data.items * 16 + 'px' - }); + })[data.items ? 'show' : 'hide'](); + pandora.$ui.folderPlaceholder[id].updateText(id)[data.items ? 'hide' : 'show'](); } pandora.resizeFolders(); }, diff --git a/static/js/folderPlaceholder.js b/static/js/folderPlaceholder.js new file mode 100644 index 00000000..b1b91b48 --- /dev/null +++ b/static/js/folderPlaceholder.js @@ -0,0 +1,21 @@ +// vim: et:ts=4:sw=4:sts=4:ft=javascript +'use strict'; +pandora.ui.folderPlaceholder = function(id, section) { + var that = Ox.Element() + .addClass('OxLight') + .css({ + height: '14px', + padding: '1px 4px', + }); + that.updateText = function(string) { + return that.html( + Ox._( + string != 'volumes' + ? 'No ' + string + ' ' + (section == 'items' ? 'lists' : section) + : 'No local volumes' + ) + ); + }; + return that.updateText(id); +}; + diff --git a/static/js/folders.js b/static/js/folders.js index b38fd038..7782e4f5 100644 --- a/static/js/folders.js +++ b/static/js/folders.js @@ -17,6 +17,7 @@ pandora.ui.folders = function(section) { pandora.$ui.folder = []; pandora.$ui.folderBrowser = {}; pandora.$ui.folderList = {}; + pandora.$ui.folderPlaceholder = {}; pandora.$ui.findListElement = {}; pandora.$ui.findListSelect = {}; pandora.$ui.findListInput = {}; @@ -338,6 +339,9 @@ pandora.ui.folders = function(section) { } }) .appendTo(pandora.$ui.folder[i].$content); + pandora.$ui.folderPlaceholder[folder.id] = pandora.ui.folderPlaceholder(folder.id, section) + .hide() + .appendTo(pandora.$ui.folder[i].$content); }); function infoButton(title, text) { return Ox.Button({ diff --git a/static/js/utils.js b/static/js/utils.js index e449c6cc..287ef269 100644 --- a/static/js/utils.js +++ b/static/js/utils.js @@ -991,7 +991,7 @@ pandora.getFoldersHeight = function(section) { var height = 0; pandora.site.sectionFolders[section].forEach(function(folder, i) { height += 16 + pandora.user.ui.showFolder[section][folder.id] * ( - !!folder.showBrowser * 40 + folder.items * 16 + !!(folder.showBrowser && folder.items) * 40 + (folder.items || 1) * 16 ); }); return height;