Simulate graph states in the browser
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

191 line
5.9KB

  1. var editor = {};
  2. var pi2 = Math.PI / 2;
  3. editor.selection = undefined;
  4. editor.mouseOver = undefined;
  5. editor.orientations = [
  6. new THREE.Euler(pi2, 0, 0),
  7. new THREE.Euler(0, 0, 0),
  8. new THREE.Euler(pi2, 0, pi2),
  9. ];
  10. editor.onFreeMove = function() {
  11. var found = editor.findNodeOnRay(mouse.ray);
  12. if (editor.mouseOver !== found) {
  13. editor.mouseOver = found;
  14. if (found) {
  15. var n = abj.node[found];
  16. var s = "Node " + found + "<br/> ";
  17. for (var i in n) {
  18. if (i!="position"){
  19. s += i + ":" + n[i] + " ";
  20. }
  21. }
  22. s += "";
  23. gui.nodeMessage(s);
  24. } else {
  25. gui.hideNodeMessage();
  26. }
  27. }
  28. };
  29. editor.focus = function(node) {
  30. gui.hideNodeMessage();
  31. editor.selection = node;
  32. //gui.serverMessage("Selected node " + node + ".");
  33. };
  34. editor.addQubitAtPoint = function(point) {
  35. if (point === null) {
  36. return;
  37. }
  38. point.round();
  39. var new_node = Math.floor(point.x) + "," + Math.floor(point.y) + "," + Math.floor(point.z);
  40. if (Object.prototype.hasOwnProperty.call(abj.node, new_node)) {
  41. gui.serverMessage("Node " + new_node +" already exists.");
  42. return;
  43. }
  44. websocket.edit({action:"create", name:new_node, position: point});
  45. editor.focus(new_node);
  46. gui.serverMessage("Created node " + new_node +".");
  47. };
  48. editor.onClick = function() {
  49. var found = editor.findNodeOnRay(mouse.ray);
  50. if (found) {
  51. editor.focus(found);
  52. var node=found;
  53. editor.grid.position.copy(abj.node[node].position);
  54. gui.controls.target.copy(abj.node[node].position);
  55. node_name.innerHTML = "Node " + node;
  56. node_data.className = "visible";
  57. node_vop.innerHTML = "VOP: " + abj.node[node].vop;
  58. } else {
  59. var intersection = mouse.ray.intersectPlane(editor.plane);
  60. if (intersection !== null) {
  61. editor.addQubitAtPoint(intersection);
  62. }
  63. }
  64. };
  65. editor.onShiftClick = function() {
  66. var found = editor.findNodeOnRay(mouse.ray);
  67. if (found === undefined){ return; }
  68. if (editor.selection === undefined){ return; }
  69. if (found === editor.selection){ return; }
  70. //abj.act_cz(found, editor.selection);
  71. websocket.edit({action:"cz", start:found, end:editor.selection});
  72. gui.serverMessage("Acted CZ between " + found + " & " + editor.selection + ".");
  73. editor.focus(found);
  74. };
  75. editor.onCtrlClick = function() {
  76. var found = editor.findNodeOnRay(mouse.ray);
  77. if (found === undefined){ return; }
  78. if (editor.selection === undefined){ return; }
  79. editor.focus(found);
  80. websocket.edit({action:"hadamard", node:found});
  81. gui.serverMessage("Acted H on node " + found + ".");
  82. };
  83. editor.prepare = function() {
  84. mouse.onFreeMove = editor.onFreeMove;
  85. mouse.onClick = editor.onClick;
  86. mouse.onShiftClick = editor.onShiftClick;
  87. mouse.onCtrlClick = editor.onCtrlClick;
  88. document.addEventListener("keydown", editor.onKey, false);
  89. editor.makeGrid();
  90. };
  91. editor.onKey = function(evt) {
  92. if (evt.keyCode === 32) {
  93. editor.setOrientation((editor.orientation + 1) % 3);
  94. }
  95. if (evt.keyCode === 46 || evt.keyCode === 68) {
  96. editor.deleteNode();
  97. }
  98. };
  99. editor.setOrientation = function(orientation) {
  100. editor.orientation = orientation;
  101. var rotation = editor.orientations[orientation];
  102. var normal = new THREE.Vector3(0, 1, 0);
  103. normal.applyEuler(rotation);
  104. editor.grid.rotation.copy(rotation);
  105. editor.plane = new THREE.Plane();
  106. editor.plane.setFromNormalAndCoplanarPoint(normal, editor.grid.position);
  107. gui.render();
  108. };
  109. editor.makeGrid = function() {
  110. editor.grid = new THREE.GridHelper(10, 1);
  111. editor.grid.setColors(0xbbbbbb, 0xeeeeee);
  112. editor.grid.renderOrder = 1000;
  113. editor.setOrientation(0);
  114. gui.scene.add(editor.grid);
  115. gui.scene.children[0].renderOrder = -3000;
  116. };
  117. editor.update = function() {};
  118. // Gets a reference to the node nearest to the mouse cursor
  119. editor.findNodeOnRay = function(ray) {
  120. for (var n in abj.node) {
  121. if (ray.distanceSqToPoint(abj.node[n].position) < 0.012) {
  122. return n;
  123. }
  124. }
  125. return undefined;
  126. };
  127. editor.deleteNode = function() {
  128. if (editor.selection === undefined){ return; }
  129. websocket.edit({action:"delete", node:editor.selection});
  130. gui.serverMessage("Deleted node " + editor.selection + ".");
  131. editor.selection = undefined;
  132. node_data.className = "hidden";
  133. };
  134. //TODO: loadsa space for DRY here
  135. editor.hadamard = function() {
  136. if (editor.selection === undefined){ return; }
  137. websocket.edit({action:"hadamard", node:editor.selection});
  138. gui.serverMessage("Acted Hadamard on node " + editor.selection + ".");
  139. };
  140. editor.phase = function() {
  141. if (editor.selection === undefined){ return; }
  142. websocket.edit({action:"phase", node:editor.selection});
  143. gui.serverMessage("Acted phase on node " + editor.selection + ".");
  144. };
  145. editor.measureX = function() {
  146. if (editor.selection === undefined){ return; }
  147. websocket.edit({action:"measure", node:editor.selection, basis:"x"});
  148. gui.serverMessage("Measured node " + editor.selection + " in X.");
  149. };
  150. editor.measureY = function() {
  151. if (editor.selection === undefined){ return; }
  152. websocket.edit({action:"measure", node:editor.selection, basis:"y"});
  153. gui.serverMessage("Measured node " + editor.selection + " in Y.");
  154. };
  155. editor.measureZ = function() {
  156. if (editor.selection === undefined){ return; }
  157. websocket.edit({action:"measure", node:editor.selection, basis:"z"});
  158. gui.serverMessage("Measured node " + editor.selection + " in z.");
  159. };
  160. editor.localComplementation = function() {
  161. if (editor.selection === undefined){ return; }
  162. websocket.edit({action:"localcomplementation", node:editor.selection});
  163. abj.local_complementation(editor.selection);
  164. gui.serverMessage("Inverted neighbourhood of " + editor.selection + ".");
  165. };