src/ContextualPopup/ContextualPopup.js
function () {
		if (this.showing && this.hasNode() && this.activator) {
			this.resetPositioning();
			this.activatorOffset = this.getPageOffset(this.activator);
			var innerWidth = this.getViewWidth();
			var innerHeight = this.getViewHeight();

			//These are the view "flush boundaries"
			var topFlushPt = this.vertFlushMargin;
			var bottomFlushPt = innerHeight - this.vertFlushMargin;
			var leftFlushPt = this.horizFlushMargin;
			var rightFlushPt = innerWidth - this.horizFlushMargin;

			//Rule 1 - Activator Location based positioning
			//if the activator is in the top or bottom edges of the view, check if the popup needs flush positioning
			if ((this.activatorOffset.top + this.activatorOffset.height) < topFlushPt || this.activatorOffset.top > bottomFlushPt) {
				//check/try vertical flush positioning	(rule 1.a.i)
				if (this.applyVerticalFlushPositioning(leftFlushPt, rightFlushPt)) {
					return;
				}

				//if vertical doesn't fit then check/try horizontal flush (rule 1.a.ii)
				if (this.applyHorizontalFlushPositioning(leftFlushPt, rightFlushPt)) {
					return;
				}

				//if flush positioning didn't work then try just positioning vertically (rule 1.b.i & rule 1.b.ii)
				if (this.applyVerticalPositioning()){
					return;
				}
			//otherwise check if the activator is in the left or right edges of the view & if so try horizontal positioning
			} else if ((this.activatorOffset.left + this.activatorOffset.width) < leftFlushPt || this.activatorOffset.left > rightFlushPt) {
				//if flush positioning didn't work then try just positioning horizontally (rule 1.b.iii & rule 1.b.iv)
				if (this.applyHorizontalPositioning()){
					return;
				}
			}

			//Rule 2 - no specific logic below for this rule since it is inheritent to the positioning functions, ie we attempt to never
			//position a popup where there isn't enough room for it.

			//Rule 3 - Popup Size based positioning
			var clientRect = this.getBoundingRect(this.node);

			//if the popup is wide then use vertical positioning
			if (clientRect.width > this.widePopup) {
				if (this.applyVerticalPositioning()){
					return;
				}
			}
			//if the popup is long then use horizontal positioning
			else if (clientRect.height > this.longPopup) {
				if (this.applyHorizontalPositioning()){
					return;
				}
			}

			//Rule 4 - Favor top or bottom positioning
			if (this.applyVerticalPositioning()) {
				return;
			}
			//but if thats not possible try horizontal
			else if (this.applyHorizontalPositioning()){
				return;
			}

			//Rule 5 - no specific logic below for this rule since it is built into the vertical position functions, ie we attempt to
			//         use a bottom position for the popup as much possible.
		}
	}
function () {
		if (this.showing && this.hasNode() && this.activator) {
			this.resetPositioning();
			this.activatorOffset = this.getPageOffset(this.activator);
			var innerWidth = this.getViewWidth();
			var innerHeight = this.getViewHeight();

			//These are the view "flush boundaries"
			var topFlushPt = this.vertFlushMargin;
			var bottomFlushPt = innerHeight - this.vertFlushMargin;
			var leftFlushPt = this.horizFlushMargin;
			var rightFlushPt = innerWidth - this.horizFlushMargin;

			//Rule 1 - Activator Location based positioning
			//if the activator is in the top or bottom edges of the view, check if the popup needs flush positioning
			if ((this.activatorOffset.top + this.activatorOffset.height) < topFlushPt || this.activatorOffset.top > bottomFlushPt) {
				//check/try vertical flush positioning	(rule 1.a.i)
				if (this.applyVerticalFlushPositioning(leftFlushPt, rightFlushPt)) {
					return;
				}

				//if vertical doesn't fit then check/try horizontal flush (rule 1.a.ii)
				if (this.applyHorizontalFlushPositioning(leftFlushPt, rightFlushPt)) {
					return;
				}

				//if flush positioning didn't work then try just positioning vertically (rule 1.b.i & rule 1.b.ii)
				if (this.applyVerticalPositioning()){
					return;
				}
			//otherwise check if the activator is in the left or right edges of the view & if so try horizontal positioning
			} else if ((this.activatorOffset.left + this.activatorOffset.width) < leftFlushPt || this.activatorOffset.left > rightFlushPt) {
				//if flush positioning didn't work then try just positioning horizontally (rule 1.b.iii & rule 1.b.iv)
				if (this.applyHorizontalPositioning()){
					return;
				}
			}

			//Rule 2 - no specific logic below for this rule since it is inheritent to the positioning functions, ie we attempt to never
			//position a popup where there isn't enough room for it.

			//Rule 3 - Popup Size based positioning
			var clientRect = this.getBoundingRect(this.node);

			//if the popup is wide then use vertical positioning
			if (clientRect.width > this.widePopup) {
				if (this.applyVerticalPositioning()){
					return;
				}
			}
			//if the popup is long then use horizontal positioning
			else if (clientRect.height > this.longPopup) {
				if (this.applyHorizontalPositioning()){
					return;
				}
			}

			//Rule 4 - Favor top or bottom positioning
			if (this.applyVerticalPositioning()) {
				return;
			}
			//but if thats not possible try horizontal
			else if (this.applyHorizontalPositioning()){
				return;
			}

			//Rule 5 - no specific logic below for this rule since it is built into the vertical position functions, ie we attempt to
			//         use a bottom position for the popup as much possible.
		}
	}
