Browse Source

Editor is now working

master
Pete Shadbolt 8 years ago
parent
commit
ebe01c94ab
7 changed files with 82 additions and 34 deletions
  1. +11
    -11
      static/index.html
  2. +1
    -1
      static/main.css
  3. +16
    -9
      static/scripts/anders_briegel.js
  4. +51
    -10
      static/scripts/editor.js
  5. +1
    -1
      static/scripts/graph.js
  6. +1
    -1
      static/scripts/main.js
  7. +1
    -1
      static/scripts/websocket.js

+ 11
- 11
static/index.html View File

@@ -20,25 +20,25 @@
</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="img/ball.png" style=display:none;>
<img id=tip src="img/tip.png" style=display:none;>
<div id=node_info class=hidden> nothing </div>
<div id=server_info class=hidden> </div>

<div id=pallette>
<h3>Node (5,2)</h3>
<div id=node_data class=hidden>
<h3 id=node_name></h3>
<ul>
<li>VOP: Hadamard</li>
<li>x: 0 | y: 5 | z: 10</li>
<li id=node_vop></li>
<li><a href="#">Measure in X</a></li>
<li><a href="#">Measure in Y</a></li>
<li><a href="#">Measure in Z</a></li>
<li><a href="#">Act Hadamard</a></li>
<li>
<a href="#">IA</a>
<a href="#">IB</a>
</li>
<li><a href="#">Delete</a></li>
<li><a href="#">Act Phase</a></li>
<!--<li>-->
<!--<a href="#">IA</a>-->
<!--<a href="#">IB</a>-->
<!--</li>-->
<li><a href="#" onclick="editor.deleteNode()">Delete</a></li>
</ul>
</div>



+ 1
- 1
static/main.css View File

@@ -27,7 +27,7 @@ html, body { margin: 0; padding: 0; overflow: hidden; font-size: 10pt; font-fam
}


#pallette {
#node_data {
background-color: black;
color:white;
padding: 10px;


+ 16
- 9
static/scripts/anders_briegel.js View File

@@ -13,6 +13,13 @@ abj.add_nodes = function(nodes) {
nodes.forEach(add_node);
};

abj.del_node = function(node) {
for (var i in abj.adj[node]) {
abj.del_edge(node, i);
}
delete abj.node[node];
};

