Fixes #14619: Group/directive selection in rule not consistant

Normation · Apr 9, 2019 · 50cb915 · 50cb915
1 parent cad06e4
commit 50cb915
Show file tree

Hide file tree

Showing 7 changed files with 98 additions and 34 deletions.
diff --git a/...s/rudder/rudder-web/src/main/scala/com/normation/rudder/web/components/RuleEditForm.scala b/...s/rudder/rudder-web/src/main/scala/com/normation/rudder/web/components/RuleEditForm.scala
@@ -308,14 +308,15 @@ class RuleEditForm(
                 directiveLib
               , globalMode
               , usedDirectiveIds = usedDirectiveIds
-              , onClickCategory = None
+              , onClickCategory  = None
               , onClickTechnique = None
               , onClickDirective = Some((_,t,d) => directiveClick(t, d, globalMode.mode.name))
-              , addEditLink = true
-              , included = selectedDirectiveIds
+              , addEditLink      = true
+              , addActionBtns    = true
+              , included         = selectedDirectiveIds
                 //filter techniques without directives, and categories without technique
-              , keepCategory    = category => category.allDirectives.nonEmpty
-              , keepTechnique   = technique => technique.directives.nonEmpty
+              , keepCategory     = category => category.allDirectives.nonEmpty
+              , keepTechnique    = technique => technique.directives.nonEmpty
             )
           }</ul>
         }</div> } &
@@ -433,11 +434,6 @@ class RuleEditForm(
     save
   }
 
