<script> var currentTime = (new Date()).getTime(); //This line SHOULD be the actual code when the site is online //var currentTime = 1541408502000; //This line is a temporary line for debug purposes var time = currentTime; var interval; var intervalTime = 20; var si = 1; //si stands for 'Speed Index' var speed = 1; // var speeds = [0,1, 30, 60, 300, 900, 1800, 3600, 21600, 43200, 86400]; var speeds = [0,1, 30, 60, 300, 900, 1800, 3600, 21600, 64800, 86400]; var speedsT = ["paused","1 sec/sec", "30 sec/sec", "1 min/sec", "5 min/sec", "15 min/sec", "30 min/sec", "1 hour/sec", "6 hours/sec", "12 hours/sec", "1 day/sec"] var pause = true; var loading = 0; let launchingTime, landingTime; if (Detector.webgl) { var visualizer = new SpaceI.Visualize(document.getElementById('image'), currentTime); //This objects handles everything related to the 3D environment directly. See Space.js for more details. $(document).ready(function () { $.ajax({ type: "GET", url: "data/man.txt", dataType: "text", success: function (data) { visualizer.addMan(data); loadMore(); } }); $.ajax({ type: "GET", url: "data/data_m.txt", dataType: "text", success: function (data) { visualizer.addRouteM(data); loadMore();} }); $.ajax({ type: "GET", url: "data/data_s1.txt", dataType: "text", success: function (data) { visualizer.addRoute(data, 0); loadMore(); } }); $.ajax({ type: "GET", url: "data/data_s2.txt", dataType: "text", success: function (data) { visualizer.addRoute(data, 1); loadMore(); } }); }); animate(); } else { document.getElementById("load").innerHTML = "Unfortunately your browser doesn't seem to support WebGL."; document.getElementById("orbitviewer").style.height = "0px"; } function loadMore() { //this function removes the loading screen and starts the simulation only when all the important files have been loaded. loading++; //4 out of 5 calls for this function are a few lines above this one (in the ajax), the 5th is called after the WebGL scene has been established (see Space.js) $('#loadingStatus').html(`RECEIVING DATA ─ ${loading}/5`); if (loading == 5) { $('#load').hide(); setSpeed(); visualizer.cameraSetup(currentTime); pause = false; document.dispatchEvent(new Event('loadingFinished')); } } function animate() { requestAnimationFrame(animate); visualizer.render(); visualizer.onWindowResize(); //it's important that this function is called whenever the window dimensions change. } function realTime() { time = (new Date()).getTime(); //This line will be used when the site is actually online // time = currentTime; // time = landingTime; si = 1; setSpeed(); visualizer.setTime(time); visualizer.cameraSetup(time); } function changeSpeed() { var s = document.getElementById("speed").value; si = s - 0; //converts string to int speed = Math.sign(speed) * speeds[si]; $("#speedT").text(speedsT[si]); } function setupLine(t, n) { //called from the visualizer object to set the beginning and end of the timeline if(n==0) { launchingTime = t; $('#line').attr('min', t); } else if (n == 1) { landingTime = t; $('#line').attr('max', t); } } function setSpeed() { speed = Math.sign(si) * speeds[Math.abs(si)]; //if 'si' is negative just take the negative speed. $("#speedT").text(((si < 0) ? "-" : "") + speedsT[Math.abs(si)]); } function timeC() { var t = document.getElementById("line").value; time = t - 0; //Converts string to number. If it's stupid and it works it ain't stupid. update(); } </script>
<div id="live_data_title">Live Data: </div> <table class="more_info_container"> <tbody> <tr> <td id="time_since_launch_label">Time since launch:</td><td id="time_since_launch_number">-</td></tr> <tr> <td id="distance_moon_label">Distance to the Moon:</td><td id="distance_moon_number">-</td></tr> <tr> <td id="altitude_label">Current altitude:</td><td id="altitude_number">-</td></tr> <tr> <td id="current_velocity_label">Current velocity:</td><td id="current_velocity_number">-</td></tr> </tbody> </table>
Source: https://habr.com/ru/post/441598/
All Articles