12 files changed, 310 insertions, 43 deletions
diff --git a/skins/default/common.css b/skins/default/common.css
index 8ec5b59ef..44bb4f5b9 100644
--- a/skins/default/common.css
+++ b/skins/default/common.css
@@ -537,7 +537,7 @@ a.rcmContactAddress:hover
 
 ul.toolbarmenu
 {
-  margin: 0;
+  margin: -4px 0 -4px 0;
   padding: 0;
   list-style: none;
 }
@@ -547,13 +547,14 @@ ul.toolbarmenu li
   font-size: 11px;
   white-space: nowrap;
   min-width: 130px;
+  margin: 3px -4px;
 }
 
 ul.toolbarmenu li a
 {
   display: block;
   color: #a0a0a0;
-  padding: 2px 8px 3px 22px;
+  padding: 2px 12px 3px 28px;
   text-decoration: none;
   min-height: 14px;
 }
@@ -597,3 +598,8 @@ ul.toolbarmenu li.separator_above
   margin-top: 2px;
   padding-top: 2px;
 }
+
+.disabled
+{
+  color: #999;
+}
diff --git a/skins/default/functions.js b/skins/default/functions.js
index 47a121db1..4ee2a9d3e 100644
--- a/skins/default/functions.js
+++ b/skins/default/functions.js
@@ -124,6 +124,7 @@ function rcube_mail_ui()
   this.markmenu = $('#markmessagemenu');
   this.searchmenu = $('#searchmenu');
   this.messagemenu = $('#messagemenu');
+  this.listmenu = $('#listmenu');
 }
 
 rcube_mail_ui.prototype = {
@@ -186,15 +187,89 @@ set_searchmod: function(elem)
     rcmail.env.search_mods[rcmail.env.mailbox][elem.value] = elem.value;
 },
 
