UNPKG

vue-masonry-gallery-new

Version:

Masonry gallery layout component for Nuxtjs

2 lines 25 kB
webpackJsonp([1],{F56r:function(t,i){t.exports="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAIUAAAAdCAYAAACE768SAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAA4JpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNi1jMTQwIDc5LjE2MDQ1MSwgMjAxNy8wNS8wNi0wMTowODoyMSAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wTU09Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9tbS8iIHhtbG5zOnN0UmVmPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvc1R5cGUvUmVzb3VyY2VSZWYjIiB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8iIHhtcE1NOk9yaWdpbmFsRG9jdW1lbnRJRD0ieG1wLmRpZDpBOTQ0NjhDRjEyMjA2ODExODA4M0UzRUU0NzdCRDgwOSIgeG1wTU06RG9jdW1lbnRJRD0ieG1wLmRpZDpCOTM0NEM5RTgxREUxMUU4OTBFMkM0RDQ1MUJGRDA4OCIgeG1wTU06SW5zdGFuY2VJRD0ieG1wLmlpZDpCOTM0NEM5RDgxREUxMUU4OTBFMkM0RDQ1MUJGRDA4OCIgeG1wOkNyZWF0b3JUb29sPSJBZG9iZSBQaG90b3Nob3AgQ0MgMjAxOCAoTWFjaW50b3NoKSI+IDx4bXBNTTpEZXJpdmVkRnJvbSBzdFJlZjppbnN0YW5jZUlEPSJ4bXAuaWlkOmJkODIzNjE3LTQ4YTYtNDMwMy1iZGVlLWFlZmZkNGQyNDQ3ZiIgc3RSZWY6ZG9jdW1lbnRJRD0iYWRvYmU6ZG9jaWQ6cGhvdG9zaG9wOjEzYjBjZGQyLTZjNzItMTQ0ZS05NTdlLWZl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"},FdSQ:function(t,i){},JGh8:function(t,i){t.exports="data:image/svg+xml;base64,PHN2ZyBpZD0iTGF5ZXJfMSIgZGF0YS1uYW1lPSJMYXllciAxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCA0MzIgNDMyIj48ZGVmcz48c3R5bGU+LmNscy0xe2ZpbGw6I2NiMzgzNzt9LmNscy0ye2ZpbGw6I2ZmZjt9PC9zdHlsZT48L2RlZnM+PHRpdGxlPm5wbS1sb2dvPC90aXRsZT48cGF0aCBjbGFzcz0iY2xzLTEiIGQ9Ik00MCw0MEg0NjkuMzZBMi42NCwyLjY0LDAsMCwxLDQ3Miw0Mi42NFY0NjcuMjFhNC43OCw0Ljc4LDAsMCwxLTQuNzksNC43OUg0MFoiIHRyYW5zZm9ybT0idHJhbnNsYXRlKC00MCAtNDApIi8+PHBhdGggY2xhc3M9ImNscy0yIiBkPSJNMTM2LjM0LDM4Mi4zOUgyNjUuODlWMTg4aDY0LjlWMzgyLjM5aDY0Ljg5VjEyMy4wNkgxMzYuMzRaIiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgtNDAgLTQwKSIvPjwvc3ZnPg=="},JyiW:function(t,i){},NHnr:function(t,i,s){"use strict";Object.defineProperty(i,"__esModule",{value:!0});var e=s("7+uW"),l={name:"alink",props:["to"],data:()=>({msg:"this is from alink.vue"}),methods:{}},a={render:function(){var t=this.$createElement;return(this._self._c||t)("a",{staticClass:"alink",attrs:{href:this.to,target:"_blank"}},[this._t("default")],2)},staticRenderFns:[]};var r={name:"vue-masonry-gallery",components:{alink:s("VU/8")(l,a,!1,function(t){s("pp6k")},null,null).exports},props:{width:{type:Number},height:{type:[Number,String]},reachBottomDistance:{type:Number,default:0},loadingDotCount:{type:Number,default:3},loadingDotStyle:{type:Object},gap:{type:Number,default:20},mobileGap:{type:Number,default:8},maxCols:{type:Number,default:4},imgsArr:{type:Array,required:!0},srcKey:{type:String,default:"src"},hrefKey:{type:String,default:"href"},imgWidth:{type:Number,default:330},isRouterLink:{type:Boolean,default:!1},linkRange:{type:String,default:"card"},loadingTimeOut:{type:Number,default:500},cardAnimationClass:{type:[String],default:"default-card-animation"},perPage:{type:Number,default:13}},data:()=>({currentlyVisible:0,msg:"this is from VueMasonryGallery.vue",isMobile:!!navigator.userAgent.match(/(iPhone|iPod|Android|ios)/i),isPreloading:!0,isPreloading_c:!0,imgsArr_c_page:[],imgsArr_c:[],loadedCount:0,cols:NaN,imgBoxEls:null,beginIndex:0,colsHeightArr:[],LoadingTimer:null,isFirstLoad:!0,over:!1,scrolled:!1}),computed:{colWidth(){return this.imgWidth+this.gap},imgWidth_c(){return this.isMobile?window.innerWidth/2-this.mobileGap:this.imgWidth},hasLoadingSlot(){return!!this.$scopedSlots.loading}},mounted(){this.bindClickEvent(),this.loadingMiddle(),this.preload(),this.cols=this.calcuCols(),this.$on("preloaded",()=>{this.isFirstLoad=!1,this.imgsArr_c_page=this.imgsArr.slice(0,this.perPage),this.currentlyVisible=this.perPage,this.imgsArr_c=this.imgsArr.concat([]),this.$nextTick(()=>{this.isPreloading=!1,this.imgBoxEls=this.$el.getElementsByClassName("img-box"),this.waterfall()})}),this.isMobile||this.width||this.response(),this.scroll()},watch:{isPreloading(t,i){t?setTimeout(()=>{this.isPreloading&&(this.isPreloading_c=!0)},this.loadingTimeOut):this.isPreloading_c=!1},imgsArr(t,i){i.length>0&&t[0]&&!t[0]._height&&this.reset(),this.preload()}},methods:{preload(t,i){this.imgsArr.forEach((t,i)=>{if(!(i<this.loadedCount)){if(!t[this.srcKey])return this.imgsArr[i]._height="0",void this.loadedCount++;var s=new Image;s.src=t[this.srcKey],s.onload=s.onerror=(t=>{this.loadedCount++,this.imgsArr[i]._height="load"==t.type?Math.round(this.imgWidth_c/(s.width/s.height)):this.imgWidth,this.loadedCount==this.imgsArr.length&&this.$emit("preloaded")})}})},calcuCols(){var t=this.width?this.width:window.innerWidth,i=parseInt(t/this.colWidth);return i=0===i?1:i,this.isMobile?2:i>this.maxCols?this.maxCols:i},waterfall(){if(this.imgBoxEls){var t,i,s,e=this.isMobile?this.imgBoxEls[0].offsetWidth:this.colWidth;0==this.beginIndex&&(this.colsHeightArr=[]);for(var l=0;l<this.imgsArr_c.length;l++){if(!this.imgBoxEls[l])return;if(s=this.imgBoxEls[l].offsetHeight,l<this.cols)this.colsHeightArr.push(s),t=0,i=l*e;else{var a=Math.min.apply(null,this.colsHeightArr),r=this.colsHeightArr.indexOf(a);t=a,i=r*e,this.colsHeightArr[r]=a+s}this.imgBoxEls[l].style.left=i+"px",this.imgBoxEls[l].style.top=t+"px"}}},response(){window.addEventListener("resize",()=>{var t=this.cols;this.cols=this.calcuCols(),t!==this.cols&&(this.beginIndex=0,this.waterfall(),this.over&&this.setOverTipPos())})},scrollFn(){var t=this.$refs.scrollEl;if(!this.isPreloading){var i=Math.min.apply(null,this.colsHeightArr);t.scrollTop+t.offsetHeight>i-this.reachBottomDistance&&(this.isPreloading=!0,this.$emit("scrollReachBottom"))}},loadMore(){const t=this.currentlyVisible-1,i=t+this.perPage;this.currentlyVisible+=this.perPage,this.imgsArr_c_page=this.imgsArr_c_page.concat(this.imgsArr_c.slice(t,i)),this.$nextTick(()=>{this.waterfall()})},scroll(){this.$refs.scrollEl.addEventListener("scroll",this.scrollFn)},masonryOver(){this.$refs.scrollEl.removeEventListener("scroll",this.scrollFn),this.isPreloading=!1,this.over=!0},bindClickEvent(){this.$el.querySelector(".vue-masonry-gallery").addEventListener("click",t=>{var i=t.target;if(-1==i.className.indexOf("img-box")){for(;-1==i.className.indexOf("img-inner-box");)i=i.parentNode;var s=i.getAttribute("data-index");this.$emit("click",t,{index:s,value:this.imgsArr_c[s]})}})},loadingMiddle(){var t=this.$el.querySelector(".vue-masonry-gallery-scroll"),i=t.offsetWidth-t.clientWidth;this.$el.querySelector(".loading").style.marginLeft=-i/2+"px"},reset(){this.imgsArr_c=[],this.beginIndex=0,this.loadedCount=0,this.isFirstLoad=!0,this.isPreloading=!0,this.scroll(),this.over=!1}}},o={render:function(){var t=this,i=t.$createElement,s=t._self._c||i;return s("div",{staticClass:"vue-masonry-gallery-container",style:{width:t.width&&!t.isMobile?t.width+"px":"",height:parseFloat(t.height)==t.height?t.height+"px":t.height}},[s("div",{directives:[{name:"show",rawName:"v-show",value:t.isPreloading_c,expression:"isPreloading_c"}],staticClass:"loading ball-beat",class:{first:t.isFirstLoad}},[t._t("loading",null,{isFirstLoad:t.isFirstLoad}),t._l(t.loadingDotCount,function(i){return t.hasLoadingSlot?t._e():s("div",{staticClass:"dot",style:t.loadingDotStyle})})],2),s("div",{ref:"scrollEl",staticClass:"vue-masonry-gallery-scroll"},[t._t("masonry-head"),s("div",{staticClass:"vue-masonry-gallery",style:t.isMobile?"":{width:t.colWidth*t.cols+"px",left:"50%",marginLeft:-1*t.colWidth*t.cols/2+"px"}},t._l(t.imgsArr_c,function(i,e){return e<t.currentlyVisible?s("div",{staticClass:"img-box",class:[t.cardAnimationClass],style:{padding:(t.isMobile?t.mobileGap:t.gap)/2+"px",width:t.isMobile?"":t.colWidth+"px"}},[s(t.isRouterLink&&"card"==t.linkRange?"router-link":"alink",{tag:"component",staticClass:"img-inner-box",attrs:{"data-index":e,to:"card"==t.linkRange&&i[t.hrefKey]}},[i[t.srcKey]?s(t.isRouterLink&&"img"==t.linkRange?"router-link":"alink",{tag:"component",staticClass:"img-wraper",style:{width:t.imgWidth_c+"px",height:!!i._height&&i._height+"px"},attrs:{to:"img"==t.linkRange&&i[t.hrefKey]}},[s("img",{attrs:{src:i[t.srcKey]}})]):t._e(),t._t("default",null,{index:e,value:i})],2)],1):t._e()}))],2),s("div",{attrs:{id:"footer"}},[t.currentlyVisible<t.imgsArr_c.length?s("button",{staticClass:"loadMore",on:{click:t.loadMore}},[t._v("Load more items")]):t._e(),s("p",{staticClass:"copyright"},[t._v("VajraCode 2018")])])])},staticRenderFns:[]};var n=s("VU/8")(r,o,!1,function(t){s("JyiW")},"data-v-4016eca6",null).exports,d={render:function(){var t=this,i=t.$createElement,s=t._self._c||i;return s("div",{staticClass:"lightbox-alpha animated fadeIn",on:{click:function(i){t.closeModal()}}},[s("a",{staticClass:"btn-close",attrs:{href:"#"},on:{ok:function(i){t.closeModal()}}},[t._v("x")]),t._v(" "),s("div",{staticClass:"lightbox-content animated",domProps:{innerHTML:t._s(t.content)},on:{click:function(t){t.stopPropagation()}}})])},staticRenderFns:[]};var c=s("VU/8")({name:"modal",props:["closeModal","content"]},d,!1,function(t){s("ynkW")},null,null).exports,h=s("mtWM"),g=s.n(h),M={name:"app",data:()=>({modalIsVisible:!1,modalContent:"",random:!1,imgsArr:[],group:0}),components:{VueMasonryGallery:n,Modal:c},methods:{getData(){g.a.get("./static/data/loadImages.json?group="+this.group).then(t=>{this.group++,2!==this.group?this.random?this.imgsArr=this.shuffle(this.imgsArr.concat(t.data)):this.imgsArr=this.imgsArr.concat(t.data):this.$refs.waterfall.masonryOver()})},shuffle(t){let i,s,e=t.length;for(;0!==e;)s=Math.floor(Math.random()*e),i=t[e-=1],t[e]=t[s],t[s]=i;return t},clickFn(t,{index:i,value:s}){t.preventDefault();const e=this.imgsArr[i].target,l=this.imgsArr[i].srcBig||this.imgsArr[i].href;"self"===e?window.location.href=l:"modal"===e?(this.modalIsVisible=!0,this.modalContent=`<img src="${this.imgsArr[i].srcBig}" alt="${this.imgsArr[i].title}"/>`):window.open(l,"_blank"),"img"==t.target.tagName.toLowerCase()&&console.log("img clicked",i,s)},closeModal(){this.modalIsVisible=!1},changeImgArr(){g.a.get("./static/data/data-change.json").then(t=>{this.imgsArr=t.data})}},created(){this.getData()}},m={render:function(){var t=this,i=t.$createElement,s=t._self._c||i;return s("div",{attrs:{id:"app"}},[t._m(0),s("div",{attrs:{id:"content"},scopedSlots:t._u([{key:"loading",fn:function(i){var e=i.isFirstLoad;return s("div",{},[e?s("div",{attrs:{slot:"loading"},slot:"loading"},[t._v("first-loading...")]):s("div",[t._v("loading...")])])}}])},[s("vue-masonry-gallery",{ref:"waterfall",attrs:{imgsArr:t.imgsArr},on:{scrollReachBottom:t.getData,click:t.clickFn},scopedSlots:t._u([{key:"default",fn:function(i){return s("div",{staticClass:"img-info"},[s("p",{staticClass:"title-info"},[t._v(t._s(i.value.title))]),s("p",{staticClass:"desc-info"},[t._v(t._s(i.value.info))])])}}])}),t.modalIsVisible?s("modal",{attrs:{closeModal:t.closeModal,content:t.modalContent}}):t._e()],1)])},staticRenderFns:[function(){var t=this.$createElement,i=this._self._c||t;return i("div",{attrs:{id:"header"}},[i("div",{staticClass:"header-block"},[i("a",{attrs:{href:"https://www.vajracode.com",target:"_blank",title:"VajraCode"}},[i("img",{staticClass:"vajralogo",attrs:{src:s("F56r")}})]),i("a",{staticClass:"github",attrs:{href:"https://github.com/parys-github",target:"_blank",title:"GitHub"}},[i("img",{staticClass:"ghlogo",attrs:{src:s("a8Cu")}})]),i("a",{staticClass:"npm",attrs:{href:"https://www.npmjs.com/~vajracode",target:"_blank",title:"NPMjs"}},[i("img",{staticClass:"npmlogo",attrs:{src:s("JGh8")}})]),i("img",{staticClass:"npm-code",attrs:{src:s("YmcW")}})])])}]};var u=s("VU/8")(M,m,!1,function(t){s("FdSQ")},null,null).exports,A=s("/ocq");e.a.use(A.a);var w=new A.a({routes:[{path:"/test",name:"test",component:{name:"test",template:"<h1>test test test test test test</h1>"}}]}),L=s("Gs/g"),y=s.n(L);window.Promise||(window.Promise=y.a),new e.a({el:"#app",router:w,template:"<App/>",components:{App:u}})},YmcW:function(t,i){t.exports="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAALgAAAAfCAYAAABUKgeRAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAA3hpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNi1jMTQwIDc5LjE2MDQ1MSwgMjAxNy8wNS8wNi0wMTowODoyMSAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wTU09Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9tbS8iIHhtbG5zOnN0UmVmPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvc1R5cGUvUmVzb3VyY2VSZWYjIiB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8iIHhtcE1NOk9yaWdpbmFsRG9jdW1lbnRJRD0ieG1wLmRpZDo4ZjM4MjQyYy0yYTJiLTQ4ZTYtOTIxNS0wM2FiZmUxYzgyYWMiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6NUM0RDE3RkE4MUZGMTFFOEE5MkVBQzlGNjE0QjE0MUUiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6NUM0RDE3Rjk4MUZGMTFFOEE5MkVBQzlGNjE0QjE0MUUiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIDIwMTggKE1hY2ludG9zaCkiPiA8eG1wTU06RGVyaXZlZEZyb20gc3RSZWY6aW5zdGFuY2VJRD0ieG1wLmlpZDo4ZjM4MjQyYy0yYTJiLTQ4ZTYtOTIxNS0wM2FiZmUxYzgyYWMiIHN0UmVmOmRvY3VtZW50SUQ9InhtcC5kaWQ6OGYzODI0MmMtMmEyYi00OGU2LTkyMTUtMDNhYmZlMWM4MmFj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"},a8Cu:function(t,i){t.exports="data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4KPCEtLSBHZW5lcmF0b3I6IEFkb2JlIElsbHVzdHJhdG9yIDIyLjAuMCwgU1ZHIEV4cG9ydCBQbHVnLUluIC4gU1ZHIFZlcnNpb246IDYuMDAgQnVpbGQgMCkgIC0tPgo8c3ZnIHZlcnNpb249IjEuMSIgaWQ9IkxheWVyXzEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4IgoJIHZpZXdCb3g9IjAgMCAxNC41IDE2LjMiIHN0eWxlPSJlbmFibGUtYmFja2dyb3VuZDpuZXcgMCAwIDE0LjUgMTYuMzsiIHhtbDpzcGFjZT0icHJlc2VydmUiPgo8c3R5bGUgdHlwZT0idGV4dC9jc3MiPgoJLnN0MHtmaWxsOiMyNDI5MkU7fQo8L3N0eWxlPgo8dGl0bGU+Z2l0aHViLWljb248L3RpdGxlPgo8ZyBpZD0iZjExYmIzZWUtNWI4NS00NGE1LWEyYTItN2U3ZjBjMDBiMmRjIj4KCTxnIGlkPSJhMGZhY2MxZi03NDAyLTQwYmYtYmVlOS1jNjBlZTJkNzFlYzgiPgoJCTxwYXRoIGNsYXNzPSJzdDAiIGQ9Ik01LjIsMTYuM2MwLTAuMiwwLTEuMSwwLTEuM3YtMS4xYy0wLjMsMC0wLjYsMC4xLTAuOSwwLjFjLTEuMiwwLjItMi4zLTAuNS0yLjgtMS43Yy0wLjItMC42LTAuNi0xLjEtMS4xLTEuNAoJCQljLTAuMS0wLjEtMC4yLTAuMi0wLjMtMC4zQzAsMTAuNSwwLDEwLjQsMC4yLDEwLjRjMC4xLDAsMC4zLDAsMC40LDBjMC42LDAuMSwxLjIsMC40LDEuNSwxYzAuNiwxLjEsMS45LDEuNSwzLDAuOWMwLDAsMCwwLDAsMAoJCQljMC4xLDAsMC4yLTAuMSwwLjItMC4xYzAuMS0wLjUsMC4zLTEsMC42LTEuM2MtMC41LTAuMS0xLTAuMi0xLjUtMC4zYy0xLjItMC4zLTIuMy0xLTIuOC0yLjJDMS4yLDcuNiwxLDYuOSwxLDYuMQoJCQlDMC45LDQuOSwxLjMsMy44LDIsMi45YzAtMC4xLDAtMC4yLDAtMC4yQzEuOCwyLDEuOCwxLjIsMiwwLjVDMi4yLDAsMi4yLTAuMSwyLjgsMC4xQzMuNSwwLjIsNC4zLDAuNiw0LjksMQoJCQlDNSwxLjEsNS4xLDEuMSw1LjMsMS4xYzEuNi0wLjQsMy40LTAuNCw1LDBjMC4xLDAsMC4yLDAsMC4zLTAuMWMwLjUtMC4yLDEtMC41LDEuNS0wLjdDMTIuNCwwLjEsMTIuOCwwLDEzLjEsMAoJCQljMC4xLDAsMC4yLDAuMSwwLjIsMC4xYzAuMywwLjgsMC40LDEuNiwwLjEsMi40Yy0wLjEsMC4yLDAsMC4zLDAuMSwwLjVjMC40LDAuNCwwLjYsMSwwLjgsMS41YzAuMiwwLjgsMC4yLDEuNiwwLDIuNAoJCQljLTAuMSwxLjQtMSwyLjYtMi4yLDMuMmMtMC40LDAuMi0wLjgsMC4zLTEuMiwwLjVjLTAuNCwwLjEtMC45LDAuMi0xLjMsMC4zYzAuNSwwLjYsMC43LDEuMywwLjcsMmMwLDAuOSwwLDIuNSwwLDMuNEw1LjIsMTYuM3oiCgkJCS8+Cgk8L2c+CjwvZz4KPC9zdmc+Cg=="},pp6k:function(t,i){},ynkW:function(t,i){}},["NHnr"]); //# sourceMappingURL=app.b4d4f0821fdffd334102.js.map