1
0
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:
Josh Pickett 2011-12-01 15:38:15 -08:00
parent ec145f6d4d
commit 08aa73ccf6
3 changed files with 54 additions and 27 deletions

View File

@ -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) */
}

View File

@ -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;

View File

@ -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; },