Daktronics.Image=function(url,width,height,options){var _this=this;this.url=url;this.width=width;this.height=height;this.options=options;this.urlParameters=[];Object.defineProperty(this,"type",{get:function(){let widenImage=new Daktronics.WidenImage(this.url,this.width,this.height,this.options);return widenImage.isValid?"widen":"umbraco"}});this.toString=function(){let newUrl=this.url,widenImage=new Daktronics.WidenImage(this.url,this.width,this.height,this.options);if(widenImage.isValid)newUrl=widenImage.toString();else{let umbracoImage=new Daktronics.UmbracoImage(this.url,this.width,this.height,this.options);newUrl=umbracoImage.toString()}return newUrl}};Daktronics.UmbracoImage=function(url,width,height,options){this.url=url;this.width=width;this.height=height;this.options=options;let _this=this;this.toString=function(){let baseUrl=_this.url.startsWith("/")?window.location.origin:null,url=new URL(_this.url,baseUrl);if(_this.width&&url.searchParams.set("width",_this.width),_this.height&&url.searchParams.set("height",_this.height),this.options)for(var option in this.options)this.options.hasOwnProperty(option)&&url.searchParams.set(option,_this.options[option]);return url.href}};Daktronics.WidenImage=function(url,width,height,options){this.url=url;this.width=width;this.height=height;this.options=options;this.urlParameters=[];var _this=this,isValid=function(url){return/widen(cdn)?\.net/gi.test(url)},setSize=function(url,width,height){var sizeInPathRegEx=/\/\d*x?\d*px\//gi,newUrl=url,sizeSegment;return sizeInPathRegEx.test(url)?(sizeSegment="/",width&&(sizeSegment+=width.toString()),height&&(sizeSegment+="x"+height.toString()),sizeSegment+="px/",newUrl=url.replace(sizeInPathRegEx,sizeSegment)):(width&&addUrlParameter("w",width),height&&addUrlParameter("h",height)),newUrl},addUrlParameter=function(key,value){_this.urlParameters.push(key+"="+value)};this.isValid=isValid(url);this.toString=function(){var newUrl=this.url,parametersStart=this.url.indexOf("?"),option;if(this.isValid){if(newUrl=setSize(url,this.width,this.height),this.options)for(option in this.options)this.options.hasOwnProperty(option)&&addUrlParameter(option,this.options[option]);this.urlParameters.length>0&&(parametersStart=newUrl.indexOf("?"),parametersStart>-1&&(newUrl=newUrl.substring(0,parametersStart)),newUrl+="?"+this.urlParameters.join("&"))}return newUrl}};Daktronics.ImageUtils=function(){let preload=function(imgSrcs){function onImageLoad(){imagesLoadedCount++;imagesLoadedCount===imgSrcs.length&&(allImagesLoaded=!0,deferred.resolve())}var deferred=$.Deferred(),imagesLoadedCount=0,allImagesLoaded=imagesLoadedCount===imgSrcs.length;return allImagesLoaded?deferred.resolve():$.each(imgSrcs,function(index,src){if(src)$('<img src="'+src+'">').on("load error",onImageLoad)}),deferred.promise()};return{Preload:preload}}();
Vue.component("display-size-filter",{props:{},data(){return{height:{min:null,max:null},length:{min:null,max:null},lines:{min:null,max:null},columns:{min:null,max:null},units:"ft",userUpdate:!1}},computed:{facetFilters(){let facets=[];if(this.height.min||this.height.max){let min=Daktronics.Conversions.feetToInches(this.height.min)||null,max=Daktronics.Conversions.feetToInches(this.height.max)||null;this.units==="m"&&(min=Daktronics.Conversions.meterToInches(this.height.min)||null,max=Daktronics.Conversions.meterToInches(this.height.max)||null);facets.push(this.getFacet("height",min,max))}if(this.length.min||this.length.max){let min=Daktronics.Conversions.feetToInches(this.length.min)||null,max=Daktronics.Conversions.feetToInches(this.length.max)||null;this.units==="m"&&(min=Daktronics.Conversions.meterToInches(this.length.min)||null,max=Daktronics.Conversions.meterToInches(this.length.max)||null);facets.push(this.getFacet("length",min,max))}return(this.lines.min||this.lines.max)&&facets.push(this.getFacet("lines",this.lines.min,this.lines.max)),(this.columns.min||this.columns.max)&&facets.push(this.getFacet("columns",this.columns.min,this.columns.max)),facets}},watch:{units(units){let route=this.$route,query=Object.assign({},route.query);units==="m"?query.units=units:delete query.units;JSON.stringify(query)!=JSON.stringify(route.query)&&this.$router.push({query});this.userUpdate&&this.apply()},height:{deep:!0,handler:function(){this.userUpdate&&this.apply()}},length:{deep:!0,handler:function(){this.userUpdate&&this.apply()}},lines:{deep:!0,handler:function(){this.userUpdate&&this.apply()}},columns:{deep:!0,handler:function(){this.userUpdate&&this.apply()}}},methods:{getFacet(dimension,min,max){return{id:dimension,values:[min,max]}},populateFromQueryString(){if(this.$route.query.units&&(this.units=this.$route.query.units),this.$route.query.f){let filterQuery=JSON.parse(this.$route.query.f);filterQuery.height&&(this.height.min=Daktronics.Conversions.inchesToFeetDecimal(filterQuery.height[0])||null,this.height.max=Daktronics.Conversions.inchesToFeetDecimal(filterQuery.height[1])||null,this.units==="m"&&(this.height.min=Daktronics.Conversions.inchesToMeters(filterQuery.height[0])||null,this.height.max=Daktronics.Conversions.inchesToMeters(filterQuery.height[1])||null));filterQuery.length&&(this.length.min=Daktronics.Conversions.inchesToFeetDecimal(filterQuery.length[0])||null,this.length.max=Daktronics.Conversions.inchesToFeetDecimal(filterQuery.length[1])||null,this.units==="m"&&(this.length.min=Daktronics.Conversions.inchesToMeters(filterQuery.length[0])||null,this.length.max=Daktronics.Conversions.inchesToMeters(filterQuery.length[1])||null));filterQuery.lines&&(this.lines.min=filterQuery.lines[0]||null,this.lines.max=filterQuery.lines[1]||null);filterQuery.columns&&(this.columns.min=filterQuery.columns[0]||null,this.columns.max=filterQuery.columns[1]||null)}},apply:debounce(function(){this.$store.dispatch("setMultipleFacetFilters",this.facetFilters)},750),clear(){this.userUpdate=!1;this.height={min:null,max:null};this.length={min:null,max:null};this.lines={min:null,max:null};this.columns={min:null,max:null};this.units="ft";this.$nextTick(()=>this.userUpdate=!0)}},created(){this.populateFromQueryString();this.$root.$on("clear-facets",this.clear);this.$nextTick(()=>{this.userUpdate=!0})},template:`
<div>
    <div class="accordionHeading invert position-relative">
        <h2>
            <a href="#DisplaySizeAdvancedSearch"
                class="stretched-link"
                data-toggle="collapse"
                aria-expanded="false"
                aria-controls="DisplaySize">Display Size</a>
        </h2>
    </div>
    <div class="collapse container-fluid mt-2 mb-3" id="DisplaySizeAdvancedSearch" data-parent="#allRefinersAccordion">
        <div class="row">
            <div class="col-lg-6 pr-lg-5">
              <div><strong>Height</strong></div>
              <div class="form-row">
                <div class="form-group col">
                  <input type="number" class="form-control" id="inputHeightMin" placeholder="min" v-model.number="height.min">
                </div>
                <div class="form-group col">
                  <input type="number" class="form-control" id="inputHeightMax" placeholder="max" v-model.number="height.max">
                </div>
              </div>
              <div><strong>Length</strong></div>
              <div class="form-row">
                <div class="form-group col-6">
                  <input type="number" class="form-control" id="inputLengthMin" placeholder="min" v-model.number="length.min">
                </div>
                <div class="form-group col-6">
                  <input type="number" class="form-control" id="inputLengthMax" placeholder="max" v-model.number="length.max">
                </div>
              </div>
              <div class="mb-4 mb-lg-0">
                <div><strong>Units</strong></div>
                <div class="form-check form-check-inline">
                  <input class="form-check-input" type="radio" name="displaySizeUnits" id="displaySizeFt" value="ft" v-model="units">
                  <label class="form-check-label" for="displaySizeFt">ft</label>
                </div>
                <div class="form-check form-check-inline">
                  <input class="form-check-input" type="radio" name="displaySizeUnits" id="displaySizeM" value="m" v-model="units">
                  <label class="form-check-label" for="displaySizeM">m</label>
                </div>
              </div>
            </div>
            <div class="col-lg-6 pl-lg-5">
              <div><strong>Lines</strong></div>
              <div class="form-row">
                <div class="form-group col">
                  <input type="number" class="form-control" id="inputLinesMin" placeholder="min" v-model.number="lines.min">
                </div>
                <div class="form-group col">
                  <input type="number" class="form-control" id="inputLinesMax" placeholder="max" v-model.number="lines.max">
                </div>
              </div>
              <div><strong>Columns</strong></div>
              <div class="form-row">
                <div class="form-group col-6">
                  <input type="number" class="form-control" id="inputColumnsMin" placeholder="min" v-model.number="columns.min">
                </div>
                <div class="form-group col-6">
                  <input type="number" class="form-control" id="inputColumnsMax" placeholder="max" v-model.number="columns.max">
                </div>
              </div>
            </div>
        </div>
    </div>
</div>`});
Vue.component("project-gallery-photo",{props:{photoUrl:String,aspectRatio:Number,sizeOnScreen:Number,sizeOnScreenSm:Number,sizeOnScreenMd:Number,sizeOnScreenLg:Number,sizeOnScreenXl:Number,defaultWidth:{type:Number,"default":2048},maxHeight:Number,crop:{type:Boolean,"default":!0},alt:String},computed:{defaultImgSrc:function(){let width=this.defaultWidth,image=new Daktronics.Image(this.photoUrl,width,this.imageHeight(width),{crop:this.crop});return image.type!=="widen"&&(image.options=this.crop?{mode:"crop"}:null),image.toString()},imgSrcSet:function(){let srcSet=[],image=new Daktronics.Image(this.photoUrl,null,null,{crop:this.crop});return image.type!=="widen"&&(image.options=this.crop?{mode:"crop"}:null),srcSet=[400,800,1600,2048].map(value=>{image.width=value;image.height=this.imageHeight(value);let imageUrl=encodeURI(image.toString());return`${imageUrl} ${value}w`}),srcSet.join(",")},imgSizes:function(){let sizes=[];return this.sizeOnScreenXl&&sizes.push(`(min-width:1200px) ${this.sizeOnScreenXl}vw`),this.sizeOnScreenLg&&sizes.push(`(min-width:992px) ${this.sizeOnScreenLg}vw`),this.sizeOnScreenMd&&sizes.push(`(min-width:768px) ${this.sizeOnScreenMd}vw`),this.sizeOnScreenSm&&sizes.push(`(min-width:576px) ${this.sizeOnScreenSm}vw`),this.sizeOnScreen&&sizes.push(`${this.sizeOnScreen}vw`),sizes.length||sizes.push("100vw"),sizes.join(",")}},methods:{imageHeight:function(width){return Math.round(width/this.aspectRatio)}},template:`
    <img    class="lazyload"
            loading="lazy"
            :src="defaultImgSrc"
            :srcset="imgSrcSet"
            :sizes="imgSizes"
            :alt="alt"
            v-on="$listeners"/>`});
Vue.component("photo-results",{props:{containerId:String,searchResults:{type:Array,"default":[]},smallSpacing:{type:Boolean,"default":!1},showPaging:{type:Boolean,"default":!0},language:String,currentPage:Number,totalPages:Number},data:function(){return{selectedProject:null,selectedAsset:null,detailsLoaded:!1,changeProjectState:{newPage:!1,back:!1},browserTitle:document.title,hasInit:!1}},computed:{projects(){return this.searchResults.reduce((accumulator,current)=>{let accumulatorHasProject=accumulator.some(a=>a.customerNumber===current.customerNumber);return accumulatorHasProject||accumulator.push(current),accumulator},[])},hasNextProjectNumber(){let hasNextProject=!0,nextProjectNumber=this.getNextProjectNumber(),hasMorePages=this.currentPage<this.totalPages;return nextProjectNumber||hasMorePages||(hasNextProject=!1),hasNextProject},hasPrevProjectNumber(){let hasNextProject=!0,nextProjectNumber=this.getNextProjectNumber(!0),isFirstPage=this.currentPage===1;return!nextProjectNumber&&isFirstPage&&(hasNextProject=!1),hasNextProject},showResults(){return this.hasInit?!this.selectedAsset||this.selectedAsset&&this.detailsLoaded:!1}},watch:{searchResults:function(){this.changeProjectState.newPage?this.setSelectedResultFromChangeProjectState():this.setSelectedResultFromUrl()}},methods:{closeDetails:function(){document.title=this.browserTitle;this.selectedProject=null;this.selectedAsset=null},setSelectedProject:function(selectedResult){this.selectedProject=selectedResult.customerNumber;this.selectedAsset=selectedResult.id},setSelectedResultFromUrl:function(){let queryString=Object.assign({},this.$route.query);this.selectedProject=queryString.project||queryString.cid||null;this.selectedAsset=queryString.media||queryString.pn||null;this.selectedProject&&this.selectedAsset&&(this.selectedResult=this.searchResults.find(r=>r.customerNumber===this.selectedProject&&r.id===this.selectedAsset));(queryString.cid||queryString.pn)&&(delete queryString.cid,delete queryString.pn,this.$router.replace({query:queryString}))},setSelectedResultFromChangeProjectState:function(){this.changeProjectState.back?this.setSelectedProject(this.projects[this.projects.length-1]):this.setSelectedProject(this.projects[0]);this.changeProjectState.newPage=!1},getNextProjectNumber(back=false){var _a;let currentIndex=this.projects.findIndex(p=>p.customerNumber===this.selectedProject),nextIndex=back?currentIndex-1:currentIndex+1,nextProjectNumber=null;return nextIndex>=0&&nextIndex<this.projects.length&&(nextProjectNumber=(_a=this.projects[nextIndex])===null||_a===void 0?void 0:_a.customerNumber),nextProjectNumber},selectNextProject(back=false){let nextProjectNumber=this.getNextProjectNumber(back);if(nextProjectNumber){let nextProject=this.projects.find(p=>p.customerNumber===nextProjectNumber);this.setSelectedProject(nextProject)}else this.changeProjectState.newPage=!0,this.changeProjectState.back=back,this.$emit("change-page",back?this.currentPage-1:this.currentPage+1)}},mounted(){this.setSelectedResultFromUrl();this.hasInit=!0},template:`
<div class="bandWrapper">
    <div class="bandContainer" v-if="showResults">
        <photo-result v-for="result in searchResults" :key="result.id"
                :search-result="result"
                :container-id="containerId"
                :small-spacing="smallSpacing"
                @select-project="setSelectedProject"></photo-result>
    </div>
    <photo-band-paging  v-if="showPaging"
                        :container-id="containerId"
                        :current-page="currentPage"
                        :total-pages="totalPages"
                        @change-page="$emit('change-page', $event)"></photo-band-paging>
    <project-detail v-if="selectedProject"
                    :project-number="selectedProject"
                    :asset-id="selectedAsset"
                    :language="language"
                    :has-next-project="hasNextProjectNumber"
                    :has-prev-project="hasPrevProjectNumber"
                    @next-project="selectNextProject"
                    @prev-project="selectNextProject(true)"
                    @close="closeDetails"
                    @loaded="detailsLoaded = true"></project-detail>
</div>`});Vue.component("photo-result",{props:{searchResult:Object,containerId:String,smallSpacing:Boolean},data:function(){return{selectedProject:null}},computed:{name:function(){return this.searchResult.customerShortName},city:function(){return this.searchResult.city},stateProvince:function(){return this.searchResult.stateOrProvince},country:function(){return this.searchResult.country},photoUrl:function(){return this.searchResult.photoUrl},customerNumber:function(){return this.searchResult.customerNumber},assetId:function(){return this.searchResult.id},detailsUrl:function(){let url=new URL("/photos/details",window.location.href);return url.searchParams.append("pn",this.assetId),url.searchParams.append("cid",this.customerNumber),url.href},location:function(){let location=[];return this.city&&location.push(this.city),this.stateProvince&&location.push(this.stateProvince),this.country&&location.push(this.country),location.join(", ")}},methods:{setCaptionBoxHeight:function(){let $this=$(`#${this.containerId} [data-id=${this.assetId}]`),$caption=$this.find(".photoBandItemCaption"),captionHeight=$caption.outerHeight(),height=Math.ceil(Math.min($this.height(),captionHeight));height<=30&&(height=height-1);$caption.css({bottom:height*-1+"px"})},imageLoaded:function(){this.setCaptionBoxHeight();this.$root.$emit("image-loaded")},selectProject:function(){this.$emit("select-project",this.searchResult)}},created:function(){this.$nextTick(function(){window.addEventListener("resize",this.setCaptionBoxHeight.bind(this))})},template:`
<div class="photoBandItem" :data-id="assetId" :class="{'smallSpacing': smallSpacing}">
    <a href="#" :title="name" @click.prevent="selectProject">
        <project-gallery-photo :photo-url="photoUrl"
                                :alt="name"
                                :aspect-ratio="3/2"
                                :size-on-screen-lg="16.7"
                                :size-on-screen-md="33.3"
                                :size-on-screen="50"
                                :default-width="400"
                                @load="imageLoaded"></project-gallery-photo>
    </a>
    <div class="photoBandItemCaption">
        <p><strong><a href="#" :title="name" @click.prevent="selectProject">{{ name }}</a></strong></p>
        <p>{{ location }}</p>
    </div>
</div>`});
let projectGallerySelector="#projectGallery";Vue.component("project-gallery",{props:{searchQuery:String,defaultKeywords:{type:String,"default":null},itemLimit:{type:Number,"default":5},storiesOnly:{type:Boolean,"default":!1},facetFields:{type:Array,"default":function(){return[]}},includeAllFacets:{type:Boolean,"default":!1},language:String},data(){return{pagingData:{}}},computed:{results(){return this.$store.state.results.search},totalResults(){return this.$store.state.results.totalCount},skipResults(){return this.$store.state.query.skip},currentPage(){var _a;if((_a=this.pagingData.currentPage)!==null&&_a!==void 0)return _a.number},totalPages(){var _a;if((_a=this.pagingData.pages)!==null&&_a!==void 0)return _a.length},errorMessage(){let storeError=this.$store.state.error;return storeError?"Sorry, there was an issue finding projects.":this.$store.state.results.search.length===0?"No projects found.":null}},methods:{changePage(skipResults,pageNumber){var skip=skipResults;if(pageNumber>=0){let page=this.pagingData.pages.find(p=>p.number===pageNumber);skip=page.startRow}skip!=this.skipResults&&(this.$store.dispatch("skipResults",skip),this.scrollToPosition=0)}},created(){this.$store.dispatch("init",{context:{url:"/api/projects/search"},query:{userKeywords:this.searchQuery,defaultKeywords:this.defaultKeywords,itemLimit:this.itemLimit,facetFields:this.facetFields,language:this.language,otherSearchOptions:{storiesOnly:this.storiesOnly,includeAllFacets:this.includeAllFacets}}})},template:`
<div>
    <photo-results v-if="!errorMessage"
                   :search-results="results"
                   :language="language"
                   container-id="projectGallery"
                   :show-paging="false"
                   :current-page="currentPage"
                   :total-pages="totalPages"
                   small-spacing
                   @change-page="changePage(null, $event)"></photo-results>
    <search-paging v-if="!errorMessage"
                   class="my-5"
                   :total-rows="totalResults"
                   :start-row="skipResults"
                   :row-limit="itemLimit"
                   :page-limit="5"
                   @change-page="changePage($event)"
                   @update-paging-data="pagingData = $event"></search-paging>
    <p v-if="errorMessage" class="text-center">{{ errorMessage }}</p>
</div>`});$(projectGallerySelector).length&&new Vue({el:projectGallerySelector,router:Daktronics.Components.GetVueRouter(),store:makeSearchComponentStore(),computed:{searchQuery(){return this.$store.state.query.userKeywords}},methods:{updateUserSearchQuery(keywords){this.$store.dispatch("newKeywordQuery",keywords).then(()=>{$(`${projectGallerySelector} input[type=text]`).get(0).blur()})},restartSearch(){this.$store.dispatch("reset")}},created(){this.$store.commit("setRouter",this.$router)}});
