Makes tickets and timelogs filters collapsible (UI).

git-svn-id: svn+ssh://rubyforge.org/var/svn/redmine/trunk@2891 e93f8b46-1217-0410-a6f0-8f06a7374b81

diff --git a/app/views/issues/calendar.rhtml b/app/views/issues/calendar.rhtml
index 089482927615a1429b28462cc356a9880137b1a7..000e3cdc47d1c5a4318e263695aab1612f41ad12 100644 (file)
--- a/app/views/issues/calendar.rhtml
+++ b/app/views/issues/calendar.rhtml
@@ -1,20 +1,18 @@
 <% form_tag({}, :id => 'query_form') do %>
 <% if @query.new_record? %>
-    <h2><%= l(:label_calendar) %></h2>
-    <fieldset id="filters"><legend><%= l(:label_filter_plural) %></legend>
+<h2><%= l(:label_calendar) %></h2>
+<fieldset id="filters" class="collapsible">
+  <legend onclick="toggleFieldset(this);"><%= l(:label_filter_plural) %></legend>
+  <div>
     <%= render :partial => 'queries/filters', :locals => {:query => @query} %>
-    </fieldset>
+  </div>
+</fieldset>
 <% else %>
     <h2><%=h @query.name %></h2>
     <% html_title @query.name %>
 <% end %>
 
-<fieldset id="date-range"><legend><%= l(:label_date_range) %></legend>
-    <%= select_month(@month, :prefix => "month", :discard_type => true) %>
-    <%= select_year(@year, :prefix => "year", :discard_type => true) %>
-</fieldset>
-
-<p style="float:right; margin:0px;">
+<p style="float:right;">
 <%= link_to_remote ('&#171; ' + (@month==1 ? "#{month_name(12)} #{@year-1}" : "#{month_name(@month-1)}")), 
                         {:update => "content", :url => { :year => (@month==1 ? @year-1 : @year), :month =>(@month==1 ? 12 : @month-1) }},
                         {:href => url_for(:action => 'calendar', :year => (@month==1 ? @year-1 : @year), :month =>(@month==1 ? 12 : @month-1))}
@@ -26,6 +24,9 @@
 </p>
 
 <p class="buttons">
