Kalibracija, zogice

anim.js

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

osctl.js

@@ -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) {

test.js

@@ -4,8 +4,11 @@ console.log("Hello, Sky!");
 /☭☭☭☭  Test skripta   ☭☭☭☭ *
 ******☭☭☭☭☭☭☭☭☭☭☭☭******/
 
-// Odmik kamere
+// Ker kegel imamo?
-var odmik_kamere = 100;
+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();
+var barva = new THREE.Color(0, 0, 0);
-barva.setHSL(0.6, 1.0, 0.5);
+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
+// Zacetna orientacija kegla
-camera.position.y = -100
 scene.rotation.x = 90;
-scene.rotation.z = -270;
+scene.rotation.z = 270;
 
-skupina.position.z = 64;
+// Polozaj kamere
-skupina.position.y = -34;
+//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) {
+  // Dupliranje keglov
-    if (!reset) {
+  //console.log(accX);
-      qStart = qWW.clone();
+  kegel.material.color.offsetHSL(2 / 1000, 0, 0);
-      qStart.conjugate();
+  if (accX > 1/* && (stevec % 10) == 0*/) {
-      reset = true;
+    var dodatni = kegel.clone();
-      console.log("RESET!");
+    dodatni.renderOrder = stevec;
-    }
+    var dodatniMat = kegel.material.clone();
-  } else {
+    var dodatniBarva = barvaDodatni.clone();
-    if (reset) {
+    dodatniMat.color = dodatniBarva;
-      reset = false;
+    dodatni.material = dodatniMat;
-      console.log("reset off....");
+    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') {
+  if (document.readyState === 'complete') {
-        document.getElementById("anim-container").appendChild(renderer.domElement);
+    document.getElementById("anim-container").appendChild(renderer.domElement);
-
+    render();
-        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/${izbranKegel}`;
-var prepend = '/ww/0/ww/0';
+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 {