connect to an audio element

[eetsceeck1]

Hi there,

there is a way to connect pizzicato to an existing html audio element as i did with tuna.js?

please check my conclusion how to connect an effect to an audio element with 4 other elements nodes connected to the same audio context on here: at the very bottom of the thread instead i will explain here everything is there, what i am trying to do, how my script is looks like and all, https://github.com/Theodeus/tuna/issues/89#issuecomment-1188868885

i am trying to connect pizzicato the same way, or if what is the way please to connect pizzicato to my audio element ? thanks a lot in advance!

[eetsceeck1]

here it is how i connect tuna in my case, thanks!

<!-- HTML -->
<audio id="PlayBackAudioElement" autoplay controls crossorigin="anonymous" preload="none">
<source src="">
</audio>

<button id="EnableConvolverButton">Enable Convolver</button>
<button id="DisableConvolverButton">Disable Convolver</button>
<!-- END OF HTML -->

//JAVASCRIPT
//
//  AUDIO CONTEXT.
let audioContext = new AudioContext() || window.AudioContext || window.webkitAudioContext();

//  SET VARIABLE FOR YOUR AUDIO ELEMENT.
let audio = document.getElementById("PlayBackAudioElement");

//  SET SOURCE VARIABLE - THE HTML AUDIO ELEMENT WILL BE YOUR SOURCE (MUSIC SOURCE/STREAM)
let source = audioContext.createMediaElementSource(audio);

//  SET VARIABLE FOR ENABLING THE EFFECT BUTTON (CONVOLVER IN THIS CASE)
let ConvolverEnableButtonVariable = document.querySelector("#EnableConvolverButton");

//  SET VARIABLE FOR DISABLING THE EFFECT BUTTON (CONVOLVER IN THIS CASE)
let ConvolverDisableButtonVariable = document.querySelector("#DisableConvolverButton");

//  THESE PARAMETERS BETTER TO BE OUTSIDE THE FUNCTION SO THEY WILL BE EXECUTED ON LOAD =>
//  
//  SET VARIABLE FOR TUNA NODE WITH YOUR EXIST AUDIOCONTEXT (THE AUDIOCONTEXT ABOVE)
//  NOTE: ***** IF YOU HAVE MORE NODES SUCH AS VISUALIZERS, YOU SHOULD ALWAYS USE THE SAME AUDIO CONTEXT *****
var tuna = new Tuna(audioContext);

//  CONVOLVER EFFECT
var convolver = new tuna.Convolver({
    highCut: 22050,                         //20 to 22050
    lowCut: 20,                             //20 to 22050
    dryLevel: 1,                            //0 to 1+
    wetLevel: 2.1,                          //0 to 1+
    level: 0.5,                             //0 to 1+, adjusts total output of both wet and dry
    impulse: "impulses/impulse_rev.wav",    //the path to your impulse response
    bypass: 0
});

//  INPUT AND OUTPUT CREATE GAIN ON THE WEB AUDIO API FOR TUNA (CAN BE ANY VARIABLE NAMES WE WANT OTHER THAN "INPUT" OR "OUTPUT")
/// MORE INFORMATION CAN BE FOUND HERE: https://developer.mozilla.org/en-US/docs/Web/API/BaseAudioContext/createGain
var input = audioContext.createGain();
var output = audioContext.createGain();

//  START EFFECT BUTTON
//  ON CLICK FUNCTION TO ENABLE CONVOLVER EFFECT.
ConvolverEnableButtonVariable.addEventListener("click", function () {

    input.connect(convolver);

    convolver.connect(output);

    source.connect(convolver);

    convolver.connect(audioContext.destination);

});

//  STOP EFFECT BUTTON
//  ON CLICK FUNCTION TO DISABLE CONVOLVER EFFECT.
ConvolverDisableButtonVariable.addEventListener("click", function(e) {

    convolver.disconnect();

});