Information Technology Reference
In-Depth Information
Testing for Geolocation Support, Redux
The
supportsGeo()
function we introduced earlier in the chapter has been tweaked to
return a Boolean value, so we can use its result in-line in other expressions:
function supportsGeo () {
if (navigator.geolocation) {
return true;
} else {
return false;
}
}
This provides a little more utility than the previous version that returned a string value.
Creating a Utility Function for Dynamic Page Changes
Next, we've introduced a simple utility function to control dynamic HTML behavior for
<div>
elements anywhere in our code. The
changeDiv()
function takes the name of a
<div>
element, and the desired textual change, and performs the necessary changes:
function changeDiv (name, data) {
var div = document.getElementById(name);
if(div)
{
div.innerHTML = data;
}
}
This isn't strictly related to geolocation, but we think you'll agree this will make the rest
of our code examples clearer, by removing the mechanics of these changes from the
main logic.
Reviewing the Basic HTML
Our HTML code is almost the innocent bystander in our example. It provides a named
<div> element,
myCheckIn
, on which our functions will work their geolocation magic.
<h1>
<div id="myCheckIn">
<!-- This is where your check-in will display -->
<p>Ready to check in...</p>
</div>
<form name="checkInFrm">
<input type="button" name="checkInBtn" value="Geolocation Check-In!"
onClick="checkIn()">
</h1>
The form and input button invokes our central function,
checkIn()
, that will perform the
actual geolocation work.
