diff --git a/data/m_library/pythonLibrary.js b/data/m_library/pythonLibrary.js index 2407ee5a..9b9b2542 100644 --- a/data/m_library/pythonLibrary.js +++ b/data/m_library/pythonLibrary.js @@ -279,7 +279,8 @@ define([ { name: 'i0', label: 'Input Data', - component: ['var_select'] + component: ['key_value'] + // component: ['var_select'] }, { name: 'o0', diff --git a/js/com/com_generatorV2.js b/js/com/com_generatorV2.js index 41f60320..bcb5922e 100644 --- a/js/com/com_generatorV2.js +++ b/js/com/com_generatorV2.js @@ -30,6 +30,7 @@ define([ 'scalar': 'Scalar Value', 'param': 'Param Value', 'dtype': 'Dtype', + 'key_val': 'Key Value', 'bool_checkbox': 'Boolean', 'bool_select': 'Select Boolean', 'option_select': 'Select option', @@ -256,6 +257,9 @@ define([ case 'dtype': content = renderDtypeSelector(pageThis, obj, state); break; + case 'key_value': + content = renderKeyValue(pageThis, obj, state); + break; case 'tabblock': content = renderTabBlock(pageThis, obj, state); break; @@ -635,10 +639,13 @@ define([ */ var vp_codeGenerator = function(pageThis, package, state = {}, etcOptions = '') { var code = package.code; - + console.log("code is " + code); try { package.options && package.options.forEach(function(v, i) { var val = state[v.name]; + console.log("v.name is " + v.name); + console.log("v is " , v); + console.log("val is " + val); if (val == undefined || val == '' || val == v.default) { val = vp_getTagValue(pageThis, v); } @@ -649,6 +656,7 @@ define([ } // if no value, replace it code = code.split(id).join(''); + console.log("code2 is " + code); } else { // text quotation if (v.type == 'text') { @@ -675,6 +683,7 @@ define([ } } code = code.split(id).join(val); + console.log("code3 is " + code); } }); @@ -1101,6 +1110,43 @@ define([ return slctTag; } + // (pageThis, obj, state) + var renderKeyValue = function(pageThis, obj, state) { + let arrKey = obj.name + '_key_val'; + let arrState = [ '' ]; + let value = `${arrState.join(',')}`; + if (state[arrKey] == undefined) { + pageThis.setState({ [arrKey]: arrState }); + pageThis.setState({ [obj.name]: value}); + } else { + arrState = state[arrKey]; + value = `${arrState.join(',')}`; + } + + let contentTag = $(`
`); + $(contentTag).attr({ + 'data-id': obj.name + }); + contentTag.data('obj', obj); + // Array Items + let arrItems = $(`
`); + arrState.forEach((item, idx) => { + arrItems.append($(`
+
+ ${idx + 1} +
+ + + + +
`)); + }); + contentTag.append(arrItems); + // add button + contentTag.append($(``)); + return contentTag; + } + var renderTabBlock = function(pageThis, obj, defaultValue) { return $(''); } @@ -1313,7 +1359,7 @@ define([ pageThis.setState({ [id]: code }); $(pageThis.wrapSelector('#'+id)).val(code); }); - + //==================================================================== // Event for ndArr //==================================================================== @@ -1367,6 +1413,61 @@ define([ pageThis.setState({ [id]: code }); $(pageThis.wrapSelector('#'+id)).val(code); }); + //==================================================================== + // Event for ndArr + //==================================================================== + $(selector).on('click', '.vp-key-val-del', function() { + let id = $(this).closest('.vp-key-val-box').data('id'); + let arrId = id + '_key_val'; + let idx = $(this).parent().find('.vp-key-val-item').data('idx'); + // update state + let state = pageThis.getState(arrId); + state.splice(idx, 1); + pageThis.setState({ [arrId]: state }); + pageThis.setState({ [id]: `${state.join(',')}` }); + // re-render + let obj = $(this).closest('.vp-key-val-box').data('obj'); + $(this).closest('.vp-key-val-box').replaceWith(function() { + return renderKeyValue(pageThis, obj, pageThis.getState()); + }); + }); + + $(selector).on('click', '.vp-key-val-add', function() { + //alert("press key val add"); + let id = $(this).closest('.vp-key-val-box').data('id'); + let arrId = id + '_key_val'; + let idx = 0; + // update state + let state = pageThis.getState(arrId); + if (!state) { + state = [ ]; + } else { + idx = state.length; + } + state.push(0); + pageThis.setState({ [arrId]: state }); + pageThis.setState({ [id]: `${state.join(',')}` }); + // re-render + let obj = $(this).closest('.vp-key-val-box').data('obj'); + $(this).closest('.vp-key-val-box').replaceWith(function() { + return renderKeyValue(pageThis, obj, pageThis.getState()); + }); + }); + + $(selector).on('change', '.vp-key-val-item', function() { + //alert("change key val"); + let id = $(this).closest('.vp-key-val-box').data('id'); + let arrId = id + '_key_val'; + let idx = $(this).data('idx'); + let value = $(this).val(); + // update state + let state = pageThis.getState(arrId); + state[idx] = value; + let code = `${state.join(',')}`; + pageThis.setState({ [arrId]: state }); + pageThis.setState({ [id]: code }); + $(pageThis.wrapSelector('#'+id)).val(code); + }); //==================================================================== diff --git a/js/com/component/NumpyComponent.js b/js/com/component/NumpyComponent.js index 224e74fb..7d3666af 100644 --- a/js/com/component/NumpyComponent.js +++ b/js/com/component/NumpyComponent.js @@ -39,8 +39,10 @@ define([ let findPackage = null; if (packageName == 'numpy') { findPackage = numpyLibrary.NUMPY_LIBRARIES[this.packageId]; + console.log("packge numpy"); } else if (packageName == 'python') { findPackage = pythonLibrary.PYTHON_LIBRARIES[this.packageId]; + console.log("packge python !!"); } if (findPackage) { this.package = JSON.parse(JSON.stringify(findPackage)); // deep copy of package @@ -159,6 +161,7 @@ define([ } generateCode() { + alert("this is numpy component"); let code = com_generatorV2.vp_codeGenerator(this, this.package, this.state); return code; } diff --git a/js/m_logic/Comment.js b/js/m_logic/Comment.js index 83ba3e75..37c36d5e 100644 --- a/js/m_logic/Comment.js +++ b/js/m_logic/Comment.js @@ -6,7 +6,7 @@ * Note : Logic > comment * License : GNU GPLv3 with Visual Python special exception * Date : 2021. 11. 18 - * Change Date : + * Change Date : 2022. 08. 02 */ //============================================================================ @@ -18,6 +18,67 @@ define([ ], function(com_String, PopupComponent) { const COMMENT_DEFAULT_CODE = '# Write down comments' + // Templates from NumPy Style Python Docstrings. + const COMMENT_CLASS_TEMPLATE = +` +"""Summarize the class in one line. + +Several sentences ... +providing an extended description. + +Note +---------- +Note about this class. + +Parameters +---------- +param1 : param_type + Parameter description. +param2 : param_type + Parameter description. + +Attributes +---------- +attr1 : attr_type + Attibute description. +attr2 : attr_type + Attibute description. + +Examples +---------- + +References +---------- + +""" +` + const COMMENT_METHOD_TEMPLATE = +` +"""Summarize the function in one line. + +Several sentences ... +providing an extended description. + +Parameters +---------- +param1 : param_type + Parameter description. +param2 : param_type + Parameter description. + +Returns +------- +return_type + Return description. + +Note +---------- + +Examples +---------- + +""" +` /** * Comment @@ -29,25 +90,67 @@ define([ this.config.dataview = false; this.config.codeview = false; this.config.saveOnly = true; + + this.cmKey = 'code'; // Code Mirror Key + this.selectBoxClassName = 'vp-ct-option'; // Select Box ClassName this.state = { code: COMMENT_DEFAULT_CODE, ...this.state + }; + + this.cmTemplates = { // a kind of templates + Template : COMMENT_DEFAULT_CODE, + Class : COMMENT_CLASS_TEMPLATE, + Method : COMMENT_METHOD_TEMPLATE } - this._addCodemirror('code', this.wrapSelector('#code')); + this._addCodemirror(this.cmKey, this.wrapSelector('#code')); } _bindEvent() { super._bindEvent(); - /** Implement binding events */ + + var commentTemplates = this.cmTemplates; + var cm_key = this.cmKey; + let cmCodeListTemp = this.cmCodeList; + + // Select box change Event + $('.' + this.selectBoxClassName).on('change', function(){ + // get code mirror object + let targetCmObj = cmCodeListTemp.filter(obj => obj.key == cm_key); + var templateOption = $(this).val(); + let cm = targetCmObj[0].cm; + + // Change Code Mirror Text + if(templateOption == 'vp_template_class'){ + cm.setValue(commentTemplates.Class); + }else if(templateOption == 'vp_template_method'){ + cm.setValue(commentTemplates.Method); + }else if(templateOption == 'vp_template_template'){ + cm.setValue(commentTemplates.Template); + } + + cm.save(); + }); + } + templateForBody() { /** Implement generating template */ var page = new com_String(); page.appendFormatLine('' , this.state.code); + // add select box + page.appendFormatLine(''); + return page.toString(); } @@ -55,19 +158,19 @@ define([ super.open(); if (this.state.code === COMMENT_DEFAULT_CODE) { - // set default selection - let cmObj = this.getCodemirror('code'); + + let cmObj = this.getCodemirror(this.cmKey); if (cmObj && cmObj.cm) { cmObj.cm.setSelection({ line: 0, ch: 2 }, { line: 0 }); cmObj.cm.focus(); } } } - + generateCode() { return this.state.code; } - + } return Comment;