Advertisement
BrU32

JS Web Audio Oscillator Cross Fader FX SRC

Nov 14th, 2016
88
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 1.87 KB | None | 0 0
  1. <script>
  2. var audioCtx=new AudioContext();
  3. var oscillator = audioCtx.createOscillator();
  4. var gainNode = audioCtx.createGain();
  5. oscillator.connect(gainNode);
  6. gainNode.connect(audioCtx.destination);
  7. var WIDTH = window.innerWidth;
  8. var HEIGHT = window.innerHeight;
  9. var FreqMax = prompt("Enter Max Freq");
  10. var VolMax = prompt("Enter Max Vol:");
  11. var Freq = prompt("Enter Starting Freq:");
  12. var Vol = prompt("Enter Starting Vol:");
  13. oscillator.type = 'sawtooth';
  14. oscillator.frequency.value = Freq;
  15. oscillator.start();
  16. gainNode.gain.value =Vol;
  17. var CurX;
  18. var CurY;
  19. var CurZ;
  20. var CurZZ;
  21. document.onmousemove = updatePage;
  22. function updatePage(e) {
  23. CurZ = (window.Event) ? e.pageY : event.clientY + (document.documentElement.scrollLeft ? document.documentElement.scrollLeft : document.body.scrollLeft);
  24. CurZZ = (window.Event) ? e.pageX : event.clientX + (document.documentElement.scrollTop ? document.documentElement.scrollTop : document.body.scrollTop);
  25. CurX = (window.Event) ? e.pageX : event.clientX + (document.documentElement.scrollLeft ? document.documentElement.scrollLeft : document.body.scrollLeft);
  26. CurY = (window.Event) ? e.pageY : event.clientY + (document.documentElement.scrollTop ? document.documentElement.scrollTop : document.body.scrollTop);
  27. oscillator.frequency.value = (CurX/WIDTH) * FreqMax;
  28. gainNode.gain.value = (CurY/HEIGHT) * VolMax;
  29. oscillator.frequency.value = (CurZ-WIDTH) % FreqMax;
  30. gainNode.gain.value = (CurZZ-HEIGHT) % VolMax;
  31. oscillator.detune=(0);
  32. }
  33. function drawe(){
  34. var canvas = document.getElementById("myCanvas");
  35. var ctx = canvas.getContext("2d");
  36. ctx.moveTo(event.x+CurX,event.y+CurZZ);
  37. ctx.lineTo(event.x+CurX,event.y+CurZ);
  38. ctx.stroke();
  39. }
  40. </script>
  41. <html>
  42. <body onmousemove="drawe();" onchange="drawe();" background-color="white">
  43. <canvas id="myCanvas" width="1000" height="1000" style="background:darkorange;">
  44. </canvas>
  45. </body>
  46. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement