Larry continued...

7 files changed, 124 insertions, 42 deletions

diff --git a/skins/larry/images/buttons.png b/skins/larry/images/buttons.png
index 54ebc8378..f5117558d 100644
--- a/skins/larry/images/buttons.png
+++ b/skins/larry/images/buttons.png
diff --git a/skins/larry/includes/mailtoolbar.html b/skins/larry/includes/mailtoolbar.html
index 09a6f81c1..246a71576 100644
--- a/skins/larry/includes/mailtoolbar.html
+++ b/skins/larry/includes/mailtoolbar.html
@@ -14,7 +14,10 @@
 <roundcube:button command="forward" type="link" class="button forward disabled" classAct="button forward" classSel="button forward pressed" label="forwardmessage" />
 <span class="dropbuttontip" id="forwardmenulink" onclick="UI.show_popup('forwardmenu');return false"></span>
 </span>
-<roundcube:button command="delete" type="link" class="button delete disabled" classAct="button delete" classSel="button delete pressed" label="deletemessage" />
+<roundcube:button command="delete" type="link" class="button delete disabled" classAct="button delete" classSel="button delete pressed" label="delete" title="deletemessage" />
+<roundcube:if condition="template:name == 'message'" />
+<roundcube:button command="print" type="link" class="button print disabled" classAct="button print" classSel="button print pressed" label="print" />
+<roundcube:endif />
 <roundcube:container name="toolbar" id="mailtoolbar" />
 <roundcube:if condition="template:name == 'mail'" />
 <roundcube:button name="markmenulink" id="markmessagemenulink" type="link" class="button markmessage" label="markmessages" onclick="UI.show_popup('markmessagemenu');return false" />
diff --git a/skins/larry/mail.css b/skins/larry/mail.css
index 247873539..15046d2a3 100644
--- a/skins/larry/mail.css
+++ b/skins/larry/mail.css
@@ -76,6 +76,31 @@
 	display: inline-block;
 }
 
+#messagelistfooter #listcontrols {
+	display: inline-block;
+	margin-right: 2em;
+}
+
+a.iconbutton.listmode {
+	width: 26px;
+	height: 20px;
+	background-position: 0 -437px;
+}
+
+a.iconbutton.threadmode {
+	width: 26px;
+	height: 20px;
+	background-position: 0 -457px;
+}
+
+a.iconbutton.listmode.selected {
+	background-position: -26px -437px;
+}
+
+a.iconbutton.threadmode.selected {
+	background-position: -26px -457px;
+}
+
 #mailboxlist li.mailbox {
 	position: relative;
 	background-repeat: no-repeat;
@@ -234,6 +259,7 @@
 	right: 0;
 	left: 15em;
 	height: 40px;
+	white-space: nowrap;
 }
 
 #messagetoolbar.fullwidth {
@@ -251,11 +277,11 @@
 	right: 2px;
 	width: 20px;
 	height: 18px;
-	background: url(images/buttons.png) -5px -318px no-repeat;
+	background: url(images/buttons.png) -3px -418px no-repeat;
 }
 
 #mailpreviewtoggle.enabled {
-	background-position: -28px -318px;
+	background-position: -28px -418px;
 }
 
 
@@ -603,19 +629,29 @@ html.chrome #messagelist tr td.threads {
 	top: 140px;
 	left: 0;
 	width: 100%;
-	bottom: 32px;
+	bottom: 0;
 	overflow: auto;
+	border-radius: 4px 4px 0 0;
 }
 
 #messageheader,
 #partheader {
 	padding: 3px 0;
 	background: #fff;
