Skip to content

Commit dddae28

Browse files
minjk-blminjk-bl
authored
Merge pull request #102 from minjk-bl/devops
Release v1.2.0
2 parents 387f49c + 0fbe1a8 commit dddae28

File tree

16 files changed

+210
-92
lines changed

16 files changed

+210
-92
lines changed

‎css/api_block/index.css

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -320,11 +320,11 @@
320320
flex-direction: column;
321321
margin-left: 14px;
322322
margin-bottom: 400px;
323-
width: calc(100% - 68px);
323+
width: calc(100% - 60px);
324324
}
325325
.vp-block {
326326
position: relative;
327-
min-width: 205px;
327+
width: 100%;
328328
min-height: 25px;
329329
z-index: 1;
330330
text-align: left;
@@ -822,7 +822,7 @@
822822
}
823823
.vp-apiblock-codeline-ellipsis {
824824
width: 100%;
825-
background-color: rgba(255, 255, 255, 0.5);
825+
/* background-color: rgba(255, 255, 255, 0.5); */
826826
color: var(--font-primary);
827827
font-size: 12px;
828828
text-indent: 0.5em;

‎css/common/frameEditor.css

Lines changed: 18 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -190,6 +190,13 @@
190190
top: 0;
191191
background: #FFFFFF;
192192
border-bottom: 1px solid #E4E4E4;
193+
194+
text-align: right;
195+
text-overflow: ellipsis;
196+
overflow: hidden;
197+
height: 30px !important;
198+
min-width: 80px;
199+
white-space: nowrap;
193200
}
194201
.vp-fe-table tbody tr:nth-child(odd) {
195202
background: #F5F5F5;
@@ -223,6 +230,10 @@
223230
width: 100%;
224231
z-index: -1;
225232
} */
233+
.vp-fe-table tr th:nth-child(1),
234+
.vp-fe-add-column {
235+
min-width: 30px !important;
236+
}
226237

227238
.vp-fe-table-more {
228239
margin-top: 10px;
@@ -364,7 +375,7 @@
364375
padding: 10px;
365376
}
366377
.vp-popup-addpage .vp-popup-tab.replace {
367-
height: calc(100% - 50px);
378+
height: calc(100% - 60px);
368379
}
369380
.vp-popup-addtype {
370381
width: 153px;
@@ -373,6 +384,12 @@
373384
.vp-popup-delete {
374385
padding-bottom: 20px;
375386
}
387+
.vp-popup-rename-page {
388+
max-height: 400px;
389+
}
390+
.vp-popup-replace-table {
391+
max-height: 350px;
392+
}
376393
.vp-popup-replace-add {
377394
margin-top: 30px
378395
}

‎css/component/common.css

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -84,6 +84,9 @@
8484
.wp50 {
8585
width: 50px;
8686
}
87+
.wp60 {
88+
width: 60px;
89+
}
8790
.wp80 {
8891
width: 80px;
8992
}

‎css/component/fileNavigation.css

Lines changed: 7 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -47,7 +47,8 @@
4747
.fileNavigationPage-inner {
4848
float: right;
4949
display: grid;
50-
grid-template-rows: 30px auto min-content;
50+
/* grid-template-rows: 30px auto min-content; */
51+
grid-template-rows: min-content auto min-content;
5152
width: 80%;
5253
height: 100%;
5354
}
@@ -107,7 +108,8 @@
107108
}
108109
.fileNavigationPage-menu {
109110
min-height: 30px;
110-
height: 6%;
111+
/* height: 6%; */
112+
height: fit-content;
111113
padding-left: 10px;
112114
background-color: #EEE;
113115
border: 1px solid #ddd;;
@@ -127,7 +129,7 @@
127129
justify-content: center;
128130
}
129131
.fileNavigationPage-menu-block {
130-
margin-left: 10px;
132+
padding: 0 35px 0 10px;
131133
display: flex;
132134
flex-direction: column;
133135
justify-content: center;
@@ -192,11 +194,11 @@
192194
.fileNavigationPage-closedBtn {
193195
position: fixed;
194196
z-index: 3;
195-
right: 5px;
197+
right: 10px;
196198
width: 20px;
197199
height: 20px;
198200
line-height: 20px;
199-
top: 5px;
201+
top: 3px;
200202
text-align: center;
201203
}
202204
.fileNavigationPage-closedBtn:hover {

‎css/file_io/variables.css

Lines changed: 9 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,14 +1,20 @@
11
:root {
22
--color: #525252;
33
}
4-
#vp_var_variableBox table tr:not(:first-child):hover,
5-
#vp_var_variableBox table tr.selected {
4+
#vp_var_variableBox table tbody tr:hover,
5+
#vp_var_variableBox table tbody tr.selected {
66
color: var(--font-hightlight);
77
background-color: #F5F5F5;
88
}
9-
#vp_var_variableBox table tr td:first-child:hover {
9+
#vp_var_variableBox table tbody tr td:hover {
1010
cursor: pointer;
1111
}
12+
#vp_var_variableBox table thead {
13+
position: sticky;
14+
top: 0;
15+
background: white;
16+
}
17+
1218
#vp_varDetailTable table th,
1319
#vp_varDetailTable table td {
1420
padding: 5px;
@@ -25,7 +31,6 @@
2531
#vp_var_variableBox {
2632
width: 100%;
2733
height: 150px;
28-
overflow: hidden;
2934
}
3035
#vp_varDetailTable:empty::after {
3136
content: '(Select variables to preview the data.)';

