Skip to content

Integration of Omnitone with AFRAME

Hongchan Choi edited this page Jul 19, 2017 · 1 revision
function prepareOmnitone(onReadyCallback) {
  let audioContext = new AudioContext();
  let videoElement = document.querySelectorAll('video')[0];
  let mediaElementSource =
      audioContext.createMediaElementSource(videoElement);
  let foaRenderer = Omnitone.createFOARenderer(audioContext, {
      HRIRUrl: 'https://cdn.rawgit.com/GoogleChrome/omnitone/master/build/resources/sh_hrir_o_1.wav'
    });
  foaRenderer.initialize().then(() => {
      mediaElementSource.connect(foaRenderer.input);
      foaRenderer.output.connect(audioContext.destination);
      onReadyCallback(foaRenderer);
  });
}

function attachOmnitoneRendererToAFRAME(omnitoneRenderer) {
  let cameraEl = document.querySelector('#camera');
  AFRAME.registerComponent('listener', {
    tick: () => {
      omnitoneRenderer.setRotationMatrixFromCamera(cameraEl.object3D.matrix);
    }
  });
}

// Start application on page load.
window.addEventListener('load', () => {
  prepareOmnitone(attachOmnitoneRendererToAFRAME);  
});
Clone this wiki locally