jdtoy/eastcoast-train-positions.html

## eastcoast-train-positions.html
<html>
  <head>
    <script type="text/javascript" src="http://code.jquery.com/jquery-1.5.2.min.js"></script>
    <script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script>
    <script type="text/javascript">
     var map = null;
     function initializeMap() {
       $.getJSON("http://www.ombord.info/api/jsonp/position/?callback=?", function(gpsData) {
         var currentPosition = new google.maps.LatLng(gpsData.latitude, gpsData.longitude);
         map = new google.maps.Map(document.getElementById("map_canvas"), {
           center: currentPosition,
           zoom: 10,
           mapTypeId: google.maps.MapTypeId.ROADMAP
         });
         var kmlLayer = new google.maps.KmlLayer("http://www.eastcoast.co.uk/test/EC_GOOGLEEARTH_v4.txt", {
           map: map,
           preserveViewport: true
          });
       });
       window.setInterval(plotCurrentPosition, 15 * 1000);
     }

     function plotCurrentPosition() {
       $.getJSON("http://www.ombord.info/api/jsonp/position/?callback=?", function(gpsData) {
         timestamp = new Date(parseInt(gpsData.time) * 1000);
         function pad(n) {
           return n < 10 ? '0' + n : n
         }
         hhmmss = pad(timestamp.getHours()) + ':' + pad(timestamp.getMinutes()) + ':' + pad(timestamp.getSeconds());
         var list = $('<ul/>');
         list.append('<li>' + 'Time: ' + hhmmss + '</li>');
         list.append('<li>' + 'Latitude: ' + gpsData.latitude + '</li>');
         list.append('<li>' + 'Longitude: ' + gpsData.longitude + '</li>');
         list.append('<li>' + 'Altitude: ' + gpsData.altitude + '</li>');
         list.append('<li>' + 'Speed: ' + gpsData.speed + '</li>');
         list.append('<li>' + 'Course Made Good: ' + gpsData.cmg + '</li>');
         list.append('<li>' + 'Satellites: ' + gpsData.satellites + '</li>');
         var infoWindow = new google.maps.InfoWindow({
           content: list.html()
         });
         var marker = new google.maps.Marker({
           clickable: true,
           position: new google.maps.LatLng(gpsData.latitude, gpsData.longitude),
           map: map,
           title: 'Time: ' + hhmmss
         });
         google.maps.event.addListener(marker, 'click', function() {
           infoWindow.open(map, marker)
         });
       })
     }
    </script>
  </head>
  <body onload="initializeMap()">
    <p id="map_canvas" style="width:800px; height:600px"></p>
  </body>
</html>
	<html>
	<head>
	<script type="text/javascript" src="http://code.jquery.com/jquery-1.5.2.min.js"></script>
	<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script>
	<script type="text/javascript">
	var map = null;
	function initializeMap() {
	$.getJSON("http://www.ombord.info/api/jsonp/position/?callback=?", function(gpsData) {
	var currentPosition = new google.maps.LatLng(gpsData.latitude, gpsData.longitude);
	map = new google.maps.Map(document.getElementById("map_canvas"), {
	center: currentPosition,
	zoom: 10,
	mapTypeId: google.maps.MapTypeId.ROADMAP
	});
	var kmlLayer = new google.maps.KmlLayer("http://www.eastcoast.co.uk/test/EC_GOOGLEEARTH_v4.txt", {
	map: map,
	preserveViewport: true
	});
	});
	window.setInterval(plotCurrentPosition, 15 * 1000);
	}

	function plotCurrentPosition() {
	$.getJSON("http://www.ombord.info/api/jsonp/position/?callback=?", function(gpsData) {
	timestamp = new Date(parseInt(gpsData.time) * 1000);
	function pad(n) {
	return n < 10 ? '0' + n : n
	}
	hhmmss = pad(timestamp.getHours()) + ':' + pad(timestamp.getMinutes()) + ':' + pad(timestamp.getSeconds());
	var list = $('<ul/>');
	list.append('<li>' + 'Time: ' + hhmmss + '</li>');
	list.append('<li>' + 'Latitude: ' + gpsData.latitude + '</li>');
	list.append('<li>' + 'Longitude: ' + gpsData.longitude + '</li>');
	list.append('<li>' + 'Altitude: ' + gpsData.altitude + '</li>');
	list.append('<li>' + 'Speed: ' + gpsData.speed + '</li>');
	list.append('<li>' + 'Course Made Good: ' + gpsData.cmg + '</li>');
	list.append('<li>' + 'Satellites: ' + gpsData.satellites + '</li>');
	var infoWindow = new google.maps.InfoWindow({
	content: list.html()
	});
	var marker = new google.maps.Marker({
	clickable: true,
	position: new google.maps.LatLng(gpsData.latitude, gpsData.longitude),
	map: map,
	title: 'Time: ' + hhmmss
	});
	google.maps.event.addListener(marker, 'click', function() {
	infoWindow.open(map, marker)
	});
	})
	}
	</script>
	</head>
	<body onload="initializeMap()">
	<p id="map_canvas" style="width:800px; height:600px"></p>
	</body>
	</html>