Home | History | Annotate | Download | only in elements 
      1 // Copyright 2014 The Chromium Authors. All rights reserved.
      2 // Use of this source code is governed by a BSD-style license that can be
      3 // found in the LICENSE file.
      4 
      5 Polymer('kb-key', {
      6   /**
      7    * The background image to display on this key. Does not display an
      8    * image if this is the empty string.
      9    * @type {string}
     10    */
     11   image: "",
     12 
     13   /**
     14    * The background image size to use if an image is specified. The size
     15    * is provided as a string, for example, "50%".
     16    * @type {string}
     17    */
     18   imageSize: "",
     19 
     20   /**
     21    * Key codes have been deprecated in DOM3 key events, but are required
     22    * for legacy web content. The key codes depend on the position of the
     23    * key on the keyboard and is independent of which modifier keys (shift,
     24    *  alt, ...) are active.
     25    * @type {number|undefined}
     26    */
     27   keyCode: undefined,
     28 
     29   /**
     30    * Name of the key as defined in the DOM3 specification for key events.
     31    * Like the keyCode, the keyName is independent of the state of the
     32    * modifier keys.
     33    * @type {string|undefined}
     34    */
     35   keyName: undefined,
     36 
     37   /**
     38    * Whether the shift key is pressed when producing the key value.
     39    * @type {boolean}
     40    */
     41   shiftModifier: false,
     42 
     43   /**
     44    * The sound to play when this key is pressed.
     45    * @type {Sound}
     46    */
     47   sound: Sound.DEFAULT,
     48 
     49   /**
     50    * Whether the key can be stretched to accomodate pixel rounding errors.
     51    */
     52   stretch: false,
     53 
     54   /**
     55    * Weighting to use for layout in order to properly size the key.
     56    * Keys with a high weighting are wider than normal keys.
     57    * @type {number}
     58    */
     59   weight: DEFAULT_KEY_WEIGHT,
     60 
     61   /**
     62    * Called when the image attribute changes. This is used to set the
     63    * background image of the key.
     64    * TODO(rsadam): Remove when polymer {{}} syntax regression is fixed.
     65    */
     66   imageChanged: function() {
     67     if (!this.image) {
     68       this.$.key.style.backgroundImage = "none";
     69     } else {
     70       // If no extension provided, default to svg.
     71       var image =
     72           this.image.split('.').length > 1 ? this.image : this.image + ".svg";
     73       this.$.key.style.backgroundImage =
     74           "url(images/" + image + ")";
     75     }
     76   },
     77 
     78   /**
     79    * Returns a subset of the key attributes.
     80    * @param {string} caller The id of the function that called
     81    *     populateDetails.
     82    * @return {Object} Mapping of attributes for the key element.
     83    */
     84   populateDetails: function(caller) {
     85     var details = this.super([caller]);
     86     details.keyCode = this.keyCode;
     87     details.keyName = this.keyName;
     88     details.shiftModifier = this.shiftModifier;
     89     details.sound = this.sound;
     90     return details;
     91   },
     92 });
     93 ;
     94 
     95 Polymer('kb-abc-key', {
     96   populateDetails: function(caller) {
     97     var detail = this.super([caller]);
     98     switch (caller) {
     99       case ('down'):
    100         detail.relegateToShift = true;
    101         break;
    102       default:
    103         break;
    104     }
    105     return detail;
    106   }
    107 });
    108 ;
    109 
    110 Polymer('kb-hide-keyboard-key', {
    111   up: function(event) {
    112     hideKeyboard();
    113   },
    114 });
    115