From d12c2644e78b22306e7258cce074c6b88117842f Mon Sep 17 00:00:00 2001 From: Luke Pulverenti Date: Tue, 17 Jun 2014 12:03:14 -0400 Subject: [PATCH] update latest channel content display --- dashboard-ui/channelslatest.html | 5 +-- dashboard-ui/css/librarybrowser.css | 12 ++++- dashboard-ui/css/posteritem.css | 46 +++++-------------- dashboard-ui/scripts/channelslatest.js | 54 ++++++++++++++++++++--- dashboard-ui/scripts/dashboardpage.js | 25 ++++++----- dashboard-ui/scripts/indexpage.js | 2 +- dashboard-ui/scripts/movieslatest.js | 2 +- dashboard-ui/scripts/moviesrecommended.js | 2 +- dashboard-ui/scripts/musicrecommended.js | 8 ++-- 9 files changed, 92 insertions(+), 64 deletions(-) diff --git a/dashboard-ui/channelslatest.html b/dashboard-ui/channelslatest.html index 8cbf9beda9..4432e03cf4 100644 --- a/dashboard-ui/channelslatest.html +++ b/dashboard-ui/channelslatest.html @@ -15,10 +15,7 @@
-
-

${HeaderLatestChannelItems}

-
-
+
diff --git a/dashboard-ui/css/librarybrowser.css b/dashboard-ui/css/librarybrowser.css index 976d4c43b7..02e843e489 100644 --- a/dashboard-ui/css/librarybrowser.css +++ b/dashboard-ui/css/librarybrowser.css @@ -31,7 +31,6 @@ background-size: cover; } - .libraryPage .header { padding-bottom: 0; } @@ -75,6 +74,17 @@ margin-top: 1em; } +@media all and (min-width: 900px) { + + .ehsContent { + max-width: 880px; + } + + .squareEhsContent { + max-width: 750px; + } +} + @media all and (min-width: 1000px) { .ehsContent { diff --git a/dashboard-ui/css/posteritem.css b/dashboard-ui/css/posteritem.css index a18a9e31f9..010d4a03b2 100644 --- a/dashboard-ui/css/posteritem.css +++ b/dashboard-ui/css/posteritem.css @@ -42,9 +42,9 @@ position: relative; } - #scenesContent .posterItemImage { - background-position-y: center; - } +#scenesContent .posterItemImage { + background-position-y: center; +} .posterItem:hover .posterItemImage { -moz-box-shadow: 0 0 12px 7px #38c; @@ -126,11 +126,11 @@ } .squarePosterItem { - width: 148px; + width: 140px; } .squarePosterItem .posterItemImage { - height: 148px; + height: 140px; } .storeReviewCount { @@ -343,31 +343,23 @@ } .miniBackdropPosterItem { - width: 180px; + width: 168px; } .miniBackdropPosterItem .posterItemImage { - height: 101.25px; + height: 94.5px; } } @media all and (min-width: 600px) { - .squarePosterItem { - width: 170px; - } - - .squarePosterItem .posterItemImage { - height: 170px; - } - .portraitPosterItem { - width: 128px; + width: 118px; } .portraitPosterItem .posterItemImage { - height: 192px; + height: 177px; } } @@ -407,14 +399,6 @@ @media all and (min-width: 750px) { - .portraitPosterItem { - width: 118px; - } - - .portraitPosterItem .posterItemImage { - height: 177px; - } - .bannerPosterItem { width: 330px; } @@ -442,11 +426,11 @@ @media all and (min-width: 1200px) { .portraitPosterItem { - width: 144px; + width: 122px; } .portraitPosterItem .posterItemImage { - height: 216px; + height: 183px; } .storeReviewCount { @@ -468,14 +452,6 @@ width: 19%; } - .squarePosterItem { - width: 167px; - } - - .squarePosterItem .posterItemImage { - height: 167px; - } - .backdropPosterItem { width: 298px; } diff --git a/dashboard-ui/scripts/channelslatest.js b/dashboard-ui/scripts/channelslatest.js index ce4818f56d..0effc317f9 100644 --- a/dashboard-ui/scripts/channelslatest.js +++ b/dashboard-ui/scripts/channelslatest.js @@ -1,21 +1,47 @@ (function ($, document) { - function reloadItems(page) { + function reloadFromChannels(page, channels) { - Dashboard.showLoadingMsg(); + var channelsHtml = channels.map(function (c) { + + return '
'; + + }).join(''); + + $('.items', page).html(channelsHtml); + + for (var i = 0, length = channels.length; i < length; i++) { + + var channel = channels[i]; + + reloadFromChannel(page, channel, i); + } + } + + function reloadFromChannel(page, channel, index) { var options = { - Limit: 30, + Limit: 7, Fields: "PrimaryImageAspectRatio", Filters: "IsUnplayed", - UserId: Dashboard.getCurrentUserId() + UserId: Dashboard.getCurrentUserId(), + ChannelIds: channel.Id }; $.getJSON(ApiClient.getUrl("Channels/Items/Latest", options)).done(function (result) { var html = ''; + if (result.Items.length) { + + var text = Globalize.translate('HeaderLatestFromChannel').replace('{0}', channel.Name); + if (index) { + html += '

' + text + '

'; + } else { + html += '

' + text + '

'; + } + } html += LibraryBrowser.getPosterViewHtml({ items: result.Items, shape: 'auto', @@ -25,8 +51,24 @@ lazy: true }); - $("#items", page).html(html).trigger('create').createPosterItemMenus(); - + $('#channel' + channel.Id + '', page).html(html).trigger('create').createPosterItemMenus(); + }); + } + + function reloadItems(page) { + + Dashboard.showLoadingMsg(); + + var options = { + + UserId: Dashboard.getCurrentUserId(), + SupportsLatestItems: true + }; + + $.getJSON(ApiClient.getUrl("Channels", options)).done(function (result) { + + reloadFromChannels(page, result.Items); + Dashboard.hideLoadingMsg(); }); } diff --git a/dashboard-ui/scripts/dashboardpage.js b/dashboard-ui/scripts/dashboardpage.js index 5faa2692da..88f8cb7f32 100644 --- a/dashboard-ui/scripts/dashboardpage.js +++ b/dashboard-ui/scripts/dashboardpage.js @@ -50,14 +50,15 @@ Dashboard.updateSystemInfo(systemInfo); - $('#appVersionNumber', page).html('Version ' + systemInfo.Version); + $('#appVersionNumber', page).html(Globalize.translate('LabelVersionNumber').replace('{0}', systemInfo.Version)); var port = systemInfo.HttpServerPortNumber; if (port == systemInfo.WebSocketPortNumber) { - $('#ports', page).html('Running on port ' + port + ''); + + $('#ports', page).html(Globalize.translate('LabelRunningOnPort').replace('{0}', '' + port + '')); } else { - $('#ports', page).html('Running on ports ' + port + ' and ' + systemInfo.WebSocketPortNumber + ''); + $('#ports', page).html(Globalize.translate('LabelRunningOnPorts').replace('{0}', '' + port + '').replace('{1}', '' + systemInfo.WebSocketPortNumber + '')); } if (systemInfo.CanSelfRestart) { @@ -340,13 +341,13 @@ html += '
'; if (session.PlayState.PlayMethod == 'Transcode') { - html += 'Transcoding'; + html += Globalize.translate('LabelPlayMethodTranscoding'); } else if (session.PlayState.PlayMethod == 'DirectStream') { - html += 'Direct Streaming'; + html += Globalize.translate('LabelPlayMethodDirectStream'); } else if (session.PlayState.PlayMethod == 'DirectPlay') { - html += 'Direct Playing'; + html += Globalize.translate('LabelPlayMethodDirectPlay'); } html += '
'; @@ -376,11 +377,11 @@ if (session.TranscodingInfo.VideoCodec) { - html += '
Video: ' + session.TranscodingInfo.VideoCodec + '
'; + html += '
' + Globalize.translate('LabelVideoCodec').replace('{0}', session.TranscodingInfo.VideoCodec) + '
'; } if (session.TranscodingInfo.AudioCodec && session.TranscodingInfo.AudioCodec != session.TranscodingInfo.Container) { - html += '
Audio: ' + session.TranscodingInfo.AudioCodec + '
'; + html += '
' + Globalize.translate('LabelAudioCodec').replace('{0}', session.TranscodingInfo.AudioCodec) + '
'; } } @@ -707,10 +708,10 @@ html += "" + progress + "%"; - html += ''; + html += ''; } else if (task.State == "Cancelling") { - html += 'Stopping'; + html += '' + Globalize.translate('LabelStopping') + ''; } html += '

'; @@ -730,7 +731,9 @@ var externalUrl = systemInfo.WanAddress + "/mediabrowser"; - $('.externalUrl', page).html('Remote access: ' + externalUrl + '').show().trigger('create'); + var remoteAccessHtml = Globalize.translate('LabelRemoteAccessUrl').replace('{0}', '' + externalUrl + ''); + + $('.externalUrl', page).html(remoteAccessHtml).show().trigger('create'); } else { $('.externalUrl', page).hide(); } diff --git a/dashboard-ui/scripts/indexpage.js b/dashboard-ui/scripts/indexpage.js index 163c7fec1f..afa2d66bba 100644 --- a/dashboard-ui/scripts/indexpage.js +++ b/dashboard-ui/scripts/indexpage.js @@ -187,7 +187,7 @@ var options = { - Limit: screenWidth >= 2400 ? 10 : (screenWidth >= 1920 ? 10 : (screenWidth >= 1440 ? 8 : (screenWidth >= 800 ? 8 : 6))), + Limit: screenWidth >= 2400 ? 10 : (screenWidth >= 1920 ? 10 : (screenWidth >= 1440 ? 8 : (screenWidth >= 800 ? 7 : 6))), Fields: "PrimaryImageAspectRatio", Filters: "IsUnplayed", UserId: userId diff --git a/dashboard-ui/scripts/movieslatest.js b/dashboard-ui/scripts/movieslatest.js index e7272562db..c73690bf9e 100644 --- a/dashboard-ui/scripts/movieslatest.js +++ b/dashboard-ui/scripts/movieslatest.js @@ -13,7 +13,7 @@ SortBy: "DateCreated", SortOrder: "Descending", IncludeItemTypes: "Movie", - Limit: screenWidth >= 1920 ? 32 : (screenWidth >= 1440 ? 32 : (screenWidth >= 800 ? 24 : 18)), + Limit: screenWidth >= 1920 ? 32 : (screenWidth >= 1440 ? 32 : (screenWidth >= 800 ? 28 : 18)), Recursive: true, Fields: "PrimaryImageAspectRatio", Filters: "IsUnplayed", diff --git a/dashboard-ui/scripts/moviesrecommended.js b/dashboard-ui/scripts/moviesrecommended.js index ad4d890e76..d5ed309bfd 100644 --- a/dashboard-ui/scripts/moviesrecommended.js +++ b/dashboard-ui/scripts/moviesrecommended.js @@ -79,7 +79,7 @@ userId: Dashboard.getCurrentUserId(), categoryLimit: screenWidth >= 1200 ? 6 : 3, - itemLimit: screenWidth >= 1920 ? 8 : (screenWidth >= 1440 ? 8 : 6), + itemLimit: screenWidth >= 1920 ? 8 : (screenWidth >= 1440 ? 8 : 7), Fields: "PrimaryImageAspectRatio" }); diff --git a/dashboard-ui/scripts/musicrecommended.js b/dashboard-ui/scripts/musicrecommended.js index c7ee7f0e68..87c5ccd3d2 100644 --- a/dashboard-ui/scripts/musicrecommended.js +++ b/dashboard-ui/scripts/musicrecommended.js @@ -13,7 +13,7 @@ SortBy: "DateCreated", SortOrder: "Descending", IncludeItemTypes: "MusicAlbum", - Limit: screenWidth >= 1920 ? 8 : (screenWidth >= 1440 ? 7 : 5), + Limit: screenWidth >= 1920 ? 8 : (screenWidth >= 1440 ? 7 : 6), Recursive: true, Fields: "PrimaryImageAspectRatio", ParentId: parentId @@ -36,7 +36,7 @@ SortBy: "DateCreated", SortOrder: "Descending", IncludeItemTypes: "Audio", - Limit: screenWidth >= 1920 ? 8 : (screenWidth >= 1440 ? 7 : 5), + Limit: screenWidth >= 1920 ? 8 : (screenWidth >= 1440 ? 7 : 6), Recursive: true, Fields: "PrimaryImageAspectRatio,AudioInfo", ParentId: parentId @@ -59,7 +59,7 @@ SortBy: "DatePlayed", SortOrder: "Descending", IncludeItemTypes: "Audio", - Limit: screenWidth >= 1920 ? 8 : (screenWidth >= 1440 ? 7 : 5), + Limit: screenWidth >= 1920 ? 8 : (screenWidth >= 1440 ? 7 : 6), Recursive: true, Fields: "PrimaryImageAspectRatio,AudioInfo", Filters: "IsPlayed", @@ -89,7 +89,7 @@ SortBy: "PlayCount", SortOrder: "Descending", IncludeItemTypes: "Audio", - Limit: screenWidth >= 1920 ? 14 : (screenWidth >= 1440 ? 14 : 10), + Limit: screenWidth >= 1920 ? 14 : (screenWidth >= 1440 ? 14 : 12), Recursive: true, Fields: "PrimaryImageAspectRatio,AudioInfo", Filters: "IsPlayed",