add sharing function

dashboard-ui/cordova/chromecast.js

@@ -27,14 +27,14 @@
 
         $(castPlayer).on("connect", function (e) {
 
-            console.log('cc: connect');
+            Logger.log('cc: connect');
             // Reset this so the next query doesn't make it appear like content is playing.
             self.lastPlayerData = {};
         });
 
         $(castPlayer).on("playbackstart", function (e, data) {
 
-            console.log('cc: playbackstart');
+            Logger.log('cc: playbackstart');
 
             var state = self.getPlayerStateInternal(data);
             $(self).trigger("playbackstart", [state]);
@@ -42,7 +42,7 @@
 
         $(castPlayer).on("playbackstop", function (e, data) {
 
-            console.log('cc: playbackstop');
+            Logger.log('cc: playbackstop');
             var state = self.getPlayerStateInternal(data);
 
             $(self).trigger("playbackstop", [state]);
@@ -53,7 +53,7 @@
 
         $(castPlayer).on("playbackprogress", function (e, data) {
 
-            console.log('cc: positionchange');
+            Logger.log('cc: positionchange');
             var state = self.getPlayerStateInternal(data);
 
             $(self).trigger("positionchange", [state]);
@@ -418,7 +418,7 @@
             data = data || self.lastPlayerData;
             self.lastPlayerData = data;
 
-            console.log(JSON.stringify(data));
+            Logger.log(JSON.stringify(data));
             return data;
         };
 
@@ -461,7 +461,7 @@
         }
 
         function handleSessionDisconnect() {
-            console.log("session disconnected");
+            Logger.log("session disconnected");
 
             cleanupSession();
             MediaController.removeActivePlayer(PlayerName);
@@ -471,7 +471,7 @@
 
             currentWebAppSession = webAppSession;
 
-            console.log('session.connect succeeded');
+            Logger.log('session.connect succeeded');
             webAppSession.setWebAppSessionListener();
 
             MediaController.setActivePlayer(PlayerName, convertDeviceToTarget(device));
@@ -510,6 +510,7 @@
         }
 
         function handleSessionError() {
+            Logger.log('chromecast session connect error');
             cleanupSession();
         }
 
@@ -532,40 +533,46 @@
 
         function tryLaunchWebSession(device) {
 
-            console.log('calling launchWebApp');
+            Logger.log('calling launchWebApp');
             device.getWebAppLauncher().launchWebApp(ApplicationID).success(function (session) {
 
-                console.log('launchWebApp success. calling onSessionConnected');
+                Logger.log('launchWebApp success. calling onSessionConnected');
-                setupWebAppSession(device, session, true);
+                if ($.browser.android) {
+                    tryJoinWebSession(device, true, false);
+                } else {
+                    setupWebAppSession(device, session, true);
+                }
 
             }).error(function (err1) {
 
-                console.log('launchWebApp error:' + JSON.stringify(err1));
+                Logger.log('launchWebApp error:' + JSON.stringify(err1));
 
             });
         }
 
-        function tryJoinWebSession(device, enableRetry) {
+        function tryJoinWebSession(device, enableRetry, enableLaunch) {
 
             // First try to join existing session. If it fails, launch a new one
 
-            console.log('calling joinWebApp');
+            Logger.log('calling joinWebApp');
             device.getWebAppLauncher().joinWebApp(ApplicationID).success(function (session) {
 
-                console.log('joinWebApp success. calling onSessionConnected');
+                Logger.log('joinWebApp success. calling onSessionConnected');
                 setupWebAppSession(device, session, false);
 
             }).error(function (err) {
 
-                console.log('joinWebApp error: ' + JSON.stringify(err));
+                Logger.log('joinWebApp error: ' + JSON.stringify(err));
 
                 if (enableRetry) {
-                    tryJoinWebSession(device, false);
+                    tryJoinWebSession(device, false, true);
                     return;
                 }
 
-                console.log('calling launchWebApp');
+                if (enableLaunch) {
-                tryLaunchWebSession(device);
+                    Logger.log('calling launchWebApp');
+                    tryLaunchWebSession(device);
+                }
 
             });
         }
@@ -576,14 +583,14 @@
                 cleanupSession();
             }
 
-            tryJoinWebSession(device, true);
+            tryJoinWebSession(device, true, true);
         }
 
         function onDeviceReady(device) {
 
             device.off("ready");
 
-            console.log('creating webAppSession');
+            Logger.log('creating webAppSession');
 
             launchWebApp(device);
         }
@@ -610,7 +617,7 @@
 
         self.tryPairWithDevice = function (device, deferred) {
 
-            console.log('Will attempt to connect to Chromecast');
+            Logger.log('Will attempt to connect to Chromecast');
 
             device.on("disconnect", function () {
                 device.off("ready");
@@ -618,18 +625,18 @@
             });
 
             if (device.isReady()) {
-                console.log('Device is already ready, calling onDeviceReady');
+                Logger.log('Device is already ready, calling onDeviceReady');
                 onDeviceReady(device);
             } else {
 
-                console.log('Binding device ready handler');
+                Logger.log('Binding device ready handler');
 
                 device.on("ready", function () {
-                    console.log('device.ready fired');
+                    Logger.log('device.ready fired');
                     onDeviceReady(device);
                 });
 
-                console.log('Calling device.connect');
+                Logger.log('Calling device.connect');
                 device.connect();
             }
         };

dashboard-ui/cordova/sharingwidget.js

@@ -0,0 +1,31 @@
+(function () {
+
+    function showMenu(options, successCallback, cancelCallback) {
+
+        Dashboard.confirm(Globalize.translate('ButtonShareHelp'), Globalize.translate('HeaderConfirm'), function (confirmed) {
+
+            if (!confirmed) {
+                cancelCallback(options);
+                return;
+            }
+
+            var shareInfo = options.share;
+
+            window.plugins.socialsharing.share(shareInfo.Overview, shareInfo.Name, shareInfo.ImageUrl, shareInfo.Url, function () {
+
+                successCallback(options);
+
+            }, function () {
+
+                cancelCallback(options);
+            });
+        });
+
+    }
+
+    window.SharingWidget = {
+        showMenu: showMenu
+    };
+
+
+})();

dashboard-ui/css/librarybrowser.css

@@ -56,12 +56,21 @@
     padding-top: 10px;
 }
 
+.pageWithAbsoluteTabs .pageTabContent {
+    padding-top: 10px;
+}
+
 @media all and (max-width: 1200px) {
 
     .libraryPage > .ui-content {
         padding-left: .5em !important;
         padding-right: .5em !important;
     }
+
+    .pageWithAbsoluteTabs .pageTabContent {
+        padding-left: .5em !important;
+        padding-right: .5em !important;
+    }
 }
 
 .libraryPage .currentUsername {

dashboard-ui/css/librarymenu.css

@@ -171,7 +171,6 @@
 }
 
 .libraryViewNav {
-    height: 49px;
     overflow: hidden;
     position: fixed;
     right: 0;
@@ -189,30 +188,32 @@
     -webkit-overflow-scrolling: touch;
 }
 
-    .libraryViewNav .material-icons {
+.libraryViewNavWithMinHeight {
-        display: none;
+    min-height: 48px;
-    }
+}
+
+.viewMenuBar, .libraryViewNav {
+    background-color: #111;
+}
+
+.paperLibraryViewNav {
+    background-color: transparent !important;
+}
+
+.libraryViewNav .material-icons {
+    display: none;
+}
 
 .bottomSecondaryNav .libraryViewNav {
     top: initial;
     bottom: 0;
-    border-top: 1px solid #444;
-    height: 51px;
 }
 
-.viewMenuBar {
+.libraryViewNav::-webkit-scrollbar {
-    background-color: #111;
+    height: 0 !important;
+    display: none;
 }
 
-.libraryViewNav {
-    background-color: #111;
-}
-
-    .libraryViewNav::-webkit-scrollbar {
-        height: 0 !important;
-        display: none;
-    }
-
 .viewMenuLink {
     text-decoration: none;
     color: #eee !important;
@@ -253,12 +254,7 @@
     background-color: #212121;
 }
 
-.libraryViewNav:not(.paperLibraryViewNav) .ui-btn-active {
+.libraryViewNav a {
-    border-bottom-color: #38c;
-    color: #fff !important;
-}
-
-.libraryViewNav:not(.paperLibraryViewNav) a {
     display: inline-block;
     padding: 14px 13px 11px;
     color: rgba(255,255,255,.8) !important;
@@ -266,37 +262,26 @@
     margin: 0 0;
     position: relative;
     font-weight: normal;
-    border-bottom: 5px solid transparent;
+    border-bottom: 4px solid transparent;
 }
 
-.paperLibraryViewNav a {
+.libraryViewNav .ui-btn-active {
-    color: #ddd !important;
+    border-bottom-color: #38c;
-    text-decoration: none;
+    color: #fff !important;
-    text-align: center;
-    vertical-align: middle;
-    line-height: 48px;
 }
 
-.paperLibraryViewNav .iron-selected a {
+.libraryViewNav .iron-selected a {
     color: inherit !important;
     text-decoration: none;
     text-align: center;
 }
 
-.basicPaperLibraryTabs .libraryViewNav .tab-content {
-    border-bottom: 6px solid transparent;
-}
-
-.basicPaperLibraryTabs .libraryViewNav .iron-selected .tab-content {
-    border-bottom: 6px solid #38c;
-}
-
 .basicPaperLibraryTabs .libraryViewNav paper-tabs {
     display: none;
 }
 
-.libraryViewNav:not(.paperLibraryViewNav) a:not(.ui-btn-active):hover {
+.libraryViewNav a:not(.ui-btn-active):hover {
-    color: #2ad !important;
+    color: #2ad;
 }
 
 @media all and (max-width: 500px) {

dashboard-ui/css/site.css

@@ -494,9 +494,14 @@ h1 a:hover {
     transform: translateY(-100%);
 }
 
-.libraryViewNav.headroom--unpinned:not(.headroomDisabled) {
+.libraryViewNav:not(.paperLibraryViewNav).headroom--unpinned:not(.headroomDisabled) {
-    -webkit-transform: translateY(-200%);
+    -webkit-transform: translateY(-203.5%);
-    transform: translateY(-200%);
+    transform: translateY(-203.5%);
+}
+
+.paperLibraryViewNav.headroom--unpinned:not(.headroomDisabled) {
+    -webkit-transform: translateY(-203.5%);
+    transform: translateY(-203.5%);
 }
 
 .largePanel {

dashboard-ui/index.html

@@ -7,7 +7,7 @@
 
     <div id="indexPage" data-role="page" class="page homePage libraryPage allLibraryPage backdropPage pageWithAbsoluteTabs" data-backdroptype="movie,series,game,book" data-require="scripts/sections,scripts/indexpage,scripts/homenextup,scripts/favorites,scripts/homeupcoming,paperbuttonstyle">
 
-        <div class="libraryViewNav">
+        <div class="libraryViewNav libraryViewNavWithMinHeight">
             <paper-tabs style="display:none;">
                 <paper-tab><i class="material-icons">home</i>${TabHome}</paper-tab>
                 <paper-tab><i class="material-icons">navigate_next</i>${TabNextUp}</paper-tab>
@@ -15,10 +15,10 @@
                 <paper-tab><i class="material-icons">schedule</i>${TabUpcoming}</paper-tab>
             </paper-tabs>
             <div class="legacyTabs" style="display:none;">
-                <a href="index.html" class="ui-btn-active">${TabHome}</a>
+                <a href="index.html" class="ui-btn-active"><i class="material-icons">home</i>${TabHome}</a>
-                <a href="index.html?tab=1">${TabNextUp}</a>
+                <a href="index.html?tab=1"><i class="material-icons">navigate_next</i>${TabNextUp}</a>
-                <a href="index.html?tab=2">${TabFavorites}</a>
+                <a href="index.html?tab=2"><i class="material-icons">favorite</i>${TabFavorites}</a>
-                <a href="index.html?tab=3">${TabUpcoming}</a>
+                <a href="index.html?tab=3"><i class="material-icons">schedule</i>${TabUpcoming}</a>
             </div>
         </div>
 
@@ -31,7 +31,7 @@
 
         <div class="pageBackground"></div>
         <div class="ehsContent">
-            <neon-animated-pages entry-animation="slide-from-right-animation" exit-animation="slide-left-animation">
+            <neon-animated-pages>
                 <neon-animatable>
                     <div class="pageTabContent homeTabContent">
                         <div class="sections"></div>

dashboard-ui/nowplaying.html

@@ -143,7 +143,7 @@
                 </neon-animatable>
             </neon-animated-pages>
 
-            <paper-tabs selected="{{selected}}" style="position:fixed;bottom:0;left:0;right:0;" alignbottom>
+            <paper-tabs selected="{{selected}}" style="position:fixed;bottom:0;left:0;right:0;" class="bottomTabs">
 
                 <paper-tab>${TabNowPlaying}</paper-tab>
                 <paper-tab>${TabControls}</paper-tab>

dashboard-ui/scripts/favorites.js

@@ -118,7 +118,7 @@
         var page = this;
         var tabContent = page.querySelector('.homeFavoritesTabContent');
 
-        $(page.querySelector('neon-animated-pages')).on('iron-select', function () {
+        $(page.querySelector('neon-animated-pages')).on('tabchange', function () {
 
             if (parseInt(this.selected) == 2) {
                 if (LibraryBrowser.needsRefresh(tabContent)) {

dashboard-ui/scripts/homenextup.js

@@ -83,7 +83,7 @@
         var page = this;
         var tabContent = page.querySelector('.homeNextUpTabContent');
 
-        $(page.querySelector('neon-animated-pages')).on('iron-select', function () {
+        $(page.querySelector('neon-animated-pages')).on('tabchange', function () {
             
             if (parseInt(this.selected) == 1) {
                 if (LibraryBrowser.needsRefresh(tabContent)) {

dashboard-ui/scripts/homeupcoming.js

@@ -64,7 +64,7 @@
         var page = this;
         var tabContent = page.querySelector('.homeUpcomingTabContent');
 
-        $(page.querySelector('neon-animated-pages')).on('iron-select', function () {
+        $(page.querySelector('neon-animated-pages')).on('tabchange', function () {
 
             if (parseInt(this.selected) == 3) {
                 if (LibraryBrowser.needsRefresh(tabContent)) {

dashboard-ui/scripts/indexpage.js

@@ -210,10 +210,6 @@
 
         var page = this;
 
-        Events.on(page.querySelector('.btnTakeTour'), 'click', function () {
-            takeTour(page, Dashboard.getCurrentUserId());
-        });
-
         var tabs = page.querySelector('paper-tabs');
         LibraryBrowser.configurePaperLibraryTabs(page, page.querySelectorAll('paper-tabs')[0], page.querySelectorAll('neon-animated-pages')[0]);
 
@@ -232,22 +228,25 @@
             }
         });
 
-        $(page.querySelector('neon-animated-pages')).on('iron-select', function () {
+        $(page.querySelector('neon-animated-pages')).on('tabchange', function () {
             loadTab(page, parseInt(this.selected));
         });
 
-    }).on('pagebeforeshowready', "#indexPage", function () {
+        $(page.querySelector('neon-animated-pages')).on('iron-select', function () {
 
-        var page = this;
+            // When transition animations are used, add a content loading delay to allow the animations to finish
+            // Otherwise with both operations happening at the same time, it can cause the animation to not run at full speed.
+            var delay = LibraryBrowser.enableFullPaperTabs() ? 500 : 0;
+            var pages = this;
+            setTimeout(function () {
+                $(pages).trigger('tabchange');
+            }, delay);
+        });
 
-        var tabs = page.querySelector('paper-tabs');
+        Events.on(page.querySelector('.btnTakeTour'), 'click', function () {
-        var selected = tabs.selected;
+            takeTour(page, Dashboard.getCurrentUserId());
+        });
 
-        if (selected == null) {
-            selected = parseInt(getParameterByName('tab') || '0');
-            tabs.selected = selected;
-            page.querySelector('neon-animated-pages').selected = selected;
-        }
     });
 
     function getDisplayPreferencesAppName() {

dashboard-ui/scripts/itemdetailpage.js

@@ -52,7 +52,7 @@
                 $('.btnSync', page).addClass('hide');
             }
 
-            if (user.Policy.EnablePublicSharing) {
+            if (LibraryBrowser.canShare(item, user)) {
                 $('.btnShare', page).removeClass('hide');
             } else {
                 $('.btnShare', page).addClass('hide');

dashboard-ui/scripts/librarybrowser.js

@@ -90,12 +90,16 @@
             }
 
             var now = new Date().getTime();
-            var cacheDuration = 300000;
+            var cacheDuration;
-            if (!AppInfo.isNativeApp && ($.browser.ipad || $.browser.iphone || $.browser.android)) {
+
+            if (AppInfo.isNativeApp) {
+                cacheDuration = 300000;
+            }
+            else if ($.browser.ipad || $.browser.iphone || $.browser.android) {
                 cacheDuration = 10000;
             }
 
-            else if (!$.browser.mobile) {
+            else {
                 cacheDuration = 60000;
             }
 
@@ -167,13 +171,33 @@
 
             tabs.hideScrollButtons = true;
 
+            if (AppInfo.enableBottomTabs) {
+                tabs.alignBottom = true;
+                tabs.classList.add('bottomTabs');
+            }
+
             if (LibraryBrowser.enableFullPaperTabs()) {
 
                 $(tabs).show();
 
-                LibraryBrowser.configureSwipeTabs(ownerpage, tabs, pages);
+                if ($.browser.safari) {
 
-                $('.libraryViewNav', ownerpage).addClass('paperLibraryViewNav');
+                    // Not very iOS-like I suppose
+                    tabs.noSlide = true;
+                    tabs.noink = true;
+                    tabs.noBar = true;
+                }
+                else {
+                    // Safari doesn't handle the horizontal swiping very well
+
+                    // Not very iOS-like I suppose
+                    pages.entryAnimation = 'slide-from-right-animation';
+                    pages.exitAnimation = 'slide-left-animation';
+
+                    LibraryBrowser.configureSwipeTabs(ownerpage, tabs, pages);
+                }
+
+                $('.libraryViewNav', ownerpage).addClass('paperLibraryViewNav').removeClass('libraryViewNavWithMinHeight');
 
             } else {
 
@@ -190,7 +214,32 @@
                     var selected = this.selected;
                     $('a', legacyTabs).removeClass('ui-btn-active')[selected].classList.add('ui-btn-active');
                 });
+
+                $('.libraryViewNav', ownerpage).removeClass('libraryViewNavWithMinHeight');
             }
+
+            $(ownerpage).on('pagebeforeshowready', LibraryBrowser.onTabbedPageBeforeShowReady);
+        },
+
+        onTabbedPageBeforeShowReady: function () {
+            var page = this;
+
+            var tabs = page.querySelector('paper-tabs');
+            var selected = tabs.selected;
+
+            if (selected == null) {
+                selected = parseInt(getParameterByName('tab') || '0');
+                tabs.selected = selected;
+                page.querySelector('neon-animated-pages').selected = selected;
+
+            } else if (!LibraryBrowser.enableFullPaperTabs()) {
+                Events.trigger(page.querySelector('neon-animated-pages'), 'tabchange');
+            }
+        },
+
+        canShare: function (item, user) {
+
+            return user.Policy.EnablePublicSharing;
         },
 
         getDateParamValue: function (date) {

dashboard-ui/scripts/librarylist.js

@@ -323,6 +323,14 @@
                 });
             }
 
+            if (user.Policy.EnablePublicSharing) {
+                items.push({
+                    name: Globalize.translate('ButtonShare'),
+                    id: 'share',
+                    ironIcon: 'share'
+                });
+            }
+
             if (commands.indexOf('sync') != -1) {
                 items.push({
                     name: Globalize.translate('ButtonSync'),
@@ -445,6 +453,11 @@
                             case 'externalplayer':
                                 LibraryBrowser.playInExternalPlayer(itemId);
                                 break;
+                            case 'share':
+                                require(['sharingmanager'], function () {
+                                    SharingManager.showMenu(Dashboard.getCurrentUserId(), itemId);
+                                });
+                                break;
                             case 'removefromplaylist':
                                 $(card).parents('.itemsContainer').trigger('removefromplaylist', [playlistItemId]);
                                 break;

dashboard-ui/scripts/nowplayingpage.js

@@ -664,34 +664,6 @@
         return false;
     }
 
-    function getBackdropUrl(item) {
-
-        var screenWidth = screen.availWidth;
-
-        if (item.BackdropImageTags && item.BackdropImageTags.length) {
-
-            return ApiClient.getScaledImageUrl(item.Id, {
-                type: "Backdrop",
-                index: 0,
-                maxWidth: screenWidth,
-                tag: item.BackdropImageTags[0]
-            });
-
-        }
-        else if (item.ParentBackdropItemId && item.ParentBackdropImageTags && item.ParentBackdropImageTags.length) {
-
-            return ApiClient.getScaledImageUrl(item.ParentBackdropItemId, {
-                type: 'Backdrop',
-                index: 0,
-                maxWidth: screenWidth,
-                tag: item.ParentBackdropImageTags[0]
-            });
-
-        }
-
-        return null;
-    };
-
     function updateCastIcon() {
 
         var info = MediaController.getPlayerInfo();
@@ -728,7 +700,10 @@
 
         $('.requiresJqmCreate', this).trigger('create');
 
-        LibraryBrowser.configureSwipeTabs(page, page.querySelectorAll('paper-tabs')[0], page.querySelectorAll('neon-animated-pages')[0]);
+        var tabs = page.querySelectorAll('paper-tabs')[0];
+        tabs.alignBottom = true;
+
+        LibraryBrowser.configureSwipeTabs(page, tabs, page.querySelectorAll('neon-animated-pages')[0]);
 
         $(MediaController).on('playerchange', function () {
             updateCastIcon(page);

dashboard-ui/scripts/sharingwidget.js

@@ -14,7 +14,14 @@
             html += '<h2>' + Globalize.translate('HeaderShare') + '</h2>';
 
             html += '<div>';
-            html += '<div class="ssk-group ssk-round ssk-lg"><a href="" class="ssk ssk-facebook"></a><a href="" class="ssk ssk-twitter"></a><a href="" class="ssk ssk-google-plus"></a><a href="" class="ssk ssk-pinterest"></a><a href="" class="ssk ssk-tumblr"></a></div>';
+            html += '<div class="ssk-group ssk-round ssk-lg">';
+
+            // We can only do facebook if we can guarantee that the current page is available over the internet, since FB will try to probe it.
+            if (Dashboard.isConnectMode()) {
+                html += '<a href="" class="ssk ssk-facebook"></a>';
+            }
+
+            html += '<a href="" class="ssk ssk-twitter"></a><a href="" class="ssk ssk-google-plus"></a><a href="" class="ssk ssk-pinterest"></a><a href="" class="ssk ssk-tumblr"></a></div>';
             html += '</div>';
 
             html += '<div style="max-width:240px;">';

dashboard-ui/scripts/site.js

@@ -595,7 +595,7 @@ var Dashboard = {
 
                 callback(index == 1);
 
-            }, title || Globalize.translate('HeaderAlert'), buttonLabels.join(','));
+            }, title || Globalize.translate('HeaderConfirm'), buttonLabels.join(','));
 
         } else {
             Dashboard.confirmInternal(message, title, true, callback);
@@ -1974,7 +1974,6 @@ var AppInfo = {};
 
         define("connectservice", ["apiclient/connectservice"]);
         define("paperbuttonstyle", [], function () {
-            Dashboard.importCss('thirdparty/paper-button-style.css');
             return {};
         });
         define("jqmicons", [], function () {
@@ -2001,7 +2000,12 @@ var AppInfo = {};
         }
 
         define("sharingmanager", ["scripts/sharingmanager"]);
-        define("sharingwidget", ["scripts/sharingwidget"]);
+
+        if (Dashboard.isRunningInCordova()) {
+            define("sharingwidget", ["cordova/sharingwidget"]);
+        } else {
+            define("sharingwidget", ["scripts/sharingwidget"]);
+        }
 
         //requirejs(['http://viblast.com/player/free-version/qy2fdwajo1/viblast.js']);
 
@@ -2181,7 +2185,7 @@ $(document).on('pagecreate', ".page", function () {
             }
         }
 
-        if (!isConnectMode && this.id !== "loginPage" && !page.classList.contains('forgotPasswordPage') && !page.classList.contains('wizardPage')) {
+        if (!isConnectMode && this.id !== "loginPage" && !page.classList.contains('forgotPasswordPage') && !page.classList.contains('wizardPage') && this.id !== 'publicSharedItemPage') {
 
             Logger.log('Not logged into server. Redirecting to login.');
             Dashboard.logout();

dashboard-ui/share.html

@@ -4,7 +4,7 @@
     <title>Emby</title>
 </head>
 <body>
-    <div id="publicSharedItemPage" data-role="page" class="page libraryPage noSecondaryNavPage" data-theme="b" data-require="paperbuttonstyle">
+    <div id="publicSharedItemPage" data-role="page" class="page standalonePage noSecondaryNavPage" data-theme="b" data-require="paperbuttonstyle">
 
         <div data-role="content">
 

dashboard-ui/themes/android.css

@@ -1,9 +1,9 @@
-.viewMenuBar, .libraryViewNav {
+.viewMenuBar, .libraryViewNav:not(.paperLibraryViewNav), paper-tabs {
-    background-color: #191919;
+    background-color: #1b1b1b;
 }
 
-.ui-page-theme-b {
+.ui-page-theme-b:not(.pageWithAbsoluteTabs), .pageWithAbsoluteTabs .pageBackground {
-    background-color: #292929;
+    background-color: #2b2b2b;
 }
 
 .backdropPage.ui-page-theme-b {
@@ -17,6 +17,11 @@
 .ui-page-theme-b .visualCardBox {
     background: rgba(56,56,56,.85);
 }
-.libraryViewNav a{
+
-    font-weight: 500;
+.libraryViewNav a {
-}
+    font-weight: 500!important;
+}
+
+paper-tab {
+    font-weight: 500!important;
+}

dashboard-ui/themes/ios.css

@@ -9,7 +9,7 @@ html, body {
 }
 
 
-.viewMenuBar, .libraryViewNav {
+.viewMenuBar, .libraryViewNav, paper-tabs {
     background-color: rgba(28,28,28,.97);
 }
 
@@ -25,7 +25,29 @@ html, body {
     font-weight: 400;
     text-transform: none;
     color: #ccc !important;
-    padding-top: 16px;
+    padding: 12px 13px 8px;
+}
+
+.libraryViewNav .tab-content {
+    display: block !important;
+}
+
+.libraryViewNav paper-tab {
+    height: auto !important;
+}
+
+.libraryViewNav .material-icons {
+    display: block;
+    margin-top: -6px;
+    font-size: 15px;
+}
+
+.libraryViewNav paper-tab .material-icons {
+    margin-top: 0;
+}
+
+.libraryViewNav #selectionBar {
+    background-color: transparent !important;
 }
 
 @media all and (max-width: 600px) {
@@ -36,13 +58,19 @@ html, body {
     }
 }
 
-.libraryViewNav .ui-btn-active {
+.libraryViewNav a {
-    border-bottom-color: transparent;
+    border-bottom: 0;
+}
+
+.libraryViewNav .ui-btn-active, .libraryViewNav .iron-selected {
     color: #539FFD !important;
 }
 
 .libraryViewNav {
-    border-top: 1px solid #333;
+    border-top: 1px solid #333 !important;
+}
+
+.libraryViewNav, paper-tabs {
     font-size: 12px;
 }
 
@@ -92,6 +120,10 @@ h1, h1 a {
     font-weight: 400;
 }
 
+paper-tab {
+    text-transform: none !important;
+}
+
 .visualCardBox {
     background: none !important;
     -moz-box-shadow: none;
@@ -118,12 +150,6 @@ h1, h1 a {
     margin: 0 auto !important;
 }
 
-.libraryViewNav .material-icons {
-    display: block;
-    margin-top: -6px;
-    font-size: 15px;
-}
-
 .btnActiveCast i {
     color: #539FFD !important;
 }

dashboard-ui/thirdparty/paper-button-style.css

@@ -250,17 +250,13 @@ paper-dialog[role="alertdialog"] + iron-overlay-backdrop {
     background-color: #000 !important;
 }
 
-paper-tabs, paper-toolbar {
+paper-tabs {
     background-color: #111;
     color: #fff;
     box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.2);
 }
 
-    paper-toolbar paper-tabs {
+    paper-tabs.bottomTabs {
-        box-shadow: none;
-    }
-
-    paper-tabs[alignBottom] {
         box-shadow: 0px -2px 6px rgba(0, 0, 0, 0.15);
     }
 
@@ -269,11 +265,11 @@ paper-tab {
     font-weight: 400;
 }
 
-paper-tabs:not([alignbottom]) #selectionBar {
+paper-tabs #selectionBar {
     background-color: #38c !important;
 }
 
-paper-tabs:not([alignbottom]) paper-ripple {
+paper-tabs paper-ripple {
     color: #38c !important;
 }
 
@@ -320,15 +316,17 @@ paper-menu-item {
     padding: .35em .5em;
 }
 
-paper-menu-item iron-icon {
+    paper-menu-item iron-icon {
-    margin-right: 1.5em;
+        margin-right: 1.5em;
-}
+    }
+
 .actionSheetMenuItem {
     cursor: pointer;
 }
-.actionSheetMenuItem:hover {
+
-    background: #eee;
+    .actionSheetMenuItem:hover {
-}
+        background: #eee;
+    }
 
 .scrollablePaperTabs paper-icon-button {
     display: none !important;