[bump npm audioanalyser component] fix audio columns when playing song

package.json

@@ -8,7 +8,7 @@
   "dependencies": {
     "aframe-animation-component": "^5.1.2",
     "aframe-animation-timeline-component": "^1.3.1",
-    "aframe-audioanalyser-component": "^4.0.0",
+    "aframe-audioanalyser-component": "^4.0.1",
     "aframe-cubemap-component": "^0.1.2",
     "aframe-event-decorators": "^1.0.2",
     "aframe-event-set-component": "^4.0.1",

src/components/audio-columns.js

@@ -9,10 +9,8 @@ const NUM_VALUES_PER_BOX = 72;
  * Column bars moving in sync to the audio via audio analyser.
  */
 AFRAME.registerComponent('audio-columns', {
-  dependencies: ['audioanalyser'],
-
   schema: {
-    analyser: {type: 'selector', default: '#audioanalyser'},
+    analyser: {type: 'selector', default: '#audioAnalyser'},
     height: {default: 1.0},
     mirror: {default: 3},
     scale: {default: 4.0},

src/components/song.js

@@ -5,6 +5,7 @@ const utils = require('../utils');
  */
 AFRAME.registerComponent('song', {
   schema: {
+    analyserEl: {type: 'selector', default: '#audioAnalyser'},
     challengeId: {default: ''},
     isPlaying: {default: false}
   },
@@ -13,6 +14,7 @@ AFRAME.registerComponent('song', {
     // Use audio element for audioanalyser.
     this.audio = document.createElement('audio');
     this.audio.setAttribute('id', 'song');
+    this.audio.crossOrigin = 'anonymous';
     this.el.sceneEl.appendChild(this.audio);
   },
 
@@ -23,12 +25,13 @@ AFRAME.registerComponent('song', {
     // Changed challenge.
     if (data.challengeId !== oldData.challengeId) {
       let songUrl = utils.getS3FileUrl(data.challengeId, 'song.ogg');
-      this.audio.src = data.challengeId ? songUrl : '';
+      this.audio.setAttribute('src', data.challengeId ? songUrl : '');
     }
 
     // Keep playback state up to date.
     if ((data.isPlaying && data.challengeId) && this.audio.paused) {
       console.log(`Playing ${this.audio.src}...`);
+      this.data.analyserEl.setAttribute('audioanalyser', 'src', this.audio);
       this.audio.play();
       return;
     } else if ((!data.isPlaying || !data.challengeId) && !this.audio.paused) {

src/templates/stage.html

@@ -2,7 +2,7 @@
 
 <a-entity
   id="audioAnalyser"
-  audioanalyser="src: #introSong; fftSize: 64; enableBeatDetection: true; enableLevels: false; enableWaveform: false; beatDetectionThrottle: 5000"
+  audioanalyser="src: #introSong; fftSize: 64; enableBeatDetection: true; enableLevels: false; enableWaveform: false; beatDetectionThrottle: 5000; unique: true"
   proxy-event="event: audioanalyser-beat; to: #logolight, #floor"></a-entity>
 
 <a-entity id="stage">