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

fixes #834 - Change view of TV Shows or Interface for plugins

Browse source
This commit is contained in:
Luke Pulverenti 2014-07-05 15:57:18 -04:00
parent 4318490be2
commit 495501f5aa
10 changed files with 211 additions and 38 deletions
Download patch file Download diff file Expand all files Collapse all files

8
dashboard-ui/collections.html
View file

@ -25,7 +25,15 @@
<div data-role="content">
<div class="viewSettings">
<div style="display: inline-block;">
<select data-mini="true" data-inline="true" id="selectView" name="selectView">
<option value="Poster">${OptionPoster}</option>
<option value="List">${OptionList}</option>
</select>
</div>
<div class="viewControls" data-role="controlgroup" data-type="horizontal">
<button data-mini="true" data-icon="sort" data-inline="true" data-iconpos="notext" title="${ButtonSort}" onclick="$('#sortPanel', $(this).parents('.page')).panel( 'toggle' );">${ButtonSort}</button>
<button data-mini="true" data-icon="filter" data-inline="true" data-iconpos="notext" title="${ButtonFilter}" onclick="$('#filterPanel', $(this).parents('.page')).panel( 'toggle' );">${ButtonFilter}</button>
</div>

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

@ -1254,14 +1254,14 @@ a.itemTag:hover {
}
.itemsListview .ui-li-aside {
right: 1.5em;
right: 1.3em;
font-weight: normal;
font-size: 13px;
font-family: "Open Sans";
}
.itemsListview .ui-li-count {
right: 1.2em;
right: 1em;
top: 70%;
background: rgba(82, 181, 75, .8);
border: 0;

6
dashboard-ui/episodes.html
View file

@ -20,6 +20,12 @@
</div>
<div data-role="content">
<div class="viewSettings">
<div style="display: inline-block;">
<select data-mini="true" data-inline="true" id="selectView" name="selectView">
<option value="Poster">${OptionPoster}</option>
<option value="List">${OptionList}</option>
</select>
</div>
<div class="viewControls" data-role="controlgroup" data-type="horizontal">
<button data-mini="true" data-icon="sort" data-inline="true" data-iconpos="notext" title="${ButtonSort}" onclick="$('#sortPanel', $(this).parents('.page')).panel( 'toggle' );">${ButtonSort}</button>
<button data-mini="true" data-icon="filter" data-inline="true" data-iconpos="notext" title="${ButtonFilter}" onclick="$('#filterPanel', $(this).parents('.page')).panel( 'toggle' );">${ButtonFilter}</button>

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

@ -1,5 +1,7 @@
(function ($, document) {
var view = LibraryBrowser.getDefaultItemsView('Poster', 'List');
// The base query options
var query = {
@ -7,7 +9,7 @@
SortOrder: "Ascending",
IncludeItemTypes: "Episode",
Recursive: true,
Fields: "SeriesInfo,PrimaryImageAspectRatio",
Fields: "PrimaryImageAspectRatio,SortName",
StartIndex: 0,
IsMissing: false,
IsVirtualUnaired: false
@ -35,6 +37,15 @@
var screenWidth = $(window).width();
if (view == "List") {
html = LibraryBrowser.getListViewHtml({
items: result.Items,
context: 'tv',
sortBy: query.SortBy
});
}
else if (view == "Poster") {
html += LibraryBrowser.getPosterViewHtml({
items: result.Items,
shape: "backdrop",
@ -44,6 +55,7 @@
selectionPanel: true,
lazy: true
});
}
$('.itemsContainer', page).removeClass('timelineItemsContainer');
@ -107,6 +119,8 @@
}).checkboxradio('refresh');
$('#selectView', page).val(view).selectmenu('refresh');
$('#chkHD', page).checked(query.IsHD == true).checkboxradio('refresh');
$('#chkSD', page).checked(query.IsHD == false).checkboxradio('refresh');
@ -272,8 +286,18 @@
});
$('#selectView', this).on('change', function () {
view = this.value;
reloadItems(page);
LibraryBrowser.saveViewSetting(getSavedQueryKey(), view);
});
}).on('pagebeforeshow', "#episodesPage", function () {
var page = this;
query.ParentId = LibraryMenu.getTopParentId();
var limit = LibraryBrowser.getDefaultPageSize();
@ -284,7 +308,9 @@
query.StartIndex = 0;
}
LibraryBrowser.loadSavedQueryValues(getSavedQueryKey(), query);
var viewkey = getSavedQueryKey();
LibraryBrowser.loadSavedQueryValues(viewkey, query);
var filters = getParameterByName('filters');
if (filters) {
@ -301,7 +327,14 @@
query.SortOrder = sortorder;
}
reloadItems(this);
LibraryBrowser.getSavedViewSetting(viewkey).done(function (val) {
if (val) {
$('#selectView', page).val(val).selectmenu('refresh').trigger('change');
} else {
reloadItems(page);
}
});
}).on('pageshow', "#episodesPage", function () {

92
dashboard-ui/scripts/librarybrowser.js
View file

@ -24,6 +24,12 @@
return 20;
},
getDefaultItemsView: function (view, mobileView) {
return $.browser.mobile ? mobileView : view;
},
loadSavedQueryValues: function (key, query) {
var values = localStorage.getItem(key + '_' + Dashboard.getCurrentUserId());
@ -493,25 +499,101 @@
},
getListViewIndex: function(item, sortBy) {
sortBy = (sortBy || '').toLowerCase();
if (sortBy.indexOf('sortname') == 0) {
if (item.Type == 'Episode') return '';
// SortName
var name = (item.SortName || item.Name)[0];
if (!isNaN(name)) {
return '#';
}
return name.toUpperCase();
}
if (sortBy.indexOf('officialrating') == 0) {
return item.OfficialRating || 'Unrated';
}
if (sortBy.indexOf('communityrating') == 0) {
if (item.CommunityRating == null) {
return 'Unrated';
}
return Math.floor(item.CommunityRating);
}
if (sortBy.indexOf('criticrating') == 0) {
if (item.CriticRating == null) {
return 'Unrated';
}
return Math.floor(item.CriticRating);
}
if (sortBy.indexOf('metascore') == 0) {
if (item.Metascore == null) {
return 'Unrated';
}
return Math.floor(item.Metascore);
}
if (sortBy.indexOf('albumartist') == 0) {
// SortName
if (!item.AlbumArtist) return '';
var albumartist = item.AlbumArtist[0];
if (!isNaN(albumartist)) {
return '#';
}
return albumartist.toUpperCase();
}
return '';
},
getListViewHtml: function (options) {
var outerHtml = "";
outerHtml += '<ul data-role="listview" data-inset="true" class="itemsListview">';
var index = 0;
var groupTitle = '';
outerHtml += options.items.map(function (item) {
var html = '';
var itemGroupTitle = LibraryBrowser.getListViewIndex(item, options.sortBy);
if (itemGroupTitle != groupTitle) {
html += '<li data-role="list-divider">';
html += itemGroupTitle;
html += '</li>';
groupTitle = itemGroupTitle;
}
var href = LibraryBrowser.getHref(item, options.context);
html += '<li class="ui-li-has-thumb"><a href="' + href + '">';
html += '<li class="ui-li-has-thumb" data-itemid="' + item.Id + '"><a href="' + href + '">';
var imgUrl;
if (item.ImageTags.Primary) {
// Scaling 400w episode images to 80 doesn't turn out very well
var width = item.Type == 'Episode' ? 160 : 80;
imgUrl = ApiClient.getScaledImageUrl(item.Id, {
width: 80,
width: width,
tag: item.ImageTags.Primary,
type: "Primary",
index: 0
@ -519,7 +601,12 @@
}
if (imgUrl) {
if (index < 10) {
html += '<div class="listviewImage ui-li-thumb" style="background-image:url(\'' + imgUrl + '\');"></div>';
} else {
html += '<div class="listviewImage ui-li-thumb lazy" data-src="' + imgUrl + '"></div>';
}
}
html += '<h3>';
@ -550,6 +637,7 @@
outerHtml += '</ul>';
index++;
return outerHtml;
},

4
dashboard-ui/scripts/librarylist.js
View file

@ -353,8 +353,10 @@
if (latestItem.ImageTags.Primary) {
// Scaling 400w episode images to 80 doesn't turn out very well
var width = latestItem.Type == 'Episode' ? 160 : 80;
imgUrl = ApiClient.getScaledImageUrl(latestItem.Id, {
width: 80,
width: width,
tag: latestItem.ImageTags.Primary,
type: "Primary",
index: 0

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

@ -1,5 +1,7 @@
(function ($, document) {
var view = LibraryBrowser.getDefaultItemsView('Poster', 'List');
// The base query options
var query = {
@ -7,7 +9,7 @@
SortOrder: "Ascending",
IncludeItemTypes: "BoxSet",
Recursive: true,
Fields: "PrimaryImageAspectRatio",
Fields: "PrimaryImageAspectRatio,SortName",
StartIndex: 0
};
@ -33,6 +35,15 @@
if (result.TotalRecordCount) {
if (view == "List") {
html = LibraryBrowser.getListViewHtml({
items: result.Items,
context: 'movies',
sortBy: query.SortBy
});
}
else if (view == "Poster") {
html = LibraryBrowser.getPosterViewHtml({
items: result.Items,
shape: "portrait",
@ -41,9 +52,11 @@
centerText: true,
lazy: true
});
}
html += LibraryBrowser.getPagingHtml(query, result.TotalRecordCount);
$('.noItemsMessage', page).hide();
} else {
$('.noItemsMessage', page).show();
@ -97,6 +110,8 @@
}).checkboxradio('refresh');
$('#selectView', page).val(view).selectmenu('refresh');
$('#chkTrailer', page).checked(query.HasTrailer == true).checkboxradio('refresh');
$('#chkThemeSong', page).checked(query.HasThemeSong == true).checkboxradio('refresh');
$('#chkThemeVideo', page).checked(query.HasThemeVideo == true).checkboxradio('refresh');
@ -173,6 +188,15 @@
reloadItems(page);
});
$('#selectView', this).on('change', function () {
view = this.value;
reloadItems(page);
LibraryBrowser.saveViewSetting(getSavedQueryKey(), view);
});
}).on('pagebeforeshow', "#boxsetsPage", function () {
var page = this;
@ -197,9 +221,18 @@
query.StartIndex = 0;
}
LibraryBrowser.loadSavedQueryValues(getSavedQueryKey(), query);
var viewkey = getSavedQueryKey();
reloadItems(this);
LibraryBrowser.loadSavedQueryValues(viewkey, query);
LibraryBrowser.getSavedViewSetting(viewkey).done(function (val) {
if (val) {
$('#selectView', page).val(val).selectmenu('refresh').trigger('change');
} else {
reloadItems(page);
}
});
}).on('pageshow', "#boxsetsPage", function () {

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

@ -1,6 +1,6 @@
(function ($, document) {
var view = "Poster";
var view = LibraryBrowser.getDefaultItemsView('Poster', 'List');
// The base query options
var query = {
@ -9,7 +9,7 @@
SortOrder: "Ascending",
IncludeItemTypes: "Movie",
Recursive: true,
Fields: "PrimaryImageAspectRatio",
Fields: "PrimaryImageAspectRatio,SortName",
StartIndex: 0
};
@ -59,7 +59,8 @@
html = LibraryBrowser.getListViewHtml({
items: result.Items,
context: 'movies'
context: 'movies',
sortBy: query.SortBy
});
$('.itemsContainer', page).removeClass('timelineItemsContainer');
}

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

@ -1,6 +1,6 @@
(function ($, document) {
var view = "Poster";
var view = LibraryBrowser.getDefaultItemsView('Poster', 'List');
// The base query options
var query = {
@ -9,7 +9,7 @@
SortOrder: "Ascending",
IncludeItemTypes: "MusicAlbum",
Recursive: true,
Fields: "PrimaryImageAspectRatio",
Fields: "PrimaryImageAspectRatio,SortName",
StartIndex: 0
};
@ -48,7 +48,8 @@
html = LibraryBrowser.getListViewHtml({
items: result.Items,
context: 'music'
context: 'music',
sortBy: query.SortBy
});
$('.itemsContainer', page).removeClass('timelineItemsContainer');
}

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

@ -1,6 +1,6 @@
(function ($, document) {
var view = "Thumb";
var view = LibraryBrowser.getDefaultItemsView('Thumb', 'List');
// The base query options
var query = {
@ -9,7 +9,7 @@
SortOrder: "Ascending",
IncludeItemTypes: "Series",
Recursive: true,
Fields: "SeriesInfo,PrimaryImageAspectRatio",
Fields: "PrimaryImageAspectRatio,SortName",
StartIndex: 0
};
@ -72,7 +72,8 @@
html = LibraryBrowser.getListViewHtml({
items: result.Items,
context: 'tv'
context: 'tv',
sortBy: query.SortBy
});
$('.itemsContainer', page).removeClass('timelineItemsContainer');
}