<html>
  <head>
    <meta content="text/html; charset=ISO-8859-1"
      http-equiv="Content-Type">
  </head>
  <body bgcolor="#FFFFFF" text="#000000">
    <br>
    <div class="moz-cite-prefix">On 2/7/2014 4:06 PM, Axel Grude (Axel)
      wrote:<br>
    </div>
    <blockquote cite="mid:52F54AC8.8080408@gmail.com" type="cite">
      <meta http-equiv="content-type" content="text/html;
        charset=ISO-8859-1">
      <style>
p tt, li tt {
 background-image: linear-gradient(to bottom, rgba(230,240,163,1) 0%,rgba(210,230,56,1) 50%,rgba(195,216,37,1) 51%,rgba(219,240,67,1) 100%);
 border-radius: 0.3em;
 display: inline-block;
 border: 1px solid #bbb;
 padding: 2px 4px;
 font-size: 10pt !important;
}
h1 {
  color: #3366aa;
  font-size: 13pt;
  font-family: calibri,sans-serif;
}
.cntr_reply{
 margin-left: auto;
 margin-right: auto;
 background-color: black;
 width: 70%;
 color: #ffffcc;
 font-family: calibri,sans-serif;
 font-size: 15pt !important;
 margin-top: 2px;
 }
</style>
      <div id="smartTemplate4-template">
        <p>All,</p>
        <p>I think some UI work on composer would be great. Maybe a
          Ribbon-Style / extended Formatting Bar interface, plus fixing
          the bugs around [Enter], so that writing paragraphs would be
          more consistent. </p>
        <p> </p>
      </div>
      <p>So I am following up here to ask if this would be a good
        project to mentor. If I had time I would write this as an Addon,
        but sadly...<br>
      </p>
      <h1>Rationale</h1>
      <p>To make it easier to compose great looking emails and encourage
        users to use semantic tags for formatting.<br>
      </p>
    </blockquote>
    <br>
    <div class="cntr_reply">I totally agree, we have needed this for a
      long time.<br>
    </div>
    <blockquote 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>
        <img shrunked:resized="false"
          src="cid:part1.08050206.07050401@gmail.com" alt=""></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>
      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 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 cite="mid:52F54AC8.8080408@gmail.com" type="cite">
      <ul>
        <li> <br>
        </li>
      </ul>
      <p>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.</p>
      <h1>A panel for table styles</h1>
      <p><img shrunked:resized="false"
          src="cid:part2.00080306.00080301@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 cite="mid:52F54AC8.8080408@gmail.com" type="cite">
      <p>As you can see there is support for odd and even rows (also
        columns) and especially the header row and first column, I think
        this pretty basic stuff and should be implementable via nth-row
        etc.</p>
      <img shrunked:resized="false"
        src="cid:part3.06030004.03010907@gmail.com" alt=""><br>
      <h1>List styles</h1>
      should they be separate?<br>
      <br>
      <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 cite="mid:52F54AC8.8080408@gmail.com" type="cite">
      <p> </p>
      <p>There should be an option to persist these styles down to the
        inline level for "lesser" mail clients. We need to have some
        clever way of optionally pushing down styles from the class
        level (maybe on send or save) but we should also be able to
        change the style on class level later. This means, in this mode,
        that inline styles must somehow be marked for deletion (or
        ignored) while composing.</p>
      <p>I think using inline styles this is the biggest challenge for
        actually implementing a proper styling system, therefore I would
        be happy if we could implement CSS class (or element level)
        styling first so at least non mail-mangling clients display the
        html content in "Hi-Fidelity".<br>
        <br>
      </p>
      <h1>Clipboard and Format Painter</h1>
      <p><img shrunked:resized="false"
          src="cid:part4.09040302.02050803@gmail.com" alt=""></p>
      <p>a more helpful panel when dealing with pasting and can support
        things like</p>
      <ul>
        <li>Paste</li>
        <li>Paste without Formatting</li>
        <li>Paste as Quote<br>
          ---------------------<br>
        </li>
        <li>Paste as Code Snippet  (if we can select a quickStyle when
          pasting this will be very handy for developers and other
          specialists)</li>
        <li>Paste as <tt><User defined Style 1></tt>
          <br>
        </li>
      </ul>
      <p>Format Painter: can be used to transfer<span> or
        <block> level style depending on what is selected</p>
    </blockquote>
    <div class="cntr_reply" align="center">What is "Format Painter", a
      separate program, or another proposed included feature.<br>
    </div>
    <blockquote cite="mid:52F54AC8.8080408@gmail.com" type="cite">
      <p>.</p>
      <p>To make it easier for the user to understand the style
        application I would suggest a "x-ray" mode which shows paragraph
        and spanned outlines of the currently active element.</p>
      <p>Also an Fx inspector style breadcrumb panel might be helpful:</p>
      <p><img shrunked:resized="false"
          src="cid:part5.00010100.06050305@gmail.com" alt=""></p>
      <p>interestingly in a standard email the nesting would typically
        not be very deep (maybe 3 to 5 levels), clicking trhe container
        would tightly outline it on screen - also an advantage when
        troubleshooting <tt><spanned></tt> font attributes. do
        you think this might be a helpful tool for formatting HTML mail?<br>
      </p>
      <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>
      <br>
    </div>
    <blockquote 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><br>
                </div>
                <br>
                <br>
              </div>
            </div>
          </div>
          <div>
            <div>
              <div>
                <div><br>
                  [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>
        <pre wrap="">
</pre>
      </blockquote>
      <br>
      <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>
  </body>
</html>