diff options
author | thomascube <thomas@roundcube.net> | 2010-03-17 12:24:09 +0000 |
---|---|---|
committer | thomascube <thomas@roundcube.net> | 2010-03-17 12:24:09 +0000 |
commit | f52c936f4d451a5d3a87d2501aa5a1701cdafde5 (patch) | |
tree | e95611d6d47ea75e76d15ebbdea1daf4a3de83ba /skins/default | |
parent | f4f1c442f7eb3edbb48dbcc705c6d83dcaf8e021 (diff) |
Merged devel-threads branch (r3066:3364) back into trunk
Diffstat (limited to 'skins/default')
-rw-r--r-- | skins/default/common.css | 10 | ||||
-rw-r--r-- | skins/default/functions.js | 87 | ||||
-rw-r--r-- | skins/default/ie6hacks.css | 13 | ||||
-rw-r--r-- | skins/default/iehacks.css | 24 | ||||
-rw-r--r-- | skins/default/images/icons/columnpicker.gif | bin | 0 -> 133 bytes | |||
-rw-r--r-- | skins/default/images/icons/unread_children.png | bin | 0 -> 441 bytes | |||
-rw-r--r-- | skins/default/images/mail_footer.png | bin | 1143 -> 1186 bytes | |||
-rw-r--r-- | skins/default/images/messageactions.gif | bin | 1112 -> 1268 bytes | |||
-rw-r--r-- | skins/default/images/messageactions.png | bin | 1637 -> 2079 bytes | |||
-rw-r--r-- | skins/default/includes/messagemenu.html | 2 | ||||
-rw-r--r-- | skins/default/mail.css | 158 | ||||
-rw-r--r-- | skins/default/templates/mail.html | 59 |
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 Binary files differnew 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 Binary files differnew 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 Binary files differindex 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 Binary files differindex 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 Binary files differindex 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" />: </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> |