-	background: -moz-linear-gradient(top, #fff 0%, #f0f0f0 100%);
-	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#fff), color-stop(100%,#f0f0f0));
-	background: -o-linear-gradient(top, #fff 0%, #f0f0f0 100%);
-	background: -ms-linear-gradient(top, #fff 0%, #f0f0f0 100%);
-	background: linear-gradient(top, #fff 0%, #f0f0f0 100%);
+	background: -moz-linear-gradient(top, #fff 0%, #e9e9e9 100%);
+	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#fff), color-stop(100%,#e9e9e9));
+	background: -o-linear-gradient(top, #fff 0%, #e9e9e9 100%);
+	background: -ms-linear-gradient(top, #fff 0%, #e9e9e9 100%);
+	background: linear-gradient(top, #fff 0%, #e9e9e9 100%);
+}
+
+h2.subject {
+	font-size: 15px;
+	margin: 0 15em 0 0;
+	padding: 4px 8px 2px 8px;
+	white-space: nowrap;
+	overflow: hidden;
+	text-overflow: ellipsis;
 }
 
 .headers-table td {
@@ -649,6 +685,21 @@ html.chrome #messagelist tr td.threads {
 	margin-left: 0.5em;
 }
 
+#messageheader #countcontrols {
+	position: absolute;
+	top: 8px;
+	right: 8px;
+	width: 18em;
+	text-align: right;
+	white-space: nowrap;
+}
+
+#messageheader .pagenav .countdisplay {
+	min-width: 0;
+	padding-right: 0.5em;
+	white-space: nowrap;
+}
+
 #messagecontent .leftcol {
 	margin-right: 250px;
 }
diff --git a/skins/larry/styles.css b/skins/larry/styles.css
index ebfe63e04..18c987d65 100644
--- a/skins/larry/styles.css
+++ b/skins/larry/styles.css
@@ -130,11 +130,11 @@ input.mainaction {
 
 a.button {
 	display: inline-block;
-	margin: 0 3px;
+	margin: 0 2px;
 	padding: 2px 5px;
 	color: #525252;
 	text-shadow: 1px 1px 1px #fff;
-	border: 1px solid #ddd;
+	border: 1px solid #c6c6c6;
 	border-radius: 4px;
 	background: #f7f7f7;
 	background: -moz-linear-gradient(top, #f9f9f9 0%, #e6e6e6 100%);
@@ -142,10 +142,10 @@ a.button {
 	background: -o-linear-gradient(top, #f9f9f9 0%, #e6e6e6 100%);
 	background: -ms-linear-gradient(top, #f9f9f9 0%, #e6e6e6 100%);
 	background: linear-gradient(top, #f9f9f9 0%, #e6e6e6 100%);
-	box-shadow: 0 2px 2px 0 #999;
-	-o-box-shadow: 0 2px 2px 0 #999;
-	-webkit-box-shadow: 0 2px 2px 0 #999;
-	-moz-box-shadow: 0 2px 2px 0 #999;
+	box-shadow: 0 1px 1px 0 #ccc;
+	-o-box-shadow: 0 1px 1px 0 #ccc;
+	-webkit-box-shadow: 0 1px 1px 0 #ccc;
+	-moz-box-shadow: 0 1px 1px 0 #ccc;
 	text-decoration: none;
 }
 
@@ -167,7 +167,7 @@ a.button:active {
 	background: linear-gradient(top, #e6e6e6 0%, #f9f9f9 100%);
 }
 
-.pagenav a.button {
+.pagenav.dark a.button {
 	font-weight: bold;
 	border-color: #e6e6e6;
 	background: #f7f7f7;
@@ -176,9 +176,13 @@ a.button:active {
 	background: -o-linear-gradient(top, #d8d8d8 0%, #bababa 100%);
 	background: -ms-linear-gradient(top, #d8d8d8 0%, #bababa 100%);
 	background: linear-gradient(top, #d8d8d8 0%, #bababa 100%);
+	box-shadow: 0 1px 1px 0 #999;
+	-o-box-shadow: 0 1px 1px 0 #999;
+	-webkit-box-shadow: 0 1px 1px 0 #999;
+	-moz-box-shadow: 0 1px 1px 0 #999;
 }
 
-.pagenav a.button.pressed {
+.pagenav.dark a.button.pressed {
 	background: #bababa;
 	background: -moz-linear-gradient(top, #bababa 0%, #d8d8d8 100%);
 	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#bababa), color-stop(100%,#d8d8d8));
@@ -221,6 +225,7 @@ a.iconbutton {
 	width: 24px;
 	height: 18px;
 	text-decoration: none;
+	text-indent: -1000px;
 	background: url(images/buttons.png) -1000px 0 no-repeat;
 }
 
@@ -550,7 +555,7 @@ table.listing {
 }
 
 .boxfooter .listbutton.groupactions .inner {
-	background-position: 4px -1212px;
+	background-position: 4px -1292px;
 }
 
 .errobox h3 {
@@ -780,45 +785,57 @@ table.propform td.title {
 	top: 0;
 	height: 42px;
 	width: 18px;
-	background: url(images/buttons.png) -24px -1049px no-repeat;
+	background: url(images/buttons.png) -24px -1129px no-repeat;
 	cursor: pointer;
 }
 
 .dropbutton .dropbuttontip:hover {
-	background-position: 0 -1049px;
+	background-position: 0 -1129px;
 }
 
 .toolbar a.button.back {
-	background-position: 0 -370px;
+	background-position: 0 -1170px;
 }
 
 .toolbar a.button.checkmail {
-	background-position: center -410px;
+	background-position: center -490px;
 }
 
 .toolbar a.button.compose {
-	background-position: center -450px;
+	background-position: center -530px;
 }
 
 .toolbar a.button.reply {
-	background-position: center -490px;
+	background-position: center -570px;
 }
 
 .toolbar a.button.reply-all {
-	background-position: center -530px;
+	background-position: center -610px;
 }
 
 .toolbar a.button.forward {
-	background-position: center -570px;
+	background-position: center -650px;
 }
 
 .toolbar a.button.delete {
-	background-position: center -610px;
+	background-position: center -690px;
+}
+
+.toolbar a.button.archive {
+	background-position: center -730px;
+}
+
+.toolbar a.button.junk {
+	background-position: center -770px;
+}
+
+.toolbar a.button.print {
+	background-position: center -810px;
 }
 
 .toolbar a.button.markmessage,
 .toolbar a.button.more {
-	background-position: center -770px;
+	background-position: center -850px;
 }
 
 /*** popup menus ***/
diff --git a/skins/larry/templates/mail.html b/skins/larry/templates/mail.html
index b6f333983..cc056ac8b 100644
--- a/skins/larry/templates/mail.html
+++ b/skins/larry/templates/mail.html
@@ -56,10 +56,11 @@
 <!-- list footer -->
 <div id="messagelistfooter">
 	<div id="listcontrols">
-		
+		<a href="#list" class="iconbutton listmode" id="maillistmode" title="<roundcube:label name='list' />">List</a>
+		<a href="#threads" class="iconbutton threadmode" id="mailthreadmode" title="<roundcube:label name='threads' />">Threads</a>
 	</div>
 
-	<div id="countcontrols" class="pagenav">
+	<div id="countcontrols" class="pagenav dark">
 		<roundcube:object name="messageCountDisplay" class="countdisplay" />
 		<roundcube:button command="firstpage" type="link" class="button firstpage disabled" classAct="button firstpage" classSel="button firstpage pressed" innerClass="inner" title="firstpage" content="|&amp;lt;" />
 		<roundcube:button command="previouspage" type="link" class="button prevpage disabled" classAct="button prevpage" classSel="button prevpage pressed" innerClass="inner" title="previouspage" content="&amp;lt;" />
diff --git a/skins/larry/templates/message.html b/skins/larry/templates/message.html
index 9cb5928c2..b73f647ca 100644
--- a/skins/larry/templates/message.html
+++ b/skins/larry/templates/message.html
@@ -31,8 +31,17 @@
 
 <div id="mailview-top">
 <div id="messageheader" class="uibox">
-<roundcube:object name="messageHeaders" class="headers-table" addicon="/images/addcontact.png" />
+<h2 class="subject"><roundcube:object name="messageHeaders" valueOf="subject" /></h2>
+<roundcube:object name="messageHeaders" class="headers-table" addicon="/images/addcontact.png" exclude="subject" />
 <roundcube:object name="messageFullHeaders" id="full-headers" />
+
+<!-- record navigation -->
+<div id="countcontrols" class="pagenav">
+	<roundcube:object name="messageCountDisplay" class="countdisplay" />
+	<roundcube:button command="previousmessage" type="link" class="button prevpage disabled" classAct="button prevpage" classSel="button prevpage pressed" innerClass="inner" title="previousmessage" content="&amp;lt;" />
+	<roundcube:button command="nextmessage" type="link" class="button nextpage disabled" classAct="button nextpage" classSel="button nextpage pressed" innerClass="inner" title="nextmessage" content="&amp;gt;" />
+</div>
+
 </div>
 
 <div id="messagecontent" class="uibox">
@@ -45,17 +54,6 @@
 </div>
 </div>
 
-<!-- list footer -->
-<div id="messagelistfooter" class="rightalign">
-	<div id="countcontrols" class="pagenav">
-		<roundcube:object name="messageCountDisplay" class="countdisplay" />
-		<roundcube:button command="firstmessage" type="link" class="button firstpage disabled" classAct="button firstpage" classSel="button firstpage pressed" innerClass="inner" title="firstmessage" content="|&amp;lt;" />
-		<roundcube:button command="previousmessage" type="link" class="button prevpage disabled" classAct="button prevpage" classSel="button prevpage pressed" innerClass="inner" title="previousmessage" content="&amp;lt;" />
-		<roundcube:button command="nextmessage" type="link" class="button nextpage disabled" classAct="button nextpage" classSel="button nextpage pressed" innerClass="inner" title="nextmessage" content="&amp;gt;" />
-		<roundcube:button command="lastmessage" type="link" class="button lastpage disabled" classAct="button lastpage" classSel="button lastpage pressed" innerClass="inner" title="lastmessage" content="&amp;gt;|" />
-	</div>
-</div>
-
 </div><!-- end mailview-top -->
 
 <div id="mailview-bottom" class="uibox">
diff --git a/skins/larry/ui.js b/skins/larry/ui.js
index 274b71b78..b20b53879 100644
--- a/skins/larry/ui.js
+++ b/skins/larry/ui.js
@@ -38,6 +38,8 @@ function rcube_mail_ui()
 //      rcmail.addEventListener('aftertoggle-editor', 'resize_compose_body_ev', rcmail_ui);
       rcmail.gui_object('message_dragmenu', 'dragmessagemenu');
       $('#mailpreviewtoggle').click(function(e){ toggle_preview_pane(e); return false });
+      $('#maillistmode').addClass(rcmail.env.threading ? 'unselected' : 'selected').click(function(e){ switch_view_mode('list'); return false });
+      $('#mailthreadmode').addClass(rcmail.env.threading ? 'selected' : 'unselected').click(function(e){ switch_view_mode('thread'); return false });
       
       if (rcmail.env.action == 'show' || rcmail.env.action == 'preview') {
         init_messageview();
@@ -176,6 +178,16 @@ function rcube_mail_ui()
   }
 
 
+  function switch_view_mode(mode)
+  {
+    if (rcmail.env.threading != (mode == 'thread'))
+      rcmail.set_list_options(null, undefined, undefined, mode == 'thread' ? 1 : 0);
+
+    $('#maillistmode, #mailthreadmode').removeClass('selected');
+    $('#mail'+mode+'mode').addClass('selected');
+  }
+
+
   /**** popup callbacks ****/
 
   function searchmenu(show)