hover remove for filters. looks a bit odd, still

git-svn-id: https://dev.finn.de/svn/cockpit/branches/reporting_merge@1767 7926756e-e54e-46e6-9721-ed318f58905e

app/helpers/reporting_helper.rb

@@ -21,21 +21,24 @@ module ReportingHelper
     [
       {:name => :activate_filter, :filter_name => filter.underscore_name, :label => l(filter.label)},
       {:name => :operators, :filter_name => filter.underscore_name, :operators => filter.available_operators},
-      {:name => :multi_values, :filter_name => filter.underscore_name, :values => filter.available_values(User.current)}]
+      {:name => :multi_values, :filter_name => filter.underscore_name, :values => filter.available_values(User.current)},
+      {:name => :remove_filter, :filter_name => filter.underscore_name}]
   end
 
   def date_elements(filter)
     [
       {:name => :activate_filter, :filter_name => filter.underscore_name, :label => l(filter.label)},
       {:name => :operators, :filter_name => filter.underscore_name, :operators => filter.available_operators},
-      {:name => :date, :filter_name => filter.underscore_name}]
+      {:name => :date, :filter_name => filter.underscore_name},
+      {:name => :remove_filter, :filter_name => filter.underscore_name}]
   end
 
   def text_elements(filter)
     [
       {:name => :activate_filter, :filter_name => filter.underscore_name, :label => l(filter.label)},
       {:name => :operators, :filter_name => filter.underscore_name, :operators => filter.available_operators},
-      {:name => :text_box, :filter_name => filter.underscore_name}]
+      {:name => :text_box, :filter_name => filter.underscore_name},
+      {:name => :remove_filter, :filter_name => filter.underscore_name}]
   end
 
   def link_to_project(project)

app/views/cost_reports/filters/_activate_filter.rhtml

@@ -2,13 +2,10 @@
   This partial requires the following locals:
     element   a Hash containing the following keys:
       - :name => :activate_filter
-      - :filter_name => String: The name of a filter (e.g. activity_id)
       - :label => String: A text which is shown to the user as a label for this filter
       - :width => Integer (optional): The width this partial may consume. If not given, a standard width will be applied
 %>
 
-<td width="<%= element[:width] || 200 %>">
-  <input id= "rm_<%= element[:filter_name] %>" name="fields[]" onclick="remove_filter('<%= element[:filter_name] %>');"
-         type="button" value="" class="icon filter_rem icon-del"/>
-  <label><%= element[:label] %></label>
+<td width="<%= element[:width] || 150 %>">
+  <label id="label_<%= element[:filter_name]%>"><%= element[:label] %></label>
 </td>

app/views/cost_reports/filters/_remove_filter.rhtml

@@ -0,0 +1,10 @@
+<%#
+  This partial requires the following locals:
+    element   a Hash containing the following keys:
+      - :filter_name => String: The name of a filter (e.g. activity_id)
+      - :hide => Boolean (optional, default = true): whether the content of this partial is initially hidden or not
+%>
+<td width="<%= element[:width] || 30 %>" <%= style="display:none" if element[:hide] %>>
+  <input id= "rm_<%= element[:filter_name] %>" name="fields[]" onclick="remove_filter('<%= element[:filter_name] %>');"
+     type="button" value="" class="icon filter_rem icon-filter-rem"/>
+</td>

assets/javascripts/reporting.js

@@ -2,12 +2,12 @@
 
 function toggle_filter(field) {
     var remove, to_toggle;
-    remove = $('rm_' + field);
-    to_toggle = remove.up().siblings();
-    if (remove.visible()) {
+    label = $('label_' + field);
+    to_toggle = label.up().siblings();
+    if (label.visible()) {
         to_toggle.invoke('show');
-    }
-    else {
+        $('rm_' + field).hide();
+    } else {
         to_toggle.invoke('hide');
     }
 }
@@ -67,8 +67,27 @@ function hide_category(tr_field) {
     }
 }
 
+function register_remove_hover(field) {
+    table = $('tr_' +  field);
+    Event.observe(table, 'mouseover', function(event) { set_remove_button_visibility(field, true) });
+    Event.observe(table, 'mouseout', function(event) { set_remove_button_visibility(field, false) });
+}
+
+
+function set_remove_button_visibility(field, value) {
+    remove = $('rm_' + field);
+    if (remove !== null) {
+        if (value == true) {
+            remove.show();
+        } else {
+            remove.hide();
+        }
+    }
+}
+
 function show_filter(field) {
     var field_el = $('tr_' +  field);
+    register_remove_hover(field);
     if (field_el !== null) {
         field_el.show();
         toggle_filter(field);

assets/stylesheets/reporting.css

@@ -110,6 +110,17 @@
   border-style: none;
 }
 
+.icon-filter-rem {
+  background-image: url(../images/remove.png);
+}
+
+.filter {
+  border: 2px solid #CCC;
+  -webkit-border-radius: 5px;
+  -moz-border-radius: 5px;
+  border--radius: 5px;
+}
+
 .drag_element {
   cursor: move;
   background-color: #60D8FB;
@@ -133,5 +144,5 @@
 
 .drag_container_accept {
   background-color: #F5F5C5;
-  boder: 1px solid #BBBBBB;
+  border: 1px solid #BBBBBB;
 }