Closed Bug 743230 Opened 12 years ago Closed 8 years ago

Visually identify the type of account

Categories

(MailNews Core :: Account Manager, enhancement)

enhancement
Not set
normal

Tracking

(Not tracked)

RESOLVED FIXED
Thunderbird 51.0

People

(Reporter: jb, Assigned: aceman)

References

(Blocks 1 open bug)

Details

(Keywords: uiwanted, ux-efficiency)

Attachments

(1 file, 7 obsolete files)

With the addition of Chat accounts, the account settings panel is becoming crowded and it becomes hard to quickly identify the account you're looking for. I propose we add an 'account type' icon to the account name listed in the account list. We could then have a series of icons used for : email, local folders, news, and every chat network currently supported (irc, gTalk, Facebook & Twitter)
Severity: normal → enhancement
This could be interesting. I am not sure there can be icons in the account list. But they would have to be very small. Bwinton, what do you think. Is there any ready set of icons to use?
Maybe icons would be overkill but some kind of prefix/postfix string would be in order (tree-item::after{ content "xxx"}).

Like "POP", "IMAP", "RSS", "IM", "NONE", "NEWS" , basically what server.type returns ...

Would Seamonkey like this too?
I'm not a fan of the prefix or postfix string idea.  In fact, looking at it, I'm now annoyed that I can't change the name of the Twitter account…

Icons seems reasonable to me, if we can add them to the list, but given that the user can name the accounts whatever they want, I would also be okay with leaving this the way it is.

