Skip to content

Instantly share code, notes, and snippets.

@sTiLL-iLL
Last active August 29, 2015 14:04
Show Gist options
  • Star 1 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save sTiLL-iLL/7fc6d918b9a3782ace35 to your computer and use it in GitHub Desktop.
Save sTiLL-iLL/7fc6d918b9a3782ace35 to your computer and use it in GitHub Desktop.
Simple position tracker
<!Doctype html>
<meta name="viewport" content="width=620" />
<title>KnD-MApPA</title>
<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script>
<article>
<p>Finding You...: <span id="status">Checking...</span>
</p>
</article>
<script>
var map = "",
marker = "";
function success2(position) {
var latlng = new google.maps.LatLng(position.coords.latitude, position.coords.longitude);
marker = new google.maps.Marker({
position: latlng,
map: map,
title: "You are here @ " + getDateTime() +
" - ( error margin: " + position.coords.accuracy + " meters )"
});
};
function success(position) {
var s = document.querySelector('#status');
if (s.className == 'success') {
return;
}
s.innerHTML = "I See You!!";
s.className = 'success';
var mapcanvas = document.createElement('div'),
mapcanvas.id = 'mapcanvas',
w = window.innerWidth - 100,
h = '360px',
mapcanvas.style.height = h,
mapcanvas.style.width = w,
mapcanvas.style.marginLeft = 'auto',
document.querySelector('article').appendChild(mapcanvas);
var latlng = new google.maps.LatLng(position.coords.latitude, position.coords.longitude),
myOptions = {
zoom: 15,
center: latlng,
mapTypeControl: true,
navigationControlOptions: {
style: google.maps.NavigationControlStyle.SMALL
},
mapTypeId: google.maps.MapTypeId.HYBRID
};
map = new google.maps.Map(document.getElementById("mapcanvas"), myOptions),
marker = new google.maps.Marker({
position: latlng,
map: map,
title: "You are here @ " +
getDateTime() + " ( error margin: " +
position.coords.accuracy + " meters )"
});
};
function getDateTime() {
var now = new Date(),
year = now.getFullYear(),
month = (now.getMonth() + 1),
day = now.getDate(),
hour = now.getHours(),
minute = now.getMinutes(),
second = now.getSeconds();
if (month.toString().length == 1) {
var month = '0' + month;
}
if (day.toString().length == 1) {
var day = '0' + day;
}
if (hour.toString().length == 1) {
var hour = '0' + hour;
}
if (minute.toString().length == 1) {
var minute = '0' + minute;
}
if (second.toString().length == 1) {
var second = '0' + second;
}
var dateTime = month + '/' + day + '/' + year + ' ' + hour + ':' + minute + ':' + second;
return dateTime;
};
function error(msg) {
var s = document.querySelector('#status');
s.innerHTML = typeof msg == 'string' ? msg : "failed";
s.className = 'fail';
};
var opts = { enableHighAccuracy: true }, wtch = "";
if (navigator.geolocation) {
navigator.geolocation.getCurrentPosition(success, error);
wtch = navigator.geolocation.watchPosition(success2, error, opts)
}
else {
error('not supported');
}
window.onbeforeunload(function(e) {
navigator.geolocation.clearWatch(wtch);
});
</script>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment