diff --git a/dashboard-ui/css/chromecast.css b/dashboard-ui/css/chromecast.css index f1d623b013..a548d66e08 100644 --- a/dashboard-ui/css/chromecast.css +++ b/dashboard-ui/css/chromecast.css @@ -21,18 +21,24 @@ background-image: url(images/chromecast/ic_media_route_disabled_holo_dark.png); } +.btnCast { + white-space: nowrap; +} + .headerSelectedPlayer { display: inline-block; vertical-align: middle; color: #ddd; font-size: 11px; margin-right: .5em; - height: 100%; position: relative; - top: -20px; + top: 1px; + max-width: 100px; + text-overflow: ellipsis; + overflow: hidden; } -@media all and (max-width: 800px) { +@media all and (max-width: 1000px) { .headerSelectedPlayer { display: none; } diff --git a/dashboard-ui/css/search.css b/dashboard-ui/css/search.css index c5ad3cf117..0df50a690f 100644 --- a/dashboard-ui/css/search.css +++ b/dashboard-ui/css/search.css @@ -168,7 +168,7 @@ display: none; } -@media all and (min-width: 1200px) { +@media all and (min-width: 800px) { .viewMenuSearch { display: block; @@ -181,10 +181,15 @@ .searchResultsOverlay { position: fixed; - background: #000; + background: #222 !important; top: 50px; left: 0; right: 0; bottom: 0; z-index: 1001; + border: 0 !important; +} + +.searchResultsContainer { + padding: 2em; } diff --git a/dashboard-ui/scripts/librarymenu.js b/dashboard-ui/scripts/librarymenu.js index 8774ec0ea0..ed1694295f 100644 --- a/dashboard-ui/scripts/librarymenu.js +++ b/dashboard-ui/scripts/librarymenu.js @@ -16,10 +16,10 @@ html += '
MEDIABROWSER
'; - //html += '
'; - //html += ''; - //html += ''; - //html += '
'; + html += '
'; + html += ''; + html += ''; + html += '
'; html += '
'; diff --git a/dashboard-ui/scripts/search.js b/dashboard-ui/scripts/search.js index d95e68b9e8..cdea5081d0 100644 --- a/dashboard-ui/scripts/search.js +++ b/dashboard-ui/scripts/search.js @@ -291,15 +291,71 @@ $('#txtSearch').focus(); }; } - window.Search = new search(); - function getSearchResultsPanel() { + function renderSearchResultsInOverlay(elem, hints) { + + // Massage the objects to look like regular items + hints = hints.map(function (i) { + + i.Id = i.ItemId; + i.ImageTags = {}; + i.UserData = {}; + + if (i.PrimaryImageTag) { + i.ImageTags.Primary = i.PrimaryImageTag; + } + return i; + }); + + var html = LibraryBrowser.getPosterViewHtml({ + items: hints, + shape: "square", + lazy: false, + overlayText: false, + showTitle: true + }); + $('.itemsContainer', elem).html(html).trigger('create').createCardMenus(); + } + + function requestSearchHintsForOverlay(elem, searchTerm) { + + var currentTimeout = searchHintTimeout; + + ApiClient.getSearchHints({ userId: Dashboard.getCurrentUserId(), searchTerm: searchTerm, limit: 30 }).done(function (result) { + + if (currentTimeout != searchHintTimeout) { + return; + } + + renderSearchResultsInOverlay(elem, result.SearchHints); + }); + } + + function updateSearchOverlay(elem, searchTerm) { + + if (!searchTerm) { + + $('.itemsContainer', elem).empty(); + clearSearchHintTimeout(); + return; + } + + clearSearchHintTimeout(); + + searchHintTimeout = setTimeout(function () { + + requestSearchHintsForOverlay(elem, searchTerm); + + }, 100); + } + + function getSearchOverlay(createIfNeeded) { var elem = $('.searchResultsOverlay'); - if (!elem.length) { - elem = $('
').appendTo(document.body).hide(); + if (createIfNeeded && !elem.length) { + elem = $('
').appendTo(document.body).hide(); } return elem; @@ -307,30 +363,32 @@ function onHeaderSearchChange(val) { - var panel = getSearchResultsPanel(); - if (val) { - panel.fadeIn('fast'); + updateSearchOverlay(getSearchOverlay(true).fadeIn('fast'), val); } else { - panel.fadeOut('fast'); - + updateSearchOverlay(getSearchOverlay(false).fadeOut('fast'), val); } } - $(document).on('pagehide', ".libraryPage", function () { - - $('#txtSearch', this).val(''); - $('#searchHints', this).empty(); - }); - - $(document).on('headercreated', function () { + function bindSearchEvents() { $('.headerSearchInput').on("keyup", function (e) { - if (e.keyCode != 40) { + // Down key + if (e.keyCode == 40) { + + //var first = $('.searchHint', panel)[0]; + + //if (first) { + // first.focus(); + //} + + return false; + + } else { onHeaderSearchChange(this.value); } @@ -343,7 +401,22 @@ } }); + } + $(document).on('pagehide', ".libraryPage", function () { + + $('#txtSearch', this).val(''); + $('#searchHints', this).empty(); + + }).on('pagecontainerbeforehide', function () { + + $('.headerSearchInput').val(''); + getSearchOverlay(false).hide(); + }); + + $(document).on('headercreated', function () { + + bindSearchEvents(); }); })(jQuery, document, window, clearTimeout, setTimeout); \ No newline at end of file