client: hide filter and layout menus on click on empty area. resolve partial #444

4 files changed, 35 insertions, 14 deletions

diff --git a/src/client/main.js b/src/client/main.js
index c5a81193..67981d9a 100644
--- a/src/client/main.js
+++ b/src/client/main.js
@@ -1,5 +1,5 @@
-define(['textanalysis.ui', 'textanalysis', 'buttons', 'history', 'drag_n_drop', 'robot', 'model/core', 'rz_core', 'view/selection', 'util', 'view/search', 'feedback', 'keyshortcuts'],
-function(textanalysis_ui,   textanalysis,   buttons,   history,   drag_n_drop,   robot,   model_core,   rz_core,        selection,   util,   search,        feedback,   keyshortcuts) {
+define(['textanalysis.ui', 'textanalysis', 'buttons', 'history', 'drag_n_drop', 'robot', 'model/core', 'rz_core', 'view/selection', 'util', 'view/search', 'feedback', 'keyshortcuts', 'view/filter_menu'],
+function(textanalysis_ui,   textanalysis,   buttons,   history,   drag_n_drop,   robot,   model_core,   rz_core,        selection,   util,   search,        feedback,   keyshortcuts,        filter_menu) {
 
     function fix_feedback_scrolling_to_visibility_causing_topbar_to_slide_slowly_in_webkit() {
         $('.feedback-btn').attr('tabindex', -1);
@@ -43,6 +43,7 @@ function(textanalysis_ui,   textanalysis,   buttons,   history,   drag_n_drop,
         rz_core.init();
         textanalysis.init(rz_core.main_graph);
         search.init();
+        filter_menu.init();
         selection.setup_toolbar(rz_core.main_graph);
         $.feedback({ajaxURL: rz_config.feedback_url});
         fix_feedback_scrolling_to_visibility_causing_topbar_to_slide_slowly_in_webkit();
diff --git a/src/client/rz_core.js b/src/client/rz_core.js
index cee60a29..dea53292 100644
--- a/src/client/rz_core.js
+++ b/src/client/rz_core.js
@@ -1,7 +1,7 @@
 "use strict"
 
-define(['jquery', 'd3', 'consts', 'rz_bus', 'util', 'model/graph', 'model/core', 'view/helpers', 'view/item_info', 'rz_observer', 'view/selection', 'rz_mesh', 'model/diff', "view/graph_view", 'view/svg_input'],
-function($,        d3,   consts,   rz_bus,   util,   model_graph,   model_core,   view_helpers,   item_info,        rz_observer,   selection,        rz_mesh,   model_diff,   graph_view,       svg_input) {
+define(['jquery', 'd3', 'consts', 'rz_bus', 'util', 'model/graph', 'model/core', 'view/helpers', 'view/item_info', 'rz_observer', 'view/selection', 'rz_mesh', 'model/diff', "view/graph_view", 'view/svg_input', 'view/filter_menu'],
+function($,        d3,   consts,   rz_bus,   util,   model_graph,   model_core,   view_helpers,   item_info,        rz_observer,   selection,        rz_mesh,   model_diff,   graph_view,       svg_input,              filter_menu) {
 
 var addednodes = [],
     vis,
@@ -41,7 +41,9 @@ function svg_click_handler(e) {
     }
     svgInput.hide();
     selection.clear();
-    item_info.hide();
+    item_info.hide(false);
+    filter_menu.hide();
+    main_graph_view.hide_layout_menu();
     update_view__graph(false);
 }
 
diff --git a/src/client/view/filter_menu.js b/src/client/view/filter_menu.js
new file mode 100644
index 00000000..d7e95a98
--- /dev/null
+++ b/src/client/view/filter_menu.js
@@ -0,0 +1,17 @@
+define(['jquery'],
+function($) {
+    
+var open_button = $('#btn_filter'),
+    menu = $('#menu__type-filter');
+
+return {
+    init: function () {
+        open_button.on('click', function (e) {
+            menu.toggle();
+        });
+    },
+    hide: function () {
+        menu.hide();
+    },
+};
+});
diff --git a/src/client/view/graph_view.js b/src/client/view/graph_view.js
index f6be8ebf..564c3a25 100644
--- a/src/client/view/graph_view.js
+++ b/src/client/view/graph_view.js
@@ -91,6 +91,8 @@ function GraphView(spec) {
         zoom_obj_element = spec.zoom_obj_element,
         parent_graph_zoom_obj = spec.parent_graph_zoom_obj,
 
+        layout_menu = $('#btn_layout'),
+
         zoomInProgress = false,
         layout,
         drag,
@@ -152,9 +154,6 @@ function GraphView(spec) {
                 console.log(filter_states);
                 update_view(true);
             });
-            $('#btn_filter').on('click', function (e) {
-                $('#menu__type-filter').toggle();
-            });
         });
     }
 
@@ -1194,11 +1193,10 @@ function GraphView(spec) {
         return layout_data.create(graph);
     });
 
-    function set_layout_toolbar(selector) {
-        var root = $(selector);
-        root.on('click', function() {
+    function set_layout_toolbar() {
+        layout_menu.on('click', function() {
 
-            var layout_btns = $('.btn_layout');
+            var layout_btns = layout_menu.find('.btn_layout');
             if (layout_btns.length > 0) { // menu open
                 layout_btns.remove();
                 return;
@@ -1215,7 +1213,7 @@ function GraphView(spec) {
                     set_layout(button_layout);
                     layout_btns.remove();
                 });
-                root.append(button);
+                layout_menu.append(button);
             });
         });
     }
@@ -1241,7 +1239,10 @@ function GraphView(spec) {
 
     set_layout(temporary ? view_layouts.empty(graph) : layouts[0]);
     if (!temporary) {
-        set_layout_toolbar('#btn_layout');
+        set_layout_toolbar(layout_menu);
+        gv.hide_layout_menu = function () {
+            layout_menu.find('.btn_layout').remove();
+        }
     }
 
     gv.dev_set_layout = function (layout_func) {