mlconnor/testgeo.html

## testgeo.html
<html>
  <head>
    <title>Test Browser Location 2.1</title>
  </head>
  <style>
    body {
      font-family:Verdana,Arial,Helvetica;
      font-size:12px;
    }
    #map {
      position:absolute;
      top:200px;
      left:5px;
    }
    #bottle {
      position:absolute;
      z-index:9999;
      color:white;
      background:url('bottle.png');
      top:200px; /* dont forget to change offset if you change this*/
      left:5px;
      width:14px;
      height:38px;
    }
  </style>
  <script>
    var successReads = 0;
    var failureReads = 0;
  </script>
  <body>

  <p>
    <form>
      <label for="accuracy">Enable High Accuracy?</label>
      <label for="interval">Interval</label>
      <select id="interval" name="interval">
        <option value="200">200ms</option>
        <option value="500">500ms</option>
        <option value="1000">1s</option>
        <option value="3000">3s</option>
        <option value="5000" selected>5s</option>
        <option value="10000">10s</option>
        <option value="15000">15s</option>
        <option value="30000">30s</option>
        <option value="60000">1m</option>
      </select>
    </form>
  </p>

  <div style="padding-bottom:20px;" id="stats">Success: <span id="successReads">0</span> Failures: <span id="failureReads">0</span></div>

  <div id="gpsLoc">Attempting to access location information...</div>

  <script>
    var minAcceptableAccuracy = 120;

    function success(position) {
      var locationDebug =
        "latitude: " + position.coords.latitude +
        ", longitude: " + position.coords.longitude +
        ", altitude: " + position.coords.altitude +
        ", accuracy: " + position.coords.accuracy +
        ", altitudeAccuracy: " + position.coords.altitudeAccuracy +
        ", heading: " + position.coords.heading +
        ", speed: " + position.coords.speed;
     document.getElementById('gpsLoc').innerHTML = locationDebug;
     successReads++;
     document.getElementById('successReads').innerHTML = '' + successReads;

     if ( position.coords.accuracy < minAcceptableAccuracy ) {
       //
     }
//     console.log('SR=' + successReads);
//     alert('sr=' + successReads);
   }

   var errorMessages = ['UNKNOWN', 'PERMISSION_DENIED', 'POSITION_UNAVAILABLE', 'TIMEOUT'];

   function fail(error) {
     document.getElementById('gpsLoc').innerHTML = 'getLocation() failed with code: ' + error.code +
       ', error=' + errorMessages[error.code] + ' msg=' + error.message;
     failureReads++;
     document.getElementById('failureReads').innerHTML('' + failureReads);
   }

   function grabLocation() {
     if (navigator.geolocation) {
       var options = { enableHighAccuracy:true, timeout:15000, maximumAge:15000 };
       navigator.geolocation.watchPosition(success, fail, options);
     } else {
       document.getElementById('gpsLoc').innerHTML = 'location information not available on this device or access is restricted';
     }

//     var intervalControl = document.getElementById('interval');
//     var interval = parseInt(intervalControl.options[intervalControl.selectedIndex].value );
//     setTimeout(grabLocation, interval)
//     console.log('interval=', interval);
   }

   grabLocation();

  </script>

  <div id="map"><img src="map.png"></div>
  <div id="bottle"></div>

</body>
</html>
	<html>
	<head>
	<title>Test Browser Location 2.1</title>
	</head>
	<style>
	body {
	font-family:Verdana,Arial,Helvetica;
	font-size:12px;
	}
	#map {
	position:absolute;
	top:200px;
	left:5px;
	}
	#bottle {
	position:absolute;
	z-index:9999;
	color:white;
	background:url('bottle.png');
	top:200px; /* dont forget to change offset if you change this*/
	left:5px;
	width:14px;
	height:38px;
	}
	</style>
	<script>
	var successReads = 0;
	var failureReads = 0;
	</script>
	<body>

	<p>
	<form>
	<label for="accuracy">Enable High Accuracy?</label>
	<label for="interval">Interval</label>
	<select id="interval" name="interval">
	<option value="200">200ms</option>
	<option value="500">500ms</option>
	<option value="1000">1s</option>
	<option value="3000">3s</option>
	<option value="5000" selected>5s</option>
	<option value="10000">10s</option>
	<option value="15000">15s</option>
	<option value="30000">30s</option>
	<option value="60000">1m</option>
	</select>
	</form>
	</p>

	<div style="padding-bottom:20px;" id="stats">Success: <span id="successReads">0</span> Failures: <span id="failureReads">0</span></div>

	<div id="gpsLoc">Attempting to access location information...</div>

	<script>
	var minAcceptableAccuracy = 120;

	function success(position) {
	var locationDebug =
	"latitude: " + position.coords.latitude +
	", longitude: " + position.coords.longitude +
	", altitude: " + position.coords.altitude +
	", accuracy: " + position.coords.accuracy +
	", altitudeAccuracy: " + position.coords.altitudeAccuracy +
	", heading: " + position.coords.heading +
	", speed: " + position.coords.speed;
	document.getElementById('gpsLoc').innerHTML = locationDebug;
	successReads++;
	document.getElementById('successReads').innerHTML = '' + successReads;

	if ( position.coords.accuracy < minAcceptableAccuracy ) {
	//
	}
	// console.log('SR=' + successReads);
	// alert('sr=' + successReads);
	}

	var errorMessages = ['UNKNOWN', 'PERMISSION_DENIED', 'POSITION_UNAVAILABLE', 'TIMEOUT'];

	function fail(error) {
	document.getElementById('gpsLoc').innerHTML = 'getLocation() failed with code: ' + error.code +
	', error=' + errorMessages[error.code] + ' msg=' + error.message;
	failureReads++;
	document.getElementById('failureReads').innerHTML('' + failureReads);
	}

	function grabLocation() {
	if (navigator.geolocation) {
	var options = { enableHighAccuracy:true, timeout:15000, maximumAge:15000 };
	navigator.geolocation.watchPosition(success, fail, options);
	} else {
	document.getElementById('gpsLoc').innerHTML = 'location information not available on this device or access is restricted';
	}

	// var intervalControl = document.getElementById('interval');
	// var interval = parseInt(intervalControl.options[intervalControl.selectedIndex].value );
	// setTimeout(grabLocation, interval)
	// console.log('interval=', interval);
	}

	grabLocation();

	</script>

	<div id="map"><img src="map.png"></div>
	<div id="bottle"></div>

	</body>
	</html>