From 7ad77789659bde822e3b6f3d2f7edb433cacf3ac Mon Sep 17 00:00:00 2001
From: David Kaltschmidt <david.kaltschmidt@gmail.com>
Date: Fri, 20 Nov 2015 13:00:41 +0100
Subject: [PATCH 1/2] Skip green and red colors for nodes

---
 client/app/scripts/mixins/node-color-mixin.js | 17 ++++++++++++-----
 1 file changed, 12 insertions(+), 5 deletions(-)

diff --git a/client/app/scripts/mixins/node-color-mixin.js b/client/app/scripts/mixins/node-color-mixin.js
index 845d832b4..525005d88 100644
--- a/client/app/scripts/mixins/node-color-mixin.js
+++ b/client/app/scripts/mixins/node-color-mixin.js
@@ -1,17 +1,24 @@
 const d3 = require('d3');
 
 const colors = d3.scale.category20();
-
-// make sure the internet always gets the same color
-const internetLabel = 'the Internet';
-colors(internetLabel);
-
+const PSEUDO_COLOR = '#b1b1cb';
+let colorIndex = 0;
 
 const NodeColorMixin = {
   getNodeColor: function(text) {
+    colorIndex++;
+    // skip green and red (index 5-8 in d3.scale.category20)
+    if (colorIndex > 4 && colorIndex < 9) {
+      colors('_' + colorIndex);
+      return this.getNodeColor(text);
+    }
+
     return colors(text);
   },
   getNodeColorDark: function(text) {
+    if (text === undefined) {
+      return PSEUDO_COLOR;
+    }
     const color = d3.rgb(colors(text));
     let hsl = color.hsl();
 

From 0cae3541fa65dcf18547a44c8ad4952bd9d87436 Mon Sep 17 00:00:00 2001
From: David Kaltschmidt <david.kaltschmidt@gmail.com>
Date: Fri, 20 Nov 2015 13:01:09 +0100
Subject: [PATCH 2/2] Use rank to determine color in details

---
 client/app/scripts/components/node-details.js | 2 +-
 render/detailed_node.go                       | 2 ++
 render/detailed_node_test.go                  | 2 ++
 3 files changed, 5 insertions(+), 1 deletion(-)

diff --git a/client/app/scripts/components/node-details.js b/client/app/scripts/components/node-details.js
index 35e1773cb..fba553293 100644
--- a/client/app/scripts/components/node-details.js
+++ b/client/app/scripts/components/node-details.js
@@ -61,7 +61,7 @@ const NodeDetails = React.createClass({
       return this.renderLoading();
     }
 
-    const nodeColor = this.getNodeColorDark(details.label_major);
+    const nodeColor = this.getNodeColorDark(details.rank);
     const styles = {
       controls: {
         'backgroundColor': this.brightenColor(nodeColor)
diff --git a/render/detailed_node.go b/render/detailed_node.go
index 18367e28c..ffe7ea626 100644
--- a/render/detailed_node.go
+++ b/render/detailed_node.go
@@ -26,6 +26,7 @@ type DetailedNode struct {
 	ID         string            `json:"id"`
 	LabelMajor string            `json:"label_major"`
 	LabelMinor string            `json:"label_minor,omitempty"`
+	Rank       string            `json:"rank,omitempty"`
 	Pseudo     bool              `json:"pseudo,omitempty"`
 	Tables     []Table           `json:"tables"`
 	Controls   []ControlInstance `json:"controls"`
@@ -115,6 +116,7 @@ func MakeDetailedNode(r report.Report, n RenderableNode) DetailedNode {
 		ID:         n.ID,
 		LabelMajor: n.LabelMajor,
 		LabelMinor: n.LabelMinor,
+		Rank:       n.Rank,
 		Pseudo:     n.Pseudo,
 		Tables:     tables,
 		Controls:   controls(r, n),
diff --git a/render/detailed_node_test.go b/render/detailed_node_test.go
index 0d8f48625..fa31f411e 100644
--- a/render/detailed_node_test.go
+++ b/render/detailed_node_test.go
@@ -88,6 +88,7 @@ func TestMakeDetailedHostNode(t *testing.T) {
 		ID:         render.MakeHostID(fixture.ClientHostID),
 		LabelMajor: "client",
 		LabelMinor: "hostname.com",
+		Rank:       "hostname.com",
 		Pseudo:     false,
 		Controls:   []render.ControlInstance{},
 		Tables: []render.Table{
@@ -155,6 +156,7 @@ func TestMakeDetailedContainerNode(t *testing.T) {
 		ID:         fixture.ServerContainerID,
 		LabelMajor: "server",
 		LabelMinor: fixture.ServerHostName,
+		Rank:       "imageid456",
 		Pseudo:     false,
 		Controls:   []render.ControlInstance{},
 		Tables: []render.Table{