Added openNearest setting to open/select the nearest location after searching, added corresponding callbackNearestLoc

Author: bjorn2404

callbacks.md

@@ -44,6 +44,7 @@ $('#bh-sl-map-container').storeLocator({
 | [callbackModalOpen](callbacks/callback-modalopen.md) | Modal open callback |
 | [callbackModalReady](callbacks/callback-modalready.md) | Modal ready callback |
 | [callbackModalClose](callbacks/callback-modalclose.md) | Modal close callback |
+| [callbackNearestLoc](callbacks/callback-nearestloc.md) | Nearest location callback |
 | [callbackMarkerClick](callbacks/callback-markerclick.md) | Marker click callback |
 | [callbackListClick](callbacks/callback-listclick.md) | Location list click callback |
 | [callbackPageChange](callbacks/callback-pagechange.md) | Page change callback |

callbacks/callback-nearestloc.md

@@ -0,0 +1,15 @@
+# callbackNearestLoc
+
+## Description
+
+Fires when the nearest location is triggered with the openNearest setting.
+
+## Parameters
+
+| Name | Type | Description |
+|---|---|---|
+| map | object | Google Maps object |
+| nearestLoc | object | Details of the nearest location |
+| infowindow | object | Info window object |
+| storeStart | number | Starting point of current page when pagination is enabled |
+| page | number | Current page number when pagination is enabled |

dist/assets/js/plugins/storeLocator/jquery.storelocator.js

@@ -1,4 +1,4 @@
-/*! jQuery Google Maps Store Locator - v2.7.5 - 2018-02-08
+/*! jQuery Google Maps Store Locator - v2.7.5 - 2018-02-09
 * http://www.bjornblog.com/web/jquery-store-locator-plugin
 * Copyright (c) 2018 Bjorn Holine; Licensed MIT */
 
@@ -79,6 +79,7 @@
 		'nameAttribute'              : 'name',
 		'visibleMarkersList'         : false,
 		'dragSearch'                 : false,
+		'openNearest'                : false,
 		'infowindowTemplatePath'     : 'assets/js/plugins/storeLocator/templates/infowindow-description.html',
 		'listTemplatePath'           : 'assets/js/plugins/storeLocator/templates/location-list-description.html',
 		'KMLinfowindowTemplatePath'  : 'assets/js/plugins/storeLocator/templates/kml-infowindow-description.html',
@@ -104,6 +105,7 @@
 		'callbackModalOpen'          : null,
 		'callbackModalReady'         : null,
 		'callbackModalClose'         : null,
+		'callbackNearestLoc'         : null,
 		'callbackJsonp'              : null,
 		'callbackCreateMarker'       : null,
 		'callbackPageChange'         : null,
@@ -2162,13 +2164,53 @@
 			});
 		},
 
