cotugno/jellyfin-web
2
Fork 0
mirror of https://github.com/jellyfin/jellyfin-web.git synced 2024-11-17 19:08:18 -07:00
Code Issues Packages Projects Releases Wiki Activity

update detail page

Browse Source
This commit is contained in:
Luke Pulverenti 2015-08-18 00:22:45 -04:00
parent c6f885aee8
commit 84edab7fb0
19 changed files with 317 additions and 442 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
dashboard-ui/bower_components/iron-a11y-keys-behavior/.bower.json vendored
View File

@ -29,14 +29,14 @@
"web-component-tester": "*",
"webcomponentsjs": "webcomponents/webcomponentsjs#^0.7.0"
},
"homepage": "https://github.com/polymerelements/iron-a11y-keys-behavior",
"homepage": "https://github.com/PolymerElements/iron-a11y-keys-behavior",
"_release": "1.0.5",
"_resolution": {
"type": "version",
"tag": "v1.0.5",
"commit": "cf833eab5c55a26c5aa92e56d3fcb079120ce66a"
},
"_source": "git://github.com/polymerelements/iron-a11y-keys-behavior.git",
"_source": "git://github.com/PolymerElements/iron-a11y-keys-behavior.git",
"_target": "^1.0.0",
"_originalSource": "polymerelements/iron-a11y-keys-behavior"
"_originalSource": "PolymerElements/iron-a11y-keys-behavior"
}

309
dashboard-ui/css/librarybrowser.css
View File