+show_listmenu: function(show)
+{
+  if (typeof show == 'undefined')
+    show = this.listmenu.is(':visible') ? false : true;
+
+  var ref = rcube_find_object('listmenulink');
+  if (show && ref) {
+    var pos = $(ref).offset();
+    this.listmenu.css({ left:pos.left, top:(pos.top + ref.offsetHeight + 2)});
+    // set form values
+    $('input[name="sort_col"][value="'+rcmail.env.sort_col+'"]').attr('checked', 1);
+    $('input[name="sort_ord"][value="DESC"]').attr('checked', rcmail.env.sort_order=='DESC' ? 1 : 0);
+    $('input[name="sort_ord"][value="ASC"]').attr('checked', rcmail.env.sort_order=='DESC' ? 0 : 1);
+    $('input[name="view"][value="thread"]').attr('checked', rcmail.env.threading ? 1 : 0);
+    $('input[name="view"][value="list"]').attr('checked', rcmail.env.threading ? 0 : 1);
+    // list columns
+    var cols = $('input[name="list_col[]"]');
+    for (var i=0; i<cols.length; i++) {
+      var found = 0;
+      if (cols[i].value != 'from')
+        found = jQuery.inArray(cols[i].value, rcmail.env.coltypes) != -1;
+      else
+        found = (jQuery.inArray('from', rcmail.env.coltypes) != -1
+	    || jQuery.inArray('to', rcmail.env.coltypes) != -1);
+      $(cols[i]).attr('checked',found ? 1 : 0);
+    }
+  }
+
+  this.listmenu[show?'show':'hide']();
+
+  if (show) {
+    var maxheight=0;
+    $('#listmenu fieldset').each(function() {
+      var height = $(this).height();
+      if (height > maxheight) {
+        maxheight = height;
+      }
+    });
+    $('#listmenu fieldset').css("min-height", maxheight+"px")
+    // IE6 complains if you set this attribute using either method:
+    //$('#listmenu fieldset').css({'height':'auto !important'});
+    //$('#listmenu fieldset').css("height","auto !important");
+      .height(maxheight);
+  };
+},
+
+open_listmenu: function(e)
+{
+  this.show_listmenu();
+},
+
+save_listmenu: function()
+{
+  this.show_listmenu();
+
+  var sort = $('input[name="sort_col"]:checked').val();
+  var ord = $('input[name="sort_ord"]:checked').val();
+  var thread = $('input[name="view"]:checked').val();
+  var cols = $('input[name="list_col[]"]:checked')
+    .map(function(){ return this.value; }).get();
+
+  rcmail.set_list_options(cols, sort, ord, thread == 'thread' ? 1 : 0);
+},
+
 body_mouseup: function(evt, p)
 {
-  if (this.markmenu && this.markmenu.is(':visible') && rcube_event.get_target(evt) != rcube_find_object('markreadbutton'))
+  var target = rcube_event.get_target(evt);
+
+  if (this.markmenu && this.markmenu.is(':visible') && target != rcube_find_object('markreadbutton'))
     this.show_markmenu(false);
-  else if (this.messagemenu && this.messagemenu.is(':visible') && rcube_event.get_target(evt) != rcube_find_object('messagemenulink'))
+  else if (this.messagemenu && this.messagemenu.is(':visible') && target != rcube_find_object('messagemenulink'))
     this.show_messagemenu(false);
-  else if (this.searchmenu && this.searchmenu.is(':visible') && rcube_event.get_target(evt) != rcube_find_object('searchmod')) {
+  else if (this.listmenu && this.listmenu.is(':visible') && target != rcube_find_object('listmenulink')) {
+    var menu = rcube_find_object('listmenu');
+    while (target.parentNode) {
+      if (target.parentNode == menu)
+        return;
+      target = target.parentNode;
+    }
+    this.show_listmenu(false);
+  }
+  else if (this.searchmenu && this.searchmenu.is(':visible') && target != rcube_find_object('searchmod')) {
     var menu = rcube_find_object('searchmenu');
-    var target = rcube_event.get_target(evt);
     while (target.parentNode) {
       if (target.parentNode == menu)
         return;
@@ -213,6 +288,8 @@ body_keypress: function(evt, p)
       this.show_searchmenu(false);
     if (this.messagemenu && this.messagemenu.is(':visible'))
       this.show_messagemenu(false);
+    if (this.listmenu && this.listmenu.is(':visible'))
+      this.show_listmenu(false);
   }
 }
 
@@ -225,4 +302,6 @@ function rcube_init_mail_ui()
   rcmail_ui = new rcube_mail_ui();
   rcube_event.add_listener({ object:rcmail_ui, method:'body_mouseup', event:'mouseup' });
   rcube_event.add_listener({ object:rcmail_ui, method:'body_keypress', event:'keypress' });
+  rcmail.addEventListener('menu-open', 'open_listmenu', rcmail_ui);
+  rcmail.addEventListener('menu-save', 'save_listmenu', rcmail_ui);
 }
diff --git a/skins/default/ie6hacks.css b/skins/default/ie6hacks.css
index e256ea1c5..11a5b1d3c 100644
--- a/skins/default/ie6hacks.css
+++ b/skins/default/ie6hacks.css
@@ -14,7 +14,9 @@ img
   background-image: url('images/display/icons.gif');
 }
 
-#messagemenu li a
+#messagemenu li a,
+#messagelist tr td div.expanded,
+#messagelist tr td div.collapsed
 {
   background-image: url('images/messageactions.gif');
 }
@@ -47,13 +49,12 @@ img
   background-image: url('images/abook_toolbar.gif');
 }
 
-ul.toolbarmenu li
+ul.toolbarmenu li a
 {
-  width: auto;
-  border: 1px solid #f6f6f6;
+  clear: left;
 }
 
-ul.toolbarmenu li a
+ul.toolbarmenu li.separator_below
 {
-  clear: left;
+  padding-bottom: 8px;
 }
diff --git a/skins/default/iehacks.css b/skins/default/iehacks.css
index dd40b32e1..e9bbe6725 100644
--- a/skins/default/iehacks.css
+++ b/skins/default/iehacks.css
@@ -24,13 +24,9 @@ input, textarea
   filter: alpha(opacity=85);
 }
 
-#markmessagemenu,
-#searchmenu,
-#messagemenu
+.popupmenu
 {
-  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=90)";
-  filter: alpha(opacity=90);
-
+	background-color: #ffffff;
 }
 
 #tabsbar
@@ -160,6 +156,11 @@ input, textarea
   border-collapse: collapse;
 }
 
