Pointr Web SDK Events¶

This guide offers detailed information on events triggered by the Pointr Web SDK, covering UI components like MapView, LevelSelectorView, and ZoomSelectorView. Developers can manage interactions such as map clicks, zoom actions, and POI selections. Each section lists event types, triggers, and relevant data, with examples on managing event lifecycles for dynamic application responses. This resource is valuable for developers customizing or implementing interactive features using Pointr’s SDK in kiosks, websites, or wayfinding systems.

• MapWidget Events
• MapView Events
• LevelSelectorView Events
• ZoomSelectorView Events
• SearchView Events
• PoiDetailsView Events
• NavigationView Events
• PoiCardsView Events
• LanguageSelectorView Events
• RatingView Events
• InfoView Events
• LoadingView Events
• WelcomeView Events
• Listener Pattern

Sample usage of events:¶

const uiController = pointrWeb.getUiController();
const mapViewController = uiController.getMapViewController();
const mapView = mapViewController.getView();
const events = mapView.events;
const callback1 = () => {
  console.log("Map shown!");
};
mapView.on(events.viewShown, callback1);

// event with data
const callback2 = (newLevel) => {
  console.log("Map level changed to ", newLevel);
};
mapView.on(events.levelChanged, callback2);

Sample usage of detaching events:¶

const uiController = pointrWeb.getUiController();
const mapViewController = uiController.getMapViewController();
const mapView = mapViewController.getView();
const events = mapView.events;
const callback = (newLevel) => {
  console.log("***Map level changed to ", newLevel);
};
mapView.on(events.levelChanged, callback);
// Event will be removed after 10 seconds
setTimeout(() => {
  mapView.off(events.levelChanged, callback);
}, 10 * 1000);

MapWidget Events¶

const events = pointrWeb.events;

MapView Events¶

Available events for the MapView component can be accessed as follows:

const events = pointrWeb
  .getUiController()
  .getMapViewController()
  .getView().events;

LevelSelectorView Events¶

Available events for the LevelSelectorView component can be accessed as follows:

const events = pointrWeb
  .getUiController()
  .getLevelSelectorViewController()
  .getView().events;

ZoomSelectorView Events¶

Available events for the ZoomSelectorView component can be accessed as follows:

const events = pointrWeb
  .getUiController()
  .getZoomSelectorViewController()
  .getView().events;

¶

Available events for the SearchView component can be accessed as follows:

const events = pointrWeb
  .getUiController()
  .getSearchViewController()
  .getView().events;

PoiDetailsView Events¶

Available events for the PoiDetailsView component can be accessed as follows:

const events = pointrWeb
  .getUiController()
  .getPoiDetailsViewController()
  .getView().events;

NavigationView Events¶

Available events for the NavigationView component can be accessed as follows:

const events = pointrWeb
  .getUiController()
  .getNavigationViewController()
  .getView().events;

CategoryListView Events¶

Available events for the CategoryListView component can be accessed as follows:

const events = pointrWeb
  .getUiController()
  .getCategoryListViewController()
  .getView().events;

PoiCardsView Events¶

Available events for the PoiCardsView component can be accessed as follows:

const events = pointrWeb
  .getUiController()
  .getPoiCardsViewController()
  .getView().events;

LanguageSelectorView Events¶

Available events for the LanguageSelectorView component can be accessed as follows:

const events = pointrWeb
  .getUiController()
  .getLanguageSelectorViewController()
  .getView().events;

RatingView Events¶

const events = pointrWeb
  .getUiController()
  .getRatingViewController()
  .getView().events;

InfoView Events¶

const events = pointrWeb
  .getUiController()
  .getInfoViewController()
  .getView().events;

LoadingView Events¶

const events = pointrWeb
  .getUiController()
  .getLoadingViewController()
  .getView().events;

WelcomeView Events¶

const events = pointrWeb
  .getUiController()
  .getWelcomeViewController()
  .getView().events;

Listener Pattern¶

Listener pattern is a very popular pattern in MVC design paradigm and most mobile frameworks. Pointr SDKs make heavy use of this pattern throughout the code. The most likely you will encounter this pattern is when working with Managers. Most managers (if not all) use this pattern to advertise events to their listeners.

For example, PoiManager advertises when new POI data is available through its onPoiManagerChangedPoisForSite callback method. Any party interested in the latest POI data should

• Add itself as a listener to PoiManager - eg. PoiManager.addListener(self)
• Implement callbacks of interest¹ in your class

For all available callbacks, examine the relevant Listener class - eg. PoiManager’s callbacks are defined in PoiManager.Listener

Correct implementation

Pointr.shared.poiManager.addListener(...)
var pois = Pointr.shared.poiManager.pois(...)

In this implementation, you always ensure you have the latest data

Incorrect implementation

(1) var pois = Pointr.shared.poiManager.pois(...)
(2) Pointr.shared.poiManager.addListener(...)

1: Javascript and Swift allows you to implement as many callbacks as you are interested in whilst Java and Kotlin force you to implement all callbacks.