From 6996dee8567b32144c10aea5bf8db7feb07c2ce6 Mon Sep 17 00:00:00 2001
From: Thomas Bruederli <thomas@roundcube.net>
Date: Thu, 21 Mar 2013 06:56:21 -0400
Subject: [PATCH] Add switch for text/html alternative part view (#1486939)

---
 skins/larry/templates/message.html        |   15 +++++++
 skins/larry/styles.css                    |   66 ++++++++++++++++++++++++++++++++-
 skins/larry/svggradients.css              |    7 +++
 skins/larry/images/buttons.png            |    0 
 skins/larry/iehacks.css                   |    7 +++
 skins/larry/mail.css                      |    8 +++
 skins/larry/templates/messagepreview.html |   11 +++++
 7 files changed, 109 insertions(+), 5 deletions(-)

diff --git a/skins/larry/iehacks.css b/skins/larry/iehacks.css
index 871cce4..960ce76 100644
--- a/skins/larry/iehacks.css
+++ b/skins/larry/iehacks.css
@@ -29,7 +29,8 @@
 	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#2a2e31', endColorstr='#505050', GradientType=0);
 }
 
-a.button {
+a.button,
+.buttongroup {
 	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#f9f9f9', endColorstr='#e6e6e6', GradientType=0);
 }
 
@@ -47,6 +48,10 @@
 	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#bababa', endColorstr='#d8d8d8', GradientType=0);
 }
 
+.buttongroup a.button.selected {
+	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#909090', endColorstr='#858585', GradientType=0);
+}
+
 #message.statusbar {
 	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#eaeaea', endColorstr='#c8c8c8', GradientType=0);
 }
diff --git a/skins/larry/images/buttons.png b/skins/larry/images/buttons.png
index 0ec061a..54bee01 100644
--- a/skins/larry/images/buttons.png
+++ b/skins/larry/images/buttons.png
Binary files differ
diff --git a/skins/larry/mail.css b/skins/larry/mail.css
index e6529d1..71ff785 100644
--- a/skins/larry/mail.css
+++ b/skins/larry/mail.css
@@ -950,7 +950,8 @@
 	border-radius: 4px;
 }
 
-#messageheader #countcontrols {
+#messageheader #countcontrols,
+#messageheader #formatcontrols {
 	position: absolute;
 	top: 8px;
 	right: 8px;
@@ -958,6 +959,11 @@
 	white-space: nowrap;
 }
 
+#messageheader #formatcontrols {
+	top: 38px;
+	right: 8px;
+}
+
 #messageheader .pagenav .countdisplay {
 	min-width: 0;
 	padding-right: 0.5em;
diff --git a/skins/larry/styles.css b/skins/larry/styles.css
index 1e3e6f7..ddfe8ef 100644
--- a/skins/larry/styles.css
+++ b/skins/larry/styles.css
@@ -177,7 +177,8 @@
 
 /** link buttons **/
 
