mirrors/jellyfin-web
1
0
Fork 0
mirror of https://github.com/jellyfin/jellyfin-web synced 2025-03-30 19:56:21 +00:00
Code Activity

move collections back under movies. add movie suggestions page.

Browse source
This commit is contained in:
Luke Pulverenti 2014-03-11 22:11:01 -04:00
parent 07308ea9a7
commit 9db8c276cc
27 changed files with 398 additions and 155 deletions
Download patch file Download diff file Expand all files Collapse all files

12
dashboard-ui/collections.html
View file

@ -4,8 +4,18 @@
<title>Media Browser</title> <title>Media Browser</title>
</head> </head>
<body> <body>
<div id="boxsetsPage" data-role="page" class="page libraryPage" data-theme="b" data-view="boxsets"> <div id="boxsetsPage" data-role="page" class="page libraryPage" data-theme="b" data-view="movies">
<div class="libraryViewNav">
<a href="moviesrecommended.html">Suggested</a>
<a href="movieslatest.html">Latest</a>
<a href="movies.html">Movies</a>
<a href="#" class="ui-btn-active">Collections</a>
<a href="movietrailers.html">Trailers</a>
<a href="moviegenres.html">Genres</a>
<a href="moviepeople.html">People</a>
<a href="moviestudios.html">Studios</a>
</div>
<div class="alphabetPicker"> <div class="alphabetPicker">
</div> </div>
<div data-role="content"> <div data-role="content">

2
dashboard-ui/css/librarybrowser.css
View file

