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

update listviews

Browse source
This commit is contained in:
Luke Pulverenti 2016-07-16 01:05:40 -04:00
parent 3197c48232
commit 1032fa887e
54 changed files with 2271 additions and 376 deletions
Download patch file Download diff file Expand all files Collapse all files

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

@ -1,4 +1,4 @@
define(['events', 'libraryBrowser', 'imageLoader', 'jQuery'], function (events, libraryBrowser, imageLoader, $) {
define(['events', 'libraryBrowser', 'imageLoader', 'listView'], function (events, libraryBrowser, imageLoader, listView) {
return function (view, params, tabContent) {
@ -76,7 +76,7 @@
if (viewStyle == "List") {
html = libraryBrowser.getListViewHtml({
html = listView.getListViewHtml({
items: result.Items,
sortBy: query.SortBy
});
@ -107,17 +107,31 @@
});
}
$('.paging', tabContent).html(pagingHtml);
var i, length;
var elems = tabContent.querySelectorAll('.paging');
for (i = 0, length = elems.length; i < length; i++) {
elems[i].innerHTML = pagingHtml;
}
$('.btnNextPage', tabContent).on('click', function () {
function onNextPageClick() {
query.StartIndex += query.Limit;
reloadItems(tabContent);
});
}
$('.btnPreviousPage', tabContent).on('click', function () {
function onPreviousPageClick() {
query.StartIndex -= query.Limit;
reloadItems(tabContent);
});
}
elems = tabContent.querySelectorAll('.btnNextPage');
for (i = 0, length = elems.length; i < length; i++) {
elems[i].addEventListener('click', onNextPageClick);
}
elems = tabContent.querySelectorAll('.btnPreviousPage');
for (i = 0, length = elems.length; i < length; i++) {
elems[i].addEventListener('click', onPreviousPageClick);
}
var itemsContainer = tabContent.querySelector('.itemsContainer');
itemsContainer.innerHTML = html;

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

@ -1,4 +1,4 @@
define(['jQuery'], function ($) {
define(['jQuery', 'listView'], function ($, listView) {
var data = {};
@ -66,7 +66,7 @@ define(['jQuery'], function ($) {
if (view == "List") {
html = LibraryBrowser.getListViewHtml({
html = listView.getListViewHtml({
items: result.Items,
context: 'games',
sortBy: query.SortBy

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

@ -1,4 +1,4 @@
define([], function () {
define(['listView'], function (listView) {
function renderItems(page, item) {
@ -218,7 +218,7 @@
Limit: 30
}, {
playFromHere: true,
defaultAction: 'playallfromhere',
action: 'playallfromhere',
smallIcon: true
});
break;
@ -248,7 +248,7 @@
listOptions.items = result.Items;
if (type == 'Audio') {
html = LibraryBrowser.getListViewHtml(listOptions);
html = listView.getListViewHtml(listOptions);
} else {
html = LibraryBrowser.getPosterViewHtml(listOptions);
}

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

@ -1,4 +1,4 @@
define(['layoutManager', 'datetime', 'mediaInfo', 'backdrop', 'scrollStyles'], function (layoutManager, datetime, mediaInfo, backdrop) {
define(['layoutManager', 'datetime', 'mediaInfo', 'backdrop', 'listView', 'scrollStyles'], function (layoutManager, datetime, mediaInfo, backdrop, listView) {
var currentItem;
@ -931,14 +931,14 @@
if (item.Type == "MusicAlbum") {
html = LibraryBrowser.getListViewHtml({
html = listView.getListViewHtml({
items: result.Items,
smallIcon: true,
showIndex: true,
index: 'disc',
showIndexNumber: true,
playFromHere: true,
defaultAction: 'playallfromhere',
action: 'playallfromhere',
lazy: true
});
@ -1315,9 +1315,9 @@
page.querySelector('#themeSongsCollapsible').classList.remove('hide');
var html = LibraryBrowser.getListViewHtml({
items: items,
smallIcon: true
var html = listView.getListViewHtml({
items: result.Items,
sortBy: query.SortBy
});
page.querySelector('#themeSongsContent').innerHTML = html;

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

@ -1,4 +1,4 @@
define(['libraryBrowser', 'alphaPicker'], function (libraryBrowser, alphaPicker) {
define(['libraryBrowser', 'alphaPicker', 'listView'], function (libraryBrowser, alphaPicker, listView) {
return function (view, params) {
@ -114,7 +114,7 @@
}
else if (viewStyle == "List") {
html = libraryBrowser.getListViewHtml({
html = listView.getListViewHtml({
items: result.Items,
sortBy: query.SortBy
});

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

@ -1192,75 +1192,6 @@
},
getListViewIndex: function (item, options) {
if (options.index == 'disc') {
return item.ParentIndexNumber == null ? '' : Globalize.translate('ValueDiscNumber', item.ParentIndexNumber);
}
var sortBy = (options.sortBy || '').toLowerCase();
var code, name;
if (sortBy.indexOf('sortname') == 0) {
if (item.Type == 'Episode') return '';
// SortName
name = (item.SortName || item.Name || '?')[0].toUpperCase();
code = name.charCodeAt(0);
if (code < 65 || code > 90) {
return '#';
}
return name.toUpperCase();
}
if (sortBy.indexOf('officialrating') == 0) {
return item.OfficialRating || Globalize.translate('HeaderUnrated');
}
if (sortBy.indexOf('communityrating') == 0) {
if (item.CommunityRating == null) {
return Globalize.translate('HeaderUnrated');
}
return Math.floor(item.CommunityRating);
}
if (sortBy.indexOf('criticrating') == 0) {
if (item.CriticRating == null) {
return Globalize.translate('HeaderUnrated');
}
return Math.floor(item.CriticRating);
}
if (sortBy.indexOf('metascore') == 0) {
if (item.Metascore == null) {
return Globalize.translate('HeaderUnrated');
}
return Math.floor(item.Metascore);
}
if (sortBy.indexOf('albumartist') == 0) {
// SortName
if (!item.AlbumArtist) return '';
name = item.AlbumArtist[0].toUpperCase();
code = name.charCodeAt(0);
if (code < 65 || code > 90) {
return '#';
}
return name.toUpperCase();
}
return '';
},
getUserDataCssClass: function (key) {
if (!key) return '';
@ -1268,208 +1199,6 @@
return 'libraryItemUserData' + key.replace(new RegExp(' ', 'g'), '');
},
getListViewHtml: function (options) {
require(['listViewStyle', 'material-icons']);
var outerHtml = "";
if (options.title) {
outerHtml += '<h1>';
outerHtml += options.title;
outerHtml += '</h1>';
}
outerHtml += '<div class="paperList itemsListview">';
var index = 0;
var groupTitle = '';
outerHtml += options.items.map(function (item) {
var html = '';
if (options.showIndex !== false) {
var itemGroupTitle = LibraryBrowser.getListViewIndex(item, options);
if (itemGroupTitle != groupTitle) {
outerHtml += '</div>';
if (index == 0) {
html += '<h1>';
}
else {
html += '<h1 style="margin-top:2em;">';
}
html += itemGroupTitle;
html += '</h1>';
html += '<div class="paperList itemsListview">';
groupTitle = itemGroupTitle;
}
}
var dataAttributes = LibraryBrowser.getItemDataAttributes(item, options, index);
var cssClass = 'listItem';
var href = LibraryBrowser.getHref(item, options.context);
html += '<div class="' + cssClass + '"' + dataAttributes + ' data-itemid="' + item.Id + '" data-playlistitemid="' + (item.PlaylistItemId || '') + '" data-href="' + href + '" data-icon="false">';
var imgUrl;
var downloadWidth = options.smallIcon ? 70 : 80;
// Scaling 400w episode images to 80 doesn't turn out very well
var minScale = item.Type == 'Episode' || item.Type == 'Game' || options.smallIcon ? 2 : 1.5;
if (item.ImageTags.Primary) {
imgUrl = ApiClient.getScaledImageUrl(item.Id, {
maxWidth: downloadWidth,
tag: item.ImageTags.Primary,
type: "Primary",
index: 0,
minScale: minScale
});
}
else if (item.AlbumId && item.AlbumPrimaryImageTag) {
imgUrl = ApiClient.getScaledImageUrl(item.AlbumId, {
type: "Primary",
maxWidth: downloadWidth,
tag: item.AlbumPrimaryImageTag,
minScale: minScale
});
}
else if (item.SeriesId && item.SeriesPrimaryImageTag) {
imgUrl = ApiClient.getScaledImageUrl(item.SeriesId, {
type: "Primary",
maxWidth: downloadWidth,
tag: item.SeriesPrimaryImageTag,
minScale: minScale
});
}
else if (item.ParentPrimaryImageTag) {
imgUrl = ApiClient.getScaledImageUrl(item.ParentPrimaryImageItemId, {
type: "Primary",
maxWidth: downloadWidth,
tag: item.ParentPrimaryImageTag,
minScale: minScale
});
}
if (imgUrl) {
if (options.smallIcon) {
html += '<div class="listItemImage lazy small" data-src="' + imgUrl + '" item-icon></div>';
} else {
html += '<div class="listItemImage lazy" data-src="' + imgUrl + '" item-icon></div>';
}
} else {
if (options.smallIcon) {
html += '<div class="listItemImage small" item-icon></div>';
} else {
html += '<div class="listItemImage" item-icon></div>';
}
}
var textlines = [];
if (item.Type == 'Episode') {
textlines.push(item.SeriesName || '&nbsp;');
} else if (item.Type == 'MusicAlbum') {
textlines.push(item.AlbumArtist || '&nbsp;');
}
var displayName = itemHelper.getDisplayName(item);
if (options.showIndexNumber && item.IndexNumber != null) {
displayName = item.IndexNumber + ". " + displayName;
}
textlines.push(displayName);
if (item.Type == 'Audio') {
textlines.push(item.ArtistItems.map(function (a) {
return a.Name;
}).join(', ') || '&nbsp;');
}
if (item.Type == 'Game') {
textlines.push(item.GameSystem || '&nbsp;');
}
else if (item.Type == 'MusicGenre') {
textlines.push('&nbsp;');
}
else if (item.Type == 'MusicArtist') {
textlines.push('&nbsp;');
}
else if (item.Type == 'TvChannel') {
if (item.CurrentProgram) {
textlines.push(itemHelper.getDisplayName(item.CurrentProgram));
}
}
else {
textlines.push('<div class="itemMiscInfo">' + mediaInfo.getPrimaryMediaInfoHtml(item, {
endsAt: false
}) + '</div>');
}
var defaultAction = options.defaultAction;
if (defaultAction == 'play' || defaultAction == 'playallfromhere') {
if (item.PlayAccess != 'Full') {
defaultAction = null;
}
}
var bodyCssClass = 'mediaItem clearLink listItemBody';
if (textlines.length > 2) {
bodyCssClass += ' three-line';
} else {
bodyCssClass += ' two-line';
}
var defaultActionAttribute = defaultAction ? (' data-action="' + defaultAction + '" class="itemWithAction ' + bodyCssClass + '"') : ' class="' + bodyCssClass + '"';
html += '<a' + defaultActionAttribute + ' href="' + href + '">';
for (var i = 0, textLinesLength = textlines.length; i < textLinesLength; i++) {
if (i == 0) {
html += '<div>';
} else {
html += '<div class="secondary">';
}
html += textlines[i] || '&nbsp;';
html += '</div>';
}
html += '</a>';
html += '<button is="paper-icon-button-light" class="listviewMenuButton autoSize"><i class="md-icon">' + AppInfo.moreIcon.replace('-', '_') + '</i></button>';
html += '<span class="listViewUserDataButtons">';
html += LibraryBrowser.getUserDataIconsHtml(item);
html += '</span>';
html += '</div>';
index++;
return html;
}).join('');
outerHtml += '</div>';
return outerHtml;
},
getItemDataAttributesList: function (item, options, index) {
var atts = [];

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

@ -1,4 +1,4 @@
define(['events', 'libraryBrowser', 'imageLoader', 'alphaPicker'], function (events, libraryBrowser, imageLoader, alphaPicker) {
define(['events', 'libraryBrowser', 'imageLoader', 'alphaPicker', 'listView'], function (events, libraryBrowser, imageLoader, alphaPicker, listView) {
return function (view, params, tabContent) {
@ -108,7 +108,7 @@
}
else if (viewStyle == "List") {
html = libraryBrowser.getListViewHtml({
html = listView.getListViewHtml({
items: result.Items,
context: 'movies',
sortBy: query.SortBy

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

@ -1,4 +1,4 @@
define(['events', 'libraryBrowser', 'imageLoader', 'alphaPicker'], function (events, libraryBrowser, imageLoader, alphaPicker) {
define(['events', 'libraryBrowser', 'imageLoader', 'alphaPicker', 'listView'], function (events, libraryBrowser, imageLoader, alphaPicker, listView) {
return function (view, params, tabContent) {
@ -109,7 +109,7 @@
}
else if (viewStyle == "List") {
html = libraryBrowser.getListViewHtml({
html = listView.getListViewHtml({
items: result.Items,
context: 'movies',
sortBy: query.SortBy

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

@ -1,4 +1,4 @@
define(['events', 'libraryBrowser', 'imageLoader', 'alphaPicker'], function (events, libraryBrowser, imageLoader, alphaPicker) {
define(['events', 'libraryBrowser', 'imageLoader', 'alphaPicker', 'listView'], function (events, libraryBrowser, imageLoader, alphaPicker, listView) {
return function (view, params, tabContent) {
@ -108,7 +108,7 @@
}
else if (viewStyle == "List") {
html = libraryBrowser.getListViewHtml({
html = listView.getListViewHtml({
items: result.Items,
context: 'movies',
sortBy: query.SortBy

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

@ -1,4 +1,4 @@
define(['events', 'libraryBrowser', 'imageLoader', 'alphaPicker'], function (events, libraryBrowser, imageLoader, alphaPicker) {
define(['events', 'libraryBrowser', 'imageLoader', 'alphaPicker', 'listView'], function (events, libraryBrowser, imageLoader, alphaPicker, listView) {
return function (view, params, tabContent) {
@ -75,7 +75,7 @@
if (viewStyle == "List") {
html = libraryBrowser.getListViewHtml({
html = listView.getListViewHtml({
items: result.Items,
context: 'music',
sortBy: query.SortBy

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

@ -1,4 +1,4 @@
define(['events', 'libraryBrowser', 'imageLoader', 'alphaPicker'], function (events, libraryBrowser, imageLoader, alphaPicker) {
define(['events', 'libraryBrowser', 'imageLoader', 'alphaPicker', 'listView'], function (events, libraryBrowser, imageLoader, alphaPicker, listView) {
return function (view, params, tabContent) {
@ -77,9 +77,8 @@
if (viewStyle == "List") {
html = LibraryBrowser.getListViewHtml({
html = listView.getListViewHtml({
items: result.Items,
context: 'music',
sortBy: query.SortBy
});
}

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

@ -1,4 +1,4 @@
define(['appStorage', 'jQuery'], function (appStorage, $) {
define(['appStorage', 'jQuery', 'listView'], function (appStorage, $, listView) {
var data = {};
function getPageData() {
@ -60,15 +60,14 @@
if (view == "List") {
html = LibraryBrowser.getListViewHtml({
html = listView.getListViewHtml({
items: result.Items,
sortBy: query.SortBy,
showIndex: false,
showRemoveFromPlaylist: true,
playFromHere: true,
defaultAction: 'playallfromhere',
action: 'playallfromhere',
smallIcon: true
});
}

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

@ -1,4 +1,4 @@
define([], function () {
define(['listView'], function (listView) {
var data = {};
function getPageData() {
@ -80,7 +80,7 @@
if (view == "List") {
html = LibraryBrowser.getListViewHtml({
html = listView.getListViewHtml({
items: result.Items,
sortBy: query.SortBy
});

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

@ -1,4 +1,4 @@
define(['libraryBrowser'], function (libraryBrowser) {
define(['libraryBrowser', 'listView'], function (libraryBrowser, listView) {
return function (view, params) {
@ -127,10 +127,10 @@
if (query.IncludeItemTypes == "Audio") {
html = '<div style="max-width:1000px;margin:auto;">' + libraryBrowser.getListViewHtml({
html = '<div style="max-width:1000px;margin:auto;">' + listView.getListViewHtml({
items: result.Items,
playFromHere: true,
defaultAction: 'playallfromhere',
action: 'playallfromhere',
smallIcon: true
}) + '</div>';

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

@ -1934,8 +1934,10 @@ var AppInfo = {};
define('native-promise-only', [bowerPath + '/native-promise-only/lib/npo.src']);
define("fingerprintjs2", [bowerPath + '/fingerprintjs2/fingerprint2'], returnFirstDependency);
define("clearButtonStyle", ['css!' + embyWebComponentsBowerPath + '/clearbutton']);
define("userdataButtons", [embyWebComponentsBowerPath + "/userdatabuttons/userdatabuttons"], returnFirstDependency);
define("listView", [embyWebComponentsBowerPath + "/listview/listview"], returnFirstDependency);
define("listViewStyle", ['css!' + embyWebComponentsBowerPath + "/listview/listview"], returnFirstDependency);
define("indicators", [embyWebComponentsBowerPath + "/indicators/indicators"], returnFirstDependency);
if ('registerElement' in document && 'content' in document.createElement('template')) {
define('webcomponentsjs', []);

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

@ -1,4 +1,4 @@
define(['events', 'libraryBrowser', 'imageLoader'], function (events, libraryBrowser, imageLoader) {
define(['events', 'libraryBrowser', 'imageLoader', 'listView'], function (events, libraryBrowser, imageLoader, listView) {
return function (view, params, tabContent) {
@ -68,10 +68,9 @@
filterButton: false
});
var html = LibraryBrowser.getListViewHtml({
var html = listView.getListViewHtml({
items: result.Items,
showIndex: true,
defaultAction: 'play',
action: 'playallfromhere',
smallIcon: true
});

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

@ -1,4 +1,4 @@
define(['events', 'libraryBrowser', 'imageLoader', 'alphaPicker'], function (events, libraryBrowser, imageLoader, alphaPicker) {
define(['events', 'libraryBrowser', 'imageLoader', 'alphaPicker', 'listView'], function (events, libraryBrowser, imageLoader, alphaPicker, listView) {
return function (view, params, tabContent) {
@ -109,7 +109,7 @@
}
else if (viewStyle == "List") {
html = libraryBrowser.getListViewHtml({
html = listView.getListViewHtml({
items: result.Items,
context: 'tv',
sortBy: query.SortBy