How to tweak styles in thread pane

classic Classic list List threaded Threaded
14 messages Options
Reply | Threaded
Open this post in threaded view
|

How to tweak styles in thread pane

Jonathan Kamens-4
I am thinking about writing a Thunderbird add-on which will
change how the rows for individual messages are displayed in
the thread pane based on the content of their "Priority"
headers.

I know that I can create a filter to automatically tag
incoming messages, but I don't think that's the right solution
for various resaons I could describe in detail if it weren't
beside the point.

Anyway, I spent some time digging around the source code and
developer.mozilla.org and simply couldn't get a handle on
what I would need to do to change how individual rows are
styled in the thread pane.

If you have any pointers to documentation, sample code, etc.
that would set me on the right track, I'd really appreciate
it.

Alternatively, if there's already an add-on which does this
which I haven't managed to stumble across, feel free to tell
me that instead. :-)

Thanks,

jik
_______________________________________________
dev-apps-thunderbird mailing list
[hidden email]
https://lists.mozilla.org/listinfo/dev-apps-thunderbird
Reply | Threaded
Open this post in threaded view
|

Re: How to tweak styles in thread pane

Jim-267
On 04/18/2012 08:17 PM, Jonathan Kamens wrote:
> I am thinking about writing a Thunderbird add-on which will
> change how the rows for individual messages are displayed in
> the thread pane based on the content of their "Priority"
> headers.
[snip]
> Anyway, I spent some time digging around the source code and
> developer.mozilla.org and simply couldn't get a handle on
> what I would need to do to change how individual rows are
> styled in the thread pane.

I assume you're at least familiar with how tags are styled[1], right?
Those CSS rules correspond to the properties for the row, which are also
accessible from Javascript[2]. Thunderbird also lets you create a custom
column handler[3] that, among other things, can supply the treeview with
extra properties[4].

Hopefully this should be sufficient to get you started.

- Jim

[1]
http://mxr.mozilla.org/comm-central/source/mail/themes/qute/mail/tagColors.css
[2]
https://developer.mozilla.org/en/XPCOM_Interface_Reference/nsITreeView#getRowProperties%28%29
[3]
https://developer.mozilla.org/en/XPCOM_Interface_Reference/nsIMsgCustomColumnHandler
[4]
http://mxr.mozilla.org/comm-central/source/mailnews/base/src/nsMsgDBView.cpp#1470
_______________________________________________
dev-apps-thunderbird mailing list
[hidden email]
https://lists.mozilla.org/listinfo/dev-apps-thunderbird
Reply | Threaded
Open this post in threaded view
|

Re: How to tweak styles in thread pane

Ron K.
In reply to this post by Jonathan Kamens-4
Jonathan Kamens on 4/18/2012 9:17 PM, keyboarded a reply:

> I am thinking about writing a Thunderbird add-on which will
> change how the rows for individual messages are displayed in
> the thread pane based on the content of their "Priority"
> headers.
>
> I know that I can create a filter to automatically tag
> incoming messages, but I don't think that's the right solution
> for various resaons I could describe in detail if it weren't
> beside the point.
>
> Anyway, I spent some time digging around the source code and
> developer.mozilla.org and simply couldn't get a handle on
> what I would need to do to change how individual rows are
> styled in the thread pane.
>
> If you have any pointers to documentation, sample code, etc.
> that would set me on the right track, I'd really appreciate
> it.
>
> Alternatively, if there's already an add-on which does this
> which I haven't managed to stumble across, feel free to tell
> me that instead. :-)
>
> Thanks,
>
> jik


Did You look at the Label code. When it was introduced it allowed coloring
of row text according to one of five descriptions. The prefs still remain
in prefs.js for setting the colors and descriptions. However the UI for
there use is gone now, superseded by the Tags feature which is more
flexible and extensive. Get a TB 2.0.xx build to see the old feature in
action.

--
Ron K.
Who is General Failure, and why is he searching my HDD?
Kernel Restore reported Major Error used BSOD to msg the enemy!
_______________________________________________
dev-apps-thunderbird mailing list
[hidden email]
https://lists.mozilla.org/listinfo/dev-apps-thunderbird
Reply | Threaded
Open this post in threaded view
|

