juni/junisaber
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

beat warmup rotation / twist

Browse Source
This commit is contained in:
Kevin Ngo
2018-10-23 04:28:39 -07:00
parent 1aa76414f3
commit 620f0a2846
3 changed files with 33 additions and 12 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
src/components/beat-loader.js
View File

@@ -1,8 +1,6 @@
import {BEAT_WARMUP_OFFSET, BEAT_WARMUP_SPEED} from '../constants/beat'; import {BEAT_WARMUP_OFFSET, BEAT_WARMUP_SPEED, BEAT_WARMUP_TIME} from '../constants/beat';
import utils from '../utils'; import utils from '../utils';
const WARMUP_TIME = (BEAT_WARMUP_OFFSET / BEAT_WARMUP_SPEED) * 1000; // ms.
/** /**
* Load beat data (all the beats and such). * Load beat data (all the beats and such).
*/ */
@@ -151,7 +149,7 @@ AFRAME.registerComponent('beat-loader', {
this.songCurrentTime !== this.el.components.song.context.currentTime) { this.songCurrentTime !== this.el.components.song.context.currentTime) {
this.songCurrentTime = this.el.components.song.context.currentTime; this.songCurrentTime = this.el.components.song.context.currentTime;
this.beatsTime = (this.songCurrentTime + this.data.beatAnticipationTime) * 1000 + this.beatsTime = (this.songCurrentTime + this.data.beatAnticipationTime) * 1000 +
WARMUP_TIME; BEAT_WARMUP_TIME;
} }
notes = this.beatData._notes; notes = this.beatData._notes;

38
src/components/beat.js
View File

@@ -1,6 +1,9 @@
import {BEAT_WARMUP_OFFSET, BEAT_WARMUP_SPEED} from '../constants/beat'; import {BEAT_WARMUP_OFFSET, BEAT_WARMUP_SPEED, BEAT_WARMUP_TIME} from '../constants/beat';
const auxObj3D = new THREE.Object3D(); const auxObj3D = new THREE.Object3D();
const BEAT_WARMUP_ROTATION_CHANGE = Math.PI / 5;
const BEAT_WARMUP_ROTATION_OFFSET = 0.4;
const BEAT_WARMUP_ROTATION_TIME = 750;
const SIGN_MATERIAL = {shader: 'flat', color: '#88f'}; const SIGN_MATERIAL = {shader: 'flat', color: '#88f'};
/** /**
@@ -41,6 +44,7 @@ AFRAME.registerComponent('beat', {
this.backToPool = false; this.backToPool = false;
this.beams = document.getElementById('beams').components.beams; this.beams = document.getElementById('beams').components.beams;
this.beatBoundingBox = new THREE.Box3(); this.beatBoundingBox = new THREE.Box3();
this.currentRotationWarmupTime = 0;
this.cutDirection = new THREE.Vector3(); this.cutDirection = new THREE.Vector3();
this.destroyed = false; this.destroyed = false;
this.gravityVelocity = 0; this.gravityVelocity = 0;
@@ -98,27 +102,38 @@ AFRAME.registerComponent('beat', {
}, },
tock: function (time, timeDelta) { tock: function (time, timeDelta) {
const el = this.el;
const position = el.object3D.position;
if (this.destroyed) { if (this.destroyed) {
this.tockDestroyed(timeDelta); this.tockDestroyed(timeDelta);
} else { } else {
// Only check collisions when close. // Only check collisions when close.
const collisionZThreshold = -4; const collisionZThreshold = -4;
if (this.el.object3D.position.z > collisionZThreshold) { this.checkCollisions(); } if (position.z > collisionZThreshold) { this.checkCollisions(); }
// Move. // Move.
if (this.el.object3D.position.z < this.startPositionZ) { if (position.z < this.startPositionZ) {
// Warm up / warp in. // Warm up / warp in.
this.el.object3D.position.z += BEAT_WARMUP_SPEED * (timeDelta / 1000); position.z += BEAT_WARMUP_SPEED * (timeDelta / 1000);
if (this.el.object3D.position.z >= this.startPositionZ) { if (position.z >= this.startPositionZ) {
this.beams.newBeam(this.data.color, this.el.object3D.position); this.beams.newBeam(this.data.color, position);
} }
} else { } else {
// Standard moving. // Standard moving.
this.el.object3D.position.z += this.data.speed * (timeDelta / 1000); position.z += this.data.speed * (timeDelta / 1000);
}
if (position.z > (this.startPositionZ - BEAT_WARMUP_ROTATION_OFFSET) &&
this.currentRotationWarmupTime < BEAT_WARMUP_ROTATION_TIME) {
const progress = AFRAME.ANIME.easings.easeOutBack(
this.currentRotationWarmupTime / BEAT_WARMUP_ROTATION_TIME);
el.object3D.rotation.z = this.rotationZStart + (progress * this.rotationZChange);
this.currentRotationWarmupTime += timeDelta;
} }
// Check. // Check.
this.backToPool = this.el.object3D.position.z >= 2; this.backToPool = position.z >= 2;
if (this.backToPool) { this.missHit(); } if (this.backToPool) { this.missHit(); }
} }
this.returnToPool(); this.returnToPool();
@@ -130,6 +145,13 @@ AFRAME.registerComponent('beat', {
onGenerate: function () { onGenerate: function () {
this.startPositionZ = this.el.object3D.position.z; this.startPositionZ = this.el.object3D.position.z;
this.el.object3D.position.z -= BEAT_WARMUP_OFFSET; this.el.object3D.position.z -= BEAT_WARMUP_OFFSET;
// Set up rotation warmup.
this.currentRotationWarmupTime = 0;
this.rotationZChange = BEAT_WARMUP_ROTATION_CHANGE;
if (Math.random > 0.5) { this.rotationZChange *= -1; }
this.el.object3D.rotation.z -= this.rotationZChange;
this.rotationZStart = this.el.object3D.rotation.z;
}, },
initBlock: function () { initBlock: function () {

1
src/constants/beat.js
View File

@@ -1,2 +1,3 @@
export const BEAT_WARMUP_OFFSET = 25; export const BEAT_WARMUP_OFFSET = 25;
export const BEAT_WARMUP_SPEED = 155; export const BEAT_WARMUP_SPEED = 155;
export const BEAT_WARMUP_TIME = (BEAT_WARMUP_OFFSET / BEAT_WARMUP_SPEED) * 1000;