Skip to content

Commit 474a09b

Browse files
minjk-blminjk-bl
committed
visualpython#44, visualpython#45 - Added title for apps box, added menus on apps
1 parent 184fcbf commit 474a09b

File tree

4 files changed

+104
-38
lines changed

4 files changed

+104
-38
lines changed

‎css/api_block/index.css

Lines changed: 24 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -83,14 +83,10 @@
8383
position: absolute;
8484
top: 0px;
8585
left: 200px;
86-
width: 210px;
87-
height: 210px;
86+
/* width: 210px;
87+
height: 210px; */
8888
z-index: 15;
8989
background: rgba(255, 255, 255, 0.8);
90-
grid-template-columns: 60px 60px 60px;
91-
grid-template-rows: 60px 60px 60px;
92-
grid-column-gap: 5px;
93-
grid-row-gap: 5px;
9490
padding: 10px;
9591
box-sizing: border-box;
9692
box-shadow: 3px 3px 5px rgba(0, 0, 0, 0.1);
@@ -99,34 +95,51 @@
9995
border-radius: 5px;
10096
}
10197
.vp-apiblock-menu-apps-container.show {
102-
display: grid !important;
98+
display: block !important;
10399
}
104100

101+
.vp-apiblock-menu-apps-title {
102+
height: 25px;
103+
line-height: 25px;
104+
font-weight: bold;
105+
background: #FFFFFF;
106+
}
107+
.vp-apiblock-menu-apps-grid {
108+
display: grid;
109+
grid-template-columns: 65px 65px 65px 65px;
110+
grid-template-rows: 65px 65px 65px 65px;
111+
grid-column-gap: 5px;
112+
grid-row-gap: 5px;
113+
}
105114
.vp-apiblock-menu-apps-item {
106-
width: 60px;
107-
height: 60px;
115+
width: 65px;
116+
height: 65px;
108117
text-align: center;
109118
border: 0.25px solid #C4C4C4;
110119
box-sizing: border-box;
111120
box-shadow: 2px 2px 1px rgba(0, 0, 0, 0.1);
112121
border-radius: 2px;
113-
padding: 8px 0px;
122+
padding: 12px 0px;
114123
}
115124
.vp-apiblock-menu-apps-item.line1 {
116125
background: #F9B52A;
117126
}
118127
.vp-apiblock-menu-apps-item.line2 {
119-
background: #EF8F3C
128+
background: #EF8F3C;
120129
}
121130
.vp-apiblock-menu-apps-item.line3 {
122131
background: #EB773C;
123132
}
133+
.vp-apiblock-menu-apps-item.preparing {
134+
background: var(--gray-color);
135+
}
124136
.vp-apiblock-menu-apps-item img {
125137
width: 24px;
126138
height: 24px;
127139
}
128140
.vp-apiblock-menu-apps-name {
129141
color: #FFFFFF;
142+
font-size: 12px;
130143
}
131144

