1
0
mirror of https://github.com/meineerde/redmine.git synced 2026-01-31 11:37:14 +00:00

Replaces legacy del and attachment icons with SVG in attachments form (#42576).

git-svn-id: https://svn.redmine.org/redmine/trunk@23667 e93f8b46-1217-0410-a6f0-8f06a7374b81
This commit is contained in:
Marius Balteanu 2025-04-18 11:43:31 +00:00
parent 41ed48fd7d
commit 727edd15a6
3 changed files with 23 additions and 8 deletions

View File

@ -5,9 +5,13 @@
*/
function addFile(inputEl, file, eagerUpload) {
var attachmentsFields = $(inputEl).closest('.attachments_form').find('.attachments_fields');
var addAttachment = $(inputEl).closest('.attachments_form').find('.add_attachment');
var attachmentsForm = $(inputEl).closest('.attachments_form')
var attachmentsFields = attachmentsForm.find('.attachments_fields');
var attachmentsIcons = attachmentsForm.find('.attachments_icons');
var addAttachment = attachmentsForm.find('.add_attachment');
var maxFiles = ($(inputEl).attr('multiple') == 'multiple' ? 10 : 1);
var delIcon = attachmentsIcons.find('svg.svg-del').clone();
var attachmentIcon = attachmentsIcons.find('svg.svg-attachment').clone();
if (attachmentsFields.children().length < maxFiles) {
var attachmentId = addFile.nextAttachmentId++;
@ -16,12 +20,14 @@ function addFile(inputEl, file, eagerUpload) {
if (!param) {param = 'attachments'};
fileSpan.append(
attachmentIcon,
$('<input>', { type: 'text', 'class': 'icon icon-attachment filename readonly', name: param +'[' + attachmentId + '][filename]', readonly: 'readonly'} ).val(file.name),
$('<input>', { type: 'text', 'class': 'description', name: param + '[' + attachmentId + '][description]', maxlength: 255, placeholder: $(inputEl).data('description-placeholder') } ).toggle(!eagerUpload),
$('<input>', { type: 'hidden', 'class': 'token', name: param + '[' + attachmentId + '][token]'} ),
$('<a>&nbsp</a>').attr({ href: "#", 'class': 'icon-only icon-del remove-upload' }).click(removeFile).toggle(!eagerUpload)
$('<a>', { href: "#", 'class': 'icon-only icon-del remove-upload' }).append(delIcon).click(removeFile).toggle(!eagerUpload)
).appendTo(attachmentsFields);
if ($(inputEl).data('description') == 0) {
fileSpan.find('input.description').remove();
}
@ -63,7 +69,7 @@ function ajaxUpload(file, attachmentId, fileSpan, inputEl) {
.done(function(result) {
addInlineAttachmentMarkup(file);
progressSpan.progressbar( 'value', 100 ).remove();
fileSpan.find('input.description, a').css('display', 'inline-block');
fileSpan.find('input.description, a').css('display', 'inline-flex');
})
.fail(function(result) {
progressSpan.text(result.statusText);

View File

@ -1111,10 +1111,10 @@ span.required {color: #bb0000;}
.attachments_fields input.description, #existing-attachments input.description {margin-left:4px; width:340px;}
.attachments_fields>span, #existing-attachments>span {display:block; white-space:nowrap;}
/* ToDo: delete this line when legacy icons are deleted */
.attachments_fields , #existing-attachments .icon-attachment {background-image: none; padding-left: 0}
.attachments_fields .icon-attachment, #existing-attachments .icon-attachment {background-image: none; padding-left: 0}
.attachments_fields input.filename, #existing-attachments .filename {border:0; width:250px; color:#555; background-color:inherit; }
.tabular input.filename {max-width:75% !important;}
.attachments_fields input.filename {height:1.8em;}
.attachments_fields input.filename {height:1.8em;padding-right: 0;}
.attachments_fields .ajax-waiting input.filename {background:url(/hourglass.png) no-repeat 0px 50%;}
.attachments_fields .ajax-loading input.filename {background:url(/loading.gif) no-repeat 0px 50%;}
.attachments_fields div.ui-progressbar { width: 100px; height:14px; margin: 2px 0 -5px 8px; display: inline-block; }
@ -1856,6 +1856,11 @@ svg.s18 {
height: 1.125rem;
}
svg.s16 {
width: 1rem;
height: 1rem;
}
svg.s14 {
width: 0.875rem;
height: 0.875rem;

View File

@ -7,17 +7,21 @@
<% css_class = (defined?(filedrop) && filedrop == false ? '' : (attachment_format_custom_field ? 'custom-field-filedrop' : 'filedrop')) %>
<span class="attachments_form">
<span class="attachments_icons hidden">
<%= sprite_icon('del', icon_only: true, css_class: 'svg-del') %>
<%= sprite_icon('attachment', icon_only: true, size: 16, css_class: 'svg-attachment') %>
</span>
<span class="attachments_fields">
<% if saved_attachments.present? %>
<% saved_attachments.each_with_index do |attachment, i| %>
<span id="attachments_p<%= i %>">
<%= text_field_tag("#{attachment_param}[p#{i}][filename]", attachment.filename, :class => 'filename') %>
<% if attachment.container_id.present? %>
<%= link_to l(:label_delete), "#", :onclick => "$(this).closest('.attachments_form').find('.add_attachment').show(); $(this).parent().remove(); return false;", :class => 'icon-only icon-del' %>
<%= link_to sprite_icon('del', l(:button_delete), icon_only: true), "#", :onclick => "$(this).closest('.attachments_form').find('.add_attachment').show(); $(this).parent().remove(); return false;", :class => 'icon-only icon-del' %>
<%= hidden_field_tag "#{attachment_param}[p#{i}][id]", attachment.id %>
<% else %>
<%= text_field_tag("#{attachment_param}[p#{i}][description]", attachment.description, :maxlength => 255, :placeholder => l(:label_optional_description), :class => 'description') if description %>
<%= link_to('&nbsp;'.html_safe, attachment_path(attachment, :attachment_id => "p#{i}", :format => 'js'), :method => 'delete', :remote => true, :class => 'icon-only icon-del remove-upload') %>
<%= link_to(sprite_icon('del', l(:button_delete), icon_only: true), attachment_path(attachment, :attachment_id => "p#{i}", :format => 'js'), :method => 'delete', :remote => true, :class => 'icon-only icon-del remove-upload') %>
<%= hidden_field_tag "#{attachment_param}[p#{i}][token]", attachment.token %>
<% end %>
</span>