RE: [flexcoders] Tree and array data

[Alex Harui]

Will there ever by any leaves?  If not, just replace the leaf icon with the 
branch icon

From: flexcoders@yahoogroups.com [mailto:flexcod...@yahoogroups.com] On Behalf 
Of Dan Vega
Sent: Thursday, December 18, 2008 8:57 AM
To: flexcoders@yahoogroups.com
Subject: [flexcoders] Tree and array data


I am in the middle of building a file explorer and I have come to a stumbling 
block. I have a simple screen that has a tree on the left and a grid on the 
right. My ColdFusion components return an array and I end up with something 
that looks like this. So far it works great but all of my directories are 
showing up as leafs.

When I was messing around with the xml side I was able to provide an attribute 
called isBranch. This gave the representation that there were sub directories 
to this folder. The haschildren variable is letting me know if this directory 
has any child dirs. How can I represent to the user that this is a branch. 
After that I a pretty sure I can work through making another call to the server 
and updating my array.

**** Thanks for the help in advance!

(Array)#0
  [0] (Object)#1
    HASCHILDREN = "true"
    LASTMODIFIED = 1222802792572
    NAME = "Avaya_Support"
    PATH = "C:\Avaya_Support"
  [1] (Object)#2
    HASCHILDREN = "true"
    LASTMODIFIED = 1190926722375
    NAME = "dell"
    PATH = "C:\dell"


<?xml version="1.0" encoding="utf-8"?>
<mx:Application
    xmlns:mx="http://www.adobe.com/2006/mxml";
    layout="vertical" verticalScrollPolicy="off" horizontalScrollPolicy="off"
    creationComplete="init();">

    <mx:Script>
        <![CDATA[
            // imports
            import flash.events.Event;

            import mx.collections.ArrayCollection;
            import mx.rpc.events.ResultEvent;
            import mx.utils.ObjectUtil;

            public static var ROOT:String  = "C:\\";

            [Bindable] private var _directories:Array = new Array();
            [Bindable] private var _files:Array = new Array();

            // init
            private function init():void {
                // grab the top level directories
                FileManager.getDirectories(ROOT);
                // set the status bar
                setStatusText(ROOT);
            }

            private function listDirectories(event:ResultEvent):void {
                _directories = event.result as Array;
            }
            private function listFiles(event:ResultEvent):void {
                _files = event.result as Array;
            }
            private function onItemChange(event:Event):void {
                var currentPath:String = event.currentTarget.selectedItem.PATH;
                FileManager.getFiles(currentPath);
                setStatusText(currentPath);
            }
            private function setStatusText(msg:String):void {
                txtStatus.text = "Current Location: " + msg;
            }
        ]]>
    </mx:Script>

    <mx:RemoteObject id="FileManager" destination="ColdFusion" 
source="FFManager.src.cfc.FileManager" showBusyCursor="true">
        <mx:method name="getDirectories" result="listDirectories(event)"/>
        <mx:method name="getFiles" result="listFiles(event)"/>
    </mx:RemoteObject>

    <mx:Panel width="100%" height="100%" title="Extranet File Manager">

        <mx:HBox width="100%" height="20">
            <mx:Spacer width="100%"/>
            <mx:Label text="List"/>
            <mx:Label text="Thumbnails"/>
        </mx:HBox>

        <mx:HDividedBox width="100%" height="100%" horizontalScrollPolicy="off" 
verticalScrollPolicy="off">

            <mx:Tree id="tree" width="30%" height="100%" 
dataProvider="{_directories}" labelField="NAME"
                     showRoot="true" change="onItemChange(event)"/>

            <mx:DataGrid id="filelist" width="70%" height="100%" 
dataProvider="{_files}" allowMultipleSelection="true"
                         dragEnabled="true"/>

        </mx:HDividedBox>

        <mx:ControlBar>
            <mx:Label id="txtStatus" text="status bar"/>
        </mx:ControlBar>

    </mx:Panel>


</mx:Application>