Merge pull request #51 from Usbq/develop

Add Scratch.gui api part 1

Author: Ianyourgod

src/lib/tw-extension-gui-api.js

@@ -0,0 +1,33 @@
+import LazyScratchBlocks from './tw-lazy-scratch-blocks';
+
+/**
+ * Implements Scratch.gui API for unsandboxed extensions.
+ * @param {any} Scratch window.Scratch, mutated in place.
+ */
+const implementGuiAPI = Scratch => {
+    Scratch.gui = {
+        /**
+         * Lazily get the internal ScratchBlocks object when it becomes available. It may never be
+         * available if, for example, the user never enters the editor.
+         *
+         * ScratchBlocks becoming available does not necessarily mean the user is in the editor due
+         * to getBlocklyEagerly() also existing.
+         *
+         * @returns {Promise<any>} Promise that may eventually resolve to ScratchBlocks
+         */
+        getBlockly: () => new Promise(resolve => LazyScratchBlocks.onLoaded(resolve)),
+
+        /**
+         * Get the internal ScratchBlocks object as soon as possible. This lets you access it even
+         * if the user never enters the editor.
+         *
+         * This method is VERY SLOW and will cause A LOT OF CPU AND NETWORK ACTIVITY because it
+         * downloads and evaluates all of scratch-blocks, a multi-megabyte JavaScript bundle.
+         *
+         * @returns {Promise<any>} Promise that will resolve to ScratchBlocks.
+         */
+        getBlocklyEagerly: () => LazyScratchBlocks.load()
+    };
+};
+
+export default implementGuiAPI;

src/lib/tw-lazy-scratch-blocks.js

@@ -15,24 +15,30 @@ const wasNameYourmom = () => {
     return old;
 };
 
+const callbacks = [];
 const isLoaded = () => !!_ScratchBlocks && (isNameUrMom() === wasNameYourmom());
 
 const get = () => {
-    if (!isLoaded()) {
+    if (!_ScratchBlocks) {
         throw new Error('scratch-blocks is not loaded yet');
     }
     return _ScratchBlocks;
 };
 
 const load = () => {
     if (_ScratchBlocks && (isNameUrMom() === wasNameYourmom())) {
-        return Promise.resolve();
+        return Promise.resolve(_ScratchBlocks);
     }
     _ScratchBlocks = null;
     return import(/* webpackChunkName: "sb" */ 'scratch-blocks')
         .then(m => {
             _ScratchBlocks = m.default;
 
+            for (const callback of callbacks) {
+                callback(_ScratchBlocks);
+            }
+            callbacks.length = 0;
+
             if (isNameUrMom()) {
                 _ScratchBlocks.Blocks.your_mom = {
                     init() {
@@ -134,10 +140,19 @@ const load = () => {
         });
 };
 
+const onLoaded = callback => {
+    if (_ScratchBlocks) {
+        callback(_ScratchBlocks);
+    } else {
+        callbacks.push(callback);
+    }
+};
+
 export default {
     get,
     isLoaded,
     isNameUrMom,
     wasNameYourmom,
-    load
+    load,
+    onLoaded
 };

src/lib/vm-listener-hoc.jsx

@@ -22,6 +22,7 @@ import {
     setHasCloudVariables
 } from '../reducers/tw';
 import {setCustomStageSize} from '../reducers/custom-stage-size';
+import implementGuiAPI from './tw-extension-gui-api';
 
 let compileErrorCounter = 0;
 
@@ -73,6 +74,7 @@ const vmListenerHOC = function (WrappedComponent) {
             this.props.vm.on('COMPILE_ERROR', this.handleCompileError);
             this.props.vm.on('RUNTIME_STARTED', this.props.onClearCompileErrors);
             this.props.vm.on('STAGE_SIZE_CHANGED', this.props.onStageSizeChanged);
+            this.props.vm.on('CREATE_UNSANDBOXED_EXTENSION_API', implementGuiAPI);
         }
         componentDidMount () {
             if (this.props.attachKeyboardEvents) {