diff --git a/src/open.js b/src/open.js index 70f17e8..f20c989 100644 --- a/src/open.js +++ b/src/open.js @@ -5,8 +5,22 @@ const STAR_POINTS = 5; let scene, camera, renderer; let coreStarGroup; let lights = {}; +let animation = { + steps: 0, + x: new Float32Array(4), + y: new Float32Array(4), + z: new Float32Array(4), +}; + +function interpolate(range, factor) { + for (let i = 1; i < range.length; ++i) { + range[i] += (range[i - 1] - range[i]) * factor; + } +} + /** + * Create a BufferGeometry from vertices and faces. * * @param {Float32Array} vertices * @param {number[]} faces @@ -23,6 +37,10 @@ THREE.BufferGeometry.fromVertices = function (vertices, faces) { return geometry; }; +Float32Array.prototype.last = function () { + return this[this.length - 1]; +}; + function addStar() { let frontGeometry = THREE.BufferGeometry.fromVertices(starCoordinates(2, 3, -0.1), filledStarIndices()); let backGeometry = THREE.BufferGeometry.fromVertices(starCoordinates(2, 3, 0.1), filledStarIndices()); @@ -222,8 +240,21 @@ function starCoordinates(innerRadius, outerRadius, z) { function animate() { requestAnimationFrame(animate); - coreStarGroup.rotation.z += 0.01; - coreStarGroup.rotation.y += 0.01; + if (animation.steps === 0) { + animation.steps = Math.floor(Math.random() * 60) + 30; + animation.x[0] = 4 * Math.random() * Math.PI; + animation.y[0] = 4 * Math.random() * Math.PI; + animation.z[0] = 4 * Math.random() * Math.PI; + } + + animation.steps--; + interpolate(animation.x, 0.05); + interpolate(animation.y, 0.05); + interpolate(animation.z, 0.05); + + coreStarGroup.rotation.x = animation.x.last(); + coreStarGroup.rotation.y = animation.y.last(); + coreStarGroup.rotation.z = animation.z.last(); renderer.render(scene, camera); }