I have two scripts that work fine by themselves.
If I try to use both scripts together the first one doesn't work, but the second one does. The first script is to control the playbackRate of myaudio element. The second script is for a vu or volume meter.
This is both scripts in the order I'm using them:
- // Create a couple of global variables to use.
var audioElement = document.getElementById("myaudio"); // Audio element
var ratedisplay = document.getElementById("rate"); // Rate display area
// Hook the ratechange event and display the current playbackRate after each change
audioElement.addEventListener("ratechange", function () {
ratedisplay.innerHTML = "Speed: " + audioElement.playbackRate;
}, false);
// Increment playbackRate by 1
$("#increaseSpeed").click(increaseSpeed);
function increaseSpeed() {
audioElement.playbackRate += 0.1;
}
// Increment playbackRate by 1
$("#decreaseSpeed").click(decreaseSpeed);
function decreaseSpeed() {
audioElement.playbackRate -= 0.05;
}
// Initialize the peak meters with the newly created audio element
var myMeterElement = document.getElementById('my-peak-meter');
var myAudioElement = audio.element;
var audioCtx = new (window.AudioContext || window.webkitAudioContext)();
var sourceNode = audioCtx.createMediaElementSource(myAudioElement);
sourceNode.connect(audioCtx.destination);
var meterNode = webAudioPeakMeter.createMeterNode(sourceNode, audioCtx);
webAudioPeakMeter.createMeter(myMeterElement, meterNode, {});
I'm using jquery 3.1.1 I have tried all kinds of things, but I'm not good enough with jquery to work this out.
Thank you for any help recieved.