SONAR-3242 replace the icon by a link "more actions" in the footer of the violation

4 files changed, 206 insertions, 183 deletions

diff --git a/plugins/sonar-l10n-en-plugin/src/main/resources/org/sonar/l10n/core.properties b/plugins/sonar-l10n-en-plugin/src/main/resources/org/sonar/l10n/core.properties
index 5ba35c04574..3b23ad461e4 100644
--- a/plugins/sonar-l10n-en-plugin/src/main/resources/org/sonar/l10n/core.properties
+++ b/plugins/sonar-l10n-en-plugin/src/main/resources/org/sonar/l10n/core.properties
@@ -70,6 +70,7 @@ max=Max
 me=Me
 min=Min
 minor=Minor
+more_actions=More actions
 name=Name
 none=None
 off=Off
@@ -423,7 +424,6 @@ reviews.resolved=Resolved
 reviews.resolved_submit=Resolved
 reviews.reopen=Reopen
 reviews.reopen_submit=Reopen
-reviews.reply=Reply
 reviews.edit=Edit
 reviews.delete=Delete
 reviews.status.REOPENED=Reopened
diff --git a/sonar-server/src/main/webapp/WEB-INF/app/views/resource/_violation.html.erb b/sonar-server/src/main/webapp/WEB-INF/app/views/resource/_violation.html.erb
index 9ee0588e265..7446f2edc44 100644
--- a/sonar-server/src/main/webapp/WEB-INF/app/views/resource/_violation.html.erb
+++ b/sonar-server/src/main/webapp/WEB-INF/app/views/resource/_violation.html.erb
@@ -7,34 +7,6 @@
         </div>
       <% end %>
 
-      <% if current_user %>
-        <img src="<%= ApplicationController.root_context -%>/images/actions.png" onclick="$('vActions<%= violation.id -%>').toggle();" class="pop-menu-icon">
-          <ul style="display: none" class="popup-menu" id="vActions<%= violation.id -%>" onmouseout="this.hide();" onmouseover="this.show();">
-            <li><%= link_to_function message('reviews.comment'), "sCF(#{violation.id})", :name => 'bComment' -%></li>
-
-            <% unless violation.review && violation.review.resolved? %>
-              <li><%= link_to_function message('reviews.assign'), "sAF(#{violation.id})", :name => 'bAssign' -%></li>
-            <% end %>
-
-            <% if !violation.switched_off? %>
-              <li><%= link_to_function (violation.review && violation.review.resolved? ? message('reviews.reopen') : message('reviews.resolved')),
-                                       "sCStF(#{violation.id})", :name => (violation.review && violation.review.resolved? ? 'bReopen' : 'bResolved') -%></li>
-            <% end %>
-
-            <% if violation.review.nil? || violation.review.can_change_false_positive_flag? %>
-              <li><%= link_to_function message(violation.switched_off? ? 'reviews.unflag_as_false_positive' : 'reviews.flag_as_false_positive'),
-                                       "sFPF(#{violation.id})",
-                                       :name => 'bFalsePositive' -%></li>
-            <% end %>
-
-            <% unless violation.review && violation.review.resolved? %>
-              <li><%= link_to_function message('reviews.change_severity'), "sCSF(#{violation.id})", :name => 'bChangeSeverity' -%></li>
-              <li><%= link_to_function message('reviews.link_to_action_plan'), "sAPF(#{violation.id})", :name => 'bLinkActionPlan' -%></li>
-            <% end %>
-          </ul>
-        &nbsp;
-      <% end %>
-
       <% if violation.review && violation.review.manual_severity && violation.review.severity!=violation.severity %>
         <img src="<%= ApplicationController.root_context -%>/images/priority/<%= violation.review.severity -%>.png">
       <% else %>
@@ -103,17 +75,17 @@
         <%
            if current_user.id == review_comment.user_id
         %>
-          <%= link_to_function message('reviews.reply'), "sRF(#{violation.id})", :name => 'bReply' -%>
-          &nbsp;
           <%= link_to_remote message('reviews.edit'),
                              :url => {:controller => "reviews", :action => "violation_comment_form", :comment_id => review_comment.id, :id => violation.id},
                              :update => "lastComment" + violation.id.to_s,
