public inbox for [email protected]  
help / color / mirror / Atom feed
From: Ashesh Vashi <[email protected]>
To: Aditya Toshniwal <[email protected]>
Cc: khushboo.vashi <[email protected]>
Cc: pgadmin-hackers <[email protected]>
Subject: Re: Remove hacky way to open/close the dropdown-submenu
Date: Thu, 31 Jan 2019 11:32:10 +0530
Message-ID: <CAG7mmozihuG=Vsn0s_P5wqtZtrB-SjsafFF4NuYiCz=KvADebA@mail.gmail.com> (raw)
In-Reply-To: <CAM9w-_n0JOZ4nCFPVUput8XX41f6CwG7eUuBLxtSP0Rsa8-AXw@mail.gmail.com>
References: <CAG7mmoy_yxF8V842aPYKKzpT4+JEikFwhai8MpQXw_ABqSfp0g@mail.gmail.com>
	<CAG7mmoz4zg5o0JDCPEVjAi9hCsCVFTuNuvaWDNx+jB9CyT+Gdw@mail.gmail.com>
	<CAM9w-_n0JOZ4nCFPVUput8XX41f6CwG7eUuBLxtSP0Rsa8-AXw@mail.gmail.com>

Hi Aditya,

On Tue, Jan 22, 2019 at 10:25 AM Aditya Toshniwal <
[email protected]> wrote:

> Hi Ashesh,
>
> I am getting a syntax error on bundle.
> After fixing that,  please look into this scenario:
> Using keyboard shortcuts open object menu, for eg on table node. Go to any
> submenu using keyboard and go to any submenu and press enter.
> Now open object menu again using keyboard shortcut, the submenu remains
> open. It should be closed.
>
Please find the updated patch with all comments fixed.
Now - whenever the callback for the menu is called (menu toggling), it will
close the existing submenu(s) too.

Please review it, and let me know.

--

Thanks & Regards,

Ashesh Vashi
EnterpriseDB INDIA: Enterprise PostgreSQL Company
<http://www.enterprisedb.com/;


*http://www.linkedin.com/in/asheshvashi
<http://www.linkedin.com/in/asheshvashi>*


>
> Everything looks fine to me except the above.
>
>
> On Tue, Jan 22, 2019 at 10:07 AM Ashesh Vashi <
> [email protected]> wrote:
>
>> Any update?
>>
>> --
>>
>> Thanks & Regards,
>>
>> Ashesh Vashi
>> EnterpriseDB INDIA: Enterprise PostgreSQL Company
>> <http://www.enterprisedb.com;
>>
>>
>> *http://www.linkedin.com/in/asheshvashi*
>> <http://www.linkedin.com/in/asheshvashi;
>>
>>
>> On Thu, Jan 17, 2019 at 7:39 PM Ashesh Vashi <
>> [email protected]> wrote:
>>
>>> Hi Aditya/Khushboo,
>>>
>>> I can see a hacky way to open/close the dropdown-submenu in the menu.js
>>> file.
>>> I've followed a more general way to open/close any submenu in the
>>> dropdown list, instead of just 'Objects' menu.
>>>
>>> Can you please review it, and let me know your thoughts?
>>> Let me know if you have any other better approach.
>>>
>>>
>>> --
>>>
>>> Thanks & Regards,
>>>
>>> Ashesh Vashi
>>> EnterpriseDB INDIA: Enterprise PostgreSQL Company
>>> <http://www.enterprisedb.com;
>>>
>>>
>>> *http://www.linkedin.com/in/asheshvashi*
>>> <http://www.linkedin.com/in/asheshvashi;
>>>
>>
>
> --
> Thanks and Regards,
> Aditya Toshniwal
> Software Engineer | EnterpriseDB Software Solutions | Pune
> "Don't Complain about Heat, Plant a tree"
>


Attachments:

  [application/octet-stream] pgadmin_submenu_open_v2.patch (3.5K, 3-pgadmin_submenu_open_v2.patch)
  download | inline diff:
diff --git a/web/pgadmin/browser/static/js/browser.js b/web/pgadmin/browser/static/js/browser.js
index 2accd18..5199bc8 100644
--- a/web/pgadmin/browser/static/js/browser.js
+++ b/web/pgadmin/browser/static/js/browser.js
@@ -349,7 +349,6 @@ define('pgadmin.browser', [
           }], false);
         $obj_mnu.append(create_submenu.$el);
       }
