diff --git a/static/anders_briegel.js b/static/anders_briegel.js
index 9b582b6..306a304 100644
--- a/static/anders_briegel.js
+++ b/static/anders_briegel.js
@@ -1,7 +1,10 @@
-var ngbh = {};
-var vops = {};
-var meta = {};
var abj = {};
+abj.ngbh = {};
+abj.vops = {};
+abj.meta = {};
+ngbh = abj.ngbh;
+vops = abj.vops;
+meta = abj.meta;
abj.add_node = function(node, m) {
ngbh[node] = {};
vops[node] = clifford.hadamard;
diff --git a/static/graph.js b/static/graph.js
index 48301ef..18d727a 100644
--- a/static/graph.js
+++ b/static/graph.js
@@ -6,21 +6,21 @@ function updateScene() {
oldState = null;
var geometry = new THREE.Geometry();
- for (var i in vops) {
- var vop = vops[i];
- var pos = meta[i].position;
+ for (var i in abj.vops) {
+ var vop = abj.vops[i];
+ var pos = abj.meta[i].position;
var vertex = new THREE.Vector3(pos.x, pos.y, pos.z);
geometry.vertices.push(vertex);
- geometry.colors[i] = new THREE.Color(colors[vops[i] % colors.length]);
+ geometry.colors[i] = new THREE.Color(colors[abj.vops[i] % colors.length]);
}
var edges = new THREE.Object3D();
- var my_edges = edgelist();
+ var my_edges = abj.edgelist();
for (i=0; i < my_edges.length; ++i) {
var edge = my_edges[i];
- var start = meta[edge[0]].position;
+ var start = abj.meta[edge[0]].position;
var startpos = new THREE.Vector3(start[0], start[1], start[2]);
- var end = meta[edge[1]].position;
+ var end = abj.meta[edge[1]].position;
var endpos = new THREE.Vector3(end[0], end[1], end[2]);
var newEdge = makeEdge(startpos, endpos);
edges.add(newEdge);
diff --git a/static/index.html b/static/index.html
index 1d0a582..edc2559 100644
--- a/static/index.html
+++ b/static/index.html
@@ -12,7 +12,6 @@
-
diff --git a/static/interaction.js b/static/interaction.js
index e0da09c..1572a4f 100644
--- a/static/interaction.js
+++ b/static/interaction.js
@@ -1,46 +1,58 @@
+var mouse = {};
+var interaction = {};
+
+interaction.raycaster = new THREE.Raycaster();
+interaction.xyplane = new THREE.Plane(new THREE.Vector3(0, 0, 1), 0);
+
// Gets a reference to the node nearest to the mouse cursor
-function nearestNode() {
- raycaster.setFromCamera(mouse, camera);
+interaction.nearestNode = function() {
+ this.raycaster.setFromCamera(mouse, camera);
for (var i = 0; i < nodeGeometry.vertices.length; ++i) {
- if (raycaster.ray.distanceSqToPoint(nodeGeometry.vertices[i]) < 0.01) {
+ var v = nodeGeometry.vertices[i];
+ if (this.raycaster.ray.distanceSqToPoint(v) < 0.01) {
return i;
}
}
return undefined;
-}
+};
// Find out: what is the mouse pointing at?
-function checkIntersections() {
+interaction.checkIntersections = function() {
var new_selection = nearestNode();
- if (new_selection != selection) {
- selection = new_selection;
- info.className = selection ? "visible" : "hidden";
- info.innerHTML = selection ? nodeGeometry.labels[new_selection] : info.innerHTML;
+ if (new_selection != this.selection) {
+ this.selection = new_selection;
+ info.className = this.selection ? "visible" : "hidden";
+ info.innerHTML = this.selection ? nodeGeometry.labels[new_selection] : info.innerHTML;
render();
}
-}
+};
// Update the mouse position tracker
-function onMouseMove(event) {
+interaction.onMouseMove = function(event) {
mouse.wasClick = false;
mouse.absx = event.clientX;
mouse.absy = event.clientY;
mouse.x = (event.clientX / window.innerWidth) * 2 - 1;
mouse.y = -(event.clientY / window.innerHeight) * 2 + 1;
- w = 200;
- h = 15;
- info.style.top = mouse.absy - h - 40 + "px";
- info.style.left = mouse.absx - w / 2 + "px";
- checkIntersections();
-}
+ //w = 200; //h = 15; //info.style.top = mouse.absy - h - 40 + "px"; //info.style.left = mouse.absx - w / 2 + "px"; //checkIntersections();
+};
-// Add qubits or whatever
-function onClick(event){
- if (!selection){return;}
- console.log(nodeGeometry.vertices[selection]);
- qubits.geometry.dynamic = true;
- qubits.geometry.vertices.push(nodeGeometry.vertices[selection].clone());
- qubits.geometry.verticesNeedUpdate = true;
+// Try to add a qubit at the current mouse position
+interaction.addQubitAtMouse = function(event) {
+ this.raycaster.setFromCamera(mouse, camera);
+ var intersection = this.raycaster.ray.intersectPlane(this.plane);
+ intersection.x = Math.round(intersection.x);
+ intersection.y = Math.round(intersection.y);
+ abj.add_node(Object.keys(vops).length, {
+ "position": intersection
+ });
+ updateScene();
}
+interaction.bind = function() {
+ var el = renderer.domElement;
+ el.addEventListener("mousedown", this.onMouseDown);
+ el.addEventListener("mouseup", this.onMouseDown);
+ el.addEventListener("mousemove", this.onMouseMove);
+};
diff --git a/static/main.js b/static/main.js
index 2e672bf..47ad6ed 100644
--- a/static/main.js
+++ b/static/main.js
@@ -9,7 +9,7 @@ window.onload = init;
// Clear the whole scene
function makeScene() {
var myScene = new THREE.Scene();
- var grid = new THREE.GridHelper(20, 2);
+ var grid = new THREE.GridHelper(10, 1);
grid.rotation.x = Math.PI/2;
grid.setColors(0xdddddd, 0xeeeeee);
myScene.add(grid);
@@ -34,31 +34,6 @@ function onWindowResize(evt){
function bind_events() {
window.addEventListener("resize", onWindowResize, false);
- renderer.domElement.addEventListener("mousedown", function (event) {
- var mouse = new THREE.Vector2(); // create once and reuse
- mouse.x = ( event.clientX / renderer.domElement.width ) * 2 - 1;
- mouse.y = - ( event.clientY / renderer.domElement.height ) * 2 + 1;
- mouseprevpos.x = mouse.x;
- mouseprevpos.y = mouse.y;
- });
-
- renderer.domElement.addEventListener("mouseup", function (event) {
- var mouse = new THREE.Vector2(); // create once and reuse
- mouse.x = ( event.clientX / renderer.domElement.width ) * 2 - 1;
- mouse.y = - ( event.clientY / renderer.domElement.height ) * 2 + 1;
- if (mouse.x != mouseprevpos.x || mouse.y != mouseprevpos.y ){return;}
-
- var raycaster = new THREE.Raycaster(); // create once and reuse
- raycaster.setFromCamera( mouse, camera );
- var plane = new THREE.Plane(new THREE.Vector3(0, 0, 1), 0);
- var intersection = raycaster.ray.intersectPlane(plane);
- console.log(intersection);
-
- intersection.x = Math.round(intersection.x);
- intersection.y = Math.round(intersection.y);
- add_node(Object.keys(vops).length, {"position":intersection});
- updateScene();
- });
controls.addEventListener("change", render);
}
@@ -76,14 +51,11 @@ function init() {
loadMaterials();
// Camera, controls, raycaster
- camera = new THREE.PerspectiveCamera(45, window.innerWidth / window.innerHeight, 0.3, 100);
+ camera = new THREE.PerspectiveCamera(45, window.innerWidth / window.innerHeight, 0.3, 1000);
controls = new THREE.OrbitControls(camera);
-
- // Center the camera
- // TODO: frustrum
controls.center.set(0, 0, 0);
controls.rotateSpeed = 0.2;
- camera.position.set(0, 0, 40);
+ camera.position.set(0, 0, 20);
// Run
bind_events();
diff --git a/static/poll.js b/static/poll.js
deleted file mode 100644
index 2dc8c6c..0000000
--- a/static/poll.js
+++ /dev/null
@@ -1,21 +0,0 @@
-function poll() {
- var ws = new WebSocket("ws://localhost:5001");
- ws.onopen = function()
- {
- console.log("Connected to server.");
- };
-
- ws.onmessage = function (evt)
- {
- var new_state = JSON.parse(evt.data);
- vops = new_state.vops;
- ngbh = new_state.ngbh;
- updateScene();
- };
-
- ws.onclose = function()
- {
- console.log("Connection was closed.");
- };
-}
-