videojs-mobile-ui 0.7.0 → 0.9.0-beta.3

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.
Files changed (45) hide show
  1. package/README.md +114 -46
  2. package/dist/videojs-mobile-ui.cjs.js +275 -223
  3. package/dist/videojs-mobile-ui.css +2 -2
  4. package/dist/videojs-mobile-ui.es.js +270 -217
  5. package/dist/videojs-mobile-ui.js +278 -265
  6. package/dist/videojs-mobile-ui.min.js +2 -2
  7. package/docs/api/TouchOverlay.html +964 -0
  8. package/docs/api/fonts/OpenSans-Bold-webfont.eot +0 -0
  9. package/docs/api/fonts/OpenSans-Bold-webfont.svg +1830 -0
  10. package/docs/api/fonts/OpenSans-Bold-webfont.woff +0 -0
  11. package/docs/api/fonts/OpenSans-BoldItalic-webfont.eot +0 -0
  12. package/docs/api/fonts/OpenSans-BoldItalic-webfont.svg +1830 -0
  13. package/docs/api/fonts/OpenSans-BoldItalic-webfont.woff +0 -0
  14. package/docs/api/fonts/OpenSans-Italic-webfont.eot +0 -0
  15. package/docs/api/fonts/OpenSans-Italic-webfont.svg +1830 -0
  16. package/docs/api/fonts/OpenSans-Italic-webfont.woff +0 -0
  17. package/docs/api/fonts/OpenSans-Light-webfont.eot +0 -0
  18. package/docs/api/fonts/OpenSans-Light-webfont.svg +1831 -0
  19. package/docs/api/fonts/OpenSans-Light-webfont.woff +0 -0
  20. package/docs/api/fonts/OpenSans-LightItalic-webfont.eot +0 -0
  21. package/docs/api/fonts/OpenSans-LightItalic-webfont.svg +1835 -0
  22. package/docs/api/fonts/OpenSans-LightItalic-webfont.woff +0 -0
  23. package/docs/api/fonts/OpenSans-Regular-webfont.eot +0 -0
  24. package/docs/api/fonts/OpenSans-Regular-webfont.svg +1831 -0
  25. package/docs/api/fonts/OpenSans-Regular-webfont.woff +0 -0
  26. package/docs/api/global.html +957 -0
  27. package/docs/api/index.html +159 -0
  28. package/docs/api/plugin.js.html +221 -0
  29. package/docs/api/scripts/linenumber.js +25 -0
  30. package/docs/api/scripts/prettify/Apache-License-2.0.txt +202 -0
  31. package/docs/api/scripts/prettify/lang-css.js +2 -0
  32. package/docs/api/scripts/prettify/prettify.js +28 -0
  33. package/docs/api/styles/jsdoc-default.css +358 -0
  34. package/docs/api/styles/prettify-jsdoc.css +111 -0
  35. package/docs/api/styles/prettify-tomorrow.css +132 -0
  36. package/docs/api/swipeFullscreen.js.html +173 -0
  37. package/docs/api/touchOverlay.js.html +211 -0
  38. package/index.html +206 -65
  39. package/package.json +19 -16
  40. package/src/plugin.css +21 -3
  41. package/src/plugin.js +32 -59
  42. package/src/swipeFullscreen.js +117 -0
  43. package/src/touchOverlay.js +62 -56
  44. package/test/plugin.test.js +128 -20
  45. package/test/swipeFullscreen.test.js +365 -0
