Merge pull request #300 from XpressAI/fahreza/init-new-canvas

🐛 Initialize Base Canvas For New Xircuits

Author: MFA-X-AI

src/helpers/CanvasInitializer.tsx

@@ -0,0 +1,31 @@
+import * as SRD from '@projectstorm/react-diagrams';
+import { BaseComponentLibrary } from '../tray_library/BaseComponentLib';
+import { ParameterLinkFactory, TriangleLinkFactory } from '../components/link/CustomLinkFactory';
+import { CustomNodeFactory } from '../components/node/CustomNodeFactory';
+import { JupyterFrontEnd } from '@jupyterlab/application';
+
+export function createInitXircuits(app: JupyterFrontEnd, shell) {
+
+    const diagramEngine = SRD.default({ registerDefaultZoomCanvasAction: false, registerDefaultDeleteItemsAction: false });
+    
+    // Create a new diagram model
+    const activeModel = new SRD.DiagramModel();
+
+    diagramEngine.getLinkFactories().registerFactory(new ParameterLinkFactory());
+    diagramEngine.getLinkFactories().registerFactory(new TriangleLinkFactory());
+    diagramEngine.getNodeFactories().registerFactory(new CustomNodeFactory(app, shell));
+
+    let startNode = BaseComponentLibrary('Start')
+    startNode.setPosition(100, 100);
+    let finishNode = BaseComponentLibrary('Finish')
+    finishNode.setPosition(700, 100);
+
+    activeModel.addAll(startNode, finishNode);
+    diagramEngine.setModel(activeModel);
+
+    let currentModel = diagramEngine.getModel().serialize();
+
+    let jsonString = JSON.stringify(currentModel, null, 4);
+
+    return jsonString;
+}

src/index.tsx

@@ -26,6 +26,7 @@ import { addNodeActionCommands } from './commands/NodeActionCommands';
 import { Token } from '@lumino/coreutils';
 import { DockLayout } from '@lumino/widgets';
 import { xircuitsIcon, componentLibIcon, changeFavicon, xircuitsFaviconLink } from './ui-components/icons';
+import { createInitXircuits } from './helpers/CanvasInitializer';
 
 
 const FACTORY = 'Xircuits editor';
@@ -168,17 +169,24 @@ const xircuits: JupyterFrontEndPlugin<void> = {
             type: "file",
             ext: ".xircuits"
           });
-        const newWidget = await app.commands.execute(
+
+          // get init SRD json
+          const fileContent = createInitXircuits(app, app.shell);
+
+          // Use the document manager to write to the file
+          await app.serviceManager.contents.save(model.path, {
+            type: 'file',
+            format: 'text',
+            content: fileContent
+          });
+
+        await app.commands.execute(
           commandIDs.openDocManager,
           {
             path: model.path,
             factory: FACTORY
           }
         );
-        await Promise.all([newWidget.context.ready, newWidget.content.renderPromise]);
-        await app.commands.execute(commandIDs.saveXircuit, {
-            path: model.path
-        });
       }
     });