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

fixes #689 - Support grouping latest items

This commit is contained in:
Luke Pulverenti 2014-07-05 01:21:13 -04:00
parent eeafc46d94
commit 46f9a6a331
28 changed files with 382 additions and 144 deletions

View file

@ -6,7 +6,17 @@
<body> <body>
<div id="boxsetsPage" data-role="page" class="page libraryPage backdropPage collectionEditorPage" data-backdroptype="movie,boxset" data-theme="b"> <div id="boxsetsPage" data-role="page" class="page libraryPage backdropPage collectionEditorPage" data-backdroptype="movie,boxset" data-theme="b">
<div class="libraryViewNav scopedLibraryViewNav"> <div class="libraryViewNav scopedLibraryViewNav movieTabs">
<a href="movieslatest.html">${TabLatest}</a>
<a href="moviesrecommended.html">${TabSuggested}</a>
<a href="movies.html">${TabMovies}</a>
<a href="#" class="ui-btn-active">${TabCollections}</a>
<a href="moviegenres.html">${TabGenres}</a>
<a href="moviepeople.html">${TabPeople}</a>
<a href="moviestudios.html">${TabStudios}</a>
</div>
<div class="libraryViewNav scopedLibraryViewNav collectionTabs">
<a href="#" class="ui-btn-active">${TabCollections}</a> <a href="#" class="ui-btn-active">${TabCollections}</a>
</div> </div>

View file

@ -1197,3 +1197,53 @@ a.itemTag:hover {
.channelHeader a { .channelHeader a {
text-decoration: none; text-decoration: none;
} }
.groupingMenuScroller {
max-height: 200px;
min-width: 240px;
overflow-x: hidden;
overflow-y: auto;
padding-right: 8px;
}
@media all and (min-width: 400px) {
.groupingMenuScroller {
min-width: 300px;
}
}
@media all and (min-width: 500px) {
.groupingMenuScroller {
min-width: 400px;
}
}
@media all and (min-width: 600px) {
.groupingMenuScroller {
min-width: 500px;
}
}
@media all and (min-height: 400px) {
.groupingMenuScroller {
max-height: 300px;
}
}
@media all and (min-height: 500px) {
.groupingMenuScroller {
max-height: 400px;
}
}
@media all and (min-height: 600px) {
.groupingMenuScroller {
max-height: 500px;
}
}

View file

@ -77,7 +77,7 @@
width: 130px; width: 130px;
} }
#nowPlayingBar .sliderContainer { .nowPlayingBar .sliderContainer {
margin-top: 14px; margin-top: 14px;
} }
@ -126,12 +126,12 @@ input[type="range"]::-ms-fill-upper {
@media all and (max-width: 800px) { @media all and (max-width: 800px) {
#nowPlayingBar .mediaButton { .nowPlayingBar .mediaButton {
margin-top: 0; margin-top: 0;
margin-bottom: 0; margin-bottom: 0;
} }
#nowPlayingBar .mediaButton:not(#playButton):not(#pauseButton):not(.remoteControlButton) { .nowPlayingBar .mediaButton:not(#playButton):not(#pauseButton):not(.remoteControlButton) {
display: none; display: none;
} }
@ -139,11 +139,11 @@ input[type="range"]::-ms-fill-upper {
float: right; float: right;
} }
#nowPlayingBar #playButton, #nowPlayingBar #pauseButton { .nowPlayingBar #playButton, .nowPlayingBar #pauseButton {
float: right; float: right;
} }
#nowPlayingBar .currentTime, #nowPlayingBar .positionSliderContainer, #nowPlayingBar .volumeSliderContainer, #nowPlayingBar .muteButton, #nowPlayingBar .unmuteButton { .nowPlayingBar .currentTime, .nowPlayingBar .positionSliderContainer, .nowPlayingBar .volumeSliderContainer, #nowPlayingBar .muteButton, #nowPlayingBar .unmuteButton {
display: none !important; display: none !important;
} }

View file

@ -31,26 +31,12 @@
<div class="circle1"></div> <div class="circle1"></div>
<div style="margin-top: -15px;"></div> <div style="margin-top: -15px;"></div>
</div> </div>
<div style="vertical-align: bottom; display: inline-block;"> <button class="btnSave" type="submit" data-theme="a" data-icon="check" data-mini="true" data-inline="true">
<button class="saveButtonContainer btnSave" type="submit" data-theme="a" data-icon="check" data-mini="true" data-inline="true"> Save
Save </button>
</button> <button class="btnRefresh btnRefreshBasic" type="button" data-icon="refresh" data-mini="true" data-inline="true">Refresh</button>
</div> <button class="btnRefresh btnRefreshAdvanced" type="button" data-icon="refresh" data-mini="true" data-inline="true">Advanced Refresh</button>
<div style="vertical-align: bottom; display: inline-block;"> <button id="btnIdentify" type="button" data-icon="info" data-mini="true" data-inline="true">Identify</button>
<button id="btnRefresh" type="button" data-icon="refresh" data-mini="true" data-inline="true">Refresh</button>
</div>
<div style="display: inline-block; vertical-align: top;">
<select data-mini="true" data-inline="true" id="selectRefreshMode">
<option value="all">Refresh All Data</option>
<option value="missing">Add Missing Data Only</option>
<option value="advanced">Advanced</option>
</select>
</div>
<div style="vertical-align: bottom; display: inline-block;">
<button id="btnIdentify" type="button" data-icon="info" data-mini="true" data-inline="true">Identify</button>
</div>
<div style="vertical-align: bottom; display: inline-block;"> <div style="vertical-align: bottom; display: inline-block;">
<div id="fldDelete" style="display: none;"> <div id="fldDelete" style="display: none;">
<button id="btnDelete" type="button" data-icon="delete" data-mini="true" data-inline="true">${ButtonDelete}</button> <button id="btnDelete" type="button" data-icon="delete" data-mini="true" data-inline="true">${ButtonDelete}</button>
@ -521,6 +507,7 @@
<label for="selectMetadataRefreshMode">Metadata refresh mode:</label> <label for="selectMetadataRefreshMode">Metadata refresh mode:</label>
<select id="selectMetadataRefreshMode" data-mini="true"> <select id="selectMetadataRefreshMode" data-mini="true">
<option value="">None</option> <option value="">None</option>
<option value="local">Local Refresh Only</option>
<option value="missing">Add Missing Data Only</option> <option value="missing">Add Missing Data Only</option>
<option value="all">Refresh All Data</option> <option value="all">Refresh All Data</option>
</select> </select>

