Untitled

<!DOCTYPE html>
<html>
    <head>
        <script src="soundmanager/script/soundmanager2.js"></script>
        <script>
            function play(file)
            {
                test = document.getElementById("test");
                canvas = document.getElementById("canvas");
                context = canvas.getContext("2d");

                soundManager.setup(
                {
                    url: "soundmanager/swf",
                    onready: function()
                    {
                        song = soundManager.createSound(
                        {
                            id: "sound",
                            url: file,

                            autoLoad: true,
                            autoPlay: true,

                            useEQData: true,
                            useWaveformData: false,
                            usePeakData: false,
                        });
                        interval = setInterval(draw, 10);
                    }
                });
            }
            function draw()
            {
                context.clearRect(0, 0, 1025, 256);
                for (var i=0; i<256; i++)
                {
                    value = +song.eqData.left[i];

                    context.fillRect(4*i+1, 256, 3, -256*value - 1);
                }
            }
        </script>
    </head>
    <body onLoad="play('Flight.mp3');">
        <canvas id="canvas" width=1025 height=256 style="margin: 64px auto; display: block; background-color: #DDD; border-radius: 4px;"></canvas>
        <p id="test"></p>
    </body>
</html>