Annotation popovers should not overlap

[laurenwalker]

I suggest we move the popovers so that they are not overlapping so they're both readable at the same time.

[mbjones]

@laurenwalker I agree the annotation popovers shouldn't overlap. One solution might be to ensure that only one popover is open at a time by automatically closing any that are open when someone opens one of them. I think this is good behaviour even if they don't overlap, as I've always found it strange to have to click again to close the popovers. Better if they close automatically if someone clicks on another one. How does that sound to you all? cc @amoeba @mpsaloha

[amoeba]

I've also found the popover behavior pretty strange. Popover claims to have a "focus" trigger mechanism that should do this for us but I haven't been able to make it work on Bootstrap 2.3.1 (our version). It does work as advertised on the 5.x series. @laurenwalker have you seen "focus" mode work?

Making sure the two popovers can both be displayed at the same time without overlapping could be tricky but having both open at the same time might be useful. I think either doing what you suggest (only show one at a time) or merging these back into a single but much wider popover might be best:

[laurenwalker]

I have seen focus mode work, but I think its effectiveness depends on the element type. Since these are divs, it can be tricky to trigger a focus event. I think hover/mouseover might work better.

But I like your sketch of the single popover with info about the property and value.

[robyngit]

We can try using the FormaticUI popover module instead