feat(keyEvents): support for <div (keyup.enter)="callback()">

This commit adds a plugin for the event manager, to allow a key name to
be appended to the event name (for keyup and keydown events), so that
the callback is only called for that key.

Here are some examples:
 (keydown.shift.enter)
 (keyup.space)
 (keydown.control.shift.a)
 (keyup.f1)

Key names mostly follow the DOM Level 3 event key values:
http://www.w3.org/TR/DOM-Level-3-Events-key/#key-value-tables

There are some limitations to be worked on (cf details
in https://github.com/angular/angular/pull/1136) but for now, this
implementation is reliable for the following keys (by "reliable" I mean
compatible with Chrome and Firefox and not depending on the keyboard
layout):
- alt, control, shift, meta (those keys can be combined with other keys)
- tab, enter, backspace, pause, scrolllock, capslock, numlock
- insert, delete, home, end, pageup, pagedown
- arrowup, arrowdown, arrowleft, arrowright
- latin letters (a-z), function keys (f1-f12)
- numbers on the numeric keypad (but those keys are not correctly simulated
by Chromedriver)

There is a sample to play with in examples/src/key_events/.

close #523
close #1136

modules/angular2/src/dom/browser_adapter.dart

@@ -14,6 +14,87 @@ class _IdentitySanitizer implements NodeTreeSanitizer {
 
 final _identitySanitizer = new _IdentitySanitizer();
 
+final _keyCodeToKeyMap = const {
+  8: 'Backspace',
+  9: 'Tab',
+  12: 'Clear',
+  13: 'Enter',
+  16: 'Shift',
+  17: 'Control',
+  18: 'Alt',
+  19: 'Pause',
+  20: 'CapsLock',
+  27: 'Escape',
+  32: ' ',
+  33: 'PageUp',
+  34: 'PageDown',
+  35: 'End',
+  36: 'Home',
+  37: 'ArrowLeft',
+  38: 'ArrowUp',
+  39: 'ArrowRight',
+  40: 'ArrowDown',
+  45: 'Insert',
+  46: 'Delete',
+  65: 'a',
+  66: 'b',
+  67: 'c',
+  68: 'd',
+  69: 'e',
+  70: 'f',
+  71: 'g',
+  72: 'h',
+  73: 'i',
+  74: 'j',
+  75: 'k',
+  76: 'l',
+  77: 'm',
+  78: 'n',
+  79: 'o',
+  80: 'p',
+  81: 'q',
+  82: 'r',
+  83: 's',
+  84: 't',
+  85: 'u',
+  86: 'v',
+  87: 'w',
+  88: 'x',
+  89: 'y',
+  90: 'z',
+  91: 'OS',
+  93: 'ContextMenu',
+  96: '0',
+  97: '1',
+  98: '2',
+  99: '3',
+  100: '4',
+  101: '5',
+  102: '6',
+  103: '7',
+  104: '8',
+  105: '9',
+  106: '*',
+  107: '+',
+  109: '-',
+  110: '.',
+  111: '/',
+  112: 'F1',
+  113: 'F2',
+  114: 'F3',
+  115: 'F4',
+  116: 'F5',
+  117: 'F6',
+  118: 'F7',
+  119: 'F8',
+  120: 'F9',
+  121: 'F10',
+  122: 'F11',
+  123: 'F12',
+  144: 'NumLock',
+  145: 'ScrollLock'
+};
+
 class BrowserDomAdapter extends GenericBrowserDomAdapter {
   static void makeCurrent() {
     setRootDomAdapter(new BrowserDomAdapter());
@@ -203,4 +284,8 @@ class BrowserDomAdapter extends GenericBrowserDomAdapter {
   String getHref(AnchorElement element) {
     return element.href;
   }
+  String getEventKey(KeyboardEvent event) {
+    int keyCode = event.keyCode;
+    return _keyCodeToKeyMap.containsKey(keyCode) ? _keyCodeToKeyMap[keyCode] : 'Unidentified';
+  }
 }

modules/angular2/src/dom/browser_adapter.es6

@@ -1,5 +1,5 @@
 import {List, MapWrapper, ListWrapper} from 'angular2/src/facade/collection';
-import {isPresent} from 'angular2/src/facade/lang';
+import {isBlank, isPresent} from 'angular2/src/facade/lang';
 import {setRootDomAdapter} from './dom_adapter';
 import {GenericBrowserDomAdapter} from './generic_browser_adapter';
 
@@ -9,6 +9,49 @@ var _attrToPropMap = {
   'tabindex': 'tabIndex'
 };
 
+const DOM_KEY_LOCATION_NUMPAD = 3;
+
+// Map to convert some key or keyIdentifier values to what will be returned by getEventKey
+var _keyMap = {
+  // The following values are here for cross-browser compatibility and to match the W3C standard
+  // cf http://www.w3.org/TR/DOM-Level-3-Events-key/
+  '\b': 'Backspace',
+  '\t': 'Tab',
+  '\x7F': 'Delete',
+  '\x1B': 'Escape',
+  'Del': 'Delete',
+  'Esc': 'Escape',
+  'Left': 'ArrowLeft',
+  'Right': 'ArrowRight',
+  'Up': 'ArrowUp',
+  'Down':'ArrowDown',
+  'Menu': 'ContextMenu',
+  'Scroll' : 'ScrollLock',
+  'Win': 'OS'
+};
+
+// There is a bug in Chrome for numeric keypad keys:
+// https://code.google.com/p/chromium/issues/detail?id=155654
+// 1, 2, 3 ... are reported as A, B, C ...
+var _chromeNumKeyPadMap = {
+  'A': '1',
+  'B': '2',
+  'C': '3',
+  'D': '4',
+  'E': '5',
+  'F': '6',
+  'G': '7',
+  'H': '8',
+  'I': '9',
+  'J': '*',
+  'K': '+',
+  'M': '-',
+  'N': '.',
+  'O': '/',
+  '\x60': '0',
+  '\x90': 'NumLock'
+};
+
 export class BrowserDomAdapter extends GenericBrowserDomAdapter {
   static makeCurrent() {
     setRootDomAdapter(new BrowserDomAdapter());
@@ -286,4 +329,28 @@ export class BrowserDomAdapter extends GenericBrowserDomAdapter {
   getHref(el:Element): string {
     return el.href;
   }
+  getEventKey(event): string {
+    var key = event.key;
+    if (isBlank(key)) {
+      key = event.keyIdentifier;
+      // keyIdentifier is defined in the old draft of DOM Level 3 Events implemented by Chrome and Safari
+      // cf http://www.w3.org/TR/2007/WD-DOM-Level-3-Events-20071221/events.html#Events-KeyboardEvents-Interfaces
+      if (isBlank(key)) {
+        return 'Unidentified';
+      }
+      if (key.startsWith('U+')) {
+        key = String.fromCharCode(parseInt(key.substring(2), 16));
+        if (event.location === DOM_KEY_LOCATION_NUMPAD && _chromeNumKeyPadMap.hasOwnProperty(key)) {
+          // There is a bug in Chrome for numeric keypad keys:
+          // https://code.google.com/p/chromium/issues/detail?id=155654
+          // 1, 2, 3 ... are reported as A, B, C ...
+          key = _chromeNumKeyPadMap[key];
+        }
+      }
+    }
+    if (_keyMap.hasOwnProperty(key)) {
+      key = _keyMap[key];
+    }
+    return key;
+  }
 }

modules/angular2/src/dom/dom_adapter.js

@@ -258,6 +258,9 @@ export class DomAdapter {
   getHref(element): string {
     throw _abstract();
   }
+  getEventKey(event): string {
+    throw _abstract();
+  }
   resolveAndSetHref(element, baseUrl:string, href:string) {
     throw _abstract();
   }