SONAR-3009 Widgets can not be configured on IE9

7 files changed, 59 insertions, 42 deletions

diff --git a/sonar-server/src/main/webapp/WEB-INF/app/views/dashboard/_configure_widget.html.erb b/sonar-server/src/main/webapp/WEB-INF/app/views/dashboard/_configure_widget.html.erb
index c27485fcf58..78196d47796 100644
--- a/sonar-server/src/main/webapp/WEB-INF/app/views/dashboard/_configure_widget.html.erb
+++ b/sonar-server/src/main/webapp/WEB-INF/app/views/dashboard/_configure_widget.html.erb
@@ -8,12 +8,16 @@
    end
 %>
 
-<div class="handle" style="//overflow:hidden;//zoom:1;">
-  <a class="block-remove" onclick="portal.deleteWidget(this);return false;"><%= message('delete') -%></a>
-  <% if widget.java_definition.isEditable() %>
-    <a class="block-view-toggle" onclick="portal.editWidget(<%= widget.id -%>);return false;"><%= message('edit') -%></a>
-  <% end %>
-  <%= h message('widget.' + widget.java_definition.getId() + '.name', :default => widget.java_definition.getTitle()) -%>
+<div class="widget-header">
+  <div class="widget-actions">
+    <% if widget.java_definition.isEditable() %>
+      <a class="link-action" onclick="portal.editWidget(<%= widget.id -%>);return false;"><%= message('edit') -%></a>
+    <% end %>
+    <a class="link-action" onclick="portal.deleteWidget(this);return false;"><%= message('delete') -%></a>
+  </div>
+  <div class="widget-handle">
+    <%= h message('widget.' + widget.java_definition.getId() + '.name', :default => widget.java_definition.getTitle()) -%>
+  </div>
 </div>
 
 
@@ -22,7 +26,7 @@
 </div>
 
 
-<div id="widget_<%= widget.id -%>" class="configure_widget <%= widget.java_definition.getId() -%>" style="height:100%;<%= 'display:none;' if !widget.configured -%>">
+<div id="widget_<%= widget.id -%>" class="configure_widget widget-<%= widget.java_definition.getId() -%>" style="height:100%;<%= 'display:none;' if !widget.configured -%>">
   <!--[if lte IE 6]>
   <style type="text/css">
     #dashboard .block .content .transparent {
@@ -40,7 +44,8 @@
     <% end %>
     <%= widget_body -%>
     <% if default_layout %>
-      <div class="clear"> </div></div>
+      <div class="clear"></div>
+      </div>
     <% end %>
   <% else %>
     <div class="widget"><p><%= message('no_data') -%></p></div>
diff --git a/sonar-server/src/main/webapp/WEB-INF/app/views/dashboard/_widget_properties.html.erb b/sonar-server/src/main/webapp/WEB-INF/app/views/dashboard/_widget_properties.html.erb
index e071c6ce7e1..4432a095d6f 100644
--- a/sonar-server/src/main/webapp/WEB-INF/app/views/dashboard/_widget_properties.html.erb
+++ b/sonar-server/src/main/webapp/WEB-INF/app/views/dashboard/_widget_properties.html.erb
@@ -3,16 +3,16 @@
                    :update => {:failure => "error#{widget.id}"},
                    :failure => "$('error#{widget.id}').show()" do -%>
   <div id="error<%= widget.id -%>" class="error" style="display: none"></div>
-  <table class="form width100">
+  <table class="table width100">
     <tbody>
     <% widget.java_definition.getWidgetProperties().each do |property_def| %>
       <tr>
-        <td valign="top" class="thin nowrap"><b><%= property_def.key() -%></b><%= "*" unless property_def.optional()==true -%>:</td>
-        <td id="row_<%= property_def.key() -%>">
+        <td class="form-key-cell"><%= property_def.key() -%><%= "*" unless property_def.optional()==true -%></td>
+        <td class="form-val-cell" id="row_<%= property_def.key() -%>">
           <%= property_value_field(property_def, widget.property_text_value(property_def.key())) -%>
