custom variable catgory in tool box

42 views
Skip to first unread message

fajar rokhman

unread,
Jul 8, 2024, 11:13:17 AMJul 8
to Blockly
Hi,

I want to create a dynamic category similar to the built in variable category.
I have managed to create the dynamic category with the button. 
following the doc here:
https://developers.google.com/blockly/guides/create-custom-blocks/variables#add_variables_to_toolbox

But I cannot list the variable dynamically and get error:

Cannot read properties of undefined (reading 'toUpperCase') TypeError: Cannot read properties of undefined (reading 'toUpperCase') at VerticalFlyout$$module$build$src$core$flyout_vertical.createFlyoutInfo (webpack-internal:///./node_modules/blockly/blockly_compressed.js:1417:467) .....

this is my code:
        Index2.workspace.registerToolboxCategoryCallback("CUSTOM_VARIABLE", () => {
            let list: any[] = [];

            list.push(
                {
                    "kind": "button",
                    "text": "A button",
                    "callbackKey": "yourCallbackKey"
                },
            );

            Index2.workspace.getAllVariables().forEach((item) => {
                list.push({
                    "type": item.name,
                    "message0": "%1",
                    "args0": [
                        {    // Beginning of the field variable dropdown
                            "type": "field_variable",
                            "name": "VAR",    // Static name of the field
                            "variable": item.name    // Given at runtime
                        }    // End of the field variable dropdown
                    ],
                    "output": null,    // Null means the return value can be of any type
                })
            })

            return list;
        });

        Index2.workspace.registerButtonCallback("yourCallbackKey", (button) => {
            Blockly.Variables.createVariableButtonHandler(button.getTargetWorkspace(), null);
        });

        Index2.workspace.getAllVariables().forEach((item) => {
            javascriptGenerator.forBlock[item.name] = (block: Blockly.Block, generator: JavascriptGenerator): any => {
                block; generator;

                return item.name;
            };
        });


Thanks

Aaron Dodson

unread,
Jul 8, 2024, 3:42:54 PMJul 8
to Blockly
Hi,

I think you need to add "kind": "block" to the object you append to the list in the first forEach loop through the list of variables. That way the toolbox will know to display variable blocks, as opposed to e.g. buttons or labels.

- Aaron

fajar rokhman

unread,
Jul 10, 2024, 3:27:45 AM (13 days ago) Jul 10
to Blockly
Sorry but it still doesn't work.

There is a plugin for typed variable that still uses xml. I just need to remove/change the assignment block  from the variable category because I want to provide it with my custom assignment block.
The current assignment block only support variable produced byt the create variable button. and I cannot accept other block.

I have block that represent propery of an object that I can assign value into.
I can create a custom block like object [ ] set prop [ ] to [ ]. but this is not practical since it will make two block with same function (assignment), and make user confusing.

the expectation is to have block assignment that can accept either variable or other block.

something like:

set [  ] to [  ]


Is there any example of blockly project with custom variable toolbox category. I cannot find any reference for this problem yet and now implement two different block for same function.

Thanks
Reply all
Reply to author
Forward
0 new messages