‎src/api_block/block.js

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1487,9 +1487,9 @@ define([
14871487

14881488
if (isColor == true) {
14891489
if (this.getBlockType() == BLOCK_CODELINE_TYPE.TEXT) {
1490-
$(this.getBlockMainDom()).css(STR_BORDER_LEFT, '2px solid var(--highlight-color');
1490+
$(this.getBlockMainDom()).css(STR_BORDER_LEFT, '2px solid var(--highlight-color)');
14911491
} else {
1492-
$(this.getBlockMainDom()).css(STR_BORDER, '2px solid var(--highlight-color');
1492+
$(this.getBlockMainDom()).css(STR_BORDER, '2px solid var(--highlight-color)');
14931493
}
14941494
}
14951495
}

‎src/common/vpFrameEditor.js

Lines changed: 109 additions & 55 deletions
Original file line numberDiff line numberDiff line change
@@ -638,6 +638,7 @@ define([
638638

639639
FrameEditor.prototype.renderRenamePage = function() {
640640
var content = new sb.StringBuilder();
641+
content.appendFormatLine('<div class="{0} {1}">', 'vp-popup-rename-page', 'vp-scrollbar');
641642
content.appendLine('<table>');
642643
content.appendLine('<colgroup><col width="100px"><col width="*"></colgroup>');
643644
this.state.selected.forEach((col, idx) => {
@@ -648,17 +649,20 @@ define([
648649
content.appendLine('</tr>');
649650
});
650651
content.appendLine('</table>');
652+
content.appendLine('</div>');
651653
return content.toString();
652654
}
653655

654656
FrameEditor.prototype.renderReplacePage = function() {
655657
var content = new sb.StringBuilder();
656658
content.appendFormatLine('<label><input type="checkbox" class="{0}"/><span>{1}</span></label>', 'vp-popup-use-regex', 'Use Regular Expression');
657659
content.appendLine('<br/><br/>');
658-
content.appendFormatLine('<table class="{0}">', 'vp-popup-replace-table');
660+
content.appendFormatLine('<div class="{0}">', 'vp-popup-replace-table');
661+
content.appendLine('<table>');
659662
content.appendLine(this.renderReplaceInput(0));
660663
content.appendFormatLine('<tr><td colspan="3"><button class="{0} {1}">{2}</button></td></tr>', 'vp-button', 'vp-popup-replace-add', '+ Add Key');
661664
content.appendLine('</table>');
665+
content.appendLine('</div>');
662666
return content.toString();
663667
}
664668

@@ -1170,18 +1174,24 @@ define([
11701174
return code.toString();
11711175
}
11721176

1173-
FrameEditor.prototype.loadCode = function(codeStr) {
1177+
FrameEditor.prototype.loadCode = function(codeStr, more=false) {
11741178
if (this.loading) {
11751179
return;
11761180
}
11771181

11781182
var that = this;
11791183
var tempObj = this.state.tempObj;
11801184
var lines = this.state.lines;
1185+
var prevLines = 0;
1186+
var scrollPos = -1;
1187+
if (more) {
1188+
prevLines = that.state.indexList.length;
1189+
scrollPos = $(this.wrapSelector('.vp-fe-table')).scrollTop();
1190+
}
11811191

11821192
var code = new sb.StringBuilder();
11831193
code.appendLine(codeStr);
1184-
code.appendFormat("{0}.head({1}).to_json(orient='{2}')", tempObj, lines, 'split');
1194+
code.appendFormat("{0}[{1}:{2}].to_json(orient='{3}')", tempObj, prevLines, lines, 'split');
11851195

11861196
this.loading = true;
11871197
kernelApi.executePython(code.toString(), function(result) {
@@ -1193,62 +1203,101 @@ define([
11931203
// var columnList = data.columns;
11941204
var indexList = data.index;
11951205
var dataList = data.data;
1206+
1207+
columnList = columnList.map(col => { return { label: col.label, type: col.dtype, code: col.value } });
1208+
indexList = indexList.map(idx => { return { label: idx, code: idx } });
11961209

1197-
that.state.columnList = columnList.map(col => { return { label: col.label, type: col.dtype, code: col.value } });
1198-
that.state.indexList = indexList.map(idx => { return { label: idx, code: idx } });
1199-
1200-
// table
1201-
var table = new sb.StringBuilder();
1202-
// table.appendFormatLine('<table border="{0}" class="{1}">', 1, 'dataframe');
1203-
table.appendLine('<thead>');
1204-
table.appendLine('<tr><th></th>');
1205-
that.state.columnList && that.state.columnList.forEach(col => {
1206-
var colCode = col.code;
1207-
var colClass = '';
1208-
if (that.state.axis == FRAME_AXIS.COLUMN && that.state.selected.map(col=>col.code).includes(colCode)) {
1209-
colClass = 'selected';
1210-
}
1211-
table.appendFormatLine('<th data-code="{0}" data-axis="{1}" data-type="{2}" class="{3} {4}">{5}</th>'
1212-
, colCode, FRAME_AXIS.COLUMN, col.type, VP_FE_TABLE_COLUMN, colClass, col.label);
1213-
});
1214-
// add column
1215-
table.appendFormatLine('<th class="{0}"><img src="{1}"/></th>', VP_FE_ADD_COLUMN, '/nbextensions/visualpython/resource/plus.svg');
1216-
1217-
table.appendLine('</tr>');
1218-
table.appendLine('</thead>');
1219-
table.appendLine('<tbody>');
1220-
1221-
dataList && dataList.forEach((row, idx) => {
1222-
table.appendLine('<tr>');
1223-
var idxName = that.state.indexList[idx].label;
1224-
var idxLabel = convertToStr(idxName, typeof idxName == 'string');
1225-
var idxClass = '';
1226-
if (that.state.axis == FRAME_AXIS.ROW && that.state.selected.includes(idxLabel)) {
1227-
idxClass = 'selected';
1228-
}
1229-
table.appendFormatLine('<th data-code="{0}" data-axis="{1}" class="{2} {3}">{4}</th>', idxLabel, FRAME_AXIS.ROW, VP_FE_TABLE_ROW, idxClass, idxName);
1230-
row.forEach((cell, colIdx) => {
1231-
if (cell == null) {
1232-
cell = 'NaN';
1210+
if (!more) {
1211+
// table
1212+
var table = new sb.StringBuilder();
1213+
// table.appendFormatLine('<table border="{0}" class="{1}">', 1, 'dataframe');
1214+
table.appendLine('<thead>');
1215+
table.appendLine('<tr><th></th>');
1216+
columnList && columnList.forEach(col => {
1217+
var colCode = col.code;
1218+
var colClass = '';
1219+
if (that.state.axis == FRAME_AXIS.COLUMN && that.state.selected.map(col=>col.code).includes(colCode)) {
1220+
colClass = 'selected';
12331221
}
1234-
var cellType = that.state.columnList[colIdx].type;
1235-
if (cellType.includes('datetime')) {
1236-
cell = new Date(parseInt(cell)).toLocaleDateString();
1222+
table.appendFormatLine('<th data-code="{0}" data-axis="{1}" data-type="{2}" class="{3} {4}">{5}</th>'
1223+
, colCode, FRAME_AXIS.COLUMN, col.type, VP_FE_TABLE_COLUMN, colClass, col.label);
1224+
});
1225+
// add column
1226+
table.appendFormatLine('<th class="{0}"><img src="{1}"/></th>', VP_FE_ADD_COLUMN, '/nbextensions/visualpython/resource/plus.svg');
1227+
1228+
table.appendLine('</tr>');
1229+
table.appendLine('</thead>');
1230+
table.appendLine('<tbody>');
1231+
1232+
dataList && dataList.forEach((row, idx) => {
1233+
table.appendLine('<tr>');
1234+
var idxName = indexList[idx].label;
1235+
var idxLabel = convertToStr(idxName, typeof idxName == 'string');
1236+
var idxClass = '';
1237+
if (that.state.axis == FRAME_AXIS.ROW && that.state.selected.includes(idxLabel)) {
1238+
idxClass = 'selected';
12371239
}
1238-
table.appendFormatLine('<td>{0}</td>', cell);
1240+
table.appendFormatLine('<th data-code="{0}" data-axis="{1}" class="{2} {3}">{4}</th>', idxLabel, FRAME_AXIS.ROW, VP_FE_TABLE_ROW, idxClass, idxName);
1241+
row.forEach((cell, colIdx) => {
1242+
if (cell == null) {
1243+
cell = 'NaN';
1244+
}
1245+
var cellType = columnList[colIdx].type;
1246+
if (cellType.includes('datetime')) {
1247+
cell = new Date(parseInt(cell)).toLocaleString();
1248+
}
1249+
table.appendFormatLine('<td>{0}</td>', cell);
1250+
});
1251+
// empty data
1252+
// table.appendLine('<td></td>');
1253+
table.appendLine('</tr>');
12391254
});
1240-
// empty data
1241-
// table.appendLine('<td></td>');
1255+
// add row
1256+
table.appendLine('<tr>');
1257+
table.appendFormatLine('<th class="{0}"><img src="{1}"/></th>', VP_FE_ADD_ROW, '/nbextensions/visualpython/resource/plus.svg');
12421258
table.appendLine('</tr>');
1243-
});
1244-
// add row
1245-
table.appendLine('<tr>');
1246-
table.appendFormatLine('<th class="{0}"><img src="{1}"/></th>', VP_FE_ADD_ROW, '/nbextensions/visualpython/resource/plus.svg');
1247-
table.appendLine('</tbody>');
1248-
table.appendLine('</tr>');
1249-
$(that.wrapSelector('.' + VP_FE_TABLE)).replaceWith(function() {
1250-
return that.renderTable(table.toString());
1251-
});
1259+
table.appendLine('</tbody>');
1260+
$(that.wrapSelector('.' + VP_FE_TABLE)).replaceWith(function() {
1261+
return that.renderTable(table.toString());
1262+
});
1263+
} else {
1264+
var table = new sb.StringBuilder();
1265+
dataList && dataList.forEach((row, idx) => {
1266+
table.appendLine('<tr>');
1267+
var idxName = indexList[idx].label;
1268+
var idxLabel = convertToStr(idxName, typeof idxName == 'string');
1269+
var idxClass = '';
1270+
if (that.state.axis == FRAME_AXIS.ROW && that.state.selected.includes(idxLabel)) {
1271+
idxClass = 'selected';
1272+
}
1273+
table.appendFormatLine('<th data-code="{0}" data-axis="{1}" class="{2} {3}">{4}</th>', idxLabel, FRAME_AXIS.ROW, VP_FE_TABLE_ROW, idxClass, idxName);
1274+
row.forEach((cell, colIdx) => {
1275+
if (cell == null) {
1276+
cell = 'NaN';
1277+
}
1278+
var cellType = columnList[colIdx].type;
1279+
if (cellType.includes('datetime')) {
1280+
cell = new Date(parseInt(cell)).toLocaleString();
1281+
}
1282+
table.appendFormatLine('<td>{0}</td>', cell);
1283+
});
1284+
// empty data
1285+
// table.appendLine('<td></td>');
1286+
table.appendLine('</tr>');
1287+
});
1288+
// insert before last tr tag(add row button)
1289+
$(table.toString()).insertBefore($(that.wrapSelector('.' + VP_FE_TABLE + ' tbody tr:last')));
1290+
}
1291+
1292+
// save columnList & indexList as state
1293+
that.state.columnList = columnList;
1294+
if (!more) {
1295+
that.state.indexList = indexList;
1296+
} else {
1297+
that.state.indexList = that.state.indexList.concat(indexList);
1298+
}
1299+
1300+
12521301
// load info
12531302
that.loadInfo();
12541303
// add to stack
@@ -1257,6 +1306,11 @@ define([
12571306
var replacedCode = codeStr.replaceAll(that.state.tempObj, that.state.returnObj);
12581307
that.setPreview(replacedCode);
12591308
}
1309+
1310+
// if scrollPos is saved, go to the position
1311+
if (scrollPos >= 0) {
1312+
$(that.wrapSelector('.vp-fe-table')).scrollTop(scrollPos);
1313+
}
12601314

12611315
that.loading = false;
12621316
});
@@ -1592,7 +1646,7 @@ define([
15921646
// more rows
15931647
$(document).on('click', this.wrapSelector('.' + VP_FE_TABLE_MORE), function() {
15941648
that.state.lines += TABLE_LINES;
1595-
that.loadCode(that.getTypeCode(FRAME_EDIT_TYPE.SHOW));
1649+
that.loadCode(that.getTypeCode(FRAME_EDIT_TYPE.SHOW), true);
15961650
});
15971651

15981652
// click toolbar item

0 commit comments

Comments
 (0)