-a.button {
+a.button,
+.buttongroup {
 	display: inline-block;
 	margin: 0 2px;
 	padding: 2px 5px;
@@ -196,6 +197,11 @@
 	-webkit-box-shadow: 0 1px 1px 0 rgba(140, 140, 140, 0.3);
 	-moz-box-shadow: 0 1px 1px 0 rgba(140, 140, 140, 0.3);
 	text-decoration: none;
+}
+
+.buttongroup {
+	padding: 0;
+	white-space: nowrap;
 }
 
 a.button:focus,
@@ -229,6 +235,29 @@
 a.button.disabled span.inner {
 	opacity: 0.4;
 	filter: alpha(opacity=40);
+}
+
+.buttongroup a.button {
+	margin: 0;
+	border-width: 0 1px 0 0;
+	border-radius: 0;
+	background: none;
+	box-shadow: none;
+	-o-box-shadow: none;
+	-webkit-box-shadow: none;
+	-moz-box-shadow: none;
+}
+
+.buttongroup a.button.first,
+.buttongroup a.button:first-child {
+	border-radius: 4px 0 0 4px;
+	border-left: 0;
+}
+
+.buttongroup a.button.last,
+.buttongroup a.button:last-child {
+	border-radius: 0 4px 4px 0;
+	border-right: 0;
 }
 
 a.button.pressed,
@@ -266,11 +295,30 @@
 	background: linear-gradient(top, #bababa 0%, #d8d8d8 100%);
 }
 
+.buttongroup a.button.selected {
+	background: #8a8a8a;
+	background: -moz-linear-gradient(top, #909090 0%, #858585 100%);
+	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#909090), color-stop(100%,#858585));
+	background: -o-linear-gradient(top, #909090 0%, #858585 100%);
+	background: -ms-linear-gradient(top, #909090 0%, #858585 100%);
+	background: linear-gradient(top, #909090 0%, #858585 100%);
+	-webkit-box-shadow: inset 0 1px 2px 0 #555;
+	-moz-box-shadow: inset 0 1px 2px 0 #555;
+	box-shadow: inset 0 1px 2px 0 #555;
+	border-right-color: #555;
+	border-left-color: #555;
+}
+
 .pagenav a.button {
 	padding: 1px 3px;
 	height: 16px;
 	vertical-align: middle;
 	margin-bottom: 1px;
+}
+
+.pagenav .buttongroup a.button {
+	padding: 1px 5px;
+	margin-bottom: 0;
 }
 
 .pagenav a.button span.inner {
@@ -316,6 +364,20 @@
 
 .pagenav a.extwin span.inner {
 	background-position: -29px -271px;
+}
+
+.pagenav a.changeformat.html span.inner {
+	background-position: -7px -1859px;
+}
+.pagenav a.changeformat.html.selected span.inner {
+	background-position: -29px -1859px;
+}
+
+.pagenav a.changeformat.text span.inner {
+	background-position: -7px -1874px;
+}
+.pagenav a.changeformat.text.selected span.inner {
+	background-position: -29px -1874px;
 }
 
 .pagenav .countdisplay {
@@ -2230,7 +2292,7 @@
 .attachmentslist li a.drop {
 	background: url(images/buttons.png) no-repeat scroll center -1570px;
 	width: 14px;
-	height: 26px;
+	height: 20px;
 	cursor: pointer;
 	position: absolute;
 	right: 0;
diff --git a/skins/larry/svggradients.css b/skins/larry/svggradients.css
index 2172ac3..c40d44f 100644
--- a/skins/larry/svggradients.css
+++ b/skins/larry/svggradients.css
@@ -29,7 +29,8 @@
 	background-image: url(svggradient.php?c=2a2e31;505050);
 }
 
-a.button {
+a.button,
+.buttongroup {
 	background-image: url(svggradient.php?c=f9f9f9;e6e6e6);
 }
 
@@ -47,6 +48,10 @@
 	background-image: url(svggradient.php?c=bababa;d8d8d8);
 }
 
+.buttongroup a.button.selected {
+	background-image: url(svggradient.php?c=909090;858585);
+}
+
 #message.statusbar {
 	background-image: url(svggradient.php?c=eaeaea;c8c8c8);
 }
diff --git a/skins/larry/templates/message.html b/skins/larry/templates/message.html
index 36e0efa..0e19afa 100644
--- a/skins/larry/templates/message.html
+++ b/skins/larry/templates/message.html
@@ -54,6 +54,21 @@
 	<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>
 
+<roundcube:if condition="env:optional_format=='text'" />
+<div class="pagenav" id="formatcontrols">
+	<span class="buttongroup">
+		<roundcube:button command="change-format" prop="html" type="link" class="button first changeformat html selected" innerClass="inner" title="changeformathtml" /><roundcube:button command="change-format" prop="text" type="link" class="button last changeformat text" classSel="button last changeformat text pressed" innerClass="inner" title="changeformattext" />
+	</span>
+</div>
+<roundcube:elseif condition="env:optional_format=='html'" />
+<div class="pagenav" id="formatcontrols">
+	<span class="buttongroup">
+		<roundcube:button command="change-format" prop="html" type="link" class="button first changeformat html" classSel="button first changeformat html pressed" innerClass="inner" title="changeformathtml" /><roundcube:button command="change-format" prop="text" type="link" class="button last changeformat text selected" innerClass="inner" title="changeformattext" />
+	</span>
+</div>
+<roundcube:endif />
+
+
 <div id="contactphoto"><roundcube:object name="contactphoto" /></div>
 </div>
 
diff --git a/skins/larry/templates/messagepreview.html b/skins/larry/templates/messagepreview.html
index dbfe2dc..12a9f2d 100644
--- a/skins/larry/templates/messagepreview.html
+++ b/skins/larry/templates/messagepreview.html
@@ -30,6 +30,17 @@
 
 <!-- record navigation -->
 <div id="countcontrols" class="pagenav">
+<roundcube:if condition="env:optional_format=='text'" />
+	<span class="buttongroup">
+		<roundcube:button command="change-format" prop="html" type="link" class="button first changeformat html selected" innerClass="inner" title="changeformathtml" /><roundcube:button command="change-format" prop="text" type="link" class="button last changeformat text" classSel="button changeformat text pressed" innerClass="inner" title="changeformattext" />
+	</span>
+	&nbsp;
+<roundcube:elseif condition="env:optional_format=='html'" />
+	<span class="buttongroup">
+		<roundcube:button command="change-format" prop="html" type="link" class="button first changeformat html" classSel="button changeformat html pressed" innerClass="inner" title="changeformathtml" /><roundcube:button command="change-format" prop="text" type="link" class="button last changeformat text selected" innerClass="inner" title="changeformattext" />
+	</span>
+	&nbsp;
+<roundcube:endif />
 <roundcube:if condition="env:mailbox != config:drafts_mbox">
 	<roundcube:button command="reply" type="link" class="button reply" classSel="button reply pressed" innerClass="inner" title="replytomessage" content="&lt;-" />
 	<roundcube:button command="reply-all" type="link" class="button replyall" classSel="button replyall pressed" innerClass="inner" title="replytoallmessage" content="&lt;&lt;-" />

--
Gitblit v1.9.1