571476 - tbpl UI redesign

Status: RESOLVED FIXED

(Tree Management Graveyard :: TBPL, defect)

Description

[Arpad Borsos [:Swatinem]]

Attachment: patch

I have ported the UI redesign I have made for tbpl-server to the normal version, changes include:
- bar on top includes a list of failing builds, no more "matrix"
- results bar on bottom is split up better, only shown when a result is active
(will upload screenshot)

Comment 1

[Arpad Borsos [:Swatinem]]

Attachment: screenshot of changes

This screenshot should contain all the visible changes, feedback appreciated.

Comment 2

[Markus Stange [:mstange]]

I haven't looked at the patch yet, but in the screenshot it looks like you're decreasing the font-size - are you? If you are, please don't do that, I like it the way it is :)

The rest looks good. Good to see the status table go; it becoming uncontrollably wider with every new OS was annoying.

Comment 3

[Arpad Borsos [:Swatinem]]

I've decreased my browser-wide default font-size :)
It fits with a default size of 16px as well, just the "add comment" link "disappears" (the page gets a scrollbar) when the machine name wraps to the next line.
Also, I see that I could have used Config.OSNames for the tooltip, I will fix that when landing.

Comment 4

[(no longer active)]

Could the failing jobs list at the top be annotated with OS icons, so that you can immediately know the OS without hovering them?  Here's what I'm thinking about:

+---+
| W |
+---+

Where W is the icon for Linux, Mac or Windows.  We could even add a 64 to the icon for x86-64 versions.

Could we make the summary and star boxes translucent, like the Add Comment UI?

I really don't think that the "Firefox is 97% GREEN" line is useful.  It's kind of cool, but it doesn't really convey any useful information.  I'd very much rather see the sheriff name or tree status in place of it, for example!

Also, I think that the lower right corner of the window is empty for no good reason.  We could use it for useful information, for example, the star information (instead of putting them in the current yellow box).

