Closes #176 restyle attachments to be more responsive

While keeping the same features 😀
merge-requests/2/head
Mike Koch 9 years ago
parent e9ff6b42ea
commit 79ebb90789

@ -1355,41 +1355,33 @@ function hesk_listAttachments($attachments='', $reply=0, $white=1)
return false;
}
/* Style and mousover/mousout */
$tmp = $white ? 'White' : 'Blue';
$style = 'class="option'.$tmp.'OFF" onmouseover="this.className=\'option'.$tmp.'ON\'" onmouseout="this.className=\'option'.$tmp.'OFF\'"';
/* List attachments */
echo '<p><b>'.$hesklang['attachments'].':</b><br />';
echo '<p><b>'.$hesklang['attachments'].':</b></p><br />';
$att=explode(',',substr($attachments, 0, -1));
$columnNumber = 0;
echo '<div class="row">';
echo '<div class="table-responsive">';
echo '<table class="table table-striped attachment-table">';
echo '<thead><tr><th>&nbsp;</th><th>'.$hesklang['file_name'].'</th><th>'.$hesklang['action'].'</th></tr></thead>';
echo '<tbody>';
foreach ($att as $myatt)
{
$columnNumber++;
if ($columnNumber > 4)
{
echo '</div><div class="row">';
$columnNumber = 1;
}
list($att_id, $att_name) = explode('#', $myatt);
echo '<div class="col-md-3 col-sm-6 col-xs-12">';
list($att_id, $att_name) = explode('#', $myatt);
$fileparts = pathinfo($att_name);
$fontAwesomeIcon = hesk_getFontAwesomeIconForFileExtension($fileparts['extension']);
echo '
<div class="panel panel-default file-attachment-panel">
<div class="panel-body file-attachment">';
<tr>
<td>';
//-- File is an image
if ($fontAwesomeIcon == 'fa fa-file-image-o') {
//-- Get the actual image location and display a thumbnail. It will be linked to a modal to view a larger size.
$path = hesk_getSavedNameUrlForAttachment($att_id);
if ($path == '') {
echo '<i class="fa fa-ban fa-4x"></i>';
echo '<i class="fa fa-ban fa-4x" data-toggle="tooltip" title="'.$hesklang['attachment_removed'].'"></i>';
} else {
echo '<img class="img-responsive attachment-image" src="'.$path.'" alt="'.$hesklang['image'].'" data-toggle="modal" data-target="#modal-attachment-'.$att_id.'">';
echo '<span data-toggle="tooltip" title="'.$hesklang['click_to_preview'].'">
<img src="'.$path.'" alt="'.$hesklang['image'].'" data-toggle="modal" data-target="#modal-attachment-'.$att_id.'">
</span>';
echo '<div class="modal fade" id="modal-attachment-'.$att_id.'" tabindex="-1" role="dialog" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
@ -1412,25 +1404,28 @@ function hesk_listAttachments($attachments='', $reply=0, $white=1)
//-- Display the FontAwesome icon in the panel's body
echo '<i class="'.$fontAwesomeIcon.' fa-4x"></i>';
}
echo '</div>
<div class="panel-footer">
echo'
</td>
<td>
<p>'.$att_name.'</p>
</td>
<td>
<div class="btn-group">';
/* Can edit and delete tickets? */
if ($can_edit && $can_delete)
{
echo '<a class="btn btn-danger" href="admin_ticket.php?delatt='.$att_id.'&amp;reply='.$reply.'&amp;track='.$trackingID.'&amp;Refresh='.mt_rand(10000,99999).'&amp;token='.hesk_token_echo(0).'" onclick="return hesk_confirmExecute(\''.hesk_makeJsString($hesklang['pda']).'\');" data-toggle="tooltip" data-placement="top" data-original-title="'.$hesklang['delete'].'"><i class="fa fa-times"></i></a> ';
}
echo '
<a class="btn btn-success" href="../download_attachment.php?att_id='.$att_id.'&amp;track='.$trackingID.'" data-toggle="tooltip" data-placement="top" data-original-title="'.$hesklang['dnl'].'"><i class="fa fa-arrow-down"></i></a>
</div>
<p><br>'.$att_name.'</p>
';
echo '</div>
</div>
echo '<a class="btn btn-success" href="../download_attachment.php?att_id='.$att_id.'&amp;track='.$trackingID.'"
data-toggle="tooltip" data-placement="top" data-original-title="'.$hesklang['dnl'].'">
<i class="fa fa-arrow-down"></i>
</a>';
echo '</div>
</td>
</tr>
';
echo '</div>';
}
echo '</div>';
echo '</tbody></table></div>';
return true;
} // End hesk_listAttachments()

@ -376,20 +376,17 @@ button.dropdown-submit {
border:none;
}
.file-attachment {
min-height: 100px;
max-height: 100px;
text-align: center;
}
.file-attachment > i {
padding-top: 10px;
.attachment-table > tbody > tr > td > i {
color: #ddd;
text-shadow: 2px 2px #ccc;
}
.attachment-image {
margin: -15px;
display:inline-block;
.attachment-table > tbody > tr > td {
vertical-align: middle;
}
.attachment-table > tbody > tr > td > span > img {
max-height: 80px;
max-width: 80px;
cursor: pointer;
}

@ -370,20 +370,17 @@ button.dropdown-submit {
border:none;
}
.file-attachment {
min-height: 100px;
max-height: 100px;
text-align: center;
}
.file-attachment > i {
padding-top: 10px;
.attachment-table > tbody > tr > td > i {
color: #ddd;
text-shadow: 2px 2px #ccc;
}
.attachment-image {
margin: -15px;
display:inline-block;
.attachment-table > tbody > tr > td {
vertical-align: middle;
}
.attachment-table > tbody > tr > td > span > img {
max-height: 80px;
max-width: 80px;
cursor: pointer;
}

@ -21,11 +21,15 @@ $hesklang['_COLLATE']='utf8_unicode_ci';
// This is the email break line that will be used in email piping
$hesklang['EMAIL_HR']='------ Reply above this line ------';
// ADDED OR MODIFIED IN Mods for HESK 2.2.0
// ADDED OR MODIFIED IN Mods for HESK 2.1.1
$hesklang['new_article_default_type'] = 'Default Type for New Articles';
$hesklang['new_article_default_type_help'] = 'Choose the default type for new knowledgebase articles.';
$hesklang['kb_draft3'] = 'The article is saved but not yet published. It can only be read by staff who has permission to
manage knowledgebase articles.'; // This is exactly the same as kb_draft2 with all HTML removed
$hesklang['file_name'] = 'File Name';
$hesklang['action'] = 'Action';
$hesklang['click_to_preview'] = 'Click to preview';
$hesklang['attachment_removed'] = 'This attachment has been removed and cannot be viewed / downloaded';
// ADDED OR MODIFIED IN Mods for HESK 2.1.0
$hesklang['e_mfh_settings'] = 'You will not be able to save your settings unless this file is writable by the script (CHMOD to 666)!';

Loading…
Cancel
Save