@@ -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 0.9.0-beta.3 @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 s=n.default.getComponent("Component"),i=n.default.dom||n.default;s.registerComponent("TouchOverlay",class extends s{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_=((e,t)=>{let n=null;return(...s)=>{window.clearTimeout(n),n=window.setTimeout(()=>{e.apply(null,s)},t)}})(e=>{const t=(this.taps-1)*this.seekSeconds;if(this.taps=0,t<1)return;const n=this.el_.getBoundingClientRect(),s=e.changedTouches[0].clientX-n.left;if(s<.4*n.width)this.player_.currentTime(Math.max(0,this.player_.currentTime()-t)),this.addClass("reverse");else{if(!(s>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.cancelable&&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 o={fullscreen:{enterOnRotate:!0,exitOnRotate:!0,lockOnRotate:!0,lockToLandscapeOnEnter:!1,swipeToFullscreen:!1,swipeFromFullscreen:!1,disabled:!1},touchControls:{seekSeconds:10,tapTimeout:300,disableOnEnd:!1,disabled:!1}},l=window.screen,r=n.default.registerPlugin||n.default.plugin,a=()=>{if(l){const e=((l.orientation||{}).type||l.mozOrientation||l.msOrientation||"").split("-")[0];if("landscape"===e||"portrait"===e)return e}return"number"==typeof window.orientation?0===window.orientation||180===window.orientation?"portrait":"landscape":"portrait"},c=(e,t)=>{if(e.addClass("vjs-mobile-ui"),!t.touchControls.disabled){let s;(t.touchControls.disableOnEnd||"function"==typeof e.endscreen)&&e.addClass("vjs-mobile-ui-disable-end");const i=n.default.VERSION.split("."),o=parseInt(i[0],10),l=parseInt(i[1],10);s=o<7||7===o&&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,s)}if(t.fullscreen.disabled)return;(t.fullscreen.swipeToFullscreen||t.fullscreen.swipeFromFullscreen)&&((e,t)=>{const{swipeToFullscreen:n,swipeFromFullscreen:s}=t.fullscreen;n&&e.addClass("using-fs-swipe-up"),s&&e.addClass("using-fs-swipe-down");let i=0,o=!1;const l=t=>{const l=e.isFullscreen();!l&&!n||l&&!s?o=!1:(i=t.changedTouches[0].clientY,o=!0,e.tech_.el().style.transition="")},r=t=>{if(!o)return;const n=t.touches[0].clientY,s=i-n,l=e.isFullscreen();let r=1;!l&&s>0?(r=1+Math.min(.1,s/500),e.tech_.el().style.transform=`scale(${r})`):l&&s<0&&(r=1-Math.min(.1,Math.abs(s)/500),e.tech_.el().style.transform=`scale(${r})`)},a=t=>{if(!o)return;if(o=!1,e.tech_.el().style.transition="transform 0.3s ease-out",e.tech_.el().style.transform="scale(1)","touchcancel"===t.type)return;const n=t.changedTouches[0].clientY,s=i-n;s>30&&!e.isFullscreen()?e.requestFullscreen().catch(t=>{e.log.warn("Browser refused fullscreen",t)}):s<-30&&e.isFullscreen()&&e.exitFullscreen()};e.el().addEventListener("touchstart",l,{passive:!0}),e.el().addEventListener("touchmove",r,{passive:!0}),e.el().addEventListener("touchend",a,{passive:!0}),e.el().addEventListener("touchcancel",a,{passive:!0}),e.on("dispose",()=>{e.el().removeEventListener("touchstart",l,{passive:!0}),e.el().removeEventListener("touchmove",r,{passive:!0}),e.el().removeEventListener("touchend",a,{passive:!0}),e.el().removeEventListener("touchcancel",a,{passive:!0}),e.tech_.el().style.transform="",e.tech_.el().style.transition=""})})(e,t);let s=!1;const i=()=>{const i=a();"landscape"===i&&t.fullscreen.enterOnRotate?e.paused()||e.isFullscreen()||(e.requestFullscreen().catch(t=>{e.log.warn("Browser refused fullscreen request:",t)}),(t.fullscreen.lockOnRotate||t.fullscreen.lockToLandscapeOnEnter)&&l.orientation&&l.orientation.lock&&l.orientation.lock("landscape").then(()=>{s=!0}).catch(e=>{n.default.log.warn("Browser refused orientation lock:",e)})):"portrait"===i&&t.fullscreen.exitOnRotate&&!s&&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)})):l.orientation&&(l.orientation.onchange=i,e.on("dispose",()=>{l.orientation.onchange=null}))),e.on("fullscreenchange",i=>{e.isFullscreen()&&t.fullscreen.lockToLandscapeOnEnter&&"portrait"===a()?l.orientation.lock("landscape").then(()=>{s=!0}).catch(e=>{n.default.log("Browser refused orientation lock:",e)}):!e.isFullscreen()&&s&&(l.orientation.unlock(),s=!1)}),e.on("ended",e=>{!0===s&&(l.orientation.unlock(),s=!1)})},u=function(e={}){(e.forceForTesting||n.default.browser.IS_ANDROID||n.default.browser.IS_IOS)&&this.ready(()=>{c(this,n.default.mergeOptions(o,e))})};return r("mobileUi",u),u.VERSION="0.9.0-beta.3",u});