From 3eb8740af5714816104ba5ee393699f188d433e5 Mon Sep 17 00:00:00 2001 From: Shane L'Amoreaux Date: Fri, 17 Nov 2017 10:45:31 -0500 Subject: [PATCH 01/11] Add swarm-viz label parsing --- .../components/nodes/SwarmVizLabelParser.jsx | 53 +++++++++++++++++++ client/src/components/nodes/TaskInfoModal.jsx | 3 ++ 2 files changed, 56 insertions(+) create mode 100644 client/src/components/nodes/SwarmVizLabelParser.jsx diff --git a/client/src/components/nodes/SwarmVizLabelParser.jsx b/client/src/components/nodes/SwarmVizLabelParser.jsx new file mode 100644 index 0000000..ec45e7b --- /dev/null +++ b/client/src/components/nodes/SwarmVizLabelParser.jsx @@ -0,0 +1,53 @@ +import * as React from "react"; +import {connect} from "react-redux"; +import FormRow from "./FormRow"; +import actions from "../../actions"; + + +function ParseLabelOutput(props){ + var keyValue=props.keyValue.replace("${containerid}", props.containerId); + keyValue=keyValue.replace("${imagename}", props.imageName); + keyValue=keyValue.replace("${stackname}", props.nameSpace); + + if(props.keyLabel.indexOf("swarm-viz.link.")>=0){ + return( + + {keyValue} + + ) + } + //Slicing off the "swarm-viz." to look neater + var keyLabel=props.keyLabel.slice(10); + return( + + {keyValue} + + ) +} + +class SwarmVizLabelParser extends React.Component { + render(){ + const { task, service } = this.props; + var toBeParsed = Object.keys(service.Spec.Labels).filter(function(label){ + return label.indexOf("swarm-viz.")>=0; + }) + return( +
+ { toBeParsed.length>= 1 && ( + +
+

Extra Info

+ { toBeParsed.map((key) => ( +
+ ))} + + )} +
+ ) + } +} +const mapStateToProps = (state, props) => ({ + task : state.swarmState.tasks.filter((task) => task.ID === props.taskId)[0], + service : state.swarmState.services.find((service) => service.ID === props.serviceId), +}); +export default connect(mapStateToProps, actions)(SwarmVizLabelParser); \ No newline at end of file diff --git a/client/src/components/nodes/TaskInfoModal.jsx b/client/src/components/nodes/TaskInfoModal.jsx index 009ba15..9986318 100644 --- a/client/src/components/nodes/TaskInfoModal.jsx +++ b/client/src/components/nodes/TaskInfoModal.jsx @@ -3,6 +3,7 @@ import Modal from "react-bootstrap/es/Modal"; import Button from "react-bootstrap/es/Button"; import {connect} from "react-redux"; import FormRow from "./FormRow"; +import SwarmVizLabelParser from "./SwarmVizLabelParser"; import ServiceDetails from "./ServiceDetails"; import actions from "../../actions"; @@ -30,6 +31,8 @@ class TaskInfoModal extends React.Component { { task.UpdatedAt } + +

Service Details

From 2ee1f455e682af4230e648675978049642ab2ced Mon Sep 17 00:00:00 2001 From: Shane L'Amoreaux Date: Fri, 17 Nov 2017 11:14:40 -0500 Subject: [PATCH 02/11] ensure 'swarm-viz.' is at the beginning of label --- client/src/components/nodes/SwarmVizLabelParser.jsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/client/src/components/nodes/SwarmVizLabelParser.jsx b/client/src/components/nodes/SwarmVizLabelParser.jsx index ec45e7b..2721cb6 100644 --- a/client/src/components/nodes/SwarmVizLabelParser.jsx +++ b/client/src/components/nodes/SwarmVizLabelParser.jsx @@ -29,7 +29,7 @@ class SwarmVizLabelParser extends React.Component { render(){ const { task, service } = this.props; var toBeParsed = Object.keys(service.Spec.Labels).filter(function(label){ - return label.indexOf("swarm-viz.")>=0; + return label.indexOf("swarm-viz.")===0; }) return(
From 2702ed2401ea9f649d69dbe1a124b0bfc9339cbd Mon Sep 17 00:00:00 2001 From: Shane L'Amoreaux Date: Fri, 17 Nov 2017 11:17:26 -0500 Subject: [PATCH 03/11] ensure swarm-vis.link. is as beginning of label --- client/src/components/nodes/SwarmVizLabelParser.jsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/client/src/components/nodes/SwarmVizLabelParser.jsx b/client/src/components/nodes/SwarmVizLabelParser.jsx index 2721cb6..d8eaf62 100644 --- a/client/src/components/nodes/SwarmVizLabelParser.jsx +++ b/client/src/components/nodes/SwarmVizLabelParser.jsx @@ -9,7 +9,7 @@ function ParseLabelOutput(props){ keyValue=keyValue.replace("${imagename}", props.imageName); keyValue=keyValue.replace("${stackname}", props.nameSpace); - if(props.keyLabel.indexOf("swarm-viz.link.")>=0){ + if(props.keyLabel.indexOf("swarm-viz.link.")===0){ return( {keyValue} From 746b61dd70559093220c034d02e651ac1cf2bfe6 Mon Sep 17 00:00:00 2001 From: Shane L'Amoreaux Date: Fri, 17 Nov 2017 11:31:50 -0500 Subject: [PATCH 04/11] include templating --- README.md | 16 ++++++++++++++++ 1 file changed, 16 insertions(+) diff --git a/README.md b/README.md index 3cc55c6..21c9882 100644 --- a/README.md +++ b/README.md @@ -60,3 +60,19 @@ At the moment there is no official node image for Windows. Therefore apply anoth ``` docker build -t mikesir87/swarm-viz --build-arg node=stefanscherer/node-windows:1709 . ``` + +## Label Parsing + +Swarm-viz will read through parse labels beginning with `swarm-viz.` and display them in an "Extra Info" section. + +### Link handling + +A label starting with `swarm-viz.link.` will use any remaining text in the identifier as a label, and will turn the value of the label into a clickable link. (Example: `swarm-viz.link.foo:http://google.com` will create the entry `foo : http://google.com`.) + +### Templating + +Input | Output +---------------|----------------- +${containerid} | The container's unique id string. +${imagename} | The name of the image the container was made with. It is pulled from the label `com.docker.stack.image`. +${stackname} | The name of the stack the container is a part of. It is pulled from the label `com.docker.stack.namespace`. \ No newline at end of file From 24efbbca947690c95640c9c9ee08c8add7f6bc08 Mon Sep 17 00:00:00 2001 From: Shane L'Amoreaux Date: Fri, 17 Nov 2017 11:50:07 -0500 Subject: [PATCH 05/11] Change method of retrieving image name to not rely on label --- client/src/components/nodes/SwarmVizLabelParser.jsx | 6 +++++- 1 file changed, 5 insertions(+), 1 deletion(-) diff --git a/client/src/components/nodes/SwarmVizLabelParser.jsx b/client/src/components/nodes/SwarmVizLabelParser.jsx index d8eaf62..ea4d78c 100644 --- a/client/src/components/nodes/SwarmVizLabelParser.jsx +++ b/client/src/components/nodes/SwarmVizLabelParser.jsx @@ -5,6 +5,7 @@ import actions from "../../actions"; function ParseLabelOutput(props){ + console.log(props.imageName) var keyValue=props.keyValue.replace("${containerid}", props.containerId); keyValue=keyValue.replace("${imagename}", props.imageName); keyValue=keyValue.replace("${stackname}", props.nameSpace); @@ -38,7 +39,10 @@ class SwarmVizLabelParser extends React.Component {

Extra Info

{ toBeParsed.map((key) => ( -
+
+
))} )} From 891c9a88541794c4e6511e6f454163555e648bc2 Mon Sep 17 00:00:00 2001 From: Shane L'Amoreaux Date: Fri, 17 Nov 2017 11:56:12 -0500 Subject: [PATCH 06/11] replace missing namespace --- client/src/components/nodes/SwarmVizLabelParser.jsx | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/client/src/components/nodes/SwarmVizLabelParser.jsx b/client/src/components/nodes/SwarmVizLabelParser.jsx index ea4d78c..b24cb1d 100644 --- a/client/src/components/nodes/SwarmVizLabelParser.jsx +++ b/client/src/components/nodes/SwarmVizLabelParser.jsx @@ -41,7 +41,8 @@ class SwarmVizLabelParser extends React.Component { { toBeParsed.map((key) => (
+ imageName={task.Spec.ContainerSpec.Image.slice(0,-(task.Spec.ContainerSpec.Image.length)+(task.Spec.ContainerSpec.Image.indexOf(":")))} + nameSpace={service.Spec.Labels["com.docker.stack.namespace"]}/>
))} From 21322233ba91b1e38b99341dc435168d544acd31 Mon Sep 17 00:00:00 2001 From: Shane L'Amoreaux Date: Fri, 17 Nov 2017 12:12:48 -0500 Subject: [PATCH 07/11] removed stackname label dependency --- client/src/components/nodes/SwarmVizLabelParser.jsx | 5 ++--- 1 file changed, 2 insertions(+), 3 deletions(-) diff --git a/client/src/components/nodes/SwarmVizLabelParser.jsx b/client/src/components/nodes/SwarmVizLabelParser.jsx index b24cb1d..402b074 100644 --- a/client/src/components/nodes/SwarmVizLabelParser.jsx +++ b/client/src/components/nodes/SwarmVizLabelParser.jsx @@ -5,10 +5,9 @@ import actions from "../../actions"; function ParseLabelOutput(props){ - console.log(props.imageName) var keyValue=props.keyValue.replace("${containerid}", props.containerId); keyValue=keyValue.replace("${imagename}", props.imageName); - keyValue=keyValue.replace("${stackname}", props.nameSpace); + keyValue=keyValue.replace("${stackname}", props.serviceName.slice(0,(props.serviceName.indexOf(props.imageName)-(props.serviceName.length + 1)))); if(props.keyLabel.indexOf("swarm-viz.link.")===0){ return( @@ -42,7 +41,7 @@ class SwarmVizLabelParser extends React.Component {
+ serviceName={service.Spec.Name}/>
))} From 2801396a2bb60a836584318c67a8d43a920f66db Mon Sep 17 00:00:00 2001 From: Shane L'Amoreaux Date: Fri, 17 Nov 2017 12:14:40 -0500 Subject: [PATCH 08/11] remove label dependencies --- README.md | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/README.md b/README.md index 21c9882..421278f 100644 --- a/README.md +++ b/README.md @@ -74,5 +74,5 @@ A label starting with `swarm-viz.link.` will use any remaining text in the ident Input | Output ---------------|----------------- ${containerid} | The container's unique id string. -${imagename} | The name of the image the container was made with. It is pulled from the label `com.docker.stack.image`. -${stackname} | The name of the stack the container is a part of. It is pulled from the label `com.docker.stack.namespace`. \ No newline at end of file +${imagename} | The name of the image the container was made with. It is found by removing the extra info from the container name. +${stackname} | The name of the stack the container is a part of. It is found from subtracting the image name from the service name. \ No newline at end of file From d8c46e64555becbce3c19ba2509ad73650756bcd Mon Sep 17 00:00:00 2001 From: Shane L'Amoreaux Date: Fri, 17 Nov 2017 12:23:37 -0500 Subject: [PATCH 09/11] phrasing --- README.md | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) diff --git a/README.md b/README.md index 421278f..bdb42a4 100644 --- a/README.md +++ b/README.md @@ -63,12 +63,14 @@ docker build -t mikesir87/swarm-viz --build-arg node=stefanscherer/node-windows: ## Label Parsing -Swarm-viz will read through parse labels beginning with `swarm-viz.` and display them in an "Extra Info" section. +Swarm-viz will parse labels beginning with `swarm-viz.` and display them in an "Extra Info" section. It also supports templating. ### Link handling A label starting with `swarm-viz.link.` will use any remaining text in the identifier as a label, and will turn the value of the label into a clickable link. (Example: `swarm-viz.link.foo:http://google.com` will create the entry `foo : http://google.com`.) +Templating is taken into account before link parsing, allowing for dynamic links. + ### Templating Input | Output From baea1e27318ca97f051332164d408b247f2696b7 Mon Sep 17 00:00:00 2001 From: Shane L'Amoreaux Date: Fri, 17 Nov 2017 12:33:39 -0500 Subject: [PATCH 10/11] Moved parsed info to top if it exists. --- client/src/components/nodes/SwarmVizLabelParser.jsx | 4 ++-- client/src/components/nodes/TaskInfoModal.jsx | 5 +++-- 2 files changed, 5 insertions(+), 4 deletions(-) diff --git a/client/src/components/nodes/SwarmVizLabelParser.jsx b/client/src/components/nodes/SwarmVizLabelParser.jsx index 402b074..fbdf533 100644 --- a/client/src/components/nodes/SwarmVizLabelParser.jsx +++ b/client/src/components/nodes/SwarmVizLabelParser.jsx @@ -35,8 +35,7 @@ class SwarmVizLabelParser extends React.Component {
{ toBeParsed.length>= 1 && ( -
-

Extra Info

+

Parsed Info

{ toBeParsed.map((key) => (
))} +
)}
diff --git a/client/src/components/nodes/TaskInfoModal.jsx b/client/src/components/nodes/TaskInfoModal.jsx index 9986318..b0d0b7a 100644 --- a/client/src/components/nodes/TaskInfoModal.jsx +++ b/client/src/components/nodes/TaskInfoModal.jsx @@ -17,6 +17,9 @@ class TaskInfoModal extends React.Component {
+ + +

Container Details

{ task.Status.ContainerStatus.ContainerID } @@ -31,8 +34,6 @@ class TaskInfoModal extends React.Component { { task.UpdatedAt } - -

Service Details

From 51f815ffbf1496b061ea77bc91dbbf84d725c6c9 Mon Sep 17 00:00:00 2001 From: Shane L'Amoreaux Date: Fri, 17 Nov 2017 12:48:34 -0500 Subject: [PATCH 11/11] Removed unnecessary math --- client/src/components/nodes/SwarmVizLabelParser.jsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/client/src/components/nodes/SwarmVizLabelParser.jsx b/client/src/components/nodes/SwarmVizLabelParser.jsx index fbdf533..bbe4fdc 100644 --- a/client/src/components/nodes/SwarmVizLabelParser.jsx +++ b/client/src/components/nodes/SwarmVizLabelParser.jsx @@ -11,7 +11,7 @@ function ParseLabelOutput(props){ if(props.keyLabel.indexOf("swarm-viz.link.")===0){ return( - + {keyValue} )