Skip to content
This repository
Browse code

first pass at popup simplification

  • Loading branch information...
commit 7a14e1588977d835c72b5a62217d413cbba315be 1 parent f32843c
John Bender authored August 23, 2012

Showing 1 changed file with 41 additions and 141 deletions. Show diff stats Hide diff stats

  1. 182  js/widgets/popup.js
182  js/widgets/popup.js
@@ -117,12 +117,6 @@ define( [ "jquery",
117 117
 			}
118 118
 		},
119 119
 
120  
-		_closeOnScreenVClick: function( e ) {
121  
-			if ( e.target === this._ui.screen[ 0 ] ) {
122  
-				return this._eatEventAndClose( e );
123  
-			}
124  
-		},
125  
-
126 120
 		_create: function() {
127 121
 			var ui = {
128 122
 					screen: $( "<div class='ui-screen-hidden ui-popup-screen fade'></div>" ),
@@ -148,8 +142,8 @@ define( [ "jquery",
148 142
 				ui.placeholder.html( "<!-- placeholder for " + myId + " -->" );
149 143
 			}
150 144
 			ui.container.append( this.element );
151  
-			
152  
-			// Add class to popup element 
  145
+
  146
+			// Add class to popup element
153 147
 			this.element.addClass( "ui-popup" );
154 148
 
155 149
 			// Define instance variables
@@ -341,14 +335,14 @@ define( [ "jquery",
341 335
 
342 336
 			// Make sure the top of the menu is visible
343 337
 			ret.y = Math.max( 0, ret.y );
344  
-			
  338
+
345 339
 			// If the height of the menu is smaller than the height of the document
346 340
 			// align the bottom with the bottom of the document
347  
-			
  341
+
348 342
 			// fix for $( document ).height() bug in core 1.7.2.
349 343
 			var docEl = document.documentElement, docBody = document.body,
350 344
 				docHeight = Math.max( docEl.clientHeight, docBody.scrollHeight, docBody.offsetHeight, docEl.scrollHeight, docEl.offsetHeight );
351  
-			
  345
+
352 346
 			ret.y -= Math.min( ret.y, Math.max( 0, ret.y + menuSize.cy - docHeight ) );
353 347
 
354 348
 			return { left: ret.x, top: ret.y };
@@ -478,6 +472,8 @@ define( [ "jquery",
478 472
 		_open: function( options ) {
479 473
 			var coords, transition;
480 474
 
  475
+			$.mobile.popup.active = this;
  476
+
481 477
 			// Make sure options is defined
482 478
 			options = ( options || {} );
483 479
 
@@ -564,6 +560,9 @@ define( [ "jquery",
564 560
 				applyTransition: true,
565 561
 				prereqs: this._prereqs
566 562
 			});
  563
+
  564
+			// remove the global mutex for popups
  565
+			$.mobile.popup.active = undefined;
567 566
 		},
568 567
 
569 568
 		_destroy: function() {
@@ -584,150 +583,50 @@ define( [ "jquery",
584 583
 			});
585 584
 		},
586 585
 
587  
-		open: function( options ) {
588  
-			$.mobile.popup.popupManager.push( this, arguments );
589  
-		},
590  
-
591  
-		close: function() {
592  
-			$.mobile.popup.popupManager.pop( this );
593  
-		}
594  
-	});
595  
-
596  
-	// Popup manager, whose policy is to ignore requests for opening popups when a popup is already in
597  
-	// the process of opening, or already open
598  
-	$.mobile.popup.popupManager = {
599  
-		_currentlyOpenPopup: null,
600  
-		_popupIsOpening: false,
601  
-		_popupIsClosing: false,
602  
-		_abort: false,
603  
-
604  
-		_handlePageBeforeChange: function( e, data ) {
605  
-			var parsedDst, toUrl;
606  
-
607  
-			if ( typeof data.toPage === "string" ) {
608  
-				parsedDst = data.toPage;
609  
-			} else {
610  
-				parsedDst = data.toPage.jqmData( "url" );
611  
-			}
612  
-			parsedDst = $.mobile.path.parseUrl( parsedDst );
613  
-			toUrl = parsedDst.pathname + parsedDst.search + parsedDst.hash;
614  
-
615  
-			if ( this._myUrl !== toUrl ) {
616  
-				this._navUnhook( true );
617  
-			}
618  
-		},
619 586
 
620  
-		// Call _onHashChange if the hash changes /after/ the popup is on the screen
621  
-		// Note that placing the popup on the screen can itself cause a hashchange,
622  
-		// because the dialogHashKey may need to be added to the URL.
623  
-		_navHook: function( whenHooked ) {
624  
-			var self = this, dstHash;
625  
-			function realInstallListener() {
626  
-				$( window ).one( "navigate.popup", function() {
627  
-					self._onHashChange();
628  
-				});
629  
-				whenHooked();
  587
+		open: function( options ) {
  588
+			// make sure open is idempotent
  589
+			if( $.mobile.popup.active ) {
  590
+				return;
630 591
 			}
631 592
 
632  
-			self._myUrl = $.mobile.activePage.jqmData( "url" );
633  
-			$.mobile.pageContainer.one( "pagebeforechange.popup", $.proxy( this, "_handlePageBeforeChange" ) );
634  
-			if ( $.mobile.hashListeningEnabled ) {
635  
-				var activeEntry = $.mobile.urlHistory.getActive(),
636  
-					dstTransition,
637  
-					currentIsDialog = $.mobile.activePage.is( ".ui-dialog" ),
638  
-					hasHash = ( activeEntry.url.indexOf( $.mobile.dialogHashKey ) > -1 ) && !currentIsDialog;
639  
-
640  
-				if ( $.mobile.urlHistory.activeIndex === 0 ) {
641  
-					dstTransition = $.mobile.defaultDialogTransition;
642  
-				} else {
643  
-					dstTransition = activeEntry.transition;
644  
-				}
645  
-
646  
-				if ( hasHash ) {
647  
-					realInstallListener();
648  
-				} else {
649  
-					$( window ).one( "navigate.popupBinder", function() {
650  
-						realInstallListener();
651  
-					});
652  
-					dstHash = activeEntry.url + $.mobile.dialogHashKey;
653  
-					if ( $.mobile.urlHistory.activeIndex === 0 && dstHash === $.mobile.urlHistory.initialDst ) {
654  
-						dstHash += $.mobile.dialogHashKey;
655  
-					}
656  
-					$.mobile.urlHistory.ignoreNextHashChange = currentIsDialog;
657  
-					$.mobile.urlHistory.addNew( dstHash, dstTransition, activeEntry.title, activeEntry.pageUrl, activeEntry.role );
658  
-					$.mobile.path.set( dstHash );
659  
-				}
660  
-			} else {
661  
-				whenHooked();
662  
-			}
663  
-		},
  593
+			var self = this, url = $.mobile.activePage.jqmData( "url" ), newUrl;
664 594
 
665  
-		_navUnhook: function( abort ) {
666  
-			if ( abort ) {
667  
-				$( window ).unbind( "navigate.popupBinder navigate.popup" );
  595
+			// if the current url has no dialog hash key proceed as normal
  596
+			// otherwise, if the page is a dialog simply tack on the hash key
  597
+			if ( url.indexOf( $.mobile.dialogHashKey ) == -1 ) {
  598
+				newUrl = url + $.mobile.dialogHashKey;
  599
+			} else if ( $.mobile.activePage.is( ".ui-dialog" ) ) {
  600
+				newUrl = $.mobile.path.parseLocation().hash + $.mobile.dialogHashKey;
668 601
 			}
669 602
 
670  
-			if ( $.mobile.hashListeningEnabled && !abort ) {
671  
-				window.history.back();
672  
-			}
673  
-			else {
674  
-				this._onHashChange( abort );
675  
-			}
676  
-			$.mobile.activePage.unbind( "pagebeforechange.popup" );
677  
-		},
  603
+			// make sure the popup is displayed
  604
+			this._open();
678 605
 
679  
-		push: function( popup, args ) {
680  
-			var self = this;
  606
+			// Gotta love methods with 1mm args :(
  607
+			$.mobile.urlHistory.addNew( newUrl, undefined, undefined, undefined, "dialog" );
681 608
 
682  
-			if ( !self._currentlyOpenPopup ) {
683  
-				self._currentlyOpenPopup = popup;
  609
+			// swallow the the initial navigation event, and bind for the next
  610
+			$.mobile.pageContainer.one( "navigate.popup", function( e ) {
  611
+				e.preventDefault();
684 612
 
685  
-				self._navHook(function() {
686  
-					self._popupIsOpening = true;
687  
-					self._currentlyOpenPopup.element.one( "popupafteropen", function() {
688  
-						self._popupIsOpening = false;
689  
-					});
690  
-					self._currentlyOpenPopup._open.apply( self._currentlyOpenPopup, args );
691  
-					if ( !self._popupIsOpening && self._abort ) {
692  
-						self._currentlyOpenPopup._immediate();
693  
-					}
  613
+				// any navigation event after a popup is opened should close the popup
  614
+				$.mobile.pageContainer.one( "navigate.popup", function() {
  615
+					self._close();
694 616
 				});
695  
-			}
696  
-		},
697  
-
698  
-		pop: function( popup ) {
699  
-			if ( popup === this._currentlyOpenPopup && !this._popupIsClosing ) {
700  
-				this._popupIsClosing = true;
701  
-				if ( this._popupIsOpening ) {
702  
-					this._currentlyOpenPopup.element.one( "popupafteropen", $.proxy( this, "_navUnhook" ) );
703  
-				} else {
704  
-					this._navUnhook();
705  
-				}
706  
-			}
707  
-		},
  617
+			});
708 618
 
709  
-		_handlePopupAfterClose: function() {
710  
-			this._popupIsClosing = false;
711  
-			this._currentlyOpenPopup = null;
712  
-			$( this ).trigger( "done" );
  619
+			// set the new url with (or without) the new dialog hash key
  620
+			$.mobile.path.set( newUrl );
713 621
 		},
714 622
 
715  
-		_onHashChange: function( immediate ) {
716  
-			this._abort = immediate;
717  
-
718  
-			if ( this._currentlyOpenPopup ) {
719  
-				if ( immediate && this._popupIsOpening ) {
720  
-					this._currentlyOpenPopup._immediate();
721  
-				}
722  
-				this._popupIsClosing = true;
723  
-				this._currentlyOpenPopup.element.one( "popupafterclose", $.proxy( this, "_handlePopupAfterClose" ) );
724  
-				this._currentlyOpenPopup._close();
725  
-				if ( immediate && this._currentlyOpenPopup ) {
726  
-					this._currentlyOpenPopup._immediate();
727  
-				}
  623
+		close: function() {
  624
+			// make sure close is idempotent
  625
+			if( $.mobile.popup.active ){
  626
+				window.history.back();
728 627
 			}
729 628
 		}
730  
-	};
  629
+	});
731 630
 
732 631
 	$.mobile.popup.handleLink = function( $link ) {
733 632
 		var closestPage = $link.closest( ":jqmData(role='page')" ),
@@ -741,7 +640,8 @@ define( [ "jquery",
741 640
 				x: offset.left + $link.outerWidth() / 2,
742 641
 				y: offset.top + $link.outerHeight() / 2,
743 642
 				transition: $link.jqmData( "transition" ),
744  
-				positionTo: $link.jqmData( "position-to" )
  643
+				positionTo: $link.jqmData( "position-to" ),
  644
+				link: $link
745 645
 			});
746 646
 
747 647
 			// If this link is not inside a popup, re-focus onto it after the popup(s) complete

0 notes on commit 7a14e15

Please sign in to comment.
Something went wrong with that request. Please try again.