Skip to content

Commit dd554dc

Browse files
minjk-blminjk-bl
committed
resizing operation update
1 parent 51a6a2c commit dd554dc

4 files changed

Lines changed: 29 additions & 22 deletions

File tree

‎css/api_block/index.css‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -221,7 +221,7 @@
221221
/* overflow: hidden auto; */
222222
/* padding: 1rem 0; */
223223
background-color: white;
224-
/* position: absolute; */
224+
position: absolute;
225225
right: 0px;
226226

227227
height: 100%;

‎src/api_block/blockContainer.js‎

Lines changed: 19 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -77,6 +77,7 @@ define([
7777
, NUM_BLOCK_MAX_WIDTH
7878
, NUM_TEXT_BLOCK_WIDTH
7979
, NUM_OPTION_PAGE_WIDTH
80+
, NUM_OPTION_PAGE_MIN_WIDTH
8081
, NUM_BUTTONS_PAGE_WIDTH
8182
, NUM_API_BOARD_CENTER_PAGE_MIN_WIDTH
8283

@@ -2339,20 +2340,21 @@ define([
23392340
var index = mainPageRectWidth.indexOf('px');
23402341
var mainPageRectWidthNum = parseInt(mainPageRectWidth.slice(0,index));
23412342

2342-
var buttonsPageRectWidth = NUM_BUTTONS_PAGE_WIDTH;
2343-
var boardPageRect = $(vpCommon.wrapSelector(VP_CLASS_PREFIX + VP_CLASS_APIBLOCK_BOARD_CONTAINER))[0].getBoundingClientRect();
2343+
var PADDING_BETWEEN_BOXES = 10; // left line padding 5 + between padding 5
2344+
2345+
var boardPageRect = $(vpCommon.wrapSelector(VP_CLASS_PREFIX + 'vp-apiblock-tab-container'))[0].getBoundingClientRect();
23442346
var boardPageRectWidth = boardPageRect.width;
2345-
var optionPageRectWidth = mainPageRectWidthNum - boardPageRectWidth - buttonsPageRectWidth - 18;
2347+
var optionPageRectWidth = mainPageRectWidthNum - boardPageRectWidth - PADDING_BETWEEN_BOXES;
23462348

2347-
if (optionPageRectWidth < NUM_OPTION_PAGE_WIDTH) {
2348-
boardPageRectWidth = mainPageRectWidthNum - NUM_OPTION_PAGE_WIDTH - 18 - buttonsPageRectWidth;
2349-
optionPageRectWidth = NUM_OPTION_PAGE_WIDTH;
2349+
if (optionPageRectWidth < NUM_OPTION_PAGE_MIN_WIDTH) {
2350+
boardPageRectWidth = mainPageRectWidthNum - NUM_OPTION_PAGE_MIN_WIDTH - PADDING_BETWEEN_BOXES;
2351+
optionPageRectWidth = NUM_OPTION_PAGE_MIN_WIDTH;
23502352
}
23512353

2352-
var optionPageRectWidth_maxWidth = mainPageRectWidthNum - buttonsPageRectWidth - NUM_API_BOARD_CENTER_PAGE_MIN_WIDTH - 18;
2354+
var optionPageRectWidth_maxWidth = mainPageRectWidthNum - NUM_API_BOARD_CENTER_PAGE_MIN_WIDTH - PADDING_BETWEEN_BOXES;
23532355

23542356
$(vpCommon.wrapSelector(VP_CLASS_PREFIX + VP_CLASS_APIBLOCK_OPTION_TAB)).css(STR_MAX_WIDTH, optionPageRectWidth_maxWidth);
2355-
$(vpCommon.wrapSelector(VP_CLASS_PREFIX + VP_CLASS_APIBLOCK_BOARD_CONTAINER)).css(STR_WIDTH, boardPageRectWidth );
2357+
$(vpCommon.wrapSelector(VP_CLASS_PREFIX + 'vp-apiblock-tab-container')).css(STR_WIDTH, boardPageRectWidth );
23562358
$(vpCommon.wrapSelector(VP_CLASS_PREFIX + VP_CLASS_APIBLOCK_OPTION_TAB)).css(STR_WIDTH, optionPageRectWidth );
23572359
$(VP_ID_PREFIX + VP_ID_WRAPPER).css(STR_MIN_WIDTH, 830);
23582360

@@ -2367,24 +2369,26 @@ define([
23672369

23682370
/** option popup을 resize 할 때 */
23692371
BlockContainer.prototype.resizeOptionPopup = function() {
2370-
// console.log('resizeOptionPopup');
2371-
23722372
var optionPageRect = $(vpCommon.wrapSelector(VP_CLASS_PREFIX + VP_CLASS_APIBLOCK_OPTION_TAB))[0].getBoundingClientRect();
23732373
var mainPageRect = $(vpCommon.wrapSelector(VP_CLASS_PREFIX + VP_CLASS_APIBLOCK_MAIN))[0].getBoundingClientRect();
2374-
var buttonsPageRect = $(vpCommon.wrapSelector(VP_CLASS_PREFIX + VP_CLASS_APIBLOCK_BUTTONS))[0].getBoundingClientRect();
2374+
2375+
var PADDING_BETWEEN_BOXES = 4;
23752376

23762377
var mainPageRectWidth = mainPageRect.width;
2377-
var buttonsPageRectWidth = buttonsPageRect.width;
23782378
var optionPageRectWidth = optionPageRect.width;
2379-
var boardPageRectWidth = mainPageRectWidth - optionPageRectWidth - buttonsPageRectWidth - 10;
2379+
var boardPageRectWidth = mainPageRectWidth - optionPageRectWidth - PADDING_BETWEEN_BOXES;
2380+
2381+
var optionPageRectWidth_maxWidth = mainPageRectWidth - NUM_API_BOARD_CENTER_PAGE_MIN_WIDTH - PADDING_BETWEEN_BOXES;
23802382

23812383
if (boardPageRectWidth > NUM_API_BOARD_CENTER_PAGE_MIN_WIDTH) {
23822384
$(vpCommon.wrapSelector(VP_CLASS_PREFIX + VP_CLASS_APIBLOCK_OPTION_TAB)).css(STR_MAX_WIDTH, 'unset !important;');
23832385
} else {
2384-
$(vpCommon.wrapSelector(VP_CLASS_PREFIX + VP_CLASS_APIBLOCK_OPTION_TAB)).css(STR_MAX_WIDTH, optionPageRectWidth);
2386+
boardPageRectWidth = NUM_API_BOARD_CENTER_PAGE_MIN_WIDTH;
2387+
optionPageRectWidth = optionPageRectWidth_maxWidth;
2388+
$(vpCommon.wrapSelector(VP_CLASS_PREFIX + VP_CLASS_APIBLOCK_OPTION_TAB)).css(STR_MAX_WIDTH, optionPageRectWidth_maxWidth);
23852389
}
23862390

2387-
$(vpCommon.wrapSelector(VP_CLASS_PREFIX + VP_CLASS_APIBLOCK_BOARD_CONTAINER)).css(STR_WIDTH, boardPageRectWidth );
2391+
$(vpCommon.wrapSelector(VP_CLASS_PREFIX + 'vp-apiblock-tab-container')).css(STR_WIDTH, boardPageRectWidth );
23882392
$(vpCommon.wrapSelector(VP_CLASS_PREFIX + VP_CLASS_APIBLOCK_OPTION_TAB)).css(STR_WIDTH, optionPageRectWidth);
23892393

23902394
this.setBlockMaxWidth_blockList(boardPageRectWidth - 60);

‎src/api_block/constData.js‎

Lines changed: 4 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -218,9 +218,10 @@ define([
218218
const NUM_BLOCK_MAX_WIDTH = 360;
219219
const NUM_APIBLOCK_MAIN_PAGE_WIDTH = 1000;
220220
const NUM_APIBLOCK_LEFT_PAGE_WIDTH = 140;
221-
const NUM_OPTION_PAGE_WIDTH = 335;
221+
const NUM_OPTION_PAGE_WIDTH = 550;
222+
const NUM_OPTION_PAGE_MIN_WIDTH = 333;
222223

223-
const NUM_BUTTONS_PAGE_WIDTH = 200;
224+
const NUM_BUTTONS_PAGE_WIDTH = 265;
224225
const NUM_API_BOARD_CENTER_PAGE_WIDTH = 265; //282;
225226
const NUM_API_BOARD_CENTER_PAGE_MIN_WIDTH = 265; //282;
226227
const NUM_TEXT_BLOCK_WIDTH = 900;
@@ -790,6 +791,7 @@ define([
790791
, NUM_APIBLOCK_MAIN_PAGE_WIDTH
791792
, NUM_APIBLOCK_LEFT_PAGE_WIDTH
792793
, NUM_OPTION_PAGE_WIDTH
794+
, NUM_OPTION_PAGE_MIN_WIDTH
793795
, NUM_BUTTONS_PAGE_WIDTH
794796
, NUM_API_BOARD_CENTER_PAGE_WIDTH
795797
, NUM_API_BOARD_CENTER_PAGE_MIN_WIDTH

‎src/api_block/init.js‎

Lines changed: 5 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -180,23 +180,24 @@ define([
180180
var index = mainPageRectWidth.indexOf('px');
181181
var mainPageRectWidthNum = parseInt(mainPageRectWidth.slice(0,index));
182182

183+
var PADDING_BETWEEN_BOXES = 10; // left line padding 5 + between padding 5
184+
183185
/** 왼쪽 Logic, API 블럭 생성 영역의 width*/
184-
var buttonsPageRectWidth = NUM_APIBLOCK_LEFT_PAGE_WIDTH;
185186
/** 가운데 board 영역의 width */
186187
var boardPageRectWidth = NUM_API_BOARD_CENTER_PAGE_WIDTH;
187188
/** 오른쪽 option 영역의 width 계산 */
188-
var optionPageRectWidth = mainPageRectWidthNum - buttonsPageRectWidth - boardPageRectWidth - 68;
189+
var optionPageRectWidth = mainPageRectWidthNum - boardPageRectWidth - PADDING_BETWEEN_BOXES;
189190

190191
/** visual python 전체의 width 렌더링 */
191192
$(vpCommon.wrapSelector(VP_ID_PREFIX + VP_ID_WRAPPER)).css(STR_WIDTH, mainPageRectWidth);
192193
/** 가운데 board 영역의 width 렌더링 */
193-
$(vpCommon.wrapSelector(VP_CLASS_PREFIX + VP_CLASS_APIBLOCK_BOARD_CONTAINER)).css(STR_WIDTH, boardPageRectWidth);
194+
$(vpCommon.wrapSelector(VP_CLASS_PREFIX + 'vp-apiblock-tab-container')).css(STR_WIDTH, boardPageRectWidth);
194195
/** 오른쪽 option 영역의 width 렌더링*/
195196
$(vpCommon.wrapSelector(VP_CLASS_PREFIX + VP_CLASS_APIBLOCK_OPTION_TAB)).css(STR_WIDTH, optionPageRectWidth);
196197

197198
/** 오른쪽 option 영역의 max-width 렌더링*/
198199
// var optionPageRectWidth_maxWidth = mainPageRectWidthNum - buttonsPageRectWidth - 290 - 103;
199-
var optionPageRectWidth_maxWidth = mainPageRectWidthNum - buttonsPageRectWidth - boardPageRectWidth - 8 - 68;
200+
var optionPageRectWidth_maxWidth = mainPageRectWidthNum - boardPageRectWidth - PADDING_BETWEEN_BOXES;
200201
$(vpCommon.wrapSelector(VP_CLASS_PREFIX + VP_CLASS_APIBLOCK_OPTION_TAB)).css(STR_MAX_WIDTH, optionPageRectWidth_maxWidth);
201202

202203
/** 가운데 board 위 영역의 렌더링 */

0 commit comments

Comments
 (0)