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

add short overview

This commit is contained in:
Luke Pulverenti 2014-06-25 11:12:39 -04:00
parent bb5f0a002b
commit d01c2a0ba9
7 changed files with 43 additions and 32 deletions

View file

@ -15,9 +15,7 @@
#videoPlayer { #videoPlayer {
z-index: 99997; z-index: 99997;
background-color: #1d1d1d;
position: fixed; position: fixed;
border: 1px solid #333;
top: 50%; top: 50%;
left: 50%; left: 50%;
margin-left: -170px; margin-left: -170px;
@ -26,20 +24,21 @@
.itemVideo { .itemVideo {
background-color: #000; background-color: #000;
margin: 5px 5px 75px; margin: 0 0 70px;
width: 320px; width: 320px;
height: 181px; height: 181px;
} }
#videoControls { #videoControls {
z-index: 99999; z-index: 99999;
padding: 0 5px 5px; padding: 0 5px 0;
height: 75px; height: 75px;
position: absolute; position: absolute;
top: auto; top: auto;
right: 0; right: 0;
bottom: 0; bottom: 0;
left: 0; left: 0;
background-color: #222;
} }
#videoControls .positionSliderContainer .ui-slider-track { #videoControls .positionSliderContainer .ui-slider-track {

View file

@ -44,7 +44,7 @@
</div> </div>
</div> </div>
<div data-role="popup" class="ui-content popupSubtitleViewer" data-history="false"> <div data-role="popup" class="ui-content popupSubtitleViewer">
<a href="#" data-rel="back" data-role="button" class="ui-btn ui-corner-all ui-shadow ui-btn-b ui-icon-delete ui-btn-icon-notext ui-btn-right">Close</a> <a href="#" data-rel="back" data-role="button" class="ui-btn ui-corner-all ui-shadow ui-btn-b ui-icon-delete ui-btn-icon-notext ui-btn-right">Close</a>
<div class="subtitleViewerContent"> <div class="subtitleViewerContent">
<pre class="subtitleContent" style="margin: 0; border-radius: 0;"></pre> <pre class="subtitleContent" style="margin: 0; border-radius: 0;"></pre>

View file

@ -128,11 +128,11 @@
</div> </div>
</div> </div>
<div data-role="popup" id="popupAudioTrackMenu" data-history="false" data-transition="flip"> <div data-role="popup" id="popupAudioTrackMenu" data-transition="flip">
<div class="trackList"></div> <div class="trackList"></div>
</div> </div>
<div data-role="popup" id="popupSubtitleTrackMenu" data-history="false" data-transition="flip"> <div data-role="popup" id="popupSubtitleTrackMenu" data-transition="flip">
<div class="trackList"></div> <div class="trackList"></div>
</div> </div>

View file

@ -45,9 +45,7 @@
Dashboard.getCurrentUser().done(function (user) { Dashboard.getCurrentUser().done(function (user) {
var imageHref = user.Configuration.IsAdministrator ? "edititemimages.html?id=" + item.Id : ""; renderImage(page, item, user);
$('#itemImage', page).html(LibraryBrowser.getDetailImageHtml(item, imageHref));
setInitialCollapsibleState(page, item, context, user); setInitialCollapsibleState(page, item, context, user);
renderDetails(page, item, context); renderDetails(page, item, context);
@ -141,6 +139,13 @@
Dashboard.hideLoadingMsg(); Dashboard.hideLoadingMsg();
} }
function renderImage(page, item, user) {
var imageHref = user.Configuration.IsAdministrator ? "edititemimages.html?id=" + item.Id : "";
$('#itemImage', page).html(LibraryBrowser.getDetailImageHtml(item, imageHref));
}
function onWebSocketMessage(e, data) { function onWebSocketMessage(e, data) {
var msg = data; var msg = data;
@ -158,8 +163,14 @@
})[0]; })[0];
if (userData) { if (userData) {
currentItem.UserData = userData; currentItem.UserData = userData;
renderUserDataIcons(page, currentItem); renderUserDataIcons(page, currentItem);
Dashboard.getCurrentUser().done(function (user) {
renderImage(page, currentItem, user);
});
} }
} }
} }
@ -879,6 +890,7 @@
} }
function renderUserDataIcons(page, item) { function renderUserDataIcons(page, item) {
$('.userDataIcons', page).html(LibraryBrowser.getUserDataIconsHtml(item)); $('.userDataIcons', page).html(LibraryBrowser.getUserDataIconsHtml(item));
} }

