diff --git a/CHANGELOG.md b/CHANGELOG.md index 98aca0de18..5728e36902 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -17,6 +17,7 @@ CHANGELOG * @forbesjo added chrome for PR tests ([view](https://github.com/videojs/video.js/pull/3235)) * @MCGallaspy added vttjs to the self-hosting guide ([view](https://github.com/videojs/video.js/pull/3229)) * @chrisauclair added ARIA region and label to player element ([view](https://github.com/videojs/video.js/pull/3227)) +* @andyearnshaw updated document event handlers to use el.ownerDocument ([view](https://github.com/videojs/video.js/pull/3230)) -------------------- diff --git a/src/js/control-bar/volume-menu-button.js b/src/js/control-bar/volume-menu-button.js index 17b5853564..83879ab5f9 100644 --- a/src/js/control-bar/volume-menu-button.js +++ b/src/js/control-bar/volume-menu-button.js @@ -7,7 +7,6 @@ import Popup from '../popup/popup.js'; import PopupButton from '../popup/popup-button.js'; import MuteToggle from './mute-toggle.js'; import VolumeBar from './volume-control/volume-bar.js'; -import document from 'global/document'; /** * Button for volume popup @@ -132,7 +131,7 @@ class VolumeMenuButton extends PopupButton { handleMouseDown(event) { this.on(['mousemove', 'touchmove'], Fn.bind(this.volumeBar, this.volumeBar.handleMouseMove)); - this.on(document, ['mouseup', 'touchend'], this.handleMouseUp); + this.on(this.el_.ownerDocument, ['mouseup', 'touchend'], this.handleMouseUp); } handleMouseUp(event) { diff --git a/src/js/modal-dialog.js b/src/js/modal-dialog.js index 833b1e329e..cd9ab6c921 100644 --- a/src/js/modal-dialog.js +++ b/src/js/modal-dialog.js @@ -1,8 +1,6 @@ /** * @file modal-dialog.js */ -import document from 'global/document'; - import * as Dom from './utils/dom'; import * as Fn from './utils/fn'; import log from './utils/log'; @@ -175,7 +173,7 @@ class ModalDialog extends Component { } if (this.closeable()) { - this.on(document, 'keydown', Fn.bind(this, this.handleKeyPress)); + this.on(this.el_.ownerDocument, 'keydown', Fn.bind(this, this.handleKeyPress)); } player.controls(false); @@ -221,7 +219,7 @@ class ModalDialog extends Component { } if (this.closeable()) { - this.off(document, 'keydown', Fn.bind(this, this.handleKeyPress)); + this.off(this.el_.ownerDocument, 'keydown', Fn.bind(this, this.handleKeyPress)); } player.controls(true); diff --git a/src/js/slider/slider.js b/src/js/slider/slider.js index ae182b4c05..9bcd77ac8c 100644 --- a/src/js/slider/slider.js +++ b/src/js/slider/slider.js @@ -3,7 +3,6 @@ */ import Component from '../component.js'; import * as Dom from '../utils/dom.js'; -import document from 'global/document'; import assign from 'object.assign'; /** @@ -68,16 +67,18 @@ class Slider extends Component { * @method handleMouseDown */ handleMouseDown(event) { + let doc = this.bar.el_.ownerDocument; + event.preventDefault(); Dom.blockTextSelection(); this.addClass('vjs-sliding'); this.trigger('slideractive'); - this.on(document, 'mousemove', this.handleMouseMove); - this.on(document, 'mouseup', this.handleMouseUp); - this.on(document, 'touchmove', this.handleMouseMove); - this.on(document, 'touchend', this.handleMouseUp); + this.on(doc, 'mousemove', this.handleMouseMove); + this.on(doc, 'mouseup', this.handleMouseUp); + this.on(doc, 'touchmove', this.handleMouseMove); + this.on(doc, 'touchend', this.handleMouseUp); this.handleMouseMove(event); } @@ -95,15 +96,17 @@ class Slider extends Component { * @method handleMouseUp */ handleMouseUp() { + let doc = this.bar.el_.ownerDocument; + Dom.unblockTextSelection(); this.removeClass('vjs-sliding'); this.trigger('sliderinactive'); - this.off(document, 'mousemove', this.handleMouseMove); - this.off(document, 'mouseup', this.handleMouseUp); - this.off(document, 'touchmove', this.handleMouseMove); - this.off(document, 'touchend', this.handleMouseUp); + this.off(doc, 'mousemove', this.handleMouseMove); + this.off(doc, 'mouseup', this.handleMouseUp); + this.off(doc, 'touchmove', this.handleMouseMove); + this.off(doc, 'touchend', this.handleMouseUp); this.update(); } @@ -166,7 +169,7 @@ class Slider extends Component { * @method handleFocus */ handleFocus() { - this.on(document, 'keydown', this.handleKeyPress); + this.on(this.bar.el_.ownerDocument, 'keydown', this.handleKeyPress); } /** @@ -191,7 +194,7 @@ class Slider extends Component { * @method handleBlur */ handleBlur() { - this.off(document, 'keydown', this.handleKeyPress); + this.off(this.bar.el_.ownerDocument, 'keydown', this.handleKeyPress); } /**