how to save/load in json ?

4,678 views
Skip to first unread message

Jerome Etienne

unread,
Aug 10, 2015, 1:35:53 PM8/10/15
to Blockly
Hello,

Im playing around with blockly, and i would like to save the diagram/code in json. i can readily generate javascript but i cant seems to be able to generate json. any hint ? 

Any pointers appreciated :)

Regards

Jerome

Carlos Pereira

unread,
Aug 10, 2015, 5:20:46 PM8/10/15
to Blockly
I'm not quite sure I fully understand the question. Blockly can generate the blocks code into different languages (javascript being one of them) and then the blocks themselves can be exported in an XML format. Currently blockly supports block definition in JSON (the javascript code can be found in the files inside the blocks folder), but nothing else really.

Jerome Etienne

unread,
Aug 12, 2015, 7:24:42 AM8/12/15
to Blockly
oh ? maybe i misunderstood.

Here im just looking for a way to save/load the blocks description in a simple text file. Thus users can easily save their work at the end of the day, and find it back the next morning.

I asked for json as im coding in javascript. but i found ```Blockly.Xml.workspaceToDom(workspace);```. 

is xml the format of choise to store the blocks from the workspace ?

Carlos P.A.

unread,
Aug 12, 2015, 7:30:29 AM8/12/15
to blo...@googlegroups.com
Yeah, the only format currently supported is XML. Somebody created a while ago a patch to also support JSON for blocks import/export, but at the moment is not compatible with the latest version of blockly: https://github.com/google/blockly/pull/20

--
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/tI-jqq7DDbY/unsubscribe.
To unsubscribe from this group and all its topics, send an email to blockly+u...@googlegroups.com.
For more options, visit https://groups.google.com/d/optout.

Jerome Etienne

unread,
Aug 12, 2015, 7:50:12 AM8/12/15
to Blockly
ok i will use xml then, thanks for your help :)

sarahv_21

unread,
Aug 17, 2015, 11:07:50 AM8/17/15
to Blockly
I have a question on this same topic.  How would you go about doing exactly this (save/load files on local file system) with XML?

I currently am using these statements below to export/import blocks:
var xml = Blockly.Xml.workspaceToDom(workspace);
var xml_text = Blockly.Xml.domToText(xml);

but that's only one set of blocks (that may just be stored in the browsers cache, for all I know) and no dialog opens to browse for a file or name a file to save it.
Any help would be greatly appreciated!  Thank you!

Carlos Pereira

unread,
Aug 17, 2015, 11:46:21 AM8/17/15
to Blockly
That is more of a general javascript question rather than something specific to Blockly.

All that blockly cares about is for you to pass it an XML DOM  to the Blockly.Xml.domToWorkspace function (you can convert and XML string into a DOM object using the Blockly.Xml.textToDom function) to load blocks into the workspace. If you want to save a file, all that Blockly will provide is a string with the XML data, and you'll have to use a general solution to convert that into a file that the user can download.

As an example, like BlocklyDuino does, I've used FileSaver.js to save XML files: https://github.com/carlosperate/ardublockly/blob/master/ardublockly/ardublockly.js#L264-L270
And use a normal HTML file input to read the user file and load blocks into the workspace: https://github.com/carlosperate/ardublockly/blob/master/ardublockly/ardublockly.js#L224-L240

Bill Keese

unread,
Jun 28, 2022, 11:01:33 PM6/28/22
to Blockly
FYI, JSON serialization is now supported, and it's even the default, see https://developers.google.com/blockly/guides/configure/web/serialization#json_system.
Reply all
Reply to author
Forward
0 new messages