Change right gutter to vertical timeline + topic controls

:bell: This feature is now merged into master as of May 31


One of our targets for 1.6 is to radically revamp the right gutter, per previous discussions.

More specifically, it will be a vertical scrollbar that better visually represents the “timeline” of discussion, from inception to the current latest post. We can do some clever stuff here representing long pauses in the discussions or periods of intense activity, but I agree with @erlend_sh we should defer that until a future release. For now simply showing

  • first post date – relative time, but include full year
  • current visible post date / slider – allows “go/jump” to any post number or date as well
  • most recent post date
  • deepest / lowest read position – note the little blue dot, lets you go back to “where you were” if you jump around in the earlier timeline.

… should suffice.

Also, we’re adding some topic level controls to the right sidebar as well:

  • current topic tracking state (short form, glyph only)
  • reply to topic button

This does mean that what’s currently in the right gutter, the incoming and outgoing links must be moved under each post. Let’s go back to a mildly edited version of @erlend_sh’s iterated mockup:

(the text is not quite right; I suggest 14 linked posts since that’s clear that we aren’t tracking links across the entire web here, just intra-site links)

We can also bring back distinguishing incoming and outgoing links by showing the directional arrows when expanded:

One clarification. We probably want a visible button on the bottom-most read position indicator, as I covered in this topic

This button should become visible whenever you are not already at the bottom most read position in the topic, that is to say, you are scrolled up in the topic, away from your current latest read position. Like so:

And of course when you are alreadly at (or very near) your lowest read position, that button should disappear.

(let me be crystal clear in saying that we should not care about “reading holes” in the conversation in this initial release. Later we can add more complex visualizations and markers for the timeline, intensity, dates, gaps, what have you.)

One caveat: mobile will continue to use the existing progress bar style, so that code should definitely not be removed.

This is a big UI change, but it’s the only big UI change we have slated for 1.6. I have personally grown to greatly dislike the way we use the right gutter now, and I feel the entirety of the current right gutter area is vastly underutilized.

We will start working on this in earnest in the next few days.

59 Likes

OK this was merged in a few hours ago.

7 Likes

5 posts were split to a new topic: Required CSS layout tweaks for new vertical timeline in 1.6?

7 posts were split to a new topic: Should “Reply” appear in the right gutter?