View file

@ -301,10 +301,10 @@
$('.playFlyout').popup("close").remove(); $('.playFlyout').popup("close").remove();
var html = '<div data-role="popup" class="playFlyout" style="max-width:300px;" data-theme="a" data-history="false">'; var html = '<div data-role="popup" class="playFlyout" data-transition="fade" data-history="false">';
html += '<ul data-role="listview" style="min-width: 150px;">'; html += '<ul data-role="listview" style="min-width: 180px;">';
html += '<li data-role="list-divider" data-theme="b">Play Menu</li>'; html += '<li data-role="list-divider">Play Menu</li>';
html += '<li><a href="#" onclick="MediaController.play(\'' + itemId + '\');LibraryBrowser.closePlayMenu();">Play</a></li>'; html += '<li><a href="#" onclick="MediaController.play(\'' + itemId + '\');LibraryBrowser.closePlayMenu();">Play</a></li>';
@ -334,7 +334,7 @@
$(this).off("popupafterclose").remove(); $(this).off("popupafterclose").remove();
}).parents(".ui-popup-container").css("margin-left", 100).css("margin-top", 35); }).parents(".ui-popup-container").css("margin-left", 55);
}, },
closePlayMenu: function () { closePlayMenu: function () {

View file

@ -104,13 +104,15 @@
self.showQualityFlyout = function () { self.showQualityFlyout = function () {
var flyout = $('#video-qualityFlyout'); var flyout = $('.video-qualityFlyout');
if (!flyout.is(':visible')) { if (!flyout.is(':visible')) {
flyout.html(getQualityFlyoutHtml()).scrollTop(0); flyout.html(getQualityFlyoutHtml()).scrollTop(0);
} }
toggleFlyout(flyout, '#video-qualityButton'); toggleFlyout(flyout, '.video-qualityButton');
//$('.videoQualityPopup').html(getQualityFlyoutHtml()).trigger('create').popup('open');
}; };
self.showChaptersFlyout = function () { self.showChaptersFlyout = function () {
@ -311,7 +313,7 @@
hideFlyout($('#video-subtitleFlyout')); hideFlyout($('#video-subtitleFlyout'));
}); });
$('#video-qualityFlyout').on('click', '.mediaFlyoutOption', function () { $('.video-qualityFlyout').on('click', '.mediaFlyoutOption', function () {
if (!$(this).hasClass('selectedMediaFlyoutOption')) { if (!$(this).hasClass('selectedMediaFlyoutOption')) {
@ -327,7 +329,7 @@
}); });
} }
hideFlyout($('#video-qualityFlyout')); hideFlyout($('.video-qualityFlyout'));
}); });
var trackChange = false; var trackChange = false;
@ -359,12 +361,9 @@
tooltip.remove(); tooltip.remove();
}); });
$(".mediaFlyoutContainer").on("click", "a", function (e) { $('.video-qualityButton').on('click', function () {
if (confirm("This option will close the video player. Proceed?")) {
self.stop(); self.showQualityFlyout();
} else {
e.preventDefault();
}
}); });
}); });
@ -1003,7 +1002,7 @@
var videoElement = $('#videoElement', mediaPlayerContainer).prepend(html); var videoElement = $('#videoElement', mediaPlayerContainer).prepend(html);
$('#video-qualityButton', videoControls).show(); $('.video-qualityButton', videoControls).show();
if (mediaStreams.filter(function (s) { if (mediaStreams.filter(function (s) {
return s.Type == "Audio"; return s.Type == "Audio";

View file

@ -1250,17 +1250,18 @@ $(function () {
videoPlayerHtml += '</div>'; // video-basic-controls videoPlayerHtml += '</div>'; // video-basic-controls
videoPlayerHtml += '<div id="video-advanced-controls">'; videoPlayerHtml += '<div id="video-advanced-controls">';
videoPlayerHtml += '<button onclick="MediaPlayer.showQualityFlyout();" id="video-qualityButton" class="mediaButton qualityButton" title="Quality" type="button" data-icon="gear" data-iconpos="notext" data-inline="true">Quality</button>'; videoPlayerHtml += '<button class="mediaButton video-qualityButton" title="Quality" type="button" data-icon="gear" data-iconpos="notext" data-inline="true">Quality</button>';
videoPlayerHtml += '<div class="mediaFlyoutContainer"><div id="video-qualityFlyout" style="display:none;" class="mediaPlayerFlyout"></div></div>'; //videoPlayerHtml += '<div data-role="popup" class="videoQualityPopup videoPlayerPopup" data-transition="flip"></div>';
videoPlayerHtml += '<div style="display:none;" id="video-qualityFlyout" class="video-qualityFlyout mediaPlayerFlyout"></div>';
videoPlayerHtml += '<button onclick="MediaPlayer.showAudioTracksFlyout();" id="video-audioTracksButton" class="imageButton mediaButton audioTracksButton" title="Audio tracks" type="button" data-icon="audiocd" data-iconpos="notext" data-inline="true">Audio Tracks</button>'; videoPlayerHtml += '<button onclick="MediaPlayer.showAudioTracksFlyout();" id="video-audioTracksButton" class="imageButton mediaButton audioTracksButton" title="Audio tracks" type="button" data-icon="audiocd" data-iconpos="notext" data-inline="true">Audio Tracks</button>';
videoPlayerHtml += '<div class="mediaFlyoutContainer"><div id="video-audioTracksFlyout" style="display:none;" class="mediaPlayerFlyout audioTracksFlyout"></div></div>'; videoPlayerHtml += '<div id="video-audioTracksFlyout" style="display:none;" class="mediaPlayerFlyout audioTracksFlyout"></div>';
videoPlayerHtml += '<button onclick="MediaPlayer.showSubtitleMenu();" id="video-subtitleButton" class="imageButton mediaButton subtitleButton" title="Subtitles" type="button" data-icon="subtitles" data-iconpos="notext" data-inline="true">Subtitles</button>'; videoPlayerHtml += '<button onclick="MediaPlayer.showSubtitleMenu();" id="video-subtitleButton" class="imageButton mediaButton subtitleButton" title="Subtitles" type="button" data-icon="subtitles" data-iconpos="notext" data-inline="true">Subtitles</button>';
videoPlayerHtml += '<div class="mediaFlyoutContainer"><div id="video-subtitleFlyout" style="display:none;" class="mediaPlayerFlyout subtitleFlyout"></div></div>'; videoPlayerHtml += '<div id="video-subtitleFlyout" style="display:none;" class="mediaPlayerFlyout subtitleFlyout"></div>';
videoPlayerHtml += '<button onclick="MediaPlayer.showChaptersFlyout();" id="video-chaptersButton" class="mediaButton chaptersButton" title="Scenes" type="button" data-icon="video" data-iconpos="notext" data-inline="true">Scenes</button>'; videoPlayerHtml += '<button onclick="MediaPlayer.showChaptersFlyout();" id="video-chaptersButton" class="mediaButton chaptersButton" title="Scenes" type="button" data-icon="video" data-iconpos="notext" data-inline="true">Scenes</button>';
videoPlayerHtml += '<div class="mediaFlyoutContainer"><div id="video-chaptersFlyout" style="display:none;" class="mediaPlayerFlyout chaptersFlyout"></div></div>'; videoPlayerHtml += '<div id="video-chaptersFlyout" style="display:none;" class="mediaPlayerFlyout chaptersFlyout"></div>';
videoPlayerHtml += '<button onclick="MediaPlayer.toggleFullscreen();" id="video-fullscreenButton" class="mediaButton fullscreenButton" title="Fullscreen" type="button" data-icon="expand" data-iconpos="notext" data-inline="true">Fullscreen</button>'; videoPlayerHtml += '<button onclick="MediaPlayer.toggleFullscreen();" id="video-fullscreenButton" class="mediaButton fullscreenButton" title="Fullscreen" type="button" data-icon="expand" data-iconpos="notext" data-inline="true">Fullscreen</button>';