reviewers: colorify the groups

rhodecode/public/js/src/rhodecode/utils/colorgenerator.js

@@ -1,83 +1,87 b''
 // # Copyright (C) 2010-2017 RhodeCode GmbH
 // #
 // # This program is free software: you can redistribute it and/or modify
 // # it under the terms of the GNU Affero General Public License, version 3
 // # (only), as published by the Free Software Foundation.
 // #
 // # This program is distributed in the hope that it will be useful,
 // # but WITHOUT ANY WARRANTY; without even the implied warranty of
 // # MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
 // # GNU General Public License for more details.
 // #
 // # You should have received a copy of the GNU Affero General Public License
 // # along with this program.  If not, see <http://www.gnu.org/licenses/>.
 // #
 // # This program is dual-licensed. If you wish to learn more about the
 // # RhodeCode Enterprise Edition, including its added features, Support services,
 // # and proprietary license terms, please see https://rhodecode.com/licenses/
 
 /**
 * SmartColorGenerator
 *
 *usage::
 *  var CG = new ColorGenerator();
 *  var col = CG.getColor(key); //returns array of RGB
-*  'rgb({0})'.format(col.join(',')
+*  CG.asRGB(col) === 'rgb({0})'.format(col.join(',')
+*
 *
 * @returns {ColorGenerator}
 */
 
 // TODO: no usages found. Maybe it's time to remove it
 var ColorGenerator = function(){
   this.GOLDEN_RATIO = 0.618033988749895;
   this.CURRENT_RATIO = 0.22717784590367374; // this can be random
   this.HSV_1 = 0.75;// saturation
   this.HSV_2 = 0.95;
   this.color;
   this.cacheColorMap = {};
 };
 
 ColorGenerator.prototype = {
   getColor:function(key){
     if(this.cacheColorMap[key] !== undefined){
       return this.cacheColorMap[key];
     }
     else{
       this.cacheColorMap[key] = this.generateColor();
       return this.cacheColorMap[key];
     }
   },
+  asRGB:function(color_tuple) {
+    return 'rgb({0})'.format(color_tuple.join(','));
+  },
   _hsvToRgb:function(h,s,v){
     if (s === 0.0)
         return [v, v, v];
     i = parseInt(h * 6.0);
     f = (h * 6.0) - i;
     p = v * (1.0 - s);
     q = v * (1.0 - s * f);
     t = v * (1.0 - s * (1.0 - f));
     i = i % 6;
     if (i === 0)
         return [v, t, p];
     if (i === 1)
         return [q, v, p];
     if (i === 2)
         return [p, v, t];
     if (i === 3)
         return [p, q, v];
     if (i === 4)
         return [t, p, v];
     if (i === 5)
         return [v, p, q];
   },
   generateColor:function(){
     this.CURRENT_RATIO = this.CURRENT_RATIO+this.GOLDEN_RATIO;
     this.CURRENT_RATIO = this.CURRENT_RATIO %= 1;
     HSV_tuple = [this.CURRENT_RATIO, this.HSV_1, this.HSV_2];
     RGB_tuple = this._hsvToRgb(HSV_tuple[0],HSV_tuple[1],HSV_tuple[2]);
     function toRgb(v){
         return ""+parseInt(v*256);
     }
     return [toRgb(RGB_tuple[0]),toRgb(RGB_tuple[1]),toRgb(RGB_tuple[2])];
 
   }
 };

rhodecode/templates/ejs_templates/templates.html

@@ -1,109 +1,125 b''
 <%text>
 <div style="display: none">
 
 <script id="ejs_gravatarWithUser" type="text/template" class="ejsTemplate">
 
 <%
 if (size > 16) {
     var gravatar_class = 'gravatar gravatar-large';
 } else {
     var gravatar_class = 'gravatar';
 }
 %>
 
 <%
 if (show_disabled) {
     var user_cls = 'user user-disabled';
 } else {
     var user_cls = 'user';
 }
 %>
 
 <div class="rc-user">
     <img class="<%= gravatar_class %>" src="<%- gravatar_url -%>" height="<%= size %>" width="<%= size %>">
     <span class="<%= user_cls %>"> <%- user_link -%> </span>
 </div>
 
 </script>
 
