g1smo
/
wavey-wind
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Kalibracija, zogice

kegel
Jurij Podgoršek 2022-11-30 12:55:09 +01:00
parent ec796bafab
commit 7053531f40
3 changed files with 164 additions and 47 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

9
anim.js
View File

@ -207,11 +207,10 @@ function addObj(w, h) {
obj.setRotationFromQuaternion(qObj);
// Pocisti za seboj
if (objekti.push(obj) > obj_limit) {
while (objekti.length > obj_limit) {
scene.remove(objekti[0]);
objekti.shift();
}
objekti.push(obj);
while (objekti.length > obj_limit) {
scene.remove(objekti[0]);
objekti.shift();
}
};

4
osctl.js
View File

@ -3,6 +3,10 @@ var oscPort = new osc.WebSocketPort({
metadata: true
});
function sendAll (address, args) {
oscPort.send({ address, args })
}
oscPort.on("ready", function () {
console.log("OSC listening!")
oscPort.on("message", function (msg) {

198
test.js
View File

@ -4,8 +4,11 @@ console.log("Hello, Sky!");
/☭☭☭☭ Test skripta ☭☭☭☭ *
******☭☭☭☭☭☭☭☭☭☭☭☭******/
// Odmik kamere
var odmik_kamere = 100;
// Ker kegel imamo?
var izbranKegel = 1;
if (window.location.hash.indexOf('kegel') > -1) {
izbranKegel = window.location.hash.split('=')[1];
}
// Vidni kot
var FOV = 90;
@ -24,11 +27,15 @@ var accZ = 0.000;
var scene = new THREE.Scene;
window.scene = scene;
camera = new THREE.PerspectiveCamera(FOV, window.innerWidth / window.innerHeight, 0.1, 2000);
camera.position.z = odmik_kamere;
/*
const axesHelper = new THREE.AxesHelper( 5 );
scene.add( axesHelper );
*/
var camera = new THREE.PerspectiveCamera(FOV, window.innerWidth / window.innerHeight, 0.1, 2000);
window.camera = camera;
renderer = new THREE.WebGLRenderer({
var renderer = new THREE.WebGLRenderer({
alpha: true
});
renderer.setSize(window.innerWidth, window.innerHeight);
@ -38,7 +45,7 @@ renderer.setClearColor(0xFFFFFF, 1);
// Črno ozadje
//renderer.setClearColor(0x000000, 1);
var skupina = new THREE.Group();
//var skupina = new THREE.Group();
// Dodaj test skatlo
@ -150,21 +157,56 @@ for (var n = 0; n < radialnihSegmentov; n += 1) {
}
*/
var barva = new THREE.Color();
barva.setHSL(0.6, 1.0, 0.5);
var barva = new THREE.Color(0, 0, 0);
var barvaDodatni = new THREE.Color();
barvaDodatni.setHSL(0.6, 1.0, 0.5);
var mat = new THREE.MeshBasicMaterial({
//color: 0xff00ff,
color: barva,
wireframe: true
wireframe: true,
transparent: true
});
window.mat = mat;
//var mat = new THREE.LineBasicMaterial({ color: 0xff00ff });
var kegel = new THREE.Mesh(geo, mat);
kegel.position.z += 64;
kegel.position.y += 32;
//kegel.position.y += 32;
kegel.position.y = -100;
kegel.rotation.z = 180;
skupina.add(kegel);
if (izbranKegel == 0) {
kegel.position.x = 40;
}
var barvaKrogleO = new THREE.Color();
barvaKrogleO.setHSL(Math.random(), 0.8, 0.5);
function novaKrogla () {
var barvaKrogle = barvaKrogleO.clone();
var mat = new THREE.MeshBasicMaterial({
color: barvaKrogle,
wireframe: true,
transparent: true
});
var velikost = 1 + Math.random() * 5;
var kroglaGeo = new THREE.SphereGeometry(velikost, 12, 12);
var krogla = new THREE.Mesh(kroglaGeo, mat);
krogla.position.x = (Math.random() - 1) * 200;
krogla.position.y = (Math.random() - 1) * 10;
krogla.position.z = (Math.random() - 1) * 300;
krogla.position.y -= 100;
krogla.position.x += 150;
krogla.position.z += 230; // gor/dol
//krogla.position.y += 200;
scene.add(krogla);
krogle.push(krogla);
}
//skupina.add(kegel);
// Za pospeskomer - os X
var gAX = new THREE.CylinderGeometry(10, 10, 10, 16);
@ -174,10 +216,12 @@ var AX = new THREE.Mesh(gAX, mAX);
//skupina.add(AX);
// Damo vse skupaj v kader
scene.add(skupina);
// scene.add(skupina);
scene.add(kegel);
// Quaternioni za rotacijo in kalibracijo
var qWW = new THREE.Quaternion();
var qPrej = new THREE.Quaternion();
var qObj = new THREE.Quaternion();
var qStart = new THREE.Quaternion();
var reset = false;
@ -185,29 +229,44 @@ var calibrate = true;
var objekti = [kegel];
var dodatniObjekti = [];
var krogle = [];
var stevec = 0;
// Zacetna orientacija
camera.position.y = -100
// Zacetna orientacija kegla
scene.rotation.x = 90;
scene.rotation.z = -270;
scene.rotation.z = 270;
skupina.position.z = 64;
skupina.position.y = -34;
// Polozaj kamere
//camera.position.y = -64;
camera.position.z = 60;
//skupina.position.z = 32;
//skupina.position.y = -100;
function inputHandle () {
if (kbdPressed.c) {
calibrate = true;
sendAll('/ww/calibrate');
}
}
function render () {
requestAnimationFrame(render);
renderer.render(scene, camera);
stevec += 1;
objAnim();
inputHandle();
if (stevec % 10 == 0) {
novaKrogla();
}
};
// Funkcija za animacijo objektov
function objAnim() {
if (kbdPressed.c) {
calibrate = true;
}
// Rotacija kegla
objekti.map(function (obj) {
// Apliciramo rotacijo (po quaternionih - eulerji zajebavajo.)
@ -217,6 +276,42 @@ function objAnim() {
AX.scale.x = accX / 1000;
});
// Ce jih je prevec, pucaj
while (dodatniObjekti.length > 100) {
scene.remove(dodatniObjekti[0]);
dodatniObjekti.shift();
}
dodatniObjekti.map(function (obj) {
// Apliciramo rotacijo (po quaternionih - eulerji zajebavajo.)
qObj = qWW.clone();
//qObj.multiply(obj.qStart).multiply(qStart);
//obj.setRotationFromQuaternion(qObj);
obj.translateOnAxis(obj.premakniAxis, obj.premakniKolicina);
// obj.material.color.offsetHSL(0, 0, 0.003);
obj.material.opacity *= 0.98;
obj.premakniKolicina *= 0.98;
var dQ = obj.quaternion.multiply(obj.rotirajQ);
/*
dQ.multiply(obj.rotirajQ);
obj.setRotationFromQuaternion(dQ);
*/
/*
obj.premakni.x *= 1.1;
obj.premakni.y *= 1.1;
obj.premakni.z *= 1.1;
*/
obj.material.opacity *= 0.98;
});
barvaKrogleO.offsetHSL(-(2/1000), 0, 0);
krogle.map(function (obj) {
obj.material.opacity *= 0.98;
});
// Kalibracija rotacije kegla
if (calibrate) {
@ -240,30 +335,41 @@ function objAnim() {
kegel.scale.z *= 0.95;
}
// Drzimo vse stiri gumbe (reset)? - kalibracija!
if ((keysPressed[0] + keysPressed[1] + keysPressed[2] + keysPressed[3]) === 4) {
if (!reset) {
qStart = qWW.clone();
qStart.conjugate();
reset = true;
console.log("RESET!");
}
} else {
if (reset) {
reset = false;
console.log("reset off....");
}
// Dupliranje keglov
//console.log(accX);
kegel.material.color.offsetHSL(2 / 1000, 0, 0);
if (accX > 1/* && (stevec % 10) == 0*/) {
var dodatni = kegel.clone();
dodatni.renderOrder = stevec;
var dodatniMat = kegel.material.clone();
var dodatniBarva = barvaDodatni.clone();
dodatniMat.color = dodatniBarva;
dodatni.material = dodatniMat;
dodatni.premakniAxis = new THREE.Vector3(
Math.random(),
Math.random(),
Math.random()
);
dodatni.premakniKolicina = (Math.random() - 1) * 10;
var rQ = qWW.clone();
rQ.invert();
rQ.multiply(qPrej);
dodatni.rotirajQ = rQ;
//dodatni.qStart = kegel.quaternion.clone();
dodatniObjekti.push(dodatni);
scene.add(dodatni);
}
};
// Inicializiraj
document.onreadystatechange = function () {
if (document.readyState === 'complete') {
document.getElementById("anim-container").appendChild(renderer.domElement);
render();
}
if (document.readyState === 'complete') {
document.getElementById("anim-container").appendChild(renderer.domElement);
render();
}
};
// Lep risajz
@ -281,8 +387,8 @@ var keysPressed = [0, 0, 0, 0];
const getVal = function (msg) {
return msg.value;
}
var prepend = '/ww/0/ww/0';
var prepend = `/ww/0/ww/${izbranKegel}`;
console.log('prepend!', prepend);
var oscCallbacks = {};
@ -291,6 +397,7 @@ oscCallbacks[`${prepend}'/keys`] = function(args) {
};
oscCallbacks[`${prepend}/quaternion`] = function (args) {
// Popravimo osi (w x y z po defaultu HMM)
[qPrej.w, qPrej.x, qPrej.y, qPrej.z] = [qWW.w, qWW.x, qWW.y, qWW.z];
[qWW.w, qWW.x, qWW.y, qWW.z] = args.map(getVal);
};
oscCallbacks[`${prepend}/accel`] = function (args) {
@ -299,9 +406,16 @@ oscCallbacks[`${prepend}/accel`] = function (args) {
oscCallbacks[`${prepend}/gyro`] = function (args) {
[rotacijaX, rotacijaY, rotacijaZ] = args.map(getVal);
};
oscCallbacks['/ww/calibrate'] = function () {
calibrate = true;
};
oscCallbacks['/midi'] = function (args) {
//console.log("MAMOMO MIDI!", args);
kegel.material.color.offsetHSL(args[2].value / 1000, 0, 0);
var minus = (izbranKegel == 1) ? -1 : 1;
// kegel.material.color.offsetHSL(minus * args[2].value / 1000, 0, 0);
barvaDodatni.offsetHSL(minus * args[2].value / 1000, 0, 0);
if (Math.random() < 0.5) {
kegel.scale.x *= 1.5;
} else {