lightgallery/plugins/video/lg-video.min.js

lightGallery is a feature-rich, modular JavaScript gallery plugin for building beautiful image and video galleries for the web and the mobile

!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?module.exports=t():"function"==typeof define&&define.amd?define(t):(e="undefined"!=typeof globalThis?globalThis:e||self).lgVideo=t()}(this,function(){"use strict";const e={autoplayFirstVideo:!0,videoFacade:!0,youTubeNoCookie:!0,youTubePlayerParams:!1,vimeoPlayerParams:!1,wistiaPlayerParams:!1,gotoNextSlideOnVideoEnd:!0,autoplayVideoOnSlide:!1,videojs:!1,videojsTheme:"",videojsOptions:{}};var t=Object.defineProperty,o=Object.getOwnPropertySymbols,i=Object.prototype.hasOwnProperty,s=Object.prototype.propertyIsEnumerable,l=(e,o,i)=>o in e?t(e,o,{enumerable:!0,configurable:!0,writable:!0,value:i}):e[o]=i,n=(e,t)=>{for(var n in t||(t={}))i.call(t,n)&&l(e,n,t[n]);if(o)for(var n of o(t))s.call(t,n)&&l(e,n,t[n]);return e};function d(e){return"object"==typeof e&&e?e:{}}function r(e){return Object.keys(e).map(t=>`${encodeURIComponent(t)}=${encodeURIComponent(e[t])}`).join("&")}function a(e,t,o,i=!0){if(!e.youtube)return;const s=e.youtube[2]?e.youtube[2].slice(1).split("&").map(e=>e.split("=")).reduce((e,t)=>{const[o,i]=t.map(decodeURIComponent);return o&&(e[o]=null!=i?i:""),e},{}):{};const l=n(n({wmode:"opaque",autoplay:0,mute:1,enablejsapi:1},d(t)),s),a=i||function(e){return e.includes("youtube-nocookie.com")}(o)?"//www.youtube-nocookie.com/":"//www.youtube.com/";return`${a}embed/${e.youtube[1]}?${r(l)}`}const c="lgHasVideo",h="lgSlideItemLoad",u="lgBeforeSlide",m="lgAfterSlide",g="lgPosterClick";var y=Object.defineProperty,p=Object.getOwnPropertySymbols,f=Object.prototype.hasOwnProperty,v=Object.prototype.propertyIsEnumerable,w=(e,t,o)=>t in e?y(e,t,{enumerable:!0,configurable:!0,writable:!0,value:o}):e[t]=o,b=(e,t)=>{for(var o in t||(t={}))f.call(t,o)&&w(e,o,t[o]);if(p)for(var o of p(t))v.call(t,o)&&w(e,o,t[o]);return e};const V={};function $(e){return V[e]||(V[e]=new Promise(t=>{const o=document.createElement("script");o.src=e,o.async=!0,o.onload=()=>t(),o.onerror=()=>t(),document.head.appendChild(o)})),V[e]}return class{constructor(t){return this.core=t,this.settings=b(b({},e),this.core.settings),this}init(){this.core.LGel.on(`${c}.video`,this.onHasVideo.bind(this)),this.core.LGel.on(`${g}.video`,()=>{const e=this.core.getSlideItem(this.core.index);this.loadVideoOnPosterClick(e)}),this.core.LGel.on(`${h}.video`,this.onSlideItemLoad.bind(this)),this.core.LGel.on(`${u}.video`,this.onBeforeSlide.bind(this)),this.core.LGel.on(`${m}.video`,this.onAfterSlide.bind(this))}onSlideItemLoad(e){const{isFirstSlide:t,index:o}=e.detail;this.settings.autoplayFirstVideo&&t&&o===this.core.index&&setTimeout(()=>{this.loadAndPlayVideo(o)},200),!t&&this.settings.autoplayVideoOnSlide&&o===this.core.index&&this.loadAndPlayVideo(o)}onHasVideo(e){const{index:t,src:o,html5Video:i,hasPoster:s}=e.detail;s||(this.appendVideos(this.core.getSlideItem(t),{src:o,addClass:"lg-object",index:t,html5Video:i}),this.gotoNextSlideOnVideoEnd(o,t))}onBeforeSlide(e){if(this.core.lGalleryOn){const{prevIndex:t}=e.detail;this.pauseVideo(t)}}onAfterSlide(e){const{index:t,prevIndex:o}=e.detail,i=this.core.getSlideItem(t);this.settings.autoplayVideoOnSlide&&t!==o&&i.hasClass("lg-complete")&&setTimeout(()=>{this.loadAndPlayVideo(t)},100)}loadAndPlayVideo(e){const t=this.core.getSlideItem(e);this.core.galleryItems[e].poster?this.loadVideoOnPosterClick(t,!0):this.playVideo(e)}playVideo(e){this.controlVideo(e,"play")}pauseVideo(e){this.controlVideo(e,"pause")}getVideoHtml(e,t,o,i){let s="";const l=this.core.galleryItems[o].__slideVideoInfo||{},c=this.core.galleryItems[o];let h=c.title||c.alt;h=h?'title="'+h+'"':"";const u='allowtransparency="true"\n            frameborder="0"\n            scrolling="no"\n            allowfullscreen\n            mozallowfullscreen\n            webkitallowfullscreen\n            oallowfullscreen\n            msallowfullscreen';if(l.youtube){s=`<iframe allow="autoplay" id=${"lg-youtube"+o} class="lg-video-object lg-youtube ${t}" ${h} src="${a(l,this.settings.youTubePlayerParams,e,this.settings.youTubeNoCookie)}" ${u}></iframe>`}else if(l.vimeo){const e="lg-vimeo"+o,i=function(e,t){if(!e.vimeo)return;let o=e.vimeo[2]||"",i=r(n({autoplay:0,muted:1},d(t)));const s=((e.vimeo[0].split("/").pop()||"").split("?")[0]||"").split("#")[0],l=e.vimeo[1]!==s;l&&(o=o.replace(`/${s}`,"")),o="?"===o[0]?`&${o.slice(1)}`:o||"";const a=l?`h=${s}`:"";return i=a?`&${i}`:i,`//player.vimeo.com/video/${e.vimeo[1]}?${a}${i}${o}`}(l,this.settings.vimeoPlayerParams);s=`<iframe allow="autoplay" id=${e} class="lg-video-object lg-vimeo ${t}" ${h} src="${i}" ${u}></iframe>`}else if(l.wistia){const e="lg-wistia"+o,i=function(e,t){if(!e.wistia)return;const o=d(t),i=Object.keys(o).length?r(o):"";return`//fast.wistia.net/embed/iframe/${e.wistia[4]}${i?`?${i}`:""}`}(l,this.settings.wistiaPlayerParams);s=`<iframe allow="autoplay" id="${e}" src="${i}" ${h} class="wistia_embed lg-video-object lg-wistia ${t}" name="wistia_embed" ${u}></iframe>`}else if(l.html5){let e="";for(let s=0;s<i.source.length;s++){const t=i.source[s].type,o=t?`type="${t}"`:"";e+=`<source src="${i.source[s].src}" ${o}>`}if(i.tracks)for(let s=0;s<i.tracks.length;s++){let t="";const o=i.tracks[s];Object.keys(o||{}).forEach(function(e){t+=`${e}="${o[e]}" `}),e+=`<track ${t}>`}let t="";const o=i.attributes||{};Object.keys(o||{}).forEach(function(e){t+=`${e}="${o[e]}" `}),s=`<video class="lg-video-object lg-html5 ${this.settings.videojs&&this.settings.videojsTheme?this.settings.videojsTheme+" ":""} ${this.settings.videojs?" video-js":""}" ${t}>\n                ${e}\n                Your browser does not support HTML5 video.\n            </video>`}return s}appendVideos(e,t){var o;const i=this.getVideoHtml(t.src,t.addClass,t.index,t.html5Video);e.find(".lg-video-cont").append(i);const s=e.find(".lg-video-object").first();if(t.html5Video&&s.on("mousedown.lg.video",e=>{e.stopPropagation()}),this.settings.videojs&&(null==(o=this.core.galleryItems[t.index].__slideVideoInfo)?void 0:o.html5))try{return videojs(s.get(),this.settings.videojsOptions)}catch(l){console.error("lightGallery:- Make sure you have included videojs. See https://www.lightgalleryjs.com/demos/video-gallery/")}}gotoNextSlideOnVideoEnd(e,t){const o=this.core.getSlideItem(t).find(".lg-video-object").first(),i=this.core.galleryItems[t].__slideVideoInfo||{};this.settings.gotoNextSlideOnVideoEnd&&(i.html5?o.on("ended",()=>{this.core.goToNextSlide()}):i.vimeo?this.withVimeoApi(()=>{new Vimeo.Player(o.get()).on("ended",()=>{this.core.goToNextSlide()})}):i.wistia&&this.pushWistiaCommand({id:o.attr("id"),onReady:e=>{e.bind("end",()=>{this.core.goToNextSlide()})}}))}withVimeoApi(e){const t=()=>{try{e()}catch(t){console.error("lightGallery:- Make sure you have included //github.com/vimeo/player.js. See https://www.lightgalleryjs.com/demos/video-gallery/")}};window.Vimeo&&window.Vimeo.Player?t():$("https://player.vimeo.com/api/player.js").then(t)}pushWistiaCommand(e){try{window._wq=window._wq||[],window._wq.push(e)}catch(t){return void console.error("lightGallery:- Make sure you have included //fast.wistia.com/assets/external/E-v1.js. See https://www.lightgalleryjs.com/demos/video-gallery/")}window.Wistia||$("https://fast.wistia.com/assets/external/E-v1.js")}controlVideo(e,t){const o=this.core.getSlideItem(e).find(".lg-video-object").first(),i=this.core.galleryItems[e].__slideVideoInfo||{};if(o.get())if(i.youtube)try{o.get().contentWindow.postMessage(`{"event":"command","func":"${t}Video","args":""}`,"*")}catch(s){console.error(`lightGallery:- ${s}`)}else if(i.vimeo)this.withVimeoApi(()=>{new Vimeo.Player(o.get())[t]()});else if(i.html5)if(this.settings.videojs)try{videojs(o.get())[t]()}catch(s){console.error("lightGallery:- Make sure you have included videojs. See https://www.lightgalleryjs.com/demos/video-gallery/")}else o.get()[t]();else i.wistia&&this.pushWistiaCommand({id:o.attr("id"),onReady:e=>{e[t]()}})}loadVideoOnPosterClick(e,t){if(e.hasClass("lg-video-loaded"))t&&this.playVideo(this.core.index);else if(e.hasClass("lg-has-video"))this.playVideo(this.core.index);else{let t;e.addClass("lg-has-video");const o=this.core.galleryItems[this.core.index].src,i=this.core.galleryItems[this.core.index].video;i&&(t="string"==typeof i?JSON.parse(i):i);const s=this.appendVideos(e,{src:o,addClass:"",index:this.core.index,html5Video:t});this.gotoNextSlideOnVideoEnd(o,this.core.index);const l=e.find(".lg-object").first().get();e.find(".lg-video-cont").first().append(l),e.addClass("lg-video-loading"),s&&s.ready(()=>{s.on("loadedmetadata",()=>{this.onVideoLoadAfterPosterClick(e,this.core.index)})}),e.find(".lg-video-object").first().on("load.lg error.lg loadedmetadata.lg",()=>{setTimeout(()=>{this.onVideoLoadAfterPosterClick(e,this.core.index)},50)})}}onVideoLoadAfterPosterClick(e,t){e.addClass("lg-video-loaded"),this.playVideo(t)}destroy(){this.core.LGel.off(".lg.video"),this.core.LGel.off(".video")}}});