Se zadnje pedenanje - sinhronizacija enih parametrov med razlicnimi okni

kegel
Jurij Podgoršek 2022-12-01 13:16:48 +01:00
parent 1c4463c007
commit 870d909845
2 changed files with 127 additions and 44 deletions

View File

@ -4,7 +4,7 @@ var oscPort = new osc.WebSocketPort({
});
function sendAll (address, args) {
console.log('posiljam', address, args)
//console.log('posiljam', address, args)
oscPort.send({ address, args })
}

169
test.js
View File

@ -23,7 +23,7 @@ var accX = 0.000;
var accY = 0.000;
var accZ = 0.000;
var deformiraj = false;
var deformiraj = 0;
// Scena, kamera in render
var scene = new THREE.Scene;
@ -190,6 +190,8 @@ var barvnePaleteIdx = [0, 0, 0, 0]
/*********
* ZOGICE *
*********/
var zogice = false
var kegli = false
/*
var barvnaPaleta = [
new THREE.Color(0x003F5C),
@ -238,11 +240,21 @@ function novaKrogla () {
}
function spremeniZoom (kolicina) {
const noviZum = camera.position.z + kolicina
if (noviZum > 10 && noviZum < 100) {
const noviZum = camera.position.z * (1 + kolicina / 25)
console.log(noviZum)
if ((noviZum > 10) && (noviZum < 300)) {
camera.position.z = noviZum
}
}
function spremeniDeformiraj (kolicina) {
const noviDeformiraj = deformiraj + (kolicina / 2)
//console.log('deform', noviDeformiraj)
if (noviDeformiraj > 0) {
deformiraj = noviDeformiraj
} else {
deformiraj = 0
}
}
//skupina.add(kegel);
@ -278,6 +290,9 @@ scene.rotation.z = 270;
//skupina.position.z = 32;
//skupina.position.y = -100;
var cakajDeformiraj = false
var cakajZogice = false
var cakajKegli = false
function inputHandle () {
if (kbdPressed.c) {
calibrate = true;
@ -287,8 +302,38 @@ function inputHandle () {
sendAll('/ww/reload');
window.location.reload();
}
if (kbdPressed.d) {
/*
if (kbdPressed.d && !cakajDeformiraj) {
deformiraj = !deformiraj
cakajDeformiraj = true
const args = [{
type: "f",
value: deformiraj
}];
sendAll('/ww/zoom', args)
setTimeout(() => cakajDeformiraj = false, 200)
}
*/
if (kbdPressed.g && !cakajZogice) {
zogice = !zogice
cakajZogice = true
const args = [{
type: "i",
value: zogice ? 1 : 0
}];
sendAll('/ww/zogice', args)
setTimeout(() => cakajZogice = false, 200)
}
if (kbdPressed['l'] && !cakajKegli) {
kegli = !kegli
console.log('sprememba kegli', kegli)
cakajKegli = true
const args = [{
type: "i",
value: kegli ? 1 : 0
}];
sendAll('/ww/kegli', args)
setTimeout(() => cakajKegli = false, 200)
}
}
@ -307,6 +352,8 @@ function render () {
}
};
var cakajDodatni = false
// Funkcija za animacijo objektov
function objAnim() {
// Rotacija kegla
@ -320,16 +367,13 @@ function objAnim() {
// Deformiranje kegla!
// Random 500 zamaknemo
if (deformiraj) {
var koti = obj.geometry.attributes.position.array;
var faktorD = 5;
for (var i = 0; i < 500; i++) {
koti[Math.floor(Math.random() * koti.length)] += (Math.random() - 1) * faktorD;
}
var koti = obj.geometry.attributes.position.array;
var faktorD = 5;
for (var i = 0; i < 500; i++) {
koti[Math.floor(Math.random() * koti.length)] += (Math.random() - 1) * deformiraj;
}
// In priblizamo osnovni geometriji
var koti = kegel.geometry.attributes.position.array;
for (var i = 0; i < koti.length; i++) {
koti[i] = (geo.attributes.position.array[i] - koti[i]) * 0.75;
}
@ -351,7 +395,7 @@ function objAnim() {
obj.translateOnAxis(obj.premakniAxis, obj.premakniKolicina);
// obj.material.color.offsetHSL(0, 0, 0.003);
obj.material.opacity *= 0.98;
obj.material.opacity *= 0.998;
obj.premakniKolicina *= 0.98;
var dQ = obj.quaternion.multiply(obj.rotirajQ);
@ -399,35 +443,42 @@ function objAnim() {
kegel.scale.z *= 0.95;
}
// kegel.material.color.offsetHSL(2 / 1000, 0, 0);
// 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();
var bId = izbranKegel == 0 ? 0 : 1
var dodatniBarva = new THREE.Color(barvnePalete[bId][barvnePaleteIdx[bId]])
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;
if (kegli) {
var vsota = Math.abs(accX) + Math.abs(accZ)
if (vsota > 2 && !cakajDodatni) {
cakajDodatni = true
var dodatni = kegel.clone();
dodatni.renderOrder = stevec;
var dodatniMat = kegel.material.clone();
//var dodatniBarva = barvaDodatni.clone();
var bId = izbranKegel == 0 ? 0 : 1
var dodatniBarva = new THREE.Color(barvnePalete[bId][barvnePaleteIdx[bId]])
dodatniMat.color = dodatniBarva;
dodatni.material = dodatniMat;
dodatni.premakniAxis = new THREE.Vector3(
Math.random(),
Math.random(),
Math.random()
);
dodatni.premakniKolicina = vsota;
var rQ = qWW.clone();
rQ.invert();
rQ.multiply(qPrej);
dodatni.rotirajQ = rQ;
//dodatni.qStart = kegel.quaternion.clone();
dodatniObjekti.push(dodatni);
scene.add(dodatni);
barvnePaleteIdx[bId] = (barvnePaleteIdx[bId] + 1) % barvnePalete[bId].length;
//dodatni.qStart = kegel.quaternion.clone();
dodatniObjekti.push(dodatni);
scene.add(dodatni);
barvnePaleteIdx[bId] = (barvnePaleteIdx[bId] + 1) % barvnePalete[bId].length;
}
if (cakajDodatni && vsota < 1) {
cakajDodatni = false
}
}
};
@ -480,10 +531,21 @@ oscCallbacks['/ww/reload'] = function () {
window.location.reload();
};
oscCallbacks['/ww/zoom'] = args => {
console.log('dobil zoom', args)
const [kolicina] = args.map(getVal)
spremeniZoom(kolicina)
}
oscCallbacks['/ww/deformiraj'] = args => {
const [kolicina] = args.map(getVal)
spremeniDeformiraj(kolicina)
}
oscCallbacks['/ww/kegli'] = args => {
const [ali] = args.map(getVal)
kegli = ali
}
oscCallbacks['/ww/zogice'] = args => {
const [ali] = args.map(getVal)
zogice = ali
}
oscCallbacks['/midi-in'] = function (args) {
//console.log("MAMOMO MIDI!", args);
var minus = (izbranKegel == 1) ? -1 : 1;
@ -500,10 +562,12 @@ oscCallbacks['/midi-in'] = function (args) {
//kegel.scale.y *= 1 + (args[2] / 100000);
//kegel.scale.z *= 1 + (args[2] / 100000);
novaKrogla();
var bId = izbranKegel == 0 ? 2 : 3
console.log('id barve:', bId)
barvnePaleteIdx[bId] = (barvnePaleteIdx[bId] + 1) % barvnePalete[bId].length;
if (zogice) {
novaKrogla();
var bId = izbranKegel == 0 ? 2 : 3
console.log('id barve:', bId)
barvnePaleteIdx[bId] = (barvnePaleteIdx[bId] + 1) % barvnePalete[bId].length;
}
};
@ -527,13 +591,22 @@ window.addEventListener('keyup', e => {
window.addEventListener('mousedown', e => {
e.preventDefault()
kbdPressed['miska'] = true
switch (e.button) {
case 0:
kbdPressed['miska'] = true
break;
case 2:
kbdPressed['miskaD'] = true
}
return false
})
window.addEventListener('mouseup', e => {
if ('miska' in kbdPressed) {
kbdPressed['miska'] = false
}
if ('miskaD' in kbdPressed) {
kbdPressed['miskaD'] = false
}
})
var skrolam = false;
@ -549,4 +622,14 @@ window.addEventListener('mousemove', e => {
}];
sendAll('/ww/zoom', args)
}
if (kbdPressed['miskaD']) {
const sprememba = (e.movementX + e.movementY) / 10
spremeniDeformiraj(sprememba)
const args = [{
type: "f",
value: sprememba
}];
sendAll('/ww/deformiraj', args)
}
})