@glightbox/video - npm Package Compare versions

Comparing version 1.0.0-beta.1 to 1.0.0-beta.2

dist/index.cjs.js

@@ -1,7 +0,7 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});class g{init(){}destroy(){}match(e){return!1}build({index:e,slide:t,config:s}){return Promise.resolve(!1)}cssStyle(){return""}assets(){return{}}}class b extends g{constructor(e={}){super(),this.name="video",this.type="slide",this.players=new Map,this.defaults={maxWidth:"700px",autoPlay:!0,injectAssets:!0,assets:{css:["https://cdn.jsdelivr.net/npm/vidstack@^1.0.0/player/styles/default/theme.min.css","https://cdn.jsdelivr.net/npm/vidstack@^1.0.0/player/styles/default/layouts/video.min.css"],js:[{src:"https://cdn.jsdelivr.net/npm/vidstack@^1.0.0/cdn/vidstack.js",module:!0}]},vistack:{}},this.options={...this.defaults,...e}}init(){this.instance.on("slide_before_change",()=>{const e=this.instance.getActiveSlide(),t=e&&this.slideHasPlayer(e);t&&(t==null||t.pause())}),this.options.autoPlay&&this.instance.on("slide_changed",()=>{const e=this.instance.getActiveSlide(),t=e&&this.slideHasPlayer(e);if(t){if(t!=null&&t.paused&&(t!=null&&t.duration))return t==null?void 0:t.play();t.addEventListener("can-play",()=>t==null?void 0:t.play())}})}match(e){let t=!1;return(e.match(/vimeo\.com\/([0-9]*)/)||e.match(/(youtube\.com|youtube-nocookie\.com)\/watch\?v=([a-zA-Z0-9\-_]+)/)||e.match(/youtu\.be\/([a-zA-Z0-9\-_]+)/)||e.match(/(youtube\.com|youtube-nocookie\.com)\/embed\/([a-zA-Z0-9\-_]+)/)||e.match(/(youtube\.com|youtube-nocookie\.com)\/shorts\/([a-zA-Z0-9\-_]+)/)||e.match(/\.(mpg|avi|webm|mov|ogv|mp4)/)!==null)&&(t=!0),t}async build({index:e,slide:t,config:s}){var c,d,l,u;const a=Math.floor(Math.random()*Date.now())+e,n={id:`gl-player-${a}`,class:"gl-video-player",viewType:"video",controls:!0,aspectRatio:"16/9",src:s.url,crossorigin:""};this.options.autoPlay&&(n.autoPlay="");const y=`
-            <media-player ${Object.entries(n).reduce((o,[i,h])=>{const v=h?`${i}="${String(h)}"`:i;return`${o} ${v}`},"")}>
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});class b{init(){}destroy(){}match(e){return!1}build({index:e,slide:t,config:s}){return Promise.resolve(!1)}cssStyle(){return""}assets(){return{}}}class g extends b{constructor(e={}){super(),this.name="video",this.type="slide",this.players=new Map,this.defaults={maxWidth:"840px",autoPlay:!0,injectAssets:!0,assets:{css:["https://cdn.jsdelivr.net/npm/vidstack@^1.0.0/player/styles/default/theme.min.css","https://cdn.jsdelivr.net/npm/vidstack@^1.0.0/player/styles/default/layouts/video.min.css"],js:[{src:"https://cdn.jsdelivr.net/npm/vidstack@^1.0.0/cdn/vidstack.js",module:!0}]},vistack:{}},this.options={...this.defaults,...e}}init(){this.instance.on("slide_before_change",()=>{const e=this.instance.getActiveSlideIndex(),t=this.slideHasPlayer(e);t&&(t==null||t.pause())}),this.options.autoPlay&&this.instance.on("slide_changed",()=>{const e=this.instance.getActiveSlideIndex(),t=this.slideHasPlayer(e);if(t){if(t!=null&&t.paused&&(t!=null&&t.duration))return t==null?void 0:t.play();t.addEventListener("can-play",()=>t==null?void 0:t.play())}})}match(e){let t=!1;return(e.match(/vimeo\.com\/([0-9]*)/)||e.match(/(youtube\.com|youtube-nocookie\.com)\/watch\?v=([a-zA-Z0-9\-_]+)/)||e.match(/youtu\.be\/([a-zA-Z0-9\-_]+)/)||e.match(/(youtube\.com|youtube-nocookie\.com)\/embed\/([a-zA-Z0-9\-_]+)/)||e.match(/(youtube\.com|youtube-nocookie\.com)\/shorts\/([a-zA-Z0-9\-_]+)/)||e.match(/\.(mpg|avi|webm|mov|ogv|mp4)/)!==null)&&(t=!0),t}async build({index:e,slide:t,config:s}){var r,c,d,l;const o=Math.floor(Math.random()*Date.now())+e,m={id:`gl-player-${o}`,class:"gl-video-player",viewType:"video",controls:!0,aspectRatio:"16/9",src:s.url,crossorigin:""},y=`
+            <media-player ${Object.entries(m).reduce((a,[i,u])=>{const v=u?`${i}="${String(u)}"`:i;return`${a} ${v}`},"")}>
                 <media-provider></media-provider>
                 <media-audio-layout></media-audio-layout>
                 <media-video-layout></media-video-layout>
-            </media-player>`,r=(s==null?void 0:s.width)||this.options.maxWidth;if(t==null||t.insertAdjacentHTML("beforeend",y),r&&(t==null||t.style.setProperty("--gl-video-max-width",r)),(c=this.options)!=null&&c.injectAssets&&((d=this.options)!=null&&d.assets)){const o=((l=this.options.assets)==null?void 0:l.css)||[],i=((u=this.options.assets)==null?void 0:u.js)||[];await this.instance.injectAssets([...o,...i])}const p=document.getElementById(`gl-player-${a}`);return this.players.set(t,p),!0}slideHasPlayer(e){const t=e.querySelector(".gl-video-player");return t&&this.players.has(t)?this.players.get(t):!1}cssStyle(){return`
+            </media-player>`,n=(s==null?void 0:s.width)||this.options.maxWidth;if(t==null||t.insertAdjacentHTML("beforeend",y),n&&(t==null||t.style.setProperty("--gl-video-max-width",n)),(r=this.options)!=null&&r.injectAssets&&((c=this.options)!=null&&c.assets)){const a=((d=this.options.assets)==null?void 0:d.css)||[],i=((l=this.options.assets)==null?void 0:l.js)||[];await this.instance.injectAssets([...a,...i])}const p=document.getElementById(`gl-player-${o}`);return this.players.set(`player-${e}`,p),!0}slideHasPlayer(e){return this.players.has(`player-${e}`)?this.players.get(`player-${e}`):!1}cssStyle(){return`
             .gl-type-video iframe.vds-youtube[data-no-controls] {
@@ -19,2 +19,2 @@ height: 100%;
             }
-        `}}exports.VideoSlide=b;
+        `}}exports.VideoSlide=g;

