mirror of
https://github.com/jellyfin/jellyfin-web
synced 2025-03-30 19:56:21 +00:00
Further improvements to the details page
This commit is contained in:
MrTimscampi
parent
660e4a0a3c
commit
e14f4315a8
10 changed files with 156 additions and 121 deletions
231
src/controllers/itemDetails/itemDetails.html
Normal file
231
src/controllers/itemDetails/itemDetails.html
Normal file
|
|
@ -0,0 +1,231 @@
|
|||
<div id="itemDetailPage" data-role="page" class="page libraryPage itemDetailPage noSecondaryNavPage selfBackdropPage" data-backbutton="true">
|
||||
<div id="itemBackdrop" class="itemBackdrop">
|
||||
</div>
|
||||
|
||||
<div class="detailLogo"></div>
|
||||
<div class="detailPageWrapperContainer">
|
||||
<div class="detailPagePrimaryContainer padded-left padded-right">
|
||||
<div class="infoWrapper infoText">
|
||||
<div class="nameContainer"></div>
|
||||
<div class="itemMiscInfo itemMiscInfo-primary"></div>
|
||||
<div class="itemMiscInfo itemMiscInfo-secondary"></div>
|
||||
</div>
|
||||
|
||||
<div class="mainDetailButtons">
|
||||
<button is="emby-button" type="button" class="button-flat btnResume hide detailButton" data-mode="resume">
|
||||
<div class="detailButton-content">
|
||||
<span class="material-icons detailButton-icon play_arrow"></span>
|
||||
</div>
|
||||
</button>
|
||||
|
||||
<button is="emby-button" type="button" class="button-flat btnPlay hide detailButton" data-mode="play">
|
||||
<div class="detailButton-content">
|
||||
<span class="material-icons detailButton-icon play_arrow"></span>
|
||||
</div>
|
||||
</button>
|
||||
|
||||
<button is="emby-button" type="button" class="button-flat btnDownload hide detailButton">
|
||||
<div class="detailButton-content">
|
||||
<span class="material-icons detailButton-icon get_app"></span>
|
||||
</div>
|
||||
</button>
|
||||
|
||||
<button is="emby-button" type="button" class="button-flat btnPlayTrailer hide detailButton">
|
||||
<div class="detailButton-content">
|
||||
<span class="material-icons detailButton-icon theaters"></span>
|
||||
</div>
|
||||
</button>
|
||||
|
||||
<button is="emby-button" type="button" class="button-flat btnInstantMix hide detailButton">
|
||||
<div class="detailButton-content">
|
||||
<span class="material-icons detailButton-icon explore"></span>
|
||||
</div>
|
||||
</button>
|
||||
|
||||
<button is="emby-button" type="button" class="button-flat btnShuffle hide detailButton">
|
||||
<div class="detailButton-content">
|
||||
<span class="material-icons detailButton-icon shuffle"></span>
|
||||
</div>
|
||||
</button>
|
||||
|
||||
<button is="emby-button" type="button" class="button-flat btnCancelSeriesTimer hide detailButton">
|
||||
<div class="detailButton-content">
|
||||
<span class="material-icons detailButton-icon delete"></span>
|
||||
</div>
|
||||
</button>
|
||||
|
||||
<button is="emby-button" type="button" class="button-flat btnCancelTimer hide detailButton">
|
||||
<div class="detailButton-content">
|
||||
<span class="material-icons detailButton-icon stop"></span>
|
||||
</div>
|
||||
</button>
|
||||
|
||||
<button is="emby-playstatebutton" type="button" class="button-flat btnPlaystate hide detailButton">
|
||||
<div class="detailButton-content">
|
||||
<span class="material-icons detailButton-icon check"></span>
|
||||
</div>
|
||||
</button>
|
||||
|
||||
<button is="emby-ratingbutton" type="button" class="button-flat btnUserRating hide detailButton">
|
||||
<div class="detailButton-content">
|
||||
<span class="material-icons detailButton-icon favorite"></span>
|
||||
</div>
|
||||
</button>
|
||||
|
||||
<button is="emby-button" type="button" class="button-flat btnSplitVersions hide detailButton">
|
||||
<div class="detailButton-content">
|
||||
<span class="material-icons detailButton-icon call_split"></span>
|
||||
</div>
|
||||
</button>
|
||||
|
||||
<button is="emby-button" type="button" class="button-flat btnMoreCommands hide detailButton">
|
||||
<div class="detailButton-content">
|
||||
<span class="material-icons detailButton-icon more_vert"></span>
|
||||
</div>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="detailPageSecondaryContainer">
|
||||
<div class="detailImageContainer padded-left"></div>
|
||||
<div class="detailPageContent">
|
||||
<div class="detailPagePrimaryContent padded-right">
|
||||
<div class="detailSection">
|
||||
<div class="itemMiscInfo nativeName hide"></div>
|
||||
|
||||
<div class="itemDetailsGroup">
|
||||
<div class="detailsGroupItem genresGroup hide">
|
||||
<div class="genresLabel label"></div>
|
||||
<div class="genres content"></div>
|
||||
</div>
|
||||
|
||||
<div class="detailsGroupItem directorsGroup hide">
|
||||
<div class="directorsLabel label"></div>
|
||||
<div class="directors content"></div>
|
||||
</div>
|
||||
|
||||
<div class="detailsGroupItem writersGroup hide">
|
||||
<div class="writersLabel label"></div>
|
||||
<div class="writers content"></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<form class="trackSelections hide focuscontainer-x">
|
||||
<div class="selectContainer selectSourceContainer hide trackSelectionFieldContainer flex-shrink-zero">
|
||||
<select is="emby-select" class="selectSource detailTrackSelect" label=""></select>
|
||||
</div>
|
||||
<div class="selectContainer selectVideoContainer hide trackSelectionFieldContainer flex-shrink-zero">
|
||||
<select is="emby-select" class="selectVideo detailTrackSelect" label=""></select>
|
||||
</div>
|
||||
<div class="selectContainer selectAudioContainer hide trackSelectionFieldContainer flex-shrink-zero">
|
||||
<select is="emby-select" class="selectAudio detailTrackSelect" label=""></select>
|
||||
</div>
|
||||
<div class="selectContainer selectSubtitlesContainer hide trackSelectionFieldContainer flex-shrink-zero">
|
||||
<select is="emby-select" class="selectSubtitles detailTrackSelect" label=""></select>
|
||||
</div>
|
||||
</form>
|
||||
|
||||
<div class="recordingFields hide" style="margin: .5em 0 1.5em;"></div>
|
||||
<div class="detailSectionContent">
|
||||
<div class="itemLastPlayed hide"></div>
|
||||
|
||||
<p class="itemGenres"></p>
|
||||
<h3 class="tagline"></h3>
|
||||
<p class="overview"></p>
|
||||
<div class="overview-controls">
|
||||
<a class="overview-expand hide" is="emby-linkbutton" href="#">${ShowMore}</a>
|
||||
</div>
|
||||
<p id="itemBirthday"></p>
|
||||
<p id="itemBirthLocation"></p>
|
||||
<p id="itemDeathDate"></p>
|
||||
<p id="seriesAirTime"></p>
|
||||
|
||||
<div class="itemTags hide" style="margin: .7em 0;font-size:92%;"></div>
|
||||
<div class="itemExternalLinks hide" style="margin: .7em 0;font-size:92%;"></div>
|
||||
<div class="seriesRecordingEditor"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="seriesTimerScheduleSection verticalSection detailVerticalSection hide" style="margin-top:-3em;">
|
||||
<h2 class="sectionTitle">${HeaderSchedule}</h2>
|
||||
<div class="seriesTimerSchedule padded-right"></div>
|
||||
</div>
|
||||
|
||||
<div class="collectionItems hide"></div>
|
||||
|
||||
<div class="nextUpSection verticalSection detailVerticalSection hide">
|
||||
<h2 class="sectionTitle sectionTitle-cards">${HeaderNextUp}</h2>
|
||||
<div is="emby-itemscontainer" class="nextUpItems vertical-wrap padded-right"></div>
|
||||
</div>
|
||||
|
||||
<div class="programGuideSection hide verticalSection detailVerticalSection">
|
||||
<div class="programGuide"></div>
|
||||
</div>
|
||||
|
||||
<div id="childrenCollapsible" class="hide verticalSection detailVerticalSection">
|
||||
<h2 class="childrenSectionHeader sectionTitle sectionTitle-cards hide">
|
||||
<span id="childrenTitle"></span>
|
||||
</h2>
|
||||
<div id="childrenContent">
|
||||
<div is="emby-itemscontainer" class="childrenItemsContainer itemsContainer padded-right" style="text-align: left;"></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="additionalPartsCollapsible" class="verticalSection detailVerticalSection hide">
|
||||
<h2 class="sectionTitle sectionTitle-cards padded-right">${HeaderAdditionalParts}</h2>
|
||||
<div id="additionalPartsContent" is="emby-itemscontainer" class="itemsContainer vertical-wrap padded-right"></div>
|
||||
</div>
|
||||
|
||||
<div class="verticalSection itemVerticalSection moreFromSeasonSection hide">
|
||||
<h2 class="sectionTitle sectionTitle-cards padded-right"></h2>
|
||||
<div is="emby-scroller" class="padded-top-focusscale padded-bottom-focusscale" data-centerfocus="true">
|
||||
<div is="emby-itemscontainer" class="scrollSlider focuscontainer-x itemsContainer"></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="verticalSection itemVerticalSection moreFromArtistSection hide">
|
||||
<h2 class="sectionTitle sectionTitle-cards padded-right"></h2>
|
||||
<div is="emby-scroller" class="padded-top-focusscale padded-bottom-focusscale" data-centerfocus="true">
|
||||
<div is="emby-itemscontainer" class="scrollSlider focuscontainer-x itemsContainer"></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="castCollapsible" class="verticalSection detailVerticalSection hide">
|
||||
<h2 id="peopleHeader" class="sectionTitle sectionTitle-cards padded-right">${HeaderCastCrew}</h2>
|
||||
<div is="emby-scroller" class="padded-top-focusscale padded-bottom-focusscale" data-centerfocus="true">
|
||||
<div id="castContent" is="emby-itemscontainer" class="scrollSlider focuscontainer-x itemsContainer"></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="seriesScheduleSection" class="verticalSection detailVerticalSection hide">
|
||||
<h2 class="sectionTitle padded-right">${HeaderUpcomingOnTV}</h2>
|
||||
<div id="seriesScheduleList" is="emby-itemscontainer" class="itemsContainer vertical-list padded-right"></div>
|
||||
</div>
|
||||
|
||||
<div id="specialsCollapsible" class="verticalSection detailVerticalSection hide">
|
||||
<h2 class="sectionTitle sectionTitle-cards padded-right">${HeaderSpecialFeatures}</h2>
|
||||
<div id="specialsContent" is="emby-itemscontainer" class="itemsContainer vertical-wrap padded-right"></div>
|
||||
</div>
|
||||
|
||||
<div id="musicVideosCollapsible" class="verticalSection detailVerticalSection hide">
|
||||
<h2 class="sectionTitle sectionTitle-cards padded-right">${HeaderMusicVideos}</h2>
|
||||
<div id="musicVideosContent" is="emby-itemscontainer" class="itemsContainer vertical-wrap padded-right"></div>
|
||||
</div>
|
||||
|
||||
<div id="scenesCollapsible" class="verticalSection itemVerticalSection verticalSection-extrabottompadding hide">
|
||||
<h2 class="sectionTitle sectionTitle-cards padded-right">${HeaderScenes}</h2>
|
||||
<div is="emby-scroller" class="padded-top-focusscale padded-bottom-focusscale" data-centerfocus="true">
|
||||
<div id="scenesContent" is="emby-itemscontainer" class="scrollSlider focuscontainer-x itemsContainer"></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="similarCollapsible" class="verticalSection itemVerticalSection verticalSection-extrabottompadding hide">
|
||||
<h2 class="sectionTitle sectionTitle-cards padded-right">${HeaderMoreLikeThis}</h2>
|
||||
<div is="emby-scroller" class="padded-top-focusscale padded-bottom-focusscale" data-centerfocus="true">
|
||||
<div is="emby-itemscontainer" class="scrollSlider focuscontainer-x itemsContainer similarContent"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -28,15 +28,11 @@ define(['loading', 'appRouter', 'layoutManager', 'connectionManager', 'userSetti
|
|||
}
|
||||
|
||||
function hideAll(page, className, show) {
|
||||
var i;
|
||||
var length;
|
||||
var elems = page.querySelectorAll('.' + className);
|
||||
|
||||
for (i = 0, length = elems.length; i < length; i++) {
|
||||
for (const elem of page.querySelectorAll('.' + className)) {
|
||||
if (show) {
|
||||
elems[i].classList.remove('hide');
|
||||
elem.classList.remove('hide');
|
||||
} else {
|
||||
elems[i].classList.add('hide');
|
||||
elem.classList.add('hide');
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -75,7 +71,9 @@ define(['loading', 'appRouter', 'layoutManager', 'connectionManager', 'userSetti
|
|||
moreButton: false,
|
||||
recordButton: false
|
||||
});
|
||||
return html += '</div>';
|
||||
html += '</div>';
|
||||
|
||||
return html;
|
||||
}
|
||||
|
||||
function renderSeriesTimerSchedule(page, apiClient, seriesTimerId) {
|
||||
|
|
@ -143,9 +141,13 @@ define(['loading', 'appRouter', 'layoutManager', 'connectionManager', 'userSetti
|
|||
|
||||
var mediaSources = item.MediaSources;
|
||||
instance._currentPlaybackMediaSources = mediaSources;
|
||||
|
||||
page.querySelector('.trackSelections').classList.remove('hide');
|
||||
|
||||
select.setLabel(globalize.translate('LabelVersion'));
|
||||
|
||||
var currentValue = select.value;
|
||||
|
||||
var selectedId = mediaSources[0].Id;
|
||||
select.innerHTML = mediaSources.map(function (v) {
|
||||
var selected = v.Id === selectedId ? ' selected' : '';
|
||||
|
|
@ -242,12 +244,24 @@ define(['loading', 'appRouter', 'layoutManager', 'connectionManager', 'userSetti
|
|||
select.setLabel(globalize.translate('LabelSubtitles'));
|
||||
var selectedId = null == mediaSource.DefaultSubtitleStreamIndex ? -1 : mediaSource.DefaultSubtitleStreamIndex;
|
||||
|
||||
if (tracks.length) {
|
||||
var videoTracks = mediaSource.MediaStreams.filter(function (m) {
|
||||
return 'Video' === m.Type;
|
||||
});
|
||||
|
||||
// This only makes sence on Video items
|
||||
if (videoTracks.length) {
|
||||
var selected = -1 === selectedId ? ' selected' : '';
|
||||
select.innerHTML = '<option value="-1">' + globalize.translate('Off') + '</option>' + tracks.map(function (v) {
|
||||
selected = v.Index === selectedId ? ' selected' : '';
|
||||
return '<option value="' + v.Index + '" ' + selected + '>' + v.DisplayTitle + '</option>';
|
||||
}).join('');
|
||||
|
||||
if (tracks.length > 1) {
|
||||
select.removeAttribute('disabled');
|
||||
} else {
|
||||
select.setAttribute('disabled', 'disabled');
|
||||
}
|
||||
|
||||
page.querySelector('.selectSubtitlesContainer').classList.remove('hide');
|
||||
} else {
|
||||
select.innerHTML = '';
|
||||
|
|
@ -278,7 +292,12 @@ define(['loading', 'appRouter', 'layoutManager', 'connectionManager', 'userSetti
|
|||
var enableShuffle = item.IsFolder || -1 !== ['MusicAlbum', 'MusicGenre', 'MusicArtist'].indexOf(item.Type);
|
||||
hideAll(page, 'btnShuffle', enableShuffle);
|
||||
canPlay = true;
|
||||
hideAll(page, 'btnResume', item.UserData && item.UserData.PlaybackPositionTicks > 0);
|
||||
if (item.UserData && item.UserData.PlaybackPositionTicks > 0) {
|
||||
hideAll(page, 'btnResume', true);
|
||||
for (const elem of page.querySelectorAll('.btnPlay')) {
|
||||
elem.querySelector('.detailButton-icon').classList.replace('play_arrow', 'replay');
|
||||
}
|
||||
}
|
||||
} else {
|
||||
hideAll(page, 'btnPlay');
|
||||
hideAll(page, 'btnResume');
|
||||
|
|
@ -324,8 +343,7 @@ define(['loading', 'appRouter', 'layoutManager', 'connectionManager', 'userSetti
|
|||
function getArtistLinksHtml(artists, serverId, context) {
|
||||
var html = [];
|
||||
|
||||
for (var i = 0, length = artists.length; i < length; i++) {
|
||||
var artist = artists[i];
|
||||
for (const artist of artists) {
|
||||
var href = appRouter.getRouteUrl(artist, {
|
||||
context: context,
|
||||
itemType: 'MusicArtist',
|
||||
|
|
@ -333,8 +351,9 @@ define(['loading', 'appRouter', 'layoutManager', 'connectionManager', 'userSetti
|
|||
});
|
||||
html.push('<a style="color:inherit;" class="button-link" is="emby-linkbutton" href="' + href + '">' + artist.Name + '</a>');
|
||||
}
|
||||
html = html.join(' / ');
|
||||
|
||||
return html = html.join(' / ');
|
||||
return html;
|
||||
}
|
||||
|
||||
/**
|
||||
|
|
@ -371,6 +390,8 @@ define(['loading', 'appRouter', 'layoutManager', 'connectionManager', 'userSetti
|
|||
|
||||
if (item.SeriesName && 'Season' === item.Type) {
|
||||
parentRoute = appRouter.getRouteUrl({
|
||||
Id: item.SeriesId,
|
||||
Name: item.SeriesName,
|
||||
Type: 'Series',
|
||||
IsFolder: true,
|
||||
ServerId: item.ServerId
|
||||
|
|
@ -414,36 +435,33 @@ define(['loading', 'appRouter', 'layoutManager', 'connectionManager', 'userSetti
|
|||
if (parentNameLast) {
|
||||
// Music
|
||||
if (layoutManager.mobile) {
|
||||
html = '<h3 class="parentName" style="margin: .25em 0;">' + parentNameHtml.join('</br>') + '</h3>';
|
||||
html = '<h3 class="parentName musicParentName">' + parentNameHtml.join('</br>') + '</h3>';
|
||||
} else {
|
||||
html = '<h3 class="parentName" style="margin: .25em 0;">' + parentNameHtml.join(' - ') + '</h3>';
|
||||
html = '<h3 class="parentName musicParentName">' + parentNameHtml.join(' - ') + '</h3>';
|
||||
}
|
||||
} else {
|
||||
if (layoutManager.mobile) {
|
||||
html = '<h1 class="parentName" style="margin: .1em 0 .25em;">' + parentNameHtml.join('</br>') + '</h1>';
|
||||
} else {
|
||||
html = '<h1 class="parentName" style="margin: .1em 0 .25em;">' + tvShowHtml + '</h1>';
|
||||
}
|
||||
html = '<h1 class="parentName">' + tvShowHtml + '</h1>';
|
||||
}
|
||||
}
|
||||
|
||||
var name = itemHelper.getDisplayName(item, {
|
||||
includeParentInfo: false
|
||||
});
|
||||
var offset = parentNameLast ? '.25em' : '.5em';
|
||||
|
||||
if (html && !parentNameLast) {
|
||||
if (!layoutManager.mobile && tvSeasonHtml) {
|
||||
html += '<h3 class="itemName infoText" style="margin: .25em 0 .5em;">' + tvSeasonHtml + ' - ' + name + '</h3>';
|
||||
if (tvSeasonHtml) {
|
||||
html += '<h3 class="itemName infoText subTitle">' + tvSeasonHtml + ' - ' + name + '</h3>';
|
||||
} else {
|
||||
html += '<h3 class="itemName infoText" style="margin: .25em 0 .5em;">' + name + '</h3>';
|
||||
html += '<h3 class="itemName infoText subTitle">' + name + '</h3>';
|
||||
}
|
||||
} else if (item.OriginalTitle && item.OriginalTitle != item.Name) {
|
||||
html = '<h1 class="itemName infoText parentNameLast withOriginalTitle">' + name + '</h1>' + html;
|
||||
} else {
|
||||
html = '<h1 class="itemName infoText" style="margin: .1em 0 ' + offset + ';">' + name + '</h1>' + html;
|
||||
html = '<h1 class="itemName infoText parentNameLast">' + name + '</h1>' + html;
|
||||
}
|
||||
|
||||
if (item.OriginalTitle && item.OriginalTitle != item.Name) {
|
||||
html += '<h4 class="itemName infoText" style="margin: -0.75em 0 0.25em;">' + item.OriginalTitle + '</h4>';
|
||||
html += '<h4 class="itemName infoText originalTitle">' + item.OriginalTitle + '</h4>';
|
||||
}
|
||||
|
||||
container.innerHTML = html;
|
||||
|
|
@ -511,7 +529,7 @@ define(['loading', 'appRouter', 'layoutManager', 'connectionManager', 'userSetti
|
|||
Emby.Page.setTitle('');
|
||||
|
||||
// Start rendering the artwork first
|
||||
renderImage(page, item, apiClient, user);
|
||||
renderImage(page, item);
|
||||
renderLogo(page, item, apiClient);
|
||||
renderBackdrop(item);
|
||||
renderDetailPageBackdrop(page, item, apiClient);
|
||||
|
|
@ -672,7 +690,7 @@ define(['loading', 'appRouter', 'layoutManager', 'connectionManager', 'userSetti
|
|||
}
|
||||
|
||||
if (item.ExternalUrls) {
|
||||
for (let url of item.ExternalUrls) {
|
||||
for (const url of item.ExternalUrls) {
|
||||
links.push(`<a is="emby-linkbutton" class="button-link" href="${url.Url}" target="_blank">${url.Name}</a>`);
|
||||
}
|
||||
}
|
||||
|
|
@ -691,7 +709,7 @@ define(['loading', 'appRouter', 'layoutManager', 'connectionManager', 'userSetti
|
|||
}
|
||||
}
|
||||
|
||||
function renderDetailImage(page, elem, item, apiClient, editable, imageLoader, indicators) {
|
||||
function renderDetailImage(elem, item, imageLoader) {
|
||||
elem.classList.add('detailimg-hidemobile');
|
||||
|
||||
const itemArray = [];
|
||||
|
|
@ -713,15 +731,11 @@ define(['loading', 'appRouter', 'layoutManager', 'connectionManager', 'userSetti
|
|||
imageLoader.lazyChildren(elem);
|
||||
}
|
||||
|
||||
function renderImage(page, item, apiClient, user) {
|
||||
function renderImage(page, item) {
|
||||
renderDetailImage(
|
||||
page,
|
||||
page.querySelector('.detailImageContainer'),
|
||||
item,
|
||||
apiClient,
|
||||
user.Policy.IsAdministrator && 'Photo' != item.MediaType,
|
||||
imageLoader,
|
||||
indicators
|
||||
imageLoader
|
||||
);
|
||||
}
|
||||
|
||||
|
|
@ -840,7 +854,7 @@ define(['loading', 'appRouter', 'layoutManager', 'connectionManager', 'userSetti
|
|||
function renderOverview(page, item) {
|
||||
var overviewElemnts = page.querySelectorAll('.overview');
|
||||
|
||||
for (let overviewElemnt of overviewElemnts) {
|
||||
for (const overviewElemnt of overviewElemnts) {
|
||||
var overview = item.Overview || '';
|
||||
|
||||
if (overview) {
|
||||
|
|
@ -861,10 +875,7 @@ define(['loading', 'appRouter', 'layoutManager', 'connectionManager', 'userSetti
|
|||
|
||||
expandButton.addEventListener('click', toggleLineClamp.bind(null, overviewElemnt));
|
||||
|
||||
var anchors = overviewElemnt.querySelectorAll('a');
|
||||
|
||||
var anchors = overviewElemnt.querySelectorAll('a');
|
||||
for (let anchor of anchors) {
|
||||
for (const anchor of overviewElemnt.querySelectorAll('a')) {
|
||||
anchor.setAttribute('target', '_blank');
|
||||
}
|
||||
} else {
|
||||
|
|
@ -874,19 +885,9 @@ define(['loading', 'appRouter', 'layoutManager', 'connectionManager', 'userSetti
|
|||
}
|
||||
}
|
||||
|
||||
function renderGenres(page, item, context) {
|
||||
context = context || inferContext(item);
|
||||
var type;
|
||||
function renderGenres(page, item, context = inferContext(item)) {
|
||||
var genres = item.GenreItems || [];
|
||||
|
||||
switch (context) {
|
||||
case 'music':
|
||||
type = 'MusicGenre';
|
||||
break;
|
||||
|
||||
default:
|
||||
type = 'Genre';
|
||||
}
|
||||
var type = context === 'music' ? 'MusicGenre' : 'Genre';
|
||||
|
||||
var html = genres.map(function (p) {
|
||||
return '<a style="color:inherit;" class="button-link" is="emby-linkbutton" href="' + appRouter.getRouteUrl({
|
||||
|
|
@ -973,7 +974,7 @@ define(['loading', 'appRouter', 'layoutManager', 'connectionManager', 'userSetti
|
|||
function renderMiscInfo(page, item) {
|
||||
const primaryItemMiscInfo = page.querySelectorAll('.itemMiscInfo-primary');
|
||||
|
||||
for (let miscInfo of primaryItemMiscInfo) {
|
||||
for (const miscInfo of primaryItemMiscInfo) {
|
||||
mediaInfo.fillPrimaryMediaInfo(miscInfo, item, {
|
||||
interactive: true,
|
||||
episodeTitle: false,
|
||||
|
|
@ -989,7 +990,7 @@ define(['loading', 'appRouter', 'layoutManager', 'connectionManager', 'userSetti
|
|||
|
||||
const secondaryItemMiscInfo = page.querySelectorAll('.itemMiscInfo-secondary');
|
||||
|
||||
for (let miscInfo of secondaryItemMiscInfo) {
|
||||
for (const miscInfo of secondaryItemMiscInfo) {
|
||||
mediaInfo.fillSecondaryMediaInfo(miscInfo, item, {
|
||||
interactive: true
|
||||
});
|
||||
|
|
@ -1313,8 +1314,7 @@ define(['loading', 'appRouter', 'layoutManager', 'connectionManager', 'userSetti
|
|||
action: 'playallfromhere',
|
||||
image: false,
|
||||
artist: 'auto',
|
||||
containerAlbumArtists: item.AlbumArtists,
|
||||
addToListButton: true
|
||||
containerAlbumArtists: item.AlbumArtists
|
||||
});
|
||||
isList = true;
|
||||
} else if ('Series' == item.Type) {
|
||||
|
|
@ -1588,12 +1588,10 @@ define(['loading', 'appRouter', 'layoutManager', 'connectionManager', 'userSetti
|
|||
}
|
||||
|
||||
function renderCollectionItems(page, parentItem, types, items) {
|
||||
page.querySelector('.collectionItems').classList.remove('hide');
|
||||
page.querySelector('.collectionItems').innerHTML = '';
|
||||
var i;
|
||||
var length;
|
||||
|
||||
for (i = 0, length = types.length; i < length; i++) {
|
||||
var type = types[i];
|
||||
for (const type of types) {
|
||||
var typeItems = filterItemsByCollectionItemType(items, type);
|
||||
|
||||
if (typeItems.length) {
|
||||
|
|
@ -1626,8 +1624,8 @@ define(['loading', 'appRouter', 'layoutManager', 'connectionManager', 'userSetti
|
|||
renderChildren(page, parentItem);
|
||||
};
|
||||
|
||||
for (i = 0, length = containers.length; i < length; i++) {
|
||||
containers[i].notifyRefreshNeeded = notifyRefreshNeeded;
|
||||
for (const container of containers) {
|
||||
container.notifyRefreshNeeded = notifyRefreshNeeded;
|
||||
}
|
||||
|
||||
// if nothing in the collection can be played hide play and shuffle buttons
|
||||
|
|
@ -1794,7 +1792,7 @@ define(['loading', 'appRouter', 'layoutManager', 'connectionManager', 'userSetti
|
|||
function bindAll(view, selector, eventName, fn) {
|
||||
var elems = view.querySelectorAll(selector);
|
||||
|
||||
for (let elem of elems) {
|
||||
for (const elem of elems) {
|
||||
elem.addEventListener(eventName, fn);
|
||||
}
|
||||
}
|
||||
|
|
@ -1814,10 +1812,6 @@ define(['loading', 'appRouter', 'layoutManager', 'connectionManager', 'userSetti
|
|||
Promise.all([getPromise(apiClient, params), apiClient.getCurrentUser()]).then(([item, user]) => {
|
||||
currentItem = item;
|
||||
reloadFromItem(instance, page, params, item, user);
|
||||
|
||||
let detailImageContainer = page.querySelector('.detailImageContainer');
|
||||
const overlayPlayButton = detailImageContainer.querySelector('.cardOverlayFab-primary');
|
||||
overlayPlayButton.addEventListener('click', onPlayClick);
|
||||
}).catch((error) => {
|
||||
console.error('failed to get item or current user: ', error);
|
||||
});
|
||||
|
|
@ -1885,15 +1879,6 @@ define(['loading', 'appRouter', 'layoutManager', 'connectionManager', 'userSetti
|
|||
playbackManager.shuffle(currentItem);
|
||||
}
|
||||
|
||||
function onDeleteClick() {
|
||||
require(['deleteHelper'], function (deleteHelper) {
|
||||
deleteHelper.deleteItem({
|
||||
item: currentItem,
|
||||
navigate: true
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
function onCancelSeriesTimerClick() {
|
||||
require(['recordingHelper'], function (recordingHelper) {
|
||||
recordingHelper.cancelSeriesTimerWithConfirmation(currentItem.Id, currentItem.ServerId).then(function () {
|
||||
Loading…
Add table
Add a link
Reference in a new issue