<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute"
        xmlns:containers="dda.containers.*"
        creationComplete="handleCreationComplete();" viewSourceURL="srcview/index.html">

    <mx:Script>
        <![CDATA[
            import dda.events.PanScrollingEvent;
            import com.yahoo.maps.api.core.location.LatLon;
            import mx.events.ResizeEvent; 
            
            import com.yahoo.maps.api.YahooMap; 
            import com.yahoo.maps.api.YahooMapEvent; 
            import com.yahoo.maps.api.core.location.Address; 
            import com.yahoo.maps.webservices.geocoder.GeocoderResult; 
            import com.yahoo.maps.webservices.geocoder.events.GeocoderEvent; 
            
            private var yahooMap:YahooMap; 
            private var address:Address;
            private var firstTime:Boolean = true;
            
            private function handleCreationComplete():void
            {
                // get your own free appid at http://developer.yahoo.com/wsregapp/
                var appid:String = Application.application.parameters.appid;
                
                yahooMap = new YahooMap();
                yahooMap.addEventListener(YahooMapEvent.MAP_INITIALIZE, handleMapInitialize);
                yahooMap.init(appid, mapContainer.width, mapContainer.height);                
                mapContainer.addChild(yahooMap);
                
                panScrollingCanvas.addEventListener(PanScrollingEvent.PAN_SCROLLING_CLICK, handlePanScrollingClick, false, 0, true);
                panScrollingCanvas.addEventListener(PanScrollingEvent.CONTROLS_VISIBLE_CHANGE, handleControlsVisibleChange, false, 0, true);                
            }
            
            private function handlePanScrollingClick(event:PanScrollingEvent):void
            {
                var point:Point = new Point((panScrollingCanvas.width/2 - event.localX), (panScrollingCanvas.height/2 - event.localY));
                var latlon:LatLon = yahooMap.getXYToLatLon(point);
                yahooMap.panToLatLon(latlon, 250);
            }

            /**
            * We handle the show/hide effects manually, as they can cancel eachother
            * when set through showEffect and hideEffect styles
            */            
            private function set zoomControlsVisible(value:Boolean):void
            {
                if (value)
                {
                    fadeOut.stop();
                    fadeIn.play([zoomBox]);
                }
                else
                {
                    fadeIn.stop();
                    fadeOut.play([zoomBox]);
                }
                zoomBox.visible = true; // stay true, to insure hide effect is displayed
            }

            private function handleControlsVisibleChange(event:PanScrollingEvent):void
            {
                if (firstTime)
                {
                    stage.addEventListener(Event.MOUSE_LEAVE, handleMouseLeave, false, 0, true);
                    firstTime = false;                
                }
                
                zoomControlsVisible = event.data as Boolean;
            }

            private function handleMouseLeave(event:Event):void
            {
                if (panScrollingCanvas && panScrollingCanvas.buttonsVisible)
                {
                    panScrollingCanvas.buttonsVisible = false;
                    zoomControlsVisible = false;
                }
            }
                        
            private function handleMapInitialize(event:YahooMapEvent):void  
            { 
                address = new Address("los angeles, ca"); 
                address.addEventListener(GeocoderEvent.GEOCODER_SUCCESS, handleGeocodeSuccess);
                address.geocode(); 
            } 
             
            private function handleGeocodeSuccess(event:GeocoderEvent):void  
            {
                loadingMessage.visible = false;
                var result:GeocoderResult = address.geocoderResultSet.firstResult; 
                yahooMap.zoomLevel = result.zoomLevel; 
                yahooMap.centerLatLon = result.latlon; 
            } 
            
            private function handlePlusClick():void
            {
                yahooMap.zoomLevel -= 1;
            }

            private function handleMinusClick():void
            {
                yahooMap.zoomLevel += 1;                
            }
        ]]>
    </mx:Script>

    <mx:Fade id="fadeIn" alphaFrom="0.0" alphaTo="1.0" duration="200"/>
    <mx:Fade id="fadeOut" alphaFrom="1.0" alphaTo="0.0" duration="200"/>
    <mx:DropShadowFilter id="shadow" blurX="5" blurY="5" alpha="0.3" distance="3"/>
    
    <mx:VBox verticalGap="0" horizontalCenter="0" verticalCenter="0" horizontalAlign="center">
        <mx:Label text="The PanScrollingCanvas" fontWeight="bold"/>
        <mx:Label text="move mouse over map to pan. click on map to reposition center."/>
        <mx:Canvas width="640" height="480">
            <containers:PanScrollingCanvas id="panScrollingCanvas" width="100%" height="100%" backgroundColor="#feefef" horizontalCenter="0" verticalCenter="0">
                <mx:UIComponent id="mapContainer" width="1600" height="1200"/>
            </containers:PanScrollingCanvas>
            <mx:Label id="loadingMessage" text="Loading..." horizontalCenter="0" verticalCenter="0"/>
            <mx:VBox id="zoomBox" verticalGap="0" width="100%" height="100%" horizontalAlign="center" verticalAlign="middle" visible="false" filters="{[shadow]}">
                <mx:Button id="plusButton" click="handlePlusClick();" icon="@Embed(source='/assets/assets.swf', symbol='Zoom_In')" cornerRadius="10"/>
                <mx:Button id="minusButton" click="handleMinusClick();" icon="@Embed(source='/assets/assets.swf', symbol='Zoom_Out')" cornerRadius="10"/>
            </mx:VBox>
        </mx:Canvas>
    </mx:VBox>
</mx:Application>