import Vudio from 'vudio'

var vudio = new Vudio(HTMLAudioElement | MediaStream, HTMLCanvasElement, [option]);
vudio.dance();

var audioObj = document.querySelector('#audio');
var canvasObj = document.querySelector('#canvas');
var vudio = new Vudio(audioObj, canvasObj, {
    effect : 'waveform', // waveform, circlewave, circlebar, lighting (4 visual effect)
    accuracy : 128, // number of freqBar, must be pow of 2.
    width : 256, // canvas width
    height : 100, // canvas height
    waveform : {
        maxHeight : 80, // max waveform bar height
        minHeight : 1, // min waveform bar height
        spacing: 1, // space between bars
        color : '#f00', // string | [string] color or waveform bars
        shadowBlur : 0, // blur of bars
        shadowColor : '#f00', 
        fadeSide : true, // fading tail
        horizontalAlign : 'center', // left/center/right, only effective in 'waveform'/'lighting'
        verticalAlign: 'middle' // top/middle/bottom, only effective in 'waveform'/'lighting'
    }
});

vudio.dance();

// pause as you wish
vudio.pause();

// change option reactively.
vudio.setOption({
    waveform : {
        color : '#06f',
        verticalAlign: 'bottom'
    }
});