View file

@ -10,6 +10,7 @@
<a href="movieslatest.html">${TabLatest}</a> <a href="movieslatest.html">${TabLatest}</a>
<a href="moviesrecommended.html">${TabSuggested}</a> <a href="moviesrecommended.html">${TabSuggested}</a>
<a href="movies.html">${TabMovies}</a> <a href="movies.html">${TabMovies}</a>
<a href="collections.html?context=movies">${TabCollections}</a>
<a href="moviegenres.html" class="ui-btn-active">${TabGenres}</a> <a href="moviegenres.html" class="ui-btn-active">${TabGenres}</a>
<a href="moviepeople.html">${TabPeople}</a> <a href="moviepeople.html">${TabPeople}</a>
<a href="moviestudios.html">${TabStudios}</a> <a href="moviestudios.html">${TabStudios}</a>
@ -20,6 +21,7 @@
<a href="movieslatest.html">${TabLatest}</a> <a href="movieslatest.html">${TabLatest}</a>
<a href="moviesrecommended.html">${TabSuggested}</a> <a href="moviesrecommended.html">${TabSuggested}</a>
<a href="movies.html">${TabMovies}</a> <a href="movies.html">${TabMovies}</a>
<a href="collections.html?context=movies">${TabCollections}</a>
<a href="moviegenres.html">${TabGenres}</a> <a href="moviegenres.html">${TabGenres}</a>
<a href="moviepeople.html" class="ui-btn-active">${TabPeople}</a> <a href="moviepeople.html" class="ui-btn-active">${TabPeople}</a>
<a href="moviestudios.html">${TabStudios}</a> <a href="moviestudios.html">${TabStudios}</a>
@ -30,6 +32,7 @@
<a href="movieslatest.html">${TabLatest}</a> <a href="movieslatest.html">${TabLatest}</a>
<a href="moviesrecommended.html">${TabSuggested}</a> <a href="moviesrecommended.html">${TabSuggested}</a>
<a href="movies.html">${TabMovies}</a> <a href="movies.html">${TabMovies}</a>
<a href="collections.html?context=movies">${TabCollections}</a>
<a href="moviegenres.html">${TabGenres}</a> <a href="moviegenres.html">${TabGenres}</a>
<a href="moviepeople.html">${TabPeople}</a> <a href="moviepeople.html">${TabPeople}</a>
<a href="moviestudios.html" class="ui-btn-active">${TabStudios}</a> <a href="moviestudios.html" class="ui-btn-active">${TabStudios}</a>
@ -129,19 +132,19 @@
<p id="itemDeathDate"></p> <p id="itemDeathDate"></p>
<p id="itemLinks"></p> <p id="itemLinks"></p>
<div class="detailButtonsContainer desktopDetailButtons" style="text-align: left;">
<button class="btnPlay hide" type="button" data-icon="play" data-inline="true" data-mini="true">${ButtonPlay}</button>
<a class="btnEdit hide" data-role="button" data-icon="edit" data-inline="true" data-mini="true" href="#">${ButtonEdit}</a>
</div>
</td> </td>
</tr> </tr>
</table> </table>
</div> </div>
<p class="itemOverview mobileOverview"></p> <p class="itemOverview mobileOverview"></p>
</div> </div>
<div class="detailButtonsContainer"> <div class="detailButtonsContainer mobileDetailButtons">
<span id="playButtonContainer" style="display: none;"> <button class="btnPlay hide" type="button" data-icon="play" data-inline="true" data-mini="true">${ButtonPlay}</button>
<button id="btnPlay" type="button" data-icon="play" data-inline="true" data-mini="true">${ButtonPlay}</button> <a class="btnEdit hide" data-role="button" data-icon="edit" data-inline="true" data-mini="true" href="#">${ButtonEdit}</a>
</span>
<span id="editButtonContainer" style="display: none;">
<a id="btnEdit" data-role="button" data-icon="edit" data-inline="true" data-mini="true" href="#">${ButtonEdit}</a>
</span>
</div> </div>
<div data-role="content"> <div data-role="content">

View file

@ -33,7 +33,8 @@
<div class="libraryViewNav scopedLibraryViewNav"> <div class="libraryViewNav scopedLibraryViewNav">
<a href="movieslatest.html">${TabLatest}</a> <a href="movieslatest.html">${TabLatest}</a>
<a href="moviesrecommended.html">${TabSuggested}</a> <a href="moviesrecommended.html">${TabSuggested}</a>
<a href="movies.html" class="ui-btn-active">${TabMovies}</a> <a href="movies.html" class="lnkMovies">${TabMovies}</a>
<a href="collections.html?context=movies" class="lnkCollections">${TabCollections}</a>
<a href="moviegenres.html">${TabGenres}</a> <a href="moviegenres.html">${TabGenres}</a>
<a href="moviepeople.html">${TabPeople}</a> <a href="moviepeople.html">${TabPeople}</a>
<a href="moviestudios.html">${TabStudios}</a> <a href="moviestudios.html">${TabStudios}</a>

View file

@ -10,6 +10,7 @@
<a href="movieslatest.html">${TabLatest}</a> <a href="movieslatest.html">${TabLatest}</a>
<a href="moviesrecommended.html">${TabSuggested}</a> <a href="moviesrecommended.html">${TabSuggested}</a>
<a href="movies.html">${TabMovies}</a> <a href="movies.html">${TabMovies}</a>
<a href="collections.html?context=movies">${TabCollections}</a>
<a href="#" class="ui-btn-active">${TabGenres}</a> <a href="#" class="ui-btn-active">${TabGenres}</a>
<a href="moviepeople.html">${TabPeople}</a> <a href="moviepeople.html">${TabPeople}</a>
<a href="moviestudios.html">${TabStudios}</a> <a href="moviestudios.html">${TabStudios}</a>

View file