-          <span class="note">
-                <%= message("widget." + widget.key + ".param." + property_def.key(), :default => property_def.description()) -%>
-              </span>
+          <div class="form-val-note">
+            <%= message("widget." + widget.key + ".param." + property_def.key(), :default => property_def.description()) -%>
+          </div>
         </td>
       </tr>
     <% end %>
diff --git a/sonar-server/src/main/webapp/WEB-INF/app/views/dashboard/configure.html.erb b/sonar-server/src/main/webapp/WEB-INF/app/views/dashboard/configure.html.erb
index 12a599e1f3d..8e38d90656f 100644
--- a/sonar-server/src/main/webapp/WEB-INF/app/views/dashboard/configure.html.erb
+++ b/sonar-server/src/main/webapp/WEB-INF/app/views/dashboard/configure.html.erb
@@ -6,8 +6,8 @@
     column:'dashboard-column',
     columnhandle:'column-handle',
     block:'block',
-    handle:'none',
     hoverclass:'block-hover',
+    handleClass: 'widget-handle',
     dashboardstate:'dashboardstate',
     toggle:'block-toggle',
     blocklist:'widget_defs',
@@ -49,7 +49,7 @@
      columns=@dashboard.column_layout.split('-')
      for index in 1..columns.size()
   %>
-    <div class="dashboard-column-wrapper" style="width: <%= columns[index-1] -%>">
+    <div class="dashboard-column-wrapper" style="width: <%= columns[index-1] -%>;margin: 0 -1px 0 0;">
       <div class="dashboard-column" id="dashboard-column-<%= index -%>" style="margin: 0 <%= index<columns.size() ? "5px" : "0px" -%> 0 <%= index>1 ? "5px" : "0px" -%>;">
         <div class="column-handle" style="display: none"></div>
 
diff --git a/sonar-server/src/main/webapp/WEB-INF/app/views/treemap/_treemap_container.html.erb b/sonar-server/src/main/webapp/WEB-INF/app/views/treemap/_treemap_container.html.erb
index e8381ed712a..2afabddf5e7 100644
--- a/sonar-server/src/main/webapp/WEB-INF/app/views/treemap/_treemap_container.html.erb
+++ b/sonar-server/src/main/webapp/WEB-INF/app/views/treemap/_treemap_container.html.erb
@@ -24,7 +24,7 @@
 <div id="tm-<%= treemap_id -%>" class="spacer-bottom"></div>
 
 <div style="margin: 5px 0 0 0" class="notes">
-  <div style="float: right;cursor: help"><%= image_tag 'help_gray.gif', :title => h(message('treemap.click_help')) -%></div>
+  <div style="float: right;cursor: help"><%= image_tag 'help.png', :title => h(message('treemap.click_help')) -%></div>
   <div id="tm-bc-<%= treemap_id -%>">/</div>
 </div>
 
diff --git a/sonar-server/src/main/webapp/images/move.png b/sonar-server/src/main/webapp/images/move.png
new file mode 100644
index 00000000000..c018fdbffb1
--- /dev/null
+++ b/sonar-server/src/main/webapp/images/move.png
diff --git a/sonar-server/src/main/webapp/javascripts/dashboard.js b/sonar-server/src/main/webapp/javascripts/dashboard.js
index d163d088449..95947bef54a 100644
--- a/sonar-server/src/main/webapp/javascripts/dashboard.js
+++ b/sonar-server/src/main/webapp/javascripts/dashboard.js
@@ -28,6 +28,7 @@ Portal.prototype = {
                 containment: $A(sortables),
                 constraint: false,
                 tag: 'div',
+                handle: this.options.handleClass,
                 only: this.options.block,
                 dropOnEmpty: true,
                 hoverclass: this.options.hoverclass,
@@ -97,7 +98,6 @@ Portal.prototype = {
     },
 
     editWidget: function(id) {
-      
       $('widget_' + id).hide();
       $('widget_props_' + id).show();
     },
@@ -106,7 +106,7 @@ Portal.prototype = {
       $('widget_props_' + id).hide();
     },
     deleteWidget: function(elt) {
-      $(elt).up('.block').remove();
+      $(elt).up('.' + this.options.block).remove();
       this.saveDashboardsState();
     }
 };
