HTML5 refresh page on geolocation change

Question

I have a webapp developed using AngularJS.

One of the features is only enabled when the user is within a particular distance away from the list of specified locations.

In order to achieve this I can refresh the page every 5 seconds and perform calculations to see if the user is closed enough to any location and enable the feature accordingly. But I think this is taxing on the server unnecessarily especially when the user doesnt move.

Is there a way I can have my web app refresh only when the geolocation changes, or perhaps another even better way to achieve my objective?

Answer 1

Check this http://dev.w3.org/geo/api/spec-source.html . You could save a previous position and then continuously poll for changes

var previousPosition = {
    latitude: 40.023,
    longitude: 23.203
};
function watchGeolocation(position) {
  //position.coords.latitude, position.coords.longitude
      if (position.coords.latitude != previousPosition.latitude ||
          position.coords.longitude != previousPosition.longitude) 
      {
          //update the view
      }
}

// Request repeated updates.
var watchId = navigator.geolocation.watchPosition(watchGeolocation);

//clear watching the geolocation
navigator.geolocation.clearWatch(watchId);