Page MenuHomePhabricator

Tooltips should be shown while dragging handle in RevisionSlider prototype
Closed, ResolvedPublic1 Estimated Story Points

Description

When dragging a handle in the RevisionSlider prototype gadget, it should show you the pop-up tooltips for the revisions you are dragging over.

Event Timeline

kaldari raised the priority of this task from to Needs Triage.
kaldari updated the task description. (Show Details)
kaldari subscribed.
kaldari triaged this task as Medium priority.Oct 9 2015, 7:58 PM
kaldari moved this task from New & TBD Tickets to Needs Discussion on the Community-Tech board.
kaldari set Security to None.

I increased the hover surface area of the step points on the slider, and now they lie over the handles, which means that while dragging the handle, if our pointer stays within the step area, the hover tooltips will appear.
Attaching tooltips to handles themselves would mean that two separate tooltips will appear while dragging, which was definitely not ideal.

Check it out: https://test.wikipedia.org/w/index.php?title=Main_Page&diff=241305&oldid=200381
CC @DannyH

I would prefer for a tooltip to always be shown while a handle is being dragged (so that it's clear what revision you will get when you release the handle). Would it be possible to change the circles to rectangles and have them stretch to fill the space, so that there are no gaps between them? That would probably be easier than having tooltips attached to the handles. I'm not sure how tricky it would be to make the widths of the nodes dynamic though. Would it work to change them to 'width:2%'?

I would prefer for a tooltip to always be shown while a handle is being dragged (so that it's clear what revision you will get when you release the handle). Would it be possible to change the circles to rectangles and have them stretch to fill the space, so that there are no gaps between them? That would probably be easier than having tooltips attached to the handles. I'm not sure how tricky it would be to make the widths of the nodes dynamic though. Would it work to change them to 'width:2%'?

Hmm. Width:2% will work only when we have exactly 50 revisions on the slider. That part is easy to compute though (100/number of revisions). I am wondering, how are we going to tell revisions apart when the rectangles are placed right next to each other? Should we color them differently, perhaps alternate colors between grey and white?

Should we color them differently, perhaps alternate colors between grey and white?

That sounds good to me. What do you think about moving the handle into the bar so that it's more likely that the user will see tooltips while dragging the handles?

@NiharikaKohli, @DannyH: I tweaked the styles a bit more so that the handle is completely inside the slider. Let me know what you think: https://test.wikipedia.org/w/index.php?title=Main_Page&diff=241305&oldid=200381

@NiharikaKohli, @DannyH: I tweaked the styles a bit more so that the handle is completely inside the slider. Let me know what you think: https://test.wikipedia.org/w/index.php?title=Main_Page&diff=241305&oldid=200381

Looks good.

This looks awesome, very well done.