LiveMapsWidget.mxml

<?xml version="1.0" encoding="utf-8"?>
<!--
////////////////////////////////////////////////////////////////////////////////
//
// Copyright © 2008 ESRI
//
// All rights reserved under the copyright laws of the United States.
// You may freely redistribute and use this software, with or
// without modification, provided you include the original copyright
// and use restrictions.  See use restrictions in the file:
// <install location>/FlexViewer/License.txt
//
////////////////////////////////////////////////////////////////////////////////
-->
<BaseWidget	xmlns				="com.esri.solutions.flexviewer.*" 
			xmlns:mx			="http://www.adobe.com/2006/mxml" 
			xmlns:toccomp		="com.esri.solutions.flexviewer.components.toc.*" 
			xmlns:widgets		="com.esri.solutions.flexviewer.widgets.*"
			x					="600" 
			y					="300" 
			widgetConfigLoaded	="init()">
	
	
	<mx:Script>
		<![CDATA[
			import com.esri.solutions.flexviewer.components.toc.tocClasses.TocMapLayerItem;
			import com.esri.solutions.flexviewer.components.toc.tocClasses.TocItem;
			import mx.managers.DragManager;
			import mx.events.DragEvent;
		
			import com.esri.ags.layers.GraphicsLayer;
			import com.esri.ags.layers.Layer;
			import com.esri.ags.Map;
			import com.esri.solutions.flexviewer.ConfigData;
			import com.esri.solutions.flexviewer.utils.WidgetEffects;
			import mx.controls.Alert;
			import mx.collections.*;
			
			//labels
			[Bindable]
			private var visibilityLabel:String;
			
			[Bindable]
			private var transparencyLabel:String;
			
			private const ICON_URL:String = "com/esri/solutions/flexviewer/assets/images/icons/";
						
			private function init():void
			{
				if (configXML)
				{
					//labels
					visibilityLabel = configXML.labels.visibilitylabel || "Layer Visibility";
					transparencyLabel = configXML.labels.transparencylabel || "Layer Transparency";
				}
				toc.map = map;
				toc.excludeLayers = getBasemaps();
				toc.excludeGraphicsLayers = true;
				layerRepeater.dataProvider = getLayers();
				wTemplate.addTitlebarButton(ICON_URL + "i_options.png", transparencyLabel, showStateOptions);
				wTemplate.addTitlebarButton(ICON_URL + "i_folder.png", visibilityLabel, showStateVisibility);
			}			
			
			private function getBasemaps():ArrayCollection
			{
				var baseMaps:ArrayCollection = new ArrayCollection();
				for (var i:Number = 0; i < configData.configBasemaps.length; i++)
		        {
		        	baseMaps.addItem(configData.configBasemaps[i].label);
		        }
				return baseMaps;
			}			
			
			private function getLayers():Array
			{
				var basemapCount:Number = configData.configBasemaps.length;
				var layerArray:Array = [];
				for (var i:Number = map.layerIds.length -1; i >= basemapCount; i--)
				{
					var layer:Layer = map.getLayer(map.layerIds[i]);
					if (!(layer is GraphicsLayer))
						layerArray.push(layer);
				}
				return layerArray;
			}
						
			private function showStateVisibility(event:MouseEvent):void
			{
				WidgetEffects.flipWidget(this, viewStack, "selectedIndex", 0, 400);
			}			
			
			private function showStateOptions(event:MouseEvent):void
			{
				WidgetEffects.flipWidget(this, viewStack, "selectedIndex", 1, 400);
			}
			
			private function onDragStart(event:DragEvent):void{
				//Close the dragged item
				_draggedLayer=toc.selectedItem  as TocMapLayerItem;
				var openItems:Array = toc.openItems as Array;
				for each(var o:Object in openItems){
					toc.expandItem(o,false);
				}
				//setInfoText(resourceManager.getString("resource","toc-layer-reorder"));
			}
			private function onDragComplete(event:DragEvent):void{
				var arItems:Array;
								
				if (event.dragSource.hasFormat("treeItems")){
					handleTreeDrag(event);
				}
				toc.selectedItem = _draggedLayer;
				_draggedLayer=null;
							}
			
			private function handleTreeDrag(event:DragEvent):void{
				if (event.action!="move")
					return;
				var _roots:ArrayCollection = toc.dataProvider as ArrayCollection;
				//Unclear why I have to do this....but I need the selectedIndex later
				toc.selectedItem = _draggedLayer;
				 var dropIndex:uint=toc.calculateDropIndex(event);
				 // I've seen thie calculated drop index be > than the number of 
				 // services.  This usually happens when a service node is expanded,
				 // but let's just make sure.  We'll put it at the bottom of the list 
				 // in this cse.
				 if (dropIndex>_roots.length)
				 	dropIndex=_roots.length;
				 
				var ind:int=0;
				// Set in onDragStart....if it's null, get outta dogdge
				if (_draggedLayer==null)
					return;
				var delta:int = _roots.length-dropIndex;
				
				ind = delta + 1;//We have two base layers....HACK...THIS IS BAD, MAKE IT BETTER
				
				// If the selected item is dragged down, then the index needs to account for that
				if (toc.selectedIndex>dropIndex)
					ind=ind-1;
 				
				toc.map.reorderLayer(_draggedLayer.layer.id,ind);
				
				
			}
			
			private var _draggedLayer:TocMapLayerItem;
			private function onDragEnter(event:DragEvent):void{
				DragManager.acceptDragDrop(event.currentTarget as TOC);
				if ((event.currentTarget as TOC)==null)
				{
					DragManager.showFeedback(DragManager.NONE);
					event.preventDefault();
				}
				
			}
			
						
		]]>
	</mx:Script>
	
	<WidgetTemplate id="wTemplate">
		<mx:ViewStack id="viewStack" width="100%" height="100%" creationPolicy="all">
			<mx:VBox width="100%" height="100%" horizontalScrollPolicy="off" verticalScrollPolicy="off">
				<mx:Label text="{visibilityLabel}" styleName="WidgetText" width="100%"/>
				<toccomp:TOC id="toc" width="100%" height="100%"
					dragEnabled					="true"
					dragEnter					="onDragEnter(event)"
					dropEnabled					="true"
				 	 dragComplete				="handleTreeDrag(event)"
				 	dragStart					="onDragStart(event)"
				 	 
					/>
			</mx:VBox>
			<mx:VBox width="100%" height="100%">
				<mx:Label text="{transparencyLabel}" styleName="WidgetText" width="100%"/>
				<mx:Repeater id="layerRepeater">
						<widgets:LayerAlpha layer="{layerRepeater.currentItem}"/>
				</mx:Repeater>
			</mx:VBox>
		</mx:ViewStack>
	</WidgetTemplate>
	
</BaseWidget>