-      pgAdmin.Browser.SubmenuEvents($obj_mnu);
     },
     save_current_layout: function(obj) {
       if(obj.docker) {
diff --git a/web/pgadmin/browser/static/js/menu.js b/web/pgadmin/browser/static/js/menu.js
index 5c509da..7daad3f 100644
--- a/web/pgadmin/browser/static/js/menu.js
+++ b/web/pgadmin/browser/static/js/menu.js
@@ -347,31 +347,6 @@ define([
     return (len > 0);
   };
 
-  pgAdmin.Browser.SubmenuEvents = function($mnu) {
-    let subMenuClose = function(event) {
-      let $dropDown = $(event.currentTarget).closest('.dropdown');
-      $dropDown.find('.dropdown-submenu .dropdown-menu').removeClass('show');
-      $dropDown.find('.dropdown-submenu').removeClass('dropdown-submenu-visible');
-    };
-
-    let $navlink = $mnu.siblings('.nav-link');
-    $navlink.off('click', subMenuClose).on('click', subMenuClose);
-    $mnu.parent('.dropdown').off('show.bs.dropdown',subMenuClose)
-      .on('show.bs.dropdown',subMenuClose);
-
-    $mnu.find('.dropdown-item').off('mouseover').on('mouseover', (event)=> {
-      let $dropSubMenu = $(event.currentTarget).closest('.dropdown-menu').find('.dropdown-submenu');
-      /* Close all other submenus if any */
-      $dropSubMenu.find('.dropdown-menu').removeClass('show');
-      $dropSubMenu.removeClass('dropdown-submenu-visible');
-      /* Open the current submenu if any */
-      if($(event.currentTarget).parent().hasClass('dropdown-submenu')){
-        $(event.currentTarget).parent().find('.dropdown-menu').addClass('show');
-        $(event.currentTarget).parent().addClass('dropdown-submenu-visible');
-      }
-    });
-  };
-
   // MENU PUBLIC CLASS DEFINITION
   // ==============================
   var Menu = function(element, options) {
@@ -388,6 +363,17 @@ define([
       ev.preventDefault();
       return false;
     }
+
+    setTimeout(
+      () => (
+        this.$element.parents('.nav-item.dropdown')
+          .find('.dropdown-submenu.dropdown-submenu-visible')
+          .removeClass('dropdown-submenu-visible')
+          .find('.dropdown-menu.show')
+          .removeClass('show')
+      ), 1
+    );
+
     var d = this.$element.data('pgMenu');
     if (d.cb) {
       var cb = d.module && d.module['callbacks'] && d.module['callbacks'][d.cb] || d.module && d.module[d.cb];
@@ -443,11 +429,20 @@ define([
     .on(
       'focus.pg.menu.data-api blur.pg.menu.data-api',
       '[data-toggle^="pg-menu"]',
-      function(e) {
-        $(e.target).closest('.menu').toggleClass(
-          'focus', /^focus(in)?$/.test(e.type)
+      function(ev) {
+        $(ev.target).closest('.menu').toggleClass(
+          'focus', /^focus(in)?$/.test(ev.type)
         );
-      });
+      })
+    .on('mouseenter', '.dropdown-submenu', function(ev) {
+      $(ev.currentTarget).removeClass('dropdown-submenu-visible')
+        .addClass('dropdown-submenu-visible');
+      $(ev.currentTarget).find('.dropdown-menu').first().addClass('show');
+    })
+    .on('mouseleave', '.dropdown-submenu', function(ev) {
+      $(ev.currentTarget).removeClass('dropdown-submenu-visible');
+      $(ev.currentTarget).find('.dropdown-menu').first().removeClass('show');
+    });
 
   return pgAdmin.Browser.MenuItem;
 });


view thread (8+ messages)  latest in thread

reply

Reply instructions:

You may reply publicly to this message via plain-text email
using any one of the following methods:

* Reply to all the recipients using the --to and --cc options:
  reply via email

  To: [email protected]
  Cc: [email protected], [email protected], [email protected]
  Subject: Re: Remove hacky way to open/close the dropdown-submenu
  In-Reply-To: <CAG7mmozihuG=Vsn0s_P5wqtZtrB-SjsafFF4NuYiCz=KvADebA@mail.gmail.com>

* Save the following mbox file, import it into your mail client,
  and reply-to-all from there: mbox

This inbox is served by agora; see mirroring instructions
for how to clone and mirror all data and code used for this inbox