I'm developing a new UI plugin that integrates Blockly Google library. I read the forum thread where Sergi Garcia exposed the idea and it made me click, as I'm a ICT teacher in secondary education where we use block programming with our students (for example, Scratch and App Inventor).
I followed the guidelines you gave him, implementing the UI plugin API and integrating blockly as a AMD module. Here is the fork with the basic implementation and a screenshot:
My idea is to test it with my students the next course. Internally I save in the textArea the blockly state and the code generated in Python. I'm still figuring out some features, like localization and configuring the available toolbox blocks and categories by question.
For localization I'm using a templateParams option, but I'd like to be able to configure it only in the prototype, not in each question. Is this possible?
I would like to know if you would be interested to have it integrated in upstream or as a subplugin, and if so what should be improved. Anyway, thank you for developing such a great plugin!
Uncaught ReferenceError: goog is not defined at /moodle/lib/requirejs.php/1595836404/core/first.js:192 /moodle/lib/requirejs.php/1595836404/media_videojs/loader.js:192 Uncaught ReferenceError: goog is not defined at /moodle/lib/requirejs.php/1595836404/media_videojs/loader.js:192 require.min.js:5 Uncaught Error: No define call for media_videojs/loader http://requirejs.org/docs/errors.html#nodefine at makeError (require.min.js:5) at Object.completeLoad (require.min.js:5) at HTMLScriptElement.onScriptLoad (require.min.js:5) /moodle/lib/requirejs.php/1595836404/message_popup/notification_popover_controller.js:192 Uncaught ReferenceError: goog is not defined at /moodle/lib/requirejs.php/1595836404/message_popup/notification_popover_controller.js:192 require.min.js:5 Uncaught Error: No define call for message_popup/notification_popover_controller http://requirejs.org/docs/errors.html#nodefine at makeError (require.min.js:5) at Object.completeLoad (require.min.js:5) at HTMLScriptElement.onScriptLoad (require.min.js:5) /moodle/lib/requirejs.php/1595836404/theme_boost/drawer.js:192 Uncaught ReferenceError: goog is not defined at /moodle/lib/requirejs.php/1595836404/theme_boost/drawer.js:192 require.min.js:5 Uncaught Error: No define call for theme_boost/drawer http://requirejs.org/docs/errors.html#nodefine at makeError (require.min.js:5) at Object.completeLoad (require.min.js:5) at HTMLScriptElement.onScriptLoad (require.min.js:5) /moodle/lib/requirejs.php/1595836404/theme_boost/loader.js:192 Uncaught ReferenceError: goog is not defined at /moodle/lib/requirejs.php/1595836404/theme_boost/loader.js:192 require.min.js:5 Uncaught Error: No define call for theme_boost/loader http://requirejs.org/docs/errors.html#nodefine at makeError (require.min.js:5) at Object.completeLoad (require.min.js:5)Finally congratulations on what is certainly a very interesting development effort. at HTMLScriptElement.onScriptLoad (require.min.js:5)
and a similar list on every page I load.
Copying your question prototype from the samples folder and trying to create a question of that type also doesn't go well.
It seems that Google's closure library is required, but I've never used that and I'm not sure how it's meant to be loaded or built. Can you advise what I should do next, please?
To answer your other questions ...
Yes, you should be able to put template parameters into the prototype. The complete set of template parameters for a question is obtained by merging the specific question's parameters with those of the prototype.
I am certainly interested in knowing more about your extension, and playing with it a bit myself. I'm a bit nervous about integrating it into the base CodeRunner plugin, however, as it's yet another thing to be documented, maintained, tested on each new Moodle release, etc. I'm a bit reluctant to get into that, since I'm almost certainly not going to be using blockly myself. However, I have a colleague in our department who's very involved in school computer education, so I'd want to get his opinions on it.
My preference would be to have a separate sub-plugin, distributed via github and maintained independently by you. I'm not sure how to make that work, however. Bits of your subplugin need to go in various different places within coderunner (amd/src, amd/build, samples and language/*). To make that work there needs to be proper sub-plugin API, including an install capability. Again, things might start to get complicated.
But let me mull over the issues later. I'd first like to get it working so I have a better feel for what it can do and how useful and maintainable it would be.
Thank you for such an interesting development.
Unfortunately I should have checked more the code before posting here. I've made more changes recently to fix some issues, so maybe if you do a 'git pull' now those errors will hopefully get fixed (crossing fingers here).
Yes, I created a blockly prototype that I import in the CR_PROTOTYPE category and then I create questions selecting the blockly type question type. I'm also using Moodle 3.9 and latest Google Chrome if that helps.
About the params parameter in the loadUi API I read from your documentation:
"The params parameter is a record that allows additional parameters to be passed in, such as those from the question's templateParams field and, in the case of the Ace UI, the 'lang' (language) that the editor is editing."
I checked a little the code and I can see that "params" passed to UI constructor is filled with data-params textArea attribute, but I don't follow where the merge with the prototype is done. Maybe templateParams only inherit from prototype value in the question code?
thank you for your interest and support!
I thought I might try to regenerate the build contents from src but when I run grunt, the approved Moodle checker and minimiser, I get an impressive 11,000 odd errors - clearly blockly isn't written to grunt specs! But what I did notice is that there's a build/blockly_coderunner.min.js and a build/block_coderunner.min.js.map but no corresponding blockly_coderunner.js file in the src directory. However, I can't see how that could cause the problems I'm having.
It could be that the problem occurs due to some setting in my development system, but that seems a bit unlikely. Have you tried installing your version of CodeRunner in a clean new install of Moodle?
On other matters ...
Many thanks for drawing my attention to the Moodle subplugin capability - I had never heard of it before!
Merging of template parameters is done in the PHP code, server side, since it involves both the current question and the prototype, and also requires Twig processing for randomisation. That means that when you add or edit template parameters within the author editing form you have to save the question (.e.g "Save and continue editing") to see the effects. I agree this is a bit clumsy, but it's difficult to avoid.
About the blockly_coderunner file is an old file I didn't remember to delete in build, now is done. You are right that blockly isn't grunt friendly, I must do a "grunt --force" to get the files build and I close my eyes to not see those red alerts flashing :)
Yay! I have it working on my machine :-)
In order to get a clean grunt run, I also copied toolbox.xml into the blockly folder in build and changed ui_blockly.js to load it from there. I then removed the blockly folder from src.
I don't know much about blockly so I wasn't able to do much. But clearly the basic functionality works and it looks like great fun, Ruben.
I think the subplugin idea is the way to go, but I haven't had time to look into whether that can be made to work with question types and what I have to do to support it. Let us know about any further developments. I suggest you email me directly with minor tweaks, bug fixes etc but post back here if you have actual developments suitable for others to use.
Thanks again for an interesting and fun development.