Add a bulk delete feature

[apsinghdev]

Current Behavior

I made a project in which I added some unnecessary blocks. then I found a way to improve my project so I have to remove those extra blocks but picking a block and dragging it to the trashcan is tiring and time-consuming when there are a lot of blocks to remove.

Desired Behavior

Wouldn't be a nice idea to to be able to select the blocks in bulk, hit the 'delete' key and all the blocks disappear?

Screenshots / Mockups

Blocks I have to delete

Implementation

1. Add logic to select the screen when a use left-click + drag
2. Select all the blocks that come under the selected screen area.
3. Delete the selected blocks when the user hits the "delete" key.

Acceptance Tests

All the blocks should be deleted similar to how we delete by dragging to trashcan.

Environment

• Operating System: [e.g., Windows, macOS, Linux]
• Browser (if applicable): [e.g., Chrome, Firefox, Safari]
• Version of Software/Project: [e.g., v1.0.0]

Checklist

• [x] I have read and followed the project's code of conduct.
• [x] I have searched for similar issues before creating this one.
• [x] I have provided all the necessary information to understand and reproduce the issue.
• [x] I am willing to contribute to the resolution of this issue.

---

Thank you for contributing to our project! We appreciate your help in improving it.

📚 See contributing instructions.

🙋🏾🙋🏼 Questions: Community Matrix Server.

[apsinghdev]

@walterbender sir, what're your thoughts on this?

[walterbender]

I've wondered about a good way to do this for some time. Maybe some sort of select-all or select with shift or ctrl.

[apsinghdev]

I've wondered about a good way to do this for some time. Maybe some sort of select-all or select with shift or ctrl.

what I have in my mind is selecting something like this (left-click+drag) and then pressing the delete button ( on the keyboard ) to delete all the selected elements.

similar to this:

https://github.com/sugarlabs/musicblocks/assets/109718740/71dad3c0-9377-4890-bb00-2a4bbd776d51

[walterbender]

That would work in most situations. Maybe it is a 2-d drag. But what about tablet devices?

[apsinghdev]

That would work in most situations. Maybe it is a 2-d drag. But what about tablet devices?

I think for tablet devices we can implement a touch gesture for selecting multiple blocks on tablet devices. Users can tap and hold to initiate the selection, then drag to expand the selection area. we can change the color of selected blocks as an indication.

To delete the blocks, In place of the "delete" key, we can provide a delete button or icon that appears when multiple blocks are selected. This button can be easily accessible on the screen for users to tap and delete the selected blocks.

[divyanash911]

Can we have a "select" button which on pressing, takes us into selection mode. On clicking any block in select mode , it gets selected so we can select multiple blocks just by single click or tapping. After that we can perform bulk operations for them like delete. This also broadens the scope of bulk features that can be implemented say copying as well. What are your thoughts on this @walterbender @apsinghdev ?

[apsinghdev]

Can we have a "select" button which on pressing, takes us into selection mode. On clicking any block in select mode , it gets selected so we can select multiple blocks just by single click or tapping. After that we can perform bulk operations for them like delete. This also broadens the scope of bulk features that can be implemented say copying as well. What are your thoughts on this @walterbender @apsinghdev ?

@divyanash911 Yes, it's what I proposed for tablet devices. but instead of adding a "select" button and "selection mode", my idea is to just let the user tap and hold on a block to start the selection and after that just click once on other blocks to select. Finally, delete using the icon.

For computer devices, In my opinion, Music Blocks is mostly used on Computer devices (though I am not sure). so selecting the screen using a 2-D drag is quite intuitive and easier to implement as we won't be required to maintain a state (for mode) ig. using both the approaches in conjunction may be good idea? @walterbender can provide better thoughts.

[walterbender]

Right now, a long press will invoke the same response as a right click--to bring up the secondary pie menu. I suppose we could use that menu to set the user initiate a bulk select.

[divyanash911]

Right now, a long press will invoke the same response as a right click--to bring up the secondary pie menu. I suppose we could use that menu to set the user initiate a bulk select.

So we add an option to bulk select blocks in that pie menu ? And in bulk select mode we can delete using a separate button? Or have I misunderstood the workflow?

[walterbender]

In general, I think a bulk select could be useful (bulk drag, for example). So I think we need bulk select and perhaps repurpose the delete button.

[divyanash911]

In general, I think a bulk select could be useful (bulk drag, for example). So I think we need bulk select and perhaps repurpose the delete button.

So instead of a delete button, we can have a select button and a new delete button which pops up like when you single click a block?

[walterbender]

I wouldn't say "instead of". But if you have used bulk select, then the existing delete button will delete everything selected instead of just the one block.

[apsinghdev]

I wouldn't say "instead of". But if you have used bulk select, then the existing delete button will delete everything selected instead of just the one block.

this approach I think is better as it can be implemented with less code and it also solves the problem of tablet devices. all we need to do is give the "delete" button another purpose when multiple blocks are selected.