Thanks,
Blake.
(In reply to :aceman from comment #2)
> Maybe icons would be overkill but some kind of prefix/postfix string would
> be in order (tree-item::after{ content "xxx"}).
> 
> Like "POP", "IMAP", "RSS", "IM", "NONE", "NEWS" , basically what server.type
> returns ...
> 
> Would Seamonkey like this too?

Best person to ask would be Karsten.
Assignee: nobody → acelists
Version: 13 → Trunk
Paenglab, would this be doable? It seems to me RSS, News, Local folders already have specific icons in the folder pane. Those could be used in the account manager too. Could you help me which properties to emit in <tree id="accounttree"> ?

Then we just need to make differing icons for IMAP and POP (currently the white envelope). I'd suggest keeping the envelope but maybe adding some small indication for online/offline (IMAP/POP). But we already have an envelope with a lock for SSL connected accounts. So it could get crowded.
Assignee: acelists → nobody
Flags: needinfo?(richard.marti)
(In reply to :aceman from comment #5)
> Paenglab, would this be doable? It seems to me RSS, News, Local folders
> already have specific icons in the folder pane. Those could be used in the
> account manager too. Could you help me which properties to emit in <tree
> id="accounttree"> ?

I think we could use the same properties as in the folderPane like serverType-none, serverType-pop3, serverType-imap, etc. For the different chat protocols we have already the needed icons in https://dxr.mozilla.org/comm-central/source/chat/protocols.

> Then we just need to make differing icons for IMAP and POP (currently the
> white envelope). I'd suggest keeping the envelope but maybe adding some
> small indication for online/offline (IMAP/POP). But we already have an
> envelope with a lock for SSL connected accounts. So it could get crowded.

We shouldn't show different icons depending the security. The icon should only show the base type. This said, it would not be crowded with a small indication on the same base icon.
Flags: needinfo?(richard.marti)
(In reply to Richard Marti (:Paenglab) from comment #6)
> We shouldn't show different icons depending the security. The icon should
> only show the base type. This said, it would not be crowded with a small
> indication on the same base icon.

I wanted to imply that we then could use the same new icons in folder pane where we do show the lock for security. Then there would be 2 indications on top of the envelope.
Attached patch WIP patch (obsolete) — Splinter Review
This is a preliminary patch to test the implementation of just linking the existing css rules in folderpane.css and use the icons in the account manager.

I see at least these problems:
1. All the account names are now bold (not only the default account). It is not that ugly, maybe we could keep that and mark default account in another way than bold font.
2. We need to distinguish POP3 and IMAP, as already said.
3. We need a generic icon for IM accounts.
4. We could have icons for specific IM protocols, but in some other way than hardcoding them in folderpane.css (where they are not needed). Maybe IM could maintain a css file for them that AM would just include.
Flags: needinfo?(richard.marti)
Flags: needinfo?(aleth)
5. decide if we want an icon for the SMTP line.

Paenglab, if you make some icons or changes to folderpane.css please make it as a separate patch so you can get the credit :)
Actually the original report does not request distinguishing POP and IMAP, but if we can find some nice icons cheaply, it could be nice. On the other hand it mentions specific icons for IM protocols.
Attached patch 743230-css.patch (obsolete) — Splinter Review
Simple additional patch with new SMTP icons and rules to show them.
I added an indentation for the sub-tree elements to align them with the server text. Not yet sure if I like it.

(In reply to :aceman from comment #8)
> Created attachment 8776175 [details] [diff] [review]
> WIP patch
> 
> This is a preliminary patch to test the implementation of just linking the
> existing css rules in folderpane.css and use the icons in the account
> manager.
> 
> I see at least these problems:
> 1. All the account names are now bold (not only the default account). It is
> not that ugly, maybe we could keep that and mark default account in another
> way than bold font.

I like it. This helps to differentiate the servers. I've underlined now the default server.

> 2. We need to distinguish POP3 and IMAP, as already said.

I'm tending more to not distinguish. For the user it's a mail server, what protocol it uses doesn't interests him a lot. It's more important to distinguish between mail, news, RSS etc.

Already in the folderPane it's too much detail if the server is secure or not for the user. He wants to work with his messages and doesn't care about such details.
Flags: needinfo?(richard.marti)
(In reply to Richard Marti (:Paenglab) from comment #11)
> > I see at least these problems:
> > 1. All the account names are now bold (not only the default account). It is
> > not that ugly, maybe we could keep that and mark default account in another
> > way than bold font.
> 
> I like it. This helps to differentiate the servers. I've underlined now the
> default server.

I would agree. The default account is always on top so together with underlining it should be fine. Only if the user changes the default account the underlining will move in the tree.

> > 2. We need to distinguish POP3 and IMAP, as already said.
> 
> I'm tending more to not distinguish. For the user it's a mail server, what
> protocol it uses doesn't interests him a lot. It's more important to
> distinguish between mail, news, RSS etc.
> 
> Already in the folderPane it's too much detail if the server is secure or
> not for the user. He wants to work with his messages and doesn't care about
> such details.

I'm fine with that.
Attached patch WIP patch v2 (obsolete) — Splinter Review
This solves points 3. and 4. (IM icons). This is a proof of concept how it would look like. I tried all available base chat accounts. The JS-test type intentionally gets the generic IM icon. That one would hopefully apply also to addon added types.

I had to increase the width of the account tree to accommodate the icons and bold font. But we do not have much space there as some people want to run the AM window in 800x600 screens...

Open issues:
6. I ask aleth to look if this is acceptable solution or if there is some better one. The css governing the IM icons is intentionally placed in mail/components/im/themes (on somewhere in mail/themes/...) so that it can be updated when IM adds new types.
7. After 6. is solved, we need to check how it behaves on Seamonkey, which may not have the IM css file.
Assignee: nobody → acelists
Attachment #8776175 - Attachment is obsolete: true
Status: NEW → ASSIGNED
Attachment #8776279 - Flags: ui-review?(richard.marti)
Attachment #8776279 - Flags: feedback?(aleth)
Comment on attachment 8776275 [details] [diff] [review]
743230-css.patch

Review of attachment 8776275 [details] [diff] [review]:
-----------------------------------------------------------------

I like this.
Attachment #8776275 - Flags: review+
Attached patch WIP patch v2.1 (obsolete) — Splinter Review
Added missing theme changes for Win and OSX.
Attachment #8776279 - Attachment is obsolete: true
Attachment #8776279 - Flags: ui-review?(richard.marti)
Attachment #8776279 - Flags: feedback?(aleth)
Attachment #8776281 - Flags: ui-review?(richard.marti)
Attachment #8776281 - Flags: feedback?(aleth)
Attached patch 743230-css.patch (obsolete) — Splinter Review
The Win Vista-10 SMTP server icon wasn't good visible. This should be better.
Attachment #8776275 - Attachment is obsolete: true
Attachment #8776290 - Flags: review+
Comment on attachment 8776281 [details] [diff] [review]
WIP patch v2.1

Your changes are looking good. Thank you.
Attachment #8776281 - Flags: ui-review?(richard.marti) → ui-review+
Comment on attachment 8776281 [details] [diff] [review]
WIP patch v2.1

Review of attachment 8776281 [details] [diff] [review]:
-----------------------------------------------------------------

::: mailnews/base/prefs/content/AccountManager.js
@@ +1616,5 @@
> +                                 server.wrappedJSObject.imAccount.protocol.normalizedName :
> +                                 server.wrappedJSObject.imAccount.protocol.name);
> +        }
> +        treecell.setAttribute("properties", "folderNameCol isServer-true" +
> +                              " serverType-" + server.type + extraProps);

As you are already accessing the imAccount properties to set the "properties" attribute here anyway, why not just have a generic CSS rule for im as a fallback and then do treecell.setAttribute("src", ...) here for the icon? Seems better than hardcoding the paths in CSS.
Attachment #8776281 - Flags: feedback?(aleth)
Flags: needinfo?(aleth)
Attached patch 743230-css.patch (obsolete) — Splinter Review
The old patch had wrong -moz-image-region for the HiDPI OS X server.
Attachment #8776290 - Attachment is obsolete: true
Attachment #8776726 - Flags: review+
(In reply to Richard Marti (:Paenglab) from comment #11)
> Simple additional patch with new SMTP icons and rules to show them.
> I added an indentation for the sub-tree elements to align them with the
> server text. Not yet sure if I like it.

Yes, it feels a bit strange, main accounts and also subpanels at the same indent. I'd like width:1ch for the indent.
Attached patch patch v3 (obsolete) — Splinter Review
This is a merged patch with all the changes.

Aleth, is this what you meant? Does any protocol always implement .iconBaseURI ? Or should I better check the property exists (so it does not throw or something)?

Ratty, please see if this works for Seamonkey. It should mostly work. If there are no IM accounts in SM, no IM icons need to be handled. But all other accounts should get nice icons from folderpane.css. Only the new SMTP icon is not added in this patch. So the SMTP row in AM should get a generic envelope icon. Is that fine for SM, or can somebody provide icons and css rules for SMTP?
Attachment #8776281 - Attachment is obsolete: true
Attachment #8776726 - Attachment is obsolete: true
Attachment #8777048 - Flags: ui-review?(richard.marti)
Attachment #8777048 - Flags: review?(philip.chee)
Attachment #8777048 - Flags: feedback?(aleth)
Comment on attachment 8777048 [details] [diff] [review]
patch v3

Review of attachment 8777048 [details] [diff] [review]:
-----------------------------------------------------------------

::: mailnews/base/prefs/content/AccountManager.js
@@ +1614,5 @@
> +                              " serverType-" + server.type);
> +        // For IM accounts, we can try to fetch a protocol specific icon.
> +        if (server.type == "im") {
> +          treecell.setAttribute("src", server.wrappedJSObject.imAccount
> +                                             .protocol.iconBaseURI + "icon.png");

This looks much cleaner :)

Yes, the iconBaseURI should always exist.
Attachment #8777048 - Flags: feedback?(aleth) → feedback+
Attachment #8777048 - Flags: ui-review?(richard.marti) → ui-review+
Attached patch patch v3.1Splinter Review
This adds the missing css changes for SM.
Attachment #8777048 - Attachment is obsolete: true
Attachment #8777048 - Flags: review?(philip.chee)
Attachment #8777065 - Flags: review?(philip.chee)
Attachment #8777065 - Flags: review?(mkmelin+mozilla)
Comment on attachment 8777065 [details] [diff] [review]
patch v3.1

> +++ b/mailnews/base/prefs/content/AccountManager.xul
.... 
> +<?xml-stylesheet href="chrome://messenger/skin/folderPane.css" type="text/css"?>
What does this line do?

> +treechildren::-moz-tree-image(folderNameCol, isServer-true, serverType-smtp) {
> +  list-style-image: url("chrome://messenger/skin/icons/server.png");
> +  -moz-image-region: rect(16px 64px 32px 48px);
Does SeaMonkey need this?
Flags: needinfo?(acelists)
(In reply to Philip Chee from comment #24)
> > +++ b/mailnews/base/prefs/content/AccountManager.xul
> .... 
> > +<?xml-stylesheet href="chrome://messenger/skin/folderPane.css" type="text/css"?>
> What does this line do?

As said, folderPane.css should contain the definitions of where to pull icons for various server types. E.g.
treechildren::-moz-tree-image(folderNameCol, isServer-true, serverType-nntp) {
  list-style-image: url("chrome://messenger/skin/icons/server-news.gif");
}

> > +treechildren::-moz-tree-image(folderNameCol, isServer-true, serverType-smtp) {
> > +  list-style-image: url("chrome://messenger/skin/icons/server.png");
> > +  -moz-image-region: rect(16px 64px 32px 48px);
> Does SeaMonkey need this?

It would need it if somebody adds the needed SMTP icon to the server.png file. Or, as said, SM can ignore (not add) this and just get a generic envelope icon, the same as POP3/IMAP4 servers.
Flags: needinfo?(acelists)
Blocks: 1293336
Comment on attachment 8777065 [details] [diff] [review]
patch v3.1

rs=me
Attachment #8777065 - Flags: review?(philip.chee) → review+
Comment on attachment 8777065 [details] [diff] [review]
patch v3.1

Review of attachment 8777065 [details] [diff] [review]:
-----------------------------------------------------------------

LGTM, r=mkmelin
Attachment #8777065 - Flags: review?(mkmelin+mozilla) → review+
https://hg.mozilla.org/comm-central/rev/8a95cabba4f90102fff3c264336b96de24f7fba1
Status: ASSIGNED → RESOLVED
Closed: 8 years ago
Product: Thunderbird → MailNews Core
Resolution: --- → FIXED
Target Milestone: --- → Thunderbird 51.0
You need to log in before you can comment on or make changes to this bug.

Attachment

General

Creator:
Created:
Updated:
Size: