visualpython · minjk-bl · Jun 18, 2021 · Jun 18, 2021 · Jun 18, 2021 · Jun 18, 2021
diff --git a/css/file_io/fileio.css b/css/file_io/fileio.css
@@ -9,4 +9,8 @@
 #vp_fileioPage .vp-fileio-body {
     padding: 5px;
     margin-top: 10px;
+}
+
+.vp-option-table {
+
 }
diff --git a/css/file_io/udf.css b/css/file_io/udf.css
@@ -1,13 +1,14 @@
 /* udf editor - CodeMirror */
 #vp-wrapper .vp-udf-page  .CodeMirror { border: 1px solid silver; }
+#vp-wrapper .vp-udf-page  .CodeMirror.CodeMirror-focused { border: 1px solid var(--hightlight-color); }
 #vp-wrapper .vp-udf-page  .CodeMirror-empty { outline: 1px solid #c22; }
 #vp-wrapper .vp-udf-page  .CodeMirror-empty.CodeMirror-focused { outline: none; }
 #vp-wrapper .vp-udf-page  .CodeMirror pre.CodeMirror-placeholder { color: #999; }
 
 #vp-wrapper .vp-udf-page  .CodeMirror-scroll { min-height: 80px; max-height: 250px;}
 
 /* udf option header */
