Micke/roundcubemail-plugins-kolab
0
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Align the event/task attachment viewer with the attachment view from mail view

Browse source
This commit is contained in:
Thomas Bruederli 2015-01-21 10:29:50 +01:00
parent 7b9d36b039
commit afa4133177
7 changed files with 203 additions and 55 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
plugins/calendar/skins/classic/templates/attachment.html
View file

@ -9,7 +9,7 @@
<roundcube:include file="/includes/header.html" /> <roundcube:include file="/includes/header.html" />
<div id="partheader"> <div id="partheader">
<roundcube:object name="plugin.attachmentcontrols" cellpadding="2" cellspacing="0" /> <roundcube:object name="plugin.attachmentcontrols" cellpadding="2" cellspacing="0" downloadlink="true" />
<div style="position:absolute; top:2px; right:0; width:12em; text-align:right"> <div style="position:absolute; top:2px; right:0; width:12em; text-align:right">
[<a href="#close" class="closelink" onclick="self.close()"><roundcube:label name="close" /></a>] [<a href="#close" class="closelink" onclick="self.close()"><roundcube:label name="close" /></a>]

58
plugins/calendar/skins/larry/calendar.css
View file

@ -34,10 +34,6 @@ body.calendarmain #mainscreen {
} }
} }
body.calendar.attachmentwin #mainscreen {
top: 32px;
}
#calendarsidebar { #calendarsidebar {
position: absolute; position: absolute;
top: 0; top: 0;
@ -568,15 +564,21 @@ a.miniColors-trigger {
margin-top: -3px; margin-top: -3px;
} }
#attachmentcontainer { .calendar.attachmentwin #attachmenttoolbar {
position: absolute; position: relative;
top: 60px; top: -6px;
left: 0px; height: 40px;
right: 0px;
bottom: 0px;
} }
#attachmentframe { .calendar.attachmentwin #attachmentcontainer {
position: absolute;
top: 0;
left: 232px;
right: 0;
bottom: 0;
}
.calendar.attachmentwin #attachmentframe {
width: 100%; width: 100%;
height: 100%; height: 100%;
border: 0; border: 0;
@ -584,29 +586,33 @@ a.miniColors-trigger {
border-radius: 4px; border-radius: 4px;
} }
#partheader { .calendar.attachmentwin #partheader {
position: relative; position: absolute;
padding: 3px 0; top: 0;
background: #f9f9f9; left: 0;
background: -moz-linear-gradient(top, #fff 0%, #e9e9e9 100%); width: 220px;
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#fff), color-stop(100%,#e9e9e9)); bottom: 0;
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%);
} }
#partheader table td { .calendar.attachmentwin #partheader table {
table-layout: fixed;
overflow: hidden;
}
.calendar.attachmentwin #partheader table td {
color: #666; color: #666;
padding: 2px 8px; padding: 4px 6px;
text-overflow: ellipsis;
overflow: hidden;
} }
#partheader table td.header { .calendar.attachmentwin #partheader table td.header {
font-weight: bold; font-weight: bold;
} }
#partheader table td.title a { .calendar.attachmentwin #partheader table td.title {
color: #666; width: 60px;
text-decoration: none; padding-right: 0;
} }
#edit-attachments { #edit-attachments {

54
plugins/calendar/skins/larry/templates/attachment.html
View file

@ -7,26 +7,58 @@
<body class="extwin calendar attachmentwin"> <body class="extwin calendar attachmentwin">
<div id="header"> <div id="header">
<div id="topnav"> <div id="topline" role="banner" aria-labelledby="aria-label-topnav">
<div class="topright"> <div class="topleft">
<a href="#close" class="closelink" onclick="self.close()"><roundcube:label name="close" /></a> <roundcube:container name="topline-left" id="topline-left" />
</div>
</div> </div>
<roundcube:container name="topline-center" id="topline-center" />
<br style="clear:both" /> <div class="topright">
<roundcube:container name="topline-right" id="topline-right" />
<roundcube:button name="close" type="link" label="close" class="closelink" onclick="self.close()" />
</div>
</div>
</div> </div>
<div id="mainscreen"> <div id="mainscreen">
<div id="partheader" class="uibox">
<roundcube:object name="plugin.attachmentcontrols" class="headers-table" /> <h1 class="voice"><roundcube:label name="attachment" />: <roundcube:var name="env:filename" /></h1>
<h2 id="aria-label-toolbar" class="voice"><roundcube:label name="arialabeltoolbar" /></h2>
<div id="attachmenttoolbar" class="toolbar fullwidth" role="toolbar" aria-labelledby="aria-label-toolbar">
<roundcube:button command="download-attachment" type="link" class="button download disabled" classAct="button download" classSel="button download pressed" label="download" title="download" />
<roundcube:button command="print-attachment" type="link" class="button print disabled" classAct="button print" classSel="button print pressed" label="print" title="print" />
<roundcube:container name="toolbar" id="messagetoolbar" />
</div>
<div id="mainscreencontent">
<div id="partheader" class="uibox listbox" role="contentinfo" aria-labelledby="aria-label-contentinfo">
<h2 class="boxtitle" id="aria-label-contentinfo"><roundcube:label name="properties" /></h2>
<div class="scroller">
<roundcube:object name="plugin.attachmentcontrols" class="listing" />
</div>
</div> </div>
<div id="attachmentcontainer" class="uibox"> <div id="attachmentcontainer" class="uibox" role="main" aria-labelledby="aria-label-messagepart">
<roundcube:object name="plugin.attachmentframe" id="attachmentframe" class="header-table" style="width:100%" /> <h2 id="aria-label-messagepart" class="voice"><roundcube:label name="arialabelattachmentpreview" /></h2>
<div class="iframebox">
<roundcube:object name="plugin.attachmentframe" id="attachmentframe" frameborder="0" title="arialabelattachmentpreview" />
</div>
</div> </div>
</div> </div>
</div>
<script type="text/javascript">
$(document).ready(function() {
if (window.rcube_splitter) {
new rcube_splitter({ id:'mailpartsplitterv', p1:'#partheader', p2:'#attachmentcontainer',
orientation:'v', relative:true, start:226, min:150, size:12}).init();
}
});
</script>
</body> </body>
</html> </html>