+		/**
+		 * Open and select the location closest to the origin
+		 *
+		 * @param nearestLoc {Object} Details for the nearest location
+		 * @param infowindow {Object} Info window object
+		 * @param storeStart {number} Starting point of current page when pagination is enabled
+		 * @param page {number} Current page number when pagination is enabled
+		 */
+		openNearestLocation: function(nearestLoc, infowindow, storeStart, page) {
+			this.writeDebug('openNearestLocation',arguments);
+
+			if (this.settings.openNearest !== true || typeof nearestLoc === 'undefined' || (this.settings.fullMapStart === true && firstRun === true) || (this.settings.defaultLoc === true && firstRun === true)) {
+				return;
+			}
+
+			var _this = this;
+
+			// Callback
+			if (_this.settings.callbackNearestLoc) {
+				_this.settings.callbackNearestLoc.call(this, _this.map, nearestLoc, infowindow, storeStart, page);
+			}
+
+			var markerId = 0;
+			var selectedMarker = markers[markerId];
+
+			_this.createInfowindow(selectedMarker, 'left', infowindow, storeStart, page);
+
+			// Scroll list to selected marker
+			var $container = $('.' + _this.settings.locationList);
+			var $selectedLocation = $('.' + _this.settings.locationList + ' li[data-markerid=' + markerId + ']');
+
+			// Focus on the list
+			$('.' + _this.settings.locationList + ' li').removeClass('list-focus');
+			$selectedLocation.addClass('list-focus');
+
+			$container.animate({
+				scrollTop: $selectedLocation.offset().top - $container.offset().top + $container.scrollTop()
+			});
+		},
+
 		/**
 		 * Handle clicks from the location list
 		 *
 		 * @param map {Object} Google map
-		 * @param infowindow
-		 * @param storeStart
-		 * @param page
+		 * @param infowindow {Object} Info window object
+		 * @param storeStart {number} Starting point of current page when pagination is enabled
+		 * @param page {number} Current page number when pagination is enabled
 		 */
 		listClick: function(map, infowindow, storeStart, page) {
 			this.writeDebug('listClick',arguments);
@@ -2363,7 +2405,7 @@
 			this.writeDebug('processData',arguments);
 			var _this = this;
 			var i = 0;
-			var orig_lat, orig_lng, origin, name, maxDistance, marker, bounds, storeStart, storeNumToShow, myOptions, distError, openMap, infowindow;
+			var orig_lat, orig_lng, origin, name, maxDistance, marker, bounds, storeStart, storeNumToShow, myOptions, distError, openMap, infowindow, nearestLoc;
 			var taxFilters = {};
 			if (!this.isEmptyObject(mappingObject)) {
 				orig_lat = mappingObject.lat;
@@ -2511,6 +2553,11 @@
 				}
 			}
 
+			// Save the closest location to a variable for openNearest setting.
+			if (_this.settings.openNearest === true && typeof locationset[0] !== 'undefined') {
+				nearestLoc = locationset[0];
+			}
+
 			// Featured locations filtering
 			if (_this.settings.featuredLocations === true) {
 				// Create array for featured locations
@@ -2692,6 +2739,9 @@
 				});
 			}
 
+			// Open nearest location.
+			_this.openNearestLocation(nearestLoc, infowindow, storeStart, page);
+
 			// MarkerClusterer setup
 			if ( typeof MarkerClusterer !== 'undefined' && _this.settings.markerCluster !== null ) {
 				var markerCluster = new MarkerClusterer(_this.map, markers, _this.settings.markerCluster);

dist/assets/js/plugins/storeLocator/jquery.storelocator.min.js

@@ -57,6 +57,7 @@
 | nameAttribute | 'name' | If using nameSearch, the data attribute used for the location name in the data file. |
 | visibleMarkersList | false | Set to true to have the location list only show data from markers that are visible on the map. |
 | dragSearch | false | Set to true to perform a new search after the map is dragged. |
+| openNearest | false | Set to true to highlight the nearest location automatically after searching. |
 | infowindowTemplatePath | 'assets/js/plugins/storeLocator/templates/infowindow-description.html' | Path to the default infowindow template. |
 | listTemplatePath | 'assets/js/plugins/storeLocator/templates/location-list-description.html' | Path to the default list template. |
 | KMLinfowindowTemplatePath | 'assets/js/plugins/storeLocator/templates/kml-infowindow-description.html' | Path to the KML infowindow template – used if dataType is set to kml. |

options.md

@@ -39,6 +39,8 @@ filtering.
 
 * Added callbackAutoGeoSuccess callback that fires after the geolocation API returns a successful result.
 * Added callbackFormVals callback that fires after the form values have been processed from the form.
+* Added callbackNearestLoc that fires when the nearest location is triggered with the openNearest setting.
+* Added openNearest setting to open/select the nearest location after searching.
 * Fixed issue with featuredLocations setting where featured locations at far distances would trigger distance alert.
 * Fixed issue with filtering values containing ampersands, which would not display any results - updated filtering regex.
 * Fixed issue where HTML5 Geolocation was skipped when using the fullMapStartBlank setting.

readme.md

@@ -75,6 +75,7 @@
 		'nameAttribute'              : 'name',
 		'visibleMarkersList'         : false,
 		'dragSearch'                 : false,
+		'openNearest'                : false,
 		'infowindowTemplatePath'     : 'assets/js/plugins/storeLocator/templates/infowindow-description.html',
 		'listTemplatePath'           : 'assets/js/plugins/storeLocator/templates/location-list-description.html',
 		'KMLinfowindowTemplatePath'  : 'assets/js/plugins/storeLocator/templates/kml-infowindow-description.html',
@@ -100,6 +101,7 @@
 		'callbackModalOpen'          : null,
 		'callbackModalReady'         : null,
 		'callbackModalClose'         : null,
+		'callbackNearestLoc'         : null,
 		'callbackJsonp'              : null,
 		'callbackCreateMarker'       : null,
 		'callbackPageChange'         : null,
@@ -2158,13 +2160,53 @@
 			});
 		},
 
