Store Locator Reference Documentation

Types are documented using Closure Compiler type expressions.

Classes

storeLocator.DataFeed

Data feed that returns stores based on a given bounds and a set of features.

Example

// always returns the same stores
function SimpleStaticFeed(stores) {
  this.stores = stores;
}
SimpleStaticFeed.prototype.getStores = function(bounds, features, callback) {
  callback(this.stores);
};
new storeLocator.View(map, new SimpleStaticFeed());

Interface

Name Description Returns
getStores(bounds:google.maps.LatLngBounds, features:storeLocator.FeatureSet, callback:function(Array.<!storeLocator.Store>)) Fetch stores, based on bounds to search within, and features to filter on. undefined

storeLocator.Feature

Representation of a feature of a store. (e.g. 24 hours, BYO, etc).

Example

var feature = new storeLocator.Feature('24hour', 'Open 24 Hours');

Constructor

Parameter Type Description
id string unique identifier for this feature.
name string display name of this feature.

Methods

Name Description Returns
getDisplayName() Gets this Feature's display name. string this feature's display name.
getId() Gets this Feature's ID. string this feature's ID.

storeLocator.FeatureSet

A mutable, ordered set of storeLocator.Features.

Example

var feature1 = new storeLocator.Feature('1', 'Feature One');
var feature2 = new storeLocator.Feature('2', 'Feature Two');
var feature3 = new storeLocator.Feature('3', 'Feature Three');

var featureSet = new storeLocator.FeatureSet(feature1, feature2, feature3);

Constructor

Parameter Type Description
var_args ...storeLocator.Feature the initial features to add to the set.

Properties/Constants

Name Type Description
NONE storeLocator.FeatureSet Empty feature set.

Methods

Name Description Returns
add(feature:storeLocator.Feature) Adds a feature to the set. undefined
asList() Get the contents of this set as an Array. Array.<!storeLocator.Feature> the features in the set, in the order they were inserted.
contains(feature:!storeLocator.Feature) Check if a feature exists within this set. boolean true if the set contains the given feature.
getById(featureId:string) Gets a Feature object from the set, by the feature id. storeLocator.Feature the feature, if the set contains it.
remove(feature:!storeLocator.Feature) Removes a feature from the set, if it already exists in the set. If it does not already exist in the set, this function is a no op. undefined
toggle(feature:!storeLocator.Feature) Adds the given feature to the set, if it doesn't exist in the set already. Else, removes the feature from the set. undefined

storeLocator.GMEDataFeed

A DataFeed where stores are provided by Google Maps Engine.

Note: the table that contains the stores needs to be publicly accessible.

Example

var dataFeed = new storeLocator.GMEDataFeed({
  tableId: '12421761926155747447-06672618218968397709',
  apiKey: 'AIzaSyAtunhRg0VTElV-P7n4Agpm9tYlABQDCAM',
  propertiesModifier: function(props) {
    return {
      id: transformId(props.store_id),
      title: props.store_title
    };
  }
});
new storeLocator.View(map, dataFeed);

Constructor

Parameter Type Description
opts !storeLocator.GMEDataFeedOptions the table ID, API key and a transformation function for feature/store properties.

storeLocator.GMEDataFeedOptions

Example

see storeLocator.GMEDataFeed

Properties/Constants

Name Type Description
tableId string The table's asset ID.
apiKey string The API key to use for all requests.
propertiesModifier ?(function(Object): Object) A transformation function. The first argument is the feature's properties. Return an object useful for the "props" argument in the storeLocator.Store constructor. The default properties modifier function passes the feature straight through.

Note: storeLocator.GMEDataFeed expects an "id" property.

storeLocator.Panel

An info panel, to complement the map view. Provides a list of stores, location search, feature filter, and directions.

Example

var container = document.getElementById('panel');
var panel = new storeLocator.Panel(container, {
  view: view,
  locationSearchLabel: 'Location:'
});
google.maps.event.addListener(panel, 'geocode', function(result) {
  geocodeMarker.setPosition(result.geometry.location);
});

Constructor

Parameter Type Description
el !Node the element to contain this panel.
opt_options storeLocator.PanelOptions

Methods

Name Description Returns
hideDirections() Hides the directions panel. undefined
searchPosition(searchText:string) Search and pan to the specified address. undefined
setView(view:storeLocator.View) Sets the associated View. undefined
showDirections() Shows directions to the selected store. undefined

Events

Name Arguments Description
featureFilter_changed None Fired when the Panel's featureFilter property changes.
geocode result:google.maps.PlaceResult|google.maps.GeocoderResult Fired when searchPosition has been called. This happens when the user has searched for a location from the location search box and/or autocomplete.
selectedStore_changed None Fired when the Panel's selectedStore property changes.
stores_changed None Fired when the Panel's stores property changes.
view_changed None Fired when the Panel's view property changes.

storeLocator.PanelOptions

Example

see storeLocator.Panel

Properties/Constants

Name Type Description
locationSearchLabel string The label to show above the location search box. Default is "Where are you now?".
featureFilter boolean Whether to show the feature filter picker. Default is true.
directions boolean Whether to provide directions. Deafult is true.
view storeLocator.View The store locator model to bind to.

storeLocator.StaticDataFeed

A DataFeed with a static set of stores. Provides sorting of stores by proximity and feature filtering (store must have all features from the filter).

Example

var dataFeed = new storeLocator.StaticDataFeed();
jQuery.getJSON('stores.json', function(json) {
  var stores = parseStores(json);
  dataFeed.setStores(stores);
});
new storeLocator.View(map, dataFeed);

