Fixed Load/Save operation for WordCloud

minjk-bl · minjk-bl · commit 62255d4c7d36 · 2022-05-24T19:20:41.000+09:00
diff --git a/html/m_visualize/wordCloud.html b/html/m_visualize/wordCloud.html
@@ -24,7 +24,7 @@
                         </div>
 
                         <label for="wordCount" class="vp-bold">Number of words</label>
-                        <input type="number" id="wordCount" class="vp-input vp-state" min="0" value="200"/>
+                        <input type="number" id="wordCount" class="vp-input vp-state" min="0"/>
 
                     </div>
                     <div class="vp-tab-page vp-grid-box" data-type="wordcloud" style="display: none;">
@@ -40,8 +40,8 @@
                     <div class="vp-tab-page vp-grid-box" data-type="plot" style="display: none;">
                         <label for="figWidth" class="vp-bold">Figure size</label>
                         <div>
-                            <input type="number" id="figWidth" class="vp-input vp-state" min="0" value="8" placeholder="Width"/>
-                            <input type="number" id="figHeight" class="vp-input vp-state" min="0" value="20" placeholder="Height"/>
+                            <input type="number" id="figWidth" class="vp-input vp-state" min="0" placeholder="Width"/>
+                            <input type="number" id="figHeight" class="vp-input vp-state" min="0" placeholder="Height"/>
                         </div>
                     </div>
                 </div>
diff --git a/js/com/component/DataSelector.js b/js/com/component/DataSelector.js
@@ -185,7 +185,7 @@ define([
                     that.state.dataType = ui.item.dtype;
                     that.state.returnDataType = ui.item.dtype;
 
-                    // that.prop.pageThis.state[that.prop.id + '_state'] = that.state;
+                    that.prop.pageThis.state[that.prop.id + '_state'] = that.state;
 
                     $(this).trigger('change');
 
diff --git a/js/m_visualize/WordCloud.js b/js/m_visualize/WordCloud.js
@@ -36,7 +36,7 @@ define([
                 data: '',
                 useFile: false,
                 encoding: '',
-                wordCount: 200,
+                wordCount: '200',
                 stopWords: '',
                 fontPath: '',
                 userOption: '', 
@@ -103,6 +103,37 @@ define([
                 $(page).find('.vp-wc-file-option').hide();
             }
 
+            let that = this;
+            //================================================================
+            // Load state
+            //================================================================
+            Object.keys(this.state).forEach(key => {
+                let tag = $(page).find('#' + key);
+                let tagName = $(tag).prop('tagName'); // returns with UpperCase
+                let value = that.state[key];
+                if (value == undefined) {
+                    return;
+                }
+                switch(tagName) {
+                    case 'INPUT':
+                        let inputType = $(tag).prop('type');
+                        if (inputType == 'text' || inputType == 'number' || inputType == 'hidden') {
+                            $(tag).val(value);
+                            break;
+                        }
+                        if (inputType == 'checkbox') {
+                            $(tag).prop('checked', value);
+                            break;
+                        }
+                        break;
+                    case 'TEXTAREA':
+                    case 'SELECT':
+                    default:
+                        $(tag).val(value);
+                        break;
+                }
+            });
+
             return page;
         }
 
@@ -120,7 +151,7 @@ define([
                 'height': '200px'
             });
 
-            // FIXME: bind dataSelector to #data
+            // bind dataSelector to #data
             let dataSelector = new DataSelector({
                 type: 'data',
                 pageThis: this,
@@ -132,8 +163,6 @@ define([
                 finish: function() {
                     that.state.useFile = false;
                     $(that.wrapSelector('.vp-wc-file-option')).hide();
-                    
-                    $(that.wrapSelector('#data')).change();
                 }
             });
             $(this.wrapSelector('#data')).replaceWith(dataSelector.toTagString());
@@ -239,7 +268,7 @@ define([
 
         generateCode(preview=false) {
             let { 
-                data, useFile, encoding, wordCount, 
+                data, data_state, useFile, encoding, wordCount, 
                 stopWords, fontPath, userOption, figWidth, figHeight 
             } = this.state;
             let code = new com_String();
@@ -263,11 +292,16 @@ define([
                 code.appendLine("    word_cloud_text = fp.read()");
                 code.appendLine();
                 dataVariable = 'word_cloud_text';
-            }
-            // check data type and convert it to string
-            let dataType = $(this.wrapSelector('#data')).data('type');
-            if (dataType == 'DataFrame' || dataType == 'Series') {
-                dataVariable = data + '.to_string()';
+            } else {
+                // check data type and convert it to string
+                // let dataType = $(this.wrapSelector('#data')).data('type');
+                let dataType = '';
+                if (data_state) {
+                    dataType = data_state['returnDataType'];
+                }
+                if (dataType == 'DataFrame' || dataType == 'Series') {
+                    dataVariable = data + '.to_string()';
+                }
             }
             code.appendFormatLine("counts = Counter({0}.split())", dataVariable);
             code.appendFormatLine("tags = counts.most_common({0})", wordCount);
