git-tfs-id: [http://tfs.userrendszerhaz.hu:8080/tfs/DefaultCollection]$/MediaCube...

diff --git a/server/user.mediacube.gui/js/processVisualizer2.js b/server/user.mediacube.gui/js/processVisualizer2.js
new file mode 100644 (file)
index 0000000..5f42597
--- /dev/null
+++ b/server/user.mediacube.gui/js/processVisualizer2.js
@@ -0,0 +1,88 @@
+\r
+var defaultFlowchartData = {\r
+       operators: {\r
+               operator1: {\r
+                       top: 20,\r
+                       left: 20,\r
+                       properties: {\r
+                               title: 'Operator 1',\r
+                               extrastyle: "mctype-blue",\r
+                               inputs: {},\r
+                               outputs: {\r
+                                       output_1: {\r
+                                               label: 'Output 1',\r
+                                       }\r
+                               }\r
+                       }\r
+               },\r
+               operator2: {\r
+                       top: 80,\r
+                       left: 300,\r
+                       properties: {\r
+                               title: 'Operator 2',\r
+                               extrastyle: "mctype-green",\r
+                               inputs: {\r
+                                       input_1: {\r
+                                               label: 'Input 1',\r
+                                       },\r
+                                       input_2: {\r
+                                               label: 'Input 2',\r
+                                       },\r
+                               },\r
+                               outputs: {}\r
+                       }\r
+               },\r
+       },\r
+       links: {\r
+               link_1: {\r
+                       fromOperator: 'operator1',\r
+                       fromConnector: 'output_1',\r
+                       toOperator: 'operator2',\r
+                       toConnector: 'input_2',\r
+               },\r
+       }\r
+};\r
+\r
+/*\r
+\r
+var defaultFlowchartData = {\r
+       operators: {\r
+               operator1: {\r
+                       top: 20,\r
+                       left: 20,\r
+                       properties: {\r
+                               title: 'Operator 1',\r
+                               inputs: {},\r
+                               extrastyle: "mctype-blue",\r
+                               outputs: {\r
+                                       output_1: {\r
+                                               label: 'Output 1',\r
+                                       }\r
+                               }\r
+                       }\r
+               }\r
+       }\r
+};\r
+*/\r
+var flowChartWidget = null;\r
+\r
+$(document).ready(function() {\r
+       var $flowchart = $('#flowchartworkspace2');\r
+       console.log($flowchart.flowchart);\r
+\r
+       flowChartWidget = $flowchart.flowchart({\r
+               data: defaultFlowchartData,\r
+               defaultSelectedLinkColor: '#000055',\r
+               grid: 10,\r
+               multipleLinksOnInput: true,\r
+               multipleLinksOnOutput: true\r
+       });     \r
+});\r
+\r
+function setFlowchartData(data) {\r
+       console.log("Changing data", data);\r
+       //var x = {operators: { operator1 : { properties: { title: 'Operator X' }       }}};\r
+       flowChartWidget.flowchart("setData", data);             \r
+}\r
+\r
+\r