-                             :complete => "$('vActions#{violation.id}').hide();$('commentActions#{violation.id}').hide();$('commentText#{violation.id}').focus();" -%>
+                             :complete => "$('vActions#{violation.id}').hide();$('commentActions#{violation.id}').hide();$('commentText#{violation.id}').focus();",
+                             :html => {:class => 'link-action'} -%>
           &nbsp;
           <%= link_to_remote message('reviews.delete'),
                              :url => {:controller => "reviews", :action => "violation_delete_comment", :comment_id => review_comment.id, :id => violation.id},
                              :update => "vId" + violation.id.to_s,
-                             :confirm => message('reviews.do_you_want_to_delete_comment') -%>
+                             :confirm => message('reviews.do_you_want_to_delete_comment'),
+                             :html => {:class => 'link-action'} -%>
         <%
            end
         %>
@@ -131,10 +103,40 @@
       <%
          end
       %>
-      <div class="discussionComment" id="replyForm<%= violation.id -%>" style="display:none"></div> 
-      <%
-         end
-      %>
+      <div class="discussionComment" id="replyForm<%= violation.id -%>" style="display:none"></div>
+    <%
+       end
+    %>
+    <% if current_user %>
+      <div class="vFooter">
+        <%= link_to_function message('reviews.comment'), "sCF(#{violation.id})", :name => 'bComment', :class => 'link-action spacer-right' -%>
+
+        <% unless violation.review && violation.review.resolved? %>
+          <%= link_to_function message('reviews.assign'), "sAF(#{violation.id})", :name => 'bAssign', :class => 'link-action spacer-right' -%>
+        <% end %>
+
+        <% if violation.review.nil? || violation.review.can_change_false_positive_flag? %>
+          <%= link_to_function message(violation.switched_off? ? 'reviews.unflag_as_false_positive' : 'reviews.flag_as_false_positive'),
+                                   "sFPF(#{violation.id})", :name => 'bFalsePositive', :class => 'link-action spacer-right' -%>
+        <% end %>
+
+        <% unless violation.switched_off? && violation.review && violation.review.resolved? %>
+        <div class="dropdown">
+          <a href="#" class="link-action link-more" onclick="$('vActions<%= violation.id -%>').toggle();return false;"><%= message('more_actions') -%></a>
+          <ul style="display: none" class="dropdown-menu" id="vActions<%= violation.id -%>" onmouseout="this.hide();" onmouseover="this.show();">
+            <% if !violation.switched_off? %>
+              <li><%= link_to_function (violation.review && violation.review.resolved? ? message('reviews.reopen') : message('reviews.resolved')),
+                                       "sCStF(#{violation.id})", :name => (violation.review && violation.review.resolved? ? 'bReopen' : 'bResolved') -%></li>
+            <% end %>
+            <% unless violation.review && violation.review.resolved? %>
+              <li><%= link_to_function message('reviews.change_severity'), "sCSF(#{violation.id})", :name => 'bChangeSeverity' -%></li>
+              <li><%= link_to_function message('reviews.link_to_action_plan'), "sAPF(#{violation.id})", :name => 'bLinkActionPlan' -%></li>
+            <% end %>
+          </ul>
+        </div>
+        <% end %>
+      </div>
+    <% end %>
   </div>
 
 </div>
\ No newline at end of file
diff --git a/sonar-server/src/main/webapp/javascripts/resource.js b/sonar-server/src/main/webapp/javascripts/resource.js
index 77a5a083779..e5d3acaba0a 100644
--- a/sonar-server/src/main/webapp/javascripts/resource.js
+++ b/sonar-server/src/main/webapp/javascripts/resource.js
@@ -23,130 +23,121 @@ function loadGWT(gwtId, resourceId, resourceKey, resourceName, resourceScope, re
 // cancel action : hide form and refresh violation
 function cancelViolationAction(violation_id) {
   new Ajax.Updater(
-    'vId' + violation_id,
-    baseUrl + '/reviews/display_violation/' + violation_id,
-    {
-      asynchronous:true,
-      evalScripts:true
-    });
+      'vId' + violation_id,
+      baseUrl + '/reviews/display_violation/' + violation_id,
+      {
+        asynchronous:true,
+        evalScripts:true
+      });
   return false;
 }
 
