Merge pull request #9 from kaishuu0123/imprv/1-export-preview-as-svg

close #1. support export preview (Save as SVG command)

package.json

@@ -16,14 +16,20 @@
         "preview"
     ],
     "activationEvents": [
-        "onCommand:erd-preview.showPreview"
+        "onCommand:erd-preview.showPreview",
+        "onCommand:erd-preview.savePreview"
     ],
     "main": "./out/extension",
     "contributes": {
         "commands": [
             {
                 "command": "erd-preview.showPreview",
-                "title": "ERD Preview",
+                "title": "Preview Current Window",
+                "category": "ERD"
+            },
+            {
+                "command": "erd-preview.savePreview",
+                "title": "Save as SVG",
                 "category": "ERD"
             }
         ],

src/contextManager.ts

@@ -1,16 +1,18 @@
 import * as vscode from 'vscode';
 
 class ContextManager {
-    private _ctx: vscode.ExtensionContext;
-    private _listeners: ((ctx: vscode.ExtensionContext) => void)[] = [];
-    set(ctx: vscode.ExtensionContext) {
+    private _ctx : vscode.ExtensionContext;
+    private _listeners : ((ctx : vscode.ExtensionContext) => void)[] = [];
+    set(ctx : vscode.ExtensionContext) {
         this._ctx = ctx;
         for (let callback of this._listeners) {
             callback(ctx);
         }
     }
-    addInitiatedListener(listener: (ctx: vscode.ExtensionContext) => void): void {
-        this._listeners.push(listener);
+    addInitiatedListener(listener : (ctx : vscode.ExtensionContext) => void) : void {
+        this
+            ._listeners
+            .push(listener);
     }
     get context() {
         return this._ctx

src/extension.ts

@@ -6,50 +6,96 @@ import * as vscode from 'vscode';
 import * as fs from 'fs';
 import { outputPanel } from "./outputPanel";
 import { contextManager } from "./contextManager";
-import { getErdProgram, getDotProgram } from "./utils";
+import { getErdProgram, getDotProgram, getSourceUri, getSourceText } from "./utils";
+import { writeFileSync } from "fs";
+import { homedir } from "os";
 
 const extensionId = "erd-preview";
 const previewCommand = "erd-preview.showPreview";
+const saveCommand = "erd-preview.savePreview";
 const previewScheme = "erd-preview";
 
-function getErdPreviewUri(sourceUri: vscode.Uri)
-{
+function getErdPreviewUri(sourceUri: vscode.Uri) {
     return vscode.Uri.parse(`${previewScheme}://preview/?${sourceUri.toString(true)}`)
 }
 
-function getPreviewColumn(editor: vscode.TextEditor)
-{
-    switch (editor.viewColumn)
-    {
-        case vscode.ViewColumn.One:
-            return vscode.ViewColumn.Two;
-
-        default:
-            return vscode.ViewColumn.Three;
+function getPreviewColumn(editor: vscode.TextEditor) {
+    switch (editor.viewColumn) {
+    case vscode.ViewColumn.One:
+        return vscode.ViewColumn.Two;
+    default:
+        return vscode.ViewColumn.Three;
     }
 }
 
-function getSourceUri(previewUri: vscode.Uri): vscode.Uri
-{
-    return vscode.Uri.parse(previewUri.query);
-}
+async function writeTofile(uri, fileName) {
+    let WindowP = vscode.window.activeTextEditor;
+
+    const sourceText = await getSourceText(uri)
+    const dotProgram = getDotProgram(extensionId);
+    const erdProgram = getErdProgram(extensionId);
+
+    const erdProcess = child_process.spawn(erdProgram);
+    const dotProcess = child_process.spawn(dotProgram, ["-T", "svg"]);
+
+    let errorHandler = (commandName, error) => {
+        const codeProperty = "code";
+
+        if (error[codeProperty] === "ENOENT"){
+            vscode.window.showErrorMessage(`File not found: ${commandName} command`);
+        } else {
+            vscode.window.showErrorMessage(error.message);
+        }
+    };
+
+    erdProcess.on('error', (error) => errorHandler('erd', error))
+    dotProcess.on('error', (error) => errorHandler('dot', error));
+
+    try {
+        erdProcess.stdin.end(sourceText);
+        erdProcess.stdout.pipe(dotProcess.stdin);
+
+        // for Error handing
+        let erdStdout = '';
+        erdProcess.stdout.on('data', (data) => {
+            if (data.toString().length > 0) {
+                erdStdout += data.toString()
+            }
+        });
+        erdProcess.on('exit', (code, signal) => {
+            if (code === 1) {
+                outputPanel.clear();
+                outputPanel.append(erdStdout);
+                vscode.window.showErrorMessage(erdStdout);
+            }
+        })
+
+        let svgText = "";
+        dotProcess.stdout.on('data', (data) => {
+            svgText += data.toString();
+        });
+
+        dotProcess.stdout.on('end', () => {
+            var result = writeFileSync(fileName, svgText);
+            vscode.window.showInformationMessage(`SVG file saved as ${fileName}`);
+        });
+    } catch (error) {
+        vscode.window.showErrorMessage(error);
+    }
+};
 
 class ErdPreviewContentProvider implements vscode.TextDocumentContentProvider
 {
     private onDidChangeEventEmitter = new vscode.EventEmitter<vscode.Uri>();
     private template: string;
     private templateProcessing: string;
 
-    public get onDidChange(): vscode.Event<vscode.Uri>
-    {
+    public get onDidChange(): vscode.Event<vscode.Uri> {
         return this.onDidChangeEventEmitter.event;
     }
 
-    public async provideTextDocumentContent(uri: vscode.Uri, token: vscode.CancellationToken): Promise<string>
-    {
-        const sourceUri = getSourceUri(uri);
-        const sourceDocument = await vscode.workspace.openTextDocument(sourceUri);
-        const sourceText = sourceDocument.getText();
+    public async provideTextDocumentContent(uri: vscode.Uri, token: vscode.CancellationToken): Promise<string> {
+        const sourceText = await getSourceText(uri);
         const dotProgram = getDotProgram(extensionId);
         const erdProgram = getErdProgram(extensionId);
         let tplPreviewPath: string = path.join(contextManager.context.extensionPath, "templates", "preview.html");
@@ -64,7 +110,7 @@ class ErdPreviewContentProvider implements vscode.TextDocumentContentProvider
             let errorHandler = (commandName, error) => {
                 const codeProperty = "code";
 
-                if (error[codeProperty] === "ENOENT"){
+                if (error[codeProperty] === "ENOENT") {
                     outputPanel.clear();
                     outputPanel.append(`File not found: ${commandName} command`);
                     reject(new Error(`File not found: ${commandName} command`));
@@ -136,6 +182,30 @@ class ErdPreviewContentProvider implements vscode.TextDocumentContentProvider
 export function activate(context: vscode.ExtensionContext) {
     contextManager.set(context);
 
+    let fileName = vscode.window.activeTextEditor.document.fileName.split("/").slice(-1)[0].replace(".js",".svg").toString();
+    let dirName = path.dirname(vscode.window.activeTextEditor.document.fileName).toString();
+    let lastUsedImageUri = vscode.Uri.file(
+        path.resolve(homedir(), dirName + "/" + fileName)
+    );
+
+    context.subscriptions.push(vscode.commands.registerCommand(saveCommand, () => {
+        const activeTextEditor = vscode.window.activeTextEditor;
+
+        vscode.window
+            .showSaveDialog({
+                defaultUri: lastUsedImageUri,
+                filters: {
+                    Images: ["svg"]
+                }
+            })
+            .then(uri => {
+                if (uri) {
+                    writeTofile(getErdPreviewUri(activeTextEditor.document.uri), uri.fsPath);
+                    lastUsedImageUri = uri;
+                }
+            });
+    }));
+
     const previewContentProvider = new ErdPreviewContentProvider();
 
     context.subscriptions.push(vscode.workspace.registerTextDocumentContentProvider(previewScheme,

src/outputPanel.ts

@@ -1,4 +1,6 @@
 import * as vscode from 'vscode';
-import { join } from "path";
+import {join} from "path";
 
-export var outputPanel = vscode.window.createOutputChannel("ERD");
+export var outputPanel = vscode
+  .window
+  .createOutputChannel("ERD");

src/utils.ts

@@ -1,32 +1,45 @@
+import * as child_process from "child_process";
 import * as vscode from 'vscode';
+import {writeFileSync} from "fs";
 
 // Utility functions.
-export function getErdProgram(extensionId): string
-{
-    const configuration = vscode.workspace.getConfiguration(extensionId);
-    const erdPath = configuration.get<string>("erdPath");
+export function getErdProgram(extensionId) : string {
+    const configuration = vscode
+        .workspace
+        .getConfiguration(extensionId);
+    const erdPath = configuration.get < string > ("erdPath");
 
-    if (erdPath === null || erdPath === undefined)
-    {
+    if (erdPath === null || erdPath === undefined) {
         return "erd";
-    }
-    else
-    {
+    } else {
         return erdPath;
     }
 }
 
-export function getDotProgram(extensionId): string
-{
-    const configuration = vscode.workspace.getConfiguration(extensionId);
-    const dotPath = configuration.get<string>("dotPath");
+export function getDotProgram(extensionId) : string {
+    const configuration = vscode
+        .workspace
+        .getConfiguration(extensionId);
+    const dotPath = configuration.get < string > ("dotPath");
 
-    if (dotPath === null || dotPath === undefined)
-    {
+    if (dotPath === null || dotPath === undefined) {
         return "dot";
-    }
-    else
-    {
+    } else {
         return dotPath;
     }
+}
+
+export function getSourceUri(previewUri : vscode.Uri) : vscode.Uri {
+    return vscode
+        .Uri
+        .parse(previewUri.query);
+}
+
+export async function getSourceText(uri) {
+    const sourceUri = getSourceUri(uri);
+    const sourceDocument = await vscode
+        .workspace
+        .openTextDocument(sourceUri);
+    const sourceText = sourceDocument.getText();
+    return sourceText;
 }