<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=ISO-8859-1">
<style>
p tt, li tt {
background-image: linear-gradient(to bottom, rgb(230, 240, 163) 0%, rgb(210, 230, 56) 50%, rgb(195, 216, 37) 51%, rgb(219, 240, 67) 100%);
border-radius: 0.3em;
display: inline-block;
border: 1px solid rgb(187, 187, 187);
padding: 2px 4px; font-size: 10pt ! important;
}
pre {
border-radius: 1em;
border: 1px solid #444444;
padding: 0.5em 1em;
}
tt.ident {
background-image: linear-gradient(to bottom, rgba(216,216,216,1) 0%,rgba(122,122,122,1) 100%);
border-radius: 0.15em;
display: inline-block;
padding: 2px 3px;
font-size: 10pt !important;
font-weight: bold;
color: #660000;
text-shadow: 1px 1px 1px rgba(255,255,255,0.7);
}
h1 { color: rgb(51, 102, 170); font-size: 13pt; font-family: calibri,sans-serif; }
</style>
</head>
<body smarttemplateinserted="true" text="#000000" bgcolor="#FFFFFF">
<br>
<div id="smartTemplate4-quoteHeader"><br>
<style type="text/css"> #newHeader { font-size: x-small; } #newHeader b { font-weight:bold; color: #990033; } </style>
<div style="display:inline-block;border:1px rgb(210,210,210)
solid;font-size:small;padding:0.8em;background-color:rgba(210,210,210,0.15);box-shadow:
4px 4px 1px rgba(50,50,50,0.15);border-radius:3px;">
<b>Subject:</b> Re: Google Summer of Code 2014 - Proposal to
Improve Composer UI
<b>To:</b> <a class="moz-txt-link-abbreviated" href="mailto:tb-planning@mozilla.org">tb-planning@mozilla.org</a> - tb-planning [<a>tb-planning@mozilla.org</a>]<br>
<b>From:</b> JoeS <a class="moz-txt-link-rfc2396E" href="mailto:joesab2005@gmail.com"><joesab2005@gmail.com></a> - JoeS <a
href="mailto:joesab2005@gmail.com">joesab2005@gmail.com</a><br>
<b>Sent: </b>Saturday, 08/02/2014 01:32:26 01:32 GMT Standard
Time {GMT ST} +0000 [Week 6]<br>
<b>Subject:</b> Re: Google Summer of Code 2014 - Proposal to
Improve Composer UI </div>
</div>
<blockquote class=" cite" id="mid_52F5892A_3010606_gmail_com"
cite="mid:52F5892A.3010606@gmail.com" type="cite">
<meta content="text/html; charset=ISO-8859-1"
http-equiv="Content-Type">
<br>
<div class="moz-cite-prefix">On 2/7/2014 4:06 PM, Axel Grude
(Axel) wrote:<br>
</div>
<blockquote class=" cite" id="mid_52F54AC8_8080408_gmail_com"
cite="mid:52F54AC8.8080408@gmail.com" type="cite">
<meta http-equiv="content-type" content="text/html;
charset=ISO-8859-1">
<style>#mid_52F54AC8_8080408_gmail_com p tt,
#mid_52F54AC8_8080408_gmail_com li tt { background-image: linear-gradient(to bottom, rgb(230, 240, 163) 0%, rgb(210, 230, 56) 50%, rgb(195, 216, 37) 51%, rgb(219, 240, 67) 100%); border-radius: 0.3em; display: inline-block; border: 1px solid rgb(187, 187, 187); padding: 2px 4px; font-size: 10pt ! important; }
#mid_52F54AC8_8080408_gmail_com h1 { color: rgb(51, 102, 170); font-size: 13pt; font-family: calibri,sans-serif; }
#mid_52F54AC8_8080408_gmail_com .cntr_reply { margin-left: auto; margin-right: auto; background-color: black; width: 70%; color: rgb(255, 255, 204); font-family: calibri,sans-serif; font-size: 15pt ! important; margin-top: 2px; }</style>...</blockquote>
<blockquote class=" cite" id="mid_52F54AC8_8080408_gmail_com"
cite="mid:52F54AC8.8080408@gmail.com" type="cite">
<p> </p>
<h1>User Definable Styles</h1>
<p>in particular I like these widgets as they are very easy to
use (1 click) and show that styles can be expandable:<br>
</p>
<p>"normal" this is actually the style that is assigned to<tt>
<p></tt> and adds a <tt><p></tt> mark if the
text is pure body. [Enter] should split the paragraph into 2.
I would like to design an easy to use interface for defining
the styles which would inject the css styles (either on class
level or inline on send). The implementation should allow for
some downwards compatibility but not too much (since we are
using semantic styles such as <tt>p</tt> <tt>h1</tt> <tt>h2</tt>
etc style deterioration on lesser mail clients would be
something expected anyway. I would aim for being at least
"Broad strokes" compatible with capable HTML clients such as
outlook, so that largely font sizes, colors, and very
important formats in quoted mails stay largely persistent.
(This is not easy)</p>
<p>Each style should have a "follow on" rule, e.g. <tt><h1></tt>
=> <tt><p></tt> , <tt><p></tt> => <tt><p></tt>
, etc. and a broad selection of typographical attributes, e.g.</p>
</blockquote>
<div class="cntr_reply" align="center">Are the widgets you refer
to theoretical, or are they part of smarttemplates extension, or
something<br>
</div>
</blockquote>
They are meant as part of a long needed overhaul to make the
Composer as awesome as the rest of Thunderbird. I would not propose
to add them to smartTemplate4 (which I own), they are really needed
in the core code. However this should be discussed here first before
even looking into it. If the consensus was that an Addon would be
better suited, this should definitely be done in its own dedicated
Extension. <br>
<br>
I have been thinking about these features with this functionality
for a long time. And this gestated the more concrete wish to create
an Addon, but the problem with Addons is that they have a very small
audience and so wouldn't help Thunderbird as much as a core change.
Also I wouldn't have enough time to write such an Addon by myself
alone as I already have too many Addons to maintain. I would however
offer to mentor and UX design lead such a project.<br>
<blockquote class=" cite" id="mid_52F5892A_3010606_gmail_com"
cite="mid:52F5892A.3010606@gmail.com" type="cite">
<div class="cntr_reply" align="center"> I agree on the
enter=paragraph break issue<br>
A lot of trouble pasting in </p><p><br>
so i didn't bother with that here.<br>
</div>
</blockquote>
<p>With current Thunderbird, you can simply use the format menu:</p>
<img shrunked:resized="false"
src="cid:part3.08090709.00030502@gmail.com" alt=""><br>
<p>As you just demonstrated, this is not easily discovered by most
users, with this minimal UI, imo Paragraph should be the default
(like it is in Outlook). Body Text is actually not a style at all
it just meant "no container" and makes it much harder to persist a
style (especially when you are quoting). I am not sure what the
official method of transferring styles from <tt><body></tt>
is - what I see in this email is that the <tt><style></tt>
tag that I placed in the <tt><head></tt> section was
transferred into the <tt><blockquote></tt> and all rules
were prefixed with a unique id <tt class="ident">#mid_52F54AC8_8080408_gmail_com</tt>.
</p>
<blockquote class=" cite" id="mid_52F5892A_3010606_gmail_com"
cite="mid:52F5892A.3010606@gmail.com" type="cite">
<div class="cntr_reply" align="center"> </div>
<blockquote class=" cite" id="mid_52F54AC8_8080408_gmail_com"
cite="mid:52F54AC8.8080408@gmail.com" type="cite">
<p>Font specific</p>
<ul>
<li>font family</li>
<li>font size</li>
<li>font weight<br>
</li>
<li>font decoration / formatting<br>
</li>
<li>color</li>
<li>background color</li>
<li>text shadow<br>
</li>
</ul>
<p>Block specific<br>
</p>
<ul>
<li>alignment<br>
</li>
<li>line distance</li>
<li>Spacing before & after (padding)<br>
</li>
<li>indentation</li>
<li>line width</li>
<li>border styles</li>
<li>box-shadow</li>
<li>gradients<br>
</li>
</ul>
<p>Inline / Character Styles</p>
<ul>
<li>these would be injected via <tt><span></tt> and
would allow stuff like the html entities in this mail (I am
using <tt><tt></tt> blocks which are defined as
inline-block). the hardest thing with these is to come up
with a non-technical description (or does one ues CSS
terms). I think the benefit is pretty much visible instantly
once you come up with some examples.<br>
</li>
</ul>
</blockquote>
<div class="cntr_reply" align="center">I'm not quite sure how you
got those <tt> blocks in there, or is that a feature of
your extension<br>
</div>
</blockquote>
<p>In Thunderbird, after highlighting the word I want to style, I
simply used the font drop-down:</p>
<img shrunked:resized="false"
src="cid:part4.01020901.02030702@gmail.com" alt=""><br>
<p>I then manually injected the following code into the <tt><head></tt>
tag (I am using the Stationery Addon for editing the Source code):<br>
</p>
<pre>p tt, li tt {
background-image: linear-gradient(to bottom, rgb(230, 240, 163) 0%, rgb(210, 230, 56) 50%,
rgb(195, 216, 37) 51%, rgb(219, 240, 67) 100%);
border-radius: 0.3em;
display: inline-block;
border: 1px solid rgb(187, 187, 187);
padding: 2px 4px; font-size: 10pt ! important;
}
</pre>
<p>Note that I use this only for <tt>tt</tt> blocks contained
within paragraphs or lists; of course I could also have added a
class but I am lazy :-). <br>
</p>
<p>In order to avoid this affecting quoted material I would have
preferred to use: <tt class="ident">body > p > tt</tt> but
unfortunately due to [<a
href="https://bugzilla.mozilla.org/show_bug.cgi?id=964024">Bug
964024</a>], Thunderbird replaces the child selector <tt>></tt>
with <tt>></tt> (we should teach it not to mess with <tt><style></tt>
sections like that).<br>
</p>
<p>The other question is whether such inline level styles should
also be within the same widget (I think this is what Outlook does)
or should they be separate?<br>
</p>
<p>The whole point of my suggestion to give the users a possibility
to do the above without having to edit the message source or
necessarily understanding CSS2.1.<br>
</p>
<br>
<blockquote class=" cite" id="mid_52F5892A_3010606_gmail_com"
cite="mid:52F5892A.3010606@gmail.com" type="cite">
<div class="cntr_reply" align="center"> </div>
<blockquote class=" cite" id="mid_52F54AC8_8080408_gmail_com"
cite="mid:52F54AC8.8080408@gmail.com" type="cite"> Most rich
text editing users are familiar with the concept of user defined
styles. One thing to solve would how to persist the style
definitions, would the be only stored in the email and / or
globally. It should also be extendable in the form of a style
template so that a bunch of style definitions can be stored
together under a common name. I wouldn't attempt to implement
the template management as part of this project but make it
extendable so that the overarching template structure already
exists.
<h1>A panel for table styles</h1>
<p><img shrunked:resized="false"
src="cid:part6.03070107.06030104@gmail.com" alt=""></p>
<p>..at the moment the inclusion of tables in Composer is also
somewhat lackluster (if you ever try to paste an Excel
formatted table into a html mail you can see the sorry effects
of this). So at least we should provide a tool to quickly
format the table with a colored style and a heading.</p>
</blockquote>
<div class="cntr_reply" align="center">Shouldn't we use divs
rather than tables or at least offer that as an alternative.<br>
</div>
</blockquote>
No, you use <b>Tables </b>for<i> Tabular data</i>. The main
examples for tabular data on the Web are:<br>
<ul>
<li>actual tables. So you have a bunch of records that have fields
(columns) and data (row)</li>
<li>forms. Yes these are tabular as well, usually only having 2
columns, that is label and input.<br>
</li>
</ul>
These table styles are not a replacement for divs as they are very
obviously designed for handling the former (tabular data).<br>
<br>
<blockquote class=" cite" id="mid_52F5892A_3010606_gmail_com"
cite="mid:52F5892A.3010606@gmail.com" type="cite">
<blockquote class=" cite" id="mid_52F54AC8_8080408_gmail_com"
cite="mid:52F54AC8.8080408@gmail.com" type="cite">
<h1>Style Persistence</h1>
<p>There are 3 levels of style persistance: In the mail client /
profile, in the individual email and after sending on the
recipient's system. With persistence I mean the answer to the
question "where and how are these styles stored".<br>
</p>
<p>On the program level, of course we can (and probably should)
persist the styles in the config database, so that they can be
used again and again (Similar to Word's "Default template").
Then these styles could be copied into the composed emails
using CSS classes, e.g. by injection into the <tt><head></tt>
section. Of course the epxectation of the users is that if I
modify my style while composing the email, it will
automatically be updated (and stored) in my composed email.
Likewise, if I re-open the email from my drafts folder (or via
"Edit as New") i would expect my style selections to reflect
these styles (provided I have created the mail with the same
system = current Thunderbird); if I have chosen to make my
headings blue, I want them to be blue again when I continue
editing.<br>
</p>
<p>The next question is whether changes to for example the <tt><p></tt>
style will then atuomatically affect all following emails, or
how to create an easy to understand interface<br>
</p>
</blockquote>
<div class="cntr_reply" align="center">I think we should just
rely on templates for persistence I don't think anything
developed in the scope of GSOC can do better.<br>
</div>
</blockquote>
Can you elaborate what you mean when you use the word "template",
maybe with an example.<br>
<br>
Where do you store these? Are the template names also injected into
the mail body (so you can recall them when you reply to the email
chain or re-open the mail in drafts or Edit as New?<br>
<br>
<br>
<blockquote class=" cite" id="mid_52F5892A_3010606_gmail_com"
cite="mid:52F5892A.3010606@gmail.com" type="cite">
<div class="cntr_reply" align="center"> </div>
<blockquote class=" cite" id="mid_52F54AC8_8080408_gmail_com"
cite="mid:52F54AC8.8080408@gmail.com" type="cite">
<p> </p>
<h1>Clipboard and Format Painter</h1>
<p><img shrunked:resized="false"
src="cid:part7.00060406.09070405@gmail.com" alt=""></p>
Format Painter: can be used to transfer<span> or
<block> level style depending on what is selected </blockquote>
<div class="cntr_reply" align="center">What is "Format Painter", a
separate program, or another proposed included feature.<br>
</div>
</blockquote>
<p>It is a special widget from Microsoft which lets you transfer the
formatting rules of a highlighted text section or paragraph to
another place in the document. You can single click to do this
once or make it sticky by double-clicking it. In that case you can
transfer your <font face="Times New Roman, Times, serif"><u><font
color="#cc0000"><i><b>beautiful style</b></i></font></u></font>
that you created to many other places, by simply clicking on them
once. Likewise you could just highlight a <h2> and turn
other paragraphs into <tt><h2></tt> as well, or turn <tt><body></tt>
text into <tt><p></tt> or <tt><ul><li></tt>. </p>
<p>It is a very intuitive tool, but due to that many different
styling methods, I would say the implementation of this is
something quite complicated. So maybe something for formatting bar
version 2.0.<br>
</p>
<br>
<blockquote class=" cite" id="mid_52F5892A_3010606_gmail_com"
cite="mid:52F5892A.3010606@gmail.com" type="cite">
<div class="cntr_reply" align="center"> </div>
<blockquote class=" cite" id="mid_52F54AC8_8080408_gmail_com"
cite="mid:52F54AC8.8080408@gmail.com" type="cite">
<h1>Scope<br>
</h1>
<p>Well that's the one I am worried about. Might all be a bit
much for a 3 months project...<br>
</p>
<br>
</blockquote>
<div class="cntr_reply" align="center">Yes, I think it's way too
much for a 3 month project and won't these proposed enhancements
require changes to the 'core editor'<br>
That's a task in itself<br>
unless you are proposing forking the editor,<br>
I think that will eventually be the only answer<br>
</div>
</blockquote>
Yeah maybe branching it off for a half year or so, but you want to
make sure there is some consensus and a small team of people working
on it. Alternatively we could create a mini Team to write a
"proof-of-concept" addon to see how that would be accepted by the
users.<br>
<br>
<blockquote class=" cite" id="mid_52F5892A_3010606_gmail_com"
cite="mid:52F5892A.3010606@gmail.com" type="cite">
<blockquote class=" cite" id="mid_52F54AC8_8080408_gmail_com"
cite="mid:52F54AC8.8080408@gmail.com" type="cite">
<blockquote class=" cite"
id="mid_CAC4yyp_CZwSCx8_b_8CHbPALpHEzbu2CQqPp7hPUw7K7Y8Tbpw_mail_gmail_com"
cite="mid:CAC4yyp=CZwSCx8-b-8CHbPALpHEzbu2CQqPp7hPUw7K7Y8Tbpw@mail.gmail.com"
type="cite">
<div dir="ltr">
<div>
<div>
<div>
<div> [1] <a moz-do-not-send="true"
href="http://blog.queze.net/post/2014/01/24/Project-ideas-for-Summer-of-Code-2014">http://blog.queze.net/post/2014/01/24/Project-ideas-for-Summer-of-Code-2014</a>
<br>
[2] <a moz-do-not-send="true"
href="https://wiki.mozilla.org/Community:SummerOfCode14:Brainstorming">https://wiki.mozilla.org/Community:SummerOfCode14:Brainstorming</a>
<br>
</div>
</div>
</div>
</div>
</div>
<br>
<fieldset class="mimeAttachmentHeader"></fieldset>
<br>
</blockquote>
<br>
</blockquote>
<div class="cntr_reply" align="center">Please read this in HTML.
90% of the email world does.<br>
</div>
-- JoeS/1/2<br>
<br>
<fieldset class="mimeAttachmentHeader"></fieldset>
<br>
<pre wrap="">_______________________________________________
tb-planning mailing list
<a class="moz-txt-link-abbreviated" href="mailto:tb-planning@mozilla.org">tb-planning@mozilla.org</a>
<a class="moz-txt-link-freetext" href="https://mail.mozilla.org/listinfo/tb-planning">https://mail.mozilla.org/listinfo/tb-planning</a>
</pre>
</blockquote>
<br>
<br>
</body>
</html>