support plot keywords

dashboard-ui/css/librarybrowser.css

@@ -988,6 +988,17 @@ a.itemTag:hover {
     background: #4d90fe;
 }
 
+.itemOverlayContent {
+    max-width: 300px;
+}
+
+.itemOverlayHtml {
+    max-height: 100px;
+    margin-top: 1.5em;
+    overflow: hidden;
+    text-overflow: ellipsis;
+}
+
 @media all and (min-height: 500px) {
 
     .alphabetPicker {

dashboard-ui/css/posteritem.css

@@ -27,11 +27,11 @@
     position: relative;
 }
 
-    .posterItem:hover .posterItemImage {
+.posterItem:hover .posterItemImage {
     -moz-box-shadow: 0 0 12px 7px #2572EB;
     -webkit-box-shadow: 0 0 12px 7px #2572EB;
     box-shadow: 0 0 12px 7px #2572EB;
-    }
+}
 
 .coveredPosterItemImage {
     background-size: cover;
@@ -163,10 +163,10 @@
     z-index: 10;
 }
 
-.miniPosterItemProgress .itemProgressBar {
+    .miniPosterItemProgress .itemProgressBar {
         height: 7px;
         opacity: 1;
-}
+    }
 
 @media all and (max-width: 600px) {
 

dashboard-ui/scripts/librarybrowser.js

@@ -46,7 +46,7 @@
             localStorage.setItem(key + '_' + Dashboard.getCurrentUserId(), JSON.stringify(values));
         },
 
-        saveViewSetting: function(key, value) {
+        saveViewSetting: function (key, value) {
 
             localStorage.setItem(key + '_' + Dashboard.getCurrentUserId() + '_view', value);
         },
@@ -899,7 +899,7 @@
 
                 cssClass += ' ' + options.shape + 'PosterItem';
 
-                html += '<a class="' + cssClass + '" href="' + LibraryBrowser.getHref(item, options.context) + '">';
+                html += '<a data-itemid="' + item.Id + '" class="' + cssClass + '" href="' + LibraryBrowser.getHref(item, options.context) + '">';
 
                 var style = "";
 
@@ -954,18 +954,18 @@
                     html += '<div class="posterItemTextOverlay">';
                 }
 
-                var cssclass = options.centerText ? "posterItemText posterItemTextCentered" : "posterItemText";
+                cssClass = options.centerText ? "posterItemText posterItemTextCentered" : "posterItemText";
 
                 if (options.showParentTitle) {
 
-                    html += "<div class='" + cssclass + "'>";
+                    html += "<div class='" + cssClass + "'>";
                     html += item.EpisodeTitle ? item.Name : (item.SeriesName || item.Album || item.AlbumArtist || item.GameSystem || "&nbsp;");
                     html += "</div>";
                 }
 
                 if (options.showTitle || forceName) {
 
-                    html += "<div class='" + cssclass + "'>";
+                    html += "<div class='" + cssClass + " posterItemName'>";
                     html += name;
                     html += "</div>";
                 }
@@ -975,7 +975,7 @@
                     var itemCountHtml = LibraryBrowser.getItemCountsHtml(options, item);
 
                     if (itemCountHtml) {
-                        html += "<div class='" + cssclass + "'>";
+                        html += "<div class='" + cssClass + "'>";
                         html += itemCountHtml;
                         html += "</div>";
                     }
@@ -2412,3 +2412,176 @@
     };
 
 })(window, document, jQuery, screen, localStorage);
