Geolocation developer
Geolocation is the identification or estimation of the real-world geographic location of an object, such as a radar source, mobile phone, or Internet-connected computer terminal.
In this page only the Website HTML-5 Geolocation is described [1].
The HTML Geolocation option is build-in option in HTML-5.
The purpose of this page is to describe how to implement the Geolocation in JavaScript with jQuery.
Introduction
The HTML-5 Geolocation implementation makes it possible to get the current location of the Website user with the following restrictions:
- The feature is only available in secure contexts (https).
- The user has to give permission to access his personal location (privacy reason).
- A VPN connection hides the real position and replace the location by the VPN instead. This makes the Geolocation useless.
Usage
JavaScript Anonymous function
For me the best way to implement new functionality is by using an anonymous function with all referred variables and methods inside the anonymous function. <syntaxhighlight lang="javascript" line="line"> /**
* Anonymous function for handling geolocation. * @param object geoLocation Object and Name of the function. * @param object $ jQyery Object. * @param object undefined Prevents the overriding of the undefined. */
(function( geoLocation, $, undefined ) {
'use strict'; geoLocation.versionNumber = "0.1.0.1"; geoLocation.versionDate = "30 Sep 2017";
/** GeoData object. */ var geoData = { available : "geolocation" in navigator, allowed : false, // Has the user consented in the geolocation detection. latitude : -1, longitude : -1, }; /* Verbode developer flag. */ var verbose = false;
/** * Gets the Version number and date of the anonymous function. * @return string number + date. */ geoLocation.version = function() { return sprintf("%s - %s", geoLocation.versionNumber, geoLocation.versionDate) }
/** * Initializes the geoLocation. * @param boolean verboseFlag Optional Verbose flag. * @return void */ geoLocation.init = function( verboseFlag) { 'use strict'; verbose = typeof verboseFlag === 'undefined' ? verbose : verboseFlag;
if ( location.protocol == 'https:' && geoData.available ) { if ( navigator.geolocation ) { navigator.geolocation.getCurrentPosition( geoLocation.successLocation, geoLocation.errorLocation ); return; } } geoLocation.errorLocation(); } // .init
/** * Success Callback function for getting the User location. * When called the geodata object is enriched with allowed, Latitude and Longitude. * @global Object geoData JSO GeoLocation object. * @param Object position JSO with latitude and longitude. * @return void */ geoLocation.successLocation = function( position ) { 'use strict'; var met = "geoLocation.successLocation"; geoData.allowed = true; geoData.latitude = position.coords.latitude; geoData.longitude = position.coords.longitude;
logts( sprintf( logFormatLBW, met, "GeoLocation", "Latitude: " + geoData.latitude + ", Longitude: " + geoData.longitude)); } // .successLocation
/** * Error Callback function for handling errors in GeoLocation. * Sets the global geoData.allowed to false. * @return void */ geoLocation.errorLocation = function() { 'use strict'; var met = "geoLocation.errorLocation";
logts( sprintf( logFormatLBW, met, "GeoLocation", "No position available")); geoData.allowed = false; } // .errorLocation
/** * Checks the given protocol. * For realtime https is necesassry, for local testing http. * Sets the geoData.allowed flag. * @return void */ geoLocation.checkProtocol = function() { if ( location.protocol == 'http:') { geoData.allowed = true; geoData.latitude = 52.414947; geoData.longitude = 7.082583; return false; } return true; } // checkProtocol
/** * Getters for the geoData.allowed, geoData.latitude, geoData.getLongitude * @return boolean geoData.allowed */ geoLocation.getAllowed = function() { return geoData.allowed; } geoLocation.getLatitude = function() { return geoData.latitude; } // . getLatitude geoLocation.getLongitude = function() { return geoData.longitude; } // .getLongitude
} ( window.geoLocation = window.geoLocation || {}, jQuery) ); </syntaxhighlight>
- Line 7 - 10: The anonymous function name and version number and date.
- Line 12 - 18: The geodata object with all important variables,
- available is set true when the geolocation is available in the browser
- allowed is set true when the user has permitted the usage of his location.
- geoLocation.version is a public method for returning the version date and number.
- geoLocation.init is the public method that the user has to call to use the anonymous function.
- geoLocation.successLocation is a public callback function that is called by the geoLocation.init in case of success.
- geoLocation.errorLocation is a public callback function that is called by the geoLocation.init in case of an error/failure.
- geoLocation.checkProtocol is the public function that can be used for testing the anonymous function functionality in a http environment. It sets a dummy location.
Calling anonymous function
To use the anonymous function place the following in the .ready function of your Website.
<syntaxhighlight lang="javascript" line="line"> /**
* jQuery function .ready */
$(document).ready(
function() { 'use strict'; ... // Initializes the geoLocation. geoLocation.init(); ... setTimeout( "bgAuditMonitor()", 3500);
});
/**
* Time delayed Audit monitor call. * The delay is necessary to catch the GeoLocation (only under https protocol). * @global ipAddress, loginID, loginUID * @return void */
function bgAuditMonitor() {
'use strict'; ... // If there is geolocation information if (geoLocation.getAllowed() ) { altert( "Geolocation latitude " + geoLocation.getLatitude() + ", longitude " +geoLocation.getLongitude() ); }
} </syntaxhighlight>
- line 1 - 7: Example lines to implement the jQuery.ready method.
- line 8 - 9: Calling the anonymous function.
- line 11: Calls the method to show the found geolocation with a timeout because the location determination has a delay itself.
- line 20 - 27: Example setTime method implementation for the monitor.
See also
Reference
- ↑ Developer Mozilla, Using Geolocation Developer.