Numerous visual updates to the Durable Column, mostly to emulate current Conpherence look and feel.
Details
- Reviewers
epriestley btrahan - Commits
- Restricted Diffusion Commit
rP5ef99dba2afc: Visual update to Conpherence Durable Column
Lots of little pixel chasing. Also Chrome, Firefox.
Diff Detail
- Repository
- rP Phabricator
- Branch
- conph-hurr-durr-column
- Lint
Lint Passed - Unit
Tests Passed - Build Status
Buildable 4839 Build 4855: [Placeholder Plan] Wait for 30 Seconds
Event Timeline
How does the ui indicating loading state now?
webroot/rsrc/css/application/conpherence/durable-column.css | ||
---|---|---|
167 | No worries |
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.
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.
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.
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.
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