package be.sanatorium.MapMarker{
    import com.greensock.TweenLite;
    import com.greensock.easing.Elastic;
    import com.greensock.events.LoaderEvent;
    import com.greensock.loading.ImageLoader;
    import com.greensock.plugins.ColorTransformPlugin;
    import com.greensock.plugins.TweenPlugin;

    import flash.display.MovieClip;
    import flash.events.MouseEvent;
    import flash.geom.ColorTransform;

    public class Thumbnail extends MovieClip{

        public var thumbURL:String;     // URL naar de thumbnail afbeelding
        public var loader:ImageLoader   // Loader voor thumbnail te laden
        public var active:Boolean;      // Selector voor aan te duiden of de thumbnail moet toegevoegd worden aan de marker

        public function Thumbnail(thumb:String){
            super();
            this.thumbURL = thumb;
            this.active = false;
            this.loader = new ImageLoader(thumbURL, {width:100, height:100, scaleMode:"proportionalOutside", crop:true, onError:thumbLoadError});

            this.addEventListener(MouseEvent.MOUSE_OVER, thumbOverEvent);
            this.addEventListener(MouseEvent.MOUSE_OUT, thumbOutEvent);
            this.addEventListener(MouseEvent.CLICK, thumbClickEvent);
        }

        // °°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°° //
        //      Error handler van de thumbnail loader               //
        // °°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°° //
        private function thumbLoadError(event:LoaderEvent):void {
            trace("error loading thumbnails: " + event.target + ": " + event.text);
        }

        // °°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°° //
        //      Mouse Over: Thumbnail                                   //
        // °°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°° //
        private function thumbOverEvent(event:MouseEvent):void{
            TweenLite.to(this,0.3,{alpha:1});
            TweenLite.to(this,0.3,{scaleX:1.025, scaleY:1.025});
        }

        // °°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°° //
        //      Mouse Out: Thumbnail                                    //
        // °°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°° //
        private function thumbOutEvent(event:MouseEvent):void{
            TweenLite.to(this,0.3,{alpha:0.7});
            TweenLite.to(this,0.3,{scaleX:1, scaleY:1});
        }

        // °°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°° //
        //      Mouse Click: Thumbnail selecteren                       //
        // °°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°°° //
        private function thumbClickEvent(event:MouseEvent):void{
            TweenPlugin.activate([ColorTransformPlugin]);
            TweenLite.to(this, 0.75, {ColorTransform:{tint:0xFFFFFF, tintAmount:0.5}, ease:Elastic.easeOut});

            this.active = true;
        }

    }
}