Patch #32162 » progress_bar_recreate.diff
app/helpers/application_helper.rb | ||
---|---|---|
1445 | 1445 |
content_tag('p', legend, :class => 'percent').html_safe |
1446 | 1446 |
end |
1447 | 1447 | |
1448 | ||
1449 |
def bar_graph(pcts, options={}) |
|
1450 |
pcts = [pcts] unless pcts.is_a?(Array) |
|
1451 |
case pcts[0] |
|
1452 |
when Integer, Float |
|
1453 |
pcts = pcts.sort.reverse |
|
1454 |
bar = content_tag :div, :class => "bar-graph" do |
|
1455 |
content = pcts.each_with_index.collect do |p, index| |
|
1456 |
content_tag( 'span', '', |
|
1457 |
:style => "width: #{p}%", |
|
1458 |
:title => "#{p.floor}%" ) |
|
1459 |
end.join.html_safe |
|
1460 |
end |
|
1461 |
when Hash |
|
1462 |
pcts = pcts.sort_by{ |k| k[:pcts] }.reverse |
|
1463 |
bar = content_tag :div, :class => "bar-graph" do |
|
1464 |
content = pcts.each_with_index.collect do |p, index| |
|
1465 |
concat content_tag( 'span', '', |
|
1466 |
:style => "width: #{p[:pcts].floor}%", |
|
1467 |
:title => "#{p[:label] || ''}: #{p[:pcts].floor}%" ) |
|
1468 |
end.join.html_safe |
|
1469 |
end |
|
1470 |
end |
|
1471 |
legend = content_tag( 'p', options[:legend] || '', :class => 'legend' ).html_safe |
|
1472 |
content_tag( 'div', bar + legend, :class => "#{options[:class] || ''}" ) |
|
1473 |
end |
|
1474 | ||
1475 | ||
1448 | 1476 |
def checked_image(checked=true) |
1449 | 1477 |
if checked |
1450 | 1478 |
@checked_image_tag ||= content_tag(:span, nil, :class => 'icon-only icon-checked') |
app/helpers/issues_helper.rb | ||
---|---|---|
117 | 117 |
content_tag('td', link_to_issue(child, :project => (issue.project_id != child.project_id)), :class => 'subject', :style => 'width: 50%') + |
118 | 118 |
content_tag('td', h(child.status), :class => 'status') + |
119 | 119 |
content_tag('td', link_to_user(child.assigned_to), :class => 'assigned_to') + |
120 |
content_tag('td', child.disabled_core_fields.include?('done_ratio') ? '' : progress_bar(child.done_ratio), :class=> 'done_ratio') +
|
|
120 |
content_tag('td', child.disabled_core_fields.include?('done_ratio') ? '' : bar_graph(child.done_ratio, :class => 'progress-bar'), :class=> 'done_ratio') +
|
|
121 | 121 |
content_tag('td', buttons, :class => 'buttons'), |
122 | 122 |
:class => css) |
123 | 123 |
end |
... | ... | |
154 | 154 |
content_tag('td', other_issue.status, :class => 'status') + |
155 | 155 |
content_tag('td', format_date(other_issue.start_date), :class => 'start_date') + |
156 | 156 |
content_tag('td', format_date(other_issue.due_date), :class => 'due_date') + |
157 |
content_tag('td', other_issue.disabled_core_fields.include?('done_ratio') ? '' : progress_bar(other_issue.done_ratio), :class=> 'done_ratio') +
|
|
157 |
content_tag('td', other_issue.disabled_core_fields.include?('done_ratio') ? '' : bar_graph(other_issue.done_ratio, :class => 'progress-bar'), :class=> 'done_ratio') +
|
|
158 | 158 |
content_tag('td', buttons, :class => 'buttons'), |
159 | 159 |
:id => "relation-#{relation.id}", |
160 | 160 |
:class => css) |
app/helpers/queries_helper.rb | ||
---|---|---|
223 | 223 |
when :last_notes |
224 | 224 |
item.last_notes.present? ? content_tag('div', textilizable(item, :last_notes), :class => "wiki") : '' |
225 | 225 |
when :done_ratio |
226 |
progress_bar(value)
|
|
226 |
bar_graph(value, :class => 'progress-bar')
|
|
227 | 227 |
when :relations |
228 | 228 |
content_tag('span', |
229 | 229 |
value.to_s(item) {|other| link_to_issue(other, :subject => false, :tracker => false)}.html_safe, |
app/views/issues/show.html.erb | ||
---|---|---|
62 | 62 |
rows.right l(:field_due_date), issue_due_date_details(@issue), :class => 'due-date' |
63 | 63 |
end |
64 | 64 |
unless @issue.disabled_core_fields.include?('done_ratio') |
65 |
rows.right l(:field_done_ratio), progress_bar(@issue.done_ratio, :legend => "#{@issue.done_ratio}%"), :class => 'progress'
|
|
65 |
rows.right l(:field_done_ratio), bar_graph(@issue.done_ratio, :legend => "#{@issue.done_ratio}%", :class => 'progress-bar'), :class => 'progress'
|
|
66 | 66 |
end |
67 | 67 |
unless @issue.disabled_core_fields.include?('estimated_hours') |
68 | 68 |
rows.right l(:field_estimated_hours), issue_estimated_hours_details(@issue), :class => 'estimated-hours' |
app/views/versions/_issue_counts.html.erb | ||
---|---|---|
21 | 21 |
<% end %> |
22 | 22 |
</td> |
23 | 23 |
<td style="width:240px;"> |
24 |
<%= progress_bar((count[:closed].to_f / count[:total])*100,
|
|
25 |
:legend => "#{count[:closed]}/#{count[:total]}") %> |
|
24 |
<%= bar_graph((count[:closed].to_f / count[:total])*100,
|
|
25 |
:legend => "#{count[:closed]}/#{count[:total]}", :class => 'progress-bar') %>
|
|
26 | 26 |
</td> |
27 | 27 |
</tr> |
28 | 28 |
<% end %> |
app/views/versions/_overview.html.erb | ||
---|---|---|
15 | 15 |
<% end %> |
16 | 16 | |
17 | 17 |
<% if version.visible_fixed_issues.count > 0 %> |
18 |
<%= progress_bar([version.visible_fixed_issues.closed_percent, version.visible_fixed_issues.completed_percent], |
|
19 |
:titles => |
|
20 |
["%s: %i%%" % [l(:label_closed_issues_plural), version.visible_fixed_issues.closed_percent], |
|
21 |
"%s: %i%%" % [l(:field_done_ratio), version.visible_fixed_issues.completed_percent]], |
|
22 |
:legend => ('%i%%' % version.visible_fixed_issues.completed_percent)) %> |
|
18 |
<%= bar_graph([ |
|
19 |
{:pcts => version.visible_fixed_issues.closed_percent, :label => l(:label_closed_issues_plural)}, |
|
20 |
{:pcts => version.visible_fixed_issues.completed_percent, :label => l(:field_done_ratio)} |
|
21 |
], |
|
22 |
:legend => ('%i%%' % version.visible_fixed_issues.completed_percent), :class => 'progress-bar') %> |
|
23 | ||
23 | 24 |
<p class="progress-info"> |
24 | 25 |
<%= link_to(l(:label_x_issues, :count => version.visible_fixed_issues.count), |
25 | 26 |
version_filtered_issues_path(version, :status_id => '*')) %> |
public/stylesheets/application.css | ||
---|---|---|
1069 | 1069 |
} |
1070 | 1070 | |
1071 | 1071 |
/***** Progress bar *****/ |
1072 |
@keyframes graph { |
|
1073 |
0% { transform: scaleX(0); transform-origin: 0;} |
|
1074 |
100% { transform: scaleX(1); transform-origin: 0;} |
|
1075 |
} |
|
1076 | ||
1077 |
#relations .progress-bar { min-width: 100px; max-width: 150px; } |
|
1078 |
.version-overview .progress-bar { width: 30vw } |
|
1079 |
.attributes .progress-bar { width: 35%; height: 1em; } |
|
1080 |
.done-ratio .label { display: none; margin: 0; } |
|
1081 |
.progress-bar { display: flex; align-items: center; min-width: 50px; } |
|
1082 |
.progress-bar .legend { margin-left: 6px; } |
|
1083 |
.bar-graph { flex: 1 0 auto; position: relative; height: 7px; background: #ccc; } |
|
1084 |
.bar-graph span { transform: scaleX(0); animation: graph 500ms ease 100ms 1 forwards; height: inherit; position: absolute; top: 0; left: 0; transition: opacity 300ms ease; opacity: 1; } |
|
1085 |
.bar-graph span:nth-child(1) { background: #628db6; } |
|
1086 |
.bar-graph span:nth-child(2) { background: #3e5b76; } |
|
1087 |
.bar-graph span:nth-child(3) { background: #303030; } |
|
1088 |
.bar-graph:hover span:not(:hover) { opacity: 0.3; } |
|
1089 | ||
1072 | 1090 |
table.progress { |
1073 | 1091 |
border-collapse: collapse; |
1074 | 1092 |
border-spacing: 0pt; |