Skip to content

Commit 3176f07

Browse files
author
minjk-bl
committed
Edit mechanism of getting row list from Subset app
1 parent e385e74 commit 3176f07

File tree

3 files changed

+143
-50
lines changed

3 files changed

+143
-50
lines changed

‎js/com/com_Kernel.js

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -155,6 +155,11 @@ define([
155155
});
156156
}
157157

158+
/**
159+
* Get rows list
160+
* @param {*} dataframe
161+
* @returns
162+
*/
158163
getRowList(dataframe) {
159164
var that = this;
160165
return new Promise(function(resolve, reject) {

‎js/m_apps/Subset.js

Lines changed: 137 additions & 50 deletions
Original file line numberDiff line numberDiff line change
@@ -78,6 +78,7 @@ define([
7878

7979
rowType: 'condition',
8080
rowList: [],
81+
rowLimit: 10,
8182
rowPointer: { start: -1, end: -1 },
8283
rowPageDom: '',
8384

@@ -290,6 +291,68 @@ define([
290291
$(this.wrapSelector('.select-row .' + VP_DS_SELECT_BOX + '.left')).replaceWith(function () {
291292
return tag.toString();
292293
});
294+
295+
// item indexing - scroll to bottom
296+
let that = this;
297+
$(this.wrapSelector('.select-row .vp-ds-select-box.left')).on('scroll', function() {
298+
if ($(this).scrollTop() + $(this).innerHeight() >= ($(this)[0].scrollHeight - 2)) {
299+
let scrollPos = $(this).scrollTop();
300+
let start = that.state.rowLimit;
301+
let end = start + 10;
302+
let subsetVariable = com_util.formatString('{0}.iloc[{1}:{2}]', that.state.pandasObject, start, end);
303+
vpKernel.getRowList(subsetVariable).then(function (resultObj) {
304+
let { result } = resultObj;
305+
var rowList = JSON.parse(result);
306+
rowList = rowList.map(function (x) {
307+
return {
308+
...x,
309+
value: x.label,
310+
code: x.value
311+
};
312+
});
313+
// if iloc
314+
if (that.state.subsetType == 'iloc') {
315+
rowList = rowList.map(function (x) {
316+
return {
317+
...x,
318+
label: x.location + '',
319+
value: x.location + '',
320+
code: x.location + '',
321+
};
322+
});
323+
}
324+
325+
let newRowList = [
326+
...that.state.rowList,
327+
...rowList
328+
];
329+
that.state.rowList = [ ...newRowList ];
330+
331+
// filter with selected list
332+
var selectedList = [];
333+
var selectedTags = $(that.wrapSelector('.' + VP_DS_SELECT_ITEM + '.select-row.added:not(.moving)'));
334+
if (selectedTags.length > 0) {
335+
for (var i = 0; i < selectedTags.length; i++) {
336+
var rowValue = $(selectedTags[i]).data('code');
337+
if (rowValue !== undefined) {
338+
selectedList.push(rowValue);
339+
}
340+
}
341+
}
342+
343+
newRowList = newRowList.filter(row => !selectedList.includes(row.code));
344+
345+
that.renderRowSelectionBox(newRowList);
346+
that.bindDraggable('row');
347+
that.generateCode();
348+
349+
// load scroll position
350+
$(that.wrapSelector('.select-row .vp-ds-select-box.left')).scrollTop(scrollPos);
351+
352+
that.state.rowLimit = end;
353+
});
354+
}
355+
});
293356
}
294357
/**
295358
* Render row slicing box
@@ -299,35 +362,42 @@ define([
299362
renderRowSlicingBox(rowList) {
300363
var that = this;
301364
var tag = new com_String();
302-
tag.appendFormatLine('<div class="{0}">', VP_DS_SLICING_BOX);
303-
var vpRowStart = new SuggestInput();
304-
vpRowStart.addClass(VP_DS_ROW_SLICE_START);
305-
vpRowStart.addClass('vp-input m');
306-
vpRowStart.setPlaceholder('start');
307-
vpRowStart.setSuggestList(function () { return rowList; });
308-
vpRowStart.setSelectEvent(function (value, item) {
309-
$(this.wrapSelector()).val(item.code);
310-
$(this.wrapSelector()).attr('data-code', item.code);
311-
// $(this.wrapSelector()).trigger('change');
312-
that.generateCode();
313-
});
314-
vpRowStart.setNormalFilter(false);
315-
316-
var vpRowEnd = new SuggestInput();
317-
vpRowEnd.addClass(VP_DS_ROW_SLICE_END);
318-
vpRowEnd.addClass('vp-input m');
319-
vpRowEnd.setPlaceholder('end');
320-
vpRowEnd.setSuggestList(function () { return rowList; });
321-
vpRowEnd.setSelectEvent(function (value, item) {
322-
$(this.wrapSelector()).val(item.code);
323-
$(this.wrapSelector()).attr('data-code', item.code);
324-
// $(this.wrapSelector()).trigger('change');
325-
that.generateCode();
326-
});
327-
vpRowEnd.setNormalFilter(false);
328-
329-
tag.appendLine(vpRowStart.toTagString());
330-
tag.appendLine(vpRowEnd.toTagString());
365+
tag.appendFormatLine('<div class="{0} {1}">', VP_DS_SLICING_BOX, 'vp-grid-col-p50');
366+
// var vpRowStart = new SuggestInput();
367+
// vpRowStart.addClass(VP_DS_ROW_SLICE_START);
368+
// vpRowStart.addClass('vp-input m');
369+
// vpRowStart.setPlaceholder('start');
370+
// vpRowStart.setSuggestList(function () { return rowList; });
371+
// vpRowStart.setSelectEvent(function (value, item) {
372+
// $(this.wrapSelector()).val(item.code);
373+
// $(this.wrapSelector()).attr('data-code', item.code);
374+
// // $(this.wrapSelector()).trigger('change');
375+
// that.generateCode();
376+
// });
377+
// vpRowStart.setNormalFilter(false);
378+
379+
// var vpRowEnd = new SuggestInput();
380+
// vpRowEnd.addClass(VP_DS_ROW_SLICE_END);
381+
// vpRowEnd.addClass('vp-input m');
382+
// vpRowEnd.setPlaceholder('end');
383+
// vpRowEnd.setSuggestList(function () { return rowList; });
384+
// vpRowEnd.setSelectEvent(function (value, item) {
385+
// $(this.wrapSelector()).val(item.code);
386+
// $(this.wrapSelector()).attr('data-code', item.code);
387+
// // $(this.wrapSelector()).trigger('change');
388+
// that.generateCode();
389+
// });
390+
// vpRowEnd.setNormalFilter(false);
391+
// tag.appendLine(vpRowStart.toTagString());
392+
// tag.appendLine(vpRowEnd.toTagString());
393+
tag.appendLine('<div class="vp-grid-box">');
394+
tag.appendFormatLine('<input type="text" class="vp-input {0}" placeholder="{1}"/>', VP_DS_ROW_SLICE_START, 'start');
395+
tag.appendFormatLine('<label style="text-align:right;padding-right:10px;"><input type="checkbox" class="{0}"/><span>Text</span></label>', 'vp-ds-row-slice-start-text');
396+
tag.appendLine('</div>');
397+
tag.appendLine('<div class="vp-grid-box">');
398+
tag.appendFormatLine('<input type="text" class="vp-input {0}" placeholder="{1}"/>', VP_DS_ROW_SLICE_END, 'end');
399+
tag.appendFormatLine('<label style="text-align:right;padding-right:10px;"><input type="checkbox" class="{0}"/><span>Text</span></label>', 'vp-ds-row-slice-end-text');
400+
tag.appendLine('</div>');
331401
tag.appendLine('</div>');
332402
// render
333403
$(this.wrapSelector('.' + VP_DS_ROWTYPE_BOX + ' .' + VP_DS_SLICING_BOX)).replaceWith(function () {
@@ -422,7 +492,7 @@ define([
422492
// tag.appendFormatLine('<input type="text" class="{0} {1}" placeholder="{2}"/>', VP_DS_COL_SLICE_END, 'vp-input m', 'end');
423493
var vpColStart = new SuggestInput();
424494
vpColStart.addClass(VP_DS_COL_SLICE_START);
425-
vpColStart.addClass('vp-input m');
495+
vpColStart.addClass('vp-input');
426496
vpColStart.setPlaceholder('start');
427497
vpColStart.setSuggestList(function () { return colList; });
428498
vpColStart.setSelectEvent(function (value, item) {
@@ -434,7 +504,7 @@ define([
434504

435505
var vpColEnd = new SuggestInput();
436506
vpColEnd.addClass(VP_DS_COL_SLICE_END);
437-
vpColEnd.addClass('vp-input m');
507+
vpColEnd.addClass('vp-input');
438508
vpColEnd.setPlaceholder('end');
439509
vpColEnd.setSuggestList(function () { return colList; });
440510
vpColEnd.setSelectEvent(function (value, item) {
@@ -780,19 +850,6 @@ define([
780850
loadRowList(rowList) {
781851
var that = this;
782852

783-
// if iloc
784-
if (this.state.subsetType == 'iloc') {
785-
rowList = rowList.map(function (x) {
786-
return {
787-
...x,
788-
label: x.location + '',
789-
value: x.location + '',
790-
code: x.location + '',
791-
};
792-
});
793-
}
794-
795-
796853
this.state.rowList = rowList;
797854
this.state.rowPointer = { start: -1, end: -1 };
798855

@@ -1080,6 +1137,7 @@ define([
10801137
that.state.pandasObject = varName;
10811138
that.state.dataType = event.dataType ? event.dataType : that.state.dataType;
10821139
that.state.rowList = [];
1140+
that.state.rowLimit = 10;
10831141
that.state.columnList = [];
10841142
that.state.rowPointer = { start: -1, end: -1 };
10851143
that.state.colPointer = { start: -1, end: -1 };
@@ -1110,7 +1168,8 @@ define([
11101168
});
11111169

11121170
// get result and load column list
1113-
vpKernel.getRowList(varName).then(function (resultObj) {
1171+
let subsetVariable = com_util.formatString('{0}.iloc[:{1}]', varName, that.state.rowLimit);
1172+
vpKernel.getRowList(subsetVariable).then(function (resultObj) {
11141173
let { result } = resultObj;
11151174
var rowList = JSON.parse(result);
11161175
rowList = rowList.map(function (x) {
@@ -1120,6 +1179,17 @@ define([
11201179
code: x.value
11211180
};
11221181
});
1182+
// if iloc
1183+
if (that.state.subsetType == 'iloc') {
1184+
rowList = rowList.map(function (x) {
1185+
return {
1186+
...x,
1187+
label: x.location + '',
1188+
value: x.location + '',
1189+
code: x.location + '',
1190+
};
1191+
});
1192+
}
11231193
that.loadRowList(rowList);
11241194
that.bindDraggable('row');
11251195
that.generateCode();
@@ -1131,7 +1201,8 @@ define([
11311201
}
11321202
} else if (that.state.dataType == 'Series') {
11331203
// get result and load column list
1134-
vpKernel.getRowList(varName).then(function (resultObj) {
1204+
let subsetVariable = com_util.formatString('{0}.iloc[:{1}]', varName, that.state.rowLimit);
1205+
vpKernel.getRowList(subsetVariable).then(function (resultObj) {
11351206
let { result } = resultObj;
11361207
var rowList = JSON.parse(result);
11371208
rowList = rowList.map(function (x) {
@@ -1141,6 +1212,17 @@ define([
11411212
code: x.value
11421213
};
11431214
});
1215+
// if iloc
1216+
if (that.state.subsetType == 'iloc') {
1217+
rowList = rowList.map(function (x) {
1218+
return {
1219+
...x,
1220+
label: x.location + '',
1221+
value: x.location + '',
1222+
code: x.location + '',
1223+
};
1224+
});
1225+
}
11441226
that.loadRowList(rowList);
11451227
that.bindDraggable('row');
11461228
that.generateCode();
@@ -1413,7 +1495,7 @@ define([
14131495
});
14141496

14151497
// typing on slicing
1416-
$(document).on('change', this.wrapSelector('.vp-ds-slicing-box input[type="text"]'), function () {
1498+
$(document).on('change', this.wrapSelector('.vp-ds-slicing-box input'), function () {
14171499
$(this).data('code', $(this).val());
14181500
that.generateCode();
14191501
});
@@ -1576,9 +1658,14 @@ define([
15761658
rowSelection.append(':');
15771659
}
15781660
} else if (this.state.rowType == 'slicing') {
1579-
var start = $(this.wrapSelector('.' + VP_DS_ROW_SLICE_START)).data('code');
1580-
var end = $(this.wrapSelector('.' + VP_DS_ROW_SLICE_END)).data('code');
1581-
rowSelection.appendFormat('{0}:{1}', start ? start : '', end ? end : '');
1661+
let start = $(this.wrapSelector('.' + VP_DS_ROW_SLICE_START)).val();
1662+
let startText = $(this.wrapSelector('.vp-ds-row-slice-start-text')).prop('checked');
1663+
var end = $(this.wrapSelector('.' + VP_DS_ROW_SLICE_END)).val();
1664+
let endText = $(this.wrapSelector('.vp-ds-row-slice-end-text')).prop('checked');
1665+
1666+
rowSelection.appendFormat('{0}:{1}'
1667+
, start ? com_util.convertToStr(start, startText) : ''
1668+
, end ? com_util.convertToStr(end, endText) : '');
15821669
} else if (this.state.rowType == 'condition') {
15831670
// condition
15841671
var condList = $(this.wrapSelector('.' + VP_DS_CONDITION_TBL + ' tr td:not(:last)'));

‎python/pandasCommand.py

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -10,6 +10,7 @@ def _vp_get_rows_list(df):
1010
"""
1111
rowList = []
1212
indexType = str(df.index.dtype)
13+
# make dict for rows info
1314
for i, r in enumerate(df.index):
1415
rInfo = { 'label': r, 'value': r, 'location': i }
1516
# value

0 commit comments

Comments
 (0)