Expandable blocks with parameters

[Erin Carvalho]

Hey All!

I am using blockly for a science experiment simulator using NetLogo. I have already created most of the generator but I am having trouble creating the concept of an expandable block. I basically want to have a "create <num> particles block" with some sort of button to expand it to further customize other parameters that would otherwise be a default value unless it gets overridden. Any suggestions on how to do this? I've seen proposed solutions using mutators but not sure that would really work in this situation. Also a lower priority question but is there a way to make the first number of particles on the right a block (left block) instead of a field (right block), while still keeping the shape where each parameter is on its own line. 

Thanks,

Erin

[Beka Westberg]

Hi Erin,

Mutators are definitely the way to go for this project! Usually we associate mutators with the little gear icon and bubble workspace, but they don't have to be like that. In essence, mutators just allow you to define custom serialization of your blocks. This can be used to make them change shape/form in a whole number of ways, including the one you've proposed.

As for your second question, sadly that behavior is not supported by default :/ Because of the way the json block definitions are specified, it's hard to add this functionality to core blockly (or even a plugin) in a generalized way. However, if you want to build a custom renderer you may be able to build something that works for your specific use-cases.

I hope that helps! If you have any further questions please reply!

--Beka

--
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/5a609465-305e-49c2-bc4f-4adedc2fd9e9n%40googlegroups.com.

[Erin Carvalho]

Thank you Beka for your timely response. I will definitely be looking into Mutators. Is there any additional documentation aside from https://developers.google.com/blockly/guides/create-custom-blocks/extensions ? Or are there any examples like the ones in codelab? I found those to be very helpful in some the things that I have already built and would love more of a walkthrough for creating and customizing mutators.

Thanks,

Erin

[Beka Westberg]

Hi Erin,

Currently there are no codelabs related to mutators :/ However, there are some examples! Several of the built-in blocks use mutators, and all of that code is open source so you can look at it =)

Here are some links to the mutator definitions:

  * math_property mutator <- This is closest to what you want to do! It adds an extra input depending on a dropdown, meaning it has no mutator UI.

  * list_create_with mutator <- Allows for a variable number of inputs. This is a pretty standard type of mutator. Note it uses a JS definition, not a JSON mixin.

  * controls_if mutator <- This is a more advanced example that shows the power of mutators.

I hope that helps! And if you run into any specific problems with mutators you're trying to create, don't hesitate to ask here. Just be sure to include source code!

Best wishes,

--Beka

To view this discussion on the web visit https://groups.google.com/d/msgid/blockly/df00217a-8989-471b-8598-fcfe1ba8835fn%40googlegroups.com.

[Erin Carvalho]

Hi Beka,

So I was able to create the behavior I wanted with the use of field_minus.js and field_plus.js from the blockly-plus-minus plugin. I am able to create the block in the initial state and drag it around, but once I click the plus button to expand the block I get the following console errors. I've attached my helper file (as a txt file since Google Groups doesn't allow posting .js files) for this mutator. Any idea what might be causing this? 

Thanks,

Erin

[Erin Carvalho]

Also if I am deploying this to an app is there a way to remove the debugger on the right? Its great for development but would love to be able to toggle its existence

[Beka Westberg]

Hello,

It looks like you're running into the error documented here. I know the error is currently super unclear, but it should be getting a more informative description in the next release! To fix the issue you'll need to define both the mutationToDom and domToMutation methods on your block.

As far as I know, the developer console is pretty strictly tied to the playground :/ When you go to publish I'd recommend creating a custom (and separate) html page that your users will see instead. For information about injecting the workspace into a custom webpage you can check out the fixed size workspace and resizable workspace documents.

I hope that helps! If you have any further questions please reply!

--Beka

--
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/045846ea-4e71-4fe7-a90e-2bdcfa1cfe1cn%40googlegroups.com.