Just managed to poll data from server to client :)

7年前 · b9b32b3c0a
--- a/static/scripts/graph.js
+++ b/static/scripts/graph.js
@@ -3,7 +3,7 @@ graph.colors = ["red", "green"];

 graph.prepare = function() {
    materials.prepare();
    websocket.connect(graph.update);
    //poller.connect(graph.update);
 };

 graph.center = function() {
--- a/static/scripts/poller.js
+++ b/static/scripts/poller.js
@@ -0,0 +1,23 @@
 function poll() {
    var xmlhttp = new XMLHttpRequest();
    xmlhttp.onreadystatechange = function() {
        if (xmlhttp.readyState == XMLHttpRequest.DONE) {
           if (xmlhttp.status == 200) {
               update(xmlhttp.responseText);
           }
        }
    };

    // Send the request
    xmlhttp.open("GET", "/graph", true);
    xmlhttp.send();
 };


 function update(s) {
    json = JSON.parse(s);
    graph.update(json);
 }

 // Launch the polling loop
 setInterval(poll, 1000);
--- a/static/scripts/websocket.js
+++ b/static/scripts/websocket.js
@@ -1,36 +0,0 @@
 var websocket = {};
 websocket.update = undefined;

 websocket.connect = function(update) {
    websocket.ws = new WebSocket("ws://localhost:5000");
    if (update){
        websocket.update = update;
    }
    websocket.ws.onopen = function(evt) {
        gui.serverMessage("Connected to server.");
    };

    websocket.ws.onerror = function(err) {
        gui.serverMessage("Could not connect to server.");
    };

    websocket.ws.onmessage = function(evt) {
        json = JSON.parse(evt.data);
        for (var i in json.node) {
            var pos = json.node[i].position;
            json.node[i].position = new THREE.Vector3(pos.x, pos.y, pos.z);
            if (json.node[i].vop === undefined){
                json.node[i].vop = 0;
            }
        }
        websocket.update(json);
    };

    websocket.ws.onclose = function(evt) {
        gui.serverMessage("No connection to server. <a href='#' onclick='javascript:websocket.connect()'>Reconnect</a>.", true);
    };
 };

 websocket.edit = function (data) {
    websocket.ws.send("edit:"+JSON.stringify(data));
 };
--- a/templates/index.html
+++ b/templates/index.html
@@ -14,13 +14,13 @@
  <script src="{{ url_for("static", filename="scripts/graph.js") }}"></script>
  <script src="{{ url_for("static", filename="scripts/gui.js") }}"></script>
  <script src="{{ url_for("static", filename="scripts/editor.js") }}"></script>
  <script src="{{ url_for("static", filename="scripts/websocket.js") }}"></script>
  <script src="{{ url_for("static", filename="scripts/poller.js") }}"></script>
  <script src="{{ url_for("static", filename="scripts/main.js") }}"></script>
 </head>

 <body>
 <img id=ball src="img/ball.png" style=display:none;>
 <img id=tip src="img/tip.png" style=display:none;>
 <img id=ball src="{{url_for("static", filename="img/ball.png") }}" style=display:none;>
 <img id=tip src="{{url_for("static", filename="img/tip.png") }}" style=display:none;>
 <div id=node_info class=hidden> nothing </div>
 <div id=server_info class=hidden> </div>

--- a/test.py
+++ b/test.py
@@ -6,14 +6,15 @@ import json
 import abp

 def test_graph():
    N = 1000
    g = abp.GraphState(range(N), vop="hadamard")
    N = 100
    g = abp.NXGraphState(range(N), vop="hadamard")
    for i in range(N-1):
        g.act_cz(i, i+1)
    g.layout()
    return g

 if __name__ == '__main__':
    data = json.dumps(test_graph().to_json())
    data = json.dumps(test_graph().to_json(stringify=False))
    r = requests.post("http://localhost:5000/graph", data=data)
    print r.status_code, r.content