consolidate slideout panels

dashboard-ui/css/card.css

@@ -44,7 +44,7 @@
 }
 
 .cardBox {
-    margin: 1px;
+    margin: 3px;
 }
 
 .largeCardMargin .cardBox {
@@ -55,12 +55,12 @@
     margin: 4px;
 }
 
-/*@media all and (max-width: 600px) {
+@media all and (max-width: 600px) {
 
     .cardBox {
-        margin: 0;
+        margin: 1px;
     }
-}*/
+}
 
 .grayscale {
     -webkit-filter: grayscale(100%);

dashboard-ui/css/librarybrowser.css

@@ -704,7 +704,7 @@ span.itemCommunityRating:not(:empty) + .userDataIcons {
 }
 
 .lblDetailTab {
-    border-color: #1f1f1f !important;
+    border-color: #212121 !important;
 }
 
 .editMetadataForm {

dashboard-ui/css/librarymenu.css

@@ -8,7 +8,7 @@
 
 .libraryMenuDivider {
     height: 1px;
-    background: #282828;
+    background: #333;
     margin: .5em 0;
 }
 
@@ -196,7 +196,7 @@
     }
 
         .librarySidebarLinks a:hover {
-            background-color: #38c !important;
+            background-color: #383838 !important;
             color: #fff !important;
         }
 
@@ -208,7 +208,7 @@
 }
 
 .selectedMediaFolder {
-    background-color: #52B54B !important;
+    background-color: #3388cc !important;
     color: #fff !important;
 }
 
