console.log("Hello, Sky!"); /**** ☭☭☭☭☭☭☭☭☭☭☭☭ ****** /☭☭☭☭ Parametri razni ☭☭☭☭ * ******☭☭☭☭☭☭☭☭☭☭☭☭******/ // Odmik kamere var odmik_kamere = 100; // Rotacija kamere var cam_rot_offset = 1; // Vidni kot var FOV = 90; // Sirina in visina objektov var width = 6; // Limit stevila objektov var obj_limit = 600; // Prvotno prazno polje objektov. Lahko bi kak buffer to bil pozneje var objekti = []; // Stevec, za razno animiranje var stevec = 0; var gostota_obj = 1; // Parametri animacije var drotacijaX = 0.006; var drotacijaY = 0.001; var drotacijaZ = 0.003; var rotacijaX = 0; var rotacijaY = 0; var rotacijaZ = 0; // Premik obstojecih barv var zamikBarve = 1; // Zamik pri novem objektu var barva_mod = 0.333; var saturacija = 1; var svetlost = 0.4; var kameraX = 0; var kameraY = 0; var kameraZ = 0; // Scena, kamera in render scene = new THREE.Scene; camera = new THREE.PerspectiveCamera(FOV, window.innerWidth / window.innerHeight, 0.1, 2000); camera.position.z = odmik_kamere; renderer = new THREE.WebGLRenderer({ alpha: true }); renderer.setSize(window.innerWidth, window.innerHeight); // Belo ozadje //renderer.setClearColor(0xFFFFFF, 1); // Črno ozadje renderer.setClearColor(0x000000, 1); function render () { requestAnimationFrame(render); stevec += 1; // Dodaj objekt vcasih if (stevec % gostota_obj === 0) { addObj(width, width); } renderer.render(scene, camera); objAnim(); camRotate(); }; // Funkcija za animacijo objektov function objAnim() { objekti.map(function (obj) { obj.rotation.x += drotacijaX / 100; obj.rotation.y += drotacijaY / 100; obj.rotation.z += drotacijaZ / 100; obj.scale.z += width / 4; obj.scale.y += width / 4; obj.scale.x += width / 4; obj.material.color.offsetHSL(zamikBarve, 0, 0); }); }; // Funkcija za dodajanje novih objektov function addObj(w, h) { var col = new THREE.Color(); col.setHSL(stevec * barva_mod, saturacija, svetlost); var mat = new THREE.LineBasicMaterial({ color: col }); var geo = new THREE.Geometry(); var offset = h / 2; geo.vertices.push(new THREE.Vector3(-offset, 0, 0), new THREE.Vector3(0, offset, 0)); geo.vertices.push(new THREE.Vector3(-offset, 0, 0), new THREE.Vector3(0, -offset, 0)); geo.vertices.push(new THREE.Vector3(offset, 0, 0), new THREE.Vector3(0, offset, 0)); geo.vertices.push(new THREE.Vector3(offset, 0, 0), new THREE.Vector3(0, -offset, 0)); var obj = new THREE.Line(geo, mat, THREE.LineSegments); scene.add(obj); obj.rotation.x = rotacijaX; obj.rotation.y = rotacijaY; obj.rotation.z = rotacijaZ; // Pocisti za seboj if (objekti.push(obj) > obj_limit) { while (objekti.length > obj_limit) { scene.remove(objekti[0]); objekti.shift(); } } }; var xAksa = new THREE.Vector3(0, 1, 0); function camRotate () { // rotiraj po z osi 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 document.onreadystatechange = function () { if (document.readyState === 'complete') { document.getElementById("anim-container").appendChild(renderer.domElement); render(); } }; // Lep risajz function onWindowResize() { camera.aspect = window.innerWidth / window.innerHeight; camera.updateProjectionMatrix(); renderer.setSize(window.innerWidth, window.innerHeight); } window.addEventListener('resize', onWindowResize, false); var keysPressed = [0, 0, 0, 0]; var gyro = [0, 0, 0]; var accel = [0, 0, 0]; const getVal = function (msg) { return msg.value; } oscCallbacks = { '/keys/': [ function(args) { keysPressed = args.map(getVal); } ], '/gyro/': [ function (args) { var [gx, gy, gz] = args.map(getVal); console.log(keysPressed) if (keysPressed[0] && keysPressed[1] && keysPressed[2] && keysPressed[3]) { window.location.reload() } if (keysPressed[2]) { rotacijaX += gyro[0] - gx rotacijaY += gyro[1] - gy rotacijaZ += gyro[2] - gz } if (keysPressed[3]) { drotacijaX += gyro[0] - gx drotacijaY += gyro[1] - gy drotacijaZ += gyro[2] - gz } if (keysPressed[1]) { kameraX += gyro[0] - gx FOV += (gyro[1] - gy) * 10 //kameraY += gyro[1] - gy //kameraZ += gyro[2] - gz } if (keysPressed[0]) { zamikBarve *= 1 + (gx - gyro[0]) obj_limit *= 1 + (gy - gyro[1]) width *= 1 + (gz - gyro[2]) } gyro = [gx, gy, gz] } ] }