diff --git a/lib/jwplayer-react.js b/lib/jwplayer-react.js index 20f895d..c42779e 100644 --- a/lib/jwplayer-react.js +++ b/lib/jwplayer-react.js @@ -1,2 +1,2 @@ /*! For license information please see jwplayer-react.js.LICENSE.txt */ -(()=>{var e={262:e=>{e.exports=new Set(["hlsjsProgressive","__abSendDomainToFeeds","_abZoomThumbnail","advertising","aboutlink","abouttext","aestoken","allowFullscreen","analytics","androidhls","aspectratio","autoPause","autostart","base","captions","cast","controls","defaultBandwidthEstimate","description","displaydescription","displayHeading","displayPlaybackLabel","displaytitle","drm","duration","enableDefaultCaptions","events","file","forceLocalizationDefaults","fwassetid","floating","ga","generateSEOMetadata","height","hlsjsConfig","hlsjsdefault","horizontalVolumeSlider","image","intl","key","listbar","liveSyncDuration","liveTimeout","localization","logo","mediaid","mute","nextUpDisplay","nextupoffset","pad","ph","pid","pipIcon","playbackRateControls","playbackRates","playlist","playlistIndex","plugins","preload","qualityLabel","qualityLabels","recommendations","related","renderCaptionsNatively","repeat","safarihlsjs","sdkplatform","selectedBitrate","setTimeEvents","skin","sharing","sources","stagevideo","streamtype","stretching","title","tracks","type","variations","volume","width","withCredentials","doNotTrack","doNotTrackCookies","images"])},418:e=>{"use strict";var t=Object.getOwnPropertySymbols,r=Object.prototype.hasOwnProperty,n=Object.prototype.propertyIsEnumerable;e.exports=function(){try{if(!Object.assign)return!1;var e=new String("abc");if(e[5]="de","5"===Object.getOwnPropertyNames(e)[0])return!1;for(var t={},r=0;r<10;r++)t["_"+String.fromCharCode(r)]=r;if("0123456789"!==Object.getOwnPropertyNames(t).map((function(e){return t[e]})).join(""))return!1;var n={};return"abcdefghijklmnopqrst".split("").forEach((function(e){n[e]=e})),"abcdefghijklmnopqrst"===Object.keys(Object.assign({},n)).join("")}catch(e){return!1}}()?Object.assign:function(e,o){for(var a,i,s=function(e){if(null==e)throw new TypeError("Object.assign cannot be called with null or undefined");return Object(e)}(e),u=1;u{"use strict";r(418);var n=r(294),o=60103;if("function"==typeof Symbol&&Symbol.for){var a=Symbol.for;o=a("react.element"),a("react.fragment")}var i=n.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED.ReactCurrentOwner,s=Object.prototype.hasOwnProperty,u={key:!0,ref:!0,__self:!0,__source:!0};t.jsx=function(e,t,r){var n,a={},l=null,c=null;for(n in void 0!==r&&(l=""+r),void 0!==t.key&&(l=""+t.key),void 0!==t.ref&&(c=t.ref),t)s.call(t,n)&&!u.hasOwnProperty(n)&&(a[n]=t[n]);if(e&&e.defaultProps)for(n in t=e.defaultProps)void 0===a[n]&&(a[n]=t[n]);return{$$typeof:o,type:e,key:l,ref:c,props:a,_owner:i.current}}},408:(e,t,r)=>{"use strict";var n=r(418),o=60103,a=60106;t.Fragment=60107,t.StrictMode=60108,t.Profiler=60114;var i=60109,s=60110,u=60112;t.Suspense=60113;var l=60115,c=60116;if("function"==typeof Symbol&&Symbol.for){var f=Symbol.for;o=f("react.element"),a=f("react.portal"),t.Fragment=f("react.fragment"),t.StrictMode=f("react.strict_mode"),t.Profiler=f("react.profiler"),i=f("react.provider"),s=f("react.context"),u=f("react.forward_ref"),t.Suspense=f("react.suspense"),l=f("react.memo"),c=f("react.lazy")}var p="function"==typeof Symbol&&Symbol.iterator;function d(e){for(var t="https://reactjs.org/docs/error-decoder.html?invariant="+e,r=1;r{"use strict";e.exports=r(408)},893:(e,t,r)=>{"use strict";e.exports=r(251)}},t={};function r(n){var o=t[n];if(void 0!==o)return o.exports;var a=t[n]={exports:{}};return e[n](a,a.exports,r),a.exports}r.n=e=>{var t=e&&e.__esModule?()=>e.default:()=>e;return r.d(t,{a:t}),t},r.d=(e,t)=>{for(var n in t)r.o(t,n)&&!r.o(e,n)&&Object.defineProperty(e,n,{enumerable:!0,get:t[n]})},r.o=(e,t)=>Object.prototype.hasOwnProperty.call(e,t),r.r=e=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})};var n={};(()=>{"use strict";r.r(n),r.d(n,{default:()=>p});var e=r(294);const t="all",o="^on(.*)";var a=r(262),i=r.n(a);let s=-1;function u(e,t){const r=e.match(t)||["",""];return r[1].charAt(0).toLowerCase()+r[1].slice(1)}var l=r(893);function c(e){return(r,n)=>{Object.keys(e).forEach((a=>{const i=u(a,o);i===r&&e[a](n),i===t&&e[a](r,n)}))}}class f extends e.Component{constructor(t){super(t),this.ref=t.ref||e.createRef(),this.config=function(e){const t={};return Object.keys(e).forEach((r=>{i().has(r)&&(t[r]=e[r])})),{...e.config,...t,isReactComponent:!0}}(t),this.player=null,this.playerLoadPromise=function(e){if(!window.jwplayer&&!e)throw new Error("jwplayer-react requires either a library prop, or a library script");return window.jwplayer?Promise.resolve():function(e){return new Promise(((t,r)=>{const n=document.createElement("script");n.onload=t,n.onerror=r,n.src=e,document.body.append(n)}))}(e)}(t.library),this.didMountCallback=t.didMountCallback,this.willUnmountCallback=t.willUnmountCallback,this.id=t.id||(s++,`jwplayer-${s}`),this.onHandler=null}async componentDidMount(){if(this.player=await this.createPlayer(),this.createEventListeners(),this.didMountCallback){const{player:e,id:t}=this;this.didMountCallback({player:e,id:t})}}shouldComponentUpdate(e){return!(!this.player||this.didOnEventsChange(e)&&(this.updateOnEventListener(e),1))}componentWillUnmount(){if(this.willUnmountCallback){const{player:e,id:t}=this;this.willUnmountCallback({player:e,id:t})}this.player&&(this.player.off(),this.player.remove(),this.player=null)}createPlayer(){const{config:e,ref:t}=this,r={...window.jwDefaults,...e},n=t.current;return this.playerLoadPromise.then((()=>window.jwplayer(n.id).setup(r)))}didOnEventsChange(e){const t=e=>e.match(o),r=Object.keys(this.props).filter(t).sort(),n=Object.keys(e).filter(t).sort();return n.length!==r.length||n.some(((t,n)=>r[n]!==t||e[t]!==this.props[t]))}createEventListeners(){Object.keys(this.props).forEach((e=>{const t=u(e,"^once(.*)");t&&this.player.once(t,this.props[e])})),this.onHandler=c(this.props),this.player.on(t,this.onHandler)}updateOnEventListener(e){this.onHandler&&this.player.off(t,this.onHandler),this.onHandler=c(e),this.player.on(t,this.onHandler)}render(){return(0,l.jsx)("div",{id:this.id,ref:this.ref})}}const p=f})(),module.exports=n})(); \ No newline at end of file +(()=>{var e={262:e=>{e.exports=new Set(["hlsjsProgressive","__abSendDomainToFeeds","_abZoomThumbnail","advertising","aboutlink","abouttext","aestoken","allowFullscreen","analytics","androidhls","aspectratio","autoPause","autostart","base","captions","cast","controls","defaultBandwidthEstimate","description","displaydescription","displayHeading","displayPlaybackLabel","displaytitle","drm","duration","enableDefaultCaptions","events","file","forceLocalizationDefaults","fwassetid","floating","ga","generateSEOMetadata","height","hlsjsConfig","hlsjsdefault","horizontalVolumeSlider","image","intl","key","listbar","liveSyncDuration","liveTimeout","localization","logo","mediaid","mute","nextUpDisplay","nextupoffset","pad","ph","pid","pipIcon","playbackRateControls","playbackRates","playlist","playlistIndex","plugins","preload","qualityLabel","qualityLabels","recommendations","related","renderCaptionsNatively","repeat","safarihlsjs","sdkplatform","selectedBitrate","setTimeEvents","skin","sharing","sources","stagevideo","streamtype","stretching","title","tracks","type","variations","volume","width","withCredentials","doNotTrack","doNotTrackCookies","images"])},418:e=>{"use strict";var t=Object.getOwnPropertySymbols,r=Object.prototype.hasOwnProperty,n=Object.prototype.propertyIsEnumerable;e.exports=function(){try{if(!Object.assign)return!1;var e=new String("abc");if(e[5]="de","5"===Object.getOwnPropertyNames(e)[0])return!1;for(var t={},r=0;r<10;r++)t["_"+String.fromCharCode(r)]=r;if("0123456789"!==Object.getOwnPropertyNames(t).map((function(e){return t[e]})).join(""))return!1;var n={};return"abcdefghijklmnopqrst".split("").forEach((function(e){n[e]=e})),"abcdefghijklmnopqrst"===Object.keys(Object.assign({},n)).join("")}catch(e){return!1}}()?Object.assign:function(e,o){for(var a,i,s=function(e){if(null==e)throw new TypeError("Object.assign cannot be called with null or undefined");return Object(e)}(e),u=1;u{"use strict";r(418);var n=r(294),o=60103;if("function"==typeof Symbol&&Symbol.for){var a=Symbol.for;o=a("react.element"),a("react.fragment")}var i=n.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED.ReactCurrentOwner,s=Object.prototype.hasOwnProperty,u={key:!0,ref:!0,__self:!0,__source:!0};t.jsx=function(e,t,r){var n,a={},l=null,c=null;for(n in void 0!==r&&(l=""+r),void 0!==t.key&&(l=""+t.key),void 0!==t.ref&&(c=t.ref),t)s.call(t,n)&&!u.hasOwnProperty(n)&&(a[n]=t[n]);if(e&&e.defaultProps)for(n in t=e.defaultProps)void 0===a[n]&&(a[n]=t[n]);return{$$typeof:o,type:e,key:l,ref:c,props:a,_owner:i.current}}},408:(e,t,r)=>{"use strict";var n=r(418),o=60103,a=60106;t.Fragment=60107,t.StrictMode=60108,t.Profiler=60114;var i=60109,s=60110,u=60112;t.Suspense=60113;var l=60115,c=60116;if("function"==typeof Symbol&&Symbol.for){var f=Symbol.for;o=f("react.element"),a=f("react.portal"),t.Fragment=f("react.fragment"),t.StrictMode=f("react.strict_mode"),t.Profiler=f("react.profiler"),i=f("react.provider"),s=f("react.context"),u=f("react.forward_ref"),t.Suspense=f("react.suspense"),l=f("react.memo"),c=f("react.lazy")}var p="function"==typeof Symbol&&Symbol.iterator;function d(e){for(var t="https://reactjs.org/docs/error-decoder.html?invariant="+e,r=1;r{"use strict";e.exports=r(408)},893:(e,t,r)=>{"use strict";e.exports=r(251)}},t={};function r(n){var o=t[n];if(void 0!==o)return o.exports;var a=t[n]={exports:{}};return e[n](a,a.exports,r),a.exports}r.n=e=>{var t=e&&e.__esModule?()=>e.default:()=>e;return r.d(t,{a:t}),t},r.d=(e,t)=>{for(var n in t)r.o(t,n)&&!r.o(e,n)&&Object.defineProperty(e,n,{enumerable:!0,get:t[n]})},r.o=(e,t)=>Object.prototype.hasOwnProperty.call(e,t),r.r=e=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})};var n={};(()=>{"use strict";r.r(n),r.d(n,{default:()=>p});var e=r(294);const t="all",o="^on(.*)";var a=r(262),i=r.n(a);let s=-1;function u(e,t){const r=e.match(t)||["",""];return r[1].charAt(0).toLowerCase()+r[1].slice(1)}var l=r(893);function c(e){return(r,n)=>{Object.keys(e).forEach((a=>{const i=u(a,o);i===r&&e[a](n),i===t&&e[a](r,n)}))}}class f extends e.Component{constructor(t){super(t),this.ref=t.ref||e.createRef(),this.config=function(e){const t={};return Object.keys(e).forEach((r=>{i().has(r)&&(t[r]=e[r])})),{...e.config,...t,isReactComponent:!0}}(t),this.player=null,this.didMountCallback=t.didMountCallback,this.willUnmountCallback=t.willUnmountCallback,this.id=t.id||(s++,`jwplayer-${s}`),this.onHandler=null,this.library=t.library}async componentDidMount(){if(console.error("props",this.props),await function(e){if(!window.jwplayer&&!e)throw new Error("jwplayer-react requires either a library prop, or a library script");return window.jwplayer?Promise.resolve():function(e){return new Promise(((t,r)=>{const n=document.createElement("script");n.onload=t,n.onerror=r,n.src=e,document.body.append(n)}))}(e)}(this.library),this.player=this.createPlayer(),this.createEventListeners(),this.didMountCallback){const{player:e,id:t}=this;this.didMountCallback({player:e,id:t})}}shouldComponentUpdate(e){return!(!this.player||this.didOnEventsChange(e)&&(this.updateOnEventListener(e),1))}componentWillUnmount(){if(this.willUnmountCallback){const{player:e,id:t}=this;this.willUnmountCallback({player:e,id:t})}this.player&&(this.player.off(),this.player.remove(),this.player=null)}createPlayer(){const{config:e,ref:t}=this,r={...window.jwDefaults,...e},n=t.current;return window.jwplayer(n.id).setup(r)}didOnEventsChange(e){const t=e=>e.match(o),r=Object.keys(this.props).filter(t).sort(),n=Object.keys(e).filter(t).sort();return n.length!==r.length||n.some(((t,n)=>r[n]!==t||e[t]!==this.props[t]))}createEventListeners(){Object.keys(this.props).forEach((e=>{const t=u(e,"^once(.*)");t&&this.player.once(t,this.props[e])})),this.onHandler=c(this.props),this.player.on(t,this.onHandler)}updateOnEventListener(e){this.onHandler&&this.player.off(t,this.onHandler),this.onHandler=c(e),this.player.on(t,this.onHandler)}render(){return(0,l.jsx)("div",{id:this.id,ref:this.ref})}}const p=f})(),module.exports=n})(); \ No newline at end of file diff --git a/src/jwplayer.jsx b/src/jwplayer.jsx index af09736..80d518c 100644 --- a/src/jwplayer.jsx +++ b/src/jwplayer.jsx @@ -25,15 +25,16 @@ class JWPlayer extends React.Component { this.ref = props.ref || React.createRef(); this.config = generateConfig(props); this.player = null; - this.playerLoadPromise = loadPlayer(props.library); this.didMountCallback = props.didMountCallback; this.willUnmountCallback = props.willUnmountCallback; this.id = props.id || generateUniqueId(); this.onHandler = null; + this.library = props.library; } async componentDidMount() { - this.player = await this.createPlayer(); + await loadPlayer(this.library); + this.player = this.createPlayer(); this.createEventListeners(); if (this.didMountCallback) { @@ -73,7 +74,7 @@ class JWPlayer extends React.Component { const setupConfig = { ...window.jwDefaults, ...config }; const view = ref.current; - return this.playerLoadPromise.then(() => window.jwplayer(view.id).setup(setupConfig)); + return window.jwplayer(view.id).setup(setupConfig); } didOnEventsChange(nextProps) {