@@ -217,7 +217,7 @@
 }
 
 .ui-panel.ui-body-b {
-    background-color: #161616;
+    background-color: #212121;
 }
 
 .libraryViewNav .ui-btn-active {

dashboard-ui/css/site.css

@@ -243,6 +243,22 @@ body:not(.enableBackButton) .headerBackButton {
     left: 270px !important;
 }
 
+@media all and (min-width: 340px) {
+
+    .largePanel {
+        width: 300px;
+    }
+
+    /* Make panels larger */
+    .largePanelModalOpen.ui-panel-dismiss-position-right {
+        right: 300px !important;
+    }
+
+    .largePanelModalOpen.ui-panel-dismiss-position-left {
+        left: 300px !important;
+    }
+}
+
 
 pre, textarea.pre {
     display: block;
@@ -453,12 +469,17 @@ h1 .imageLink {
 }
 
 .sidebarLinkIcon {
-    font-size: 17px;
+    font-size: 16px;
     width: 66px;
     text-align: center;
     vertical-align: middle;
+    color: #ddd;
 }
 
+    .sidebarLinkIcon + span {
+        vertical-align: middle;
+    }
+
 .ui-page-theme-a .sidebarLinkIcon {
     color: #666;
 }
@@ -473,8 +494,9 @@ h1 .imageLink {
 
 .sidebarHeader {
     padding-left: 20px;
-    margin: 1em 0;
+    margin: 15px 0 10px;
     font-size: 90%;
+    color: #ccc;
 }
 
 .ui-page-theme-a .sidebarHeader {

dashboard-ui/scripts/extensions.js

@@ -126,8 +126,17 @@ var WebNotifications = {
 
         if (window.cordova && window.cordova.plugins && window.cordova.plugins.notification) {
 
+            if (!WebNotifications.lastId) {
+                // Cordova plugin will crash on android with long. need an int
+                WebNotifications.lastId = new Date().getDate() + new Date().getMilliseconds();
+            }
+
+            WebNotifications.lastId++;
+
             window.cordova.plugins.notification.local.schedule({
-                id: new Date().getTime(),
+
+                id: WebNotifications.lastId,
+
                 title: data.title,
                 text: data.body,
                 //firstAt: monday_9_am,

dashboard-ui/scripts/itemlistpage.js

@@ -1,6 +1,6 @@
 (function ($, document) {
 
-    var view = LibraryBrowser.getDefaultItemsView('Poster', 'PosterCard');
+    var view = LibraryBrowser.getDefaultItemsView('Poster', 'Poster');
 
     // The base query options
     var query = {

dashboard-ui/scripts/librarymenu.js

@@ -20,15 +20,9 @@
 
         html += '<div class="viewMenuSecondary">';
 
-        if (!AppInfo.enableHeaderImages) {
+        html += '<button id="btnCast" class="btnCast btnDefaultCast headerButton headerButtonRight" type="button" data-role="none" style="display:none;"><div class="headerSelectedPlayer"></div><div class="btnCastImage"></div></button>';
-            html += '<button id="btnCast" class="btnCast btnCastIcon btnDefaultCast headerButton headerButtonRight" type="button" data-role="none" style="display:none;">';
-            html += '<div class="headerSelectedPlayer"></div><i class="fa fa-wifi"></i>';
-            html += '</button>';
-        } else {
-            html += '<button id="btnCast" class="btnCast btnDefaultCast headerButton headerButtonRight" type="button" data-role="none" style="display:none;"><div class="headerSelectedPlayer"></div><div class="btnCastImage"></div></button>';
-        }
 
-        html += '<button onclick="Search.showSearchPanel();" type="button" data-role="none" class="headerButton headerButtonRight headerSearchButton" style="display:none;"><div class="fa fa-search" style="font-size:21px;"></div></button>';
+        html += '<button onclick="Search.showSearchPanel();" type="button" data-role="none" class="headerButton headerButtonRight headerSearchButton" style="display:none;"><div class="fa fa-search"></div></button>';
         html += '<div class="viewMenuSearch hide">';
         html += '<form class="viewMenuSearchForm">';
         html += '<input type="text" data-role="none" data-type="search" class="headerSearchInput" autocomplete="off" spellcheck="off" />';
@@ -37,12 +31,6 @@
         html += '</form>';
         html += '</div>';
 
-        html += '<button class="headerButton headerButtonRight headerUserButton" type="button" data-role="none" onclick="Dashboard.showUserFlyout(this);">';
-
-        html += '<div class="fa fa-user"></div>';
-
-        html += '</button>';
-
         html += '<a href="dashboard.html" class="headerButton headerButtonRight dashboardEntryHeaderButton" style="display:none;"><div class="fa fa-cog"></div></a>';
 
         html += '</div>';
@@ -73,26 +61,6 @@
         } else {
             $('.dashboardEntryHeaderButton', header).hide();
         }
-
-        var userButtonHtml = '';
-        if (user.name) {
-
-            if (user.imageUrl && AppInfo.enableUserImage) {
-
-                var userButtonHeight = 26;
-
-                var url = user.imageUrl;
-
-                if (user.supportsImageParams) {
-                    url += "&height=" + (userButtonHeight * Math.max(devicePixelRatio || 1, 2));
-                }
-
-                userButtonHtml += '<div class="lazy headerUserImage" data-src="' + url + '" style="width:' + userButtonHeight + 'px;height:' + userButtonHeight + 'px;"></div>';
-            } else {
-                userButtonHtml += '<div class="fa fa-user"></div>';
-            }
-            $('.headerUserButton', header).html(userButtonHtml).lazyChildren();
-        }
     }
 
     function bindMenuEvents() {
@@ -143,11 +111,25 @@
         html += '<div class="libraryMenuDivider"></div>';
         html += '<div class="adminMenuOptions">';
 
-        html += '<a class="sidebarLink lnkMediaFolder" data-itemid="dashboard" data-rel="none" href="dashboard.html"><span class="fa fa-cog sidebarLinkIcon"></span>' + Globalize.translate('ButtonDashboard') + '</a>';
+        html += '<div class="sidebarHeader">';
+        html += Globalize.translate('HeaderAdmin');
+        html += '</div>';
+
         html += '<a class="sidebarLink lnkMediaFolder editorViewMenu" data-itemid="editor" href="edititemmetadata.html"><span class="fa fa-edit sidebarLinkIcon"></span>' + Globalize.translate('ButtonMetadataManager') + '</a>';
         html += '<a class="sidebarLink lnkMediaFolder" data-itemid="reports" href="reports.html"><span class="fa fa-bar-chart sidebarLinkIcon"></span>' + Globalize.translate('ButtonReports') + '</a>';
+        html += '<a class="sidebarLink lnkMediaFolder" data-itemid="dashboard" href="dashboard.html"><span class="fa fa-server sidebarLinkIcon"></span>' + Globalize.translate('ButtonServer') + '</a>';
         html += '</div>';
-        html += '<a class="sidebarLink lnkMediaFolder syncViewMenu" data-itemid="mysync" href="mysync.html"><span class="fa fa-cloud sidebarLinkIcon"></span>' + Globalize.translate('ButtonSync') + '</a>';
+
+        html += '<div class="libraryMenuDivider"></div>';
+        html += '<div class="userMenuOptions">';
+
+        if (Dashboard.isConnectMode()) {
+            html += '<a class="sidebarLink lnkMediaFolder" data-itemid="selectserver" href="selectserver.html"><span class="fa fa-globe sidebarLinkIcon"></span>' + Globalize.translate('ButtonSelectServer') + '</a>';
+        }
+
+        html += '<a class="sidebarLink lnkMediaFolder" data-itemid="logout" href="#" onclick="Dashboard.logout();"><span class="fa fa-sign-out sidebarLinkIcon"></span>' + Globalize.translate('ButtonSignOut') + '</a>';
+        html += '</div>';
+
 
         return html;
     }
@@ -162,11 +144,15 @@
             panel = getLibraryMenu(user);
             updateLibraryNavLinks(page);
 
-            $(panel).panel('toggle').off('mouseleave.librarymenu').on('mouseleave.librarymenu', function () {
+            panel = $(panel).panel('toggle').off('mouseleave.librarymenu');
 
-                $(this).panel("close");
+            if (!AppInfo.isTouchPreferred) {
+                panel.on('mouseleave.librarymenu', function () {
 
-            });
+                    $(this).panel("close");
+
+                });
+            }
         });
     }
 
@@ -175,11 +161,15 @@
         var page = $.mobile.activePage;
         var panel = getDashboardMenu(page);
 
-        $(panel).panel('toggle').off('mouseleave.librarymenu').on('mouseleave.librarymenu', function () {
+        panel = $(panel).panel('toggle').off('mouseleave.librarymenu');
 
-            $(this).panel("close");
+        if (!AppInfo.isTouchPreferred) {
+            panel.on('mouseleave.librarymenu', function () {
 
-        });
+                $(this).panel("close");
+
+            });
+        }
     }
 
     function updateLibraryMenu(panel) {
@@ -190,6 +180,7 @@
 
             $('.adminMenuOptions').hide();
             $('.syncViewMenu').hide();
+            $('.userMenuOptions').hide();
             return;
         }
 
@@ -199,7 +190,12 @@
 
             var items = result.Items;
 
-            var html = items.map(function (i) {
+            var html = '';
+            html += '<div class="sidebarHeader">';
+            html += Globalize.translate('HeaderLibrary');
+            html += '</div>';
+
+            html += items.map(function (i) {
 
                 var iconCssClass = 'fa';
 
@@ -290,53 +286,40 @@
 
             html += '<div class="sidebarLinks librarySidebarLinks">';
 
-            var showUserAtTop = AppInfo.isTouchPreferred;
+            var userHref = user.localUser && user.localUser.Policy.EnableUserPreferenceAccess ?
+                'mypreferencesdisplay.html?userId=' + user.localUser.Id :
+                (user.localUser ? 'index.html' : '#');
 
-            if (showUserAtTop) {
+            var hasUserImage = user.imageUrl && AppInfo.enableUserImage;
+            var paddingLeft = hasUserImage ? 'padding-left:.7em;' : '';
+            html += '<a style="margin-top:0;' + paddingLeft + 'display:block;color:#fff;text-decoration:none;font-size:16px;font-weight:400!important;background: #111;" href="' + userHref + '">';
 
-                var userHref = user.localUser && user.localUser.Policy.EnableUserPreferenceAccess ?
+            var imgWidth = 44;
-                    'mypreferencesdisplay.html?userId=' + user.localUser.Id :
-                    (user.localUser ? 'index.html' : '#');
 
-                var hasUserImage = user.imageUrl && AppInfo.enableUserImage;
+            if (hasUserImage) {
-                var paddingLeft = hasUserImage ? 'padding-left:.7em;' : '';
+                var url = user.imageUrl;
-                html += '<a style="margin-top:0;' + paddingLeft + 'display:block;color:#fff;text-decoration:none;font-size:16px;font-weight:400!important;background: #000;" href="' + userHref + '">';
 
-                var imgWidth = 44;
+                if (user.supportsImageParams) {
-
+                    url += "&width=" + (imgWidth * Math.max(devicePixelRatio || 1, 2));
-                if (hasUserImage) {
-                    var url = user.imageUrl;
-
-                    if (user.supportsImageParams) {
-                        url += "&width=" + (imgWidth * Math.max(devicePixelRatio || 1, 2));
-                    }
-
-                    html += '<div class="lazy" data-src="' + url + '" style="width:' + imgWidth + 'px;height:' + imgWidth + 'px;background-size:contain;background-repeat:no-repeat;background-position:center center;border-radius:1000px;vertical-align:middle;margin-right:.8em;display:inline-block;"></div>';
-                } else {
-                    html += '<span class="fa fa-user sidebarLinkIcon"></span>';
                 }
 
-                html += user.name;
+                html += '<div class="lazy" data-src="' + url + '" style="width:' + imgWidth + 'px;height:' + imgWidth + 'px;background-size:contain;background-repeat:no-repeat;background-position:center center;border-radius:1000px;vertical-align:middle;margin-right:.8em;display:inline-block;"></div>';
-                html += '</a>';
+            } else {
-
+                html += '<span class="fa fa-user sidebarLinkIcon"></span>';
-                html += '<div class="libraryMenuDivider" style="margin-top:0;"></div>';
             }
 
+            html += user.name;
+            html += '</a>';
+
+            html += '<div class="libraryMenuDivider" style="margin-top:0;"></div>';
+
             var homeHref = window.ApiClient ? 'index.html' : 'selectserver.html';
 
-            if (showUserAtTop) {
+            html += '<a class="lnkMediaFolder sidebarLink" href="' + homeHref + '"><span class="fa fa-home sidebarLinkIcon"></span><span>' + Globalize.translate('ButtonHome') + '</span></a>';
-                html += '<a class="lnkMediaFolder sidebarLink" href="' + homeHref + '"><span class="fa fa-home sidebarLinkIcon"></span><span>' + Globalize.translate('ButtonHome') + '</span></a>';
 
-            } else {
+            html += '<a class="sidebarLink lnkMediaFolder" data-itemid="remote" href="nowplaying.html"><span class="fa fa-tablet sidebarLinkIcon"></span>' + Globalize.translate('ButtonRemote') + '</a>';
-                html += '<a class="lnkMediaFolder sidebarLink" style="margin-top:.5em;padding-left:1em;display:block;color:#fff;text-decoration:none;" href="' + homeHref + '">';
 
-                html += '<img style="max-width:36px;vertical-align:middle;margin-right:1em;" src="css/images/mblogoicon.png" />';
+            html += '<a class="sidebarLink lnkMediaFolder syncViewMenu" data-itemid="mysync" href="mysync.html"><span class="fa fa-cloud sidebarLinkIcon"></span>' + Globalize.translate('ButtonSync') + '</a>';
-
-                html += Globalize.translate('ButtonHome');
-                html += '</a>';
-            }
-
-            html += '<a class="sidebarLink lnkMediaFolder" data-itemid="dashboard" data-rel="none" href="nowplaying.html"><span class="fa fa-tablet sidebarLinkIcon"></span>' + Globalize.translate('ButtonRemote') + '</a>';
 
             html += '<div class="libraryMenuDivider"></div>';
 

dashboard-ui/scripts/mediacontroller.js

@@ -561,6 +561,11 @@
                 return true;
             }
 
+            if (mediaSource.SupportsDirectPlay && mediaSource.Protocol == 'File') {
+
+                return FileSystem.fileExists(mediaSource.Path);
+            }
+
             return false;
         };
     }

dashboard-ui/scripts/moviesrecommended.js

@@ -2,12 +2,12 @@
 
     function getView() {
 
-        return 'PosterCard';
+        return 'Poster';
     }
 
     function getResumeView() {
 
-        return 'ThumbCard';
+        return 'Thumb';
     }
 
     function enableScrollX() {
@@ -62,7 +62,8 @@
                     shape: getPortraitShape(),
                     centerText: true,
                     lazy: true,
-                    overlayText: true
+                    overlayText: true,
+                    showDetailsMenu: true
                 });
             }
 

dashboard-ui/scripts/photos.js

@@ -168,12 +168,17 @@
 
     function showSlideshow(page, items, startItemId) {
 
+        var screenWidth = $(window).width();
+        var screenHeight = $(window).height();
+
         var slideshowItems = items.map(function (item) {
 
             var imgUrl = ApiClient.getScaledImageUrl(item.Id, {
 
                 tag: item.ImageTags.Primary,
-                type: 'Primary'
+                type: 'Primary',
+                maxWidth: screenWidth,
+                maxHeight: screenHeight
 
             });
 

dashboard-ui/scripts/site.js

@@ -630,71 +630,6 @@ var Dashboard = {
         }, 500);
     },
 
-    showUserFlyout: function (context) {
-
-        var html = '<div data-role="panel" data-position="right" data-display="overlay" id="userFlyout" data-position-fixed="true" data-theme="a">';
-
-        html += '<h3 class="userHeader">';
-
-        html += '</h3>';
-
-        html += '<form>';
-
-        if (AppInfo.supportsFullScreen) {
-            var checkedHtml = AppSettings.enableFullScreen() ? ' checked="checked"' : '';
-            html += '<p style="margin:1.5em 0;"><label for="chkFullScreen">' + Globalize.translate('OptionEnableFullscreen') + '</label><input type="checkbox"' + checkedHtml + ' id="chkFullScreen" data-mini="true" onchange="AppSettings.enableFullScreen(this.checked);" /></p>';
-        }
-
-        html += '<p class="preferencesContainer"></p>';
-
-        if (Dashboard.isConnectMode()) {
-            html += '<p><a data-mini="true" data-role="button" href="selectserver.html" data-icon="cloud">' + Globalize.translate('ButtonSelectServer') + '</button></a>';
-        }
-
-        html += '<p><button data-mini="true" type="button" onclick="Dashboard.logout();" data-icon="lock">' + Globalize.translate('ButtonSignOut') + '</button></p>';
-
-        html += '</form>';
-        html += '</div>';
-
-        $(document.body).append(html);
-
-        var elem = $('#userFlyout').panel({}).lazyChildren().trigger('create').panel("open").on("panelclose", function () {
-
-            $(this).off("panelclose").remove();
-        });
-
-        ConnectionManager.user(window.ApiClient).done(function (user) {
-            Dashboard.updateUserFlyout(elem, user);
-        });
-    },
-
-    updateUserFlyout: function (elem, user) {
-
-        var html = '';
-        var imgWidth = 48;
-
-        if (user.imageUrl && AppInfo.enableUserImage) {
-            var url = user.imageUrl;
-
-            if (user.supportsImageParams) {
-                url += "&width=" + (imgWidth * Math.max(window.devicePixelRatio || 1, 2));
-            }
-
-            html += '<div class="lazy" data-src="' + url + '" style="width:' + imgWidth + 'px;height:' + imgWidth + 'px;background-size:contain;background-repeat:no-repeat;background-position:center center;border-radius:1000px;vertical-align:middle;margin-right:.8em;display:inline-block;"></div>';
-        }
-        html += user.name;
-
-        $('.userHeader', elem).html(html).lazyChildren();
-
-        html = '';
-
-        if (user.localUser && user.localUser.Policy.EnableUserPreferenceAccess) {
-            html += '<p><a data-mini="true" data-role="button" href="mypreferencesdisplay.html?userId=' + user.localUser.Id + '" data-icon="gear">' + Globalize.translate('ButtonMyPreferences') + '</button></a>';
-        }
-
-        $('.preferencesContainer', elem).html(html).trigger('create');
-    },
-
     getPluginSecurityInfo: function () {
 
         var apiClient = ApiClient;
@@ -1546,7 +1481,6 @@ var AppInfo = {};
 
         AppInfo.enableDetailPageChapters = true;
         AppInfo.enableDetailsMenuImages = true;
-        AppInfo.enableHeaderImages = true;
         AppInfo.enableMovieHomeSuggestions = true;
 
         AppInfo.enableAppStorePolicy = isCordova;
@@ -1568,7 +1502,6 @@ var AppInfo = {};
             } else {
                 AppInfo.enableDetailPageChapters = false;
                 AppInfo.enableDetailsMenuImages = false;
-                AppInfo.enableHeaderImages = false;
                 AppInfo.enableMovieHomeSuggestions = false;
                 AppInfo.cardMargin = 'largeCardMargin';
             }
@@ -1849,7 +1782,9 @@ var AppInfo = {};
             requirejs(['thirdparty/cordova/connectsdk', 'scripts/registrationservices']);
 
             if ($.browser.android) {
-                requirejs(['thirdparty/cordova/android/androidcredentials', 'thirdparty/cordova/android/immersive']);
+                requirejs(['thirdparty/cordova/android/androidcredentials', 'thirdparty/cordova/android/immersive', 'thirdparty/cordova/android/filesystem']);
+            } else {
+                requirejs(['thirdparty/cordova/filesystem']);
             }
 
             if ($.browser.safari) {
@@ -1860,6 +1795,7 @@ var AppInfo = {};
             if ($.browser.chrome) {
                 requirejs(['scripts/chromecast']);
             }
+            requirejs(['thirdparty/filesystem']);
         }
     }
 
@@ -1908,7 +1844,11 @@ var AppInfo = {};
 
     function initCordovaWithDeviceProfile(deferred, deviceId, deviceProfile) {
 
-        requirejs(['thirdparty/cordova/imagestore.js']);
+        if ($.browser.android) {
+            requirejs(['thirdparty/cordova/android/imagestore.js']);
+        } else {
+            requirejs(['thirdparty/cordova/imagestore.js']);
+        }
 
         var capablities = Dashboard.capabilities();
 

dashboard-ui/thirdparty/cordova/android/filesystem.js

@@ -0,0 +1,11 @@
+(function () {
+
+    window.FileSystem = {
+
+        fileExists: function (path) {
+            var exists = NativeFileSystem.fileExists(path);
+            return false;
+        }
+    };
+
+})();

dashboard-ui/thirdparty/cordova/android/imagestore.js

@@ -0,0 +1,220 @@
+
+(function () {
+
+    function setImageIntoElement(elem, url) {
+
+        if (elem.tagName === "DIV") {
+
+            elem.style.backgroundImage = "url('" + url + "')";
+
+        } else {
+            elem.setAttribute("src", url);
+        }
+    }
+
+    // IndexedDB
+    var indexedDb = window.indexedDB || window.webkitIndexedDB || window.mozIndexedDB || window.OIndexedDB || window.msIndexedDB,
+        dbVersion = 1.0;
+
+    var dbName = "emby7";
+    var imagesStoreName = "images";
+
+    function createObjectStore(dataBase) {
+        // Create an objectStore
+        console.log("Creating objectStore");
+        dataBase.createObjectStore(imagesStoreName);
+    }
+
+    function openDb() {
+
+        var deferred = $.Deferred();
+
+        // Create/open database
+        var request = indexedDb.open(dbName, dbVersion);
+
+        request.onerror = function (event) {
+
+            console.log("Error creating/accessing IndexedDB database");
+            deferred.reject();
+        };
+
+        request.onsuccess = function (event) {
+            console.log("Success creating/accessing IndexedDB database");
+
+            var db = request.result || event.target.result;
+
+            db.onerror = function (event) {
+                console.log("Error creating/accessing IndexedDB database");
+            };
+
+            // Interim solution for Google Chrome to create an objectStore. Will be deprecated
+            if (db.setVersion) {
+                if (db.version != dbVersion) {
+                    var setVersion = db.setVersion(dbVersion);
+                    setVersion.onsuccess = function () {
+                        createObjectStore(db);
+                        deferred.resolveWith(null, [db]);
+                    };
+                } else {
+                    deferred.resolveWith(null, [db]);
+                }
+            } else {
+                deferred.resolveWith(null, [db]);
+            }
+        }
+
+        // For future use. Currently only in latest Firefox versions
+        request.onupgradeneeded = function (event) {
+            createObjectStore(event.target.result);
+        };
+
+        return deferred.promise();
+    }
+
+    function indexedDbBlobImageStore() {
+
+        var self = this;
+
+        openDb().done(function (db) {
+
+            self._db = db;
+            window.ImageStore = self;
+        });
+
+        self.addImageToDatabase = function (blob, key, deferred) {
+
+            console.log("addImageToDatabase");
+
+            // Open a transaction to the database
+            var transaction = self.db().transaction([imagesStoreName], "readwrite");
+
+            // Put the blob into the dabase
+            var putRequest = transaction.objectStore(imagesStoreName).put(blob, key);
+
+            putRequest.onsuccess = function (event) {
+                deferred.resolve();
+            };
+
+            putRequest.onerror = function () {
+                deferred.reject();
+            };
+        };
+
+        self.db = function () {
+
+            return self._db;
+        };
+
+        self.get = function (key) {
+
+            var deferred = DeferredBuilder.Deferred();
+
+            var transaction = self.db().transaction([imagesStoreName], "readonly");
+
+            // Open a transaction to the database
+            var getRequest = transaction.objectStore(imagesStoreName).get(key);
+
+            getRequest.onsuccess = function (event) {
+
+                var imgFile = event.target.result;
+
+                if (imgFile) {
+
+                    // Get window.URL object
+                    var URL = window.URL || window.webkitURL;
+
+                    // Create and revoke ObjectURL
+                    var imgUrl = URL.createObjectURL(imgFile);
+
+                    deferred.resolveWith(null, [imgUrl]);
+                } else {
+                    deferred.reject();
+                }
+            };
+
+            getRequest.onerror = function () {
+                deferred.reject();
+            };
+
+            return deferred.promise();
+        };
+
+        self.getImageUrl = function (originalUrl) {
+
+            console.log('getImageUrl:' + originalUrl);
+
+            var key = CryptoJS.MD5(originalUrl + "1").toString();
+
+            var deferred = DeferredBuilder.Deferred();
+
+            self.get(key).done(function (url) {
+
+                deferred.resolveWith(null, [url]);
+
+            }).fail(function () {
+
+                self.downloadImage(originalUrl, key).done(function () {
+                    self.get(key).done(function (url) {
+
+                        deferred.resolveWith(null, [url]);
+
+                    }).fail(function () {
+
+                        deferred.reject();
+                    });
+                }).fail(function () {
+
+                    deferred.reject();
+                });
+            });
+
+            return deferred.promise();
+        };
+
+        self.downloadImage = function (url, key) {
+
+            var deferred = DeferredBuilder.Deferred();
+
+            console.log('downloadImage:' + url);
+
+            // Create XHR
+            var xhr = new XMLHttpRequest();
+
+            xhr.open("GET", url, true);
+            // Set the responseType to blob
+            xhr.responseType = "blob";
+
+            xhr.addEventListener("load", function () {
+
+                if (xhr.status === 200) {
+                    console.log("Image retrieved");
+
+                    // Put the received blob into IndexedDB
+                    self.addImageToDatabase(this.response, key, deferred);
+                } else {
+                    deferred.reject();
+                }
+            }, false);
+
+            // Send XHR
+            xhr.send();
+            return deferred.promise();
+        };
+
+        self.setImageInto = function (elem, url) {
+
+            function onFail() {
+                setImageIntoElement(elem, url);
+            }
+
+            self.getImageUrl(url).done(function (localUrl) {
+
+                setImageIntoElement(elem, localUrl);
+
+            }).fail(onFail);
+        };
+    }
+
+    new indexedDbBlobImageStore();
+
+})();

dashboard-ui/thirdparty/cordova/chromecast.js

@@ -537,6 +537,8 @@
 
         function tryJoinWebSession(device, enableRetry) {
 
+            // First try to join existing session. If it fails, launch a new one
+
             console.log('calling joinWebApp');
             device.getWebAppLauncher().joinWebApp(ApplicationID).success(function (session) {
 
@@ -560,29 +562,7 @@
 
         function launchWebApp(device) {
 
-            // First try to join existing session. If it fails, launch a new one
+            tryJoinWebSession(device, true);
-
-            device.getWebAppLauncher().joinWebApp(ApplicationID).success(function (session) {
-
-                console.log('joinWebApp success. calling onSessionConnected');
-                setupWebAppSession(device, session);
-
-            }).error(function (err) {
-
-                console.log('joinWebApp error: ' + JSON.stringify(err) + '. calling launchWebApp');
-
-                device.getWebAppLauncher().launchWebApp(ApplicationID).success(function (session) {
-
-                    console.log('launchWebApp success. calling onSessionConnected');
-                    setupWebAppSession(device, session);
-
-                }).error(function (err1) {
-
-                    console.log('launchWebApp error:' + JSON.stringify(err1));
-
-                });
-
-            });
         }
 
         function onDeviceReady(device) {

dashboard-ui/thirdparty/cordova/filesystem.js

@@ -0,0 +1,11 @@
+(function () {
+
+    window.FileSystem = {
+
+        fileExists: function (path) {
+            return false;
+        }
+
+    };
+
+})();

dashboard-ui/thirdparty/cordova/imagestore.js

@@ -35,23 +35,19 @@
 
         var self = this;
 
-        self.addImageToDatabase = function (blob, key) {
+        self.addImageToDatabase = function (blob, key, deferred) {
-
-            var deferred = DeferredBuilder.Deferred();
 
             console.log("addImageToDatabase");
 
             self.db().transaction(function (tx) {
 
-                tx.executeSql("INSERT INTO images (id, data) VALUES (?,?)", [key, blob], function (tx, res) {
+                tx.executeSql("REPLACE INTO images (id, data) VALUES (?,?)", [key, blob], function (tx, res) {
 
                     deferred.resolve();
                 }, function (e) {
                     deferred.reject();
                 });
             });
-
-            return deferred.promise();
         };
 
         self.db = function () {
@@ -146,11 +142,7 @@
                         var dataURL = "data:image/jpeg;base64," + b64;
 
                         // Put the received blob into the database
-                        self.addImageToDatabase(dataURL, key).done(function () {
+                        self.addImageToDatabase(dataURL, key, deferred);
-                            deferred.resolve();
-                        }).fail(function () {
-                            deferred.reject();
-                        });
                     } catch (err) {
                         console.log("Error adding image to database");
                         deferred.reject();

dashboard-ui/thirdparty/filesystem.js

@@ -0,0 +1,11 @@
+(function () {
+
+    window.FileSystem = {
+
+        fileExists: function (path) {
+            return false;
+        }
+
+    };
+
+})();