TheDude
/
openproject
2
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Merge pull request #2612 from opf/feature/18329-foundation-apps-framework-forms-refactor-timelines

Browse Source 
Feature/18329 foundation apps framework forms refactor timelines
pull/2549/head
Alex Coles 10 years ago
parent d72147813e 82b3e7b60c
commit 0324b5cd39
10 changed files with 262 additions and 115 deletions
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Show Stats Download Patch File Download Diff File
  1. 39
      app/assets/stylesheets/content/_forms.md
  2. 19
      app/assets/stylesheets/content/_forms.sass
  3. 18
      app/assets/stylesheets/timelines.css.sass
  4. 7
      app/helpers/timelines_helper.rb
  5. 66
      app/views/timelines/_comparison.html.erb
  6. 25
      app/views/timelines/_general.html.erb
  7. 69
      app/views/timelines/filter/_projects.html.erb
  8. 6
      config/locales/de.yml
  9. 6
      config/locales/en.yml
  10. 2
      lib/tabular_form_builder.rb

39
app/assets/stylesheets/content/_forms.md
Unescape View File

@ -234,6 +234,45 @@
One never lies about one's age.
</div>
</div>
<div class="form--grouping" role="group" aria-labelledby="form-grouping-label">
<div id="form-grouping-label" class="form--grouping-label">Colors:</div>
<div class="form--grouping-row">
<div class="form--field">
<label class="form--label">Most favorite first:</label>
<div class="form--field-container">
<div class="form--text-field-container">
<input type="text" class="form--text-field" placeholder="Green">
</div>
</div>
</div>
<div class="form--field">
<label class="form--label">Most favorite second:</label>
<div class="form--field-container">
<div class="form--text-field-container">
<input type="text" class="form--text-field" placeholder="Blue">
</div>
</div>
</div>
</div>
<div class="form--grouping-row">
<div class="form--field">
<label class="form--label">Least favorite first:</label>
<div class="form--field-container">
<div class="form--text-field-container">
<input type="text" class="form--text-field" placeholder="Magenta">
</div>
</div>
</div>
<div class="form--field">
<label class="form--label">Least favorite second:</label>
<div class="form--field-container">
<div class="form--text-field-container">
<input type="text" class="form--text-field" placeholder="Orange">
</div>
</div>
</div>
</div>
</div>
</fieldset>
</form>
```

19
app/assets/stylesheets/content/_forms.sass
Unescape View File

@ -350,6 +350,25 @@ fieldset.form--fieldset
.form &
margin-bottom: 0.5rem
.form--grouping
@include grid-block($wrap: true)
align-items: center
.form--grouping-row
@include grid-block(10)
.form--grouping-row + .form--grouping-row
@include grid-offset(2)
.form--grouping-label
@include grid-content(2)
@include label-style
padding: 0 1rem 0 0
font-size: $form-label-fontsize
line-height: $base-line-height
color: $form-label-color
margin-bottom: 0.8rem
.form--table
border: 0 none
background: none

18
app/assets/stylesheets/timelines.css.sass
Unescape View File

@ -85,30 +85,18 @@ li.select2-result.select2-visible-selected-parent
.select2-choices
width: 500px
#s2id_reporting_reported_project_status_id, #s2id_reporting_reporting_to_project_id, #s2id_timeline_select, #s2id_timeline_options_columns, #s2id_timeline_options_initial_outline_expansion, #s2id_timeline_options_zoom_factor, #s2id_project_association_select_project_b_id, #s2id_timeline_options_grouping_one_sort, #s2id_timeline_options_project_sort, #s2id_timeline_options_grouping_two_sort
width: 250px
#project-search-container .select2-container
margin-left: 0
.select2-container
vertical-align: middle
margin-left: 5px
#s2id_timeline_options_compare_to_relative_unit, #s2id_timeline_options_planning_element_time_relative_one_unit, #s2id_timeline_options_planning_element_time_relative_two_unit
margin-right: 1em
.timelines_edit_form
.calendar-trigger
margin-right: 1em
input
margin-left: 1em
#timeline_options_compare_to_relative
padding-right: 5px
text-align: right
width: 40px
/* Hack for as long as select2 is in there.
.select2-container.form--select
border: none
/* ╭───────────────────────────────────────────────────────────────────╮ *
* │ Timeline toolbar & icons. │ *

7
app/helpers/timelines_helper.rb
Unescape View File

@ -81,6 +81,13 @@ module TimelinesHelper
s
end
def options_for_timeunits(selected = nil)
options_for_select([[l('timelines.filter.time_relative.days'), 0],
[l('timelines.filter.time_relative.weeks'), '1'],
[l('timelines.filter.time_relative.months'), '2']],
selected)
end
def options_for_project_types
ProjectType.all.map { |t| [t.name, t.id] }
end

66
app/views/timelines/_comparison.html.erb
Unescape View File

@ -35,33 +35,75 @@ See doc/COPYRIGHT.rdoc for more details.
<div style="display:none;">
<%= f.fields_for :options, timeline_options do |ff| %>
<div class="form--field">
<%= ff.label :comparison, l('timelines.filter.comparison.none'), for: :timeline_options_comparison_none %>
<%= ff.label :comparison, l('timelines.filter.comparison.none'),
for: :timeline_options_comparison_none,
class: "form--label" %>
<div class="form--field-container">
<div class="form--radio-button-container">
<%= ff.radio_button :comparison, "none", no_label: true %>
</div>
</div>
</div>
<div class="form--field">
<%= ff.label :comparison, l('timelines.filter.comparison.relative'), for: :timeline_options_comparison_relative %>
<%= ff.label :comparison, l('timelines.filter.comparison.relative'),
for: :timeline_options_comparison_relative,
class: "form--label" %>
<div class="form--field-container">
<%= ff.radio_button :comparison, "relative", no_label: true %>
<%= ff.label :compare_to_relative, l('timelines.filter.comparison.compare_relative', timespan: "") %>
<%= ff.text_field :compare_to_relative, no_label: true %>
<%= ff.radio_button :comparison, "relative" %>
</div>
</div>
<div class="form--grouping">
<div id="timeline--form--project-filter-timeframe"
class="form--grouping-label">
<span class="hidden-for-sighted">
<%= l('timelines.filter.comparison.relative') %>
</span>
</div>
<div class="form--grouping-row">
<div class="form--field">
<%= ff.text_field :compare_to_relative, label: l('timelines.filter.comparison.compare_relative_prefix') %>
</div>
<div class="form--field">
<div class="form--field-container inline-label">
<%= ff.select :compare_to_relative_unit,
[ [l('timelines.filter.time_relative.days'), 0],
[l('timelines.filter.time_relative.weeks'), '1'],
[l('timelines.filter.time_relative.months'), '2']
], label: "" # FIXME: this breaks with no_label: true
%>
options_for_timeunits(nil),
no_label: true %>
<span class="form-label -transparent"><%=l('timelines.filter.comparison.compare_relative_suffix')%></span>
</div>
</div>
</div>
</div>
<div class="form--field">
<%= ff.label :comparison, l('timelines.filter.comparison.absolute'), for: :timeline_options_comparison_absolute %>
<%= ff.label :comparison,
l('timelines.filter.comparison.absolute'),
for: :timeline_options_comparison_absolute,
class: "form--label" %>
<div class="form--field-container">
<%= ff.radio_button :comparison, "absolute", no_label: true %>
<%= ff.radio_button :comparison, "absolute" %>
</div>
</div>
<div class="form--grouping">
<div id="timeline--form--project-filter-timeframe"
class="form--grouping-label">
<span class="hidden-for-sighted">
<%= l('timelines.filter.comparison.absolute') %>
</span>
</div>
<div class="form--grouping-row">
</div>
<div class="form--grouping-row">
<div class="form--field">
<%= ff.text_field :compare_to_absolute, label: l('timelines.filter.comparison.compare_absolute', date: "") %>
<%= calendar_for('timeline_options_compare_to_absolute') %>
</div>
</div>
</div>
<% end %>
</div>
</fieldset>

25
app/views/timelines/_general.html.erb
Unescape View File

@ -32,6 +32,7 @@ See doc/COPYRIGHT.rdoc for more details.
<a href="javascript:"><%= l('timelines.filter.timeline') %></a>
</legend>
<div>
<div class="form--field">
<%= f.text_field :name, required: true %>
</div>
@ -56,9 +57,13 @@ See doc/COPYRIGHT.rdoc for more details.
label: l("timelines.filter.outline")) %>
</div>
<h4>
<div class="form--grouping" role="group" aria-labelledby="timeline--form--timeframe">
<div id="timeline--form--timeframe"
class="form--grouping-label"
title="<%= l('timelines.filter.timeframe') %>">
<%= l('timelines.filter.timeframe') %>
</h4>
</div>
<div class="form--grouping-row">
<div class="form--field">
<%= ff.text_field :timeframe_start, label: l('timelines.filter.timeframe_start') %>
<%= calendar_for('timeline_options_timeframe_start') %>
@ -67,6 +72,8 @@ See doc/COPYRIGHT.rdoc for more details.
<%= ff.text_field :timeframe_end, label: l('timelines.filter.timeframe_end') %>
<%= calendar_for('timeline_options_timeframe_end') %>
</div>
</div>
</div>
<div class="form--field">
<% if User.current.impaired? %>
<%= ff.select :columns, internationalized_columns_select(timeline.available_columns),
@ -74,12 +81,22 @@ See doc/COPYRIGHT.rdoc for more details.
{:multiple => true,
:size => 12} %>
<% else %>
<%= ff.label :columns, l("timelines.filter.columns") %>
<%= ff.hidden_field :columns, name: "timeline[options][columns][]", id: "timeline_options_columns_", value: timeline.selected_columns.join(","), :"data-values" => internationalized_columns_select_object(timeline.available_columns).concat(timeline.custom_field_columns).to_json %>
<%= ff.label :columns,
l("timelines.filter.columns"),
for: "timeline_options_columns_",
class: "form--label" %>
<div class="form--field-container">
<%= ff.hidden_field :columns,
name: "timeline[options][columns][]",
id: "timeline_options_columns_",
value: timeline.selected_columns.join(","),
:"data-values" => internationalized_columns_select_object(timeline.available_columns).concat(timeline.custom_field_columns).to_json %>
</div>
<% end %>
</div>
<div class="form--field">
<%= ff.select :project_sort, [[l('timelines.filter.sort.date'), 0], [l('timelines.filter.sort.alphabet'), '1']], label: l('timelines.filter.sort.project_sortation') %>
</div>
<% end %>
</div>
</fieldset>

69
app/views/timelines/filter/_projects.html.erb
Unescape View File

@ -147,38 +147,73 @@ See doc/COPYRIGHT.rdoc for more details.
}) %>
<% end %>
</div>
<h4><%= l('timelines.filter.project_time_filter_absolute_timeframe') %></h4>
<div class="form--grouping" role="group" aria-labelledby="timeline--form--project-filter-timeframe">
<div id="timeline--form--project-filter-timeframe"
class="form--grouping-label">
<%= l('timelines.filter.project_time_filter_timeframe') %>
</div>
<div class="form--grouping-row">
<div class="form--field">
<%= ff.label :planning_element_time_absolute,
l('timelines.filter.comparison.absolute'),
class: "form--label" %>
<div class="form--field-container">
<div class="form--radio-button-container">
<%= ff.radio_button :planning_element_time, 'absolute' %>
</div>
<div class="form--field-container">
<%= ff.label :planning_element_time_absolute_one %>
</div>
</div>
</div>
<div class="form--grouping-row">
<div class="form--field">
<%= ff.text_field :planning_element_time_absolute_one, label: l('timelines.filter.project_time_filter_historical_from') %>
<%= calendar_for :timeline_options_planning_element_time_absolute_one %>
</div>
<div class="form--field">
<%= ff.text_field :planning_element_time_absolute_two, label: l('timelines.filter.project_time_filter_historical_to') %>
<%= calendar_for :timeline_options_planning_element_time_absolute_two %>
</div>
<h4><%= l('timelines.filter.project_time_filter_relative_timeframe') %></h4>
</div>
<div class="form--grouping-row">
<hr class="form--separator">
</div>
<div class="form--grouping-row">
<div class="form--field">
<%= ff.label :planning_element_time_relative,
l('timelines.filter.comparison.relative'),
class: "form--label" %>
<div class="form--field-container">
<div class="form--radio-button-container">
<%= ff.radio_button :planning_element_time, 'relative' %>
</div>
<div class="form--field-container">
</div>
</div>
</div>
<div class="form--grouping-row">
<div class="form--field">
<%= ff.text_field :planning_element_time_relative_one, label: l('timelines.filter.project_time_filter_historical_from') %>
</div>
<div class="form--field">
<%= ff.select :planning_element_time_relative_one_unit,
[ [l('timelines.filter.time_relative.days'), 0],
[l('timelines.filter.time_relative.weeks'), '1'],
[l('timelines.filter.time_relative.months'), '2']
],
{ :selected => timeline.options['planning_element_time_relative_one_unit'], label: "" },
{ :multiple => false, :size => 1 } %>
options_for_timeunits(timeline.options['planning_element_time_relative_one_unit']),
no_label: true %>
</div>
<div class="form--field">
<%= ff.text_field :planning_element_time_relative_two, label: l('timelines.filter.project_time_filter_historical_to') %>
</div>
<div class="form--field">
<%= ff.select :planning_element_time_relative_two_unit,
[ [l('timelines.filter.time_relative.days'), 0],
[l('timelines.filter.time_relative.weeks'), '1'],
[l('timelines.filter.time_relative.months'), '2']
],
{ :selected => timeline.options['planning_element_time_relative_one_unit'], label: "" },
{ :multiple => false, :size => 1} %>
options_for_timeunits(timeline.options['planning_element_time_relative_two_unit']),
no_label: true %>
</div>
</div>
</div>
<% end %>
</div>

6
config/locales/de.yml
Unescape View File

@ -1480,7 +1480,8 @@ de:
absolute: "Absolut"
none: "Kein Planungsvergleich"
relative: "Relativ"
compare_relative: "Vergleiche aktuelle Planung mit vor %{timespan}"
compare_relative_prefix: "Vergleiche aktuelle Planung mit vor"
compare_relative_suffix: ""
compare_absolute: "Vergleiche aktuelle Planung mit %{date}"
time_relative:
days: "Tagen"
@ -1506,8 +1507,7 @@ de:
work_package_assignee: "Zugewiesen an"
project_time_filter: "Projekte mit Arbeitspaket eines Typs in einem Zeitfenster"
project_time_filter_absolute_timeframe: "Absolutes Zeitfenster"
project_time_filter_relative_timeframe: "Relatives Zeitfenster"
project_time_filter_absolute_timeframe: "Zeitfenster"
project_time_filter_historical_from: "von"
project_time_filter_historical_to: "bis"
project_time_filter_historical: "%{start_label} %{startdate} %{end_label} %{enddate}"

6
config/locales/en.yml
Unescape View File

@ -1477,7 +1477,8 @@ en:
absolute: "Absolute"
none: "None"
relative: "Relative"
compare_relative: "Compare current planning to %{timespan} ago"
compare_relative_prefix: "Compare current planning to"
compare_relative_suffix: "ago"
compare_absolute: "Compare current planning to %{date}"
time_relative:
days: "days"
@ -1505,8 +1506,7 @@ en:
status: "Show status"
project_time_filter: "Projects with a work package of a certain type in a certain timeframe"
project_time_filter_absolute_timeframe: "Absolute timeframe"
project_time_filter_relative_timeframe: "Relative timeframe"
project_time_filter_timeframe: "Timeframe"
project_time_filter_historical_from: "from"
project_time_filter_historical_to: "to"
project_time_filter_historical: "%{start_label} %{startdate} %{end_label} %{enddate}"

2
lib/tabular_form_builder.rb
Unescape View File

@ -151,7 +151,7 @@ class TabularFormBuilder < ActionView::Helpers::FormBuilder
# Returns a label tag for the given field
def label_for_field(field, options = {}, translation_form = nil)
options = options.dup
return '' if options.delete(:no_label)
return ''.html_safe if options.delete(:no_label)
text = options[:label].is_a?(Symbol) ? l(options[:label]) : options[:label]
text ||= @object.class.human_attribute_name(field.to_sym) if @object.is_a?(ActiveRecord::Base)
text += @template.content_tag('span', ' *', class: 'required') if options.delete(:required)

Write Preview
Loading…
Cancel
Save