abj.add_edge = function(a, b) {
abj.adj[a][b] = {};
abj.adj[b][a] = {};
@@ -34,10 +41,10 @@ abj.has_edge = function(a, b) {
};

abj.toggle_edge = function(a, b) {
if (has_edge(a, b)) {
del_edge(a, b);
if (abj.has_edge(a, b)) {
abj.del_edge(a, b);
} else {
add_edge(a, b);
abj.add_edge(a, b);
}
};

@@ -76,7 +83,7 @@ abj.act_local_rotation = function(node, operation) {
};

abj.act_hadamard = function(node) {
act_local_rotation(node, 10);
abj.act_local_rotation(node, 10);
};

abj.is_sole_member = function(node, group) {
@@ -84,21 +91,21 @@ abj.is_sole_member = function(node, group) {
};

abj.act_cz = function(a, b) {
if (is_sole_member(abj.adj[a], b)) {
if (abj.is_sole_member(abj.adj[a], b)) {
remove_vop(a, b);
}
if (is_sole_member(abj.adj[b], a)) {
if (abj.is_sole_member(abj.adj[b], a)) {
remove_vop(b, a);
}
if (is_sole_member(abj.adj[a], b)) {
if (abj.is_sole_member(abj.adj[a], b)) {
remove_vop(a, b);
}
var edge = has_edge(a, b);
var edge = abj.has_edge(a, b);
var new_state = tables.cz_table[edge ? 1 : 0][abj.node[a].vop][abj.node[b].vop];
abj.node[a].vop = new_state[1];
abj.node[b].vop = new_state[2];
if (new_state[0] != edge) {
toggle_edge(a, b);
abj.toggle_edge(a, b);
}
};



+ 51
- 10
static/scripts/editor.js View File

@@ -2,6 +2,7 @@ var editor = {};
var pi2 = Math.PI / 2;

editor.selection = undefined;
editor.mouseOver = undefined;

editor.orientations = [
new THREE.Euler(pi2, 0, 0),
@@ -12,11 +13,10 @@ editor.orientations = [

editor.onFreeMove = function() {
var found = editor.findNodeOnRay(mouse.ray);
if (editor.selection !== found) {
editor.selection = found;
if (editor.mouseOver !== found) {
editor.mouseOver = found;
if (found) {
gui.nodeMessage("Node " + found + " (VOP:" + abj.node[found].vop + ")" +
"<br/>" + "Click to edit neighbourhood");
gui.nodeMessage("Node " + found + " (VOP:" + abj.node[found].vop + ")");
} else {
gui.hideNodeMessage();
}
@@ -29,6 +29,9 @@ editor.focus = function(node) {
gui.hideNodeMessage();
editor.selection = node;
gui.serverMessage("Selected node " + node + ".");
node_name.innerHTML = "Node " + node;
node_data.className = "visible";
node_vop.innerHTML = "VOP: " + abj.node[node].vop;
};

editor.addQubitAtPoint = function(point) {
@@ -44,11 +47,12 @@ editor.addQubitAtPoint = function(point) {
if (delta.length()<0.1){ return; }
}

abj.add_node(abj.order(), { position: point });
editor.grid.position.copy(point);
gui.controls.target.copy(point);
// TODO: This SUCKS
var new_node = Math.random()*100000|0;
abj.add_node(new_node, { position: point, vop:0 });
editor.focus(new_node);
graph.update();
gui.serverMessage("Created node.");
gui.serverMessage("Created node " + new_node +".");
};

editor.onClick = function() {
@@ -63,16 +67,44 @@ editor.onClick = function() {
}
};

editor.onShiftClick = function() {
var found = editor.findNodeOnRay(mouse.ray);
if (found === undefined){ return; }
if (editor.selection === undefined){ return; }
if (found === editor.selection){ return; }
abj.act_cz(found, editor.selection);
editor.focus(found);
gui.serverMessage("Acted CZ between " + found + " & " + editor.selection + ".");
graph.update();
};

editor.onCtrlClick = function() {
var found = editor.findNodeOnRay(mouse.ray);
if (found === undefined){ return; }
if (editor.selection === undefined){ return; }
editor.focus(found);
abj.act_hadamard(found);
gui.serverMessage("Acted H on node " + found + ".");
graph.update();
};


editor.prepare = function() {
mouse.onFreeMove = editor.onFreeMove;
mouse.onClick = editor.onClick;
mouse.onShiftClick = editor.onShiftClick;
mouse.onCtrlClick = editor.onCtrlClick;
document.addEventListener("keydown", editor.onKey, false);
editor.makeGrid();
};

editor.onKey = function(evt) {
if (evt.keyCode !== 32) {return;}
editor.setOrientation((editor.orientation + 1) % 3);
if (evt.keyCode === 32) {
editor.setOrientation((editor.orientation + 1) % 3);
}
if (evt.keyCode === 46 || evt.keyCode === 68) {
editor.deleteNode();
}
};

editor.setOrientation = function(orientation) {
@@ -104,3 +136,12 @@ editor.findNodeOnRay = function(ray) {
}
return undefined;
};

editor.deleteNode = function() {
if (editor.selection === undefined){ return; }
abj.del_node(editor.selection);
graph.update();
gui.serverMessage("Deleted node " + editor.selection + ".");
editor.selection = undefined;
node_data.className = "hidden";
};

+ 1
- 1
static/scripts/graph.js View File

@@ -1,5 +1,5 @@
var graph = {};
graph.colors = ["lightblue", "green", "yellow", "red", "pink", "orange", "purple"];
graph.colors = ["red", "green", "yellow", "green", "pink", "orange", "purple"];

graph.prepare = function() {
materials.prepare();


+ 1
- 1
static/scripts/main.js View File

@@ -15,6 +15,6 @@ window.onload = function() {
gui.prepare();
mouse.prepare();
editor.prepare();
bootstrap();
//bootstrap();
gui.loop();
};

+ 1
- 1
static/scripts/websocket.js View File

@@ -20,6 +20,6 @@ websocket.connect = function(update) {
};

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

Loading…
Cancel
Save