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

Side by Side Diff: bower_components/paper-focusable/paper-focusable.html

Issue 786953007: npm_modules: Fork bower_components into Polymer 0.4.0 and 0.5.0 versions (Closed) Base URL: https://chromium.googlesource.com/infra/third_party/npm_modules.git@master
Patch Set: Created 5 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
(Empty)
1 <!--
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
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
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
8 -->
9
10 <!--
11 /**
12 * @group Paper Elements
13 *
14 * paper-focusable is a base class for paper elements that can be focused.
15 *
16 * @element paper-focusable
17 * @status beta
18 * @homepage github.io
19 */
20 -->
21
22 <link href="../polymer/polymer.html" rel="import">
23
24 <polymer-element name="paper-focusable" attributes="active focused disabled isTo ggle" tabindex="0" on-down="{{downAction}}" on-up="{{upAction}}" on-focus="{{foc usAction}}" on-blur="{{blurAction}}" on-contextmenu="{{contextMenuAction}}">
25
26 <template>
27 <style>
28 :host([disabled]) {
29 pointer-events: none;
30 }
31 </style>
32 <content></content>
33 </template>
34
35 <script>
36 Polymer('paper-focusable', {
37
38 publish: {
39
40 /**
41 * If true, the button is currently active either because the
42 * user is holding down the button, or the button is a toggle
43 * and is currently in the active state.
44 *
45 * @attribute active
46 * @type boolean
47 * @default false
48 */
49 active: {value: false, reflect: true},
50
51 /**
52 * If true, the element currently has focus due to keyboard
53 * navigation.
54 *
55 * @attribute focused
56 * @type boolean
57 * @default false
58 */
59 focused: {value: false, reflect: true},
60
61 /**
62 * If true, the user is currently holding down the button.
63 *
64 * @attribute pressed
65 * @type boolean
66 * @default false
67 */
68 pressed: {value: false, reflect: true},
69
70 /**
71 * If true, the user cannot interact with this element.
72 *
73 * @attribute disabled
74 * @type boolean
75 * @default false
76 */
77 disabled: {value: false, reflect: true},
78
79 /**
80 * If true, the button toggles the active state with each tap.
81 * Otherwise, the button becomes active when the user is holding
82 * it down.
83 *
84 * @attribute isToggle
85 * @type boolean
86 * @default false
87 */
88 isToggle: {value: false, reflect: false}
89
90 },
91
92 disabledChanged: function() {
93 if (this.disabled) {
94 this.removeAttribute('tabindex');
95 } else {
96 this.setAttribute('tabindex', 0);
97 }
98 },
99
100 downAction: function() {
101 this.pressed = true;
102
103 if (this.isToggle) {
104 this.active = !this.active;
105 } else {
106 this.active = true;
107 }
108 },
109
110 // Pulling up the context menu for an item should focus it; but we need to
111 // be careful about how we deal with down/up events surrounding context
112 // menus. The up event typically does not fire until the context menu
113 // closes: so we focus immediately.
114 //
115 // This fires _after_ downAction.
116 contextMenuAction: function(e) {
117 // Note that upAction may fire _again_ on the actual up event.
118 this.upAction(e);
119 this.focusAction();
120 },
121
122 upAction: function() {
123 this.pressed = false;
124
125 if (!this.isToggle) {
126 this.active = false;
127 }
128 },
129
130 focusAction: function() {
131 if (!this.pressed) {
132 // Only render the "focused" state if the element gains focus due to
133 // keyboard navigation.
134 this.focused = true;
135 }
136 },
137
138 blurAction: function() {
139 this.focused = false;
140 }
141
142 });
143
144 </script>
145 </polymer-element>
OLDNEW
« no previous file with comments | « bower_components/paper-focusable/demo.html ('k') | bower_components/paper-icon-button/.bower.json » ('j') | no next file with comments »

Powered by Google App Engine
This is Rietveld 408576698