Sunday, September 6. 2009
Late night HTML5
The new HTML 5 specification is now operating under its 25th revision of the working draft so I have to assume that it will be finished here pretty soon. Some of the browser manufacturers are trying to get a head start by implementing some of the new features outlined in the draft. One new feature that really has me excited is the browser based geolocation API. Mozilla apparently implemented the geolocation functionality in version 3.1 of Firefox so I had to test it out.
Geolocation Testing Page (You will be asked if you want to allow Digital Engine Software to find your location at the top of the browser).It's not perfect but it's not horrible either. The location it gives me is about 5 miles away from my actual location, but it is in the right direction. As of this posting I was only able to get the script to work in Firefox. Hopefully the other major browser providers will be following suit in the coming months as the html5 spec is finalized. Code after the break.
Edit: Testing the site from work my listed location is eerily close to my actual location, within about 50 feet.
"http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<META HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=ISO-8859-1">
<meta name="verify-v1" content="7mAImgBBaJIIAxxjGsqo8YQdYxS2aJ+xqU3xY0oT8g0=" />
</style>
<script src="http://maps.google.com/maps?file=api&v=2&sensor=false&key=ABQIAAAA8Jwj5k6kUtXS7YaRV23PVBRP6JEhPKZ3GlK3TMge-RFy1ReyVRRkoA63kWzJ2qWjjSY0HVqde3iHRQ" type="text/javascript"></script>
<script type="text/javascript">
function initialize(position) {
var latitude = position.coords.latitude;
var longitude = position.coords.longitude;
if (GBrowserIsCompatible()) {
var map = new GMap2(document.getElementById("map_canvas"));
map.setCenter(new GLatLng(latitude, longitude), 12);
map.setUIToDefault();
var point = new GLatLng(latitude, longitude);
map.addOverlay(new GMarker(point));
map.openInfoWindow(map.getCenter(),
document.createTextNode("Your browser thinks your location is approximately here." ));
}
}
</script>
<script type = 'text/javascript'>
function errorPosition(position){
document.write('Your browser does not support geolocating or the browser could not identify your position.');
document.close();
}
</script>
</head>
<body>
<script type = 'text/javascript'>
// One-shot position request.
navigator.geolocation.getCurrentPosition(initialize, errorPosition);
</script>
<div id="map_canvas" style="width: 600px; height: 300px"></div>
</div>
</body>
</html>