Update theme-modern to use JSON toolbox definitions instead of xml

[BeksOmega]

Category

• Plugins

Component

theme-modern

Is your feature request related to a problem? Please describe.

Many of the examples and plugins use XML toolboxes instead of the new JSON API. We should have our example code use the new APIs to best model what other developers can do with Blockly.

Describe the solution you'd like

Update the code in blockly-samples to use the JSON toolbox API.

Additional context

To work on this issue, first read the background information about how to contribute to samples and verify your changes.

1. Learn about defining a toolbox and read about the XML format vs the JSON format.
2. In blockly-samples, navigate to the theme-modern plugin's directory and run npm run start to start the playground. Look at the toolbox and what blocks are available.
3. Write a new copy of the toolbox definition in the JSON format instead of the XML format. The toolbox definition in most cases should now be in test/index.js instead of test/index.html.
4. Refresh the playground page and make sure the toolbox looks the same as it did before. You can compare against the version in master on the samples site to make sure the behavior hasn't changed.
5. Follow the rest of the instructions in the Contributing docs to verify your change and open a PR.