+<script>
+var CG = new ColorGenerator();
+</script>
 
 <script id="ejs_reviewMemberEntry" type="text/template" class="ejsTemplate">
 
 <li id="reviewer_<%= member.user_id %>" class="reviewer_entry">
-    <div class="reviewers_member">
+        <%
+
+            if (member.user_group && member.user_group.vote_rule) {
+                var groupStyle = 'border-left: 1px solid '+CG.asRGB(CG.getColor(member.user_group.vote_rule));
+            } else {
+                var groupStyle = 'border-left: 1px solid white';
+            }
+
+        %>
+
+    <div class="reviewers_member" style="<%= groupStyle%>" >
         <div class="reviewer_status tooltip" title="<%= review_status_label %>">
           <div class="flag_status <%= review_status %> pull-left reviewer_member_status"></div>
         </div>
       <div id="reviewer_<%= member.user_id %>_name" class="reviewer_name">
         <% if (mandatory) { %>
             <div class="reviewer_member_mandatory tooltip" title="Mandatory reviewer">
                 <i class="icon-lock"></i>
             </div>
         <% } %>
 
-        <%if (member.user_group && member.user_group.vote_rule) {%>
-            <div style="float:right">
-              <%if (member.user_group.vote_rule == -1) {%>
-                Min votes: ALL
-              <%} else {%>
-                Min votes: <%= member.user_group.vote_rule %>
-              <%}%>
-            </div>
-        <%}%>
         <%-
           renderTemplate('gravatarWithUser', {
             'size': 16,
             'show_disabled': false,
             'user_link': member.user_link,
             'gravatar_url':  member.gravatar_link
             })
         %>
       </div>
 
       <input type="hidden" name="__start__" value="reviewer:mapping">
 
+
+        <%if (member.user_group && member.user_group.vote_rule) {%>
+            <div class="reviewer_reason">
+
+              <%if (member.user_group.vote_rule == -1) {%>
+               - group votes required: ALL
+              <%} else {%>
+               - group votes required: <%= member.user_group.vote_rule %>
+              <%}%>
+            </div>
+        <%}%>
+
         <input type="hidden" name="__start__" value="reasons:sequence">
           <% for (var i = 0; i < reasons.length; i++) { %>
               <% var reason = reasons[i] %>
               <div class="reviewer_reason">- <%= reason %></div>
               <input type="hidden" name="reason" value="<%= reason %>">
           <% } %>
         <input type="hidden" name="__end__" value="reasons:sequence">
 
         <input type="hidden" name="__start__" value="rules:sequence">
           <% for (var i = 0; i < member.rules.length; i++) { %>
               <% var rule = member.rules[i] %>
               <input type="hidden" name="rule_id" value="<%= rule %>">
           <% } %>
         <input type="hidden" name="__end__" value="rules:sequence">
 
         <input id="reviewer_<%= member.user_id %>_input" type="hidden" value="<%= member.user_id %>" name="user_id" />
         <input type="hidden" name="mandatory" value="<%= mandatory %>"/>
 
       <input type="hidden" name="__end__" value="reviewer:mapping">
 
       <% if (mandatory) { %>
             <div class="reviewer_member_mandatory_remove" style="visibility: hidden;">
                 <i class="icon-remove-sign"></i>
             </div>
       <% } else { %>
         <% if (allowed_to_update) { %>
           <div class="reviewer_member_remove action_button" onclick="reviewersController.removeReviewMember(<%= member.user_id %>, true)" style="visibility: hidden;">
               <i class="icon-remove-sign" ></i>
           </div>
         <% } %>
       <% } %>
     </div>
 </li>
 
 </script>
 
 
 </div>
 
 <script>
     // registers the templates into global cache
     registerTemplates();
 </script>
 
-</%text>
  No newline at end of file
+</%text>