(()=>{"use strict";class t{constructor(t,e){Array.from(document.querySelectorAll(t)).map((t=>{this.createGal(t,e)}))}createGal(t,e){let l=null!=e&&null!=e.imageEvent?e.imageEvent:"click",a=null!=e&&null!=e.mainImgWd?e.mainImgWd:t.offsetWidth,i=null!=e&&null!=e.mainImgHt?e.mainImgHt:t.offsetHeight,n=document.createElement("div");n.classList.add("ctclig-image-list"),t.appendChild(n);let r=document.createElement("div");r.classList.add("ctclig-main-image"),r.style=`width:${a}px; height :${i}px ;background: url("") center center / contain no-repeat rgb(255, 255, 255,0.5); margin-left:auto;margin-right:auto;display: block;`,r.innerHTML=`<span style='font-size:${a/30}px;position:relative; top: ${i/2-5}px; left: ${a/2-5}px ;' >Loading ...</span>`,n.appendChild(r);let s=document.createElement("div");s.style.width=`${a}px`,s.classList.add("ctclig-image-cont"),s.style.overflowX="auto",s.style.overflowY="hidden",s.style.marginLeft="auto",s.style.marginRight="auto",s.style.display="block";let d=document.createElement("div");d.style.width="0px",d.style.marginLeft="auto",d.style.marginRight="auto",d.style.display="block",s.appendChild(d),n.appendChild(s),Array.from(t.querySelectorAll("img")).map(((t,e)=>{t.style.display="none";let a=new Image;a.src=t.src,a.addEventListener("load",(t=>{""!=r.innerHTML&&(r.innerHTML="",r.setAttribute("data-num",e),r.style.backgroundImage=`url("${t.target.src}")`);let a=t.target.width/t.target.height*70;d.style.width=`${parseFloat(d.style.width)+a+4}px`,t.target.style.width=`${a}px`,t.target.setAttribute("data-img-num",e),t.target.style.height="70px",t.target.style.margin="2px",t.target.style.display="",t.target.addEventListener(l,(t=>{r.setAttribute("data-num",e),r.style.backgroundImage=`url("${t.target.src}")`,t.target.scrollIntoView({behavior:"smooth",block:"nearest",inline:"center"})})),d.appendChild(t.target)}))})),t.style.height=`${i+100}px`,null!=e&&null!=e.callBack&&e.callBack(t)}}window.addEventListener("DOMContentLoaded",(()=>{new t(".ctcl-gallery",{imageEvent:"mousemove",callBack:t=>t.style.opacity=""})}))})();