<?xml version="1.0" encoding="utf-8"?>
  <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" xmlns:fx="*" layout="absolute" initialize="initApp()">
          <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:actionscript_application_sound_com_fusiox_ui_Visualization id="example" type="wave" bars="32"  width="100%" height="50%">
                                  
                          </fx:actionscript_application_sound_com_fusiox_ui_Visualization>
                  </mx:VBox>
          </mx:Panel>
  </mx:Application>