public inbox for [email protected]  
help / color / mirror / Atom feed
Remove hacky way to open/close the dropdown-submenu
8+ messages / 3 participants
[nested] [flat]

* Remove hacky way to open/close the dropdown-submenu
@ 2019-01-17 14:09 Ashesh Vashi <[email protected]>
  2019-01-22 04:37 ` Re: Remove hacky way to open/close the dropdown-submenu Ashesh Vashi <[email protected]>
  0 siblings, 1 reply; 8+ messages in thread

From: Ashesh Vashi @ 2019-01-17 14:09 UTC (permalink / raw)
  To: Aditya Toshniwal <[email protected]>; khushboo.vashi <[email protected]>; +Cc: pgadmin-hackers

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;


Attachments:

  [application/octet-stream] pgadmin_submenu_open.patch (2.9K, 3-pgadmin_submenu_open.patch)
  download | inline diff:
diff --git a/web/pgadmin/browser/static/js/browser.js b/web/pgadmin/browser/static/js/browser.js
index cc2ea05..91a081b 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..4db2b12 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) {
@@ -443,11 +418,21 @@ 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;
 });


^ permalink  raw  reply  [nested|flat] 8+ messages in thread

* Re: Remove hacky way to open/close the dropdown-submenu
  2019-01-17 14:09 Remove hacky way to open/close the dropdown-submenu Ashesh Vashi <[email protected]>
@ 2019-01-22 04:37 ` Ashesh Vashi <[email protected]>
  2019-01-22 04:55   ` Re: Remove hacky way to open/close the dropdown-submenu Aditya Toshniwal <[email protected]>
  0 siblings, 1 reply; 8+ messages in thread

From: Ashesh Vashi @ 2019-01-22 04:37 UTC (permalink / raw)
  To: Aditya Toshniwal <[email protected]>; khushboo.vashi <[email protected]>; +Cc: pgadmin-hackers

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;
>


^ permalink  raw  reply  [nested|flat] 8+ messages in thread

* Re: Remove hacky way to open/close the dropdown-submenu
  2019-01-17 14:09 Remove hacky way to open/close the dropdown-submenu Ashesh Vashi <[email protected]>
  2019-01-22 04:37 ` Re: Remove hacky way to open/close the dropdown-submenu Ashesh Vashi <[email protected]>
@ 2019-01-22 04:55   ` Aditya Toshniwal <[email protected]>
  2019-01-31 06:02     ` Re: Remove hacky way to open/close the dropdown-submenu Ashesh Vashi <[email protected]>
  0 siblings, 1 reply; 8+ messages in thread

From: Aditya Toshniwal @ 2019-01-22 04:55 UTC (permalink / raw)
  To: Ashesh Vashi <[email protected]>; +Cc: khushboo.vashi <[email protected]>; pgadmin-hackers

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.

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"


^ permalink  raw  reply  [nested|flat] 8+ messages in thread

* Re: Remove hacky way to open/close the dropdown-submenu
  2019-01-17 14:09 Remove hacky way to open/close the dropdown-submenu Ashesh Vashi <[email protected]>
  2019-01-22 04:37 ` Re: Remove hacky way to open/close the dropdown-submenu Ashesh Vashi <[email protected]>
  2019-01-22 04:55   ` Re: Remove hacky way to open/close the dropdown-submenu Aditya Toshniwal <[email protected]>
@ 2019-01-31 06:02     ` Ashesh Vashi <[email protected]>
  2019-01-31 09:08       ` Re: Remove hacky way to open/close the dropdown-submenu Aditya Toshniwal <[email protected]>
  0 siblings, 1 reply; 8+ messages in thread

From: Ashesh Vashi @ 2019-01-31 06:02 UTC (permalink / raw)
  To: Aditya Toshniwal <[email protected]>; +Cc: khushboo.vashi <[email protected]>; pgadmin-hackers

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;
 });


^ permalink  raw  reply  [nested|flat] 8+ messages in thread

