add library display settings

dashboard-ui/components/viewcontainer-lite.js

@@ -75,6 +75,8 @@ define(['browser'], function (browser) {
                     view.innerHTML = newView;
                 }
 
+                view.classList.add('mainAnimatedPage');
+
                 if (currentPage) {
                     if (newViewInfo.hasScript && window.$) {
                         // TODO: figure this out without jQuery
@@ -101,7 +103,6 @@ define(['browser'], function (browser) {
                 }
 
                 var animatable = view;
-                view.classList.add('mainAnimatedPage');
                 allPages[pageIndex] = view;
 
                 if (onBeforeChange) {
@@ -145,7 +146,7 @@ define(['browser'], function (browser) {
             }
         }
 
-        if (hasJqm) {
+        if (hasJqm && window.$) {
             $(newView).trigger('create');
         }
     }
@@ -174,9 +175,14 @@ define(['browser'], function (browser) {
         }
 
         var hasScript = options.view.indexOf('<script') != -1;
+        var elem = parseHtml(options.view, hasScript);
+
+        if (hasScript) {
+            hasScript = elem.querySelector('script') != null;
+        }
 
         return {
-            elem: parseHtml(options.view, hasScript),
+            elem: elem,
             hasScript: hasScript
         };
     }

dashboard-ui/librarydisplay.html

@@ -0,0 +1,19 @@
+<div id="librarySettingsPage" data-role="page" class="page type-interior librarySectionPage withTabs">
+
+    <div data-role="content">
+        <div class="content-primary">
+            <form>
+                <div>
+                    <paper-checkbox class="chkFolderView">${OptionDisplayFolderView}</paper-checkbox>
+                    <div class="fieldDescription paperCheckboxFieldDescription">${OptionDisplayFolderViewHelp}</div>
+                </div>
+                <br />
+                <br />
+                <button type="submit" data-role="none" class="clearButton">
+                    <paper-button raised class="submit block"><iron-icon icon="check"></iron-icon><span>${ButtonSave}</span></paper-button>
+                </button>
+
+            </form>
+        </div>
+    </div>
+</div>

dashboard-ui/scripts/librarydisplay.js

@@ -0,0 +1,54 @@
+define(['globalize'], function (globalize) {
+
+    function getTabs() {
+        return [
+        {
+            href: 'library.html',
+            name: globalize.translate('TabFolders')
+        },
+         {
+             href: 'librarydisplay.html',
+             name: globalize.translate('TabDisplay')
+         },
+         {
+             href: 'librarypathmapping.html',
+             name: globalize.translate('TabPathSubstitution')
+         },
+         {
+             href: 'librarysettings.html',
+             name: globalize.translate('TabAdvanced')
+         }];
+    }
+
+    return function (view, params) {
+
+        var self = this;
+
+        view.querySelector('form').addEventListener('submit', function (e) {
+
+            Dashboard.showLoadingMsg();
+
+            var form = this;
+
+            ApiClient.getServerConfiguration().then(function (config) {
+
+                config.EnableFolderView = form.querySelector('.chkFolderView').checked;
+                ApiClient.updateServerConfiguration(config).then(Dashboard.processServerConfigurationUpdateResult);
+            });
+
+            e.preventDefault();
+            return false;
+        });
+
+        function loadData() {
+            ApiClient.getServerConfiguration().then(function (config) {
+                view.querySelector('.chkFolderView').checked = config.EnableFolderView;
+            });
+        }
+
+        view.addEventListener('viewshow', function () {
+            LibraryMenu.setTabs('librarysetup', 1, getTabs);
+            loadData();
+        });
+    };
+});

dashboard-ui/scripts/librarypathmapping.js

@@ -117,6 +117,10 @@
         {
             href: 'library.html',
             name: Globalize.translate('TabFolders')
+        },
+         {
+             href: 'librarydisplay.html',
+             name: Globalize.translate('TabDisplay')
          },
          {
              href: 'librarypathmapping.html',
@@ -139,7 +143,7 @@
 
     }).on('pageshow', "#libraryPathMappingPage", function () {
 
-        LibraryMenu.setTabs('librarysetup', 1, getTabs);
+        LibraryMenu.setTabs('librarysetup', 2, getTabs);
         Dashboard.showLoadingMsg();
 
         var page = this;

dashboard-ui/scripts/librarysettings.js

@@ -131,6 +131,10 @@
         {
             href: 'library.html',
             name: Globalize.translate('TabFolders')
+        },
+         {
+             href: 'librarydisplay.html',
+             name: Globalize.translate('TabDisplay')
          },
          {
              href: 'librarypathmapping.html',
@@ -144,7 +148,7 @@
 
     $(document).on('pageshow', "#librarySettingsPage", function () {
 
-        LibraryMenu.setTabs('librarysetup', 2, getTabs);
+        LibraryMenu.setTabs('librarysetup', 3, getTabs);
         Dashboard.showLoadingMsg();
 
         var page = this;

dashboard-ui/scripts/medialibrarypage.js

@@ -458,6 +458,10 @@
         {
             href: 'library.html',
             name: Globalize.translate('TabFolders')
+        },
+         {
+             href: 'librarydisplay.html',
+             name: Globalize.translate('TabDisplay')
          },
          {
              href: 'librarypathmapping.html',

dashboard-ui/scripts/site.js

@@ -1958,7 +1958,7 @@ var AppInfo = {};
         define("montserratFont", ['css!' + embyWebComponentsBowerPath + '/fonts/montserrat/style']);
         define("scrollStyles", ['css!' + embyWebComponentsBowerPath + '/scrollstyles']);
 
-        define("viewcontainer", ['components/viewcontainer-lite'], returnFirstDependency);
+        define("viewcontainer", ['components/viewcontainer-lite', embyWebComponentsBowerPath + '/viewmanager/viewcontainer-lite'], returnFirstDependency);
         define('queryString', [bowerPath + '/query-string/index'], function () {
             return queryString;
         });
@@ -2574,6 +2574,14 @@ var AppInfo = {};
             roles: 'admin'
         });
 
+        defineRoute({
+            path: '/librarydisplay.html',
+            dependencies: ['paper-button', 'paper-checkbox'],
+            autoFocus: false,
+            roles: 'admin',
+            controller: 'scripts/librarydisplay'
+        });
+
         defineRoute({
             path: '/librarypathmapping.html',
             dependencies: [],

dashboard-ui/strings/en-US.json

@@ -1136,7 +1136,8 @@
   "OptionOthers": "Others",
   "HeaderDownloadPeopleMetadataForHelp": "Enabling additional options will provide more on-screen information but will result in slower library scans.",
   "ViewTypeFolders": "Folders",
-  "LabelDisplayFoldersView": "Display a folders view to show plain media folders",
+  "OptionDisplayFolderView": "Display a folder view to show plain media folders",
+  "OptionDisplayFolderViewHelp": "If enabled, Emby apps wil display a Folders category alongside your media library. This is useful if you'd like to have plain folder views.",
   "ViewTypeLiveTvRecordingGroups": "Recordings",
   "ViewTypeLiveTvChannels": "Channels",
   "LabelEasyPinCode": "Easy pin code:",