Audio Equalizer

Using JavaScript with Hype
1

Hi. I need to include an audio equalizer on a page. I do not know how to do this to work inside a player made in the Hype. Could someone please help me? The attached example file works, but needs to be on a server to do the desired effect. Thanks in advance.Sample File

2

Hi,

The code you had in the .js does not work. I found the same code on codepen and it also has issues!.
There were errors in the console…

So just to get you started…

Place this in the head.

	function changeGain(string,type)
{
  var value = parseFloat(string) / 100.0;
  
  switch(type)
  {
    case 'lowGain': window.lGain.gain.value = value; break;
    case 'midGain':  window.mGain.gain.value = value; break;
    case 'highGain':  window.hGain.gain.value = value; break;
  }
}

Which will make it easier to call.

Then this code in a new hype function which should load in scene load.

	 // Equalizer for webaudio
//
// 
 
var context = new (window.AudioContext || window.webkitAudioContext)();
var mediaElement = document.querySelector('audio');
var sourceNode = context.createMediaElementSource(mediaElement);

// EQ Properties
//
var gainDb = -40.0;
var bandSplit = [360,3600];

var hBand = context.createBiquadFilter();
hBand.type = "lowshelf";
hBand.frequency.value = bandSplit[0];
hBand.gain.value = gainDb;

var hInvert = context.createGain();
hInvert.gain.value = -1.0;

var mBand = context.createGain();

var lBand = context.createBiquadFilter();
lBand.type = "highshelf";
lBand.frequency.value = bandSplit[1];
lBand.gain.value = gainDb;

var lInvert = context.createGain();
lInvert.gain.value = -1.0;

sourceNode.connect(lBand);
sourceNode.connect(mBand);
sourceNode.connect(hBand);

hBand.connect(hInvert);
lBand.connect(lInvert);

hInvert.connect(mBand);
lInvert.connect(mBand);

 window.lGain = context.createGain();
 window.mGain = context.createGain();
 window.hGain = context.createGain();

lBand.connect(window.lGain);
mBand.connect(mGain);
hBand.connect(hGain);

var sum = context.createGain();
window.lGain.connect(sum);
 window.mGain.connect(sum);
 window.hGain.connect(sum);
sum.connect(context.destination);

EQ.hype.zip (12.0 KB)

I would suggest you look at the below for more help and understanding.,

and

2 Likes
3

WOW !!! It works ! Thank you very much!!! :grin::clap::clap::clap::clap::clap::clap: