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; |