dist/index.es.js

@@ -1,2 +0,2 @@
-class g {
+class b {
   /**
@@ -46,6 +46,6 @@ * This method is called when the lightbox is opened
 }
-class f extends g {
+class f extends b {
   constructor(e = {}) {
     super(), this.name = "video", this.type = "slide", this.players = /* @__PURE__ */ new Map(), this.defaults = {
-      maxWidth: "700px",
+      maxWidth: "840px",
       autoPlay: !0,
@@ -68,6 +68,6 @@ injectAssets: !0,
     this.instance.on("slide_before_change", () => {
-      const e = this.instance.getActiveSlide(), t = e && this.slideHasPlayer(e);
+      const e = this.instance.getActiveSlideIndex(), t = this.slideHasPlayer(e);
       t && (t == null || t.pause());
     }), this.options.autoPlay && this.instance.on("slide_changed", () => {
-      const e = this.instance.getActiveSlide(), t = e && this.slideHasPlayer(e);
+      const e = this.instance.getActiveSlideIndex(), t = this.slideHasPlayer(e);
       if (t) {
@@ -85,5 +85,5 @@ if (t != null && t.paused && (t != null && t.duration))
   async build({ index: e, slide: t, config: s }) {
-    var c, d, l, u;
-    const a = Math.floor(Math.random() * Date.now()) + e, n = {
-      id: `gl-player-${a}`,
+    var r, c, d, l;
+    const o = Math.floor(Math.random() * Date.now()) + e, m = {
+      id: `gl-player-${o}`,
       class: "gl-video-player",
@@ -95,8 +95,6 @@ viewType: "video",
       crossorigin: ""
-    };
-    this.options.autoPlay && (n.autoPlay = "");
-    const y = `
-            <media-player ${Object.entries(n).reduce((o, [i, h]) => {
-      const v = h ? `${i}="${String(h)}"` : i;
-      return `${o} ${v}`;
+    }, p = `
+            <media-player ${Object.entries(m).reduce((a, [i, u]) => {
+      const v = u ? `${i}="${String(u)}"` : i;
+      return `${a} ${v}`;
     }, "")}>
@@ -106,13 +104,12 @@ <media-provider></media-provider>
                 <media-video-layout></media-video-layout>
-            </media-player>`, r = (s == null ? void 0 : s.width) || this.options.maxWidth;
-    if (t == null || t.insertAdjacentHTML("beforeend", y), r && (t == null || t.style.setProperty("--gl-video-max-width", r)), (c = this.options) != null && c.injectAssets && ((d = this.options) != null && d.assets)) {
-      const o = ((l = this.options.assets) == null ? void 0 : l.css) || [], i = ((u = this.options.assets) == null ? void 0 : u.js) || [];
-      await this.instance.injectAssets([...o, ...i]);
+            </media-player>`, n = (s == null ? void 0 : s.width) || this.options.maxWidth;
+    if (t == null || t.insertAdjacentHTML("beforeend", p), n && (t == null || t.style.setProperty("--gl-video-max-width", n)), (r = this.options) != null && r.injectAssets && ((c = this.options) != null && c.assets)) {
+      const a = ((d = this.options.assets) == null ? void 0 : d.css) || [], i = ((l = this.options.assets) == null ? void 0 : l.js) || [];
+      await this.instance.injectAssets([...a, ...i]);
     }
-    const p = document.getElementById(`gl-player-${a}`);
-    return this.players.set(t, p), !0;
+    const y = document.getElementById(`gl-player-${o}`);
+    return this.players.set(`player-${e}`, y), !0;
   }
   slideHasPlayer(e) {
-    const t = e.querySelector(".gl-video-player");
-    return t && this.players.has(t) ? this.players.get(t) : !1;
+    return this.players.has(`player-${e}`) ? this.players.get(`player-${e}`) : !1;
   }
@@ -119,0 +116,0 @@ cssStyle() {

dist/index.umd.js

@@ -1,7 +0,7 @@
-(function(s,i){typeof exports=="object"&&typeof module<"u"?i(exports):typeof define=="function"&&define.amd?define(["exports"],i):(s=typeof globalThis<"u"?globalThis:s||self,i(s.ImagePlugin={}))})(this,function(s){"use strict";class i{init(){}destroy(){}match(e){return!1}build({index:e,slide:t,config:o}){return Promise.resolve(!1)}cssStyle(){return""}assets(){return{}}}class y extends i{constructor(e={}){super(),this.name="video",this.type="slide",this.players=new Map,this.defaults={maxWidth:"700px",autoPlay:!0,injectAssets:!0,assets:{css:["https://cdn.jsdelivr.net/npm/vidstack@^1.0.0/player/styles/default/theme.min.css","https://cdn.jsdelivr.net/npm/vidstack@^1.0.0/player/styles/default/layouts/video.min.css"],js:[{src:"https://cdn.jsdelivr.net/npm/vidstack@^1.0.0/cdn/vidstack.js",module:!0}]},vistack:{}},this.options={...this.defaults,...e}}init(){this.instance.on("slide_before_change",()=>{const e=this.instance.getActiveSlide(),t=e&&this.slideHasPlayer(e);t&&(t==null||t.pause())}),this.options.autoPlay&&this.instance.on("slide_changed",()=>{const e=this.instance.getActiveSlide(),t=e&&this.slideHasPlayer(e);if(t){if(t!=null&&t.paused&&(t!=null&&t.duration))return t==null?void 0:t.play();t.addEventListener("can-play",()=>t==null?void 0:t.play())}})}match(e){let t=!1;return(e.match(/vimeo\.com\/([0-9]*)/)||e.match(/(youtube\.com|youtube-nocookie\.com)\/watch\?v=([a-zA-Z0-9\-_]+)/)||e.match(/youtu\.be\/([a-zA-Z0-9\-_]+)/)||e.match(/(youtube\.com|youtube-nocookie\.com)\/embed\/([a-zA-Z0-9\-_]+)/)||e.match(/(youtube\.com|youtube-nocookie\.com)\/shorts\/([a-zA-Z0-9\-_]+)/)||e.match(/\.(mpg|avi|webm|mov|ogv|mp4)/)!==null)&&(t=!0),t}async build({index:e,slide:t,config:o}){var l,u,h,m;const d=Math.floor(Math.random()*Date.now())+e,r={id:`gl-player-${d}`,class:"gl-video-player",viewType:"video",controls:!0,aspectRatio:"16/9",src:o.url,crossorigin:""};this.options.autoPlay&&(r.autoPlay="");const f=`
-            <media-player ${Object.entries(r).reduce((n,[a,p])=>{const b=p?`${a}="${String(p)}"`:a;return`${n} ${b}`},"")}>
+(function(s,i){typeof exports=="object"&&typeof module<"u"?i(exports):typeof define=="function"&&define.amd?define(["exports"],i):(s=typeof globalThis<"u"?globalThis:s||self,i(s.ImagePlugin={}))})(this,function(s){"use strict";class i{init(){}destroy(){}match(e){return!1}build({index:e,slide:t,config:o}){return Promise.resolve(!1)}cssStyle(){return""}assets(){return{}}}class p extends i{constructor(e={}){super(),this.name="video",this.type="slide",this.players=new Map,this.defaults={maxWidth:"840px",autoPlay:!0,injectAssets:!0,assets:{css:["https://cdn.jsdelivr.net/npm/vidstack@^1.0.0/player/styles/default/theme.min.css","https://cdn.jsdelivr.net/npm/vidstack@^1.0.0/player/styles/default/layouts/video.min.css"],js:[{src:"https://cdn.jsdelivr.net/npm/vidstack@^1.0.0/cdn/vidstack.js",module:!0}]},vistack:{}},this.options={...this.defaults,...e}}init(){this.instance.on("slide_before_change",()=>{const e=this.instance.getActiveSlideIndex(),t=this.slideHasPlayer(e);t&&(t==null||t.pause())}),this.options.autoPlay&&this.instance.on("slide_changed",()=>{const e=this.instance.getActiveSlideIndex(),t=this.slideHasPlayer(e);if(t){if(t!=null&&t.paused&&(t!=null&&t.duration))return t==null?void 0:t.play();t.addEventListener("can-play",()=>t==null?void 0:t.play())}})}match(e){let t=!1;return(e.match(/vimeo\.com\/([0-9]*)/)||e.match(/(youtube\.com|youtube-nocookie\.com)\/watch\?v=([a-zA-Z0-9\-_]+)/)||e.match(/youtu\.be\/([a-zA-Z0-9\-_]+)/)||e.match(/(youtube\.com|youtube-nocookie\.com)\/embed\/([a-zA-Z0-9\-_]+)/)||e.match(/(youtube\.com|youtube-nocookie\.com)\/shorts\/([a-zA-Z0-9\-_]+)/)||e.match(/\.(mpg|avi|webm|mov|ogv|mp4)/)!==null)&&(t=!0),t}async build({index:e,slide:t,config:o}){var c,l,u,h;const d=Math.floor(Math.random()*Date.now())+e,v={id:`gl-player-${d}`,class:"gl-video-player",viewType:"video",controls:!0,aspectRatio:"16/9",src:o.url,crossorigin:""},f=`
+            <media-player ${Object.entries(v).reduce((n,[a,m])=>{const b=m?`${a}="${String(m)}"`:a;return`${n} ${b}`},"")}>
                 <media-provider></media-provider>
                 <media-audio-layout></media-audio-layout>
                 <media-video-layout></media-video-layout>
-            </media-player>`,c=(o==null?void 0:o.width)||this.options.maxWidth;if(t==null||t.insertAdjacentHTML("beforeend",f),c&&(t==null||t.style.setProperty("--gl-video-max-width",c)),(l=this.options)!=null&&l.injectAssets&&((u=this.options)!=null&&u.assets)){const n=((h=this.options.assets)==null?void 0:h.css)||[],a=((m=this.options.assets)==null?void 0:m.js)||[];await this.instance.injectAssets([...n,...a])}const g=document.getElementById(`gl-player-${d}`);return this.players.set(t,g),!0}slideHasPlayer(e){const t=e.querySelector(".gl-video-player");return t&&this.players.has(t)?this.players.get(t):!1}cssStyle(){return`
+            </media-player>`,r=(o==null?void 0:o.width)||this.options.maxWidth;if(t==null||t.insertAdjacentHTML("beforeend",f),r&&(t==null||t.style.setProperty("--gl-video-max-width",r)),(c=this.options)!=null&&c.injectAssets&&((l=this.options)!=null&&l.assets)){const n=((u=this.options.assets)==null?void 0:u.css)||[],a=((h=this.options.assets)==null?void 0:h.js)||[];await this.instance.injectAssets([...n,...a])}const g=document.getElementById(`gl-player-${d}`);return this.players.set(`player-${e}`,g),!0}slideHasPlayer(e){return this.players.has(`player-${e}`)?this.players.get(`player-${e}`):!1}cssStyle(){return`
             .gl-type-video iframe.vds-youtube[data-no-controls] {
@@ -19,2 +19,2 @@ height: 100%;
             }
-        `}}s.VideoSlide=y,Object.defineProperty(s,Symbol.toStringTag,{value:"Module"})});
+        `}}s.VideoSlide=p,Object.defineProperty(s,Symbol.toStringTag,{value:"Module"})});

dist/video.d.ts

@@ -30,3 +30,3 @@ import type { BuildParams, PluginOptions, PluginType } from '@glightbox/plugin-core';
     options?: VideoOptions;
-    players: Map<HTMLElement, unknown>;
+    players: Map<string, unknown>;
     defaults: VideoOptions;
@@ -33,0 +33,0 @@ constructor(options?: Partial<VideoOptions>);

package.json

 {
   "name": "@glightbox/video",
-  "version": "1.0.0-beta.1",
+  "version": "1.0.0-beta.2",
   "description": "GLightbox plugin to add support for displaying videos in the lightbox",
@@ -31,5 +31,5 @@ "author": "Biati Digital",
   "dependencies": {
-    "@glightbox/plugin-core": "1.0.0-beta.1"
+    "@glightbox/plugin-core": "1.0.0-beta.2"
   },
   "license": "GPLV3"
 }

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

Worsened metrics

Total package byte prevSize

13097

decreased by-1.41%

Lines of code

225

decreased by-1.32%

Dependency changes

• + Added@glightbox/plugin-core@1.0.0-beta.2(transitive)

• - Removed@glightbox/plugin-core@1.0.0-beta.1(transitive)

• Updated@glightbox/plugin-core@1.0.0-beta.2