Jason S avatar Jason S committed 5e9595d

added space bar controls for pausing

Comments (0)

Files changed (2)

demos/gravity1/gravity1.html

     window.gravity1 = gravity1;
     var fps = 20;
     var state = {tick: 0, t: 0, tsim: 0, derivCalcRate: 100};
-    var keymap = {37: 'left', 38: 'up', 39: 'right', 40: 'down', 73: 'e+', 74:'E-', 75:'e-', 76:'E+', 107:'+', 109:'-'};
-    var keystate = {'up':false, 'down':false, 'left':false, 'right':false, 'e+':false, 'e-': false, 'E+':false, 'E-':false, 'shift':false, 'alt':false, 'ctrl':false, '+':false, '-':false};
+    var keymap = {37: 'left', 38: 'up', 39: 'right', 40: 'down', 73: 'e+', 74:'E-', 75:'e-', 76:'E+', 107:'+', 109:'-', 32:' '};
+    var keystate = {'up':false, 'down':false, 'left':false, 'right':false, 'e+':false, 'e-': false, 'E+':false, 'E-':false, 'shift':false, 'alt':false, 'ctrl':false, '+':false, '-':false, ' ':false};
     var keypress = {};
     function modkey(event,isdown)
     {
             //console.log(keycode, isdown);
             return false;
         }
-    }    
-    document.addEventListener('keydown',function(event) { 
-        if (modkey(event, true)) { event.preventDefault(true); return false;} });
-    document.addEventListener('keyup',function(event) { 
-        if (modkey(event, false)) {  event.preventDefault(true); return false;} });
+    }   
+    var canvasFrame = document.getElementById('canvas-frame'); 
+    canvasFrame.addEventListener('keydown',function(event) { 
+        if (modkey(event, true)) { 
+            event.preventDefault(); 
+            return false;
+        }
+    }, true);
+    canvasFrame.addEventListener('keyup',function(event) { 
+        if (modkey(event, false)) {  
+            event.preventDefault(); 
+            return false;
+        }
+    }, true);
     function settextvalue(id,value)
     {
         var s = isNaN(value) ? '---' : (''+value.toFixed(8)); 
     {
         return state.derivCalcRate/gravity1.solvers[gravity1.solvername].n;
     }
-    var paused = false;
 
+    var pausebox = $("#pausebox");
     setInterval(function() {
-        if (!paused)
+        pausebox.prop('checked', gravity1.paused);
+        if (!gravity1.paused)
         {
             ++state.tick;
             state.t += 1.0/fps;
         $("#rateDisplay").html(state.derivCalcRate+" → "+rateChoice);
     }
     });
-    $("#pausebox").change(function() { paused = this.checked; });
+    $("#pausebox").change(function() { gravity1.paused = this.checked; });
 }
 </script>
 </head>
 <body>
     <div>
-    <canvas id="gravity1-canvas" height="480" width="640" />
+    <span id='canvas-frame' tabindex='1'>
+       <canvas id="gravity1-canvas" height="480" width="640" />
+    </span>
     </div>
     <div id='statistics'>
         <table>
             </div>
         </form>
     </div>
+    <hr />
+    <div>
+    <p>This is a Kepler orbit simulator, showing the dynamics of a satellite around a planet or star, using a number of different solvers for differential equations. You can change the solver type used by clicking the radio buttons, and the calculation rate by changing the slider.</p>
+    <p>The differences between these solver types are described in detail in an article I wrote on the <a href="http://www.embeddedrelated.com/showarticle/474.php">embeddedrelated.com</a> website.</p>
+    <p>You can zoom in/out using the +/- keys, and alter the orbit with thrusters using the arrow keys. Arrow keys by themselves produce thrust relative to the satellite's trajectory; if you press SHIFT while using the arrow keys, it produces thrust relative to a circular orbit; if you press ALT (or OPTION on a Mac) while using the arrow keys, it produces thrust relative to the screen coordinates. (Before using any of the key controls, you need to place keyboard focus on the drawing above by clicking on it first.)</p>
+    <p>Have fun!</p>
+    <p>&mdash;Jason Sachs</p>
+    </div>
 </body>
 </html>

demos/gravity1/gravity1.js

 function Gravity1Simulation()
 {
+    this.paused = false;
+    
     this.mu = 0.5;  // M * G
     this.minR = 0.09;
     this.velpos = [0.4,-0.4,0.66,0.66];
     },
     updateControls: function(keystate, keypress)
     {
+        if (keypress[' '])
+            this.paused = !this.paused;
         newScale = this.drawScale;
         if (keypress['-'])
             ++newScale;
Tip: Filter by directory path e.g. /media app.js to search for public/media/app.js.
Tip: Use camelCasing e.g. ProjME to search for ProjectModifiedEvent.java.
Tip: Filter by extension type e.g. /repo .js to search for all .js files in the /repo directory.
Tip: Separate your search with spaces e.g. /ssh pom.xml to search for src/ssh/pom.xml.
Tip: Use ↑ and ↓ arrow keys to navigate and return to view the file.
Tip: You can also navigate files with Ctrl+j (next) and Ctrl+k (previous) and view the file with Ctrl+o.
Tip: You can also navigate files with Alt+j (next) and Alt+k (previous) and view the file with Alt+o.