Fixes #3094, Refs #3111. Clicking outside a popup closes the visible popups.

git-svn-id: http://code.elgg.org/elgg/trunk@8750 36083f99-b078-4883-b0ff-0f9b5a30f544

diff --git a/js/lib/ui.js b/js/lib/ui.js
index 0600eb0cbc25da24e0812364f3bb7ef26b68c4ea..5451dce73ae3725c003cc5e57b045dac7a06305f 100644 (file)
--- a/js/lib/ui.js
+++ b/js/lib/ui.js
@@ -61,6 +61,7 @@ elgg.ui.toggles = function(event) {
  */
 elgg.ui.popsUp = function(event) {
        event.preventDefault();
+       event.stopPropagation();
 
        var target = elgg.getUrlFragment($(this).toggleClass('elgg-state-active').attr('href'));
        var $target = $(target);
@@ -84,16 +85,62 @@ elgg.ui.popsUp = function(event) {
        if (!options) {
                return;
        }
-
+       
        // hide if already open
        if ($target.is(':visible')) {
                $target.fadeOut();
+               $('body').die('click', elgg.ui.popupClose);
                return;
        }
 
        $target.appendTo('body')
                .fadeIn()
                .position(options);
+
+       $('body')
+               .die('click', elgg.ui.popupClose)
+               .live('click', elgg.ui.popupClose);
+}
+
+/**
+ * Catches clicks that aren't in a popup and closes all popups.
+ */
+elgg.ui.popupClose = function(event) {
+       event.preventDefault();
+       event.stopPropagation();
+       
+       $eventTarget = $(event.target);
+       var inTarget = false;
+       var $popups = $('[rel=popup]');
+
+       // if the click event target isn't in a popup target, fade all of them out.
+       $popups.each(function(i, e) {
+               var target = elgg.getUrlFragment($(e).attr('href')) + ':visible';
+               var $target = $(target);
+
+               if (!$target.is(':visible')) {
+                       return;
+               }
+               
+               // didn't click inside the target
+               if ($eventTarget.closest(target).length > 0) {
+                       inTarget = true;
+                       return false;
+               }
+       });
+
+       if (!inTarget) {
+               $popups.each(function(i, e) {
+                       var $e = $(e);
+                       var $target = $(elgg.getUrlFragment($e.attr('href')) + ':visible');
+                       if ($target.length > 0) {
+                               $target.fadeOut();
+                               $e.removeClass('elgg-state-active');
+                       }
+               });
+
+               $('body').die('click', elgg.ui.popClose);
+       }
 }
 
 /**