mirror of
https://github.com/jellyfin/jellyfin-web.git
synced 2024-11-18 03:18:19 -07:00
Enable remote "fullscreen" command
This is really only pseudo-fullscreen, as the js fullscreen API doesn't allow fullscreen without user interaction.
This commit is contained in:
parent
689ee461ed
commit
10e282094e
@ -21,27 +21,52 @@
|
||||
var initialVolume;
|
||||
var fullscreenExited = false;
|
||||
var idleState = true;
|
||||
var remoteFullscreen = false;
|
||||
|
||||
self.initVideoPlayer = function () {
|
||||
video = playVideo(item, startPosition, user);
|
||||
return video;
|
||||
};
|
||||
|
||||
self.remoteFullscreen = function () {
|
||||
|
||||
var videoControls = $("#videoControls");
|
||||
|
||||
if (remoteFullscreen) {
|
||||
exitFullScreenToWindow();
|
||||
videoControls.removeClass("inactive");
|
||||
} else {
|
||||
enterFullScreen();
|
||||
videoControls.addClass("inactive");
|
||||
}
|
||||
|
||||
remoteFullscreen = !remoteFullscreen;
|
||||
};
|
||||
|
||||
self.toggleFullscreen = function () {
|
||||
if (self.isFullScreen()) {
|
||||
if (document.cancelFullScreen) { document.cancelFullScreen(); }
|
||||
else if (document.mozCancelFullScreen) { document.mozCancelFullScreen(); }
|
||||
if (document.cancelFullScreen) {
|
||||
document.cancelFullScreen();
|
||||
}
|
||||
else if (document.mozCancelFullScreen) {
|
||||
document.mozCancelFullScreen();
|
||||
}
|
||||
else if (document.webkitExitFullscreen) {
|
||||
document.webkitExitFullscreen();
|
||||
}
|
||||
else if (document.webkitCancelFullScreen) {
|
||||
document.webkitCancelFullScreen();
|
||||
}
|
||||
$('#videoPlayer').removeClass('fullscreenVideo');
|
||||
} else {
|
||||
requestFullScreen(document.body);
|
||||
requestFullScreen(document.documentElement);
|
||||
}
|
||||
};
|
||||
|
||||
self.resetEnhancements = function () {
|
||||
$("#mediaPlayer").hide();
|
||||
$('#videoPlayer').removeClass('fullscreenVideo');
|
||||
$("#videoControls").removeClass("inactive")
|
||||
$("video").remove();
|
||||
$("html").css("cursor", "default");
|
||||
$(".ui-loader").hide();
|
||||
@ -128,7 +153,8 @@
|
||||
}
|
||||
};
|
||||
|
||||
$(document).on('webkitfullscreenchange mozfullscreenchange fullscreenchange', function () {
|
||||
$(document).on('webkitfullscreenchange mozfullscreenchange fullscreenchange', function (e) {
|
||||
|
||||
var videoControls = $('#videoControls');
|
||||
|
||||
$('.itemVideo').off('mousemove keydown scroll', idleHandler);
|
||||
@ -224,14 +250,16 @@
|
||||
};
|
||||
|
||||
function requestFullScreen(element) {
|
||||
|
||||
// Supports most browsers and their versions.
|
||||
var requestMethod = element.requestFullScreen || element.webkitRequestFullScreen || element.mozRequestFullScreen || element.msRequestFullScreen;
|
||||
var requestMethod = element.requestFullscreen || element.webkitRequestFullscreen || element.webkitRequestFullScreen || element.mozRequestFullScreen;
|
||||
|
||||
if (requestMethod) { // Native full screen.
|
||||
requestMethod.call(element);
|
||||
} else {
|
||||
enterFullScreen();
|
||||
}
|
||||
|
||||
};
|
||||
|
||||
function changeHandler(event) {
|
||||
@ -248,6 +276,8 @@
|
||||
|
||||
player.addClass("fullscreenVideo");
|
||||
|
||||
remoteFullscreen = true;
|
||||
|
||||
};
|
||||
|
||||
function exitFullScreenToWindow() {
|
||||
@ -256,6 +286,8 @@
|
||||
|
||||
player.removeClass("fullscreenVideo");
|
||||
|
||||
remoteFullscreen = false;
|
||||
|
||||
};
|
||||
|
||||
function toggleFlyout(flyout, button) {
|
||||
|
@ -842,6 +842,13 @@
|
||||
|
||||
this.isSliding = false;
|
||||
});
|
||||
|
||||
$('.btnFullscreen', popup).on('click', function () {
|
||||
|
||||
var id = $('#selectSession', popup).val();
|
||||
|
||||
ApiClient.sendPlayStateCommand(id, 'Fullscreen');
|
||||
});
|
||||
}
|
||||
|
||||
function getPlaybackHtml() {
|
||||
@ -872,6 +879,7 @@
|
||||
html += '<button class="btnVolumeDown" type="button" data-icon="volume-down" data-inline="true" data-iconpos="notext">Decrease volume</button>';
|
||||
html += '<button class="btnVolumeUp" type="button" data-icon="volume-up" data-inline="true" data-iconpos="notext">Increase volume</button>';
|
||||
html += '<button class="btnToggleMute" type="button" data-icon="volume-off" data-inline="true" data-iconpos="notext">Toggle mute</button>';
|
||||
html += '<button class="btnFullscreen" type="button" data-icon="action" data-inline="true" data-iconpos="notext">Toggle fullscreen</button>';
|
||||
html += '</div>';
|
||||
|
||||
|
||||
|
@ -925,6 +925,9 @@ var Dashboard = {
|
||||
else if (msg.Data.Command === 'PreviousTrack') {
|
||||
MediaPlayer.previousTrack();
|
||||
}
|
||||
else if (msg.Data.Command === 'Fullscreen') {
|
||||
MediaPlayer.remoteFullscreen();
|
||||
}
|
||||
}
|
||||
else if (msg.MessageType === "SystemCommand") {
|
||||
|
||||
|
Loading…
Reference in New Issue
Block a user