<?xml version="1.0" encoding="utf-8"?>
<!--
    Copyright (c) 2008 Yahoo! Inc.  All rights reserved.  
    The copyrights embodied in the content of this file are licensed under the BSD (revised) open source license
-->
<mx:Application 
    xmlns:mx="http://www.adobe.com/2006/mxml" 
    xmlns:flexlib="flexlib.controls.*" 
    layout="absolute" 
    backgroundColor="#FFFFFF" 
    creationComplete="handleCreationComplete(event)" 
    viewSourceURL="srcview/index.html">
    
    <mx:HDividedBox left="0" right="0" top="0" bottom="0" dividerColor="#FFFFFF" dividerThickness="5">
        <mx:Canvas id="markerPanel" width="275" height="100%">
        
            <!-- FlexLib components: http://code.google.com/p/flexlib/ -->
            <flexlib:PromptingTextInput id="latInput" prompt="Latitude:" left="10" top="10" enter="addMarker()" width="125"/>
            <flexlib:PromptingTextInput id="lonInput" prompt="Longitude:" top="10" right="10" enter="addMarker()" width="125"/>
            <flexlib:PromptingTextInput id="addrInput" prompt="Address:" left="10" top="40" right="10" enter="addMarker()"/>
            
            <mx:RadioButtonGroup id="markerTypes"/>
            <mx:RadioButton id="simpMarkerButton" label="Simple Marker" groupName="markerTypes" selected="true" top="77" left="10"/>
            <mx:RadioButton id="imageMarkerButton" label="Image Marker" groupName="markerTypes" selected="false" left="123" top="77"/>
            
            <mx:Button label="Add Marker" click="addMarker()" right="10" width="138" top="107"/>
        </mx:Canvas>
        
        <!-- YahooMap container -->
        <mx:UIComponent id="mapContainer" width="100%" height="100%"/>
    </mx:HDividedBox>
    
    <mx:Script>
        <![CDATA[
            import com.yahoo.maps.markers.SimpleCustomMarker;
            import com.yahoo.maps.markers.CustomImageMarker;

            import com.yahoo.maps.api.markers.Marker;
            import com.yahoo.maps.api.core.location.Address;
            import com.yahoo.maps.api.core.location.LatLon;
            import com.yahoo.maps.api.markers.SimpleMarker;
            import com.yahoo.maps.api.YahooMapEvent;
            import com.yahoo.maps.api.YahooMap;
            import mx.events.ResizeEvent;
            
            private var _yahooMap:YahooMap;
            
            private function handleCreationComplete(event:Event):void
            {
                // this examples uses an application id passed into the app via FlashVars.
                // Get your own from the Yahoo! Developer Network @ http://developer.yahoo.com/wsregapp/
                var appid:String = Application.application.parameters.appid;
                
                // create YahooMap instance and listen for map initialize event
                _yahooMap = new YahooMap(); 
                _yahooMap.addEventListener(YahooMapEvent.MAP_INITIALIZE, handleMapInitialize); 
                _yahooMap.init(appid,mapContainer.width,mapContainer.height);
                 
                // add to mapContainer UIComponent
                mapContainer.addChild(_yahooMap); 
                 
                // add panning control, zoom and type widgets to the map.
                _yahooMap.addPanControl(); 
                _yahooMap.addZoomWidget(); 
                _yahooMap.addTypeWidget();
            }
            
            private function handleMapInitialize(event:YahooMapEvent):void  
            {
                // listen for UIComponent resize event
                mapContainer.addEventListener(ResizeEvent.RESIZE, handleContainerResize);
                
                // set zoom level and center LatLon
                _yahooMap.zoomLevel = 14;
                _yahooMap.centerLatLon = new LatLon(37,-100);
            }
            
            private function handleContainerResize(event:ResizeEvent):void
            { 
                // resize the map based on the containers height and width.
                _yahooMap.setSize(mapContainer.width, mapContainer.height);
            }
            
            private function addMarker():void
            {
                var marker:Marker;
                
                // create the marker based on the users selected marker class.
                if(simpMarkerButton.selected==true) 
                {
                    marker = new SimpleCustomMarker();
                }
                else if(imageMarkerButton.selected==true)
                {
                    marker = new CustomImageMarker("http://l.yimg.com/www.flickr.com/images/dot_splat.png");
                }
                
                // if lat/lon input
                if(latInput.text != "" && lonInput.text != "")
                {
                    // set markers latlon
                    marker.latlon = new LatLon( Number(latInput.text), Number(lonInput.text));
                    _yahooMap.markerManager.addMarker(marker);
                }
                // if address input
                else if(addrInput.text != "")
                {
                    // set markers address
                    marker.address = new Address(addrInput.text);
                    _yahooMap.markerManager.addMarker(marker);
                }
                 
            }
            
        ]]>
    </mx:Script>
</mx:Application>