OLD | NEW |
1 <!-- | 1 <!-- |
2 Copyright (c) 2014 The Polymer Project Authors. All rights reserved. | 2 Copyright (c) 2014 The Polymer Project Authors. All rights reserved. |
3 This code may only be used under the BSD style license found at http://polymer.g
ithub.io/LICENSE.txt | 3 This code may only be used under the BSD style license found at http://polymer.g
ithub.io/LICENSE.txt |
4 The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt | 4 The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt |
5 The complete set of contributors may be found at http://polymer.github.io/CONTRI
BUTORS.txt | 5 The complete set of contributors may be found at http://polymer.github.io/CONTRI
BUTORS.txt |
6 Code distributed by Google as part of the polymer project is also | 6 Code distributed by Google as part of the polymer project is also |
7 subject to an additional IP rights grant found at http://polymer.github.io/PATEN
TS.txt | 7 subject to an additional IP rights grant found at http://polymer.github.io/PATEN
TS.txt |
8 --> | 8 --> |
9 | 9 |
10 <!-- | 10 <!-- |
(...skipping 12 matching lines...) Expand all Loading... |
23 | 23 |
24 See <a href="../paper-radio-button/">paper-radio-button</a> for more | 24 See <a href="../paper-radio-button/">paper-radio-button</a> for more |
25 information about `paper-radio-button`. | 25 information about `paper-radio-button`. |
26 | 26 |
27 @group Paper Elements | 27 @group Paper Elements |
28 @element paper-radio-group | 28 @element paper-radio-group |
29 @extends core-selector | 29 @extends core-selector |
30 @homepage github.io | 30 @homepage github.io |
31 --> | 31 --> |
32 | 32 |
| 33 <link rel="import" href="../core-a11y-keys/core-a11y-keys.html"> |
33 <link rel="import" href="../core-selector/core-selector.html"> | 34 <link rel="import" href="../core-selector/core-selector.html"> |
34 <link rel="import" href="../paper-radio-button/paper-radio-button.html"> | 35 <link rel="import" href="../paper-radio-button/paper-radio-button.html"> |
35 | 36 |
36 <polymer-element name="paper-radio-group" extends="core-selector" role="radiogro
up"> | 37 <polymer-element name="paper-radio-group" extends="core-selector" role="radiogro
up"> |
37 | 38 |
38 <template> | 39 <template> |
| 40 |
| 41 <core-a11y-keys target="{{}}" keys="up left" on-keys-pressed="{{selectPrevio
us}}"></core-a11y-keys> |
| 42 <core-a11y-keys target="{{}}" keys="down right" on-keys-pressed="{{selectNex
t}}"></core-a11y-keys> |
39 | 43 |
40 <style> | 44 <style> |
41 | 45 |
42 :host { | 46 :host { |
43 display: inline-block; | 47 display: inline-block; |
44 } | 48 } |
45 | 49 |
46 polyfill-next-selector { content: ':host > *'; } | 50 polyfill-next-selector { content: ':host > *'; } |
47 ::content > * { | 51 ::content > * { |
48 padding: 12px; | 52 padding: 12px; |
49 } | 53 } |
50 | 54 |
51 </style> | 55 </style> |
52 | 56 |
53 <shadow></shadow> | 57 <shadow></shadow> |
54 | 58 |
55 </template> | 59 </template> |
56 | 60 |
57 <script> | 61 <script> |
58 | 62 |
59 Polymer('paper-radio-group', { | 63 Polymer('paper-radio-group', { |
60 | 64 nextIndex: function(index) { |
| 65 var items = this.items; |
| 66 var newIndex = index; |
| 67 do { |
| 68 newIndex = (newIndex + 1) % items.length; |
| 69 if (newIndex === index) { |
| 70 break; |
| 71 } |
| 72 } while (items[newIndex].disabled); |
| 73 return newIndex; |
| 74 }, |
| 75 previousIndex: function(index) { |
| 76 var items = this.items; |
| 77 var newIndex = index; |
| 78 do { |
| 79 newIndex = (newIndex || items.length) - 1; |
| 80 if (newIndex === index) { |
| 81 break; |
| 82 } |
| 83 } while (items[newIndex].disabled); |
| 84 return newIndex; |
| 85 }, |
| 86 selectNext: function() { |
| 87 var node = this.selectIndex(this.nextIndex(this.selectedIndex)); |
| 88 node.focus(); |
| 89 }, |
| 90 selectPrevious: function() { |
| 91 var node = this.selectIndex(this.previousIndex(this.selectedIndex)); |
| 92 node.focus(); |
| 93 }, |
61 selectedAttribute: 'checked', | 94 selectedAttribute: 'checked', |
62 activateEvent: 'change' | 95 activateEvent: 'change' |
63 | 96 |
64 }); | 97 }); |
65 | 98 |
66 </script> | 99 </script> |
67 | 100 |
68 </polymer-element> | 101 </polymer-element> |
OLD | NEW |