WIP camera pivot, euler angles, cleanup
parent
135a8f49a0
commit
2a38878687
60
anim.js
60
anim.js
|
@ -47,16 +47,14 @@ var saturacija = 1;
|
||||||
var svetlost = 0.4;
|
var svetlost = 0.4;
|
||||||
|
|
||||||
// Rotiranje kamere
|
// Rotiranje kamere
|
||||||
var kameraX = 0;
|
var qKamera = new THREE.Quaternion();
|
||||||
var kameraY = 0;
|
|
||||||
var kameraZ = 0;
|
|
||||||
|
|
||||||
// Quaternioni za rotacijo in kalibracijo
|
// Quaternioni za rotacijo in kalibracijo
|
||||||
var qWW = new THREE.Quaternion(-1, 0, 0, 0);
|
var qWW = new THREE.Quaternion();
|
||||||
var qWWo = new THREE.Quaternion(-1, 0, 0, 0);
|
var qWWo = new THREE.Quaternion();
|
||||||
var qWWd = new THREE.Quaternion(-1, 0, 0, 0);
|
var qWWd = new THREE.Quaternion();
|
||||||
var qObj = new THREE.Quaternion(-1, 0, 0, 0);
|
var qObj = new THREE.Quaternion();
|
||||||
var qStart = new THREE.Quaternion(-1, 0, 0, 0);
|
var qStart = new THREE.Quaternion();
|
||||||
var calibrate = true;
|
var calibrate = true;
|
||||||
var reset = false;
|
var reset = false;
|
||||||
|
|
||||||
|
@ -85,6 +83,8 @@ renderer.setSize(window.innerWidth, window.innerHeight);
|
||||||
// Črno ozadje
|
// Črno ozadje
|
||||||
renderer.setClearColor(0x000000, 1);
|
renderer.setClearColor(0x000000, 1);
|
||||||
|
|
||||||
|
//var pivot = new THREE.Group();
|
||||||
|
//scene.add( pivot );
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
@ -107,8 +107,13 @@ function render () {
|
||||||
function modulirajParametre() {
|
function modulirajParametre() {
|
||||||
// Vsi gumbi? => RESET
|
// Vsi gumbi? => RESET
|
||||||
if ((keysPressed[0] + keysPressed[1] + keysPressed[2] + keysPressed[3]) === 4 && !reset) {
|
if ((keysPressed[0] + keysPressed[1] + keysPressed[2] + keysPressed[3]) === 4 && !reset) {
|
||||||
reset = true;
|
setTimeout(() => {
|
||||||
window.location.reload()
|
if ((keysPressed[0] + keysPressed[1] + keysPressed[2] + keysPressed[3]) === 4) {
|
||||||
|
setTimeout(() => {
|
||||||
|
window.location.reload()
|
||||||
|
}, 1000);
|
||||||
|
}
|
||||||
|
}, 1000)
|
||||||
}
|
}
|
||||||
|
|
||||||
// Posodobi kvaternion polozaja kontrolerja
|
// Posodobi kvaternion polozaja kontrolerja
|
||||||
|
@ -131,10 +136,13 @@ function modulirajParametre() {
|
||||||
drotacijaY += qWWd.y / 10;
|
drotacijaY += qWWd.y / 10;
|
||||||
drotacijaZ += qWWd.z / 10;
|
drotacijaZ += qWWd.z / 10;
|
||||||
}
|
}
|
||||||
|
if (keysPressed[1]) {
|
||||||
|
//qKamera.multiply(qWWd);
|
||||||
|
obj_limit *= 1 - dqY;
|
||||||
|
}
|
||||||
if (keysPressed[0]) {
|
if (keysPressed[0]) {
|
||||||
width *= 1 + dqX;
|
width *= 1 + (dqX / 2);
|
||||||
barva_mod += (dqZ / 100);
|
barva_mod += (dqZ / 100);
|
||||||
obj_limit *= 1 + (dqY);
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -180,6 +188,7 @@ function addObj(w, h) {
|
||||||
var obj = new THREE.Line(geo, mat, THREE.LineSegments);
|
var obj = new THREE.Line(geo, mat, THREE.LineSegments);
|
||||||
|
|
||||||
scene.add(obj);
|
scene.add(obj);
|
||||||
|
//pivot.add(obj);
|
||||||
obj.setRotationFromQuaternion(qObj);
|
obj.setRotationFromQuaternion(qObj);
|
||||||
|
|
||||||
// Pocisti za seboj
|
// Pocisti za seboj
|
||||||
|
@ -191,27 +200,12 @@ function addObj(w, h) {
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
var xAksa = new THREE.Vector3(0, 1, 0);
|
qK = new THREE.Quaternion()
|
||||||
|
scene.setRotationFromQuaternion(qK)
|
||||||
|
|
||||||
function camRotate () {
|
function camRotate () {
|
||||||
// rotiraj po z osi
|
qK.multiply(qKamera);
|
||||||
camera.translateX(kameraX);
|
}
|
||||||
camera.translateZ(odmik_kamere - Math.sqrt(Math.pow(odmik_kamere, 2) + Math.pow(kameraX, 2)));
|
|
||||||
|
|
||||||
/*
|
|
||||||
camera.translateY(kameraY);
|
|
||||||
camera.translateX(odmik_kamere - Math.sqrt(Math.pow(odmik_kamere, 2) + Math.pow(kameraY, 2)));
|
|
||||||
|
|
||||||
camera.translateZ(kameraZ);
|
|
||||||
camera.translateX(odmik_kamere - Math.sqrt(Math.pow(odmik_kamere, 2) + Math.pow(kameraZ, 2)));
|
|
||||||
|
|
||||||
*/
|
|
||||||
/*
|
|
||||||
camera.position.x = Math.sin((stevec % 10) / 10) * cam_rot_offset;
|
|
||||||
camera.position.y = Math.cos((stevec % 10) / 10) * cam_rot_offset;
|
|
||||||
*/
|
|
||||||
|
|
||||||
camera.lookAt(scene.position);
|
|
||||||
};
|
|
||||||
|
|
||||||
// Inicializiraj
|
// Inicializiraj
|
||||||
document.onreadystatechange = function () {
|
document.onreadystatechange = function () {
|
||||||
|
@ -235,7 +229,7 @@ function getVal(msg) {
|
||||||
return msg.value;
|
return msg.value;
|
||||||
}
|
}
|
||||||
|
|
||||||
kbdPressed = {
|
const kbdPressed = {
|
||||||
a: false,
|
a: false,
|
||||||
s: false,
|
s: false,
|
||||||
d: false,
|
d: false,
|
||||||
|
|
|
@ -64,7 +64,7 @@ o = OSCFunc({
|
||||||
~oX = ~gX;
|
~oX = ~gX;
|
||||||
~oY = ~gY;
|
~oY = ~gY;
|
||||||
~oZ = ~gZ;
|
~oZ = ~gZ;
|
||||||
|
msg.postln;
|
||||||
//[msg, time, addr, recvPort].postln;
|
//[msg, time, addr, recvPort].postln;
|
||||||
~gW = msg[1];
|
~gW = msg[1];
|
||||||
~gZ = msg[2];
|
~gZ = msg[2];
|
||||||
|
@ -92,11 +92,11 @@ o = OSCFunc({
|
||||||
|
|
||||||
~euler = ~quaternionToEuler.([~dgW, ~dgX, ~dgY, ~dgZ]);
|
~euler = ~quaternionToEuler.([~dgW, ~dgX, ~dgY, ~dgZ]);
|
||||||
~euler.postln;
|
~euler.postln;
|
||||||
}, '/quaternion/', n);
|
}, '/quaternion', n);
|
||||||
)
|
)
|
||||||
// ENDWW
|
// ENDWW
|
||||||
|
|
||||||
OSCFunc.trace(true);
|
OSCFunc.trace(false);
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
14
server.js
14
server.js
|
@ -177,6 +177,12 @@ function eulerFromQuaternion(quaternion) {
|
||||||
}
|
}
|
||||||
|
|
||||||
const sendAll = (msg, info, oscWS, osclients) => {
|
const sendAll = (msg, info, oscWS, osclients) => {
|
||||||
|
// Reset euler rotation to 0
|
||||||
|
if (msg.address == '/keys') {
|
||||||
|
if (msg.args[0] && msg.args[1] && msg.args[2] && msg.args[3]) {
|
||||||
|
eulerRotation = [0, 0, 0]
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
// Convert quaternion diff to euler angle diff
|
// Convert quaternion diff to euler angle diff
|
||||||
if (msg.address == '/quaternionDiff') {
|
if (msg.address == '/quaternionDiff') {
|
||||||
|
@ -215,7 +221,7 @@ const osclients = []
|
||||||
|
|
||||||
wss.on('connection', function (ws) {
|
wss.on('connection', function (ws) {
|
||||||
console.log('new client connection')
|
console.log('new client connection')
|
||||||
const oscWS = new osc.WebSocketPort({
|
let oscWS = new osc.WebSocketPort({
|
||||||
socket: ws,
|
socket: ws,
|
||||||
metadata: false
|
metadata: false
|
||||||
});
|
});
|
||||||
|
@ -232,5 +238,11 @@ wss.on('connection', function (ws) {
|
||||||
console.warn(error)
|
console.warn(error)
|
||||||
})
|
})
|
||||||
osclients.push(oscWS)
|
osclients.push(oscWS)
|
||||||
|
|
||||||
|
/*
|
||||||
|
oscWS.on('close', () => {
|
||||||
|
oscWS = null
|
||||||
|
})
|
||||||
|
*/
|
||||||
})
|
})
|
||||||
|
|
||||||
|
|
5
test.js
5
test.js
|
@ -65,9 +65,8 @@ scene.add(skupina);
|
||||||
|
|
||||||
// Quaternioni za rotacijo in kalibracijo
|
// Quaternioni za rotacijo in kalibracijo
|
||||||
var qWW = new THREE.Quaternion();
|
var qWW = new THREE.Quaternion();
|
||||||
var qObj = new THREE.Quaternion(-1, 0, 0, 0);
|
var qObj = new THREE.Quaternion();
|
||||||
var qStart = new THREE.Quaternion(-1, 0, 0, 0);
|
var qStart = new THREE.Quaternion();
|
||||||
var qCalibrate = new THREE.Quaternion();
|
|
||||||
var reset = false;
|
var reset = false;
|
||||||
|
|
||||||
|
|
||||||
|
|
Loading…
Reference in New Issue