+#messagelist tbody tr.unroot td.subject
+{
+  text-decoration: underline;
+}
+
 #messageframe
 {
   width: expression((parseInt(this.parentNode.offsetWidth)-180)+'px');
@@ -243,6 +244,11 @@ div.message-part div.pre
   filter: alpha(opacity=70);
 }
 
+ul.toolbarmenu
+{
+  margin: 0 0 -4px 0;
+}
+
 ul.toolbarmenu li
 {
   min-width: auto;
@@ -263,3 +269,9 @@ table.records-table thead tr td
 {
   height: 19px;
 }
+
+#listmenu fieldset
+{
+  margin: 0 4px;
+  padding: 0.8em;
+}
diff --git a/skins/default/images/icons/columnpicker.gif b/skins/default/images/icons/columnpicker.gif
new file mode 100644
index 000000000..e776519b3
--- /dev/null
+++ b/skins/default/images/icons/columnpicker.gif
diff --git a/skins/default/images/icons/unread_children.png b/skins/default/images/icons/unread_children.png
new file mode 100644
index 000000000..45e671dcc
--- /dev/null
+++ b/skins/default/images/icons/unread_children.png
diff --git a/skins/default/images/mail_footer.png b/skins/default/images/mail_footer.png
index b1b63617e..ab56b835f 100644
--- a/skins/default/images/mail_footer.png
+++ b/skins/default/images/mail_footer.png
diff --git a/skins/default/images/messageactions.gif b/skins/default/images/messageactions.gif
index 5f0a533fe..94fcba43e 100644
--- a/skins/default/images/messageactions.gif
+++ b/skins/default/images/messageactions.gif
diff --git a/skins/default/images/messageactions.png b/skins/default/images/messageactions.png
index 8dfb3896d..b3e648eea 100644
--- a/skins/default/images/messageactions.png
+++ b/skins/default/images/messageactions.png
diff --git a/skins/default/includes/messagemenu.html b/skins/default/includes/messagemenu.html
index ad2a6c61e..e89155ae8 100644
--- a/skins/default/includes/messagemenu.html
+++ b/skins/default/includes/messagemenu.html
@@ -1,4 +1,4 @@
-<div id="messagemenu">
+<div id="messagemenu" class="popupmenu">
   <ul class="toolbarmenu">
     <li><roundcube:button class="printlink" command="print" label="printmessage" classAct="printlink active" /></li>
     <li><roundcube:button class="downloadlink" command="download" label="emlsave" classAct="downloadlink active" /></li>
diff --git a/skins/default/mail.css b/skins/default/mail.css
index eb7e190ab..7d1cb33d4 100644
--- a/skins/default/mail.css
+++ b/skins/default/mail.css
@@ -164,25 +164,38 @@
   padding-left: 2px;
 }
 
-#markmessagemenu,
-#searchmenu,
-#messagemenu
+.popupmenu
 {
   position: absolute;
   top: 32px;
   left: 90px;
   width: auto;
   display: none;
-  background-color: #F9F9F9;
-  border: 1px solid #CCC;
-  padding: 1px;
-  opacity: 0.9;
+  background-color: #fff;
+  background-color: rgba(255, 255, 255, 0.95);
+  border: 1px solid #999;
+  padding: 4px;
   z-index: 240;
+  border-radius: 3px;
+  -moz-border-radius: 3px;
+  -webkit-border-radius: 3px;
+  -moz-box-shadow: 1px 1px 12px #999;
+  -webkit-box-shadow: #999 1px 1px 12px;
 }
 
 #searchmenu
 {
-  width: 172px;
+  width: 160px;
+}
+
+#searchmenu ul.toolbarmenu
+{
+  margin: 0;
+}
+
+#searchmenu ul.toolbarmenu li
+{
+  margin: 1px 4px 1px;
 }
 
 #messagemenu li a.active:hover,