@ -928,7 +928,7 @@ a.itemTag:hover {
border: 0; border: 0;
margin: 0; margin: 0;
height: 14px; height: 14px;
border: 1px solid #222; border: 0 solid #222;
border-radius: 0; border-radius: 0;
width: 50px; width: 50px;
margin-right: 5px; margin-right: 5px;

20
dashboard-ui/css/posteritem.css
View file

@ -103,7 +103,7 @@
.posterItemTextOverlay .posterItemText { .posterItemTextOverlay .posterItemText {
background-color: transparent; background-color: transparent;
padding-left: 5px; padding-left: 5px;
padding: 0 5px 5px; padding: 0 5px 3px;
} }
.posterItemTextOverlay .posterItemText:first-child { .posterItemTextOverlay .posterItemText:first-child {
@ -171,7 +171,7 @@
.posterItemProgress .itemProgressBar { .posterItemProgress .itemProgressBar {
height: 10px; height: 10px;
width: 100%; width: 100%;
opacity: .6; opacity: .7;
} }
.miniPosterItemProgress { .miniPosterItemProgress {
@ -184,6 +184,22 @@
opacity: 1; opacity: 1;
} }
.sessionPosterItem .posterItemText:not(.posterItemName) {
color: #000;
text-align: left;
}
.sessionPosterItem .posterItemName {
color: #fff!important;
font-weight: normal !important;
}
.sessionPosterItem .posterItemDefaultText {
color: #000!important;
font-weight: normal !important;
top: 42%;
}
@media all and (max-width: 600px) { @media all and (max-width: 600px) {
.packageReviewText { .packageReviewText {

4
dashboard-ui/css/site.css
View file

@ -330,6 +330,10 @@ h1 .imageLink {
height: 30px; height: 30px;
} }
.activeDevicesCollapsible .ui-collapsible-content {
padding: .5em .5em !important;
}
@media all and (min-width: 450px) { @media all and (min-width: 450px) {
.currentUsername { .currentUsername {

8
dashboard-ui/dashboard.html
View file

@ -60,11 +60,9 @@
</div> </div>
</div> </div>
<div data-role="collapsible" data-collapsed="false" style="margin-top: 2em;"> <div class="activeDevicesCollapsible" data-role="collapsible" data-collapsed="false" style="margin-top: 2em;">
<h3>Active Connections</h3> <h3>Active Devices</h3>
<div> <div class="connections">
<table class="tblConnections" style="border-collapse: collapse;">
</table>
</div> </div>
</div> </div>

6
dashboard-ui/itembynamedetails.html
View file

@ -8,7 +8,9 @@
<div id="movieGenreTabs" class="itemTabs" style="display: none;"> <div id="movieGenreTabs" class="itemTabs" style="display: none;">
<div class="libraryViewNav"> <div class="libraryViewNav">
<a href="moviesrecommended.html">Suggested</a> <a href="moviesrecommended.html">Suggested</a>
<a href="movieslatest.html">Latest</a>
<a href="movies.html">Movies</a> <a href="movies.html">Movies</a>
<a href="collections.html">Collections</a>
<a href="movietrailers.html">Trailers</a> <a href="movietrailers.html">Trailers</a>
<a href="moviegenres.html" class="ui-btn-active">Genres</a> <a href="moviegenres.html" class="ui-btn-active">Genres</a>
<a href="moviepeople.html">People</a> <a href="moviepeople.html">People</a>
@ -18,7 +20,9 @@
<div id="moviePeopleTabs" class="itemTabs" style="display: none;"> <div id="moviePeopleTabs" class="itemTabs" style="display: none;">
<div class="libraryViewNav"> <div class="libraryViewNav">
<a href="moviesrecommended.html">Suggested</a> <a href="moviesrecommended.html">Suggested</a>
<a href="movieslatest.html">Latest</a>
<a href="movies.html">Movies</a> <a href="movies.html">Movies</a>
<a href="collections.html">Collections</a>
<a href="movietrailers.html">Trailers</a> <a href="movietrailers.html">Trailers</a>
<a href="moviegenres.html">Genres</a> <a href="moviegenres.html">Genres</a>
<a href="moviepeople.html" class="ui-btn-active">People</a> <a href="moviepeople.html" class="ui-btn-active">People</a>
@ -28,7 +32,9 @@
<div id="movieStudioTabs" class="itemTabs" style="display: none;"> <div id="movieStudioTabs" class="itemTabs" style="display: none;">
<div class="libraryViewNav"> <div class="libraryViewNav">
<a href="moviesrecommended.html">Suggested</a> <a href="moviesrecommended.html">Suggested</a>
<a href="movieslatest.html">Latest</a>
<a href="movies.html">Movies</a> <a href="movies.html">Movies</a>
<a href="collections.html">Collections</a>
<a href="movietrailers.html">Trailers</a> <a href="movietrailers.html">Trailers</a>
<a href="moviegenres.html">Genres</a> <a href="moviegenres.html">Genres</a>
<a href="moviepeople.html">People</a> <a href="moviepeople.html">People</a>

4
dashboard-ui/itemdetails.html
View file

@ -8,7 +8,9 @@
<div id="movieTabs" class="itemTabs" style="display: none;"> <div id="movieTabs" class="itemTabs" style="display: none;">
<div class="libraryViewNav"> <div class="libraryViewNav">
<a href="moviesrecommended.html">Suggested</a> <a href="moviesrecommended.html">Suggested</a>
<a href="movieslatest.html">Latest</a>
<a href="movies.html" class="ui-btn-active">Movies</a> <a href="movies.html" class="ui-btn-active">Movies</a>
<a href="collections.html">Collections</a>
<a href="movietrailers.html">Trailers</a> <a href="movietrailers.html">Trailers</a>
<a href="moviegenres.html">Genres</a> <a href="moviegenres.html">Genres</a>
<a href="moviepeople.html">People</a> <a href="moviepeople.html">People</a>
@ -18,7 +20,9 @@
<div id="trailerTabs" class="itemTabs" style="display: none;"> <div id="trailerTabs" class="itemTabs" style="display: none;">
<div class="libraryViewNav"> <div class="libraryViewNav">
<a href="moviesrecommended.html">Suggested</a> <a href="moviesrecommended.html">Suggested</a>
<a href="movieslatest.html">Latest</a>
<a href="movies.html">Movies</a> <a href="movies.html">Movies</a>
<a href="collections.html">Collections</a>
<a href="movietrailers.html" class="ui-btn-active">Trailers</a> <a href="movietrailers.html" class="ui-btn-active">Trailers</a>
<a href="moviegenres.html">Genres</a> <a href="moviegenres.html">Genres</a>
<a href="moviepeople.html">People</a> <a href="moviepeople.html">People</a>

2
dashboard-ui/moviegenres.html
View file

@ -8,7 +8,9 @@
<div class="libraryViewNav"> <div class="libraryViewNav">
<a href="moviesrecommended.html">Suggested</a> <a href="moviesrecommended.html">Suggested</a>
<a href="movieslatest.html">Latest</a>
<a href="movies.html">Movies</a> <a href="movies.html">Movies</a>
<a href="collections.html">Collections</a>
<a href="movietrailers.html">Trailers</a> <a href="movietrailers.html">Trailers</a>
<a href="moviegenres.html" class="ui-btn-active">Genres</a> <a href="moviegenres.html" class="ui-btn-active">Genres</a>
<a href="moviepeople.html">People</a> <a href="moviepeople.html">People</a>

2
dashboard-ui/moviepeople.html
View file

@ -8,7 +8,9 @@
<div class="libraryViewNav"> <div class="libraryViewNav">
<a href="moviesrecommended.html">Suggested</a> <a href="moviesrecommended.html">Suggested</a>
<a href="movieslatest.html">Latest</a>
<a href="movies.html">Movies</a> <a href="movies.html">Movies</a>
<a href="collections.html">Collections</a>
<a href="movietrailers.html">Trailers</a> <a href="movietrailers.html">Trailers</a>
<a href="moviegenres.html">Genres</a> <a href="moviegenres.html">Genres</a>
<a href="moviepeople.html" class="ui-btn-active">People</a> <a href="moviepeople.html" class="ui-btn-active">People</a>

2
dashboard-ui/movies.html
View file

@ -8,7 +8,9 @@
<div class="libraryViewNav"> <div class="libraryViewNav">
<a href="moviesrecommended.html">Suggested</a> <a href="moviesrecommended.html">Suggested</a>
<a href="movieslatest.html">Latest</a>
<a href="movies.html" class="ui-btn-active">Movies</a> <a href="movies.html" class="ui-btn-active">Movies</a>
<a href="collections.html">Collections</a>
<a href="movietrailers.html">Trailers</a> <a href="movietrailers.html">Trailers</a>
<a href="moviegenres.html">Genres</a> <a href="moviegenres.html">Genres</a>
<a href="moviepeople.html">People</a> <a href="moviepeople.html">People</a>

42
dashboard-ui/movieslatest.html Normal file
View file

@ -0,0 +1,42 @@
<!DOCTYPE html>
<html>
<head>
<title>Media Browser</title>
</head>
<body>
<div id="moviesLatestPage" data-role="page" class="page libraryPage" data-theme="b" data-view="movies">
<div class="libraryViewNav">
<a href="moviesrecommended.html">Suggested</a>
<a href="#" class="ui-btn-active">Latest</a>
<a href="movies.html">Movies</a>
<a href="collections.html">Collections</a>
<a href="movietrailers.html">Trailers</a>
<a href="moviegenres.html">Genres</a>
<a href="moviepeople.html">People</a>
<a href="moviestudios.html">Studios</a>
</div>
<div data-role="content">
<table class="ehsContent">
<tr>
<td>
<h1 class="listHeader">Latest Movies</h1>
<div id="recentlyAddedItems">
</div>
<div id="trailerSection" style="display: none;">
<h1 class="listHeader">Latest Trailers</h1>
<div id="trailerItems">
</div>
</div>
</td>
</tr>
</table>
</div>
</div>
</body>
</html>

15
dashboard-ui/moviesrecommended.html
View file

@ -7,8 +7,10 @@
<div id="moviesRecommendedPage" data-role="page" class="page libraryPage" data-theme="b" data-view="movies"> <div id="moviesRecommendedPage" data-role="page" class="page libraryPage" data-theme="b" data-view="movies">
<div class="libraryViewNav"> <div class="libraryViewNav">
<a href="moviesrecommended.html" class="ui-btn-active">Suggested</a> <a href="#" class="ui-btn-active">Suggested</a>
<a href="movieslatest.html">Latest</a>
<a href="movies.html">Movies</a> <a href="movies.html">Movies</a>
<a href="collections.html">Collections</a>
<a href="movietrailers.html">Trailers</a> <a href="movietrailers.html">Trailers</a>
<a href="moviegenres.html">Genres</a> <a href="moviegenres.html">Genres</a>
<a href="moviepeople.html">People</a> <a href="moviepeople.html">People</a>
@ -27,16 +29,7 @@
</div> </div>
</div> </div>
<h1 class="listHeader">Latest Movies</h1> <div class="recommendations">
<div id="recentlyAddedItems">
</div>
<div id="trailerSection" style="display: none;">
<h1 class="listHeader">Latest Trailers</h1>
<div id="trailerItems">
</div>
</div> </div>
</td> </td>
</tr> </tr>

2
dashboard-ui/moviestudios.html
View file

@ -8,7 +8,9 @@
<div class="libraryViewNav"> <div class="libraryViewNav">
<a href="moviesrecommended.html">Suggested</a> <a href="moviesrecommended.html">Suggested</a>
<a href="movieslatest.html">Latest</a>
<a href="movies.html">Movies</a> <a href="movies.html">Movies</a>
<a href="collections.html">Collections</a>
<a href="movietrailers.html">Trailers</a> <a href="movietrailers.html">Trailers</a>
<a href="moviegenres.html">Genres</a> <a href="moviegenres.html">Genres</a>
<a href="moviepeople.html">People</a> <a href="moviepeople.html">People</a>

2
dashboard-ui/movietrailers.html
View file

@ -8,7 +8,9 @@
<div class="libraryViewNav"> <div class="libraryViewNav">
<a href="moviesrecommended.html">Suggested</a> <a href="moviesrecommended.html">Suggested</a>
<a href="movieslatest.html">Latest</a>
<a href="movies.html">Movies</a> <a href="movies.html">Movies</a>
<a href="collections.html">Collections</a>
<a href="movietrailers.html" class="ui-btn-active">Trailers</a> <a href="movietrailers.html" class="ui-btn-active">Trailers</a>
<a href="moviegenres.html">Genres</a> <a href="moviegenres.html">Genres</a>
<a href="moviepeople.html">People</a> <a href="moviepeople.html">People</a>

241
dashboard-ui/scripts/dashboardpage.js
View file

@ -7,7 +7,7 @@
var page = this; var page = this;
DashboardPage.newsStartIndex = 0; DashboardPage.newsStartIndex = 0;
Dashboard.showLoadingMsg(); Dashboard.showLoadingMsg();
DashboardPage.pollForInfo(page); DashboardPage.pollForInfo(page);
DashboardPage.startInterval(); DashboardPage.startInterval();
@ -58,7 +58,7 @@
pagingHtml += '<div>'; pagingHtml += '<div>';
pagingHtml += LibraryBrowser.getPagingHtml(query, result.TotalRecordCount, false, [], false); pagingHtml += LibraryBrowser.getPagingHtml(query, result.TotalRecordCount, false, [], false);
pagingHtml += '</div>'; pagingHtml += '</div>';
html = html.join('') + pagingHtml; html = html.join('') + pagingHtml;
var elem = $('.latestNewsItems', page).html(html).trigger('create'); var elem = $('.latestNewsItems', page).html(html).trigger('create');
@ -135,9 +135,9 @@
var html = ''; var html = '';
var table = $('.tblConnections', page); var container = $('.connections', page);
$('.trSession', table).addClass('deadSession'); $('.sessionPosterItem', container).addClass('deadSession');
var deviceId = ApiClient.deviceId(); var deviceId = ApiClient.deviceId();
@ -145,98 +145,181 @@
var connection = dashboardInfo.ActiveConnections[i]; var connection = dashboardInfo.ActiveConnections[i];
var rowId = 'trSession' + connection.Id; var itemId = 'session' + connection.Id;
var elem = $('#' + rowId, page); var elem = $('#' + itemId, page);
if (elem.length) { if (elem.length) {
DashboardPage.updateSession(elem, connection); DashboardPage.updateSession(elem, connection);
continue; continue;
} }
html += '<tr class="trSession" id="' + rowId + '">'; html += '<div class="sessionPosterItem posterItem squarePosterItem" id="' + itemId + '" style="vertical-align:top;margin-bottom:2em;">';
html += '<td class="clientType" style="text-align:center;">';
html += DashboardPage.getClientType(connection);
html += '</td>';
html += '<td>';
html += '<div>';
if (deviceId == connection.DeviceId) {
html += connection.Client;
} else {
html += '<a href="#" onclick="RemoteControl.showMenu({sessionId:\'' + connection.Id + '\'});">' + connection.Client + '</a>';
}
html += '</div>';
html += '<div>' + connection.ApplicationVersion + '</div>';
html += '<div>' + connection.DeviceName + '</div>';
html += '</td>';
html += '<td class="username">';
html += DashboardPage.getUsersHtml(connection);
html += '</td>';
var nowPlayingItem = connection.NowPlayingItem; var nowPlayingItem = connection.NowPlayingItem;
var imageUrl = DashboardPage.getNowPlayingImage(nowPlayingItem);
html += '<td class="nowPlayingImage">'; var style = "";
html += DashboardPage.getNowPlayingImage(nowPlayingItem);
html += '</td>';
html += '<td class="nowPlayingText">'; if (imageUrl) {
html += DashboardPage.getNowPlayingText(connection, nowPlayingItem); style += 'background-image:url(\'' + imageUrl + '\');';
html += '</td>'; }
html += '</tr>'; var onclick = connection.DeviceId == deviceId ? '' : ' onclick="RemoteControl.showMenu({sessionId:\'' + connection.Id + '\'});"';
html += '<a' + onclick + ' data-imageurl="' + imageUrl + '" href="#" class="posterItemImage coveredPosterItemImage" style="' + style + 'background-color:#f2f2f2;display:block;">';
var defaultTextStyle = '';
if (nowPlayingItem) {
defaultTextStyle = "display:none;";
}
html += '<div class="posterItemDefaultText" style="' + defaultTextStyle + '">Nothing currently playing</div>';
html += '<div class="posterItemTextOverlay">';
var itemNameStyle='';
if (!nowPlayingItem) {
itemNameStyle = "display:none;";
}
html += '<div class="posterItemText posterItemName" style="' + itemNameStyle + '">' + (nowPlayingItem ? nowPlayingItem.Name : '') + '</div>';
var progressStyle='';
if (!nowPlayingItem) {
progressStyle = "display:none;";
}
html += "<div class='posterItemText posterItemProgress' style='" + progressStyle + "'>";
html += '<progress class="itemProgressBar" min="0" max="100" value="' + DashboardPage.getPlaybackProgress(connection) + '"></progress>';
html += "</div>";
html += "</div>";
html += '<img src="' + DashboardPage.getClientImage(connection) + '" style="top:10px;left:10px;height:24px;position:absolute;opacity: .95;" />';
html += '</a>';
html += '<div class="sessionItemText">' + DashboardPage.getSessionItemText(connection) + '</div>';
//html += '<td class="clientType" style="text-align:center;">';
//html += DashboardPage.getClientType(connection);
//html += '</td>';
//html += '<td>';
//html += '<div>';
//if (deviceId == connection.DeviceId) {
// html += connection.Client;
//} else {
// html += '<a href="#" onclick="RemoteControl.showMenu({sessionId:\'' + connection.Id + '\'});">' + connection.Client + '</a>';
//}
//html += '</div>';
//html += '</td>';
//html += '<td class="nowPlayingImage">';
//html += DashboardPage.getNowPlayingImage(nowPlayingItem);
//html += '</td>';
//html += '<td class="nowPlayingText">';
//html += DashboardPage.getNowPlayingText(connection, nowPlayingItem);
//html += '</td>';
html += '</div>';
} }
table.append(html).trigger('create'); container.append(html).trigger('create');
$('.deadSession', table).remove(); $('.deadSession', container).remove();
},
getPlaybackProgress: function (session) {
if (session.NowPlayingItem) {
if (session.NowPlayingItem.RunTimeTicks) {
var pct = (session.NowPlayingPositionTicks || 0) / session.NowPlayingItem.RunTimeTicks;
return pct * 100;
}
}
return 0;
}, },
getUsersHtml: function (session) { getUsersHtml: function (session) {
var html = ''; var html = '<div>';
if (session.UserId) { if (session.UserId) {
html += '<div><a href="useredit.html?userid=' + session.UserId + '">' + session.UserName + '</a><div>'; html += session.UserName;
} }
html += session.AdditionalUsers.map(function (currentSession) { html += session.AdditionalUsers.map(function (currentSession) {
return '<div><a href="useredit.html?userid=' + currentSession.UserId + '">' + currentSession.UserName + '</a><div>'; return ', ' + currentSession.UserName;
}); });
html += '</div>';
return html; return html;
}, },
updateSession: function (row, session) { updateSession: function (elem, session) {
row.removeClass('deadSession'); elem.removeClass('deadSession');
$('.username', row).html(DashboardPage.getUsersHtml(session)).trigger('create'); $('.sessionItemText', elem).html(DashboardPage.getSessionItemText(session));
var nowPlayingItem = session.NowPlayingItem; var nowPlayingItem = session.NowPlayingItem;
$('.nowPlayingText', row).html(DashboardPage.getNowPlayingText(session, nowPlayingItem)).trigger('create'); if (nowPlayingItem) {
$('.posterItemDefaultText', elem).hide();
$('.posterItemProgress', elem).show();
$('.posterItemName', elem).show().html(nowPlayingItem.Name);
var imageRow = $('.nowPlayingImage', row); $('progress', elem).val(DashboardPage.getPlaybackProgress(session));
} else {
$('.posterItemDefaultText', elem).show();
$('.posterItemProgress', elem).hide();
$('.posterItemName', elem).hide().html('');
}
var image = $('img', imageRow)[0]; var imageUrl = DashboardPage.getNowPlayingImage(nowPlayingItem);
var nowPlayingItemId = nowPlayingItem ? nowPlayingItem.Id : null; var image = $('.posterItemImage', elem)[0];
var nowPlayingItemImageTag = nowPlayingItem ? nowPlayingItem.PrimaryImageTag : null;
if (!image || image.getAttribute('data-itemid') != nowPlayingItemId || image.getAttribute('data-tag') != nowPlayingItemImageTag) { if (imageUrl && imageUrl != image.getAttribute('data-imageurl')) {
imageRow.html(DashboardPage.getNowPlayingImage(nowPlayingItem));
image.style.backgroundImage = 'url(\'' + imageUrl + '\')';
image.setAttribute('data-imageurl', imageUrl);
} else if (!imageUrl && image.getAttribute('data-imageurl')) {
image.style.backgroundImage = null;
image.setAttribute('data-imageurl', '');
} }
}, },
getClientType: function (connection) { getSessionItemText: function (connection) {
var html = '';
html += '<div class="posterItemText">';
html += DashboardPage.getUsersHtml(connection);
html += '</div>';
//html += '<div class="posterItemText">' + connection.Client + '</div>';
//html += '<div class="posterItemText">' + connection.ApplicationVersion + '</div>';
html += '<div class="posterItemText">' + connection.DeviceName + '</div>';
return html;
},
getClientImage: function (connection) {
var clientLowered = connection.Client.toLowerCase(); var clientLowered = connection.Client.toLowerCase();
@ -262,64 +345,76 @@
imgUrl = 'css/images/clients/html5.png'; imgUrl = 'css/images/clients/html5.png';
} }
return "<img src='" + imgUrl + "' alt='Dashboard' />"; return imgUrl;
} }
if (clientLowered == "mb-classic") { if (clientLowered == "mb-classic") {
return "<img src='css/images/clients/mbc.png' alt='Media Browser Classic' />"; return "css/images/clients/mbc.png";
} }
if (clientLowered == "media browser theater") { if (clientLowered == "media browser theater") {
return "<img src='css/images/clients/mb.png' alt='Media Browser Theater' />"; return "css/images/clients/mb.png";
} }
if (clientLowered == "android") { if (clientLowered == "android") {
return "<img src='css/images/clients/android.png' alt='Android' />"; return "css/images/clients/android.png";
} }
if (clientLowered == "roku") { if (clientLowered == "roku") {
return "<img src='css/images/clients/roku.jpg' alt='Roku' />"; return "css/images/clients/roku.jpg";
} }
if (clientLowered == "ios") { if (clientLowered == "ios") {
return "<img src='css/images/clients/ios.png' alt='iOS' />"; return "css/images/clients/ios.png";
} }
if (clientLowered == "windows rt") { if (clientLowered == "windows rt") {
return "<img src='css/images/clients/windowsrt.png' alt='Windows RT' />"; return "css/images/clients/windowsrt.png";
} }
if (clientLowered == "windows phone") { if (clientLowered == "windows phone") {
return "<img src='css/images/clients/windowsphone.png' alt='Windows Phone' />"; return "css/images/clients/windowsphone.png";
} }
if (clientLowered == "dlna") { if (clientLowered == "dlna") {
return "<img src='css/images/clients/dlna.png' alt='Dlna' />"; return "css/images/clients/dlna.png";
} }
if (clientLowered == "mbkinect") { if (clientLowered == "mbkinect") {
return "<img src='css/images/clients/mbkinect.png' alt='MB Kinect' />"; return "css/images/clients/mbkinect.png";
} }
if (clientLowered == "xbmc") { if (clientLowered == "xbmc") {
return "<img src='css/images/clients/xbmc.png' alt='Xbmc' />"; return "css/images/clients/xbmc.png";
} }
return connection.Client; return "css/images/clients/mb.png";
}, },
getNowPlayingImage: function (item) { getNowPlayingImage: function (item) {
if (item && item.ThumbItemId) {
return ApiClient.getImageUrl(item.ThumbItemId, {
type: "Thumb",
height: 300,
tag: item.ThumbImageTag
});
}
if (item && item.BackdropItemId) {
return ApiClient.getImageUrl(item.BackdropItemId, {
type: "Backdrop",
height: 300,
tag: item.BackdropImageTag
});
}
if (item && item.PrimaryImageTag) { if (item && item.PrimaryImageTag) {
var url = ApiClient.getImageUrl(item.Id, { return ApiClient.getImageUrl(item.Id, {
type: "Primary", type: "Primary",
height: 100, height: 300,
tag: item.PrimaryImageTag tag: item.PrimaryImageTag
}); });
url += "&xxx=" + new Date().getTime();
return "<img data-itemid='" + item.Id + "' data-tag='" + item.PrimaryImageTag + "' class='clientNowPlayingImage' src='" + url + "' alt='" + item.Name + "' title='" + item.Name + "' />";
} }
return ""; return "";
@ -422,9 +517,9 @@
DashboardPage.renderPluginUpdateInfo(page, dashboardInfo); DashboardPage.renderPluginUpdateInfo(page, dashboardInfo);
DashboardPage.renderPendingInstallations(page, dashboardInfo.SystemInfo); DashboardPage.renderPendingInstallations(page, dashboardInfo.SystemInfo);
}, },
renderUrls: function (page, systemInfo) { renderUrls: function (page, systemInfo) {
var url = ApiClient.serverAddress() + "/mediabrowser"; var url = ApiClient.serverAddress() + "/mediabrowser";
$('#bookmarkUrl', page).html(url).attr("href", url); $('#bookmarkUrl', page).html(url).attr("href", url);

2
dashboard-ui/scripts/episodes.js
View file

@ -7,7 +7,7 @@
SortOrder: "Ascending", SortOrder: "Ascending",
IncludeItemTypes: "Episode", IncludeItemTypes: "Episode",
Recursive: true, Recursive: true,
Fields: "DateCreated,SeriesInfo,PrimaryImageAspectRatio", Fields: "SeriesInfo,PrimaryImageAspectRatio",
StartIndex: 0, StartIndex: 0,
IsMissing: false, IsMissing: false,
IsVirtualUnaired: false IsVirtualUnaired: false

2
dashboard-ui/scripts/itembynamedetailpage.js
View file

@ -396,7 +396,7 @@
SortOrder: "Ascending", SortOrder: "Ascending",
IncludeItemTypes: "", IncludeItemTypes: "",
Recursive: true, Recursive: true,
Fields: "DateCreated,AudioInfo,SeriesInfo,ParentId,PrimaryImageAspectRatio", Fields: "AudioInfo,SeriesInfo,ParentId,PrimaryImageAspectRatio",
Limit: LibraryBrowser.getDefaultPageSize(), Limit: LibraryBrowser.getDefaultPageSize(),
StartIndex: 0 StartIndex: 0
}; };

6
dashboard-ui/scripts/itemdetailpage.js
View file

@ -353,7 +353,7 @@
ApiClient.getItems(Dashboard.getCurrentUserId(), { ApiClient.getItems(Dashboard.getCurrentUserId(), {
Ids: item.SoundtrackIds.join(","), Ids: item.SoundtrackIds.join(","),
ItemFields: "PrimaryImageAspectRatio,ItemCounts,DateCreated,AudioInfo", ItemFields: "PrimaryImageAspectRatio,ItemCounts,AudioInfo",
SortBy: "SortName" SortBy: "SortName"
}).done(function (result) { }).done(function (result) {
@ -432,7 +432,7 @@
var options = { var options = {
userId: Dashboard.getCurrentUserId(), userId: Dashboard.getCurrentUserId(),
limit: item.Type == "MusicAlbum" ? 4 : 5, limit: item.Type == "MusicAlbum" ? 4 : 5,
fields: "PrimaryImageAspectRatio,DateCreated,UserData" fields: "PrimaryImageAspectRatio,UserData"
}; };
if (item.Type == "Movie") { if (item.Type == "Movie") {
@ -534,7 +534,7 @@
function renderChildren(page, item, user) { function renderChildren(page, item, user) {
var fields = "ItemCounts,DateCreated,AudioInfo,PrimaryImageAspectRatio"; var fields = "ItemCounts,AudioInfo,PrimaryImageAspectRatio";
var query = { var query = {
ParentId: item.Id, ParentId: item.Id,

5
dashboard-ui/scripts/librarymenu.js
View file

@ -92,10 +92,6 @@
html += '<a class="viewMenuLink viewMenuTextLink desktopViewMenuLink' + (view == 'games' ? selectedCssClass : '') + '" href="gamesrecommended.html">' + (view == 'games' ? selectedHtml : '') + '<span class="viewName">Games</span></a>'; html += '<a class="viewMenuLink viewMenuTextLink desktopViewMenuLink' + (view == 'games' ? selectedCssClass : '') + '" href="gamesrecommended.html">' + (view == 'games' ? selectedHtml : '') + '<span class="viewName">Games</span></a>';
} }
if (counts.MovieCount || counts.SeriesCount || counts.SongCount || counts.GameCount) {
html += '<a class="viewMenuLink viewMenuTextLink desktopViewMenuLink' + (view == 'boxsets' ? selectedCssClass : '') + '" href="collections.html">' + (view == 'boxsets' ? selectedHtml : '') + '<span class="viewName">Collections</span></a>';
}
$('.viewMenuRemoteControlButton', page).before(html); $('.viewMenuRemoteControlButton', page).before(html);
} }
@ -133,6 +129,7 @@
html += getCollapsibleHtml('Movies', [ html += getCollapsibleHtml('Movies', [
{ text: 'Suggested', href: 'moviesrecommended.html' }, { text: 'Suggested', href: 'moviesrecommended.html' },
{ text: 'Latest', href: 'movieslatest.html' },
{ text: 'Movies', href: 'movies.html' }, { text: 'Movies', href: 'movies.html' },
{ text: 'Collections', href: 'collections.html' }, { text: 'Collections', href: 'collections.html' },
{ text: 'Trailers', href: 'movietrailers.html' }, { text: 'Trailers', href: 'movietrailers.html' },

2
dashboard-ui/scripts/moviecollections.js
View file

@ -7,7 +7,7 @@
SortOrder: "Ascending", SortOrder: "Ascending",
IncludeItemTypes: "BoxSet", IncludeItemTypes: "BoxSet",
Recursive: true, Recursive: true,
Fields: "DateCreated,PrimaryImageAspectRatio", Fields: "PrimaryImageAspectRatio",
StartIndex: 0 StartIndex: 0
}; };

2
dashboard-ui/scripts/movies.js
View file

@ -9,7 +9,7 @@
SortOrder: "Ascending", SortOrder: "Ascending",
IncludeItemTypes: "Movie", IncludeItemTypes: "Movie",
Recursive: true, Recursive: true,
Fields: "DateCreated,PrimaryImageAspectRatio", Fields: "PrimaryImageAspectRatio",
StartIndex: 0 StartIndex: 0
}; };

60
dashboard-ui/scripts/movieslatest.js Normal file
View file

@ -0,0 +1,60 @@
(function ($, document) {
$(document).on('pagebeforeshow', "#moviesLatestPage", function () {
var screenWidth = $(window).width();
var page = this;
var options = {
SortBy: "DateCreated",
SortOrder: "Descending",
IncludeItemTypes: "Movie",
Limit: screenWidth >= 1920 ? 32 : (screenWidth >= 1440 ? 24 : (screenWidth >= 800 ? 18 : 12)),
Recursive: true,
Fields: "PrimaryImageAspectRatio",
Filters: "IsUnplayed"
};
ApiClient.getItems(Dashboard.getCurrentUserId(), options).done(function (result) {
$('#recentlyAddedItems', page).html(LibraryBrowser.getPosterViewHtml({
items: result.Items,
useAverageAspectRatio: true
})).createPosterItemHoverMenu();
});
options = {
SortBy: "DateCreated",
SortOrder: "Descending",
IncludeItemTypes: "Trailer",
Limit: screenWidth >= 1920 ? 8 : (screenWidth >= 1440 ? 8 : 6),
Recursive: true,
Fields: "PrimaryImageAspectRatio",
Filters: "IsUnplayed"
};
ApiClient.getItems(Dashboard.getCurrentUserId(), options).done(function (result) {
if (result.Items.length) {
$('#trailerSection', page).show();
} else {
$('#trailerSection', page).hide();
}
$('#trailerItems', page).html(LibraryBrowser.getPosterViewHtml({
items: result.Items,
useAverageAspectRatio: true
})).createPosterItemHoverMenu();
});
});
})(jQuery, document);

102
dashboard-ui/scripts/moviesrecommended.js
View file

@ -1,5 +1,41 @@
(function ($, document) { (function ($, document) {
function getRecommendationHtml(recommendation) {
var html = '';
var title = '';
switch (recommendation.RecommendationType) {
case 'SimilarToRecentlyPlayed':
title = 'Because you watched ' + recommendation.BaselineItemName;
break;
case 'SimilarToLikedItem':
title = 'Because you like ' + recommendation.BaselineItemName;
break;
case 'HasDirectorFromRecentlyPlayed':
case 'HasLikedDirector':
title = 'Directed by ' + recommendation.BaselineItemName;
break;
case 'HasActorFromRecentlyPlayed':
case 'HasLikedActor':
title = 'Starring ' + recommendation.BaselineItemName;
break;
}
html += '<h1 class="listHeader">' + title + '</h1>';
html += '<div>';
html += LibraryBrowser.getPosterViewHtml({
items: recommendation.Items,
useAverageAspectRatio: true
});
html += '</div>';
return html;
}
$(document).on('pagebeforeshow', "#moviesRecommendedPage", function () { $(document).on('pagebeforeshow', "#moviesRecommendedPage", function () {
var screenWidth = $(window).width(); var screenWidth = $(window).width();
@ -8,34 +44,13 @@
var options = { var options = {
SortBy: "DateCreated",
SortOrder: "Descending",
IncludeItemTypes: "Movie",
Limit: screenWidth >= 1920 ? 24 : (screenWidth >= 1440 ? 16 : 12),
Recursive: true,
Fields: "PrimaryImageAspectRatio,DateCreated,UserData",
Filters: "IsUnplayed"
};
ApiClient.getItems(Dashboard.getCurrentUserId(), options).done(function (result) {
$('#recentlyAddedItems', page).html(LibraryBrowser.getPosterViewHtml({
items: result.Items,
useAverageAspectRatio: true
})).createPosterItemHoverMenu();
});
options = {
SortBy: "DatePlayed", SortBy: "DatePlayed",
SortOrder: "Descending", SortOrder: "Descending",
IncludeItemTypes: "Movie", IncludeItemTypes: "Movie",
Filters: "IsResumable", Filters: "IsResumable",
Limit: screenWidth >= 1920 ? 4 : (screenWidth >= 1440 ? 4 : 3), Limit: screenWidth >= 1920 ? 4 : (screenWidth >= 1440 ? 4 : 3),
Recursive: true, Recursive: true,
Fields: "DateCreated,UserData" Fields: "PrimaryImageAspectRatio"
}; };
ApiClient.getItems(Dashboard.getCurrentUserId(), options).done(function (result) { ApiClient.getItems(Dashboard.getCurrentUserId(), options).done(function (result) {
@ -57,33 +72,26 @@
}); });
options = { var url = ApiClient.getUrl("Movies/Recommendations", {
SortBy: "DateCreated", userId: Dashboard.getCurrentUserId(),
SortOrder: "Descending", categoryLimit: screenWidth >= 1200 ? 6 : 3,
IncludeItemTypes: "Trailer", itemLimit: screenWidth >= 1920 ? 8 : (screenWidth >= 1440 ? 8 : 6),
Limit: screenWidth >= 1920 ? 8 : (screenWidth >= 1440 ? 8 : 6), Fields: "PrimaryImageAspectRatio"
Recursive: true,
Fields: "PrimaryImageAspectRatio,DateCreated,UserData",
Filters: "IsUnplayed"
};
ApiClient.getItems(Dashboard.getCurrentUserId(), options).done(function (result) {
if (result.Items.length) {
$('#trailerSection', page).show();
} else {
$('#trailerSection', page).hide();
}
$('#trailerItems', page).html(LibraryBrowser.getPosterViewHtml({
items: result.Items,
useAverageAspectRatio: true
})).createPosterItemHoverMenu();
}); });
$.getJSON(url).done(function(recommendations) {
if (!recommendations.length) {
$('.recommendations', page).html('<br/><p>No movie suggestions are currently available. Start watching and rating your movies, and then come back to view your recommendations.</p>');
return;
}
var html = recommendations.map(getRecommendationHtml).join('');
$('.recommendations', page).html(html).createPosterItemHoverMenu();
});
}); });

2
dashboard-ui/scripts/movietrailers.js
View file

@ -7,7 +7,7 @@
SortOrder: "Ascending", SortOrder: "Ascending",
IncludeItemTypes: "Trailer", IncludeItemTypes: "Trailer",
Recursive: true, Recursive: true,
Fields: "DateCreated,PrimaryImageAspectRatio", Fields: "PrimaryImageAspectRatio",
StartIndex: 0 StartIndex: 0
}; };

2
dashboard-ui/scripts/musicalbums.js
View file

@ -9,7 +9,7 @@
SortOrder: "Ascending", SortOrder: "Ascending",
IncludeItemTypes: "MusicAlbum", IncludeItemTypes: "MusicAlbum",
Recursive: true, Recursive: true,
Fields: "DateCreated,PrimaryImageAspectRatio", Fields: "PrimaryImageAspectRatio",
StartIndex: 0 StartIndex: 0
}; };

2
dashboard-ui/scripts/songs.js
View file

@ -9,7 +9,7 @@
SortOrder: "Ascending", SortOrder: "Ascending",
IncludeItemTypes: "Audio", IncludeItemTypes: "Audio",
Recursive: true, Recursive: true,
Fields: "DateCreated,AudioInfo,ParentId", Fields: "AudioInfo,ParentId",
Limit: 200, Limit: 200,
StartIndex: 0 StartIndex: 0
}; };

2
dashboard-ui/scripts/tvshows.js
View file

@ -9,7 +9,7 @@
SortOrder: "Ascending", SortOrder: "Ascending",
IncludeItemTypes: "Series", IncludeItemTypes: "Series",
Recursive: true, Recursive: true,
Fields: "SeriesInfo,DateCreated,PrimaryImageAspectRatio", Fields: "SeriesInfo,PrimaryImageAspectRatio",
StartIndex: 0 StartIndex: 0
}; };