| <!DOCTYPE html> | |
| <html> | |
| 	<head> | |
| 		<style> | |
| 			body { | |
| 				background-color: black; | |
| 			} | |
| 			#globe, #traceout { | |
| 				display: inline-block; | |
| 				vertical-align: top; | |
| 			} | |
| 			#cmdout { | |
| 				color: white; | |
| 			} | |
| 		</style> | |
| 	</head> | |
| 	<body> | |
| 		<!--<?php include "php/traceroute.php" ?>--> | |
| 
 | |
| 		<div id="globe"> | |
| 			<!-- This is where our renderer will attach the scene --> | |
| 			<canvas></canvas> | |
| 		</div> | |
| 
 | |
| 		<script src="js/points.js"></script> | |
| 		<script src="js/tracepoints.js"></script> | |
| 		<script src="js/external/three.js"></script> | |
| 		<script src="js/external/orbital-controls.js"></script> | |
| 		<script src="js/animations.js"></script> | |
| 
 | |
| 		<div id="traceout"> | |
| 		<h2>Traceroute from Adelaide, SA to google.com</h2> | |
| 			<!-- | |
| 			<button id="btnrun">Run Traceroute to google.com</button> | |
| 			<p id="cmdout"></p> | |
| 			--> | |
| 		</div> | |
| 		<!-- | |
| 		<script> | |
| 			init(); | |
|  | |
|  | |
| 			var runTraceroute = function() {  | |
| 				var rawout = '<?php traceroute(); raw_output() ?>';  | |
| 				var tracepoints = '<?php json_output(); ?>'; | |
| 				document.getElementById('cmdout').innerHTML += rawout; | |
| 				init.addTracePoints(JSON.parse(tracepoints)); | |
| 				document.getElementById("btnrun").style.display = "none"; | |
| 			}; | |
| 			document.getElementById ("btnrun").addEventListener ("click", runTraceroute, false); | |
|  | |
| 		</script> | |
| 		--> | |
| 
 | |
| 	</body> | |
| </html>
 |