diff --git a/sonar-server/src/main/webapp/stylesheets/dashboard.css b/sonar-server/src/main/webapp/stylesheets/dashboard.css
index 7f2c344f15c..f3efd9ce346 100644
--- a/sonar-server/src/main/webapp/stylesheets/dashboard.css
+++ b/sonar-server/src/main/webapp/stylesheets/dashboard.css
@@ -3,6 +3,7 @@
   position: relative;
   width: 100%;
 }
+
 #dashboard .transparent {
   position: absolute;
   width: 100%;
@@ -10,7 +11,6 @@
   top: 0;
   left: 0;
   background: url('../images/transparent.gif') repeat;
-  cursor: move;
   z-index: 1000;
 }
 
@@ -21,6 +21,7 @@
   margin: 0;
   padding: 0;
 }
+
 #dashboard .select-layout.selected img {
   border: 3px solid #4B9FD5;
 }
@@ -32,21 +33,24 @@
   padding: 10px;
   margin: 0 0 10px 0;
   border: 1px solid #ddd;
-  border-radius: 0 0 2px 2px;
-  -moz-border-radius: 0 0 2px 2px;
+  border-radius: 0 0 3px 3px;
+  -moz-border-radius: 0 0 3px 3px;
 }
+
 #dashboard .configure_widget {
-    display: block;
-    position: relative;
+  display: block;
+  position: relative;
 }
+
 #dashboard .widget_props {
   background-color: #FFF6BF;
   border: 1px solid #FFD324;
   margin-bottom: 10px;
   padding: 5px;
+  border-radius: 0 0 3px 3px;
+  -moz-border-radius: 0 0 3px 3px;
 }
 
-
 /*CONFIGURATION*/
 #dashboard #widget_defs {
   height: 250px;
@@ -64,6 +68,7 @@
   vertical-align: top;
   width: 25%;
 }
+
 #dashboard .widget_def {
   border: 1px solid #FFD324;
   padding: 5px;
@@ -72,13 +77,16 @@
   vertical-align: top;
   height: 80px;
 }
+
 #dashboard ul.widget_categs li {
   padding-right: 5px;
 }
+
 #dashboard ul.widget_categs li.selected a {
   font-weight: bold;
   text-decoration: none;
 }
+
 /*OPERATIONS*/
 #dashboard #dashboard-operations {
   position: relative;
@@ -133,8 +141,8 @@
 #dashboard .column-handle {
   height: 100px;
   width: 100%;
-  margin: 10px 0px 10px 0px;
-  padding: 0px;
+  margin: 10px 0 10px 0;
+  padding: 0;
   display: inline-block;
   line-height: 100px;
   text-align: center;
@@ -142,36 +150,40 @@
   vertical-align: middle;
   color: #555;
 }
+
 #dashboard .block {
   position: relative;
   width: 100%;
 }
 
-#dashboard .block .handle {
-  margin: 0;
+#dashboard .widget-header {
+  line-height: 16px;
   padding: 3px 5px;
   background-color: #efefef;
-  cursor: move;
   border: 1px solid #ddd;
   border-bottom: 0;
-  border-radius: 2px 2px 0 0;
-  -moz-border-radius: 2px 2px 0 0;
+  border-radius: 3px 3px 0 0;
+  -moz-border-radius: 3px 3px 0 0;
+
 }
 
-#dashboard .block .block-view-toggle {
-  display: block;
-  float: right;
-  cursor: pointer;
-  padding-left: 5px;
-  text-decoration: underline;
+#dashboard .widget-handle {
+  cursor: move;
+  margin: 0;
+  background-image: url('../images/move.png');
+  background-position: left center;
+  background-repeat: no-repeat;
+  padding-left: 20px;
 }
 
-#dashboard .block .block-remove {
-  display: block;
+#dashboard .widget-actions {
   float: right;
+  overflow: hidden; /* clears float for most browsers */
+  zoom: 1;
+}
+
+#dashboard .widget-actions a {
   cursor: pointer;
-  padding-left: 5px;
-  text-decoration: underline;
 }
 
 #dashboard .block-hover {