Chromium Code Reviews| Index: ui/webui/resources/js/cr/ui/bubble.js |
| diff --git a/ui/webui/resources/js/cr/ui/bubble.js b/ui/webui/resources/js/cr/ui/bubble.js |
| index e938c7af1b069f31a1d263140b8b0452bc48405d..a93fc08aee95397f67a7858bdb9e6fef022c23d8 100644 |
| --- a/ui/webui/resources/js/cr/ui/bubble.js |
| +++ b/ui/webui/resources/js/cr/ui/bubble.js |
| @@ -4,54 +4,55 @@ |
| // require: event_tracker.js |
| -cr.define('cr.ui', function() { |
| - |
| - /** |
| - * The arrow location specifies how the arrow and bubble are positioned in |
| - * relation to the anchor node. |
| - * @enum |
| - */ |
| - var ArrowLocation = { |
| - // The arrow is positioned at the top and the start of the bubble. In left |
| - // to right mode this is the top left. The entire bubble is positioned below |
| - // the anchor node. |
| - TOP_START: 'top-start', |
| - // The arrow is positioned at the top and the end of the bubble. In left to |
| - // right mode this is the top right. The entire bubble is positioned below |
| - // the anchor node. |
| - TOP_END: 'top-end', |
| - // The arrow is positioned at the bottom and the start of the bubble. In |
| - // left to right mode this is the bottom left. The entire bubble is |
| - // positioned above the anchor node. |
| - BOTTOM_START: 'bottom-start', |
| - // The arrow is positioned at the bottom and the end of the bubble. In |
| - // left to right mode this is the bottom right. The entire bubble is |
| - // positioned above the anchor node. |
| - BOTTOM_END: 'bottom-end' |
| - }; |
| - |
| - /** |
| - * The bubble alignment specifies the position of the bubble in relation to |
| - * the anchor node. |
| - * @enum |
| - */ |
| - var BubbleAlignment = { |
| - // The bubble is positioned just above or below the anchor node (as |
| - // specified by the arrow location) so that the arrow points at the midpoint |
| - // of the anchor. |
| - ARROW_TO_MID_ANCHOR: 'arrow-to-mid-anchor', |
| - // The bubble is positioned just above or below the anchor node (as |
| - // specified by the arrow location) so that its reference edge lines up with |
| - // the edge of the anchor. |
| - BUBBLE_EDGE_TO_ANCHOR_EDGE: 'bubble-edge-anchor-edge', |
| - // The bubble is positioned so that it is entirely within view and does not |
| - // obstruct the anchor element, if possible. The specified arrow location is |
| - // taken into account as the preferred alignment but may be overruled if |
| - // there is insufficient space (see BubbleBase.reposition for the exact |
| - // placement algorithm). |
| - ENTIRELY_VISIBLE: 'entirely-visible' |
| - }; |
| +cr.exportPath('cr.ui'); |
| + |
| +/** |
| + * The arrow location specifies how the arrow and bubble are positioned in |
| + * relation to the anchor node. |
| + * @enum {string} |
| + */ |
| +cr.ui.ArrowLocation = { |
| + // The arrow is positioned at the top and the start of the bubble. In left |
| + // to right mode this is the top left. The entire bubble is positioned below |
| + // the anchor node. |
| + TOP_START: 'top-start', |
| + // The arrow is positioned at the top and the end of the bubble. In left to |
| + // right mode this is the top right. The entire bubble is positioned below |
| + // the anchor node. |
| + TOP_END: 'top-end', |
| + // The arrow is positioned at the bottom and the start of the bubble. In |
| + // left to right mode this is the bottom left. The entire bubble is |
| + // positioned above the anchor node. |
| + BOTTOM_START: 'bottom-start', |
| + // The arrow is positioned at the bottom and the end of the bubble. In |
| + // left to right mode this is the bottom right. The entire bubble is |
| + // positioned above the anchor node. |
| + BOTTOM_END: 'bottom-end' |
| +}; |
| + |
| +/** |
| + * The bubble alignment specifies the position of the bubble in relation to |
| + * the anchor node. |
| + * @enum {string} |
| + */ |
| +cr.ui.BubbleAlignment = { |
| + // The bubble is positioned just above or below the anchor node (as |
| + // specified by the arrow location) so that the arrow points at the midpoint |
| + // of the anchor. |
| + ARROW_TO_MID_ANCHOR: 'arrow-to-mid-anchor', |
| + // The bubble is positioned just above or below the anchor node (as |
| + // specified by the arrow location) so that its reference edge lines up with |
| + // the edge of the anchor. |
| + BUBBLE_EDGE_TO_ANCHOR_EDGE: 'bubble-edge-anchor-edge', |
| + // The bubble is positioned so that it is entirely within view and does not |
| + // obstruct the anchor element, if possible. The specified arrow location is |
| + // taken into account as the preferred alignment but may be overruled if |
| + // there is insufficient space (see BubbleBase.reposition for the exact |
| + // placement algorithm). |
| + ENTIRELY_VISIBLE: 'entirely-visible' |
| +}; |
|
Dan Beam
2014/08/05 18:49:27
^ is this still needed?
Vitaly Pavlenko
2014/08/05 23:00:54
Yes. If I move these declarations inside scope fun
Dan Beam
2014/08/05 23:09:29
ok, is there a github issue you can reference (ass
Vitaly Pavlenko
2014/08/06 00:16:42
Done.
|
| +cr.define('cr.ui', function() { |
| /** |
| * Abstract base class that provides common functionality for implementing |
| * free-floating informational bubbles with a triangular arrow pointing at an |
| @@ -89,7 +90,7 @@ cr.define('cr.ui', function() { |
| '<div class="bubble-shadow"></div>' + |
| '<div class="bubble-arrow"></div>'; |
| this.hidden = true; |
| - this.bubbleAlignment = BubbleAlignment.ENTIRELY_VISIBLE; |
| + this.bubbleAlignment = cr.ui.BubbleAlignment.ENTIRELY_VISIBLE; |
| }, |
| /** |
| @@ -127,12 +128,12 @@ cr.define('cr.ui', function() { |
| if (!this.hidden) |
| return; |
| - this.arrowAtRight_ = location == ArrowLocation.TOP_END || |
| - location == ArrowLocation.BOTTOM_END; |
| + this.arrowAtRight_ = location == cr.ui.ArrowLocation.TOP_END || |
| + location == cr.ui.ArrowLocation.BOTTOM_END; |
| if (document.documentElement.dir == 'rtl') |
| this.arrowAtRight_ = !this.arrowAtRight_; |
| - this.arrowAtTop_ = location == ArrowLocation.TOP_START || |
| - location == ArrowLocation.TOP_END; |
| + this.arrowAtTop_ = location == cr.ui.ArrowLocation.TOP_START || |
| + location == cr.ui.ArrowLocation.TOP_END; |
| }, |
| /** |
| @@ -160,7 +161,7 @@ cr.define('cr.ui', function() { |
| var bubble = this.getBoundingClientRect(); |
| var arrow = this.querySelector('.bubble-arrow').getBoundingClientRect(); |
| - if (this.bubbleAlignment_ == BubbleAlignment.ENTIRELY_VISIBLE) { |
| + if (this.bubbleAlignment_ == cr.ui.BubbleAlignment.ENTIRELY_VISIBLE) { |
| // Work out horizontal placement. The bubble is initially positioned so |
| // that the arrow tip points toward the midpoint of the anchor and is |
| // BubbleBase.ARROW_OFFSET pixels from the reference edge and (as |
| @@ -211,7 +212,7 @@ cr.define('cr.ui', function() { |
| } |
| } else { |
| if (this.bubbleAlignment_ == |
| - BubbleAlignment.BUBBLE_EDGE_TO_ANCHOR_EDGE) { |
| + cr.ui.BubbleAlignment.BUBBLE_EDGE_TO_ANCHOR_EDGE) { |
| var left = this.arrowAtRight_ ? anchor.right - bubble.width : |
| anchor.left; |
| } else { |
| @@ -329,14 +330,15 @@ cr.define('cr.ui', function() { |
| this.handleCloseEvent = this.hide; |
| this.deactivateToDismissDelay_ = 0; |
| - this.bubbleAlignment = BubbleAlignment.ARROW_TO_MID_ANCHOR; |
| + this.bubbleAlignment = cr.ui.BubbleAlignment.ARROW_TO_MID_ANCHOR; |
| }, |
| /** |
| * Handler for close events triggered when the close button is clicked. By |
| * default, set to this.hide. Only available when the bubble is not being |
| * shown. |
| - * @param {function} handler The new handler, a function with no parameters. |
| + * @param {function(): *} handler The new handler, a function with no |
| + * parameters. |
| */ |
| set handleCloseEvent(handler) { |
| if (!this.hidden) |
| @@ -505,8 +507,6 @@ cr.define('cr.ui', function() { |
| return { |
| - ArrowLocation: ArrowLocation, |
| - BubbleAlignment: BubbleAlignment, |
| BubbleBase: BubbleBase, |
| Bubble: Bubble, |
| AutoCloseBubble: AutoCloseBubble |