Implement "Locate Me" feature using google maps.

//This code implements the “Locate Me” feature using google maps for mobile applications. It works //perfectly fine on mobile simulators.

<script type="text/javascript"src="http://maps.google.com/maps/api/js?sensor=false"></script>

<article>
<p><spanclass="contentsmall">Finding your location:</span><span class="contentsmall" id="status">checking...</span></p>
</article>

<script>
function success(position)
{
vars = document.querySelector('#status');
if(s.className == 'success')
{
return;
}

s.innerHTML = "found you!";
s.className = 'success';

var mapcanvas = document.createElement('div');
mapcanvas.id ='mapcanvas';
mapcanvas.style.height = '350px';
mapcanvas.style.width = '330px';

document.querySelector('article').appendChild(mapcanvas);

var latlng = newgoogle.maps.LatLng(position.coords.latitude, position.coords.longitude);

//You can use hardcoded values as shown below for testing purpose.
//var latlng = new google.maps.LatLng(19.1242244, 72.8772207);

var myOptions ={
zoom: 15,
center: latlng,
panControl: true,
scaleControl:true,
zoomControl:true,
zoomControlOptions: {style: google.maps.ZoomControlStyle.SMALL},
mapTypeControl:true,
navigationControl:true,
navigationControlOptions: {style: google.maps.NavigationControlStyle.SMALL},

mapTypeId: google.maps.MapTypeId.ROADMAP
};

var map = newgoogle.maps.Map(document.getElementById("mapcanvas"), myOptions);
var marker = newgoogle.maps.Marker({
position: latlng,
map: map,
title:"You are here!" });
}


Function error(msg)
{
vars = document.querySelector('#status');
s.innerHTML = typeof msg == 'string' ? msg : "failed";
s.className = 'fail';
}


if(navigator.geolocation)
{
navigator.geolocation.getCurrentPosition(success, error);
}
else
{
error('not supported');
}
</script>

This is how the ouput will look on any mobile simulator.