pointer area issues

[pixelzoom]

I pulled these comments from @mbarlow12 out of #123, where he also said:

The only issue I found has to do with the pointer areas as noted above. This may be standard behavior (I don't have much experience with optimizing/handling/debugging pointer areas), and if so, please disregard those comments.

---

• Are pointer areas optimized, especially for touch? (run with query parameter showPointerAreas)
  // REVIEW
  • There appear to be some discrepancies between draggable/clickable areas and their associated sim elements. The terms in the toolboxes have non-interactive space between the pointer area lines and the objects themselves:

• While this is most prominent in the term toolboxes, it also appears in the equation accordion toggle button, all clickable items in the snapshots accordion box, the organize button, the universal operator buttons, and the lock control.

• There is also a discrepancy between the blue and red pointer area outlines for the following components: accordion box toggles, universal operator buttons, snapshot icons (incl. the delete & restore buttons), the organize button, and the variable number tweaker (incl. EE, EETwoVariables, and EEBasics Lab).

---

• Do pointer areas overlap? (run with query parameter showPointerAreas) Some overlap may be OK depending on the z-ordering (if the frontmost object is supposed to occlude touch/mouse areas)

[pixelzoom]

There appear to be some discrepancies between draggable/clickable areas and their associated sim elements.

Yes, this is the purpose of pointerAreas. We typically expand the interactive (draggable/clickable) areas of an element to make it easier to drag. The red dashed line indicates the interactive area for touch devices (aka touchArea), the blue dashed line indicates the interactive area for mouse devices (aka mouseArea).

While this is most prominent in the term toolboxes, it also appears in the equation accordion toggle button, all clickable items in the snapshots accordion box, the organize button, the universal operator buttons, and the lock control.

Yes, these are all as requested. For example, here's the request for the terms in toolboxes: #68 (comment)

There is also a discrepancy between the blue and red pointer area outlines for the following components:

mouseAreas (blue) and touchAreas(red) are almost always different, with touchAreas being larger. That's what you're seeing here.

Some overlap may be OK depending on the z-ordering (if the frontmost object is supposed to occlude touch/mouse areas)

The code review items doesn't make this clear. But we're looking for cases where mouseAreas (blue) overlap with other mouseAreas, and ditto for touchAreas. I took another look, and I don't see any overlap.

[pixelzoom]

@mbarlow12 Review my comment above and let me know if you have any questions. If you're confident that there is no problem here, feel free to close.

[mbarlow12]

@pixelzoom That makes sense, and thanks for clarifying the color mapping. Closing.