132145
.vp-apiblock-menu-box {

‎resource/apps/apps_white.svg

Lines changed: 7 additions & 0 deletions
Loading

‎src/api_block/index.html

Lines changed: 57 additions & 27 deletions
Original file line numberDiff line numberDiff line change
@@ -14,35 +14,65 @@
1414
<i class="fa fa-search vp-menu-search-icon"></i>
1515
</div>
1616
<div class="vp-apiblock-menu-apps">
17-
<img id="vp_menuApps" src="/nbextensions/visualpython/resource/apps/apps.svg">
17+
<img id="vp_menuApps" title="Apps" src="/nbextensions/visualpython/resource/apps/apps.svg">
1818
<div id="vp_menuAppsContainer" class="vp-apiblock-menu-apps-container">
19-
<div class="vp-apiblock-menu-apps-item line1" data-menu="snippets">
20-
<img src="/nbextensions/visualpython/resource/apps/apps_snippets.svg">
21-
<div class="vp-apiblock-menu-apps-name">Snippets</div>
19+
<div class="vp-apiblock-menu-apps-title">
20+
Functional Apps
2221
</div>
23-
<div class="vp-apiblock-menu-apps-item line1" data-menu="variable">
24-
<img src="/nbextensions/visualpython/resource/apps/apps_variable.svg">
25-
<div class="vp-apiblock-menu-apps-name">Variable</div>
26-
</div>
27-
<div class="vp-apiblock-menu-apps-item line1" data-menu="file">
28-
<img src="/nbextensions/visualpython/resource/apps/apps_file.svg">
29-
<div class="vp-apiblock-menu-apps-name">File</div>
30-
</div>
31-
<div class="vp-apiblock-menu-apps-item line2" data-menu="instance">
32-
<img src="/nbextensions/visualpython/resource/apps/apps_instance.svg">
33-
<div class="vp-apiblock-menu-apps-name">Instance</div>
34-
</div>
35-
<div class="vp-apiblock-menu-apps-item line2" data-menu="subset">
36-
<img src="/nbextensions/visualpython/resource/apps/apps_subset.svg">
37-
<div class="vp-apiblock-menu-apps-name">Subset</div>
38-
</div>
39-
<div class="vp-apiblock-menu-apps-item line2" data-menu="frame">
40-
<img src="/nbextensions/visualpython/resource/apps/apps_frame.svg">
41-
<div class="vp-apiblock-menu-apps-name">Frame</div>
42-
</div>
43-
<div class="vp-apiblock-menu-apps-item line3" data-menu="chart">
44-
<img src="/nbextensions/visualpython/resource/apps/apps_chart.svg">
45-
<div class="vp-apiblock-menu-apps-name">Chart</div>
22+
<div class="vp-apiblock-menu-apps-grid">
23+
<div class="vp-apiblock-menu-apps-item line1" data-menu="import">
24+
<img src="/nbextensions/visualpython/resource/apps/apps_white.svg">
25+
<div class="vp-apiblock-menu-apps-name">Import</div>
26+
</div>
27+
<div class="vp-apiblock-menu-apps-item line1" data-menu="markdown">
28+
<img src="/nbextensions/visualpython/resource/apps/apps_white.svg">
29+
<div class="vp-apiblock-menu-apps-name">Markdown</div>
30+
</div>
31+
<div class="vp-apiblock-menu-apps-item line1" data-menu="variable">
32+
<img src="/nbextensions/visualpython/resource/apps/apps_variable.svg">
33+
<div class="vp-apiblock-menu-apps-name">Variable</div>
34+
</div>
35+
<div class="vp-apiblock-menu-apps-item line1" data-menu="snippets">
36+
<img src="/nbextensions/visualpython/resource/apps/apps_snippets.svg">
37+
<div class="vp-apiblock-menu-apps-name">Snippets</div>
38+
</div>
39+
<div class="vp-apiblock-menu-apps-item line2" data-menu="file">
40+
<img src="/nbextensions/visualpython/resource/apps/apps_file.svg">
41+
<div class="vp-apiblock-menu-apps-name">File</div>
42+
</div>
43+
<div class="vp-apiblock-menu-apps-item line2" data-menu="instance">
44+
<img src="/nbextensions/visualpython/resource/apps/apps_instance.svg">
45+
<div class="vp-apiblock-menu-apps-name">Instance</div>
46+
</div>
47+
<div class="vp-apiblock-menu-apps-item line2" data-menu="subset">
48+
<img src="/nbextensions/visualpython/resource/apps/apps_subset.svg">
49+
<div class="vp-apiblock-menu-apps-name">Subset</div>
50+
</div>
51+
<div class="vp-apiblock-menu-apps-item line2" data-menu="frame">
52+
<img src="/nbextensions/visualpython/resource/apps/apps_frame.svg">
53+
<div class="vp-apiblock-menu-apps-name">Frame</div>
54+
</div>
55+
<div class="vp-apiblock-menu-apps-item line3" data-menu="chart">
56+
<img src="/nbextensions/visualpython/resource/apps/apps_chart.svg">
57+
<div class="vp-apiblock-menu-apps-name">Chart</div>
58+
</div>
59+
<div class="vp-apiblock-menu-apps-item preparing" data-menu="merge">
60+
<img src="/nbextensions/visualpython/resource/apps/apps_white.svg">
61+
<div class="vp-apiblock-menu-apps-name">Merge</div>
62+
</div>
63+
<div class="vp-apiblock-menu-apps-item preparing" data-menu="groupby">
64+
<img src="/nbextensions/visualpython/resource/apps/apps_white.svg">
65+
<div class="vp-apiblock-menu-apps-name">Groupby</div>
66+
</div>
67+
<div class="vp-apiblock-menu-apps-item preparing" data-menu="reshape">
68+
<img src="/nbextensions/visualpython/resource/apps/apps_white.svg">
69+
<div class="vp-apiblock-menu-apps-name">Reshape</div>
70+
</div>
71+
<div class="vp-apiblock-menu-apps-item preparing" data-menu="timeseries">
72+
<img src="/nbextensions/visualpython/resource/apps/apps_white.svg">
73+
<div class="vp-apiblock-menu-apps-name">TimeSeries</div>
74+
</div>
75+
4676
</div>
4777
</div>
4878
</div>

‎src/api_block/init.js

Lines changed: 16 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -258,6 +258,10 @@ define([
258258
var menu = $(this).attr('data-menu');
259259
switch (menu)
260260
{
261+
case 'import':
262+
break;
263+
case 'markdown':
264+
break;
261265
case 'snippets':
262266
var funcID = 'com_udf';
263267
var naviInfo = getNavigationInfo(funcID);
@@ -297,6 +301,18 @@ define([
297301
/** board에 선택한 API List 블럭 생성 */
298302
blockContainer.createAPIListBlock(funcID, naviInfo);
299303
break;
304+
case 'merge':
305+
// TODO: Merge
306+
break;
307+
case 'groupby':
308+
// TODO: Groupby
309+
break;
310+
case 'reshape':
311+
// TODO: Reshape
312+
break;
313+
case 'timeseries':
314+
// TODO: TimeSeries
315+
break;
300316
}
301317
});
302318

0 commit comments

Comments
 (0)