From 63cd77c48c1a20d33cf6a7269e3462bf70c5a398 Mon Sep 17 00:00:00 2001 From: Federico Brigante Date: Thu, 8 Jun 2017 18:04:43 +0800 Subject: [PATCH] 2.2.0 --- dist/iphone-inline-video.js | 34 +++++++++++++++++++++++---------- dist/iphone-inline-video.min.js | 4 ++-- package-lock.json | 2 +- package.json | 2 +- 4 files changed, 28 insertions(+), 14 deletions(-) diff --git a/dist/iphone-inline-video.js b/dist/iphone-inline-video.js index 67b45f3..1c07e93 100644 --- a/dist/iphone-inline-video.js +++ b/dist/iphone-inline-video.js @@ -1,4 +1,4 @@ -/*! npm.im/iphone-inline-video 2.1.0 */ +/*! npm.im/iphone-inline-video 2.2.0 */ var enableInlineVideo = (function () { 'use strict'; @@ -33,15 +33,14 @@ function frameIntervalometer(cb) { return intervalometer(cb, requestAnimationFrame, cancelAnimationFrame); } -function preventEvent(element, eventName, toggleProperty, preventWithProperty) { +function preventEvent(element, eventName, test) { function handler(e) { - if (Boolean(element[toggleProperty]) === Boolean(preventWithProperty)) { + if (!test || test(element, eventName)) { e.stopImmediatePropagation(); // // console.log(eventName, 'prevented on', element); } - delete element[toggleProperty]; } - element.addEventListener(eventName, handler, false); + element.addEventListener(eventName, handler); // Return handler to allow to disable the prevention. Usage: // const preventionHandler = preventEvent(el, 'click'); @@ -219,7 +218,9 @@ function pause(forceEvents) { if (!player.hasAudio) { dispatchEventAsync(video, 'pause'); } - if (video.ended) { + + // Handle the 'ended' event only if it's not fullscreen + if (video.ended && !video.webkitDisplayingFullscreen) { video[ಠevent] = true; dispatchEventAsync(video, 'ended'); } @@ -315,6 +316,12 @@ function addPlayer(video, hasAudio) { } } +function preventWithPropOrFullscreen(el) { + var isAllowed = el[ಠevent]; + delete el[ಠevent]; + return !el.webkitDisplayingFullscreen && !isAllowed; +} + function overloadAPI(video) { var player = video[ಠ]; video[ಠplay] = video.play; @@ -326,10 +333,17 @@ function overloadAPI(video) { proxyProperty(video, 'playbackRate', player.driver, true); proxyProperty(video, 'ended', player.driver); proxyProperty(video, 'loop', player.driver, true); - preventEvent(video, 'seeking'); - preventEvent(video, 'seeked'); - preventEvent(video, 'timeupdate', ಠevent, false); - preventEvent(video, 'ended', ಠevent, false); // Prevent occasional native ended events + + // IIV works by seeking 60 times per second. + // These events are now useless. + preventEvent(video, 'seeking', function (el) { return !el.webkitDisplayingFullscreen; }); + preventEvent(video, 'seeked', function (el) { return !el.webkitDisplayingFullscreen; }); + + // Limit timeupdate events + preventEvent(video, 'timeupdate', preventWithPropOrFullscreen); + + // Prevent occasional native ended events + preventEvent(video, 'ended', preventWithPropOrFullscreen); } function enableInlineVideo(video, opts) { diff --git a/dist/iphone-inline-video.min.js b/dist/iphone-inline-video.min.js index 6e48e34..11e6cfa 100644 --- a/dist/iphone-inline-video.min.js +++ b/dist/iphone-inline-video.min.js @@ -1,3 +1,3 @@ -/*! npm.im/iphone-inline-video 2.1.0 */ +/*! npm.im/iphone-inline-video 2.2.0 */ var enableInlineVideo=function(){"use strict";/*! npm.im/intervalometer */ -function e(e,i,n,r){function t(n){d=i(t,r),e(n-(a||n)),a=n}var d,a;return{start:function(){d||t(0)},stop:function(){n(d),d=null,a=0}}}function i(i){return e(i,requestAnimationFrame,cancelAnimationFrame)}function n(e,i,n,r){function t(i){Boolean(e[n])===Boolean(r)&&i.stopImmediatePropagation(),delete e[n]}return e.addEventListener(i,t,!1),t}function r(e,i,n,r){function t(){return n[i]}function d(e){n[i]=e}r&&d(e[i]),Object.defineProperty(e,i,{get:t,set:d})}function t(e,i,n){n.addEventListener(i,function(){return e.dispatchEvent(new Event(i))})}function d(e,i){Promise.resolve().then(function(){e.dispatchEvent(new Event(i))})}function a(e){var i=new Audio;return t(e,"play",i),t(e,"playing",i),t(e,"pause",i),i.crossOrigin=e.crossOrigin,i.src=e.src||e.currentSrc||"data:",i}function o(e,i,n){(m||0)+200=e.video.duration}function s(e){var i=this;i.video.readyState>=i.video.HAVE_FUTURE_DATA?(i.hasAudio||(i.driver.currentTime=i.video.currentTime+e*i.video.playbackRate/1e3,i.video.loop&&u(i)&&(i.driver.currentTime=0)),o(i.video,i.driver.currentTime)):i.video.networkState===i.video.NETWORK_IDLE&&0===i.video.buffered.length&&i.video.load(),i.video.ended&&(delete i.video[b],i.video.pause(!0))}function c(){var e=this,i=e[h];return e.webkitDisplayingFullscreen?void e[g]():("data:"!==i.driver.src&&i.driver.src!==e.src&&(o(e,0,!0),i.driver.src=e.src),void(e.paused&&(i.paused=!1,0===e.buffered.length&&e.load(),i.driver.play(),i.updater.start(),i.hasAudio||(d(e,"play"),i.video.readyState>=i.video.HAVE_ENOUGH_DATA&&d(e,"playing")))))}function v(e){var i=this,n=i[h];n.driver.pause(),n.updater.stop(),i.webkitDisplayingFullscreen&&i[E](),n.paused&&!e||(n.paused=!0,n.hasAudio||d(i,"pause"),i.ended&&(i[b]=!0,d(i,"ended")))}function p(e,n){var r={};e[h]=r,r.paused=!0,r.hasAudio=n,r.video=e,r.updater=i(s.bind(r)),n?r.driver=a(e):(e.addEventListener("canplay",function(){e.paused||d(e,"playing")}),r.driver={src:e.src||e.currentSrc||"data:",muted:!0,paused:!0,pause:function(){r.driver.paused=!0},play:function(){r.driver.paused=!1,u(r)&&o(e,0)},get ended(){return u(r)}}),e.addEventListener("emptied",function(){var i=!r.driver.src||"data:"===r.driver.src;r.driver.src&&r.driver.src!==e.src&&(o(e,0,!0),r.driver.src=e.src,i||!n&&e.autoplay?r.driver.play():r.updater.stop())},!1),e.addEventListener("webkitbeginfullscreen",function(){e.paused?n&&0===r.driver.buffered.length&&r.driver.load():(e.pause(),e[g]())}),n&&(e.addEventListener("webkitendfullscreen",function(){r.driver.currentTime=e.currentTime}),e.addEventListener("seeking",function(){T.indexOf(100*e.currentTime|0)<0&&(r.driver.currentTime=e.currentTime)}))}function l(e){var i=e[h];e[g]=e.play,e[E]=e.pause,e.play=c,e.pause=v,r(e,"paused",i.driver),r(e,"muted",i.driver,!0),r(e,"playbackRate",i.driver,!0),r(e,"ended",i.driver),r(e,"loop",i.driver,!0),n(e,"seeking"),n(e,"seeked"),n(e,"timeupdate",b,!1),n(e,"ended",b,!1)}function f(e,i){if(void 0===i&&(i={}),!e[h]){if(!i.everywhere){if(!y)return;if(!(i.iPad||i.ipad?/iPhone|iPod|iPad/:/iPhone|iPod/).test(navigator.userAgent))return}e.pause();var n=e.autoplay;e.autoplay=!1,p(e,!e.muted),l(e),e.classList.add("IIV"),e.muted&&n&&(e.play(),e.addEventListener("playing",function i(){e.autoplay=!0,e.removeEventListener("playing",i)})),/iPhone|iPod|iPad/.test(navigator.platform)||console.warn("iphone-inline-video is not guaranteed to work in emulated environments")}}var m,y="object"==typeof document&&"object-fit"in document.head.style&&!matchMedia("(-webkit-video-playable-inline)").matches,h="bfred-it:iphone-inline-video",b="bfred-it:iphone-inline-video:event",g="bfred-it:iphone-inline-video:nativeplay",E="bfred-it:iphone-inline-video:nativepause",T=[],w=0;return f}(); +function e(e,i,n,r){function t(n){d=i(t,r),e(n-(a||n)),a=n}var d,a;return{start:function(){d||t(0)},stop:function(){n(d),d=null,a=0}}}function i(i){return e(i,requestAnimationFrame,cancelAnimationFrame)}function n(e,i,n){function r(r){n&&!n(e,i)||r.stopImmediatePropagation()}return e.addEventListener(i,r),r}function r(e,i,n,r){function t(){return n[i]}function d(e){n[i]=e}r&&d(e[i]),Object.defineProperty(e,i,{get:t,set:d})}function t(e,i,n){n.addEventListener(i,function(){return e.dispatchEvent(new Event(i))})}function d(e,i){Promise.resolve().then(function(){e.dispatchEvent(new Event(i))})}function a(e){var i=new Audio;return t(e,"play",i),t(e,"playing",i),t(e,"pause",i),i.crossOrigin=e.crossOrigin,i.src=e.src||e.currentSrc||"data:",i}function o(e,i,n){(m||0)+200=e.video.duration}function s(e){var i=this;i.video.readyState>=i.video.HAVE_FUTURE_DATA?(i.hasAudio||(i.driver.currentTime=i.video.currentTime+e*i.video.playbackRate/1e3,i.video.loop&&u(i)&&(i.driver.currentTime=0)),o(i.video,i.driver.currentTime)):i.video.networkState===i.video.NETWORK_IDLE&&0===i.video.buffered.length&&i.video.load(),i.video.ended&&(delete i.video[h],i.video.pause(!0))}function c(){var e=this,i=e[g];return e.webkitDisplayingFullscreen?void e[E]():("data:"!==i.driver.src&&i.driver.src!==e.src&&(o(e,0,!0),i.driver.src=e.src),void(e.paused&&(i.paused=!1,0===e.buffered.length&&e.load(),i.driver.play(),i.updater.start(),i.hasAudio||(d(e,"play"),i.video.readyState>=i.video.HAVE_ENOUGH_DATA&&d(e,"playing")))))}function v(e){var i=this,n=i[g];n.driver.pause(),n.updater.stop(),i.webkitDisplayingFullscreen&&i[w](),n.paused&&!e||(n.paused=!0,n.hasAudio||d(i,"pause"),i.ended&&!i.webkitDisplayingFullscreen&&(i[h]=!0,d(i,"ended")))}function p(e,n){var r={};e[g]=r,r.paused=!0,r.hasAudio=n,r.video=e,r.updater=i(s.bind(r)),n?r.driver=a(e):(e.addEventListener("canplay",function(){e.paused||d(e,"playing")}),r.driver={src:e.src||e.currentSrc||"data:",muted:!0,paused:!0,pause:function(){r.driver.paused=!0},play:function(){r.driver.paused=!1,u(r)&&o(e,0)},get ended(){return u(r)}}),e.addEventListener("emptied",function(){var i=!r.driver.src||"data:"===r.driver.src;r.driver.src&&r.driver.src!==e.src&&(o(e,0,!0),r.driver.src=e.src,i||!n&&e.autoplay?r.driver.play():r.updater.stop())},!1),e.addEventListener("webkitbeginfullscreen",function(){e.paused?n&&0===r.driver.buffered.length&&r.driver.load():(e.pause(),e[E]())}),n&&(e.addEventListener("webkitendfullscreen",function(){r.driver.currentTime=e.currentTime}),e.addEventListener("seeking",function(){k.indexOf(100*e.currentTime|0)<0&&(r.driver.currentTime=e.currentTime)}))}function l(e){var i=e[h];return delete e[h],!e.webkitDisplayingFullscreen&&!i}function f(e){var i=e[g];e[E]=e.play,e[w]=e.pause,e.play=c,e.pause=v,r(e,"paused",i.driver),r(e,"muted",i.driver,!0),r(e,"playbackRate",i.driver,!0),r(e,"ended",i.driver),r(e,"loop",i.driver,!0),n(e,"seeking",function(e){return!e.webkitDisplayingFullscreen}),n(e,"seeked",function(e){return!e.webkitDisplayingFullscreen}),n(e,"timeupdate",l),n(e,"ended",l)}function y(e,i){if(void 0===i&&(i={}),!e[g]){if(!i.everywhere){if(!b)return;if(!(i.iPad||i.ipad?/iPhone|iPod|iPad/:/iPhone|iPod/).test(navigator.userAgent))return}e.pause();var n=e.autoplay;e.autoplay=!1,p(e,!e.muted),f(e),e.classList.add("IIV"),e.muted&&n&&(e.play(),e.addEventListener("playing",function i(){e.autoplay=!0,e.removeEventListener("playing",i)})),/iPhone|iPod|iPad/.test(navigator.platform)||console.warn("iphone-inline-video is not guaranteed to work in emulated environments")}}var m,b="object"==typeof document&&"object-fit"in document.head.style&&!matchMedia("(-webkit-video-playable-inline)").matches,g="bfred-it:iphone-inline-video",h="bfred-it:iphone-inline-video:event",E="bfred-it:iphone-inline-video:nativeplay",w="bfred-it:iphone-inline-video:nativepause",k=[],T=0;return y}(); diff --git a/package-lock.json b/package-lock.json index c996047..f6e1641 100644 --- a/package-lock.json +++ b/package-lock.json @@ -1,6 +1,6 @@ { "name": "iphone-inline-video", - "version": "2.1.0", + "version": "2.2.0", "lockfileVersion": 1, "dependencies": { "abbrev": { diff --git a/package.json b/package.json index 0a5cd93..ef8627e 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "iphone-inline-video", - "version": "2.1.0", + "version": "2.2.0", "description": "Make videos playable inline on the iPhone (prevents automatic fullscreen)", "license": "MIT", "repository": "bfred-it/iphone-inline-video",