1var client = new AddSearchClient('27feaeacfc9f8f21b174fc33b08f7728'); 2var conf = { 3 //matchAllQuery: true 4}; 5client.setPaging(1, 12, 'relevance', 'desc'); 6 7if (window.searchResultsPageUrl) {conf.searchResultsPageUrl = window.searchResultsPageUrl} 8 9var searchui = new AddSearchUI(client, conf); 10 11//Autocomplete Suggestions 12var suggestionClient = new AddSearchClient('27feaeacfc9f8f21b174fc33b08f7728'); 13suggestionClient.setPaging(1, 12, 'relevance', 'desc'); 14 15var suggestionClientRelated = new AddSearchClient('27feaeacfc9f8f21b174fc33b08f7728'); 16suggestionClientRelated.setPaging(1, 12, 'relevance', 'desc'); 17 18//Facets fields 19client.addFacetField('custom_fields.product-category'); 20client.addFacetField('custom_fields.product-location'); 21client.addFacetField('custom_fields.product-make'); 22client.addFacetField('custom_fields.year'); 23client.addFacetField('custom_fields.hours'); 24client.addFacetField('custom_fields.price'); 25client.setFuzzyMatch(false); 26 27function alignAutocomplete(container) { 28 var field = document.querySelector('#searchfield-container input').getBoundingClientRect(); 29 var autocomplete = container.querySelector('.addsearch-autocomplete'); 30 autocomplete.style.left = field.left + 'px'; 31 autocomplete.style.top = field.bottom + 'px'; 32 autocomplete.style.width = field.width + 'px'; 33} 34 35//Handlebars 36searchui.registerHandlebarsHelper('tidyTitle', function(string) { 37 var decoded = string.replace(/&/g, '&'); 38 return decoded; 39}); 40 41searchui.registerHandlebarsHelper('formatPrice', function(price) { 42 var value = ''; 43 var priceString = price.toString(); 44 var numericPrice = parseFloat(priceString.replace(/[^0-9.]/g, '')); 45 46 if (priceString.toLowerCase().indexOf('call') !== -1 || numericPrice === 0) { 47 return 'Call for Pricing'; 48 } 49 50 if(priceString.indexOf('.') !== -1) { 51 var res = priceString.split("."); 52 if(res.length == 2) { 53 value = res[0]+','+res[1]+'00'; 54 } 55 } else{ 56 value = priceString+',000'; 57 } 58 return value + ' CAD'; 59}); 60 61// Templates 62var autocompleteTemplate = ` 63 <div class="addsearch-autocomplete"> 64 {{#gt suggestions.length 0}} 65 <div class="adds-suggestions-main-wrapper"> 66 <h3 class="adds-title">Suggestions</h3> 67 <ul class="suggestions adds-suggestions-container"> 68 {{#each ../suggestions}} 69 <li class="adds-suggestion" data-keyword="{{value}}" data-index="{{@index}}" {{#equals ../../activeSuggestionIndex @index}}class="active"{{/equals}}> 70 {{value}} 71 </li> 72 {{/each}} 73 </ul> 74 </div> 75 {{/gt}} 76 {{#gt searchResults.hits.length 0}} 77 {{keyword}} 78 <h3 class="adds-title">Results</h3> 79 <div class="adds-hits-main-wrapper"> 80 {{#each ../searchResults.hits}} 81 <a href="{{url}}" data-analytics-click="{{id}}" class="adds-hit"> 82 <div class="adds-hit-wrapper"> 83 <div class="adds-hit-top"> 84 <div class="adds-main-image"> 85 <div class="adds-aspect"> 86 <img style="object-fit: contain;" src="{{#if custom_fields.image_url}}{{custom_fields.image_url}}{{else}}https://rockymtn.com/wp-content/themes/rme/images/logo-alt.png{{/if}}" alt="{{custom_fields.product-name}}" /> 87 </div> 88 </div> 89 </div> 90 <div class="adds-hit-bottom"> 91 <div class="adds-hit-wrapper"> 92 <h2 class="adds-hit-title">{{tidyTitle title}}</h2> 93 {{#if custom_fields.product-category}} 94 <div class="adds-category-wrapper"> 95 <span class="adds-category">{{custom_fields.product-category}}</span> 96 </div> 97 {{/if}} 98 <span class="adds-description">{{custom_fields.product-year}}</span> 99 <div class="adds-price">{{custom_fields.product-make}}</div> 100 </div> 101 </div> 102 </div> 103 </a> 104 {{/each}} 105 </div> 106 <br/> 107 <div style="text-align:center;margin-bottom: 10px;"> 108 <button class="btn all-results cust_all_result" onclick="window.showAllResultBtn()"><span>Show all results</span></button> 109 </div> 110 {{/gt}} 111 </div> 112`; 113 114 115 116var searchResultTemplate = ` 117 <div class="addsearch-searchresults">
118 {{#if resultcount}} 119 {{> numberOfResultsTemplate }} 120 {{/if}} 121 <div id="products" class="adds-hits-main-wrapper products products-grid"> 122 {{#each hits}} 123 <div class="adds-hit product {{#equals type "PROMOTED"}} promoted{{/equals}}"> 124 <div class="adds-hit-wrapper"> 125 <div class="adds-main-image"> 126 <div class="adds-aspect"> 127 {{#if style.image_url}}<img src="{{style.image_url}}" alt="{{title}}" /> 128 {{else}}<img style="object-fit: contain;" src="{{#if custom_fields.image_url}}{{custom_fields.image_url}}{{else}}https://rockymtn.com/wp-content/themes/rme/images/logo-alt.png{{/if}}" alt="{{custom_fields.product-name}}" alt="{{custom_fields.product-name}}" /> 129 {{/if}} 130 </div> 131 </div> 132 <div class="product-details"> 133 <div class="adds-category-wrapper"> 134 {{#if custom_fields.product-category}} 135 <div class="product-details_category"> 136 {{custom_fields.product-category}} 137 </div> 138 {{/if}} 139 </div> 140 <h2 class=""> 141 <a href="{{url}}" data-analytics-click="{{id}}" class="product-details_name"> 142 {{tidyTitle title}} 143 </a> 144 </h2> 145 {{#if custom_fields.price}} 146 <div class="price-box">{{formatPrice custom_fields.price}}</div> 147 {{/if}} 148 {{#if custom_fields.product-location}} 149 <ul class="product-meta"> 150 <li class="product-location"> 151 <div class="location-image"><img src="location.JPG" /></div>{{custom_fields.product-location}} 152 </li> 153 </ul> 154 {{/if}} 155 <div class="product-cta m-t-l"> 156 <a href="{{url}}" data-analytics-click="{{id}}" class="btn view-details-button btn--s">View Details</a> 157 </div> 158 </div><!-- product details --> 159 </div><!-- product --> 160 </div> 161 {{/each}} 162 </div><!-- products products-grid --> 163 </div> 164`; 165 166var searchFieldTemplate = ` 167 <div class="addsearch-searchfield-container"> 168 <form class="addsearch-searchfield" autocomplete="off" action="?" role="search"> 169 <div class="search-field-wrapper"> 170 <input type="search" placeholder="{{placeholder}}" aria-label="Search field" class="{{#not icon false}}icon{{/not}} addsearch" /> 171 </div> 172 {{#if button}} 173 <button type="button" aria-label="Search button" >{{button}}</button> 174 {{/if}} 175 </form> 176 </div> 177`; 178 179var selectedFiltersTemplate = ` 180 <div class="addsearch-active-filters"> 181 {{#each active}} 182 <div class="item"><span>{{label}}</span> 183 <button data-type="{{type}}" data-name="{{name}}" data-value="{{value}}">×</button> 184 </div> 185 {{/each}} 186 {{#if clearAll}} 187 {{#gt active.length 1}} 188 <div class="item"><button data-clearall="true">Clear all</button></div> 189 {{/gt}} 190 {{/if}} 191 </div> 192`; 193 194function createFacetTemplate(name) { 195 return ` 196 197 <div class="addsearch-facets adds-filters-group adds-shrink"> 198 {{#if facets}} 199 <h3 class="adds-filter-title"> 200 ${name} 201 <span class="adds-open-group-icon"></span> 202 </h3> 203 {{/if}} 204 <ul class="adds-filter-parent-container"> 205 {{#each facets}} 206 <li data-facet="{{value}}" class="adds-sub-filter-title"> 207 <label class="adds-label"> 208 <input type="checkbox" value="{{value}}" class="adds-checkbox" /> 209 <span class="adds-value">{{value}}</span> <em class="adds-count">({{count}})</em> 210 </label> 211 </li> 212 {{/each}} 213 </ul> 214 </div> 215 ` 216} 217 218// Add components 219if (document.getElementById('autocomplete-container')) { 220 searchui.autocomplete({ 221 containerId: 'autocomplete-container', 222 template: autocompleteTemplate, 223 //hideAutomatically: true, 224 //onShow: alignAutocomplete, 225 sources: [ 226 { 227 type: AddSearchUI.AUTOCOMPLETE_TYPE.SUGGESTIONS, 228 client: suggestionClientRelated, 229 jsonKey: 'results' 230 }, 231 { 232 type: AddSearchUI.AUTOCOMPLETE_TYPE.SEARCH, 233 client: suggestionClient, 234 jsonKey: 'hits' 235 } 236 ] 237 }); 238} 239 240if (document.getElementById('searchfield-container')) { 241 searchui.searchField({ 242 containerId: 'searchfield-container', 243 placeholder: 'Keyword..', 244 button: 'Search', 245 searchAsYouType: true, 246 icon: true, 247 template: searchFieldTemplate 248 }); 249} 250 251if (document.getElementById('sortby')) { 252 searchui.sortBy({ 253 containerId: 'sortby', 254 options: [ 255 { 256 label: 'Sort by relevance', 257 sortBy: 'relevance', 258 order: 'desc' 259 }, 260 { 261 label: 'Price: Low to High', 262 sortBy: 'custom_fields.price', 263 order: 'asc' 264 }, 265 { 266 label: 'Price: High to Low', 267 sortBy: 'custom_fields.price', 268 order: 'desc' 269 }, 270 { 271 label: 'Year: Old to New', 272 sortBy: 'custom_fields.year', 273 order: 'asc' 274 }, 275 { 276 label: 'Year: New to Old', 277 sortBy: 'custom_fields.year', 278 order: 'desc' 279 }, 280 { 281 label: 'Hours: Low to High', 282 sortBy: 'custom_fields.hours', 283 order: 'asc' 284 }, 285 { 286 label: 'Hours: High to Low', 287 sortBy: 'custom_fields.hours', 288 order: 'desc' 289 }, 290 { 291 label: 'Recently Updated', 292 sortBy: 'date', 293 order: 'desc' 294 } 295 ] 296 }); 297} 298 299if (document.getElementById('searchresults-container')) { 300 searchui.searchResults({ 301 containerId: 'searchresults-container', 302 template: searchResultTemplate 303 }); 304} 305 306if (document.getElementById('selected-filters-container')) { 307 searchui.activeFilters({ 308 containerId: 'selected-filters-container', 309 template: selectedFiltersTemplate 310 }); 311} 312 313 314//Facets 315if (document.getElementById('facets-container-category')) { 316 var facetsTemplateCategory = createFacetTemplate('Category'); 317 searchui.facets({ 318 containerId: 'facets-container-category', 319 field: 'custom_fields.product-category', 320 sticky: true, 321 template: facetsTemplateCategory 322 }); 323} 324 325if (document.getElementById('facets-container-location')) { 326 var facetsTemplateLocation = createFacetTemplate('Location'); 327 searchui.facets({ 328 containerId: 'facets-container-location', 329 field: 'custom_fields.product-location', 330 sticky: true, 331 template: facetsTemplateLocation 332 }); 333} 334 335if (document.getElementById('facets-container-make')) { 336 var facetsTemplateMake = createFacetTemplate('Make'); 337 searchui.facets({ 338 containerId: 'facets-container-make', 339 field: 'custom_fields.product-make', 340 sticky: true, 341 template: facetsTemplateMake 342 }); 343} 344 345if (document.getElementById('facets-container-year')) { 346 var facetsTemplateYear = createFacetTemplate('Year'); 347 searchui.facets({ 348 containerId: 'facets-container-year', 349 field: 'custom_fields.year', 350 sticky: true, 351 template: facetsTemplateYear 352 }); 353} 354 355if (document.getElementById('facets-container-hours')) { 356 var facetsTemplateHours = createFacetTemplate('Hours'); 357 searchui.facets({ 358 containerId: 'facets-container-hours', 359 field: 'custom_fields.hours', 360 sticky: true, 361 template: facetsTemplateHours 362 }); 363} 364 365if (document.getElementById('facets-container-price')) { 366 var facetsTemplatePrice = createFacetTemplate('Price'); 367 searchui.facets({ 368 containerId: 'facets-container-price', 369 field: 'custom_fields.price', 370 sticky: true, 371 template: facetsTemplatePrice 372 }); 373} 374 375if (document.getElementById('pagination-container')) { 376 searchui.pagination({ 377 containerId: 'pagination-container' 378 }); 379} 380 381// All components added. Start 382searchui.start(); 383 384// Event listeners 385 386document.addEventListener('click', function(event) { 387 if (!event.target || (!event.target.classList.contains('adds-open-sub-group-icon') && 388 !event.target.classList.contains('adds-filter-title') && 389 !event.target.classList.contains('adds-open-group-icon'))) { 390 return; 391 } 392 if (event.target.classList.contains('adds-filter-title')) { 393 toggleClassName(event.target.parentElement, 'adds-shrink'); 394 } 395 if (event.target.classList.contains('adds-open-sub-group-icon') || event.target.classList.contains('adds-open-group-icon')) { 396 toggleClassName(event.target.parentElement.parentElement, 'adds-shrink'); 397 } 398}); 399 400function toggleClassName(element, classname) { 401 if (element.classList.contains(classname)) { 402 element.classList.remove(classname); 403 } else { 404 element.classList.add(classname); 405 } 406} 407// mobile filter toggle 408 409var mobileFilterToggle = document.querySelector('.adds-filter-toggle'); 410if (mobileFilterToggle) { 411 mobileFilterToggle.addEventListener('click', function () {
412 toggleClassName(document.querySelector('.adds-filters-main-wrapper'), 'adds-close'); 413 }); 414} 415 416// view change toggle 417 418if (document.querySelector('#autocomplete-container')) { 419 window.showAllResultBtn = function () { 420 //document.querySelector('.addsearch-searchfield button').click(); 421 422 // Custom Code Here 423 var search_value = document.getElementsByClassName("addsearch"); 424 var create_url = 'https://wp-stage.rockymtn.com/?post_type=equipment-listings&post_keyword='+search_value[0].value; 425 window.location.href = create_url; 426 }; 427 428} 429// view change toggle 430 431/** 432var viewToggle = document.getElementById('products'); 433 434if (viewToggle) { 435 document.addEventListener('click', function (event) { 436 if (!event.target.matches('.products-list')) return; 437 438 // List view 439 event.preventDefault(); 440 viewToggle.classList.remove('.products-grid'); 441 viewToggle.classList.add('.products-list'); 442 }); 443 444 document.addEventListener('click', function (event) { 445 if (!event.target.matches('.products-grid')) return; 446 447 // List view 448 event.preventDefault(); 449 viewToggle.classList.remove('.products-list'); 450 viewToggle.classList.add('.products-grid'); 451 }); 452} 453**/
Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.