| OLD | NEW |
| (Empty) |
| 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-keyset', { | |
| 6 align: "center", | |
| 7 // Propagate flick gestures to keys in this keyset. | |
| 8 flick: true, | |
| 9 isDefault: false, | |
| 10 nextKeyset: undefined, | |
| 11 // Weight offsets for positioning the keyset. | |
| 12 weightBottom: 15, | |
| 13 weightLeft: 10, | |
| 14 weightRight: 10, | |
| 15 weightTop: 6, | |
| 16 | |
| 17 /** | |
| 18 * Weight assigned to space between keys, of the form "xPitch yPitch". | |
| 19 * Defaults to xPitch = yPitch if it's only a single number. | |
| 20 * @type {string} | |
| 21 */ | |
| 22 pitch: "10", | |
| 23 | |
| 24 /** | |
| 25 * Expands kb-key-sequences into individual keys. | |
| 26 */ | |
| 27 flattenKeyset: function() { | |
| 28 var keySequences = this.querySelectorAll('kb-key-sequence'); | |
| 29 if (keySequences.length != 0) { | |
| 30 keySequences.array().forEach(function(element) { | |
| 31 var generatedDom = element.generateDom(); | |
| 32 element.parentNode.replaceChild(generatedDom, element); | |
| 33 }); | |
| 34 } | |
| 35 }, | |
| 36 | |
| 37 // TODO(bshe): support select keyset on down, long and dbl events. | |
| 38 keyUp: function(event, detail) { | |
| 39 switch (detail.char) { | |
| 40 case 'Shift': | |
| 41 case 'Alt': | |
| 42 case 'Ctrl': | |
| 43 case 'Invalid': | |
| 44 return; | |
| 45 default: | |
| 46 break; | |
| 47 } | |
| 48 if (!detail.toKeyset) | |
| 49 detail.toKeyset = this.nextKeyset; | |
| 50 }, | |
| 51 keyLongpress: function(event, detail) { | |
| 52 if (!detail.char) | |
| 53 return; | |
| 54 | |
| 55 var altkeyContainer = this.$.altkeyContainer.getDistributedNodes()[0]; | |
| 56 if (!altkeyContainer) | |
| 57 return; | |
| 58 | |
| 59 var altkeyMetadata = this.$.altkeyMetadata; | |
| 60 var altkeys = altkeyMetadata.getAltkeys(detail.char, | |
| 61 !!detail.hintText); | |
| 62 if (!altkeys) | |
| 63 return; | |
| 64 | |
| 65 var id = altkeys.id; | |
| 66 var activeAltKeySet = altkeyContainer.querySelector('#' + id); | |
| 67 if (!activeAltKeySet) { | |
| 68 var keyWidth = event.target.clientWidth; | |
| 69 var leftMargin = event.target.offsetLeft; | |
| 70 var maxLeftOffset = Math.round(leftMargin / keyWidth); | |
| 71 var rightMargin = this.clientWidth - leftMargin - keyWidth; | |
| 72 var maxRightOffset = Math.round(rightMargin / keyWidth); | |
| 73 activeAltKeySet = altkeyMetadata.createAltkeySet(detail.char, | |
| 74 maxLeftOffset, | |
| 75 maxRightOffset, | |
| 76 detail.hintText); | |
| 77 altkeyContainer.appendChild(activeAltKeySet); | |
| 78 } | |
| 79 | |
| 80 altkeyContainer.keyset = id; | |
| 81 event.target.dropKey(); | |
| 82 activeAltKeySet.style.width = event.target.clientWidth * | |
| 83 activeAltKeySet.childElementCount + 'px'; | |
| 84 activeAltKeySet.style.height = event.target.clientHeight + 'px'; | |
| 85 activeAltKeySet.style.top = event.target.offsetTop + 'px'; | |
| 86 var leftOffset = activeAltKeySet.offset * event.target.clientWidth; | |
| 87 activeAltKeySet.style.left = event.target.offsetLeft - leftOffset + | |
| 88 'px'; | |
| 89 var nodes = activeAltKeySet.childNodes; | |
| 90 nodes[activeAltKeySet.offset].classList.add('active'); | |
| 91 altkeyContainer.hidden = false; | |
| 92 }, | |
| 93 | |
| 94 show: function() { | |
| 95 var old = $('keyboard').querySelector('.activeKeyset'); | |
| 96 if (old && old != this) | |
| 97 old.classList.remove('activeKeyset'); | |
| 98 this.classList.add('activeKeyset'); | |
| 99 this.fire('stateChange', { | |
| 100 state: 'keysetChanged', | |
| 101 value: this.id | |
| 102 }); | |
| 103 }, | |
| 104 }); | |
| OLD | NEW |