function ( ) { if ( this . showing && this . hasNode ( ) && this . activator ) { this . resetPositioning ( ) ; this . activatorOffset = this . getPageOffset ( this . activator ) ; var innerWidth = this . getViewWidth ( ) ; var innerHeight = this . getViewHeight ( ) ; //These are the view "flush boundaries" var topFlushPt = this . vertFlushMargin ; var bottomFlushPt = innerHeight - this . vertFlushMargin ; var leftFlushPt = this . horizFlushMargin ; var rightFlushPt = innerWidth - this . horizFlushMargin ; //Rule 1 - Activator Location based positioning //if the activator is in the top or bottom edges of the view, check if the popup needs flush positioning if ( ( this . activatorOffset . top + this . activatorOffset . height ) < topFlushPt || this . activatorOffset . top > bottomFlushPt ) { //check/try vertical flush positioning	(rule 1.a.i) if ( this . applyVerticalFlushPositioning ( leftFlushPt , rightFlushPt ) ) { return ; } //if vertical doesn't fit then check/try horizontal flush (rule 1.a.ii) if ( this . applyHorizontalFlushPositioning ( leftFlushPt , rightFlushPt ) ) { return ; } //if flush positioning didn't work then try just positioning vertically (rule 1.b.i & rule 1.b.ii) if ( this . applyVerticalPositioning ( ) ) { return ; } //otherwise check if the activator is in the left or right edges of the view & if so try horizontal positioning } else if ( ( this . activatorOffset . left + this . activatorOffset . width ) < leftFlushPt || this . activatorOffset . left > rightFlushPt ) { //if flush positioning didn't work then try just positioning horizontally (rule 1.b.iii & rule 1.b.iv) if ( this . applyHorizontalPositioning ( ) ) { return ; } } //Rule 2 - no specific logic below for this rule since it is inheritent to the positioning functions, ie we attempt to never //position a popup where there isn't enough room for it. //Rule 3 - Popup Size based positioning var clientRect = this . getBoundingRect ( this . node ) ; //if the popup is wide then use vertical positioning if ( clientRect . width > this . widePopup ) { if ( this . applyVerticalPositioning ( ) ) { return ; } } //if the popup is long then use horizontal positioning else if ( clientRect . height > this . longPopup ) { if ( this . applyHorizontalPositioning ( ) ) { return ; } } //Rule 4 - Favor top or bottom positioning if ( this . applyVerticalPositioning ( ) ) { return ; } //but if thats not possible try horizontal else if ( this . applyHorizontalPositioning ( ) ) { return ; } //Rule 5 - no specific logic below for this rule since it is built into the vertical position functions, ie we attempt to //         use a bottom position for the popup as much possible. } }
Adjusts the popup position + nub location & direction.

ContextualPopup positioning rules:

1. Activator Location:
1. If activator is located in a corner then position using a flush style.
1. Attempt vertical first.
2. Horizontal if vertical doesn't fit.
2. If not in a corner then check if the activator is located in one of the 4 "edges"
of the view & position the following way if so:
1.   Activator is in top edge, position popup below it.
2.  Activator is in bottom edge, position popup above it.
3. Activator is in left edge, position popup to the right of it.
4.  Activator is in right edge, position popup to the left of it.

2. Screen Size - the popup should generally extend in the direction where there’s room
for it.

Note: no specific logic below for this rule since it is built into the positioning
functions, ie we attempt to never position a popup where there isn't enough room for
it.

3. Popup Size:

1. If popup content is wide, use top or bottom positioning.
2. If popup content is long, use horizontal positioning.

4. Favor top or bottom:

If all the above rules have been followed and location can still vary then favor top
or bottom positioning.

5. If top or bottom will work, favor bottom.

Note: There is no specific logic below for this rule since it is built into the
vertical position functions, i.e., we attempt to use a bottom position for the popup
as much as possible. Additionally, within the vertical position function, we center
the popup if the activator is at the vertical center of the view.

@private
Adjusts the popup position + nub location & direction .