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.

209 lines
6.2KB

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