${STR_SAMPLE_TEXT}
`); + createdBlock.writeCode(`${textCode}
`); createdBlock.renderSelectedBlockBorderColor(true); return createdBlock; } @@ -1818,6 +1825,39 @@ define([ this.resetBlockListAndRenderThisBlock(createdBlock_api); } + BlockContainer.prototype.createAppsPage = function(moduleFile, config={}, callback=undefined) { + var that = this; + + // var loadUrl = 'markdown/markdown.js'; + // var loadUrl = 'common/' + moduleFile; + var loadUrl = moduleFile; + requirejs([loadUrl], function (loaded) { + if (Object.keys(loaded).includes('initOption')) { + loaded.initOption(function(funcJS) { + that.appsMenu = new popupPage(funcJS, 'vp_appsCode'); + funcJS.wrapSelector = that.appsMenu.wrapSelector; + // library page + $(vpCommon.wrapSelector(vpCommon.formatString("#{0}", vpConst.OPTION_GREEN_ROOM), vpCommon.formatString(".{0}", vpConst.API_OPTION_PAGE))).each(function() { + that.appsMenu.open({ + ...config, + pageDom: $(this) + }); + }); + if (callback) { + callback(funcJS); + } + }, undefined); + } else { + // save appsMenu object + that.appsMenu = new loaded(null, 'vp_appsCode'); + that.appsMenu.open(); + } + + + }); + return this.appsMenu; + } + /** 블럭을 이동할 때, * shadow 블럭을 만드는 메소드 * @param {ENUM} blockType @@ -2586,7 +2626,7 @@ define([ this.hideOptionPreviewBox(); $(VP_ID_PREFIX + VP_APIBLOCK_BOARD_OPTION_PREVIEW_BUTTON).removeClass('enabled'); - this.setNavigator(BLOCK_CODELINE_TYPE.NONE, 'Visual Python 1.1.4'); + this.setNavigator(BLOCK_CODELINE_TYPE.NONE, 'Visual Python 1.1.5'); this.setFocusedPageType(FOCUSED_PAGE_TYPE.BOARD); $('.vp-apiblock-option-tab-none').css(STR_DISPLAY, STR_BLOCK); } diff --git a/src/api_block/index.html b/src/api_block/index.html index ddfcd265..7271a2c3 100644 --- a/src/api_block/index.html +++ b/src/api_block/index.html @@ -13,39 +13,6 @@ -
- 
-
-
-
-
- 
-
-
-
-
-
- 
-
-
-
-
-
- 
-
-
-
-
-
- 
-
-
-
-
-
- 
-
-
-
-
-
- 
-
-
-
-
-
- 
-
-
-
-
-
@@ -56,6 +23,70 @@
style='padding-left: 0px;'>
Apps
+
+
+
+
+
+
+
+
+ 
+
+
+
+
+
+ 
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ 
+
+
+
+
+
+ 
+
+
+
+
+
+ 
+
+
+
+
+
+ 
+
+
+
+
+
+ Logic
@@ -70,7 +101,7 @@
vp-accordion-caption'
data-category="api">Library
-
+
@@ -140,7 +171,7 @@
id='vp_apiblock_option_page'>
- Visual Python 1.1.4
+ Visual Python 1.1.5
diff --git a/src/api_block/index.js b/src/api_block/index.js
index 26e94639..49b3d68a 100644
--- a/src/api_block/index.js
+++ b/src/api_block/index.js
@@ -33,12 +33,12 @@ define([
// document.getElementsByTagName("head")[0].appendChild(link);
// 컨테이너에서 전달된 callback 함수가 존재하면 실행.
if (typeof(callback) == 'function') {
- var uuid = vpCommon.getUUID();
+ var uuid = 'u' + vpCommon.getUUID();
// 최대 10회 중복되지 않도록 체크
for (var idx = 0; idx < 10; idx++) {
// 이미 사용중인 uuid 인 경우 다시 생성
if ($(vpConst.VP_CONTAINER_ID).find("." + uuid).length > 0) {
- uuid = vpCommon.getUUID();
+ uuid = 'u' + vpCommon.getUUID();
}
}
$(vpCommon.wrapSelector(`#${vpConst.OPTION_GREEN_ROOM}`)).find(`.${vpConst.API_OPTION_PAGE}`).addClass(uuid);
diff --git a/src/api_block/init.js b/src/api_block/init.js
index e6973fdb..58a6b067 100644
--- a/src/api_block/init.js
+++ b/src/api_block/init.js
@@ -253,51 +253,143 @@ define([
}
});
+ /** Apps Menu item click */
/** Apps Menu item click */
$(document).on(STR_CLICK,'.vp-apiblock-menu-apps-item', function() {
var menu = $(this).attr('data-menu');
switch (menu)
{
+ case 'import':
+ blockContainer.createAppsPage('/nbextensions/visualpython/src/file_io/import.js', {
+ title: 'Import',
+ width: '500px'
+ });
+ break;
+ case 'markdown':
+ // blockContainer.createAppsPage('/nbextensions/visualpython/src/markdown/markdown.js', {
+ // title: 'Markdown'
+ // }, function(funcJS) {
+ // funcJS.bindOptionEventForPopup();
+ // });
+ blockContainer.createTextBlock();
+ break;
case 'snippets':
- var funcID = 'com_udf';
- var naviInfo = getNavigationInfo(funcID);
- /** board에 선택한 API List 블럭 생성 */
- blockContainer.createAPIListBlock(funcID, naviInfo);
+ blockContainer.createAppsPage('/nbextensions/visualpython/src/file_io/udf.js', {
+ title: 'Snippets'
+ });
break;
case 'variable':
- var funcID = 'com_variables';
- var naviInfo = getNavigationInfo(funcID);
- /** board에 선택한 API List 블럭 생성 */
- blockContainer.createAPIListBlock(funcID, naviInfo);
+ blockContainer.createAppsPage('/nbextensions/visualpython/src/file_io/variables.js', {
+ title: 'Variables'
+ });
break;
case 'file':
- // TODO: file
+ blockContainer.createAppsPage('/nbextensions/visualpython/src/file_io/fileio.js', {
+ title: 'File',
+ width: '500px'
+ });
break;
case 'instance':
- var funcID = 'com_instance';
- var naviInfo = getNavigationInfo(funcID);
- /** board에 선택한 API List 블럭 생성 */
- blockContainer.createAPIListBlock(funcID, naviInfo);
+ blockContainer.createAppsPage('/nbextensions/visualpython/src/file_io/instance.js', {
+ title: 'Instance'
+ });
break;
case 'subset':
- var funcID = 'pd_subset';
- var naviInfo = getNavigationInfo(funcID);
- /** board에 선택한 API List 블럭 생성 */
- blockContainer.createAPIListBlock(funcID, naviInfo);
+ blockContainer.createAppsPage('nbextensions/visualpython/src/common/vpSubsetEditor');
break;
case 'frame':
- var funcID = 'pd_frameEditor';
- var naviInfo = getNavigationInfo(funcID);
- /** board에 선택한 API List 블럭 생성 */
- blockContainer.createAPIListBlock(funcID, naviInfo);
+ blockContainer.createAppsPage('nbextensions/visualpython/src/common/vpFrameEditor');
break;
case 'chart':
- var funcID = 'mp_plot';
- var naviInfo = getNavigationInfo(funcID);
- /** board에 선택한 API List 블럭 생성 */
- blockContainer.createAPIListBlock(funcID, naviInfo);
+ blockContainer.createAppsPage('/nbextensions/visualpython/src/matplotlib/plot.js', {
+ title: 'Chart',
+ width: '600px'
+ });
+ break;
+ case 'merge':
+ // TODO: Merge
+ break;
+ case 'groupby':
+ // TODO: Groupby
break;
+ case 'reshape':
+ // TODO: Reshape
+ break;
+ case 'timeseries':
+ // TODO: TimeSeries
+ break;
+ }
+ });
+
+ /** Apps Menu Apply event */
+ $(document).on('popup_apply subset_apply frame_apply', '#vp_appsCode', function(evt) {
+ var code = evt.code;
+ var title = evt.title;
+
+ var isFirstBlock = false;
+ const blockList = blockContainer.getBlockList();
+ /** board에 블럭이 0개 일때
+ * 즉 블럭이 처음으로 생성되는 경우
+ */
+ if (blockList.length == 0) {
+ isFirstBlock = true;
}
+
+ var createdBlock = undefined;
+ if (title == 'Markdown') {
+
+ createdBlock = blockContainer.createTextBlock(code);
+
+ // createdBlock = blockContainer.createBlock(BLOCK_CODELINE_TYPE.TEXT);
+ // createdBlock.apply();
+ // createdBlock.setFuncID(STR_TEXT_BLOCK_MARKDOWN_FUNCID);
+ // createdBlock.setOptionPageLoadCallback(optionPageLoadCallback_block);
+ // createdBlock.setLoadOption(loadOption_block);
+ // createdBlock.setState({
+ // [STATE_codeLine]: code
+ // });
+
+ // /** board에 블럭이 0개일 경우 */
+ // if (isFirstBlock == true) {
+ // createdBlock.setDirection(BLOCK_DIRECTION.ROOT);
+ // blockContainer.reNewContainerDom();
+ // /** board에 블럭이 1개 이상 일 경우 */
+ // } else {
+ // /** board의 가장 아래 블럭을 가져옴 */
+ // var lastBottomBlock = blockContainer.getRootToLastBottomBlock();
+ // lastBottomBlock.appendBlock(createdBlock, BLOCK_DIRECTION.DOWN);
+ // }
+ // blockContainer.reRenderAllBlock_asc();
+ // blockContainer.resetBlockList();
+ // blockContainer.setSelectBlock(createdBlock);
+
+ // createdBlock.writeCode(`
${code}
`); + // createdBlock.renderSelectedBlockBorderColor(true); + } else { + // 1. add code block + // create block as group block + createdBlock = blockContainer.createBlock(BLOCK_CODELINE_TYPE.CODE, null, null, true); + // set code + createdBlock.setState({ + customCodeLine: code + }); + createdBlock.writeCode(code); + createdBlock.apply(); + if (isFirstBlock == true) { + // if it is first block, set as ROOT + createdBlock.setDirection(BLOCK_DIRECTION.ROOT); + } else { + var lastBottomBlock = blockContainer.getRootToLastBottomBlock(); + lastBottomBlock.appendBlock(createdBlock, BLOCK_DIRECTION.DOWN); + } + blockContainer.addNodeBlock(createdBlock); + blockContainer.reRenderAllBlock_asc(); + blockContainer.resetBlockListAndRenderThisBlock(createdBlock); + + } + + // 2. add cell and run cell + createdBlock.runThisBlock(); }); /** Logic, API, Data Analysis 의 > 버튼 클릭 */ @@ -621,7 +713,7 @@ define([ */ $(document).on("fileReadSelected.fileNavigation", function(e) { // 선택 파일 확장자가 노트 세이브 파일인 경우만 동작 - if (e.path.substring(e.path.lastIndexOf(".") + 1) === vpConst.VP_NOTE_EXTENSION) { + if (e.file.substring(e.file.lastIndexOf(".") + 1) === vpConst.VP_NOTE_EXTENSION) { openNotePageAction_newVersion(); } }); @@ -631,7 +723,7 @@ define([ */ $(document).on("fileSaveSelected.fileNavigation", function(e) { // 선택 파일 확장자가 노트 세이브 파일인 경우만 동작 - if (e.path.substring(e.path.lastIndexOf(".") + 1) === vpConst.VP_NOTE_EXTENSION) { + if (e.file.substring(e.file.lastIndexOf(".") + 1) === vpConst.VP_NOTE_EXTENSION) { var selectedPath = $(vpCommon.wrapSelector(vpCommon.formatString("#{0}", vpConst.VP_NOTE_REAL_FILE_PATH))).val(); var saveFileName = selectedPath.substring(selectedPath.lastIndexOf("/") + 1); // FIXME: 여기부분 수정해야 함 diff --git a/src/common/component/vpComComponent.js b/src/common/component/vpComComponent.js index e85e84bc..981e28d8 100644 --- a/src/common/component/vpComComponent.js +++ b/src/common/component/vpComComponent.js @@ -19,7 +19,7 @@ define([ * 컨트롤 uuid 생성 */ vpComComponent.prototype.setUUID = function() { - this._UUID = vpCommon.getUUID(); + this._UUID = 'u' + vpCommon.getUUID(); } /** diff --git a/src/common/component/vpVarSelector.js b/src/common/component/vpVarSelector.js index dffe7f4b..e3c4f994 100644 --- a/src/common/component/vpVarSelector.js +++ b/src/common/component/vpVarSelector.js @@ -23,7 +23,7 @@ define([ $(this.wrapSelector('.vp-vs-tester')).html(varSelector.render()); */ var VarSelector = function(dataTypes, defaultType='', showOthers=true, useTyping=true) { - this.uuid = vpCommon.getUUID(); + this.uuid = 'u' + vpCommon.getUUID(); this.label = { 'others': 'Others', 'typing': 'Typing' diff --git a/src/common/constant.js b/src/common/constant.js index b35ddd6a..fa53cee6 100644 --- a/src/common/constant.js +++ b/src/common/constant.js @@ -48,7 +48,7 @@ define ([ * toolbar btn properties */ const TOOLBAR_BTN_INFO = { - HELP: "Visual Python 1.1.4" + HELP: "Visual Python 1.1.5" // , ICON: "fa-angellist" , ICON: "vp-main-icon" , ID: "vpBtnToggle" diff --git a/src/common/vpFileNavigation.js b/src/common/vpFileNavigation.js index 2a9844b2..cf8b7cd0 100644 --- a/src/common/vpFileNavigation.js +++ b/src/common/vpFileNavigation.js @@ -26,7 +26,7 @@ define([ * @constructor */ var FileNavigation = function(type, state) { - this.uuid = vpCommon.getUUID(); + this.uuid = 'u' + vpCommon.getUUID(); this.type = type; // state types this.state = { diff --git a/src/common/vpFrameEditor.js b/src/common/vpFrameEditor.js index 130d2273..5f123cb8 100644 --- a/src/common/vpFrameEditor.js +++ b/src/common/vpFrameEditor.js @@ -88,23 +88,17 @@ define([ var FrameEditor = function(pageThis, targetId) { this.pageThis = pageThis; this.targetId = targetId; - this.uuid = vpCommon.getUUID(); + this.uuid = 'u' + vpCommon.getUUID(); - // state - this.state = { - originObj: '', - tempObj: '_vp', - selected: [], - axis: 0, - lines: TABLE_LINES, - steps: [], - popup: FRAME_EDIT_TYPE.NONE - } - - this.codepreview = undefined; + this.renderButton(); - this.bindEvent(); - this.init(); + var that = this; + // open popup + $(vpCommon.formatString('.{0}.{1}', VP_FE_BTN, this.uuid)).on('click', function(event) { + if (!$(this).hasClass('disabled')) { + that.open(); + } + }); } FrameEditor.prototype.wrapSelector = function(query = '') { @@ -112,8 +106,7 @@ define([ } FrameEditor.prototype.open = function() { - this.loadVariableList(); - + this.init(); $(this.wrapSelector()).show(); if (!this.codepreview) { @@ -152,17 +145,33 @@ define([ } FrameEditor.prototype.close = function() { - $(this.wrapSelector()).hide(); + this.unbindEvent(); + $(this.wrapSelector()).remove(); } FrameEditor.prototype.init = function() { - this.pageThis.loadCss(Jupyter.notebook.base_url + vpConst.BASE_PATH + vpConst.STYLE_PATH + "common/frameEditor.css"); + // state + this.state = { + originObj: '', + tempObj: '_vp', + selected: [], + axis: 0, + lines: TABLE_LINES, + steps: [], + popup: FRAME_EDIT_TYPE.NONE + } - this.renderButton(); - this.renderThis(); + this.codepreview = undefined; + + vpCommon.loadCss(Jupyter.notebook.base_url + vpConst.BASE_PATH + vpConst.STYLE_PATH + "common/frameEditor.css"); + this.render(); + this.bindEvent(); + // this.setDraggableBox(); this.setDraggableColumns(); + + this.loadVariableList(); } FrameEditor.prototype.initState = function() { @@ -177,7 +186,9 @@ define([ var buttonTag = new sb.StringBuilder(); buttonTag.appendFormat('' , VP_FE_BTN, this.uuid, 'vp-button', 'Edit'); - $(this.pageThis.wrapSelector('#' + this.targetId)).parent().append(buttonTag.toString()); + if (this.pageThis) { + $(this.pageThis.wrapSelector('#' + this.targetId)).parent().append(buttonTag.toString()); + } } FrameEditor.prototype.setPreview = function(previewCodeStr) { @@ -191,7 +202,7 @@ define([ } } - FrameEditor.prototype.renderThis = function() { + FrameEditor.prototype.render = function() { var page = new sb.StringBuilder(); page.appendFormatLine('', VP_FE, this.uuid);
page.appendFormatLine('
', VP_FE_CONTAINER);
@@ -338,6 +349,7 @@ define([
});
$(that.wrapSelector('#vp_feVariable')).trigger('change');
} catch (ex) {
+ console.log('FrameEditor:', result);
// console.log(ex);
}
});
@@ -515,7 +527,7 @@ define([
});
}
- FrameEditor.prototype.getCode = function(type, content={}) {
+ FrameEditor.prototype.getTypeCode = function(type, content={}) {
var tempObj = this.state.tempObj;
var orgObj = this.state.originObj;
@@ -668,15 +680,30 @@ define([
});
}
+ FrameEditor.prototype.unbindEvent = function() {
+ $(document).off(this.wrapSelector('*'));
+
+ $(document).off('click', this.wrapSelector('.' + VP_FE_CLOSE));
+ $(document).off('change', this.wrapSelector('#vp_feVariable'));
+ $(document).off('click', this.wrapSelector('.vp-fe-df-refresh'));
+ $(document).off('contextmenu', this.wrapSelector('.' + VP_FE_TABLE + ' .' + VP_FE_TABLE_COLUMN));
+ $(document).off('contextmenu', this.wrapSelector('.' + VP_FE_TABLE + ' .' + VP_FE_TABLE_ROW));
+ $(document).off('click', this.wrapSelector('.' + VP_FE_TABLE + ' .' + VP_FE_TABLE_COLUMN));
+ $(document).off('click', this.wrapSelector('.' + VP_FE_TABLE + ' .' + VP_FE_TABLE_ROW));
+ $(document).off('click', this.wrapSelector('.' + VP_FE_ADD_COLUMN));
+ $(document).off('click', this.wrapSelector('.' + VP_FE_ADD_ROW));
+ $(document).off('click', this.wrapSelector('.' + VP_FE_TABLE_MORE));
+ $(document).off('click', this.wrapSelector('.' + VP_FE_MENU_ITEM));
+ $(document).off('click', this.wrapSelector('.' + VP_FE_POPUP_OK));
+ $(document).off('click', this.wrapSelector('.' + VP_FE_POPUP_CANCEL));
+ $(document).off('click', this.wrapSelector('.' + VP_FE_POPUP_CLOSE));
+ $(document).off('click', this.wrapSelector('.' + VP_FE_BUTTON_CANCEL));
+ $(document).off('click', this.wrapSelector('.' + VP_FE_BUTTON_APPLY));
+
+ }
FrameEditor.prototype.bindEvent = function() {
var that = this;
- // open popup
- $(document).on('click', vpCommon.formatString('.{0}.{1}', VP_FE_BTN, this.uuid), function(event) {
- if (!$(this).hasClass('disabled')) {
- that.open();
- }
- });
// close popup
$(document).on('click', this.wrapSelector('.' + VP_FE_CLOSE), function(event) {
@@ -697,7 +724,7 @@ define([
that.initState();
// load code with temporary df
- that.loadCode(that.getCode(FRAME_EDIT_TYPE.INIT));
+ that.loadCode(that.getTypeCode(FRAME_EDIT_TYPE.INIT));
that.loadInfo();
});
@@ -756,7 +783,8 @@ define([
});
// select column
- $(document).on('click', this.wrapSelector('.' + VP_FE_TABLE + ' .' + VP_FE_TABLE_COLUMN), function() {
+ $(document).on('click', this.wrapSelector('.' + VP_FE_TABLE + ' .' + VP_FE_TABLE_COLUMN), function(evt) {
+ evt.stopPropagation();
var hasSelected = $(this).hasClass('selected');
$(that.wrapSelector('.' + VP_FE_TABLE + ' .' + VP_FE_TABLE_ROW)).removeClass('selected');
if (!hasSelected) {
@@ -800,7 +828,7 @@ define([
// more rows
$(document).on('click', this.wrapSelector('.' + VP_FE_TABLE_MORE), function() {
that.state.lines += TABLE_LINES;
- that.loadCode(that.getCode(FRAME_EDIT_TYPE.SHOW));
+ that.loadCode(that.getTypeCode(FRAME_EDIT_TYPE.SHOW));
});
// click menu item
@@ -814,13 +842,13 @@ define([
that.openInputPopup(editType);
return;
}
- that.loadCode(that.getCode(editType));
+ that.loadCode(that.getTypeCode(editType));
});
// ok input popup
$(document).on('click', this.wrapSelector('.' + VP_FE_POPUP_OK), function() {
// TODO: ok input popup
- that.loadCode(that.getCode(that.state.popup, that.getPopupContent()));
+ that.loadCode(that.getTypeCode(that.state.popup, that.getPopupContent()));
that.closeInputPopup();
});
@@ -841,8 +869,20 @@ define([
// click apply
$(document).on('click', this.wrapSelector('.' + VP_FE_BUTTON_APPLY), function() {
- $(that.pageThis.wrapSelector('#' + that.targetId)).val(that.state.steps.join('\n'));
- $(that.pageThis.wrapSelector('#' + that.targetId)).trigger('frame_apply');
+ var code = that.state.steps.join('\n');
+ if (that.pageThis) {
+ $(that.pageThis.wrapSelector('#' + that.targetId)).val(code);
+ $(that.pageThis.wrapSelector('#' + that.targetId)).trigger({
+ type: 'frame_apply',
+ code: code
+ });
+ } else {
+ $(vpCommon.wrapSelector('#' + that.targetId)).val(code);
+ $(vpCommon.wrapSelector('#' + that.targetId)).trigger({
+ type: 'frame_apply',
+ code: code
+ });
+ }
that.close();
});
}
diff --git a/src/common/vpInstanceEditor.js b/src/common/vpInstanceEditor.js
index 43c13cf9..6f21a645 100644
--- a/src/common/vpInstanceEditor.js
+++ b/src/common/vpInstanceEditor.js
@@ -41,7 +41,7 @@ define([
var InstanceEditor = function(pageThis, targetId, containerId='vp-wrapper', popup=false) {
this.pageThis = pageThis;
this.targetId = targetId;
- this.uuid = vpCommon.getUUID();
+ this.uuid = 'u' + vpCommon.getUUID();
this.containerId = containerId;
this.popup = popup;
@@ -77,7 +77,7 @@ define([
InstanceEditor.prototype.init = function() {
// load css
- this.pageThis.loadCss(Jupyter.notebook.base_url + vpConst.BASE_PATH + vpConst.STYLE_PATH + "common/instanceEditor.css");
+ vpCommon.loadCss(Jupyter.notebook.base_url + vpConst.BASE_PATH + vpConst.STYLE_PATH + "common/instanceEditor.css");
this.reload();
}
diff --git a/src/common/vpPopupPage.js b/src/common/vpPopupPage.js
new file mode 100644
index 00000000..9e6bc313
--- /dev/null
+++ b/src/common/vpPopupPage.js
@@ -0,0 +1,144 @@
+define([
+ 'require'
+ , 'jquery'
+ , 'nbextensions/visualpython/src/common/constant'
+ , 'nbextensions/visualpython/src/common/StringBuilder'
+ , 'nbextensions/visualpython/src/common/vpCommon'
+], function(requirejs, $, vpConst, sb, vpCommon) {
+
+ // TEST: testing popuppage as an interface of every popup modules
+
+ const VP_PP = 'vp-pp';
+ const VP_PP_CONTAINER = 'vp-pp-container';
+ const VP_PP_TITLE = 'vp-pp-title';
+ const VP_PP_CLOSE = 'vp-pp-close';
+ const VP_PP_BODY = 'vp-pp-body';
+ const VP_PP_BUTTON_BOX = 'vp-pp-btn-box';
+ const VP_PP_BUTTON_CANCEL = 'vp-pp-btn-cancel';
+ const VP_PP_BUTTON_APPLY = 'vp-pp-btn-apply';
+
+ /**
+ * @class PopupPage
+ * @param {object} pageThis
+ * @param {string} targetId
+ * @constructor
+ */
+ var PopupPage = function(pageThis, targetId) {
+ this.pageThis = pageThis;
+ this.targetId = targetId;
+ this.uuid = 'u' + vpCommon.getUUID();
+
+ this.config = {
+ title: '',
+ width: '95%',
+ height: '95%',
+ pageDom: $('
Empty
')
+ };
+ }
+
+ PopupPage.prototype.wrapSelector = function(selector='') {
+ return vpCommon.formatString('.{0} {1}', this.uuid, selector);
+ }
+
+ PopupPage.prototype.init = function() {
+ vpCommon.loadCss(Jupyter.notebook.base_url + vpConst.BASE_PATH + vpConst.STYLE_PATH + "common/popupPage.css");
+ this.renderPopup();
+ this.bindEvent();
+ }
+
+ PopupPage.prototype.renderPopup = function() {
+ var { title, width, height, pageDom } = this.config;
+
+ var page = new sb.StringBuilder();
+ page.appendFormatLine('', VP_PP, this.uuid);
+ page.appendFormatLine('
'); // VP_PP end
+
+ $('#vp-wrapper').append(page.toString());
+
+ $(pageDom).appendTo($(this.wrapSelector('.' + VP_PP_BODY)));
+ $(this.wrapSelector()).hide();
+
+ return page.toString();
+ }
+
+ PopupPage.prototype.open = function(config) {
+ this.config = {
+ ...this.config,
+ ...config
+ };
+
+ this.init();
+ $(this.wrapSelector()).show();
+ }
+
+ PopupPage.prototype.close = function() {
+ this.unbindEvent();
+ $(this.wrapSelector()).remove();
+ }
+
+ PopupPage.prototype.apply = function() {
+ if (this.pageThis) {
+ var code = this.pageThis.generateCode(false, false);
+ $(vpCommon.wrapSelector('#' + this.targetId)).val(code);
+ $(vpCommon.wrapSelector('#' + this.targetId)).trigger({
+ type: 'popup_apply',
+ title: this.config.title,
+ code: code
+ });
+ }
+ }
+
+ PopupPage.prototype.bindEvent = function() {
+ var that = this;
+
+ // close popup
+ $(document).on('click', this.wrapSelector('.' + VP_PP_CLOSE), function(event) {
+ that.close();
+ });
+
+ // click cancel
+ $(document).on('click', this.wrapSelector('.' + VP_PP_BUTTON_CANCEL), function() {
+ that.close();
+ });
+
+ // click apply
+ $(document).on('click', this.wrapSelector('.' + VP_PP_BUTTON_APPLY), function() {
+ that.apply();
+ that.close();
+ });
+ }
+
+ PopupPage.prototype.unbindEvent = function() {
+ $(document).unbind(vpCommon.formatString(".{0} .{1}", this.uuid, VP_PP_BODY));
+ }
+
+
+ return PopupPage;
+});
\ No newline at end of file
diff --git a/src/common/vpSnippets.js b/src/common/vpSnippets.js
index 80eac323..18ce0d3b 100644
--- a/src/common/vpSnippets.js
+++ b/src/common/vpSnippets.js
@@ -36,7 +36,7 @@ define([
var Snippets = function(pageThis, targetId) {
this.pageThis = pageThis;
this.targetId = targetId;
- this.uuid = vpCommon.getUUID();
+ this.uuid = 'u' + vpCommon.getUUID();
this.state = {
@@ -63,7 +63,7 @@ define([
}
Snippets.prototype.init = function() {
- this.pageThis.loadCss(Jupyter.notebook.base_url + vpConst.BASE_PATH + vpConst.STYLE_PATH + "common/snippets.css");
+ vpCommon.loadCss(Jupyter.notebook.base_url + vpConst.BASE_PATH + vpConst.STYLE_PATH + "common/snippets.css");
this.render();
}
@@ -101,7 +101,7 @@ define([
Snippets.prototype.unbindEvent = function() {
}
-
+
return Snippets;
});
\ No newline at end of file
diff --git a/src/common/vpSubsetEditor.js b/src/common/vpSubsetEditor.js
index 46f92102..126b5694 100644
--- a/src/common/vpSubsetEditor.js
+++ b/src/common/vpSubsetEditor.js
@@ -117,12 +117,32 @@ define([
var SubsetEditor = function(pageThis, targetId, useInputVariable=false) {
this.pageThis = pageThis;
this.targetId = targetId;
- this.uuid = vpCommon.getUUID();
+ this.uuid = 'u' + vpCommon.getUUID();
this.useInputVariable = useInputVariable;
// specify pandas object types
this.pdObjTypes = ['DataFrame', 'Series'];
+ // render button
+ this.renderButton();
+
+ var that = this;
+ // open popup
+ $(vpCommon.formatString('.{0}.{1}', VP_DS_BTN, this.uuid)).on('click', function(event) {
+ if (!$(this).hasClass('disabled')) {
+ that.open();
+ }
+ });
+ }
+
+ /**
+ * Initialize SubsetEditor's variables
+ * & set button next to input tag
+ */
+ SubsetEditor.prototype.init = function() {
+ // load css
+ vpCommon.loadCss(Jupyter.notebook.base_url + vpConst.BASE_PATH + vpConst.STYLE_PATH + "common/subsetEditor.css");
+
this.state = {
viewAll: false,
@@ -146,34 +166,32 @@ define([
columnList: [],
colPointer: { start: -1, end: -1 }
}
+
+ this.codepreview = undefined;
+ // render popup div
+ this.render();
this.bindEvent();
- this.init();
// set readonly
- if (useInputVariable) {
+ if (this.useInputVariable) {
$(this.wrapSelector('.' + VP_DS_PANDAS_OBJECT)).attr('disabled', true);
}
- this.loadVariables();
+ this.loadVariables();
}
- /**
- * Initialize SubsetEditor's variables
- * & set button next to input tag
- */
- SubsetEditor.prototype.init = function() {
- // load css
- this.pageThis.loadCss(Jupyter.notebook.base_url + vpConst.BASE_PATH + vpConst.STYLE_PATH + "common/subsetEditor.css");
-
- // Init variables
-
+ SubsetEditor.prototype.renderButton = function() {
// set button next to input tag
var buttonTag = new sb.StringBuilder();
buttonTag.appendFormat(''
, VP_DS_BTN, this.uuid, 'vp-button', 'Edit');
- $(this.pageThis.wrapSelector('#' + this.targetId)).parent().append(buttonTag.toString());
-
+ if (this.pageThis) {
+ $(this.pageThis.wrapSelector('#' + this.targetId)).parent().append(buttonTag.toString());
+ }
+ }
+
+ SubsetEditor.prototype.render = function() {
// add popup div
var popupTag = new sb.StringBuilder();
popupTag.appendFormat('', VP_PP_CONTAINER, width, height);
+
+ // title
+ page.appendFormat('
'); // container end
+ page.appendLine('{1}
'
+ , VP_PP_TITLE
+ , title);
+
+ // close button
+ page.appendFormatLine(''
+ , VP_PP_CLOSE, 'fa fa-close');
+
+ // body start
+ page.appendFormatLine('
', VP_PP_BODY);
+ page.appendLine('
'); // body end
+
+ // button box
+ // Snippets menu don't use buttons
+ if (title != 'Snippets') {
+ page.appendFormatLine('', VP_PP_BUTTON_BOX);
+ page.appendFormatLine(''
+ , VP_PP_BUTTON_CANCEL, 'Cancel');
+ page.appendFormatLine(''
+ , VP_PP_BUTTON_APPLY, 'Apply');
+ page.appendLine('
');
+ }
+
+ page.appendLine('', VP_DS, this.uuid);
@@ -351,7 +369,6 @@ define([
// $(vpCommon.formatString("#{0}", vpConst.VP_CONTAINER_ID)).append(popupTag.toString());
$('#vp-wrapper').append(popupTag.toString());
$(vpCommon.formatString(".{0}.{1}", VP_DS, this.uuid)).hide();
-
}
SubsetEditor.prototype.getAllowSubsetTypes = function() {
@@ -828,8 +845,11 @@ define([
SubsetEditor.prototype.loadVariables = function() {
var that = this;
var types = that.pdObjTypes; //[]; //['DataFrame', 'Series'];
- if (this.useInputVariable) {
- var prevValue = $(this.pageThis.wrapSelector('#' + this.targetId)).val();
+ var prevValue = '';
+ if (this.pageThis) {
+ prevValue = $(this.pageThis.wrapSelector('#' + this.targetId)).val();
+ }
+ if (this.useInputVariable && prevValue != '') {
$(this.wrapSelector('.' + VP_DS_PANDAS_OBJECT)).val(prevValue);
// get type of variable
@@ -1097,6 +1117,36 @@ define([
}
+ SubsetEditor.prototype.unbindEvent = function() {
+ $(document).off(this.wrapSelector('*'));
+
+ $(document).off('click', this.wrapSelector('.' + VP_DS_CLOSE));
+ $(document).off('var_changed change', this.wrapSelector('.' + VP_DS_PANDAS_OBJECT));
+ $(document).off('change', this.wrapSelector('.' + VP_DS_USE_COPY));
+ $(document).off('change', this.wrapSelector('.' + VP_DS_SUBSET_TYPE));
+ $(document).off('change', this.wrapSelector('.' + VP_DS_TO_FRAME));
+ $(document).off('click', this.wrapSelector('.' + VP_DS_TAB_SELECTOR_BTN));
+ $(document).off('change', this.wrapSelector('.' + VP_DS_DATA_VIEW_ALL));
+ $(document).off('change', this.wrapSelector('.' + VP_DS_ROWTYPE));
+ $(document).off('change', this.wrapSelector('.' + VP_DS_COLTYPE));
+ $(document).off('change', this.wrapSelector('.' + VP_DS_INDEXING_TIMESTAMP));
+ $(document).off('change', this.wrapSelector('.select-row .' + VP_DS_SELECT_SEARCH));
+ $(document).off('change', this.wrapSelector('.select-col .' + VP_DS_SELECT_SEARCH));
+ $(document).off('click', this.wrapSelector('.' + VP_DS_SELECT_ITEM));
+ $(document).off('click', this.wrapSelector('.' + VP_DS_SELECT_ADD_BTN));
+ $(document).off('click', this.wrapSelector('.' + VP_DS_SELECT_DEL_BTN));
+ $(document).off('click', this.wrapSelector('.vp-add-col'));
+ $(document).off('click', this.wrapSelector('.vp-del-col'));
+ $(document).off('change', this.wrapSelector('.vp-ds-slicing-box input[type="text"]'));
+ $(document).off('change var_changed', this.wrapSelector('.vp-ds-cond-tbl .vp-cond-var'));
+ $(document).off('change', this.wrapSelector('.vp-ds-cond-tbl .vp-col-list'));
+ $(document).off('change', this.wrapSelector('.vp-ds-cond-tbl .vp-cond-use-text'));
+ $(document).off('change', this.wrapSelector('.vp-ds-cond-tbl input[type="text"]'));
+ $(document).off('change', this.wrapSelector('.vp-ds-cond-tbl select'));
+ $(document).off('click', this.wrapSelector('.' + VP_DS_BUTTON_APPLY));
+ $(document).off('click', this.wrapSelector('.' + VP_DS_BUTTON_CANCEL));
+ }
+
/**
* Bind All Events
* - open popup
@@ -1116,12 +1166,6 @@ define([
*/
SubsetEditor.prototype.bindEvent = function() {
var that = this;
- // open popup
- $(document).on('click', vpCommon.formatString('.{0}.{1}', VP_DS_BTN, this.uuid), function(event) {
- if (!$(this).hasClass('disabled')) {
- that.open();
- }
- });
// close popup
$(document).on('click', this.wrapSelector('.' + VP_DS_CLOSE), function(event) {
@@ -1561,8 +1605,19 @@ define([
// apply
$(document).on('click', this.wrapSelector('.' + VP_DS_BUTTON_APPLY), function(event) {
var code = that.generateCode();
- $(that.pageThis.wrapSelector('#' + that.targetId)).val(code);
- $(that.pageThis.wrapSelector('#' + that.targetId)).trigger('subset_apply');
+ if (that.pageThis) {
+ $(that.pageThis.wrapSelector('#' + that.targetId)).val(code);
+ $(that.pageThis.wrapSelector('#' + that.targetId)).trigger({
+ type: 'subset_apply',
+ code: code
+ });
+ } else {
+ $(vpCommon.wrapSelector('#' + that.targetId)).val(code);
+ $(vpCommon.wrapSelector('#' + that.targetId)).trigger({
+ type: 'subset_apply',
+ code: code
+ });
+ }
that.close();
});
@@ -1613,6 +1668,7 @@ define([
* open popup
*/
SubsetEditor.prototype.open = function() {
+ this.init();
$(this.wrapSelector()).show();
if (!this.codepreview) {
@@ -1648,35 +1704,41 @@ define([
} else {
this.codepreview.refresh();
}
-
- // reload pandasObject on open
- this.loadVariables();
}
/**
* close popup
*/
SubsetEditor.prototype.close = function() {
+ this.unbindEvent();
$(this.wrapSelector()).hide();
}
SubsetEditor.prototype.hideButton = function() {
- $(this.pageThis.wrapSelector('.' + VP_DS_BTN + '.' + this.uuid)).hide();
+ if (this.pageThis) {
+ $(this.pageThis.wrapSelector('.' + VP_DS_BTN + '.' + this.uuid)).hide();
+ }
}
SubsetEditor.prototype.disableButton = function() {
- var buttonEle = $(this.pageThis.wrapSelector('.' + VP_DS_BTN + '.' + this.uuid));
- if (!buttonEle.hasClass('disabled')) {
- buttonEle.addClass('disabled');
+ if (this.pageThis) {
+ var buttonEle = $(this.pageThis.wrapSelector('.' + VP_DS_BTN + '.' + this.uuid));
+ if (!buttonEle.hasClass('disabled')) {
+ buttonEle.addClass('disabled');
+ }
}
}
SubsetEditor.prototype.enableButton = function() {
- $(this.pageThis.wrapSelector('.' + VP_DS_BTN + '.' + this.uuid)).removeClass('disabled');
+ if (this.pageThis) {
+ $(this.pageThis.wrapSelector('.' + VP_DS_BTN + '.' + this.uuid)).removeClass('disabled');
+ }
}
SubsetEditor.prototype.showButton = function() {
- $(this.pageThis.wrapSelector('.' + VP_DS_BTN + '.' + this.uuid)).show();
+ if (this.pageThis) {
+ $(this.pageThis.wrapSelector('.' + VP_DS_BTN + '.' + this.uuid)).show();
+ }
}
/**
diff --git a/src/container/optionSample.js b/src/container/optionSample.js
index 3b2bb239..854150cb 100644
--- a/src/container/optionSample.js
+++ b/src/container/optionSample.js
@@ -31,12 +31,12 @@ define([
// document.getElementsByTagName("head")[0].appendChild(link);
// 컨테이너에서 전달된 callback 함수가 존재하면 실행.
if (typeof(callback) === 'function') {
- var uuid = vpCommon.getUUID();
+ var uuid = 'u' + vpCommon.getUUID();
// 최대 10회 중복되지 않도록 체크
for (var idx = 0; idx < 10; idx++) {
// 이미 사용중인 uuid 인 경우 다시 생성
if ($(vpConst.VP_CONTAINER_ID).find("." + uuid).length > 0) {
- uuid = vpCommon.getUUID();
+ uuid = 'u' + vpCommon.getUUID();
}
}
$(vpCommon.wrapSelector(vpCommon.formatString("#{0}", vpConst.OPTION_GREEN_ROOM))).find(vpCommon.formatString(".{0}", vpConst.API_OPTION_PAGE)).addClass(uuid);
diff --git a/src/file_io/fileio.html b/src/file_io/fileio.html
new file mode 100644
index 00000000..5ad60f41
--- /dev/null
+++ b/src/file_io/fileio.html
@@ -0,0 +1,88 @@
+').append($(`
+
+
\ No newline at end of file
diff --git a/src/file_io/fileio.js b/src/file_io/fileio.js
new file mode 100644
index 00000000..24e1816a
--- /dev/null
+++ b/src/file_io/fileio.js
@@ -0,0 +1,355 @@
+define([
+ 'require'
+ , 'jquery'
+ , 'nbextensions/visualpython/src/common/vpCommon'
+ , 'nbextensions/visualpython/src/common/constant'
+ , 'nbextensions/visualpython/src/common/StringBuilder'
+ , 'nbextensions/visualpython/src/common/vpFuncJS'
+ , 'nbextensions/visualpython/src/pandas/common/commonPandas'
+ , 'nbextensions/visualpython/src/pandas/common/pandasGenerator'
+ , 'nbextensions/visualpython/src/pandas/fileNavigation/index'
+], function (requirejs, $, vpCommon, vpConst, sb, vpFuncJS, libPandas, pdGen, fileNavigation) {
+ // 옵션 속성
+ const funcOptProp = {
+ stepCount : 1
+ , funcName : "기본 연산"
+ , funcID : "pdFunc_basicCal" // TODO: ID 규칙 생성 필요
+ , libID : "pd052"
+ }
+
+ /**
+ * html load 콜백. 고유 id 생성하여 부과하며 js 객체 클래스 생성하여 컨테이너로 전달
+ * @param {function} callback 호출자(컨테이너) 의 콜백함수
+ */
+ var optionLoadCallback = function(callback, meta) {
+ // document.getElementsByTagName("head")[0].appendChild(link);
+ // 컨테이너에서 전달된 callback 함수가 존재하면 실행.
+ if (typeof(callback) === 'function') {
+ var uuid = 'u' + vpCommon.getUUID();
+ // 최대 10회 중복되지 않도록 체크
+ for (var idx = 0; idx < 10; idx++) {
+ // 이미 사용중인 uuid 인 경우 다시 생성
+ if ($(vpConst.VP_CONTAINER_ID).find("." + uuid).length > 0) {
+ uuid = 'u' + vpCommon.getUUID();
+ }
+ }
+ $(vpCommon.wrapSelector(vpCommon.formatString("#{0}", vpConst.OPTION_GREEN_ROOM))).find(vpCommon.formatString(".{0}", vpConst.API_OPTION_PAGE)).addClass(uuid);
+
+ // 옵션 객체 생성
+ var pdPackage = new PandasPackage(uuid);
+ pdPackage.metadata = meta;
+
+ // 옵션 속성 할당.
+ pdPackage.setOptionProp(funcOptProp);
+ // html 설정.
+ pdPackage.initHtml();
+ callback(pdPackage); // 공통 객체를 callback 인자로 전달
+ }
+ }
+
+ /**
+ * html 로드.
+ * @param {function} callback 호출자(컨테이너) 의 콜백함수
+ */
+ var initOption = function(callback, meta) {
+ vpCommon.loadHtml(vpCommon.wrapSelector(vpCommon.formatString("#{0}", vpConst.OPTION_GREEN_ROOM)), "file_io/fileio.html", optionLoadCallback, callback, meta);
+ }
+
+ /**
+ * 본 옵션 처리 위한 클래스
+ * @param {String} uuid 고유 id
+ */
+ var PandasPackage = function(uuid) {
+ this.uuid = uuid; // Load html 영역의 uuid.
+
+ this.dataPath = window.location.origin + vpConst.PATH_SEPARATOR + vpConst.BASE_PATH + vpConst.DATA_PATH + "sample_csv/";
+
+ this.fileExtensions = {
+ 'csv': 'csv',
+ 'excel': 'xls',
+ 'json': 'json',
+ 'pickle': 'pickle'
+ }
+
+ this.fileState = {
+ 'Sample': {
+ library: 'pandas',
+ code: "${vp_sampleReturn} = pd.read_csv('" + this.dataPath + "${vp_sampleFile}'${v})",
+ input: [
+ {
+ name:'vp_sampleFile',
+ label: 'Sample File',
+ component: 'option_select',
+ options: [
+ 'iris.csv', 'Titanic_train.csv', 'Titanic_test.csv', 'cancer.csv',
+ 'fish.csv', 'accidentData.csv', 'campusRecruitment.csv', 'houseData_500.csv',
+ 'lolRankedData_500.csv', 'weatherData_500.csv', 'welfareCenter.csv',
+ 'mnist_train_1000.csv'
+ ],
+ options_label: [
+ 'iris', 'Titanic_train', 'Titanic_test', 'cancer',
+ 'fish', 'accidentData', 'campusRecruitment', 'houseData_500',
+ 'lolRankedData_500', 'weatherData_500', 'welfareCenter',
+ 'mnist_train_1000'
+ ]
+ }
+ ],
+ output: [
+ {
+ name:'vp_sampleReturn',
+ type:'var',
+ label:'Return to',
+ required: true
+ }
+ ]
+ },
+ 'Read': {
+ fileTypeId: {
+ 'csv': 'pd004',
+ 'excel': 'pd123',
+ 'json': 'pd076',
+ 'pickle': 'pd079'
+ },
+ selectedType: 'csv',
+ package: null,
+ fileResultState: {
+ pathInputId : this.wrapSelector('#vp_fileRead #i0'),
+ fileInputId : this.wrapSelector('#vp_fileRead #fileName')
+ }
+ },
+ 'Write': {
+ fileTypeId: {
+ 'csv': 'pd005',
+ 'excel': 'pd124',
+ 'json': 'pd077',
+ 'pickle': 'pd078'
+ },
+ selectedType: 'csv',
+ package: null,
+ fileResultState: {
+ pathInputId : this.wrapSelector('#vp_fileWrite #i1'),
+ fileInputId : this.wrapSelector('#vp_fileWrite #fileName')
+ }
+ }
+ }
+
+ this.state = {
+ paramData:{
+ encoding: "utf-8" // 인코딩
+ , delimiter: "," // 구분자
+ },
+ returnVariable:"", // 반환값
+ isReturnVariable: false,
+ fileExtension: "csv" // 확장자
+ };
+ this.fileResultState = {
+ pathInputId : this.wrapSelector('#i1'),
+ fileInputId : this.wrapSelector('#fileName')
+ };
+ }
+
+
+
+ /**
+ * vpFuncJS 에서 상속
+ */
+ PandasPackage.prototype = Object.create(vpFuncJS.VpFuncJS.prototype);
+
+ /**
+ * 유효성 검사
+ * @returns 유효성 검사 결과. 적합시 true
+ */
+ PandasPackage.prototype.optionValidation = function() {
+ return true;
+
+ // 부모 클래스 유효성 검사 호출.
+ // vpFuncJS.VpFuncJS.prototype.optionValidation.apply(this);
+ }
+
+
+ /**
+ * html 내부 binding 처리
+ */
+ PandasPackage.prototype.initHtml = function() {
+ this.showFunctionTitle();
+ this.loadCss(Jupyter.notebook.base_url + vpConst.BASE_PATH + vpConst.STYLE_PATH + "pandas/commonPandas.css");
+ this.loadCss(Jupyter.notebook.base_url + vpConst.BASE_PATH + vpConst.STYLE_PATH + "file_io/fileio.css");
+
+ this.bindOptions();
+ }
+
+ /**
+ * 선택한 패키지명 입력
+ */
+ PandasPackage.prototype.showFunctionTitle = function() {
+ $(this.wrapSelector('.vp_functionName')).text('File');
+ }
+
+ /**
+ * Pandas 기본 패키지 바인딩
+ */
+ PandasPackage.prototype.bindOptions = function() {
+ var that = this;
+
+ this.renderPage('Read');
+ this.renderPage('Write');
+
+ $(that.wrapSelector('#vp_fileioType')).on('change', function() {
+ var pageType = $(this).val();
+ $(that.wrapSelector('.vp-fileio-box')).hide();
+ $(that.wrapSelector('#vp_file' + pageType)).show();
+
+ //set fileResultState
+ that.fileResultState = {
+ ...that.fileState[pageType].fileResultState
+ };
+ });
+ };
+
+ PandasPackage.prototype.renderPage = function(pageType) {
+ var that = this;
+ var prefix = '#vp_file' + pageType + ' ';
+
+ // clear
+ $(this.wrapSelector(prefix + '#vp_inputOutputBox table')).html('
+
+
+
+
+
+
+
+
+
+ | + | + + | +
| + | + |
-
Common >
-
diff --git a/src/file_io/instance_old.js b/src/file_io/instance_old.js
index 1f2b1581..e9f3a78b 100644
--- a/src/file_io/instance_old.js
+++ b/src/file_io/instance_old.js
@@ -61,12 +61,12 @@ define([
// document.getElementsByTagName("head")[0].appendChild(link);
// 컨테이너에서 전달된 callback 함수가 존재하면 실행.
if (typeof(callback) === 'function') {
- var uuid = vpCommon.getUUID();
+ var uuid = 'u' + vpCommon.getUUID();
// 최대 10회 중복되지 않도록 체크
for (var idx = 0; idx < 10; idx++) {
// 이미 사용중인 uuid 인 경우 다시 생성
if ($(vpConst.VP_CONTAINER_ID).find("." + uuid).length > 0) {
- uuid = vpCommon.getUUID();
+ uuid = 'u' + vpCommon.getUUID();
}
}
$(vpCommon.wrapSelector(vpCommon.formatString("#{0}", vpConst.OPTION_GREEN_ROOM))).find(vpCommon.formatString(".{0}", vpConst.API_OPTION_PAGE)).addClass(uuid);
diff --git a/src/file_io/instance_old2.html b/src/file_io/instance_old2.html
index 657f875f..f80152e0 100644
--- a/src/file_io/instance_old2.html
+++ b/src/file_io/instance_old2.html
@@ -1,6 +1,4 @@
-
Common >
-
diff --git a/src/file_io/instance_old2.js b/src/file_io/instance_old2.js
index c7ee0fac..14d1320d 100644
--- a/src/file_io/instance_old2.js
+++ b/src/file_io/instance_old2.js
@@ -54,12 +54,12 @@ define([
// document.getElementsByTagName("head")[0].appendChild(link);
// 컨테이너에서 전달된 callback 함수가 존재하면 실행.
if (typeof(callback) === 'function') {
- var uuid = vpCommon.getUUID();
+ var uuid = 'u' + vpCommon.getUUID();
// 최대 10회 중복되지 않도록 체크
for (var idx = 0; idx < 10; idx++) {
// 이미 사용중인 uuid 인 경우 다시 생성
if ($(vpConst.VP_CONTAINER_ID).find("." + uuid).length > 0) {
- uuid = vpCommon.getUUID();
+ uuid = 'u' + vpCommon.getUUID();
}
}
$(vpCommon.wrapSelector(vpCommon.formatString("#{0}", vpConst.OPTION_GREEN_ROOM))).find(vpCommon.formatString(".{0}", vpConst.API_OPTION_PAGE)).addClass(uuid);
diff --git a/src/file_io/pip.js b/src/file_io/pip.js
index 62889322..451a9e1c 100644
--- a/src/file_io/pip.js
+++ b/src/file_io/pip.js
@@ -26,12 +26,12 @@ define([
// document.getElementsByTagName("head")[0].appendChild(link);
// 컨테이너에서 전달된 callback 함수가 존재하면 실행.
if (typeof(callback) === 'function') {
- var uuid = vpCommon.getUUID();
+ var uuid = 'u' + vpCommon.getUUID();
// 최대 10회 중복되지 않도록 체크
for (var idx = 0; idx < 10; idx++) {
// 이미 사용중인 uuid 인 경우 다시 생성
if ($(vpConst.VP_CONTAINER_ID).find("." + uuid).length > 0) {
- uuid = vpCommon.getUUID();
+ uuid = 'u' + vpCommon.getUUID();
}
}
$(vpCommon.wrapSelector(vpCommon.formatString("#{0}", vpConst.OPTION_GREEN_ROOM))).find(vpCommon.formatString(".{0}", vpConst.API_OPTION_PAGE)).addClass(uuid);
diff --git a/src/file_io/settings.js b/src/file_io/settings.js
index 9838e42b..d2ddf2bd 100644
--- a/src/file_io/settings.js
+++ b/src/file_io/settings.js
@@ -27,12 +27,12 @@ define([
// document.getElementsByTagName("head")[0].appendChild(link);
// 컨테이너에서 전달된 callback 함수가 존재하면 실행.
if (typeof(callback) === 'function') {
- var uuid = vpCommon.getUUID();
+ var uuid = 'u' + vpCommon.getUUID();
// 최대 10회 중복되지 않도록 체크
for (var idx = 0; idx < 10; idx++) {
// 이미 사용중인 uuid 인 경우 다시 생성
if ($(vpConst.VP_CONTAINER_ID).find("." + uuid).length > 0) {
- uuid = vpCommon.getUUID();
+ uuid = 'u' + vpCommon.getUUID();
}
}
$(vpCommon.wrapSelector(vpCommon.formatString("#{0}", vpConst.OPTION_GREEN_ROOM))).find(vpCommon.formatString(".{0}", vpConst.API_OPTION_PAGE)).addClass(uuid);
diff --git a/src/file_io/udf.html b/src/file_io/udf.html
index 457fca01..22e35b98 100644
--- a/src/file_io/udf.html
+++ b/src/file_io/udf.html
@@ -1,5 +1,5 @@
-
+
+
@@ -20,26 +22,24 @@
@@ -11,6 +11,8 @@
Export
+
+
-
-
+
-
diff --git a/src/file_io/udf.js b/src/file_io/udf.js
index 9ee022a9..e53d9367 100644
--- a/src/file_io/udf.js
+++ b/src/file_io/udf.js
@@ -33,12 +33,12 @@ define([
// document.getElementsByTagName("head")[0].appendChild(link);
// 컨테이너에서 전달된 callback 함수가 존재하면 실행.
if (typeof(callback) === 'function') {
- var uuid = vpCommon.getUUID();
+ var uuid = 'u' + vpCommon.getUUID();
// 최대 10회 중복되지 않도록 체크
for (var idx = 0; idx < 10; idx++) {
// 이미 사용중인 uuid 인 경우 다시 생성
if ($(vpConst.VP_CONTAINER_ID).find("." + uuid).length > 0) {
- uuid = vpCommon.getUUID();
+ uuid = 'u' + vpCommon.getUUID();
}
}
$(vpCommon.wrapSelector(vpCommon.formatString("#{0}", vpConst.OPTION_GREEN_ROOM))).find(vpCommon.formatString(".{0}", vpConst.API_OPTION_PAGE)).addClass(uuid);
@@ -81,6 +81,9 @@ define([
this.importedList = [];
this.title_no = 0;
+ // double click setter
+ this.clicked = 0;
+
// file navigation : state 데이터 목록
this.state = {
paramData:{
@@ -137,125 +140,23 @@ define([
OptionPackage.prototype.bindEvent = function() {
var that = this;
- // save udf
- $(this.wrapSelector('#vp_udfSave')).click(function() {
- // if title is not empty
- var key = $(that.wrapSelector('#vp_udfTitle')).val();
- if (key == undefined || key === "") {
- vpCommon.renderAlertModal('Please enter the title');
- return;
- }
-
- // save codemirror value to origin textarea
- that.vp_userCode.save();
- var code = that.vp_userCode.getValue();
-
- // save udf
- var saveUdf = { [key]: code };
- vpSetting.saveUserDefinedCode(saveUdf);
-
- // FIXME: vp-multilang for success message
- vpCommon.renderSuccessMessage('Successfully saved!');
-
- // load again
- that.loadUdfList();
- });
-
- // load when refresh clicks
- $(this.wrapSelector('#vp_udfRefresh')).click(function(event) {
- event.stopPropagation();
- that.loadUdfList();
- // show success message
- vpCommon.renderSuccessMessage('Refreshed!');
- });
-
- // new button clicked
- $(this.wrapSelector('#vp_udfCreate')).click(function() {
- that.vp_userCode.save();
- var code = that.vp_userCode.getValue();
-
- if (code && code.length > 0) {
- // ask clearing codes
- that.openMultiBtnModal_new("Save Code", "Would you like to save previous code and clear it?"
- , ["Just Clear", "Cancel", "Save and Clear"]
- , [()=> {
- // clear code
- $(that.wrapSelector('#vp_udfTitle')).val('');
- $(that.wrapSelector('#vp_userCode')).val('');
- that.vp_userCode.setValue('');
- }, ()=> {
-
- }, ()=> {
- // save and clear code
- // save
- var key = $(that.wrapSelector('#vp_udfTitle')).val();
- if (key == undefined || key === "") {
- key = '_temporary';
- }
-
- // save codemirror value to origin textarea
- that.vp_userCode.save();
- var code = that.vp_userCode.getValue();
-
- // save udf
- var saveUdf = { [key]: code };
- vpSetting.saveUserDefinedCode(saveUdf);
-
- // clear code
- $(that.wrapSelector('#vp_udfTitle')).val('');
- $(that.wrapSelector('#vp_userCode')).val('');
- that.vp_userCode.setValue('');
-
- // load again
- that.loadUdfList();
- }]);
- } else {
- // clear code
- $(that.wrapSelector('#vp_udfTitle')).val('');
- $(that.wrapSelector('#vp_userCode')).val('');
- that.vp_userCode.setValue('');
- }
- });
-
- // delete button clicked
- $(this.wrapSelector('#vp_udfDelete')).click(function() {
- // remove key from list
- var key = $(that.wrapSelector('#vp_udfList')).find('.vp-udf-check:checked').val();
- if (key && vpSetting.getUserDefinedCode(key)) {
- // remove key
- vpSetting.removeUserDefinedCode(key);
-
- // FIXME: vp-multilang for success message
- vpCommon.renderSuccessMessage('Successfully removed!');
- } else {
- vpCommon.renderAlertModal('No key available...');
- }
-
- // load again
- that.loadUdfList();
- });
-
-
-
- ///////////////////// new /////////////////////////////////////////
-
// toggle item codebox
- $(document).on('click', this.wrapSelector('.vp-sn-item-header .vp-sn-indicator'), function() {
- var parent = $(this).parent();
- var hasOpen = $(this).hasClass('open');
- // hide all codebox
- $(that.wrapSelector('.vp-sn-indicator')).removeClass('open');
- $(that.wrapSelector('.vp-sn-item-code')).hide();
+ // $(document).on('click', this.wrapSelector('.vp-sn-item-header .vp-sn-indicator'), function() {
+ // var parent = $(this).parent();
+ // var hasOpen = $(this).hasClass('open');
+ // // hide all codebox
+ // $(that.wrapSelector('.vp-sn-indicator')).removeClass('open');
+ // $(that.wrapSelector('.vp-sn-item-code')).hide();
- if (!hasOpen) {
- // show code
- $(this).addClass('open');
- $(parent).parent().find('.vp-sn-item-code').show();
- } else {
- // hide code
- $(parent).parent().find('.vp-sn-item-code').hide();
- }
- });
+ // if (!hasOpen) {
+ // // show code
+ // $(this).addClass('open');
+ // $(parent).parent().find('.vp-sn-item-code').show();
+ // } else {
+ // // hide code
+ // $(parent).parent().find('.vp-sn-item-code').hide();
+ // }
+ // });
// menu popup
$(document).on('click', this.wrapSelector('.vp-sn-menu'), function(evt) {
@@ -263,10 +164,10 @@ define([
$(that.wrapSelector('.vp-sn-menu-box')).toggle();
});
- // filter menu popup
- $(document).on('click', this.wrapSelector('.vp-sn-filter'), function(evt) {
+ // sort menu popup
+ $(document).on('click', this.wrapSelector('.vp-sn-sort'), function(evt) {
evt.stopPropagation();
- $(that.wrapSelector('.vp-sn-filter-menu-box')).toggle();
+ $(that.wrapSelector('.vp-sn-sort-menu-box')).toggle();
});
// menu click
@@ -295,6 +196,38 @@ define([
} else if (menu == 'export') {
// set as export mode
$(that.wrapSelector('.vp-sn-body')).addClass('vp-sn-export-mode');
+
+ // check all
+ $(that.wrapSelector('.vp-sn-check-all')).prop('checked', true);
+ $(that.wrapSelector('.vp-sn-item-check')).prop('checked', true);
+ } else if (menu == 'default-snippets') {
+ // import default snippets
+ var defaultSnippets = {
+ 'default import': 'import numpy as np\nimport pandas as pd\nimport matplotlib.pyplot as plt\n%matplotlib inline\nimport seaborn as sns'
+ }
+ var timestamp = new Date().getTime();
+
+ var keys = Object.keys(defaultSnippets);
+ var importKeys = [];
+ keys.forEach(key => {
+ var importKey = key;
+ var importNo = 1;
+ var titleList = Object.keys(that.codemirrorList);
+ // set duplicate title
+ while(titleList.includes(importKey)) {
+ importKey = key + '_imported' + importNo;
+ importNo += 1;
+ }
+ var newSnippet = { [importKey]: { code: defaultSnippets[key], timestamp: timestamp } };
+ vpSetting.saveUserDefinedCode(newSnippet);
+
+ importKeys.push(importKey);
+ });
+ that.importedList = [ ...importKeys ];
+
+ that.loadUdfList();
+
+ vpCommon.renderSuccessMessage('Default snippets imported');
}
});
@@ -311,8 +244,8 @@ define([
}
});
- // filter item
- $(document).on('click', this.wrapSelector('.vp-sn-filter-menu-item'), function() {
+ // sort item
+ $(document).on('click', this.wrapSelector('.vp-sn-sort-menu-item'), function() {
var menu = $(this).data('menu');
if (menu == 'name') {
// sort by name
@@ -355,34 +288,111 @@ define([
that.title_no += 1;
});
+ // item header click (toggle & select item) & double click (edit title)
+ $(document).on('click', this.wrapSelector('.vp-sn-item-header'), function(evt) {
+ var thisHeader = this;
+ that.clicked++;
+ if (that.clicked == 1) {
+ setTimeout(function(){
+ if(that.clicked > 1) {
+ // double click
+ // enable input
+ $(thisHeader).find('.vp-sn-item-title').prop('disabled', false);
+ $(thisHeader).find('.vp-sn-item-title').focus();
+
+ }
+ // single click
+ // select item
+ // remove selection
+ $(that.wrapSelector('.vp-sn-item-header')).removeClass('selected');
+ // select item
+ $(thisHeader).addClass('selected');
+
+ // toggle item
+ var parent = $(thisHeader).parent();
+ var indicator = $(thisHeader).find('.vp-sn-indicator');
+ var hasOpen = $(indicator).hasClass('open');
+ // hide all codebox
+ $(that.wrapSelector('.vp-sn-indicator')).removeClass('open');
+ $(that.wrapSelector('.vp-sn-item-code')).hide();
+
+ if (that.clicked > 1 || !hasOpen) {
+ // show code
+ $(indicator).addClass('open');
+ $(parent).find('.vp-sn-item-code').show();
+ } else {
+ // hide code
+ $(parent).find('.vp-sn-item-code').hide();
+ }
+ that.clicked = 0;
+ }, 200);
+ }
+ evt.stopPropagation();
+ });
+
+ // prevent occuring header click event by clicking input
+ $(document).on('click', this.wrapSelector('.vp-sn-item-title'), function(evt) {
+ evt.stopPropagation();
+ });
+
// item title save
- $(document).on('change', this.wrapSelector('.vp-sn-item-title'), function(evt) {
+ $(document).on('blur', this.wrapSelector('.vp-sn-item-title'), function(evt) {
var prevTitle = $(this).closest('.vp-sn-item').data('title');
- var newTitle = $(this).val();
+ var inputTitle = $(this).val();
- that.codemirrorList[prevTitle].save();
- var code = that.codemirrorList[prevTitle].getValue();
- // 기존 title 제거
- vpSetting.removeUserDefinedCode(prevTitle);
-
- // 새 title로 저장
- // save udf
- var newTimestamp = new Date().getTime();
- var newSnippet = { [newTitle]: { code: code, timestamp: newTimestamp } };
- vpSetting.saveUserDefinedCode(newSnippet);
+ if (prevTitle == inputTitle) {
+ ;
+ } else {
+ // check duplicated
+ var titleList = Object.keys(that.codemirrorList);
+ var newTitle = inputTitle;
+ var dupNo = 0
+ while(titleList.includes(newTitle)) {
+ dupNo += 1;
+ newTitle = inputTitle + '_' + dupNo;
+ }
+
+ that.codemirrorList[prevTitle].save();
+ var code = that.codemirrorList[prevTitle].getValue();
+ // 기존 title 제거
+ vpSetting.removeUserDefinedCode(prevTitle);
+
+ // 새 title로 저장
+ // save udf
+ var newTimestamp = new Date().getTime();
+ var newSnippet = { [newTitle]: { code: code, timestamp: newTimestamp } };
+ vpSetting.saveUserDefinedCode(newSnippet);
+
+ // update title & codemirror
+ $(this).closest('.vp-sn-item-title').val(newTitle);
+ $(this).closest('.vp-sn-item').data('title', newTitle);
+ // update codemirror
+ that.codemirrorList[newTitle] = that.codemirrorList[prevTitle];
+ delete that.codemirrorList[prevTitle];
+ }
- // update title & codemirror
- $(this).closest('.vp-sn-item').data('title', newTitle);
- // update codemirror
- that.codemirrorList[newTitle] = that.codemirrorList[prevTitle];
- delete that.codemirrorList[prevTitle];
+ // disable
+ $(this).prop('disabled', true);
});
// item menu click
$(document).on('click', this.wrapSelector('.vp-sn-item-menu-item'), function(evt) {
var menu = $(this).data('menu');
var title = $(this).closest('.vp-sn-item').data('title');
- if (menu == 'duplicate') {
+ if (menu == 'run') {
+ var item = $(this).closest('.vp-sn-item');
+ var title = $(item).data('title');
+
+ // get codemirror
+ that.codemirrorList[title].save();
+ var code = that.codemirrorList[title].getValue();
+ $(vpCommon.wrapSelector('#vp_appsCode')).val(code);
+ $(vpCommon.wrapSelector('#vp_appsCode')).trigger({
+ type: 'popup_apply',
+ title: 'Snippets',
+ code: code
+ });
+ } else if (menu == 'duplicate') {
var dupNo = 1;
var timestamp = new Date().getTime();
var dupTitle = title + '_dup' + dupNo;
@@ -403,7 +413,7 @@ define([
var dupSnippet = { [dupTitle]: { code: code, timestamp: timestamp } };
vpSetting.saveUserDefinedCode(dupSnippet);
- var tag = $(that.wrapSelector('.vp-sn-item-code textarea[data-title="' + dupTitle + '"]'));
+ var tag = $(that.wrapSelector('.vp-sn-item[data-title="' + dupTitle + '"] textarea'));
that.bindCodeMirror(dupTitle, tag[0]);
$(dupItem).find('.vp-sn-indicator').trigger('click');
@@ -411,6 +421,7 @@ define([
if (title && vpSetting.getUserDefinedCode(title)) {
// remove key
vpSetting.removeUserDefinedCode(title);
+ delete that.codemirrorList[title];
// remove item
$(that.wrapSelector('.vp-sn-item[data-title="' + title + '"]')).remove();
@@ -450,36 +461,43 @@ define([
// export snippets
$(document).on('click', this.wrapSelector('.vp-sn-export'), async function() {
- var checked = $(that.wrapSelector('.vp-sn-item-check:checked'));
- if (checked.length <= 0) {
- return ;
- }
-
- var loadURLstyle = Jupyter.notebook.base_url + vpConst.BASE_PATH + vpConst.STYLE_PATH;
- var loadURLhtml = Jupyter.notebook.base_url + vpConst.BASE_PATH + vpConst.SOURCE_PATH + "component/fileNavigation/index.html";
-
- that.loadCss( loadURLstyle + "component/fileNavigation.css");
+ var menu = $(this).data('menu');
+ if (menu == 'cancel') {
+ // cancel
+ // return to default mode
+ $(that.wrapSelector('.vp-sn-body')).removeClass('vp-sn-export-mode');
+ } else if (menu == 'export') {
+ var checked = $(that.wrapSelector('.vp-sn-item-check:checked'));
+ if (checked.length <= 0) {
+ return ;
+ }
- await $(``)
- .load(loadURLhtml, () => {
-
- $('#vp_fileNavigation').removeClass("hide");
- $('#vp_fileNavigation').addClass("show");
-
- var { vp_init
- , vp_bindEventFunctions } = fileNavigation;
-
- fileNavigation.vp_init(that, "SAVE_SNIPPETS");
- // fileNavigation.vp_init(that.getStateAll());
- fileNavigation.vp_bindEventFunctions();
- })
- .appendTo("#site");
+ var loadURLstyle = Jupyter.notebook.base_url + vpConst.BASE_PATH + vpConst.STYLE_PATH;
+ var loadURLhtml = Jupyter.notebook.base_url + vpConst.BASE_PATH + vpConst.SOURCE_PATH + "component/fileNavigation/index.html";
+
+ that.loadCss( loadURLstyle + "component/fileNavigation.css");
+
+ await $(``)
+ .load(loadURLhtml, () => {
+
+ $('#vp_fileNavigation').removeClass("hide");
+ $('#vp_fileNavigation').addClass("show");
+
+ var { vp_init
+ , vp_bindEventFunctions } = fileNavigation;
+
+ fileNavigation.vp_init(that, "SAVE_SNIPPETS");
+ // fileNavigation.vp_init(that.getStateAll());
+ fileNavigation.vp_bindEventFunctions();
+ })
+ .appendTo("#site");
+ }
});
// export complete event
$(document).on('snippetSaved.fileNavigation', this.wrapSelector('.vp-sn-filepath'), function(evt) {
- var fileName = evt.path;
+ var fileName = evt.file;
var selectedPath = $(this).val();
// get checked snippets
@@ -551,17 +569,21 @@ define([
item.appendFormatLine('
+
-
+
', 'vp-sn-item', title, timestamp);
item.appendFormatLine('
', 'vp-sn-item-header');
item.appendFormatLine('', 'vp-sn-indicator');
- item.appendFormatLine('', 'vp-sn-item-title', title);
+ item.appendFormatLine('', 'vp-sn-item-title', title);
if (hasImported) {
item.appendFormatLine('', 'fa fa-circle vp-sn-imported-item');
}
item.appendFormatLine('
', 'vp-sn-item-menu');
- item.appendFormatLine('
'
- , 'vp-sn-item-menu-item', 'duplicate');
+ item.appendFormatLine('
'
+ , 'vp-sn-item-menu-item', 'run', 'Run');
+ item.appendFormatLine('
', '/nbextensions/visualpython/resource/snippets/run.svg');
+ item.appendLine('
');
+ item.appendFormatLine(''
+ , 'vp-sn-item-menu-item', 'duplicate', 'Duplicate');
item.appendFormatLine('', '/nbextensions/visualpython/resource/snippets/duplicate.svg');
item.appendLine('
');
- item.appendFormatLine(''
- , 'vp-sn-item-menu-item', 'delete');
+ item.appendFormatLine('
'); // end of vp-sn-item-menu
@@ -657,6 +679,19 @@ define([
// save codemirror value to origin textarea
// this.vp_userCode.save();
+ // selected snippet
+ var selected = $(this.wrapSelector('.vp-sn-item-header.selected'));
+ if (selected) {
+ var item = $(selected).closest('.vp-sn-item');
+ var title = $(item).data('title');
+
+ // get codemirror
+ this.codemirrorList[title].save();
+ var code = this.codemirrorList[title].getValue();
+ sbCode.append(code);
+ }
+
+
if (addCell) this.cellExecute(sbCode.toString(), exec);
return sbCode.toString();
diff --git a/src/file_io/variables.html b/src/file_io/variables.html
index a1d5095c..0e2fffc7 100644
--- a/src/file_io/variables.html
+++ b/src/file_io/variables.html
@@ -1,6 +1,4 @@
'
+ , 'vp-sn-item-menu-item', 'delete', 'Delete');
item.appendFormatLine('', '/nbextensions/visualpython/resource/snippets/delete.svg');
item.appendLine('
');
item.appendLine('
-