Page MenuHomePhabricator

Make inline comments more discoverable
ClosedPublic

Authored by epriestley on Mar 7 2015, 7:37 PM.
Tags
None
Referenced Files
F13194702: D12010.diff
Sun, May 12, 9:48 PM
F13177462: D12010.diff
Wed, May 8, 7:43 PM
Unknown Object (File)
Mon, Apr 29, 3:17 PM
Unknown Object (File)
Wed, Apr 24, 11:03 PM
Unknown Object (File)
Apr 1 2024, 7:03 PM
Unknown Object (File)
Mar 5 2024, 1:21 AM
Unknown Object (File)
Feb 20 2024, 11:58 AM
Unknown Object (File)
Feb 17 2024, 6:39 PM
Subscribers

Details

Summary

Ref T2009. Right now, when you mouse over a line number, we change the cursor to a "pointer", but that's the only hint we provide about the existence of inline comments.

Occasionally, users have reported confusion around how to leave inline comments.

Try to increase discoverability by showing the line reticle when you hover over the line.

(I could take this or leave it, but it seems OK / not annoying after 15 seconds of playing with it.)

Test Plan

Waved cursor over line numbers, attempted to test all the editor/noncontiguous/across-files cases.

Diff Detail

Repository
rP Phabricator
Lint
Lint Not Applicable
Unit
Tests Not Applicable

Event Timeline

epriestley retitled this revision from to Make inline comments more discoverable.
epriestley updated this object.
epriestley edited the test plan for this revision. (Show Details)
epriestley added reviewers: chad, btrahan.
webroot/rsrc/js/application/differential/behavior-edit-inline-comments.js
134–138

also I made this amazing block of logic a little less intense

Can we {hovergrey} or whatever color the background of the number column as well?

It's kind of messy to do that in the drag state since we have to do a lot of fishing around to add/remove classes from all the <th />s. We don't currently need to identify or track the intermediate <th /> nodes.

So: yes, but I'd rather not. How important do you think it is?

can it just be CSS? .differential-diff th:hover

btrahan edited edge metadata.
btrahan added inline comments.
webroot/rsrc/js/application/differential/behavior-edit-inline-comments.js
134–138

modest reduction of intensity

This revision is now accepted and ready to land.Mar 7 2015, 7:59 PM

The tricky case is when you're dragging across several nodes. Say you have this unified view:

11code
2code
3code
42code
3code

If you click and drag from "1" in the right column to "2", in the right column, I'd expect these cells to get the hover effect:

1 1code
2code
3code
4 2code
3code

Specifically, those are the rows where the yellow reticle will appear.

We can use CSS to highlight the specific <th /> under the cursor, but that feels a little odd / inconsistent to me?

Also, if you do that and then move your cursor over a <th /> in different file (while the mouse button is still held down), we'd highlight the cell but it's not actually targeted or active: logically, we're ignoring it, because it's not a valid drag target. Highlighting it visually feels weird/inconsistent there to me, too.

I can make the <th /> highlighting match up with the reticle display relatively easily, it's just a big of extra code/mess. I'd rate it like a 3/10 on not wanting to do it because I'm lazy? If you're 4/10 on thinking it's cool/good or whatever, I'll add it.

big of extra code/mess

Er, bit. It's going to be like 15 lines or something, it's just 15 lines of JS we could plausibly do without.

I think it's likely the right thing, mostly you're mousing over/interacting with the numbers, but then we don't highlight them along with the code, so there is a slight disconnect. I played around with a few other similar apps and think it's likely the correct thing to do.

If it makes you feel better, I'm about to go clean up cat vomit. Not that that's worse than writing javascript.

epriestley edited edge metadata.
  • Highlight cells.

First impressions:

  • Generally feels reasonable.
  • Highlight color feels maybe a little off to me here? Maybe something more saturated and/or lighter?
  • Interaction where you hover an inline comment and the cells get highlighted feels slightly strange?

Anyway, play around with it and see how it feels.

This revision was automatically updated to reflect the committed changes.

I'll pick a better shade, im sure we have something that'll do.

I also tried not highlighting the lines when you hovered a comment (vs hovering the line numbers). That felt OK for normal inlines, but a bit odd when hovering an "edit" inline. If the oddness sticks we could try adding hover state on edit inlines but not on submitted inlines.