Merge pull request #880 from weaveworks/871-host-node-color-mismatch

Fixes host node/details panel color mismatch
This commit is contained in:
Simon
2016-02-01 15:33:33 +01:00
3 changed files with 13 additions and 8 deletions

View File

@@ -25,8 +25,8 @@ export default class Node extends React.Component {
}
let labelOffsetY = 18;
let subLabelOffsetY = 35;
const isPseudo = !!this.props.pseudo;
const color = isPseudo ? '' : getNodeColor(this.props.rank, this.props.label);
const color = getNodeColor(this.props.rank, this.props.label,
this.props.pseudo);
const onMouseEnter = this.handleMouseEnter;
const onMouseLeave = this.handleMouseLeave;
const onMouseClick = this.handleMouseClick;

View File

@@ -53,7 +53,9 @@ export default class NodeDetails extends React.Component {
renderLoading() {
const node = this.props.nodes.get(this.props.nodeId);
const label = node ? node.get('label_major') : this.props.label;
const nodeColor = node ? getNodeColorDark(node.get('rank'), label) : getNeutralColor();
const nodeColor = (node ?
getNodeColorDark(node.get('rank'), label, node.get('pseudo')) :
getNeutralColor());
const tools = this.renderTools();
const styles = {
header: {
@@ -129,7 +131,7 @@ export default class NodeDetails extends React.Component {
const details = this.props.details;
const showSummary = details.metadata !== undefined || details.metrics !== undefined;
const showControls = details.controls && details.controls.length > 0;
const nodeColor = getNodeColorDark(details.rank, details.label_major);
const nodeColor = getNodeColorDark(details.rank, details.label, details.pseudo);
const {error, pending} = (this.props.nodeControlStatus || {});
const tools = this.renderTools();
const styles = {
@@ -186,6 +188,6 @@ export default class NodeDetails extends React.Component {
}
updateTitle() {
setDocumentTitle(this.props.details && this.props.details.label_major);
setDocumentTitle(this.props.details && this.props.details.label);
}
}

View File

@@ -44,12 +44,15 @@ export function getNeutralColor() {
return PSEUDO_COLOR;
}
export function getNodeColor(text, secondText) {
export function getNodeColor(text, secondText, isPseudo = false) {
if (isPseudo) {
return PSEUDO_COLOR;
}
return colors(text, secondText).toString();
}
export function getNodeColorDark(text, secondText) {
if (!text) {
export function getNodeColorDark(text = '', secondText = '', isPseudo = false) {
if (isPseudo) {
return PSEUDO_COLOR;
}
const color = d3.rgb(colors(text, secondText));