genre, studio, person links

dashboard-ui/css/site.css

@@ -447,6 +447,7 @@ form, .readOnlyContent {
 
     .posterViewItemWithDualText .posterViewItemText {
         text-align: left;
+        color: #fff;
     }
 
 .posterViewItemWithNoText {
@@ -819,6 +820,10 @@ progress {
     margin-left: 10px;
     display: inline-block;
 }
+#nowPlayingBar #mediaInfo {display:none;}
+@media all and (min-width: 650px) {
+    #nowPlayingBar #mediaInfo {display:inline-block;}
+}
 
 .mediaButton img {
     height: 28px;

dashboard-ui/scripts/Itemdetailpage.js

@@ -240,7 +240,7 @@
                     html += '  /  ';
                 }
 
-                html += '<a href="#">' + item.Genres[i] + '</a>';
+                html += '<a href="itembynamedetails.html?genre='+item.Genres[i]+'">' + item.Genres[i] + '</a>';
             }
 
             elem.html(html).trigger('create');
@@ -266,7 +266,7 @@
                     html += '&nbsp;&nbsp;/&nbsp;&nbsp;';
                 }
 
-                html += '<a href="#">' + item.Studios[i] + '</a>';
+                html += '<a href="itembynamedetails.html?studio='+item.Studios[i]+'">' + item.Studios[i] + '</a>';
             }
 
             elem.html(html).trigger('create');
@@ -685,6 +685,7 @@
             var cast = casts[i];
             var role = cast.Role || cast.Type;
 
+            html += '<a href="itembynamedetails.html?person='+cast.Name+'">';
             html += '<div class="posterViewItem posterViewItemWithDualText">';
 
             if (cast.PrimaryImageTag) {
@@ -703,7 +704,7 @@
             html += '<div class="posterViewItemText posterViewItemPrimaryText">' + cast.Name + '</div>';
             html += '<div class="posterViewItemText">' + role + '</div>';
 
-            html += '</div>';
+            html += '</div></a>';
 
         }
 

dashboard-ui/scripts/itembynamedetailpage.js

@@ -18,7 +18,7 @@
         var studio = getParameterByName('studio');
 
         if (studio) {
-            ApiClient.getStudio(person).done(ItemByNameDetailPage.renderItem);
+            ApiClient.getStudio(studio).done(ItemByNameDetailPage.renderItem);
             return;
         }
 
@@ -32,8 +32,94 @@
 
     renderItem: function (item) {
 
+        var page = $.mobile.activePage;
+        var name = item.Name;
+
+        Dashboard.setPageTitle(name);
+
+        ItemByNameDetailPage.renderImage(item);
+        ItemByNameDetailPage.renderOverviewBlock(item);
+
+        $('#itemByNameDetailPage', page).html(name);
+
         Dashboard.hideLoadingMsg();
+    },
+
+    renderImage: function (item) {
+
+        var page = $.mobile.activePage;
+        var imageTags = item.ImageTags || {};
+        var html = '';
+        var url;
+        var useBackgroundColor;
+
+        if (item.Type == "Person") {
+            if (imageTags.Primary) {
+
+                url = ApiClient.getPersonImageUrl(item.Name, {
+                    width: 800,
+                    tag: imageTags.Primary,
+                    type: "primary"
+                });
+
+            } else {
+                url = 'css/images/items/list/person.png';
+                useBackgroundColor = true;
+            }
+        }else if (item.Type == "Studio") {
+            if (imageTags.Primary) {
+
+                url = ApiClient.getStudioImageUrl(item.Name, {
+                    width: 800,
+                    tag: item.PrimaryImageTag,
+                    type: "primary"
+                });
+
+            } else {
+                url = 'css/images/items/detail/video.png';
+                useBackgroundColor = true;
+            }
+        }else if (item.Type == "Genre") {
+            if (imageTags.Primary) {
+
+                url = ApiClient.getGenreImageUrl(item.Name, {
+                    width: 800,
+                    tag: item.PrimaryImageTag,
+                    type: "primary"
+                });
+
+            } else {
+                url = 'css/images/items/detail/video.png';
+                useBackgroundColor = true;
+            }
+        }
+
+        if (url) {
+            var style = useBackgroundColor ? "background-color:" + Dashboard.getRandomMetroColor() + ";" : "";
+
+            html += "<img class='itemDetailImage' src='" + url + "' style='" + style + "' />";
+        }
+
+        $('#itemImage', page).html(html);
+    },
+
+    renderOverviewBlock: function (item) {
+
+        var page = $.mobile.activePage;
+
+        if (item.Overview || item.OverviewHtml) {
+            var overview = item.OverviewHtml || item.Overview;
+
+            $('#itemOverview', page).html(overview).show();
+            $('#itemOverview a').each(function(){
+                $(this).attr("target","_blank");
+            });
+        } else {
+            $('#itemOverview', page).hide();
+        }
+
     }
+
 };
 
 $(document).on('pageshow', "#itemByNameDetailPage", ItemByNameDetailPage.onPageShow);