OLD | NEW |
1 // Copyright (c) 2012 The Chromium Authors. All rights reserved. | 1 // Copyright (c) 2012 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 Provides dialog-like behaviors for the tracing UI. | 6 * @fileoverview Provides dialog-like behaviors for the tracing UI. |
7 */ | 7 */ |
8 cr.define('cr.ui.overlay', function() { | 8 cr.define('cr.ui.overlay', function() { |
9 /** | 9 /** |
10 * Gets the top, visible overlay. It makes the assumption that if multiple | 10 * Gets the top, visible overlay. It makes the assumption that if multiple |
11 * overlays are visible, the last in the byte order is topmost. | 11 * overlays are visible, the last in the byte order is topmost. |
12 * TODO(estade): rely on aria-visibility instead? | 12 * TODO(estade): rely on aria-visibility instead? |
13 * @return {HTMLElement} The overlay. | 13 * @return {HTMLElement} The overlay. |
14 */ | 14 */ |
15 function getTopOverlay() { | 15 function getTopOverlay() { |
16 var overlays = /** @type !NodeList<!HTMLElement> */ ( | 16 var overlays = /** @type !NodeList<!HTMLElement> */ ( |
17 document.querySelectorAll('.overlay:not([hidden])')); | 17 document.querySelectorAll('.overlay:not([hidden])')); |
18 return overlays[overlays.length - 1]; | 18 return overlays[overlays.length - 1]; |
19 } | 19 } |
20 | 20 |
21 /** | 21 /** |
22 * Returns a visible default button of the overlay, if it has one. If the | 22 * Returns a visible default button of the overlay, if it has one. If the |
23 * overlay has more than one, the first one will be returned. | 23 * overlay has more than one, the first one will be returned. |
24 * | 24 * |
25 * @param {HTMLElement} overlay The .overlay. | 25 * @param {HTMLElement} overlay The .overlay. |
26 * @return {HTMLElement} The default button. | 26 * @return {HTMLElement} The default button. |
27 */ | 27 */ |
28 function getDefaultButton(overlay) { | 28 function getDefaultButton(overlay) { |
29 function isHidden(node) { return node.hidden; } | 29 function isHidden(node) { |
| 30 return node.hidden; |
| 31 } |
30 var defaultButtons = /** @type !NodeList<!HTMLElement> */ ( | 32 var defaultButtons = /** @type !NodeList<!HTMLElement> */ ( |
31 overlay.querySelectorAll('.page .button-strip > .default-button')); | 33 overlay.querySelectorAll('.page .button-strip > .default-button')); |
32 for (var i = 0; i < defaultButtons.length; i++) { | 34 for (var i = 0; i < defaultButtons.length; i++) { |
33 if (!findAncestor(defaultButtons[i], isHidden)) | 35 if (!findAncestor(defaultButtons[i], isHidden)) |
34 return defaultButtons[i]; | 36 return defaultButtons[i]; |
35 } | 37 } |
36 return null; | 38 return null; |
37 } | 39 } |
38 | 40 |
39 /** @type {boolean} */ | 41 /** @type {boolean} */ |
(...skipping 64 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
104 } | 106 } |
105 | 107 |
106 // Remove the 'pulse' animation any time the overlay is hidden or shown. | 108 // Remove the 'pulse' animation any time the overlay is hidden or shown. |
107 overlay.__defineSetter__('hidden', function(value) { | 109 overlay.__defineSetter__('hidden', function(value) { |
108 this.classList.remove('pulse'); | 110 this.classList.remove('pulse'); |
109 if (value) | 111 if (value) |
110 this.setAttribute('hidden', true); | 112 this.setAttribute('hidden', true); |
111 else | 113 else |
112 this.removeAttribute('hidden'); | 114 this.removeAttribute('hidden'); |
113 }); | 115 }); |
114 overlay.__defineGetter__( | 116 overlay.__defineGetter__('hidden', function() { |
115 'hidden', function() { return this.hasAttribute('hidden'); }); | 117 return this.hasAttribute('hidden'); |
| 118 }); |
116 | 119 |
117 // Shake when the user clicks away. | 120 // Shake when the user clicks away. |
118 overlay.addEventListener('click', function(e) { | 121 overlay.addEventListener('click', function(e) { |
119 // Only pulse if the overlay was the target of the click. | 122 // Only pulse if the overlay was the target of the click. |
120 if (this != e.target) | 123 if (this != e.target) |
121 return; | 124 return; |
122 | 125 |
123 // This may be null while the overlay is closing. | 126 // This may be null while the overlay is closing. |
124 var overlayPage = this.querySelector('.page:not([hidden])'); | 127 var overlayPage = this.querySelector('.page:not([hidden])'); |
125 if (overlayPage) | 128 if (overlayPage) |
126 overlayPage.classList.add('pulse'); | 129 overlayPage.classList.add('pulse'); |
127 }); | 130 }); |
128 overlay.addEventListener('webkitAnimationEnd', function(e) { | 131 overlay.addEventListener('webkitAnimationEnd', function(e) { |
129 e.target.classList.remove('pulse'); | 132 e.target.classList.remove('pulse'); |
130 }); | 133 }); |
131 } | 134 } |
132 | 135 |
133 return { | 136 return { |
134 getDefaultButton: getDefaultButton, | 137 getDefaultButton: getDefaultButton, |
135 globalInitialization: globalInitialization, | 138 globalInitialization: globalInitialization, |
136 setupOverlay: setupOverlay, | 139 setupOverlay: setupOverlay, |
137 }; | 140 }; |
138 }); | 141 }); |
OLD | NEW |