-
${HeaderMusicVideos}
+
${MusicVideos}
diff --git a/src/controllers/itemDetails/index.js b/src/controllers/itemDetails/index.js
index b3c6a15dc..c68fe15fe 100644
--- a/src/controllers/itemDetails/index.js
+++ b/src/controllers/itemDetails/index.js
@@ -1,8 +1,8 @@
import appHost from 'apphost';
import loading from 'loading';
import appRouter from 'appRouter';
+import itemShortcuts from 'itemShortcuts';
import layoutManager from 'layoutManager';
-import connectionManager from 'connectionManager';
import * as userSettings from 'userSettings';
import cardBuilder from 'cardBuilder';
import datetime from 'datetime';
@@ -28,1916 +28,1943 @@ import 'emby-ratingbutton';
import 'emby-scroller';
import 'emby-select';
-/* eslint-disable indent */
+function getPromise(apiClient, params) {
+ const id = params.id;
- function getPromise(apiClient, params) {
- const id = params.id;
-
- if (id) {
- return apiClient.getItem(apiClient.getCurrentUserId(), id);
- }
-
- if (params.seriesTimerId) {
- return apiClient.getLiveTvSeriesTimer(params.seriesTimerId);
- }
-
- if (params.genre) {
- return apiClient.getGenre(params.genre, apiClient.getCurrentUserId());
- }
-
- if (params.musicgenre) {
- return apiClient.getMusicGenre(params.musicgenre, apiClient.getCurrentUserId());
- }
-
- if (params.musicartist) {
- return apiClient.getArtist(params.musicartist, apiClient.getCurrentUserId());
- }
-
- throw new Error('Invalid request');
+ if (id) {
+ return apiClient.getItem(apiClient.getCurrentUserId(), id);
}
- function hideAll(page, className, show) {
- for (const elem of page.querySelectorAll('.' + className)) {
- if (show) {
- elem.classList.remove('hide');
- } else {
- elem.classList.add('hide');
- }
+ if (params.seriesTimerId) {
+ return apiClient.getLiveTvSeriesTimer(params.seriesTimerId);
+ }
+
+ if (params.genre) {
+ return apiClient.getGenre(params.genre, apiClient.getCurrentUserId());
+ }
+
+ if (params.musicgenre) {
+ return apiClient.getMusicGenre(params.musicgenre, apiClient.getCurrentUserId());
+ }
+
+ if (params.musicartist) {
+ return apiClient.getArtist(params.musicartist, apiClient.getCurrentUserId());
+ }
+
+ throw new Error('Invalid request');
+}
+
+function hideAll(page, className, show) {
+ for (const elem of page.querySelectorAll('.' + className)) {
+ if (show) {
+ elem.classList.remove('hide');
+ } else {
+ elem.classList.add('hide');
}
}
+}
- function getContextMenuOptions(item, user, button) {
- return {
- item: item,
- open: false,
- play: false,
- playAllFromHere: false,
- queueAllFromHere: false,
- positionTo: button,
- cancelTimer: false,
- record: false,
- deleteItem: item.CanDelete === true,
- shuffle: false,
- instantMix: false,
- user: user,
- share: true
- };
- }
+function getContextMenuOptions(item, user, button) {
+ return {
+ item: item,
+ open: false,
+ play: false,
+ playAllFromHere: false,
+ queueAllFromHere: false,
+ positionTo: button,
+ cancelTimer: false,
+ record: false,
+ deleteItem: item.CanDelete === true,
+ shuffle: false,
+ instantMix: false,
+ user: user,
+ share: true
+ };
+}
- function getProgramScheduleHtml(items) {
- let html = '';
+function getProgramScheduleHtml(items) {
+ let html = '';
- html += '
';
- html += listView.getListViewHtml({
- items: items,
- enableUserDataButtons: false,
- image: true,
- imageSource: 'channel',
- showProgramDateTime: true,
- showChannel: false,
- mediaInfo: false,
- action: 'none',
- moreButton: false,
- recordButton: false
- });
+ html += '
';
+ html += listView.getListViewHtml({
+ items: items,
+ enableUserDataButtons: false,
+ image: true,
+ imageSource: 'channel',
+ showProgramDateTime: true,
+ showChannel: false,
+ mediaInfo: false,
+ action: 'none',
+ moreButton: false,
+ recordButton: false
+ });
- html += '
';
+ html += '
';
- return html;
- }
+ return html;
+}
- function renderSeriesTimerSchedule(page, apiClient, seriesTimerId) {
- apiClient.getLiveTvTimers({
- UserId: apiClient.getCurrentUserId(),
- ImageTypeLimit: 1,
- EnableImageTypes: 'Primary,Backdrop,Thumb',
- SortBy: 'StartDate',
- EnableTotalRecordCount: false,
- EnableUserData: false,
- SeriesTimerId: seriesTimerId,
- Fields: 'ChannelInfo,ChannelImage'
- }).then(function (result) {
- if (result.Items.length && result.Items[0].SeriesTimerId != seriesTimerId) {
- result.Items = [];
- }
-
- const html = getProgramScheduleHtml(result.Items);
- const scheduleTab = page.querySelector('.seriesTimerSchedule');
- scheduleTab.innerHTML = html;
- imageLoader.lazyChildren(scheduleTab);
- });
- }
-
- function renderTimerEditor(page, item, apiClient, user) {
- if (item.Type !== 'Recording' || !user.Policy.EnableLiveTvManagement || !item.TimerId || item.Status !== 'InProgress') {
- return void hideAll(page, 'btnCancelTimer');
+function renderSeriesTimerSchedule(page, apiClient, seriesTimerId) {
+ apiClient.getLiveTvTimers({
+ UserId: apiClient.getCurrentUserId(),
+ ImageTypeLimit: 1,
+ EnableImageTypes: 'Primary,Backdrop,Thumb',
+ SortBy: 'StartDate',
+ EnableTotalRecordCount: false,
+ EnableUserData: false,
+ SeriesTimerId: seriesTimerId,
+ Fields: 'ChannelInfo,ChannelImage'
+ }).then(function (result) {
+ if (result.Items.length && result.Items[0].SeriesTimerId != seriesTimerId) {
+ result.Items = [];
}
- hideAll(page, 'btnCancelTimer', true);
+ const html = getProgramScheduleHtml(result.Items);
+ const scheduleTab = page.querySelector('.seriesTimerSchedule');
+ scheduleTab.innerHTML = html;
+ imageLoader.lazyChildren(scheduleTab);
+ });
+}
+
+function renderTimerEditor(page, item, apiClient, user) {
+ if (item.Type !== 'Recording' || !user.Policy.EnableLiveTvManagement || !item.TimerId || item.Status !== 'InProgress') {
+ return void hideAll(page, 'btnCancelTimer');
}
- function renderSeriesTimerEditor(page, item, apiClient, user) {
- if (item.Type !== 'SeriesTimer') {
- return void hideAll(page, 'btnCancelSeriesTimer');
- }
+ hideAll(page, 'btnCancelTimer', true);
+}
- if (user.Policy.EnableLiveTvManagement) {
- import('seriesRecordingEditor').then(({default: seriesRecordingEditor}) => {
- seriesRecordingEditor.embed(item, apiClient.serverId(), {
- context: page.querySelector('.seriesRecordingEditor')
- });
- });
-
- page.querySelector('.seriesTimerScheduleSection').classList.remove('hide');
- hideAll(page, 'btnCancelSeriesTimer', true);
- return void renderSeriesTimerSchedule(page, apiClient, item.Id);
- }
-
- page.querySelector('.seriesTimerScheduleSection').classList.add('hide');
+function renderSeriesTimerEditor(page, item, apiClient, user) {
+ if (item.Type !== 'SeriesTimer') {
return void hideAll(page, 'btnCancelSeriesTimer');
}
- function renderTrackSelections(page, instance, item, forceReload) {
- const select = page.querySelector('.selectSource');
-
- if (!item.MediaSources || !itemHelper.supportsMediaSourceSelection(item) || playbackManager.getSupportedCommands().indexOf('PlayMediaSource') === -1 || !playbackManager.canPlay(item)) {
- page.querySelector('.trackSelections').classList.add('hide');
- select.innerHTML = '';
- page.querySelector('.selectVideo').innerHTML = '';
- page.querySelector('.selectAudio').innerHTML = '';
- page.querySelector('.selectSubtitles').innerHTML = '';
- return;
- }
-
- const mediaSources = item.MediaSources;
- instance._currentPlaybackMediaSources = mediaSources;
-
- page.querySelector('.trackSelections').classList.remove('hide');
- select.setLabel(globalize.translate('LabelVersion'));
-
- const currentValue = select.value;
-
- const selectedId = mediaSources[0].Id;
- select.innerHTML = mediaSources.map(function (v) {
- const selected = v.Id === selectedId ? ' selected' : '';
- return '
';
- }).join('');
-
- if (mediaSources.length > 1) {
- page.querySelector('.selectSourceContainer').classList.remove('hide');
- } else {
- page.querySelector('.selectSourceContainer').classList.add('hide');
- }
-
- if (select.value !== currentValue || forceReload) {
- renderVideoSelections(page, mediaSources);
- renderAudioSelections(page, mediaSources);
- renderSubtitleSelections(page, mediaSources);
- }
- }
-
- function renderVideoSelections(page, mediaSources) {
- const mediaSourceId = page.querySelector('.selectSource').value;
- const mediaSource = mediaSources.filter(function (m) {
- return m.Id === mediaSourceId;
- })[0];
-
- const tracks = mediaSource.MediaStreams.filter(function (m) {
- return m.Type === 'Video';
+ if (user.Policy.EnableLiveTvManagement) {
+ import('seriesRecordingEditor').then(({ default: seriesRecordingEditor }) => {
+ seriesRecordingEditor.embed(item, apiClient.serverId(), {
+ context: page.querySelector('.seriesRecordingEditor')
+ });
});
- const select = page.querySelector('.selectVideo');
- select.setLabel(globalize.translate('LabelVideo'));
- const selectedId = tracks.length ? tracks[0].Index : -1;
- select.innerHTML = tracks.map(function (v) {
- const selected = v.Index === selectedId ? ' selected' : '';
- const titleParts = [];
- const resolutionText = mediaInfo.getResolutionText(v);
+ page.querySelector('.seriesTimerScheduleSection').classList.remove('hide');
+ hideAll(page, 'btnCancelSeriesTimer', true);
+ return void renderSeriesTimerSchedule(page, apiClient, item.Id);
+ }
- if (resolutionText) {
- titleParts.push(resolutionText);
- }
+ page.querySelector('.seriesTimerScheduleSection').classList.add('hide');
+ return void hideAll(page, 'btnCancelSeriesTimer');
+}
- if (v.Codec) {
- titleParts.push(v.Codec.toUpperCase());
- }
+function renderTrackSelections(page, instance, item, forceReload) {
+ const select = page.querySelector('.selectSource');
- return '
';
- }).join('');
+ if (!item.MediaSources || !itemHelper.supportsMediaSourceSelection(item) || playbackManager.getSupportedCommands().indexOf('PlayMediaSource') === -1 || !playbackManager.canPlay(item)) {
+ page.querySelector('.trackSelections').classList.add('hide');
+ select.innerHTML = '';
+ page.querySelector('.selectVideo').innerHTML = '';
+ page.querySelector('.selectAudio').innerHTML = '';
+ page.querySelector('.selectSubtitles').innerHTML = '';
+ return;
+ }
+
+ const mediaSources = item.MediaSources;
+ instance._currentPlaybackMediaSources = mediaSources;
+
+ page.querySelector('.trackSelections').classList.remove('hide');
+ select.setLabel(globalize.translate('LabelVersion'));
+
+ const currentValue = select.value;
+
+ const selectedId = mediaSources[0].Id;
+ select.innerHTML = mediaSources.map(function (v) {
+ const selected = v.Id === selectedId ? ' selected' : '';
+ return '
';
+ }).join('');
+
+ if (mediaSources.length > 1) {
+ page.querySelector('.selectSourceContainer').classList.remove('hide');
+ } else {
+ page.querySelector('.selectSourceContainer').classList.add('hide');
+ }
+
+ if (select.value !== currentValue || forceReload) {
+ renderVideoSelections(page, mediaSources);
+ renderAudioSelections(page, mediaSources);
+ renderSubtitleSelections(page, mediaSources);
+ }
+}
+
+function renderVideoSelections(page, mediaSources) {
+ const mediaSourceId = page.querySelector('.selectSource').value;
+ const mediaSource = mediaSources.filter(function (m) {
+ return m.Id === mediaSourceId;
+ })[0];
+
+ const tracks = mediaSource.MediaStreams.filter(function (m) {
+ return m.Type === 'Video';
+ });
+
+ const select = page.querySelector('.selectVideo');
+ select.setLabel(globalize.translate('Video'));
+ const selectedId = tracks.length ? tracks[0].Index : -1;
+ select.innerHTML = tracks.map(function (v) {
+ const selected = v.Index === selectedId ? ' selected' : '';
+ const titleParts = [];
+ const resolutionText = mediaInfo.getResolutionText(v);
+
+ if (resolutionText) {
+ titleParts.push(resolutionText);
+ }
+
+ if (v.Codec) {
+ titleParts.push(v.Codec.toUpperCase());
+ }
+
+ return '
';
+ }).join('');
+ select.setAttribute('disabled', 'disabled');
+
+ if (tracks.length) {
+ page.querySelector('.selectVideoContainer').classList.remove('hide');
+ } else {
+ page.querySelector('.selectVideoContainer').classList.add('hide');
+ }
+}
+
+function renderAudioSelections(page, mediaSources) {
+ const mediaSourceId = page.querySelector('.selectSource').value;
+ const mediaSource = mediaSources.filter(function (m) {
+ return m.Id === mediaSourceId;
+ })[0];
+ const tracks = mediaSource.MediaStreams.filter(function (m) {
+ return m.Type === 'Audio';
+ });
+ const select = page.querySelector('.selectAudio');
+ select.setLabel(globalize.translate('Audio'));
+ const selectedId = mediaSource.DefaultAudioStreamIndex;
+ select.innerHTML = tracks.map(function (v) {
+ const selected = v.Index === selectedId ? ' selected' : '';
+ return '
';
+ }).join('');
+
+ if (tracks.length > 1) {
+ select.removeAttribute('disabled');
+ } else {
select.setAttribute('disabled', 'disabled');
-
- if (tracks.length) {
- page.querySelector('.selectVideoContainer').classList.remove('hide');
- } else {
- page.querySelector('.selectVideoContainer').classList.add('hide');
- }
}
- function renderAudioSelections(page, mediaSources) {
- const mediaSourceId = page.querySelector('.selectSource').value;
- const mediaSource = mediaSources.filter(function (m) {
- return m.Id === mediaSourceId;
- })[0];
- const tracks = mediaSource.MediaStreams.filter(function (m) {
- return m.Type === 'Audio';
- });
- const select = page.querySelector('.selectAudio');
- select.setLabel(globalize.translate('LabelAudio'));
- const selectedId = mediaSource.DefaultAudioStreamIndex;
- select.innerHTML = tracks.map(function (v) {
- const selected = v.Index === selectedId ? ' selected' : '';
+ if (tracks.length) {
+ page.querySelector('.selectAudioContainer').classList.remove('hide');
+ } else {
+ page.querySelector('.selectAudioContainer').classList.add('hide');
+ }
+}
+
+function renderSubtitleSelections(page, mediaSources) {
+ const mediaSourceId = page.querySelector('.selectSource').value;
+ const mediaSource = mediaSources.filter(function (m) {
+ return m.Id === mediaSourceId;
+ })[0];
+ const tracks = mediaSource.MediaStreams.filter(function (m) {
+ return m.Type === 'Subtitle';
+ });
+ const select = page.querySelector('.selectSubtitles');
+ select.setLabel(globalize.translate('Subtitles'));
+ const selectedId = mediaSource.DefaultSubtitleStreamIndex == null ? -1 : mediaSource.DefaultSubtitleStreamIndex;
+
+ const videoTracks = mediaSource.MediaStreams.filter(function (m) {
+ return m.Type === 'Video';
+ });
+
+ // This only makes sense on Video items
+ if (videoTracks.length) {
+ let selected = selectedId === -1 ? ' selected' : '';
+ select.innerHTML = '
' + tracks.map(function (v) {
+ selected = v.Index === selectedId ? ' selected' : '';
return '
';
}).join('');
- if (tracks.length > 1) {
+ if (tracks.length > 0) {
select.removeAttribute('disabled');
} else {
select.setAttribute('disabled', 'disabled');
}
- if (tracks.length) {
- page.querySelector('.selectAudioContainer').classList.remove('hide');
- } else {
- page.querySelector('.selectAudioContainer').classList.add('hide');
- }
+ page.querySelector('.selectSubtitlesContainer').classList.remove('hide');
+ } else {
+ select.innerHTML = '';
+ page.querySelector('.selectSubtitlesContainer').classList.add('hide');
}
+}
- function renderSubtitleSelections(page, mediaSources) {
- const mediaSourceId = page.querySelector('.selectSource').value;
- const mediaSource = mediaSources.filter(function (m) {
- return m.Id === mediaSourceId;
- })[0];
- const tracks = mediaSource.MediaStreams.filter(function (m) {
- return m.Type === 'Subtitle';
- });
- const select = page.querySelector('.selectSubtitles');
- select.setLabel(globalize.translate('LabelSubtitles'));
- const selectedId = mediaSource.DefaultSubtitleStreamIndex == null ? -1 : mediaSource.DefaultSubtitleStreamIndex;
+function reloadPlayButtons(page, item) {
+ let canPlay = false;
- const videoTracks = mediaSource.MediaStreams.filter(function (m) {
- return m.Type === 'Video';
- });
+ if (item.Type == 'Program') {
+ const now = new Date();
- // This only makes sense on Video items
- if (videoTracks.length) {
- let selected = selectedId === -1 ? ' selected' : '';
- select.innerHTML = '
' + tracks.map(function (v) {
- selected = v.Index === selectedId ? ' selected' : '';
- return '
';
- }).join('');
-
- if (tracks.length > 0) {
- select.removeAttribute('disabled');
- } else {
- select.setAttribute('disabled', 'disabled');
- }
-
- page.querySelector('.selectSubtitlesContainer').classList.remove('hide');
- } else {
- select.innerHTML = '';
- page.querySelector('.selectSubtitlesContainer').classList.add('hide');
- }
- }
-
- function reloadPlayButtons(page, item) {
- let canPlay = false;
-
- if (item.Type == 'Program') {
- const now = new Date();
-
- if (now >= datetime.parseISO8601Date(item.StartDate, true) && now < datetime.parseISO8601Date(item.EndDate, true)) {
- hideAll(page, 'btnPlay', true);
- canPlay = true;
- } else {
- hideAll(page, 'btnPlay');
- }
-
- hideAll(page, 'btnResume');
- hideAll(page, 'btnInstantMix');
- hideAll(page, 'btnShuffle');
- } else if (playbackManager.canPlay(item)) {
+ if (now >= datetime.parseISO8601Date(item.StartDate, true) && now < datetime.parseISO8601Date(item.EndDate, true)) {
hideAll(page, 'btnPlay', true);
- const enableInstantMix = ['Audio', 'MusicAlbum', 'MusicGenre', 'MusicArtist'].indexOf(item.Type) !== -1;
- hideAll(page, 'btnInstantMix', enableInstantMix);
- const enableShuffle = item.IsFolder || ['MusicAlbum', 'MusicGenre', 'MusicArtist'].indexOf(item.Type) !== -1;
- hideAll(page, 'btnShuffle', enableShuffle);
canPlay = true;
-
- const isResumable = item.UserData && item.UserData.PlaybackPositionTicks > 0;
- hideAll(page, 'btnResume', isResumable);
-
- if (isResumable) {
- for (const elem of page.querySelectorAll('.btnPlay')) {
- elem.querySelector('.detailButton-icon').classList.replace('play_arrow', 'replay');
- }
- }
} else {
hideAll(page, 'btnPlay');
- hideAll(page, 'btnResume');
- hideAll(page, 'btnInstantMix');
- hideAll(page, 'btnShuffle');
}
- return canPlay;
+ hideAll(page, 'btnResume');
+ hideAll(page, 'btnInstantMix');
+ hideAll(page, 'btnShuffle');
+ } else if (playbackManager.canPlay(item)) {
+ hideAll(page, 'btnPlay', true);
+ const enableInstantMix = ['Audio', 'MusicAlbum', 'MusicGenre', 'MusicArtist'].indexOf(item.Type) !== -1;
+ hideAll(page, 'btnInstantMix', enableInstantMix);
+ const enableShuffle = item.IsFolder || ['MusicAlbum', 'MusicGenre', 'MusicArtist'].indexOf(item.Type) !== -1;
+ hideAll(page, 'btnShuffle', enableShuffle);
+ canPlay = true;
+
+ const isResumable = item.UserData && item.UserData.PlaybackPositionTicks > 0;
+ hideAll(page, 'btnResume', isResumable);
+
+ if (isResumable) {
+ for (const elem of page.querySelectorAll('.btnPlay')) {
+ elem.querySelector('.detailButton-icon').classList.replace('play_arrow', 'replay');
+ }
+ }
+ } else {
+ hideAll(page, 'btnPlay');
+ hideAll(page, 'btnResume');
+ hideAll(page, 'btnInstantMix');
+ hideAll(page, 'btnShuffle');
}
- function reloadUserDataButtons(page, item) {
- let i;
- let length;
- const btnPlaystates = page.querySelectorAll('.btnPlaystate');
+ return canPlay;
+}
- for (i = 0, length = btnPlaystates.length; i < length; i++) {
- const btnPlaystate = btnPlaystates[i];
+function reloadUserDataButtons(page, item) {
+ let i;
+ let length;
+ const btnPlaystates = page.querySelectorAll('.btnPlaystate');
- if (itemHelper.canMarkPlayed(item)) {
- btnPlaystate.classList.remove('hide');
- btnPlaystate.setItem(item);
- } else {
- btnPlaystate.classList.add('hide');
- btnPlaystate.setItem(null);
- }
- }
+ for (i = 0, length = btnPlaystates.length; i < length; i++) {
+ const btnPlaystate = btnPlaystates[i];
- const btnUserRatings = page.querySelectorAll('.btnUserRating');
-
- for (i = 0, length = btnUserRatings.length; i < length; i++) {
- const btnUserRating = btnUserRatings[i];
-
- if (itemHelper.canRate(item)) {
- btnUserRating.classList.remove('hide');
- btnUserRating.setItem(item);
- } else {
- btnUserRating.classList.add('hide');
- btnUserRating.setItem(null);
- }
+ if (itemHelper.canMarkPlayed(item)) {
+ btnPlaystate.classList.remove('hide');
+ btnPlaystate.setItem(item);
+ } else {
+ btnPlaystate.classList.add('hide');
+ btnPlaystate.setItem(null);
}
}
- function getArtistLinksHtml(artists, serverId, context) {
- const html = [];
+ const btnUserRatings = page.querySelectorAll('.btnUserRating');
- for (const artist of artists) {
- const href = appRouter.getRouteUrl(artist, {
- context: context,
- itemType: 'MusicArtist',
- serverId: serverId
- });
- html.push('
' + artist.Name + '');
+ for (i = 0, length = btnUserRatings.length; i < length; i++) {
+ const btnUserRating = btnUserRatings[i];
+
+ if (itemHelper.canRate(item)) {
+ btnUserRating.classList.remove('hide');
+ btnUserRating.setItem(item);
+ } else {
+ btnUserRating.classList.add('hide');
+ btnUserRating.setItem(null);
}
-
- return html.join(' / ');
}
+}
- /**
- * Renders the item's name block
- * @param {Object} item - Item used to render the name.
- * @param {HTMLDivElement} container - Container to render the information into.
- * @param {Object} context - Application context.
- */
- function renderName(item, container, context) {
- let parentRoute;
- const parentNameHtml = [];
- let parentNameLast = false;
+function getArtistLinksHtml(artists, serverId, context) {
+ const html = [];
- if (item.AlbumArtists) {
- parentNameHtml.push(getArtistLinksHtml(item.AlbumArtists, item.ServerId, context));
- parentNameLast = true;
- } else if (item.ArtistItems && item.ArtistItems.length && item.Type === 'MusicVideo') {
- parentNameHtml.push(getArtistLinksHtml(item.ArtistItems, item.ServerId, context));
- parentNameLast = true;
- } else if (item.SeriesName && item.Type === 'Episode') {
- parentRoute = appRouter.getRouteUrl({
- Id: item.SeriesId,
- Name: item.SeriesName,
- Type: 'Series',
- IsFolder: true,
- ServerId: item.ServerId
- }, {
- context: context
- });
- parentNameHtml.push('
' + item.SeriesName + '');
- } else if (item.IsSeries || item.EpisodeTitle) {
- parentNameHtml.push(item.Name);
- }
-
- if (item.SeriesName && item.Type === 'Season') {
- parentRoute = appRouter.getRouteUrl({
- Id: item.SeriesId,
- Name: item.SeriesName,
- Type: 'Series',
- IsFolder: true,
- ServerId: item.ServerId
- }, {
- context: context
- });
- parentNameHtml.push('
' + item.SeriesName + '');
- } else if (item.ParentIndexNumber != null && item.Type === 'Episode') {
- parentRoute = appRouter.getRouteUrl({
- Id: item.SeasonId,
- Name: item.SeasonName,
- Type: 'Season',
- IsFolder: true,
- ServerId: item.ServerId
- }, {
- context: context
- });
- parentNameHtml.push('
' + item.SeasonName + '');
- } else if (item.ParentIndexNumber != null && item.IsSeries) {
- parentNameHtml.push(item.SeasonName || 'S' + item.ParentIndexNumber);
- } else if (item.Album && item.AlbumId && (item.Type === 'MusicVideo' || item.Type === 'Audio')) {
- parentRoute = appRouter.getRouteUrl({
- Id: item.AlbumId,
- Name: item.Album,
- Type: 'MusicAlbum',
- IsFolder: true,
- ServerId: item.ServerId
- }, {
- context: context
- });
- parentNameHtml.push('
' + item.Album + '');
- } else if (item.Album) {
- parentNameHtml.push(item.Album);
- }
-
- // FIXME: This whole section needs some refactoring, so it becames easier to scale across all form factors. See GH #1022
- let html = '';
- const tvShowHtml = parentNameHtml[0];
- const tvSeasonHtml = parentNameHtml[1];
-
- if (parentNameHtml.length) {
- if (parentNameLast) {
- // Music
- if (layoutManager.mobile) {
- html = '
' + parentNameHtml.join('') + '
';
- } else {
- html = '
' + parentNameHtml.join(' - ') + '
';
- }
- } else {
- html = '
' + tvShowHtml + '
';
- }
- }
-
- const name = itemHelper.getDisplayName(item, {
- includeParentInfo: false
+ for (const artist of artists) {
+ const href = appRouter.getRouteUrl(artist, {
+ context: context,
+ itemType: 'MusicArtist',
+ serverId: serverId
});
+ html.push('
' + artist.Name + '');
+ }
- if (html && !parentNameLast) {
- if (tvSeasonHtml) {
- html += '
' + tvSeasonHtml + ' - ' + name + '
';
+ return html.join(' / ');
+}
+
+/**
+ * Renders the item's name block
+ * @param {Object} item - Item used to render the name.
+ * @param {HTMLDivElement} container - Container to render the information into.
+ * @param {Object} context - Application context.
+ */
+function renderName(item, container, context) {
+ let parentRoute;
+ const parentNameHtml = [];
+ let parentNameLast = false;
+
+ if (item.AlbumArtists) {
+ parentNameHtml.push(getArtistLinksHtml(item.AlbumArtists, item.ServerId, context));
+ parentNameLast = true;
+ } else if (item.ArtistItems && item.ArtistItems.length && item.Type === 'MusicVideo') {
+ parentNameHtml.push(getArtistLinksHtml(item.ArtistItems, item.ServerId, context));
+ parentNameLast = true;
+ } else if (item.SeriesName && item.Type === 'Episode') {
+ parentRoute = appRouter.getRouteUrl({
+ Id: item.SeriesId,
+ Name: item.SeriesName,
+ Type: 'Series',
+ IsFolder: true,
+ ServerId: item.ServerId
+ }, {
+ context: context
+ });
+ parentNameHtml.push('
' + item.SeriesName + '');
+ } else if (item.IsSeries || item.EpisodeTitle) {
+ parentNameHtml.push(item.Name);
+ }
+
+ if (item.SeriesName && item.Type === 'Season') {
+ parentRoute = appRouter.getRouteUrl({
+ Id: item.SeriesId,
+ Name: item.SeriesName,
+ Type: 'Series',
+ IsFolder: true,
+ ServerId: item.ServerId
+ }, {
+ context: context
+ });
+ parentNameHtml.push('
' + item.SeriesName + '');
+ } else if (item.ParentIndexNumber != null && item.Type === 'Episode') {
+ parentRoute = appRouter.getRouteUrl({
+ Id: item.SeasonId,
+ Name: item.SeasonName,
+ Type: 'Season',
+ IsFolder: true,
+ ServerId: item.ServerId
+ }, {
+ context: context
+ });
+ parentNameHtml.push('
' + item.SeasonName + '');
+ } else if (item.ParentIndexNumber != null && item.IsSeries) {
+ parentNameHtml.push(item.SeasonName || 'S' + item.ParentIndexNumber);
+ } else if (item.Album && item.AlbumId && (item.Type === 'MusicVideo' || item.Type === 'Audio')) {
+ parentRoute = appRouter.getRouteUrl({
+ Id: item.AlbumId,
+ Name: item.Album,
+ Type: 'MusicAlbum',
+ IsFolder: true,
+ ServerId: item.ServerId
+ }, {
+ context: context
+ });
+ parentNameHtml.push('
' + item.Album + '');
+ } else if (item.Album) {
+ parentNameHtml.push(item.Album);
+ }
+
+ // FIXME: This whole section needs some refactoring, so it becames easier to scale across all form factors. See GH #1022
+ let html = '';
+ const tvShowHtml = parentNameHtml[0];
+ const tvSeasonHtml = parentNameHtml[1];
+
+ if (parentNameHtml.length) {
+ if (parentNameLast) {
+ // Music
+ if (layoutManager.mobile) {
+ html = '
' + parentNameHtml.join('') + '
';
} else {
- html += '
' + name + '
';
+ html = '
' + parentNameHtml.join(' - ') + '
';
}
- } else if (item.OriginalTitle && item.OriginalTitle != item.Name) {
- html = '
' + name + '
' + html;
} else {
- html = '
' + name + '
' + html;
- }
-
- if (item.OriginalTitle && item.OriginalTitle != item.Name) {
- html += '
' + item.OriginalTitle + '
';
- }
-
- container.innerHTML = html;
-
- if (html.length) {
- container.classList.remove('hide');
- } else {
- container.classList.add('hide');
+ html = '
' + tvShowHtml + '
';
}
}
- function setTrailerButtonVisibility(page, item) {
- if ((item.LocalTrailerCount || item.RemoteTrailers && item.RemoteTrailers.length) && playbackManager.getSupportedCommands().indexOf('PlayTrailers') !== -1) {
- hideAll(page, 'btnPlayTrailer', true);
+ const name = itemHelper.getDisplayName(item, {
+ includeParentInfo: false
+ });
+
+ if (html && !parentNameLast) {
+ if (tvSeasonHtml) {
+ html += '
' + tvSeasonHtml + ' - ' + name + '
';
} else {
- hideAll(page, 'btnPlayTrailer');
+ html += '
' + name + '
';
}
+ } else if (item.OriginalTitle && item.OriginalTitle != item.Name) {
+ html = '
' + name + '
' + html;
+ } else {
+ html = '
' + name + '
' + html;
}
- function renderBackdrop(item) {
- if (dom.getWindowSize().innerWidth >= 1000) {
- backdrop.setBackdrops([item]);
- } else {
- backdrop.clearBackdrop();
- }
+ if (item.OriginalTitle && item.OriginalTitle != item.Name) {
+ html += '
' + item.OriginalTitle + '
';
}
- function renderDetailPageBackdrop(page, item, apiClient) {
- let imgUrl;
- let hasbackdrop = false;
- const itemBackdropElement = page.querySelector('#itemBackdrop');
+ container.innerHTML = html;
- if (!layoutManager.mobile && !userSettings.detailsBanner()) {
- return false;
- }
+ if (html.length) {
+ container.classList.remove('hide');
+ } else {
+ container.classList.add('hide');
+ }
+}
- if (item.BackdropImageTags && item.BackdropImageTags.length) {
- imgUrl = apiClient.getScaledImageUrl(item.Id, {
- type: 'Backdrop',
- maxWidth: dom.getScreenWidth(),
- index: 0,
- tag: item.BackdropImageTags[0]
- });
- imageLoader.lazyImage(itemBackdropElement, imgUrl);
- hasbackdrop = true;
- } else if (item.ParentBackdropItemId && item.ParentBackdropImageTags && item.ParentBackdropImageTags.length) {
- imgUrl = apiClient.getScaledImageUrl(item.ParentBackdropItemId, {
- type: 'Backdrop',
- maxWidth: dom.getScreenWidth(),
- index: 0,
- tag: item.ParentBackdropImageTags[0]
- });
- imageLoader.lazyImage(itemBackdropElement, imgUrl);
- hasbackdrop = true;
- } else if (item.ImageTags && item.ImageTags.Primary) {
- imgUrl = apiClient.getScaledImageUrl(item.Id, {
- type: 'Primary',
- maxWidth: dom.getScreenWidth(),
- tag: item.ImageTags.Primary
- });
- imageLoader.lazyImage(itemBackdropElement, imgUrl);
- hasbackdrop = true;
- } else {
- itemBackdropElement.style.backgroundImage = '';
- }
+function setTrailerButtonVisibility(page, item) {
+ if ((item.LocalTrailerCount || item.RemoteTrailers && item.RemoteTrailers.length) && playbackManager.getSupportedCommands().indexOf('PlayTrailers') !== -1) {
+ hideAll(page, 'btnPlayTrailer', true);
+ } else {
+ hideAll(page, 'btnPlayTrailer');
+ }
+}
- return hasbackdrop;
+function renderBackdrop(item) {
+ if (dom.getWindowSize().innerWidth >= 1000) {
+ backdrop.setBackdrops([item]);
+ } else {
+ backdrop.clearBackdrop();
+ }
+}
+
+function renderDetailPageBackdrop(page, item, apiClient) {
+ let imgUrl;
+ let hasbackdrop = false;
+ const itemBackdropElement = page.querySelector('#itemBackdrop');
+
+ if (!layoutManager.mobile && !userSettings.detailsBanner()) {
+ return false;
}
- function reloadFromItem(instance, page, params, item, user) {
- const apiClient = connectionManager.getApiClient(item.ServerId);
+ if (item.BackdropImageTags && item.BackdropImageTags.length) {
+ imgUrl = apiClient.getScaledImageUrl(item.Id, {
+ type: 'Backdrop',
+ maxWidth: dom.getScreenWidth(),
+ index: 0,
+ tag: item.BackdropImageTags[0]
+ });
+ imageLoader.lazyImage(itemBackdropElement, imgUrl);
+ hasbackdrop = true;
+ } else if (item.ParentBackdropItemId && item.ParentBackdropImageTags && item.ParentBackdropImageTags.length) {
+ imgUrl = apiClient.getScaledImageUrl(item.ParentBackdropItemId, {
+ type: 'Backdrop',
+ maxWidth: dom.getScreenWidth(),
+ index: 0,
+ tag: item.ParentBackdropImageTags[0]
+ });
+ imageLoader.lazyImage(itemBackdropElement, imgUrl);
+ hasbackdrop = true;
+ } else if (item.ImageTags && item.ImageTags.Primary) {
+ imgUrl = apiClient.getScaledImageUrl(item.Id, {
+ type: 'Primary',
+ maxWidth: dom.getScreenWidth(),
+ tag: item.ImageTags.Primary
+ });
+ imageLoader.lazyImage(itemBackdropElement, imgUrl);
+ hasbackdrop = true;
+ } else {
+ itemBackdropElement.style.backgroundImage = '';
+ }
- Emby.Page.setTitle('');
+ return hasbackdrop;
+}
- // Start rendering the artwork first
- renderImage(page, item);
+function reloadFromItem(instance, page, params, item, user) {
+ const apiClient = window.connectionManager.getApiClient(item.ServerId);
+
+ Emby.Page.setTitle('');
+
+ // Start rendering the artwork first
+ renderImage(page, item);
+ // Save some screen real estate in TV mode
+ if (!layoutManager.tv) {
renderLogo(page, item, apiClient);
- renderBackdrop(item);
renderDetailPageBackdrop(page, item, apiClient);
+ }
+ renderBackdrop(item);
- // Render the main information for the item
- page.querySelector('.detailPagePrimaryContainer').classList.add('detailRibbon');
- renderName(item, page.querySelector('.nameContainer'), params.context);
- renderDetails(page, item, apiClient, params.context);
- renderTrackSelections(page, instance, item);
+ // Render the main information for the item
+ page.querySelector('.detailPagePrimaryContainer').classList.add('detailRibbon');
+ renderName(item, page.querySelector('.nameContainer'), params.context);
+ renderDetails(page, item, apiClient, params.context);
+ renderTrackSelections(page, instance, item);
- renderSeriesTimerEditor(page, item, apiClient, user);
- renderTimerEditor(page, item, apiClient, user);
- setInitialCollapsibleState(page, item, apiClient, params.context, user);
- const canPlay = reloadPlayButtons(page, item);
+ renderSeriesTimerEditor(page, item, apiClient, user);
+ renderTimerEditor(page, item, apiClient, user);
+ setInitialCollapsibleState(page, item, apiClient, params.context, user);
+ const canPlay = reloadPlayButtons(page, item);
- if ((item.LocalTrailerCount || item.RemoteTrailers && item.RemoteTrailers.length) && playbackManager.getSupportedCommands().indexOf('PlayTrailers') !== -1) {
- hideAll(page, 'btnPlayTrailer', true);
- } else {
- hideAll(page, 'btnPlayTrailer');
- }
+ if ((item.LocalTrailerCount || item.RemoteTrailers && item.RemoteTrailers.length) && playbackManager.getSupportedCommands().indexOf('PlayTrailers') !== -1) {
+ hideAll(page, 'btnPlayTrailer', true);
+ } else {
+ hideAll(page, 'btnPlayTrailer');
+ }
- setTrailerButtonVisibility(page, item);
+ setTrailerButtonVisibility(page, item);
- if (item.Type !== 'Program' || canPlay) {
- hideAll(page, 'mainDetailButtons', true);
- } else {
- hideAll(page, 'mainDetailButtons');
- }
+ if (item.Type !== 'Program' || canPlay) {
+ hideAll(page, 'mainDetailButtons', true);
+ } else {
+ hideAll(page, 'mainDetailButtons');
+ }
- showRecordingFields(instance, page, item, user);
- const groupedVersions = (item.MediaSources || []).filter(function (g) {
- return g.Type == 'Grouping';
- });
+ showRecordingFields(instance, page, item, user);
+ const groupedVersions = (item.MediaSources || []).filter(function (g) {
+ return g.Type == 'Grouping';
+ });
- if (user.Policy.IsAdministrator && groupedVersions.length) {
- page.querySelector('.btnSplitVersions').classList.remove('hide');
- } else {
- page.querySelector('.btnSplitVersions').classList.add('hide');
- }
+ if (user.Policy.IsAdministrator && groupedVersions.length) {
+ page.querySelector('.btnSplitVersions').classList.remove('hide');
+ } else {
+ page.querySelector('.btnSplitVersions').classList.add('hide');
+ }
- if (itemContextMenu.getCommands(getContextMenuOptions(item, user)).length) {
- hideAll(page, 'btnMoreCommands', true);
- } else {
- hideAll(page, 'btnMoreCommands');
- }
+ if (itemContextMenu.getCommands(getContextMenuOptions(item, user)).length) {
+ hideAll(page, 'btnMoreCommands', true);
+ } else {
+ hideAll(page, 'btnMoreCommands');
+ }
- const itemBirthday = page.querySelector('#itemBirthday');
+ const itemBirthday = page.querySelector('#itemBirthday');
- if (item.Type == 'Person' && item.PremiereDate) {
- try {
- const birthday = datetime.parseISO8601Date(item.PremiereDate, true).toDateString();
- itemBirthday.classList.remove('hide');
- itemBirthday.innerHTML = globalize.translate('BirthDateValue', birthday);
- } catch (err) {
- itemBirthday.classList.add('hide');
- }
- } else {
+ if (item.Type == 'Person' && item.PremiereDate) {
+ try {
+ const birthday = datetime.parseISO8601Date(item.PremiereDate, true).toDateString();
+ itemBirthday.classList.remove('hide');
+ itemBirthday.innerHTML = globalize.translate('BirthDateValue', birthday);
+ } catch (err) {
itemBirthday.classList.add('hide');
}
+ } else {
+ itemBirthday.classList.add('hide');
+ }
- const itemDeathDate = page.querySelector('#itemDeathDate');
+ const itemDeathDate = page.querySelector('#itemDeathDate');
- if (item.Type == 'Person' && item.EndDate) {
- try {
- const deathday = datetime.parseISO8601Date(item.EndDate, true).toDateString();
- itemDeathDate.classList.remove('hide');
- itemDeathDate.innerHTML = globalize.translate('DeathDateValue', deathday);
- } catch (err) {
- itemDeathDate.classList.add('hide');
- }
- } else {
+ if (item.Type == 'Person' && item.EndDate) {
+ try {
+ const deathday = datetime.parseISO8601Date(item.EndDate, true).toDateString();
+ itemDeathDate.classList.remove('hide');
+ itemDeathDate.innerHTML = globalize.translate('DeathDateValue', deathday);
+ } catch (err) {
itemDeathDate.classList.add('hide');
}
-
- const itemBirthLocation = page.querySelector('#itemBirthLocation');
-
- if (item.Type == 'Person' && item.ProductionLocations && item.ProductionLocations.length) {
- const gmap = '
' + item.ProductionLocations[0] + '';
- itemBirthLocation.classList.remove('hide');
- itemBirthLocation.innerHTML = globalize.translate('BirthPlaceValue', gmap);
- } else {
- itemBirthLocation.classList.add('hide');
- }
-
- setPeopleHeader(page, item);
- loading.hide();
-
- if (item.Type === 'Book' && item.CanDownload && appHost.supports('filedownload')) {
- hideAll(page, 'btnDownload', true);
- }
-
- import('autoFocuser').then(({default: autoFocuser}) => {
- autoFocuser.autoFocus(page);
- });
+ } else {
+ itemDeathDate.classList.add('hide');
}
- function logoImageUrl(item, apiClient, options) {
- options = options || {};
- options.type = 'Logo';
+ const itemBirthLocation = page.querySelector('#itemBirthLocation');
- if (item.ImageTags && item.ImageTags.Logo) {
- options.tag = item.ImageTags.Logo;
- return apiClient.getScaledImageUrl(item.Id, options);
- }
-
- if (item.ParentLogoImageTag) {
- options.tag = item.ParentLogoImageTag;
- return apiClient.getScaledImageUrl(item.ParentLogoItemId, options);
- }
-
- return null;
+ if (item.Type == 'Person' && item.ProductionLocations && item.ProductionLocations.length) {
+ const gmap = '
' + item.ProductionLocations[0] + '';
+ itemBirthLocation.classList.remove('hide');
+ itemBirthLocation.innerHTML = globalize.translate('BirthPlaceValue', gmap);
+ } else {
+ itemBirthLocation.classList.add('hide');
}
- function renderLogo(page, item, apiClient) {
- const detailLogo = page.querySelector('.detailLogo');
+ setPeopleHeader(page, item);
+ loading.hide();
- const url = logoImageUrl(item, apiClient, {});
-
- if (!layoutManager.mobile && !userSettings.enableBackdrops()) {
- detailLogo.classList.add('hide');
- } else if (url) {
- detailLogo.classList.remove('hide');
- imageLoader.setLazyImage(detailLogo, url);
- } else {
- detailLogo.classList.add('hide');
- }
+ if (item.Type === 'Book' && item.CanDownload && appHost.supports('filedownload')) {
+ hideAll(page, 'btnDownload', true);
}
- function showRecordingFields(instance, page, item, user) {
- if (!instance.currentRecordingFields) {
- const recordingFieldsElement = page.querySelector('.recordingFields');
+ import('autoFocuser').then(({ default: autoFocuser }) => {
+ autoFocuser.autoFocus(page);
+ });
+}
- if (item.Type == 'Program' && user.Policy.EnableLiveTvManagement) {
- import('recordingFields').then(({default: recordingFields}) => {
- instance.currentRecordingFields = new recordingFields({
- parent: recordingFieldsElement,
- programId: item.Id,
- serverId: item.ServerId
- });
- recordingFieldsElement.classList.remove('hide');
+function logoImageUrl(item, apiClient, options) {
+ options = options || {};
+ options.type = 'Logo';
+
+ if (item.ImageTags && item.ImageTags.Logo) {
+ options.tag = item.ImageTags.Logo;
+ return apiClient.getScaledImageUrl(item.Id, options);
+ }
+
+ if (item.ParentLogoImageTag) {
+ options.tag = item.ParentLogoImageTag;
+ return apiClient.getScaledImageUrl(item.ParentLogoItemId, options);
+ }
+
+ return null;
+}
+
+function renderLogo(page, item, apiClient) {
+ const detailLogo = page.querySelector('.detailLogo');
+
+ const url = logoImageUrl(item, apiClient, {});
+
+ if (!layoutManager.mobile && !userSettings.enableBackdrops()) {
+ detailLogo.classList.add('hide');
+ } else if (url) {
+ detailLogo.classList.remove('hide');
+ imageLoader.setLazyImage(detailLogo, url);
+ } else {
+ detailLogo.classList.add('hide');
+ }
+}
+
+function showRecordingFields(instance, page, item, user) {
+ if (!instance.currentRecordingFields) {
+ const recordingFieldsElement = page.querySelector('.recordingFields');
+
+ if (item.Type == 'Program' && user.Policy.EnableLiveTvManagement) {
+ import('recordingFields').then(({ default: recordingFields }) => {
+ instance.currentRecordingFields = new recordingFields({
+ parent: recordingFieldsElement,
+ programId: item.Id,
+ serverId: item.ServerId
});
- } else {
- recordingFieldsElement.classList.add('hide');
- recordingFieldsElement.innerHTML = '';
- }
- }
- }
-
- function renderLinks(page, item) {
- const externalLinksElem = page.querySelector('.itemExternalLinks');
-
- const links = [];
-
- if (!layoutManager.tv && item.HomePageUrl) {
- links.push(`
${globalize.translate('ButtonWebsite')}`);
- }
-
- if (item.ExternalUrls) {
- for (const url of item.ExternalUrls) {
- links.push(`
${url.Name}`);
- }
- }
-
- const html = [];
- if (links.length) {
- html.push(links.join(', '));
- }
-
- externalLinksElem.innerHTML = html.join(', ');
-
- if (html.length) {
- externalLinksElem.classList.remove('hide');
- } else {
- externalLinksElem.classList.add('hide');
- }
- }
-
- function renderDetailImage(elem, item, imageLoader) {
- const itemArray = [];
- itemArray.push(item);
- const cardHtml = cardBuilder.getCardsHtml(itemArray, {
- shape: 'auto',
- showTitle: false,
- centerText: true,
- overlayText: false,
- transition: false,
- disableIndicators: true,
- disableHoverMenu: true,
- overlayPlayButton: true,
- width: dom.getWindowSize().innerWidth * 0.25
- });
-
- elem.innerHTML = cardHtml;
- imageLoader.lazyChildren(elem);
- }
-
- function renderImage(page, item) {
- renderDetailImage(
- page.querySelector('.detailImageContainer'),
- item,
- imageLoader
- );
- }
-
- function refreshDetailImageUserData(elem, item) {
- elem.querySelector('.detailImageProgressContainer').innerHTML = indicators.getProgressBarHtml(item);
- }
-
- function refreshImage(page, item) {
- refreshDetailImageUserData(page.querySelector('.detailImageContainer'), item);
- }
-
- function setPeopleHeader(page, item) {
- if (item.MediaType == 'Audio' || item.Type == 'MusicAlbum' || item.MediaType == 'Book' || item.MediaType == 'Photo') {
- page.querySelector('#peopleHeader').innerHTML = globalize.translate('HeaderPeople');
- } else {
- page.querySelector('#peopleHeader').innerHTML = globalize.translate('HeaderCastAndCrew');
- }
- }
-
- function renderNextUp(page, item, user) {
- const section = page.querySelector('.nextUpSection');
-
- if (item.Type != 'Series') {
- return void section.classList.add('hide');
- }
-
- connectionManager.getApiClient(item.ServerId).getNextUpEpisodes({
- SeriesId: item.Id,
- UserId: user.Id
- }).then(function (result) {
- if (result.Items.length) {
- section.classList.remove('hide');
- } else {
- section.classList.add('hide');
- }
-
- const html = cardBuilder.getCardsHtml({
- items: result.Items,
- shape: 'overflowBackdrop',
- showTitle: true,
- displayAsSpecial: item.Type == 'Season' && item.IndexNumber,
- overlayText: false,
- centerText: true,
- overlayPlayButton: true
+ recordingFieldsElement.classList.remove('hide');
});
- const itemsContainer = section.querySelector('.nextUpItems');
- itemsContainer.innerHTML = html;
- imageLoader.lazyChildren(itemsContainer);
- });
+ } else {
+ recordingFieldsElement.classList.add('hide');
+ recordingFieldsElement.innerHTML = '';
+ }
+ }
+}
+
+function renderLinks(page, item) {
+ const externalLinksElem = page.querySelector('.itemExternalLinks');
+
+ const links = [];
+
+ if (!layoutManager.tv && item.HomePageUrl) {
+ links.push(`
${globalize.translate('ButtonWebsite')}`);
}
- function setInitialCollapsibleState(page, item, apiClient, context, user) {
- page.querySelector('.collectionItems').innerHTML = '';
+ if (item.ExternalUrls) {
+ for (const url of item.ExternalUrls) {
+ links.push(`
${url.Name}`);
+ }
+ }
- if (item.Type == 'Playlist') {
- page.querySelector('#childrenCollapsible').classList.remove('hide');
- renderPlaylistItems(page, item);
- } else if (item.Type == 'Studio' || item.Type == 'Person' || item.Type == 'Genre' || item.Type == 'MusicGenre' || item.Type == 'MusicArtist') {
- page.querySelector('#childrenCollapsible').classList.remove('hide');
- renderItemsByName(page, item);
- } else if (item.IsFolder) {
- if (item.Type == 'BoxSet') {
- page.querySelector('#childrenCollapsible').classList.add('hide');
- }
+ const html = [];
+ if (links.length) {
+ html.push(links.join(', '));
+ }
- renderChildren(page, item);
+ externalLinksElem.innerHTML = html.join(', ');
+
+ if (html.length) {
+ externalLinksElem.classList.remove('hide');
+ } else {
+ externalLinksElem.classList.add('hide');
+ }
+}
+
+function renderDetailImage(elem, item, imageLoader) {
+ const itemArray = [];
+ itemArray.push(item);
+ const cardHtml = cardBuilder.getCardsHtml(itemArray, {
+ shape: 'auto',
+ showTitle: false,
+ centerText: true,
+ overlayText: false,
+ transition: false,
+ disableIndicators: true,
+ overlayPlayButton: true,
+ action: 'play',
+ width: dom.getWindowSize().innerWidth * 0.25
+ });
+
+ elem.innerHTML = cardHtml;
+ imageLoader.lazyChildren(elem);
+
+ // Avoid breaking the design by preventing focus of the poster using the keyboard.
+ elem.querySelector('button').tabIndex = -1;
+}
+
+function renderImage(page, item) {
+ renderDetailImage(
+ page.querySelector('.detailImageContainer'),
+ item,
+ imageLoader
+ );
+}
+
+function refreshDetailImageUserData(elem, item) {
+ elem.querySelector('.detailImageProgressContainer').innerHTML = indicators.getProgressBarHtml(item);
+}
+
+function refreshImage(page, item) {
+ refreshDetailImageUserData(page.querySelector('.detailImageContainer'), item);
+}
+
+function setPeopleHeader(page, item) {
+ if (item.MediaType == 'Audio' || item.Type == 'MusicAlbum' || item.MediaType == 'Book' || item.MediaType == 'Photo') {
+ page.querySelector('#peopleHeader').innerHTML = globalize.translate('People');
+ } else {
+ page.querySelector('#peopleHeader').innerHTML = globalize.translate('HeaderCastAndCrew');
+ }
+}
+
+function renderNextUp(page, item, user) {
+ const section = page.querySelector('.nextUpSection');
+
+ if (item.Type != 'Series') {
+ return void section.classList.add('hide');
+ }
+
+ window.connectionManager.getApiClient(item.ServerId).getNextUpEpisodes({
+ SeriesId: item.Id,
+ UserId: user.Id
+ }).then(function (result) {
+ if (result.Items.length) {
+ section.classList.remove('hide');
} else {
+ section.classList.add('hide');
+ }
+
+ const html = cardBuilder.getCardsHtml({
+ items: result.Items,
+ shape: 'overflowBackdrop',
+ showTitle: true,
+ displayAsSpecial: item.Type == 'Season' && item.IndexNumber,
+ overlayText: false,
+ centerText: true,
+ overlayPlayButton: true
+ });
+ const itemsContainer = section.querySelector('.nextUpItems');
+ itemsContainer.innerHTML = html;
+ imageLoader.lazyChildren(itemsContainer);
+ });
+}
+
+function setInitialCollapsibleState(page, item, apiClient, context, user) {
+ page.querySelector('.collectionItems').innerHTML = '';
+
+ if (item.Type == 'Playlist') {
+ page.querySelector('#childrenCollapsible').classList.remove('hide');
+ renderPlaylistItems(page, item);
+ } else if (item.Type == 'Studio' || item.Type == 'Person' || item.Type == 'Genre' || item.Type == 'MusicGenre' || item.Type == 'MusicArtist') {
+ page.querySelector('#childrenCollapsible').classList.remove('hide');
+ renderItemsByName(page, item);
+ } else if (item.IsFolder) {
+ if (item.Type == 'BoxSet') {
page.querySelector('#childrenCollapsible').classList.add('hide');
}
- if (item.Type == 'Series') {
- renderSeriesSchedule(page, item);
- renderNextUp(page, item, user);
- } else {
- page.querySelector('.nextUpSection').classList.add('hide');
- }
-
- renderScenes(page, item);
-
- if (item.SpecialFeatureCount && item.SpecialFeatureCount != 0 && item.Type != 'Series') {
- page.querySelector('#specialsCollapsible').classList.remove('hide');
- renderSpecials(page, item, user);
- } else {
- page.querySelector('#specialsCollapsible').classList.add('hide');
- }
-
- renderCast(page, item);
-
- if (item.PartCount && item.PartCount > 1) {
- page.querySelector('#additionalPartsCollapsible').classList.remove('hide');
- renderAdditionalParts(page, item, user);
- } else {
- page.querySelector('#additionalPartsCollapsible').classList.add('hide');
- }
-
- if (item.Type == 'MusicAlbum') {
- renderMusicVideos(page, item, user);
- } else {
- page.querySelector('#musicVideosCollapsible').classList.add('hide');
- }
+ renderChildren(page, item);
+ } else {
+ page.querySelector('#childrenCollapsible').classList.add('hide');
}
- function toggleLineClamp(clampTarget, e) {
- const expandButton = e.target;
- const clampClassName = 'detail-clamp-text';
-
- if (clampTarget.classList.contains(clampClassName)) {
- clampTarget.classList.remove(clampClassName);
- expandButton.innerHTML = globalize.translate('ShowLess');
- } else {
- clampTarget.classList.add(clampClassName);
- expandButton.innerHTML = globalize.translate('ShowMore');
- }
+ if (item.Type == 'Series') {
+ renderSeriesSchedule(page, item);
+ renderNextUp(page, item, user);
+ } else {
+ page.querySelector('.nextUpSection').classList.add('hide');
}
- function renderOverview(page, item) {
- for (const overviewElemnt of page.querySelectorAll('.overview')) {
- const overview = item.Overview || '';
+ renderScenes(page, item);
- if (overview) {
- overviewElemnt.innerHTML = overview;
- overviewElemnt.classList.remove('hide');
- overviewElemnt.classList.add('detail-clamp-text');
+ if (item.SpecialFeatureCount && item.SpecialFeatureCount != 0 && item.Type != 'Series') {
+ page.querySelector('#specialsCollapsible').classList.remove('hide');
+ renderSpecials(page, item, user);
+ } else {
+ page.querySelector('#specialsCollapsible').classList.add('hide');
+ }
- // Grab the sibling element to control the expand state
- const expandButton = overviewElemnt.parentElement.querySelector('.overview-expand');
+ renderCast(page, item);
- // Detect if we have overflow of text. Based on this StackOverflow answer
- // https://stackoverflow.com/a/35157976
- if (Math.abs(overviewElemnt.scrollHeight - overviewElemnt.offsetHeight) > 2) {
- expandButton.classList.remove('hide');
- } else {
- expandButton.classList.add('hide');
- }
+ if (item.PartCount && item.PartCount > 1) {
+ page.querySelector('#additionalPartsCollapsible').classList.remove('hide');
+ renderAdditionalParts(page, item, user);
+ } else {
+ page.querySelector('#additionalPartsCollapsible').classList.add('hide');
+ }
- expandButton.addEventListener('click', toggleLineClamp.bind(null, overviewElemnt));
+ if (item.Type == 'MusicAlbum') {
+ renderMusicVideos(page, item, user);
+ } else {
+ page.querySelector('#musicVideosCollapsible').classList.add('hide');
+ }
+}
- for (const anchor of overviewElemnt.querySelectorAll('a')) {
- anchor.setAttribute('target', '_blank');
- }
+function toggleLineClamp(clampTarget, e) {
+ const expandButton = e.target;
+ const clampClassName = 'detail-clamp-text';
+
+ if (clampTarget.classList.contains(clampClassName)) {
+ clampTarget.classList.remove(clampClassName);
+ expandButton.innerHTML = globalize.translate('ShowLess');
+ } else {
+ clampTarget.classList.add(clampClassName);
+ expandButton.innerHTML = globalize.translate('ShowMore');
+ }
+}
+
+function renderOverview(page, item) {
+ for (const overviewElemnt of page.querySelectorAll('.overview')) {
+ const overview = item.Overview || '';
+
+ if (overview) {
+ overviewElemnt.innerHTML = overview;
+ overviewElemnt.classList.remove('hide');
+ overviewElemnt.classList.add('detail-clamp-text');
+
+ // Grab the sibling element to control the expand state
+ const expandButton = overviewElemnt.parentElement.querySelector('.overview-expand');
+
+ // Detect if we have overflow of text. Based on this StackOverflow answer
+ // https://stackoverflow.com/a/35157976
+ if (Math.abs(overviewElemnt.scrollHeight - overviewElemnt.offsetHeight) > 2) {
+ expandButton.classList.remove('hide');
} else {
- overviewElemnt.innerHTML = '';
- overviewElemnt.classList.add('hide');
+ expandButton.classList.add('hide');
}
- }
- }
- function renderGenres(page, item, context = inferContext(item)) {
- const genres = item.GenreItems || [];
- const type = context === 'music' ? 'MusicGenre' : 'Genre';
+ expandButton.addEventListener('click', toggleLineClamp.bind(null, overviewElemnt));
- const html = genres.map(function (p) {
- return '
' + p.Name + '';
- }).join(', ');
-
- const genresLabel = page.querySelector('.genresLabel');
- genresLabel.innerHTML = globalize.translate(genres.length > 1 ? 'Genres' : 'Genre');
- const genresValue = page.querySelector('.genres');
- genresValue.innerHTML = html;
-
- const genresGroup = page.querySelector('.genresGroup');
- if (genres.length) {
- genresGroup.classList.remove('hide');
+ for (const anchor of overviewElemnt.querySelectorAll('a')) {
+ anchor.setAttribute('target', '_blank');
+ }
} else {
- genresGroup.classList.add('hide');
+ overviewElemnt.innerHTML = '';
+ overviewElemnt.classList.add('hide');
}
}
+}
- function renderWriter(page, item, context) {
- const writers = (item.People || []).filter(function (person) {
- return person.Type === 'Writer';
+function renderGenres(page, item, context = inferContext(item)) {
+ const genres = item.GenreItems || [];
+ const type = context === 'music' ? 'MusicGenre' : 'Genre';
+
+ const html = genres.map(function (p) {
+ return '
' + p.Name + '';
+ }).join(', ');
+
+ const genresLabel = page.querySelector('.genresLabel');
+ genresLabel.innerHTML = globalize.translate(genres.length > 1 ? 'Genres' : 'Genre');
+ const genresValue = page.querySelector('.genres');
+ genresValue.innerHTML = html;
+
+ const genresGroup = page.querySelector('.genresGroup');
+ if (genres.length) {
+ genresGroup.classList.remove('hide');
+ } else {
+ genresGroup.classList.add('hide');
+ }
+}
+
+function renderWriter(page, item, context) {
+ const writers = (item.People || []).filter(function (person) {
+ return person.Type === 'Writer';
+ });
+
+ const html = writers.map(function (person) {
+ return '
' + person.Name + '';
+ }).join(', ');
+
+ const writersLabel = page.querySelector('.writersLabel');
+ writersLabel.innerHTML = globalize.translate(writers.length > 1 ? 'Writers' : 'Writer');
+ const writersValue = page.querySelector('.writers');
+ writersValue.innerHTML = html;
+
+ const writersGroup = page.querySelector('.writersGroup');
+ if (writers.length) {
+ writersGroup.classList.remove('hide');
+ } else {
+ writersGroup.classList.add('hide');
+ }
+}
+
+function renderDirector(page, item, context) {
+ const directors = (item.People || []).filter(function (person) {
+ return person.Type === 'Director';
+ });
+
+ const html = directors.map(function (person) {
+ return '
' + person.Name + '';
+ }).join(', ');
+
+ const directorsLabel = page.querySelector('.directorsLabel');
+ directorsLabel.innerHTML = globalize.translate(directors.length > 1 ? 'Directors' : 'Director');
+ const directorsValue = page.querySelector('.directors');
+ directorsValue.innerHTML = html;
+
+ const directorsGroup = page.querySelector('.directorsGroup');
+ if (directors.length) {
+ directorsGroup.classList.remove('hide');
+ } else {
+ directorsGroup.classList.add('hide');
+ }
+}
+
+function renderMiscInfo(page, item) {
+ const primaryItemMiscInfo = page.querySelectorAll('.itemMiscInfo-primary');
+
+ for (const miscInfo of primaryItemMiscInfo) {
+ mediaInfo.fillPrimaryMediaInfo(miscInfo, item, {
+ interactive: true,
+ episodeTitle: false,
+ subtitles: false
});
- const html = writers.map(function (person) {
- return '
' + person.Name + '';
- }).join(', ');
-
- const writersLabel = page.querySelector('.writersLabel');
- writersLabel.innerHTML = globalize.translate(writers.length > 1 ? 'Writers' : 'Writer');
- const writersValue = page.querySelector('.writers');
- writersValue.innerHTML = html;
-
- const writersGroup = page.querySelector('.writersGroup');
- if (writers.length) {
- writersGroup.classList.remove('hide');
+ if (miscInfo.innerHTML && item.Type !== 'SeriesTimer') {
+ miscInfo.classList.remove('hide');
} else {
- writersGroup.classList.add('hide');
+ miscInfo.classList.add('hide');
}
}
- function renderDirector(page, item, context) {
- const directors = (item.People || []).filter(function (person) {
- return person.Type === 'Director';
+ const secondaryItemMiscInfo = page.querySelectorAll('.itemMiscInfo-secondary');
+
+ for (const miscInfo of secondaryItemMiscInfo) {
+ mediaInfo.fillSecondaryMediaInfo(miscInfo, item, {
+ interactive: true
});
- const html = directors.map(function (person) {
- return '
' + person.Name + '';
- }).join(', ');
-
- const directorsLabel = page.querySelector('.directorsLabel');
- directorsLabel.innerHTML = globalize.translate(directors.length > 1 ? 'Directors' : 'Director');
- const directorsValue = page.querySelector('.directors');
- directorsValue.innerHTML = html;
-
- const directorsGroup = page.querySelector('.directorsGroup');
- if (directors.length) {
- directorsGroup.classList.remove('hide');
+ if (miscInfo.innerHTML && item.Type !== 'SeriesTimer') {
+ miscInfo.classList.remove('hide');
} else {
- directorsGroup.classList.add('hide');
+ miscInfo.classList.add('hide');
}
}
+}
- function renderMiscInfo(page, item) {
- const primaryItemMiscInfo = page.querySelectorAll('.itemMiscInfo-primary');
+function renderTagline(page, item) {
+ const taglineElement = page.querySelector('.tagline');
- for (const miscInfo of primaryItemMiscInfo) {
- mediaInfo.fillPrimaryMediaInfo(miscInfo, item, {
- interactive: true,
- episodeTitle: false,
- subtitles: false
- });
-
- if (miscInfo.innerHTML && item.Type !== 'SeriesTimer') {
- miscInfo.classList.remove('hide');
- } else {
- miscInfo.classList.add('hide');
- }
- }
-
- const secondaryItemMiscInfo = page.querySelectorAll('.itemMiscInfo-secondary');
-
- for (const miscInfo of secondaryItemMiscInfo) {
- mediaInfo.fillSecondaryMediaInfo(miscInfo, item, {
- interactive: true
- });
-
- if (miscInfo.innerHTML && item.Type !== 'SeriesTimer') {
- miscInfo.classList.remove('hide');
- } else {
- miscInfo.classList.add('hide');
- }
- }
+ if (item.Taglines && item.Taglines.length) {
+ taglineElement.classList.remove('hide');
+ taglineElement.innerHTML = item.Taglines[0];
+ } else {
+ taglineElement.classList.add('hide');
}
+}
- function renderTagline(page, item) {
- const taglineElement = page.querySelector('.tagline');
+function renderDetails(page, item, apiClient, context, isStatic) {
+ renderSimilarItems(page, item, context);
+ renderMoreFromSeason(page, item, apiClient);
+ renderMoreFromArtist(page, item, apiClient);
+ renderDirector(page, item, context);
+ renderWriter(page, item, context);
+ renderGenres(page, item, context);
+ renderChannelGuide(page, apiClient, item);
+ renderTagline(page, item);
+ renderOverview(page, item);
+ renderMiscInfo(page, item);
+ reloadUserDataButtons(page, item);
- if (item.Taglines && item.Taglines.length) {
- taglineElement.classList.remove('hide');
- taglineElement.innerHTML = item.Taglines[0];
- } else {
- taglineElement.classList.add('hide');
- }
- }
-
- function renderDetails(page, item, apiClient, context, isStatic) {
- renderSimilarItems(page, item, context);
- renderMoreFromSeason(page, item, apiClient);
- renderMoreFromArtist(page, item, apiClient);
- renderDirector(page, item, context);
- renderWriter(page, item, context);
- renderGenres(page, item, context);
- renderChannelGuide(page, apiClient, item);
- renderTagline(page, item);
- renderOverview(page, item);
- renderMiscInfo(page, item);
- reloadUserDataButtons(page, item);
+ // Don't allow redirection to other websites from the TV layout
+ if (!layoutManager.tv) {
renderLinks(page, item);
- renderTags(page, item);
- renderSeriesAirTime(page, item, isStatic);
}
- function enableScrollX() {
- return browser.mobile && screen.availWidth <= 1000;
+ renderTags(page, item);
+ renderSeriesAirTime(page, item, isStatic);
+}
+
+function enableScrollX() {
+ return browser.mobile && window.screen.availWidth <= 1000;
+}
+
+function getPortraitShape(scrollX) {
+ if (scrollX == null) {
+ scrollX = enableScrollX();
}
- function getPortraitShape(scrollX) {
- if (scrollX == null) {
- scrollX = enableScrollX();
+ return scrollX ? 'overflowPortrait' : 'portrait';
+}
+
+function getSquareShape(scrollX) {
+ if (scrollX == null) {
+ scrollX = enableScrollX();
+ }
+
+ return scrollX ? 'overflowSquare' : 'square';
+}
+
+function renderMoreFromSeason(view, item, apiClient) {
+ const section = view.querySelector('.moreFromSeasonSection');
+
+ if (section) {
+ if (item.Type !== 'Episode' || !item.SeasonId || !item.SeriesId) {
+ return void section.classList.add('hide');
}
- return scrollX ? 'overflowPortrait' : 'portrait';
- }
-
- function getSquareShape(scrollX) {
- if (scrollX == null) {
- scrollX = enableScrollX();
- }
-
- return scrollX ? 'overflowSquare' : 'square';
- }
-
- function renderMoreFromSeason(view, item, apiClient) {
- const section = view.querySelector('.moreFromSeasonSection');
-
- if (section) {
- if (item.Type !== 'Episode' || !item.SeasonId || !item.SeriesId) {
+ const userId = apiClient.getCurrentUserId();
+ apiClient.getEpisodes(item.SeriesId, {
+ SeasonId: item.SeasonId,
+ UserId: userId,
+ Fields: 'ItemCounts,PrimaryImageAspectRatio,BasicSyncInfo,CanDelete,MediaSourceCount'
+ }).then(function (result) {
+ if (result.Items.length < 2) {
return void section.classList.add('hide');
}
- const userId = apiClient.getCurrentUserId();
- apiClient.getEpisodes(item.SeriesId, {
- SeasonId: item.SeasonId,
- UserId: userId,
- Fields: 'ItemCounts,PrimaryImageAspectRatio,BasicSyncInfo,CanDelete,MediaSourceCount'
- }).then(function (result) {
- if (result.Items.length < 2) {
- return void section.classList.add('hide');
- }
-
- section.classList.remove('hide');
- section.querySelector('h2').innerHTML = globalize.translate('MoreFromValue', item.SeasonName);
- const itemsContainer = section.querySelector('.itemsContainer');
- cardBuilder.buildCards(result.Items, {
- parentContainer: section,
- itemsContainer: itemsContainer,
- shape: 'autooverflow',
- sectionTitleTagName: 'h2',
- scalable: true,
- showTitle: true,
- overlayText: false,
- centerText: true,
- includeParentInfoInTitle: false,
- allowBottomPadding: false
- });
- const card = itemsContainer.querySelector('.card[data-id="' + item.Id + '"]');
-
- if (card) {
- setTimeout(function () {
- section.querySelector('.emby-scroller').toStart(card.previousSibling || card, true);
- }, 100);
- }
+ section.classList.remove('hide');
+ section.querySelector('h2').innerHTML = globalize.translate('MoreFromValue', item.SeasonName);
+ const itemsContainer = section.querySelector('.itemsContainer');
+ cardBuilder.buildCards(result.Items, {
+ parentContainer: section,
+ itemsContainer: itemsContainer,
+ shape: 'autooverflow',
+ sectionTitleTagName: 'h2',
+ scalable: true,
+ showTitle: true,
+ overlayText: false,
+ centerText: true,
+ includeParentInfoInTitle: false,
+ allowBottomPadding: false
});
- }
+ const card = itemsContainer.querySelector('.card[data-id="' + item.Id + '"]');
+
+ if (card) {
+ setTimeout(function () {
+ section.querySelector('.emby-scroller').toStart(card.previousSibling || card, true);
+ }, 100);
+ }
+ });
}
+}
- function renderMoreFromArtist(view, item, apiClient) {
- const section = view.querySelector('.moreFromArtistSection');
+function renderMoreFromArtist(view, item, apiClient) {
+ const section = view.querySelector('.moreFromArtistSection');
- if (section) {
- if (item.Type === 'MusicArtist') {
- if (!apiClient.isMinServerVersion('3.4.1.19')) {
- return void section.classList.add('hide');
- }
- } else if (item.Type !== 'MusicAlbum' || !item.AlbumArtists || !item.AlbumArtists.length) {
+ if (section) {
+ if (item.Type === 'MusicArtist') {
+ if (!apiClient.isMinServerVersion('3.4.1.19')) {
+ return void section.classList.add('hide');
+ }
+ } else if (item.Type !== 'MusicAlbum' || !item.AlbumArtists || !item.AlbumArtists.length) {
+ return void section.classList.add('hide');
+ }
+
+ const query = {
+ IncludeItemTypes: 'MusicAlbum',
+ Recursive: true,
+ ExcludeItemIds: item.Id,
+ SortBy: 'ProductionYear,SortName',
+ SortOrder: 'Descending'
+ };
+
+ if (item.Type === 'MusicArtist') {
+ query.ContributingArtistIds = item.Id;
+ } else if (apiClient.isMinServerVersion('3.4.1.18')) {
+ query.AlbumArtistIds = item.AlbumArtists[0].Id;
+ } else {
+ query.ArtistIds = item.AlbumArtists[0].Id;
+ }
+
+ apiClient.getItems(apiClient.getCurrentUserId(), query).then(function (result) {
+ if (!result.Items.length) {
return void section.classList.add('hide');
}
- const query = {
- IncludeItemTypes: 'MusicAlbum',
- Recursive: true,
- ExcludeItemIds: item.Id,
- SortBy: 'ProductionYear,SortName',
- SortOrder: 'Descending'
- };
+ section.classList.remove('hide');
if (item.Type === 'MusicArtist') {
- query.ContributingArtistIds = item.Id;
- } else if (apiClient.isMinServerVersion('3.4.1.18')) {
- query.AlbumArtistIds = item.AlbumArtists[0].Id;
+ section.querySelector('h2').innerHTML = globalize.translate('HeaderAppearsOn');
} else {
- query.ArtistIds = item.AlbumArtists[0].Id;
+ section.querySelector('h2').innerHTML = globalize.translate('MoreFromValue', item.AlbumArtists[0].Name);
}
- apiClient.getItems(apiClient.getCurrentUserId(), query).then(function (result) {
- if (!result.Items.length) {
- return void section.classList.add('hide');
- }
-
- section.classList.remove('hide');
-
- if (item.Type === 'MusicArtist') {
- section.querySelector('h2').innerHTML = globalize.translate('HeaderAppearsOn');
- } else {
- section.querySelector('h2').innerHTML = globalize.translate('MoreFromValue', item.AlbumArtists[0].Name);
- }
-
- cardBuilder.buildCards(result.Items, {
- parentContainer: section,
- itemsContainer: section.querySelector('.itemsContainer'),
- shape: 'autooverflow',
- sectionTitleTagName: 'h2',
- scalable: true,
- coverImage: item.Type === 'MusicArtist' || item.Type === 'MusicAlbum',
- showTitle: true,
- showParentTitle: false,
- centerText: true,
- overlayText: false,
- overlayPlayButton: true,
- showYear: true
- });
+ cardBuilder.buildCards(result.Items, {
+ parentContainer: section,
+ itemsContainer: section.querySelector('.itemsContainer'),
+ shape: 'autooverflow',
+ sectionTitleTagName: 'h2',
+ scalable: true,
+ coverImage: item.Type === 'MusicArtist' || item.Type === 'MusicAlbum',
+ showTitle: true,
+ showParentTitle: false,
+ centerText: true,
+ overlayText: false,
+ overlayPlayButton: true,
+ showYear: true
});
- }
+ });
}
+}
- function renderSimilarItems(page, item, context) {
- const similarCollapsible = page.querySelector('#similarCollapsible');
+function renderSimilarItems(page, item, context) {
+ const similarCollapsible = page.querySelector('#similarCollapsible');
- if (similarCollapsible) {
- if (item.Type != 'Movie' && item.Type != 'Trailer' && item.Type != 'Series' && item.Type != 'Program' && item.Type != 'Recording' && item.Type != 'MusicAlbum' && item.Type != 'MusicArtist' && item.Type != 'Playlist') {
+ if (similarCollapsible) {
+ if (item.Type != 'Movie' && item.Type != 'Trailer' && item.Type != 'Series' && item.Type != 'Program' && item.Type != 'Recording' && item.Type != 'MusicAlbum' && item.Type != 'MusicArtist' && item.Type != 'Playlist') {
+ return void similarCollapsible.classList.add('hide');
+ }
+
+ similarCollapsible.classList.remove('hide');
+ const apiClient = window.connectionManager.getApiClient(item.ServerId);
+ const options = {
+ userId: apiClient.getCurrentUserId(),
+ limit: 12,
+ fields: 'PrimaryImageAspectRatio,UserData,CanDelete'
+ };
+
+ if (item.Type == 'MusicAlbum' && item.AlbumArtists && item.AlbumArtists.length) {
+ options.ExcludeArtistIds = item.AlbumArtists[0].Id;
+ }
+
+ apiClient.getSimilarItems(item.Id, options).then(function (result) {
+ if (!result.Items.length) {
return void similarCollapsible.classList.add('hide');
}
similarCollapsible.classList.remove('hide');
- const apiClient = connectionManager.getApiClient(item.ServerId);
- const options = {
- userId: apiClient.getCurrentUserId(),
- limit: 12,
- fields: 'PrimaryImageAspectRatio,UserData,CanDelete'
- };
-
- if (item.Type == 'MusicAlbum' && item.AlbumArtists && item.AlbumArtists.length) {
- options.ExcludeArtistIds = item.AlbumArtists[0].Id;
- }
-
- apiClient.getSimilarItems(item.Id, options).then(function (result) {
- if (!result.Items.length) {
- return void similarCollapsible.classList.add('hide');
- }
-
- similarCollapsible.classList.remove('hide');
- let html = '';
- html += cardBuilder.getCardsHtml({
- items: result.Items,
- shape: 'autooverflow',
- showParentTitle: item.Type == 'MusicAlbum',
- centerText: true,
- showTitle: true,
- context: context,
- lazy: true,
- showDetailsMenu: true,
- coverImage: item.Type == 'MusicAlbum' || item.Type == 'MusicArtist',
- overlayPlayButton: true,
- overlayText: false,
- showYear: item.Type === 'Movie' || item.Type === 'Trailer' || item.Type === 'Series'
- });
- const similarContent = similarCollapsible.querySelector('.similarContent');
- similarContent.innerHTML = html;
- imageLoader.lazyChildren(similarContent);
- });
- }
- }
-
- function renderSeriesAirTime(page, item, isStatic) {
- const seriesAirTime = page.querySelector('#seriesAirTime');
- if (item.Type != 'Series') {
- seriesAirTime.classList.add('hide');
- return;
- }
- let html = '';
- if (item.AirDays && item.AirDays.length) {
- if (item.AirDays.length == 7) {
- html += 'daily';
- } else {
- html += item.AirDays.map(function (a) {
- return a + 's';
- }).join(',');
- }
- }
- if (item.AirTime) {
- html += ' at ' + item.AirTime;
- }
- if (item.Studios.length) {
- if (isStatic) {
- html += ' on ' + item.Studios[0].Name;
- } else {
- const context = inferContext(item);
- const href = appRouter.getRouteUrl(item.Studios[0], {
- context: context,
- itemType: 'Studio',
- serverId: item.ServerId
- });
- html += ' on
' + item.Studios[0].Name + '';
- }
- }
- if (html) {
- html = (item.Status == 'Ended' ? 'Aired ' : 'Airs ') + html;
- seriesAirTime.innerHTML = html;
- seriesAirTime.classList.remove('hide');
- } else {
- seriesAirTime.classList.add('hide');
- }
- }
-
- function renderTags(page, item) {
- const itemTags = page.querySelector('.itemTags');
- const tagElements = [];
- let tags = item.Tags || [];
-
- if (item.Type === 'Program') {
- tags = [];
- }
-
- for (let i = 0, length = tags.length; i < length; i++) {
- tagElements.push(tags[i]);
- }
-
- if (tagElements.length) {
- itemTags.innerHTML = globalize.translate('TagsValue', tagElements.join(', '));
- itemTags.classList.remove('hide');
- } else {
- itemTags.innerHTML = '';
- itemTags.classList.add('hide');
- }
- }
-
- function renderChildren(page, item) {
- let fields = 'ItemCounts,PrimaryImageAspectRatio,BasicSyncInfo,CanDelete,MediaSourceCount';
- const query = {
- ParentId: item.Id,
- Fields: fields
- };
-
- if (item.Type !== 'BoxSet') {
- query.SortBy = 'SortName';
- }
-
- let promise;
- const apiClient = connectionManager.getApiClient(item.ServerId);
- const userId = apiClient.getCurrentUserId();
-
- if (item.Type == 'Series') {
- promise = apiClient.getSeasons(item.Id, {
- userId: userId,
- Fields: fields
- });
- } else if (item.Type == 'Season') {
- fields += ',Overview';
- promise = apiClient.getEpisodes(item.SeriesId, {
- seasonId: item.Id,
- userId: userId,
- Fields: fields
- });
- } else if (item.Type == 'MusicArtist') {
- query.SortBy = 'ProductionYear,SortName';
- }
-
- promise = promise || apiClient.getItems(apiClient.getCurrentUserId(), query);
- promise.then(function (result) {
let html = '';
- let scrollX = false;
- let isList = false;
- const childrenItemsContainer = page.querySelector('.childrenItemsContainer');
+ html += cardBuilder.getCardsHtml({
+ items: result.Items,
+ shape: 'autooverflow',
+ showParentTitle: item.Type == 'MusicAlbum',
+ centerText: true,
+ showTitle: true,
+ context: context,
+ lazy: true,
+ showDetailsMenu: true,
+ coverImage: item.Type == 'MusicAlbum' || item.Type == 'MusicArtist',
+ overlayPlayButton: true,
+ overlayText: false,
+ showYear: item.Type === 'Movie' || item.Type === 'Trailer' || item.Type === 'Series'
+ });
+ const similarContent = similarCollapsible.querySelector('.similarContent');
+ similarContent.innerHTML = html;
+ imageLoader.lazyChildren(similarContent);
+ });
+ }
+}
- if (item.Type == 'MusicAlbum') {
- html = listView.getListViewHtml({
- items: result.Items,
- smallIcon: true,
- showIndex: true,
- index: 'disc',
- showIndexNumberLeft: true,
- playFromHere: true,
- action: 'playallfromhere',
- image: false,
- artist: 'auto',
- containerAlbumArtists: item.AlbumArtists
- });
+function renderSeriesAirTime(page, item, isStatic) {
+ const seriesAirTime = page.querySelector('#seriesAirTime');
+ if (item.Type != 'Series') {
+ seriesAirTime.classList.add('hide');
+ return;
+ }
+ let html = '';
+ if (item.AirDays && item.AirDays.length) {
+ if (item.AirDays.length == 7) {
+ html += 'daily';
+ } else {
+ html += item.AirDays.map(function (a) {
+ return a + 's';
+ }).join(',');
+ }
+ }
+ if (item.AirTime) {
+ html += ' at ' + item.AirTime;
+ }
+ if (item.Studios.length) {
+ if (isStatic) {
+ html += ' on ' + item.Studios[0].Name;
+ } else {
+ const context = inferContext(item);
+ const href = appRouter.getRouteUrl(item.Studios[0], {
+ context: context,
+ itemType: 'Studio',
+ serverId: item.ServerId
+ });
+ html += ' on
' + item.Studios[0].Name + '';
+ }
+ }
+ if (html) {
+ html = (item.Status == 'Ended' ? 'Aired ' : 'Airs ') + html;
+ seriesAirTime.innerHTML = html;
+ seriesAirTime.classList.remove('hide');
+ } else {
+ seriesAirTime.classList.add('hide');
+ }
+}
+
+function renderTags(page, item) {
+ const itemTags = page.querySelector('.itemTags');
+ const tagElements = [];
+ let tags = item.Tags || [];
+
+ if (item.Type === 'Program') {
+ tags = [];
+ }
+
+ for (let i = 0, length = tags.length; i < length; i++) {
+ tagElements.push(tags[i]);
+ }
+
+ if (tagElements.length) {
+ itemTags.innerHTML = globalize.translate('TagsValue', tagElements.join(', '));
+ itemTags.classList.remove('hide');
+ } else {
+ itemTags.innerHTML = '';
+ itemTags.classList.add('hide');
+ }
+}
+
+function renderChildren(page, item) {
+ let fields = 'ItemCounts,PrimaryImageAspectRatio,BasicSyncInfo,CanDelete,MediaSourceCount';
+ const query = {
+ ParentId: item.Id,
+ Fields: fields
+ };
+
+ if (item.Type !== 'BoxSet') {
+ query.SortBy = 'SortName';
+ }
+
+ let promise;
+ const apiClient = window.connectionManager.getApiClient(item.ServerId);
+ const userId = apiClient.getCurrentUserId();
+
+ if (item.Type == 'Series') {
+ promise = apiClient.getSeasons(item.Id, {
+ userId: userId,
+ Fields: fields
+ });
+ } else if (item.Type == 'Season') {
+ fields += ',Overview';
+ promise = apiClient.getEpisodes(item.SeriesId, {
+ seasonId: item.Id,
+ userId: userId,
+ Fields: fields
+ });
+ } else if (item.Type == 'MusicArtist') {
+ query.SortBy = 'ProductionYear,SortName';
+ }
+
+ promise = promise || apiClient.getItems(apiClient.getCurrentUserId(), query);
+ promise.then(function (result) {
+ let html = '';
+ let scrollX = false;
+ let isList = false;
+ const childrenItemsContainer = page.querySelector('.childrenItemsContainer');
+
+ if (item.Type == 'MusicAlbum') {
+ const equalSet = (arr1, arr2) => arr1.every(x => arr2.indexOf(x) !== -1) && arr1.length === arr2.length;
+ let showArtist = false;
+ for (const track of result.Items) {
+ if (!equalSet(track.ArtistItems.map(x => x.Id), track.AlbumArtists.map(x => x.Id))) {
+ showArtist = true;
+ break;
+ }
+ }
+ const discNumbers = result.Items.map(x => x.ParentIndexNumber);
+ html = listView.getListViewHtml({
+ items: result.Items,
+ smallIcon: true,
+ showIndex: new Set(discNumbers).size > 1 || (discNumbers.length >= 1 && discNumbers[0] > 1),
+ index: 'disc',
+ showIndexNumberLeft: true,
+ playFromHere: true,
+ action: 'playallfromhere',
+ image: false,
+ artist: showArtist,
+ containerAlbumArtists: item.AlbumArtists
+ });
+ isList = true;
+ } else if (item.Type == 'Series') {
+ scrollX = enableScrollX();
+ html = cardBuilder.getCardsHtml({
+ items: result.Items,
+ shape: 'overflowPortrait',
+ showTitle: true,
+ centerText: true,
+ lazy: true,
+ overlayPlayButton: true,
+ allowBottomPadding: !scrollX
+ });
+ } else if (item.Type == 'Season' || item.Type == 'Episode') {
+ if (item.Type !== 'Episode') {
isList = true;
- } else if (item.Type == 'Series') {
- scrollX = enableScrollX();
+ }
+ scrollX = item.Type == 'Episode';
+ if (result.Items.length < 2 && item.Type === 'Episode') {
+ return;
+ }
+
+ if (item.Type === 'Episode') {
html = cardBuilder.getCardsHtml({
items: result.Items,
- shape: 'overflowPortrait',
+ shape: 'overflowBackdrop',
showTitle: true,
- centerText: true,
+ displayAsSpecial: item.Type == 'Season' && item.IndexNumber,
+ playFromHere: true,
+ overlayText: true,
lazy: true,
+ showDetailsMenu: true,
overlayPlayButton: true,
- allowBottomPadding: !scrollX
+ allowBottomPadding: !scrollX,
+ includeParentInfoInTitle: false
+ });
+ } else if (item.Type === 'Season') {
+ html = listView.getListViewHtml({
+ items: result.Items,
+ showIndexNumber: false,
+ enableOverview: true,
+ enablePlayedButton: layoutManager.mobile ? false : true,
+ infoButton: layoutManager.mobile ? false : true,
+ imageSize: 'large',
+ enableSideMediaInfo: false,
+ highlight: false,
+ action: !layoutManager.desktop ? 'link' : 'none',
+ imagePlayButton: true,
+ includeParentInfoInTitle: false
});
- } else if (item.Type == 'Season' || item.Type == 'Episode') {
- if (item.Type !== 'Episode') {
- isList = true;
- }
- scrollX = item.Type == 'Episode';
- if (result.Items.length < 2 && item.Type === 'Episode') {
- return;
- }
-
- if (item.Type === 'Episode') {
- html = cardBuilder.getCardsHtml({
- items: result.Items,
- shape: 'overflowBackdrop',
- showTitle: true,
- displayAsSpecial: item.Type == 'Season' && item.IndexNumber,
- playFromHere: true,
- overlayText: true,
- lazy: true,
- showDetailsMenu: true,
- overlayPlayButton: true,
- allowBottomPadding: !scrollX,
- includeParentInfoInTitle: false
- });
- } else if (item.Type === 'Season') {
- html = listView.getListViewHtml({
- items: result.Items,
- showIndexNumber: false,
- enableOverview: true,
- enablePlayedButton: layoutManager.mobile ? false : true,
- infoButton: layoutManager.mobile ? false : true,
- imageSize: 'large',
- enableSideMediaInfo: false,
- highlight: false,
- action: !layoutManager.desktop ? 'link' : 'none',
- imagePlayButton: true,
- includeParentInfoInTitle: false
- });
- }
}
+ }
- if (item.Type !== 'BoxSet') {
- page.querySelector('#childrenCollapsible').classList.remove('hide');
- }
- if (scrollX) {
- childrenItemsContainer.classList.add('scrollX');
- childrenItemsContainer.classList.add('hiddenScrollX');
+ if (item.Type !== 'BoxSet') {
+ page.querySelector('#childrenCollapsible').classList.remove('hide');
+ }
+ if (scrollX) {
+ childrenItemsContainer.classList.add('scrollX');
+ childrenItemsContainer.classList.add('hiddenScrollX');
+ childrenItemsContainer.classList.remove('vertical-wrap');
+ childrenItemsContainer.classList.remove('vertical-list');
+ } else {
+ childrenItemsContainer.classList.remove('scrollX');
+ childrenItemsContainer.classList.remove('hiddenScrollX');
+ childrenItemsContainer.classList.remove('smoothScrollX');
+ if (isList) {
+ childrenItemsContainer.classList.add('vertical-list');
childrenItemsContainer.classList.remove('vertical-wrap');
- childrenItemsContainer.classList.remove('vertical-list');
} else {
- childrenItemsContainer.classList.remove('scrollX');
- childrenItemsContainer.classList.remove('hiddenScrollX');
- childrenItemsContainer.classList.remove('smoothScrollX');
- if (isList) {
- childrenItemsContainer.classList.add('vertical-list');
- childrenItemsContainer.classList.remove('vertical-wrap');
- } else {
- childrenItemsContainer.classList.add('vertical-wrap');
- childrenItemsContainer.classList.remove('vertical-list');
- }
+ childrenItemsContainer.classList.add('vertical-wrap');
+ childrenItemsContainer.classList.remove('vertical-list');
}
- if (layoutManager.mobile) {
- childrenItemsContainer.classList.remove('padded-right');
- }
- childrenItemsContainer.innerHTML = html;
- imageLoader.lazyChildren(childrenItemsContainer);
- if (item.Type == 'BoxSet') {
- const collectionItemTypes = [{
- name: globalize.translate('HeaderVideos'),
- mediaType: 'Video'
- }, {
- name: globalize.translate('HeaderSeries'),
- type: 'Series'
- }, {
- name: globalize.translate('HeaderAlbums'),
- type: 'MusicAlbum'
- }, {
- name: globalize.translate('HeaderBooks'),
- type: 'Book'
- }];
- renderCollectionItems(page, item, collectionItemTypes, result.Items);
- }
- });
-
- if (item.Type == 'Season') {
- page.querySelector('#childrenTitle').innerHTML = globalize.translate('HeaderEpisodes');
- } else if (item.Type == 'Series') {
- page.querySelector('#childrenTitle').innerHTML = globalize.translate('HeaderSeasons');
- } else if (item.Type == 'MusicAlbum') {
- page.querySelector('#childrenTitle').innerHTML = globalize.translate('HeaderTracks');
- } else {
- page.querySelector('#childrenTitle').innerHTML = globalize.translate('HeaderItems');
}
-
- if (item.Type == 'MusicAlbum' || item.Type == 'Season') {
- page.querySelector('.childrenSectionHeader').classList.add('hide');
- page.querySelector('#childrenCollapsible').classList.add('verticalSection-extrabottompadding');
- } else {
- page.querySelector('.childrenSectionHeader').classList.remove('hide');
+ if (layoutManager.mobile) {
+ childrenItemsContainer.classList.remove('padded-right');
}
+ childrenItemsContainer.innerHTML = html;
+ imageLoader.lazyChildren(childrenItemsContainer);
+ if (item.Type == 'BoxSet') {
+ const collectionItemTypes = [{
+ name: globalize.translate('HeaderVideos'),
+ mediaType: 'Video'
+ }, {
+ name: globalize.translate('Series'),
+ type: 'Series'
+ }, {
+ name: globalize.translate('Albums'),
+ type: 'MusicAlbum'
+ }, {
+ name: globalize.translate('Books'),
+ type: 'Book'
+ }];
+ renderCollectionItems(page, item, collectionItemTypes, result.Items);
+ }
+ });
+
+ if (item.Type == 'Season') {
+ page.querySelector('#childrenTitle').innerHTML = globalize.translate('Episodes');
+ } else if (item.Type == 'Series') {
+ page.querySelector('#childrenTitle').innerHTML = globalize.translate('HeaderSeasons');
+ } else if (item.Type == 'MusicAlbum') {
+ page.querySelector('#childrenTitle').innerHTML = globalize.translate('HeaderTracks');
+ } else {
+ page.querySelector('#childrenTitle').innerHTML = globalize.translate('Items');
}
- function renderItemsByName(page, item) {
- import('scripts/itembynamedetailpage').then(() => {
- window.ItemsByName.renderItems(page, item);
- });
+ if (item.Type == 'MusicAlbum' || item.Type == 'Season') {
+ page.querySelector('.childrenSectionHeader').classList.add('hide');
+ page.querySelector('#childrenCollapsible').classList.add('verticalSection-extrabottompadding');
+ } else {
+ page.querySelector('.childrenSectionHeader').classList.remove('hide');
}
+}
- function renderPlaylistItems(page, item) {
- import('scripts/playlistedit').then(() => {
- PlaylistViewer.render(page, item);
- });
- }
+function renderItemsByName(page, item) {
+ import('scripts/itembynamedetailpage').then(() => {
+ window.ItemsByName.renderItems(page, item);
+ });
+}
- function renderProgramsForChannel(page, result) {
- let html = '';
- let currentItems = [];
- let currentStartDate = null;
+function renderPlaylistItems(page, item) {
+ import('scripts/playlistedit').then(() => {
+ PlaylistViewer.render(page, item);
+ });
+}
- for (let i = 0, length = result.Items.length; i < length; i++) {
- const item = result.Items[i];
- const itemStartDate = datetime.parseISO8601Date(item.StartDate);
+function renderProgramsForChannel(page, result) {
+ let html = '';
+ let currentItems = [];
+ let currentStartDate = null;
- if (!(currentStartDate && currentStartDate.toDateString() === itemStartDate.toDateString())) {
- if (currentItems.length) {
- html += '
';
- html += '
' + datetime.toLocaleDateString(currentStartDate, {
- weekday: 'long',
- month: 'long',
- day: 'numeric'
- }) + '
';
- html += '
' + listView.getListViewHtml({
- items: currentItems,
- enableUserDataButtons: false,
- showParentTitle: true,
- image: false,
- showProgramTime: true,
- mediaInfo: false,
- parentTitleWithTitle: true
- }) + '
';
- }
+ for (let i = 0, length = result.Items.length; i < length; i++) {
+ const item = result.Items[i];
+ const itemStartDate = datetime.parseISO8601Date(item.StartDate);
- currentStartDate = itemStartDate;
- currentItems = [];
+ if (!(currentStartDate && currentStartDate.toDateString() === itemStartDate.toDateString())) {
+ if (currentItems.length) {
+ html += '
';
+ html += '
' + datetime.toLocaleDateString(currentStartDate, {
+ weekday: 'long',
+ month: 'long',
+ day: 'numeric'
+ }) + '
';
+ html += '
' + listView.getListViewHtml({
+ items: currentItems,
+ enableUserDataButtons: false,
+ showParentTitle: true,
+ image: false,
+ showProgramTime: true,
+ mediaInfo: false,
+ parentTitleWithTitle: true
+ }) + '
';
}
- currentItems.push(item);
+ currentStartDate = itemStartDate;
+ currentItems = [];
}
- if (currentItems.length) {
- html += '
';
- html += '
' + datetime.toLocaleDateString(currentStartDate, {
- weekday: 'long',
- month: 'long',
- day: 'numeric'
- }) + '
';
- html += '
' + listView.getListViewHtml({
- items: currentItems,
- enableUserDataButtons: false,
- showParentTitle: true,
- image: false,
- showProgramTime: true,
- mediaInfo: false,
- parentTitleWithTitle: true
- }) + '
';
- }
-
- page.querySelector('.programGuide').innerHTML = html;
+ currentItems.push(item);
}
- function renderChannelGuide(page, apiClient, item) {
- if (item.Type === 'TvChannel') {
- page.querySelector('.programGuideSection').classList.remove('hide');
- apiClient.getLiveTvPrograms({
- ChannelIds: item.Id,
- UserId: apiClient.getCurrentUserId(),
- HasAired: false,
- SortBy: 'StartDate',
- EnableTotalRecordCount: false,
- EnableImages: false,
- ImageTypeLimit: 0,
- EnableUserData: false
- }).then(function (result) {
- renderProgramsForChannel(page, result);
- });
- }
+ if (currentItems.length) {
+ html += '
';
+ html += '
' + datetime.toLocaleDateString(currentStartDate, {
+ weekday: 'long',
+ month: 'long',
+ day: 'numeric'
+ }) + '
';
+ html += '
' + listView.getListViewHtml({
+ items: currentItems,
+ enableUserDataButtons: false,
+ showParentTitle: true,
+ image: false,
+ showProgramTime: true,
+ mediaInfo: false,
+ parentTitleWithTitle: true
+ }) + '
';
}
- function renderSeriesSchedule(page, item) {
- const apiClient = connectionManager.getApiClient(item.ServerId);
+ page.querySelector('.programGuide').innerHTML = html;
+}
+
+function renderChannelGuide(page, apiClient, item) {
+ if (item.Type === 'TvChannel') {
+ page.querySelector('.programGuideSection').classList.remove('hide');
apiClient.getLiveTvPrograms({
+ ChannelIds: item.Id,
UserId: apiClient.getCurrentUserId(),
HasAired: false,
SortBy: 'StartDate',
EnableTotalRecordCount: false,
EnableImages: false,
ImageTypeLimit: 0,
- Limit: 50,
- EnableUserData: false,
- LibrarySeriesId: item.Id
+ EnableUserData: false
}).then(function (result) {
- if (result.Items.length) {
- page.querySelector('#seriesScheduleSection').classList.remove('hide');
- } else {
- page.querySelector('#seriesScheduleSection').classList.add('hide');
- }
-
- page.querySelector('#seriesScheduleList').innerHTML = listView.getListViewHtml({
- items: result.Items,
- enableUserDataButtons: false,
- showParentTitle: false,
- image: false,
- showProgramDateTime: true,
- mediaInfo: false,
- showTitle: true,
- moreButton: false,
- action: 'programdialog'
- });
- loading.hide();
+ renderProgramsForChannel(page, result);
});
}
+}
- function inferContext(item) {
- if (item.Type === 'Movie' || item.Type === 'BoxSet') {
- return 'movies';
- }
-
- if (item.Type === 'Series' || item.Type === 'Season' || item.Type === 'Episode') {
- return 'tvshows';
- }
-
- if (item.Type === 'MusicArtist' || item.Type === 'MusicAlbum' || item.Type === 'Audio' || item.Type === 'AudioBook') {
- return 'music';
- }
-
- if (item.Type === 'Program') {
- return 'livetv';
- }
-
- return null;
- }
-
- function filterItemsByCollectionItemType(items, typeInfo) {
- return items.filter(function (item) {
- if (typeInfo.mediaType) {
- return item.MediaType == typeInfo.mediaType;
- }
-
- return item.Type == typeInfo.type;
- });
- }
-
- function canPlaySomeItemInCollection(items) {
- let i = 0;
-
- for (let length = items.length; i < length; i++) {
- if (playbackManager.canPlay(items[i])) {
- return true;
- }
- }
-
- return false;
- }
-
- function renderCollectionItems(page, parentItem, types, items) {
- page.querySelector('.collectionItems').classList.remove('hide');
- page.querySelector('.collectionItems').innerHTML = '';
-
- for (const type of types) {
- const typeItems = filterItemsByCollectionItemType(items, type);
-
- if (typeItems.length) {
- renderCollectionItemType(page, parentItem, type, typeItems);
- }
- }
-
- const otherType = {
- name: globalize.translate('HeaderOtherItems')
- };
- const otherTypeItems = items.filter(function (curr) {
- return !types.filter(function (t) {
- return filterItemsByCollectionItemType([curr], t).length > 0;
- }).length;
- });
-
- if (otherTypeItems.length) {
- renderCollectionItemType(page, parentItem, otherType, otherTypeItems);
- }
-
- if (!items.length) {
- renderCollectionItemType(page, parentItem, {
- name: globalize.translate('HeaderItems')
- }, items);
- }
-
- const containers = page.querySelectorAll('.collectionItemsContainer');
-
- const notifyRefreshNeeded = function () {
- renderChildren(page, parentItem);
- };
-
- for (const container of containers) {
- container.notifyRefreshNeeded = notifyRefreshNeeded;
- }
-
- // if nothing in the collection can be played hide play and shuffle buttons
- if (!canPlaySomeItemInCollection(items)) {
- hideAll(page, 'btnPlay', false);
- hideAll(page, 'btnShuffle', false);
- }
-
- // HACK: Call autoFocuser again because btnPlay may be hidden, but focused by reloadFromItem
- // FIXME: Sometimes focus does not move until all (?) sections are loaded
- import('autoFocuser').then(({default: autoFocuser}) => {
- autoFocuser.autoFocus(page);
- });
- }
-
- function renderCollectionItemType(page, parentItem, type, items) {
- let html = '';
- html += '
';
- html += '
';
- html += '
';
- html += '' + type.name + '';
- html += '
';
- html += '';
- html += '
';
- const shape = type.type == 'MusicAlbum' ? getSquareShape(false) : getPortraitShape(false);
- html += cardBuilder.getCardsHtml({
- items: items,
- shape: shape,
- showTitle: true,
- showYear: type.mediaType === 'Video' || type.type === 'Series',
- centerText: true,
- lazy: true,
- showDetailsMenu: true,
- overlayMoreButton: true,
- showAddToCollection: false,
- showRemoveFromCollection: true,
- collectionId: parentItem.Id
- });
- html += '
';
- html += '
';
- const collectionItems = page.querySelector('.collectionItems');
- collectionItems.insertAdjacentHTML('beforeend', html);
- imageLoader.lazyChildren(collectionItems);
- }
-
- function renderMusicVideos(page, item, user) {
- connectionManager.getApiClient(item.ServerId).getItems(user.Id, {
- SortBy: 'SortName',
- SortOrder: 'Ascending',
- IncludeItemTypes: 'MusicVideo',
- Recursive: true,
- Fields: 'PrimaryImageAspectRatio,BasicSyncInfo,CanDelete,MediaSourceCount',
- AlbumIds: item.Id
- }).then(function (result) {
- if (result.Items.length) {
- page.querySelector('#musicVideosCollapsible').classList.remove('hide');
- const musicVideosContent = page.querySelector('.musicVideosContent');
- musicVideosContent.innerHTML = getVideosHtml(result.Items);
- imageLoader.lazyChildren(musicVideosContent);
- } else {
- page.querySelector('#musicVideosCollapsible').classList.add('hide');
- }
- });
- }
-
- function renderAdditionalParts(page, item, user) {
- connectionManager.getApiClient(item.ServerId).getAdditionalVideoParts(user.Id, item.Id).then(function (result) {
- if (result.Items.length) {
- page.querySelector('#additionalPartsCollapsible').classList.remove('hide');
- const additionalPartsContent = page.querySelector('#additionalPartsContent');
- additionalPartsContent.innerHTML = getVideosHtml(result.Items);
- imageLoader.lazyChildren(additionalPartsContent);
- } else {
- page.querySelector('#additionalPartsCollapsible').classList.add('hide');
- }
- });
- }
-
- function renderScenes(page, item) {
- let chapters = item.Chapters || [];
-
- if (chapters.length && !chapters[0].ImageTag && (chapters = []), chapters.length) {
- page.querySelector('#scenesCollapsible').classList.remove('hide');
- const scenesContent = page.querySelector('#scenesContent');
-
- import('chaptercardbuilder').then(({default: chaptercardbuilder}) => {
- chaptercardbuilder.buildChapterCards(item, chapters, {
- itemsContainer: scenesContent,
- backdropShape: 'overflowBackdrop',
- squareShape: 'overflowSquare',
- imageBlurhashes: item.ImageBlurHashes
- });
- });
+function renderSeriesSchedule(page, item) {
+ const apiClient = window.connectionManager.getApiClient(item.ServerId);
+ apiClient.getLiveTvPrograms({
+ UserId: apiClient.getCurrentUserId(),
+ HasAired: false,
+ SortBy: 'StartDate',
+ EnableTotalRecordCount: false,
+ EnableImages: false,
+ ImageTypeLimit: 0,
+ Limit: 50,
+ EnableUserData: false,
+ LibrarySeriesId: item.Id
+ }).then(function (result) {
+ if (result.Items.length) {
+ page.querySelector('#seriesScheduleSection').classList.remove('hide');
} else {
- page.querySelector('#scenesCollapsible').classList.add('hide');
+ page.querySelector('#seriesScheduleSection').classList.add('hide');
}
- }
- function getVideosHtml(items) {
- return cardBuilder.getCardsHtml({
- items: items,
- shape: 'autooverflow',
+ page.querySelector('#seriesScheduleList').innerHTML = listView.getListViewHtml({
+ items: result.Items,
+ enableUserDataButtons: false,
+ showParentTitle: false,
+ image: false,
+ showProgramDateTime: true,
+ mediaInfo: false,
showTitle: true,
- action: 'play',
- overlayText: false,
- centerText: true,
- showRuntime: true
+ moreButton: false,
+ action: 'programdialog'
});
+ loading.hide();
+ });
+}
+
+function inferContext(item) {
+ if (item.Type === 'Movie' || item.Type === 'BoxSet') {
+ return 'movies';
}
- function renderSpecials(page, item, user) {
- connectionManager.getApiClient(item.ServerId).getSpecialFeatures(user.Id, item.Id).then(function (specials) {
- const specialsContent = page.querySelector('#specialsContent');
- specialsContent.innerHTML = getVideosHtml(specials);
- imageLoader.lazyChildren(specialsContent);
- });
+ if (item.Type === 'Series' || item.Type === 'Season' || item.Type === 'Episode') {
+ return 'tvshows';
}
- function renderCast(page, item) {
- const people = (item.People || []).filter(function (p) {
- return p.Type === 'Actor';
- });
+ if (item.Type === 'MusicArtist' || item.Type === 'MusicAlbum' || item.Type === 'Audio' || item.Type === 'AudioBook') {
+ return 'music';
+ }
- if (!people.length) {
- return void page.querySelector('#castCollapsible').classList.add('hide');
+ if (item.Type === 'Program') {
+ return 'livetv';
+ }
+
+ return null;
+}
+
+function filterItemsByCollectionItemType(items, typeInfo) {
+ return items.filter(function (item) {
+ if (typeInfo.mediaType) {
+ return item.MediaType == typeInfo.mediaType;
}
- page.querySelector('#castCollapsible').classList.remove('hide');
- const castContent = page.querySelector('#castContent');
+ return item.Type == typeInfo.type;
+ });
+}
- import('peoplecardbuilder').then(({default: peoplecardbuilder}) => {
- peoplecardbuilder.buildPeopleCards(people, {
- itemsContainer: castContent,
- coverImage: true,
- serverId: item.ServerId,
- shape: 'overflowPortrait',
+function canPlaySomeItemInCollection(items) {
+ let i = 0;
+
+ for (let length = items.length; i < length; i++) {
+ if (playbackManager.canPlay(items[i])) {
+ return true;
+ }
+ }
+
+ return false;
+}
+
+function renderCollectionItems(page, parentItem, types, items) {
+ page.querySelector('.collectionItems').classList.remove('hide');
+ page.querySelector('.collectionItems').innerHTML = '';
+
+ for (const type of types) {
+ const typeItems = filterItemsByCollectionItemType(items, type);
+
+ if (typeItems.length) {
+ renderCollectionItemType(page, parentItem, type, typeItems);
+ }
+ }
+
+ const otherType = {
+ name: globalize.translate('HeaderOtherItems')
+ };
+ const otherTypeItems = items.filter(function (curr) {
+ return !types.filter(function (t) {
+ return filterItemsByCollectionItemType([curr], t).length > 0;
+ }).length;
+ });
+
+ if (otherTypeItems.length) {
+ renderCollectionItemType(page, parentItem, otherType, otherTypeItems);
+ }
+
+ if (!items.length) {
+ renderCollectionItemType(page, parentItem, {
+ name: globalize.translate('Items')
+ }, items);
+ }
+
+ const containers = page.querySelectorAll('.collectionItemsContainer');
+
+ const notifyRefreshNeeded = function () {
+ renderChildren(page, parentItem);
+ };
+
+ for (const container of containers) {
+ container.notifyRefreshNeeded = notifyRefreshNeeded;
+ }
+
+ // if nothing in the collection can be played hide play and shuffle buttons
+ if (!canPlaySomeItemInCollection(items)) {
+ hideAll(page, 'btnPlay', false);
+ hideAll(page, 'btnShuffle', false);
+ }
+
+ // HACK: Call autoFocuser again because btnPlay may be hidden, but focused by reloadFromItem
+ // FIXME: Sometimes focus does not move until all (?) sections are loaded
+ import('autoFocuser').then(({ default: autoFocuser }) => {
+ autoFocuser.autoFocus(page);
+ });
+}
+
+function renderCollectionItemType(page, parentItem, type, items) {
+ let html = '';
+ html += '
';
+ html += '
';
+ html += '
';
+ html += '' + type.name + '';
+ html += '
';
+ html += '';
+ html += '
';
+ const shape = type.type == 'MusicAlbum' ? getSquareShape(false) : getPortraitShape(false);
+ html += cardBuilder.getCardsHtml({
+ items: items,
+ shape: shape,
+ showTitle: true,
+ showYear: type.mediaType === 'Video' || type.type === 'Series',
+ centerText: true,
+ lazy: true,
+ showDetailsMenu: true,
+ overlayMoreButton: true,
+ showAddToCollection: false,
+ showRemoveFromCollection: true,
+ collectionId: parentItem.Id
+ });
+ html += '
';
+ html += '
';
+ const collectionItems = page.querySelector('.collectionItems');
+ collectionItems.insertAdjacentHTML('beforeend', html);
+ imageLoader.lazyChildren(collectionItems);
+}
+
+function renderMusicVideos(page, item, user) {
+ window.connectionManager.getApiClient(item.ServerId).getItems(user.Id, {
+ SortBy: 'SortName',
+ SortOrder: 'Ascending',
+ IncludeItemTypes: 'MusicVideo',
+ Recursive: true,
+ Fields: 'PrimaryImageAspectRatio,BasicSyncInfo,CanDelete,MediaSourceCount',
+ AlbumIds: item.Id
+ }).then(function (result) {
+ if (result.Items.length) {
+ page.querySelector('#musicVideosCollapsible').classList.remove('hide');
+ const musicVideosContent = page.querySelector('.musicVideosContent');
+ musicVideosContent.innerHTML = getVideosHtml(result.Items);
+ imageLoader.lazyChildren(musicVideosContent);
+ } else {
+ page.querySelector('#musicVideosCollapsible').classList.add('hide');
+ }
+ });
+}
+
+function renderAdditionalParts(page, item, user) {
+ window.connectionManager.getApiClient(item.ServerId).getAdditionalVideoParts(user.Id, item.Id).then(function (result) {
+ if (result.Items.length) {
+ page.querySelector('#additionalPartsCollapsible').classList.remove('hide');
+ const additionalPartsContent = page.querySelector('#additionalPartsContent');
+ additionalPartsContent.innerHTML = getVideosHtml(result.Items);
+ imageLoader.lazyChildren(additionalPartsContent);
+ } else {
+ page.querySelector('#additionalPartsCollapsible').classList.add('hide');
+ }
+ });
+}
+
+function renderScenes(page, item) {
+ let chapters = item.Chapters || [];
+
+ if (chapters.length && !chapters[0].ImageTag && (chapters = []), chapters.length) {
+ page.querySelector('#scenesCollapsible').classList.remove('hide');
+ const scenesContent = page.querySelector('#scenesContent');
+
+ import('chaptercardbuilder').then(({ default: chaptercardbuilder }) => {
+ chaptercardbuilder.buildChapterCards(item, chapters, {
+ itemsContainer: scenesContent,
+ backdropShape: 'overflowBackdrop',
+ squareShape: 'overflowSquare',
imageBlurhashes: item.ImageBlurHashes
});
});
+ } else {
+ page.querySelector('#scenesCollapsible').classList.add('hide');
+ }
+}
+
+function getVideosHtml(items) {
+ return cardBuilder.getCardsHtml({
+ items: items,
+ shape: 'autooverflow',
+ showTitle: true,
+ action: 'play',
+ overlayText: false,
+ centerText: true,
+ showRuntime: true
+ });
+}
+
+function renderSpecials(page, item, user) {
+ window.connectionManager.getApiClient(item.ServerId).getSpecialFeatures(user.Id, item.Id).then(function (specials) {
+ const specialsContent = page.querySelector('#specialsContent');
+ specialsContent.innerHTML = getVideosHtml(specials);
+ imageLoader.lazyChildren(specialsContent);
+ });
+}
+
+function renderCast(page, item) {
+ const people = (item.People || []).filter(function (p) {
+ return p.Type === 'Actor';
+ });
+
+ if (!people.length) {
+ return void page.querySelector('#castCollapsible').classList.add('hide');
}
- function itemDetailPage() {
- const self = this;
- self.setInitialCollapsibleState = setInitialCollapsibleState;
- self.renderDetails = renderDetails;
- self.renderCast = renderCast;
+ page.querySelector('#castCollapsible').classList.remove('hide');
+ const castContent = page.querySelector('#castContent');
+
+ import('peoplecardbuilder').then(({ default: peoplecardbuilder }) => {
+ peoplecardbuilder.buildPeopleCards(people, {
+ itemsContainer: castContent,
+ coverImage: true,
+ serverId: item.ServerId,
+ shape: 'overflowPortrait',
+ imageBlurhashes: item.ImageBlurHashes
+ });
+ });
+}
+
+function itemDetailPage() {
+ const self = this;
+ self.setInitialCollapsibleState = setInitialCollapsibleState;
+ self.renderDetails = renderDetails;
+ self.renderCast = renderCast;
+}
+
+function bindAll(view, selector, eventName, fn) {
+ const elems = view.querySelectorAll(selector);
+
+ for (const elem of elems) {
+ elem.addEventListener(eventName, fn);
+ }
+}
+
+function onTrackSelectionsSubmit(e) {
+ e.preventDefault();
+ return false;
+}
+
+window.ItemDetailPage = new itemDetailPage();
+
+export default function (view, params) {
+ function reload(instance, page, params) {
+ loading.show();
+
+ const apiClient = params.serverId ? window.connectionManager.getApiClient(params.serverId) : ApiClient;
+
+ Promise.all([getPromise(apiClient, params), apiClient.getCurrentUser()]).then(([item, user]) => {
+ currentItem = item;
+ reloadFromItem(instance, page, params, item, user);
+ }).catch((error) => {
+ console.error('failed to get item or current user: ', error);
+ });
}
- function bindAll(view, selector, eventName, fn) {
- const elems = view.querySelectorAll(selector);
-
- for (const elem of elems) {
- elem.addEventListener(eventName, fn);
- }
- }
-
- function onTrackSelectionsSubmit(e) {
- e.preventDefault();
- return false;
- }
-
- window.ItemDetailPage = new itemDetailPage();
-
- export default function (view, params) {
- function reload(instance, page, params) {
- loading.show();
-
- const apiClient = params.serverId ? connectionManager.getApiClient(params.serverId) : ApiClient;
-
- Promise.all([getPromise(apiClient, params), apiClient.getCurrentUser()]).then(([item, user]) => {
- currentItem = item;
- reloadFromItem(instance, page, params, item, user);
- }).catch((error) => {
- console.error('failed to get item or current user: ', error);
+ function splitVersions(instance, page, apiClient, params) {
+ import('confirm').then(({ default: confirm }) => {
+ confirm('Are you sure you wish to split the media sources into separate items?', 'Split Media Apart').then(function () {
+ loading.show();
+ apiClient.ajax({
+ type: 'DELETE',
+ url: apiClient.getUrl('Videos/' + params.id + '/AlternateSources')
+ }).then(function () {
+ loading.hide();
+ reload(instance, page, params);
+ });
});
- }
+ });
+ }
- function splitVersions(instance, page, apiClient, params) {
- import('confirm').then(({default: confirm}) => {
- confirm('Are you sure you wish to split the media sources into separate items?', 'Split Media Apart').then(function () {
- loading.show();
- apiClient.ajax({
- type: 'DELETE',
- url: apiClient.getUrl('Videos/' + params.id + '/AlternateSources')
- }).then(function () {
- loading.hide();
- reload(instance, page, params);
- });
+ function getPlayOptions(startPosition) {
+ const audioStreamIndex = view.querySelector('.selectAudio').value || null;
+ return {
+ startPositionTicks: startPosition,
+ mediaSourceId: view.querySelector('.selectSource').value,
+ audioStreamIndex: audioStreamIndex,
+ subtitleStreamIndex: view.querySelector('.selectSubtitles').value
+ };
+ }
+
+ function playItem(item, startPosition) {
+ const playOptions = getPlayOptions(startPosition);
+ playOptions.items = [item];
+ playbackManager.play(playOptions);
+ }
+
+ function playTrailer() {
+ playbackManager.playTrailers(currentItem);
+ }
+
+ function playCurrentItem(button, mode) {
+ const item = currentItem;
+
+ if (item.Type === 'Program') {
+ const apiClient = window.connectionManager.getApiClient(item.ServerId);
+ return void apiClient.getLiveTvChannel(item.ChannelId, apiClient.getCurrentUserId()).then(function (channel) {
+ playbackManager.play({
+ items: [channel]
});
});
}
- function getPlayOptions(startPosition) {
- const audioStreamIndex = view.querySelector('.selectAudio').value || null;
- return {
- startPositionTicks: startPosition,
- mediaSourceId: view.querySelector('.selectSource').value,
- audioStreamIndex: audioStreamIndex,
- subtitleStreamIndex: view.querySelector('.selectSubtitles').value
- };
- }
+ playItem(item, item.UserData && mode === 'resume' ? item.UserData.PlaybackPositionTicks : 0);
+ }
- function playItem(item, startPosition) {
- const playOptions = getPlayOptions(startPosition);
- playOptions.items = [item];
- playbackManager.play(playOptions);
- }
+ function onPlayClick() {
+ playCurrentItem(this, this.getAttribute('data-mode'));
+ }
- function playTrailer() {
- playbackManager.playTrailers(currentItem);
- }
+ function onPosterClick(e) {
+ itemShortcuts.onClick.call(view.querySelector('.detailImageContainer'), e);
+ }
- function playCurrentItem(button, mode) {
- const item = currentItem;
+ function onInstantMixClick() {
+ playbackManager.instantMix(currentItem);
+ }
- if (item.Type === 'Program') {
- const apiClient = connectionManager.getApiClient(item.ServerId);
- return void apiClient.getLiveTvChannel(item.ChannelId, apiClient.getCurrentUserId()).then(function (channel) {
- playbackManager.play({
- items: [channel]
- });
- });
- }
+ function onShuffleClick() {
+ playbackManager.shuffle(currentItem);
+ }
- playItem(item, item.UserData && mode === 'resume' ? item.UserData.PlaybackPositionTicks : 0);
- }
-
- function onPlayClick() {
- playCurrentItem(this, this.getAttribute('data-mode'));
- }
-
- function onInstantMixClick() {
- playbackManager.instantMix(currentItem);
- }
-
- function onShuffleClick() {
- playbackManager.shuffle(currentItem);
- }
-
- function onCancelSeriesTimerClick() {
- import('recordingHelper').then(({default: recordingHelper}) => {
- recordingHelper.cancelSeriesTimerWithConfirmation(currentItem.Id, currentItem.ServerId).then(function () {
- Dashboard.navigate('livetv.html');
- });
+ function onCancelSeriesTimerClick() {
+ import('recordingHelper').then(({ default: recordingHelper }) => {
+ recordingHelper.cancelSeriesTimerWithConfirmation(currentItem.Id, currentItem.ServerId).then(function () {
+ Dashboard.navigate('livetv.html');
});
- }
+ });
+ }
- function onCancelTimerClick() {
- import('recordingHelper').then(({default: recordingHelper}) => {
- recordingHelper.cancelTimer(connectionManager.getApiClient(currentItem.ServerId), currentItem.TimerId).then(function () {
- reload(self, view, params);
- });
+ function onCancelTimerClick() {
+ import('recordingHelper').then(({ default: recordingHelper }) => {
+ recordingHelper.cancelTimer(window.connectionManager.getApiClient(currentItem.ServerId), currentItem.TimerId).then(function () {
+ reload(self, view, params);
});
- }
+ });
+ }
- function onPlayTrailerClick() {
- playTrailer();
- }
+ function onPlayTrailerClick() {
+ playTrailer();
+ }
- function onDownloadClick() {
- import('fileDownloader').then(({default: fileDownloader}) => {
- const downloadHref = apiClient.getItemDownloadUrl(currentItem.Id);
- fileDownloader.download([{
- url: downloadHref,
- itemId: currentItem.Id,
- serverId: currentItem.serverId
- }]);
- });
- }
+ function onDownloadClick() {
+ import('fileDownloader').then(({ default: fileDownloader }) => {
+ const downloadHref = apiClient.getItemDownloadUrl(currentItem.Id);
+ fileDownloader.download([{
+ url: downloadHref,
+ itemId: currentItem.Id,
+ serverId: currentItem.serverId
+ }]);
+ });
+ }
+
+ function onMoreCommandsClick() {
+ const button = this;
+ let selectedItem = view.querySelector('.selectSource').value || currentItem.Id;
+
+ apiClient.getItem(apiClient.getCurrentUserId(), selectedItem).then(function (item) {
+ selectedItem = item;
- function onMoreCommandsClick() {
- const button = this;
apiClient.getCurrentUser().then(function (user) {
- itemContextMenu.show(getContextMenuOptions(currentItem, user, button)).then(function (result) {
+ itemContextMenu.show(getContextMenuOptions(selectedItem, user, button)).then(function (result) {
if (result.deleted) {
appRouter.goHome();
} else if (result.updated) {
@@ -1945,79 +1972,90 @@ import 'emby-select';
}
});
});
- }
-
- function onPlayerChange() {
- renderTrackSelections(view, self, currentItem);
- setTrailerButtonVisibility(view, currentItem);
- }
-
- function onWebSocketMessage(e, data) {
- const msg = data;
-
- if (msg.MessageType === 'UserDataChanged' && currentItem && msg.Data.UserId == apiClient.getCurrentUserId()) {
- const key = currentItem.UserData.Key;
- const userData = msg.Data.UserDataList.filter(function (u) {
- return u.Key == key;
- })[0];
-
- if (userData) {
- currentItem.UserData = userData;
- reloadPlayButtons(view, currentItem);
- refreshImage(view, currentItem);
- }
- }
- }
-
- let currentItem;
- const self = this;
- const apiClient = params.serverId ? connectionManager.getApiClient(params.serverId) : ApiClient;
- view.querySelectorAll('.btnPlay');
- bindAll(view, '.btnPlay', 'click', onPlayClick);
- bindAll(view, '.btnResume', 'click', onPlayClick);
- bindAll(view, '.btnInstantMix', 'click', onInstantMixClick);
- bindAll(view, '.btnShuffle', 'click', onShuffleClick);
- bindAll(view, '.btnPlayTrailer', 'click', onPlayTrailerClick);
- bindAll(view, '.btnCancelSeriesTimer', 'click', onCancelSeriesTimerClick);
- bindAll(view, '.btnCancelTimer', 'click', onCancelTimerClick);
- bindAll(view, '.btnDownload', 'click', onDownloadClick);
- view.querySelector('.trackSelections').addEventListener('submit', onTrackSelectionsSubmit);
- view.querySelector('.btnSplitVersions').addEventListener('click', function () {
- splitVersions(self, view, apiClient, params);
- });
- bindAll(view, '.btnMoreCommands', 'click', onMoreCommandsClick);
- view.querySelector('.selectSource').addEventListener('change', function () {
- renderVideoSelections(view, self._currentPlaybackMediaSources);
- renderAudioSelections(view, self._currentPlaybackMediaSources);
- renderSubtitleSelections(view, self._currentPlaybackMediaSources);
- });
- view.addEventListener('viewshow', function (e) {
- const page = this;
-
- libraryMenu.setTransparentMenu(true);
-
- if (e.detail.isRestored) {
- if (currentItem) {
- Emby.Page.setTitle('');
- renderTrackSelections(page, self, currentItem, true);
- }
- } else {
- reload(self, page, params);
- }
-
- events.on(apiClient, 'message', onWebSocketMessage);
- events.on(playbackManager, 'playerchange', onPlayerChange);
- });
- view.addEventListener('viewbeforehide', function () {
- events.off(apiClient, 'message', onWebSocketMessage);
- events.off(playbackManager, 'playerchange', onPlayerChange);
- libraryMenu.setTransparentMenu(false);
- });
- view.addEventListener('viewdestroy', function () {
- currentItem = null;
- self._currentPlaybackMediaSources = null;
- self.currentRecordingFields = null;
});
}
-/* eslint-enable indent */
+ function onPlayerChange() {
+ renderTrackSelections(view, self, currentItem);
+ setTrailerButtonVisibility(view, currentItem);
+ }
+
+ function onWebSocketMessage(e, data) {
+ const msg = data;
+
+ if (msg.MessageType === 'UserDataChanged' && currentItem && msg.Data.UserId == apiClient.getCurrentUserId()) {
+ const key = currentItem.UserData.Key;
+ const userData = msg.Data.UserDataList.filter(function (u) {
+ return u.Key == key;
+ })[0];
+
+ if (userData) {
+ currentItem.UserData = userData;
+ reloadPlayButtons(view, currentItem);
+ refreshImage(view, currentItem);
+ }
+ }
+ }
+
+ let currentItem;
+ const self = this;
+ const apiClient = params.serverId ? window.connectionManager.getApiClient(params.serverId) : ApiClient;
+
+ const btnResume = view.querySelector('.mainDetailButtons .btnResume');
+ const btnPlay = view.querySelector('.mainDetailButtons .btnPlay');
+ if (layoutManager.tv && !btnResume.classList.contains('hide')) {
+ btnResume.classList.add('fab');
+ btnResume.classList.add('detailFloatingButton');
+ } else if (layoutManager.tv && btnResume.classList.contains('hide')) {
+ btnPlay.classList.add('fab');
+ btnPlay.classList.add('detailFloatingButton');
+ }
+
+ view.querySelectorAll('.btnPlay');
+ bindAll(view, '.btnPlay', 'click', onPlayClick);
+ bindAll(view, '.btnResume', 'click', onPlayClick);
+ bindAll(view, '.btnInstantMix', 'click', onInstantMixClick);
+ bindAll(view, '.btnShuffle', 'click', onShuffleClick);
+ bindAll(view, '.btnPlayTrailer', 'click', onPlayTrailerClick);
+ bindAll(view, '.btnCancelSeriesTimer', 'click', onCancelSeriesTimerClick);
+ bindAll(view, '.btnCancelTimer', 'click', onCancelTimerClick);
+ bindAll(view, '.btnDownload', 'click', onDownloadClick);
+ view.querySelector('.detailImageContainer').addEventListener('click', onPosterClick);
+ view.querySelector('.trackSelections').addEventListener('submit', onTrackSelectionsSubmit);
+ view.querySelector('.btnSplitVersions').addEventListener('click', function () {
+ splitVersions(self, view, apiClient, params);
+ });
+ bindAll(view, '.btnMoreCommands', 'click', onMoreCommandsClick);
+ view.querySelector('.selectSource').addEventListener('change', function () {
+ renderVideoSelections(view, self._currentPlaybackMediaSources);
+ renderAudioSelections(view, self._currentPlaybackMediaSources);
+ renderSubtitleSelections(view, self._currentPlaybackMediaSources);
+ });
+ view.addEventListener('viewshow', function (e) {
+ const page = this;
+
+ libraryMenu.setTransparentMenu(true);
+
+ if (e.detail.isRestored) {
+ if (currentItem) {
+ Emby.Page.setTitle('');
+ renderTrackSelections(page, self, currentItem, true);
+ }
+ } else {
+ reload(self, page, params);
+ }
+
+ events.on(apiClient, 'message', onWebSocketMessage);
+ events.on(playbackManager, 'playerchange', onPlayerChange);
+ });
+ view.addEventListener('viewbeforehide', function () {
+ events.off(apiClient, 'message', onWebSocketMessage);
+ events.off(playbackManager, 'playerchange', onPlayerChange);
+ libraryMenu.setTransparentMenu(false);
+ });
+ view.addEventListener('viewdestroy', function () {
+ currentItem = null;
+ self._currentPlaybackMediaSources = null;
+ self.currentRecordingFields = null;
+ });
+}
diff --git a/src/controllers/list.js b/src/controllers/list.js
index 0027c576f..fe04fc18e 100644
--- a/src/controllers/list.js
+++ b/src/controllers/list.js
@@ -5,7 +5,6 @@ import * as userSettings from 'userSettings';
import focusManager from 'focusManager';
import cardBuilder from 'cardBuilder';
import loading from 'loading';
-import connectionManager from 'connectionManager';
import AlphaNumericShortcuts from 'alphaNumericShortcuts';
import playbackManager from 'playbackManager';
import AlphaPicker from 'alphaPicker';
@@ -16,7 +15,7 @@ import 'emby-scroller';
function getInitialLiveTvQuery(instance, params) {
const query = {
- UserId: connectionManager.getApiClient(params.serverId).getCurrentUserId(),
+ UserId: window.connectionManager.getApiClient(params.serverId).getCurrentUserId(),
StartIndex: 0,
Fields: 'ChannelInfo,PrimaryImageAspectRatio',
Limit: 300
@@ -232,7 +231,7 @@ import 'emby-scroller';
}
function getItems(instance, params, item, sortBy, startIndex, limit) {
- const apiClient = connectionManager.getApiClient(params.serverId);
+ const apiClient = window.connectionManager.getApiClient(params.serverId);
instance.queryRecursive = false;
if (params.type === 'Recordings') {
@@ -333,7 +332,7 @@ import 'emby-scroller';
return Promise.resolve(null);
}
- const apiClient = connectionManager.getApiClient(params.serverId);
+ const apiClient = window.connectionManager.getApiClient(params.serverId);
const itemId = params.genreId || params.musicGenreId || params.studioId || params.personId || params.parentId;
if (itemId) {
diff --git a/src/controllers/livetv.html b/src/controllers/livetv.html
index fdf19bd91..fa6c3125d 100644
--- a/src/controllers/livetv.html
+++ b/src/controllers/livetv.html
@@ -1,4 +1,4 @@
-
+
@@ -15,7 +15,7 @@
@@ -24,7 +24,7 @@
@@ -63,7 +63,7 @@
diff --git a/src/controllers/livetv/livetvsuggested.js b/src/controllers/livetv/livetvsuggested.js
index 4a20d02fc..346630012 100644
--- a/src/controllers/livetv/livetvsuggested.js
+++ b/src/controllers/livetv/livetvsuggested.js
@@ -168,15 +168,15 @@ function getTabs() {
return [{
name: globalize.translate('Programs')
}, {
- name: globalize.translate('TabGuide')
+ name: globalize.translate('Guide')
}, {
- name: globalize.translate('TabChannels')
+ name: globalize.translate('Channels')
}, {
- name: globalize.translate('TabRecordings')
+ name: globalize.translate('Recordings')
}, {
- name: globalize.translate('HeaderSchedule')
+ name: globalize.translate('Schedule')
}, {
- name: globalize.translate('TabSeries')
+ name: globalize.translate('Series')
}];
}
diff --git a/src/controllers/livetvsettings.html b/src/controllers/livetvsettings.html
index 3f93e0a7f..374ab9a4a 100644
--- a/src/controllers/livetvsettings.html
+++ b/src/controllers/livetvsettings.html
@@ -11,7 +11,7 @@