<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" xmlns:fx="com.fusiox.ui.*" layout="absolute" initialize="initApp()" viewSourceURL="srcview/index.html">
    <mx:Script>
        <![CDATA[
            import flash.media.Sound;
            import flash.net.URLRequest;
            import flash.net.URLLoader;
            import flash.media.SoundLoaderContext;
            
            [Bindable]
            public var effects:Array = new Array();
            
            private function initApp():void {
                var request:URLRequest = new URLRequest("http://www.benstucki.net/mp3/tech_talk.mp3");
                var loader:URLLoader = new URLLoader(request);
                loader.addEventListener(ProgressEvent.PROGRESS, updateProgress);
                loader.addEventListener(Event.COMPLETE, completeProgress);
                   var mySound:Sound = new Sound(request);
                   mySound.play(0,10);
                   
                   effects.push(new Array("verticalBlur", verticalBlur));
                   effects.push(new Array("horizontalBlur", horizontalBlur));
                   effects.push(new Array("verticalScroll", verticalScroll));
                   effects.push(new Array("horizontalScroll", horizontalScroll));
                   effects.push(new Array("blueFade", blueFade));
               }
               
               private function updateProgress( e:ProgressEvent ):void {
                   explorer.title = "Visualization Explorer [ Loading " + Math.floor(e.bytesLoaded/e.bytesTotal*100) + "% ]";
               }
               
               private function completeProgress( e:Event ):void {
                   explorer.title = "Visualization Explorer";
               }
               
               private function blueFade( e:Event ):void {
                   e.target.bitmapData.colorTransform( e.target.bitmapData.rect, new ColorTransform( 0.6, 0.8, 1, 0.9 ) );
               }
               
               private function verticalBlur( e:Event ):void {
                   e.target.bitmapData.applyFilter( e.target.bitmapData, e.target.bitmapData.rect, new Point(0,0), new BlurFilter(0,15));
               }
               
               private function horizontalBlur( e:Event ):void {
                   e.target.bitmapData.applyFilter( e.target.bitmapData, e.target.bitmapData.rect, new Point(0,0), new BlurFilter(15,0));
               }
               
               private function verticalScroll( e:Event ):void {
                   e.target.bitmapData.scroll(0,5);
               }
               
               private function horizontalScroll( e:Event ):void {
                   e.target.bitmapData.scroll(-5,0);
               }
               
        ]]>
    </mx:Script>
    <mx:Panel id="explorer" title="Visualization Explorer" width="600" height="400" horizontalAlign="center" verticalAlign="middle" horizontalCenter="0" verticalCenter="0">
        <mx:VBox width="90%" height="90%" >
            <mx:Form width="100%" height="50%" >
                <mx:FormItem label="Color Options" direction="horizontal">
                    <mx:ColorPicker toolTip="audioLineColor" change="example.setStyle(&quot;audioLineColor&quot;,event.target.selectedColor);" />
                    <mx:ColorPicker toolTip="audioFillColor" change="example.setStyle(&quot;audioFillColor&quot;,event.target.selectedColor)" />
                </mx:FormItem>
                <mx:FormItem label="Display Settings" direction="horizontal">
                    <mx:ComboBox change="example.channel=event.target.selectedLabel" dataProvider="{new Array(&quot;mono&quot;,&quot;stereo&quot;,&quot;left&quot;,&quot;right&quot;)}"/>
                    <mx:ComboBox change="example.type=event.target.selectedLabel;bars.visible=(event.target.selectedLabel==&quot;bars&quot;?true:false)" dataProvider="{new Array(&quot;wave&quot;,&quot;line&quot;,&quot;bars&quot;)}" />
                    <mx:NumericStepper id="bars" minimum="1" maximum="256" visible="false" value="32" change="example.bars=event.target.value" />
                </mx:FormItem>
                <mx:FormItem label="Before Visualization" direction="horizontal">
                    <mx:ComboBox id="before" labelField="0" dataProvider="{effects}" />
                    <mx:Button label="add" click="example.addEventListener( &quot;beforeVisualization&quot;, effects[before.selectedIndex][1] )" />
                    <mx:Button label="remove" click="example.removeEventListener( &quot;beforeVisualization&quot;, effects[before.selectedIndex][1] )" />
                </mx:FormItem>
                <mx:FormItem label="After Visualization" direction="horizontal">
                    <mx:ComboBox id="after" labelField="0" dataProvider="{effects}" />
                    <mx:Button label="add" click="example.addEventListener( &quot;afterVisualization&quot;, effects[after.selectedIndex][1] )" />
                    <mx:Button label="remove" click="example.removeEventListener( &quot;afterVisualization&quot;, effects[after.selectedIndex][1] )" />
                </mx:FormItem>
            </mx:Form>
            
            <fx:Visualization id="example" type="wave" bars="32"  width="100%" height="50%">
                
            </fx:Visualization>
        </mx:VBox>
    </mx:Panel>
</mx:Application>