Page MenuHomePhabricator

Visual update to Conpherence Durable Column
ClosedPublic

Authored by chad on Mar 11 2015, 5:03 PM.
Tags
None
Referenced Files
Unknown Object (File)
Fri, May 3, 11:01 PM
Unknown Object (File)
Fri, May 3, 11:01 PM
Unknown Object (File)
Fri, May 3, 3:48 AM
Unknown Object (File)
Mon, Apr 29, 3:53 PM
Unknown Object (File)
Wed, Apr 24, 11:48 PM
Unknown Object (File)
Wed, Apr 24, 4:22 AM
Unknown Object (File)
Apr 2 2024, 7:40 AM
Unknown Object (File)
Mar 29 2024, 8:35 PM
Subscribers

Details

Summary

Numerous visual updates to the Durable Column, mostly to emulate current Conpherence look and feel.

Test Plan

Lots of little pixel chasing. Also Chrome, Firefox.

Diff Detail

Repository
rP Phabricator
Lint
Lint Not Applicable
Unit
Tests Not Applicable

Event Timeline

chad retitled this revision from to Visual update to Conpherence Durable Column.
chad updated this object.
chad edited the test plan for this revision. (Show Details)
chad added reviewers: epriestley, btrahan.
webroot/rsrc/css/application/conpherence/durable-column.css
167

Sorry @btrahan. :(

yaaay

How does the ui indicating loading state now?

webroot/rsrc/css/application/conpherence/durable-column.css
167

No worries

src/view/layout/PhabricatorTransactionView.php
66

what's this do?

webroot/rsrc/css/application/base/main-menu-view.css
14

this seems out of scope to this diff. what's the dealio?

I'm not much of a fan of loading states, but I think the "Footer Status" area is a good place to use an icon spinner or "Loading..." before the new UI. Sadly, I sort of like Facebook's fake news feed loading states. I don't know why.

src/view/layout/PhabricatorTransactionView.php
66

In firefox the floats weren't clearing. This class is similar to clearfix

webroot/rsrc/css/application/base/main-menu-view.css
14

This extra background causes a slightly darker header on the left, but not on the column. So it either gets added to the column or removed from the header for color consistency.

The loading mask stuff emulated the current loading mask stuff in regular view conpherence. I think without the loading mask its going to appear broken, particularly on switching threads.

Howsabout reverting the loading mask stuff for now and addressing some other loading ui later?

Otherwise, there's some js code in the durable column behavior that adds / removes the 'loading' class and should be purged /updated too.

Also, depending on how this ends up working, we could pre-render and keep updating all the available conpherences in the durable column. This would mean one load up front and that's it for loading delays really.

chad edited edge metadata.
  • Add loading mask back - lock to content area like Conpherence.

No problem, I think my main objection was it masked the entire column, but it looks like in Conpherence full we just mask the content area. I updated it to match that and it feels more betterer.

btrahan edited edge metadata.

You can just ship this and I'll make changes. Let me know if you think the behavior that existing conpherence has - putting up loading masks as granularly as possible over the impacted areas - is the correct one.

Currently the whole column is re-drawn at once on thread load. This happens when you first load the column and when you click the little icons to switch thread.

So when you click the icon to switch a thread, this happens

  • you click
  • browser sends server request
  • server does it things sends response back
  • browser updates entire column
  • user gets visual indication that the thing the clicked on is now "selected"

I think this can easily be long enough that clicking feels broken and the loading mask in this diff doesn't cover this area.

This revision is now accepted and ready to land.Mar 11 2015, 5:57 PM

I am not a huge fan of the loading mask, tbh, I'd like to look at other solutions long term (not now). Mostly, it's visually disruptive (heavy) when I think a lighter touch is perfectly fine. The durable column mask change I made is pretty slight, but it feels much lighter and is conveys the same information to the user. The full Conpherence mask doesn't cover the switcher or title either, so I didn't think this change would impact much.

This revision was automatically updated to reflect the committed changes.
In D12041#118213, @chad wrote:

The full Conpherence mask doesn't cover the switcher or title either, so I didn't think this change would impact much.

These are different javascript products; e.g. the full conpherence view updates the title in javascript as the user clicks. I apologize for not being precise in how they differ, though I have been consistent in saying that its broken ish now in that normal conpherence has the JS to make all this stuff super smooth. :D