Show important step properties in graph

Information about scatter and conditionals in the
step are passed on to the workflow graph. The VS Code
plugin shows this information in the preview pane.
Scatter steps are marked with "S" and conditional
steps are marked with "?". Hovering over a step will
show the scatter variables and the conditional
expression.

Also refactor to rename "lines" variable to "line-numbers"
which is more clear in the context of a graph output.

Author: Kaushik Ghose

benten/code/workflowgraph.py

@@ -12,7 +12,7 @@ def cwl_graph(cwl: dict):
     graph = {
         "nodes": [],
         "edges": [],
-        "lines": {}
+        "line-numbers": {}
     }
 
     inputs = ListOrMap(cwl.get("inputs", {}), key_field="id", problems=[])
@@ -34,10 +34,32 @@ def _add_nodes(graph, grp, grp_id):
         graph["nodes"] += [{
             "id": k,
             "label": v.get("label", k) if isinstance(v, dict) else k,
-            "title": v.get("label", k) if isinstance(v, dict) else k,
             "group": grp_id
         }]
-        graph["lines"][k] = grp.get_range_for_value(k).start.line
+        _mark_step_modifiers(graph["nodes"][-1], v)
+        graph["line-numbers"][k] = grp.get_range_for_value(k).start.line
+
+
+def _mark_step_modifiers(node_data, node):
+    if not isinstance(node, dict):
+        return
+
+    code, title = "", []
+    _scatter = node.get("scatter")
+    _conditional = node.get("when")
+    if _scatter:
+        code += "S"
+        title += [f"Scatter on {_scatter}"]
+    if _conditional:
+        code += "?"
+        title += [f"Conditional on {_conditional}"]
+    if code:
+        node_data["icon"] = {
+            "code": code,
+            "color": "#ffffff"
+        }
+    if title:
+        node_data["title"] = "<br/>".join(title)
 
 
 def _add_edges(graph, inputs, outputs, steps):

benten/version.py

@@ -1,3 +1,3 @@
 #  Copyright (c) 2019 Seven Bridges. See LICENSE
 
-__version__ = "2019.11.27"
+__version__ = "2019.12.03"

docs/developer.md

@@ -33,7 +33,7 @@ CMD + Shift + P to bring up the command bar and then type "Reload Window".
 
 ```
 python3 setup.py sdist bdist_wheel
-twine upload dist/...
+twine upload dist/*
 ```
 
 ### Release on VS Code Marketplace

media/2019.12.03/full-window.png

@@ -1,6 +1,6 @@
 # VS Code plugin for Rabix/Benten CWL language server
 
-<img height="400px" src="https://raw.githubusercontent.com/rabix/benten/master/media/2019.10.22/full-window.png"></img>
+<img height="400px" src="https://raw.githubusercontent.com/rabix/benten/master/media/2019.12.03/full-window.png"></img>
 
 - Syntax highlighting (CWL and JS)
 - Evaluate expression on hover

vscode-client/Readme.md

@@ -3,7 +3,7 @@
 	"publisher": "sbg-rabix",
 	"displayName": "CWL (Rabix/Benten)",
 	"description": "Autocomplete, code validation and more for CWL documents",
-	"version": "2019.11.27",
+	"version": "2019.12.3",
 	"preview": false,
 	"icon": "benten-icon-128px.png",
 	"galleryBanner": {

vscode-client/package.json

@@ -209,7 +209,7 @@ function updateWebviewContent(panel: WebviewPanel, on_disk_files: [string, Uri])
   var edges = new vis.DataSet(${JSON.stringify(graph_data["edges"])})
 
 	// metadata for scrolling to nodes
-	var lines = ${JSON.stringify(graph_data["lines"])}
+	var line_numbers = ${JSON.stringify(graph_data["line-numbers"])}
 
   // create a network
   var container = document.getElementById('cwl-graph');
@@ -276,7 +276,7 @@ function updateWebviewContent(panel: WebviewPanel, on_disk_files: [string, Uri])
 		const node_id = params.nodes[0]
 		vscode.postMessage({
 			"uri": "${activeEditor.document.uri.toString()}",
-			"line": lines[node_id]});
+			"line": line_numbers[node_id]});
 	});
 
 </script>