web/video.js
1
0
Fork 0
mirror of https://github.com/videojs/video.js.git synced 2025-01-27 11:22:06 +02:00
Code Releases Activity

Close GH-546: Fix for exit-fullscreen bug in 4.0. fixes #497.

Browse Source
This commit is contained in:
Steve Heffernan 2013-05-28 15:29:42 -07:00
parent 8dd88d1626
commit 753ce48e21
5 changed files with 41 additions and 45 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
sandbox/index.html.example
View File

@ -9,6 +9,11 @@
<!-- LOAD VIDEO.JS SOURCE FILES IN ORDER --> <!-- LOAD VIDEO.JS SOURCE FILES IN ORDER -->
<script src="../build/source-loader.js"></script> <script src="../build/source-loader.js"></script>
<!-- Set the location of the flash SWF -->
<script>
vjs.options.flash.swf = '../src/swf/video-js.swf'
</script>
</head> </head>
<body> <body>
<p style="background-color:#eee; border: 1px solid #777; padding: 10px; font-size: .8em; line-height: 1.5em; font-family: Verdana, sans-serif;">You can use /sandbox/ for writing and testing your own code. Nothing in /sandbox/ will get checked into the repo, except files that end in .example, so please don't edit or add those files. To get started make a copy of index.html.example and rename it to index.html.</p> <p style="background-color:#eee; border: 1px solid #777; padding: 10px; font-size: .8em; line-height: 1.5em; font-family: Verdana, sans-serif;">You can use /sandbox/ for writing and testing your own code. Nothing in /sandbox/ will get checked into the repo, except files that end in .example, so please don't edit or add those files. To get started make a copy of index.html.example and rename it to index.html.</p>

5
src/js/events.js
View File