But overall this really looks nice, so feel free to defer all my suggestions to their own bugs (I'm even willing to write the patches to make them happen!)

Comment 5

[Arpad Borsos [:Swatinem]]

(In reply to comment #4)
> Could the failing jobs list at the top be annotated with OS icons, so that you
> can immediately know the OS without hovering them?  Here's what I'm thinking
> about:
> 
> +---+
> | W |
> +---+
> 
> Where W is the icon for Linux, Mac or Windows.  We could even add a 64 to the
> icon for x86-64 versions.

That would be a nice followup, indeed.

> Could we make the summary and star boxes translucent, like the Add Comment UI?

Done.

> I really don't think that the "Firefox is 97% GREEN" line is useful.  It's kind
> of cool, but it doesn't really convey any useful information.  I'd very much
> rather see the sheriff name or tree status in place of it, for example!

I have planned the middle top for that, once we have server integration where the loading indicator can go away. Right now there is no way to get to that information :/

> Also, I think that the lower right corner of the window is empty for no good
> reason.  We could use it for useful information, for example, the star
> information (instead of putting them in the current yellow box).

Indeed, it looks empty for "normal" jobs, one of the talos jobs however outputs a lot of results for which the place is needed.

Comment 6

[Markus Stange [:mstange]]

Comment on attachment 450631 [details] [diff] [review]
patch

(In reply to comment #5)
> > I really don't think that the "Firefox is 97% GREEN" line is useful.  It's kind
> > of cool, but it doesn't really convey any useful information.

I agree.

> >  I'd very much
> > rather see the sheriff name or tree status in place of it, for example!
> 
> I have planned the middle top for that, once we have server integration where
> the loading indicator can go away. Right now there is no way to get to that
> information :/

?
Bug 540464 shows how to get the sheriff.

For the tree status we would have to load the whole Tinderbox page, so that's really not viable without server caching.
(The "closed tree" push hook does it - see http://hg.mozilla.org/hgcustom/hghooks/file/tip/mozhghooks/treeclosure.py - and now I have no idea how pushing can be as fast as it is...)

Arpad, when you're done with the styling changes, just push them to the main repo and I'll try them out and adapt as I see fit. I don't find reviewing CSS in form of a diff very enlightening.

Comment 7

[(no longer active)]

(In reply to comment #5)
> (In reply to comment #4)
> > Could the failing jobs list at the top be annotated with OS icons, so that you
> > can immediately know the OS without hovering them?  Here's what I'm thinking
> > about:
> > 
> > +---+
> > | W |
> > +---+
> > 
> > Where W is the icon for Linux, Mac or Windows.  We could even add a 64 to the
> > icon for x86-64 versions.
> 
> That would be a nice followup, indeed.

Filed bug 571718.

> > I really don't think that the "Firefox is 97% GREEN" line is useful.  It's kind
> > of cool, but it doesn't really convey any useful information.  I'd very much
> > rather see the sheriff name or tree status in place of it, for example!
> 
> I have planned the middle top for that, once we have server integration where
> the loading indicator can go away. Right now there is no way to get to that
> information :/

If you load the source of the current tinderbox page, there is some JS code which loads the current sheriff and releng contact at the top of the Tinderbox page (search for current-sheriff or current-releng in that page).  That code seems much better to me that the one in bug 540464.

> > Also, I think that the lower right corner of the window is empty for no good
> > reason.  We could use it for useful information, for example, the star
> > information (instead of putting them in the current yellow box).
> 
> Indeed, it looks empty for "normal" jobs, one of the talos jobs however outputs
> a lot of results for which the place is needed.

Oh, OK, good point.

(In reply to comment #6)
> (From update of attachment 450631 [details] [diff] [review])
> (In reply to comment #5)
> > > I really don't think that the "Firefox is 97% GREEN" line is useful.  It's kind
> > > of cool, but it doesn't really convey any useful information.
> 
> I agree.
> 
> > >  I'd very much
> > > rather see the sheriff name or tree status in place of it, for example!
> > 
> > I have planned the middle top for that, once we have server integration where
> > the loading indicator can go away. Right now there is no way to get to that
> > information :/
> 
> ?
> Bug 540464 shows how to get the sheriff.
> 
> For the tree status we would have to load the whole Tinderbox page, so that's
> really not viable without server caching.
> (The "closed tree" push hook does it - see
> http://hg.mozilla.org/hgcustom/hghooks/file/tip/mozhghooks/treeclosure.py - and
> now I have no idea how pushing can be as fast as it is...)

There's a much better way!  :-)

http://tinderbox.mozilla.org/admintree.cgi?tree=Firefox

We can get smart about caching it on the server, but even loading that page on the client side is probably fast enough for starters!

> Arpad, when you're done with the styling changes, just push them to the main
> repo and I'll try them out and adapt as I see fit. I don't find reviewing CSS
> in form of a diff very enlightening.

Reviewing CSS in any form is not very enlightening!  ;-)

Comment 8

[(no longer active)]

(In reply to comment #7)
> (In reply to comment #5)
> > (In reply to comment #4)
> > > Could the failing jobs list at the top be annotated with OS icons, so that you
> > > can immediately know the OS without hovering them?  Here's what I'm thinking
> > > about:
> > > 
> > > +---+
> > > | W |
> > > +---+
> > > 
> > > Where W is the icon for Linux, Mac or Windows.  We could even add a 64 to the
> > > icon for x86-64 versions.
> > 
> > That would be a nice followup, indeed.
> 
> Filed bug 571718.
> 
> > > I really don't think that the "Firefox is 97% GREEN" line is useful.  It's kind
> > > of cool, but it doesn't really convey any useful information.  I'd very much
> > > rather see the sheriff name or tree status in place of it, for example!
> > 
> > I have planned the middle top for that, once we have server integration where
> > the loading indicator can go away. Right now there is no way to get to that
> > information :/
> 
> If you load the source of the current tinderbox page, there is some JS code
> which loads the current sheriff and releng contact at the top of the Tinderbox
> page (search for current-sheriff or current-releng in that page).  That code
> seems much better to me that the one in bug 540464.

Actually, I'm going to shut my mouth on this:

<http://www.google.com/calendar/feeds/[e-mail]/public/full?orderby=starttime&sortorder=ascending&futureevents=true&singleevents=true&max-results=1&alt=json>

(see bug 540464 comment 2.)

Comment 9

[(no longer active)]

One very big flaw here is that we no longer show an indication of whether a log is showing in the background.  This can mislead people, and I think it definitely needs to be fixed before we can deploy this to the live site.

Comment 10

[(no longer active)]

Actually, I just saw those notifications!  Ignore my comment 9!

Comment 11

[Markus Stange [:mstange]]

Excuse me, what log and what notifications? I'm confused.

Arpad, sorry for taking so long, but the other things I'm working on have higher priority at the moment.

Comment 12

[(no longer active)]

(In reply to comment #11)
> Excuse me, what log and what notifications? I'm confused.

By log, I meant the job summary as loaded by SummaryLoader.js.  By notification, I meant the loading message and the throbber that we show in the UI.

Comment 13

[Markus Stange [:mstange]]

Oh, I didn't even notice that before! That's cool!

I finally deployed this after I made some minor changes. Sorry for the long lag.