Switch from text insertion to key press and release events on the virtual k…

ui/keyboard/resources/elements/kb-key.html

 <!--
   -- Copyright 2013 The Chromium Authors. All rights reserved.
   -- Use of this source code is governed by a BSD-style license that can be
   -- found in the LICENSE file.
   -->
 
 <polymer-element name="kb-key" extends="kb-key-base"
     attributes="keyCode shiftModifier weight">
   <template>
     <style>
@@ skipping 21 matching lines @@
       /**
        * Whether the shift key is pressed when producing the key value.
        * @type {boolean}
        */
       shiftModifier: false,
       /**
        * Weighting to use for layout in order to properly size the key.
        * Keys with a high weighting are wider than normal keys.
        * @type {number}
        */
-      weight: 1
+      weight: 1,
+
+      /**
+       * Returns a subset of the key attributes.
+       * @return {Object} Mapping of attributes for the key element.
+       */
+      PopulateDetails: function() {
+        var details = this.super();
+        details.keyCode = this.keyCode;
+        details.shiftModifier = this.shiftModifier;
+        return details;
+      },
     });
   </script>
 </polymer-element>
 
 <!-- Special keys -->
 
 <polymer-element name="kb-shift-key" class="shift dark" char="Shift"
     extends="kb-key">
   <script>
     Polymer('kb-shift-key', {
       down: function(event) {
         this.super();
         var detail = {};
         if (this.keysetRules && this.keysetRules.dbl != undefined) {
           detail.char = this.char || this.textContent;
           detail.toKeyset = this.keysetRules.dbl[TO_KEYSET - OFFSET];
           detail.nextKeyset = this.keysetRules.dbl[NEXT_KEYSET - OFFSET];
         }
         this.fire('enable-dbl', detail);
         this.fire('enable-sel');
-      }
+      },
     });
   </script>
 </polymer-element>
 
 <!--
   -- TODO(kevers): Display popup menu for selecting layout on keypress. Display
   -- code for keyboard layout in place of image.
   -->
 <polymer-element name="kb-layout-selector" class="layout-selector dark" char="Invalid"
     extends="kb-key">
   <script>
     Polymer('kb-layout-selector', {
       toLayout: 'qwerty'
     });
   </script>
 </polymer-element>