computers · kids

Custom Blockly Block “does not know how to generate code”

I’m playing around with my Espruino board (embedded board, programmed with JavaScript) as part of my quest to find a kid-friendly embedded controller.  One of the nice things about Esruino is that it comes with a Web-based IDE that provides a terminal console that allows you to write JavaScript directly onto the board or allows you to programme it using Blockly.

I want to write some custom blocks, so downloaded the source for the EspruinoWebIDE and did the following:

  • Created a new file “EspruinoWebIDE\blockly\blockly_myfile.js”
  • Included this file in a SCRIPT tag in the top of “EspruinoWebIDE\blockly\blockly.html”
  • Proceeded to create my blocks – initially as defined using the Google BlockFactory and then added to blockly.html to present them in the UI

There are already a few files defining extra blocks – blockly_espruino.js is the main one and blockly_robots.js is a simpler one, that actually makes quite a good example to follow if you are doing your own.

The basic idea is that there is a ‘toolbox’ definition for your block in the blockly.html file (which makes it appear in the menu of blocks in the user interface), supported with a block-definition file detailing the physical appearance of the block and what it needs to connect to within the user interface (Blockly.Blocks.mycategory_myblock) with an accompanying code-generation block.  In this case, generating JavaScript via Blockly.JavaScript.mycategory_myblock that uses the Blockly API to get what it needs from the user interface and returns a string that contains the corresponding generated code.

There is a setting in the EspruinoWebIDE – Settings->General->Overwrite JavaScript with Graphical Editor – which is quite handy at this point, as it means that every time you hit ‘Send to Espruino’ in the graphical editor, the JavaScript window is updated with the generated code.

Except when it isn’t.  There were no obvious errors, and the ‘Send to Espruino’ always said ‘Sent’ but there was no outward sign that anything had happened.

If you use the Inspect option of the Chrome browser then it was apparent that there was a JavaScript error:

Language “JavaScript” does not know how to generate code for block type “mycategory_myblock”

This hidden message indicates that there is a miss-match between the Blockly.Blocks.mycategory_myblock function and the Blockly.JavaScript.mycategory_myblock function and even though the block is available through the user interface, Blockly doesn’t know how to generate code for it.

Except in my case, no matter how it was written, generated, typed or checked, it was ignoring my code and I just could not spot what the error was.  Eventually, I changed the order of the SCRIPT statements in blockly.html, wondering if there was some kind of load-order issue and it suddenly started working.  Once I changed the order back again, it kept on working – so unfortunately I have no idea what was causing the problem, but just guessing some weird local caching issue or something not picking up my changes.

But if you are finding things aren’t working but there are no visible errors, definitely try Inspect and look for JavaScript errors and see if you can somehow force the application to re-load all files from scratch to make sure you aren’t working with an old version or something similar.  I still don’t know why it started working, but at least it works now.

The only reason I’ve written this is that Googling for various hints as to what might cause the issue was failing me – even once I knew what the error was.  So thought I’d write it down myself in case others have a similar issue – this might give someone else a clue.

Despite this rather irritating issue, I actually quite like Blockly.

In a future post, I’ll talk a bit more about what I’m actually doing with all this.

Kevin

 

 

 

maker

ArduBlockly and the Arduino Nano

