dashboard-ui/item/item.html
2023-08-31 15:30:17 +02:00

356 lines
26 KiB
HTML

<div is="emby-scroller" data-horizontal="false" data-focusscroll="true" data-navcommands="card" data-forcescrollbar="true" class="itemView darkContentContainer-item view flex flex-direction-column scrollFrameY flex-grow" data-bindheader="true" data-enablescrollingstatus="true">
<div class="scrollSlider flex-grow padded-top-page itemMainScrollSlider">
<div class="topDetailsContainer flex flex-direction-row">
<div class="item-fixed-side padded-left padded-left-page hide flex flex-direction-column flex-shrink-zero">
<div is="emby-itemscontainer" class="detailImageContainer detailImageContainer-side justify-content-center">
</div>
</div>
<div class="flex-grow topDetailsMain flex flex-direction-column">
<div class="itemBackdropContainer">
<div class="itemBackdrop" loading="lazy" decoding="async">
</div>
</div>
<div class="padded-left padded-left-page padded-right detailMainContainerParent">
<div class="verticalSection detailMainContainer flex flex-direction-row align-items-flex-start">
<div is="emby-itemscontainer" class="detailImageContainer detailImageContainer-main flex flex-direction-column justify-content-center">
</div>
<div class="flex-grow detailTextContainer">
<div class="flex align-items-center flex-direction-row detailTextContainerInner">
<div class="flex flex-direction-column" style="min-width:60%;">
<div class="nameContainer focuscontainer-x">
</div>
<div class="mediaInfo mediaInfoPrimary detail-mediaInfoPrimary flex align-items-center flex-wrap-wrap reduce-font-size-tv mediaInfoItems readOnlyContent hide">
</div>
</div>
</div>
<div class="mediaInfo mediaInfoSecondary flex align-items-center flex-wrap-wrap reduce-font-size-tv mediaInfoItems hide" style="margin: .6em 0;">
</div>
<form class="trackSelections flex align-items-center flex-wrap-wrap hide focuscontainer-x reduce-font-size-tv" style="padding: 0;max-width:initial;">
<div class="selectContainer selectContainer-inline selectSourceContainer hide trackSelectionFieldContainer flex-shrink-zero">
<select is="emby-select" class="selectSource detailTrackSelect emby-select-inline" label="${LabelVersion}"></select>
</div>
<div class="selectContainer selectContainer-inline selectVideoContainer hide trackSelectionFieldContainer flex-shrink-zero">
<select is="emby-select" class="selectVideo detailTrackSelect emby-select-inline" label="${LabelVideo}"></select>
</div>
<div class="selectContainer selectContainer-inline selectAudioContainer hide trackSelectionFieldContainer flex-shrink-zero">
<select is="emby-select" class="selectAudio detailTrackSelect emby-select-inline" label="${LabelAudio}" data-menu="custom"></select>
</div>
<div class="selectContainer selectContainer-inline selectSubtitlesContainer hide trackSelectionFieldContainer">
<select is="emby-select" class="selectSubtitles detailTrackSelect emby-select-inline" label="${LabelSubtitles}" data-menu="custom"></select>
</div>
</form>
<div class="detailButtons mainDetailButtons flex align-items-flex-start flex-wrap-wrap focuscontainer-x">
<button is="emby-button" type="button" class="btnResume raised detailButton hide" data-mode="resume" title="${Resume}">
<i class="md-icon button-icon button-icon-left autortl">&#xE037;</i>
<span class="resumeButtonText detailButton-lowres">${Resume}</span>
<span class="resumeButtonText detailButton-highres">${Resume}</span>
</button>
<button is="emby-button" type="button" class="btnPlay btnMainPlay hide raised detailButton" data-mode="play" title="${Play}">
<i class="md-icon button-icon button-icon-left autortl">&#xE037;</i>
<span class="playButtonText">${Play}</span>
</button>
<button is="emby-button" type="button" class="btnPlayTrailer btnPlayTrailer-main hide raised detailButton" title="${Trailer}" aria-label="${Trailer}">
<i class="md-icon button-icon button-icon-left">&#xE8DA;</i>
<span>${Trailer}</span>
</button>
<button is="emby-button" type="button" class="btnShuffle hide raised detailButton" title="${Shuffle}">
<i class="md-icon button-icon button-icon-left">&#xE043;</i>
<span>${Shuffle}</span>
</button>
<button is="emby-button" type="button" class="btnCancelSeriesTimer hide raised detailButton" title="${HeaderCancelSeries}">
<i class="md-icon button-icon button-icon-left recordingIcon-active">&#xE047;</i>
<span>${HeaderCancelSeries}</span>
</button>
<button is="emby-button" type="button" class="btnCancelTimer hide raised detailButton" title="${HeaderStopRecording}">
<i class="md-icon button-icon button-icon-left recordingIcon-active">&#xE047;</i>
<span>${HeaderStopRecording}</span>
</button>
<button is="emby-button" type="button" class="btnManualRecording hide raised detailButton" title="${HeaderCreateRecording}">
<i class="md-icon button-icon button-icon-left">&#xe061;</i>
<span>${HeaderCreateRecording}</span>
</button>
<button is="emby-playstatebutton" type="button" class="btnPlaystate hide raised detailButton detailButton-highres2">
<i class="md-icon button-icon button-icon-left">&#xe86c;</i>
<span class="button-text"></span>
</button>
<button is="emby-downloadbutton" type="button" class="btnSyncDownload hide fab detailButton detailButton-autotext" title="${Download}">
<i class="md-icon detailButton-autotext-icon">&#xf090;</i>
<div class="detailButton-autotext-text secondaryText button-text">${Download}</div>
</button>
<button is="emby-playstatebutton" type="button" class="btnPlaystate hide fab detailButton detailButton-lowres2 detailButton-autotext">
<i class="md-icon detailButtonIcon detailButton-autotext-icon">&#xE5CA;</i>
<div class="detailButton-autotext-text secondaryText button-text"></div>
</button>
<button is="emby-button" type="button" class="btnSortItems hide fab detailButton detailButton-autotext" title="${HeaderSortBy}" aria-label="${HeaderSortBy}">
<i class="md-icon detailButton-autotext-icon">&#xE164;</i>
<div class="detailButton-autotext-text secondaryText btnSortText">${HeaderSortBy}</div>
</button>
<button is="emby-ratingbutton" type="button" class="btnUserRating hide fab detailButton detailButton-autotext">
<i class="md-icon detailButton-autotext-icon">&#xE87D;</i>
<div class="detailButton-autotext-text secondaryText button-text"></div>
</button>
<button is="emby-button" type="button" class="btnDeleteItem hide fab detailButton detailButton-autotext" title="${Delete}" aria-label="${Delete}">
<i class="md-icon detailButton-autotext-icon">&#xE872;</i>
<div class="detailButton-autotext-text secondaryText">${Delete}</div>
</button>
<button is="emby-button" type="button" class="btnMoreCommands hide fab detailButton detailButton-autotext" title="${More}" aria-label="${More}">
<i class="md-icon detailButton-autotext-icon">&#xE5D3;</i>
<div class="detailButton-autotext-text secondaryText">${More}</div>
</button>
<div class="detailResumeInfo flex flex-wrap-wrap flex-direction-column hide">
<div class="resumeInfoDetail">
<div class="resumeName hide"></div>
<div class="resumeProgress hide flex align-items-center">
</div>
</div>
</div>
<div class="detailRecordSeriesContainer recordSeriesContainer recordingFields-buttons flex align-items-flex-start flex-wrap-wrap hide">
<button is="emby-button" type="button" class="seriesRecordingButton detailButton raised" title="${HeaderRecordSeries}">
<i class="md-icon button-icon button-icon-left recordingIcon">&#xE062;</i>
<span class="button-text seriesRecordingButtonText">${HeaderRecordSeries}</span>
</button>
<button is="emby-button" type="button" class="manageRecordingButton btnManageSeriesRecording hide detailButton raised" title="${SeriesSettings}">
<i class="md-icon button-icon button-icon-left recordingIcon">&#xE8B8;</i>
<span class="button-text seriesRecordingButtonText">${SeriesSettings}</span>
</button>
</div>
<button is="emby-button" type="button" class="singleRecordingButton detailButton hide raised" title="${Record}">
<i class="md-icon button-icon button-icon-left recordingIcon">&#xE061;</i>
<span class="button-text singleRecordingButtonText">${Record}</span>
</button>
<button is="emby-button" type="button" class="manageRecordingButton btnManageRecording hide detailButton raised" title="${Settings}">
<i class="md-icon button-icon button-icon-left recordingIcon">&#xE8B8;</i>
<span class="button-text seriesRecordingButtonText">${Settings}</span>
</button>
</div>
<h3 class="tagline hide readOnlyContent" style="max-width:75.5ch;"></h3>
<p class="birthDate hide">
</p>
<p class="deathDate hide">
</p>
<div class="overview-container hide flex flex-direction-row align-items-flex-end focuscontainer-x">
<button disabled type="button" is="emby-button" class="button-link button-link-color-inherit btnOverviewText text-align-start" style="opacity:initial;">
<div class="overview-text readOnlyContent"></div>
</button>
<a href="#" is="emby-linkbutton" class="button-link btnReadMore hide flex-shrink-zero secondaryText">${HeaderReadMore}</a>
</div>
<p class="directors hide focuscontainer-x readOnlyContent reduce-font-size-tv secondaryText">
</p>
<div class="recordingEditor hide" style="margin-top:2em;">
</div>
</div>
</div>
<div class="trackList vertical-list padded-bottom hide focuscontainer-x" is="emby-itemscontainer" style="margin-bottom:1.5em;">
</div>
</div>
</div>
</div>
<div class="details-additionalContent padded-bottom-page">
<div class="programGuideSection hide padded-left padded-left-page padded-right">
<div is="emby-itemscontainer" class="itemsContainer programGuideItemsContainer vertical-list focuscontainer-x padded-bottom-page" data-virtualscrolllayout="vertical-grid"></div>
</div>
<div class="verticalSection verticalSection-cards additionalPartsSection hide">
<h2 class="sectionTitle sectionTitle-cards padded-left padded-left-page padded-right">${HeaderAdditionalParts}</h2>
<div is="emby-scroller" class="emby-scroller padded-top-focusscale padded-bottom-focusscale padded-left padded-left-page padded-right" data-mousewheel="false" data-focusscroll="true" data-horizontal="true">
<div is="emby-itemscontainer" class="scrollSlider focuscontainer-x itemsContainer additionalPartsItemsContainer focusable" data-virtualscrolllayout="horizontal-grid"></div>
</div>
</div>
<div class="verticalSection verticalSection-cards verticalSection-extrabottompadding artistSongsSection hide">
<div class="sectionTitleContainer sectionTitleContainer-cards padded-left padded-left-page padded-right artistSongsItemsHeader"></div>
<div is="emby-scroller" class="emby-scroller padded-top-focusscale padded-bottom-focusscale padded-left padded-left-page padded-right" data-mousewheel="false" data-focusscroll="true" data-horizontal="true">
<div is="emby-itemscontainer" class="scrollSlider focuscontainer-x itemsContainer focusable artistSongsItemsContainer itemsContainer-sideFooters" data-virtualscrolllayout="horizontal-grid"></div>
</div>
</div>
<div class="verticalSection verticalSection-cards seriesItemsSection hide">
<div class="sectionTitleContainer sectionTitleContainer-cards padded-left padded-left-page padded-right">
<h2 class="sectionTitle sectionTitle-cards"></h2>
<div class="selectContainer selectContainer-inline sectionTitle-cards detailSelectSeasonContainer hide" style="margin-top:0!important;margin-bottom:.4em!important;">
<select is="emby-select" style="width:24ch;" class="detailSelectSeason emby-select-inline" label="${Season}" data-dialogclass="detailSeasonSelect-actionsheet" data-hasitemimage="true" data-overview="true" data-virtualscroll="false"></select>
</div>
</div>
<div class="seasonTabs hide focuscontainer-x">
</div>
<div is="emby-scroller" class="emby-scroller childrenItemsScroller padded-top-focusscale padded-bottom-focusscale padded-left padded-left-page padded-right" data-mousewheel="false" data-focusscroll="true" data-horizontal="true">
<div is="emby-itemscontainer" class="scrollSlider focuscontainer-x childrenItemsContainer generalItemsContainer itemsContainer focusable" data-virtualscrolllayout="horizontal-grid"></div>
</div>
</div>
<div class="verticalSection verticalSection-cards artistAlbumsSection hide">
<div class="sectionTitleContainer sectionTitleContainer-cards padded-left padded-left-page padded-right">
<a is="emby-sectiontitle" href="#" class="button-link button-link-color-inherit sectionTitleTextButton">
<h2 class="sectionTitle sectionTitle-cards">${Albums}</h2>
</a>
</div>
<div is="emby-scroller" class="emby-scroller padded-top-focusscale padded-bottom-focusscale padded-left padded-left-page padded-right" data-mousewheel="false" data-focusscroll="true" data-horizontal="true">
<div is="emby-itemscontainer" class="scrollSlider focuscontainer-x generalItemsContainer itemsContainer focusable" data-virtualscrolllayout="horizontal-grid"></div>
</div>
</div>
<div class="verticalSection verticalSection-cards collectionItemsSection hide">
<h2 class="sectionTitle sectionTitle-cards padded-left padded-left-page padded-right">${Items}</h2>
<div is="emby-itemscontainer" class="itemsContainer vertical-wrap collectionItemsContainer generalItemsContainer focuscontainer-x padded-left padded-left-page padded-right"></div>
</div>
<div class="verticalSection verticalSection-cards moreFromSeasonSection hide">
<h2 class="sectionTitle sectionTitle-cards padded-left padded-left-page padded-right"></h2>
<div is="emby-scroller" class="emby-scroller padded-top-focusscale padded-bottom-focusscale padded-left padded-left-page padded-right" data-mousewheel="false" data-focusscroll="true" data-horizontal="true">
<div is="emby-itemscontainer" class="scrollSlider focuscontainer-x itemsContainer moreFromSeasonItemsContainer focusable" data-virtualscrolllayout="horizontal-grid"></div>
</div>
</div>
<div class="verticalSection verticalSection-cards peopleSection hide">
<h2 class="sectionTitle sectionTitle-cards padded-left padded-left-page padded-right">${HeaderCastCrew}</h2>
<div is="emby-scroller" class="emby-scroller padded-top-focusscale padded-bottom-focusscale padded-left padded-left-page padded-right" data-mousewheel="false" data-focusscroll="true" data-horizontal="true">
<div is="emby-itemscontainer" class="scrollSlider focuscontainer-x itemsContainer focusable peopleItemsContainer" data-virtualscrolllayout="horizontal-grid"></div>
</div>
</div>
<div class="verticalSection verticalSection-cards extrasSection hide">
<h2 class="sectionTitle sectionTitle-cards padded-left padded-left-page padded-right">${Extras}</h2>
<div is="emby-scroller" class="emby-scroller padded-top-focusscale padded-bottom-focusscale padded-left padded-left-page padded-right" data-mousewheel="false" data-focusscroll="true" data-horizontal="true">
<div is="emby-itemscontainer" class="scrollSlider focuscontainer-x itemsContainer extrasItemsContainer focusable" data-virtualscrolllayout="horizontal-grid"></div>
</div>
</div>
<div class="verticalSection verticalSection-cards scenesSection hide">
<h2 class="sectionTitle sectionTitle-cards padded-left padded-left-page padded-right">${Chapters}</h2>
<div is="emby-scroller" class="emby-scroller padded-top-focusscale padded-bottom-focusscale padded-left padded-left-page padded-right" data-mousewheel="false" data-focusscroll="true" data-horizontal="true">
<div is="emby-itemscontainer" class="scrollSlider focuscontainer-x itemsContainer chaptersItemsContainer focusable" data-virtualscrolllayout="horizontal-grid"></div>
</div>
</div>
<div class="verticalSection verticalSection-cards verticalSection-extrabottompadding tagsSection hide focuscontainer-x">
<h2 class="sectionTitle padded-left padded-left-page padded-right" style="margin-bottom:.4em;">${Tags}</h2>
<div class="itemTags padded-left padded-left-page padded-right focusable"></div>
</div>
<div class="verticalSection verticalSection-cards moreFromArtistSection hide">
<h2 class="sectionTitle sectionTitle-cards padded-left padded-left-page padded-right"></h2>
<div is="emby-scroller" class="emby-scroller padded-top-focusscale padded-bottom-focusscale padded-left padded-left-page padded-right" data-mousewheel="false" data-focusscroll="true" data-horizontal="true">
<div is="emby-itemscontainer" class="scrollSlider focuscontainer-x itemsContainer moreFromArtistItemsContainer focusable" data-virtualscrolllayout="horizontal-grid"></div>
</div>
</div>
<div class="verticalSection verticalSection-cards seriesScheduleSection hide">
<h2 class="sectionTitle sectionTitle-cards padded-left padded-left-page padded-right">${HeaderUpcomingOnTV}</h2>
<div is="emby-scroller" class="emby-scroller padded-top-focusscale padded-bottom-focusscale padded-left padded-left-page padded-right" data-mousewheel="false" data-focusscroll="true" data-horizontal="true">
<div is="emby-itemscontainer" class="scrollSlider focuscontainer-x itemsContainer focusable seriesScheduleItemsContainer" data-virtualscrolllayout="horizontal-grid"></div>
</div>
</div>
<div class="verticalSection verticalSection-cards appearsOnListsSection hide">
<h2 class="sectionTitle sectionTitle-cards padded-left padded-left-page padded-right">${HeaderIncludedIn}</h2>
<div is="emby-scroller" class="emby-scroller padded-top-focusscale padded-bottom-focusscale padded-left padded-left-page padded-right" data-mousewheel="false" data-focusscroll="true" data-horizontal="true">
<div is="emby-itemscontainer" class="scrollSlider focuscontainer-x itemsContainer appearsOnListsItemsContainer focusable" data-virtualscrolllayout="horizontal-grid"></div>
</div>
</div>
<div class="peopleItems">
</div>
<div class="verticalSection verticalSection-cards similarSection hide">
<h2 class="sectionTitle sectionTitle-cards padded-left padded-left-page padded-right">${HeaderMoreLikeThis}</h2>
<div is="emby-scroller" class="emby-scroller padded-top-focusscale padded-bottom-focusscale padded-left padded-left-page padded-right" data-mousewheel="false" data-focusscroll="true" data-horizontal="true">
<div is="emby-itemscontainer" class="scrollSlider focuscontainer-x itemsContainer focusable similarItemsContainer" data-virtualscrolllayout="horizontal-grid"></div>
</div>
</div>
<div class="verticalSection verticalSection-cards similarOnLiveTVCollapsible hide">
<h2 class="sectionTitle sectionTitle-cards padded-left padded-left-page padded-right">${HeaderMoreLikeThisOnLiveTV}</h2>
<div is="emby-scroller" class="emby-scroller padded-top-focusscale padded-bottom-focusscale padded-left padded-left-page padded-right" data-mousewheel="false" data-focusscroll="true" data-horizontal="true">
<div is="emby-itemscontainer" class="scrollSlider focuscontainer-x itemsContainer focusable similarOnLiveTVItemsContainer" data-virtualscrolllayout="horizontal-grid"></div>
</div>
</div>
<div class="verticalSection verticalSection-cards seriesTimerScheduleSection padded-left padded-left-page padded-right hide">
<h2 class="sectionTitle" style="margin-bottom: 0;">
${Schedule}
</h2>
<div class="seriesTimerSchedule">
<div is="emby-itemscontainer" class="itemsContainer seriesTimerScheduleItemsContainer vertical-list focuscontainer-x" data-monitor="Timers"></div>
</div>
</div>
<div class="verticalSection verticalSection-cards linksSection hide verticalSection-extrabottompadding focuscontainer-x">
<h2 class="sectionTitle padded-left padded-left-page padded-right" style="margin-bottom:.4em;">${Links}</h2>
<div class="itemLinks padded-left padded-left-page padded-right focusable"></div>
</div>
<div class="verticalSection verticalSection-cards audioVideoMediaInfo hide mediainfo-forcehide">
<h2 class="padded-left padded-left-page padded-right sectionTitle sectionTitle-cards mediaInfoHeader" style="margin-bottom:0;">${HeaderMediaInfo}</h2>
<div class="splitVersionContainer padded-top padded-bottom padded-left padded-left-page padded-right">
<button is="emby-button" type="button" class="raised btnSplitVersions subdued">${HeaderSplitVersionsApart}</button>
</div>
<div class="mediaSources"></div>
</div>
</div>
</div>
</div>