import, export commands in extension

Author: tczagany

media/scripts/uiLogic-main.js

@@ -1,14 +1,15 @@
 const vscode = acquireVsCodeApi();
 let navChart = undefined;
 let infoChart = undefined;
+let Vizzu = undefined;
 
 (function () {
     window.addEventListener('message', async event => {
         const message = event.data;
         switch (message.command) {
             case 'clear-data-table':
                 await resetVizzuCharts();
-                break;
+            break;
             case 'refresh-data-table':
                 await initializingVizzuCharts(message.dataTable);
                 performInitAnimation(message.dataSummary);
@@ -25,10 +26,9 @@ function importVizzuLibAndCreateCharts() {
         navChart = undefined;
         infoChart = undefined;
         let promise = import('https://cdn.jsdelivr.net/npm/vizzu@~0.4.0/dist/vizzu.min.js');
-        promise.then( (Vizzu) => {
+        promise.then( (lib) => {
             try {
-                navChart = new Vizzu.default('navVizzu');
-                infoChart = new Vizzu.default('infoVizzu');
+                Vizzu = lib;
                 vscode.postMessage({ command: 'vizzu-ready' });
             }
             catch (e) {
@@ -43,6 +43,8 @@ function importVizzuLibAndCreateCharts() {
 }
 
 async function initializingVizzuCharts(data) {
+    navChart = new Vizzu.default('navVizzu');
+    infoChart = new Vizzu.default('infoVizzu');
     await infoChart
         .initializing
         .then(infoChart => infoChart.animate({data: data}));
@@ -58,4 +60,13 @@ async function resetVizzuCharts() {
     await navChart.animate({data: {}});
     navChart.off('click');
     navChart.off('plot-axis-label-draw');
+    let element1 = document.getElementById("navVizzu");
+    while (element1.firstChild) {
+      element1.removeChild(element1.firstChild);
+    }    
+    let element2 = document.getElementById("infoVizzu");
+    while (element2.firstChild) {
+      element2.removeChild(element2.firstChild);
+    }    
+    vscode.postMessage({ command: 'vizzu-ready' });
 }

package.json

@@ -44,7 +44,8 @@
     "report"
   ],
   "activationEvents": [
-    "onCommand:CodeViz.show"
+    "onCommand:CodeViz.show",
+    "onCommand:CodeViz.import"
   ],
   "extensionDependencies": [
     "uctakeoff.vscode-counter"
@@ -63,6 +64,14 @@
       {
         "command": "CodeViz.show",
         "title": "CodeViz: Show statistics"
+      },
+      {
+        "command": "CodeViz.import",
+        "title": "CodeViz: Import statistics"
+      },
+      {
+        "command": "CodeViz.export",
+        "title": "CodeViz: Export statistics"
       }
     ]
   },

src/extension.ts

@@ -6,6 +6,33 @@ import { VSCCDataPrep } from "./data/vscc_dataprep";
 import { Summary } from "./data/vscc_result";
 
 export function activate(context: ExtensionContext) {
+    const importCommand = commands.registerCommand("CodeViz.import", async () => {
+        let wsPath: Uri;
+        workspace.workspaceFolders?.map((folder) => {
+            if (wsPath == undefined)
+                wsPath = folder.uri;
+        });
+        const folderPath = await window.showInputBox({ 
+            placeHolder: "import path",
+            prompt: "Enter import data path",
+            value: ""
+        });
+        if (folderPath) {
+            CCVizzuPanel.render(context.extensionUri).then(() => {
+                CCVizzuPanel.import(folderPath);
+            });
+        }
+    });
+    const exportCommand = commands.registerCommand("CodeViz.export", async () => {
+        const folderPath = await window.showInputBox({ 
+            placeHolder: "export path",
+            prompt: "Enter export data path",
+            value: ""
+        });
+        if (folderPath) {
+            CCVizzuPanel.export(folderPath);
+        }
+    });
     const showCommand = commands.registerCommand("CodeViz.show", () => {
         let wsPath: Uri;
         workspace.workspaceFolders?.map((folder) => {
@@ -29,4 +56,6 @@ export function activate(context: ExtensionContext) {
         });
     });
     context.subscriptions.push(showCommand);
+    context.subscriptions.push(importCommand);
+    context.subscriptions.push(exportCommand);
 }

src/panels/ccvizzupanel.ts

@@ -18,9 +18,29 @@ export class CCVizzuPanel {
         this._pageGen = new PageGenerator(panel, extensionUri);
     }
 
+    public static export(folderPath: string) {
+        if (CCVizzuPanel.currentPanel && this.currentPanel) {
+            if (this.currentPanel._dataTable != undefined)
+                CCVizzuPanel.currentPanel._jsonDataExport(folderPath);
+            else
+                window.showErrorMessage("No data to export");
+        }
+    }
+
+    public static import(folderPath: string) {
+        if (CCVizzuPanel.currentPanel) {
+            CCVizzuPanel.currentPanel._jsonDataImport(folderPath);
+            if (this.currentPanel != undefined) {
+                let panel = this.currentPanel._panel;
+                panel.webview.postMessage({
+                    command: 'clear-data-table'
+                });
+            }
+        }
+    }
+
     public static refresh(data: Object, summ: Summary) {
         if (this.currentPanel != undefined) {
-            let refreshReq = this.currentPanel._dataTable != undefined;
             this.currentPanel._dataTable = data;
             this.currentPanel._dataSummary = summ;
             let panel = this.currentPanel._panel;
@@ -51,7 +71,7 @@ export class CCVizzuPanel {
         while (this._disposables.length) {
             const disposable = this._disposables.pop();
             if (disposable) {
-            disposable.dispose();
+                disposable.dispose();
             }
         }
     }
@@ -63,7 +83,6 @@ export class CCVizzuPanel {
                 const text = message.text;
                 switch (command) {
                     case "vizzu-ready":
-                        //this._jsonDataExport('/home/...your home directory name comes here.../');
                         this._panel.webview.postMessage({
                             command: 'refresh-data-table',
                             dataTable: this._dataTable,
@@ -96,16 +115,30 @@ export class CCVizzuPanel {
         );
     }
 
+    private _jsonDataImport(rootDir: string) {
+        if (rootDir.endsWith('/'))
+            rootDir = rootDir.substring(0, rootDir.length - 1);
+        this._dataTable = {};
+        this._dataSummary = {};
+        const fs = require('fs');
+        const text1 = fs.readFileSync(rootDir + '/data.json', {encoding:'utf8', flag:'r'});
+        this._dataTable = JSON.parse(text1);
+        const text2 = fs.readFileSync(rootDir + '/datasum.json', {encoding:'utf8', flag:'r'});
+        this._dataSummary = JSON.parse(text2);
+    }
+    
     private _jsonDataExport(rootDir: string) {
+        if (rootDir.endsWith('/'))
+            rootDir = rootDir.substring(0, rootDir.length - 1);
         var fs = require('fs');
-        fs.writeFile(rootDir + 'data.json',
+        fs.writeFile(rootDir + '/data.json',
             JSON.stringify(this._dataTable), function(err: Object) {
                 if (err)
                     console.log(err);
             }
         );
         var fs = require('fs');
-        fs.writeFile(rootDir + 'datasum.json',
+        fs.writeFile(rootDir + '/datasum.json',
             JSON.stringify(this._dataSummary), function(err: Object) {
                 if (err)
                     console.log(err);