diff --git a/app.py b/app.py index 5b3c726..a76ba3c 100644 --- a/app.py +++ b/app.py @@ -3,16 +3,23 @@ from flask_redis import FlaskRedis import json, abp, markdown from pprint import pprint import raussendorf +import humanhash +DAY = 60*60*24 app = Flask(__name__) redis = FlaskRedis(app) @app.route("/") def index(): - return render_template("index.html") + secret, uuid = humanhash.uuid() + return redirect("/{}".format(secret)) -@app.route("/graph", methods=["GET", "POST"]) -def graph(): +@app.route("/") +def main(uuid): + return render_template("index.html", uuid=uuid) + +@app.route("//graph", methods=["GET", "POST"]) +def graph(uuid): if request.method == 'POST': # Convert the data to a graph state g = abp.GraphState() @@ -22,21 +29,24 @@ def graph(): data = json.dumps(g.to_json(stringify=True)) # Insert into the database - redis.execute_command("SET", "graph", data) + redis.setex(uuid, data, DAY) # Return success return "Posted {} bytes OK".format(len(data)) + elif redis.exists(uuid): + return redis.get(uuid) else: - # Get from the database - return redis.get("graph") - + g = abp.GraphState() + data = json.dumps(g.to_json(stringify=True)) + redis.setex(uuid, DAY, data) + return data -@app.route("/edit", methods=["POST"]) -def edit(): +@app.route("//edit", methods=["POST"]) +def edit(uuid): # Load the graph from the database g = abp.GraphState() - g.from_json(json.loads(redis.get("graph"))) + g.from_json(json.loads(redis.get(uuid))) # Apply the edit to the graph edit = json.loads(request.data) @@ -66,7 +76,7 @@ def edit(): # New state into JSON and database data = json.dumps(g.to_json(stringify=True)) - redis.execute_command("SET", "graph", data) + redis.setex(uuid, DAY, data) return data diff --git a/static/main.css b/static/main.css index 09b57b4..55e7d4a 100644 --- a/static/main.css +++ b/static/main.css @@ -1,4 +1,5 @@ -html, body { margin: 0; padding: 0; overflow: hidden; font-size: 10pt; font-family: monospace; } +html, body { margin: 0; padding: 0; overflow: hidden; font-size: 10pt; +font-family: monospace; } #node_info { background: rgba(0, 0, 0, .8); color:white; @@ -7,23 +8,20 @@ html, body { margin: 0; padding: 0; overflow: hidden; font-size: 10pt; font-fam position: absolute; top:5px; left:5px; - font-family: monospace; + /*font-family: monospace;*/ text-align: center; - font-size:9pt; /*height:15px;*/ border-radius:3px; pointer-events: none; } #server_info { - background-color: black; + background-color: rgba(0, 0, 0, .8); color:white; padding: 10px; - font-family: monospace; position: absolute; top: 10px; right: 10px; - font-size: 9pt; } #node_name { @@ -31,25 +29,21 @@ html, body { margin: 0; padding: 0; overflow: hidden; font-size: 10pt; font-fam } #node_data { - background-color: black; + background-color: rgba(0, 0, 0, .8); color:white; padding: 10px; - font-family: monospace; position: absolute; top: 10px; left: 10px; - font-size: 9pt; } #controls { - background-color: black; + background-color: rgba(0, 0, 0, .8); color:white; padding: 10px; - font-family: monospace; position: absolute; bottom: 10px; left: 10px; - font-size: 9pt; } #controls a { @@ -60,6 +54,7 @@ html, body { margin: 0; padding: 0; overflow: hidden; font-size: 10pt; font-fam margin: 1px; display: inline-block; text-decoration: none; + cursor: pointer; } #node_data a { @@ -70,31 +65,29 @@ html, body { margin: 0; padding: 0; overflow: hidden; font-size: 10pt; font-fam margin: 1px; display: inline-block; text-decoration: none; + cursor: pointer; } #version { color:black; padding: 10px; - font-family: monospace; position: absolute; bottom: 10px; left: 10px; - font-size: 9pt; } #help { - color:black; + background-color: rgba(0, 0, 0, .8); + color:white; padding: 10px; - font-family: monospace; position: absolute; bottom: 10px; right: 10px; - font-size: 9pt; } #help a{ - color: black; + color: white; } diff --git a/static/scripts/api.js b/static/scripts/api.js index 14ce3d2..fb2b42b 100644 --- a/static/scripts/api.js +++ b/static/scripts/api.js @@ -11,7 +11,7 @@ api.poll = function() { }; // Send the request - xmlhttp.open("GET", "/graph", true); + xmlhttp.open("GET", window.location.href+"/graph", true); xmlhttp.send(); }; @@ -32,7 +32,7 @@ api.edit = function(edit) { }; // Send the request - xmlhttp.open("POST", "/edit", true); + xmlhttp.open("POST", window.location.href+"/edit", true); xmlhttp.setRequestHeader("Content-Type", "application/json"); xmlhttp.send(JSON.stringify(edit)); } diff --git a/static/scripts/main.js b/static/scripts/main.js index 698cb3e..ef08587 100644 --- a/static/scripts/main.js +++ b/static/scripts/main.js @@ -6,5 +6,6 @@ window.onload = function() { gui.prepare(); mouse.prepare(); editor.prepare(); + api.poll(); gui.loop(); }; diff --git a/templates/index.html b/templates/index.html index 153f93c..d590629 100644 --- a/templates/index.html +++ b/templates/index.html @@ -24,45 +24,33 @@ - -
-

Usage:

- Click on the grid to make a new node
- Ctrl-click a node to do a Hadamard
- Select a node, then shift-click another node to do a CZ
- Press space to rotate the grid
- -

API usage:

- GET https://abv.peteshadbolt.co.uk/graph -> JSON
- POST JSON -> https://abv.peteshadbolt.co.uk/graph
- POST JSON -> https://abv.peteshadbolt.co.uk/edit - -

See here for docs.

+ Help