14
plugins/libcalendaring/libcalendaring.js
View file

@ -1140,4 +1140,18 @@ window.rcmail && rcmail.addEventListener('init', function(evt) {
$('.rsvp-buttons').on('click', 'a.reply-comment-toggle', function(e){ $('.rsvp-buttons').on('click', 'a.reply-comment-toggle', function(e){
$(this).hide().parent().find('textarea').show().focus(); $(this).hide().parent().find('textarea').show().focus();
}); });
if (rcmail.env.action == 'get-attachment' && rcmail.gui_objects['attachmentframe']) {
rcmail.register_command('print-attachment', function() {
var frame = rcmail.get_frame_window(rcmail.gui_objects['attachmentframe'].id);
if (frame) frame.print();
}, true);
}
if (rcmail.env.action == 'get-attachment' && rcmail.env.attachment_download_url) {
rcmail.register_command('download-attachment', function() {
rcmail.location_href(rcmail.env.attachment_download_url, window);
}, true);
}
}); });

19
plugins/libcalendaring/libcalendaring.php
View file

@ -1217,6 +1217,8 @@ class libcalendaring extends rcube_plugin
$attrib['src'] = './?' . str_replace('_frame=', ($ctype_primary == 'text' ? '_show=' : '_preload='), $_SERVER['QUERY_STRING']); $attrib['src'] = './?' . str_replace('_frame=', ($ctype_primary == 'text' ? '_show=' : '_preload='), $_SERVER['QUERY_STRING']);
$this->rc->output->add_gui_object('attachmentframe', $attrib['id']);
return html::iframe($attrib); return html::iframe($attrib);
} }
@ -1225,12 +1227,23 @@ class libcalendaring extends rcube_plugin
*/ */
public function attachment_header($attrib = array()) public function attachment_header($attrib = array())
{ {
$table = new html_table(array('cols' => 3)); $rcmail = rcmail::get_instance();
$dl_link = strtolower($attrib['downloadlink']) == 'true';
$dl_url = $this->rc->url(array('_frame' => null, '_download' => 1) + $_GET);
$table = new html_table(array('cols' => $dl_link ? 3 : 2));
if (!empty($this->attachment['name'])) { if (!empty($this->attachment['name'])) {
$table->add('title', Q($this->rc->gettext('filename'))); $table->add('title', Q($this->rc->gettext('filename')));
$table->add('header', Q($this->attachment['name'])); $table->add('header', Q($this->attachment['name']));
$table->add('download-link', html::a('?'.str_replace('_frame=', '_download=', $_SERVER['QUERY_STRING']), Q($this->rc->gettext('download')))); if ($dl_link) {
$table->add('download-link', html::a($dl_url, Q($this->rc->gettext('download'))));
}
}
if (!empty($this->attachment['mimetype'])) {
$table->add('title', Q($this->rc->gettext('type')));
$table->add('header', Q($this->attachment['mimetype']));
} }
if (!empty($this->attachment['size'])) { if (!empty($this->attachment['size'])) {
@ -1238,6 +1251,8 @@ class libcalendaring extends rcube_plugin
$table->add('header', Q(show_bytes($this->attachment['size']))); $table->add('header', Q(show_bytes($this->attachment['size'])));
} }
$this->rc->output->set_env('attachment_download_url', $dl_url);
return $table->show($attrib); return $table->show($attrib);
} }

