ibm-js / delite

HTML Custom Element / Widget infrastructure
http://ibm-js.github.io/delite/
Other
68 stars 28 forks source link

HasDropDown: support open by hover #471

Closed wkeese closed 8 years ago

wkeese commented 8 years ago

Add HasDropDown#openOnHover flag so that the popup opens [after a delay] just by hovering the HasDropDown widget, and conversely, the popup closes (after a delay) when the user stops hovering the HasDropDown node or its popup.

This should work for nested popups too, so the user can open a chain of popups just by consecutive hovering.

In addition, there are some possible stretch goals and I'm not sure which we will support:

  1. Clicking a HasDropDown node should open the dropdown immediately, and thus previously opened (non-ancestor) popups should immediately close.
  2. Clicking a blank area of the screen should immediately close the open popups, waiving the usual delay between unhovering the popup and the popup closing.
  3. If the user opens a popup by clicking, then it shouldn't close unless the user clicks somewhere again. In other words, if the popup is opened by clicking, then just hovering and unhovering the HasDropDown node or the popup shouldn't cause the popup to close. This becomes more complicated for nested popups when some were opened by hover and some weren't (although I guess there are already complications if you have a chain of HasDropDown/popups widgets and some have the openOnHover flag and some don't.
  4. Generally, HasDropDown shouldn't open the popup until after a delay. However, if a popup is already open, and the user hovers another HasDropDown node, then open the new popup instantly. There are two sub-cases for this feature: (a) sibling HasDropDown nodes, for example rows of a table where each row has a button that shows a popup (b) nested popups, like the File --> Open Recent --> recent documents menu hierarchy. In case (a), the old popup should be closed immediately rather than after the usual delay. But presumably the delay should only be waived if the user hovers over another HasDropDown node, not just hovering over anything random.