Rectangular selection overlap algorithm (and Firefox support)

edemaine commented 3 years ago

Rectangular select uses checkIntersection but we could use getIntersectionList instead. Not sure whether it's faster though...

Sadly, neither is supported on Firefox. https://github.com/thelonious/kld-intersections/ doesn't look easy to drop-in... have to duplicate entire DOM, and doesn't support transforms?

[x] Add warning about lack of rectangular drag support on Firefox

Chrome doesn't actually implement these correctly: you can select a rectangle, ellipse, or segment by selecting any rectangle that intersects their bounding box. ☹️ (Pen strokes work only because of the silly way we're currently rendering them.)

So maybe we should use getIntersectionList, if it's available, as a filter. Then check for actual intersection among those objects manually? An advantage of a manual check is that we can add an error threshold, especially useful for selecting objects without clicking on them exactly (formerly related: drag detection #109).

[ ] Use getIntersectionList only if available
[x] First level: check for bounding-box intersection (like Chrome does now)
[x] More efficient and correct for paths?
[x] Correct intersection with line segments
[x] Correct intersection with ellipses

When doing this, it would also make sense to do it in a way that supports polygon selection (#115), and line selection (#46).

ndattani commented 2 years ago

I mentioned here that things outside of my selected rectangle, often get deleted. Would fixing this issue (#87) help with that?

edemaine commented 2 years ago

Yes, and work is in progress to fix this: see #183. (This is currently the highest-priority issue.)

edemaine / cocreate

Rectangular selection overlap algorithm (and Firefox support) #87