Merge pull request #29 from cssho/add-autopreview

Add new feature AutoPreview.

.vscode/tasks.json

@@ -8,23 +8,23 @@
 
 // A task runner that calls a custom npm script that compiles the extension.
 {
-	"version": "0.1.0",
+    "version": "0.1.0",
 
-	// we want to run npm
-	"command": "npm",
+    // we want to run npm
+    "command": "npm",
 
-	// the command is a shell script
-	"isShellCommand": true,
+    // the command is a shell script
+    "isShellCommand": true,
 
-	// show the output window only if unrecognized errors occur.
-	"showOutput": "silent",
+    // show the output window only if unrecognized errors occur.
+    "showOutput": "silent",
 
-	// we run the custom script "compile" as defined in package.json
-	"args": ["run", "compile", "--loglevel", "silent"],
+    // we run the custom script "compile" as defined in package.json
+    "args": ["run", "compile", "--loglevel", "silent"],
 
-	// The tsc compiler is started in watching mode
-	"isWatching": true,
+    // The tsc compiler is started in watching mode
+    "isBackGround": true,
 
-	// use the standard tsc in watch mode problem matcher to find compile problems in the output.
-	"problemMatcher": "$tsc-watch"
+    // use the standard tsc in watch mode problem matcher to find compile problems in the output.
+    "problemMatcher": "$tsc-watch"
 }

README-ja.md

@@ -38,6 +38,12 @@ SVG Viewerでは以下のVisual Studio Codeの設定が可能です。`User Sett
 ```javascript
 {
     // 透明グリッドを表示
-	"svgviewer.transparencygrid": true
+	"svgviewer.transparencygrid": true,    
+
+    // プレビューを自動的に開く
+    "svgviewer.enableautopreview": true,
+
+    // プレビューの開き方を指定 (vscode.ViewColumn)
+    "svgviewer.previewcolumn": "One"
 }
 ```

README.md

@@ -39,6 +39,12 @@ The following Visual Studio Code setting is available for the SVG Viewer.  This
 ```javascript
 {
     // Show Transparency Grid
-	"svgviewer.transparencygrid": true
+	"svgviewer.transparencygrid": true,
+
+    // Open or not open the preview screen automatically
+    "svgviewer.enableautopreview": true,
+
+    // How to open the screen (vscode.ViewColumn)
+    "svgviewer.previewcolumn": true
 }
 ```

package.json

@@ -2,7 +2,7 @@
     "name": "vscode-svgviewer",
     "displayName": "SVG Viewer",
     "description": "SVG Viewer for Visual Studio Code.",
-    "version": "1.3.1",
+    "version": "1.4.0",
     "publisher": "cssho",
     "engines": {
         "vscode": "^1.9.0"
@@ -82,6 +82,21 @@
                     "type": "boolean",
                     "default": true,
                     "description": "Show Transparency Grid"
+                },
+                "svgviewer.enableautopreview": {
+                    "type": "boolean",
+                    "default": false,
+                    "description": "Open or not open the preview screen automatically"
+                },
+                "svgviewer.previewcolumn": {
+                    "type": "string",
+                    "enum": [
+                        "One",
+                        "Two",
+                        "Three"
+                    ],
+                    "default": "Two",
+                    "description": "How to open the screen (vscode.ViewColumn)"
                 }
             }
         }

src/extension.ts

@@ -12,7 +12,7 @@ const svgexport = require('svgexport');
 const path = require('path');
 const phantomjs = require('phantomjs-prebuilt');
 export function activate(context: vscode.ExtensionContext) {
-    
+
     // Check PhantomJS Binary   
     if (!fs.existsSync(phantomjs.path)) {
         exec('npm rebuild', { cwd: context.extensionPath });
@@ -36,12 +36,22 @@ export function activate(context: vscode.ExtensionContext) {
         }
     });
 
+    vscode.window.onDidChangeActiveTextEditor((textEditor: vscode.TextEditor) => {
+        if (vscode.window.activeTextEditor) {
+            if (textEditor.document === vscode.window.activeTextEditor.document && !checkNoSvg(vscode.window.activeTextEditor.document, false)) {
+                provider.update(previewUri);
+                let auto = vscode.workspace.getConfiguration('svgviewer').get('enableautopreview');
+                if (auto) {
+                    return openPreview(previewUri, textEditor.document.fileName);
+                }
+            }
+        }
+    });
+
     let open = vscode.commands.registerTextEditorCommand('svgviewer.open', (te, t) => {
         if (checkNoSvg(te.document)) return;
         provider.update(previewUri);
-        return vscode.commands.executeCommand('vscode.previewHtml', previewUri, vscode.ViewColumn.Two)
-            .then(s => console.log('done.'), vscode.window.showErrorMessage);
-
+        return openPreview(previewUri, te.document.fileName);
     });
 
     context.subscriptions.push(open);
@@ -93,11 +103,11 @@ export function activate(context: vscode.ExtensionContext) {
 
     let exportProvider = new ExportDocumentContentProvider(context);
     vscode.workspace.registerTextDocumentContentProvider('svg-export', exportProvider)
-    
+
     let makeExportUri = (uri) => uri.with({
-            scheme: 'svg-export',
-            path: uri.path + '.rendered',
-            query: uri.toString()
+        scheme: 'svg-export',
+        path: uri.path + '.rendered',
+        query: uri.toString()
     });
 
     vscode.workspace.onDidChangeTextDocument((event: vscode.TextDocumentChangeEvent) => {
@@ -106,7 +116,7 @@ export function activate(context: vscode.ExtensionContext) {
         }
     });
 
-    let openexport = vscode.commands.registerCommand('svgviewer.openexport', async function(uri) {
+    let openexport = vscode.commands.registerCommand('svgviewer.openexport', async function (uri) {
         if (!(uri instanceof vscode.Uri)) {
             if (vscode.window.activeTextEditor) {
                 uri = vscode.window.activeTextEditor.document.uri;
@@ -119,13 +129,13 @@ export function activate(context: vscode.ExtensionContext) {
             vscode.window.showWarningMessage("Active editor doesn't show a SVG document - no properties to preview.");
             return;
         }
-        
+
         return vscode.commands.executeCommand('vscode.previewHtml', makeExportUri(uri));
     });
 
     context.subscriptions.push(openexport);
 
-    let savedu = vscode.commands.registerCommand('svgviewer.savedu', async function(args) {
+    let savedu = vscode.commands.registerCommand('svgviewer.savedu', async function (args) {
         let data = new Buffer(args.du.split(',')[1], 'base64');
         fs.writeFileSync(args.output, data);
         vscode.window.showInformationMessage('export done. ' + args.output);
@@ -171,5 +181,27 @@ function exportPng(tmpobj: any, text: string, pngpath: string, w?: number, h?: n
         .catch(e => vscode.window.showErrorMessage(e.message));
 }
 
+function openPreview(previewUri: vscode.Uri, fileName: string) {
+    let viewColumn: number;
+    switch (vscode.workspace.getConfiguration('svgviewer').get('previewcolumn')) {
+        case "One":
+            viewColumn = 1;
+            break;
+        case "Two":
+            viewColumn = 2;
+            break;
+        case "Three":
+            viewColumn = 3;
+            break;
+        default:
+            viewColumn = 0;
+            break;
+    }
+    if (viewColumn) {
+        return vscode.commands.executeCommand('vscode.previewHtml', previewUri, viewColumn, `Preview : ${fileName}`)
+            .then(s => console.log('done.'), vscode.window.showErrorMessage);
+    }
+}
+
 export function deactivate() {
 }