@ -10,6 +10,7 @@
<a href="movieslatest.html">${TabLatest}</a> <a href="movieslatest.html">${TabLatest}</a>
<a href="moviesrecommended.html">${TabSuggested}</a> <a href="moviesrecommended.html">${TabSuggested}</a>
<a href="movies.html">${TabMovies}</a> <a href="movies.html">${TabMovies}</a>
<a href="collections.html?context=movies">${TabCollections}</a>
<a href="moviegenres.html">${TabGenres}</a> <a href="moviegenres.html">${TabGenres}</a>
<a href="#" class="ui-btn-active">${TabPeople}</a> <a href="#" class="ui-btn-active">${TabPeople}</a>
<a href="moviestudios.html">${TabStudios}</a> <a href="moviestudios.html">${TabStudios}</a>

View file

@ -10,6 +10,7 @@
<a href="movieslatest.html">${TabLatest}</a> <a href="movieslatest.html">${TabLatest}</a>
<a href="moviesrecommended.html">${TabSuggested}</a> <a href="moviesrecommended.html">${TabSuggested}</a>
<a href="#" class="ui-btn-active">${TabMovies}</a> <a href="#" class="ui-btn-active">${TabMovies}</a>
<a href="collections.html?context=movies">${TabCollections}</a>
<a href="moviegenres.html">${TabGenres}</a> <a href="moviegenres.html">${TabGenres}</a>
<a href="moviepeople.html">${TabPeople}</a> <a href="moviepeople.html">${TabPeople}</a>
<a href="moviestudios.html">${TabStudios}</a> <a href="moviestudios.html">${TabStudios}</a>

View file

@ -10,6 +10,7 @@
<a href="#" class="ui-btn-active">${TabLatest}</a> <a href="#" class="ui-btn-active">${TabLatest}</a>
<a href="moviesrecommended.html">${TabSuggested}</a> <a href="moviesrecommended.html">${TabSuggested}</a>
<a href="movies.html">${TabMovies}</a> <a href="movies.html">${TabMovies}</a>
<a href="collections.html?context=movies">${TabCollections}</a>
<a href="moviegenres.html">${TabGenres}</a> <a href="moviegenres.html">${TabGenres}</a>
<a href="moviepeople.html">${TabPeople}</a> <a href="moviepeople.html">${TabPeople}</a>
<a href="moviestudios.html">${TabStudios}</a> <a href="moviestudios.html">${TabStudios}</a>

View file

@ -10,6 +10,7 @@
<a href="movieslatest.html">${TabLatest}</a> <a href="movieslatest.html">${TabLatest}</a>
<a href="#" class="ui-btn-active">${TabSuggested}</a> <a href="#" class="ui-btn-active">${TabSuggested}</a>
<a href="movies.html">${TabMovies}</a> <a href="movies.html">${TabMovies}</a>
<a href="collections.html?context=movies">${TabCollections}</a>
<a href="moviegenres.html">${TabGenres}</a> <a href="moviegenres.html">${TabGenres}</a>
<a href="moviepeople.html">${TabPeople}</a> <a href="moviepeople.html">${TabPeople}</a>
<a href="moviestudios.html">${TabStudios}</a> <a href="moviestudios.html">${TabStudios}</a>

View file

@ -10,6 +10,7 @@
<a href="movieslatest.html">${TabLatest}</a> <a href="movieslatest.html">${TabLatest}</a>
<a href="moviesrecommended.html">${TabSuggested}</a> <a href="moviesrecommended.html">${TabSuggested}</a>
<a href="movies.html">${TabMovies}</a> <a href="movies.html">${TabMovies}</a>
<a href="collections.html?context=movies">${TabCollections}</a>
<a href="moviegenres.html">${TabGenres}</a> <a href="moviegenres.html">${TabGenres}</a>
<a href="moviepeople.html">${TabPeople}</a> <a href="moviepeople.html">${TabPeople}</a>
<a href="#" class="ui-btn-active">${TabStudios}</a> <a href="#" class="ui-btn-active">${TabStudios}</a>

View file

