Skip to content

Commit 4627e67

Browse files
author
minjk-bl
committed
Apps > Groupby - small update
1 parent cade17c commit 4627e67

2 files changed

Lines changed: 52 additions & 24 deletions

File tree

‎css/common/groupby.css‎

Lines changed: 5 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -3,6 +3,10 @@
33
height: 550px;
44
}
55

6+
.vp-gb-container .vp-pp-body {
7+
overflow: hidden;
8+
}
9+
610
.vp-gb-df-box {
711
display: grid;
812
grid-template-rows: 30px;
@@ -33,7 +37,7 @@
3337
border: 1px solid var(--border-gray-color);
3438
padding: 10px;
3539
margin-top: 5px;
36-
height: 180px;
40+
height: 170px;
3741
overflow: auto;
3842
}
3943
.vp-gb-adv-item {

‎src/common/vpGroupby.js‎

Lines changed: 47 additions & 23 deletions
Original file line numberDiff line numberDiff line change
@@ -102,14 +102,17 @@ define([
102102
]
103103

104104
this.methodList = [
105-
{ label: 'count', value: 'count'},
106-
{ label: 'size', value: 'size'},
107-
{ label: 'std', value: 'std'},
108-
{ label: 'sum', value: 'sum'},
109-
{ label: 'max', value: 'max'},
110-
{ label: 'mean', value: 'mean'},
111-
{ label: 'median', value: 'median'},
112-
{ label: 'min', value: 'min'},
105+
{ label: 'count', value: 'count' },
106+
{ label: 'first', value: 'first' },
107+
{ label: 'last', value: 'last' },
108+
{ label: 'size', value: 'size' },
109+
{ label: 'std', value: 'std' },
110+
{ label: 'sum', value: 'sum' },
111+
{ label: 'max', value: 'max' },
112+
{ label: 'mean', value: 'mean' },
113+
{ label: 'median', value: 'median' },
114+
{ label: 'min', value: 'min' },
115+
{ label: 'quantile', value: 'quantile' },
113116
]
114117
}
115118

@@ -150,7 +153,7 @@ define([
150153
$(this._wrapSelector('#vp_gbAdvanced')).trigger('change');
151154
}
152155
$(this._wrapSelector('#vp_gbAllocateTo')).val(allocateTo);
153-
$(this._wrapSelector('#vp_gbResetIndex')).prop('checked', resetIndex);
156+
$(this._wrapSelector('#vp_gbResetIndex')).val(resetIndex?'yes':'no');
154157

155158
$(this._wrapSelector('.vp-gb-adv-box')).html(advPageDom);
156159

@@ -298,7 +301,7 @@ define([
298301
// groupby column
299302
page.appendLine('<div>');
300303
page.appendFormatLine('<label for="{0}" class="{1}">{2}</label>', 'vp_gbBy', 'vp-orange-text wp80', 'Groupby');
301-
page.appendFormatLine('<input type="text" id="{0}" disabled/>', 'vp_gbBy');
304+
page.appendFormatLine('<input type="text" id="{0}" placeholder="{1}" disabled/>', 'vp_gbBy', 'Groupby coluns');
302305
page.appendFormatLine('<button id="{0}" class="{1}">{2}</button>', 'vp_gbBySelect', 'vp-button wp50', 'Edit');
303306
page.appendFormatLine('<label style="display: none;"><input type="checkbox" id="{0}"/><span>{1}</span></label>', 'vp_gbByGrouper', 'Grouper');
304307
page.appendFormatLine('<div class="{0}" style="display:none;">', 'vp-gb-by-grouper-box');
@@ -311,11 +314,20 @@ define([
311314
page.appendLine('</select>');
312315
page.appendLine('</div>'); // by-grouper-box
313316
page.appendLine('</div>');
314-
page.appendLine('<hr style="margin: 10px 0;"/>');
317+
// Reset index
318+
// page.appendFormatLine('<label><input type="checkbox" id="{0}"/><span>{1}</span></label>', 'vp_gbResetIndex', 'Reset index');
319+
page.appendLine('<div>');
320+
page.appendFormatLine('<label for="{0}" class="{1}">{2}</label>', 'vp_gbResetIndex', 'wp80', 'Reset Index');
321+
page.appendFormatLine('<select id="{0}">', 'vp_gbResetIndex');
322+
page.appendFormatLine('<option value="{0}">{1}</option>', 'no', 'No');
323+
page.appendFormatLine('<option value="{0}">{1}</option>', 'yes', 'Yes');
324+
page.appendLine('</select>');
325+
page.appendLine('</div>');
326+
page.appendLine('<hr style="margin: 5px 0;"/>');
315327
// display column
316328
page.appendLine('<div>');
317329
page.appendFormatLine('<label for="{0}" class="{1}">{2}</label>', 'vp_gbDisplay', 'wp80', 'Columns');
318-
page.appendFormatLine('<input type="text" id="{0}" disabled>', 'vp_gbDisplay');
330+
page.appendFormatLine('<input type="text" id="{0}" placeholder="{1}" disabled>', 'vp_gbDisplay', 'Display columns');
319331
page.appendFormatLine('<button id="{0}" class="{1}">{2}</button>', 'vp_gbDisplaySelect', 'vp-button wp50', 'Edit');
320332
page.appendLine('</div>');
321333
// method
@@ -337,12 +349,12 @@ define([
337349
page.appendFormatLine('<button id="{0}" class="{1}">{2}</button>', 'vp_gbAdvAdd', 'vp-button', '+ Add');
338350
page.appendLine('</div>'); // end of adv-box
339351

340-
page.appendLine('<hr style="margin: 10px 0;"/>');
352+
page.appendLine('<hr style="margin: 5px 0;"/>');
341353
// Allocate to
342354
page.appendLine('<div>');
343355
page.appendFormatLine('<label for="{0}" class="{1}">{2}</label>', 'vp_gbAllocateTo', 'wp80', 'Allocate to');
344356
page.appendFormatLine('<input type="text" id="{0}" placeholder="{1}"/>', 'vp_gbAllocateTo', 'New variable name');
345-
page.appendFormatLine('<label><input type="checkbox" id="{0}"/><span>{1}</span></label>', 'vp_gbResetIndex', 'Reset index');
357+
346358
page.appendLine('</div>');
347359

348360
page.appendLine('</div>'); // end of df-box
@@ -410,17 +422,20 @@ define([
410422
var page = new sb.StringBuilder();
411423
page.appendFormatLine('<div class="{0}">', 'vp-gb-adv-item');
412424
// target columns
413-
page.appendFormatLine('<input type="text" class="{0}" placeholder="{1}" disabled/>', 'vp-gb-adv-col', 'Column list');
425+
page.appendFormatLine('<input type="text" class="{0}" placeholder="{1}" title="{2}" disabled/>'
426+
, 'vp-gb-adv-col', 'Column list', 'Apply All columns, if not selected');
414427
page.appendFormatLine('<button class="{0} {1}">{2}</button>', 'vp-gb-adv-col-selector', 'vp-button wp50', 'Edit');
415428
// method select
416429
page.appendFormatLine('<select class="{0}">', 'vp-gb-adv-method-selector');
430+
var defaultMethod = '';
431+
page.appendFormatLine('<option value="{0}">{1}</option>', '', 'Select method type');
432+
page.appendFormatLine('<option value="{0}">{1}</option>', 'typing', 'Typing');
417433
this.methodList.forEach(method => {
418434
page.appendFormatLine('<option value="{0}">{1}</option>', method.value, method.label);
419435
});
420-
page.appendFormatLine('<option value="{0}">{1}</option>', 'typing', 'Typing');
421436
page.appendLine('</select>');
422437
page.appendFormatLine('<div class="{0}" style="display: none;">', 'vp-gb-adv-method-box');
423-
page.appendFormatLine('<input type="text" class="{0}" placeholder="{1}" value="{2}"/>', 'vp-gb-adv-method', 'Type function name', "'" + this.methodList[0].value + "'");
438+
page.appendFormatLine('<input type="text" class="{0}" placeholder="{1}" value="{2}"/>', 'vp-gb-adv-method', 'Type function name', "'" + defaultMethod + "'");
424439
// page.appendFormatLine('<i class="fa fa-search {0}"></i>', 'vp-gb-adv-method-return');
425440
page.appendFormatLine('<img src="{0}" class="{1}" title="{2}">'
426441
, '/nbextensions/visualpython/resource/arrow_left.svg', 'vp-gb-adv-method-return', 'Return to select method');
@@ -688,7 +703,6 @@ define([
688703
$(document).on('change', this._wrapSelector('#vp_gbDisplay'), function(event) {
689704
var colList = event.colList;
690705
that.state.display = colList;
691-
console.log('display', colList);
692706
});
693707

694708
// display select button event
@@ -732,7 +746,7 @@ define([
732746

733747
// reset index checkbox event
734748
$(document).on('change', this._wrapSelector('#vp_gbResetIndex'), function() {
735-
that.state.resetIndex = $(this).prop('checked');
749+
that.state.resetIndex = $(this).val() == 'yes';
736750
});
737751

738752
//====================================================================
@@ -772,6 +786,7 @@ define([
772786
if (method == 'typing') {
773787
// change it to typing input
774788
$(parentDiv).find('.vp-gb-adv-method-selector').hide();
789+
$(parentDiv).find('.vp-gb-adv-method').val('');
775790
$(parentDiv).find('.vp-gb-adv-method-box').show();
776791
} else {
777792
$(parentDiv).find('.vp-gb-adv-method').val(vpCommon.formatString("'{0}'", method));
@@ -780,7 +795,7 @@ define([
780795

781796
// return to selecting method
782797
$(document).on('click', this._wrapSelector('.vp-gb-adv-method-return'), function() {
783-
var defaultValue = vpCommon.formatString("'{0}'", that.methodList[0].value);
798+
var defaultValue = '';
784799
var parentDiv = $(this).parent().parent();
785800
$(parentDiv).find('.vp-gb-adv-method-selector').val(defaultValue);
786801
$(parentDiv).find('.vp-gb-adv-method').val(defaultValue);
@@ -798,9 +813,15 @@ define([
798813

799814
// edit columns naming
800815
$(document).on('click', this._wrapSelector('.vp-gb-adv-naming-selector'), function() {
801-
var columns = $(this).parent().find('.vp-gb-adv-col').data('list');
802-
var method = $(this).parent().find('.vp-gb-adv-method').val();
803-
that.openNamingPopup($(this).parent().find('.vp-gb-adv-naming'), columns, method);
816+
var parentDiv = $(this).parent();
817+
var columns = $(parentDiv).find('.vp-gb-adv-col').data('list');
818+
var method = $(parentDiv).find('.vp-gb-adv-method').val();
819+
if (!method || method == '' || method == "''") {
820+
// set focus on selecting method tag
821+
$(parentDiv).find('.vp-gb-adv-method-selector').focus();
822+
return;
823+
}
824+
that.openNamingPopup($(parentDiv).find('.vp-gb-adv-naming'), columns, method);
804825
});
805826

806827
// delete advanced item
@@ -1020,6 +1041,9 @@ define([
10201041
var advColumns = $(advItemTags[i]).find('.vp-gb-adv-col').data('list');
10211042
var advMethod = $(advItemTags[i]).find('.vp-gb-adv-method').val();
10221043
var advNaming = $(advItemTags[i]).find('.vp-gb-adv-naming').data('dict');
1044+
if (!advMethod || advMethod == '' || advMethod == "''") {
1045+
continue;
1046+
}
10231047
if (advColumns && advColumns.length > 0) {
10241048
advColumns.forEach(col => {
10251049
var naming = advNaming[col];

0 commit comments

Comments
 (0)