OLD | NEW |
1 // Copyright (c) 2011 The Chromium Authors. All rights reserved. | 1 // Copyright (c) 2011 The Chromium Authors. All rights reserved. |
2 // Use of this source code is governed by a BSD-style license that can be | 2 // Use of this source code is governed by a BSD-style license that can be |
3 // found in the LICENSE file. | 3 // found in the LICENSE file. |
4 | 4 |
5 /** | 5 /** |
6 * @fileoverview Bubble implementation. | 6 * @fileoverview Bubble implementation. |
7 */ | 7 */ |
8 | 8 |
9 // TODO(xiyuan): Move this into shared. | 9 // TODO(xiyuan): Move this into shared. |
10 cr.define('cr.ui', function() { | 10 cr.define('cr.ui', function() { |
11 /** | 11 /** |
12 * Creates a bubble div. | 12 * Creates a bubble div. |
13 * @constructor | 13 * @constructor |
14 * @extends {HTMLDivElement} | 14 * @extends {HTMLDivElement} |
15 */ | 15 */ |
16 var Bubble = cr.ui.define('div'); | 16 var Bubble = cr.ui.define('div'); |
17 | 17 |
18 Bubble.prototype = { | 18 Bubble.prototype = { |
19 __proto__: HTMLDivElement.prototype, | 19 __proto__: HTMLDivElement.prototype, |
20 | 20 |
21 // Anchor element | 21 // Anchor element |
22 anchor_: undefined, | 22 anchor_: undefined, |
23 | 23 |
24 /** @inheritDoc */ | 24 /** @inheritDoc */ |
25 decorate: function() { | 25 decorate: function() { |
26 this.ownerDocument.addEventListener('click', | 26 this.ownerDocument.addEventListener('click', |
27 this.handleClick_.bind(this)); | 27 this.handleDocClick_.bind(this)); |
| 28 this.ownerDocument.addEventListener('keydown', |
| 29 this.handleDocKeyDown_.bind(this)); |
28 this.addEventListener('webkitTransitionEnd', | 30 this.addEventListener('webkitTransitionEnd', |
29 this.handleTransitionEnd_.bind(this)); | 31 this.handleTransitionEnd_.bind(this)); |
30 }, | 32 }, |
31 | 33 |
32 /** | 34 /** |
33 * Shows the bubble for given anchor element. | 35 * Shows the bubble for given anchor element. |
34 * @param {!HTMLElement} el Anchor element of the bubble. | 36 * @param {!HTMLElement} el Anchor element of the bubble. |
35 * @param {HTMLElement} content Content to show in bubble. | 37 * @param {HTMLElement} content Content to show in bubble. |
36 * @public | 38 * @public |
37 */ | 39 */ |
(...skipping 39 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
77 /** | 79 /** |
78 * Handler for faded transition end. | 80 * Handler for faded transition end. |
79 * @private | 81 * @private |
80 */ | 82 */ |
81 handleTransitionEnd_: function(e) { | 83 handleTransitionEnd_: function(e) { |
82 if (this.classList.contains('faded')) | 84 if (this.classList.contains('faded')) |
83 this.hidden = true; | 85 this.hidden = true; |
84 }, | 86 }, |
85 | 87 |
86 /** | 88 /** |
87 * Handler of click event. | 89 * Handler of document click event. |
88 * @private | 90 * @private |
89 */ | 91 */ |
90 handleClick_: function(e) { | 92 handleDocClick_: function(e) { |
91 // Ignore clicks on anchor element. | 93 // Ignore clicks on anchor element. |
92 if (e.target == this.anchor_) | 94 if (e.target == this.anchor_) |
93 return; | 95 return; |
94 | 96 |
95 if (!this.hidden) | 97 if (!this.hidden) |
96 this.hide(); | 98 this.hide(); |
| 99 }, |
| 100 |
| 101 /** |
| 102 * Handle of document keydown event. |
| 103 * @private |
| 104 */ |
| 105 handleDocKeyDown_: function(e) { |
| 106 if (!this.hidden) |
| 107 this.hide(); |
97 } | 108 } |
98 }; | 109 }; |
99 | 110 |
100 return { | 111 return { |
101 Bubble: Bubble | 112 Bubble: Bubble |
102 }; | 113 }; |
103 }); | 114 }); |
OLD | NEW |