Merge branch 'bug32', remote branch 'mike/32-keycode' into bug32

demos/acorn/acorn.js

@@ -26,6 +26,10 @@ function mouseReleased(){
   buttonDown = false;
 }
 
+function keyDown(){
+  alert(key);
+}
+
 function render() {
 
   var deltaX = ps.mouseX - curCoords[0];
@@ -69,6 +73,7 @@ function start(){
   ps.onMouseScroll = zoom;
   ps.onMousePressed = mousePressed;
   ps.onMouseReleased = mouseReleased;
+  ps.keyDown = keyDown;
 
   ps.loadFile({path:"acorn.asc", autoCenter: true});
 }

psapi.js

@@ -21,7 +21,7 @@ function PointStream(){
   var attn = [0.01, 0.0, 0.003];
 
   // browser detection to handle differences such as mouse scrolling
-  var browser     = -1 ;
+  var browser     = -1;
   const MINEFIELD = 0;
   const CHROME    = 1;
   const CHROMIUM  = 2;
@@ -49,6 +49,26 @@ function PointStream(){
   var normalTransform;
 
   var progObj;
+
+  // Both key and keyCode will be equal to these values
+  const _BACKSPACE = 8;
+  const _TAB       = 9;
+  const _ENTER     = 10;
+  const _RETURN    = 13;
+  const _ESC       = 27;
+  const _DELETE    = 127;
+  const _CODED     = 0xffff;
+
+  // p.key will be CODED and p.keyCode will be this value
+  const _SHIFT     = 16;
+  const _CONTROL   = 17;
+  const _ALT       = 18;
+  const _UP        = 38;
+  const _RIGHT     = 39;
+  const _DOWN      = 40;
+  const _LEFT      = 37;
+
+  var codedKeys = [_SHIFT, _CONTROL, _ALT, _UP, _RIGHT, _DOWN, _LEFT];
 
   // Vertex shader for boxes and spheres
   var vertexShaderSource =
@@ -348,6 +368,96 @@ function PointStream(){
     return programObject;
   };
 
+  /**
+    Used by keyboard event handlers
+  */
+  function keyCodeMap(code, shift) {
+    // Letters
+    if (code >= 65 && code <= 90) { // A-Z
+      // Keys return ASCII for upcased letters.
+      // Convert to downcase if shiftKey is not pressed.
+      if (shift) {
+        return code;
+      }
+      else {
+        return code + 32;
+      }
+    }
+    // Numbers and their shift-symbols
+    else if (code >= 48 && code <= 57) { // 0-9
+      if (shift) {
+        switch (code) {
+        case 49:
+          return 33; // !
+        case 50:
+          return 64; // @
+        case 51:
+          return 35; // #
+        case 52:
+          return 36; // $
+        case 53:
+          return 37; // %
+        case 54:
+          return 94; // ^
+        case 55:
+          return 38; // &
+        case 56:
+          return 42; // *
+        case 57:
+          return 40; // (
+        case 48:
+          return 41; // )
+        }
+      }
+    }
+    // Symbols and their shift-symbols
+    else {
+      if (shift) {
+        switch (code) {
+        case 107:
+          return 43; // +
+        case 219:
+          return 123; // {
+        case 221:
+          return 125; // }
+        case 222:
+          return 34; // "
+        }
+      } else {
+        switch (code) {
+        case 188:
+          return 44; // ,
+        case 109:
+          return 45; // -
+        case 190:
+          return 46; // .
+        case 191:
+          return 47; // /
+        case 192:
+          return 96; // ~
+        case 219:
+          return 91; // [
+        case 220:
+          return 92; // \
+        case 221:
+          return 93; // ]
+        case 222:
+          return 39; // '
+        }
+      }
+    }
+    return code;
+  };
+
+  var keyFunc = function (evt, type){
+    if (evt.charCode){
+      key = keyCodeMap(evt.charCode, evt.shiftKey);
+    } else {
+      key = keyCodeMap(evt.keyCode, evt.shiftKey);
+    }
+    type();
+  }
+
   /**
   */
   var xb = {
@@ -356,6 +466,8 @@ function PointStream(){
     */
     mouseX: 0,
     mouseY: 0,
+    keyCode: null,
+    key: null,
 
     // Number of frames per seconds rendered in the last second.
     frameRate: 0,
@@ -530,6 +642,8 @@ function PointStream(){
       //
       if(element.addEventListener){
         element.addEventListener(type, func, false);
+      } else {
+        element.attachEvent("on" + type, fn);
       }
     },
 
@@ -551,7 +665,7 @@ function PointStream(){
         delta = -evt.wheelDelta / 360;
       }
 
-      if(xb.onMouseScroll){
+      if(typeof xb.onMouseScroll === "function"){
         xb.onMouseScroll(delta);
       }
     },
@@ -560,7 +674,7 @@ function PointStream(){
       @private
     */
     _mousePressed: function(evt){
-      if(xb.onMousePressed){
+      if(typeof xb.onMousePressed === "function"){
         xb.onMousePressed();
       }
     },
@@ -569,11 +683,29 @@ function PointStream(){
       @private
     */    
     _mouseReleased: function(){
-      if(xb.onMouseReleased){
+      if(typeof xb.onMouseReleased === "function"){
         xb.onMouseReleased();
       }
     },
 
+    _keyDown: function(evt){
+      if(typeof xb.keyDown === "function"){
+        keyFunc(evt, xb.keyDown);
+      }
+    },
+
+    _keyPressed: function(evt){
+      if(typeof xb.keyPressed === "function"){
+        keyFunc(evt, xb.keyPressed);
+      }
+    },
+
+    _keyUp: function(evt){
+      if(typeof xb.keyUp === "function"){
+        keyFunc(evt, xb.keyUp);
+      }
+    },
+
     /**
       cvs
       renderCB
@@ -595,6 +727,9 @@ function PointStream(){
       xb.attach(cvs, "mousemove", xb.mouseMove);      
       xb.attach(cvs, "DOMMouseScroll", xb._mouseScroll);
       xb.attach(cvs, "mousewheel", xb._mouseScroll);
+      xb.attach(document, "keydown", xb._keyDown);
+      xb.attach(document, "keypress", xb._keyPressed);
+      xb.attach(document, "keyup", xb._keyUp);
     },
 
     /**