@ -174,7 +174,10 @@ vjs.fixEvent = function(event) {
// which makes copying more difficult. // which makes copying more difficult.
// TODO: Probably best to create a whitelist of event props // TODO: Probably best to create a whitelist of event props
for (var key in old) { for (var key in old) {
event[key] = old[key]; // Safari 6.0.3 warns you if you try to copy deprecated layerX/Y
if (key !== 'layerX' && key !== 'layerY') {
event[key] = old[key];
}
} }
// The event occurred on this element // The event occurred on this element

54
src/js/player.js
View File

@ -392,7 +392,7 @@ vjs.Player.prototype.onError = function(e) {
vjs.log('Video Error', e); vjs.log('Video Error', e);
}; };
vjs.Player.prototype.onFullscreenChange = function(e) { vjs.Player.prototype.onFullscreenChange = function() {
if (this.isFullScreen) { if (this.isFullScreen) {
this.addClass('vjs-fullscreen'); this.addClass('vjs-fullscreen');
} else { } else {
@ -593,7 +593,11 @@ vjs.Player.prototype.requestFullScreen = function(){
// take the controls fullscreen as well as the video // take the controls fullscreen as well as the video
// Trigger fullscreenchange event after change // Trigger fullscreenchange event after change
vjs.on(document, requestFullScreen.eventName, vjs.bind(this, function(){ // We have to specifically add this each time, and remove
// when cancelling fullscreen. Otherwise if there's multiple
// players on a page, they would all be reacting to the same fullscreen
// events
vjs.on(document, requestFullScreen.eventName, vjs.bind(this, function(e){
this.isFullScreen = document[requestFullScreen.isFullScreen]; this.isFullScreen = document[requestFullScreen.isFullScreen];
// If cancelling fullscreen, remove event listener. // If cancelling fullscreen, remove event listener.
@ -601,37 +605,18 @@ vjs.Player.prototype.requestFullScreen = function(){
vjs.off(document, requestFullScreen.eventName, arguments.callee); vjs.off(document, requestFullScreen.eventName, arguments.callee);
} }
this.trigger('fullscreenchange');
})); }));
// Flash and other plugins get reloaded when you take their parent to fullscreen. this.el_[requestFullScreen.requestFn]();
// To fix that we'll remove the tech, and reload it after the resize has finished.
if (this.tech.features.fullscreenResize === false && this.options_['flash']['iFrameMode'] !== true) {
this.pause();
this.unloadTech();
vjs.on(document, requestFullScreen.eventName, vjs.bind(this, function(){
vjs.off(document, requestFullScreen.eventName, arguments.callee);
this.loadTech(this.techName, { src: this.cache_.src });
}));
this.el_[requestFullScreen.requestFn]();
} else {
this.el_[requestFullScreen.requestFn]();
}
this.trigger('fullscreenchange');
} else if (this.tech.supportsFullScreen()) { } else if (this.tech.supportsFullScreen()) {
// we can't take the video.js controls fullscreen but we can go fullscreen // we can't take the video.js controls fullscreen but we can go fullscreen
// with native controls // with native controls
this.techCall('enterFullScreen'); this.techCall('enterFullScreen');
} else { } else {
// fullscreen isn't supported so we'll just stretch the video element to // fullscreen isn't supported so we'll just stretch the video element to
// fill the viewport // fill the viewport
this.enterFullWindow(); this.enterFullWindow();
this.trigger('fullscreenchange'); this.trigger('fullscreenchange');
} }
@ -641,31 +626,11 @@ vjs.Player.prototype.requestFullScreen = function(){
vjs.Player.prototype.cancelFullScreen = function(){ vjs.Player.prototype.cancelFullScreen = function(){
var requestFullScreen = vjs.support.requestFullScreen; var requestFullScreen = vjs.support.requestFullScreen;
this.isFullScreen = false; this.isFullScreen = false;
// Check for browser element fullscreen support // Check for browser element fullscreen support
if (requestFullScreen) { if (requestFullScreen) {
document[requestFullScreen.cancelFn]();
// Flash and other plugins get reloaded when you take their parent to fullscreen.
// To fix that we'll remove the tech, and reload it after the resize has finished.
if (this.tech.features.fullscreenResize === false && this.options_['flash']['iFrameMode'] !== true) {
this.pause();
this.unloadTech();
vjs.on(document, requestFullScreen.eventName, vjs.bind(this, function(){
vjs.off(document, requestFullScreen.eventName, arguments.callee);
this.loadTech(this.techName, { src: this.cache_.src });
}));
document[requestFullScreen.cancelFn]();
} else {
document[requestFullScreen.cancelFn]();
}
this.trigger('fullscreenchange');
} else if (this.tech.supportsFullScreen()) { } else if (this.tech.supportsFullScreen()) {
this.techCall('exitFullScreen'); this.techCall('exitFullScreen');
} else { } else {
@ -920,6 +885,7 @@ vjs.Player.prototype.ended = function(){ return this.techGet('ended'); };
// Current W3C Spec // Current W3C Spec
// http://dvcs.w3.org/hg/fullscreen/raw-file/tip/Overview.html#api // http://dvcs.w3.org/hg/fullscreen/raw-file/tip/Overview.html#api
// Mozilla Draft: https://wiki.mozilla.org/Gecko:FullScreenAPI#fullscreenchange_event // Mozilla Draft: https://wiki.mozilla.org/Gecko:FullScreenAPI#fullscreenchange_event
// New: https://dvcs.w3.org/hg/fullscreen/raw-file/529a67b8d9f3/Overview.html
if (div.cancelFullscreen !== undefined) { if (div.cancelFullscreen !== undefined) {
requestFS.requestFn = 'requestFullscreen'; requestFS.requestFn = 'requestFullscreen';
requestFS.cancelFn = 'exitFullscreen'; requestFS.cancelFn = 'exitFullscreen';

4
test/unit/mediafaker.js
View File

@ -33,6 +33,10 @@ vjs.MediaFaker.prototype.createEl = function(){
vjs.MediaFaker.prototype.currentTime = function(){ return 0; }; vjs.MediaFaker.prototype.currentTime = function(){ return 0; };
vjs.MediaFaker.prototype.volume = function(){ return 0; }; vjs.MediaFaker.prototype.volume = function(){ return 0; };
vjs.MediaFaker.prototype.muted = function(){ return false; }; vjs.MediaFaker.prototype.muted = function(){ return false; };
vjs.MediaFaker.prototype.pause = function(){ return false; };
vjs.MediaFaker.prototype.supportsFullScreen = function(){ return false; };
vjs.MediaFaker.prototype.features = {};
vjs.MediaFaker.prototype.buffered = function(){ return {}; };
// Export vars for Closure Compiler // Export vars for Closure Compiler
vjs['MediaFaker'] = vjs.MediaFaker; vjs['MediaFaker'] = vjs.MediaFaker;

18
test/unit/player.js
View File

@ -250,3 +250,21 @@ test('should set controls and trigger event', function() {
player.dispose(); player.dispose();
}); });
// Can't figure out how to test fullscreen events with tests
// Browsers aren't triggering the events at least
// asyncTest('should trigger the fullscreenchange event', function() {
// expect(3);
// var player = PlayerTest.makePlayer();
// player.on('fullscreenchange', function(){
// ok(true, 'fullscreenchange event fired');
// ok(this.isFullScreen === true, 'isFullScreen is true');
// ok(this.el().className.indexOf('vjs-fullscreen') !== -1, 'vjs-fullscreen class added');
// player.dispose();
// start();
// });
// player.requestFullScreen();
// });