@@ -194,53 +207,53 @@
 
 #messagemenu li a
 {
-  background: url('images/messageactions.png') no-repeat 1px 0;
-  background-position: 0px 20px;
+  background: url('images/messageactions.png') no-repeat 7px 0;
+  background-position: 7px 20px;
 }
 
 #messagemenu li a.printlink
 {
-  background-position: 1px 1px;
+  background-position: 7px 1px;
 }
 
 #messagemenu li a.downloadlink
 {
-  background-position: 1px -17px;
+  background-position: 7px -17px;
 }
 
 #messagemenu li a.sourcelink
 {
-  background-position: 1px -35px;
+  background-position: 7px -35px;
 }
 
 #messagemenu li a.openlink
 {
-  background-position: 1px -53px;
+  background-position: 7px -53px;
 }
 
 #messagemenu li a.editlink
 {
-  background-position: 1px -71px;
+  background-position: 7px -71px;
 }
 
 #markmessagemenu a.readlink
 {
-  background: url('images/icons/dot.png') no-repeat 2px;
+  background: url('images/icons/dot.png') no-repeat 7px 2px;
 }
 
 #markmessagemenu a.unreadlink
 {
-  background: url('images/icons/unread.png') no-repeat 2px;
+  background: url('images/icons/unread.png') no-repeat 7px 2px;
 }
 
 #markmessagemenu a.flaggedlink
 {
-  background: url('images/icons/flagged.png') no-repeat 2px;
+  background: url('images/icons/flagged.png') no-repeat 7px 2px;
 }
 
 #markmessagemenu a.unflaggedlink
 {
-  background: url('images/icons/unflagged.png') no-repeat 2px;
+  background: url('images/icons/unflagged.png') no-repeat 7px 2px;
 }
 
 #searchfilter
@@ -613,6 +626,30 @@ td.formlinks a:visited
   background-position: -75px -15px;
 }
 
+#listcontrols a.expand-all {
+  background-position: -90px 0;
+}
+
+#listcontrols a.expand-allsel {
+  background-position: -90px -15px;
+}
+
+#listcontrols a.collapse-all {
+  background-position: -105px 0;
+}
+
+#listcontrols a.collapse-allsel {
+  background-position: -105px -15px;
+}
+
+#listcontrols a.expand-unread {
+  background-position: -120px 0;
+}
+
+#listcontrols a.expand-unreadsel {
+  background-position: -120px -15px;
+}
+
 #countcontrols
 {
   height: 15px;
@@ -720,15 +757,25 @@ body.messagelist
   vertical-align: middle;
 }
 
+#messagelist thead tr td.subject
+{
+  padding-left: 22px;
+}
+
 #messagelist thead tr td.icon,
-#messagelist thead tr td.flag
+#messagelist thead tr td.flag,
+#messagelist thead tr td.threads
 {
   width: 22px;
   padding: 0;
   text-align: center;
 }
 
-#messagelist tbody tr td.icon,
+#messagelist thead tr td.threads
+{
+  width: 18px;
+}
+
 #messagelist tbody tr td.flag
 {
   padding: 2px 3px 2px 3px;
@@ -736,6 +783,45 @@ body.messagelist
   cursor: pointer;
 }
 
+#messagelist tr td span.branch
+{
+  display: inline-block;
+  width: 15px;
+  height: 15px;
+}
+
+#messagelist tr td.subject img.msgicon
+{
+  vertical-align: middle;
+}
+
+#messagelist tbody td img.msgicon
+{
+  position: relative;
+  top: 0px;
+  margin-right: 5px;
+}
+
+#messagelist tr td div.collapsed,
+#messagelist tr td div.expanded,
+#messagelist tr td img.flagicon,
+#messagelist tr td img.msgicon
+{
+  cursor: pointer;
+}
+
+#messagelist tr td div.collapsed
+{
+  display: block;
+  background: url('images/messageactions.png') center -91px no-repeat;
+}
+
+#messagelist tr td div.expanded
+{
+  display: block;
+  background: url('images/messageactions.png') center -109px no-repeat;
+}
+
 #messagelist tbody tr td.flag img:hover,
 #messagelist thead tr td.flag img
 {
@@ -749,6 +835,12 @@ body.messagelist
   width: 99%;
 }
 
