Added WebSocket code for Euler Diagram creation

Although this will be moved to an external location at some point

visualizations/high/README.md

@@ -1,11 +1,8 @@
-To run the offline high level visualization, there are several requirements:
+Navigate to regions.html in your HTML5 compliant browser. You must be connected to the web.
 
-All files need to be stored in a webserver, specifically one that can run PHP.
-The webserver also needs Java 1.6 or greater.
+Currently, you will need to run ws/bin/ws-server.php from the command line for the Euler diagram creation to be run. Soon, this will be stored externally so only a web connection will be required.
 
-Once these requirements are met, navigate to regions.html in your HTML5 compliant browser.
-
-It requires three files in various formats, and these formats must be exact.
+The visualization requires three files in various formats, and these formats must be exact.
 
 Example of sgroup format (see sgroup.txt):
 ```

visualizations/high/regions.js

@@ -12,6 +12,16 @@ var currentTime = 0;
 var svg;
 var times = [];
 
+var conn = new WebSocket('ws://localhost:8081');
+//var conn = new WebSocket('ws://cs.kent.ac.uk/~rb440/:8081');
+conn.onopen = function(e) {
+    console.log("Connection established!");
+};
+
+conn.onmessage = function(e) {
+    parseCircles(e.data);
+};
+
 /** A labelled circle */
 function Circle(label,r,x,y) {
 	this.label = label;
@@ -167,7 +177,8 @@ function readFile(fileType){
 		if (fileType == "sGroup"){
 			sGroupsRead = true;
 
-			parseCircles(output);
+			//parseCircles(output);
+			conn.send(output);
 
 			$(sGroupUpload).hide();
 			$(nodesBox).show();
@@ -252,30 +263,20 @@ function parseNodes(nodesFile) {
 
 function parseCircles(input){
 
+	console.log(input);
+
 	//var url = "http://www.cs.kent.ac.uk/people/rpg/rb440/Release/runJava.php?input="+input;
-	var url = "runJava.php?input="+input;
-
-	var xhr = new XMLHttpRequest();
-	xhr.open("GET", url, true);
-
-	xhr.onload = function() {			
-		//decodeCsv(xhr.responseText.split("\n"));
-		console.log(xhr.responseText);
-		//console.log(circles,zones);
-		//testRegion(zones);
-
-		//console.log(circleFile);
-
-		circleFile = xhr.responseText.split("\n")
-		//use 1 as first row of input are labels
-		for (var i = 1; i < circleFile.length-1; i++){
-			var result = circleFile[i].split(",");
-			//console.log(result);
-			var c = new Circle(result[0].trim(), parseInt(result[3]), parseInt(result[1]), parseInt(result[2]));
-			circles.push(c);	
-		}
-	};
-	xhr.send();
+	//var url = "runJava.php?input="+input;
+
+	circleFile = input.split("\n")
+	//use 1 as first row of input are labels
+	for (var i = 1; i < circleFile.length-1; i++){
+		var result = circleFile[i].split(",");
+		//console.log(result);
+		var c = new Circle(result[0].trim(), parseInt(result[3]), parseInt(result[1]), parseInt(result[2]));
+		circles.push(c);	
+	}
+
 
 }
 

visualizations/high/ws/bin/ws-server.php

@@ -0,0 +1,28 @@
+<?php
+use Ratchet\Server\IoServer;
+use Ratchet\Http\HttpServer;
+use Ratchet\WebSocket\WsServer;
+use HighVis\HVWebSocket;
+
+    //require '/../autoload.php';
+    require dirname(__DIR__) . '/vendor/autoload.php'; 
+
+    //require '/vendor/autoload.php';
+/*
+    $server = IoServer::factory(
+            new WsServer(
+                new HVWebSocket()
+            )
+        , 8081
+    );
+/*/
+$server = IoServer::factory(
+        new HttpServer(
+            new WsServer(
+                new HVWebSocket()
+            )
+        ),
+        8081
+    );
+
+    $server->run();

visualizations/high/ws/composer.json

@@ -0,0 +1,10 @@
+{
+    "autoload": {
+        "psr-0": {
+            "HighVis": "src"
+        }
+    },
+    "require": {
+        "cboden/Ratchet": "0.3.*"
+    }
+}