* Re: Remove hacky way to open/close the dropdown-submenu
  2019-01-17 14:09 Remove hacky way to open/close the dropdown-submenu Ashesh Vashi <[email protected]>
  2019-01-22 04:37 ` Re: Remove hacky way to open/close the dropdown-submenu Ashesh Vashi <[email protected]>
  2019-01-22 04:55   ` Re: Remove hacky way to open/close the dropdown-submenu Aditya Toshniwal <[email protected]>
  2019-01-31 06:02     ` Re: Remove hacky way to open/close the dropdown-submenu Ashesh Vashi <[email protected]>
@ 2019-01-31 09:08       ` Aditya Toshniwal <[email protected]>
  2019-01-31 10:04         ` Re: Remove hacky way to open/close the dropdown-submenu Ashesh Vashi <[email protected]>
  0 siblings, 1 reply; 8+ messages in thread

From: Aditya Toshniwal @ 2019-01-31 09:08 UTC (permalink / raw)
  To: Ashesh Vashi <[email protected]>; +Cc: khushboo.vashi <[email protected]>; pgadmin-hackers

Hi Ashesh,

All works good, except one small change. Submenus should be closed if I
press Esc and then reopen the menu.

On Thu, Jan 31, 2019 at 11:32 AM Ashesh Vashi <[email protected]>
wrote:

> 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"
>>
>

-- 
Thanks and Regards,
Aditya Toshniwal
Software Engineer | EnterpriseDB Software Solutions | Pune
"Don't Complain about Heat, Plant a tree"


^ permalink  raw  reply  [nested|flat] 8+ messages in thread

* Re: Remove hacky way to open/close the dropdown-submenu
  2019-01-17 14:09 Remove hacky way to open/close the dropdown-submenu Ashesh Vashi <[email protected]>
  2019-01-22 04:37 ` Re: Remove hacky way to open/close the dropdown-submenu Ashesh Vashi <[email protected]>
  2019-01-22 04:55   ` Re: Remove hacky way to open/close the dropdown-submenu Aditya Toshniwal <[email protected]>
  2019-01-31 06:02     ` Re: Remove hacky way to open/close the dropdown-submenu Ashesh Vashi <[email protected]>
  2019-01-31 09:08       ` Re: Remove hacky way to open/close the dropdown-submenu Aditya Toshniwal <[email protected]>
@ 2019-01-31 10:04         ` Ashesh Vashi <[email protected]>
  2019-01-31 10:34           ` Re: Remove hacky way to open/close the dropdown-submenu Aditya Toshniwal <[email protected]>
  0 siblings, 1 reply; 8+ messages in thread

From: Ashesh Vashi @ 2019-01-31 10:04 UTC (permalink / raw)
  To: Aditya Toshniwal <[email protected]>; +Cc: khushboo.vashi <[email protected]>; pgadmin-hackers

On Thu, Jan 31, 2019 at 2:38 PM Aditya Toshniwal <
[email protected]> wrote:

> Hi Ashesh,
>
> All works good, except one small change. Submenus should be closed if I
> press Esc and then reopen the menu.
>
Please find the updated patch to resolve the review comments.

-- Thanks, Ashesh

>
> On Thu, Jan 31, 2019 at 11:32 AM Ashesh Vashi <
> [email protected]> wrote:
>
>> 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"
>>>
>>
>
> --
> 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_v3.patch (3.4K, 3-pgadmin_submenu_open_v3.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..1de333b 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,7 @@ define([
       ev.preventDefault();
       return false;
     }
+
     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 +419,27 @@ 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');
+    })
+    .on('hidden.bs.dropdown', function(ev) {
+      $(ev.target)
+        .find('.dropdown-submenu.dropdown-submenu-visible')
+        .removeClass('dropdown-submenu-visible')
+        .find('.dropdown-menu.show')
+        .removeClass('show');
+    });
 
   return pgAdmin.Browser.MenuItem;
 });


^ permalink  raw  reply  [nested|flat] 8+ messages in thread

* Re: Remove hacky way to open/close the dropdown-submenu
  2019-01-17 14:09 Remove hacky way to open/close the dropdown-submenu Ashesh Vashi <[email protected]>
  2019-01-22 04:37 ` Re: Remove hacky way to open/close the dropdown-submenu Ashesh Vashi <[email protected]>
  2019-01-22 04:55   ` Re: Remove hacky way to open/close the dropdown-submenu Aditya Toshniwal <[email protected]>
  2019-01-31 06:02     ` Re: Remove hacky way to open/close the dropdown-submenu Ashesh Vashi <[email protected]>
  2019-01-31 09:08       ` Re: Remove hacky way to open/close the dropdown-submenu Aditya Toshniwal <[email protected]>
  2019-01-31 10:04         ` Re: Remove hacky way to open/close the dropdown-submenu Ashesh Vashi <[email protected]>
@ 2019-01-31 10:34           ` Aditya Toshniwal <[email protected]>
  2019-01-31 12:21             ` Re: Remove hacky way to open/close the dropdown-submenu Akshay Joshi <[email protected]>
  0 siblings, 1 reply; 8+ messages in thread

From: Aditya Toshniwal @ 2019-01-31 10:34 UTC (permalink / raw)
  To: Ashesh Vashi <[email protected]>; +Cc: khushboo.vashi <[email protected]>; pgadmin-hackers

Hi Ashesh,

The patch looks good to me.

On Thu, Jan 31, 2019 at 3:34 PM Ashesh Vashi <[email protected]>
wrote:

