Custom Blocks and Generators with Blockly on Node.js

[smta...@ncsu.edu]

My ultimate goal is to run blockly with (with custom blocks and new language generators) in headless mode on Node.js, and I am looking for advice for the best approach and had a few questions.

I am currently accomplishing this goal by using an older version (about 18 months old) of blockly along with node-blockly. I have already created many custom blocks and a few custom language generators. When I need to include new blocks or generators, I rebuild blockly. For various reasons, I would prefer to be on the latest version of blockly and remove the need for the node-blockly dependency.

This is what I have done so far:

1. I have seen and run the blockly-node example (thanks for that!), but it appears that the version of blockly with that example is a stripped down version, so there is no "generators" directory as one example.
2. I ran "npm install blockly" to replace the version of blockly that is default with the blockly-node example. I now see a more "familiar" directory structure in the blockly directory. 
   1. Is this a legitimate thing to do? Or if you are running in node, should i be using the "default" version of blockly?
   2. When I went to add my custom blocks and generators and "rebuild", I noticed that there is no build script in the package.json file. Is a rebuild no longer required if you are adding custom blocks and generators?

Thanks in advance,

Sandy

[Sam El-Husseini]

Hi Sandy,

The published blockly npm package also supports Node.

See: https://github.com/google/blockly-samples/tree/master/examples/blockly-node for an example.

Custom blocks and new language generators don't require a re-build of Blockly, so you should be able to just acquire blockly in Node (as per the example), and import your custom blocks and generators.

Let me know if you run into any trouble using the published blockly package in Node.

Cheers,

Sam

[Sandra Taylor]

Thanks, Sam.

I may need to take a step back and do a better job of explaining what I am trying to do and just ask one question at a time :-)

Yes. I did use the blockly-node example, and the example program runs fine.

However, when I started to modify that sample to include my own custom blocks and generators, I noticed that the version of blockly that is installed with the sample (3.20200123.1) is different from what I think is the standard current version (3.20200625.2), which I get if I just run npm install blockly. Just taking a brief look, I see that the directory structures are different (no generators directory, etc.) and that there are far fewer block definitions in the version that comes with has far fewer block definitions included, and it made me wonder, what else is different and is this the best approach moving forward?

My expectation was that the version of blockly I would run in node would have all of the features (block definitions, etc.) that are included in the version of the code I would get if I got the latest from the github repo. Is that the case?

Thanks,

Sandy

--
You received this message because you are subscribed to a topic in the Google Groups "Blockly" group.
To unsubscribe from this topic, visit https://groups.google.com/d/topic/blockly/L2ZydiOvqHU/unsubscribe.
To unsubscribe from this group and all its topics, send an email to blockly+u...@googlegroups.com.
To view this discussion on the web visit https://groups.google.com/d/msgid/blockly/b293ed63-3c39-4e66-a94c-d2e27c37b957o%40googlegroups.com.

[Mark Friedman]

Sandy,

  Assuming you've run the 'npm install" command, if you look in the resulting node_modules/blockly/ directory you should see your "familiar" directory structure.  "npm install" places your app's dependencies within the node_modules directory and Node's "require" statements know to look there.

  Hope this helps.

-Mark

-Mark

You received this message because you are subscribed to the Google Groups "Blockly" group.
To unsubscribe from this group and stop receiving emails from it, send an email to blockly+u...@googlegroups.com.
To view this discussion on the web visit https://groups.google.com/d/msgid/blockly/CAKYrDP-C7x%2B_%3DZdqyDxyf274HFRWU16NmMubn_Zq66Vre9GL1A%40mail.gmail.com.

[smta...@ncsu.edu]

Custom blocks and new language generators don't require a re-build of Blockly, so you should be able to just acquire blockly in Node (as per the example), and import your custom blocks and generators.

I am  not finding this (not requiring blockly to be rebuilt) to be the case, but perhaps I am missing something? In my previous configuration, using node-blockly, I have many custom blocks and many NEW languages (micropython, ink language, etc.) with corresponding language generators for standard and new custom blocks. Following the blockly documentation, when I added a new custom language such as ink, I would 

1.  I would add a new file, ib_blocks.js into the blocks directory. This file would include all of the js definitions for my custom blocks.

2. add a new file (infuse.js) into the generators directory that created a new generator (Blockly.Infuse = new Blockly.Generator('Infuse'); ) This file would also include all of the js definitions for all of the "rules" of the language. This mirrored, for instance, the lua.js file in the same directory.

3. Then, I would create a new folder (infuse) into the generators directory with all of the separate js files defining the code generation for the standard blockly blocks as well as my own custom blocks. This again mirrored the contents of the "lua" folder in the generators folder (only it included infuse-specific language generators. 

4. As is described in the blockly documentation, "Blockly comes with both the source code and compressed files, so there is no need to build Blockly unless you are hacking in the core, blocks, generators, or msg directories.", since I was modifying the generators and blocks directories, I then rebuilt blockly using the various "npm run build" commands as necessary. This would create the corresponding infuse_compressed.js for my new language, as well as updating blocks_compressed.js and this all worked great!

When using the npm package of blockly, if this is no longer necessary, how specifically would you add a brand new custom language?  When you say "import" your custom blocks and generators can you be more specific?

Thanks!

Let me know if you run into any trouble using the published blockly package in Node.

Cheers,

Sam

[smta...@ncsu.edu]

I think I solved it. Thanks.