Re: How to tweak styles in thread pane

Neil-4
In reply to this post by Jonathan Kamens-4
Jonathan Kamens wrote:

>I am thinking about writing a Thunderbird add-on which will change how the rows for individual messages are displayed in the thread pane based on the content of their "Priority" headers.
>
>I know that I can create a filter to automatically tag incoming messages, but I don't think that's the right solution for various resaons I could describe in detail if it weren't beside the point.
>
>Anyway, I spent some time digging around the source code and developer.mozilla.org and simply couldn't get a handle on what I would need to do to change how individual rows are styled in the thread pane.
>
>If you have any pointers to documentation, sample code, etc. that would set me on the right track, I'd really appreciate it.
>  
>
This is how priority colours were implemented prior to the label
feature, which itself predated the tags feature:
http://mxr.mozilla.org/comm-central/source/suite/themes/classic/messenger/threadPane.css#68
Note that if you want to set the background colour then you need to use
-moz-tree-row instead.
All you then have to do is to write your stylesheet and overlay the
three pane window.
As a bonus your extension will probably work in SeaMonkey as well as
Thunderbird, assuming you add the appropriate compatibility range.

>Alternatively, if there's already an add-on which does this which I haven't managed to stumble across, feel free to tell me that instead. :-)
>  
>
I'm surprised there isn't, but I haven't managed to stumble across one
either.

--
Warning: May contain traces of nuts.
_______________________________________________
dev-apps-thunderbird mailing list
[hidden email]
https://lists.mozilla.org/listinfo/dev-apps-thunderbird
Reply | Threaded
Open this post in threaded view
|

Re: How to tweak styles in thread pane

Jonathan Kamens-4
Thanks for the responses, everyone. I think I understand
things a little better now, but I still have some questions
for which I'm having trouble finding the answers myself.

In addition to the stuff referred to in your answers, I also
looked at this page:

https://developer.mozilla.org/en/XUL_Tutorial/Styling_a_Tree

I should mention that although I maintain four different TB
addons, none of them have had to deal with stylesheets, so
working with styles in Gecko / XUL is new to me. I confess I'm
finding it a bit confusing and complicated, but perhaps it'll
get easier when I get the hang of it.

From your answers, it seems to me that I want to create and
overlay a stylesheet which tells Thunderbird to color the text
of the cells in the treeview a certain color based on a
property indicating the priority of the message in that row.
For example, my stylesheet might have this in it:

treechildren::-moz-tree-cell-text(priority-highest) {
  color: red;
}

to indicate that highest-priority messages should show up in
red (or bold, or italic, or a larger font, whatever I decide
is appropriate, or perhaps even let the user customize the
styles).

Then, I need to put some code somewhere to set the appropriate
property on all the cells in the row based on the Priority
setting for the message represented by that row. Once the
property is added to the cells, they'll be colored
automatically based on the stylesheet.

But how do I get that code to execute? I don't think I can use
a custom column handler for all the existing thread pane
columns, because the columns already have column handlers, and
I don't think a column is allowed to have multiple handlers.
Am I right about all that?

I also don't think I can execute the code in the
getCellProperties of a view object as described in the
Styling_a_Tree page, because the thread view already has a
view object and I can't very well replace it with mine. Or
maybe I am indeed supposed to overload the view object,
allowing most calls into it to pass through into the original,
but intercepting getCellProperties calls to mess with them as
needed? That just doesn't seem right.

Here's another thing I don't understand... I see definitions
in this file that Jim referenced:

http://mxr.mozilla.org/comm-central/source/mail/themes/qute/mail/tagColors.css

that look like this:

treechildren::-moz-tree-cell-text(lc-FFFFFF), .lc-FFFFFF:not([_moz-menuactive]) {
  color: #FFFFFF
}
treechildren::-moz-tree-row(lc-FFFFFF, selected, focus), .blc-FFFFFF {
  background-color: #FFFFFF;
}
.blc-FFFFFF {
  border-color: #FFFFFF;
}

