Add options for filename and save directory

Signed-off-by: Guillaume Fontorbe <[email protected]>
eclipse-sprotty · Feb 23, 2024 · 2254808 · 2254808
1 parent 82fc279
commit 2254808
Show file tree

Hide file tree

Showing 6 changed files with 39 additions and 17 deletions.
diff --git a/examples/jsxample/src/standalone.ts b/examples/jsxample/src/standalone.ts
@@ -21,8 +21,8 @@ export default async function runJsxample() {
     const container = createContainer('sprotty');
     const modelSource = container.get<LocalModelSource>(TYPES.ModelSource);
 
-    document.addEventListener('export', () => {
-        modelSource.actionDispatcher.dispatch(RequestExportSvgAction.create());
+    document.addEventListener('export', (event: CustomEvent) => {
+        modelSource.actionDispatcher.dispatch(RequestExportSvgAction.create(event.detail.fileName));
     });
 
     const graph = {

diff --git a/packages/sprotty/src/cli/sprotty.ts b/packages/sprotty/src/cli/sprotty.ts
@@ -17,21 +17,37 @@
 import { Command } from 'commander';
 import puppeteer from 'puppeteer';
 
+interface ExportOptions {
+    output?: string
+    directory?: string
+}
+
 export function sprottyCli(argv: string[]): void {
     const program = new Command();
 
     program.command('export')
         .argument('<url>', 'The url of the Sprotty page')
-        .action(async (url: string) => {
+        .option('-o, --output <outputFile>', 'The output file', 'diagram.svg')
+        .option('-d, --directory <outputDirectory>', 'The output directory', undefined)
+        .action(async (url: string, options: ExportOptions) => {
             const browser = await puppeteer.launch();
             const page = await browser.newPage();
+            if (options.directory) {
+                const client = await page.createCDPSession();
+                await client.send('Page.setDownloadBehavior', {
+                    behavior: 'allow',
+                    downloadPath: options.directory
+                });
+            }
             await page.goto(url);
-            await page.evaluate(() => {
+            await page.evaluate((evalOptions) => {
                 // trigger the export
-                document.dispatchEvent(new Event('export'));
-            });
+                document.dispatchEvent(new CustomEvent('export', {detail: {fileName: evalOptions.output}}));
+            }, options);
 
-            // await browser.close();
+            // wait for the download to finish before closing the browser
+            await page.waitForNetworkIdle();
+            await browser.close();
         });
 
     program.parse(argv);

diff --git a/packages/sprotty/src/features/export/export.ts b/packages/sprotty/src/features/export/export.ts
@@ -41,14 +41,16 @@ export class ExportSvgKeyListener extends KeyListener {
 
 export interface RequestExportSvgAction extends RequestAction<ExportSvgAction> {
     kind: typeof RequestExportSvgAction.KIND
+    fileName: string
 }
 export namespace RequestExportSvgAction {
     export const KIND = 'requestExportSvg';
 
-    export function create(): RequestExportSvgAction {
+    export function create(fileName: string = 'diagram'): RequestExportSvgAction {
         return {
             kind: KIND,
-            requestId: generateRequestId()
+            requestId: generateRequestId(),
+            fileName: fileName
         };
     }
 }
@@ -83,7 +85,8 @@ export class ExportSvgCommand extends HiddenCommand {
         }
         return {
             model: context.root,
-            modelChanged: false
+            modelChanged: false,
+            cause: this.action
         };
     }
 }

diff --git a/packages/sprotty/src/features/export/svg-exporter.ts b/packages/sprotty/src/features/export/svg-exporter.ts
@@ -15,28 +15,31 @@
  ********************************************************************************/
 
 import { injectable, inject } from "inversify";
-import { RequestAction, ResponseAction } from 'sprotty-protocol/lib/actions';
+import { ResponseAction } from 'sprotty-protocol/lib/actions';
 import { Bounds } from 'sprotty-protocol/lib/utils/geometry';
 import { ViewerOptions } from '../../base/views/viewer-options';
 import { isBoundsAware } from '../bounds/model';
 import { ActionDispatcher } from '../../base/actions/action-dispatcher';
 import { TYPES } from '../../base/types';
 import { SModelRootImpl } from '../../base/model/smodel';
 import { ILogger } from '../../utils/logging';
+import { RequestExportSvgAction } from "./export";
 
 export interface ExportSvgAction extends ResponseAction {
     kind: typeof ExportSvgAction.KIND;
     svg: string
     responseId: string
+    fileName: string
 }
 export namespace ExportSvgAction {
     export const KIND = 'exportSvg';
 
-    export function create(svg: string, requestId: string): ExportSvgAction {
+    export function create(svg: string, requestId: string, fileName: string): ExportSvgAction {
         return {
             kind: KIND,
             svg,
-            responseId: requestId
+            responseId: requestId,
+            fileName: fileName
         };
     }
 }
@@ -48,7 +51,7 @@ export class SvgExporter {
     @inject(TYPES.IActionDispatcher) protected actionDispatcher: ActionDispatcher;
     @inject(TYPES.ILogger) protected log: ILogger;
 
-    export(root: SModelRootImpl, request?: RequestAction<ExportSvgAction>): void {
+    export(root: SModelRootImpl, request?: RequestExportSvgAction): void {
         if (typeof document !== 'undefined') {
             const hiddenDiv = document.getElementById(this.options.hiddenDiv);
             if (hiddenDiv === null) {
@@ -63,7 +66,7 @@ export class SvgExporter {
                 return;
             }
             const svg = this.createSvg(svgElement, root);
-            this.actionDispatcher.dispatch(ExportSvgAction.create(svg, request ? request.requestId : ''));
+            this.actionDispatcher.dispatch(ExportSvgAction.create(svg, request ? request.requestId : '', request ? request.fileName : 'diagram'));
         }
     }
 

diff --git a/packages/sprotty/src/model-source/diagram-server.ts b/packages/sprotty/src/model-source/diagram-server.ts
@@ -199,7 +199,7 @@ export abstract class DiagramServerProxy extends ModelSource {
 
     protected handleExportSvgAction(action: ExportSvgAction): boolean {
         const blob = new Blob([action.svg], { type: 'text/plain;charset=utf-8' });
-        saveAs(blob, 'diagram.svg');
+        saveAs(blob, action.fileName.endsWith('.svg') ? action.fileName : action.fileName + '.svg');
         return false;
     }
 

diff --git a/packages/sprotty/src/model-source/local-model-source.ts b/packages/sprotty/src/model-source/local-model-source.ts
@@ -278,6 +278,6 @@ export class LocalModelSource extends ModelSource {
 
     protected handleExportSvgAction(action: ExportSvgAction): void {
         const blob = new Blob([action.svg], { type: 'text/plain;charset=utf-8' });
-        saveAs(blob, 'diagram.svg');
+        saveAs(blob, action.fileName.endsWith('.svg') ? action.fileName : action.fileName + '.svg');
     }
 }