Browse Source

Finally fixed stupid editing problem

Pete Shadbolt 1 year ago
parent
commit
631909c739
4 changed files with 45 additions and 40 deletions
  1. 1
    1
      static/doc.css
  2. 8
    1
      static/scripts/editor.js
  3. 27
    16
      templates/doc.md
  4. 9
    22
      test.py

+ 1
- 1
static/doc.css View File

@@ -12,7 +12,7 @@ code {
12 12
 }
13 13
 
14 14
 pre{
15
-    padding: 2em;
15
+    padding: 1em;
16 16
     background-color: #fafafa;
17 17
     border: 1px solid #eeeeee;
18 18
     overflow-x: auto;

+ 8
- 1
static/scripts/editor.js View File

@@ -41,6 +41,13 @@ editor.focus = function(node) {
41 41
     gui.hideNodeMessage();
42 42
     editor.selection = node;
43 43
 
44
+    var rotation = editor.orientations[editor.orientation];
45
+    var normal = new THREE.Vector3(0, 1, 0);
46
+    normal.applyEuler(rotation);
47
+    editor.grid.rotation.copy(rotation);
48
+    editor.plane = new THREE.Plane();
49
+    editor.plane.setFromNormalAndCoplanarPoint(normal, editor.grid.position);
50
+
44 51
     //gui.serverMessage("Selected node " + node + ".");
45 52
 };
46 53
 
@@ -62,10 +69,10 @@ editor.addQubitAtPoint = function(point) {
62 69
 editor.onClick = function() {
63 70
     var found = editor.findNodeOnRay(mouse.ray);
64 71
     if (found) {
65
-        editor.focus(found);
66 72
         var node=found;
67 73
         editor.grid.position.copy(abj.node[node].position);
68 74
         gui.controls.target.copy(abj.node[node].position);
75
+        editor.focus(found);
69 76
         node_name.innerHTML = "Node " + node;
70 77
         node_data.className = "visible";
71 78
         node_vop.innerHTML = "VOP: " + abj.node[node].vop;

+ 27
- 16
templates/doc.md View File

@@ -1,28 +1,39 @@
1
-# ABP server
2
-
3
-This server does a few things:
4
-
5
-- Keeps a graph state in memory using a data structure that is compatible with `abp`
6
-- Serves a JSON representation of that object 
7
-- Accepts updates to that object via POST requests 
8
-- Displays a 3D representation of the state 
9
-- Randomly updates the state every five seconds
1
+# Graph state server
2
+Graph states are a way of efficiently representing the state of a system of qubits. This tool simulates the behaviour of the graph state and shows an interactive 3D representation of the state. Interaction with the simulation is done either by clicking on things in the web browser or through an API.
10 3
 
11 4
 ## Using the interface
12
-Sessions are identified by a UUID such as `oranges-arkansas-mexico-fish`. You can share this URL with other people to share your screen and edit collaboratively.
5
+The state is initialized as a blank canvas without any qubits.
13 6
 
14
-- Click on the grid to make a new node
15
-- Ctrl-click a node to act a Hadamard gate
16
-- Select a node, then shift-click another node to act a CZ gate
7
+- Click on the grid to make a new qubit
8
+- Hold Ctrl and click on a qubit to act a Hadamard gate
9
+- Click on a qubit to view its properties
10
+- Select a qubit, then shift-click another node to act a CZ gate
17 11
 - Press space to rotate the grid
18 12
 
13
+Arbitrary 3D structures can be constructed by rotating the grid.
14
+
15
+The URL contains a unique ID such as `oranges-arkansas-mexico-fish`. You can share this URL with other people to share your screen and edit collaboratively.
16
+
19 17
 ## Python package
20 18
 The underlying graph state simulator is based on Anders' and Briegel's method. Full docs for the Python package are [here](https://peteshadbolt.co.uk/static/abp/).
21 19
 
22
-
23 20
 ## API
24 21
 
25
-We expose an API so that you can programmatically read and write states to/from the server and simulate mouse clicks.
22
+Here's a complete example of sending a state from Python to the server:
23
+
24
+    :::python
25
+    import requests, json, abp
26
+    
27
+    # Make a new graph and position the nodes
28
+    g = abp.NXGraphState(range(10))
29
+    g.layout()
30
+    
31
+    # Serialize
32
+    data = json.dumps(test_graph().to_json())
33
+    
34
+    # Post to the server
35
+    URL = "https://abv.peteshadbolt.co.uk/oranges-arkansas-mexico-fish"
36
+    requests.post("{}/graph".format(URL), data=data)
26 37
 
27 38
 ### Endpoints
28 39
 
@@ -37,7 +48,7 @@ We expose an API so that you can programmatically read and write states to/from
37 48
 
38 49
 ### Data format
39 50
 
40
-If you do an HTTPS GET against `/<uuid>/graph`, you will receive some JSON.
51
+An HTTP GET to `/<uuid>/graph` will return some JSON.
41 52
 
42 53
     :::bash
43 54
     $ curl https://abv.peteshadbolt.co.uk/<uuid>/graph

+ 9
- 22
test.py View File

@@ -1,26 +1,13 @@
1
-"""
2
-Makes a dummy post to the test server
3
-"""
4
-import requests
5
-import json
6
-import abp
7
-import random
1
+import requests, json, abp
8 2
 
9
-#URL = "http://localhost:5000"
10
-URL = "https://abv.peteshadbolt.co.uk/"
3
+# Make a new graph and position the nodes
4
+g = abp.NXGraphState(range(N))
5
+g.layout()
11 6
 
12
-def test_graph():
13
-    N = 10
14
-    g = abp.NXGraphState(range(N))
7
+# Serialize
8
+data = json.dumps(test_graph().to_json())
15 9
 
16
-    for i in range(N):
17
-        g.act_cz(random.randint(0, N-1), random.randint(0, N-1))
18
-
19
-    g.layout()
20
-    return g
21
-
22
-if __name__ == '__main__':
23
-    data = json.dumps(test_graph().to_json(stringify=False))
24
-    r = requests.post("{}/graph".format(URL), data=data)
25
-    print r.status_code, r.content
10
+# Post to the server
11
+URL = "https://abv.peteshadbolt.co.uk/grey-johnny-lima-saturn"
12
+requests.post("{}/graph".format(URL), data=data)
26 13