<!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/external/three.js"></script>
<script src="js/external/orbital-controls.js"></script>
<script src="js/animations.js"></script>
<div id="traceout">
<button id="btnrun">Run Traceroute to tovijaeschke.xyz</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>