Skip to content

Commit ea94e58

Browse files
minjk-blminjk-bl
authored
Merge pull request #20 from visualpython/devops
Devops #12 #13
2 parents 9aacd62 + aad32d8 commit ea94e58

File tree

13 files changed

+433
-192
lines changed

13 files changed

+433
-192
lines changed

‎css/api_block/index.css

Lines changed: 10 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -595,6 +595,11 @@
595595
flex-direction: column;
596596
justify-content: center;
597597
}
598+
.vp-apiblock-style-flex-column-between {
599+
display: flex;
600+
flex-direction: column;
601+
justify-content: space-between;
602+
}
598603

599604
.vp-apiblock-style-flex-row-around {
600605
display: flex;
@@ -606,11 +611,6 @@
606611
flex-direction: row;
607612
justify-content: space-evenly;
608613
}
609-
.vp-apiblock-style-flex-row-between {
610-
display: flex;
611-
flex-direction: row;
612-
justify-content: space-between;
613-
}
614614
.vp-apiblock-style-flex-row-end {
615615
display: flex;
616616
flex-direction: row;
@@ -1021,6 +1021,11 @@
10211021
background-color: white;
10221022
}
10231023

1024+
.vp-apiblock-param-box-btn {
1025+
width: 100px;
1026+
margin: 10px 0px;
1027+
}
1028+
10241029
.vp-apiblock-option-plus-button {
10251030
min-width: 80px;
10261031
height: 30px;

‎css/common/instanceEditor.css

Lines changed: 35 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -4,24 +4,32 @@
44
display: grid;
55
grid-template-columns: 50% 50%;
66
grid-gap: 10px;
7-
padding: 5px 14px 0px 14px;
7+
/* padding: 5px 14px 0px 14px; */
8+
padding-right: 14px;
89
}
910
.vp-ins-select-container {
1011

1112
}
1213
.vp-ins-select-title {
13-
font-weight: bold;
14+
font-weight: 700;
15+
color: var(--hightlight-color);
1416
padding: 5px 5px 5px 0px;
1517
}
1618
#vp-wrapper .vp-ins-select-container input.vp-ins-search {
1719
width: 100%;
1820
}
21+
#vp-wrapper .vp-ins-select-container .vp-ins-search-icon {
22+
position: absolute;
23+
color: #C4C4C4;
24+
right: 5px;
25+
top: 5px;
26+
}
1927
.vp-ins-select-box {
2028
margin-top: 5px;
2129
border: 0.25px solid #C4C4C4;
2230
}
2331
.vp-ins-select-list {
24-
height: 200px;
32+
height: 145px;
2533
width: 100%;
2634

2735
list-style: none;
@@ -45,9 +53,14 @@
4553
background: #b0b0b0;
4654
}
4755
.vp-ins-select-item {
48-
margin-top: 3px;
49-
margin-bottom: 3px;
56+
padding-top: 3px;
57+
padding-bottom: 3px;
5058
cursor: pointer;
59+
border-bottom: 0.25px solid var(--light-gray-color);
60+
}
61+
.vp-ins-select-item.selected {
62+
color : var(--hightlight-color);
63+
background: var(--light-gray-color);
5164
}
5265
.vp-ins-select-item span {
5366
background: #e0e0e0;
@@ -56,10 +69,10 @@
5669
margin-right: 5px;
5770
}
5871
.vp-ins-select-item:hover {
59-
color: #F37704;
72+
background: var(--light-gray-color);
6073
}
6174
.vp-ins-select-item:hover span {
62-
background: #F37704;
75+
background: var(--hightlight-color);
6376
color: #FFFFFF;
6477
}
6578
.vp-ins-option-box.api {
@@ -71,4 +84,19 @@
7184
}
7285
.vp-ins-parameter {
7386
width: 100% !important;
87+
}
88+
89+
.vp-create-var-box {
90+
position: relative;
91+
margin-top: 5px;
92+
}
93+
#vp-wrapper .vp-ins-select-container .vp-create-var {
94+
width: 100%;
95+
}
96+
#vp-wrapper .vp-ins-select-container .vp-create-var-btn {
97+
position: absolute;
98+
color: #C4C4C4;
99+
right: 5px;
100+
top: 5px;
101+
cursor: pointer;
74102
}