Constructor

No parameters.

Methods

Name Description Returns
getStores(bounds, features, callback) undefined
setStores(stores:!Array.<!storeLocator.Store>) Set the stores for this data feed. undefined

storeLocator.Store

Represents a store.

Example

var latLng = new google.maps.LatLng(40.7585, -73.9861);
var store = new storeLocator.Store('times_square', latLng, null);
var features = new storeLocator.FeatureSet(
    view.getFeatureById('24hour'),
    view.getFeatureById('express'),
    view.getFeatureById('wheelchair_access'));

var store = new storeLocator.Store('times_square', latLng, features, {
  title: 'Times Square',
  address: '1 Times Square<br>Manhattan, NY 10036'
});
store.distanceTo(map.getCenter());

// override default info window
store.getInfoWindowContent = function() {
  var details = this.getDetails();
  return '<h1>' + details.title + '<h1>' + details.address;
};

Constructor

Parameter Type Description
id string globally unique id of the store - should be suitable to use as a HTML id.
location !google.maps.LatLng location of the store.
features storeLocator.FeatureSet the features of this store.
props Object.<string, *>= any additional properties.

Recommended fields are: 'title', 'address', 'phone', 'misc', 'web'.

Methods

Name Description Returns
distanceTo(point:google.maps.LatLng) Gets the distance between this Store and a certain location. number the distance from this store to a given point.
getDetails() Gets additional details about this store. Object additional properties of this store.
getFeatures() Gets this store's features. storeLocator.FeatureSet this store's features.
getId() Gets this store's ID. string this store's ID.
getInfoPanelContent() Gets the HTML content for this Store, suitable for use in suitable for use in the sidebar info panel. string a HTML version of this store.
getInfoPanelItem() Gets a HTML element suitable for use in the InfoPanel. Node a HTML element.
getInfoWindowContent() Gets the HTML content for this Store, suitable for use in an InfoWindow. string a HTML version of this store.
getLocation() Gets this store's location. google.maps.LatLng this store's location.
getMarker() Gets this store's Marker google.maps.Marker the store's marker.
hasAllFeatures(features:storeLocator.FeatureSet) Checks whether this store has all the given features. boolean true if the store has all features, false otherwise.
hasFeature(feature:!storeLocator.Feature) Checks whether this store has a particular feature. boolean true if the store has the feature, false otherwise.
setMarker(marker:google.maps.Marker) Sets this store's Marker. undefined

Events

Name Arguments Description
marker_changed marker:google.maps.Marker Fired when the Store's marker property changes.

storeLocator.View

The main store locator object.

Example

new storeLocator.View(map, dataFeed);
var features = new storeLocator.FeatureSet(feature1, feature2, feature3);
new storeLocator.View(map, dataFeed, {
  markerIcon: 'icon.png',
  features: features,
  geolocation: false
});
// refresh stores every 10 seconds, regardless of interaction on the map.
var view = new storeLocator.View(map, dataFeed, {
  updateOnPan: false
});
setTimeout(function() {
  view.refreshView();
}, 10000);
// custom MarkerOptions, by overriding the createMarker method.
view.createMarker = function(store) {
  return new google.maps.Marker({
    position: store.getLocation(),
    icon: store.getDetails().icon,
    title: store.getDetails().title
  });
};

Constructor

Parameter Type Description
map google.maps.Map the map to operate upon.
data storeLocator.DataFeed the data feed to fetch stores from.
opt_options storeLocator.ViewOptions

Methods

Name Description Returns
addStoreToMap(store:storeLocator.Store) Add a store to the map. undefined
clearMarkers() Clears the visible markers on the map. undefined
createMarker(store:storeLocator.Store) Create a marker for a store. google.maps.Marker a new marker.
getFeatureById(id:string) Gets a feature by its id. Convenience method. storeLocator.Feature|undefined The feature, if the id is valid. undefined if not.
getFeatures() Gets all possible features for this View. storeLocator.FeatureSet All possible features.
getInfoWindow(store:storeLocator.Store) Get a InfoWindow for a particular store. google.maps.InfoWindow the store's InfoWindow.
getMap() Gets the view's Map. google.maps.Map the view's Map.
getMarker(store:storeLocator.Store) Get a marker for a store. By default, this caches the value from createMarker(store) google.maps.Marker the marker.
highlight(store:storeLocator.Store, opt_pan:boolean=) Select a particular store. undefined
refreshView() Refresh the map's view. This will fetch new data based on the map's bounds. undefined

Events

Name Arguments Description
featureFilter_changed None Fired when the View's featureFilter property changes.
load None Fired when the View is loaded. This happens once immediately, then once more if geolocation is successful.
selectedStore_changed store:storeLocator.Store Fired when the View's selectedStore property changes. This happens after highlight() is called.
stores_changed None Fired when the View's stores property changes.
updateOnPan_changed None Fired when the View's updateOnPan property changes.

storeLocator.ViewOptions

Example

see storeLocator.View

Properties/Constants

Name Type Description
updateOnPan boolean Whether the map should update stores in the visible area when the visible area changes. refreshView() will need to be called programatically. Defaults to true.
geolocation boolean Whether the store locator should attempt to determine the user's location for the initial view. Defaults to true.
features storeLocator.FeatureSet All available store features. Defaults to empty FeatureSet.
markerIcon string|google.maps.MarkerImage The icon to use for markers representing stores.