+
+(function ($, document, window) {
+
+    var showOverlayTimeout;
+    var hideOverlayTimeout;
+    var currentPosterItem;
+
+    function onOverlayMouseOver() {
+
+        if (hideOverlayTimeout) {
+            clearTimeout(hideOverlayTimeout);
+            hideOverlayTimeout = null;
+        }
+    }
+
+    function onOverlayMouseOut() {
+
+        startHideOverlayTimer();
+    }
+
+    function getOverlayHtml(item) {
+
+        var html = '';
+
+        html += '<div class="itemOverlayContent">';
+
+        html += '<p class="itemMiscInfo">';
+        html += LibraryBrowser.getMiscInfoHtml(item);
+        html += '</p>';
+
+        html += '<p>';
+        html += '<span class="itemCommunityRating">';
+        html += LibraryBrowser.getRatingHtml(item);
+        html += '</span>';
+        html += '</p>';
+
+        //html += '<p>';
+        //html += '<span class="userDataIcons">';
+        //html += LibraryBrowser.getUserDataIconsHtml(item);
+        //html += '</span>';
+        //html += '</p>';
+
+        html += '<p class="itemOverlayHtml">';
+        html += (item.OverviewHtml || item.Overview || '');
+        html += '</p>';
+
+        html += '<p>';
+
+        html += '<button type="button" data-mini="true" data-inline="true" data-icon="play" data-iconpos="notext">Play</button>';
+        html += '<button type="button" data-mini="true" data-inline="true" data-icon="video" data-iconpos="notext">Play</button>';
+        html += '<button type="button" data-mini="true" data-inline="true" data-icon="remote" data-iconpos="notext">Play</button>';
+        html += '<button type="button" data-mini="true" data-inline="true" data-icon="edit" data-iconpos="notext">Play</button>';
+
+        html += '</p>';
+
+        html += '</div>';
+
+        return html;
+    }
+
+    function showOverlay(elem, item) {
+
+        $('.itemFlyout').popup('close').remove();
+
+        var html = '<div data-role="popup" class="itemFlyout" data-theme="b" data-arrow="true" data-history="false">';
+
+        html += '<div class="ui-bar-b" style="text-align:center;">';
+        html += '<h3 style="margin: .5em 0;padding:0 1em;font-weight:normal;">' + LibraryBrowser.getPosterViewDisplayName(item, true) + '</h3>';
+        html += '</div>';
+
+        html += '<div style="padding: 1em;">';
+        html += getOverlayHtml(item);
+        html += '</div>';
+
+        html += '</div>';
+
+        $('.itemFlyout').popup('close').popup('destroy').remove();
+
+        $(document.body).append(html);
+
+        var popup = $('.itemFlyout').on('mouseenter', onOverlayMouseOver).on('mouseleave', onOverlayMouseOut).popup({ positionTo: elem }).trigger('create').popup("open").on("popupafterclose", function () {
+
+            $(elem).off('mouseleave.overlay', onHoverOut);
+            $(this).off("popupafterclose").off("mouseenter").off("mouseleave").remove();
+        });
+
+        popup.parents().prev('.ui-popup-screen').remove();
+        currentPosterItem = elem;
+
+        $(elem).on('mouseleave.overlay', onHoverOut).on('click.overlay', hideOverlay);
+    }
+
+    function hideOverlay() {
+
+        $('.itemFlyout').popup('close').remove();
+
+        if (currentPosterItem) {
+
+            $(currentPosterItem).off('mouseleave.overlay').off('click.overlay');
+            currentPosterItem = null;
+        }
+    }
+
+    function startHideOverlayTimer() {
+
+        if (hideOverlayTimeout) {
+            clearTimeout(hideOverlayTimeout);
+            hideOverlayTimeout = null;
+        }
+
+        hideOverlayTimeout = setTimeout(hideOverlay, 400);
+    }
+
+    function onHoverOut() {
+
+        if (showOverlayTimeout) {
+            clearTimeout(showOverlayTimeout);
+            showOverlayTimeout = null;
+        }
+
+        startHideOverlayTimer();
+    }
+
+    $.fn.createPosterItemHoverMenu = function (items) {
+
+        function onShowTimerExpired(elem) {
+
+            var id = elem.getAttribute('data-itemid');
+
+            ApiClient.getItem(Dashboard.getCurrentUserId(), id).done(function (item) {
+
+                showOverlay(elem, item);
+
+            });
+        }
+
+        function onHoverIn() {
+
+            if (showOverlayTimeout) {
+                clearTimeout(showOverlayTimeout);
+                showOverlayTimeout = null;
+            }
+
+            if (hideOverlayTimeout) {
+                clearTimeout(hideOverlayTimeout);
+                hideOverlayTimeout = null;
+            }
+
+            var elem = this;
+
+            if (currentPosterItem && currentPosterItem == elem) {
+                return;
+            }
+
+            showOverlayTimeout = setTimeout(function () {
+
+                onShowTimerExpired(elem);
+
+            }, 600);
+        }
+
+        return this.hoverIntent({
+            over: onHoverIn,
+            out: function () {
+
+            },
+            selector: '.posterItem'
+
+        });
+    };
+
+})(jQuery, document, window);
+

dashboard-ui/scripts/livetvchannel.js

@@ -275,7 +275,7 @@
 
             var airDate = item.OriginalAirDate;
 
