https://www.datacenterfrontier.com/_nuxt/WebImageWithGallery-DskagWgk.mjs

1import{A as e,C as t,D as n,H as r,Mn as i,N as a,O as o,Ot as s,P as c,ct as l,it as u,k as d,kn as f,un as p,y as m}from"./vue.runtime.esm-bundler-DK-ieOMu.mjs";import{t as h}from"./IconElement-DRwLcDEX.mjs";import{t as g}from"./_plugin-vue_export-helper-BDNMzG2s.mjs";import{t as _}from"./WebButtonElement-BNGBrWtL.mjs";import{n as v,t as y}from"./WebImage-BRmiTuSd.mjs";import{t as b}from"./useImageUrl-C7gtzC0W.mjs";r(),p();var x={props:{images:{type:Array,required:!0},imageUrl:{type:String,required:!0},metaData:{type:Object},lazyLoad:{type:Boolean,default:!0},credit:{type:String},alt:{type:String},caption:{type:String},imageShaping:{type:String,default:`crop`},fullWidth:{type:Boolean,default:!0},galleryMode:{type:String,default:`button`},aspectRatio:{type:String},useNativeSize:{type:Boolean,default:!1},clickUrl:{type:String,default:``},underlineCaption:{type:Boolean,default:!0}},data(){return{largeVisible:!1,galleryIndex:0,useImageUrl:b}},computed:{fitParam(){switch(this.imageShaping){case`clip`:return`&fit=max`;case`max`:return`&fit=max`;case`fill-blur`:return`&fit=fill&fill=blur`;default:return`&fit=crop`}},galleryImages(){return[...this.images].slice(1,this.images.length)}},methods:{getImageDimensions(e){let t={width:1300};return e<=500?t.width=500:e<=750?t.width=750:e<=1050?t.width=1050:e<=1500&&(t.width=1500),{...t,height:Math.round(t.width/1.78)}},showEnlarged(){this.largeVisible=!0},hideEnlarged(){this.largeVisible=!1},incrementGalleryIndex(e){e.stopPropagation(),this.galleryIndex=(this.galleryIndex+1)%this.images.length},setGalleryIndex(e){this.galleryIndex=e},decrementGalleryIndex(e){e.stopPropagation(),this.galleryIndex=(this.galleryIndex-1+this.images.length)%this.images.length},clickMainImage(){if(this.clickUrl)window.open(this.clickUrl,`_blank`);else{let e=this.images.findIndex(e=>e.src===this.imageUrl);this.setGalleryIndex(e===-1?0:e),this.showEnlarged()}}}},S={key:0,class:`thumbnails`},C={class:`large-image-wrapper`},w=[`src`,`alt`],T=[`innerHTML`];function E(r,p,g,b,x,E){let D=y,O=_,k=h,A=v;return u(),e(`div`,{class:`ebm-content-teaser-image`,style:i({width:g.fullWidth?`100%`:`auto`})},[n(`span`,{class:f(g.clickUrl?`ebm-content-teaser-image__link`:`ebm-content-teaser-image__small`),onClick:p[0]||=(...e)=>E.clickMainImage&&E.clickMainImage(...e)},[c(D,{image:x.useImageUrl(g.imageUrl,g.imageShaping,!1),"meta-data":g.metaData,credit:g.credit,caption:g.caption,alt:g.alt,"lazy-load":g.lazyLoad,"credit-position":`top`,"use-native-size":g.useNativeSize,"aspect-ratio":g.aspectRatio,"underline-caption":g.underlineCaption,"rounded-corners":r.$ss.general.roundedCorners},null,8,[`image`,`meta-data`,`credit`,`caption`,`alt`,`lazy-load`,`use-native-size`,`aspect-ratio`,`underline-caption`,`rounded-corners`])],2),g.images.length>1&&g.galleryMode===`thumbnails`?(u(),e(`div`,S,[(u(!0),e(m,null,l(E.galleryImages,(t,n)=>(u(),e(`div`,{key:t.src},[c(D,{image:`${t.src.split(`?`)[0]}?auto=format,compress&w=100&h=75${E.fitParam}`,"meta-data":t?.metaData,alt:t.alt,class:`thumbnail`,"use-native-size":g.useNativeSize,"rounded-corners":r.$ss.general.roundedCorners,onClick:e=>{E.setGalleryIndex(n+1),E.showEnlarged()}},null,8,[`image`,`meta-data`,`alt`,`use-native-size`,`rounded-corners`,`onClick`])]))),128))])):d(``,!0),g.images.length>1&&g.galleryMode===`button`?(u(),o(O,{key:1,class:`view-gallery-btn`,onOnClick:E.showEnlarged},{default:s(()=>[...p[2]||=[a(` View Image Gallery `,-1)]]),_:1},8,[`onOnClick`])):d(``,!0),x.largeVisible?(u(),o(t,{key:2,to:`body`},[n(`div`,{class:`ebm-content-teaser-image__large`,style:i({justifyContent:g.images.length>1&&g.galleryMode!==`none`?`space-between`:`center`}),onClick:p[1]||=(...e)=>E.hideEnlarged&&E.hideEnlarged(...e)},[g.images.length>1&&g.galleryMode!==`none`?(u(),o(k,{key:0,icon:`mdi:arrow-left`,width:36,"icon-color":`white`,class:`arrow-icon`,onClick:E.decrementGalleryIndex},null,8,[`onClick`])):d(``,!0),n(`div`,C,[n(`div`,null,[g.images[x.galleryIndex].credit?(u(),o(A,{key:0,credit:g.images[x.galleryIndex].credit,class:`credit`},null,8,[`credit`])):d(``,!0),n(`img`,{src:x.useImageUrl(g.images[x.galleryIndex].src,g.imageShaping,!1),alt:g.images[x.galleryIndex].name},null,8,w),n(`div`,{class:`caption`,style:i({fontFamily:r.$ss.general.primaryFontFamily}),innerHTML:g.images[x.galleryIndex].caption},null,12,T)])]),g.images.length>1&&g.galleryMode!==`none`?(u(),o(k,{key:1,icon:`mdi:arrow-right`,width:36,"icon-color":`white`,class:`arrow-icon`,onClick:E.incrementGalleryIndex},null,8,[`onClick`])):d(``,!0)],4)])):d(``,!0)],4)}var D=Object.assign(g(x,[[`render`,E]]),{__name:`WebImageWithGallery`});export{D as default};