mirrors/jellyfin-web
1
0
Fork 0
mirror of https://github.com/jellyfin/jellyfin-web synced 2025-03-30 19:56:21 +00:00
Code Activity

Merge remote-tracking branch 'upstream/master'

Browse source
This commit is contained in:
Tim Hobbs 2014-03-20 13:45:33 -07:00
commit 9d8a2e03ae
8 changed files with 202 additions and 92 deletions
Download patch file Download diff file Expand all files Collapse all files

26
dashboard-ui/css/librarybrowser.css
View file

@ -489,7 +489,6 @@ a.itemTag:hover {
box-shadow: 0px 0 20px #000; box-shadow: 0px 0 20px #000;
border: solid 1px #222; border: solid 1px #222;
margin-top: -20px; margin-top: -20px;
margin-bottom: 5px;
} }
.noBackdrop .itemDetailImage { .noBackdrop .itemDetailImage {
@ -585,6 +584,14 @@ a.itemTag:hover {
overflow: hidden; overflow: hidden;
} }
.lblDetailTab {
font-size: 16px!important;
font-weight: 400!important;
font-family: 'Open Sans';
padding: .5em 1.2em;
border-color: #1f1f1f !important;
}
.editMetadataForm { .editMetadataForm {
max-width: 100%; max-width: 100%;
} }
@ -638,7 +645,7 @@ a.itemTag:hover {
.detailImageProgressContainer { .detailImageProgressContainer {
position: absolute; position: absolute;
bottom: 7px; bottom: 3px;
right: 0; right: 0;
left: 0; left: 0;
text-align: center; text-align: center;
@ -767,7 +774,7 @@ a.itemTag:hover {
display: block; display: block;
} }
.itemBackdrop { .itemBackdrop:not(.noBackdrop) {
border-bottom: 1px solid #111; border-bottom: 1px solid #111;
} }
} }
@ -852,12 +859,15 @@ a.itemTag:hover {
} }
.mediaInfoStream { .mediaInfoStream {
margin: 1em 0; margin: 1em 2em 1em 0;
display: inline-block;
color: #bbb; color: #bbb;
vertical-align: top;
} }
.mediaInfoStreamType { .mediaInfoStreamType {
margin-right: 1em; display: block;
font-size: 16px;
color: #fff; color: #fff;
} }
@ -866,8 +876,8 @@ a.itemTag:hover {
} }
.mediaInfoLabel { .mediaInfoLabel {
color: #bbb; color: #aaa;
margin-right: 3px; margin-right: 1em;
} }
.posterRibbon { .posterRibbon {
@ -1068,7 +1078,7 @@ a.itemTag:hover {
.alphabetPicker { .alphabetPicker {
position: fixed; position: fixed;
right: 2px; right: 2px;
bottom: 10px; bottom: 5px;
width: 27px; width: 27px;
z-index: 1000; z-index: 1000;
text-align: center; text-align: center;

15
dashboard-ui/css/posteritem.css
View file

@ -14,13 +14,6 @@
transition: all 500ms ease; transition: all 500ms ease;
} }
/*.posterItemOverlayTarget {
position: absolute;
right: 0;
top: 50%;
z-index: 999;
}*/
.posterItemOverlayTarget { .posterItemOverlayTarget {
position: absolute; position: absolute;
right: 0; right: 0;
@ -206,6 +199,14 @@
} }
} }
@media all and (max-width: 1200px) {
.portraitPosterItem .posterItemOverlayInner {
padding-left: 7px;
padding-right: 7px;
}
}
@media all and (min-width: 540px) { @media all and (min-width: 540px) {
.backdropPosterItem { .backdropPosterItem {

2
dashboard-ui/episodes.html
View file

@ -24,7 +24,7 @@
<div class="viewControls" data-role="controlgroup" data-type="horizontal"> <div class="viewControls" data-role="controlgroup" data-type="horizontal">
<button data-mini="true" data-icon="sort" data-inline="true" data-iconpos="notext" title="Sort" onclick="$('#sortPanel', $(this).parents('.page')).panel( 'toggle' );">Sort</button> <button data-mini="true" data-icon="sort" data-inline="true" data-iconpos="notext" title="Sort" onclick="$('#sortPanel', $(this).parents('.page')).panel( 'toggle' );">Sort</button>
<button data-mini="true" data-icon="filter" data-inline="true" data-iconpos="notext" title="Filter" onclick="$('#filterPanel', $(this).parents('.page')).panel( 'toggle' );">Filter</button> <button data-mini="true" data-icon="filter" data-inline="true" data-iconpos="notext" title="Filter" onclick="$('#filterPanel', $(this).parents('.page')).panel( 'toggle' );">Filter</button>
<button data-mini="true" data-icon="check" data-inline="true" data-iconpos="notext" title="Select" class="btnToggleSelections">Select</button> <!-- <button data-mini="true" data-icon="check" data-inline="true" data-iconpos="notext" title="Select" class="btnToggleSelections">Select</button>-->
</div> </div>
<div class="listTopPaging"> <div class="listTopPaging">
</div> </div>

102
dashboard-ui/itemdetails.html
View file

@ -112,58 +112,75 @@
</td> </td>
</tr> </tr>
</table> </table>
<div class="detailButtonsContainer">
<span id="missingIndicator" style="margin-left: .5em; display: none;">
<span style="background: #cc3333; padding: 5px 1em; border-radius: 5px;">MISSING</span>
</span>
<span id="offlineIndicator" style="margin-left: .5em; display: none;">
<span style="background: #cc3333; padding: 5px 1em; border-radius: 5px;">OFFLINE</span>
</span>
<span id="playButtonContainer" style="display: none;">
<button id="btnPlay" type="button" data-icon="play" data-inline="true" data-mini="true">Play</button>
</span>
<span id="trailerButtonContainer" style="display: none;">
<button id="btnPlayTrailer" type="button" data-icon="video" data-inline="true" data-mini="true">Trailer</button>
</span>
<span id="externalTrailerButtonContainer" style="display: none;">
<a id="btnPlayExternalTrailer" data-role="button" data-icon="video" data-inline="true" data-mini="true" href="#" target="_blank">Trailer</a>
</span>
<span id="playExternalButtonContainer" style="display: none;">
<a id="btnPlayExternal" data-role="button" data-icon="play" data-inline="true" data-mini="true" href="#" target="_blank">Play</a>
</span>
<span id="remoteButtonContainer" style="display: none;">
<button id="btnRemote" type="button" data-icon="wireless" data-inline="true" data-mini="true">Remote</button>
</span>
<span id="editButtonContainer" style="display: none;">
<a id="btnEdit" data-role="button" data-icon="edit" data-inline="true" data-mini="true" href="#">Edit</a>
</span>
</div>
</div> </div>
<a href="#" id="lnkPreviousItem" class="lnkPreviousItem lnkSibling hide" data-role="button" title="Previous" data-icon="carat-l" data-mini="true" data-inline="true" data-iconpos="notext">Previous</a> <a href="#" id="lnkPreviousItem" class="lnkPreviousItem lnkSibling hide" data-role="button" title="Previous" data-icon="carat-l" data-mini="true" data-inline="true" data-iconpos="notext">Previous</a>
<a href="#" id="lnkNextItem" class="lnkNextItem lnkSibling hide" data-role="button" title="Next" data-icon="carat-r" data-mini="true" data-inline="true" data-iconpos="notext">Next</a> <a href="#" id="lnkNextItem" class="lnkNextItem lnkSibling hide" data-role="button" title="Next" data-icon="carat-r" data-mini="true" data-inline="true" data-iconpos="notext">Next</a>
<p class="itemGenres mobileGenres"></p> <p class="itemGenres mobileGenres"></p>
<p class="itemOverview mobileOverview"></p> <p class="itemOverview mobileOverview"></p>
</div> </div>
<div class="detailButtonsContainer">
<span id="missingIndicator" style="margin-left: .5em; display: none;">
<span style="background: #cc3333; padding: 5px 1em; border-radius: 5px;">MISSING</span>
</span>
<span id="offlineIndicator" style="margin-left: .5em; display: none;">
<span style="background: #cc3333; padding: 5px 1em; border-radius: 5px;">OFFLINE</span>
</span>
<span id="playButtonContainer" style="display: none;">
<button id="btnPlay" type="button" data-icon="play" data-inline="true" data-mini="true">Play</button>
</span>
<span id="trailerButtonContainer" style="display: none;">
<button id="btnPlayTrailer" type="button" data-icon="video" data-inline="true" data-mini="true">Trailer</button>
</span>
<span id="externalTrailerButtonContainer" style="display: none;">
<a id="btnPlayExternalTrailer" data-role="button" data-icon="video" data-inline="true" data-mini="true" href="#" target="_blank">Trailer</a>
</span>
<span id="playExternalButtonContainer" style="display: none;">
<a id="btnPlayExternal" data-role="button" data-icon="play" data-inline="true" data-mini="true" href="#" target="_blank">Play</a>
</span>
<span id="remoteButtonContainer" style="display: none;">
<button id="btnRemote" type="button" data-icon="wireless" data-inline="true" data-mini="true">Remote</button>
</span>
<span id="editButtonContainer" style="display: none;">
<a id="btnEdit" data-role="button" data-icon="edit" data-inline="true" data-mini="true" href="#">Edit</a>
</span>
</div>
<div data-role="content"> <div data-role="content">
<div class="detailPageContent"> <div class="detailPageContent">
<div id="detailsSection" class="detailSection hide"> <div id="detailsSection" class="detailSection hide">
<div class="detailSectionHeader" style="margin-top: 0;">
Details
</div>
<div class="detailSectionContent" style="padding: 0 1em;">
<div id="mediaInfoContent"></div> <br />
<p id="players"></p> <div class="tabButtons"></div>
<p id="seriesAirTime"></p>
<p id="itemPremiereDate"></p> <div class="detailSectionContent" style="padding: 0 .7em;">
<p id="itemBudget"></p>
<p id="itemRevenue"></p> <div class="detailTab tabDetails">
<p class="itemStudios"></p> <p id="players"></p>
<p class="itemExternalLinks"></p> <p id="seriesAirTime"></p>
<p class="itemTags"></p> <p id="itemPremiereDate"></p>
<p id="itemBudget"></p>
<p id="itemRevenue"></p>
<p class="itemExternalLinks"></p>
</div>
<div class="detailTab tabMediaInfo">
<div id="mediaInfoContent"></div>
<div id="alternateVersionsCollapsible" class="detailSection hide">
<div class="detailSectionHeader" style="position: relative;">
Media Versions
<button type="button" class="btnSplitVersions" style="position: absolute; right: 0; top: 6px; margin-top: 0; margin-bottom: 0; display: none;" data-mini="true" data-inline="true" data-icon="delete" data-iconpos="notext" title="Split Versions Apart">Split Versions Apart</button>
</div>
<div id="alternateVersionsContent" class="detailSectionContent"></div>
</div>
</div>
<div class="detailTab tabTags">
<p class="itemStudios"></p>
<p class="itemKeywords"></p>
<p class="itemTags"></p>
</div>
</div> </div>
</div> </div>
<div class="collectionItems"></div> <div class="collectionItems"></div>
<div id="childrenCollapsible" class="hide detailSection"> <div id="childrenCollapsible" class="hide detailSection">
<div class="detailSectionHeader"> <div class="detailSectionHeader">
@ -171,13 +188,6 @@
</div> </div>
<div id="childrenContent" class="detailSectionContent"></div> <div id="childrenContent" class="detailSectionContent"></div>
</div> </div>
<div id="alternateVersionsCollapsible" class="detailSection hide">
<div class="detailSectionHeader" style="position: relative;">
Media Versions
<button type="button" class="btnSplitVersions" style="position: absolute; right: 0; top: 6px; margin-top: 0; margin-bottom: 0; display: none;" data-mini="true" data-inline="true" data-icon="delete" data-iconpos="notext" title="Split Versions Apart">Split Versions Apart</button>
</div>
<div id="alternateVersionsContent" class="detailSectionContent"></div>
</div>
<div id="additionalPartsCollapsible" class="detailSection hide"> <div id="additionalPartsCollapsible" class="detailSection hide">
<div class="detailSectionHeader"> <div class="detailSectionHeader">
Additional Parts Additional Parts

2
dashboard-ui/movies.html
View file

@ -32,7 +32,7 @@
<div class="viewControls" data-role="controlgroup" data-type="horizontal"> <div class="viewControls" data-role="controlgroup" data-type="horizontal">
<button data-mini="true" data-icon="sort" data-inline="true" data-iconpos="notext" title="Sort" onclick="$('#sortPanel', $(this).parents('.page')).panel( 'toggle' );">Sort</button> <button data-mini="true" data-icon="sort" data-inline="true" data-iconpos="notext" title="Sort" onclick="$('#sortPanel', $(this).parents('.page')).panel( 'toggle' );">Sort</button>
<button data-mini="true" data-icon="filter" data-inline="true" data-iconpos="notext" title="Filter" onclick="$('#filterPanel', $(this).parents('.page')).panel( 'toggle' );">Filter</button> <button data-mini="true" data-icon="filter" data-inline="true" data-iconpos="notext" title="Filter" onclick="$('#filterPanel', $(this).parents('.page')).panel( 'toggle' );">Filter</button>
<button data-mini="true" data-icon="check" data-inline="true" data-iconpos="notext" title="Select" class="btnToggleSelections">Select</button> <!-- <button data-mini="true" data-icon="check" data-inline="true" data-iconpos="notext" title="Select" class="btnToggleSelections">Select</button>-->
</div> </div>
<div class="listTopPaging"> <div class="listTopPaging">
</div> </div>

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

@ -312,6 +312,7 @@
} }
renderTags(page, item); renderTags(page, item);
renderKeywords(page, item);
renderSeriesAirTime(page, item, context); renderSeriesAirTime(page, item, context);
@ -327,15 +328,67 @@
$('#artist', page).hide(); $('#artist', page).hide();
} }
var detailsSection = $('#detailsSection', page); renderTabButtons(page, item);
var elem = $('.detailSectionContent', detailsSection)[0]; }
function renderTabButtons(page, item) {
var tabsHtml = '';
var elem = $('.tabDetails', page)[0];
var text = elem.textContent || elem.innerText; var text = elem.textContent || elem.innerText;
if (!text.trim()) { if (text.trim()) {
detailsSection.addClass('hide'); tabsHtml += '<input type="radio" name="radioDetailTab" class="radioDetailTab" id="radioDetails" value="tabDetails">';
} else { tabsHtml += '<label for="radioDetails" class="lblDetailTab">Details</label>';
detailsSection.removeClass('hide');
} }
if (item.MediaType == "Audio" || item.MediaType == "Video") {
tabsHtml += '<input type="radio" name="radioDetailTab" class="radioDetailTab" id="radioMediaInfo" value="tabMediaInfo">';
tabsHtml += '<label for="radioMediaInfo" class="lblDetailTab">Media Info</label>';
}
elem = $('.tabTags', page)[0];
text = elem.textContent || elem.innerText;
if (text.trim()) {
tabsHtml += '<input type="radio" name="radioDetailTab" class="radioDetailTab" id="radioTags" value="tabTags">';
tabsHtml += '<label for="radioTags" class="lblDetailTab">Tags</label>';
}
if (tabsHtml) {
tabsHtml = '<div data-role="controlgroup" data-type="horizontal" data-mini="true" class="detailTabs">' + tabsHtml;
tabsHtml += '</div>';
$('.tabButtons', page).html(tabsHtml).trigger('create');
$('#detailsSection', page).removeClass('hide');
var elems = $('.radioDetailTab', page).on('change', function () {
$('.detailTab', page).hide();
$('.' + this.value, page).show();
});
elems[0].click();
$(elems[0]).trigger('change');
} else {
$('#detailsSection', page).addClass('hide');
$('.tabButtons', page).empty();
}
//var elem = $('.detailSectionContent', detailsSection)[0];
//var text = elem.textContent || elem.innerText;
//if (!text.trim()) {
// detailsSection.addClass('hide');
//} else {
// detailsSection.removeClass('hide');
//}
} }
function getArtistLinksHtml(artists) { function getArtistLinksHtml(artists) {
@ -451,7 +504,7 @@
var options = { var options = {
userId: Dashboard.getCurrentUserId(), userId: Dashboard.getCurrentUserId(),
limit: item.Type == "MusicAlbum" ? 4 : 5, limit: item.Type == "MusicAlbum" ? 4 : 6,
fields: "PrimaryImageAspectRatio,UserData" fields: "PrimaryImageAspectRatio,UserData"
}; };
@ -538,7 +591,7 @@
if (item.Tags && item.Tags.length) { if (item.Tags && item.Tags.length) {
var html = ''; var html = '';
html += '<p>Tags</p>';
for (var i = 0, length = item.Tags.length; i < length; i++) { for (var i = 0, length = item.Tags.length; i < length; i++) {
html += '<div class="itemTag">' + item.Tags[i] + '</div>'; html += '<div class="itemTag">' + item.Tags[i] + '</div>';
@ -552,6 +605,25 @@
} }
} }
function renderKeywords(page, item) {
if (item.Keywords && item.Keywords.length) {
var html = '';
html += '<p>Plot Keywords</p>';
for (var i = 0, length = item.Keywords.length; i < length; i++) {
html += '<div class="itemTag">' + item.Keywords[i] + '</div>';
}
$('.itemKeywords', page).show().html(html);
} else {
$('.itemKeywords', page).hide();
}
}
function renderChildren(page, item, user) { function renderChildren(page, item, user) {
var fields = "ItemCounts,AudioInfo,PrimaryImageAspectRatio"; var fields = "ItemCounts,AudioInfo,PrimaryImageAspectRatio";
@ -1016,52 +1088,69 @@
html += '<div class="mediaInfoStream">'; html += '<div class="mediaInfoStream">';
html += '<span class="mediaInfoStreamType">' + type + ':</span>'; html += '<span class="mediaInfoStreamType">' + type + '</span>';
var attributes = []; var attributes = [];
if (stream.Language && stream.Type != "Video") { if (stream.Language && stream.Type != "Video") {
attributes.push('<span class="mediaInfoAttribute">' + stream.Language + '</span>'); attributes.push('<span class="mediaInfoLabel">Language</span><span class="mediaInfoAttribute">' + stream.Language + '</span>');
} }
if (stream.Codec && stream.Codec != "dca") { if (stream.Codec && stream.Codec != "dca") {
attributes.push('<span class="mediaInfoAttribute">' + stream.Codec.toUpperCase() + '</span>'); attributes.push('<span class="mediaInfoLabel">Codec</span><span class="mediaInfoAttribute">' + stream.Codec.toUpperCase() + '</span>');
} }
if (stream.Profile && stream.Codec == "dca") { if (stream.Profile && stream.Codec == "dca") {
attributes.push('<span class="mediaInfoAttribute">' + stream.Profile.toUpperCase() + '</span>'); attributes.push('<span class="mediaInfoLabel">Codec</span><span class="mediaInfoAttribute">' + stream.Profile.toUpperCase() + '</span>');
}
else if (stream.Profile) {
attributes.push('<span class="mediaInfoLabel">Profile</span><span class="mediaInfoAttribute">' + stream.Profile + '</span>');
}
if (stream.Level) {
attributes.push('<span class="mediaInfoLabel">Level</span><span class="mediaInfoAttribute">' + stream.Level + '</span>');
} }
if (stream.Width || stream.Height) { if (stream.Width || stream.Height) {
attributes.push('<span class="mediaInfoAttribute">' + stream.Width + 'x' + stream.Height + '</span>'); attributes.push('<span class="mediaInfoLabel">Resolution</span><span class="mediaInfoAttribute">' + stream.Width + 'x' + stream.Height + '</span>');
} }
if (stream.AspectRatio && stream.Codec != "mjpeg") { if (stream.AspectRatio && stream.Codec != "mjpeg") {
attributes.push('<span class="mediaInfoAttribute">' + stream.AspectRatio + '</span>'); attributes.push('<span class="mediaInfoLabel">Aspect Ratio</span><span class="mediaInfoAttribute">' + stream.AspectRatio + '</span>');
}
if (type == "Video") {
attributes.push('<span class="mediaInfoLabel">Interlaced</span><span class="mediaInfoAttribute">' + (stream.IsInterlaced ? 'Yes' : 'No') + '</span>');
}
if (stream.AverageFrameRate || stream.RealFrameRate) {
attributes.push('<span class="mediaInfoLabel">Framerate</span><span class="mediaInfoAttribute">' + (stream.AverageFrameRate || stream.RealFrameRate) + '</span>');
} }
if (stream.ChannelLayout) { if (stream.ChannelLayout) {
attributes.push('<span class="mediaInfoAttribute">' + stream.ChannelLayout + '</span>'); attributes.push('<span class="mediaInfoLabel">Layout</span><span class="mediaInfoAttribute">' + stream.ChannelLayout + '</span>');
} }
else if (stream.Channels) { else if (stream.Channels) {
attributes.push('<span class="mediaInfoAttribute">' + stream.Channels + ' ch</span>'); attributes.push('<span class="mediaInfoLabel">Channels</span><span class="mediaInfoAttribute">' + stream.Channels + ' ch</span>');
} }
if (stream.BitRate && stream.Codec != "mjpeg") { if (stream.BitRate && stream.Codec != "mjpeg") {
attributes.push('<span class="mediaInfoAttribute">' + (parseInt(stream.BitRate / 1000)) + ' kbps</span>'); attributes.push('<span class="mediaInfoLabel">Bitrate</span><span class="mediaInfoAttribute">' + (parseInt(stream.BitRate / 1000)) + ' kbps</span>');
} }
if (stream.IsDefault && stream.Type != "Video") { if (stream.SampleRate) {
attributes.push('<span class="mediaInfoAttribute">Default</span>'); attributes.push('<span class="mediaInfoLabel">Sample Rate</span><span class="mediaInfoAttribute">' + stream.SampleRate + ' khz</span>');
}
if (stream.IsForced) {
attributes.push('<span class="mediaInfoAttribute">Forced</span>');
}
if (stream.IsExternal) {
attributes.push('<span class="mediaInfoAttribute">External</span>');
} }
html += attributes.join('&nbsp;&#149;&nbsp;'); if (stream.Type != "Video") {
attributes.push('<span class="mediaInfoLabel">Default</span><span class="mediaInfoAttribute">' + (stream.IsDefault ? 'Yes' : 'No') + '</span>');
}
if (stream.Type == "Subtitle") {
attributes.push('<span class="mediaInfoLabel">Forced</span><span class="mediaInfoAttribute">' + (stream.IsForced ? 'Yes' : 'No') + '</span>');
attributes.push('<span class="mediaInfoLabel">External</span><span class="mediaInfoAttribute">' + (stream.IsExternal ? 'Yes' : 'No') + '</span>');
}
html += attributes.join('<br/>');
html += '</div>'; html += '</div>';
} }
@ -1201,7 +1290,7 @@
} }
if (limit && casts.length > limit) { if (limit && casts.length > limit) {
html += '<p style="margin: .5em 0 0;padding-left: .5em;"><button class="morePeople" data-inline="true" data-mini="true">More ...</button></p>'; html += '<p style="margin: 0;padding-left: .5em;"><button class="morePeople" data-inline="true" data-mini="true">More ...</button></p>';
} }
$('#castContent', page).html(html).trigger('create'); $('#castContent', page).html(html).trigger('create');

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

@ -350,7 +350,7 @@
if (selection.length < 2) { if (selection.length < 2) {
Dashboard.alert({ Dashboard.alert({
message: "Please select two or more items to combine.", message: "Please select two or more items to group together.",
title: "Error" title: "Error"
}); });

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

@ -138,7 +138,7 @@
var deferred = $.Deferred(); var deferred = $.Deferred();
deferred.resolveWith(null, [{ deferred.resolveWith(null, [{
Configuration: {} Configuration: { IsAdministrator: true }
}]); }]);
promise1 = deferred.promise(); promise1 = deferred.promise();