Improves the manager and adds a registry to register blocks, generators and toolboxes

Author: hbcarlos

README.md

@@ -20,11 +20,18 @@ Repo: https://github.com/google/blockly
 To install the extension, execute:
 
 ```bash
-micromamba create -n blockly -c conda-forge python
+micromamba create -n blockly -c conda-forge python ipykernel xeus-python xeus-lua
 micromamba activate blockly
 pip install jupyterlab_blockly
 ```
 
+#### Kernels
+* ipykernel
+* xeus-python
+* xeus-lua
+* [JavaScript](https://github.com/n-riesco/ijavascript#installation)
+* [JavaScript](https://github.com/yunabe/tslab)
+
 ## Uninstall
 
 To remove the extension, execute:

package.json

@@ -48,11 +48,14 @@
   "dependencies": {
     "@jupyterlab/application": "^3.4",
     "@jupyterlab/apputils": "^3.4",
+    "@jupyterlab/coreutils": "^5.4",
     "@jupyterlab/docregistry": "^3.4",
     "@jupyterlab/filebrowser": "^3.4",
     "@jupyterlab/launcher": "^3.4",
     "@jupyterlab/outputarea": "^3.4",
     "@jupyterlab/rendermime": "^3.4",
+    "@jupyterlab/services": "^6.4",
+    "@jupyterlab/ui-components": "^3.4",
     "@lumino/algorithm": "^1.9.0",
     "@lumino/coreutils": "^1.11.0",
     "@lumino/messaging": "^1.10.0",

src/factory.ts

@@ -4,9 +4,9 @@ import {
   DocumentModel
 } from '@jupyterlab/docregistry';
 import { IRenderMimeRegistry } from '@jupyterlab/rendermime';
-// import { ITranslator } from '@jupyterlab/translation';
 
 import { BlocklyEditor, BlocklyPanel } from './widget';
+import { BlocklyRegistry } from './registry';
 import { BlocklyManager } from './manager';
 
 /**
@@ -16,10 +16,8 @@ export class BlocklyEditorFactory extends ABCWidgetFactory<
   BlocklyEditor,
   DocumentModel
 > {
-  private _manager: BlocklyManager;
+  private _registry: BlocklyRegistry;
   private _rendermime: IRenderMimeRegistry;
-  private _language: string;
-  // private _translator: ITranslator;
 
   /**
    * Constructor of BlocklyEditorFactory.
@@ -28,14 +26,12 @@ export class BlocklyEditorFactory extends ABCWidgetFactory<
    */
   constructor(options: BlocklyEditorFactory.IOptions) {
     super(options);
-    this._manager = new BlocklyManager();
+    this._registry = new BlocklyRegistry();
     this._rendermime = options.rendermime;
-    this._language = this._manager.language;
-    // this._translator = options.translator;
   }
 
-  get manager(): BlocklyManager {
-    return this._manager;
+  get registry(): BlocklyRegistry {
+    return this._registry;
   }
 
   /**
@@ -47,15 +43,9 @@ export class BlocklyEditorFactory extends ABCWidgetFactory<
   protected createNewWidget(
     context: DocumentRegistry.IContext<DocumentModel>
   ): BlocklyEditor {
-    return new BlocklyEditor({
-      context,
-      content: new BlocklyPanel(
-        context,
-        this._manager,
-        this._rendermime,
-        this._language
-      )
-    });
+    const manager = new BlocklyManager(this._registry, context.sessionContext);
+    const content = new BlocklyPanel(context, manager, this._rendermime);
+    return new BlocklyEditor({ context, content, manager });
   }
 }
 

src/index.ts

@@ -3,6 +3,7 @@ import {
   JupyterFrontEndPlugin,
   ILayoutRestorer
 } from '@jupyterlab/application';
+import { jsonIcon } from '@jupyterlab/ui-components';
 import { WidgetTracker } from '@jupyterlab/apputils';
 import { IRenderMimeRegistry } from '@jupyterlab/rendermime';
 import { ICommandPalette } from '@jupyterlab/apputils';
@@ -12,7 +13,7 @@ import { ITranslator } from '@jupyterlab/translation';
 import { ISettingRegistry } from '@jupyterlab/settingregistry';
 
 import { BlocklyEditorFactory } from './factory';
-import { IBlocklyManager } from './token';
+import { IBlocklyRegisty } from './token';
 import { BlocklyEditor } from './widget';
 
 import { blockly_icon } from './icons';
@@ -36,7 +37,7 @@ const PLUGIN_ID = '@jupyterlab/translation-extension:plugin';
 /**
  * Initialization data for the jupyterlab-blocky extension.
  */
-const plugin: JupyterFrontEndPlugin<IBlocklyManager> = {
+const plugin: JupyterFrontEndPlugin<IBlocklyRegisty> = {
   id: 'jupyterlab-blocky:plugin',
   autoStart: true,
   requires: [
@@ -47,7 +48,7 @@ const plugin: JupyterFrontEndPlugin<IBlocklyManager> = {
     ITranslator
   ],
   optional: [ILauncher, ICommandPalette],
-  provides: IBlocklyManager,
+  provides: IBlocklyRegisty,
   activate: (
     app: JupyterFrontEnd,
     restorer: ILayoutRestorer,
@@ -57,7 +58,7 @@ const plugin: JupyterFrontEndPlugin<IBlocklyManager> = {
     translator: ITranslator,
     launcher: ILauncher | null,
     palette: ICommandPalette | null
-  ): IBlocklyManager => {
+  ): IBlocklyRegisty => {
     console.log('JupyterLab extension jupyterlab-blocky is activated!');
 
     // Namespace for the tracker
@@ -84,8 +85,8 @@ const plugin: JupyterFrontEndPlugin<IBlocklyManager> = {
     const widgetFactory = new BlocklyEditorFactory({
       name: FACTORY,
       modelName: 'text',
-      fileTypes: ['json'],
-      defaultFor: ['json'],
+      fileTypes: ['blockly'],
+      defaultFor: ['blockly'],
 
       // Kernel options, in this case we need to execute the code generated
       // in the blockly editor. The best way would be to use kernels, for
@@ -114,6 +115,17 @@ const plugin: JupyterFrontEndPlugin<IBlocklyManager> = {
       });
       tracker.add(widget);
     });
+    // Registering the file type
+    app.docRegistry.addFileType({
+      name: 'blockly',
+      displayName: 'Blockly',
+      contentType: 'file',
+      fileFormat: 'json',
+      extensions: ['.jpblockly'],
+      mimeTypes: ['application/json'],
+      icon: jsonIcon,
+      iconLabel: 'JupyterLab-Blockly'
+    });
     // Registering the widget factory
     app.docRegistry.addWidgetFactory(widgetFactory);
 
@@ -140,7 +152,7 @@ const plugin: JupyterFrontEndPlugin<IBlocklyManager> = {
       console.log(`Current Language : '${language}'`);
 
       // Transmitting the current language to the manager.
-      widgetFactory.manager.setlanguage(language);
+      widgetFactory.registry.setlanguage(language);
     });
 
     commands.addCommand(command, {
@@ -187,7 +199,7 @@ const plugin: JupyterFrontEndPlugin<IBlocklyManager> = {
       });
     }
 
-    return widgetFactory.manager;
+    return widgetFactory.registry;
   }
 };
 

src/layout.ts

@@ -1,7 +1,6 @@
 import { SimplifiedOutputArea, OutputAreaModel } from '@jupyterlab/outputarea';
 import { IRenderMimeRegistry } from '@jupyterlab/rendermime';
-import { ISessionContext } from '@jupyterlab/apputils';
-// import { ITranslator } from '@jupyterlab/translation';
+import { ISessionContext, showErrorMessage } from '@jupyterlab/apputils';
 
 import { Message } from '@lumino/messaging';
 import { PartialJSONValue } from '@lumino/coreutils';
@@ -22,7 +21,6 @@ export class BlocklyLayout extends PanelLayout {
   private _manager: BlocklyManager;
   private _workspace: Blockly.WorkspaceSvg;
   private _sessionContext: ISessionContext;
-  // private _translator: ITranslator;
   private _outputArea: SimplifiedOutputArea;
 
   /**
@@ -33,12 +31,10 @@ export class BlocklyLayout extends PanelLayout {
     manager: BlocklyManager,
     sessionContext: ISessionContext,
     rendermime: IRenderMimeRegistry
-    // translator: ITranslator
   ) {
     super();
     this._manager = manager;
     this._sessionContext = sessionContext;
-    // this._translator = translator;
 
     // Creating the container for the Blockly editor
     // and the output area to render the execution replies.
@@ -106,12 +102,22 @@ export class BlocklyLayout extends PanelLayout {
 
     // Execute the code using the kernel, by using a static method from the
     // same class to make an execution request.
-    SimplifiedOutputArea.execute(code, this._outputArea, this._sessionContext)
-      .then(resp => {
-        this.addWidget(this._outputArea);
-        this._resizeWorkspace();
-      })
-      .catch(e => console.error(e));
+    if (this._sessionContext.hasNoKernel) {
+      // Check whether there is a kernel
+      showErrorMessage(
+        'Select a valid kernel',
+        `There is not a valid kernel selected, select one from the dropdown menu in the toolbar.
+        If there isn't a valid kernel please install 'xeus-python' from Pypi.org or using mamba.
+        `
+      );
+    } else {
+      SimplifiedOutputArea.execute(code, this._outputArea, this._sessionContext)
+        .then(resp => {
+          this.addWidget(this._outputArea);
+          this._resizeWorkspace();
+        })
+        .catch(e => console.error(e));
+    }
   }
 
   /**
@@ -144,13 +150,6 @@ export class BlocklyLayout extends PanelLayout {
       toolbox: this._manager.toolbox,
       theme: THEME
     });
-
-    // let categories: string;
-
-    // Loading the ITranslator
-    // const trans = this._translator.load('jupyterlab-blockly');
-
-    // categories = trans.__('Category');
   }
 
   private _resizeWorkspace(): void {