MultiChannelAudioUI

I have been pondering on an idea about having multiple visualizations for the same underlying piece of audio. The ability to able to visualize all the channels or having different displays for the same channel, at the same time having the same set of controls.

MultiChannelAudioUI or MUI does exactly this job. Although, it doesn't do anything by it self. It acts just as a wrapper around the AudioUI.  Here is how it works,


In this example, we are going to display two channels for a stereophonic audio ( 2 channeled audio) .

Lets start by doing the initial setups for AudioUIs one for each channel,

// initial setup for audioui-1

ch1ui = new AudioUI();

ch1ui.attachUIComponent(AudioUI.UIComponent.CONTAINER,ch1Panel); ch1ui.setChannelToRead(1); // read channel 1 

 // intial setup for audioui-2

ch2ui = new AudioUI();

ch2ui.attachUIComponent(AudioUI.UIComponent.CONTAINER, ch2Panel);

ch2ui.setChannelToRead(2); // read channel 2

Since MUI is acts a wrapper, the initial settings for individual channels has to be setup here.  

Although, it is still valid to attach the controllers for individual audioUIs, for eg,

ch1ui.attachUIComponent(AudioUI.UIComponent.PLAY, playAudio);

ch1ui.attachUIComponent(AudioUI.UIComponent.PAUSE, pauseAudio);

ch1ui.attachUIComponent(AudioUI.UIComponent.SEEKER, audSlider);

Since, the idea is to have one common set of controls for both the channels, a sort of "tying" both channels with the same controls, we use MUI for the setting the controls,

MultiChannelAudioUI mui = new MultiChannelAudioUI();

 // configure multichannel ui

mui.attachUIComponent(MultiChannelAudioUI.UIComponent.PLAY, playAudio);

mui.attachUIComponent(MultiChannelAudioUI.UIComponent.PAUSE, pauseAudio);

mui.attachUIComponent(MultiChannelAudioUI.UIComponent.SEEKER, audioSlider);

NOTE:
Any existing controls to the AudioUIs will be overwritten when the tracks are added to this MUI.

Earlier, in my blog post, I mentioned that the updated API expects the type display before interacting with the displays, for eg,

// Configure myAudio to use container display type "waveform"
 myAudio.setContainerDisplay(AudioDisplay.TYPE.WAVEFORM);


In this case, the initialization of the individual channels takes place "inside" MUI. Hence, there is no need to have separate setting the display for individual channels. This is can be done while adding tracks to MUI. In this case,

 // add audio uis

mui.addTrack(ch1ui, AudioDisplay.TYPE.WAVEFORM);

mui.addTrack(ch2ui, AudioDisplay.TYPE.WAVEFORM);

The audio source for each channel is done by using MUI but not the individual UIs.

mui.setAudioFile(mySterioAudioFile);


that is, it doesnot make sense in using,

ch1ui.setAudioFile(mySterioAudioFile);
ch2ui.setAudioFile(mySterioAudioFile);

Thats it.

All the interactions with the channels are performed using the individual UIs. For example,

// Set channel1 to mute 
ch1ui.setAudioMute(true);
// Zoom in channel 2 ui
ch2ui.getDisplay(AudioDisplay.TYPE.WAVEFORM).zoomIn();



 Here, is a small demo