map.reorder(Layer, Index) does not reorder properly in TOC

[DanielSmith]

Hello,

I have developed little imagery slider widget for the SFV that allows users to select a band combination with a radio button then slide a HSlider to one of 4 dates listed. The problem i am having is that when i call map.reorder(tiledlayer2.id,1) the map ends up in the proper location on the map (right above the base layer) but the in the TOC it is always third from the bottom... 
[LEFT][ATTACH=CONFIG]2829[/ATTACH][ATTACH=CONFIG]2830[/ATTACH]
[/LEFT]

Any help is greatly appreciated.

[Anonymous User]

Original User: D.E.Smith99

Beginning of week Bump... Any thoughts???

[SarthakDatt]

Hey Daniel,

Looks like the bug is in the TOC component(TOC.as) on how it reacts to map.reorder(). The problem is  the LayerListWidget/TOC deals with just the "operational layers", while the reorder takes into account all the layers on the map causing the mismatch in the order.

Try replacing the onLayerReorder() in TOC.as with:

private function onLayerReorder(event:MapEvent):void
{
        var layer:Layer = event.layer;
        var index:int = event.index;
        
        var i:int;
        var currentTOCIndex:int;
        var currentItem:Object;
        if (index <= (map.layerIds.length - _tocRoots.length)) // move this item to the bottom of toc
        {   
            // index of item to move
            currentTOCIndex = getCurrentTOCIndex();
            // item to move
            currentItem = _tocRoots.getItemAt(currentTOCIndex);
                    
            for (i = currentTOCIndex; i < _tocRoots.length; i++)
            {   
                if(i == _tocRoots.length - 1)
                {
                    _tocRoots.setItemAt(currentItem, _tocRoots.length - 1);
                }
                else
                {
                    _tocRoots.setItemAt(_tocRoots.getItemAt(i+1), i);
                }
            }  
        }
        else if ((map.layerIds.length - _tocRoots.length) < index < map.layerIds.length)
        {   
            // index of item to move
            currentTOCIndex = getCurrentTOCIndex();
            // item to move
            currentItem = _tocRoots.getItemAt(currentTOCIndex);
                                    
            var newTOCIndex:Number = map.layerIds.length - index - 1;
            if (newTOCIndex < currentTOCIndex)
            {
                for (i = currentTOCIndex; newTOCIndex <= i; i--)
                {
                    if(i == newTOCIndex)
                    {
                        _tocRoots.setItemAt(currentItem, newTOCIndex);
                    }
                    else
                    {
                        _tocRoots.setItemAt(_tocRoots.getItemAt(i-1), i);
                    }
                }
            }
            else
            {
                for (i = currentTOCIndex; i <= newTOCIndex; i++)
                {
                    if(i == newTOCIndex)
                    {
                        _tocRoots.setItemAt(currentItem, newTOCIndex);
                    }
                    else
                    {
                        _tocRoots.setItemAt(_tocRoots.getItemAt(i+1), i);
                    }
                }
            }
        }
        
        function getCurrentTOCIndex():int
        {   
            var result:int;
            for (i = 0; i < _tocRoots.length; i++)
            {
                if (_tocRoots.getItemAt(i) is TocMapLayerItem && TocMapLayerItem(_tocRoots.getItemAt(i)).layer === layer)
                {   
                    result = i;
                    break;
                }
            } 
            return result;
        }
 }

Hope that fixes the issue.

[Anonymous User]

Original User: D.E.Smith99

Sarthak,

Thank you so much. The augmented code for TOC.as you provided worked perfectly to reorder the added tiled service to the bottom of the TOC. You folks on the Flex Team rock!! Is his bug fixed in the newest release that is coupled with ArcGIS 10?


Daniel.

[SarthakDatt]

No, not the current release. Will put this fix in the next version.

[Anonymous User]

Original User: JohnElias

Is there a similiar solution using the javascript api?

[eddiequinlan]

I'm not sure if this is a better solution, but I've taken parts of previously mentioned code and adjusted it as below.  It seems a bit simpler and seems to work 85% of the time.  What i mean by that, is it will properly drag and drop the layer in the correct position in the TOC list and then draw 85% of the time correctly on the map.  The other 15% of the time it doesn't seem to be drawing the map in the correct draw order.  However, if you move the selected layer again it seems to then work correctly.

Maybe someone can expand on that and let me know what's happening.

code here:

private function DragStart(event:DragEvent):void
{ 
var openItems:Array = this.openItems as Array;
  for each(var o:Object in openItems)
  {
   this.expandItem(o,false);
  }
}

private function DragEnter(event:DragEvent):void
{
   _tocRoots = this.dataProvider as ArrayCollection;
  DragManager.acceptDragDrop(event.currentTarget as TOC);
  if ((event.currentTarget as TOC)==null) 
  { 
   DragManager.showFeedback(DragManager.NONE); 
   event.preventDefault(); 
  }   
  _draggedLayer = this.selectedItem as TocMapLayerItem;
}

[eddiequinlan]

I'm reposting the code from my last thread.......  something happened when trying to insert it into the thread

private function DragStart(event:DragEvent):void
{ 
var openItems:Array = this.openItems as Array;
for each(var o:Object in openItems)
{
  this.expandItem(o,false);
}
}

private function DragEnter(event:DragEvent):void
{
  _tocRoots = this.dataProvider as ArrayCollection;
DragManager.acceptDragDrop(event.currentTarget as TOC);
if ((event.currentTarget as TOC)==null) 
{ 
  DragManager.showFeedback(DragManager.NONE); 
  event.preventDefault(); 
}   
_draggedLayer = this.selectedItem as TocMapLayerItem;
}

private function DragFinished(event:DragEvent):void
{
if (event.action!="move") 
  return;
if (_draggedLayer==null) 
  return;
this.selectedItem = _draggedLayer.layer;

  newTOCindex = getMoveToTOCindex();
var maxLayerint:int = _tocRoots.length - 1; // number of layers displayed
// gives the inverse ordered number since the list and map draw order are reversed......
 
var drawmapOrder:int = Math.abs(newTOCindex - maxLayerint);

function getMoveToTOCindex():int
{  
  var result:int;
  var i:int;
  for (i = 0; i < _tocRoots.length; i++)
  {
   if (_tocRoots.getItemAt(i) is TocMapLayerItem &&
   TocMapLayerItem(_tocRoots.getItemAt(i)).layer === _draggedLayer.layer)
  {  
  result = i;
  break;
  }
  }
  return result;
} 
this.map.reorderLayer(_draggedLayer.layer.id, drawmapOrder);
}

private function onLayerReorder( event:MapEvent ):void
{
var layer:Layer = event.layer;  //current layer being moved
 
for (var i:int = 0; i < _tocRoots.length; i++)
{
  var item:Object = _tocRoots;
  if (item is TocMapLayerItem && TocMapLayerItem(item).layer === layer)
   {
   _tocRoots.removeItemAt(i);
   _tocRoots.addItemAt(item, newTOCindex);   
   break;
   }
}
layer.refresh();
}

Good Luck and Hope to hear some suggestions,

Eddie