‎css/common/subsetEditor.css

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -12,6 +12,10 @@
1212
background-color: rgba(0,0,0,.4);
1313
}
1414

15+
.vp-ds-button {
16+
width: 45px;
17+
}
18+
1519
.vp-ds-container {
1620
position: relative;
1721
left: 50%;

‎css/file_io/instance.css

Lines changed: 14 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -9,6 +9,7 @@
99
vertical-align: top;
1010
}
1111
.vp-instance-toolbar {
12+
/* display: none; */
1213
grid-column: 2/3;
1314
}
1415
.vp-instance-toolbar .vp-toolbar-button {
@@ -20,9 +21,15 @@
2021
border-radius: 2px;
2122
}
2223

23-
2424
.vp-instance-label {
2525
grid-column: 1/2;
26+
font-weight: 700;
27+
margin: 0px;
28+
}
29+
30+
.vp-instance-box {
31+
grid-column-start: 1;
32+
grid-column-end: 3;
2633
}
2734

2835
.vp-instance-base > hr {
@@ -31,15 +38,18 @@
3138
grid-column: 1/3;
3239
}
3340

34-
.vp-ins-container {
41+
.vp-ins-container.variable {
42+
grid-column: 1/3;
43+
}
44+
45+
.vp-ins-container.allocate {
3546
grid-column: 1/3;
36-
grid-row: 5;
3747
}
3848

3949
/* udf editor - CodeMirror */
4050
#vp-wrapper .vp-option-page .vp-instance-box .CodeMirror {
4151
display: inline-block;
42-
width: calc(100% - 60px);
52+
width: calc(100% - 55px);
4353
height: 30px;
4454
border: 1px solid silver;
4555
overflow: hidden;

‎src/api_block/api.js

Lines changed: 4 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -14,6 +14,8 @@ define([
1414

1515
, FOR_BLOCK_ARG3_TYPE
1616

17+
, DEF_BLOCK_ARG6_TYPE
18+
1719
, STR_GRP_DEFINE
1820
, STR_GRP_CONTROL
1921
, STR_GRP_EXECUTE
@@ -369,9 +371,9 @@ define([
369371
defInParamList.forEach(( defInParam, index ) => {
370372
const { arg3, arg5 ,arg6 } = defInParam;
371373

372-
if (arg6 == '*args') {
374+
if (arg6 == DEF_BLOCK_ARG6_TYPE.ARGS) {
373375
defInParamStr += '*';
374-
} else if (arg6 == '**kwargs') {
376+
} else if (arg6 == DEF_BLOCK_ARG6_TYPE.KWARGS) {
375377
defInParamStr += '**';
376378
}
377379

‎src/api_block/component/option/class_option.js

Lines changed: 16 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -62,21 +62,22 @@ define([
6262

6363
idStr = `vp_apiblockClassOptionName${uuid}`;
6464
classStr = `vp-apiblock-input-class-name-${uuid}`;
65-
blockCodeName = 'Name';
66-
inputStyleStr = 'width: 82%';
65+
blockCodeName = 'Class Name';
66+
inputStyleStr = 'width: 100%';
6767

6868
var nameDom = $(`<div class='vp-apiblock-blockoption-block
69-
vp-apiblock-style-flex-row-between'
70-
style='position:relative;'>
71-
<span class='vp-block-optiontab-name
72-
vp-apiblock-style-flex-column-center'>
69+
vp-apiblock-style-flex-column-between'
70+
style='position:relative; height: 50px; margin-bottom: 15px;'>
71+
<div class='vp-block-optiontab-name
72+
vp-apiblock-style-flex-column-center
73+
vp-orange-text'>
7374
${blockCodeName}
74-
</span>
75+
</div>
7576
<input id='${idStr}'
7677
class='vp-apiblock-blockoption-input ${classStr}'
7778
style='${inputStyleStr}'
7879
value="${name}"
79-
placeholder='input code line' ></input>
80+
placeholder='input class name' ></input>
8081
8182
</div>`);
8283

@@ -90,21 +91,21 @@ define([
9091
var uuid = thisBlock.getUUID();
9192
var parentClassName = thisBlock.getState(STATE_parentClassName);
9293

93-
var name = 'Inheritance';
94+
var name = 'Super Class Name';
9495
var classStr = `vp-apiblock-input-param-${0}-${uuid}`;
95-
var inputStyleStr = 'width:66%;';
96+
var inputStyleStr = 'width:100%;';
9697

9798

9899
var nameDom = $(`<div class='vp-apiblock-blockoption-block
99-
vp-apiblock-style-flex-row-between'
100-
style='position:relative;'>
101-
<span class='vp-block-optiontab-name
102-
vp-apiblock-style-flex-column-center'>${name}</span>
100+
vp-apiblock-style-flex-column-between'
101+
style='position:relative; height: 50px; '>
102+
<div class='vp-block-optiontab-name
103+
vp-apiblock-style-flex-column-center'>${name}</div>
103104
<input class='vp-apiblock-blockoption-input
104105
${classStr}'
105106
style='${inputStyleStr}'
106107
value="${parentClassName}"
107-
placeholder='input parent class' ></input>
108+
placeholder='input super class name' ></input>
108109
109110
</div>`);
110111
return nameDom;

‎src/api_block/component/option/def_option.js

Lines changed: 42 additions & 17 deletions
Original file line numberDiff line numberDiff line change
@@ -28,8 +28,10 @@ define([
2828
, VP_CLASS_STYLE_FLEX_ROW_BETWEEN
2929

3030

31+
, VP_CLASS_STYLE_WIDTH_5PERCENT
3132
, VP_CLASS_STYLE_WIDTH_20PERCENT
3233
, VP_CLASS_STYLE_WIDTH_25PERCENT
34+
, VP_CLASS_STYLE_WIDTH_30PERCENT
3335
, VP_CLASS_STYLE_WIDTH_100PERCENT
3436

3537
, VP_CLASS_APIBLOCK_PARAM_DELETE_BTN
@@ -262,16 +264,17 @@ define([
262264

263265
idStr = `vp_apiblockDefOptionName${uuid}`;
264266
classStr = `vp-apiblock-input-def-name-${uuid}`;
265-
blockCodeName = 'Name';
266-
inputStyleStr = 'width: 82%';
267+
blockCodeName = 'Function Name';
268+
inputStyleStr = 'width: 100%';
267269

268270
var nameDom = $(`<div class='vp-apiblock-blockoption-block
269-
vp-apiblock-style-flex-row-between'
270-
style='position:relative;'>
271-
<span class='vp-block-optiontab-name
272-
vp-apiblock-style-flex-column-center'>
271+
vp-apiblock-style-flex-column-between'
272+
style='position:relative; height: 50px; margin-bottom: 15px; '>
273+
<div class='vp-block-optiontab-name
274+
vp-apiblock-style-flex-column-center
275+
vp-orange-text'>
273276
${blockCodeName}
274-
</span>
277+
</div>
275278
<input id='${idStr}'
276279
class='vp-apiblock-blockoption-input ${classStr}'
277280
style='${inputStyleStr}'
@@ -352,11 +355,33 @@ define([
352355
var loadedVariableNameList_arg6 = [ ...Object.values( DEF_BLOCK_ARG6_TYPE ) ];
353356

354357
var inParamDom = $(`<div class='vp-apiblock-blockoption-block
355-
vp-apiblock-style-flex-row-between'>
356-
<span class='vp-block-optiontab-name
357-
vp-apiblock-style-flex-column-center'>
358-
In param
359-
</span>
358+
vp-apiblock-style-flex-row-between'
359+
style="margin-bottom: 3px;">
360+
<div class='vp-block-optiontab-name
361+
vp-apiblock-style-flex-column-center
362+
${VP_CLASS_STYLE_WIDTH_25PERCENT}
363+
vp-orange-text'>
364+
Parameter
365+
</div>
366+
<div class='vp-block-optiontab-name
367+
vp-apiblock-style-flex-column-center
368+
vp-orange-text' style="width: 20px;">
369+
</div>
370+
<div class='vp-block-optiontab-name
371+
vp-apiblock-style-flex-column-center
372+
${VP_CLASS_STYLE_WIDTH_25PERCENT}
373+
vp-orange-text'>
374+
Value
375+
</div>
376+
<div class='vp-block-optiontab-name
377+
vp-apiblock-style-flex-column-center
378+
${VP_CLASS_STYLE_WIDTH_25PERCENT}
379+
vp-orange-text'>
380+
Argument Type
381+
</div>
382+
<div class='vp-block-optiontab-name
383+
vp-apiblock-style-flex-row-between' style="width: 15px;">
384+
</div>
360385
</div>`);
361386

362387
var defInParamContainer = $(`<div class='vp-apiblock-tab-navigation-node-block-title'>
@@ -385,7 +410,7 @@ define([
385410

386411
var sbDefVariable = new sb.StringBuilder();
387412
sbDefVariable.appendFormatLine("<div class='{0} {1}'>", VP_CLASS_STYLE_FLEX_ROW_BETWEEN
388-
, VP_CLASS_STYLE_WIDTH_25PERCENT);
413+
, VP_CLASS_STYLE_WIDTH_20PERCENT);
389414
// Deprecated: don't show this on ui
390415
// if (arg6 == DEF_BLOCK_ARG6_TYPE.ARGS) {
391416
// sbDefVariable.appendLine("<span class='vp-apiblock-style-flex-column-center'>*</span>");
@@ -413,16 +438,16 @@ define([
413438
var suggestInputArg5 = MakeVpSuggestInputText_apiblock(VP_ID_APIBLOCK_OPTION_DEF_ARG_5 + index + uuid
414439
, arg5
415440
, loadedVariableNameList_arg5
416-
, VP_CLASS_STYLE_WIDTH_20PERCENT
417-
, 'Default Val'
441+
, VP_CLASS_STYLE_WIDTH_25PERCENT
442+
, 'Value'
418443
, function(selectedValue) {
419444
bindSelectValueEventFunc_def(selectedValue,
420445
index,
421446
DEF_BLOCK_SELECT_VALUE_ARG_TYPE.ARG5);
422447
});
423448
sbDefParam.appendLine(suggestInputArg5.toString());
424449
var sbselectBoxArg6 = MakeOptionSelectBox(VP_ID_APIBLOCK_OPTION_DEF_ARG_6 + index + uuid
425-
, VP_CLASS_STYLE_WIDTH_20PERCENT
450+
, VP_CLASS_STYLE_WIDTH_25PERCENT
426451
, arg6
427452
, loadedVariableNameList_arg6);
428453
sbDefParam.appendLine(sbselectBoxArg6.toString());
@@ -445,7 +470,7 @@ define([
445470
defInParamContainer.append(defInParamBody);
446471
defBlockOption.append(defInParamContainer);
447472

448-
var defPlusButton = MakeOptionPlusButton(VP_CLASS_APIBLOCK_PARAM_PLUS_BTN + uuid, '+ Param');
473+
var defPlusButton = MakeOptionPlusButton(VP_CLASS_APIBLOCK_PARAM_PLUS_BTN + uuid, '+ Parameter', 'vp-apiblock-param-box-btn');
449474
defBlockOption.append(defPlusButton);
450475

451476
/** bottom block option 탭에 렌더링된 dom객체 생성 */

0 commit comments

Comments
 (0)