+/* thread parent message with unread children */
+#messagelist tbody tr.unroot td.subject a
+{
+  text-decoration: underline;
+}
+
 #messagelist tr td.size
 {
   width: 70px;
@@ -1267,3 +1359,27 @@ font.bold
 {
   font-weight: bold;
 }
+
+#listmenu
+{
+  padding: 6px;
+}
+
+#listmenu legend
+{
+  color: #999999;
+}
+
+#listmenu fieldset
+{
+  border: 1px solid #999999;
+  margin: 0 5px;
+  float: left;
+}
+
+#listmenu div
+{
+  padding: 8px 0 3px 0;
+  text-align: center;
+  clear: both;
+}
diff --git a/skins/default/templates/mail.html b/skins/default/templates/mail.html
index 9e07cf7d8..c66bc5802 100644
--- a/skins/default/templates/mail.html
+++ b/skins/default/templates/mail.html
@@ -59,7 +59,9 @@
   forwardedrepliedIcon="/images/icons/forwarded_replied.png"
   attachmentIcon="/images/icons/attachment.png"
   flaggedIcon="/images/icons/flagged.png"
-  unflaggedIcon="/images/icons/blank.gif" />
+  unflaggedIcon="/images/icons/blank.gif"
+  unreadchildrenIcon="" 
+  optionsmenuIcon="/images/icons/columnpicker.gif" />
 </div>
 
 <roundcube:if condition="config:preview_pane == true" />
@@ -82,6 +84,10 @@
       <roundcube:button command="select-all" type="link" prop="unread" title="unread" class="buttonPas unread" classAct="button unread" classSel="button unreadsel" content=" " />
       <roundcube:button command="select-all" type="link" prop="invert" title="invert" class="buttonPas invert" classAct="button invert" classSel="button invertsel" content=" " />
       <roundcube:button command="select-none" type="link" title="none" class="buttonPas none" classAct="button none" classSel="button nonesel" content=" " />
+      <span style="margin-left: 20px"><roundcube:label name="threads" />:&nbsp;</span>
+      <roundcube:button command="expand-all" type="link" title="expand-all" class="buttonPas expand-all" classAct="button expand-all" classSel="button expand-allsel" content=" "  />
+      <roundcube:button command="expand-unread" type="link" title="expand-unread" class="buttonPas expand-unread" classAct="button expand-unread" classSel="button expand-unreadsel" content=" " />
+      <roundcube:button command="collapse-all" type="link" title="collapse-all" class="buttonPas collapse-all" classAct="button collapse-all" classSel="button collapse-allsel" content=" " />
       <roundcube:container name="listcontrols" id="listcontrols" />
   <roundcube:if condition="env:quota" />
   <span style="margin-left: 20px; margin-right: 5px"><roundcube:label name="quota" />:</span>
@@ -111,7 +117,7 @@
 <roundcube:button name="markreadbutton" id="markreadbutton" type="link" class="button markmessage" title="markmessages" onclick="rcmail_ui.show_markmenu();return false" content=" " />
 <roundcube:button name="messagemenulink" id="messagemenulink" type="link" class="button messagemenu" title="messageactions" onclick="rcmail_ui.show_messagemenu();return false" content=" " />
 
-<div id="markmessagemenu">
+<div id="markmessagemenu" class="popupmenu">
   <ul class="toolbarmenu">
     <li><roundcube:button command="mark" prop="read" label="markread" classAct="readlink active" class="readlink" /></li>
     <li><roundcube:button command="mark" prop="unread" label="markunread" classAct="unreadlink active" class="unreadlink" /></li>
@@ -125,7 +131,7 @@
 
 </div>
 
-<div id="searchmenu">
+<div id="searchmenu" class="popupmenu">
   <ul class="toolbarmenu">
     <li><input type="checkbox" name="s_mods[]" value="subject" id="s_mod_subject" onclick="rcmail_ui.set_searchmod(this)" /><label for="s_mod_subject"><roundcube:label name="subject" /></label></li>
     <li><input type="checkbox" name="s_mods[]" value="from" id="s_mod_from" onclick="rcmail_ui.set_searchmod(this)" /><label for="s_mod_from"><roundcube:label name="from" /></label></li>
@@ -146,5 +152,52 @@
 <roundcube:button command="reset-search" id="searchreset" image="/images/icons/reset.gif" title="resetsearch" />
 </div>
 
+<div id="listmenu" class="popupmenu">
+<fieldset class="thinbordered"><legend><roundcube:label name="listmode" /></legend>
+  <ul class="toolbarmenu">
+    <li><input type="radio" name="view" value="list" id="view_default" /><label for="view_default"><roundcube:label name="list" /></label></li>
+    <roundcube:if condition="env:threads" />
+      <li><input type="radio" name="view" value="thread" id="view_thread" /><label for="view_thread"><roundcube:label name="threads" /></label></li>
+    <roundcube:else />
+      <li><input type="radio" name="view" value="thread" id="view_thread" disabled="disabled" /><label for="view_thread" class="disabled"><roundcube:label name="threads" /></label></li>
+    <roundcube:endif />
+  </ul>
+</fieldset>
+<fieldset class="thinbordered"><legend><roundcube:label name="listcolumns" /></legend>
+  <ul class="toolbarmenu">
+    <li><input type="checkbox" name="list_col[]" value="flag" id="cols_flag" /><label for="cols_flag"><roundcube:label name="flag" /></label></li>
+    <li><input type="checkbox" name="list_col[]" value="subject" id="cols_subject" checked="checked" disabled="disabled" /><label for="cols_subject" class="disabled"><roundcube:label name="subject" /></label></li>
+    <li><input type="checkbox" name="list_col[]" value="from" id="cols_fromto" /><label for="cols_fromto"><roundcube:label name="fromto" /></label></li>
+    <li><input type="checkbox" name="list_col[]" value="replyto" id="cols_replyto" /><label for="cols_replyto"><roundcube:label name="replyto" /></label></li>
+    <li><input type="checkbox" name="list_col[]" value="cc" id="cols_cc" /><label for="cols_cc"><roundcube:label name="cc" /></label></li>
+    <li><input type="checkbox" name="list_col[]" value="date" id="cols_date" /><label for="cols_date"><roundcube:label name="date" /></label></li>
+    <li><input type="checkbox" name="list_col[]" value="size" id="cols_size" /><label for="cols_size"><roundcube:label name="size" /></label></li>
+    <li><input type="checkbox" name="list_col[]" value="attachment" id="cols_attachment" /><label for="cols_attachment"><roundcube:label name="attachment" /></label></li>
+  </ul>
+</fieldset>
+<fieldset class="thinbordered"><legend><roundcube:label name="listsorting" /></legend>
+  <ul class="toolbarmenu">
+    <li><input type="radio" name="sort_col" value="" id="sort_default" /><label for="sort_default"><roundcube:label name="nonesort" /></label></li>
+    <li><input type="radio" name="sort_col" value="arrival" id="sort_arrival" /><label for="sort_arrival"><roundcube:label name="arrival" /></label></li>
+    <li><input type="radio" name="sort_col" value="date" id="sort_date" /><label for="sort_date"><roundcube:label name="sentdate" /></label></li>
+    <li><input type="radio" name="sort_col" value="subject" id="sort_subject" /><label for="sort_subject"><roundcube:label name="subject" /></label></li>
+    <li><input type="radio" name="sort_col" value="from" id="sort_fromto" /><label for="sort_fromto"><roundcube:label name="fromto" /></label></li>
+    <li><input type="radio" name="sort_col" value="to" id="sort_replyto" /><label for="sort_replyto"><roundcube:label name="replyto" /></label></li>
+    <li><input type="radio" name="sort_col" value="cc" id="sort_cc" /><label for="sort_cc"><roundcube:label name="cc" /></label></li>
+    <li><input type="radio" name="sort_col" value="size" id="sort_size" /><label for="sort_size"><roundcube:label name="size" /></label></li>
+  </ul>
+</fieldset>
+<fieldset><legend><roundcube:label name="listorder" /></legend> 
+	  <ul class="toolbarmenu"> 
+	    <li><input type="radio" name="sort_ord" value="ASC" id="sort_asc" /><label for="sort_asc"><roundcube:label name="asc" /></label></li> 
+	    <li><input type="radio" name="sort_ord" value="DESC" id="sort_desc" /><label for="sort_desc"><roundcube:label name="desc" /></label></li> 
+	  </ul> 
+</fieldset>
+<div>
+  <roundcube:button command="menu-open" id="listmenucancel" type="input" class="button" label="cancel" />
+  <roundcube:button command="menu-save" id="listmenusave" type="input" class="button mainaction" label="save" />
+</div>
+</div>
+
 </body>
 </html>