+function hideMoreViolationActions(violation_id) {
+  var popup = $('vActions' + violation_id);
+  if (popup != null) {
+    popup.hide();
+  }
+}
+
 // show the form to comment violation
 function sCF(violation_id) {
-  $('vActions' + violation_id).hide();
+  hideMoreViolationActions(violation_id);
   new Ajax.Updater('reviewForm' + violation_id,
-    baseUrl + '/reviews/violation_comment_form/' + violation_id,
-    {
-      asynchronous:true,
-      evalScripts:true,
-      onComplete:function (request) {
-        $('vBody' + violation_id).remove();
-        $('reviewForm' + violation_id).show();
-        $('commentText' + violation_id).focus();
-     }
-    });
+      baseUrl + '/reviews/violation_comment_form/' + violation_id,
+      {
+        asynchronous:true,
+        evalScripts:true,
+        onComplete:function (request) {
+          $('vBody' + violation_id).remove();
+          $('reviewForm' + violation_id).show();
+          $('commentText' + violation_id).focus();
+        }
+      });
   return false;
 }
 
-//show the form to reply to a comment
-function sRF(violation_id) {
-$('vActions' + violation_id).hide();
-new Ajax.Updater('replyForm' + violation_id,
- baseUrl + '/reviews/violation_comment_form/' + violation_id,
- {
-   asynchronous:true,
-   evalScripts:true,
-   onComplete:function (request) {
-     $('replyForm' + violation_id).show();
-     $('commentText' + violation_id).focus();
-  }
- });
-return false;
-}
-
 // show the form to change severity
 function sCSF(violation_id) {
-  $('vActions' + violation_id).hide();
+  hideMoreViolationActions(violation_id);
   new Ajax.Updater('reviewForm' + violation_id,
-    baseUrl + '/reviews/violation_change_severity_form/' + violation_id,
-    {
-      asynchronous:true,
-      evalScripts:true,
-      onComplete:function (request) {
-        $('vBody' + violation_id).remove();
-        $('reviewForm' + violation_id).show();
-        $('selectSeverity' + violation_id).focus();
-      }
-    });
+      baseUrl + '/reviews/violation_change_severity_form/' + violation_id,
+      {
+        asynchronous:true,
+        evalScripts:true,
+        onComplete:function (request) {
+          $('vBody' + violation_id).remove();
+          $('reviewForm' + violation_id).show();
+          $('selectSeverity' + violation_id).focus();
+        }
+      });
   return false;
 }
 
 // show the form to change status
 function sCStF(violation_id) {
-  $('vActions' + violation_id).hide();
+  hideMoreViolationActions(violation_id);
   new Ajax.Updater('reviewForm' + violation_id,
-    baseUrl + '/reviews/violation_change_status_form/' + violation_id,
-    {
-      asynchronous:true,
-      evalScripts:true,
-      onComplete:function (request) {
-        $('vBody' + violation_id).remove();
-        $('reviewForm' + violation_id).show();
-        $('commentText' + violation_id).focus();
-      }
-    });
+      baseUrl + '/reviews/violation_change_status_form/' + violation_id,
+      {
+        asynchronous:true,
+        evalScripts:true,
+        onComplete:function (request) {
+          $('vBody' + violation_id).remove();
+          $('reviewForm' + violation_id).show();
+          $('commentText' + violation_id).focus();
+        }
+      });
   return false;
 }
 
 // show the form to flag as false-positive
 function sFPF(violation_id) {
-  $('vActions' + violation_id).hide();
+  hideMoreViolationActions(violation_id);
   new Ajax.Updater('reviewForm' + violation_id,
-    baseUrl + '/reviews/violation_false_positive_form/' + violation_id,
-    {
-      asynchronous:true,
-      evalScripts:true,
-      onComplete:function (request) {
-        $('vBody' + violation_id).remove();
-        $('reviewForm' + violation_id).show();
-        $('commentText' + violation_id).focus();
-      }
-    });
+      baseUrl + '/reviews/violation_false_positive_form/' + violation_id,
+      {
+        asynchronous:true,
+        evalScripts:true,
+        onComplete:function (request) {
+          $('vBody' + violation_id).remove();
+          $('reviewForm' + violation_id).show();
+          $('commentText' + violation_id).focus();
+        }
+      });
   return false;
 }
 
 // show the form to assign violation
 function sAF(violation_id) {
-  $('vActions' + violation_id).hide();
+  hideMoreViolationActions(violation_id);
   new Ajax.Updater('reviewForm' + violation_id,
-    baseUrl + '/reviews/violation_assign_form/' + violation_id,
-    {
-      asynchronous:true,
-      evalScripts:true,
-      onComplete:function (request) {
-        $('vBody' + violation_id).remove();
-        $('reviewForm' + violation_id).show();
-        $('assignee_login').focus();
-      }
-    });
+      baseUrl + '/reviews/violation_assign_form/' + violation_id,
+      {
+        asynchronous:true,
+        evalScripts:true,
+        onComplete:function (request) {
+          $('vBody' + violation_id).remove();
+          $('reviewForm' + violation_id).show();
+          $('assignee_login').focus();
+        }
+      });
   return false;
 }
 
 // show the form to link a review to an action plan
 function sAPF(violation_id) {
-  $('vActions' + violation_id).hide();
+  hideMoreViolationActions(violation_id);
   new Ajax.Updater('reviewForm' + violation_id,
-    baseUrl + '/reviews/violation_action_plan_form/' + violation_id,
-    {
-      asynchronous:true,
-      evalScripts:true,
-      onComplete:function (request) {
-        $('vBody' + violation_id).remove();
-        $('reviewForm' + violation_id).show();
-        $('action_plan').focus();
-      }
-    });
+      baseUrl + '/reviews/violation_action_plan_form/' + violation_id,
+      {
+        asynchronous:true,
+        evalScripts:true,
+        onComplete:function (request) {
+          $('vBody' + violation_id).remove();
+          $('reviewForm' + violation_id).show();
+          $('action_plan').focus();
+        }
+      });
   return false;
 }
 