I’ve been wanting to find a scratch style interface for Arduino to see if I could do something simple Arduino and Lego wise for the kids.  We have a CodeBug (which is pretty good for learning basics of programming for LEDs and I/O – maybe the topic of another block post, but see http://codebug.org.uk/ if you are interested) which is programmed using a web-based environment based on Google Blockly.  We’ve also used Scratch, so these were my two starting points.

After some googling, I found ArduBlockly, ArduBlock BlocklyDuinoS4A (Scratch for Arduino) and Snap.  As far as I can see, ArduBlock doesn’t seem to be maintained at the moment, Snap looks like an enhancement on S4A and ArduBlockly looks inspired by BlocklyDuino.

Snap looks particularly interesting and I’ll take a look at that at some point, but I went with ArduBlockly as it has a ‘download and just run all-in-one’ installation.  As far as it goes, this largely worked quite well – the only problem is that at present, it doesn’t support the Arduino Nano, which is what I was hoping to use.

However, seeing as this is basically using a Python web server to serve the Blockly interface to a browser, and then using the Arduino IDE (at least v1.6) directly to interface with the hardware, I had a poke around to see if the Nano could be slotted in.  The answer is yes and no.

The ‘all in one’ nature of the beast means that the Python is compiled into something that just runs, so isn’t editable anymore.  However, if I was happy to install Python and use a browser directly, I could hack it about.

Note: the following will hopefully become redundant at some point as support for the Nano I’m sure will be forthcoming, but it is documented here for my own reference right now.

In order to add the Nano enough for me to start playing, from some googling and searching around on github, there are three files that appear to require editing:

ardublockly/classic/settings.html

In the ‘Arduino Board’ selection form, a new <option> is required whose value is ‘nano’.

ardublocklyserver/compilersettings.py

There is a __Arduino_type array which needs to include

'Nano': 'arduino:avr:nano'

as an option.

blockly/generators/arduino/boards.js

This defines the properties for the different support boards, so an entry for the Nano is required.  This is largely the same as the ‘uno’ entry, but the Nano has two additional analogue pins.  This is unverified, as I’m not an Arduino expert (to use at your own risk), but I believe all that is required is to create an entry as follows:

Blockly.Arduino.Boards.nano = {
  name: 'Arduino Nano',
  description: 'Arduino Nano with ATmega328p board',
  analogPins: Blockly.Arduino.Boards.generateAnalogIo(0, 7),
  digitalPins: Blockly.Arduino.Boards.generateDigitalIo(0, 13).concat(
                   Blockly.Arduino.Boards.generateAnalogIo(0, 7)),
  pwmPins: Blockly.Arduino.Boards.uno.pwmPins,
  serial: Blockly.Arduino.Boards.uno.serial,
  serialPins: Blockly.Arduino.Boards.uno.serialPins,
  serialSpeed: Blockly.Arduino.Boards.uno.serialSpeed,
  spi: Blockly.Arduino.Boards.uno.spi,
  spiPins: Blockly.Arduino.Boards.uno.spiPins,
  spiClockDivide: Blockly.Arduino.Boards.uno.spiClockDivide,
  i2c: Blockly.Arduino.Boards.uno.i2c,
  i2cPins: Blockly.Arduino.Boards.uno.i2cPins,
  i2cSpeed: Blockly.Arduino.Boards.uno.i2cSpeed,
  builtinLed: Blockly.Arduino.Boards.uno.builtinLed,
  interrupt: Blockly.Arduino.Boards.uno.interrupt
};

Then running the ArduBlockly application using the ‘start.py’ script rather than the stand-alone ‘ardublockly_run’ batch file seems to allow me to use it with my Nano.

I was getting ‘Arduino Exit Code: 259’ as an error though, and something somewhere online suggested that the arduino_debug.exe should be used for the diagnostics from the command line, rather than your arduino.exe, so I updated the ArduBlockly preferences to use arduino_debug.exe and now I get a successful build and download.

Aside – I couldn’t get ArduBlockly to work in MS new browser (Edge), so I use it with Chrome, connecting to the local URL generated by the running Python script of http://localhost:8000/ardublockly/

(If I ever get around to getting GitHub going properly and assuming this is verified as the right way to add the board, I’ll submit it back).

I look forward to see how ArduBlockly develops, and do wish to try Snap at some point too (especially as at present, with the above hack for the Nano, it is no longer the simple ‘all in one’ application for installing on a PC that the kids could use).  However, it is early days for ArduBlockly development, and so far the signs are looking pretty good to me!

Kevin