enable shared components

dashboard-ui/bower_components/emby-webcomponents/.bower.json

@@ -15,12 +15,12 @@
   },
   "devDependencies": {},
   "ignore": [],
-  "version": "1.0.81",
+  "version": "1.0.82",
-  "_release": "1.0.81",
+  "_release": "1.0.82",
   "_resolution": {
     "type": "version",
-    "tag": "1.0.81",
+    "tag": "1.0.82",
-    "commit": "60dfd52a18f23047b6d6b08973ab0b77585f9a90"
+    "commit": "87ca65dd008946b330945c0c1adcaf3b6337c1d2"
   },
   "_source": "git://github.com/MediaBrowser/emby-webcomponents.git",
   "_target": "~1.0.0",

dashboard-ui/bower_components/emby-webcomponents/loading/loading.css

@@ -0,0 +1,14 @@
+.docspinner {
+    margin-top: -5vh;
+    margin-left: -5vh;
+    width: 10vh;
+    height: 10vh;
+    position: fixed;
+    top: 50%;
+    left: 50%;
+    z-index: 9999999;
+}
+
+.loadingHide {
+    display: none !important;
+}

dashboard-ui/bower_components/emby-webcomponents/loading/loading.js

@@ -0,0 +1,28 @@
+define(['paper-spinner', 'css!./loading'], function () {
+
+    return {
+        show: function () {
+            var elem = document.querySelector('.docspinner');
+
+            if (!elem) {
+
+                elem = document.createElement("paper-spinner");
+                elem.classList.add('docspinner');
+
+                document.body.appendChild(elem);
+            }
+
+            elem.active = true;
+            elem.classList.remove('loadingHide');
+        },
+        hide: function () {
+            var elem = document.querySelector('.docspinner');
+
+            if (elem) {
+
+                elem.active = false;
+                elem.classList.add('loadingHide');
+            }
+        }
+    };
+});

dashboard-ui/bower_components/emby-webcomponents/toast/toast.js

@@ -0,0 +1,19 @@
+define(['paper-toast'], function () {
+
+    var toastId = 0;
+
+    return function (options) {
+
+        var elem = document.createElement("paper-toast");
+        elem.setAttribute('text', options.text);
+        elem.id = 'toast' + (toastId++);
+
+        document.body.appendChild(elem);
+
+        // This timeout is obviously messy but it's unclear how to determine when the webcomponent is ready for use
+        // element onload never fires
+        setTimeout(function () {
+            elem.show();
+        }, 300);
+    };
+});

dashboard-ui/scripts/site.js

@@ -458,39 +458,27 @@ var Dashboard = {
     showLoadingMsg: function () {
 
         Dashboard.loadingVisible = true;
-        var elem = document.querySelector('.docspinner');
 
-        if (elem) {
+        require(['loading'], function (loading) {
-
+            if (Dashboard.loadingVisible) {
-            // This is just an attempt to prevent the fade-in animation from running repeating and causing flickering
+                loading.show();
-            elem.active = true;
+            } else {
-            elem.classList.remove('hide');
+                loading.hide();
-
+            }
-        } else if (!Dashboard.loadingAdded) {
+        });
-
-            Dashboard.loadingAdded = true;
-
-            require(['paper-spinner'], function () {
-                elem = document.createElement("paper-spinner");
-                elem.classList.add('docspinner');
-
-                document.body.appendChild(elem);
-                elem.active = Dashboard.loadingVisible == true;
-            });
-        }
     },
 
     hideLoadingMsg: function () {
 
         Dashboard.loadingVisible = false;
 
-        var elem = document.querySelector('.docspinner');
+        require(['loading'], function (loading) {
-
+            if (Dashboard.loadingVisible) {
-        if (elem) {
+                loading.show();
-
+            } else {
-            elem.active = false;
+                loading.hide();
-            elem.classList.add('hide');
+            }
-        }
+        });
     },
 
     getModalLoadingMsg: function () {
@@ -537,28 +525,11 @@ var Dashboard = {
 
         if (typeof options == "string") {
 
-            require(['paper-toast'], function () {
+            require(['toast'], function (toast) {
-                var message = options;
 
-                Dashboard.toastId = Dashboard.toastId || 0;
+                toast({
-
+                    text: options
-                var id = 'toast' + (Dashboard.toastId++);
+                });
-
-                var elem = document.createElement("paper-toast");
-                elem.setAttribute('text', message);
-                elem.id = id;
-
-                document.body.appendChild(elem);
-
-                // This timeout is obviously messy but it's unclear how to determine when the webcomponent is ready for use
-                // element onload never fires
-                setTimeout(function () {
-                    elem.show();
-                }, 300);
-
-                setTimeout(function () {
-                    elem.parentNode.removeChild(elem);
-                }, 5300);
 
             });
 
@@ -1996,6 +1967,8 @@ var AppInfo = {};
         define("swiper", [bowerPath + "/Swiper/dist/js/swiper.min", "css!" + bowerPath + "/Swiper/dist/css/swiper.min"], returnFirstDependency);
 
         define("paperdialoghelper", [embyWebComponentsBowerPath + "/paperdialoghelper/paperdialoghelper"], returnFirstDependency);
+        define("loading", [embyWebComponentsBowerPath + "/loading/loading"], returnFirstDependency);
+        define("toast", [embyWebComponentsBowerPath + "/toast/toast"], returnFirstDependency);
 
         // alias
         define("historyManager", [], function () {

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

@@ -187,16 +187,6 @@ paper-button.notext {
     color: #43A047;
 }
 
-.docspinner {
-    display: block;
-    margin-top: -14px;
-    margin-left: -14px;
-    position: fixed;
-    top: 50%;
-    left: 50%;
-    z-index: 9999999;
-}
-
 /*paper-toast {
     background-color: #eee;
     color: #000;