diff --git a/anim.js b/anim.js index 8e372fd..09cdbf2 100644 --- a/anim.js +++ b/anim.js @@ -54,7 +54,7 @@ var kameraZ = 0; // Scena, kamera in render scene = new THREE.Scene; -camera = new THREE.PerspectiveCamera(FOV, window.innerWidth / window.innerHeight, 0.1, 2000); +camera = new THREE.PerspectiveCamera(FOV, window.innerWidth / window.innerHeight, 1, 10000); camera.position.z = odmik_kamere; renderer = new THREE.WebGLRenderer({ @@ -91,6 +91,7 @@ function objAnim() { obj.rotation.x += drotacijaX / 100; obj.rotation.y += drotacijaY / 100; obj.rotation.z += drotacijaZ / 100; + obj.setRotationFromQuaternion(quaternion); obj.scale.z += width / 4; obj.scale.y += width / 4; diff --git a/test.js b/test.js index ef132a4..7a9a75b 100644 --- a/test.js +++ b/test.js @@ -1,15 +1,12 @@ console.log("Hello, Sky!"); /**** ☭☭☭☭☭☭☭☭☭☭☭☭ ****** -/☭☭☭☭ Parametri razni ☭☭☭☭ * +/☭☭☭☭ Test skripta ☭☭☭☭ * ******☭☭☭☭☭☭☭☭☭☭☭☭******/ // Odmik kamere var odmik_kamere = 100; -// Rotacija kamere -var cam_rot_offset = 1; - // Vidni kot var FOV = 140; @@ -18,27 +15,11 @@ var width = 25; var height = 150; var depth = 50; -// Stevec, za razno animiranje -var stevec = 0; - -// Parametri animacije +// Parametri animacije (euler) var rotacijaX = 0.000; var rotacijaY = 0.000; var rotacijaZ = 0.000; -// Pozicija -var posX = 0; -var posY = 0; -var posZ = 0; - -// Zamik pri novem objektu -var barva = 0.333; -var saturacija = 1; -var svetlost = 0.4; - -// Drugi parametri -var wDiff = 0.5; - // Scena, kamera in render scene = new THREE.Scene; @@ -61,8 +42,10 @@ var mat = new THREE.MeshBasicMaterial({ color: 0xff00ff, wireframe: true }); -//quaternion = new THREE.Quaternion(); -quaternion = null; +// quaternion = new THREE.Quaternion(); +var quaternion = null; +var conjugation = null; + var cube = new THREE.Mesh(geo, mat); scene.add(cube); // @@ -70,65 +53,26 @@ var objekti = [cube]; function render () { requestAnimationFrame(render); - - stevec += 1; renderer.render(scene, camera); - objAnim(); - //camRotate(); }; // Funkcija za animacijo objektov function objAnim() { objekti.map(function (obj) { - obj.setRotationFromEuler(new THREE.Euler(rotacijaY, -rotacijaX, rotacijaZ, 'XYZ')); - /* - if (quaternion) { - obj.setRotationFromQuaternion(new THREE.Quaternion(...quaternion)); + if (conjugation) { + //obj.setRotationFromEuler(new THREE.Euler(rotacijaY, -rotacijaX, rotacijaZ, 'XYZ')); + newq = quaternion.clone(); + //newq.multiplyQuaternions(quaternion, conjugation); + //newq.multiply(conjugation); + //obj.setRotationFromQuaternion(THREE.Quaternion.multiplyQuaternions(quaternion, conjugation)); + obj.setRotationFromQuaternion(newq); + console.log(obj.rotation.x); } - */ - - /* - obj.rotation.y = -rotacijaX; - obj.rotation.x = rotacijaY; - obj.rotation.z = rotacijaZ; - */ - - /* - const cor = 0.8; - obj.position.x += posX / 1000; - obj.position.x *= cor; - obj.position.y += posY / 1000; - obj.position.y *= cor; - obj.position.z += posZ / 1000; - obj.position.z *= cor; - */ }); }; -var xAksa = new THREE.Vector3(0, 1, 0); -function camRotate () { - // rotiraj po z osi - camera.translateX(cam_rot_offset); - camera.translateZ(odmik_kamere - Math.sqrt(Math.pow(odmik_kamere, 2) + Math.pow(cam_rot_offset, 2))); - - /* - camera.translateY(cam_rot_offset); - camera.translateX(odmik_kamere - Math.sqrt(Math.pow(odmik_kamere, 2) + Math.pow(cam_rot_offset, 2))); - - camera.translateY(cam_rot_offset); - camera.translateX(odmik_kamere - Math.sqrt(Math.pow(odmik_kamere, 2) + Math.pow(cam_rot_offset, 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 document.onreadystatechange = function () { if (document.readyState === 'complete') { @@ -150,22 +94,30 @@ window.addEventListener('resize', onWindowResize, false); // Poslusaj OSC evente keysPressed = [0, 0, 0, 0]; +const getVal = function (msg) { + return msg.value; +} + oscCallbacks = { '/keys/': [ function(args) { keysPressed = [...args]; } ], - /* '/quaternion/': [ function (args) { - quaternion = args.map(function (a) { return a.value; }); + if (quaternion) { + [quaternion.w, quaternion.x, quaternion.y, quaternion.z] = args.map(getVal); + } else { + quaternion = new THREE.Quaternion(args[0], args[1], args[2], args[3]); + conjugation = quaternion.clone(); + conjugation.conjugate(); + } } - ] - */ + ], '/gyro/': [ function (args) { - [rotacijaX, rotacijaY, rotacijaZ] = args.map(function (a) { return a.value; }); + [rotacijaX, rotacijaY, rotacijaZ] = args.map(getVal); } ] }