> On Thu, Jan 31, 2019 at 2:38 PM Aditya Toshniwal <
> [email protected]> wrote:
>
>> Hi Ashesh,
>>
>> All works good, except one small change. Submenus should be closed if I
>> press Esc and then reopen the menu.
>>
> Please find the updated patch to resolve the review comments.
>
> -- Thanks, Ashesh
>
>>
>> On Thu, Jan 31, 2019 at 11:32 AM Ashesh Vashi <
>> [email protected]> wrote:
>>
>>> 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"
>>>>
>>>
>>
>> --
>> Thanks and Regards,
>> Aditya Toshniwal
>> Software Engineer | EnterpriseDB Software Solutions | Pune
>> "Don't Complain about Heat, Plant a tree"
>>
>

-- 
Thanks and Regards,
Aditya Toshniwal
Software Engineer | EnterpriseDB Software Solutions | Pune
"Don't Complain about Heat, Plant a tree"


^ permalink  raw  reply  [nested|flat] 8+ messages in thread

* Re: Remove hacky way to open/close the dropdown-submenu
  2019-01-17 14:09 Remove hacky way to open/close the dropdown-submenu Ashesh Vashi <[email protected]>
  2019-01-22 04:37 ` Re: Remove hacky way to open/close the dropdown-submenu Ashesh Vashi <[email protected]>
  2019-01-22 04:55   ` Re: Remove hacky way to open/close the dropdown-submenu Aditya Toshniwal <[email protected]>
  2019-01-31 06:02     ` Re: Remove hacky way to open/close the dropdown-submenu Ashesh Vashi <[email protected]>
  2019-01-31 09:08       ` Re: Remove hacky way to open/close the dropdown-submenu Aditya Toshniwal <[email protected]>
  2019-01-31 10:04         ` Re: Remove hacky way to open/close the dropdown-submenu Ashesh Vashi <[email protected]>
  2019-01-31 10:34           ` Re: Remove hacky way to open/close the dropdown-submenu Aditya Toshniwal <[email protected]>
@ 2019-01-31 12:21             ` Akshay Joshi <[email protected]>
  0 siblings, 0 replies; 8+ messages in thread

From: Akshay Joshi @ 2019-01-31 12:21 UTC (permalink / raw)
  To: Aditya Toshniwal <[email protected]>; +Cc: Ashesh Vashi <[email protected]>; khushboo.vashi <[email protected]>; pgadmin-hackers

Thanks patch applied.

On Thu, Jan 31, 2019 at 4:05 PM Aditya Toshniwal <
[email protected]> wrote:

> Hi Ashesh,
>
> The patch looks good to me.
>
> On Thu, Jan 31, 2019 at 3:34 PM Ashesh Vashi <
> [email protected]> wrote:
>
>> On Thu, Jan 31, 2019 at 2:38 PM Aditya Toshniwal <
>> [email protected]> wrote:
>>
>>> Hi Ashesh,
>>>
>>> All works good, except one small change. Submenus should be closed if I
>>> press Esc and then reopen the menu.
>>>
>> Please find the updated patch to resolve the review comments.
>>
>> -- Thanks, Ashesh
>>
>>>
>>> On Thu, Jan 31, 2019 at 11:32 AM Ashesh Vashi <
>>> [email protected]> wrote:
>>>
>>>> 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"
>>>>>
>>>>
>>>
>>> --
>>> Thanks and Regards,
>>> Aditya Toshniwal
>>> Software Engineer | EnterpriseDB Software Solutions | Pune
>>> "Don't Complain about Heat, Plant a tree"
>>>
>>
>
> --
> Thanks and Regards,
> Aditya Toshniwal
> Software Engineer | EnterpriseDB Software Solutions | Pune
> "Don't Complain about Heat, Plant a tree"
>


-- 
*Akshay Joshi*

*Sr. Software Architect *



*Phone: +91 20-3058-9517Mobile: +91 976-788-8246*


^ permalink  raw  reply  [nested|flat] 8+ messages in thread


end of thread, other threads:[~2019-01-31 12:21 UTC | newest]

Thread overview: 8+ messages (download: mbox mbox.gz follow: Atom feed)
-- links below jump to the message on this page --
2019-01-17 14:09 Remove hacky way to open/close the dropdown-submenu Ashesh Vashi <[email protected]>
2019-01-22 04:37 ` Ashesh Vashi <[email protected]>
2019-01-22 04:55   ` Aditya Toshniwal <[email protected]>
2019-01-31 06:02     ` Ashesh Vashi <[email protected]>
2019-01-31 09:08       ` Aditya Toshniwal <[email protected]>
2019-01-31 10:04         ` Ashesh Vashi <[email protected]>
2019-01-31 10:34           ` Aditya Toshniwal <[email protected]>
2019-01-31 12:21             ` Akshay Joshi <[email protected]>

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