update listviews

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

@@ -15,12 +15,12 @@
   },
   "devDependencies": {},
   "ignore": [],
-  "version": "1.4.81",
-  "_release": "1.4.81",
+  "version": "1.4.84",
+  "_release": "1.4.84",
   "_resolution": {
     "type": "version",
-    "tag": "1.4.81",
-    "commit": "77ba771ece78a8beb9262d7ac296175df6c052b2"
+    "tag": "1.4.84",
+    "commit": "15bfe5a5a9ca97a96f3f30c76dd463266f66e290"
   },
   "_source": "https://github.com/MediaBrowser/emby-webcomponents.git",
   "_target": "^1.2.0",

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

@@ -0,0 +1,17 @@
+define(['itemShortcuts', 'registerElement'], function (itemShortcuts) {
+
+    var ItemsContainerProtoType = Object.create(HTMLDivElement.prototype);
+
+    ItemsContainerProtoType.attachedCallback = function () {
+        itemShortcuts.on(this);
+    };
+
+    ItemsContainerProtoType.detachedCallback = function () {
+        itemShortcuts.off(this);
+    };
+
+    document.registerElement('emby-itemscontainer', {
+        prototype: ItemsContainerProtoType,
+        extends: 'div'
+    });
+});

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

@@ -8,8 +8,9 @@
     top: 0;
     left: 0;
     bottom: 0;
+    background-color: #52B54B;
 }
 
 .timerIndicator {
     color: #CB272A;
-}
+}

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

@@ -16,7 +16,7 @@ button.listItem {
     display: block;
     align-items: center;
     text-align: left;
-    padding: .25em .5em .25em 1em !important;
+    padding: .25em .25em .25em .25em !important;
     line-height: 170%;
     border-bottom: 1px solid #2a2a2a;
 }
@@ -26,7 +26,7 @@ div.listItem {
 }
 
 .listItem.largeImage {
-    padding: 1em 0 1em 1em;
+    padding: .5em !important;
 }
 
 .listItem > *:not(.listItemBody) {
@@ -38,6 +38,14 @@ div.listItem {
     vertical-align: middle;
 }
 
+.listItem [is=paper-icon-button-light] {
+    margin: 0;
+}
+
+.listViewDragHandle {
+    margin-left: -.25em !important;
+}
+
 .listItemBody {
     flex-grow: 1;
     padding: 0 1em;
@@ -89,8 +97,8 @@ div.listItem {
     background-repeat: no-repeat;
     background-size: contain;
     flex-shrink: 0;
-    margin-left: -.75em;
     background-position: center center;
+    position: relative;
 }
 
 .listItemIcon {
@@ -103,7 +111,6 @@ div.listItem {
     width: 45vh;
     height: 30vh;
     background-position: center center;
-    position: relative;
     margin-right: 2%;
     margin-left: 1%;
 }

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

@@ -153,7 +153,11 @@ define(['itemHelper', 'mediaInfo', 'indicators', 'connectionManager', 'layoutMan
                 }
             }
 
-            var cssClass = "itemAction listItem";
+            var cssClass = "listItem";
+
+            if (clickEntireItem) {
+                cssClass += ' itemAction';
+            }
 
             var downloadWidth = 80;
 
@@ -162,7 +166,13 @@ define(['itemHelper', 'mediaInfo', 'indicators', 'connectionManager', 'layoutMan
                 downloadWidth = 500;
             }
 
-            html += '<' + outerTagName + ' class="' + cssClass + '" data-index="' + index + '" data-action="' + action + '" data-isfolder="' + item.IsFolder + '" data-id="' + item.Id + '"  data-serverid="' + item.ServerId + '" data-type="' + item.Type + '">';
+            var playlistItemId = item.PlaylistItemId ? (' data-playlistitemid="' + item.PlaylistItemId + '"') : '';
+
+            html += '<' + outerTagName + ' class="' + cssClass + '" data-index="' + index + '"' + playlistItemId + ' data-action="' + action + '" data-isfolder="' + item.IsFolder + '" data-id="' + item.Id + '"  data-serverid="' + item.ServerId + '" data-type="' + item.Type + '">';
+
+            if (!clickEntireItem && options.dragHandle) {
+                html += '<button is="paper-icon-button-light" class="listViewDragHandle autoSize"><i class="md-icon">&#xE25D;</i></button>';
+            }
 
             var imgUrl = getImageUrl(item, downloadWidth);
 
@@ -218,7 +228,12 @@ define(['itemHelper', 'mediaInfo', 'indicators', 'connectionManager', 'layoutMan
                 lineCount++;
             }
 
-            html += '<div class="listItemBody">';
+            cssClass = 'listItemBody';
+            if (!clickEntireItem) {
+                cssClass += ' itemAction';
+            }
+
+            html += '<div class="' + cssClass + '">';
 
             for (var i = 0, textLinesLength = textlines.length; i < textLinesLength; i++) {
 

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

@@ -1,7 +1,11 @@
 define(['playbackManager', 'inputManager', 'connectionManager', 'embyRouter', 'globalize', 'loading'], function (playbackManager, inputManager, connectionManager, embyRouter, globalize, loading) {
 
     function playAllFromHere(card, serverId) {
-        var cards = card.parentNode.querySelectorAll('.itemAction[data-id]');
+
+        var parent = card.parentNode;
+        var className = card.classList.length ? ('.' + card.classList[0]) : '';
+        var cards = parent.querySelectorAll(className + '[data-id]');
+
         var ids = [];
 
         var foundCard = false;
@@ -13,6 +17,11 @@ define(['playbackManager', 'inputManager', 'connectionManager', 'embyRouter', 'g
                 ids.push(cards[i].getAttribute('data-id'));
             }
         }
+
+        if (!ids.length) {
+            return;
+        }
+
         playbackManager.play({
             ids: ids,
             serverId: serverId
@@ -75,7 +84,14 @@ define(['playbackManager', 'inputManager', 'connectionManager', 'embyRouter', 'g
     }
 
     function executeAction(card, action) {
+
         var id = card.getAttribute('data-id');
+
+        if (!id) {
+            card = parentWithAttribute(card, 'data-id');
+            id = card.getAttribute('data-id');
+        }
+
         var serverId = card.getAttribute('data-serverid');
         var type = card.getAttribute('data-type');
         var isfolder = card.getAttribute('data-isfolder') == 'true';
@@ -197,7 +213,14 @@ define(['playbackManager', 'inputManager', 'connectionManager', 'embyRouter', 'g
         var card = parentWithClass(e.target, 'itemAction');
 
         if (card) {
-            var action = card.getAttribute('data-action');
+
+            var actionElement = card;
+            var action = actionElement.getAttribute('data-action');
+
+            if (!action) {
+                actionElement = parentWithAttribute(actionElement, 'data-action');
+                action = actionElement.getAttribute('data-action');
+            }
 
             if (action) {
                 executeAction(card, action);
@@ -205,6 +228,19 @@ define(['playbackManager', 'inputManager', 'connectionManager', 'embyRouter', 'g
         }
     }
 
+    function parentWithAttribute(elem, name) {
+
+        while (!elem.getAttribute(name)) {
+            elem = elem.parentNode;
+
+            if (!elem) {
+                return null;
+            }
+        }
+
+        return elem;
+    }
+
     function parentWithClass(elem, className) {
 
         while (!elem.classList || !elem.classList.contains(className)) {