-  private[this] def targetClick(targetInfo: FullRuleTargetInfo) : JsCmd = {
-    val target = targetInfo.target.target.target
-    JsRaw(s"""onClickTarget("${target}");""")
-  }
-
   private[this] def directiveClick(t:FullActiveTechnique , d: Directive, gm:String) : JsCmd = {
     val dirId          = d.id.value
     val dirLink        = linkUtil.directiveLink(d.id).encJs

diff --git a/...er/rudder-web/src/main/scala/com/normation/rudder/web/services/DisplayDirectiveTree.scala b/...er/rudder-web/src/main/scala/com/normation/rudder/web/services/DisplayDirectiveTree.scala
@@ -133,6 +133,7 @@ object DisplayDirectiveTree extends Loggable {
     , onClickTechnique: Option[(FullActiveTechniqueCategory, FullActiveTechnique) => JsCmd]
     , onClickDirective: Option[(FullActiveTechniqueCategory, FullActiveTechnique, Directive) => JsCmd]
     , addEditLink     : Boolean
+    , addActionBtns   : Boolean
     , included        : Set[DirectiveId] = Set()
     , keepCategory    : FullActiveTechniqueCategory => Boolean = _ => true
     , keepTechnique   : FullActiveTechnique => Boolean = _ => true
@@ -274,6 +275,7 @@ object DisplayDirectiveTree extends Loggable {
         s"${disabled} ${includedClass} directiveNode"
 
       }
+
       val htmlId = s"jsTree-${directive.id.value}"
       val directiveTags = JsObj(directive.tags.map(tag => (tag.name.value, Str(tag.value.value))).toList:_*)
       override val attrs = (
@@ -284,6 +286,7 @@ object DisplayDirectiveTree extends Loggable {
       )
 
       override def body = {
+
         val editButton = {
           if (addEditLink && ! directive.isSystem) {
             val tooltipContent = s"""
@@ -300,6 +303,18 @@ object DisplayDirectiveTree extends Loggable {
           }
         }
 
+        val actionBtns = if (addActionBtns)  {
+          onClickDirective match {
+            case Some(f) =>
+              <span class="treeActions">
+                <span class="treeAction fa action-icon directive bsTooltip"  data-toggle="tooltip" data-placement="top" data-html="true" title="" onclick={f(directive)}> </span>
+              </span>
+            case None    => NodeSeq.Empty
+          }
+        }else{
+          NodeSeq.Empty
+        }
+
         val (isDeprecated,deprecationInfo,deprecatedIcon) =
 
         if (activeTechnique.techniques.values.forall { t => t.deprecrationInfo.isDefined }) {
@@ -381,15 +396,17 @@ object DisplayDirectiveTree extends Loggable {
               NodeSeq.Empty
             }}
           </span> ++
+          actionBtns ++
           editButton ++
           Script(JsRaw(s"""$$('#badge-apm-${tooltipId}').replaceWith(createBadgeAgentPolicyMode('directive',"${policyMode}", "${explanation.toString()}", "#boxDirectiveTree"));""")
           )
         }
 
-        onClickDirective match {
-          case None                     => <a style="cursor:default">{xml}</a>
-          case _ if(directive.isSystem) => <a style="cursor:default">{xml}</a>
-          case Some(f)                  => SHtml.a(() => f(directive), xml)
+        (onClickDirective, addActionBtns) match {
+          case ( _       , true ) => <a style="cursor:default">{xml}</a>
+          case ( None    , _    ) => <a style="cursor:default">{xml}</a>
+          case ( _       , _    ) if(directive.isSystem) => <a style="cursor:default">{xml}</a>
+          case ( Some(f) , _    ) => SHtml.a(() => f(directive), xml)
         }
       }
     }

diff --git a/...er/rudder-web/src/main/scala/com/normation/rudder/web/services/DisplayNodeGroupTree.scala b/...er/rudder-web/src/main/scala/com/normation/rudder/web/services/DisplayNodeGroupTree.scala
@@ -173,7 +173,7 @@ object DisplayNodeGroupTree extends Loggable {
 
                   val tooltipId = Helpers.nextFuncName
             <span class="treeActions">
-                  <span class="tooltipable fa fa-plus-circle text-success" tooltipid={tooltipId} title="" onclick={include(targetInfo).toJsCmd}></span>
+                  <span class="tooltipable fa action-icon accept" tooltipid={tooltipId} title="" onclick={include(targetInfo).toJsCmd}></span>
                   <div class="tooltipContent" id={tooltipId}><div>Include Nodes from this group.</div></div></span>
                 case None => NodeSeq.Empty
                 }) ++
@@ -182,7 +182,7 @@ object DisplayNodeGroupTree extends Loggable {
 
                   val tooltipId = Helpers.nextFuncName
             <span class="treeActions">
-                  <span class="tooltipable fa fa-minus-circle text-danger" tooltipid={tooltipId} title="" onclick={exclude(targetInfo).toJsCmd}></span>
+                  <span class="tooltipable fa action-icon except" tooltipid={tooltipId} title="" onclick={exclude(targetInfo).toJsCmd}></span>
                   <div class="tooltipContent" id={tooltipId}><div>Exclude Nodes from this group.</div></div></span>
                   case None => NodeSeq.Empty
                 })

diff --git a/...b/src/main/scala/com/normation/rudder/web/snippet/configuration/DirectiveManagement.scala b/...b/src/main/scala/com/normation/rudder/web/snippet/configuration/DirectiveManagement.scala
@@ -170,6 +170,7 @@ class DirectiveManagement extends DispatchSnippet with Loggable {
                   , Some(onClickActiveTechnique)
                   , Some(onClickDirective)
                   , false
+                  , false
                 )
               }</ul>
             case (x, y, z) =>

diff --git a/...pp/sources/rudder/rudder-web/src/main/webapp/javascript/rudder/angular/groupManagement.js b/...pp/sources/rudder/rudder-web/src/main/webapp/javascript/rudder/angular/groupManagement.js
@@ -122,7 +122,7 @@ groupManagement.controller('GroupCtrl', ['$scope', function($scope) {
           // In included targets => remove from included
           $scope.removeInclude(target);
         }
-      };
+    };
 
     // Explanations to use in popups
     $scope.includeExplanation = [ "<div>Add Groups here to apply this Rule to the nodes they contain.</div><br/>"
@@ -168,24 +168,25 @@ groupManagement.directive('tooltip', function () {
 // Helper function to access from outside angular scope
 
 function excludeTarget(event, target) {
-  event.stopPropagation();
   var scope = angular.element($("#GroupCtrl")).scope();
+  var indexExclude = scope.target.exclude.or.indexOf(target);
   scope.$apply(function() {
-    scope.addExclude(target);
+    if ( indexExclude == -1 )  {
+      scope.addExclude(target);
+    }else{
+      scope.removeExclude(target);
+    }
   });
 };
 
 function includeTarget(event, target) {
-  event.stopPropagation();
   var scope = angular.element($("#GroupCtrl")).scope();
+  var indexInclude = scope.target.include.or.indexOf(target);
   scope.$apply(function(){
-    scope.addInclude(target);
-  });
-};
-
-function onClickTarget(target) {
-  var scope = angular.element($("#GroupCtrl")).scope();
-  scope.$apply(function(){
-    scope.toggleTarget(target);
+    if ( indexInclude == -1 )  {
+      scope.addInclude(target);
+    }else{
+      scope.removeInclude(target);
+    }
   });
 };
diff --git a/webapp/sources/rudder/rudder-web/src/main/webapp/style/rudder/rudder-rules.css b/webapp/sources/rudder/rudder-web/src/main/webapp/style/rudder/rudder-rules.css
@@ -276,4 +276,53 @@ ul.applied-list > .add-target > .fa{
 }
 #groupTree a.jstree-anchor .treeActions{
   cursor: pointer !important;
+}
+
+.jstree ul > li .action-icon{
+  color: #3c763d;
+}
+.jstree ul > li .action-icon.except{
+  color: #a94442;
+}
+.jstree ul > li .action-icon:before{
+  content: "\f055";
+}
+.jstree ul > li .action-icon.except:before{
+  content: "\f056";
+}
+#directiveTree ul > li.included .action-icon,
+#groupTree ul > li.included .action-icon.accept,
+#groupTree ul > li.excluded .action-icon.except{
+  color: #888;
+}
+#directiveTree ul > li.included .action-icon:before{
+  content: "\f057";
+}
+#groupTree ul > li.included .action-icon.accept:before{
+  content: "\f057";
+}
+#groupTree ul > li.excluded .action-icon.except:before{
+  content: "\f057";
+}
+
+.modal .jstree ul > li a.jstree-anchor{
+  margin-top: 1px;
+  border: 1px solid transparent;
+}
+
+.jstree ul > li a.jstree-anchor{
+  cursor: default !important;
+}
+
+.jstree ul > li a.jstree-anchor .treeAction,
+.jstree ul > li a.jstree-anchor .action-icon{
+  cursor: pointer !important;
+}
+
+.jstree .jstree-clicked{
+  background-color: inherit;
+  box-shadow: none !important;
+}
+.jstree .jstree-hovered.jstree-clicked{
+  background-color: rgb(231, 244, 249);
 }
diff --git a/webapp/sources/rudder/rudder-web/src/main/webapp/style/rudder/rudder.css b/webapp/sources/rudder/rudder-web/src/main/webapp/style/rudder/rudder.css
@@ -1158,15 +1158,15 @@ img.treeAction.noRight {
 }
 
 li.included a {
-  background: none repeat scroll 0 0 #DDFFDD !important;
-  border: 1px dotted #48A648 !important;
-  padding: 0 2px 0 1px;
+  background-color: #DDFFDD !important;
+  border: 1px solid #a3d6a3 !important;
+  padding: 0 2px;
 }
 
 li.excluded a{
-  background: none repeat scroll 0 0 #FFDDDD !important;
-  border: 1px dotted #A64848 !important;
-  padding: 0 2px 0 1px;
+  background-color: #FFDDDD !important;
+  border: 1px solid #e7acac !important;
+  padding: 0 2px ;
 }
 
 .title-link {