1(function( $ ) { 2 3 4 $( document ).ready(function() { 5 6 var affiliate_location_pins = []; 7 var affiliate_locations = []; 8 //set map marks are global array 9 var markers = []; 10 11 //check and show map 12 if($('#impactMap').length > 0){ 13 14 initMap(); 15 getAffiliateLocations(); 16 17 } 18 19 function getAffiliateLocations() { 20 21 $.ajax({ 22 url: impactMapAjax.ajaxurl, 23 type: 'POST', 24 data: { 25 action: 'load_impact_map_affiliates', 26 nonce: impactMapAjax.nonce, 27 }, 28 success: function( response ) { 29 30 let json_response = response; 31 32 if ( json_response.affiliate_locations.length > 0 ) { 33 34 affiliate_location_pins = json_response.affiliate_locations; 35 36 createPins(); 37 38 setMarkers(); 39 40 } else { 41 42 resetMap(); 43 44 } 45 46 }, 47 error: function(error){ 48 49 console.log('error: ', error); 50 } 51 }); 52 } 53 54 // MAP FUNCTIONS 55 function resetMap(){ 56 57 clearOverlays(); 58 59 } 60 61 //initializing Map creation 62 function initMap() { 63 64 const impact_center = { 65 lat: 42.5486,//37.09024, //location_pins[0]['lat'], 66 lng: -96.75849//-95.712891, //location_pins[0]['lng'] 67 }; 68 69 // The map, centered at First Housing Location 70 map = new google.maps.Map(document.getElementById("impactMap"), { 71 zoom: 3.5, 72 center: impact_center, 73 zoomControl: true 74 }); 75 76 } 77 78 //create map pins 79 function createPins(){ 80 //set all pins 81 82 affiliate_locations.forEach( location => { 83 84 let lat = location['lat']; 85 let lng = location['lng']; 86 let star_location = location['star_location']; 87 let title = `${location['title']}`; 88 let permalink = `${location['permalink']}`; 89 let map_rollover_image = `${location['map_rollover_image']}`; 90 let map_rollover_description = `${location['map_rollover_description']}`; 91 let open_in_new_tab = `${location['open_in_new_tab']}`; 92 93 94 affiliate_location_pins.push({ 95 'lat': parseFloat(lat), 96 'lng': parseFloat(lng), 97 'star_location': star_location, 98 'title': title, 99 'permalink': permalink, 100 'map_rollover_image': map_rollover_image, 101 'map_rollover_description': map_rollover_description, 102 'open_in_new_tab': open_in_new_tab, 103 104 }) 105 106 }); 107 } 108 109 //clear markers during map reset 110 function clearOverlays() { 111 if (markers) { 112 for (i in markers) { 113 markers[i].setMap(null); 114 } 115 } 116 } 117 118 //set markers for initial and map resets 119 function setMarkers() { 120 121 //let infowindow = new google.maps.InfoWindow(); 122 //push all pins when loading in map 123 for ( let i = 0; i < affiliate_location_pins.length; i++ ) { 124 125 let image_marker = affiliate_location_pins[i]['star_location'] == true ? impact_map_globals.image_marker_star : impact_map_globals.image_marker_blue; 126 let label_title = affiliate_location_pins[i]['title']; 127 128 let formatted_label_title = label_title.replace('&','&') 129 130 let non_external_link = affiliate_location_pins[i]['open_in_new_tab'] == true ? "target='_blank'" : ""; 131 132 let content = ` 133 <div> 134 <div id='closeMarkerContainer'>✕</div> 135 <a class="" href="${affiliate_location_pins[i]['permalink']}" ${non_external_link}><div class="rollover-image" style="background-image: url(${affiliate_location_pins[i]['map_rollover_image']});background-size:cover;background-repeat:no-repeat;width:100%;height:250px;"></div></a>
136 <span class="rollover-span"> <img class='marker-flag' alt='VOA Affiliate Flag' src="${impact_map_globals.image_marker_red}"> 137 <a href="${affiliate_location_pins[i]['permalink']}" ${non_external_link}> 138 <h3 class="rollover-title small-heading">${affiliate_location_pins[i]['title']} ></h3> 139 </a></span> 140 <p class="rollover-description">${affiliate_location_pins[i]['map_rollover_description']}</p> 141 <a class="rollover-link" href="${affiliate_location_pins[i]['permalink']}" ${non_external_link}>Learn More ></a> 142 143 </div>`; 144 let marker = new google.maps.Marker( { 145 position: { 146 lat: parseFloat(affiliate_location_pins[i]['lat']), 147 lng: parseFloat(affiliate_location_pins[i]['lng']), 148 }, 149 icon: image_marker, 150 title: formatted_label_title, 151 map: map, 152 }); 153 154 //bounds.extend( marker.getPosition() ); 155 156 google.maps.event.addListener( marker, 'click', ( function( marker, i ) { 157 return function() { 158 159 // infowindow.setContent( content ); 160 // infowindow.open(map, marker); 161 162 $('#markerContainer').html(content); 163 $('#markerContainer').removeClass('hidden'); 164 165 //set title so you know what marker was clicked and modal is showing 166 $('#markerContainer').attr('data-markerClicked', marker.title); 167 168 let mapHeight = $('#impactMap').height(); 169 let containerHeight = $('#markerContainer').height(); 170 171 //map height diff / 2 to get one side difference 172 let map_center = parseFloat( ( mapHeight - containerHeight ) / 2 ); 173 174 $('#markerContainer').css('top', map_center ); 175 $('#markerContainer').css('left','25px'); 176 $('#markerContainer').css('height','fit-content'); 177 178 //set markers to appropriate icon 179 if ( markers ) { 180 181 for ( i in markers ) { 182 183 if( markers[i].title == "VOA Headquarters" ) { 184 185 markers[i].setIcon( impact_map_globals.image_marker_star ); 186 187 } else { 188 189 if ( markers[i].title === marker.title ) { 190 191 markers[i].setIcon( impact_map_globals.image_marker_red ); 192 193 } else { 194 195 markers[i].setIcon( impact_map_globals.image_marker_blue ); 196 197 } 198 } 199 200 } 201 } 202 203 //set icon to be red 204 if ( marker.icon !== impact_map_globals.image_marker_red ) { 205 206 marker.setIcon(impact_map_globals.image_marker_red); 207 208 } 209 210 } 211 })(marker,i)); 212 213 google.maps.event.addListener( marker, 'mouseover', ( function( marker, i ) { 214 return function() { 215 216 console.log(marker.icon); 217 if ( marker.icon !== `${impact_map_globals.image_marker_red}` ) { 218 219 marker.setIcon(impact_map_globals.image_marker_red); 220 221 } 222 223 } 224 })(marker,i)); 225 226 google.maps.event.addListener( marker, 'mouseout', ( function( marker, i ) { 227 return function() { 228 229 let title = marker.title.toLowerCase(); 230 231 if ( $('#markerContainer').hasClass('hidden') ) { 232 233 if ( marker.icon == `${impact_map_globals.image_marker_red}` ) { 234 235 marker.setIcon( returnMarkerIcon( title ) ); 236 237 } 238 239 } else { 240 241 //check modal popup title and compare to pin leaving 242 let markerTitle = $('#markerContainer').attr('data-markerClicked'); 243 244 if ( marker.title !== markerTitle ) { 245 246 if ( marker.icon == `${impact_map_globals.image_marker_red}` ) { 247 248 marker.setIcon( returnMarkerIcon( title ) ); 249 250 } 251 252 } 253 254 } 255 256 } 257 })(marker,i)); 258 259 markers.push(marker); 260
261 markers.forEach(function(marker) { 262 if( marker.title === 'VOA Headquarters'){ 263 google.maps.event.trigger(marker, 'click'); 264 } 265 }); 266 //map.fitBounds(bounds); 267 268 } 269 } 270 271 function returnMarkerIcon( title ) { 272 273 let icon = `${impact_map_globals.image_marker_blue}`; 274 275 if ( title == "voa headquarters" ) { 276 277 icon = `${impact_map_globals.image_marker_star}`; 278 279 } 280 281 return icon; 282 283 } 284 285 $(document).on('click', '#closeMarkerContainer', function() { 286 287 $('#markerContainer').removeClass('hidden'); 288 $('#markerContainer').addClass('hidden'); 289 290 if ( markers ) { 291 292 for ( i in markers ) { 293 294 if( markers[i].title == "VOA Headquarters" ) { 295 296 markers[i].setIcon( impact_map_globals.image_marker_star ); 297 298 } else { 299 300 markers[i].setIcon( impact_map_globals.image_marker_blue ); 301 302 } 303 304 } 305 306 } 307 308 }); 309 310 }); 311 312})( jQuery );
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.