Fix esc shortcut to close popups: checking priority as [data selector -> inner popup -> popup]

minjk-bl · minjk-bl · commit 1a45660bec22 · 2022-06-17T11:30:15.000+09:00
diff --git a/js/com/com_Event.js b/js/com/com_Event.js
@@ -207,11 +207,23 @@ define([], function() {
                             that.keyManager.keyCheck.shiftKey = false;
                         }
                         if (evt.keyCode == that.keyManager.keyCode.escKey) {
-                            // close popup on esc
-                            $('#vp_wrapper').trigger({
-                                type: 'close_option_page',
-                                component: that.mainFrame.focusedPage
-                            });
+                            // check if there is visible data selector : DataSelector
+                            if ($('.vp-dataselector-base:visible').length > 0) {
+                                // close data selector
+                                $('.vp-dataselector-base:visible').remove();
+                            }
+                            // check if there is visible inner popup
+                            else if ($('.vp-popup-frame > .vp-inner-popup-box:visible').length > 0) {
+                                // close inner popup on esc
+                                console.log('close inner popup from this component', that.mainFrame.focusedPage);
+                                that.mainFrame.focusedPage && that.mainFrame.focusedPage.closeInnerPopup();
+                            } else {
+                                // close popup on esc
+                                $('#vp_wrapper').trigger({
+                                    type: 'close_option_page',
+                                    component: that.mainFrame.focusedPage
+                                });
+                            }
                         }
                         if (evt.keyCode == that.keyManager.keyCode.enter) {
                             // blur on enter
diff --git a/js/com/component/PopupComponent.js b/js/com/component/PopupComponent.js
@@ -403,15 +403,13 @@ define([
             });
             // Close event for inner popup
             $(this.wrapSelector('.vp-inner-popup-close')).on('click', function(evt) {
-                that.handleInnerCancel();
                 that.closeInnerPopup();
             });
             // Click button event for inner popup
             $(this.wrapSelector('.vp-inner-popup-button')).on('click', function(evt) {
                 let btnType = $(this).data('type');
                 switch(btnType) {
                     case 'cancel':
-                        that.handleInnerCancel();
                         that.closeInnerPopup();
                         break;
                     case 'ok':
@@ -480,7 +478,7 @@ define([
         template() { 
             this.$pageDom = $(popupComponentHtml);
             // set title
-            this.$pageDom.find('.vp-popup-title').text(this.state.config.name);
+            this.$pageDom.find('.vp-popup-title').text(this.name);
             // set body
             this.$pageDom.find('.vp-popup-content').html(this.templateForBody());
             return this.$pageDom;
@@ -848,13 +846,16 @@ define([
             $(this.wrapSelector('.vp-inner-popup-box')).show();
 
             // focus on first input
-            $(this.wrapSelector('.vp-inner-popup-box input[type=text]:not(:disabled):visible:first')).focus();
+            $(this.wrapSelector('.vp-inner-popup-box input:not(:disabled):visible:first')).focus();
+            // disable Jupyter key
+            com_interface.disableOtherShortcut();
         }
         
         /**
          * Close inner popup box
          */
         closeInnerPopup() {
+            this.handleInnerCancel();
             $(this.wrapSelector('.vp-inner-popup-box')).hide();
         }
 
