dragon-lightbox - npm Package Compare versions

Comparing version 1.3.5 to 1.4.0

dist/dragon-lightbox.min.js

@@ -1,1 +0,1 @@
-var e=Object.defineProperty,t=(t,n,i)=>(((t,n,i)=>{n in t?e(t,n,{enumerable:!0,configurable:!0,writable:!0,value:i}):t[n]=i})(t,"symbol"!=typeof n?n+"":n,i),i);const n={lazy:!0,fireevent:"click",autoplay:!1,autoscale:!0,showscroll:!1,type:void 0,attributes:void 0};var i=(e=>(e.CONTAINER="data-dlightbox-container",e.INITIALIZER="data-dlightbox",e.IGNORE="data-ignore",e.ID="data-id",e.TYPE="data-type",e.DATA="data",e.CACHED="data-cached",e))(i||{});const s={OPEN:"dlightbox:open",CLOSE:"dlightbox:close",CHANGE:"dlightbox:change"},o=class e{constructor(){t(this,"_element"),t(this,"generateSpinner",(()=>{const e=document.createElement("div"),t=document.createElement("div"),n=document.createElement("div");e.id="lightbox-spinner",e.classList.add("lightbox-spinner"),t.classList.add("lightbox-spinner-front"),n.classList.add("lightbox-spinner-back");for(let i=1;i<4;i++)t.append(document.createElement("div")),n.append(document.createElement("div")),t.children[i-1].classList.add(`lightbox-spinner-ball${i}`,"front"),n.children[i-1].classList.add(`lightbox-spinner-ball${i}`,"back");return e.append(t,n),e})),this._element=this.generateSpinner()}static getSpinner(){return e.lbSpinner||(e.lbSpinner=new e),e.lbSpinner}get element(){return this._element}showSpinner(e){this._element&&(this._element.ariaLabel=e||"",this._element.classList.remove("error"),this._element.style.display="")}hideSpinner(){this._element&&(this._element.ariaLabel="",this._element.classList.remove("error"),this._element.style.display="none")}};t(o,"lbSpinner");let r=o;class a{constructor(e,n,i){t(this,"_element"),t(this,"_resourceUrl"),t(this,"_loaded"),t(this,"_config"),t(this,"_isSelected"),t(this,"_spinner"),t(this,"_attributes"),t(this,"abortDownloadingUnloadedNode",(()=>{if(this.spinner.element.classList.remove("error"),!this.loaded&&""!=this.element.getAttribute("src"))return this.element.setAttribute("src",""),void this.element.remove()})),t(this,"setCommonAttributes",(()=>{if(this.element&&this.attributes)for(const{name:e,value:t}of this.attributes)!Object.keys(this.config).find((t=>t===e))&&t&&this.element.setAttribute(e,t)})),this._resourceUrl=e,this._attributes=n,this._config=i,this._isSelected=!1,this._element=null,this._loaded=!1,this._spinner=r.getSpinner(),this.config.lazy||this.buildElement()}get element(){return this._element}get config(){return this._config}get attributes(){return this._attributes}get isSelected(){return this._isSelected}get loaded(){return this._loaded}set loaded(e){this._loaded=e}get spinner(){return this._spinner}set isSelected(e){this._isSelected=e}set element(e){this._element=e}get resourceUrl(){return this._resourceUrl}buildElement(){}isElementBuilt(){return!!this.element&&!!Object.values(this.element.attributes).map((e=>e.nodeValue)).includes(this.resourceUrl)}open(){this.loaded&&this.isElementBuilt()?this.element.style.display="":this.buildElement()}close(){this.abortDownloadingUnloadedNode(),this.spinner.hideSpinner(),this.element.style.display="none",this.isSelected=!1}}var l=(e=>(e.IMAGE="image",e.VIDEO="video",e.EMBED="embed",e))(l||{});const h=["jpg","png","gif","bmp","svg"],d=["href","src",i.INITIALIZER],c=["mp4","ogg","webm"],m={YOUTUBE:"youtube",DAILYMOTION:"dailymotion",VIMEO:"vimeo"},b=(e,t)=>{for(const{name:n,value:s}of t){const t=n.replace(`${i.DATA}-`,"");if(Object.keys(e).includes(t)){let n=s;n=!s||"true"===s.toLowerCase()||"false"!==s.toLowerCase()&&n,n=/^[0-9]+$/.test(n)?Number(n):n,e={...e,[t]:n}}}return e};class p extends a{constructor(e,n,i){super(e,n,i),t(this,"abortDownloadingUnloadedNode",(()=>{this.loaded||""!=this.element.getAttribute("src")||this.element.remove()}))}buildElement(){const e=document.createElement("iframe");var t;e.hidden=!0,this.element=e,this.spinner.showSpinner(),this.setCommonAttributes(),e.setAttribute("style",`\n    ${(t=this.config.autoscale)?"width: 100%":"width: 55vw"};\n    ${t?"height: calc(100vw - 55vw)":"height: calc(50vw - 20vw)"};\n    ${Number.isInteger(t)?`max-width: ${t}px`:""};\n    ${Number.isInteger(t)?`max-height: calc(${t}px - calc(${+t>=300?"300px":`${t}px`} / 2.2))`:""};\n    `),e.allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture",e.setAttribute("tabindex","0"),e.setAttribute(i.CACHED,this.resourceUrl),e.setAttribute("frameborder","0"),e.allowFullscreen=!0,e.classList.add("dlightbox-embed"),e.style.display="none";let n="";n=((e,t)=>{const n=Object.values(m).find((t=>e.replaceAll(".","").includes(t)));let[i,s]=["",""];switch(n){case m.YOUTUBE:if(i=e,!e.includes("/embed")){const t=e.includes("youtu.be")?"/":"watch?v=",n=e.substring(e.lastIndexOf(t)+t.length);s=n.substring(0,n.includes("?")?n.indexOf("?"):n.includes("&")?n.indexOf("&"):void 0);const o=["t","start"];let r=n.replace(s,"").replace("?","").split("&").filter((e=>o.includes(e.split("=")[0])));r=r.map((e=>{const t=e.split("=");return t[0]&&t[1]?`${t[0]}=${t[1].replace("s","")}`:""})).join(),r=r.replace("t=","start="),i=`https://www.youtube.com/embed/${s}${r.length>1?`?${r}`:""}`}break;case m.DAILYMOTION:s=e.substring(e.lastIndexOf("/")+1),i=`https://www.dailymotion.com/embed/video/${s}`;break;case m.VIMEO:s=e.substring(e.lastIndexOf("/")+1),i=`https://player.vimeo.com/video/${s}`;break;default:return i}const o=i.includes("?")?"":"?";return i+=t?`${o}&autoplay=1`:"",i})(this.resourceUrl,this.config.autoplay),e.src=""===n?this.resourceUrl:n,e.onload=()=>{this.loaded=!0,this.isSelected&&(e.classList.add("lightbox-shadow"),this.spinner.hideSpinner(),e.hidden=!1,e.style.display="")},e.onerror=()=>{this.loaded=!1,this.element.remove(),this.spinner.showSpinner("Error on loading iframe"),this.spinner.element.classList.add("error")}}open(){if(this.isElementBuilt()||!this.config.autoplay)return this.isElementBuilt()?(this.element.classList.add("lightbox-shadow"),void(this.element.style.display="")):(this.buildElement(),void(this.element.style.display=""));this.buildElement()}close(){this.abortDownloadingUnloadedNode(),this.spinner.hideSpinner(),this.loaded=!1,this.element.remove(),this.element.classList.remove("lightbox-shadow"),this.element.style.display="none",this.isSelected=!1}}class u extends a{constructor(e,t,n){super(e,t,n)}buildElement(){const e=document.createElement("img");var t;e.hidden=!0,this.element=e,this.setCommonAttributes(),e.setAttribute("style",(!0===(t=this.config.autoscale)?"width: 100%":!1===t?"width: auto; max-width: inherit":`max-width: ${t}px`)+";"),e.classList.add("dlightbox-image"),this.spinner.showSpinner(),e.src=this.resourceUrl,e.onerror=()=>{this.loaded=!1,""!=this.element.getAttribute("src")&&(this.spinner.showSpinner("Error on loading image"),this.spinner.element.classList.add("error"))},e.onload=()=>{this.spinner.hideSpinner(),this.loaded=!0,e.classList.add("lightbox-shadow"),e.hidden=!1}}}class g extends a{constructor(e,t,n){super(e,t,n)}buildElement(){const e=document.createElement("video");var t;e.setAttribute("tabindex","0"),e.hidden=!0,this.element=e,this.setCommonAttributes(),e.setAttribute("style",`\n    ${(t=this.config.autoscale)?"width: 100%":"width: auto; max-width: inherit"};\n    ${Number.isInteger(t)?`width: inherit; max-width: ${t}px`:""};\n    `),e.setAttribute(i.CACHED,this.resourceUrl),e.controls=!0,e.classList.add("dlightbox-video"),this.spinner.showSpinner();const n=document.createElement("source");n.src=this.resourceUrl,e.addEventListener("click",(e=>e.stopPropagation())),e.append(n),n.onerror=()=>{this.loaded=!1,this.spinner.showSpinner("Error on loading video"),this.spinner.element.classList.add("error")},e.oncanplay=()=>{this.loaded=!0,""!=this.element.getAttribute("src")&&(this.spinner.hideSpinner(),e.classList.add("lightbox-shadow"),e.hidden=!1,this.config.autoplay&&this.isSelected&&e.play())}}open(){this.loaded&&this.isElementBuilt()?(this.element.style.display="",this.config.autoplay&&this.element.play()):this.buildElement()}close(){this.abortDownloadingUnloadedNode(),this.spinner.hideSpinner(),this.element.style.display="none",this.isSelected=!1,this.element.pause()}}class x{constructor(e,n,s){t(this,"_lightbox"),t(this,"id"),t(this,"_prev"),t(this,"_next"),t(this,"element"),this.element=e,this.id=Number(e.getAttribute(i.ID));const o=n?b(s,n):null,r={...s,...o};this._lightbox=this.getLightBoxType(e,n,r),this._next=null,this._prev=null}get lightbox(){return this._lightbox}get next(){return this._next}get prev(){return this._prev}set next(e){this._next=e}set prev(e){this._prev=e}getLightBoxType(e,t,n){const s=e.getAttribute(d.filter((t=>e.getAttribute(t)))[0])??"",o=e.getAttribute(i.TYPE)??n.type??null;if(""===s)throw new Error(`Invalid resource. Please, use any of these tags: ${d.join()}`);return o===l.VIDEO||"video"==e.localName||c.some((e=>-1!==s.indexOf(e)))?new g(s,t,n):o===l.IMAGE||"img"==e.localName||h.some((e=>-1!==s.indexOf(e)))?new u(s,t,n):(o===l.EMBED||Object.values(m).some((e=>-1!==s.indexOf(e))),new p(s,t,n))}}class f{constructor(e,n){t(this,"elements"),t(this,"head"),t(this,"tail"),t(this,"size"),this.elements=this.setElementsId(e.map((e=>e.element))),this.head=new x(this.elements[0],e[0].attributes,n),this.head.prev=null;let i=this.head;for(let t=1;t<e.length;t++)i.next=new x(this.elements[t],e[t].attributes,n),i.prev=this.lookupByIndex(t-2),i=i.next;this.size=e.length,i.prev=this.lookupByIndex(this.size-2),this.tail=i}setElementsId(e){const t=[...Array(e.length).keys()];return e.forEach((e=>{e.hasAttribute(i.ID)&&t.splice(Number(e.getAttribute(i.ID)),1)})),e.filter((e=>!e.hasAttribute(i.ID))).forEach(((e,n)=>e.setAttribute(i.ID,String(t[n])))),e}lookupByIndex(e){let t=this.head;for(let n=0;n<e;n++)t=t.next;return t}lookupById(e){let t=this.head;for(;t.id!==e;)t=t.next;return t}}class v{constructor(e){t(this,"modal"),t(this,"container"),t(this,"lastTabPos",0),this.modal=null,this.container=e}getModal(){var e;return this.modal||(this.modal=this.buildModal(),null==(e=this.modal)||e.addEventListener("mousedown",(e=>{e.composedPath().find(((e,t)=>{var n;return 1==t&&(null==(n=e.classList)?void 0:n.contains("lightbox-container__media"))}))||this.container.destroyContainer()}))),this.modal}buildModal(){const e=document.createElement("div");return e.id="dragon-lightbox-modal",e.classList.add("lightbox-modal"),e.prepend((e=>{const t=document.createElement("style");return t.innerText=".dlightbox-hidden {overflow:hidden !important}.lightbox-modal {display:flex;justify-content:center;z-index:1000;width:100%;height:100vh;position:fixed;top:0;left:0;background-color:rgba(0,0,0,.87);transition:opacity .2s;transition-property:transform, opacity;opacity:0}.lightbox-modal-open {opacity:1}.lightbox-container {display:flex;width:100%;align-items:center;justify-content:center;overflow-x:hidden}.lightbox-shadow {filter:drop-shadow(0 0 15px black)}.lightbox-container__media {max-height:90vh;width:100%;max-width:90%;display:flex;justify-content:center;align-items:center;transition:transform .2s;transform:scale(.7)}.lightbox-container__media>* {transition:.1s ease-in;transition-property:transform, opacity;transform:translateX(0px);opacity:1}.lightbox-type__closed-left>* {transition:none;opacity:0;transform:translateX(100px)}.lightbox-type__closed-right>* {transition:none;opacity:0;transform:translateX(-100px)}.lightbox-container__media-open {transform:scale(1)}.lightbox-container__media:focus {outline:none}.lightbox-container__media:focus>*:not(img, video) {filter:drop-shadow(0 0 5px white)}.lightbox-container__next-arrow,.lightbox-container__prev-arrow {width:10%;height:3em;position:relative;margin-bottom:1rem;transform:scale(1.1);opacity:.8;transition:transform .3s}.lightbox-container__next-arrow:focus,.lightbox-container__prev-arrow:focus,.lightbox-container__close:focus {outline:none;transform:scale(1.2);opacity:1}.lightbox-container__prev-arrow:focus {transform:scale(-1.2)}.lightbox-container__prev-arrow {transform:scale(-1.1)}.lightbox-container__next-arrow:hover,.lightbox-container__prev-arrow:hover {opacity:1;cursor:pointer}.lightbox-container__next-arrow::after,.lightbox-container__next-arrow::before,.lightbox-container__prev-arrow::after,.lightbox-container__prev-arrow::before {content:'';width:3px;height:30px;position:absolute;background-color:white;transform-origin:bottom left;transform:rotate(-40deg);top:-4.3px;left:calc(50% + 10%);border-radius:2px}.lightbox-container__next-arrow::before,.lightbox-container__prev-arrow::before {top:22px;transform-origin:top left;transform:rotate(40deg)}.lightbox-container__close {width:20px;height:20px;position:relative;position:absolute;top:2rem;right:1.5rem;opacity:.8;transition:transform .3s}.lightbox-container__close:hover {cursor:pointer;opacity:1}.lightbox-container__close::after,.lightbox-container__close::before {content:'';width:3px;height:20px;position:absolute;left:50%;background-color:white;transform:rotate(-45deg);border-radius:2px}.lightbox-container__close::before {transform:rotate(45deg)}#lightbox-container__hidden-tabindex {opacity:0;position:absolute;top:0}@media (hover:none) {.lightbox-container>[class*=arrow] {opacity:.8 !important}.lightbox-container__next-arrow:focus {transform:scale(1.1)}.lightbox-container__prev-arrow:focus {transform:scale(-1.1)}}@media (max-width:560px) {.lightbox-container__next-arrow,.lightbox-container__prev-arrow {position:absolute;top:87vh;transform:scale(.6) translateX(3rem)}.lightbox-container__prev-arrow {transform:scale(-.6) translateX(3rem) rotateX(180deg)}.lightbox-container__media {max-width:100%;max-height:70vh}.lightbox-container__close:focus {transform:none;opacity:1}.lightbox-container__next-arrow:focus {transform:scale(.6) translateX(3rem);opacity:1}.lightbox-container__prev-arrow:focus {transform:scale(-.6) translateX(3rem);opacity:1}}.dlightbox-image {max-height:inherit;max-width:unset;object-fit:contain;width:inherit}.dlightbox-video {max-height:inherit;max-width:unset;object-fit:contain}.dlightbox-embed {max-height:inherit;max-width:unset}@media (max-width:560px) {.dlightbox-video, .dlightbox-embed {width:100% !important}.dlightbox-embed {height:calc(100vw - 20vw) !important}}.lightbox-spinner {width:15vw;height:15vw;position:relative}.lightbox-spinner>.lightbox-spinner-back,.lightbox-spinner>.lightbox-spinner-front {border-radius:50%;width:100%;height:100%;position:relative;display:flex;align-items:center;justify-content:space-between}.lightbox-spinner>.lightbox-spinner-front {position:absolute}.lightbox-spinner>.lightbox-spinner-back {z-index:-1}.lightbox-spinner>.lightbox-spinner-front>*,.lightbox-spinner>.lightbox-spinner-back>* {max-width:15px;max-height:15px}.lightbox-spinner-back>.back {width:14%;height:14%;background-color:white;border-radius:50%;animation:expand .5s ease-in infinite}.lightbox-spinner-front>.front {width:15%;border-radius:50%;height:15%;background-color:white;animation:blink .5s ease-in infinite}.lightbox-spinner.error>.lightbox-spinner-back>.back,.lightbox-spinner.error>.lightbox-spinner-front>.front {background-color:red;animation:none}.lightbox-spinner.error>.lightbox-spinner-back>.back {animation:none;transform:scale(2);opacity:.4}@keyframes blink {0% {transform:scale(.4);opacity:0}20% {transform:scale(.7);opacity:.3}100% {transform:scale(1.2);opacity:0}}@keyframes expand {0% {transform:scale(1);opacity:0}20% {transform:scale(2);opacity:.4}100% {transform:scale(2.4);opacity:0}}.lightbox-spinner-ball1.back,.lightbox-spinner-ball1.front {animation-delay:0s !important}.lightbox-spinner-ball2.back,.lightbox-spinner-ball2.front {animation-delay:.16s !important}.lightbox-spinner-ball3.back,.lightbox-spinner-ball3.front {animation-delay:.32s !important}",t})(this.container.config)),1==this.container.elements.length||(e.addEventListener("touchstart",(({touches:e})=>{this.lastTabPos=e[0].screenX,this.container.mediaElement.style.transition="none"})),e.addEventListener("touchmove",(({touches:e})=>this.container.mediaElement.style.transform=`translateX(${e[0].screenX-this.lastTabPos}px)`)),e.addEventListener("touchend",(({changedTouches:e})=>{this.container.mediaElement.style.transition="";const t=e[0].screenX;this.container.mediaElement.style.transform="",Math.abs(t-this.lastTabPos)<100||(t>this.lastTabPos?this.container.prev():this.container.next())}))),e}}class E{constructor(e,n,o,a){if(t(this,"id"),t(this,"lightboxList"),t(this,"selectedBox"),t(this,"modal"),t(this,"spinner"),t(this,"_config"),t(this,"elementCount"),t(this,"container"),t(this,"_elements"),t(this,"_bindedElements",[]),t(this,"mediaElement"),t(this,"events"),t(this,"nodeListener",(e=>{var t,n;if("keydown"==e.type&&"Enter"!=e.key)return;const s=(null==(t=e.composedPath().find((e=>this._bindedElements.map((e=>e.elements)).flat(1).find((t=>t===e)))))?void 0:t.getAttribute(i.ID))??"0",o=this.getLightBoxById(Number(s));1===e.target.nodeType&&e.preventDefault(),this.openContainer(o),null==(n=document.getElementById("lightbox-container__hidden-tabindex"))||n.focus()})),t(this,"closeContainerBodyEvent",(e=>{this.container&&"Escape"===e.key&&this.destroyContainer()})),t(this,"nextArrowModalEvent",(e=>{this.container&&"ArrowRight"===e.key&&this.next(e)})),t(this,"prevArrowModalEvent",(e=>{this.container&&"ArrowLeft"===e.key&&this.prev(e)})),t(this,"buildCustomEvents",(e=>{const t=new Map;for(const n of Object.values(s))t.set(n,new CustomEvent(n,e));return t})),this.container=null,this.id=e,this.mediaElement=document.createElement("div"),this._config=o,this.modal=new v(this),this.spinner=r.getSpinner(),this.elementCount=n.length,this.lightboxList=new f(n,this.config),this.selectedBox=this.lightboxList.head,this.selectedBox.lightbox.isSelected=!0,this._elements=this.lightboxList.elements,this.events=this.buildCustomEvents({detail:{config:this.config,count:this.elementCount,id:this.id,elements:this.elements,selectedBox:()=>({resourceUrl:this.selectedBox.lightbox.resourceUrl,element:this.selectedBox.element,config:this.selectedBox.lightbox.config,attributes:this.selectedBox.lightbox.attributes})}}),!a){const e={elements:this.elements,fireevent:o.fireevent};this.addNodeEventListeners(e)}}get config(){return this._config}get elements(){return this._elements}get bindings(){return this._bindedElements}listen(e,t){this.mediaElement.addEventListener(e,t)}addNodeEventListeners(e){if("length"in e){if(!e.hasOwnProperty("elements")){if(e.length!==this.elementCount)throw new Error(`You must provide a set of ${this.elementCount} elements!`);return this.bindElements([...e].map((e=>e))),void this._bindedElements.push({elements:[...e].map((e=>e)),fireevent:this.config.fireevent})}}else if(!e.hasOwnProperty("elements")){if(1!==this.elementCount)throw new Error(`You must provide a set of ${this.elementCount} elements!`);return this.bindElements([e]),void this._bindedElements.push({elements:[e],fireevent:this.config.fireevent})}const{elements:t,fireevent:n}=e;this.bindElements(t,n),this._bindedElements.push({elements:t,fireevent:n})}bindElements(e,t){this.lightboxList.setElementsId(e).forEach((e=>{e.addEventListener(t??this.config.fireevent,this.nodeListener),"click"==t&&e.addEventListener("keydown",this.nodeListener)}))}removeNodeEventListeners(){this.destroyContainer();for(const{elements:e,fireevent:t}of this._bindedElements)e.forEach((e=>{e.removeEventListener(t??this.config.fireevent,this.nodeListener),"click"==t&&e.removeEventListener("keydown",this.nodeListener)}))}createContainer(){this.container=document.createElement("div"),!this.config.showscroll&&document.body.classList.add("dlightbox-hidden"),document.body.addEventListener("keydown",this.closeContainerBodyEvent),this.container.classList.add("lightbox-container"),this.container.setAttribute("tabindex","-1"),this.mediaElement.setAttribute("tabindex","0"),this.mediaElement.classList.add("lightbox-container__media"),this.mediaElement.append(this.spinner.element);const e=document.createElement("div");if(e.classList.add("lightbox-container__close"),e.setAttribute("tabindex","0"),e.addEventListener("keydown",(({key:e})=>{"Enter"===e&&this.destroyContainer()})),this.container.prepend(e),this.elementCount>1){const e=document.createElement("div"),t=document.createElement("div");e.classList.add("lightbox-container__next-arrow"),t.classList.add("lightbox-container__prev-arrow"),e.setAttribute("tabindex","0"),t.setAttribute("tabindex","0"),this.container.addEventListener("keydown",(({key:n})=>{"Tab"===n&&document.activeElement===e&&setTimeout((()=>t.focus()),0)})),e.addEventListener("mousedown",(e=>this.next(e))),t.addEventListener("mousedown",(e=>this.prev(e))),e.addEventListener("keydown",(e=>{"Enter"===e.key&&this.next(e)})),t.addEventListener("keydown",(e=>{"Enter"===e.key&&this.prev(e)})),this.modal.getModal().addEventListener("keydown",this.nextArrowModalEvent),this.modal.getModal().addEventListener("keydown",this.prevArrowModalEvent),this.container.prepend(t),this.container.append(this.mediaElement),this.container.append(e)}else{const t=document.createElement("div");t.tabIndex=0,this.container.append(t),e.addEventListener("keydown",(({key:e})=>{"Tab"===e&&setTimeout((()=>this.mediaElement.focus()),0)})),this.container.prepend(this.mediaElement)}setTimeout((()=>this.container.focus()),0)}destroyContainer(){this.container&&(this.modal.getModal().classList.remove("lightbox-modal-open"),this.mediaElement.classList.remove("lightbox-container__media-open"),setTimeout((()=>{var e;this.mediaElement.blur(),document.body.removeAttribute("tabindex"),this.selectedBox.lightbox.close(),this.container.remove(),this.modal.getModal().remove(),document.body.classList.remove("dlightbox-hidden"),document.body.removeEventListener("keydown",this.closeContainerBodyEvent),this.modal.getModal().removeEventListener("keydown",this.nextArrowModalEvent),this.modal.getModal().removeEventListener("keydown",this.prevArrowModalEvent),null==(e=this.mediaElement)||e.dispatchEvent(this.events.get(s.CLOSE)),this.container=null}),200))}getLightBoxById(e){return this.lightboxList.lookupById(e)}openContainer(e=this.lightboxList.head){var t;if(document.getElementById("dragon-lightbox-modal"))return;document.body.setAttribute("tabindex","-1"),this.spinner.element.classList.remove("error");const n=Number.isInteger(e)?this.getLightBoxById(e):e;if(!(n.lightbox instanceof a))throw new Error("Invalid lightbox");const i=this.modal.getModal();this.createContainer(),setTimeout((()=>{this.modal.getModal().classList.add("lightbox-modal-open"),this.mediaElement.classList.add("lightbox-container__media-open")}),0),n.lightbox.open(),this.mediaElement.append(n.lightbox.element),i.append(this.container),i.append(this.container),document.body.prepend(i),this.selectedBox.lightbox.isSelected=!1,this.selectedBox=n,this.selectedBox.lightbox.isSelected=!0,null==(t=this.mediaElement)||t.dispatchEvent(this.events.get(s.OPEN))}appendMediaElement(e){[...this.mediaElement.children].some((t=>t===e))||this.mediaElement.append(e)}openLightBox(e,t){const n=e;setTimeout((()=>{this.mediaElement.classList.remove("lightbox-type__closed-"+(t?"left":"right"))}),100),this.mediaElement.classList.add("lightbox-type__closed-"+(t?"left":"right")),n.lightbox.open(),this.appendMediaElement(e.lightbox.element),this.selectedBox=t?n.prev:n.next}closeLightBox(e){e.lightbox.close()}next(e){var t;null==e||e.stopPropagation(),null==e||e.preventDefault(),this.closeLightBox(this.selectedBox),this.selectedBox===this.lightboxList.tail?(this.openLightBox(this.lightboxList.head,!0),this.selectedBox=this.lightboxList.head,this.selectedBox.lightbox.isSelected=!0):(this.openLightBox(this.selectedBox.next,!0),this.selectedBox=this.selectedBox.next,this.selectedBox.lightbox.isSelected=!0),null==(t=this.mediaElement)||t.dispatchEvent(this.events.get(s.CHANGE))}prev(e){var t;null==e||e.stopPropagation(),null==e||e.preventDefault(),this.closeLightBox(this.selectedBox),this.selectedBox===this.lightboxList.head?(this.openLightBox(this.lightboxList.tail,!1),this.selectedBox=this.lightboxList.tail,this.selectedBox.lightbox.isSelected=!0):(this.openLightBox(this.selectedBox.prev,!1),this.selectedBox=this.selectedBox.prev,this.selectedBox.lightbox.isSelected=!0),null==(t=this.mediaElement)||t.dispatchEvent(this.events.get(s.CHANGE))}}class y{constructor(){t(this,"_instances"),t(this,"createInstanceObject",(e=>{const t={open:e.openContainer.bind(e),close:e.destroyContainer.bind(e),remove:()=>this.removeInstanceObject(e),bind:e.addNodeEventListeners.bind(e),listen:e.listen.bind(e),elements:e.elements,bindings:e.bindings};return this.instances.set(0==this.instances.size?0:[...this.instances.keys()][this.instances.size-1]+1,t),t})),t(this,"removeInstanceObject",(e=>{e.removeNodeEventListeners.call(e),this.instances.delete(e.id)})),t(this,"getConfig",((e,t)=>{const i=t||Object.values(e.attributes).map((e=>({name:e.name,value:e.nodeValue})));return b(n,i)})),t(this,"getAttributes",(e=>{const t=[];if(!e.attributes)return t;const n=["tabindex","class"];for(const{name:s,nodeValue:o}of Object.values(e.attributes)){if(n.includes(s.toLowerCase()))continue;const e=s.replace(`${i.DATA}-`,"");t.push({name:e,value:o??""})}return t})),this._instances=new Map,this.autoinit()}get instances(){return this._instances}create(e,t){var s;try{const o=Array.isArray(e[0])?e:[[e]],r=new Array;for(const[e,t]of o){const n=document.createElement("div"),o=t??null;o&&o.find((e=>e.name===i.TYPE))&&n.setAttribute(i.TYPE,(null==(s=o.find((e=>e.name===i.TYPE)))?void 0:s.value)??""),n.setAttribute("data-dlightbox",String(e)),r.push({element:n,attributes:o})}const a=t?{...n,...t}:n,l=new E(this.instances.size,r,a,!0);return this.createInstanceObject(l)}catch(o){throw new Error(`Invalid dlightbox input: ${o.message}`)}}refresh(){this.instances.forEach((e=>e.remove())),this.autoinit()}autoinit(){const e=document.querySelectorAll(`[${i.CONTAINER}]`),t=document.querySelectorAll(`[${i.INITIALIZER}]:not([${i.CONTAINER}] [${i.INITIALIZER}])`),n=(e,t)=>{let n=this.getConfig(e);n.attributes=this.getAttributes(e),n={...n,...this.getConfig(e,n.attributes)};const i=new E(this.instances.size,t,n);this.createInstanceObject(i)};for(const s of e){const e=d.map((e=>`[${e}]`)),t=Array.from(s.querySelectorAll(`${e.join()}`)).filter((e=>!e.hasAttribute(i.IGNORE))).map((e=>({element:e,attributes:this.getAttributes(e)})));t.length&&n(s,t)}for(const i of t)n(i,[{element:i,attributes:this.getAttributes(i)}])}}(()=>{const e=new y;window.dragonLightBox={instances:e.instances,create:e.create.bind(e),refresh:e.refresh.bind(e)}})();
+!function(e){"function"==typeof define&&define.amd?define(e):e()}((function(){"use strict";var e=Object.defineProperty,t=(t,n,i)=>(((t,n,i)=>{n in t?e(t,n,{enumerable:!0,configurable:!0,writable:!0,value:i}):t[n]=i})(t,"symbol"!=typeof n?n+"":n,i),i);const n={lazy:!0,fireevent:"click",autoplay:!1,autoscale:!0,showscroll:!1,type:void 0,attributes:void 0};var i=(e=>(e.CONTAINER="data-dlightbox-container",e.INITIALIZER="data-dlightbox",e.IGNORE="data-ignore",e.ID="data-id",e.TYPE="data-type",e.DATA="data",e.CACHED="data-cached",e))(i||{});const s={OPEN:"dlightbox:open",CLOSE:"dlightbox:close",CHANGE:"dlightbox:change"},o=class e{constructor(){t(this,"_element"),t(this,"generateSpinner",(()=>{const e=document.createElement("div"),t=document.createElement("div"),n=document.createElement("div");e.id="lightbox-spinner",e.classList.add("lightbox-spinner"),t.classList.add("lightbox-spinner-front"),n.classList.add("lightbox-spinner-back");for(let i=1;i<4;i++)t.append(document.createElement("div")),n.append(document.createElement("div")),t.children[i-1].classList.add(`lightbox-spinner-ball${i}`,"front"),n.children[i-1].classList.add(`lightbox-spinner-ball${i}`,"back");return e.append(t,n),e})),this._element=this.generateSpinner()}static getSpinner(){return e.lbSpinner||(e.lbSpinner=new e),e.lbSpinner}get element(){return this._element}showSpinner(e){this._element&&(this._element.ariaLabel=e||"",this._element.classList.remove("error"),this._element.style.display="")}hideSpinner(){this._element&&(this._element.ariaLabel="",this._element.classList.remove("error"),this._element.style.display="none")}};t(o,"lbSpinner");let r=o;class a{constructor(e,n,i){t(this,"_element"),t(this,"_resourceUrl"),t(this,"_loaded"),t(this,"_config"),t(this,"_isSelected"),t(this,"_spinner"),t(this,"_attributes"),t(this,"abortDownloadingUnloadedNode",(()=>{if(this.spinner.element.classList.remove("error"),!this.loaded&&""!=this.element.getAttribute("src"))return this.element.setAttribute("src",""),void this.element.remove()})),t(this,"setCommonAttributes",(()=>{if(this.element&&this.attributes)for(const{name:e,value:t}of this.attributes)!Object.keys(this.config).find((t=>t===e))&&t&&this.element.setAttribute(e,t)})),this._resourceUrl=e,this._attributes=n,this._config=i,this._isSelected=!1,this._element=null,this._loaded=!1,this._spinner=r.getSpinner(),this.config.lazy||this.buildElement()}get element(){return this._element}get config(){return this._config}get attributes(){return this._attributes}get isSelected(){return this._isSelected}get loaded(){return this._loaded}set loaded(e){this._loaded=e}get spinner(){return this._spinner}set isSelected(e){this._isSelected=e}set element(e){this._element=e}get resourceUrl(){return this._resourceUrl}buildElement(){}isElementBuilt(){return!!this.element&&!!Object.values(this.element.attributes).map((e=>e.nodeValue)).includes(this.resourceUrl)}open(){this.loaded&&this.isElementBuilt()?this.element.style.display="":this.buildElement()}close(){this.abortDownloadingUnloadedNode(),this.spinner.hideSpinner(),this.element.style.display="none",this.isSelected=!1}}var l=(e=>(e.IMAGE="image",e.VIDEO="video",e.EMBED="embed",e))(l||{});const h=["jpg","png","gif","bmp","svg"],d=["href","src",i.INITIALIZER],c=["mp4","ogg","webm"],m={YOUTUBE:"youtube",DAILYMOTION:"dailymotion",VIMEO:"vimeo"},b=(e,t)=>{for(const{name:n,value:s}of t){const t=n.replace(`${i.DATA}-`,"");if(Object.keys(e).includes(t)){let n=s;n=!s||"true"===s.toLowerCase()||"false"!==s.toLowerCase()&&n,n=/^[0-9]+$/.test(n)?Number(n):n,e={...e,[t]:n}}}return e};class p extends a{constructor(e,n,i){super(e,n,i),t(this,"abortDownloadingUnloadedNode",(()=>{this.loaded||""!=this.element.getAttribute("src")||this.element.remove()}))}buildElement(){const e=document.createElement("iframe");var t;e.hidden=!0,this.element=e,this.spinner.showSpinner(),this.setCommonAttributes(),e.setAttribute("style",`\n    ${(t=this.config.autoscale)?"width: 100%":"width: 55vw"};\n    ${t?"height: calc(100vw - 55vw)":"height: calc(50vw - 20vw)"};\n    ${Number.isInteger(t)?`max-width: ${t}px`:""};\n    ${Number.isInteger(t)?`max-height: calc(${t}px - calc(${+t>=300?"300px":`${t}px`} / 2.2))`:""};\n    `),e.allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture",e.setAttribute("tabindex","0"),e.setAttribute(i.CACHED,this.resourceUrl),e.setAttribute("frameborder","0"),e.allowFullscreen=!0,e.classList.add("dlightbox-embed"),e.style.display="none";let n="";n=((e,t)=>{const n=Object.values(m).find((t=>e.replaceAll(".","").includes(t)));let[i,s]=["",""];switch(n){case m.YOUTUBE:if(i=e,!e.includes("/embed")){const t=e.includes("youtu.be")?"/":"watch?v=",n=e.substring(e.lastIndexOf(t)+t.length);s=n.substring(0,n.includes("?")?n.indexOf("?"):n.includes("&")?n.indexOf("&"):void 0);const o=["t","start"];let r=n.replace(s,"").replace("?","").split("&").filter((e=>o.includes(e.split("=")[0])));r=r.map((e=>{const t=e.split("=");return t[0]&&t[1]?`${t[0]}=${t[1].replace("s","")}`:""})).join(),r=r.replace("t=","start="),i=`https://www.youtube.com/embed/${s}${r.length>1?`?${r}`:""}`}break;case m.DAILYMOTION:s=e.substring(e.lastIndexOf("/")+1),i=`https://www.dailymotion.com/embed/video/${s}`;break;case m.VIMEO:s=e.substring(e.lastIndexOf("/")+1),i=`https://player.vimeo.com/video/${s}`;break;default:return i}const o=i.includes("?")?"":"?";return i+=t?`${o}&autoplay=1`:"",i})(this.resourceUrl,this.config.autoplay),e.src=""===n?this.resourceUrl:n,e.onload=()=>{this.loaded=!0,this.isSelected&&(e.classList.add("lightbox-shadow"),this.spinner.hideSpinner(),e.hidden=!1,e.style.display="")},e.onerror=()=>{this.loaded=!1,this.element.remove(),this.spinner.showSpinner("Error on loading iframe"),this.spinner.element.classList.add("error")}}open(){if(this.isElementBuilt()||!this.config.autoplay)return this.isElementBuilt()?(this.element.classList.add("lightbox-shadow"),void(this.element.style.display="")):(this.buildElement(),void(this.element.style.display=""));this.buildElement()}close(){this.abortDownloadingUnloadedNode(),this.spinner.hideSpinner(),this.loaded=!1,this.element.remove(),this.element.classList.remove("lightbox-shadow"),this.element.style.display="none",this.isSelected=!1}}class u extends a{constructor(e,t,n){super(e,t,n)}buildElement(){const e=document.createElement("img");var t;e.hidden=!0,this.element=e,this.setCommonAttributes(),e.setAttribute("style",(!0===(t=this.config.autoscale)?"width: 100%":!1===t?"width: auto; max-width: inherit":`max-width: ${t}px`)+";"),e.classList.add("dlightbox-image"),this.spinner.showSpinner(),e.src=this.resourceUrl,e.onerror=()=>{this.loaded=!1,""!=this.element.getAttribute("src")&&(this.spinner.showSpinner("Error on loading image"),this.spinner.element.classList.add("error"))},e.onload=()=>{this.spinner.hideSpinner(),this.loaded=!0,e.classList.add("lightbox-shadow"),e.hidden=!1}}}class g extends a{constructor(e,t,n){super(e,t,n)}buildElement(){const e=document.createElement("video");var t;e.setAttribute("tabindex","0"),e.hidden=!0,this.element=e,this.setCommonAttributes(),e.setAttribute("style",`\n    ${(t=this.config.autoscale)?"width: 100%":"width: auto; max-width: inherit"};\n    ${Number.isInteger(t)?`width: inherit; max-width: ${t}px`:""};\n    `),e.setAttribute(i.CACHED,this.resourceUrl),e.controls=!0,e.classList.add("dlightbox-video"),this.spinner.showSpinner();const n=document.createElement("source");n.src=this.resourceUrl,e.addEventListener("click",(e=>e.stopPropagation())),e.append(n),n.onerror=()=>{this.loaded=!1,this.spinner.showSpinner("Error on loading video"),this.spinner.element.classList.add("error")},e.oncanplay=()=>{this.loaded=!0,""!=this.element.getAttribute("src")&&(this.spinner.hideSpinner(),e.classList.add("lightbox-shadow"),e.hidden=!1,this.config.autoplay&&this.isSelected&&e.play())}}open(){this.loaded&&this.isElementBuilt()?(this.element.style.display="",this.config.autoplay&&this.element.play()):this.buildElement()}close(){this.abortDownloadingUnloadedNode(),this.spinner.hideSpinner(),this.element.style.display="none",this.isSelected=!1,this.element.pause()}}class x{constructor(e,n,s){t(this,"_lightbox"),t(this,"id"),t(this,"_prev"),t(this,"_next"),t(this,"element"),this.element=e,this.id=Number(e.getAttribute(i.ID));const o=n?b(s,n):null,r={...s,...o};this._lightbox=this.getLightBoxType(e,n,r),this._next=null,this._prev=null}get lightbox(){return this._lightbox}get next(){return this._next}get prev(){return this._prev}set next(e){this._next=e}set prev(e){this._prev=e}getLightBoxType(e,t,n){const s=e.getAttribute(d.filter((t=>e.getAttribute(t)))[0])??"",o=e.getAttribute(i.TYPE)??n.type??null;if(""===s)throw new Error(`Invalid resource. Please, use any of these tags: ${d.join()}`);return o===l.VIDEO||"video"==e.localName||c.some((e=>-1!==s.indexOf(e)))?new g(s,t,n):o===l.IMAGE||"img"==e.localName||h.some((e=>-1!==s.indexOf(e)))?new u(s,t,n):(o===l.EMBED||Object.values(m).some((e=>-1!==s.indexOf(e))),new p(s,t,n))}}class f{constructor(e,n){t(this,"elements"),t(this,"head"),t(this,"tail"),t(this,"size"),this.elements=this.setElementsId(e.map((e=>e.element))),this.head=new x(this.elements[0],e[0].attributes,n),this.head.prev=null;let i=this.head;for(let t=1;t<e.length;t++)i.next=new x(this.elements[t],e[t].attributes,n),i.prev=this.lookupByIndex(t-2),i=i.next;this.size=e.length,i.prev=this.lookupByIndex(this.size-2),this.tail=i}setElementsId(e){const t=[...Array(e.length).keys()];return e.forEach((e=>{e.hasAttribute(i.ID)&&t.splice(Number(e.getAttribute(i.ID)),1)})),e.filter((e=>!e.hasAttribute(i.ID))).forEach(((e,n)=>e.setAttribute(i.ID,String(t[n])))),e}lookupByIndex(e){let t=this.head;for(let n=0;n<e;n++)t=t.next;return t}lookupById(e){let t=this.head;for(;t.id!==e;)t=t.next;return t}}class v{constructor(e){t(this,"modal"),t(this,"container"),t(this,"lastTabPos",0),this.modal=null,this.container=e}getModal(){var e;return this.modal||(this.modal=this.buildModal(),null==(e=this.modal)||e.addEventListener("mousedown",(e=>{e.composedPath().find(((e,t)=>{var n;return 1==t&&(null==(n=e.classList)?void 0:n.contains("lightbox-container__media"))}))||this.container.destroyContainer()}))),this.modal}buildModal(){const e=document.createElement("div");return e.id="dragon-lightbox-modal",e.classList.add("lightbox-modal"),e.prepend((e=>{const t=document.createElement("style");return t.innerText=".dlightbox-hidden {overflow:hidden !important}.lightbox-modal {display:flex;justify-content:center;z-index:1000;width:100%;height:100vh;position:fixed;top:0;left:0;background-color:rgba(0,0,0,.87);transition:opacity .2s;transition-property:transform, opacity;opacity:0}.lightbox-modal-open {opacity:1}.lightbox-container {display:flex;width:100%;align-items:center;justify-content:center;overflow-x:hidden}.lightbox-shadow {filter:drop-shadow(0 0 15px black)}.lightbox-container__media {max-height:90vh;width:100%;max-width:90%;display:flex;justify-content:center;align-items:center;transition:transform .2s;transform:scale(.7)}.lightbox-container__media>* {transition:.1s ease-in;transition-property:transform, opacity;transform:translateX(0px);opacity:1}.lightbox-type__closed-left>* {transition:none;opacity:0;transform:translateX(100px)}.lightbox-type__closed-right>* {transition:none;opacity:0;transform:translateX(-100px)}.lightbox-container__media-open {transform:scale(1)}.lightbox-container__media:focus {outline:none}.lightbox-container__media:focus>*:not(img, video) {filter:drop-shadow(0 0 5px white)}.lightbox-container__next-arrow,.lightbox-container__prev-arrow {width:10%;height:3em;position:relative;margin-bottom:1rem;transform:scale(1.1);opacity:.8;transition:transform .3s}.lightbox-container__next-arrow:focus,.lightbox-container__prev-arrow:focus,.lightbox-container__close:focus {outline:none;transform:scale(1.2);opacity:1}.lightbox-container__prev-arrow:focus {transform:scale(-1.2)}.lightbox-container__prev-arrow {transform:scale(-1.1)}.lightbox-container__next-arrow:hover,.lightbox-container__prev-arrow:hover {opacity:1;cursor:pointer}.lightbox-container__next-arrow::after,.lightbox-container__next-arrow::before,.lightbox-container__prev-arrow::after,.lightbox-container__prev-arrow::before {content:'';width:3px;height:30px;position:absolute;background-color:white;transform-origin:bottom left;transform:rotate(-40deg);top:-4.3px;left:calc(50% + 10%);border-radius:2px}.lightbox-container__next-arrow::before,.lightbox-container__prev-arrow::before {top:22px;transform-origin:top left;transform:rotate(40deg)}.lightbox-container__close {width:20px;height:20px;position:relative;position:absolute;top:2rem;right:1.5rem;opacity:.8;transition:transform .3s}.lightbox-container__close:hover {cursor:pointer;opacity:1}.lightbox-container__close::after,.lightbox-container__close::before {content:'';width:3px;height:20px;position:absolute;left:50%;background-color:white;transform:rotate(-45deg);border-radius:2px}.lightbox-container__close::before {transform:rotate(45deg)}#lightbox-container__hidden-tabindex {opacity:0;position:absolute;top:0}@media (hover:none) {.lightbox-container>[class*=arrow] {opacity:.8 !important}.lightbox-container__next-arrow:focus {transform:scale(1.1)}.lightbox-container__prev-arrow:focus {transform:scale(-1.1)}}@media (max-width:560px) {.lightbox-container__next-arrow,.lightbox-container__prev-arrow {position:absolute;top:87vh;transform:scale(.6) translateX(3rem)}.lightbox-container__prev-arrow {transform:scale(-.6) translateX(3rem) rotateX(180deg)}.lightbox-container__media {max-width:100%;max-height:70vh}.lightbox-container__close:focus {transform:none;opacity:1}.lightbox-container__next-arrow:focus {transform:scale(.6) translateX(3rem);opacity:1}.lightbox-container__prev-arrow:focus {transform:scale(-.6) translateX(3rem);opacity:1}}.dlightbox-image {max-height:inherit;max-width:unset;object-fit:contain;width:inherit}.dlightbox-video {max-height:inherit;max-width:unset;object-fit:contain}.dlightbox-embed {max-height:inherit;max-width:unset}@media (max-width:560px) {.dlightbox-video, .dlightbox-embed {width:100% !important}.dlightbox-embed {height:calc(100vw - 20vw) !important}}.lightbox-spinner {width:15vw;height:15vw;position:relative}.lightbox-spinner>.lightbox-spinner-back,.lightbox-spinner>.lightbox-spinner-front {border-radius:50%;width:100%;height:100%;position:relative;display:flex;align-items:center;justify-content:space-between}.lightbox-spinner>.lightbox-spinner-front {position:absolute}.lightbox-spinner>.lightbox-spinner-back {z-index:-1}.lightbox-spinner>.lightbox-spinner-front>*,.lightbox-spinner>.lightbox-spinner-back>* {max-width:15px;max-height:15px}.lightbox-spinner-back>.back {width:14%;height:14%;background-color:white;border-radius:50%;animation:expand .5s ease-in infinite}.lightbox-spinner-front>.front {width:15%;border-radius:50%;height:15%;background-color:white;animation:blink .5s ease-in infinite}.lightbox-spinner.error>.lightbox-spinner-back>.back,.lightbox-spinner.error>.lightbox-spinner-front>.front {background-color:red;animation:none}.lightbox-spinner.error>.lightbox-spinner-back>.back {animation:none;transform:scale(2);opacity:.4}@keyframes blink {0% {transform:scale(.4);opacity:0}20% {transform:scale(.7);opacity:.3}100% {transform:scale(1.2);opacity:0}}@keyframes expand {0% {transform:scale(1);opacity:0}20% {transform:scale(2);opacity:.4}100% {transform:scale(2.4);opacity:0}}.lightbox-spinner-ball1.back,.lightbox-spinner-ball1.front {animation-delay:0s !important}.lightbox-spinner-ball2.back,.lightbox-spinner-ball2.front {animation-delay:.16s !important}.lightbox-spinner-ball3.back,.lightbox-spinner-ball3.front {animation-delay:.32s !important}",t})(this.container.config)),1==this.container.elements.length||(e.addEventListener("touchstart",(({touches:e})=>{this.lastTabPos=e[0].screenX,this.container.mediaElement.style.transition="none"})),e.addEventListener("touchmove",(({touches:e})=>this.container.mediaElement.style.transform=`translateX(${e[0].screenX-this.lastTabPos}px)`)),e.addEventListener("touchend",(({changedTouches:e})=>{this.container.mediaElement.style.transition="";const t=e[0].screenX;this.container.mediaElement.style.transform="",Math.abs(t-this.lastTabPos)<100||(t>this.lastTabPos?this.container.prev():this.container.next())}))),e}}class E{constructor(e,n,o,a){if(t(this,"id"),t(this,"lightboxList"),t(this,"selectedBox"),t(this,"modal"),t(this,"spinner"),t(this,"_config"),t(this,"elementCount"),t(this,"container"),t(this,"_elements"),t(this,"_bindedElements",[]),t(this,"mediaElement"),t(this,"events"),t(this,"nodeListener",(e=>{var t,n;if("keydown"==e.type&&"Enter"!=e.key)return;const s=(null==(t=e.composedPath().find((e=>this._bindedElements.map((e=>e.elements)).flat(1).find((t=>t===e)))))?void 0:t.getAttribute(i.ID))??"0",o=this.getLightBoxById(Number(s));1===e.target.nodeType&&e.preventDefault(),this.openContainer(o),null==(n=document.getElementById("lightbox-container__hidden-tabindex"))||n.focus()})),t(this,"closeContainerBodyEvent",(e=>{this.container&&"Escape"===e.key&&this.destroyContainer()})),t(this,"nextArrowModalEvent",(e=>{this.container&&"ArrowRight"===e.key&&this.next(e)})),t(this,"prevArrowModalEvent",(e=>{this.container&&"ArrowLeft"===e.key&&this.prev(e)})),t(this,"buildCustomEvents",(e=>{const t=new Map;for(const n of Object.values(s))t.set(n,new CustomEvent(n,e));return t})),this.container=null,this.id=e,this.mediaElement=document.createElement("div"),this._config=o,this.modal=new v(this),this.spinner=r.getSpinner(),this.elementCount=n.length,this.lightboxList=new f(n,this.config),this.selectedBox=this.lightboxList.head,this.selectedBox.lightbox.isSelected=!0,this._elements=this.lightboxList.elements,this.events=this.buildCustomEvents({detail:{config:this.config,count:this.elementCount,id:this.id,elements:this.elements,selectedBox:()=>({resourceUrl:this.selectedBox.lightbox.resourceUrl,element:this.selectedBox.element,config:this.selectedBox.lightbox.config,attributes:this.selectedBox.lightbox.attributes})}}),!a){const e={elements:this.elements,fireevent:o.fireevent};this.addNodeEventListeners(e)}}get config(){return this._config}get elements(){return this._elements}get bindings(){return this._bindedElements}listen(e,t){this.mediaElement.addEventListener(e,t)}addNodeEventListeners(e){if("length"in e){if(!e.hasOwnProperty("elements")){if(e.length!==this.elementCount)throw new Error(`You must provide a set of ${this.elementCount} elements!`);return this.bindElements([...e].map((e=>e))),void this._bindedElements.push({elements:[...e].map((e=>e)),fireevent:this.config.fireevent})}}else if(!e.hasOwnProperty("elements")){if(1!==this.elementCount)throw new Error(`You must provide a set of ${this.elementCount} elements!`);return this.bindElements([e]),void this._bindedElements.push({elements:[e],fireevent:this.config.fireevent})}const{elements:t,fireevent:n}=e;this.bindElements(t,n),this._bindedElements.push({elements:t,fireevent:n})}bindElements(e,t){this.lightboxList.setElementsId(e).forEach((e=>{e.addEventListener(t??this.config.fireevent,this.nodeListener),"click"==t&&e.addEventListener("keydown",this.nodeListener)}))}removeNodeEventListeners(){this.destroyContainer();for(const{elements:e,fireevent:t}of this._bindedElements)e.forEach((e=>{e.removeEventListener(t??this.config.fireevent,this.nodeListener),"click"==t&&e.removeEventListener("keydown",this.nodeListener)}))}createContainer(){this.container=document.createElement("div"),!this.config.showscroll&&document.body.classList.add("dlightbox-hidden"),document.body.addEventListener("keydown",this.closeContainerBodyEvent),this.container.classList.add("lightbox-container"),this.container.setAttribute("tabindex","-1"),this.mediaElement.setAttribute("tabindex","0"),this.mediaElement.classList.add("lightbox-container__media"),this.mediaElement.append(this.spinner.element);const e=document.createElement("div");if(e.classList.add("lightbox-container__close"),e.setAttribute("tabindex","0"),e.addEventListener("keydown",(({key:e})=>{"Enter"===e&&this.destroyContainer()})),this.container.prepend(e),this.elementCount>1){const e=document.createElement("div"),t=document.createElement("div");e.classList.add("lightbox-container__next-arrow"),t.classList.add("lightbox-container__prev-arrow"),e.setAttribute("tabindex","0"),t.setAttribute("tabindex","0"),this.container.addEventListener("keydown",(({key:n})=>{"Tab"===n&&document.activeElement===e&&setTimeout((()=>t.focus()),0)})),e.addEventListener("mousedown",(e=>this.next(e))),t.addEventListener("mousedown",(e=>this.prev(e))),e.addEventListener("keydown",(e=>{"Enter"===e.key&&this.next(e)})),t.addEventListener("keydown",(e=>{"Enter"===e.key&&this.prev(e)})),this.modal.getModal().addEventListener("keydown",this.nextArrowModalEvent),this.modal.getModal().addEventListener("keydown",this.prevArrowModalEvent),this.container.prepend(t),this.container.append(this.mediaElement),this.container.append(e)}else{const t=document.createElement("div");t.tabIndex=0,this.container.append(t),e.addEventListener("keydown",(({key:e})=>{"Tab"===e&&setTimeout((()=>this.mediaElement.focus()),0)})),this.container.prepend(this.mediaElement)}setTimeout((()=>this.container.focus()),0)}destroyContainer(){this.container&&(this.modal.getModal().classList.remove("lightbox-modal-open"),this.mediaElement.classList.remove("lightbox-container__media-open"),setTimeout((()=>{var e;this.mediaElement.blur(),document.body.removeAttribute("tabindex"),this.selectedBox.lightbox.close(),this.container.remove(),this.modal.getModal().remove(),document.body.classList.remove("dlightbox-hidden"),document.body.removeEventListener("keydown",this.closeContainerBodyEvent),this.modal.getModal().removeEventListener("keydown",this.nextArrowModalEvent),this.modal.getModal().removeEventListener("keydown",this.prevArrowModalEvent),null==(e=this.mediaElement)||e.dispatchEvent(this.events.get(s.CLOSE)),this.container=null}),200))}getLightBoxById(e){return this.lightboxList.lookupById(e)}openContainer(e=this.lightboxList.head){var t;if(document.getElementById("dragon-lightbox-modal"))return;document.body.setAttribute("tabindex","-1"),this.spinner.element.classList.remove("error");const n=Number.isInteger(e)?this.getLightBoxById(e):e;if(!(n.lightbox instanceof a))throw new Error("Invalid lightbox");const i=this.modal.getModal();this.createContainer(),setTimeout((()=>{this.modal.getModal().classList.add("lightbox-modal-open"),this.mediaElement.classList.add("lightbox-container__media-open")}),0),n.lightbox.open(),this.mediaElement.append(n.lightbox.element),i.append(this.container),i.append(this.container),document.body.prepend(i),this.selectedBox.lightbox.isSelected=!1,this.selectedBox=n,this.selectedBox.lightbox.isSelected=!0,null==(t=this.mediaElement)||t.dispatchEvent(this.events.get(s.OPEN))}appendMediaElement(e){[...this.mediaElement.children].some((t=>t===e))||this.mediaElement.append(e)}openLightBox(e,t){const n=e;setTimeout((()=>{this.mediaElement.classList.remove("lightbox-type__closed-"+(t?"left":"right"))}),100),this.mediaElement.classList.add("lightbox-type__closed-"+(t?"left":"right")),n.lightbox.open(),this.appendMediaElement(e.lightbox.element),this.selectedBox=t?n.prev:n.next}closeLightBox(e){e.lightbox.close()}next(e){var t;null==e||e.stopPropagation(),null==e||e.preventDefault(),this.closeLightBox(this.selectedBox),this.selectedBox===this.lightboxList.tail?(this.openLightBox(this.lightboxList.head,!0),this.selectedBox=this.lightboxList.head,this.selectedBox.lightbox.isSelected=!0):(this.openLightBox(this.selectedBox.next,!0),this.selectedBox=this.selectedBox.next,this.selectedBox.lightbox.isSelected=!0),null==(t=this.mediaElement)||t.dispatchEvent(this.events.get(s.CHANGE))}prev(e){var t;null==e||e.stopPropagation(),null==e||e.preventDefault(),this.closeLightBox(this.selectedBox),this.selectedBox===this.lightboxList.head?(this.openLightBox(this.lightboxList.tail,!1),this.selectedBox=this.lightboxList.tail,this.selectedBox.lightbox.isSelected=!0):(this.openLightBox(this.selectedBox.prev,!1),this.selectedBox=this.selectedBox.prev,this.selectedBox.lightbox.isSelected=!0),null==(t=this.mediaElement)||t.dispatchEvent(this.events.get(s.CHANGE))}}class y{constructor(){t(this,"_instances"),t(this,"createInstanceObject",(e=>{const t={open:e.openContainer.bind(e),close:e.destroyContainer.bind(e),remove:()=>this.removeInstanceObject(e),bind:e.addNodeEventListeners.bind(e),listen:e.listen.bind(e),elements:e.elements,bindings:e.bindings};return this.instances.set(0==this.instances.size?0:[...this.instances.keys()][this.instances.size-1]+1,t),t})),t(this,"removeInstanceObject",(e=>{e.removeNodeEventListeners.call(e),this.instances.delete(e.id)})),t(this,"getConfig",((e,t)=>{const i=t||Object.values(e.attributes).map((e=>({name:e.name,value:e.nodeValue})));return b(n,i)})),t(this,"getAttributes",(e=>{const t=[];if(!e.attributes)return t;const n=["tabindex","class"];for(const{name:s,nodeValue:o}of Object.values(e.attributes)){if(n.includes(s.toLowerCase()))continue;const e=s.replace(`${i.DATA}-`,"");t.push({name:e,value:o??""})}return t})),this._instances=new Map,this.autoinit()}get instances(){return this._instances}create(e,t){var s;try{const o=Array.isArray(e[0])?e:[[e]],r=new Array;for(const[e,t]of o){const n=document.createElement("div"),o=t??null;o&&o.find((e=>e.name===i.TYPE))&&n.setAttribute(i.TYPE,(null==(s=o.find((e=>e.name===i.TYPE)))?void 0:s.value)??""),n.setAttribute("data-dlightbox",String(e)),r.push({element:n,attributes:o})}const a=t?{...n,...t}:n,l=new E(this.instances.size,r,a,!0);return this.createInstanceObject(l)}catch(o){throw new Error(`Invalid dlightbox input: ${o.message}`)}}refresh(){this.instances.forEach((e=>e.remove())),this.autoinit()}autoinit(){const e=document.querySelectorAll(`[${i.CONTAINER}]`),t=document.querySelectorAll(`[${i.INITIALIZER}]:not([${i.CONTAINER}] [${i.INITIALIZER}])`),n=(e,t)=>{let n=this.getConfig(e);n.attributes=this.getAttributes(e),n={...n,...this.getConfig(e,n.attributes)};const i=new E(this.instances.size,t,n);this.createInstanceObject(i)};for(const s of e){const e=d.map((e=>`[${e}]`)),t=Array.from(s.querySelectorAll(`${e.join()}`)).filter((e=>!e.hasAttribute(i.IGNORE))).map((e=>({element:e,attributes:this.getAttributes(e)})));t.length&&n(s,t)}for(const i of t)n(i,[{element:i,attributes:this.getAttributes(i)}])}}(()=>{const e=new y;window.dragonLightBox={instances:e.instances,create:e.create.bind(e),refresh:e.refresh.bind(e)}})()}));

package.json

 {
   "name": "dragon-lightbox",
-  "version": "1.3.5",
+  "version": "1.4.0",
   "type": "module",
@@ -5,0 +5,0 @@ "description": "A lightweight, responsive and accessible lightbox library made in typescript",

README.md

@@ -146,3 +146,3 @@ # Dragon LightBox
 ## API
-A `dragonLightBox` object is exposed to the window object, with a propertiy and two methods:
+A `dragonLightBox` object is exposed to the window object, with a property and two methods:
 
@@ -149,0 +149,0 @@ | Property  |  Description |

vite.config.js

@@ -11,2 +11,6 @@ import { defineConfig } from "vite";
         minify: 'terser',
+        lib: {
+            entry: './index.ts',
+            name: 'dragonLightbox'
+        },
         terserOptions: {
@@ -13,0 +17,0 @@ compress: {

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

Major refactor

Supply chain risk

Package has recently undergone a major refactor. It may be unstable or indicate significant internal changes. Use caution when updating to versions that include significant changes.

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

Major refactor

Supply chain risk

Package has recently undergone a major refactor. It may be unstable or indicate significant internal changes. Use caution when updating to versions that include significant changes.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

42557

increased by0.45%

Lines of code

140

increased by2.94%

No dependency changes