videojs-mobile-ui 0.7.0 → 1.0.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1,68 +1,29 @@
1
- /*! @name videojs-mobile-ui @version 0.7.0 @license MIT */
1
+ /*! @name videojs-mobile-ui @version 1.0.0 @license MIT */
2
2
  (function (global, factory) {
3
- typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = factory(require('video.js'), require('global/window')) :
4
- typeof define === 'function' && define.amd ? define(['video.js', 'global/window'], factory) :
5
- (global = typeof globalThis !== 'undefined' ? globalThis : global || self, global.videojsMobileUi = factory(global.videojs, global.window));
6
- }(this, (function (videojs, window) { 'use strict';
3
+ typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = factory(require('video.js')) :
4
+ typeof define === 'function' && define.amd ? define(['video.js'], factory) :
5
+ (global = typeof globalThis !== 'undefined' ? globalThis : global || self, global.videojsMobileUi = factory(global.videojs));
6
+ }(this, (function (videojs) { 'use strict';
7
7
 
8
8
  function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
9
9
 
10
10
  var videojs__default = /*#__PURE__*/_interopDefaultLegacy(videojs);
11
- var window__default = /*#__PURE__*/_interopDefaultLegacy(window);
12
11
 
13
- var version = "0.7.0";
12
+ var version = "1.0.0";
14
13
 
15
- function createCommonjsModule(fn, basedir, module) {
16
- return module = {
17
- path: basedir,
18
- exports: {},
19
- require: function (path, base) {
20
- return commonjsRequire(path, (base === undefined || base === null) ? module.path : base);
21
- }
22
- }, fn(module, module.exports), module.exports;
23
- }
24
-
25
- function commonjsRequire () {
26
- throw new Error('Dynamic requires are not currently supported by @rollup/plugin-commonjs');
27
- }
28
-
29
- var setPrototypeOf = createCommonjsModule(function (module) {
30
- function _setPrototypeOf(o, p) {
31
- module.exports = _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) {
32
- o.__proto__ = p;
33
- return o;
34
- };
35
-
36
- module.exports["default"] = module.exports, module.exports.__esModule = true;
37
- return _setPrototypeOf(o, p);
38
- }
39
-
40
- module.exports = _setPrototypeOf;
41
- module.exports["default"] = module.exports, module.exports.__esModule = true;
42
- });
43
-
44
- var inheritsLoose = createCommonjsModule(function (module) {
45
- function _inheritsLoose(subClass, superClass) {
46
- subClass.prototype = Object.create(superClass.prototype);
47
- subClass.prototype.constructor = subClass;
48
- setPrototypeOf(subClass, superClass);
49
- }
50
-
51
- module.exports = _inheritsLoose;
52
- module.exports["default"] = module.exports, module.exports.__esModule = true;
53
- });
14
+ /**
15
+ * @file touchOverlay.js
16
+ * Touch UI component
17
+ */
18
+ const Component = videojs__default['default'].getComponent('Component');
19
+ const dom = videojs__default['default'].dom || videojs__default['default'];
54
20
 
55
- var Component = videojs__default['default'].getComponent('Component');
56
- var dom = videojs__default['default'].dom || videojs__default['default'];
57
21
  /**
58
22
  * The `TouchOverlay` is an overlay to capture tap events.
59
23
  *
60
24
  * @extends Component
61
25
  */
62
-
63
- var TouchOverlay = /*#__PURE__*/function (_Component) {
64
- inheritsLoose(TouchOverlay, _Component);
65
-
26
+ class TouchOverlay extends Component {
66
27
  /**
67
28
  * Creates an instance of the this class.
68
29
  *
@@ -72,46 +33,80 @@
72
33
  * @param {Object} [options]
73
34
  * The key/value store of player options.
74
35
  */
75
- function TouchOverlay(player, options) {
76
- var _this;
77
-
78
- _this = _Component.call(this, player, options) || this;
79
- _this.seekSeconds = options.seekSeconds;
80
- _this.tapTimeout = options.tapTimeout; // Add play toggle overlay
81
-
82
- _this.addChild('playToggle', {}); // Clear overlay when playback starts or with control fade
83
-
84
-
85
- player.on(['playing', 'userinactive'], function (e) {
86
- _this.removeClass('show-play-toggle');
87
- }); // A 0 inactivity timeout won't work here
36
+ constructor(player, options) {
37
+ super(player, options);
38
+ this.seekSeconds = options.seekSeconds;
39
+ this.tapTimeout = options.tapTimeout;
40
+ this.taps = 0;
41
+
42
+ // Add play toggle overlay
43
+ this.addChild('playToggle', {});
44
+
45
+ // Clear overlay when playback starts or with control fade
46
+ player.on(['playing', 'userinactive'], e => {
47
+ this.removeClass('show-play-toggle');
48
+ });
88
49
 
89
- if (_this.player_.options_.inactivityTimeout === 0) {
90
- _this.player_.options_.inactivityTimeout = 5000;
50
+ // A 0 inactivity timeout won't work here
51
+ if (this.player_.options_.inactivityTimeout === 0) {
52
+ this.player_.options_.inactivityTimeout = 5000;
91
53
  }
92
54
 
93
- _this.enable();
55
+ /**
56
+ * Debounced tap handler.
57
+ * Seeks number of (taps - 1) * configured seconds to skip.
58
+ * One tap is a non-op
59
+ *
60
+ * @param {Event} event
61
+ */
62
+ this.handleTaps_ = videojs__default['default'].fn.debounce(event => {
63
+ const increment = (this.taps - 1) * this.seekSeconds;
64
+ this.taps = 0;
65
+ if (increment < 1) {
66
+ return;
67
+ }
68
+ const rect = this.el_.getBoundingClientRect();
69
+ const x = event.changedTouches[0].clientX - rect.left;
70
+
71
+ // Check if double tap is in left or right area
72
+ if (x < rect.width * 0.4) {
73
+ this.player_.currentTime(Math.max(0, this.player_.currentTime() - increment));
74
+ this.addClass('reverse');
75
+ } else if (x > rect.width - rect.width * 0.4) {
76
+ this.player_.currentTime(Math.min(this.player_.duration(), this.player_.currentTime() + increment));
77
+ this.removeClass('reverse');
78
+ } else {
79
+ return;
80
+ }
81
+
82
+ // Remove play toggle if showing
83
+ this.removeClass('show-play-toggle');
94
84
 
95
- return _this;
85
+ // Remove and readd class to trigger animation
86
+ this.setAttribute('data-skip-text', `${increment} ${this.localize('seconds')}`);
87
+ this.removeClass('skip');
88
+ window.requestAnimationFrame(() => {
89
+ this.addClass('skip');
90
+ });
91
+ }, this.tapTimeout);
92
+ this.enable();
96
93
  }
94
+
97
95
  /**
98
96
  * Builds the DOM element.
99
97
  *
100
98
  * @return {Element}
101
99
  * The DOM element.
102
100
  */
103
-
104
-
105
- var _proto = TouchOverlay.prototype;
106
-
107
- _proto.createEl = function createEl() {
108
- var el = dom.createEl('div', {
101
+ createEl() {
102
+ const el = dom.createEl('div', {
109
103
  className: 'vjs-touch-overlay',
110
104
  // Touch overlay is not tabbable.
111
105
  tabIndex: -1
112
106
  });
113
107
  return el;
114
108
  }
109
+
115
110
  /**
116
111
  * Debounces to either handle a delayed single tap, or a double tap
117
112
  *
@@ -119,110 +114,44 @@
119
114
  * The touch event
120
115
  *
121
116
  */
122
- ;
123
-
124
- _proto.handleTap = function handleTap(event) {
125
- var _this2 = this;
126
-
117
+ handleTap(event) {
127
118
  // Don't handle taps on the play button
128
119
  if (event.target !== this.el_) {
129
120
  return;
130
121
  }
131
-
132
122
  event.preventDefault();
133
-
134
- if (this.firstTapCaptured) {
135
- this.firstTapCaptured = false;
136
-
137
- if (this.timeout) {
138
- window__default['default'].clearTimeout(this.timeout);
139
- }
140
-
141
- this.handleDoubleTap(event);
142
- } else {
143
- this.firstTapCaptured = true;
144
- this.timeout = window__default['default'].setTimeout(function () {
145
- _this2.firstTapCaptured = false;
146
-
147
- _this2.handleSingleTap(event);
148
- }, this.tapTimeout);
123
+ this.taps += 1;
124
+ if (this.taps === 1) {
125
+ this.removeClass('skip');
126
+ this.toggleClass('show-play-toggle');
149
127
  }
128
+ this.handleTaps_(event);
150
129
  }
151
- /**
152
- * Toggles display of play toggle
153
- *
154
- * @param {Event} event
155
- * The touch event
156
- *
157
- */
158
- ;
159
130
 
160
- _proto.handleSingleTap = function handleSingleTap(event) {
161
- this.removeClass('skip');
162
- this.toggleClass('show-play-toggle');
163
- }
164
- /**
165
- * Seeks by configured number of seconds if left or right part of video double tapped
166
- *
167
- * @param {Event} event
168
- * The touch event
169
- *
170
- */
171
- ;
172
-
173
- _proto.handleDoubleTap = function handleDoubleTap(event) {
174
- var _this3 = this;
175
-
176
- var rect = this.el_.getBoundingClientRect();
177
- var x = event.changedTouches[0].clientX - rect.left; // Check if double tap is in left or right area
178
-
179
- if (x < rect.width * 0.4) {
180
- this.player_.currentTime(Math.max(0, this.player_.currentTime() - this.seekSeconds));
181
- this.addClass('reverse');
182
- } else if (x > rect.width - rect.width * 0.4) {
183
- this.player_.currentTime(Math.min(this.player_.duration(), this.player_.currentTime() + this.seekSeconds));
184
- this.removeClass('reverse');
185
- } else {
186
- return;
187
- } // Remove play toggle if showing
188
-
189
-
190
- this.removeClass('show-play-toggle'); // Remove and readd class to trigger animation
191
-
192
- this.removeClass('skip');
193
- window__default['default'].requestAnimationFrame(function () {
194
- _this3.addClass('skip');
195
- });
196
- }
197
131
  /**
198
132
  * Enables touch handler
199
133
  */
200
- ;
201
-
202
- _proto.enable = function enable() {
134
+ enable() {
203
135
  this.firstTapCaptured = false;
204
136
  this.on('touchend', this.handleTap);
205
137
  }
138
+
206
139
  /**
207
140
  * Disables touch handler
208
141
  */
209
- ;
210
-
211
- _proto.disable = function disable() {
142
+ disable() {
212
143
  this.off('touchend', this.handleTap);
213
- };
214
-
215
- return TouchOverlay;
216
- }(Component);
217
-
144
+ }
145
+ }
218
146
  Component.registerComponent('TouchOverlay', TouchOverlay);
219
147
 
220
- var defaults = {
148
+ // Default options for the plugin.
149
+ const defaults = {
221
150
  fullscreen: {
222
151
  enterOnRotate: true,
223
152
  exitOnRotate: true,
224
153
  lockOnRotate: true,
225
- iOS: false,
154
+ lockToLandscapeOnEnter: false,
226
155
  disabled: false
227
156
  },
228
157
  touchControls: {
@@ -232,37 +161,32 @@
232
161
  disabled: false
233
162
  }
234
163
  };
235
- var screen = window__default['default'].screen;
164
+ const screen = window.screen;
165
+
236
166
  /**
237
167
  * Gets 'portrait' or 'lanscape' from the two orientation APIs
238
168
  *
239
169
  * @return {string} orientation
240
170
  */
241
-
242
- var getOrientation = function getOrientation() {
243
- if (screen) {
171
+ const getOrientation = () => {
172
+ if (window.screen) {
244
173
  // Prefer the string over angle, as 0° can be landscape on some tablets
245
- var orientationString = ((screen.orientation || {}).type || screen.mozOrientation || screen.msOrientation || '').split('-')[0];
246
-
174
+ const orientationString = ((window.screen.orientation || {}).type || window.screen.mozOrientation || window.screen.msOrientation || '').split('-')[0];
247
175
  if (orientationString === 'landscape' || orientationString === 'portrait') {
248
176
  return orientationString;
249
177
  }
250
- } // iOS only supports window.orientation
251
-
178
+ }
252
179
 
253
- if (typeof window__default['default'].orientation === 'number') {
254
- if (window__default['default'].orientation === 0 || window__default['default'].orientation === 180) {
180
+ // iOS only supports window.orientation
181
+ if (typeof window.orientation === 'number') {
182
+ if (window.orientation === 0 || window.orientation === 180) {
255
183
  return 'portrait';
256
184
  }
257
-
258
185
  return 'landscape';
259
186
  }
260
-
261
187
  return 'portrait';
262
- }; // Cross-compatibility for Video.js 5 and 6.
263
-
188
+ };
264
189
 
265
- var registerPlugin = videojs__default['default'].registerPlugin || videojs__default['default'].plugin;
266
190
  /**
267
191
  * Add UI and event listeners
268
192
  *
@@ -273,59 +197,30 @@
273
197
  * @param {Object} [options={}]
274
198
  * A plain object containing options for the plugin.
275
199
  */
276
-
277
- var onPlayerReady = function onPlayerReady(player, options) {
200
+ const onPlayerReady = (player, options) => {
278
201
  player.addClass('vjs-mobile-ui');
279
-
280
- if (options.fullscreen.iOS) {
281
- videojs__default['default'].log.warn('videojs-mobile-ui: `fullscreen.iOS` is deprecated. Use Video.js option `preferFullWindow` instead.');
282
-
283
- if (videojs__default['default'].browser.IS_IOS && videojs__default['default'].browser.IOS_VERSION > 9 && !player.el_.ownerDocument.querySelector('.bc-iframe')) {
284
- player.tech_.el_.setAttribute('playsinline', 'playsinline');
285
-
286
- player.tech_.supportsFullScreen = function () {
287
- return false;
288
- };
289
- }
290
- }
291
-
292
202
  if (!options.touchControls.disabled) {
293
203
  if (options.touchControls.disableOnEnd || typeof player.endscreen === 'function') {
294
204
  player.addClass('vjs-mobile-ui-disable-end');
295
- } // Insert before the control bar
296
-
297
-
298
- var controlBarIdx;
299
- var versionParts = videojs__default['default'].VERSION.split('.');
300
- var major = parseInt(versionParts[0], 10);
301
- var minor = parseInt(versionParts[1], 10); // Video.js < 7.7.0 doesn't account for precedding components that don't have elements
302
-
303
- if (major < 7 || major === 7 && minor < 7) {
304
- controlBarIdx = Array.prototype.indexOf.call(player.el_.children, player.getChild('ControlBar').el_);
305
- } else {
306
- controlBarIdx = player.children_.indexOf(player.getChild('ControlBar'));
307
205
  }
308
206
 
207
+ // Insert before the control bar
208
+ const controlBarIdx = player.children_.indexOf(player.getChild('ControlBar'));
309
209
  player.touchOverlay = player.addChild('TouchOverlay', options.touchControls, controlBarIdx);
310
210
  }
311
-
312
211
  if (options.fullscreen.disabled) {
313
212
  return;
314
213
  }
315
-
316
- var locked = false;
317
-
318
- var rotationHandler = function rotationHandler() {
319
- var currentOrientation = getOrientation();
320
-
214
+ let locked = false;
215
+ const rotationHandler = () => {
216
+ const currentOrientation = getOrientation();
321
217
  if (currentOrientation === 'landscape' && options.fullscreen.enterOnRotate) {
322
218
  if (player.paused() === false) {
323
219
  player.requestFullscreen();
324
-
325
- if (options.fullscreen.lockOnRotate && screen.orientation && screen.orientation.lock) {
326
- screen.orientation.lock('landscape').then(function () {
220
+ if ((options.fullscreen.lockOnRotate || options.fullscreen.lockToLandscapeOnEnter) && screen.orientation && screen.orientation.lock) {
221
+ screen.orientation.lock('landscape').then(() => {
327
222
  locked = true;
328
- }).catch(function (e) {
223
+ }).catch(e => {
329
224
  videojs__default['default'].log('Browser refused orientation lock:', e);
330
225
  });
331
226
  }
@@ -336,36 +231,40 @@
336
231
  }
337
232
  }
338
233
  };
339
-
340
234
  if (options.fullscreen.enterOnRotate || options.fullscreen.exitOnRotate) {
341
235
  if (videojs__default['default'].browser.IS_IOS) {
342
- window__default['default'].addEventListener('orientationchange', rotationHandler);
343
- player.on('dispose', function () {
344
- window__default['default'].removeEventListener('orientationchange', rotationHandler);
236
+ window.addEventListener('orientationchange', rotationHandler);
237
+ player.on('dispose', () => {
238
+ window.removeEventListener('orientationchange', rotationHandler);
345
239
  });
346
240
  } else if (screen.orientation) {
347
241
  // addEventListener('orientationchange') is not a user interaction on Android
348
242
  screen.orientation.onchange = rotationHandler;
349
- player.on('dispose', function () {
243
+ player.on('dispose', () => {
350
244
  screen.orientation.onchange = null;
351
245
  });
352
246
  }
353
-
354
- player.on('fullscreenchange', function (_) {
355
- if (!player.isFullscreen() && locked) {
356
- screen.orientation.unlock();
357
- locked = false;
358
- }
359
- });
360
247
  }
361
-
362
- player.on('ended', function (_) {
248
+ player.on('fullscreenchange', _ => {
249
+ if (player.isFullscreen() && options.fullscreen.lockToLandscapeOnEnter && getOrientation() === 'portrait') {
250
+ screen.orientation.lock('landscape').then(() => {
251
+ locked = true;
252
+ }).catch(e => {
253
+ videojs__default['default'].log('Browser refused orientation lock:', e);
254
+ });
255
+ } else if (!player.isFullscreen() && locked) {
256
+ screen.orientation.unlock();
257
+ locked = false;
258
+ }
259
+ });
260
+ player.on('ended', _ => {
363
261
  if (locked === true) {
364
262
  screen.orientation.unlock();
365
263
  locked = false;
366
264
  }
367
265
  });
368
266
  };
267
+
369
268
  /**
370
269
  * A video.js plugin.
371
270
  *
@@ -386,6 +285,9 @@
386
285
  * Whether to leave fullscreen when rotating to portrait (if not locked)
387
286
  * @param {boolean} [options.fullscreen.lockOnRotate=true]
388
287
  * Whether to lock orientation when rotating to landscape
288
+ * Unlocked when exiting fullscreen or on 'ended
289
+ * @param {boolean} [options.fullscreen.lockToLandscapeOnEnter=false]
290
+ * Whether to always lock orientation to landscape on fullscreen mode
389
291
  * Unlocked when exiting fullscreen or on 'ended'
390
292
  * @param {boolean} [options.fullscreen.iOS=false]
391
293
  * Deprecated: Whether to disable iOS's native fullscreen so controls can work
@@ -401,25 +303,18 @@
401
303
  * Whether to disable when the video ends (e.g., if there is an endscreen)
402
304
  * Never shows if the endscreen plugin is present
403
305
  */
404
-
405
-
406
- var mobileUi = function mobileUi(options) {
407
- var _this = this;
408
-
409
- if (options === void 0) {
410
- options = {};
411
- }
412
-
306
+ const mobileUi = function (options = {}) {
413
307
  if (options.forceForTesting || videojs__default['default'].browser.IS_ANDROID || videojs__default['default'].browser.IS_IOS) {
414
- this.ready(function () {
415
- onPlayerReady(_this, videojs__default['default'].mergeOptions(defaults, options));
308
+ this.ready(() => {
309
+ onPlayerReady(this, videojs__default['default'].obj.merge(defaults, options));
416
310
  });
417
311
  }
418
- }; // Register the plugin with video.js.
419
-
312
+ };
420
313
 
421
- registerPlugin('mobileUi', mobileUi); // Include the version number.
314
+ // Register the plugin with video.js.
315
+ videojs__default['default'].registerPlugin('mobileUi', mobileUi);
422
316
 
317
+ // Include the version number.
423
318
  mobileUi.VERSION = version;
424
319
 
425
320
  return mobileUi;
@@ -1,2 +1,2 @@
1
- /*! @name videojs-mobile-ui @version 0.7.0 @license MIT */
2
- !function(e,t){"object"==typeof exports&&"undefined"!=typeof module?module.exports=t(require("video.js"),require("global/window")):"function"==typeof define&&define.amd?define(["video.js","global/window"],t):(e="undefined"!=typeof globalThis?globalThis:e||self).videojsMobileUi=t(e.videojs,e.window)}(this,(function(e,t){"use strict";function n(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var o=n(e),i=n(t);function r(e,t,n){return e(n={path:t,exports:{},require:function(e,t){return function(){throw new Error("Dynamic requires are not currently supported by @rollup/plugin-commonjs")}(null==t&&n.path)}},n.exports),n.exports}var a=r((function(e){function t(n,o){return e.exports=t=Object.setPrototypeOf||function(e,t){return e.__proto__=t,e},e.exports.default=e.exports,e.exports.__esModule=!0,t(n,o)}e.exports=t,e.exports.default=e.exports,e.exports.__esModule=!0})),l=r((function(e){e.exports=function(e,t){e.prototype=Object.create(t.prototype),e.prototype.constructor=e,a(e,t)},e.exports.default=e.exports,e.exports.__esModule=!0})),s=o.default.getComponent("Component"),u=o.default.dom||o.default,d=function(e){function t(t,n){var o;return(o=e.call(this,t,n)||this).seekSeconds=n.seekSeconds,o.tapTimeout=n.tapTimeout,o.addChild("playToggle",{}),t.on(["playing","userinactive"],(function(e){o.removeClass("show-play-toggle")})),0===o.player_.options_.inactivityTimeout&&(o.player_.options_.inactivityTimeout=5e3),o.enable(),o}l(t,e);var n=t.prototype;return n.createEl=function(){return u.createEl("div",{className:"vjs-touch-overlay",tabIndex:-1})},n.handleTap=function(e){var t=this;e.target===this.el_&&(e.preventDefault(),this.firstTapCaptured?(this.firstTapCaptured=!1,this.timeout&&i.default.clearTimeout(this.timeout),this.handleDoubleTap(e)):(this.firstTapCaptured=!0,this.timeout=i.default.setTimeout((function(){t.firstTapCaptured=!1,t.handleSingleTap(e)}),this.tapTimeout)))},n.handleSingleTap=function(e){this.removeClass("skip"),this.toggleClass("show-play-toggle")},n.handleDoubleTap=function(e){var t=this,n=this.el_.getBoundingClientRect(),o=e.changedTouches[0].clientX-n.left;if(o<.4*n.width)this.player_.currentTime(Math.max(0,this.player_.currentTime()-this.seekSeconds)),this.addClass("reverse");else{if(!(o>n.width-.4*n.width))return;this.player_.currentTime(Math.min(this.player_.duration(),this.player_.currentTime()+this.seekSeconds)),this.removeClass("reverse")}this.removeClass("show-play-toggle"),this.removeClass("skip"),i.default.requestAnimationFrame((function(){t.addClass("skip")}))},n.enable=function(){this.firstTapCaptured=!1,this.on("touchend",this.handleTap)},n.disable=function(){this.off("touchend",this.handleTap)},t}(s);s.registerComponent("TouchOverlay",d);var c={fullscreen:{enterOnRotate:!0,exitOnRotate:!0,lockOnRotate:!0,iOS:!1,disabled:!1},touchControls:{seekSeconds:10,tapTimeout:300,disableOnEnd:!1,disabled:!1}},f=i.default.screen,p=o.default.registerPlugin||o.default.plugin,h=function(e,t){if(e.addClass("vjs-mobile-ui"),t.fullscreen.iOS&&(o.default.log.warn("videojs-mobile-ui: `fullscreen.iOS` is deprecated. Use Video.js option `preferFullWindow` instead."),o.default.browser.IS_IOS&&o.default.browser.IOS_VERSION>9&&!e.el_.ownerDocument.querySelector(".bc-iframe")&&(e.tech_.el_.setAttribute("playsinline","playsinline"),e.tech_.supportsFullScreen=function(){return!1})),!t.touchControls.disabled){var n;(t.touchControls.disableOnEnd||"function"==typeof e.endscreen)&&e.addClass("vjs-mobile-ui-disable-end");var r=o.default.VERSION.split("."),a=parseInt(r[0],10),l=parseInt(r[1],10);n=a<7||7===a&&l<7?Array.prototype.indexOf.call(e.el_.children,e.getChild("ControlBar").el_):e.children_.indexOf(e.getChild("ControlBar")),e.touchOverlay=e.addChild("TouchOverlay",t.touchControls,n)}if(!t.fullscreen.disabled){var s=!1,u=function(){var n=function(){if(f){var e=((f.orientation||{}).type||f.mozOrientation||f.msOrientation||"").split("-")[0];if("landscape"===e||"portrait"===e)return e}return"number"==typeof i.default.orientation?0===i.default.orientation||180===i.default.orientation?"portrait":"landscape":"portrait"}();"landscape"===n&&t.fullscreen.enterOnRotate?!1===e.paused()&&(e.requestFullscreen(),t.fullscreen.lockOnRotate&&f.orientation&&f.orientation.lock&&f.orientation.lock("landscape").then((function(){s=!0})).catch((function(e){o.default.log("Browser refused orientation lock:",e)}))):"portrait"===n&&t.fullscreen.exitOnRotate&&!s&&e.isFullscreen()&&e.exitFullscreen()};(t.fullscreen.enterOnRotate||t.fullscreen.exitOnRotate)&&(o.default.browser.IS_IOS?(i.default.addEventListener("orientationchange",u),e.on("dispose",(function(){i.default.removeEventListener("orientationchange",u)}))):f.orientation&&(f.orientation.onchange=u,e.on("dispose",(function(){f.orientation.onchange=null}))),e.on("fullscreenchange",(function(t){!e.isFullscreen()&&s&&(f.orientation.unlock(),s=!1)}))),e.on("ended",(function(e){!0===s&&(f.orientation.unlock(),s=!1)}))}},m=function(e){var t=this;void 0===e&&(e={}),(e.forceForTesting||o.default.browser.IS_ANDROID||o.default.browser.IS_IOS)&&this.ready((function(){h(t,o.default.mergeOptions(c,e))}))};return p("mobileUi",m),m.VERSION="0.7.0",m}));
1
+ /*! @name videojs-mobile-ui @version 1.0.0 @license MIT */
2
+ !function(e,t){"object"==typeof exports&&"undefined"!=typeof module?module.exports=t(require("video.js")):"function"==typeof define&&define.amd?define(["video.js"],t):(e="undefined"!=typeof globalThis?globalThis:e||self).videojsMobileUi=t(e.videojs)}(this,(function(e){"use strict";function t(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var n=t(e);const o=n.default.getComponent("Component"),i=n.default.dom||n.default;o.registerComponent("TouchOverlay",class extends o{constructor(e,t){super(e,t),this.seekSeconds=t.seekSeconds,this.tapTimeout=t.tapTimeout,this.taps=0,this.addChild("playToggle",{}),e.on(["playing","userinactive"],(e=>{this.removeClass("show-play-toggle")})),0===this.player_.options_.inactivityTimeout&&(this.player_.options_.inactivityTimeout=5e3),this.handleTaps_=n.default.fn.debounce((e=>{const t=(this.taps-1)*this.seekSeconds;if(this.taps=0,t<1)return;const n=this.el_.getBoundingClientRect(),o=e.changedTouches[0].clientX-n.left;if(o<.4*n.width)this.player_.currentTime(Math.max(0,this.player_.currentTime()-t)),this.addClass("reverse");else{if(!(o>n.width-.4*n.width))return;this.player_.currentTime(Math.min(this.player_.duration(),this.player_.currentTime()+t)),this.removeClass("reverse")}this.removeClass("show-play-toggle"),this.setAttribute("data-skip-text",`${t} ${this.localize("seconds")}`),this.removeClass("skip"),window.requestAnimationFrame((()=>{this.addClass("skip")}))}),this.tapTimeout),this.enable()}createEl(){return i.createEl("div",{className:"vjs-touch-overlay",tabIndex:-1})}handleTap(e){e.target===this.el_&&(e.preventDefault(),this.taps+=1,1===this.taps&&(this.removeClass("skip"),this.toggleClass("show-play-toggle")),this.handleTaps_(e))}enable(){this.firstTapCaptured=!1,this.on("touchend",this.handleTap)}disable(){this.off("touchend",this.handleTap)}});const s={fullscreen:{enterOnRotate:!0,exitOnRotate:!0,lockOnRotate:!0,lockToLandscapeOnEnter:!1,disabled:!1},touchControls:{seekSeconds:10,tapTimeout:300,disableOnEnd:!1,disabled:!1}},a=window.screen,r=()=>{if(window.screen){const e=((window.screen.orientation||{}).type||window.screen.mozOrientation||window.screen.msOrientation||"").split("-")[0];if("landscape"===e||"portrait"===e)return e}return"number"==typeof window.orientation?0===window.orientation||180===window.orientation?"portrait":"landscape":"portrait"},l=function(e={}){(e.forceForTesting||n.default.browser.IS_ANDROID||n.default.browser.IS_IOS)&&this.ready((()=>{((e,t)=>{if(e.addClass("vjs-mobile-ui"),!t.touchControls.disabled){(t.touchControls.disableOnEnd||"function"==typeof e.endscreen)&&e.addClass("vjs-mobile-ui-disable-end");const n=e.children_.indexOf(e.getChild("ControlBar"));e.touchOverlay=e.addChild("TouchOverlay",t.touchControls,n)}if(t.fullscreen.disabled)return;let o=!1;const i=()=>{const i=r();"landscape"===i&&t.fullscreen.enterOnRotate?!1===e.paused()&&(e.requestFullscreen(),(t.fullscreen.lockOnRotate||t.fullscreen.lockToLandscapeOnEnter)&&a.orientation&&a.orientation.lock&&a.orientation.lock("landscape").then((()=>{o=!0})).catch((e=>{n.default.log("Browser refused orientation lock:",e)}))):"portrait"===i&&t.fullscreen.exitOnRotate&&!o&&e.isFullscreen()&&e.exitFullscreen()};(t.fullscreen.enterOnRotate||t.fullscreen.exitOnRotate)&&(n.default.browser.IS_IOS?(window.addEventListener("orientationchange",i),e.on("dispose",(()=>{window.removeEventListener("orientationchange",i)}))):a.orientation&&(a.orientation.onchange=i,e.on("dispose",(()=>{a.orientation.onchange=null})))),e.on("fullscreenchange",(i=>{e.isFullscreen()&&t.fullscreen.lockToLandscapeOnEnter&&"portrait"===r()?a.orientation.lock("landscape").then((()=>{o=!0})).catch((e=>{n.default.log("Browser refused orientation lock:",e)})):!e.isFullscreen()&&o&&(a.orientation.unlock(),o=!1)})),e.on("ended",(e=>{!0===o&&(a.orientation.unlock(),o=!1)}))})(this,n.default.obj.merge(s,e))}))};return n.default.registerPlugin("mobileUi",l),l.VERSION="1.0.0",l}));