summaryrefslogtreecommitdiff
path: root/javascript/videojs/src/js/resize-manager.js
diff options
context:
space:
mode:
Diffstat (limited to 'javascript/videojs/src/js/resize-manager.js')
-rw-r--r--javascript/videojs/src/js/resize-manager.js154
1 files changed, 0 insertions, 154 deletions
diff --git a/javascript/videojs/src/js/resize-manager.js b/javascript/videojs/src/js/resize-manager.js
deleted file mode 100644
index e95a68d..0000000
--- a/javascript/videojs/src/js/resize-manager.js
+++ /dev/null
@@ -1,154 +0,0 @@
-/**
- * @file resize-manager.js
- */
-import window from 'global/window';
-import { debounce } from './utils/fn.js';
-import * as Events from './utils/events.js';
-import { merge } from './utils/obj.js';
-import Component from './component.js';
-
-/**
- * A Resize Manager. It is in charge of triggering `playerresize` on the player in the right conditions.
- *
- * It'll either create an iframe and use a debounced resize handler on it or use the new {@link https://wicg.github.io/ResizeObserver/|ResizeObserver}.
- *
- * If the ResizeObserver is available natively, it will be used. A polyfill can be passed in as an option.
- * If a `playerresize` event is not needed, the ResizeManager component can be removed from the player, see the example below.
- *
- * @example <caption>How to disable the resize manager</caption>
- * const player = videojs('#vid', {
- * resizeManager: false
- * });
- *
- * @see {@link https://wicg.github.io/ResizeObserver/|ResizeObserver specification}
- *
- * @extends Component
- */
-class ResizeManager extends Component {
-
- /**
- * Create the ResizeManager.
- *
- * @param {Object} player
- * The `Player` that this class should be attached to.
- *
- * @param {Object} [options]
- * The key/value store of ResizeManager options.
- *
- * @param {Object} [options.ResizeObserver]
- * A polyfill for ResizeObserver can be passed in here.
- * If this is set to null it will ignore the native ResizeObserver and fall back to the iframe fallback.
- */
- constructor(player, options) {
- let RESIZE_OBSERVER_AVAILABLE = options.ResizeObserver || window.ResizeObserver;
-
- // if `null` was passed, we want to disable the ResizeObserver
- if (options.ResizeObserver === null) {
- RESIZE_OBSERVER_AVAILABLE = false;
- }
-
- // Only create an element when ResizeObserver isn't available
- const options_ = merge({
- createEl: !RESIZE_OBSERVER_AVAILABLE,
- reportTouchActivity: false
- }, options);
-
- super(player, options_);
-
- this.ResizeObserver = options.ResizeObserver || window.ResizeObserver;
- this.loadListener_ = null;
- this.resizeObserver_ = null;
- this.debouncedHandler_ = debounce(() => {
- this.resizeHandler();
- }, 100, false, this);
-
- if (RESIZE_OBSERVER_AVAILABLE) {
- this.resizeObserver_ = new this.ResizeObserver(this.debouncedHandler_);
- this.resizeObserver_.observe(player.el());
-
- } else {
- this.loadListener_ = () => {
- if (!this.el_ || !this.el_.contentWindow) {
- return;
- }
-
- const debouncedHandler_ = this.debouncedHandler_;
- let unloadListener_ = this.unloadListener_ = function() {
- Events.off(this, 'resize', debouncedHandler_);
- Events.off(this, 'unload', unloadListener_);
-
- unloadListener_ = null;
- };
-
- // safari and edge can unload the iframe before resizemanager dispose
- // we have to dispose of event handlers correctly before that happens
- Events.on(this.el_.contentWindow, 'unload', unloadListener_);
- Events.on(this.el_.contentWindow, 'resize', debouncedHandler_);
- };
-
- this.one('load', this.loadListener_);
- }
- }
-
- createEl() {
- return super.createEl('iframe', {
- className: 'vjs-resize-manager',
- tabIndex: -1,
- title: this.localize('No content')
- }, {
- 'aria-hidden': 'true'
- });
- }
-
- /**
- * Called when a resize is triggered on the iframe or a resize is observed via the ResizeObserver
- *
- * @fires Player#playerresize
- */
- resizeHandler() {
- /**
- * Called when the player size has changed
- *
- * @event Player#playerresize
- * @type {Event}
- */
- // make sure player is still around to trigger
- // prevents this from causing an error after dispose
- if (!this.player_ || !this.player_.trigger) {
- return;
- }
-
- this.player_.trigger('playerresize');
- }
-
- dispose() {
- if (this.debouncedHandler_) {
- this.debouncedHandler_.cancel();
- }
-
- if (this.resizeObserver_) {
- if (this.player_.el()) {
- this.resizeObserver_.unobserve(this.player_.el());
- }
- this.resizeObserver_.disconnect();
- }
-
- if (this.loadListener_) {
- this.off('load', this.loadListener_);
- }
-
- if (this.el_ && this.el_.contentWindow && this.unloadListener_) {
- this.unloadListener_.call(this.el_.contentWindow);
- }
-
- this.ResizeObserver = null;
- this.resizeObserver = null;
- this.debouncedHandler_ = null;
- this.loadListener_ = null;
- super.dispose();
- }
-
-}
-
-Component.registerComponent('ResizeManager', ResizeManager);
-export default ResizeManager;