| 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 // require: event_tracker.js | 5 // require: event_tracker.js |
| 6 | 6 |
| 7 cr.define('cr.ui', function() { | 7 cr.define('cr.ui', function() { |
| 8 | 8 |
| 9 // The arrow location specifies how the arrow and bubble are positioned in | 9 // The arrow location specifies how the arrow and bubble are positioned in |
| 10 // relation to the anchor node. | 10 // relation to the anchor node. |
| (...skipping 155 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
| 166 anchorMid - ARROW_OFFSET_X; | 166 anchorMid - ARROW_OFFSET_X; |
| 167 } | 167 } |
| 168 var top = this.isTop_ ? clientRect.bottom + ARROW_OFFSET_Y : | 168 var top = this.isTop_ ? clientRect.bottom + ARROW_OFFSET_Y : |
| 169 clientRect.top - this.clientHeight - ARROW_OFFSET_Y; | 169 clientRect.top - this.clientHeight - ARROW_OFFSET_Y; |
| 170 | 170 |
| 171 this.style.left = left + 'px'; | 171 this.style.left = left + 'px'; |
| 172 this.style.top = top + 'px'; | 172 this.style.top = top + 'px'; |
| 173 }, | 173 }, |
| 174 | 174 |
| 175 /** | 175 /** |
| 176 * Starts showing the bubble. The bubble will grab input and show until the | 176 * Starts showing the bubble. The bubble will show until the user clicks |
| 177 * user clicks away. | 177 * away or presses Escape. |
| 178 */ | 178 */ |
| 179 show: function() { | 179 show: function() { |
| 180 if (!this.hidden) | 180 if (!this.hidden) |
| 181 return; | 181 return; |
| 182 | 182 |
| 183 document.body.appendChild(this); | 183 document.body.appendChild(this); |
| 184 this.hidden = false; | 184 this.hidden = false; |
| 185 this.reposition(); | 185 this.reposition(); |
| 186 this.showTime_ = Date.now(); | 186 this.showTime_ = Date.now(); |
| 187 | 187 |
| (...skipping 14 matching lines...) Expand all Loading... |
| 202 this.parentNode.removeChild(this); | 202 this.parentNode.removeChild(this); |
| 203 }, | 203 }, |
| 204 | 204 |
| 205 /** | 205 /** |
| 206 * Handles keydown and mousedown events, dismissing the bubble if | 206 * Handles keydown and mousedown events, dismissing the bubble if |
| 207 * necessary. | 207 * necessary. |
| 208 * @param {Event} e The event. | 208 * @param {Event} e The event. |
| 209 */ | 209 */ |
| 210 handleEvent: function(e) { | 210 handleEvent: function(e) { |
| 211 switch (e.type) { | 211 switch (e.type) { |
| 212 case 'keydown': | 212 case 'keydown': { |
| 213 if (e.keyCode == 27) // Esc | 213 if (e.keyCode == 27) // Esc |
| 214 this.hide(); | 214 this.hide(); |
| 215 break; | 215 break; |
| 216 | 216 } |
| 217 case 'mousedown': | 217 case 'mousedown': { |
| 218 if (e.target == this.querySelector('.bubble-close')) { | 218 if (e.target == this.querySelector('.bubble-close')) { |
| 219 this.handleCloseEvent_(); | 219 this.handleCloseEvent_(); |
| 220 } else if (!this.contains(e.target)) { | 220 } else if (!this.contains(e.target)) { |
| 221 if (Date.now() - this.showTime_ < this.deactivateToDismissDelay_) | 221 if (Date.now() - this.showTime_ < this.deactivateToDismissDelay_) |
| 222 return; | 222 return; |
| 223 this.hide(); | 223 this.hide(); |
| 224 } else { | 224 } else { |
| 225 return; | 225 return; |
| 226 } | 226 } |
| 227 break; | 227 break; |
| 228 } |
| 228 } | 229 } |
| 229 | |
| 230 e.stopPropagation(); | |
| 231 e.preventDefault(); | |
| 232 return; | |
| 233 }, | 230 }, |
| 234 }; | 231 }; |
| 235 | 232 |
| 236 return { | 233 return { |
| 237 ArrowLocation : ArrowLocation, | 234 ArrowLocation : ArrowLocation, |
| 238 Bubble : Bubble, | 235 Bubble : Bubble, |
| 239 BubbleAlignment : BubbleAlignment | 236 BubbleAlignment : BubbleAlignment |
| 240 }; | 237 }; |
| 241 }); | 238 }); |
| OLD | NEW |