diff --git a/src/components/song.js b/src/components/song.js
index 8f381cf..19b1e00 100644
--- a/src/components/song.js
+++ b/src/components/song.js
@@ -84,6 +84,7 @@ AFRAME.registerComponent('song', {
const data = this.data;
return new Promise(resolve => {
data.analyserEl.addEventListener('audioanalyserbuffersource', evt => {
+ // Finished decoding.
this.source = evt.detail;
this.source.onended = this.victory;
resolve(this.source);
@@ -91,6 +92,7 @@ AFRAME.registerComponent('song', {
this.analyserSetter.src = utils.getS3FileUrl(data.challengeId, 'song.ogg');
data.analyserEl.setAttribute('audioanalyser', this.analyserSetter);
this.audioAnalyser.xhr.addEventListener('progress', evt => {
+ // Finished fetching.
this.onFetchProgress(evt);
});
});
@@ -114,6 +116,7 @@ AFRAME.registerComponent('song', {
onFetchProgress: function (evt) {
const progress = evt.loaded / evt.total;
this.songLoadingIndicator.setAttribute('geometry', 'thetaLength', progress * 360);
+ if (progress >= 1) { this.el.sceneEl.emit('songfetchfinish', null, false); }
},
onRestart: function () {
diff --git a/src/state/index.js b/src/state/index.js
index 2c0e219..678f350 100644
--- a/src/state/index.js
+++ b/src/state/index.js
@@ -34,16 +34,14 @@ AFRAME.registerState({
},
damage: 0,
inVR: false,
- isGameOver: false,
+ isGameOver: false, // Game over screen.
isPaused: false, // Playing, but paused. Not active during menu.
- isPlaying: false, // Not in the menu AND not paused.
- isSongLoading: false,
- isVictory: false,
- keyboardActive: false,
- menu: {
- active: true,
- playButtonText: 'Play'
- },
+ isPlaying: false, // Actively playing (slicing beats).
+ isSongFetching: false, // Fetching stage.
+ isSongLoading: false, // Either fetching or decoding.
+ isVictory: false, // Victory screen.
+ keyboardActive: false, // Whether search is open.
+ menu: {active: true},
menuDifficulties: [],
menuSelectedChallenge: {
author: '',
@@ -227,11 +225,17 @@ AFRAME.registerState({
computeMenuSelectedChallengeIndex(state);
},
+ songfetchfinish: (state) => {
+ state.isSongFetching = false;
+ },
+
songloadfinish: (state) => {
+ state.isSongFetching = false;
state.isSongLoading = false;
},
songloadstart: (state) => {
+ state.isSongFetching = true;
state.isSongLoading = true;
},
@@ -264,6 +268,13 @@ AFRAME.registerState({
state.leftRaycasterActive = anyMenuOpen && state.activeHand === 'left' && state.inVR;
state.rightRaycasterActive = anyMenuOpen && state.activeHand === 'right' && state.inVR;
+ // Song is decoding if it is loading, but not fetching.
+ if (state.isSongLoading) {
+ state.loadingText = state.isSongFetching ? 'Downloading song...' : 'Processing song...';
+ } else {
+ state.loadingText = '';
+ }
+
state.multiplierText = `${state.score.multiplier}x`;
}
});
diff --git a/src/templates/stage.html b/src/templates/stage.html
index c3e66d4..fbfbbe2 100644
--- a/src/templates/stage.html
+++ b/src/templates/stage.html
@@ -115,7 +115,7 @@
+ bind__visible="isSongLoading">