@ -165,15 +165,6 @@
border-collapse: collapse;
}
.detailButtonsContainer {
padding: 0 0 1em;
text-align: center;
}
.detailButtonsContainer a, .detailButtonsContainer button {
margin-top: 0;
}
.viewSettings {
margin: 0 0 .25em;
text-align: center;
@ -400,31 +391,38 @@ span.itemCommunityRating:not(:empty) + .userDataIcons {
background-size: cover;
background-position: center 15%;
background-repeat: no-repeat;
height: 640px;
height: 500px;
position: relative;
}
.noBackdrop {
height: 170px;
background: #181818;
}
.itemBackdropContent {
position: absolute;
bottom: 0;
left: 0;
right: 0;
background-color: rgba(0,0,0,0.7);
min-height: 120px;
}
.noBackdrop {
height: auto;
margin: 3em 0 0;
.noBackdrop .itemBackdropContent {
background-color: transparent;
}
.noBackdrop .itemBackdropContent {
background-color: transparent;
}
.noBackdrop .itemBackdropContent {
position: static;
}
.detailNameContainer {
position: absolute;
bottom: 15px;
margin-bottom: 0;
}
.desktopMiscInfoContainer {
position: absolute;
bottom: 10px;
}
.lnkSibling {
position: absolute;
@ -456,26 +454,8 @@ span.itemCommunityRating:not(:empty) + .userDataIcons {
}
.detailImageContainer {
position: absolute;
top: -66px;
}
.portraitDetailImageContainer {
top: -26px;
}
.thumbDetailImageContainer {
top: -26px;
}
.noBackdrop .squareDetailImageContainer {
top: 0;
}
.noBackdrop .detailImageContainer {
position: static;
display: inline-block;
vertical-align: top;
float: left;
margin-top: -140px;
}
.itemDetailImage {
@ -485,60 +465,29 @@ span.itemCommunityRating:not(:empty) + .userDataIcons {
border: solid 1px #222;
}
.thumbDetailImageContainer img {
max-width: 360px;
max-height: 203px;
}
.squareDetailImageContainer img {
max-width: 240px;
max-height: 240px;
}
.portraitDetailImageContainer img {
max-width: 210px;
.detailImageContainer img {
max-width: 280px;
max-height: 300px;
}
.squareDetailImageContainer {
margin-top: -150px;
}
.thumbDetailImageContainer {
margin-top: -130px;
}
.itemDetailGalleryLink img:hover {
-moz-box-shadow: 0 0 20px 3px #38c;
-webkit-box-shadow: 0 0 20px 3px #38c;
box-shadow: 0 0 20px 3px #38c;
}
.detailContentEffectedByThumbImage:not(.lastDetailContentEffectedByImage) {
margin-left: 380px;
}
.detailContentEffectedBySquareImage:not(.lastDetailContentEffectedByImage) {
margin-left: 260px;
}
.detailContentEffectedByPortraitImage {
margin-left: 220px;
}
.lastDetailContentEffectedByImage.detailContentEffectedByThumbImage {
padding: 0 .5em;
}
.lastDetailContentEffectedByImage.detailContentEffectedBySquareImage {
padding: 0 .5em;
}
.lastDetailContentEffectedByImage.detailContentEffectedByPortraitImage {
min-height: 115px;
}
.noBackdrop .detailContentEffectedByImage {
display: inline-block;
margin-left: 10px;
}
.noBackdrop + .ui-content .lastDetailContentEffectedByImage {
margin-top: 0;
margin-left: 0;
min-height: initial;
.primaryDetailsContainer {
float: left;
padding: .75em 0 0 1.5em;
width: 68%;
}
.parentName {
@ -547,66 +496,78 @@ span.itemCommunityRating:not(:empty) + .userDataIcons {
margin-bottom: .5em;
}
@media all and (min-width: 800px) {
.lastDetailContentEffectedByImage.detailContentEffectedBySquareImage {
margin-top: 2em;
}
.detailButtonsContainer {
font-size: 90%;
}
@media all and (max-width: 1000px) {
.detailImageContainer {
margin-left: 20px;
}
.detailFloatingButton {
width: 56px;
height: 56px;
top: -28px;
position: absolute;
right: 25%;
background-color: #52B54B !important;
}
.thumbDetailImageContainer img {
max-width: 340px;
}
.btnFloatingRecord {
background-color: #cc3333 !important;
}
.squareDetailImageContainer img {
max-width: 220px;
}
.portraitDetailImageContainer img {
max-width: 185px;
}
.lastDetailContentEffectedByImage.detailContentEffectedByPortraitImage {
min-height: 85px;
}
.detailFloatingButton iron-icon {
width: 40px;
height: 40px;
}
@media all and (max-width: 800px) {
.detailContentEffectedByThumbImage {
margin-left: 0 !important;
padding: 0 1em;
}
.detailContentEffectedBySquareImage {
margin-left: 0 !important;
padding: 0 1em;
}
.detailContentEffectedByPortraitImage {
margin-left: 0 !important;
padding: 0 1em;
}
.portraitDetailImageContainer img {
max-height: 120px;
}
.lastDetailContentEffectedByImage.detailContentEffectedByPortraitImage {
min-height: initial;
}
.parentName {
margin-bottom: 1em;
}
.primaryDetailsContainer {
padding-top: 2.5em;
padding-left: 1em;
}
.detailNameContainer {
position: static;
}
.itemBackdropContent {
min-height: 0;
}
}
@media all and (max-width: 600px) {
.detailFloatingButton {
right: 15px;
}
}
@media all and (max-width: 400px) {
.primaryDetailsContainer {
width: 60%;
}
}
@media all and (min-width: 600px) {
.mobileDetails {
display: none;
}
}
@media all and (max-width: 600px) {
.desktopDetails {
display: none;
}
}
.inlineItemName {
font-size: 22px;
font-size: 30px;
}
.itemName + .itemMiscInfo {
@ -637,10 +598,6 @@ span.itemCommunityRating:not(:empty) + .userDataIcons {
padding: 0 1em;
}
.mobileDetailButtons {
display: none;
}
.darkScrollbars ::-webkit-scrollbar {
width: 10px;
height: 10px;
@ -785,7 +742,7 @@ span.itemCommunityRating:not(:empty) + .userDataIcons {
}
}
@media all and (max-width: 800px) {
@media all and (max-height: 900px), (max-width: 800px) {
.itemBackdrop:not(.noBackdrop) {
height: 500px;
@ -802,14 +759,49 @@ span.itemCommunityRating:not(:empty) + .userDataIcons {
@media all and (max-height: 700px) {
.itemBackdrop:not(.noBackdrop) {
height: 340px;
height: 300px;
}
}
@media all and (max-height: 540px), (max-width: 540px) {
@media all and (max-width: 540px) {
.itemBackdrop:not(.noBackdrop) {
height: 280px;
height: 240px;
}
}
@media all and (max-height: 540px) {
.itemBackdrop:not(.noBackdrop) {
height: 200px;
}
}
@media all and (max-height: 460px) {
.itemBackdrop:not(.noBackdrop) {
height: 150px;
}
}
@media all and (max-height: 300px) {
.itemBackdrop:not(.noBackdrop) {
height: 100px;
}
}
@media all and (max-height: 250px) {
.itemBackdrop:not(.noBackdrop) {
height: 70px;
}
}
@media all and (max-width: 1000px) {
.detailImageContainer {
padding-left: 15px;
}
}
@ -819,16 +811,31 @@ span.itemCommunityRating:not(:empty) + .userDataIcons {
display: none;
}
.itemDetailImage {
max-height: 240px;
.noBackdrop {
height: 80px;
}
.detailImageContainer {
margin-top: -55px;
}
.squareDetailImageContainer {
margin-top: -40px;
}
.thumbDetailImageContainer {
margin-top: -80px;
}
.detailImageContainer img {
max-width: 100px;
}
.mobileOverview:not(.hide), .mobileGenres, .mobileDetailButtons {
.mobileOverview:not(.hide), .mobileGenres {
display: block;
}
.desktopOverview, .desktopGenres, .desktopDetailButtons {
.desktopOverview, .desktopGenres {
display: none;
}
@ -843,22 +850,22 @@ span.itemCommunityRating:not(:empty) + .userDataIcons {
.backdropDetailPageContent {
text-align: center;
}
}
.detailImageContainer {
display: none;
@media all and (max-width: 800px) {
.detailImageContainer img {
max-width: 80px;
}
.noBackdrop .detailImageContainer {
display: block;
position: static;
text-align: center;
.thumbDetailImageContainer img {
max-width: 180px;
}
}
@media all and (min-width: 750px) {
.detailPageContent {
max-width: 950px;
width: auto;
width: 950px;
}
}

114
dashboard-ui/itemdetails.html
View File

@ -21,71 +21,68 @@
<div id="itemBackdrop" class="itemBackdrop noBackdrop">
<div class="itemBackdropContent">
<div class="detailPageContent primaryDetailPageContent backdropDetailPageContent">
<div class="detailImageContainer">
</div>
<div class="detailContentEffectedByImage">
<p><span class="parentName"></span><span class="itemName inlineItemName"></span><span class="itemMiscInfo" style="display: inline;"></span></p>
<p style="margin:1.1em 0">
<span class="itemCommunityRating"></span>
<span class="userDataIcons"></span>
</p>
<div class="detailButtonsContainer desktopDetailButtons" style="text-align:left;">
<span class="missingIndicator" style="margin: 0 .5em; display: none;">
<span style="background: #cc3333; padding: 5px 1em; border-radius: 5px;">${LabelMissing}</span>
</span>
<span class="offlineIndicator" style="margin: 0 .5em; display: none;">
<span style="background: #cc3333; padding: 5px 1em; border-radius: 5px;">${LabelOffline}</span>
</span>
<paper-button raised class="secondary btnPlay hide"><iron-icon icon="play-arrow"></iron-icon><span>${ButtonPlay}</span></paper-button>
<paper-button raised class="alt btnPlayTrailer hide"><iron-icon icon="play-arrow"></iron-icon><span>${ButtonPlayTrailer}</span></paper-button>
<a class="btnPlayExternalTrailer hide clearLink" href="#" target="_blank"><paper-button raised class="alt btnPlayExternalTrailer"><iron-icon icon="play-arrow"></iron-icon><span>${ButtonPlayTrailer}</span></paper-button></a>
<paper-button raised class="subdued btnRecord hide"><iron-icon icon="videocam"></iron-icon><span>${ButtonRecord}</span></paper-button>
<paper-button raised class="subdued hide btnCancelRecording"><iron-icon icon="delete"></iron-icon><span>${ButtonCancelRecording}</span></paper-button>
<paper-button raised class="submit btnSync hide"><iron-icon icon="refresh"></iron-icon><span>${ButtonSync}</span></paper-button>
<paper-button raised class="subdued btnShare notext hide" style="background-color:#673AB7"><iron-icon icon="share"></iron-icon></paper-button>
<paper-button raised class="subdued btnMoreCommands hide notext"><iron-icon icon="more-vert"></iron-icon></paper-button>
</div>
</div>
</div>
</div>
<a href="#" id="lnkPreviousItem" class="lnkPreviousItem lnkSibling hide clearLink"><paper-button raised class="subdued notext"><iron-icon icon="arrow-back"></iron-icon></paper-button></a>
<a href="#" id="lnkNextItem" class="lnkNextItem lnkSibling hide clearLink"><paper-button raised class="subdued notext"><iron-icon icon="arrow-forward"></iron-icon></paper-button></a>
</div>
<div data-role="content">
<div class="detailPageContent">
<div class="detailSection" style="margin-bottom:1.5em;">
<div class="detailSectionContent detailContentEffectedByImage lastDetailContentEffectedByImage">
<div class="detailPageContent" style="position:relative;">
<div class="detailButtonsContainer mobileDetailButtons">
<span class="missingIndicator" style="margin: 0 .5em; display: none;">
<span style="background: #cc3333; padding: 5px 1em; border-radius: 5px;">${LabelMissing}</span>
</span>
<span class="offlineIndicator" style="margin: 0 .5em; display: none;">
<span style="background: #cc3333; padding: 5px 1em; border-radius: 5px;">${LabelOffline}</span>
</span>
<paper-button raised class="secondary btnPlay hide"><iron-icon icon="play-arrow"></iron-icon><span>${ButtonPlay}</span></paper-button>
<paper-button raised class="alt btnPlayTrailer hide"><iron-icon icon="play-arrow"></iron-icon><span>${ButtonPlayTrailer}</span></paper-button>
<a class="btnPlayExternalTrailer hide clearLink" href="#" target="_blank"><paper-button raised class="alt btnPlayExternalTrailer"><iron-icon icon="play-arrow"></iron-icon><span>${ButtonPlayTrailer}</span></paper-button></a>
<paper-button raised class="subdued btnRecord hide"><iron-icon icon="videocam"></iron-icon><span>${ButtonRecord}</span></paper-button>
<paper-button raised class="subdued hide btnCancelRecording"><iron-icon icon="delete"></iron-icon><span>${ButtonCancelRecording}</span></paper-button>
<paper-button raised class="submit btnSync hide"><iron-icon icon="refresh"></iron-icon><span>${ButtonSync}</span></paper-button>
<paper-button raised class="subdued btnShare notext hide" style="background-color:#673AB7"><iron-icon icon="share"></iron-icon></paper-button>
<paper-button raised class="subdued btnMoreCommands forceHide notext"><iron-icon icon="more-vert"></iron-icon></paper-button>
</div>
<p id="artist"></p>
<p class="itemGenres"></p>
<p class="itemOverview smoothScrollY"></p>
<p id="seriesAirTime"></p>
<p class="airDate"></p>
<paper-fab class="btnPlay detailFloatingButton hide" icon="play-arrow" title="${ButtonPlay}"></paper-fab>
<paper-fab class="btnFloatingRecord detailFloatingButton hide" icon="videocam" title="${ButtonRecord}"></paper-fab>
<div class="detailImageContainer">
</div>
<div class="primaryDetailsContainer">
<div class="detailNameContainer">
<div><span class="parentName"></span><span class="itemName inlineItemName"></span></div>
<div class="desktopDetails" style="margin-top:1em;">
<span class="itemMiscInfo"></span>
<span class="itemCommunityRating" style="margin-left:1em;"></span>
</div>
</div>
<div class="desktopDetails">
<div class="detailButtonsContainer" style="padding-top:5px;">
<paper-button raised class="subdued btnPlayTrailer hide"><iron-icon icon="play-arrow"></iron-icon><span>${ButtonPlayTrailer}</span></paper-button>
<a class="btnPlayExternalTrailer hide clearLink" href="#" target="_blank"><paper-button raised class="subdued"><iron-icon icon="play-arrow"></iron-icon><span>${ButtonPlayTrailer}</span></paper-button></a>
<paper-button raised class="subdued btnRecord hide"><iron-icon icon="videocam"></iron-icon><span>${ButtonRecord}</span></paper-button>
<paper-button raised class="subdued hide btnCancelRecording"><iron-icon icon="delete"></iron-icon><span>${ButtonCancelRecording}</span></paper-button>
<paper-button raised class="subdued btnSync hide"><iron-icon icon="refresh"></iron-icon><span>${ButtonSync}</span></paper-button>
<paper-button raised class="subdued btnShare notext hide"><iron-icon icon="share"></iron-icon></paper-button>
<paper-button raised class="subdued btnMoreCommands hide notext"><iron-icon icon="more-vert"></iron-icon></paper-button>
</div>
</div>
</div>
</div>
<div class="mobileDetails" style="text-align:center;clear:both;">
<div style="height:10px;"></div>
<div>
<span class="itemMiscInfo"></span>
<span class="itemCommunityRating" style="margin-left:1em;"></span>
</div>
<div class="detailButtonsContainer">
<br />
<paper-button raised class="subdued btnPlayTrailer hide"><iron-icon icon="play-arrow"></iron-icon><span>${ButtonPlayTrailer}</span></paper-button>
<a class="btnPlayExternalTrailer hide clearLink" href="#" target="_blank"><paper-button raised class="subdued"><iron-icon icon="play-arrow"></iron-icon><span>${ButtonPlayTrailer}</span></paper-button></a>
<paper-button raised class="subdued btnRecord hide"><iron-icon icon="videocam"></iron-icon><span>${ButtonRecord}</span></paper-button>
<paper-button raised class="subdued hide btnCancelRecording"><iron-icon icon="delete"></iron-icon><span>${ButtonCancelRecording}</span></paper-button>
<paper-button raised class="subdued btnSync hide"><iron-icon icon="refresh"></iron-icon><span>${ButtonSync}</span></paper-button>
<paper-button raised class="subdued btnShare notext hide"><iron-icon icon="share"></iron-icon></paper-button>
<paper-button raised class="subdued btnMoreCommands hide notext"><iron-icon icon="more-vert"></iron-icon></paper-button>
</div>
</div>
<div data-role="content" style="padding-top:0;clear:both;">
<div class="detailPageContent">
<div class="detailSection">
<p id="artist"></p>
<p class="itemGenres"></p>
<p class="itemOverview smoothScrollY"></p>
<p id="seriesAirTime"></p>
<p class="airDate"></p>
</div>
<div class="collectionItems"></div>
<div id="childrenCollapsible" class="hide detailSection">
<h1 class="childrenSectionHeader">
@ -130,8 +127,7 @@
<div id="musicVideosContent" class="smallItemsContainer"></div>
</div>
<div id="similarCollapsible" style="display: none;" class="detailSection">
<h1 class="similiarHeader">
</h1>
<h1 class="similiarHeader"></h1>
<div id="similarContent"></div>
</div>
<div id="criticReviewsCollapsible" style="display: none;" class="detailSection">

42
dashboard-ui/livetvchannel.html
View File

@ -1,42 +0,0 @@
<!DOCTYPE html>
<html>
<head>
<title>Emby</title>
</head>
<body>
<div id="liveTvChannelPage" data-role="page" class="page libraryPage liveTvPage noSecondaryNavPage" data-contextname="${HeaderLiveTv}" data-require="scripts/livetvcomponents,scripts/livetvchannel,paperbuttonstyle,livetvcss" data-backbutton="true" data-menubutton="false">
<table class="detailPageContent primaryDetailPageContent">
<tr>
<td style="vertical-align: top; padding: 0 1em 0 0;">
<div id="itemImage" class="itemImageContainer channelImageContainer paddedItemsContainer"></div>
</td>
<td style="vertical-align: top; padding: 0;">
<p><span class="itemName inlineItemName"></span><span class="itemMiscInfo" style="display: inline;"></span></p>
<p style="margin: 1.5em 0;">
<span class="userDataIcons"></span>
</p>
</td>
</tr>
</table>
<div class="detailButtonsContainer">
<span id="playButtonContainer" style="display: none;">
<paper-button raised class="secondary btnPlay"><iron-icon icon="play-arrow"></iron-icon><span>${ButtonPlay}</span></paper-button>
</span>
<span id="editButtonContainer" style="display: none;">
<paper-button raised class="subdued btnEdit"><iron-icon icon="mode-edit"></iron-icon><span>${ButtonEdit}</span></paper-button>
</span>
</div>
<div data-role="content">
<div class="detailPageContent">
<div id="detailSection">
<div class="detailSectionContent" style="padding: 0 0;">
<div id="programList"></div>
</div>
</div>
</div>
</div>
</div>
</body>
</html>

2
dashboard-ui/livetvnewrecording.html
View File

@ -74,7 +74,7 @@
<br />
<div>
<button type="submit" data-role="none" class="clearButton">
<paper-button raised class="submit block" style="background:#cc3333;"><iron-icon icon="check"></iron-icon><span>${ButtonRecord}</span></paper-button>
<paper-button raised class="submit block" style="background:#cc3333;"><iron-icon icon="videocam"></iron-icon><span>${ButtonRecord}</span></paper-button>
</button>
<paper-button raised class="cancel block btnCancel" onclick="history.back();"><iron-icon icon="close"></iron-icon><span>${ButtonCancel}</span></paper-button>

6
dashboard-ui/scripts/connectlogin.js
View File

@ -255,12 +255,6 @@
$('#txtSignupPassword', page).val('');
$('#txtSignupPasswordConfirm', page).val('');
if (AppInfo.isNativeApp) {
$('.skip', page).show();
} else {
$('.skip', page).hide();
}
var link = '<a href="http://emby.media" target="_blank">http://emby.media</a>';
$('.embyIntroDownloadMessage', page).html(Globalize.translate('EmbyIntroDownloadMessage', link));

35
dashboard-ui/scripts/itemdetailpage.js
View File

@ -40,18 +40,22 @@
LibraryBrowser.renderDetailPageBackdrop(page, item);
}
var canPlay = false;
if (item.Type == 'Program') {
var now = new Date();
if (now >= parseISO8601Date(item.StartDate, { toLocal: true }) && now < parseISO8601Date(item.EndDate, { toLocal: true })) {
$('.btnPlay', page).removeClass('hide');
canPlay = true;
} else {
$('.btnPlay', page).addClass('hide');
}
}
else if (MediaController.canPlay(item)) {
$('.btnPlay', page).removeClass('hide');
canPlay = true;
}
else {
$('.btnPlay', page).addClass('hide');
@ -82,9 +86,17 @@
}
if (item.Type == 'Program' && (!item.TimerId && !item.SeriesTimerId)) {
$('.btnRecord', page).removeClass('hide');
if (canPlay) {
$('.btnRecord', page).removeClass('hide');
$('.btnFloatingRecord', page).addClass('hide');
} else {
$('.btnRecord', page).addClass('hide');
$('.btnFloatingRecord', page).removeClass('hide');
}
} else {
$('.btnRecord', page).addClass('hide');
$('.btnFloatingRecord', page).addClass('hide');
}
if (!item.LocalTrailerCount && item.RemoteTrailers.length && item.PlayAccess == 'Full') {
@ -182,7 +194,6 @@
if (userData) {
currentItem.UserData = userData;
renderUserDataIcons(page, currentItem);
Dashboard.getCurrentUser().done(function (user) {
@ -229,7 +240,12 @@
$('.collectionItems', page).empty();
if (item.IsFolder) {
if (item.Type == 'TvChannel') {
$('#childrenCollapsible', page).removeClass('hide');
renderChannelGuide(page, item, user);
}
else if (item.IsFolder) {
if (item.Type == "BoxSet") {
$('#childrenCollapsible', page).addClass('hide');
@ -811,6 +827,15 @@
}
}
function renderChannelGuide(page, item, user) {
require('scripts/livetvcomponents,scripts/livetvchannel,livetvcss'.split(','), function () {
LiveTvChannelPage.renderPrograms(page, item.Id);
});
}
function renderCollectionItems(page, types, items, user) {
for (var i = 0, length = types.length; i < length; i++) {
@ -890,7 +915,7 @@
function renderUserDataIcons(page, item) {
$('.userDataIcons', page).html(LibraryBrowser.getUserDataIconsHtml(item));
$('.userDataIcons', page).html(LibraryBrowser.getUserDataIconsHtml(item, true, 'fab'));
}
function renderCriticReviews(page, item, limit) {
@ -1586,7 +1611,7 @@
});
});
$('.btnRecord', page).on('click', function () {
$('.btnRecord,.btnFloatingRecord', page).on('click', function () {
var id = getParameterByName('id');

117
dashboard-ui/scripts/librarybrowser.js
View File

@ -797,7 +797,7 @@
return "playlistedit.html?id=" + id;
}
if (item.Type == "TvChannel") {
return "livetvchannel.html?id=" + id;
return "itemdetails.html?id=" + id;
}
if (item.Type == "Channel") {
return "channelitems.html?id=" + id;
@ -2501,17 +2501,17 @@
html += '<div class="criticRating" title="Rotten Tomatoes">' + item.CriticRating + '%</div>';
}
if (item.Metascore && metascore !== false) {
//if (item.Metascore && metascore !== false) {
if (item.Metascore >= 60) {
html += '<div class="metascore metascorehigh" title="Metascore">' + item.Metascore + '</div>';
}
else if (item.Metascore >= 40) {
html += '<div class="metascore metascoremid" title="Metascore">' + item.Metascore + '</div>';
} else {
html += '<div class="metascore metascorelow" title="Metascore">' + item.Metascore + '</div>';
}
}
// if (item.Metascore >= 60) {
// html += '<div class="metascore metascorehigh" title="Metascore">' + item.Metascore + '</div>';
// }
// else if (item.Metascore >= 40) {
// html += '<div class="metascore metascoremid" title="Metascore">' + item.Metascore + '</div>';
// } else {
// html += '<div class="metascore metascorelow" title="Metascore">' + item.Metascore + '</div>';
// }
//}
return html;
},
@ -2534,20 +2534,21 @@
return null;
},
getUserDataButtonHtml: function (method, itemId, btnCssClass, icon, tooltip) {
getUserDataButtonHtml: function (method, itemId, btnCssClass, icon, tooltip, style) {
return '<paper-icon-button data-itemid="' + itemId + '" icon="' + icon + '" class="' + btnCssClass + '" onclick="LibraryBrowser.' + method + '(this);return false;"></paper-icon-button>';
var tagName = style == 'fab' ? 'paper-fab' : 'paper-icon-button';
return '<' + tagName + ' title="' + tooltip + '" data-itemid="' + itemId + '" icon="' + icon + '" class="' + btnCssClass + '" onclick="LibraryBrowser.' + method + '(this);return false;"></' + tagName + '>';
},
getUserDataIconsHtml: function (item, includePlayed) {
getUserDataIconsHtml: function (item, includePlayed, style) {
var html = '';
var userData = item.UserData || {};
var itemId = item.Id;
var type = item.Type;
if (includePlayed !== false) {
var tooltipPlayed = Globalize.translate('TooltipPlayed');
@ -2555,37 +2556,37 @@
if (item.MediaType == 'Video' || item.Type == 'Series' || item.Type == 'Season' || item.Type == 'BoxSet' || item.Type == 'Playlist') {
if (item.Type != 'TvChannel') {
if (userData.Played) {
html += LibraryBrowser.getUserDataButtonHtml('markPlayed', itemId, 'btnUserItemRating btnUserItemRatingOn', 'check', tooltipPlayed);
html += LibraryBrowser.getUserDataButtonHtml('markPlayed', itemId, 'btnUserItemRating btnUserItemRatingOn', 'check', tooltipPlayed, style);
} else {
html += LibraryBrowser.getUserDataButtonHtml('markPlayed', itemId, 'btnUserItemRating', 'check', tooltipPlayed);
html += LibraryBrowser.getUserDataButtonHtml('markPlayed', itemId, 'btnUserItemRating', 'check', tooltipPlayed, style);
}
}
}
}
var tooltipLike = Globalize.translate('TooltipLike');
var tooltipDislike = Globalize.translate('TooltipDislike');
//var tooltipLike = Globalize.translate('TooltipLike');
//var tooltipDislike = Globalize.translate('TooltipDislike');
if (typeof userData.Likes == "undefined") {
html += LibraryBrowser.getUserDataButtonHtml('markDislike', itemId, 'btnUserItemRating', 'thumb-down', tooltipDislike);
html += LibraryBrowser.getUserDataButtonHtml('markLike', itemId, 'btnUserItemRating', 'thumb-up', tooltipLike);
}
else if (userData.Likes) {
html += LibraryBrowser.getUserDataButtonHtml('markDislike', itemId, 'btnUserItemRating', 'thumb-down', tooltipDislike);
html += LibraryBrowser.getUserDataButtonHtml('markLike', itemId, 'btnUserItemRating btnUserItemRatingOn', 'thumb-up', tooltipLike);
}
else {
html += LibraryBrowser.getUserDataButtonHtml('markDislike', itemId, 'btnUserItemRating btnUserItemRatingOn', 'thumb-down', tooltipDislike);
html += LibraryBrowser.getUserDataButtonHtml('markLike', itemId, 'btnUserItemRating', 'thumb-up', tooltipLike);
}
//if (typeof userData.Likes == "undefined") {
// html += LibraryBrowser.getUserDataButtonHtml('markDislike', itemId, 'btnUserItemRating', 'thumb-down', tooltipDislike, style);
// html += LibraryBrowser.getUserDataButtonHtml('markLike', itemId, 'btnUserItemRating', 'thumb-up', tooltipLike, style);
//}
//else if (userData.Likes) {
// html += LibraryBrowser.getUserDataButtonHtml('markDislike', itemId, 'btnUserItemRating', 'thumb-down', tooltipDislike, style);
// html += LibraryBrowser.getUserDataButtonHtml('markLike', itemId, 'btnUserItemRating btnUserItemRatingOn', 'thumb-up', tooltipLike, style);
//}
//else {
// html += LibraryBrowser.getUserDataButtonHtml('markDislike', itemId, 'btnUserItemRating btnUserItemRatingOn', 'thumb-down', tooltipDislike, style);
// html += LibraryBrowser.getUserDataButtonHtml('markLike', itemId, 'btnUserItemRating', 'thumb-up', tooltipLike, style);
//}
var tooltipFavorite = Globalize.translate('TooltipFavorite');
if (userData.IsFavorite) {
//var tooltipFavorite = Globalize.translate('TooltipFavorite');
//if (userData.IsFavorite) {
html += LibraryBrowser.getUserDataButtonHtml('markFavorite', itemId, 'btnUserItemRating btnUserItemRatingOn', 'favorite', tooltipFavorite);
} else {
html += LibraryBrowser.getUserDataButtonHtml('markFavorite', itemId, 'btnUserItemRating', 'favorite', tooltipFavorite);
}
// html += LibraryBrowser.getUserDataButtonHtml('markFavorite', itemId, 'btnUserItemRating btnUserItemRatingOn', 'favorite', tooltipFavorite, style);
//} else {
// html += LibraryBrowser.getUserDataButtonHtml('markFavorite', itemId, 'btnUserItemRating', 'favorite', tooltipFavorite, style);
//}
return html;
},
@ -2882,14 +2883,7 @@
}
}
var screenWidth = $(window).width();
// Take a guess about whether we should lazy load or not
if (screenWidth > 600) {
html += "<img class='itemDetailImage' src='" + url + "' />";
} else {
html += "<img class='itemDetailImage lazy' data-src='" + url + "' src='css/images/empty.png' />";
}
html += "<img class='itemDetailImage' src='" + url + "' />";
if (href) {
html += "</a>";
@ -2907,43 +2901,16 @@
elem.innerHTML = html;
function addClass(elems, name) {
for (var i = 0, length = elems.length; i < length; i++) {
elems[i].classList.add(name);
}
}
function removeClass(elems, name) {
for (var i = 0, length = elems.length; i < length; i++) {
elems[i].classList.remove(name);
}
}
var page = $(elem).parents('.page')[0];
var detailContentEffectedByImage = page.querySelectorAll('.detailContentEffectedByImage');
if (shape == 'thumb') {
addClass(detailContentEffectedByImage, 'detailContentEffectedByThumbImage');
removeClass(detailContentEffectedByImage, 'detailContentEffectedBySquareImage');
removeClass(detailContentEffectedByImage, 'detailContentEffectedByPortraitImage');
elem.classList.add('thumbDetailImageContainer');
elem.classList.remove('portraitDetailImageContainer');
elem.classList.remove('squareDetailImageContainer');
}
else if (shape == 'square') {
removeClass(detailContentEffectedByImage, 'detailContentEffectedByThumbImage');
removeClass(detailContentEffectedByImage, 'detailContentEffectedByPortraitImage');
addClass(detailContentEffectedByImage, 'detailContentEffectedBySquareImage');
elem.classList.remove('thumbDetailImageContainer');
elem.classList.remove('portraitDetailImageContainer');
elem.classList.add('squareDetailImageContainer');
} else {
removeClass(detailContentEffectedByImage, 'detailContentEffectedByThumbImage');
removeClass(detailContentEffectedByImage, 'detailContentEffectedBySquareImage');
addClass(detailContentEffectedByImage, 'detailContentEffectedByPortraitImage');
elem.classList.remove('thumbDetailImageContainer');
elem.classList.add('portraitDetailImageContainer');
elem.classList.remove('squareDetailImageContainer');
@ -3138,15 +3105,17 @@
var elem = this;
var overview = item.Overview || '';
elem.innerHTML = overview;
$('a', elem).each(function () {
this.setAttribute("target", "_blank");
});
if (overview) {
elem.innerHTML = overview;
elem.classList.remove('empty');
} else {
elem.innerHTML = '';
elem.classList.add('empty');
}
});

16
dashboard-ui/scripts/librarymenu.js
View File

@ -756,15 +756,15 @@
LibraryMenu.setTitle(Globalize.translate(titleKey));
}
var mainDrawerButton = document.querySelector('.mainDrawerButton');
//var mainDrawerButton = document.querySelector('.mainDrawerButton');
if (mainDrawerButton) {
if (page.getAttribute('data-menubutton') == 'false' && $.browser.mobile) {
mainDrawerButton.classList.add('hide');
} else {
mainDrawerButton.classList.remove('hide');
}
}
//if (mainDrawerButton) {
// if (page.getAttribute('data-menubutton') == 'false' && $.browser.mobile) {
// mainDrawerButton.classList.add('hide');
// } else {
// mainDrawerButton.classList.remove('hide');
// }
//}
if (isLibraryPage) {

89
dashboard-ui/scripts/livetvchannel.js
View File

@ -1,8 +1,5 @@
(function ($, document) {
var currentItem;
var programs;
function renderPrograms(page, result) {
var html = '';
@ -62,13 +59,13 @@
html += '<div class="tvProgramTime">';
if (program.IsLive) {
html += '<span class="liveTvProgram">'+Globalize.translate('LabelLiveProgram')+'&nbsp;&nbsp;</span>';
html += '<span class="liveTvProgram">' + Globalize.translate('LabelLiveProgram') + '&nbsp;&nbsp;</span>';
}
else if (program.IsPremiere) {
html += '<span class="premiereTvProgram">'+Globalize.translate('LabelPremiereProgram')+'&nbsp;&nbsp;</span>';
html += '<span class="premiereTvProgram">' + Globalize.translate('LabelPremiereProgram') + '&nbsp;&nbsp;</span>';
}
else if (program.IsSeries && !program.IsRepeat) {
html += '<span class="newTvProgram">'+Globalize.translate('LabelNewProgram')+'&nbsp;&nbsp;</span>';
html += '<span class="newTvProgram">' + Globalize.translate('LabelNewProgram') + '&nbsp;&nbsp;</span>';
}
var minutes = program.RunTimeTicks / 600000000;
@ -98,94 +95,26 @@
html += '</a>';
}
$('#programList', page).html(html).trigger('create').createGuideHoverMenu('.tvProgramInfo');
$('#childrenContent', page).html(html).trigger('create').createGuideHoverMenu('.tvProgramInfo');
}
function loadPrograms(page) {
function loadPrograms(page, channelId) {
ApiClient.getLiveTvPrograms({
ChannelIds: currentItem.Id,
ChannelIds: channelId,
UserId: Dashboard.getCurrentUserId()
}).done(function (result) {
renderPrograms(page, result);
programs = result.Items;
Dashboard.hideLoadingMsg();
});
}
function reload(page) {
Dashboard.showLoadingMsg();
ApiClient.getLiveTvChannel(getParameterByName('id'), Dashboard.getCurrentUserId()).done(function (item) {
currentItem = item;
var name = item.Name;
$('#itemImage', page).html(LibraryBrowser.getDetailImageHtml(item));
Dashboard.setPageTitle(name);
$('.itemName', page).html(item.Number + ' ' + name);
$('.userDataIcons', page).html(LibraryBrowser.getUserDataIconsHtml(item));
$(page).trigger('displayingitem', [{
item: item,
context: 'livetv'
}]);
Dashboard.getCurrentUser().done(function (user) {
if (MediaController.canPlay(item)) {
$('#playButtonContainer', page).show();
} else {
$('#playButtonContainer', page).hide();
}
if (user.Policy.IsAdministrator && item.LocationType !== "Offline") {
$('#editButtonContainer', page).show();
} else {
$('#editButtonContainer', page).hide();
}
});
loadPrograms(page);
});
}
$(document).on('pageinitdepends', "#liveTvChannelPage", function () {
var page = this;
$('.btnPlay', page).on('click', function () {
var userdata = currentItem.UserData || {};
LibraryBrowser.showPlayMenu(null, currentItem.Id, currentItem.Type, false, currentItem.MediaType, userdata.PlaybackPositionTicks);
});
$('.btnEdit', page).on('click', function () {
Dashboard.navigate("edititemmetadata.html?channelid=" + currentItem.Id);
});
}).on('pagebeforeshowready', "#liveTvChannelPage", function () {
var page = this;
reload(page);
}).on('pagebeforehide', "#liveTvChannelPage", function () {
currentItem = null;
programs = null;
});
window.LiveTvChannelPage = {
renderPrograms: loadPrograms
};
})(jQuery, document);

2
dashboard-ui/scripts/livetvcomponents.js
View File

@ -41,7 +41,7 @@
}
if (obj.ChannelId) {
html.push('<a class="textlink" href="livetvchannel.html?id=' + obj.ChannelId + '">' + obj.ChannelName + '</a>');
html.push('<a class="textlink" href="itemdetails.html?id=' + obj.ChannelId + '">' + obj.ChannelName + '</a>');
}
if (obj.IsHD) {

2
dashboard-ui/scripts/livetvguide.js
View File

@ -285,7 +285,7 @@
html += '<div class="channelHeaderCellContainer">';
html += '<div class="channelHeaderCell">';
html += '<a class="channelHeaderCellInner" href="livetvchannel.html?id=' + channel.Id + '">';
html += '<a class="channelHeaderCellInner" href="itemdetails.html?id=' + channel.Id + '">';
var hasChannelImage = channel.ImageTags.Primary;
var cssClass = hasChannelImage ? 'guideChannelInfo guideChannelInfoWithImage' : 'guideChannelInfo';

2
dashboard-ui/scripts/livetvseriestimer.js
View File

@ -41,7 +41,7 @@
channelHtml += Globalize.translate('LabelAllChannels');
}
else if (item.ChannelId) {
channelHtml += '<a href="livetvchannel.html?id=' + item.ChannelId + '">' + item.ChannelName + '</a>';
channelHtml += '<a href="itemdetails.html?id=' + item.ChannelId + '">' + item.ChannelName + '</a>';
}
$('.channel', page).html(channelHtml).trigger('create');

4
dashboard-ui/scripts/livetvstatus.js
View File

@ -43,7 +43,7 @@
if (tuner.Status == 'RecordingTv') {
if (tuner.ChannelName) {
html += '<a href="livetvchannel.html?id=' + tuner.ChannelId + '">';
html += '<a href="itemdetails.html?id=' + tuner.ChannelId + '">';
html += Globalize.translate('StatusRecordingProgram').replace('{0}', tuner.ChannelName);
html += '</a>';
} else {
@ -55,7 +55,7 @@
if (tuner.ChannelName) {
html += '<a href="livetvchannel.html?id=' + tuner.ChannelId + '">';
html += '<a href="itemdetails.html?id=' + tuner.ChannelId + '">';
html += Globalize.translate('StatusWatchingProgram').replace('{0}', tuner.ChannelName);
html += '</a>';
} else {

6
dashboard-ui/scripts/selectserver.js
View File

@ -398,12 +398,6 @@
} else {
$(page).removeClass('libraryPage').removeClass('noSecondaryNavPage').addClass('standalonePage');
}
if (AppInfo.isNativeApp) {
$('.addServer', page).show();
} else {
$('.addServer', page).hide();
}
}
$(document).on('pageinitdepends pagebeforeshowready', "#selectServerPage", function () {

2
dashboard-ui/selectserver.html
View File

@ -21,7 +21,7 @@
${MessageNoServersAvailableToConnect}
</div>
<div class="addServer" style="margin:1.5em 0;display:none;">
<div class="addServer" style="margin:1.5em 0;">
<a href="connectlogin.html?mode=manualserver" class="clearLink"><paper-button raised class="submit block"><iron-icon icon="add"></iron-icon><span>${ButtonAddServer}</span></paper-button></a>
</div>

3
dashboard-ui/strings/html/server.json
View File

@ -1522,5 +1522,6 @@
"OptionSyncOnlyOnWifi": "Sync only on Wifi",
"OptionSyncLosslessAudioOriginal": "Sync lossless audio at original quality",
"HeaderMetadata": "Metadata",
"HeaderRecordingOptions": "Recording Options"
"HeaderRecordingOptions": "Recording Options",
"ButtonShare": "Share"
}

1
dashboard-ui/thirdparty/emby-icons.html vendored
View File

@ -125,6 +125,7 @@ See [iron-iconset](#iron-iconset) and [iron-iconset-svg](#iron-iconset-svg) for
<g id="repeat"><path d="M7 7h10v3l4-4-4-4v3H5v6h2V7zm10 10H7v-3l-4 4 4 4v-3h12v-6h-2v4z" /></g>
<g id="repeat-one"><path d="M7 7h10v3l4-4-4-4v3H5v6h2V7zm10 10H7v-3l-4 4 4 4v-3h12v-6h-2v4zm-4-2V9h-1l-2 1v1h1.5v4H13z" /></g>
<g id="open-in-browser"><path d="M19 4H5c-1.11 0-2 .9-2 2v12c0 1.1.89 2 2 2h4v-2H5V8h14v10h-4v2h4c1.1 0 2-.9 2-2V6c0-1.1-.89-2-2-2zm-7 6l-4 4h3v6h2v-6h3l-4-4z" /></g>
<g id="cloud-download"><path d="M19.35 10.04C18.67 6.59 15.64 4 12 4 9.11 4 6.6 5.64 5.35 8.04 2.34 8.36 0 10.91 0 14c0 3.31 2.69 6 6 6h13c2.76 0 5-2.24 5-5 0-2.64-2.05-4.78-4.65-4.96zM17 13l-5 5-5-5h3V9h4v4h3z" /></g>
</defs>
</svg>
</iron-iconset-svg>

1
dashboard-ui/vulcanize-out.html
View File

@ -18670,6 +18670,7 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
<g id="repeat"><path d="M7 7h10v3l4-4-4-4v3H5v6h2V7zm10 10H7v-3l-4 4 4 4v-3h12v-6h-2v4z"></path></g>
<g id="repeat-one"><path d="M7 7h10v3l4-4-4-4v3H5v6h2V7zm10 10H7v-3l-4 4 4 4v-3h12v-6h-2v4zm-4-2V9h-1l-2 1v1h1.5v4H13z"></path></g>
<g id="open-in-browser"><path d="M19 4H5c-1.11 0-2 .9-2 2v12c0 1.1.89 2 2 2h4v-2H5V8h14v10h-4v2h4c1.1 0 2-.9 2-2V6c0-1.1-.89-2-2-2zm-7 6l-4 4h3v6h2v-6h3l-4-4z"></path></g>
<g id="cloud-download"><path d="M19.35 10.04C18.67 6.59 15.64 4 12 4 9.11 4 6.6 5.64 5.35 8.04 2.34 8.36 0 10.91 0 14c0 3.31 2.69 6 6 6h13c2.76 0 5-2.24 5-5 0-2.64-2.05-4.78-4.65-4.96zM17 13l-5 5-5-5h3V9h4v4h3z"></path></g>
</defs>
</svg>
</iron-iconset-svg>