MDL-41238 atto - close menu style when clicking anywhere outside it

Andmat7 · Sep 6, 2013 · 21f6c52 · 21f6c52
1 parent b69ec28
commit 21f6c52
Show file tree

Hide file tree

Showing 4 changed files with 31 additions and 10 deletions.
diff --git a/lib/editor/atto/yui/build/moodle-editor_atto-editor/moodle-editor_atto-editor-debug.js b/lib/editor/atto/yui/build/moodle-editor_atto-editor/moodle-editor_atto-editor-debug.js
@@ -58,13 +58,21 @@ M.editor_atto = M.editor_atto || {
         var disabled = this.getAttribute('disabled');
         var overlayid = this.getAttribute('data-menu');
         var overlay = M.editor_atto.menus[overlayid];
-
+        var menu = overlay.get('bodyContent');
         if (overlay.get('visible') || disabled) {
             overlay.hide();
+            menu.detach('clickoutside');
         } else {
+            menu.on('clickoutside', function(ev) {
+                if (ev.target.ancestor() !== this) {
+                    if (overlay.get('visible')) {
+                        menu.detach('clickoutside');
+                        overlay.hide();
+                    }
+                }
+            }, this);
             overlay.show();
         }
-
     },
 
     /**
@@ -163,7 +171,6 @@ M.editor_atto = M.editor_atto || {
 
         var menu = Y.Node.create('<div class="atto_' + plugin + '_menu' +
                                  ' atto_menu" data-editor="' + Y.Escape.html(elementid) + '"></div>');
-
         var i = 0, entry = {};
 
         for (i = 0; i < entries.length; i++) {

diff --git a/lib/editor/atto/yui/build/moodle-editor_atto-editor/moodle-editor_atto-editor-min.js b/lib/editor/atto/yui/build/moodle-editor_atto-editor/moodle-editor_atto-editor-min.js
diff --git a/lib/editor/atto/yui/build/moodle-editor_atto-editor/moodle-editor_atto-editor.js b/lib/editor/atto/yui/build/moodle-editor_atto-editor/moodle-editor_atto-editor.js
@@ -58,13 +58,21 @@ M.editor_atto = M.editor_atto || {
         var disabled = this.getAttribute('disabled');
         var overlayid = this.getAttribute('data-menu');
         var overlay = M.editor_atto.menus[overlayid];
-
+        var menu = overlay.get('bodyContent');
         if (overlay.get('visible') || disabled) {
             overlay.hide();
+            menu.detach('clickoutside');
         } else {
+            menu.on('clickoutside', function(ev) {
+                if (ev.target.ancestor() !== this) {
+                    if (overlay.get('visible')) {
+                        menu.detach('clickoutside');
+                        overlay.hide();
+                    }
+                }
+            }, this);
             overlay.show();
         }
-
     },
 
     /**
@@ -163,7 +171,6 @@ M.editor_atto = M.editor_atto || {
 
         var menu = Y.Node.create('<div class="atto_' + plugin + '_menu' +
                                  ' atto_menu" data-editor="' + Y.Escape.html(elementid) + '"></div>');
-
         var i = 0, entry = {};
 
         for (i = 0; i < entries.length; i++) {

diff --git a/lib/editor/atto/yui/src/editor/js/editor.js b/lib/editor/atto/yui/src/editor/js/editor.js
@@ -56,13 +56,21 @@ M.editor_atto = M.editor_atto || {
         var disabled = this.getAttribute('disabled');
         var overlayid = this.getAttribute('data-menu');
         var overlay = M.editor_atto.menus[overlayid];
-
+        var menu = overlay.get('bodyContent');
         if (overlay.get('visible') || disabled) {
             overlay.hide();
+            menu.detach('clickoutside');
         } else {
+            menu.on('clickoutside', function(ev) {
+                if (ev.target.ancestor() !== this) {
+                    if (overlay.get('visible')) {
+                        menu.detach('clickoutside');
+                        overlay.hide();
+                    }
+                }
+            }, this);
             overlay.show();
         }
-
     },
 
     /**
@@ -161,7 +169,6 @@ M.editor_atto = M.editor_atto || {
 
         var menu = Y.Node.create('<div class="atto_' + plugin + '_menu' +
                                  ' atto_menu" data-editor="' + Y.Escape.html(elementid) + '"></div>');
-
         var i = 0, entry = {};
 
         for (i = 0; i < entries.length; i++) {