@@ -155,14 +146,14 @@ function sVF(resource, line, gray_colspan, white_colspan) {
   row = $('createViolationForm' + line);
   if (row == null) {
     new Ajax.Updater(
-      'pos' + line,
-      baseUrl + '/resource/show_create_violation_form',
-      {
-        parameters:{resource:resource, line:line, gray_colspan:gray_colspan, white_colspan:white_colspan},
-        asynchronous:true,
-        evalScripts:true,
-        insertion:'after'
-      });
+        'pos' + line,
+        baseUrl + '/resource/show_create_violation_form',
+        {
+          parameters:{resource:resource, line:line, gray_colspan:gray_colspan, white_colspan:white_colspan},
+          asynchronous:true,
+          evalScripts:true,
+          insertion:'after'
+        });
   }
   return false;
 }
diff --git a/sonar-server/src/main/webapp/stylesheets/style.css b/sonar-server/src/main/webapp/stylesheets/style.css
index a1b3af8ecdf..d85f39419e9 100644
--- a/sonar-server/src/main/webapp/stylesheets/style.css
+++ b/sonar-server/src/main/webapp/stylesheets/style.css
@@ -420,51 +420,6 @@ button[disabled], .button[disabled], input[type="submit"][disabled], input[type=
   cursor: default;
 }
 
