pete
/
abp
1
1
Fork 0
Code Issues 0 Pull Requests 0 Releases 0 Wiki Activity
Browse Source

Better mouse handling

master
Pete Shadbolt 8 years ago
parent
37913a4b2c
commit
46df289aed
9 changed files with 101 additions and 20 deletions
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. +2
    -1
      static/index.html
  2. +1
    -1
      static/main.css
  3. +2
    -0
      static/scripts/.agignore
  4. +13
    -0
      static/scripts/anders_briegel.js
  5. +9
    -10
      static/scripts/graph.js
  6. +15
    -4
      static/scripts/gui.js
  7. +10
    -3
      static/scripts/main.js
  8. +1
    -1
      static/scripts/materials.js
  9. +48
    -0
      static/scripts/mouse.js

+ 2
- 1
static/index.html View File

@@ -10,6 +10,7 @@
<script src="scripts/orbitcontrols.js"></script>
<script src="scripts/tables.js"></script>
<script src="scripts/anders_briegel.js"></script>
<script src="scripts/mouse.js"></script>
<script src="scripts/materials.js"></script>
<script src="scripts/graph.js"></script>
<script src="scripts/gui.js"></script>
@@ -19,7 +20,7 @@

<body>
<img id="ball" src="img/ball.png" style=display:none;>
<div id=node_info class=hidden> </div>
<div id=node_info class=hidden> nothing </div>
<div id=message class=hidden> </div>

<div id=pallette>


+ 1
- 1
static/main.css View File

@@ -1,5 +1,5 @@
html, body { margin: 0; padding: 0; overflow: hidden; font-size: 10pt; font-family: "courier new"; }
#infoholder {
#node_info {
background: black;
color:white;
padding: 5px;


+ 2
- 0
static/scripts/.agignore View File

@@ -0,0 +1,2 @@
three.js
orbitcontrols.js

+ 13
- 0
static/scripts/anders_briegel.js View File

@@ -1,4 +1,7 @@
var abj = {};
abj.vops = {};
abj.ngbh = {};
abj.meta = {};

abj.add_node = function(node, m) {
abj.ngbh[node] = {};
@@ -118,3 +121,13 @@ abj.log_graph_state = function() {
console.log(JSON.stringify(abj.ngbh));
};

abj.update = function(newState) {
abj.vops = newState.vops;
abj.ngbh = newState.ngbh;
abj.meta = newState.meta;
};

abj.order = function(){
return Object.keys(abj.vops).length;
};


+ 9
- 10
static/scripts/graph.js View File

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

graph.hook = function() {
materials.load();
graph.prepare = function() {
materials.prepare();
websocket.connect(graph.update);
};

graph.update = function(json) {
abj.vops = json.vops;
abj.ngbh = json.ngbh;
abj.meta = json.meta;
graph.updateScene();
};
graph.update = function(newState) {
if (newState){abj.update(newState);}

graph.updateScene = function() {
if (graph.object){gui.scene.remove(graph.object);}
graph.object = null;
console.log("update");

var geometry = new THREE.Geometry();
geometry.colors = [];
@@ -48,3 +42,8 @@ graph.updateScene = function() {
gui.scene.add(graph.object);
gui.render();
};

graph.add_node = function(x, y, z) {
meta = {"position": new THREE.Vector3(x, y, z)};
abj.add_node(abj.order(), meta);
};

+ 15
- 4
static/scripts/gui.js View File

@@ -1,5 +1,5 @@
var gui = {};
gui.construct = function() {
gui.prepare = function() {
gui.renderer = new THREE.WebGLRenderer({
"antialias": true
});
@@ -15,6 +15,7 @@ gui.construct = function() {
gui.controls.addEventListener("change", gui.render);
gui.controls.center.set(0, 0, 0);
gui.controls.rotateSpeed = 0.2;
gui.controls.userPanSpeed = 0.3;
gui.camera.position.set(0, 0, 20);
};

@@ -49,10 +50,20 @@ gui.serverMessage = function(msgtext) {
message.className = "visible";
};

// Set the position of the info popup
gui.setInfoPosition = function(position){
w = node_info.offsetWidth;
h = node_info.offsetHeight;
node_info.style.left = position.x - w/2 + "px";
node_info.style.top = position.y - h -10 + "px";
node_info.className = "visible";
};

// The main loop
gui.loop = function() {
gui.controls.update();
requestAnimationFrame(gui.loop);
}
};

// Try to add a qubit at the current mouse position
gui.addQubitAtMouse = function(event) {
@@ -63,6 +74,6 @@ gui.addQubitAtMouse = function(event) {
abj.add_node(Object.keys(vops).length, {
"position": intersection
});
graph.updateScene();
}
graph.update();
};


+ 10
- 3
static/scripts/main.js View File

@@ -1,6 +1,13 @@
function bootstrap(){
graph.add_node(0, 0, 0);
graph.update();
}

window.onload = function() {
graph.hook();
materials.load();
gui.construct();
graph.prepare();
materials.prepare();
gui.prepare();
mouse.prepare();
bootstrap();
gui.loop();
};

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

@@ -5,7 +5,7 @@ var curveProperties = {
curvature: 20
};

materials.load = function() {
materials.prepare = function() {
var sprite = new THREE.Texture(document.getElementById("ball"));
sprite.needsUpdate = true;
materials.edge = new THREE.LineBasicMaterial({


+ 48
- 0
static/scripts/mouse.js View File

@@ -0,0 +1,48 @@
var mouse = {};
mouse.wasClick = true;

mouse.raycaster = new THREE.Raycaster();

mouse.onFreeMove = function(){console.log("Free move");};
mouse.onDrag = function(){console.log("Drag");};
mouse.onClick = function(){console.log("Click");};
mouse.onCtrlClick = function(){console.log("Ctrl-click");};
mouse.onShiftClick = function(){console.log("Shift-click");};

mouse.prepare = function(){
var el = gui.renderer.domElement;
el.addEventListener("mousedown", mouse.onDown);
el.addEventListener("mouseup", mouse.onUp);
el.addEventListener("mousemove", mouse.onMove);
};

mouse.onDown = function(event){
mouse.wasClick = true;
mouse.pressed = true;
};

mouse.onUp = function(event){
if (!mouse.wasClick){return;}
mouse.pressed = false;
if (event.ctrlKey){mouse.onCtrlClick();}
else if (event.shiftKey){mouse.onShiftClick();}
else {
mouse.onClick();
}
};

mouse.onMove = function(event) {
mouse.wasClick = false;
mouse.position_absolute = {x: event.clientX, y:event.clientY};
mouse.position_relative = {x: (event.clientX / window.innerWidth) * 2 - 1,
y: -(event.clientY / window.innerHeight) * 2 + 1};
gui.setInfoPosition(mouse.position_absolute);
mouse.raycaster.setFromCamera(mouse.position_relative, gui.camera);
mouse.ray = mouse.raycaster.ray;
if (mouse.pressed){
mouse.onDrag();
} else {
mouse.onFreeMove();
}
};


Write Preview
Loading…
Cancel
Save