@ -51,13 +51,7 @@
Dashboard.populateLanguages($('#selectLanguage', page), languages); Dashboard.populateLanguages($('#selectLanguage', page), languages);
Dashboard.populateCountries($('#selectCountry', page), countries); Dashboard.populateCountries($('#selectCountry', page), countries);
if (item.LocationType == "Offline") { $('.btnRefresh', page).buttonEnabled(true);
$('.saveButtonContainer', page).hide();
} else {
$('.saveButtonContainer', page).show();
}
$('#btnRefresh', page).buttonEnabled(true);
$('#btnDelete', page).buttonEnabled(true); $('#btnDelete', page).buttonEnabled(true);
$('.btnSave', page).buttonEnabled(true); $('.btnSave', page).buttonEnabled(true);
@ -819,7 +813,7 @@
function performDelete(page) { function performDelete(page) {
$('#btnDelete', page).buttonEnabled(false); $('#btnDelete', page).buttonEnabled(false);
$('#btnRefresh', page).buttonEnabled(false); $('.btnRefresh', page).buttonEnabled(false);
$('.btnSave', page).buttonEnabled(false); $('.btnSave', page).buttonEnabled(false);
$('#refreshLoading', page).show(); $('#refreshLoading', page).show();
@ -987,7 +981,7 @@
return false; return false;
}; };
self.onRefreshFormSubmit = function() { self.onRefreshFormSubmit = function () {
var page = $(this).parents('.page'); var page = $(this).parents('.page');
refreshFromPopupOptions(page); refreshFromPopupOptions(page);
@ -1211,9 +1205,9 @@
$('#selectMetadataRefreshMode', page).val('all').selectmenu('refresh'); $('#selectMetadataRefreshMode', page).val('all').selectmenu('refresh');
$('#selectImageRefreshMode', page).val('missing').selectmenu('refresh'); $('#selectImageRefreshMode', page).val('missing').selectmenu('refresh');
} }
function refreshFromPopupOptions(page) { function refreshFromPopupOptions(page) {
var metadataRefreshMode = $('#selectMetadataRefreshMode', page).val(); var metadataRefreshMode = $('#selectMetadataRefreshMode', page).val();
var imageRefreshMode = $('#selectImageRefreshMode', page).val(); var imageRefreshMode = $('#selectImageRefreshMode', page).val();
@ -1221,7 +1215,7 @@
Recursive: true, Recursive: true,
ImageRefreshMode: imageRefreshMode == 'none' ? 'None' : 'FullRefresh', ImageRefreshMode: imageRefreshMode == 'none' ? 'None' : 'FullRefresh',
MetadataRefreshMode: metadataRefreshMode == 'none' ? 'None' : 'FullRefresh', MetadataRefreshMode: metadataRefreshMode == 'none' ? 'None' : (metadataRefreshMode == 'local' ? 'ValidationOnly' : 'FullRefresh'),
ReplaceAllImages: imageRefreshMode == imageRefreshMode == 'all', ReplaceAllImages: imageRefreshMode == imageRefreshMode == 'all',
ReplaceAllMetadata: metadataRefreshMode == 'all' ReplaceAllMetadata: metadataRefreshMode == 'all'
}); });
@ -1233,7 +1227,7 @@
$('#refreshLoading', page).show(); $('#refreshLoading', page).show();
$('#btnDelete', page).buttonEnabled(false); $('#btnDelete', page).buttonEnabled(false);
$('#btnRefresh', page).buttonEnabled(false); $('.btnRefresh', page).buttonEnabled(false);
$('.btnSave', page).buttonEnabled(false); $('.btnSave', page).buttonEnabled(false);
ApiClient.refreshItem(currentItem.Id, options).done(function () { ApiClient.refreshItem(currentItem.Id, options).done(function () {
@ -1246,23 +1240,21 @@
var page = this; var page = this;
$('#btnRefresh', this).on('click', function () { $('.btnRefreshBasic', this).on('click', function () {
var metadataRefreshMode = $('#selectRefreshMode', page).val(); refreshWithOptions(page, {
if (metadataRefreshMode == 'advanced') { Recursive: true,
performAdvancedRefresh(page); ImageRefreshMode: 'FullRefresh',
} else { MetadataRefreshMode: 'FullRefresh',
ReplaceAllImages: false,
ReplaceAllMetadata: true
});
});
refreshWithOptions(page, { $('.btnRefreshAdvanced', this).on('click', function () {
Recursive: true, performAdvancedRefresh(page);
ImageRefreshMode: 'FullRefresh',
MetadataRefreshMode: 'FullRefresh',
ReplaceAllImages: false,
ReplaceAllMetadata: metadataRefreshMode == 'all'
});
}
}); });
$('#btnIdentify', page).on('click', function () { $('#btnIdentify', page).on('click', function () {

View file

@ -3,24 +3,22 @@
$(document).on('pagebeforeshow', "#gamesRecommendedPage", function () { $(document).on('pagebeforeshow', "#gamesRecommendedPage", function () {
var parentId = LibraryMenu.getTopParentId(); var parentId = LibraryMenu.getTopParentId();
var userId = Dashboard.getCurrentUserId();
var page = this; var page = this;
var options = { var options = {
SortBy: "DateCreated", IncludeItemTypes: "Game",
SortOrder: "Descending",
MediaTypes: "Game",
Limit: 8, Limit: 8,
Recursive: true, Fields: "PrimaryImageAspectRatio",
Fields: "ItemCounts,AudioInfo,PrimaryImageAspectRatio",
ParentId: parentId ParentId: parentId
}; };
ApiClient.getItems(Dashboard.getCurrentUserId(), options).done(function (result) { ApiClient.getJSON(ApiClient.getUrl('Users/' + userId + '/Items/Latest', options)).done(function (items) {
$('#recentlyAddedItems', page).html(LibraryBrowser.getPosterViewHtml({ $('#recentlyAddedItems', page).html(LibraryBrowser.getPosterViewHtml({
items: result.Items, items: items,
transparent: true, transparent: true,
borderless: true, borderless: true,
shape: 'auto', shape: 'auto',
@ -42,7 +40,7 @@
ParentId: parentId ParentId: parentId
}; };
ApiClient.getItems(Dashboard.getCurrentUserId(), options).done(function (result) { ApiClient.getItems(userId, options).done(function (result) {
if (result.Items.length) { if (result.Items.length) {
$('#recentlyPlayedSection', page).show(); $('#recentlyPlayedSection', page).show();

View file

@ -126,33 +126,29 @@
function loadRecentlyAdded(elem, userId) { function loadRecentlyAdded(elem, userId) {
var screenWidth = $(window).width(); var screenWidth = $(window).width();
var options = { var options = {
SortBy: "DateCreated",
SortOrder: "Descending",
Limit: screenWidth >= 2400 ? 30 : (screenWidth >= 1920 ? 15 : (screenWidth >= 1440 ? 10 : (screenWidth >= 800 ? 9 : 8))), Limit: screenWidth >= 2400 ? 30 : (screenWidth >= 1920 ? 15 : (screenWidth >= 1440 ? 10 : (screenWidth >= 800 ? 9 : 8))),
Recursive: true,
Fields: "PrimaryImageAspectRatio", Fields: "PrimaryImageAspectRatio",
Filters: "IsUnplayed,IsNotFolder", IsPlayed: false,
CollapseBoxSetItems: false, IsFolder: false
ExcludeLocationTypes: "Virtual,Remote"
}; };
ApiClient.getItems(userId, options).done(function (result) { ApiClient.getJSON(ApiClient.getUrl('Users/' + userId + '/Items/Latest', options)).done(function (items) {
var html = ''; var html = '';
if (result.Items.length) { if (items.length) {
html += '<h1 class="listHeader">' + Globalize.translate('HeaderLatestMedia') + '</h1>'; html += '<h1 class="listHeader">' + Globalize.translate('HeaderLatestMedia') + '</h1>';
html += '<div>'; html += '<div>';
html += LibraryBrowser.getPosterViewHtml({ html += LibraryBrowser.getPosterViewHtml({
items: result.Items, items: items,
preferThumb: true, preferThumb: true,
shape: 'backdrop', shape: 'backdrop',
showTitle: true,
centerText: true,
context: 'home', context: 'home',
showUnplayedIndicator: false,
showChildCountIndicator: true,
lazy: true lazy: true
}); });
html += '</div>'; html += '</div>';

View file

@ -56,7 +56,7 @@
function reload(page) { function reload(page) {
Dashboard.showLoadingMsg(); Dashboard.showLoadingMsg();
$('#btnEdit', page).attr('href', '#'); $('.btnEdit', page).attr('href', '#');
getPromise().done(function (item) { getPromise().done(function (item) {
@ -66,7 +66,7 @@
if (context) { if (context) {
editQuery += '&context=' + context; editQuery += '&context=' + context;
} }
$('#btnEdit', page).attr('href', 'edititemmetadata.html' + editQuery); $('.btnEdit', page).attr('href', 'edititemmetadata.html' + editQuery);
currentItem = item; currentItem = item;
@ -90,9 +90,9 @@
Dashboard.getCurrentUser().done(function (user) { Dashboard.getCurrentUser().done(function (user) {
if (MediaController.canPlay(item)) { if (MediaController.canPlay(item)) {
$('#playButtonContainer', page).show(); $('.btnPlay', page).show();
} else { } else {
$('#playButtonContainer', page).hide(); $('.btnPlay', page).hide();
} }
var editImagesHref = user.Configuration.IsAdministrator ? 'edititemimages.html' + editQuery : null; var editImagesHref = user.Configuration.IsAdministrator ? 'edititemimages.html' + editQuery : null;
@ -100,9 +100,9 @@
$('#itemImage', page).html(LibraryBrowser.getDetailImageHtml(item, editImagesHref)); $('#itemImage', page).html(LibraryBrowser.getDetailImageHtml(item, editImagesHref));
if (user.Configuration.IsAdministrator && item.LocationType !== "Offline") { if (user.Configuration.IsAdministrator && item.LocationType !== "Offline") {
$('#editButtonContainer', page).show(); $('.btnEdit', page).show();
} else { } else {
$('#editButtonContainer', page).hide(); $('.btnEdit', page).hide();
} }
}); });
@ -522,7 +522,7 @@
var page = this; var page = this;
$('#btnPlay', page).on('click', function () { $('.btnPlay', page).on('click', function () {
var userdata = currentItem.UserData || {}; var userdata = currentItem.UserData || {};
LibraryBrowser.showPlayMenu(this, currentItem.Id, currentItem.Type, false, "Audio", userdata.PlaybackPositionTicks); LibraryBrowser.showPlayMenu(this, currentItem.Id, currentItem.Type, false, "Audio", userdata.PlaybackPositionTicks);
}); });

View file

@ -240,6 +240,16 @@
$('a', elem).removeClass('ui-btn-active'); $('a', elem).removeClass('ui-btn-active');
$('.lnkHomeUpcoming', page).addClass('ui-btn-active'); $('.lnkHomeUpcoming', page).addClass('ui-btn-active');
} }
else if (context == 'movies' || item.Type == 'Movie') {
elem = $('#movieTabs', page).show();
$('a', elem).removeClass('ui-btn-active');
if (item.Type == 'BoxSet') {
$('.lnkCollections', page).addClass('ui-btn-active');
} else {
$('.lnkMovies', page).addClass('ui-btn-active');
}
}
else if (item.Type == "MusicAlbum") { else if (item.Type == "MusicAlbum") {
$('#albumTabs', page).show(); $('#albumTabs', page).show();
} }
@ -252,10 +262,6 @@
$('#songTabs', page).show(); $('#songTabs', page).show();
} }
else if (item.Type == "Movie") {
$('#movieTabs', page).show();
}
else if (item.Type == "ChannelVideoItem" || item.Type == "ChannelAudioItem" || item.Type == "ChannelFolderItem") { else if (item.Type == "ChannelVideoItem" || item.Type == "ChannelAudioItem" || item.Type == "ChannelFolderItem") {
$('#channelTabs', page).show(); $('#channelTabs', page).show();
$('.channelHeader', page).show().html('<a href="channelitems.html?id=' + item.ChannelId + '">' + item.ChannelName + '</a>').trigger('create'); $('.channelHeader', page).show().html('<a href="channelitems.html?id=' + item.ChannelId + '">' + item.ChannelName + '</a>').trigger('create');
@ -363,7 +369,7 @@
$('.itemCommunityRating', page).html(LibraryBrowser.getRatingHtml(item)); $('.itemCommunityRating', page).html(LibraryBrowser.getRatingHtml(item));
if (item.Type != "Episode" && item.Type != "Movie" && item.Type != "Series") { if (item.Type != "Episode" && item.Type != "Movie" && item.Type != "Series" && item.Type != "Season") {
var premiereDateElem = $('#itemPremiereDate', page).show(); var premiereDateElem = $('#itemPremiereDate', page).show();
LibraryBrowser.renderPremiereDate(premiereDateElem, item); LibraryBrowser.renderPremiereDate(premiereDateElem, item);
} else { } else {

View file

@ -627,7 +627,7 @@
}); });
} }
else if (options.preferThumb && item.SeriesThumbImageTag) { else if (options.preferThumb && item.SeriesThumbImageTag && options.inheritThumb !== false) {
imgUrl = ApiClient.getScaledImageUrl(item.SeriesId, { imgUrl = ApiClient.getScaledImageUrl(item.SeriesId, {
type: "Thumb", type: "Thumb",
@ -636,7 +636,7 @@
}); });
} }
else if (options.preferThumb && item.ParentThumbItemId) { else if (options.preferThumb && item.ParentThumbItemId && options.inheritThumb !== false) {
imgUrl = ApiClient.getThumbImageUrl(item.ParentThumbItemId, { imgUrl = ApiClient.getThumbImageUrl(item.ParentThumbItemId, {
type: "Thumb", type: "Thumb",
@ -772,6 +772,14 @@
cssClass += ' posterItemUserData' + item.UserData.Key; cssClass += ' posterItemUserData' + item.UserData.Key;
} }
if (options.showChildCountIndicator && item.ChildCount) {
cssClass += ' groupedPosterItem';
if (item.Type == 'Series') {
cssClass += ' unplayedGroupings';
}
}
var itemCommands = []; var itemCommands = [];
//if (MediaController.canPlay(item)) { //if (MediaController.canPlay(item)) {
@ -786,6 +794,10 @@
itemCommands.push('trailer'); itemCommands.push('trailer');
} }
if (options.showChildCountIndicator) {
cssClass += ' groupingPosterItem';
}
html += '<a data-commands="' + itemCommands.join(',') + '" data-itemid="' + item.Id + '" class="' + cssClass + '" data-mediasourcecount="' + mediaSourceCount + '" href="' + href + '">'; html += '<a data-commands="' + itemCommands.join(',') + '" data-itemid="' + item.Id + '" class="' + cssClass + '" data-mediasourcecount="' + mediaSourceCount + '" href="' + href + '">';
var style = ""; var style = "";
@ -820,9 +832,13 @@
if (options.showLocationTypeIndicator !== false) { if (options.showLocationTypeIndicator !== false) {
html += LibraryBrowser.getOfflineIndicatorHtml(item); html += LibraryBrowser.getOfflineIndicatorHtml(item);
} }
} else if (options.showUnplayedIndicator !== false) { }
else if (options.showUnplayedIndicator !== false) {
html += LibraryBrowser.getPlayedIndicatorHtml(item); html += LibraryBrowser.getPlayedIndicatorHtml(item);
} }
else if (options.showChildCountIndicator) {
html += LibraryBrowser.getGroupCountIndicator(item);
}
if (mediaSourceCount > 1) { if (mediaSourceCount > 1) {
html += '<div class="mediaSourceIndicator">' + mediaSourceCount + '</div>'; html += '<div class="mediaSourceIndicator">' + mediaSourceCount + '</div>';
@ -1107,6 +1123,15 @@
return ''; return '';
}, },
getGroupCountIndicator: function (item) {
if (item.ChildCount) {
return '<div class="playedIndicator">' + item.ChildCount + '</div>';
}
return '';
},
getAveragePrimaryImageAspectRatio: function (items) { getAveragePrimaryImageAspectRatio: function (items) {
var values = []; var values = [];

View file

@ -271,7 +271,7 @@
$($.mobile.activePage).append(html); $($.mobile.activePage).append(html);
var elem = $('.tapHoldMenu').popup({ positionTo: e.target }).trigger('create').popup("open").on("popupafterclose", function () { var elem = $('.tapHoldMenu').popup({ positionTo: posterItem }).trigger('create').popup("open").on("popupafterclose", function () {
$(this).off("popupafterclose").remove(); $(this).off("popupafterclose").remove();
$(posterItem).removeClass('hasContextMenu'); $(posterItem).removeClass('hasContextMenu');
@ -290,6 +290,161 @@
return false; return false;
} }
function getGroupingHeaderHtml(item) {
var itemHtml = '';
var href = LibraryBrowser.getHref(item);
itemHtml += '<li><a href="' + href + '">';
var imgUrl = "css/images/media/chapterflyout.png";
if (item.ImageTags.Primary) {
itemHtml += '<img src="' + imgUrl + '" style="visibility:hidden;" />';
imgUrl = ApiClient.getScaledImageUrl(item.Id, {
width: 160,
tag: item.ImageTags.Primary,
type: "Primary",
index: 0
});
itemHtml += '<div class="videoChapterPopupImage" style="background-image:url(\'' + imgUrl + '\');"></div>';
} else {
itemHtml += '<img src="' + imgUrl + '" />';
}
itemHtml += '<h3>';
itemHtml += LibraryBrowser.getPosterViewDisplayName(item);
itemHtml += '</h3>';
var date = parseISO8601Date(item.DateCreated, { toLocal: true });
itemHtml += '<p>';
itemHtml += Globalize.translate('LabelAddedOnDate').replace('{0}', date.toLocaleDateString());
itemHtml += '</p>';
itemHtml += '</a></li>';
return itemHtml;
}
function onGroupedPosterItemClick(e) {
var posterItem = this;
var itemId = posterItem.getAttribute('data-itemid');
$(posterItem).addClass('hasContextMenu');
var userId = Dashboard.getCurrentUserId();
var promise1 = ApiClient.getItem(userId, itemId);
var options = {
Limit: parseInt($('.playedIndicator', posterItem).html() || '10'),
Fields: "PrimaryImageAspectRatio",
ParentId: itemId,
IsFolder: false,
GroupItems: false
};
if ($(posterItem).hasClass('unplayedGroupings')) {
options.IsPlayed = false;
}
var promise2 = ApiClient.getJSON(ApiClient.getUrl('Users/' + userId + '/Items/Latest', options));
$.when(promise1, promise2).done(function (response1, response2) {
var item = response1[0];
var latestItems = response2[0];
if (latestItems.length == 1) {
var first = latestItems[0];
Dashboard.navigate(LibraryBrowser.getHref(first));
return;
}
var html = '<div data-role="popup" class="groupingMenu" data-theme="a">';
html += '<a href="#" data-rel="back" class="ui-btn ui-corner-all ui-shadow ui-btn-b ui-icon-delete ui-btn-icon-notext ui-btn-right">Close</a>';
html += '<div>';
html += '<ul data-role="listview">';
var href = LibraryBrowser.getHref(item);
var header = Globalize.translate('HeaderLatestFromChannel').replace('{0}', '<a href="' + href + '">' + item.Name + '</a>');
html += '<li data-role="list-divider">' + header + '</li>';
html += '</ul>';
html += '<div class="groupingMenuScroller">';
html += '<ul data-role="listview">';
html += latestItems.map(function (latestItem) {
var itemHtml = '';
href = LibraryBrowser.getHref(latestItem);
itemHtml += '<li><a href="' + href + '">';
var imgUrl = "css/images/media/chapterflyout.png";
if (latestItem.ImageTags.Primary) {
itemHtml += '<img src="' + imgUrl + '" style="visibility:hidden;" />';
imgUrl = ApiClient.getScaledImageUrl(latestItem.Id, {
width: 160,
tag: latestItem.ImageTags.Primary,
type: "Primary",
index: 0
});
itemHtml += '<div class="videoChapterPopupImage" style="background-image:url(\'' + imgUrl + '\');"></div>';
} else {
itemHtml += '<img src="' + imgUrl + '" />';
}
itemHtml += '<h3>';
itemHtml += LibraryBrowser.getPosterViewDisplayName(latestItem);
itemHtml += '</h3>';
var date = parseISO8601Date(item.DateCreated, { toLocal: true });
itemHtml += '<p>';
itemHtml += Globalize.translate('LabelAddedOnDate').replace('{0}', date.toLocaleDateString());
itemHtml += '</p>';
itemHtml += '</a></li>';
return itemHtml;
}).join('');
html += '</ul>';
html += '</div>';
html += '</div>';
html += '</div>';
$($.mobile.activePage).append(html);
var elem = $('.groupingMenu').popup().trigger('create').popup("open").on("popupafterclose", function () {
$(this).off("popupafterclose").remove();
$(posterItem).removeClass('hasContextMenu');
});
});
e.preventDefault();
return false;
}
$.fn.createPosterItemMenus = function () { $.fn.createPosterItemMenus = function () {
var preventHover = false; var preventHover = false;
@ -355,8 +510,9 @@
var elems = '.backdropPosterItem,.smallBackdropPosterItem,.portraitPosterItem,.squarePosterItem,.miniBackdropPosterItem'; var elems = '.backdropPosterItem,.smallBackdropPosterItem,.portraitPosterItem,.squarePosterItem,.miniBackdropPosterItem';
this.off('contextmenu.posterItemMenu', elems) $('.posterItem', this).on('contextmenu.posterItemMenu', onPosterItemTapHold);
.on('contextmenu.posterItemMenu', elems, onPosterItemTapHold);
$('.groupedPosterItem', this).on('click', onGroupedPosterItemClick);
return this.off('.posterItemHoverMenu') return this.off('.posterItemHoverMenu')
.on('mouseenter.posterItemHoverMenu', elems, onHoverIn) .on('mouseenter.posterItemHoverMenu', elems, onHoverIn)

View file

@ -1104,7 +1104,7 @@
$(self).trigger('playstatechange', [state]); $(self).trigger('playstatechange', [state]);
}; };
$(window).on("beforeunload popstate", function () { $(window).on("beforeunload", function () {
// Try to report playback stopped before the browser closes // Try to report playback stopped before the browser closes
if (self.currentItem && self.currentMediaElement && currentProgressInterval) { if (self.currentItem && self.currentMediaElement && currentProgressInterval) {

View file

@ -175,6 +175,18 @@
}).on('pagebeforeshow', "#boxsetsPage", function () { }).on('pagebeforeshow', "#boxsetsPage", function () {
var page = this;
var context = getParameterByName('context');
if (context == 'movies') {
$('.collectionTabs', page).hide();
$('.movieTabs', page).show();
} else {
$('.collectionTabs', page).show();
$('.movieTabs', page).hide();
}
query.ParentId = LibraryMenu.getTopParentId(); query.ParentId = LibraryMenu.getTopParentId();
var limit = LibraryBrowser.getDefaultPageSize(); var limit = LibraryBrowser.getDefaultPageSize();

View file

@ -3,30 +3,28 @@
$(document).on('pagebeforeshow', "#moviesLatestPage", function () { $(document).on('pagebeforeshow', "#moviesLatestPage", function () {
var parentId = LibraryMenu.getTopParentId(); var parentId = LibraryMenu.getTopParentId();
var userId = Dashboard.getCurrentUserId();
var screenWidth = $(window).width(); var screenWidth = $(window).width();
var page = this; var page = this;
var options = { var options = {
SortBy: "DateCreated",
SortOrder: "Descending",
IncludeItemTypes: "Movie", IncludeItemTypes: "Movie",
Limit: screenWidth >= 1920 ? 32 : (screenWidth >= 1440 ? 32 : (screenWidth >= 800 ? 28 : 18)), Limit: screenWidth >= 1920 ? 32 : (screenWidth >= 1440 ? 32 : (screenWidth >= 800 ? 28 : 18)),
Recursive: true,
Fields: "PrimaryImageAspectRatio", Fields: "PrimaryImageAspectRatio",
Filters: "IsUnplayed", ParentId: parentId,
CollapseBoxSetItems: false, IsPlayed: false
ParentId: parentId
}; };
ApiClient.getItems(Dashboard.getCurrentUserId(), options).done(function (result) { ApiClient.getJSON(ApiClient.getUrl('Users/' + userId + '/Items/Latest', options)).done(function (items) {
$('#recentlyAddedItems', page).html(LibraryBrowser.getPosterViewHtml({ $('#recentlyAddedItems', page).html(LibraryBrowser.getPosterViewHtml({
items: result.Items items: items,
lazy: true
})).createPosterItemMenus(); })).trigger('create').createPosterItemMenus();
}); });
}); });

View file

@ -28,7 +28,8 @@
html += '<div>'; html += '<div>';
html += LibraryBrowser.getPosterViewHtml({ html += LibraryBrowser.getPosterViewHtml({
items: recommendation.Items items: recommendation.Items,
lazy: true
}); });
html += '</div>'; html += '</div>';
@ -69,16 +70,17 @@
preferBackdrop: true, preferBackdrop: true,
shape: 'backdrop', shape: 'backdrop',
overlayText: screenWidth >= 600, overlayText: screenWidth >= 600,
showTitle: true showTitle: true,
lazy: true
})).createPosterItemMenus(); })).trigger('create').createPosterItemMenus();
}); });
var url = ApiClient.getUrl("Movies/Recommendations", { var url = ApiClient.getUrl("Movies/Recommendations", {
userId: Dashboard.getCurrentUserId(), userId: Dashboard.getCurrentUserId(),
categoryLimit: screenWidth >= 1200 ? 6 : 3, categoryLimit: screenWidth >= 1200 ? 4 : 3,
itemLimit: screenWidth >= 1920 ? 8 : (screenWidth >= 1440 ? 8 : 7), itemLimit: screenWidth >= 1920 ? 8 : (screenWidth >= 1440 ? 8 : 7),
Fields: "PrimaryImageAspectRatio" Fields: "PrimaryImageAspectRatio"
}); });
@ -95,7 +97,7 @@
var html = recommendations.map(getRecommendationHtml).join(''); var html = recommendations.map(getRecommendationHtml).join('');
$('.noItemsMessage', page).hide(); $('.noItemsMessage', page).hide();
$('.recommendations', page).html(html).createPosterItemMenus(); $('.recommendations', page).html(html).trigger('create').createPosterItemMenus();
}); });
}); });

View file

@ -3,27 +3,25 @@
$(document).on('pagebeforeshow', "#musicRecommendedPage", function () { $(document).on('pagebeforeshow', "#musicRecommendedPage", function () {
var screenWidth = $(window).width(); var screenWidth = $(window).width();
var userId = Dashboard.getCurrentUserId();
var page = this; var page = this;
var parentId = LibraryMenu.getTopParentId(); var parentId = LibraryMenu.getTopParentId();
var options = { var options = {
SortBy: "DateCreated",
SortOrder: "Descending",
IncludeItemTypes: "MusicAlbum", IncludeItemTypes: "MusicAlbum",
Limit: screenWidth >= 1920 ? 8 : (screenWidth >= 1440 ? 8 : 6), Limit: screenWidth >= 1920 ? 8 : (screenWidth >= 1440 ? 8 : 6),
Recursive: true,
Fields: "PrimaryImageAspectRatio", Fields: "PrimaryImageAspectRatio",
ParentId: parentId ParentId: parentId
}; };
ApiClient.getItems(Dashboard.getCurrentUserId(), options).done(function (result) { ApiClient.getJSON(ApiClient.getUrl('Users/' + userId + '/Items/Latest', options)).done(function (items) {
$('#recentlyAddedAlbums', page).html(LibraryBrowser.getPosterViewHtml({ $('#recentlyAddedAlbums', page).html(LibraryBrowser.getPosterViewHtml({
items: result.Items, items: items,
showUnplayedIndicator: false, showUnplayedIndicator: false,
showChildCountIndicator: true,
shape: "square", shape: "square",
showTitle: true, showTitle: true,
showParentTitle: true showParentTitle: true
@ -32,21 +30,18 @@
}); });
options = { options = {
SortBy: "DateCreated",
SortOrder: "Descending",
IncludeItemTypes: "Audio", IncludeItemTypes: "Audio",
Limit: screenWidth >= 1920 ? 8 : (screenWidth >= 1440 ? 8 : 6), Limit: screenWidth >= 1920 ? 8 : (screenWidth >= 1440 ? 8 : 6),
Recursive: true, Fields: "PrimaryImageAspectRatio",
Fields: "PrimaryImageAspectRatio,AudioInfo",
ParentId: parentId ParentId: parentId
}; };
ApiClient.getItems(Dashboard.getCurrentUserId(), options).done(function (result) { ApiClient.getJSON(ApiClient.getUrl('Users/' + userId + '/Items/Latest', options)).done(function (items) {
$('#recentlyAddedSongs', page).html(LibraryBrowser.getPosterViewHtml({ $('#recentlyAddedSongs', page).html(LibraryBrowser.getPosterViewHtml({
items: result.Items, items: items,
showUnplayedIndicator: false, showUnplayedIndicator: false,
showChildCountIndicator: true,
shape: "square", shape: "square",
showTitle: true, showTitle: true,
showParentTitle: true showParentTitle: true

View file

@ -20,7 +20,7 @@
var html = ''; var html = '';
html += '<div id="nowPlayingBar" class="nowPlayingBar" style="display:none;">'; html += '<div class="nowPlayingBar" style="display:none;">';
html += '<div style="display:inline-block;width:12px;"></div>'; html += '<div style="display:inline-block;width:12px;"></div>';
html += '<a class="mediaButton remoteControlButton" title="' + Globalize.translate('ButtonRemoteControl') + '" href="nowplaying.html" data-role="button" data-icon="remote" data-iconpos="notext" data-inline="true">' + Globalize.translate('ButtonRemoteControl') + '</a>'; html += '<a class="mediaButton remoteControlButton" title="' + Globalize.translate('ButtonRemoteControl') + '" href="nowplaying.html" data-role="button" data-icon="remote" data-iconpos="notext" data-inline="true">' + Globalize.translate('ButtonRemoteControl') + '</a>';

View file

@ -3,6 +3,7 @@
$(document).on('pagebeforeshow', "#tvNextUpPage", function () { $(document).on('pagebeforeshow', "#tvNextUpPage", function () {
var screenWidth = $(window).width(); var screenWidth = $(window).width();
var userId = Dashboard.getCurrentUserId();
var parentId = LibraryMenu.getTopParentId(); var parentId = LibraryMenu.getTopParentId();
@ -10,30 +11,29 @@
var options = { var options = {
SortBy: "DateCreated",
SortOrder: "Descending",
IncludeItemTypes: "Episode", IncludeItemTypes: "Episode",
Limit: screenWidth >= 1920 ? 24 : (screenWidth >= 1440 ? 16 : 15), Limit: screenWidth >= 1920 ? 24 : (screenWidth >= 1440 ? 16 : 15),
Recursive: true, Fields: "PrimaryImageAspectRatio",
Fields: "PrimaryImageAspectRatio,SeriesInfo,UserData", ParentId: parentId,
Filters: "IsUnplayed", IsPlayed: false
ExcludeLocationTypes: "Virtual",
ParentId: parentId
}; };
ApiClient.getItems(Dashboard.getCurrentUserId(), options).done(function (result) { ApiClient.getJSON(ApiClient.getUrl('Users/' + userId + '/Items/Latest', options)).done(function (items) {
$('#latestEpisodes', page).html(LibraryBrowser.getPosterViewHtml({ $('#latestEpisodes', page).html(LibraryBrowser.getPosterViewHtml({
items: result.Items, items: items,
shape: "backdrop", shape: "backdrop",
showTitle: true, preferThumb: true,
inheritThumb: false,
showParentTitle: true, showParentTitle: true,
overlayText: screenWidth >= 600 showUnplayedIndicator: false,
showChildCountIndicator: true,
overlayText: screenWidth >= 600,
lazy: true
})).createPosterItemMenus(); })).trigger('create').createPosterItemMenus();
}); });
}); });

View file

@ -115,9 +115,10 @@
shape: "backdrop", shape: "backdrop",
showTitle: true, showTitle: true,
showParentTitle: true, showParentTitle: true,
overlayText: screenWidth >= 600 overlayText: screenWidth >= 600,
lazy: true
})).createPosterItemMenus(); })).trigger('create').createPosterItemMenus();
}); });
} }

View file

@ -36,7 +36,7 @@
</div> </div>
</div> </div>
<h1 class="listHeader nextUpHeader">${HeaderNextUp}</h1> <h1 class="listHeader nextUpHeader firstListHeader">${HeaderNextUp}</h1>
</div> </div>
<div id="nextUpItems"> <div id="nextUpItems">