Hello, i want to realize an application using wavesurfer.js which can display a wave player for audios(See 2nd picture), but it doesn’t work with the connector, nothing displays, even i hard code in javascript., can somebody help me, please?
@JavaScript(
{
"wavesurfer.min.js",
"com_test_WaveSurfer.js"
})
public class WaveSurfer extends AbstractJavaScriptComponent
{
@Override
public WaveSurferState getState()
{
return (WaveSurferState) super.getState();
}
public void setAudio(String source)
{
getState().audio = source;
}
}
Connector javascript:
com_test_WaveSurfer = function() {
var element = $(this.getElement());
this.onStateChange = function()
{
// Create an instance
var wavesurfer = Object.create(WaveSurfer);
wavesurfer.init({
container: '#ROOT-2521314', //find this in html source, hard code
waveColor: '#A8DBA8',
progressColor: '#3B8686'
});
wavesurfer.load('VAADIN/jquery/ft_incoming.wav'); //Find it, but cannot load, no error, but nothing displays
}
};
The player is created, but not visible(see jointed picture).
Can you give me an example of using this wavesurfer.js please? Thanks.