Implement advance header view.

diff --git a/imp/js/mobile.js b/imp/js/mobile.js
index ac00ee2..33d257e 100644 (file)
--- a/imp/js/mobile.js
+++ b/imp/js/mobile.js
@@ -139,12 +139,17 @@ var ImpMobile = {
     {
         $.mobile.pageLoading(true);
         if (r.response && r.response.message && !r.response.message.error) {
-            var data = r.response.message;
+            var data = r.response.message,
+                headers = $('#imp-message-headers tbody');
             $('#imp-message-title').html(data.title);
             $('#imp-message-subject').html(data.subject);
             $('#imp-message-from').text(data.from[0].personal);
             $('#imp-message-body').html(data.msgtext);
+            headers.text('');
             $.each(data.headers, function(k, header) {
+                if (header.value) {
+                    headers.append($('<tr>').append($('<td class="imp-header-label">').html(header.name + ':')).append($('<td>').html(header.value)));
+                }
                 if (header.id == 'Date') {
                     $('#imp-message-date').text(header.value);
                 }
@@ -166,20 +171,29 @@ var ImpMobile = {
             orig = $(e.target),
             id;
 
-        while (elt) {
+        while (elt && elt != window.document) {
             id = elt.attr('id');
 
             switch (id) {
+            case 'imp-message-more':
+                elt.parent().hide();
+                elt.parent().next().show();
+                return;
+
+            case 'imp-message-less':
+                elt.parent().hide();
+                elt.parent().prev().show();
+                return;
             }
 
             if (elt.hasClass('imp-folder')) {
                 var link = elt.find('a[mailbox]');
                 ImpMobile.toMailbox(link.attr('mailbox'), link.text());
-                break;
+                return;
 
             } else if (elt.hasClass('imp-message')) {
                 ImpMobile.toMessage(elt.attr('data-imp-mailbox'), elt.attr('data-imp-uid'));
-                break;
+                return;
             }
 
             elt = elt.parent();

diff --git a/imp/templates/mobile/message.html.php b/imp/templates/mobile/message.html.php
index 89671da..6a984da 100644 (file)
--- a/imp/templates/mobile/message.html.php
+++ b/imp/templates/mobile/message.html.php
@@ -10,8 +10,12 @@
     <small id="imp-message-date"></small>
   </div>
   <div class="ui-body ui-body-c">
-    <a href="#" style="float:right;margin:0" data-role="button" data-icon="arrow-d" data-iconpos="notext"><?php echo _("Show more") ?></a>
+    <a id="imp-message-more" href="#" data-role="button" data-icon="arrow-d" data-iconpos="notext"><?php echo _("Show more") ?></a>
     <?php echo _("From:") ?> <span id="imp-message-from"></span>
   </div>
+  <div class="ui-body ui-body-c">
+    <a id="imp-message-less" href="#" data-role="button" data-icon="arrow-u" data-iconpos="notext"><?php echo _("Show less") ?></a>
+    <table id="imp-message-headers"><tbody></tbody></table>
+  </div>
   <div id="imp-message-body" data-role="content"></div>
 </div>

diff --git a/imp/themes/default/mobile.css b/imp/themes/default/mobile.css
index ca4873e..ca1fc52 100644 (file)
--- a/imp/themes/default/mobile.css
+++ b/imp/themes/default/mobile.css
@@ -1,3 +1,4 @@
+/* Mailbox */
 #mailbox .ui-btn-innner {
     padding-top: 0.4em;
     padding-bottom: 0.4em;
@@ -6,15 +7,23 @@
     margin: 0;
 }
 
+/* Message */
 #message .ui-body-c {
     border-top-width: 0;
 }
+.imp-header-label {
+    font-weight: bold;
+}
+#imp-message-more, #imp-message-less {
+    float: right;
+    margin: 0;
+}
 
 /* Style for HTML data iframe. */
 .htmlMsgData {
     width: 100%;
 }
 
-.mimePartInfo {
+.mimePartInfo, .mimeStatusMessage {
     display: none;
 }