-.vp-option-header {
+/* .vp-option-header {
     padding-bottom: 3px;
 }
 .vp-option-header label {
@@ -18,10 +19,10 @@
 }
 .vp-option-header button {
     width: 70px;
-}
+} */
 
 /* udf list table */
-#vp_udfList tr:not(:first-child):hover,
+/* #vp_udfList tr:not(:first-child):hover,
 #vp_udfList tr.selected {
     color:  var(--font-hightlight);
     background-color: #F5F5F5;
@@ -39,10 +40,10 @@
     text-overflow: ellipsis;
     width: 100%;
     overflow: hidden;
-}
+} */
 
 /* code td 긴 문자열 생략 */
-.vp-udf-code,
+/* .vp-udf-code,
 .vp-udf-code pre {
     text-overflow: ellipsis; 
     overflow: hidden;
@@ -53,15 +54,15 @@
 
     background: #ffffff00;
     border: 0px;
-}
+} */
 
 /* 새로고침 버튼 */
-#vp_udfRefresh {
+/* #vp_udfRefresh {
     padding: 5px;
 }
 #vp_udfRefresh:hover {
     cursor: pointer;
-}
+} */
 
 /* 삭제 버튼 */
 .vp-del-col {
@@ -243,6 +244,9 @@
     border: 0.25px solid var(--border-gray-color);
     box-sizing: border-box;
 }
+.vp-sn-item-header.selected {
+    background: #F5F5F5;
+}
 .vp-sn-item-header .vp-sn-indicator {
     display: inline-block;
     cursor: pointer;
@@ -255,18 +259,17 @@
 .vp-sn-item-header .vp-sn-indicator.open {
     background-image: url(../../resource/chevron_big_down.svg) !important;
 }
-.vp-sn-item-title {
+#vp_udfPage .vp-sn-item-header input.vp-sn-item-title {
     width: calc(100% - 80px);
     outline: none;
-    border: 0.5px solid white !important;
+    background: transparent;
+    border: 0.5px solid transparent;
 }
-.vp-sn-item.selected .vp-sn-item-title {
-    background: #F5F5F5;
+#vp_udfPage .vp-sn-item-header.selected input.vp-sn-item-title {
     color: var(--font-hightlight);
 }
-.vp-sn-item-title:focus {
+#vp_udfPage .vp-sn-item-header input.vp-sn-item-title:focus {
     transition: 0.7s;
-    border: 1px solid #FFCF73;
     border: 0.5px solid var(--hightlight-color) !important;
 }
 .vp-sn-imported-item {

diff --git a/resource/snippets/run.svg b/resource/snippets/run.svg
diff --git a/src/api_block/blockContainer.js b/src/api_block/blockContainer.js
@@ -1835,6 +1835,7 @@ define([
             if (Object.keys(loaded).includes('initOption')) {
                 loaded.initOption(function(funcJS) {
                     that.appsMenu = new popupPage(funcJS, 'vp_appsCode');
+                    funcJS.wrapSelector = that.appsMenu.wrapSelector;
                     // library page
                     $(vpCommon.wrapSelector(vpCommon.formatString("#{0}", vpConst.OPTION_GREEN_ROOM), vpCommon.formatString(".{0}", vpConst.API_OPTION_PAGE))).each(function() {
                         that.appsMenu.open({

diff --git a/src/api_block/init.js b/src/api_block/init.js
@@ -713,7 +713,7 @@ define([
          */
         $(document).on("fileReadSelected.fileNavigation", function(e) {
             // 선택 파일 확장자가 노트 세이브 파일인 경우만 동작
-            if (e.path.substring(e.path.lastIndexOf(".") + 1) === vpConst.VP_NOTE_EXTENSION) {
+            if (e.file.substring(e.file.lastIndexOf(".") + 1) === vpConst.VP_NOTE_EXTENSION) {
                 openNotePageAction_newVersion();
             }
         });
@@ -723,7 +723,7 @@ define([
          */
         $(document).on("fileSaveSelected.fileNavigation", function(e) {
             // 선택 파일 확장자가 노트 세이브 파일인 경우만 동작
-            if (e.path.substring(e.path.lastIndexOf(".") + 1) === vpConst.VP_NOTE_EXTENSION) {
+            if (e.file.substring(e.file.lastIndexOf(".") + 1) === vpConst.VP_NOTE_EXTENSION) {
                 var selectedPath = $(vpCommon.wrapSelector(vpCommon.formatString("#{0}", vpConst.VP_NOTE_REAL_FILE_PATH))).val();
                 var saveFileName = selectedPath.substring(selectedPath.lastIndexOf("/") + 1);
                 // FIXME: 여기부분 수정해야 함

diff --git a/src/common/vpPopupPage.js b/src/common/vpPopupPage.js
@@ -67,12 +67,15 @@ define([
         page.appendLine('</div>');  // body end
 
         // button box
-        page.appendFormatLine('<div class="{0}">', VP_PP_BUTTON_BOX);
-        page.appendFormatLine('<button type="button" class="{0}">{1}</button>'
-                                , VP_PP_BUTTON_CANCEL, 'Cancel');
-        page.appendFormatLine('<button type="button" class="{0}">{1}</button>'
-                                , VP_PP_BUTTON_APPLY, 'Apply');
-        page.appendLine('</div>');
+        // Snippets menu don't use buttons
+        if (title != 'Snippets') {
+            page.appendFormatLine('<div class="{0}">', VP_PP_BUTTON_BOX);
+            page.appendFormatLine('<button type="button" class="{0}">{1}</button>'
+                                    , VP_PP_BUTTON_CANCEL, 'Cancel');
+            page.appendFormatLine('<button type="button" class="{0}">{1}</button>'
+                                    , VP_PP_BUTTON_APPLY, 'Apply');
+            page.appendLine('</div>');
+        }
 
         page.appendLine('</div>');  // container end
         page.appendLine('</div>');  // VP_PP end
@@ -100,6 +103,18 @@ define([
         $(this.wrapSelector()).remove();
     }
 
+    PopupPage.prototype.apply = function() {
+        if (this.pageThis) {
+            var code = this.pageThis.generateCode(false, false);
+            $(vpCommon.wrapSelector('#' + this.targetId)).val(code);
+            $(vpCommon.wrapSelector('#' + this.targetId)).trigger({
+                type: 'popup_apply',
+                title: this.config.title,
+                code: code 
+            });
+        }
+    }
+
     PopupPage.prototype.bindEvent = function() {
         var that = this;
 
@@ -115,15 +130,7 @@ define([
 
         // click apply
         $(document).on('click', this.wrapSelector('.' + VP_PP_BUTTON_APPLY), function() {
-            if (that.pageThis) {
-                var code = that.pageThis.generateCode(false, false);
-                $(vpCommon.wrapSelector('#' + that.targetId)).val(code);
-                $(vpCommon.wrapSelector('#' + that.targetId)).trigger({
-                    type: 'popup_apply',
-                    title: that.config.title,
-                    code: code 
-                });
-            }
+            that.apply();
             that.close();
         });
     }

diff --git a/src/file_io/fileio.js b/src/file_io/fileio.js
@@ -172,6 +172,7 @@ define([
      */
     PandasPackage.prototype.initHtml = function() {
         this.showFunctionTitle();
+        this.loadCss(Jupyter.notebook.base_url + vpConst.BASE_PATH + vpConst.STYLE_PATH + "pandas/commonPandas.css");
         this.loadCss(Jupyter.notebook.base_url + vpConst.BASE_PATH + vpConst.STYLE_PATH + "file_io/fileio.css");
 
         this.bindOptions();
@@ -217,6 +218,20 @@ define([
         var selectedType = this.fileState[pageType]['selectedType'];
         var package = { ...libPandas._PANDAS_FUNCTION[fileTypeObj[selectedType]] };
         this.fileState[pageType].package = package;
+        this.state.fileExtension = that.fileExtensions[selectedType];
+        this.fileResultState = {
+            ...this.fileState[pageType].fileResultState
+        };
+
+        if (pageType == 'Write') {
+            if (selectedType == 'json') {
+                this.fileResultState.pathInputId = this.wrapSelector(prefix + '#path_or_buf');
+            }
+            if (selectedType == 'pickle') {
+                this.fileResultState.pathInputId = this.wrapSelector(prefix + '#path');
+            }
+        }
+
         // render interface
         pdGen.vp_showInterfaceOnPage(this, this.wrapSelector('#vp_file' + pageType), package);
 
@@ -238,38 +253,34 @@ define([
         $(this.wrapSelector(prefix + '#fileType')).change(function() {
             var value = $(this).val();
             that.fileState[pageType].selectedType = value;
-            that.state.fileExtension = that.fileExtensions[value];
-            that.fileResultState = {
-                ...that.fileState[pageType].fileResultState
-            };
-
-            if (pageType == 'Write') {
-                if (value == 'json') {
-                    that.fileResultState.pathInputId = that.wrapSelector(prefix + '#path_or_buf');
-                }
-                if (value == 'pickle') {
-                    that.fileResultState.pathInputId = that.wrapSelector(prefix + '#path');
-                }
-            }
 
             // reload
             that.renderPage(pageType);
         });
 
         // 파일 네비게이션 버튼 추가
-        if (pageType == 'Write' && selectedType == 'json') {
-            $(this.fileState[pageType]['fileResultState']['pathInputId']).parent().html(
-                vpCommon.formatString('<input type="text" class="vp-input input-single" id="path_or_buf" index="0" placeholder="" value="" title=""><div id="vp_openFileNavigationBtn" class="{0}"></div>'
-                , vpConst.FILE_BROWSER_INPUT_BUTTON)
-            );
-        } else if (pageType == 'Write' && selectedType == 'pickle') {
-            $(this.fileState[pageType]['fileResultState']['pathInputId']).parent().html(
-                vpCommon.formatString('<input type="text" class="vp-input input-single" id="path" index="0" placeholder="" value="" title=""><div id="vp_openFileNavigationBtn" class="{0}"></div>'
-                , vpConst.FILE_BROWSER_INPUT_BUTTON)
-            );
+        if (pageType == 'Write') {
+            if (selectedType == 'json') {
+                $(prefix + '#path_or_buf').parent().html(
+                    vpCommon.formatString('<input type="text" class="vp-input input-single" id="path_or_buf" index="0" placeholder="" value="" title=""><div id="vp_openFileNavigationBtn" class="{0}"></div>'
+                    , vpConst.FILE_BROWSER_INPUT_BUTTON)
+                );
+            } else if (selectedType == 'pickle') {
+                $(prefix + '#path').parent().html(
+                    vpCommon.formatString('<input type="text" class="vp-input input-single" id="path" index="0" placeholder="" value="" title=""><div id="vp_openFileNavigationBtn" class="{0}"></div>'
+                    , vpConst.FILE_BROWSER_INPUT_BUTTON)
+                );
+            } else {
+                $(this.fileState[pageType]['fileResultState']['pathInputId']).parent().html(
+                    vpCommon.formatString('<input type="text" class="vp-input input-single" id="{0}" index="0" placeholder="" value="" title=""><div id="vp_openFileNavigationBtn" class="{1}"></div>'
+                        , 'i1'
+                        , vpConst.FILE_BROWSER_INPUT_BUTTON)
+                );
+            }
         } else {
             $(this.fileState[pageType]['fileResultState']['pathInputId']).parent().html(
-                vpCommon.formatString('<input type="text" class="vp-input input-single" id="i0" index="0" placeholder="" value="" title=""><div id="vp_openFileNavigationBtn" class="{0}"></div>'
+                vpCommon.formatString('<input type="text" class="vp-input input-single" id="{0}" index="0" placeholder="" value="" title=""><div id="vp_openFileNavigationBtn" class="{1}"></div>'
+                    , 'i0'
                     , vpConst.FILE_BROWSER_INPUT_BUTTON)
             );
         }

diff --git a/src/file_io/udf.html b/src/file_io/udf.html
@@ -1,5 +1,5 @@
 <!-- TEST: Added class 'cm-s-ipython' to give codemirror same style with Jupyter -->
-<div class="vp-option-page vp-udf-page cm-s-ipython" id="vp_inputPage">
+<div class="vp-option-page vp-udf-page cm-s-ipython" id="vp_udfPage">
     <div class="vp-sn-body">
         <div class="vp-sn-header">
             <label>Snippets</label>