hydrar/mistserver
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Embed: fullscreen api: for iphones, use the fullscreen api of the video element before falling back to filling the webpage

Browse source
This commit is contained in:
Cat 2021-04-21 18:28:55 +02:00 • committed by Thulinma
parent f5033f9d70
commit 561c1a0912
2 changed files with 23 additions and 20 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
embed/min/player.js
View file

File diff suppressed because one or more lines are too long

41
embed/skins.js
View file

@ -1284,29 +1284,32 @@ MistSkins["default"] = {
var MistVideo = this; var MistVideo = this;
//determine which functions to use.. //determine which functions to use..
var requestfuncs = ["requestFullscreen","webkitRequestFullscreen","mozRequestFullScreen","msRequestFullscreen"]; var requestfuncs = ["requestFullscreen","webkitRequestFullscreen","mozRequestFullScreen","msRequestFullscreen","webkitEnterFullscreen"];
var fullscreenableElements = [function(){ return MistVideo.container;},function(){ return MistVideo.video;}]; //if the functions are not available on the container div, try them again on the video element (for iphone)
var funcs = false; var funcs = false;
for (var i in requestfuncs) { main:
if (requestfuncs[i] in document.body) { for (var j in fullscreenableElements) {
funcs = {}; for (var i in requestfuncs) {
funcs.request = function(){ return MistVideo.container[requestfuncs[i]](); } if (requestfuncs[i] in fullscreenableElements[j]()) {
funcs = {};
var cancelfuncs = ["exitFullscreen","webkitCancelFullScreen","mozCancelFullScreen","msExitFullscreen"]; funcs.request = function(){ return funcs.fullscreenableElement()[requestfuncs[i]](); }
var elementfuncs = ["fullscreenElement","webkitFullscreenElement","mozFullScreenElement","msFullscreenElement"];
var eventname = ["fullscreenchange","webkitfullscreenchange","mozfullscreenchange","MSFullscreenChange"]; var cancelfuncs = ["exitFullscreen","webkitCancelFullScreen","mozCancelFullScreen","msExitFullscreen","webkitExitFullscreen"];
funcs.cancel = function() { return document[cancelfuncs[i]](); }; var elementfuncs = ["fullscreenElement","webkitFullscreenElement","mozFullScreenElement","msFullscreenElement","webkitFullscreenElement"];
funcs.element = function() { return document[elementfuncs[i]]; }; var eventname = ["fullscreenchange","webkitfullscreenchange","mozfullscreenchange","MSFullscreenChange","webkitfullscreenchange"];
funcs.event = eventname[i]; funcs.cancel = function() { return document[cancelfuncs[i]](); };
break; funcs.element = function() { return document[elementfuncs[i]]; };
funcs.event = eventname[i];
funcs.fullscreenableElement = fullscreenableElements[j];
break main; //break to the main loop
}
} }
} }
if (!funcs) { if (!funcs) {
//fake fullscreen mode! //fake fullscreen mode!
funcs = { funcs = {
request: "fakeRequestFullScreen", event: "fakefullscreenchange",
cancel: "fakeCancelFullScreen", fullscreenableElement: function (){ return MistVideo.container; },
element: "fakeFullScreenElement",
event: "fakefullscreenchange"
}; };
var keydownfunc = function(e){ var keydownfunc = function(e){
switch (e.key) { switch (e.key) {
@ -1343,8 +1346,8 @@ MistSkins["default"] = {
} }
MistUtil.event.addListener(button,"click",onclick); MistUtil.event.addListener(button,"click",onclick);
MistUtil.event.addListener(MistVideo.video,"dblclick",onclick); MistUtil.event.addListener(MistVideo.video,"dblclick",onclick);
MistUtil.event.addListener(document,funcs.event, function() { MistUtil.event.addListener(document,funcs.event,function() {
if (funcs.element() == MistVideo.container) { if (funcs.element() == funcs.fullscreenableElement()) {
MistVideo.container.setAttribute("data-fullscreen",""); MistVideo.container.setAttribute("data-fullscreen","");
} }
else if (MistVideo.container.hasAttribute("data-fullscreen")) { else if (MistVideo.container.hasAttribute("data-fullscreen")) {