+		/**
+		 * Open and select the location closest to the origin
+		 *
+		 * @param nearestLoc {Object} Details for the nearest location
+		 * @param infowindow {Object} Info window object
+		 * @param storeStart {number} Starting point of current page when pagination is enabled
+		 * @param page {number} Current page number when pagination is enabled
+		 */
+		openNearestLocation: function(nearestLoc, infowindow, storeStart, page) {
+			this.writeDebug('openNearestLocation',arguments);
+
+			if (this.settings.openNearest !== true || typeof nearestLoc === 'undefined' || (this.settings.fullMapStart === true && firstRun === true) || (this.settings.defaultLoc === true && firstRun === true)) {
+				return;
+			}
+
+			var _this = this;
+
+			// Callback
+			if (_this.settings.callbackNearestLoc) {
+				_this.settings.callbackNearestLoc.call(this, _this.map, nearestLoc, infowindow, storeStart, page);
+			}
+
+			var markerId = 0;
+			var selectedMarker = markers[markerId];
+
+			_this.createInfowindow(selectedMarker, 'left', infowindow, storeStart, page);
+
+			// Scroll list to selected marker
+			var $container = $('.' + _this.settings.locationList);
+			var $selectedLocation = $('.' + _this.settings.locationList + ' li[data-markerid=' + markerId + ']');
+
+			// Focus on the list
+			$('.' + _this.settings.locationList + ' li').removeClass('list-focus');
+			$selectedLocation.addClass('list-focus');
+
+			$container.animate({
+				scrollTop: $selectedLocation.offset().top - $container.offset().top + $container.scrollTop()
+			});
+		},
+
 		/**
 		 * Handle clicks from the location list
 		 *
 		 * @param map {Object} Google map
-		 * @param infowindow
-		 * @param storeStart
-		 * @param page
+		 * @param infowindow {Object} Info window object
+		 * @param storeStart {number} Starting point of current page when pagination is enabled
+		 * @param page {number} Current page number when pagination is enabled
 		 */
 		listClick: function(map, infowindow, storeStart, page) {
 			this.writeDebug('listClick',arguments);
@@ -2359,7 +2401,7 @@
 			this.writeDebug('processData',arguments);
 			var _this = this;
 			var i = 0;
-			var orig_lat, orig_lng, origin, name, maxDistance, marker, bounds, storeStart, storeNumToShow, myOptions, distError, openMap, infowindow;
+			var orig_lat, orig_lng, origin, name, maxDistance, marker, bounds, storeStart, storeNumToShow, myOptions, distError, openMap, infowindow, nearestLoc;
 			var taxFilters = {};
 			if (!this.isEmptyObject(mappingObject)) {
 				orig_lat = mappingObject.lat;
@@ -2507,6 +2549,11 @@
 				}
 			}
 
+			// Save the closest location to a variable for openNearest setting.
+			if (_this.settings.openNearest === true && typeof locationset[0] !== 'undefined') {
+				nearestLoc = locationset[0];
+			}
+
 			// Featured locations filtering
 			if (_this.settings.featuredLocations === true) {
 				// Create array for featured locations
@@ -2688,6 +2735,9 @@
 				});
 			}
 
+			// Open nearest location.
+			_this.openNearestLocation(nearestLoc, infowindow, storeStart, page);
+
 			// MarkerClusterer setup
 			if ( typeof MarkerClusterer !== 'undefined' && _this.settings.markerCluster !== null ) {
 				var markerCluster = new MarkerClusterer(_this.map, markers, _this.settings.markerCluster);