diff --git a/src/js/fullscreen-api.js b/src/js/fullscreen-api.js index 0d409e7ab..8a07ee609 100644 --- a/src/js/fullscreen-api.js +++ b/src/js/fullscreen-api.js @@ -64,7 +64,7 @@ const apiMap = [ const specApi = apiMap[0]; let browserApi; -let prefixedAPI = true; +let prefixedAPI = false; // determine the supported set of functions for (let i = 0; i < apiMap.length; i++) { @@ -81,7 +81,7 @@ if (browserApi) { FullscreenApi[specApi[i]] = browserApi[i]; } - prefixedAPI = browserApi[0] !== specApi[0]; + prefixedAPI = browserApi[0] === specApi[0]; } export default FullscreenApi; diff --git a/src/js/player.js b/src/js/player.js index d74f171c2..edd124481 100644 --- a/src/js/player.js +++ b/src/js/player.js @@ -519,15 +519,6 @@ class Player extends Component { this.reportUserActivity(); this.one('play', this.listenForUserActivity_); - - if (FullscreenApi.fullscreenchange) { - this.on(FullscreenApi.fullscreenchange, this.handleFullscreenChange_); - - if (IE_VERSION || browser.IS_FIREFOX && prefixedFS) { - this.on(document, FullscreenApi.fullscreenchange, this.handleFullscreenChange_); - } - } - this.on('stageclick', this.handleStageClick_); this.breakpoints(this.options_.breakpoints); @@ -557,11 +548,6 @@ class Player extends Component { // prevent dispose from being called twice this.off('dispose'); - // make sure to remove fs handler on IE from the document - if (IE_VERSION || browser.IS_FIREFOX && prefixedFS) { - this.off(document, FullscreenApi.fullscreenchange, this.handleFullscreenChange_); - } - if (this.styleEl_ && this.styleEl_.parentNode) { this.styleEl_.parentNode.removeChild(this.styleEl_); this.styleEl_ = null; @@ -1934,29 +1920,14 @@ class Player extends Component { } /** - * Fired when the player switches in or out of fullscreen mode - * * @private - * @listens Player#fullscreenchange - * @listens Player#webkitfullscreenchange - * @listens Player#mozfullscreenchange - * @listens Player#MSFullscreenChange - * @fires Player#fullscreenchange */ - handleFullscreenChange_(event = {}, retriggerEvent = true) { + toggleFullscreenClass_() { if (this.isFullscreen()) { this.addClass('vjs-fullscreen'); } else { this.removeClass('vjs-fullscreen'); } - - if (prefixedFS && retriggerEvent) { - /** - * @event Player#fullscreenchange - * @type {EventTarget~Event} - */ - this.trigger('fullscreenchange'); - } } /** @@ -1970,11 +1941,14 @@ class Player extends Component { // If cancelling fullscreen, remove event listener. if (this.isFullscreen() === false) { Events.off(document, fsApi.fullscreenchange, Fn.bind(this, this.documentFullscreenChange_)); - if (prefixedFS) { - this.handleFullscreenChange_({}, false); - } else { - this.on(FullscreenApi.fullscreenchange, this.handleFullscreenChange_); - } + } + + if (!prefixedFS) { + /** + * @event Player#fullscreenchange + * @type {EventTarget~Event} + */ + this.trigger('fullscreenchange'); } } @@ -1995,6 +1969,7 @@ class Player extends Component { if (data) { this.isFullscreen(data.isFullscreen); } + /** * Fired when going in and out of fullscreen. * @@ -2588,6 +2563,7 @@ class Player extends Component { isFullscreen(isFS) { if (isFS !== undefined) { this.isFullscreen_ = !!isFS; + this.toggleFullscreenClass_(); return; } return !!this.isFullscreen_; @@ -2613,10 +2589,6 @@ class Player extends Component { // the browser supports going fullscreen at the element level so we can // take the controls fullscreen as well as the video - if (!prefixedFS) { - this.off(FullscreenApi.fullscreenchange, this.handleFullscreenChange_); - } - // Trigger fullscreenchange event after change // We have to specifically add this each time, and remove // when canceling fullscreen. Otherwise if there's multiple @@ -2654,8 +2626,6 @@ class Player extends Component { // Check for browser element fullscreen support if (fsApi.requestFullscreen) { - // remove the document level handler if we're getting called directly. - Events.off(document, fsApi.fullscreenchange, Fn.bind(this, this.documentFullscreenChange_)); document[fsApi.exitFullscreen](); } else if (this.tech_.supportsFullScreen()) { this.techCall_('exitFullScreen');