Hi,
Does anybody know how to adapt a blockly javascript code to P5.Js…?
Thanks
Possibly – which blockly webservice was it written on?
Thanks for your interest… in fact the blockly javascript is not far from p5 one. changes can be made manualy , figures , circle and rect (rectangle) for wich colour are included and some other things, nothing difficult , only need to put things in the right place
Sorry I was unclear. I know what Blockly is.
I was asking which blockly code you are trying to adapt – what, from from where.
There have been multiple experiments with integrating blockly and processing / p5.js.
see for example blockp5.js, and blockly-processing, and Code It Studio
- https://forum.processing.org/two/discussion/23821/blockp5-js-p5-js-blockly
- https://github.com/archive-for-processing/blockp5.js
- https://github.com/kut-tktlab/blockly-processing
- https://forum.processing.org/two/discussion/26863/block-editor-for-processing
- https://app.code-it-studio.de/
There are also lots of things written in blockly – so the question is what kind of blockly you are trying to adapt.
If you solved your problem, that is good!
here is “coding with chrome” that I use on my chromebook…
I have seen a lot of examples programing with blocks, but did’nt find the ergonomy of the guenuine blocky…
I have a lot of programs writen this way that I will copy and adapt in p5 editor to access mouse management and share option , I have posted my first recently.
Thanks for your interest…
Neat. I wasn’t familiar with the Coding with Chrome extension.
Looks like it can be installed in Desktop Chrome as well.
Their built-in Blockly editor is vanilla blockly – it has its own JavaScript draw functions, so it isn’t using p5.js for drawing the way some of the projects that I linked above are. The Coding for Chrome > Blockly > draw menu contains:
clear, Circle, Rectangle, Point, Line, Ellipse, Triangle, Text
In p5.js those would be lowercase: point, line – also, Rectangle() is rect().
Blockly draw objects also take a direct color argument, while in p5.js you set fill() and stroke() separately before drawing geometry.
In the “Colour” menu, you get “colour with” – in p5.js that is color(). It can be RGB, like in Blockly, or you can use colorMode() to set it to HSB and/or change the range values.
Finally, there are a lot more available functions in p5.js. See the reference for details: