wip: #38

First attempt to insert attachments when composing an email. Only the javascript part is available.

extensions/webmail/static/css/webmail.css

@@ -170,7 +170,60 @@ textarea:hover {
 }
 
 #mailheader {
+    width: 70%;
     padding-bottom: 5px;
+    float: left;
+}
+
+#attachments {
+    width: 29%;
+    float: left;
+}
+
+#attachments h3 {
+    float: left;
+    font-size: 1em;
+    margin: 0;
+    margin-right: 10px;
+}
+
+#attachments img {
+    float: left;
+    margin-right: 5px;
+}
+
+#attachments a:link, a:visited {
+    background: transparent;
+    color: black;
+    text-decoration: none;
+}
+
+#finput_container {
+    display: block; 
+    width: 100px; 
+    height: 20px; 
+    overflow: hidden
+}
+
+#upload_input {
+    font-size: 50px; 
+    width: 120px; 
+    opacity: 0; 
+    filter: alpha(opacity: 0);
+    position: relative; 
+    top: -40px;
+    left: -20px;
+}
+
+#attachments ul {
+    list-style: none;
+    padding: 5px 5px;
+    margin: 0;
+}
+
+#attachments li {
+    margin-bottom: 4px;
+    padding-left: 10px;
 }
 
 /* Progress bar */

extensions/webmail/templates/webmail/compose.html

@@ -4,6 +4,17 @@
     <div id="mailheader">
       {% include "common/genericform.html" %}
     </div>
+    <div id="attachments">
+      <h3><img src="{{ MEDIA_URL }}pics/attachment.png" /> {% trans "Attachments" %}</h3>
+      <div id="finput_container">
+        <a href="javascript: void(0)"><img src="{{ MEDIA_URL }}pics/add.png" />
+        {% trans "Add" %}</a>
+        <input type="file" id="upload_input" name="upload" />
+      </div>
+      <ul id="files2upload">
+      </ul>
+    </div>
+    <div class="spacer"></div>
     {% if body %}
     <textarea id="id_body" name="id_body" class="editor">{% if bodyheader %}{{ bodyheader }}{% endif %}
 {{ body }}

extensions/webmail/templates/webmail/index.html

@@ -105,6 +105,28 @@
       }
       $("composemail").send();
     });
+
+    var files2upload = new Array();
+
+    delete_attachment = function(evt) {
+      var litag = evt.target.getParents("li");
+      var attachment = litag.get("text");
+
+      files2upload.erase(attachment);
+      litag.destroy();
+    }
+
+    $("upload_input").addEvent("change", function(evt) {
+      var atag = new Element("a").set("name", "delete_attachment");
+      var imgtag = new Element("img").set("src", "{{ MEDIA_URL }}pics/remove.png");
+      var litag = new Element("li").set("text", evt.target.value);
+
+      files2upload.include(evt.target.value);
+      imgtag.inject(atag);
+      atag.inject(litag);
+      litag.inject($("files2upload"));
+      atag.addEvent("click", delete_attachment);
+    });
   }
 
   loadCompose = function(event) {

extensions/webmail/views.py

@@ -9,7 +9,8 @@ from django.utils.translation import ugettext as _
 from django.core.urlresolvers import reverse
 from django.contrib.auth.decorators import login_required
 from modoboa.admin.models import Mailbox
-from modoboa.lib import parameters, _render, _render_error, getctx, is_not_localadmin
+from modoboa.lib import parameters, _render, _render_error, \
+    getctx, is_not_localadmin, _render_to_string
 from modoboa.lib.email_listing import parse_search_parameters
 from lib import *
 from forms import *
@@ -225,7 +226,7 @@ def render_compose(request, form, posturl, email=None, insert_signature=False):
         signature = EmailSignature(request.user)
         body += str(signature)
 
-    content = render_to_string("webmail/compose.html", {
+    content = _render_to_string(request, "webmail/compose.html", {
             "form" : form, "bodyheader" : textheader,
             "body" : body, "posturl" : posturl
             })