<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" creationComplete="init()"
    layout="absolute" width="500" height="500"  
    backgroundColor="#000000" themeColor="#0066FF" 
    frameRate="60" viewSourceURL="srcview/index.html">
    
    <mx:Script>
        <![CDATA[
            
            import caurina.transitions.Tweener;
            
            import flash.display.BitmapData;
            import flash.display.Bitmap;
            import flash.geom.ColorTransform;
            import flash.media.Sound;
            import flash.media.SoundChannel;
            import flash.media.SoundMixer;
            import flash.net.URLRequest;
            import flash.events.Event;
            import flash.utils.ByteArray;
            
            private var sound_factory                    :Sound;
            
            private var song                            :SoundChannel;
            
            private var gfx                                :BitmapData;
            private var clone                            :BitmapData;
            
            private var dest                            :Bitmap;
            private var dest_effects                    :Bitmap;
            
            private var ba                                :ByteArray = new ByteArray();
            private var g                                :Graphics;
            
            private var m                                :Matrix;
            
            [Bindable]
            private var liste_effects                    :Array;
            
            [Bindable]
            private var val_loading                        :String;
            
            private var url_mp3                            :String = "assets/05 - Let's Buy Happiness.mp3";
            
            private var pos_x                            :Number;
            private var pos_y                            :Number;
            private var ratio                            :Number;
            private var effect_choosed                    :Number;
            
            private function init():void
            {
                liste_effects = new Array();
                liste_effects.push({data:0, label:"classique", souris:false}, 
                                    {data:1, label:"cercles multicolores", souris:true}, 
                                    {data:2, label:"diagonales pas si parallèles", souris:false},  
                                    {data:3, label:"symétrie", souris:true}
                );
                
                effects_cb.selectedIndex = 0;
                effect_choosed = 0;
                
                val_souris.text = "non actif";
                
                play_btn.enabled = false;
                stop_btn.enabled = true;
            }
            
            private function active_demo(e:MouseEvent):void
            {
                init_sound();
                voir_demo_btn.visible = false;
            }
            
            private function init_sound():void
            {
                gfx = new BitmapData(480, 380, false, 0x000000);
                clone = gfx.clone();
                
                dest = new Bitmap(gfx);
                canvas_spectrum.rawChildren.addChild(dest);
                
                var req:URLRequest = new URLRequest(url_mp3);
                sound_factory = new Sound();
                sound_factory.addEventListener(ProgressEvent.PROGRESS, progress_handler);
                sound_factory.addEventListener(Event.COMPLETE, complete_handler);
                sound_factory.load(req);
            }
            
            private function progress_handler(e:ProgressEvent):void
            {
                var loaded:Number = e.bytesLoaded;
                var total:Number = e.bytesTotal;
                var percent:Number = 100 - (Math.floor((loaded / total) * 100));
                loading_txt.text = percent + " %";
                
                if(percent <= 0)
                {
                    loading_txt.text = "";
                    Tweener.addTween(loading, {alpha:0, time:1, transition:"easeOutSine", onComplete:play_mp3});
                }
            }
            
            private function complete_handler(e:Event):void
            {
                sound_factory.removeEventListener(ProgressEvent.PROGRESS, progress_handler);
                sound_factory.removeEventListener(Event.COMPLETE, complete_handler);
            }
            
            private function play_mp3():void
            {
                loading.visible = false;
                
                song = sound_factory.play();
                dest.addEventListener(Event.ENTER_FRAME, create_spectrum);
            }
            
            private function change_effect(e:Event):void
            {
                effect_choosed = e.currentTarget.selectedIndex;
                if(liste_effects[effect_choosed]["souris"] == true)
                    val_souris.text = "actif";
                else
                    val_souris.text = "non actif";
            }
            
            private function create_spectrum(e:Event):void
            {
                SoundMixer.computeSpectrum(ba, true, 0);
                
                var s:Sprite = new Sprite();
                s.cacheAsBitmap = true;
                g = s.graphics;
                gfx.fillRect(gfx.rect, 0x000000);
                
                for(var i:int = 0; i < 256; i++)
                {
                    switch(effect_choosed)
                    {
                        case 0:
                            effet_lignes(i);
                        break;
                        case 1:
                            effet_cercles(i);
                        break;
                        case 2:
                            effet_diagonales(i);
                        break;
                        case 3:
                            effet_miroir(i);
                        break;
                    }
                }
                
                clone.draw(s);
                gfx.copyPixels(clone, clone.rect, new Point());
                clone.applyFilter(gfx, gfx.rect, new Point(), new BlurFilter(4, 4, 3));
                var cm:ColorTransform = new ColorTransform(1, 1, 1, 1, 0, 51, 255);
                gfx.draw(s, null, cm);
            }
            
            private function effet_lignes(i:int):void
            {
                var val:Number = ba.readFloat();
                var pos_x:Number = (i * 3) + 16;
                var pos_y:Number = 190;
                var ratio:Number = val * 300;
                
                g.lineStyle(2, 0x0066FF, 1, true, LineScaleMode.NORMAL, CapsStyle.ROUND, JointStyle.ROUND);
                g.moveTo(pos_x, pos_y - (ratio / 2));
                g.lineTo(pos_x, pos_y + (ratio / 2));
                g.endFill();
            }
            
            private function effet_cercles(i:int):void
            {
                var val:Number = ba.readFloat();
                var pos_x_souris:Number = mouseX - canvas_spectrum.x;
                var pos_y_souris:Number = mouseY - canvas_spectrum.y;
                var coeff_x:Number = pos_x_souris + (Math.random() * 200);
                var coeff_y:Number = pos_y_souris + (Math.random() * 200);
                
                switch(i % 4)
                {
                    case 0:
                        pos_x = -(val * coeff_x);
                        pos_y = -(val * (Math.random() * 250));
                    break;
                    case 1:
                        pos_x = val * (Math.random() * 250);
                        pos_y = -(val * coeff_y);
                    break;
                    case 2:
                        pos_x = val * coeff_x;
                        pos_y = val * (Math.random() * 250);
                    break;
                    case 3:
                        pos_x = -(val * (Math.random() * 250));
                        pos_y = val * coeff_y;
                    break;
                }
                
                g.lineStyle(2, 0xFFFFFF * Math.random(), 1, true, LineScaleMode.NONE, CapsStyle.ROUND, JointStyle.ROUND);
                g.drawCircle(pos_x_souris + pos_x, pos_y_souris + pos_y, (Math.random() * 50));
                g.endFill();
            }
            
            private function effet_diagonales(i:int):void
            {
                var val:Number = ba.readFloat();
                  var pos_x:Number = (i * 3);
                var pos_y:Number = (i * 10);
                var ratio:Number = val * Math.random() * 150;
                
                g.lineStyle(2, 0x0066FF, 1, true, LineScaleMode.NORMAL, CapsStyle.ROUND, JointStyle.ROUND);
                g.moveTo(-pos_x, 190 - pos_y);
                g.lineTo(pos_y, 190 + ratio);
                g.endFill();
            }
            
            private function effet_miroir(i:int):void
            {
                var val:Number = ba.readFloat();
                  var pos_x:Number = (i * 3) + 16;
                var pos_y:Number = (i * 10) + 40;
                var ratio:Number = val * 150;
                
                g.lineStyle(2, 0x0066FF, 1, true, LineScaleMode.NORMAL, CapsStyle.ROUND, JointStyle.ROUND);
                g.moveTo(mouseX - pos_x, 190 - ratio);
                g.lineTo(240 + pos_x, 190 + ratio);
                g.endFill();
            }
            
            private function play_handle(e:MouseEvent):void
            {
                song = sound_factory.play();
                play_btn.enabled = false;
                stop_btn.enabled = true;
            }
            
            private function stop_handle(e:MouseEvent):void
            {
                song.stop();
                play_btn.enabled = true;
                stop_btn.enabled = false;
            }
            
        ]]>
    </mx:Script>
    
    <mx:Style source="main.css"/>
    
    <mx:Canvas id="base" width="100%" height="100%" backgroundColor="0x000000" backgroundAlpha="1">
        <mx:Image id="logo" x="10" y="10" source="@Embed('assets/logo_blanc.png')"/>
        <mx:Label x="98" y="12" text="Changer d'effets visuels" color="0xFFFFFF"/>
        <mx:ComboBox id="effects_cb" x="255" y="10" dataProvider="{liste_effects}" change="change_effect(event)"/>
        <mx:Label x="98" y="42" text="Mouvement avec la souris" color="0xFFFFFF"/>
        <mx:Label id="val_souris" y="42" x="255" fontWeight="bold" color="0x0066FF" width="70"/>
        <mx:Button id="play_btn" x="98" y="68" label="PLAY" click="play_handle(event)"/>
        <mx:Button id="stop_btn" x="163" y="68" label="STOP" click="stop_handle(event)"/>
        <mx:Canvas id="canvas_spectrum" x="10" y="110" width="480" height="380"/>
    </mx:Canvas>
    
    <mx:Canvas id="loading" width="100%" height="100%" backgroundColor="0x000000" backgroundAlpha="1">
        <mx:Image x="210" y="110" source="@Embed('assets/logo_blanc.png')"/>
        <mx:Text id="loading_txt" x="220" y="208" width="50" textAlign="center" fontWeight="bold" color="#0066FF"/>
        <mx:Button id="voir_demo_btn" x="160.5" y="300" label="VOIR LA DÉMONSTRATION" click="active_demo(event)"/>
    </mx:Canvas>
    
</mx:Application>