1var eventVue = new Vue({ 2 el: '#divEventsHome', 3 data: function () { 4 return { 5 events: [], 6 groupson: false, 7 startDate: pagedata_startdate, 8 endDate: pagedata_enddate, 9 zipcode: "", 10 distancefrom: "", 11 startCalendar: null, 12 endCalendar: null, 13 searchText: "", 14 imgbase: pagedata_imagebase, 15 map: null, 16 mapcentered: false, 17 loading: true, 18 openwindows: [], 19 allmarkers: [], 20 eventtypes: pagedata_eventtype, 21 type: 0, 22 mode: pagedata_mode, 23 customerevents: [], 24 customerid: pagedata_customerid, 25 customername: pagedata_customername, 26 haseditpermission: pagedata_haseditpermission, 27 eventVisibilityOptions: [ 28 { id: 1, label: "Public" }, 29 { id: 2, label: "Private" }, 30 { id: 3, label: "Any" } 31 ], 32 selectedVisibility: 1, 33 selectedFacilities: [], 34 enableGA4Format: pagedata_enableGA4Format 35 } 36 }, 37 mounted: function () { 38 // Parse query string and restore filters 39 const params = new URLSearchParams(window.location.search); 40 if (params.has('searchText')) this.searchText = params.get('searchText'); 41 if (params.has('type')) this.type = params.get('type'); 42 if (params.has('startDate')) { 43 const startDateParam = params.get('startDate'); 44 this.startDate = startDateParam.toLowerCase() === 'today' 45 ? new Date().toLocaleDateString("en-US") 46 : startDateParam; 47 } 48 if (params.has('type')) { 49 var parsedType = parseInt(params.get('type'), 10); 50 this.type = isNaN(parsedType) ? 0 : parsedType; 51 } else { 52 this.type = pagedata_URLEventTypeId; 53 } 54 if (params.has('endDate')) this.endDate = params.get('endDate'); 55 if (params.has('zipcode')) this.zipcode = params.get('zipcode'); 56 if (params.has('distancefrom')) this.distancefrom = params.get('distancefrom'); 57 var vm = this; 58 // need to use Class Selector due to the way Listbox is rendered 59 if (params.has('facilityIds')) { 60 var facilityIds = params.get("facilityIds").split(","); 61 $('.multiselect-ui option').each(function () { 62 this.selected = facilityIds.includes(this.value); 63 }); 64 vm.selectedFacilities = facilityIds; 65 // refresh bootstrap multiselect 66 if ($('.multiselect-ui').data('multiselect')) { 67 $('.multiselect-ui').multiselect('refresh'); 68 } 69 } 70 $('.multiselect-ui').on('change', function () { 71 vm.selectedFacilities = GetEventFacilityIds(); 72 console.log(GetEventFacilityIds()); 73 }); 74 75 this.setUpCalendars(); 76 this.loadMap(); 77 this.getUpdatedDates(); 78 if (this.mode === 'customer') { 79 this.getCustomerEvents(); 80 } 81 82 }, 83 methods: { 84 getCustomerEvents: function (customerid) { 85 86 $.ajax({
87 type: "POST", 88 url: "EventsHome.aspx/GetCustomerEvents", 89 contentType: "application/json; charset=utf-8", 90 dataType: "json", 91 async: "true", 92 cache: "false", 93 success: function (msg) { 94 eventVue.customerevents = msg.d; 95 }, 96 Error: function (x, e) { 97 // On Error 98 } 99 }); 100 101 102 }, 103 setUpCalendars: function () { 104 var startDate = this.startDate; 105 var endDate = this.endDate; 106 var endChange = this.endDateChange; 107 var startChange = this.startDateChange; 108 this.startCalendar = $("#divFlatPicktxtStartDate").flatpickr( 109 { 110 //minDate: "today", 111 allowInput: true, 112 defaultDate: startDate, 113 maxDate: new Date().fp_incr(335), 114 inline: false, 115 mode: "single", 116 dateFormat: "m/d/Y", 117 onChange: startChange 118 } 119 ); 120 this.endCalendar = $("#divFlatPicktxtEndDate").flatpickr( 121 { 122 //minDate: "today", 123 allowInput: true, 124 defaultDate: endDate, 125 maxDate: new Date().fp_incr(335), 126 inline: false, 127 mode: "single", 128 dateFormat: "m/d/Y", 129 onChange: endChange 130 } 131 ); 132 $("#txtSearch").focus(); 133 134 }, 135 customerRegistered: function (customerid, event) { 136 if (customerid === 0) { 137 return false; 138 } 139 var idx = event.CustomersRegistered.indexOf(customerid); 140 if (idx > -1) { 141 return true; 142 }; 143 return false; 144 }, 145 endDateChange: function () { 146 var dt = this.endCalendar.selectedDates[0]; 147 this.endDate = dt.toLocaleDateString("en-US"); 148 this.getUpdatedDates(); 149 }, 150 startDateChange: function () { 151 var dt = this.startCalendar.selectedDates[0]; 152 this.startDate = dt.toLocaleDateString("en-US"); 153 154 this.getUpdatedDates(); 155 }, 156 loadMap: function () { 157 158 //var lat = this.events[0].Latitude; 159 //var lng = this.events[0].Longitude; 160 161 var mapOptions = { 162 scrollwheel: false, 163 center: new google.maps.LatLng(page_defaultlat, page_defaultlng), 164 zoom: 8, 165 mapTypeId: google.maps.MapTypeId.ROADMAP 166 }; 167 //var infoWindow = new google.maps.InfoWindow(); 168 this.map = new google.maps.Map(document.getElementById("map-canvas"), mapOptions); 169 170 // this.loadMarkers(events); 171 172 173 }, 174 doLoggedOutReg: function (evt) { 175 console.log(evt); 176 }, 177 178 179 loadMarkers: function (events) { 180 for (i = 0; i < events.length; i++) { 181 events[i].showevent = true; 182 this.placeMarker(events[i]); 183 } 184 this.events = events; 185 this.doSearch(); 186 this.loading = false; 187 }, 188 189 190 getUpdatedDates: function () { 191 this.loading = true; 192 var obj = { 193 startdate: this.startDate, 194 enddate: this.endDate, 195 zipcode: this.zipcode, 196 facilityIds: GetEventFacilityIds() 197 }; 198 $.ajax({
199 type: "POST", 200 url: "EventsHome.aspx/GetEvents", 201 data: JSON.stringify(obj), 202 contentType: "application/json; charset=utf-8", 203 dataType: "json", 204 async: "true", 205 cache: "false", 206 success: function (msg) { 207 208 eventVue.loadMarkers(msg.d); 209 //consol.log(msg.d); 210 211 }, 212 Error: function (x, e) { 213 // On Error 214 } 215 }); 216 }, 217 doMapClick: function (event) { 218 console.log(event); 219 }, 220 placeMarker: function (event) { 221 event.hasmarker = false; 222 var mapClick = this.doMapClick; 223 if (event.Latitude && event.Longitude) { 224 var map = this.map; 225 var lat; 226 var lng; 227 var location = new google.maps.LatLng(event.Latitude, event.Longitude); 228 if (this.mapcentered === false) { 229 map.panTo(location); 230 this.mapcentered = true; 231 } 232 var marker = new google.maps.Marker({ 233 position: location, 234 map: map, 235 animation: google.maps.Animation.DROP, 236 title: event.DisplayName 237 }); 238 event.marker = marker; 239 event.hasmarker = true; 240 241 this.allmarkers.push(marker); 242 243 google.maps.event.addListener(marker, 'click', function () { 244 eventVue.doInfoWindow(event); 245 }); 246 } 247 }, 248 doInfoWindow: function (event) { 249 for (i = 0; i < this.openwindows.length; i++) { 250 this.openwindows[i].close(); 251 } 252 var content = ""; 253 const result = this.events.filter((evt) => evt.showevent && evt.Latitude === event.Latitude && evt.Longitude == event.Longitude); 254 for (i = 0; i < result.length; i++) { 255 var url = "ViewEvent.aspx?id=" + result[i].EventId; 256 content += "<h5><a style=\"outline: none;\" runat=\"server\" href=\"" + url + "\">" + result[i].DisplayName + " (" + result[i].EventStartDateStr + ")</a></h5>"; 257 if (result[i].LocationName) { 258 content += result[i].LocationName 259 } 260 if (result[i].LocationAddressStreet1) { 261 content += "</br>" + result[i].LocationAddressStreet1 262 } 263 if (result[i].AddressLine2) { 264 content += "</br>" + result[i].AddressLine2 265 } 266 if (result[i].ParticipantLimit < 9999) { 267 var availableSeats = result[i].ParticipantLimit - result[i].ApprovedParticipants; 268 if (availableSeats > 0) { 269 content += ` 270 </br> 271 <span class='label label-primary'> 272 ${availableSeats} of ${result[i].ParticipantLimit} Seats Available 273 </span>`; 274 } else { 275 content += ` 276 </br> 277 <span class='label label-danger'> 278 <i class='fa fa-exclamation-triangle' aria-hidden='true'></i> Max. Participants Reached 279 </span>`; 280 } 281 } 282 if (event.RegistrationOpen && result[i].PublicationProfileId != "6") { 283 content += "<span class='label label-success'><i class='fa fa-user-plus' aria-hidden='true'></i> Registration Open</span>"; 284 } 285 content += "</br></br>"; 286 } 287 var infowindow = new google.maps.InfoWindow({ 288 content: content 289 }); 290 infowindow.open(this.map, event.marker); 291 this.openwindows.push(infowindow); 292 var location = new google.maps.LatLng(event.Latitude, event.Longitude); 293 this.map.panTo(location); 294 var elmnt = document.getElementById("mapWrapper"); 295 elmnt.scrollIntoView(); 296 }, 297 doSearch: function () { 298 299 this.mapcentered = false; 300 var searchText = this.searchText; 301 var type = this.type; 302 var distance = this.distancefrom; 303 var hasZip = (this.zipcode.length === 5); 304 var selectedVisibility = this.selectedVisibility; 305 var hasVisibilityMatch = false; 306 307 if (searchText || type > 0 || (distance && hasZip)) { 308 for (var evt of this.events) { 309 // var showrow = false; 310 var hasTextMatch = false; 311 var hasTypeMatch = false; 312 var hasZipMatch = false; 313 if (searchText) { 314 if (HasTextMatch(evt.DisplayName, searchText)) { 315 hasTextMatch = true; 316 } 317 if (HasTextMatch(evt.LocationAddressStreet1, searchText)) { 318 hasTextMatch = true; 319 } 320 if (HasTextMatch(evt.LocationName, searchText)) { 321 hasTextMatch = true; 322 } 323 if (HasTextMatch(evt.EventId.toString(), searchText)) { 324 hasTextMatch = true; 325 } 326 if (HasTextMatch(evt.AddressLine2, searchText)) { 327 hasTextMatch = true; 328 } 329 } else { 330 hasTextMatch = true; 331 } 332 if (type > 0) { 333 const parsedType = parseInt(type, 10); 334 if (!isNaN(parsedType)) { 335 if (evt.EventTypeId === parsedType) { 336 hasTypeMatch = true; 337 } 338 else { 339 hasTypeMatch = false; 340 } 341 } 342 } 343 else { 344 hasTypeMatch = true; 345 } 346 if (hasZip) { 347 if (distance) { 348 var distanceInt = parseInt(distance); 349 if (evt.Distance) { 350 if (evt.Distance <= distanceInt) { 351 hasZipMatch = true; 352 } else { 353 hasZipMatch = false; 354 } 355 } else { 356 hasZipMatch = false; 357 } 358 } else { 359 hasZipMatch = true; 360 } 361 } else { 362 hasZipMatch = true; 363 } 364 365 hasVisibilityMatch = 366 (evt.IsPublicEvent && selectedVisibility === 1) || 367 (!evt.IsPublicEvent && selectedVisibility === 2) || 368 selectedVisibility === 3; 369 370 if (hasTextMatch && hasTypeMatch && hasZipMatch && hasVisibilityMatch) { 371 evt.showevent = true; 372 } else { 373 evt.showevent = false; 374 } 375 } 376 this.resetMarkers(); 377 378 if (this.enableGA4Format) { 379 dataLayer.push({ 380 'event': 'calendar_event_search', 381 'event_search_criteria': searchText, 382 'event_type': type, 383 'event_search_results': this.events.length 384 }); 385 } 386 } else { 387 for (var evt of this.events) { 388 hasVisibilityMatch = 389 (evt.IsPublicEvent && selectedVisibility === 1) || 390 (!evt.IsPublicEvent && selectedVisibility === 2) || 391 selectedVisibility === 3; 392 393 if (hasVisibilityMatch) { 394 evt.showevent = true; 395 } else { 396 evt.showevent = false; 397 } 398 } 399 this.resetMarkers(); 400 } 401 }, 402 resetMarkers: function () { 403 //Remove current markers if any 404 var existingmarkers = this.allmarkers; 405 for (i = 0; i < existingmarkers.length; i++) { 406 existingmarkers[i].setMap(null); 407 } 408 this.allmarkers = []; 409 var events = this.events; 410 for (i = 0; i < events.length; i++) { 411 if (events[i].showevent === true) { 412 this.placeMarker(events[i]); 413 } 414 } 415 }, 416 checkZip: function () { 417 var zip = this.zipcode; 418 if (zip) { 419 if (zip.length === 5) { 420 this.getUpdatedDates();
421 } 422 } else { 423 this.getUpdatedDates(); 424 } 425 }, 426 checkDistance: function () { 427 if (this.distancefrom) { 428 this.doSearch(); 429 } 430 } 431 432 } 433}); 434 435function HasTextMatch(data, filter) { 436 var dataUpper = data.toUpperCase(); 437 var filterUpper = filter.toUpperCase(); 438 if (dataUpper.indexOf(filterUpper) > -1) { 439 return true; 440 } else { 441 return false; 442 } 443}
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.