56
plugins/tasklist/skins/larry/tasklist.css
View file

@ -30,10 +30,6 @@ ul.toolbarmenu li span.icon.taskadd,
display: none; display: none;
} }
body.tasklist.attachmentwin #mainscreen {
top: 32px;
}
.tasklistview #mainscreen { .tasklistview #mainscreen {
min-width: 1000px !important; min-width: 1000px !important;
min-height: 520px !important; min-height: 520px !important;
@ -1393,6 +1389,58 @@ div.messagetasklinks .messagetaskref input.complete {
} }
.tasklist.attachmentwin #attachmenttoolbar {
position: relative;
top: -6px;
height: 40px;
}
.tasklist.attachmentwin #attachmentcontainer {
position: absolute;
top: 0;
left: 232px;
right: 0;
bottom: 0;
}
.tasklist.attachmentwin #attachmentframe {
width: 100%;
height: 100%;
border: 0;
background-color: #fff;
border-radius: 4px;
}
.tasklist.attachmentwin #partheader {
position: absolute;
top: 0;
left: 0;
width: 220px;
bottom: 0;
}
.tasklist.attachmentwin #partheader table {
table-layout: fixed;
overflow: hidden;
}
.tasklist.attachmentwin #partheader table td {
color: #666;
padding: 4px 6px;
text-overflow: ellipsis;
overflow: hidden;
}
.tasklist.attachmentwin #partheader table td.header {
font-weight: bold;
}
.tasklist.attachmentwin #partheader table td.title {
width: 60px;
padding-right: 0;
}
/** Special hacks for IE7 **/ /** Special hacks for IE7 **/
/** They need to be in this file to also affect the task-create dialog embedded in mail view **/ /** They need to be in this file to also affect the task-create dialog embedded in mail view **/

55
plugins/tasklist/skins/larry/templates/attachment.html
View file

@ -7,26 +7,59 @@
<body class="extwin tasklist attachmentwin"> <body class="extwin tasklist attachmentwin">
<div id="header"> <div id="header">
<div id="topnav"> <div id="topline" role="banner" aria-labelledby="aria-label-topnav">
<div class="topright"> <div class="topleft">
<a href="#close" class="closelink" onclick="self.close()"><roundcube:label name="close" /></a> <roundcube:container name="topline-left" id="topline-left" />
</div>
</div> </div>
<roundcube:container name="topline-center" id="topline-center" />
<br style="clear:both" /> <div class="topright">
<roundcube:container name="topline-right" id="topline-right" />
<roundcube:button name="close" type="link" label="close" class="closelink" onclick="self.close()" />
</div>
</div>
</div> </div>
<div id="mainscreen"> <div id="mainscreen">
<div id="partheader" class="uibox">
<roundcube:object name="plugin.attachmentcontrols" class="headers-table" /> <h1 class="voice"><roundcube:label name="attachment" />: <roundcube:var name="env:filename" /></h1>
<h2 id="aria-label-toolbar" class="voice"><roundcube:label name="arialabeltoolbar" /></h2>
<div id="attachmenttoolbar" class="toolbar fullwidth" role="toolbar" aria-labelledby="aria-label-toolbar">
<roundcube:button command="download-attachment" type="link" class="button download disabled" classAct="button download" classSel="button download pressed" label="download" title="download" />
<roundcube:button command="print-attachment" type="link" class="button print disabled" classAct="button print" classSel="button print pressed" label="print" title="print" />
<roundcube:container name="toolbar" id="messagetoolbar" />
</div>
<div id="mainscreencontent">
<div id="partheader" class="uibox listbox" role="contentinfo" aria-labelledby="aria-label-contentinfo">
<h2 class="boxtitle" id="aria-label-contentinfo"><roundcube:label name="properties" /></h2>
<div class="scroller">
<roundcube:object name="plugin.attachmentcontrols" class="listing" />
</div>
</div> </div>
<div id="attachmentcontainer" class="uibox"> <div id="attachmentcontainer" class="uibox" role="main" aria-labelledby="aria-label-messagepart">
<roundcube:object name="plugin.attachmentframe" id="attachmentframe" class="header-table" style="width:100%" /> <h2 id="aria-label-messagepart" class="voice"><roundcube:label name="arialabelattachmentpreview" /></h2>
<div class="iframebox">
<roundcube:object name="plugin.attachmentframe" id="attachmentframe" frameborder="0" title="arialabelattachmentpreview" />
</div>
</div> </div>
</div> </div>
</div>
<script type="text/javascript">
$(document).ready(function() {
if (window.rcube_splitter) {
new rcube_splitter({ id:'mailpartsplitterv', p1:'#partheader', p2:'#attachmentcontainer',
orientation:'v', relative:true, start:226, min:150, size:12}).init();
}
});
</script>
</body> </body>
</html> </html>