Hi everyone!
I'm Songlin Jiang, a Google Summer of Code (GSoC) 2022 student contributor at MIT App Inventor mentored by Evan Patton (@ewpatton) and Li Li.
Project Introduction
My project for GSoC 2022 here is to enable the selection of multiple blocks at the same time and allow moving and doing actions on multiple blocks on Blockly. This behaviour is pretty much the same as when you try to manage your files on your Operating System, and you can drag a rectangle to select multiple files, then moving them around, copying, deleting.
For the project, we hope that the Blocks Multi-select feature will be only functional when you hold the Shift key, so that users can still drag the workspace when not. Users can simply click on the blocks to select or unselect them, or drag a rectangle to select a set of them at the same time.
It sounds like a little bit easy, but actually, I would say that it's not. Multiple selections can become a crazy-complex feature when you start thinking about the details. When dragging two blocks, you have to think about how the connections will work. When you right-click on multiple selections, you also have to make sure that those options apply to all blocks. And the touch screen problem would also need to be addressed.
This feature request has remained open on the GitHub Issues for 6 years, but it's still in the discussion phase and far from the beginning of Implementation there. So I'm writing here to share my thoughts so far and collect your ideas for implementation if possible.
Implementation
Although we hope we can apply the work to the whole Blockly project, but I find that there exists significant difference between the latest Blockly and the App Inventor's Blockly. App Inventor's Blockly version is much older and has a completely different logic for handling the dragging blocks. e.g. latest Blockly has already uses the BlockDragger class to handle the drag event, while App Inventor's Blockly still uses the mousemove event under the Blocks class for that. Which means our job may hardly apply to the other Blockly based project that uses the latest version.
I plan to use the DragSelect to enable users to drag a rectangle to select a set of them at the same time. That library works on the App Inventor's Blockly. However, it won't work on the latest Blockly.
I plan to maintain a global list for the currently user selected blocks.
One possible and maybe simple implementation I guess is that, when users want to do any action (events happen) on multiple blocks, create a dummy and invisible block that make all the selected blocks its child, then we can just do actions on that single dummy block. When the action (event) finishes, delete that dummy block. Although this looks promising but I haven't studied the possibility of this.
Another one will be refactoring all the codes, making them support multiple blocks selection, that would be really complexing.
I may add more possibilities of implementation next week after a talk with Beka(@BeksOmega). If you come across this post and happens to have more ideas, please do not hesitate to tell me. Thanks in advance.
Regards,
Songlin
