gamepad control

svn path=/trunk/; revision=204

diff --git a/static/stereoview.js b/static/stereoview.js
index 6e3f5b06b44ec1fc1417e24bc8ae63929bd63279..dd9b4e3a6818a3b11624f6dbcc082aa58606b0c9 100644 (file)
--- a/static/stereoview.js
+++ b/static/stereoview.js
@@ -16,12 +16,13 @@
     along with Serve0  If not, see <http://www.gnu.org/licenses/>. 
 */
 
-var render, video;
+var render, video, controlTimeout = 0;
 var pitch = 0, roll = 0, yaw = 0;
 var w, h, hdeg, vdeg, scale, fov = 90;
 var lv = document.createElement("canvas");
 var rv = document.createElement("canvas");
 var debug = document.createElement("p");
+var gp;
 
 function draw() {
   sw = fov * hdeg |0;
@@ -52,13 +53,27 @@ function draw() {
   rv.style.transform = "rotate(" + roll + "deg)";
 
   requestAnimationFrame(draw);
+
+  gp = navigator.getGamepads()[0];
+  if ( gp && Date.now() > controlTimeout ) {
+    if ( gp.axes[0] >  .3) { video.currentTime += 10; controlTimeout = Date.now() + 500; }
+    if ( gp.axes[0] < -.3) { video.currentTime -= 10; controlTimeout = Date.now() + 500; }
+    if ( gp.axes[1] < -.3) { video.currentTime += 60; controlTimeout = Date.now() + 500; }
+    if ( gp.axes[1] >  .3) { video.currentTime -= 60; controlTimeout = Date.now() + 500; }
+    if ( gp.buttons[0].pressed ) { video.currentTime += 1/30; video.pause(); }
+    if ( gp.buttons[1].pressed ) { video.play(); }
+    if ( gp.buttons[2].pressed ) { fov -= 10; controlTimeout = Date.now() + 500; }
+    if ( gp.buttons[3].pressed ) { fov += 10; controlTimeout = Date.now() + 500; }
+  }
+
+  // debug.textContent = "" + video.currentTime + " " + controlTimeout;
 };
 
 function stereoview(layout, video) {
   this.layout = layout; this.video = video;
   document.body.appendChild( lv );
   document.body.appendChild( rv );
-  // document.body.appendChild( debug );
+  document.body.appendChild( debug );
   
   lv.setAttribute( "style", "position: fixed; top: 0; left:  0 ; width: 50%; height: 100%; z-index: 100;");
   rv.setAttribute( "style", "position: fixed; top: 0; left: 50%; width: 50%; height: 100%; z-index: 100;");
@@ -89,7 +104,7 @@ function stereoview(layout, video) {
       roll  = - Math.asin((ty / 9.81 > 1)?1:(ty/9.81)) / Math.PI * 180;
       yaw   = (yaw + ty) % 360;
     };
-  })(), true);
+  })());
 
   window.addEventListener("click", function(event) {
     (lv.parentElement)?lv.parentElement.removeChild(lv):{};