visualpython · minjk-bl · May 2, 2023 · Apr 28, 2023 · Apr 28, 2023 · May 2, 2023
diff --git a/visualpython/css/component/popupComponent.css b/visualpython/css/component/popupComponent.css
@@ -17,7 +17,7 @@
     min-height: 400px;
     width: 400px;
     height: 400px;
-    background: var(--vp-background-color);
+    background-color: var(--vp-background-color);
     border: 1px solid var(--vp-border-gray-color);
     border-top: 3px solid var(--vp-border-gray-color);
     box-shadow: 1px 1px 2px rgb(0 0 0 / 10%);
@@ -360,6 +360,11 @@
 .vp-popup-frame input[type=number]::placeholder {
 	color: var(--vp-gray-color);
 }
+.vp-popup-frame input[type=text]:disabled,
+.vp-popup-frame input[type=number]:disabled {
+	background-color: var(--vp-light-gray-color);
+    cursor: not-allowed;
+}
 
 .vp-popup-frame select {
     width: 160px;

diff --git a/visualpython/css/m_apps/frame.css b/visualpython/css/m_apps/frame.css
@@ -246,6 +246,10 @@
 .vp-inner-popup-addtype {
     width: 153px;
 }
+.vp-inner-popup-delete-value {
+    display: inline-block;
+    cursor: pointer;
+}
 .vp-inner-popup-delete {
     padding-bottom: 20px;
 }
@@ -261,6 +265,27 @@
 .vp-inner-popup-apply-column {
     width: 153px;
 }
+.vp-inner-popup-sortby {
+    border: 0.25px solid var(--vp-border-gray-color);
+    width: 160px;
+    padding: 5px;
+    min-height: 180px;
+}
+.vp-inner-popup-sortby-item {
+    border-bottom: 0.25px solid var(--vp-border-gray-color);
+    padding: 3px;
+    cursor: pointer;
+    height: 30px;
+}
+.vp-inner-popup-sortby-up {
+    float: right;
+    display: inline-block;
+}
+.vp-inner-popup-sortby-down {
+    float: right;
+    display: inline-block;
+
+}
 
 /* UDF Editor - CodeMirror */
 .vp-fr-subset-box {
@@ -293,5 +318,6 @@
 
 .vp-fr-subset-box .vp-ds-button {
     width: 50px;
+    min-width: 50px;
     vertical-align: top;
 }
diff --git a/visualpython/css/m_apps/information.css b/visualpython/css/m_apps/information.css
@@ -89,10 +89,6 @@
     height: 30px;
     font-size: 13px;
 }
-.vp-information-menu.disabled {
-    color: var(--vp-gray-color);
-    cursor: not-allowed;
-}
 .vp-variable-preview {
     margin-top: 5px;
     align-content: baseline;

diff --git a/visualpython/css/m_apps/instance.css b/visualpython/css/m_apps/instance.css
@@ -11,6 +11,7 @@
 .vp-instance-left-box, 
 .vp-instance-right-box {
     height: 100%;
+    align-content: baseline;
 }
 .vp-instance-base {
     display: grid;
@@ -115,7 +116,11 @@
 .vp-instance-preview-box {
     min-height: 352px;
     width: 100%;
-    height: calc(100% - 30px);
+    height: 400px;
+    min-height: calc(100% - 50px);
+}
+.vp-instance-preview-content {
+    height: 100%;
 }
 .vp-instance-preview-content:empty::after {
     content: 'No preview data';

diff --git a/visualpython/css/root.css b/visualpython/css/root.css
@@ -80,7 +80,7 @@ input.vp-input {
     height: 30px;
     padding: 3px 7px;
     color: var(--vp-font-primary);
-    background: var(--vp-background-color);
+    background-color: var(--vp-background-color);
     outline-color: var(--vp-highlight-color);
     border: 0.25px solid var(--vp-border-gray-color);
     box-sizing: border-box;
@@ -90,6 +90,7 @@ input.vp-input::placeholder {
 }
 input.vp-input:disabled, 
 select.vp-select:disabled {
+    background-color: var(--vp-light-gray-color);
     cursor: not-allowed;
 }
 
@@ -124,6 +125,16 @@ select.vp-select:disabled {
     width: 15px;
     height: 15px;
 }
+.vp-icon-chevron-down {
+    background: center / contain no-repeat url(../img/chevron_big_down.svg);
+    width: 15px;
+    height: 15px;
+}
+.vp-icon-chevron-up {
+    background: center / contain no-repeat url(../img/chevron_big_up.svg);
+    width: 15px;
+    height: 15px;
+}
 .vp-icon-run {
     background: center / contain no-repeat url(../img/snippets/run.svg);
     width: 16px;
@@ -445,6 +456,11 @@ button.vp-button {
     height: 30px;
     font-size: 13px;
 }
+.vp-drop-button.disabled,
+.vp-dropdown-item.disabled {
+    color: var(--vp-gray-color);
+    cursor: not-allowed;
+}
 /* cursor */
 .vp-cursor {
     cursor: pointer;
@@ -577,6 +593,13 @@ hr.vp-extra-menu-line {
     align-items: baseline;
     align-content: space-evenly;
 }
+.vp-grid-col-100 {
+    display: grid;
+    grid-template-columns: 100px auto;
+    grid-row-gap: 5px;
+    align-items: baseline;
+    align-content: space-evenly;
+}
 .vp-grid-col-110 {
     display: grid;
     grid-template-columns: 110px auto;

diff --git a/visualpython/data/libraries.json b/visualpython/data/libraries.json
@@ -2938,7 +2938,7 @@
                         "id"   : "apps_information",
                         "type" : "function",
                         "level": 1,
-                        "name" : "Information",
+                        "name" : "Data Info",
                         "tag"  : "INFORMATION,APPS",
                         "path" : "visualpython - apps - information",
                         "desc" : "Data information",

diff --git a/visualpython/html/m_apps/instance.html b/visualpython/html/m_apps/instance.html
@@ -21,8 +21,8 @@
             <div class="vp-bold">
                 <span class="vp-instance-preview-title">Instance Preview</span>
             </div>
-            <div class="vp-instance-preview-box vp-grid-border-box vp-scrollbar">
-                <div id="instancePreview" class="vp-instance-preview-content rendered_html vp-center"></div>
+            <div class="vp-instance-preview-box vp-grid-border-box">
+                <div id="instancePreview" class="vp-instance-preview-content rendered_html vp-center vp-scrollbar"></div>
             </div>
         </div>
     </div>

diff --git a/visualpython/html/m_apps/pandasOption.html b/visualpython/html/m_apps/pandasOption.html
@@ -1,6 +1,12 @@
 <body>
     <div class="vp-grid-border-box vp-pandas-option-body vp-po-option">
-        <label class="vp-bold">Display</label>
+        <div>
+            <label class="vp-bold">Display</label>
+            <label style="float: right;">
+                <input type="checkbox" id="resetDisplay">
+                <span title="Set pandas options to default.">Set default</span>
+            </label>
+        </div>
         <div class="vp-grid-col-110">
             <label for="min_rows" class="">Min rows</label>
             <input type="number" id="min_rows" class="vp-po-option-item vp-input vp-state" placeholder="10 (min)">
@@ -41,15 +47,15 @@
             <label for="chop_threshold" class="">Chop threshold</label>
             <input type="number" class="vp-po-option-item vp-input vp-state" id="chop_threshold" placeholder="None">
         </div>
-        <hr style="margin: 5px 0;">
-        <label class="mt5">
-            <input type="checkbox" id="resetDisplay">
-            <span title="Set pandas options to default.">Set default</span>
-        </label>
     </div>
-    <hr style="margin: 5px 0;">
-    <div class="vp-grid-border-box vp-po-warning">
-        <label class="vp-bold">Warnings</label>
+    <div class="vp-grid-border-box vp-po-warning mt5">
+        <div>
+            <label class="vp-bold">Warnings</label>
+            <label style="float: right;">
+                <input type="checkbox" id="resetWarning">
+                <span title="Reset warning option.">Set default</span>
+            </label>
+        </div>
         <div class="vp-grid-col-110">
             <label for="filter_warning" class="">Filter warnings</label>
             <select id="filter_warning" class="vp-po-warning-item vp-select vp-state">
@@ -62,10 +68,5 @@
                 <option value="once">Once</option>
             </select>
         </div>
-        <hr style="margin: 5px 0;">
-        <label class="mt5">
-            <input type="checkbox" id="resetWarning">
-            <span title="Reset warning option.">Set default</span>
-        </label>
     </div>
 </body>
diff --git a/visualpython/html/m_visualize/seaborn.html b/visualpython/html/m_visualize/seaborn.html
@@ -223,6 +223,9 @@
                                     <div class="vp-grid-box sb-option">
                                         <hr style="margin:5px;"/>
                                         <label class="vp-tab-group-title">Show values</label>
+                                        <div>
+                                            <label class="vp-orange-text vp-italic">NOTE:</label> <label class="vp-gray-text vp-italic">This function needs Seaborn package upper than v0.12</label>
+                                        </div>
                                         <label><input type="checkbox" id="showValues" class="vp-state"/><span>Show values on the top of bar</span></label>
                                         <div class="vp-grid-col-95">
                                             <label for="showValuesPrecision">Decimal place</label>

diff --git a/visualpython/img/chevron_big_up.svg b/visualpython/img/chevron_big_up.svg
diff --git a/visualpython/js/board/BoardFrame.js b/visualpython/js/board/BoardFrame.js
@@ -976,22 +976,31 @@ define([
                 let panelId = vpKernel.getLabPanelId();
                 if (panelId) {
                     sessionId = panelId;
+                    if (!(sessionId in this._blockList)) {
+                        this._blockList[sessionId] = {
+                            title: '',
+                            blockList: []
+                        }
+                    }
                 }
             }
-            var movingBlock = this._blockList[sessionId].blockList[startIdx];
-            if (movingBlock) {
-                let groupBlocks = this.getGroupedBlocks(movingBlock);
-                this._blockList[sessionId].blockList.splice(startIdx, groupBlocks.length);
-                this._blockList[sessionId].blockList.splice(endIdx, 0, ...groupBlocks);
-                // move tag
-                if (parentBlock != null) {
-                    // set this movingBlock as child of parentBlock
-                    movingBlock.setChildBlock(parentBlock.getChildDepth());
-                } else {
-                    // set group block
-                    movingBlock.setGroupBlock();
+            var blockList = this._blockList[sessionId].blockList;
+            if (blockList) {
+                var movingBlock = blockList[startIdx];
+                if (movingBlock) {
+                    let groupBlocks = this.getGroupedBlocks(movingBlock);
+                    this._blockList[sessionId].blockList.splice(startIdx, groupBlocks.length);
+                    this._blockList[sessionId].blockList.splice(endIdx, 0, ...groupBlocks);
+                    // move tag
+                    if (parentBlock != null) {
+                        // set this movingBlock as child of parentBlock
+                        movingBlock.setChildBlock(parentBlock.getChildDepth());
+                    } else {
+                        // set group block
+                        movingBlock.setGroupBlock();
+                    }
+                    this.reloadBlockList();
                 }
-                this.reloadBlockList();
             }
         }
 

diff --git a/visualpython/js/com/com_interface.js b/visualpython/js/com/com_interface.js
@@ -135,6 +135,10 @@ define([
                 } else if (sessionType === 'console') {
                     var labConsole = notebookPanel.content;
                     var widget = labConsole.widgets[0];
+                    if (type === 'markdown') {
+                        // add # before the lines
+                        command = '#' + command.split('\n').join('#');
+                    }
 
                     // execute or not
                     if (exec == true) {

diff --git a/visualpython/js/com/component/DataSelector.js b/visualpython/js/com/component/DataSelector.js
@@ -25,6 +25,7 @@ define([
     //     pageThis: this,
     //     id: 'targetId',
     //     classes: '',
+    //     attrs: '', // data-idx, ...
     //     placeholder: '',
     //     select: function(value, dtype) {
     //         ;
@@ -58,6 +59,7 @@ define([
                 allowDataType: null, // list of allowed data types
                 // additional options
                 classes: '',
+                attrs: '',
                 placeholder: 'Select variable',
                 required: false,
                 allowModule: false,
@@ -361,6 +363,7 @@ define([
             return `
                 <div class="vp-ds-box vp-ds-box-${this.uuid} vp-ds-uninit">
                     <input type="text" class="vp-ds-target vp-input vp-state ${this.prop.classes}" 
+                            ${this.prop.attrs} 
                             id="${this.prop.id}" value="${value}" 
                             placeholder="${this.prop.placeholder}" ${this.prop.required?'required="required"':''}/>
                     <span class="vp-ds-filter">

diff --git a/visualpython/js/com/component/InnerFuncViewer.js b/visualpython/js/com/component/InnerFuncViewer.js
@@ -153,7 +153,7 @@ define([
             item.appendFormatLine('<div class="{0}" data-title="{1}">', 'vp-if-item', title, title);
             item.appendFormatLine('<div class="{0}" title="{1}">', 'vp-if-item-header', description);
             item.appendFormatLine('<div class="{0}"></div>', 'vp-if-indicator');
-            item.appendFormatLine('<input type="text" class="vp-input {0}" value="{1}" disabled/>', 'vp-if-item-title', title);
+            item.appendFormatLine('<input type="text" class="vp-input {0}" value="{1}" readonly/>', 'vp-if-item-title', title);
             item.appendFormatLine('<div class="{0}">', 'vp-if-item-menu');
             // LAB: img to url
             // item.appendFormatLine('<div class="{0}" data-menu="{1}" title="{2}">'