If I understand this correctly, what it's saying is that when
a particular row is selected, it should have a background
color as indicated (that's the ".blc-FFFFFF"), but when it's
not selected, it should have that as the text color instead
of the background color (that's the ".lc-FFFFFF").

So I then went searching to find out what adds the .blc-* and
.lc-* properties to the cells, and for the life of me I can't
find it. I found code which seems to build the tag menus, and
which seems to build the tags column value, but for the life
of me I can't find the code which styles the rows themselves
based on their tag values.

Oh, and one more question which is probably more general than
the others... If I do decide to let the add-on user customize
the styles for the different priority values, then I guess
I'm going to have to overlay the thread view with dynamically
generated styles. Is that possible?

I know this is a lot of questions. I feel like I'm sort of
asking you all to do the work of writing the add-on for me,
for which I apologize. On the bright side, once I get it
written, I'll be the one maintaining it. :-) I don't want to
impose on, but if any of you feel like helping me out with
another push or two in the right direction, I'd be much
obliged.
_______________________________________________
dev-apps-thunderbird mailing list
[hidden email]
https://lists.mozilla.org/listinfo/dev-apps-thunderbird
Reply | Threaded
Open this post in threaded view
|

Re: How to tweak styles in thread pane

Jim-267
On 04/19/2012 08:09 PM, Jonathan Kamens wrote:
> Then, I need to put some code somewhere to set the appropriate
> property on all the cells in the row based on the Priority
> setting for the message represented by that row. Once the
> property is added to the cells, they'll be colored
> automatically based on the stylesheet.

Assuming you're on a build with the macro SUPPORT_PRIORITY_COLORS set,
you won't need to do that, and could just use the CSS that Neil linked
to. Since the chances of that being the case are pretty slim, you'll
have to add a custom column handler. (See below.)

> But how do I get that code to execute? I don't think I can use
> a custom column handler for all the existing thread pane
> columns, because the columns already have column handlers, and
> I don't think a column is allowed to have multiple handlers.
> Am I right about all that?

You aren't right, I'm afraid. You can add additional custom column
handlers to existing columns, and everything should work just fine
(though I think sorting on that column can't be overridden). For an
example of doing this, here's some code that overrides the text in the
"Size" column:
<https://bitbucket.org/squib/size-in-kb/src/b97b019c2e46/chrome/content/overlay.js>.

I can't actually *guarantee* that setting properties using a column
handler like this, since I've never actually tried it, but I see no
reason why it wouldn't work.

> I also don't think I can execute the code in the
> getCellProperties of a view object as described in the
> Styling_a_Tree page...

I don't think you'll need to do that.

> Here's another thing I don't understand... I see definitions
> in this file that Jim referenced:
>
> http://mxr.mozilla.org/comm-central/source/mail/themes/qute/mail/tagColors.css
>
> that look like this:
>
> treechildren::-moz-tree-cell-text(lc-FFFFFF), .lc-FFFFFF:not([_moz-menuactive]) {
>    color: #FFFFFF
> }
> treechildren::-moz-tree-row(lc-FFFFFF, selected, focus), .blc-FFFFFF {
>    background-color: #FFFFFF;
> }
> .blc-FFFFFF {
>    border-color: #FFFFFF;
> }
>
> If I understand this correctly, what it's saying is that when
> a particular row is selected, it should have a background
> color as indicated (that's the ".blc-FFFFFF"), but when it's
> not selected, it should have that as the text color instead
> of the background color (that's the ".lc-FFFFFF").

.lc-FFFFFF is a class set on the menu items for the Tag button.
.blc-FFFFFF is a class set in the message header (and multi-message
summary) for the Tags field. The CSS you should care about is
treechildren::-moz-tree-row(lc-FFFFFF). (If there are multiple
comma-separated names in the -moz-tree-row directive, those are ANDed
together for the selector.)

> So I then went searching to find out what adds the .blc-* and
> .lc-* properties to the cells, and for the life of me I can't
> find it.

The code you want is here (AppendKeywordProperties):
<http://mxr.mozilla.org/comm-central/source/mailnews/base/src/nsMsgDBView.cpp#356>.

> Oh, and one more question which is probably more general than
> the others... If I do decide to let the add-on user customize
> the styles for the different priority values, then I guess
> I'm going to have to overlay the thread view with dynamically
> generated styles. Is that possible?

Should be, though it might be a pain. I assume this is what QuoteColors
does. You could check out that code, since it's licensed under the MPL
according to the AMO page:
<https://addons.mozilla.org/en-US/thunderbird/addon/quote-colors/>.

- Jim
_______________________________________________
dev-apps-thunderbird mailing list
[hidden email]
https://lists.mozilla.org/listinfo/dev-apps-thunderbird
Reply | Threaded
Open this post in threaded view
|

Re: How to tweak styles in thread pane

Neil-4
Jim wrote:

> On 04/19/2012 08:09 PM, Jonathan Kamens wrote:
>
>> Then, I need to put some code somewhere to set the appropriate
>> property on all the cells in the row based on the Priority setting
>> for the message represented by that row. Once the property is added
>> to the cells, they'll be colored automatically based on the stylesheet.
>
> Assuming you're on a build with the macro SUPPORT_PRIORITY_COLORS set,
> you won't need to do that, and could just use the CSS that Neil linked
> to. Since the chances of that being the case are pretty slim, you'll
> have to add a custom column handler.

Bah. Maybe we should turn on that support, just so that people can add
the theming for it?

--
Warning: May contain traces of nuts.
_______________________________________________
dev-apps-thunderbird mailing list
[hidden email]
https://lists.mozilla.org/listinfo/dev-apps-thunderbird
Reply | Threaded
Open this post in threaded view
|

Re: How to tweak styles in thread pane

Jim-267
On 04/21/2012 01:10 PM, Neil wrote:
> Jim wrote:
>> Assuming you're on a build with the macro SUPPORT_PRIORITY_COLORS set,
>> you won't need to do that, and could just use the CSS that Neil linked
>> to. Since the chances of that being the case are pretty slim, you'll
>> have to add a custom column handler.
>
> Bah. Maybe we should turn on that support, just so that people can add
> the theming for it?

Seems reasonable to me. I can't imagine that there's a significant
performance hit for returning those properties.

- Jim
_______________________________________________
dev-apps-thunderbird mailing list
[hidden email]
https://lists.mozilla.org/listinfo/dev-apps-thunderbird
Reply | Threaded
Open this post in threaded view
|

Re: How to tweak styles in thread pane

Jonathan Kamens-4
In reply to this post by Jim-267
Jim <[hidden email]> writes:

>On 04/19/2012 08:09 PM, Jonathan Kamens wrote:
>> But how do I get that code to execute? I don't think I can use
>> a custom column handler for all the existing thread pane
>> columns, because the columns already have column handlers, and
>> I don't think a column is allowed to have multiple handlers.
>> Am I right about all that?
>
>You aren't right, I'm afraid. You can add additional custom column
>handlers to existing columns, and everything should work just fine
>(though I think sorting on that column can't be overridden). For an
>example of doing this, here's some code that overrides the text in the
>"Size" column:
><https://bitbucket.org/squib/size-in-kb/src/b97b019c2e46/chrome/content/overlay.js>.

The example code you gave is not actually an example of what
I am trying to do, and when I try to do what I am trying to
do, it doesn't appear to be working. Let me clarify...

I want to add additional properties to every other cell on a
row with a message priority, but I don't want to override any
of the other attributes of that cell, most notably its text.
In fact, I don't know _how_ to generate the correct text for
all those other columns, so I _need_ the core code to do that.

The example you gave is in fact a complete column handler
which provides all of the data that the view needs to be able
to display the column properly, including the text of the
column.

When I try to add a column handler for, say, the Subject
column, what can I put in, for example, the getCellText method
of my column handler, to tell the view, "Even though this is a
custom column handler, you should fall through and use the
default behavior for this particular method."

When I return null from my getCellText, then all of the
subject columns in the view are blank. When I try adding a
column handler with no getCellText method at all, again the
subjects in the view are blank.

It doesn't do me any good to add row properties, which I could
do from my priorityCol column handler without messing with the
handlers of other columns, because I'm trying to change the
font style, size and opacity based on the priority of the
message, and those properties on the rows won't be inherited
by individual cells.

In short, I can't find a way to create a column handler which
adds cell properties without messing with any of the other
built-in behavior of the column.

If you know of a way to do that, I'm all ears.

Also, incidentally, from looking at the code for
nsMsgDBView::AddColumnHandler in nsMsgDBView.cpp, it appears
to me that a column can only have a single handler. If you add
a handler to a column that already has one, it appears to
replace it, rather than calling all of the handlers in some
sort of sequence. Am I reading that code wrong?

Thanks.
_______________________________________________
dev-apps-thunderbird mailing list
[hidden email]
https://lists.mozilla.org/listinfo/dev-apps-thunderbird
Reply | Threaded
Open this post in threaded view
|

Re: How to tweak styles in thread pane

Jonathan Kamens-4
In reply to this post by Jim-267
I think defining SUPPORT_PRIORITY_COLORS would obviate the
need for me to figure out the answer to the question I just
posted in my other message, because my CSS could simply use
the "priority-highest", etc. properties instead of having to
add my own to every cell.

But I'm still curious about the question I posted: is there in
fact a way for an extension to tweak the properties on cells
in the thread pane without otherwise specifying how those
cells should be displayed, instead relying on the built-in
display behavior for them?

If there isn't, then I guess I'll just need to wait for
SUPPORT_PRIORITY_COLORS to be defined in a production release
of Thunderbird before I can fully implement the functionality
I want in my add-on. Jim, do I need to do anything to make
that idea move forward, or are you going to run with it? Even
if you checked in the change today, it would be, what, like
three months before it was released?

Thanks.
_______________________________________________
dev-apps-thunderbird mailing list
[hidden email]
https://lists.mozilla.org/listinfo/dev-apps-thunderbird
Reply | Threaded
Open this post in threaded view
|

Re: How to tweak styles in thread pane

Jim-267
In reply to this post by Jonathan Kamens-4
On 04/21/2012 09:44 PM, Jonathan Kamens wrote:
> When I try to add a column handler for, say, the Subject
> column, what can I put in, for example, the getCellText method
> of my column handler, to tell the view, "Even though this is a
> custom column handler, you should fall through and use the
> default behavior for this particular method."

nsIMsgDBView.cellTextForColumn should do that.

> It doesn't do me any good to add row properties, which I could
> do from my priorityCol column handler without messing with the
> handlers of other columns, because I'm trying to change the
> font style, size and opacity based on the priority of the
> message, and those properties on the rows won't be inherited
> by individual cells.

getCellProperties is also a method on nsIMsgCustomColumnHandler, so
you're ok there.

> In short, I can't find a way to create a column handler which
> adds cell properties without messing with any of the other
> built-in behavior of the column.
>
> If you know of a way to do that, I'm all ears.

getCellText looks like the only method you actually need to forward on
to the DB view, so you can ignore the others (you'd have to reimplement
cell cycling if you did this on a cell that cycled).

If you want to add the cell property to all cells in the row, you can
probably do that too, but you should check nsMsgDBView.cpp to be sure
that you don't need to forward anything else on to it. You can ignore
the cyclable columns though, since they don't have any text.

> Also, incidentally, from looking at the code for
> nsMsgDBView::AddColumnHandler in nsMsgDBView.cpp, it appears
> to me that a column can only have a single handler.

A single *custom* column handler; including the base column handler,
that's two handlers.

- Jim
_______________________________________________
dev-apps-thunderbird mailing list
[hidden email]
https://lists.mozilla.org/listinfo/dev-apps-thunderbird
Reply | Threaded
Open this post in threaded view
|

Re: How to tweak styles in thread pane

Jonathan Kamens
Jim <[hidden email]> writes:
>On 04/21/2012 09:44 PM, Jonathan Kamens wrote:
>> When I try to add a column handler for, say, the Subject
>> column, what can I put in, for example, the getCellText method
>> of my column handler, to tell the view, "Even though this is a
>> custom column handler, you should fall through and use the
>> default behavior for this particular method."
>
>nsIMsgDBView.cellTextForColumn should do that.

Yeah, I tried that last night but I got the syntax wrong -- I
passed in the column number instead of name.

And doing what you propose will break add-ons that add other
custom columns, such as the one you wrote whose example code
you posted.

I could add smarts to my column handler to check if there is
another one before adding my own, and automatically pass
through calls to the old one when mine runs, but that's truly
gross. Unavoidable, perhaps, but gross.

>getCellText looks like the only method you actually need to forward on
>to the DB view, so you can ignore the others

I'm not sure I agree with that. I'll lose GetImageSrc, at the
very least. And cell cycling, as you mentioned...

>(you'd have to reimplement
>cell cycling if you did this on a cell that cycled).
>...
>You can ignore
>the cyclable columns though, since they don't have any text.

And here's the crux of the thing... I can make this work only
if I hard-code knowledge in my add-on of which columns contain
text and aren't cycling, because I can only safely add a
column handler for columns that are text-only without cycling.

That means hard-coding knowledge of specific columns in my
add-on, which I don't want to do because that knowledge could
change from release to release.

It also means that I can't modify the formatting of custom
columns, because I have no way of knowing whether they have
text or are cycling columns.

And I don't think it's true that a cycling column can't have
text; that may be true of the standard columns that cycle,
but there's no reason why a text column couldn't cycle.

OK, stepping back for a minute, if I _am_ willing to
hard-code knowledge about the standard columns in my add-on,
then here's what I can do, I think...

* For columns that have column handlers (as determined by
  getColumnHandler):
  * Do nothing if isString returns false. Otherwise...
  * Store the old column handler somewhere.
  * Add my property as needed in getCellProperties.
  * Pass everything through to the old column handler.
* For columns that do not have column handlers:
  * If I don't recognize the column (either someone added a custom
    column without a column handler -- bad doggy! -- or there's a new
    column my add-on doesn't know about), do nothing. Otherwise...
  * If it's a non-text or cycling cell, do nothing. Otherwise...
  * Call gDBView.cellTextForColumn to get text to return.
  * Add my property as needed in getCellProperties.

I think that will work well enough, but good golly it's gross. I think
the API would benefit from an enhancement here: allow any number of
"column property handlers" to be associated with each column, in
addition to regular column handles. These column property handlers
would have their getCellProperties and getRowProperties, but none of
their other methods, invoked for each cell / row. This API enhancement
would make the API support out-of-the-box what I am forced to kludge
together as described above. What do you think?
_______________________________________________
dev-apps-thunderbird mailing list
[hidden email]
https://lists.mozilla.org/listinfo/dev-apps-thunderbird
Reply | Threaded
Open this post in threaded view
|

Re: How to tweak styles in thread pane

Neil-4
Jonathan Kamens wrote:

>It also means that I can't modify the formatting of custom columns, because I have no way of knowing whether they have text or are cycling columns.
>  
>
If you're using the nsITreeColumn API, you have the cycler property. If
you're looking at DOM nodes, you have the cycler="true" attribute.

>And I don't think it's true that a cycling column can't have text; that may be true of the standard columns that cycle, but there's no reason why a text column couldn't cycle.
>
Trees always paint cyclers as centred images.

--
Warning: May contain traces of nuts.
_______________________________________________
dev-apps-thunderbird mailing list
[hidden email]
https://lists.mozilla.org/listinfo/dev-apps-thunderbird
Reply | Threaded
Open this post in threaded view
|

Re: How to tweak styles in thread pane

Andrew Sutherland-3
In reply to this post by Jonathan Kamens
On 04/22/2012 08:38 AM, Jonathan Kamens wrote:
> I think that will work well enough, but good golly it's gross.

It's also worth noting that the tree widget does not really do any
caching, so wrapping the db view's nsITreeView interface or the custom
column handlers can have a performance impact on the thread pane because
all paints will end up with the additional JS and XPConnect overhead.
This is mainly noticeable in that scrolling the thread pane can slow
down a lot.  If the Method JIT is turned on for Chrome, it might not be
too bad, though.

Andrew
_______________________________________________
dev-apps-thunderbird mailing list
[hidden email]
https://lists.mozilla.org/listinfo/dev-apps-thunderbird