<html>
<head>
<title>
Calculate Mileage
</title>
<STYLE TYPE="text/css">
INPUT{font-size:20px;}
BODY{font-size:20px;}
</STYLE>
</head>
<body>
<script>
function getLocation(type) {
document.getElementById("type").value = "submit"
var myTime = new Date()
document.getElementById("puttime").value = getSIDate(myTime)
if (navigator.geolocation) {
navigator.geolocation.getCurrentPosition(showPosition);
} else {
document.getElementById("alocation").value = "Lost!"
}
}
function showPosition(pos) {
document.getElementById("alocation").value = pos.coords.latitude + "," + pos.coords.longitude
setTimeout(function() {document.getElementById("theform").submit();}, 500);
}
function submitIt() {
document.getElementById("type").value = "display"
document.getElementById("theform").submit()
}
function getSIDate(t) {
var year = t.getFullYear()
var month = t.getMonth() + 1
if (month < 10) {month = "0" + month}
var day = t.getDate()
if (day < 10) {day = "0" + day}
var hour = t.getHours()
if (hour < 10) {hour = "0" + hour}
var min = t.getMinutes()
if (min < 10) {min = "0" + min}
utcDiff = t.getTimezoneOffset() / 60 * -1
return year + "-" + month + "-" + day + " " + hour + ":" + min + " UTC" + utcDiff
}
</script>
<h1>Calculate Gas Mileage</h1>
<form id="theform" action="mileage1.php" method="post">
Vehicle: <select name="cars" id="cars" style="font-size:1.2em;">
<option value="pathfinder">Pathfinder</option>
<option value="prius">Prius</option>
</select><br>
Litres: <input type="number" name="litres"> prefix with - if US Gallons.<br><br>
Odometer: <input type="number" name="odo"><br><br>
Cost/L: <input type="number" name="cost"> or gallon if Litres is negative.
<input type="hidden" id="alocation" name="location">
<input type="hidden" id="type" name="type">
<input type="hidden" id="puttime" name="time">
<br><br>
<input type="button" value="submit" onclick="getLocation()" style="font-size:1.2em;">
<input type="button" value="display" onclick="submitIt()" style="font-size:1.2em;" >
</form>
</body>
</html>