-.pop-menu-icon {
-  cursor: pointer;
-}
-
-.popup-menu {
-  background-clip: padding-box;
-  background-color: #FFFFFF;
-  border-color: #DDD;
-  border-style: solid;
-  border-width: 1px;
-  -moz-box-shadow: 0 5px 10px #333;
-  -webkit-box-shadow: 0 5px 10px #333;
-  -o-box-shadow: 0 5px 10px #333;
-  box-shadow: 0 5px 10px #333;
-  float: left;
-  margin: 0;
-  max-width: 220px;
-  min-width: 160px;
-  padding: 0;
-  position: absolute;
-  line-height: 20px;
-  z-index: 1000;
-}
-
-.popup-menu li {
-  list-style-type: none !important;
-  padding: 2px 8px !important;
-  cursor: pointer !important;
-  color: red !important;
-}
-
-.popup-menu li:hover {
-  background-color: #4b9fd5 !important;
-}
-
-.popup-menu li:hover a {
-  color: #fff !important;
-  font-weight: bold !important;
-}
-
-.popup-menu a {
-  text-decoration: none !important;
-  display: block !important;
-}
-
 /* ------------------- PAGE ------------------- */
 h1 {
   color: #444;
@@ -921,15 +876,23 @@ ul.operations li img {
 div.vtitle {
   background-color: #E4ECF3;
   margin: 0;
-  padding: 0 0 0 10px;
-  line-height: 2.2em;
+  padding: 5px 10px;
+  line-height: 16px;
   color: #777;
   border-bottom: 1px solid #DDDDDD;
 }
+
 div.vtitle img {
   vertical-align: text-bottom;
 }
 
+div.vFooter {
+  padding: 5px 10px;
+  border-top: 1px solid #DDD;
+  background-color: #EFEFEF;
+  line-height: 16px;
+}
+
 span.falsePositive, span.reviewResolutionFALSE-POSITIVE {
   background-color: #FFF6BF;
   padding-left: 5px;
@@ -950,8 +913,7 @@ span.reviewReopened, span.reviewStatusREOPENED {
 }
 
 span.rulename, span.rulename a {
-  color: #4183C4;
-  text-decoration: none;
+  color: #444;
   font-weight: bold;
 }
 
@@ -1791,6 +1753,7 @@ option.sev_BLOCKER {
   overflow: auto;
   border: 1px solid #ccc;
 }
+
 .scroll-ie {
   overflow-x: hidden;
   padding-right: 17px;
@@ -2347,7 +2310,60 @@ table.nowrap td, td.nowrap, th.nowrap {
 /* in order to rapidly identify them                                      */
 .link-action {
   text-decoration: underline;
-  color: #4183C4;
+  color: #4183C4 !important;
+}
+
+.link-more {
+  background-image: url('../images/bullet_arrow_down.png');
+  background-repeat: no-repeat;
+  padding-right: 20px;
+  background-position: right center;
+}
+
+.dropdown {
+  cursor: pointer;
+  display: inline-block;
+}
+
+.dropdown-menu {
+  background-clip: padding-box;
+  background-color: #FFFFFF;
+  border-color: #DDD;
+  border-style: solid;
+  border-width: 1px;
+  -moz-box-shadow: 0 5px 10px rgab(0, 0, 0, 0.2);
+  -webkit-box-shadow: 0 5px 10px rgab(0, 0, 0, 0.2);
+  -o-box-shadow: 0 5px 10px rgab(0, 0, 0, 0.2);
+  box-shadow: 0 5px 10px rgab(0, 0, 0, 0.2);
+  float: left;
+  margin: 0;
+  max-width: 220px;
+  min-width: 160px;
+  padding: 0;
+  position: absolute;
+  line-height: 20px;
+  z-index: 1000;
+}
+
+.dropdown-menu li {
+  list-style-type: none !important;
+  padding: 2px 8px !important;
+  cursor: pointer !important;
+  color: red !important;
+}
+
+.dropdown-menu li:hover {
+  background-color: #4b9fd5 !important;
+}
+
+.dropdown-menu li:hover a {
+  color: #fff !important;
+  font-weight: bold !important;
+}
+
+.dropdown-menu a {
+  text-decoration: none !important;
+  display: block !important;
 }
 
 .form-key-cell {
@@ -2387,24 +2403,31 @@ blockquote cite {
 .spacer-left {
   margin-left: 8px;
 }
+
 .spacer-right {
   margin-right: 8px;
 }
+
 .spacer-bottom {
   margin-bottom: 8px;
 }
+
 .spacer-top {
   margin-top: 8px;
 }
+
 td.spacer-left {
   padding-left: 8px;
 }
+
 td.spacer-right {
   padding-right: 8px;
 }
+
 td.spacer-bottom {
   padding-bottom: 8px;
 }
+
 td.spacer-top {
   padding-top: 8px;
 }
@@ -2436,25 +2459,31 @@ td.spacer-top {
   line-height: 16px;
   padding: 4px 5px;
 }
+
 .table > tbody > tr > td {
   line-height: 16px;
   padding: 4px 5px;
 }
+
 .table-bordered > tbody {
   border-left: 1px solid #DDD;
   border-right: 1px solid #DDD;
   border-bottom: 1px solid #DDD;
 }
+
 .table-bordered > tbody > tr > td {
   border-top: 1px solid #DDD;
 }
+
 select.small-width {
   max-width: 120px;
 }
+
 select.medium-width {
   max-width: 175px;
   width: 175px;
 }
+
 .pipe-left {
   background-image: url('../images/sep12.png');
   background-position: left center;
@@ -2462,6 +2491,7 @@ select.medium-width {
   padding-left: 8px;
   margin-left: 8px;
 }
+
 .pipe-right {
   background-image: url('../images/sep12.png');
   background-position: right center;