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

Side by Side Diff: third_party/polymer/components/paper-focusable/paper-focusable.html

Issue 592603004: Revert "Polymer elements added to third_party/polymer." (Closed) Base URL: https://chromium.googlesource.com/chromium/src.git@master
Patch Set: Created 6 years, 3 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 this.focused = false;
103
104 if (this.isToggle) {
105 this.active = !this.active;
106 } else {
107 this.active = true;
108 }
109 },
110
111 // Pulling up the context menu for an item should focus it; but we need to
112 // be careful about how we deal with down/up events surrounding context
113 // menus. The up event typically does not fire until the context menu
114 // closes: so we focus immediately.
115 //
116 // This fires _after_ downAction.
117 contextMenuAction: function(e) {
118 // Note that upAction may fire _again_ on the actual up event.
119 this.upAction(e);
120 this.focusAction();
121 },
122
123 upAction: function() {
124 this.pressed = false;
125
126 if (!this.isToggle) {
127 this.active = false;
128 }
129 },
130
131 focusAction: function() {
132 if (!this.pressed) {
133 // Only render the "focused" state if the element gains focus due to
134 // keyboard navigation.
135 this.focused = true;
136 }
137 },
138
139 blurAction: function() {
140 this.focused = false;
141 }
142
143 });
144
145 </script>
146 </polymer-element>
OLDNEW
« no previous file with comments | « third_party/polymer/components/paper-focusable/demo.html ('k') | third_party/polymer/components/paper-icon-button/.bower.json » ('j') | no next file with comments »

Powered by Google App Engine
This is Rietveld 408576698