Skip to content

Instantly share code, notes, and snippets.

@hughrawlinson
Last active February 11, 2016 11:45
Show Gist options
  • Save hughrawlinson/5853775 to your computer and use it in GitHub Desktop.
Save hughrawlinson/5853775 to your computer and use it in GitHub Desktop.
Web Audio Crossfader
var vineVideoElement = document.getElementById('vineVideo');
var instVideoElement = document.getElementById('instVideo');
var instGain;
var vineGain;
window.AudioContext = window.AudioContext||window.webkitAudioContext;
var context = new AudioContext();
function initCrossfade(){
vineVideoElement.play();
instVideoElement.play();
var vine = context.createMediaElementSource(vineVideoElement);
var inst = context.createMediaElementSource(instVideoElement);
instGain = context.createGainNode();
vineGain = context.createGainNode();
vine.connect(vineGain);
inst.connect(instGain);
instGain.connect(context.destination);
vineGain.connect(context.destination);
}
var updateVolumes = function(mouseEvent){
var range = (vineVideoElement.offsetLeft + vineVideoElement.offsetWidth) - instVideoElement.offsetLeft;
console.log('range: ',range);
var crossfadePos = parseFloat(mouseEvent.clientX-(vineVideoElement.offsetLeft + vineVideoElement.offsetWidth));
crossfadePos = Math.max(0, Math.min(crossfadePos, range))/range;
console.log('cross: ',crossfadePos);
vineGain.gain = (crossfadePos*-1)+1;
instGain.gain = crossfadePos;
}
initCrossfade();
onmousemove = updateVolumes;
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment