Chromium Code Reviews
chromiumcodereview-hr@appspot.gserviceaccount.com (chromiumcodereview-hr) | Please choose your nickname with Settings | Help | Chromium Project | Gerrit Changes | Sign out
(16)

Side by Side Diff: ui/keyboard/resources/elements/kb-keyboard.html

Issue 140123002: Work around for content select not supporting touch events on it's children. (Closed) Base URL: https://chromium.googlesource.com/chromium/src.git@master
Patch Set: Fixed nit. Created 6 years, 11 months ago
Use n/p to move between diff chunks; N/P to move between comments. Draft comments are only viewable by you.
Jump to:
View unified diff | Download patch
OLDNEW
1 <!-- 1 <!--
2 -- Copyright 2013 The Chromium Authors. All rights reserved. 2 -- Copyright 2013 The Chromium Authors. All rights reserved.
3 -- Use of this source code is governed by a BSD-style license that can be 3 -- Use of this source code is governed by a BSD-style license that can be
4 -- found in the LICENSE file. 4 -- found in the LICENSE file.
5 --> 5 -->
6 6
7 <polymer-element name="kb-keyboard" on-key-over="{{keyOver}}" 7 <polymer-element name="kb-keyboard" on-key-over="{{keyOver}}"
8 on-key-up="{{keyUp}}" on-key-down="{{keyDown}}" 8 on-key-up="{{keyUp}}" on-key-down="{{keyDown}}"
9 on-key-longpress="{{keyLongpress}}" on-pointerup="{{up}}" 9 on-key-longpress="{{keyLongpress}}" on-pointerup="{{up}}"
10 on-pointerdown="{{down}}" on-pointerout="{{out}}" 10 on-pointerdown="{{down}}" on-pointerout="{{out}}"
11 on-enable-sel="{{enableSel}}" on-enable-dbl="{{enableDbl}}" 11 on-enable-sel="{{enableSel}}" on-enable-dbl="{{enableDbl}}"
12 on-key-out="{{keyOut}}" on-show-options="{{showOptions}}" 12 on-key-out="{{keyOut}}" on-show-options="{{showOptions}}"
13 on-set-layout="{{setLayout}}" on-type-key="{{type}}" 13 on-set-layout="{{setLayout}}" on-type-key="{{type}}"
14 attributes="keyset layout inputType inputTypeToLayoutMap"> 14 attributes="keyset layout inputType inputTypeToLayoutMap">
15 <template> 15 <template>
16 <style> 16 <style>
17 @host { 17 @host {
18 * { 18 * {
19 position: relative; 19 position: relative;
20 } 20 }
21 } 21 }
22 </style> 22 </style>
23 <!-- The ID for a keyset follows the naming convention of combining the 23 <!-- The ID for a keyset follows the naming convention of combining the
24 -- layout name with a base keyset name. This convention is used to 24 -- layout name with a base keyset name. This convention is used to
25 -- allow multiple layouts to be loaded (enablign fast switching) while 25 -- allow multiple layouts to be loaded (enablign fast switching) while
26 -- allowing the shift and spacebar keys to be common across multiple 26 -- allowing the shift and spacebar keys to be common across multiple
27 -- keyboard layouts. 27 -- keyboard layouts.
28 --> 28 -->
29 <content id="content" select="#{{layout}}-{{keyset}}"></content> 29 <content id="content"></content>
30 <kb-keyboard-overlay id="overlay" hidden></kb-keyboard-overlay> 30 <kb-keyboard-overlay id="overlay" hidden></kb-keyboard-overlay>
31 <kb-key-codes id="keyCodeMetadata"></kb-key-codes> 31 <kb-key-codes id="keyCodeMetadata"></kb-key-codes>
32 </template> 32 </template>
33 <script> 33 <script>
34 /** 34 /**
35 * The repeat delay in milliseconds before a key starts repeating. Use the 35 * The repeat delay in milliseconds before a key starts repeating. Use the
36 * same rate as Chromebook. 36 * same rate as Chromebook.
37 * (See chrome/browser/chromeos/language_preferences.cc) 37 * (See chrome/browser/chromeos/language_preferences.cc)
38 * @const 38 * @const
39 * @type {number} 39 * @type {number}
(...skipping 290 matching lines...) Expand 10 before | Expand all | Expand 10 after
330 } 330 }
331 var toKeyset = detail.toKeyset; 331 var toKeyset = detail.toKeyset;
332 if (toKeyset) { 332 if (toKeyset) {
333 this.keyset = toKeyset; 333 this.keyset = toKeyset;
334 this.activeKeyset.nextKeyset = detail.nextKeyset; 334 this.activeKeyset.nextKeyset = detail.nextKeyset;
335 return true; 335 return true;
336 } 336 }
337 return false; 337 return false;
338 }, 338 },
339 339
340 keysetChanged: function() {
341 var keyset = this.activeKeyset;
342 // Show the keyset if it has been initialized.
343 if (keyset)
344 keyset.show();
345 },
346
340 ready: function() { 347 ready: function() {
341 this.voiceInput_ = new VoiceInput(this); 348 this.voiceInput_ = new VoiceInput(this);
342 this.swipeHandler = this.move.bind(this); 349 this.swipeHandler = this.move.bind(this);
343 }, 350 },
344 351
345 /** 352 /**
346 * Registers a callback for state change events. Lazy initializes a 353 * Registers a callback for state change events.
347 * mutation observer used to detect when the keyset selection is changed.
348 * @param{!Function} callback Callback function to register. 354 * @param{!Function} callback Callback function to register.
349 */ 355 */
350 addKeysetChangedObserver: function(callback) { 356 addKeysetChangedObserver: function(callback) {
351 if (!this.keysetChangedObserver) {
352 var target = this.$.content;
353 var self = this;
354 var observer = new MutationObserver(function(mutations) {
355 mutations.forEach(function(m) {
356 if (m.type == 'attributes' && m.attributeName == 'select') {
357 var value = m.target.getAttribute('select');
358 self.fire('stateChange', {
359 state: 'keysetChanged',
360 value: value
361 });
362 }
363 });
364 });
365
366 observer.observe(target, {
367 attributes: true,
368 childList: true,
369 subtree: true
370 });
371 this.keysetChangedObserver = observer;
372
373 }
374 this.addEventListener('stateChange', callback); 357 this.addEventListener('stateChange', callback);
375 }, 358 },
376 359
377 /** 360 /**
378 * Called when the type of focused input box changes. If a keyboard layout 361 * Called when the type of focused input box changes. If a keyboard layout
379 * is defined for the current input type, that layout will be loaded. 362 * is defined for the current input type, that layout will be loaded.
380 * Otherwise, the keyboard layout for 'text' type will be loaded. 363 * Otherwise, the keyboard layout for 'text' type will be loaded.
381 */ 364 */
382 inputTypeChanged: function() { 365 inputTypeChanged: function() {
383 // TODO(bshe): Toggle visibility of some keys in a keyboard layout 366 // TODO(bshe): Toggle visibility of some keys in a keyboard layout
(...skipping 442 matching lines...) Expand 10 before | Expand all | Expand 10 after
826 document.head.appendChild(link); 809 document.head.appendChild(link);
827 810
828 // Load content for the new link element. 811 // Load content for the new link element.
829 var self = this; 812 var self = this;
830 HTMLImports.importer.load(document, function() { 813 HTMLImports.importer.load(document, function() {
831 HTMLImports.parser.parseLink(link); 814 HTMLImports.parser.parseLink(link);
832 self.layoutChanged(); 815 self.layoutChanged();
833 }); 816 });
834 } 817 }
835 } 818 }
819 // New keyset has already been loaded, can show immediately.
820 } else {
821 this.activeKeyset.show();
836 } 822 }
837 }, 823 },
838 824
839 /** 825 /**
840 * Notifies the modifier keys that a non-control key was typed. This 826 * Notifies the modifier keys that a non-control key was typed. This
841 * lets them reset sticky behaviour. A non-control key is defined as 827 * lets them reset sticky behaviour. A non-control key is defined as
842 * any key that is not Control, Alt, or Shift. 828 * any key that is not Control, Alt, or Shift.
843 */ 829 */
844 onNonControlKeyTyped: function() { 830 onNonControlKeyTyped: function() {
845 if (this.shift) 831 if (this.shift)
(...skipping 44 matching lines...) Expand 10 before | Expand all | Expand 10 after
890 876
891 /** 877 /**
892 * The keyboard is ready for input once the target keyset appears 878 * The keyboard is ready for input once the target keyset appears
893 * in the distributed nodes for the keyboard. 879 * in the distributed nodes for the keyboard.
894 * @return {boolean} Indicates if the keyboard is ready for input. 880 * @return {boolean} Indicates if the keyboard is ready for input.
895 */ 881 */
896 isReady: function() { 882 isReady: function() {
897 var keyset = this.activeKeyset; 883 var keyset = this.activeKeyset;
898 if (!keyset) 884 if (!keyset)
899 return false; 885 return false;
900 var content = this.$.content.getDistributedNodes()[0]; 886 var nodes = this.$.content.getDistributedNodes();
901 return content == keyset; 887 for (var i = 0; i < nodes.length; i++) {
888 if (nodes[i].id && nodes[i].id == keyset.id)
889 return true;
890 }
891 return false;
902 }, 892 },
903 893
904 /** 894 /**
905 * Generates fabricated key events to simulate typing on a 895 * Generates fabricated key events to simulate typing on a
906 * physical keyboard. 896 * physical keyboard.
907 * @param {Object} detail Attributes of the key being typed. 897 * @param {Object} detail Attributes of the key being typed.
908 * @return {boolean} Whether the key type succeeded. 898 * @return {boolean} Whether the key type succeeded.
909 */ 899 */
910 keyTyped: function(detail) { 900 keyTyped: function(detail) {
911 var builder = this.$.keyCodeMetadata; 901 var builder = this.$.keyCodeMetadata;
(...skipping 58 matching lines...) Expand 10 before | Expand all | Expand 10 after
970 } 960 }
971 } 961 }
972 } 962 }
973 if (keysetsLoaded) 963 if (keysetsLoaded)
974 console.error('No default keyset found for ' + this.layout); 964 console.error('No default keyset found for ' + this.layout);
975 return false; 965 return false;
976 } 966 }
977 }); 967 });
978 </script> 968 </script>
979 </polymer-element> 969 </polymer-element>
OLDNEW
« no previous file with comments | « ui/keyboard/resources/elements/kb-key.html ('k') | ui/keyboard/resources/elements/kb-keyset.html » ('j') | no next file with comments »

Powered by Google App Engine
This is Rietveld 408576698