From ff310f89bd22b0b563b6f1865e4c47baab6a83ad Mon Sep 17 00:00:00 2001
From: Nick O'Leary <nick.oleary@gmail.com>
Date: Tue, 12 May 2020 10:59:41 +0100
Subject: [PATCH] [groups] Support RED.view.reveal(group-id)

---
 .../src/js/ui/tab-info-outliner.js             | 17 +++++------------
 .../@node-red/editor-client/src/js/ui/view.js  | 18 ++++++++++++------
 2 files changed, 17 insertions(+), 18 deletions(-)

diff --git a/packages/node_modules/@node-red/editor-client/src/js/ui/tab-info-outliner.js b/packages/node_modules/@node-red/editor-client/src/js/ui/tab-info-outliner.js
index ec06808e7..71ade350e 100644
--- a/packages/node_modules/@node-red/editor-client/src/js/ui/tab-info-outliner.js
+++ b/packages/node_modules/@node-red/editor-client/src/js/ui/tab-info-outliner.js
@@ -123,9 +123,6 @@ RED.sidebar.info.outliner = (function() {
     }
 
     function addControls(n,div) {
-        if (n.type === 'group') {
-            return;
-        }
         var controls = $('<div>',{class:"red-ui-info-outline-item-controls red-ui-info-outline-item-hover-controls"}).appendTo(div);
         if (n._def.button) {
             $('<button type="button" class="red-ui-info-outline-item-control-action red-ui-button red-ui-button-small"><i class="fa fa-toggle-right"></i></button>').appendTo(controls).on("click",function(evt) {
@@ -134,15 +131,11 @@ RED.sidebar.info.outliner = (function() {
                 RED.view.clickNodeButton(n);
             })
         }
-
-
-        if (n.type !== 'group') {
-            $('<button type="button" class="red-ui-info-outline-item-control-reveal red-ui-button red-ui-button-small"><i class="fa fa-eye"></i></button>').appendTo(controls).on("click",function(evt) {
-                evt.preventDefault();
-                evt.stopPropagation();
-                RED.view.reveal(n.id);
-            })
-        }
+        $('<button type="button" class="red-ui-info-outline-item-control-reveal red-ui-button red-ui-button-small"><i class="fa fa-eye"></i></button>').appendTo(controls).on("click",function(evt) {
+            evt.preventDefault();
+            evt.stopPropagation();
+            RED.view.reveal(n.id);
+        })
         if (n.type !== 'group' && n.type !== 'subflow') {
             $('<button type="button" class="red-ui-info-outline-item-control-disable red-ui-button red-ui-button-small"><i class="fa fa-circle-thin"></i><i class="fa fa-ban"></i></button>').appendTo(controls).on("click",function(evt) {
                 evt.preventDefault();
diff --git a/packages/node_modules/@node-red/editor-client/src/js/ui/view.js b/packages/node_modules/@node-red/editor-client/src/js/ui/view.js
index d15ef09d4..84bb1dac5 100755
--- a/packages/node_modules/@node-red/editor-client/src/js/ui/view.js
+++ b/packages/node_modules/@node-red/editor-client/src/js/ui/view.js
@@ -4145,8 +4145,8 @@ if (DEBUG_EVENTS) { console.warn("nodeMouseDown", mouse_mode,d); }
                     .attr('rx',groupBorderRadius).attr('ry',groupBorderRadius)
                     .attr("x",-4)
                     .attr("y",-4)
-                selectGroup.on("mousedown", function() {console.log("omd");groupMouseDown.call(g[0][0],d)});
-                selectGroup.on("mouseup", function() {console.log("omu");groupMouseUp.call(g[0][0],d)});
+                selectGroup.on("mousedown", function() {groupMouseDown.call(g[0][0],d)});
+                selectGroup.on("mouseup", function() {groupMouseUp.call(g[0][0],d)});
 
                 g.append('rect').classed("red-ui-flow-group-outline",true).attr('rx',0.5).attr('ry',0.5);
 
@@ -4230,14 +4230,20 @@ if (DEBUG_EVENTS) { console.warn("nodeMouseDown", mouse_mode,d); }
                     var selectGroupRect = selectGroup.children[0];
                     selectGroupRect.setAttribute("width",d.w+8)
                     selectGroupRect.setAttribute("height",d.h+8)
-                    selectGroupRect.style.strokeOpacity = (d.selected)?0.8:0;
+                    selectGroupRect.style.strokeOpacity = (d.selected || d.highlighted)?0.8:0;
                     selectGroupRect.style.strokeDasharray = (d.active)?"10 4":"";
                     selectGroupRect = selectGroup.children[1];
                     selectGroupRect.setAttribute("width",d.w+8)
                     selectGroupRect.setAttribute("height",d.h+8)
-                    selectGroupRect.style.strokeOpacity = (d.selected)?0.8:0;
+                    selectGroupRect.style.strokeOpacity = (d.selected || d.highlighted)?0.8:0;
                     selectGroupRect.style.strokeDasharray = (d.active)?"10 4":"";
 
+                    if (d.highlighted) {
+                        selectGroup.classList.add("red-ui-flow-node-highlighted");
+                    } else {
+                        selectGroup.classList.remove("red-ui-flow-node-highlighted");
+                    }
+
 
                     g.selectAll(".red-ui-flow-group-body")
                         .attr("width",d.w)
@@ -4663,9 +4669,9 @@ if (DEBUG_EVENTS) { console.warn("nodeMouseDown", mouse_mode,d); }
             if (RED.nodes.workspace(id) || RED.nodes.subflow(id)) {
                 RED.workspaces.show(id);
             } else {
-                var node = RED.nodes.node(id);
+                var node = RED.nodes.node(id) || RED.nodes.group(id);
                 if (node) {
-                    if (node._def.category !== 'config' && node.z) {
+                    if (node.z && (node.type === "group" || node._def.category !== 'config')) {
                         node.highlighted = true;
                         node.dirty = true;
                         RED.workspaces.show(node.z);