It is now possible to move in and out of groups, which was previously too difficult! The stacking order is perfect, with the last one moved on top. The lesson learned is that itâs too hard to update the tree with Reactâs âdonât do destructive updates bindâ, so letâs use immer to free ourselves from the bind.
After this, I fixed the groupâs background not being translucent. I also found that it can drop on itself, so I added a process to avoid inconsistencies.
What happens if I drop a selection into a group?
- Thought it would be a good idea to add each sticky to a group.
- The display is wrong after adding, for some reason.
- Only top-level elements are selectedâ is incompatible with âthe selection is not deselected after moving the selectionâ.
- Both stickies in a group and stickies in a selection are drawn.
- Deselected when dropped into a group.
- At first glance, it seems natural, but wonât the user be caught in this inconsistency?
- This operation is difficult to redo, so youâll need to be able to Undo
Add to the diagram
- I was just going to do C.
- A Bug
- DragDropAPI can also drop to itself.
- If a group can be dragged and a group can be a drop target, then of course there can be a âdrop on itselfâ, which is a problem!
- So when there is a drop to itself, it transfers the process to a drop to canvas.
- B Specifications
- Dragging a selection to a group will deselect it, unlike other cases
Testing in and out of groups
Tried the âif thereâs a group within a groupâ thing and found a nasty problem.
- The element being dragged is displayed in full size even when zoomed outâŠ
- I tried cloneNode and
event.dataTransfer.setDragImage
but transform: scale seems to have no effect - This is browser implementation-dependent behavior not specified in the specification
- Firefox was fixed 5 months ago, but Iâm not sure if Chrome has been fixed yet.
- 941356 - drag image not correctly created when parent has css transform
- Wife: âIt may not be optimal, but itâs not so much that itâs seriously damaging to what we want to achieve with this program as that it may be convenient to check the magnified view by pressing and holding the mouse without zooming.
- Well⊠letâs hold off for now then.
Aside from that, itâs rather buggy to begin with.
- The bounding box when thereâs a title is a little off, too.
- Fixed.
- I saw this result with the naked eye and thought it looked misaligned, but it just feels that way because of the menu bar and the group titles, and the stickies are centered.
- I wrote the coordinate values in the test case and checked them.
- I saw this result with the naked eye and thought it looked misaligned, but it just feels that way because of the menu bar and the group titles, and the stickies are centered.
Your bounding box is out of alignment by the amount of FUSEN_BORDER.
- fixed
What to do next
- Add a sticky when you press the button in the Add Sticky dialog.
This page is auto-translated from /nishio/2021-07-27Movideaéçșæ„èš using DeepL. If you looks something interesting but the auto-translated English is not good enough to understand it, feel free to let me know at @nishio_en. Iâm very happy to spread my thought to non-Japanese readers.