display more from artist on album page

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

@@ -173,6 +173,10 @@
 
         var dataElement = dom.parentWithAttribute(elem, 'data-id');
 
+        if (!dataElement) {
+            return;
+        }
+
         var id = dataElement.getAttribute('data-id');
         var type = dataElement.getAttribute('data-type');
 

dashboard-ui/itemdetails.html

@@ -74,7 +74,7 @@
                 <h1>
                     ${HeaderNextUp}
                 </h1>
-                <div is="emby-itemscontainer" class="smallItemsContainer nextUpItems"></div>
+                <div is="emby-itemscontainer" class="smallItemsContainer nextUpItems" is="emby-itemscontainer"></div>
             </div>
             <div id="childrenCollapsible" class="hide detailSection">
                 <h1 class="childrenSectionHeader">
@@ -88,7 +88,7 @@
                 <h1>
                     ${HeaderAdditionalParts}
                 </h1>
-                <div id="additionalPartsContent" class="smallItemsContainer"></div>
+                <div id="additionalPartsContent" class="smallItemsContainer" is="emby-itemscontainer"></div>
             </div>
             <div id="castCollapsible" class="detailSection hide">
                 <h1 id="peopleHeader">
@@ -110,13 +110,17 @@
                 <h1>
                     ${HeaderSpecialFeatures}
                 </h1>
-                <div id="specialsContent" class="smallItemsContainer"></div>
+                <div id="specialsContent" class="smallItemsContainer" is="emby-itemscontainer"></div>
             </div>
             <div id="musicVideosCollapsible" class="detailSection hide">
                 <h1>
                     ${HeaderMusicVideos}
                 </h1>
-                <div id="musicVideosContent" class="smallItemsContainer"></div>
+                <div id="musicVideosContent" class="smallItemsContainer" is="emby-itemscontainer"></div>
+            </div>
+            <div id="moreFromSection" class="detailSection hide">
+                <h1 class="moreFromHeader"></h1>
+                <div id="moreFromItems"></div>
             </div>
             <div id="similarCollapsible" class="detailSection hide">
                 <h1 class="similiarHeader"></h1>
@@ -176,7 +180,7 @@
                 <h1>
                     ${HeaderThemeVideos}
                 </h1>
-                <div id="themeVideosContent" class="smallItemsContainer"></div>
+                <div id="themeVideosContent" class="smallItemsContainer" is="emby-itemscontainer"></div>
             </div>
 
             <div class="detailSection audioVideoMediaInfo hide">

dashboard-ui/scripts/itemdetailpage.js

@@ -442,6 +442,7 @@
     function renderDetails(page, item, context, isStatic) {
 
         renderSimilarItems(page, item, context);
+        renderMoreFromItems(page, item);
 
         if (!isStatic) {
             renderSiblingLinks(page, item, context);
@@ -721,6 +722,63 @@
         return enableScrollX() ? 'overflowBackdrop' : 'detailPage169';
     }
 
+    function renderMoreFromItems(page, item) {
+        
+        var moreFromSection = page.querySelector('#moreFromSection');
+
+        if (!moreFromSection) {
+            return;
+        }
+
+        if (item.Type != 'MusicAlbum' || !item.AlbumArtists || !item.AlbumArtists.length) {
+            moreFromSection.classList.add('hide');
+            return;
+        }
+
+        ApiClient.getItems(Dashboard.getCurrentUserId(), {
+            
+            IncludeItemTypes: "MusicAlbum",
+            ArtistIds: item.AlbumArtists[0].Id,
+            Recursive: true,
+            ExcludeItemIds: item.Id
+
+        }).then(function(result) {
+            
+            if (!result.Items.length) {
+                moreFromSection.classList.add('hide');
+                return;
+            }
+            moreFromSection.classList.remove('hide');
+
+            moreFromSection.querySelector('.moreFromHeader').innerHTML = Globalize.translate('MoreFromValue', item.AlbumArtists[0].Name);
+
+            var html = '';
+
+            if (enableScrollX()) {
+                html += '<div is="emby-itemscontainer" class="hiddenScrollX itemsContainer">';
+            } else {
+                html += '<div is="emby-itemscontainer" class="itemsContainer">';
+            }
+
+            var shape = item.Type == "MusicAlbum" || item.Type == "MusicArtist" ? getSquareShape() : getPortraitShape();
+
+            html += LibraryBrowser.getPosterViewHtml({
+                items: result.Items,
+                shape: shape,
+                showParentTitle: item.Type == "MusicAlbum",
+                centerText: true,
+                showTitle: item.Type == "MusicAlbum" || item.Type == "Game" || item.Type == "MusicArtist",
+                coverImage: item.Type == "MusicAlbum" || item.Type == "MusicArtist",
+                overlayPlayButton: true
+            });
+            html += '</div>';
+
+            var similarContent = page.querySelector('#moreFromItems');
+            similarContent.innerHTML = html;
+            ImageLoader.lazyChildren(similarContent);
+        });
+    }
+
     function renderSimilarItems(page, item, context) {
 
         var similarCollapsible = page.querySelector('#similarCollapsible');
@@ -751,8 +809,6 @@
 
         ApiClient.getSimilarItems(item.Id, options).then(function (result) {
 
-            var similarCollapsible = page.querySelector('#similarCollapsible');
-
             if (!result.Items.length) {
 
                 similarCollapsible.classList.add('hide');
@@ -775,7 +831,6 @@
                 showParentTitle: item.Type == "MusicAlbum",
                 centerText: true,
                 showTitle: item.Type == "MusicAlbum" || item.Type == "Game" || item.Type == "MusicArtist",
-                borderless: item.Type == "Game",
                 context: context,
                 lazy: true,
                 showDetailsMenu: true,

dashboard-ui/strings/en-US.json

@@ -2380,5 +2380,6 @@
   "OptionUseSystemInstalledVersion": "Use system installed version",
   "OptionUseMyCustomVersion": "Use a custom version",
   "FFmpegSavePathNotFound": "We're unable to locate FFmpeg using the path you've entered. FFprobe is also required and must exist in the same folder. These components are normally bundled together in the same download. Please check the path and try again.",
-  "XmlTvPremiere": "By default, Emby will import {0} hours of guide data. Importing unlimited data requires an active Emby Premiere subscription."
+  "XmlTvPremiere": "By default, Emby will import {0} hours of guide data. Importing unlimited data requires an active Emby Premiere subscription.",
+  "MoreFromValue": "More from {0}"
 }