-            if (airDate) {
+            if (airDate && !item.IsRepeat) {
 
                 try {
                     airDate = parseISO8601Date(airDate, { toLocal: true }).toLocaleDateString();

dashboard-ui/scripts/moviesrecommended.js

@@ -20,8 +20,8 @@
             $('#recentlyAddedItems', page).html(LibraryBrowser.getPosterViewHtml({
                 items: result.Items,
                 useAverageAspectRatio: true
-            }));
                 
+            })).createPosterItemHoverMenu();
         });
 
 
@@ -50,7 +50,8 @@
                 shape: 'backdrop',
                 overlayText: true,
                 showTitle: true
-            }));
+                
+            })).createPosterItemHoverMenu();
 
         });
 
@@ -77,7 +78,8 @@
             $('#trailerItems', page).html(LibraryBrowser.getPosterViewHtml({
                 items: result.Items,
                 useAverageAspectRatio: true
-            }));
+                
+            })).createPosterItemHoverMenu();
 
         });
 

dashboard-ui/scripts/musicrecommended.js

@@ -23,7 +23,7 @@
                 shape: "square",
                 showTitle: true,
                 showParentTitle: true
-            }));
+            })).createPosterItemHoverMenu();
 
         });
 
@@ -46,7 +46,7 @@
                 shape: "square",
                 showTitle: true,
                 showParentTitle: true
-            }));
+            })).createPosterItemHoverMenu();
 
         });
 
@@ -76,7 +76,7 @@
                 shape: "square",
                 showTitle: true,
                 showParentTitle: true
-            }));
+            })).createPosterItemHoverMenu();
 
         });
 
@@ -106,7 +106,7 @@
                 shape: "square",
                 showTitle: true,
                 showParentTitle: true
-            }));
+            })).createPosterItemHoverMenu();
 
         });
 

dashboard-ui/scripts/tvnextup.js

@@ -30,7 +30,7 @@
                     showParentTitle: true,
                     overlayText: true
 
-                }));
+                })).createPosterItemHoverMenu();
 
             } else {
 

dashboard-ui/scripts/tvrecommended.js

@@ -25,7 +25,8 @@
                 showTitle: true,
                 showParentTitle: true,
                 overlayText: true
-            }));
+                
+            })).createPosterItemHoverMenu();
 
         });
 
@@ -56,7 +57,8 @@
                 showTitle: true,
                 showParentTitle: true,
                 overlayText: true
-            }));
+                
+            })).createPosterItemHoverMenu();
 
         });
 

dashboard-ui/thirdparty/jquery.hoverIntent.minified.js

@@ -0,0 +1,8 @@
+/*!
+ * hoverIntent r7 // 2013.03.11 // jQuery 1.9.1+
+ * http://cherne.net/brian/resources/jquery.hoverIntent.html
+ *
+ * You may use hoverIntent under the terms of the MIT license.
+ * Copyright 2007, 2013 Brian Cherne
+ */
+(function(e){e.fn.hoverIntent=function(t,n,r){var i={interval:100,sensitivity:7,timeout:0};if(typeof t==="object"){i=e.extend(i,t)}else if(e.isFunction(n)){i=e.extend(i,{over:t,out:n,selector:r})}else{i=e.extend(i,{over:t,out:t,selector:n})}var s,o,u,a;var f=function(e){s=e.pageX;o=e.pageY};var l=function(t,n){n.hoverIntent_t=clearTimeout(n.hoverIntent_t);if(Math.abs(u-s)+Math.abs(a-o)<i.sensitivity){e(n).off("mousemove.hoverIntent",f);n.hoverIntent_s=1;return i.over.apply(n,[t])}else{u=s;a=o;n.hoverIntent_t=setTimeout(function(){l(t,n)},i.interval)}};var c=function(e,t){t.hoverIntent_t=clearTimeout(t.hoverIntent_t);t.hoverIntent_s=0;return i.out.apply(t,[e])};var h=function(t){var n=jQuery.extend({},t);var r=this;if(r.hoverIntent_t){r.hoverIntent_t=clearTimeout(r.hoverIntent_t)}if(t.type=="mouseenter"){u=n.pageX;a=n.pageY;e(r).on("mousemove.hoverIntent",f);if(r.hoverIntent_s!=1){r.hoverIntent_t=setTimeout(function(){l(n,r)},i.interval)}}else{e(r).off("mousemove.hoverIntent",f);if(r.hoverIntent_s==1){r.hoverIntent_t=setTimeout(function(){c(n,r)},i.timeout)}}};return this.on({"mouseenter.hoverIntent":h,"mouseleave.hoverIntent":h},i.selector)}})(jQuery)