opentok streaming api adjusting volume to streaming from subscriber side

Question

I am not an experienced programmer yet, I am currently building a streaming website. I am using opentok-vonage api, the streaming is working fine so far, I am trying to implement some functionality such as a scroll for set the volume from the subscriber side. I get the value and pass it inside AudioLevel

<input id="volume-control" type="range" min="1" max="100" value="50">.

    let volume = document.getElementById("volume-control");
    let newVol = volume.value;
    volume.addEventListener("click", function (e) {
      e.preventDefault();
      e = volume.value;
      let newVol = e;

      console.log(newVol);
    });

const subscriber = session.on("streamCreated", function (event) {
      session.subscribe(
        event.stream,
        "videos",
        {
          insertMode: "replace",
          width: "100%",
          height: "100%",
          audioVolume: newVol,
        },

Here is the problem on console.log I see the value of newVol, if I hard code audioVolume it works, if I pass the newVol value nothing happens. How can I change the volume of the streaming without refreshing the page from the subscriber side?Do I need to implement some AJAX? or I completely need a new function that is maybe built in within the API?

Thanks everyone

Answer 1

As this is an event listener so it will always get the initial value of the variable. What you have to do it. You have to update the event listener on volume change.

<input id="volume-control" type="range" min="1" max="100" value="50" onchange='updateEvent()'>

Now define a updateEvent function and update your EventListener with the new Volume