jwplayer-video-element - npm Package Compare versions

Comparing version 0.1.1 to 0.1.2

dist/jwplayer-video-element.js

@@ -1,2 +0,2 @@
-(()=>{var A=Object.defineProperty;var T=(r,e,s)=>e in r?A(r,e,{enumerable:!0,configurable:!0,writable:!0,value:s}):r[e]=s;var E=(r,e,s)=>(T(r,typeof e!="symbol"?e+"":e,s),s);var S=`
+(()=>{var T=Object.defineProperty;var S=(n,e,s)=>e in n?T(n,e,{enumerable:!0,configurable:!0,writable:!0,value:s}):n[e]=s;var w=(n,e,s)=>(S(n,typeof e!="symbol"?e+"":e,s),s);var M=`
   :host {
@@ -16,8 +16,8 @@ display: inline-block;
   }
-`,b=document.createElement("template");b.innerHTML=`
+`,v=document.createElement("template");v.innerHTML=`
 <style>
-  ${S}
+  ${M}
 </style>
 <slot></slot>
-`;var v=(r,{tag:e,is:s})=>{let n=document.createElement(e,{is:s}),c=w(n),h=[...c,...Object.getOwnPropertyNames(HTMLElement.prototype)].filter(u=>u.startsWith("on")).map(u=>u.slice(2));return class C extends r{static#o;static get observedAttributes(){C.#l();let t=[];Object.getOwnPropertyNames(this.prototype).forEach(i=>{let a=!1;try{typeof this.prototype[i]=="function"&&(a=!0)}catch{}!a&&i!==i.toUpperCase()&&t.push(i.toLowerCase())});let l=Object.getPrototypeOf(this).observedAttributes;return[...Object.getPrototypeOf(n).observedAttributes??[],...t,...l??[]]}static#l(){this.#o||(this.#o=!0,c.forEach(t=>{if(t in this.prototype)return;if(typeof n[t]=="function")this.prototype[t]=function(...o){this.#t();let i=()=>this.call?this.call(t,...o):this.nativeEl[t].apply(this.nativeEl,o);return this.loadComplete&&!this.isLoaded?this.loadComplete.then(i):i()};else{let o={get(){return this.#t(),this.get?.(t)??this.nativeEl?.[t]??this.#i[t]}};t!==t.toUpperCase()&&(o.set=async function(i){if(this.#t(),this.loadComplete&&!this.isLoaded&&await this.loadComplete,this.set){this.set(t,i);return}this.nativeEl[t]=i}),Object.defineProperty(this.prototype,t,o)}}))}#e;#n;#s=!1;#i;constructor(){super(),this.shadowRoot||(this.attachShadow({mode:"open"}),this.shadowRoot.append(b.content.cloneNode(!0)))}set loadComplete(t){this.#s=!1,this.#n=t,t.then(()=>{this.#s=!0})}get loadComplete(){return this.#n}get isLoaded(){return this.#s}get nativeEl(){return this.shadowRoot.querySelector(e)}#a(){let t=document.createElement(e,{is:s});[...this.attributes].forEach(({name:l,value:o})=>{t.setAttribute(l,o)}),this.#i={},w(t).forEach(l=>{this.#i[l]=t[l]}),t.removeAttribute("src"),t.load()}async#c(){this.loadComplete&&!this.isLoaded&&await this.loadComplete,this.nativeEl||this.shadowRoot.append(document.createElement(e,{is:s}))}async#t(){if(this.#e)return;this.#e=!0,this.#a(),this.#c();let t=new Map,l=this.shadowRoot.querySelector("slot");l?.addEventListener("slotchange",()=>{let o=new Map(t);l.assignedElements().filter(i=>["track","source"].includes(i.localName)).forEach(async i=>{o.delete(i);let a=t.get(i);a||(a=i.cloneNode(),t.set(i,a)),this.loadComplete&&!this.isLoaded&&await this.loadComplete,this.nativeEl.append(a)}),o.forEach(i=>i.remove())}),h.forEach(o=>{this.shadowRoot.addEventListener?.(o,i=>{i.target===this.nativeEl&&(!["Event","CustomEvent","PictureInPictureEvent"].includes(i.constructor.name)||this.dispatchEvent(new CustomEvent(i.type,{detail:i.detail})))},!0)}),[...this.attributes].forEach(o=>{this.#r(o.name,null,o.value)}),this.loadComplete&&!this.isLoaded&&await this.loadComplete,this.nativeEl.defaultMuted&&(this.muted=!0)}async attributeChangedCallback(t,l,o){this.#e||await this.#t(),this.#r(t,l,o)}async#r(t,l,o){this.loadComplete&&!this.isLoaded&&await this.loadComplete;let a=Object.getOwnPropertyNames(Object.getPrototypeOf(this)).find(P=>P.toLowerCase()===t.toLowerCase()),y=Object.getPrototypeOf(this.constructor).name==="HTMLElement";a&&!y?typeof this[a]=="boolean"?o===null?this[a]=!1:this[a]=!0:this[a]=o:o===null?this.nativeEl.removeAttribute(t):["id","class"].indexOf(t)===-1&&this.nativeEl.setAttribute(t,o)}connectedCallback(){this.#t()}}};function w(r){let e=[];for(let s=Object.getPrototypeOf(r);s&&s!==HTMLElement.prototype;s=Object.getPrototypeOf(s))e.push(...Object.getOwnPropertyNames(s));return e}var m=v(HTMLElement,{tag:"video"});globalThis.customElements.get("super-video")||(globalThis.customElements.define("super-video",m),globalThis.SuperVideoElement=m);var g=v(HTMLElement,{tag:"audio"});globalThis.customElements.get("super-audio")||(globalThis.customElements.define("super-audio",g),globalThis.SuperAudioElement=g);async function j(r,e){return e&&self[e]?self[e]:new Promise(function(s,n){let c=document.createElement("script");c.src=r,c.onload=()=>s(self[e]),c.onerror=n,document.head.appendChild(c)})}function L(r){return(...e)=>new Promise(s=>{r(...e,(...n)=>{n.length>1?s(n):s(n[0])})})}var p=class extends Promise{constructor(e=()=>{}){let s,n;super((c,h)=>{e(c,h),s=c,n=h}),this.resolve=s,this.reject=n}};var O=document.createElement("template");O.innerHTML=`
+`;var C=(n,{tag:e,is:s})=>{let r=document.createElement(e,{is:s}),h=g(r),c=[...h,...Object.getOwnPropertyNames(HTMLElement.prototype)].filter(d=>d.startsWith("on")).map(d=>d.slice(2));return class j extends n{static#o;static get observedAttributes(){j.#a();let t=[];Object.getOwnPropertyNames(this.prototype).forEach(i=>{let a=!1;try{typeof this.prototype[i]=="function"&&(a=!0)}catch{}!a&&i!==i.toUpperCase()&&t.push(i.toLowerCase())});let l=Object.getPrototypeOf(this).observedAttributes;return[...Object.getPrototypeOf(r).observedAttributes??[],...t,...l??[]]}static#a(){this.#o||(this.#o=!0,h.forEach(t=>{if(t in this.prototype)return;if(typeof r[t]=="function")this.prototype[t]=function(...o){this.#t();let i=()=>this.call?this.call(t,...o):this.nativeEl[t].apply(this.nativeEl,o);return this.loadComplete&&!this.isLoaded?this.loadComplete.then(i):i()};else{let o={get(){return this.#t(),this.get?.(t)??this.nativeEl?.[t]??this.#i[t]}};t!==t.toUpperCase()&&(o.set=async function(i){if(this.#t(),this.loadComplete&&!this.isLoaded&&await this.loadComplete,this.set){this.set(t,i);return}this.nativeEl[t]=i}),Object.defineProperty(this.prototype,t,o)}}))}#e;#n;#s=!1;#r;#i;constructor(){super(),this.shadowRoot||(this.attachShadow({mode:"open"}),this.shadowRoot.append(v.content.cloneNode(!0)))}set loadComplete(t){this.#s=!1,this.#n=t,t.then(()=>{this.#s=!0})}get loadComplete(){return this.#n}get isLoaded(){return this.#s}get nativeEl(){return this.#r??this.shadowRoot.querySelector(e)}set nativeEl(t){this.#r=t}#c(){let t=document.createElement(e,{is:s});[...this.attributes].forEach(({name:l,value:o})=>{t.setAttribute(l,o)}),this.#i={},g(t).forEach(l=>{this.#i[l]=t[l]}),t.removeAttribute("src"),t.load()}async#h(){this.loadComplete&&!this.isLoaded&&await this.loadComplete,this.nativeEl||this.shadowRoot.append(document.createElement(e,{is:s}))}async#t(){if(this.#e)return;this.#e=!0,this.#c(),this.#h();let t=new Map,l=this.shadowRoot.querySelector("slot");l?.addEventListener("slotchange",()=>{let o=new Map(t);l.assignedElements().filter(i=>["track","source"].includes(i.localName)).forEach(async i=>{o.delete(i);let a=t.get(i);a||(a=i.cloneNode(),t.set(i,a)),this.loadComplete&&!this.isLoaded&&await this.loadComplete,this.nativeEl.append?.(a)}),o.forEach(i=>i.remove())}),c.forEach(o=>{this.shadowRoot.addEventListener?.(o,i=>{i.target===this.nativeEl&&(!["Event","CustomEvent","PictureInPictureEvent"].includes(i.constructor.name)||this.dispatchEvent(new CustomEvent(i.type,{detail:i.detail})))},!0)}),[...this.attributes].forEach(o=>{this.#l(o.name,null,o.value)}),this.loadComplete&&!this.isLoaded&&await this.loadComplete,this.nativeEl.defaultMuted&&(this.muted=!0)}async attributeChangedCallback(t,l,o){this.#e||await this.#t(),this.#l(t,l,o)}async#l(t,l,o){this.loadComplete&&!this.isLoaded&&await this.loadComplete;let a=Object.getOwnPropertyNames(Object.getPrototypeOf(this)).find(A=>A.toLowerCase()===t.toLowerCase()),E=Object.getPrototypeOf(this.constructor).name==="HTMLElement";a&&!E?typeof this[a]=="boolean"?o===null?this[a]=!1:this[a]=!0:this[a]=o:o===null?this.nativeEl.removeAttribute?.(t):["id","class"].indexOf(t)===-1&&this.nativeEl.setAttribute?.(t,o)}connectedCallback(){this.#t()}}};function g(n){let e=[];for(let s=Object.getPrototypeOf(n);s&&s!==HTMLElement.prototype;s=Object.getPrototypeOf(s))e.push(...Object.getOwnPropertyNames(s));return e}var m=C(HTMLElement,{tag:"video"});globalThis.customElements.get("super-video")||(globalThis.customElements.define("super-video",m),globalThis.SuperVideoElement=m);var b=C(HTMLElement,{tag:"audio"});globalThis.customElements.get("super-audio")||(globalThis.customElements.define("super-audio",b),globalThis.SuperAudioElement=b);var f={};async function L(n,e,s){return f[n]?f[n]:e&&self[e]?(await x(0),self[e]):f[n]=new Promise(function(r,h){let c=document.createElement("script");c.src=n;let d=()=>r(self[e]);s&&(self[s]=d),c.onload=()=>!s&&d(),c.onerror=h,document.head.append(c)})}var x=n=>new Promise(e=>setTimeout(e,n));function O(n){return(...e)=>new Promise(s=>{n(...e,(...r)=>{r.length>1?s(r):s(r[0])})})}var p=class extends Promise{constructor(e=()=>{}){let s,r;super((h,c)=>{e(h,c),s=h,r=c}),this.resolve=s,this.reject=r}};var P=document.createElement("template");P.innerHTML=`
 <style class="jw-style">
@@ -30,3 +30,3 @@ .jw-no-controls [class*="jw-controls"],
 <div class="jwplayer"></div>
-`;var f=document.createElement("template");f.innerHTML=`
+`;var y=document.createElement("template");y.innerHTML=`
 <style>
@@ -37,3 +37,3 @@ :host {
 </style>
-`;var d=class extends m{constructor(){super(),this.shadowRoot.append(f.content.cloneNode(!0)),this.loadComplete=new p}get nativeEl(){return this.querySelector(".jw-video")}async load(){this.hasLoaded&&(this.loadComplete=new p),this.hasLoaded=!0,this.loadComplete.then(()=>{this.volume=1}),await Promise.resolve();let e=/jwplayer\.com\/players\/(\w+)(?:-(\w+))?/i,[,s,n]=this.src.match(e),c=`https://cdn.jwplayer.com/v2/media/${s}`,h=await(await fetch(c)).json(),u=`https://content.jwplatform.com/libraries/${n}.js`,t=await j(u,"jwplayer");this.querySelector(".jw-style")?.remove(),this.querySelector(".jwplayer")?.remove(),this.append(O.content.cloneNode(!0)),this.api=t(this.querySelector(".jwplayer")).setup({width:"100%",height:"100%",preload:this.getAttribute("preload")??"metadata",...h}),await L(this.api.on,this.api)("ready"),this.api.getContainer().classList.toggle("jw-no-controls",!this.controls),this.dispatchEvent(new Event("loadcomplete")),this.loadComplete.resolve()}async attributeChangedCallback(e,s,n){if(e==="src"&&n){this.load();return}switch(super.attributeChangedCallback(e,s,n),await this.loadComplete,e){case"controls":this.api.getContainer().classList.toggle("jw-no-controls",!this.controls);break;case"muted":this.muted=this.getAttribute("muted")!=null;break}}get paused(){return this.nativeEl?.paused??!0}get src(){return this.getAttribute("src")}set src(e){this.src!=e&&this.setAttribute("src",e)}set controls(e){this.controls!=e&&(e?this.setAttribute("controls",""):this.removeAttribute("controls"))}get controls(){return this.getAttribute("controls")!=null}};E(d,"template",f);globalThis.customElements.get("jwplayer-video")||globalThis.JWPlayerVideoElement?console.debug("JWPlayerVideoElement: <jwplayer-video> defined more than once."):(globalThis.JWPlayerVideoElement=d,globalThis.customElements.define("jwplayer-video",d));var q=d;})();
+`;var u=class extends m{constructor(){super(),this.shadowRoot.append(y.content.cloneNode(!0)),this.loadComplete=new p}get nativeEl(){return this.querySelector(".jw-video")}async load(){this.hasLoaded&&(this.loadComplete=new p),this.hasLoaded=!0,this.loadComplete.then(()=>{this.volume=1}),await Promise.resolve();let e=/jwplayer\.com\/players\/(\w+)(?:-(\w+))?/i,[,s,r]=this.src.match(e),h=`https://cdn.jwplayer.com/v2/media/${s}`,c=await(await fetch(h)).json(),d=`https://content.jwplatform.com/libraries/${r}.js`,t=await L(d,"jwplayer");this.querySelector(".jw-style")?.remove(),this.querySelector(".jwplayer")?.remove(),this.append(P.content.cloneNode(!0)),this.api=t(this.querySelector(".jwplayer")).setup({width:"100%",height:"100%",preload:this.getAttribute("preload")??"metadata",...c}),await O(this.api.on,this.api)("ready"),this.api.getContainer().classList.toggle("jw-no-controls",!this.controls),this.dispatchEvent(new Event("loadcomplete")),this.loadComplete.resolve()}async attributeChangedCallback(e,s,r){if(e==="src"&&r){this.load();return}switch(super.attributeChangedCallback(e,s,r),await this.loadComplete,e){case"controls":this.api.getContainer().classList.toggle("jw-no-controls",!this.controls);break;case"muted":this.muted=this.getAttribute("muted")!=null;break}}get paused(){return this.nativeEl?.paused??!0}get src(){return this.getAttribute("src")}set src(e){this.src!=e&&this.setAttribute("src",e)}set controls(e){this.controls!=e&&(e?this.setAttribute("controls",""):this.removeAttribute("controls"))}get controls(){return this.getAttribute("controls")!=null}};w(u,"template",y);globalThis.customElements.get("jwplayer-video")||globalThis.JWPlayerVideoElement?console.debug("JWPlayerVideoElement: <jwplayer-video> defined more than once."):(globalThis.JWPlayerVideoElement=u,globalThis.customElements.define("jwplayer-video",u));var U=u;})();
 //# sourceMappingURL=jwplayer-video-element.js.map

package.json

 {
   "name": "jwplayer-video-element",
-  "version": "0.1.1",
+  "version": "0.1.2",
   "type": "module",
@@ -61,4 +61,4 @@ "description": "Custom element (web component) for the JW player.",
   "dependencies": {
-    "super-media-element": "^0.2.0"
+    "super-media-element": "^0.3.0"
   }
 }

src/utils.js

@@ -1,14 +0,21 @@
-export async function loadScript(src, globalName) {
+const loadScriptCache = {};
+export async function loadScript(src, globalName, readyFnName) {
+  if (loadScriptCache[src]) return loadScriptCache[src];
   if (globalName && self[globalName]) {
+    await delay(0);
     return self[globalName];
   }
-  return new Promise(function (resolve, reject) {
+  return (loadScriptCache[src] = new Promise(function (resolve, reject) {
     const script = document.createElement('script');
     script.src = src;
-    script.onload = () => resolve(self[globalName]);
+    const ready = () => resolve(self[globalName]);
+    if (readyFnName) (self[readyFnName] = ready);
+    script.onload = () => !readyFnName && ready();
     script.onerror = reject;
-    document.head.appendChild(script);
-  });
+    document.head.append(script);
+  }));
 }
 
+export const delay = (ms) => new Promise((resolve) => setTimeout(resolve, ms));
+
 export function promisify(fn) {
@@ -15,0 +22,0 @@ return (...args) =>

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

41128

increased by2.92%

Lines of code

216

increased by3.35%

Dependency changes

• + Addedsuper-media-element@0.3.1(transitive)

• - Removedsuper-media-element@0.2.1(transitive)

• Updatedsuper-media-element@^0.3.0