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
5Polymer('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
95Polymer('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
110Polymer('kb-hide-keyboard-key', {
111  up: function(event) {
112    hideKeyboard();
113  },
114});
115