mirror of
https://github.com/videojs/video.js.git
synced 2024-12-02 09:11:54 +02:00
Added fullscreen with controls to supported browsers
This commit is contained in:
parent
ec145f6d4d
commit
08aa73ccf6
@ -25,7 +25,7 @@ body.vjs-full-window {
|
||||
padding: 0; margin: 0;
|
||||
height: 100%; overflow-y: auto; /* Fix for IE6 full-window. http://www.cssplay.co.uk/layouts/fixed.html */
|
||||
}
|
||||
.video-js.vjs-fullscreen {
|
||||
.video-js.vjs-fullscreen, .video-js:-webkit-full-screen {
|
||||
position: fixed; overflow: hidden; z-index: 1000; left: 0; top: 0; bottom: 0; right: 0; width: 100% !important; height: 100% !important;
|
||||
_position: absolute; /* IE6 Full-window (underscore hack) */
|
||||
}
|
||||
|
@ -437,24 +437,28 @@ _V_.Player.prototype.extend({
|
||||
|
||||
// Turn on fullscreen (or window) mode
|
||||
enterFullScreen: function(){
|
||||
if (this.supportsFullScreen()) {
|
||||
this.apiCall("enterFullScreen");
|
||||
} else {
|
||||
this.enterFullWindow();
|
||||
}
|
||||
this.triggerEvent("enterFullScreen");
|
||||
return this;
|
||||
},
|
||||
if (this.supportsFullScreen()) {
|
||||
this.videoIsFullScreen = true;
|
||||
this.apiCall("enterFullScreen");
|
||||
} else {
|
||||
this.enterFullWindow();
|
||||
}
|
||||
this.triggerEvent("enterFullScreen");
|
||||
return this;
|
||||
},
|
||||
|
||||
exitFullScreen: function(){
|
||||
if (true || !this.supportsFullScreen()) {
|
||||
this.exitFullWindow();
|
||||
}
|
||||
this.triggerEvent("exitFullScreen");
|
||||
exitFullScreen: function(){
|
||||
if (this.supportsFullScreen()) {
|
||||
this.videoIsFullScreen = false;
|
||||
this.apiCall("exitFullScreen");
|
||||
} else {
|
||||
this.exitFullWindow();
|
||||
}
|
||||
this.triggerEvent("exitFullScreen");
|
||||
|
||||
// Otherwise Shouldn't be called since native fullscreen uses own controls.
|
||||
return this;
|
||||
},
|
||||
// Otherwise Shouldn't be called since native fullscreen uses own controls.
|
||||
return this;
|
||||
},
|
||||
|
||||
enterFullWindow: function(){
|
||||
this.videoIsFullScreen = true;
|
||||
|
43
src/tech.js
43
src/tech.js
@ -16,7 +16,7 @@ _V_.PlaybackTech = _V_.Component.extend({
|
||||
|
||||
// Create placeholder methods for each that warn when a method
|
||||
// isn't supported by the current playback technology
|
||||
_V_.apiMethods = "play,pause,paused,currentTime,setCurrentTime,duration,buffered,volume,setVolume,muted,setMuted,width,height,supportsFullScreen,enterFullScreen,src,load,currentSrc,preload,setPreload,autoplay,setAutoplay,loop,setLoop,error,networkState,readyState,seeking,initialTime,startOffsetTime,played,seekable,ended,videoTracks,audioTracks,videoWidth,videoHeight,textTracks,defaultPlaybackRate,playbackRate,mediaGroup,controller,controls,defaultMuted".split(",");
|
||||
_V_.apiMethods = "play,pause,paused,currentTime,setCurrentTime,duration,buffered,volume,setVolume,muted,setMuted,width,height,supportsFullScreen,enterFullScreen,exitFullScreen,src,load,currentSrc,preload,setPreload,autoplay,setAutoplay,loop,setLoop,error,networkState,readyState,seeking,initialTime,startOffsetTime,played,seekable,ended,videoTracks,audioTracks,videoWidth,videoHeight,textTracks,defaultPlaybackRate,playbackRate,mediaGroup,controller,controls,defaultMuted".split(",");
|
||||
_V_.each(_V_.apiMethods, function(methodName){
|
||||
_V_.PlaybackTech.prototype[methodName] = function(){
|
||||
throw new Error("The '"+method+"' method is not available on the playback technology's API");
|
||||
@ -128,22 +128,45 @@ _V_.HTML5 = _V_.PlaybackTech.extend({
|
||||
height: function(){ return this.el.offsetHeight; },
|
||||
|
||||
supportsFullScreen: function(){
|
||||
if(typeof this.el.webkitEnterFullScreen == 'function') {
|
||||
if (typeof this.el.webkitRequestFullScreen == 'function') {
|
||||
return true;
|
||||
} else if (typeof this.el.webkitEnterFullScreen == 'function') {
|
||||
|
||||
// Seems to be broken in Chromium/Chrome && Safari in Leopard
|
||||
if (!navigator.userAgent.match("Chrome") && !navigator.userAgent.match("Mac OS X 10.5")) {
|
||||
return true;
|
||||
}
|
||||
}
|
||||
return false;
|
||||
} else {
|
||||
return false;
|
||||
}
|
||||
},
|
||||
enterFullScreen: function(){
|
||||
try {
|
||||
this.el.webkitEnterFullScreen();
|
||||
} catch (e) {
|
||||
if (e.code == 11) {
|
||||
// this.warning(VideoJS.warnings.videoNotReady);
|
||||
_V_.log("VideoJS: Video not ready.")
|
||||
if (typeof this.el.webkitRequestFullScreen == 'function') {
|
||||
try {
|
||||
this.player.el.webkitRequestFullScreen();
|
||||
} catch (e) {
|
||||
if (e.code == 11) {
|
||||
// this.warning(VideoJS.warnings.videoNotReady);
|
||||
_V_.log("VideoJS: Video not ready.")
|
||||
}
|
||||
}
|
||||
} else {
|
||||
try {
|
||||
this.el.webkitEnterFullScreen();
|
||||
} catch (e) {
|
||||
if (e.code == 11) {
|
||||
// this.warning(VideoJS.warnings.videoNotReady);
|
||||
_V_.log("VideoJS: Video not ready.")
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
exitFullScreen: function(){
|
||||
if (typeof this.el.webkitRequestFullScreen == 'function') {
|
||||
document.webkitCancelFullScreen();
|
||||
} else {
|
||||
document.webkitExitFullScreen();
|
||||
}
|
||||
},
|
||||
src: function(src){ this.el.src = src; },
|
||||
|
Loading…
Reference in New Issue
Block a user