+<%= select_month(@month, :prefix => "month", :discard_type => true) %>
+<%= select_year(@year, :prefix => "year", :discard_type => true) %>
+
 <%= link_to_remote l(:button_apply), 
                    { :url => { :set_filter => (@query.new_record? ? 1 : nil) },
                      :update => "content",

diff --git a/app/views/issues/gantt.rhtml b/app/views/issues/gantt.rhtml
index 0b38982cecea7a32875f5102ba5a04d8cbaf7c9a..e1526cc1ca86b1308006bed7a8ad34091a442f69 100644 (file)
--- a/app/views/issues/gantt.rhtml
+++ b/app/views/issues/gantt.rhtml
@@ -1,23 +1,18 @@
 <% form_tag(params.merge(:month => nil, :year => nil, :months => nil), :id => 'query_form') do %>
 <% if @query.new_record? %>
-    <h2><%=l(:label_gantt)%></h2>
-    <fieldset id="filters"><legend><%= l(:label_filter_plural) %></legend>
+<h2><%=l(:label_gantt)%></h2>
+<fieldset id="filters" class="collapsible">
+  <legend onclick="toggleFieldset(this);"><%= l(:label_filter_plural) %></legend>
+       <div>
     <%= render :partial => 'queries/filters', :locals => {:query => @query} %>
-    </fieldset>
+  </div>
+</fieldset>
 <% else %>
     <h2><%=h @query.name %></h2>
     <% html_title @query.name %>
 <% end %>
 
-<fieldset id="date-range"><legend><%= l(:label_date_range) %></legend>
-    <%= text_field_tag 'months', @gantt.months, :size => 2 %>
-    <%= l(:label_months_from) %>
-    <%= select_month(@gantt.month_from, :prefix => "month", :discard_type => true) %>
-    <%= select_year(@gantt.year_from, :prefix => "year", :discard_type => true) %>
-    <%= hidden_field_tag 'zoom', @gantt.zoom %>
-</fieldset>
-
-<p style="float:right; margin:0px;">
+<p style="float:right;">
 <%= if @gantt.zoom < 4
     link_to_remote image_tag('zoom_in.png'), {:url => @gantt.params.merge(:zoom => (@gantt.zoom+1)), :update => 'content'}, {:href => url_for(@gantt.params.merge(:zoom => (@gantt.zoom+1)))}
   else
@@ -31,6 +26,12 @@
 </p>
 
 <p class="buttons">
+<%= text_field_tag 'months', @gantt.months, :size => 2 %>
+<%= l(:label_months_from) %>
+<%= select_month(@gantt.month_from, :prefix => "month", :discard_type => true) %>
+<%= select_year(@gantt.year_from, :prefix => "year", :discard_type => true) %>
+<%= hidden_field_tag 'zoom', @gantt.zoom %>
+
 <%= link_to_remote l(:button_apply), 
                    { :url => { :set_filter => (@query.new_record? ? 1 : nil) },
                      :update => "content",

diff --git a/app/views/issues/index.rhtml b/app/views/issues/index.rhtml
index e74dbafc1696b9c7ef5241a77c9e0212c4edd45a..408a00eaae546418e5d975b02beb4cfec0607860 100644 (file)
--- a/app/views/issues/index.rhtml
+++ b/app/views/issues/index.rhtml
@@ -5,11 +5,19 @@
     <% form_tag({ :controller => 'queries', :action => 'new' }, :id => 'query_form') do %>
     <%= hidden_field_tag('project_id', @project.to_param) if @project %>
                <div id="query_form_content">
-    <fieldset id="filters"><legend><%= l(:label_filter_plural) %></legend>
-    <%= render :partial => 'queries/filters', :locals => {:query => @query} %>
+    <fieldset id="filters" class="collapsible">
+       <legend onclick="toggleFieldset(this);"><%= l(:label_filter_plural) %></legend>
+       <div>
+               <%= render :partial => 'queries/filters', :locals => {:query => @query} %>
+       </div>
     </fieldset>
-               <p><%= l(:field_group_by) %>
-               <%= select_tag('group_by', options_for_select([[]] + @query.groupable_columns.collect {|c| [c.caption, c.name.to_s]}, @query.group_by)) %></p>
+    <fieldset class="collapsible collapsed">
+       <legend onclick="toggleFieldset(this);">Options</legend>
+       <div style="display: none;">
+                               <%= l(:field_group_by) %>
+                               <%= select_tag('group_by', options_for_select([[]] + @query.groupable_columns.collect {|c| [c.caption, c.name.to_s]}, @query.group_by)) %></p>
+                       </div>
+               </fieldset>
                </div>
     <p class="buttons">
 

diff --git a/app/views/timelog/_date_range.rhtml b/app/views/timelog/_date_range.rhtml
index 9b4557e1fd2c5354dba944f4b813a6f538a48998..0375d3457819675657463bfda3375a0f2ae00b2d 100644 (file)
--- a/app/views/timelog/_date_range.rhtml
+++ b/app/views/timelog/_date_range.rhtml
@@ -1,4 +1,6 @@
-<fieldset id="filters"><legend><%= l(:label_date_range) %></legend>
+<fieldset id="date-range" class="collapsible">
+<legend onclick="toggleFieldset(this);"><%= l(:label_date_range) %></legend>
+<div>
 <p>
 <%= radio_button_tag 'period_type', '1', !@free_period %>
 <%= select_tag 'period', options_for_period_select(params[:period]),
@@ -11,9 +13,16 @@
 <%= l(:label_date_from_to, :start => (text_field_tag('from', @from, :size => 10) + calendar_for('from')),
                                                                                                         :end => (text_field_tag('to', @to, :size => 10) + calendar_for('to'))) %>
 </span>
-<%= submit_tag l(:button_apply), :name => nil %>
 </p>
+</div>
 </fieldset>
+<p class="buttons">
+       <%= link_to_remote l(:button_apply), 
+                          { :url => { },
+                            :update => "content",
+                            :with => "Form.serialize('query_form')"
+                          }, :class => 'icon icon-checked' %>
+</p>
 
 <div class="tabs">
 <% url_params = @free_period ? { :from => @from, :to => @to } : { :period => params[:period] } %>

diff --git a/app/views/timelog/details.rhtml b/app/views/timelog/details.rhtml
index 20cf8cea4085aca754266febd947b392199fe3f9..eecfec2ebaa6f52a479ec62c639b35c79fdfa8b6 100644 (file)
--- a/app/views/timelog/details.rhtml
+++ b/app/views/timelog/details.rhtml
@@ -6,7 +6,7 @@
 \r
 <h2><%= l(:label_spent_time) %></h2>\r
 \r
-<% form_remote_tag( :url => {}, :html => {:method => :get}, :method => :get, :update => 'content' ) do %>\r
+<% form_remote_tag( :url => {}, :html => {:method => :get, :id => 'query_form'}, :method => :get, :update => 'content' ) do %>\r
 <%# TOOD: remove the project_id and issue_id hidden fields, that information is\r
 already in the URI %>\r
 <%= hidden_field_tag('project_id', params[:project_id]) if @project %>\r

diff --git a/app/views/timelog/report.rhtml b/app/views/timelog/report.rhtml
index 52bd11f4820898023d758ca1520415b02085999c..2107fcf729e2ebb211cc7eb9e795aacd67a4c40e 100644 (file)
--- a/app/views/timelog/report.rhtml
+++ b/app/views/timelog/report.rhtml
@@ -6,7 +6,7 @@
 
 <h2><%= l(:label_spent_time) %></h2>
 
-<% form_remote_tag(:url => {}, :html => {:method => :get}, :method => :get, :update => 'content') do %>
+<% form_remote_tag(:url => {}, :html => {:method => :get, :id => 'query_form'}, :method => :get, :update => 'content') do %>
   <% @criterias.each do |criteria| %>
     <%= hidden_field_tag 'criterias[]', criteria, :id => nil %>
   <% end %>

diff --git a/public/images/arrow_collapsed.png b/public/images/arrow_collapsed.png
new file mode 100644 (file)
index 0000000..abe1f1d
Binary files /dev/null and b/public/images/arrow_collapsed.png differ

diff --git a/public/images/arrow_expanded.png b/public/images/arrow_expanded.png
new file mode 100644 (file)
index 0000000..4daa4f7
Binary files /dev/null and b/public/images/arrow_expanded.png differ

diff --git a/public/javascripts/application.js b/public/javascripts/application.js
index 93d4a8bda187e283198218d77430e46f63fccd74..cc75c81800177418ca38a6603fe5d2f99d2ecfe7 100644 (file)
--- a/public/javascripts/application.js
+++ b/public/javascripts/application.js
@@ -33,6 +33,12 @@ function toggleRowGroup(el) {
        }
 }
 
+function toggleFieldset(el) {
+       var fieldset = Element.up(el, 'fieldset');
+       fieldset.toggleClassName('collapsed');
+       Effect.toggle(fieldset.down('div'), 'slide', {duration:0.2});
+}
+
 var fileFieldCount = 1;
 
 function addFileField() {

diff --git a/public/stylesheets/application.css b/public/stylesheets/application.css
index d4249dfb8376dd44d60f1d79526493cd11d4e66d..61f039b0476dc1b7fc787e0d9bcf61953de7ddee 100644 (file)
--- a/public/stylesheets/application.css
+++ b/public/stylesheets/application.css
@@ -200,17 +200,16 @@ p.breadcrumb { font-size: 0.9em; margin: 4px 0 4px 0;}
 p.subtitle { font-size: 0.9em; margin: -6px 0 12px 0; font-style: italic; } 
 p.footnote { font-size: 0.9em; margin-top: 0px; margin-bottom: 0px; }
 
-#query_form_content { font-size: 0.9em; padding: 4px; background: #f6f6f6; border: 1px solid #e4e4e4; }
-#query_form_content fieldset#filters { border-left: 0; border-right: 0; }
-#query_form_content p { margin-top: 0.5em; margin-bottom: 0.5em; }
+fieldset.collapsible { border-width: 1px 0 0 0; font-size: 0.9em; }
+fieldset.collapsible legend { padding-left: 16px; background: url(../images/arrow_expanded.png) no-repeat 0% 40%; cursor:pointer; }
+fieldset.collapsible.collapsed legend { background-image: url(../images/arrow_collapsed.png); }
 
-fieldset#filters, fieldset#date-range { padding: 0.7em; margin-bottom: 8px; }
-fieldset#filters p { margin: 1.2em 0 0.8em 2px; }
+fieldset#date-range p { margin: 2px 0 2px 0; }
 fieldset#filters table { border-collapse: collapse; }
 fieldset#filters table td { padding: 0; vertical-align: middle; }
 fieldset#filters tr.filter { height: 2em; }
 fieldset#filters td.add-filter { text-align: right; vertical-align: top; }
-.buttons { font-size: 0.9em; margin-bottom: 1.4em; }
+.buttons { font-size: 0.9em; margin-bottom: 1.4em; margin-top: 1em; }
 
 div#issue-changesets {float:right; width:45%; margin-left: 1em; margin-bottom: 1em; background: #fff; padding-left: 1em; font-size: 90%;}
 div#issue-changesets .changeset { padding: 4px;}