Silverlight Organization Chart – Part 1 – Read XML file

I’m sorry I did not post the details of how to do the Silverlight organization chart as was expected.

I’ll not go in details of how to create a Silverlight application; you can see these details here.

In my organization chart I make option either to read the nodes from XML file for read them from a web service (reading the data from Active Directory), I’m here will just talk about the XML file.

Point 1: the XML file

My XML file looks like this:

<?xml version="1.0" encoding="utf-8" ?>

<Persons>

  <Person>

    <ID>1</ID>

    <Name>Mostafa El Mashad </Name>

    <Title>CEO</Title>

    <Department> </Department>

    <Extension>1111</Extension>

    <Email>mostafa.elmashad@domain.com</Email>

    <ManagerID></ManagerID>

  </Person>

  <Person>

    <ID>2</ID>

    <Name>Ahmed Sadek</Name>

    <Title>HR Manager</Title>

    <Department>HR</Department>

    <Extension>1200</Extension>

    <Email>Ahmed.sadek@mydomain.com</Email>

    <ManagerID>1</ManagerID>

  </Person>

  <Person>

    <ID>3</ID>

    <Name>Hanan Youssef</Name>

    <Title>Sales Manager</Title>

    <Department>Sales</Department>

    <Extension>1300</Extension>

    <Email>hanan.youssef@mydomain.com</Email>

    <ManagerID>1</ManagerID>

  </Person>

</Persons>

and you can add as much as person nodes as you want.

Where:
ID: Is the identity of this person
Name: The person name
Title: His job title
Department: The department he is working in
Extension: Phone extension
Email: his email address
ManagerID: The identity value used in his manager data

In our example:
Mostafa – the CEO – he has no manager, so the ManagerID is blank
Hanan and Ahmed are reporting to Mostafa, so the ManagerID equal 1, which is Mostafa’s ID

Note: this XML file will be deployed with the XAP file at the end.


Point 2: The Person class

I’ll need to make a class to represent the Person object, and while reading the data from the XML file I’ll put it in an list of Persons.

public List<Person> persons = new List<Person>();

Also I’ll need some extra data to be stored with each person, like:
Level : The person level, in our example, Mostafa #1, Ahmed and Hanan #2
SubNodes: How many person are reporting to the current, 2 are reporting to Mostafa
HiddenSubNodes: The same as the SubNodes in case the node is not collapsed.
NodeOrder: The order of this node between the same level under the same parent
MinChildWidth: The display minimum width allowed for the child nodes
X: The X coordinate of the node on the screen, the Y position is calculated from the node level
StartX: The parent X
Opened : is this node displayed or not
Collapsed: Is this node’s child are displayed or not


Point 3: Reading the XML file

In the page load of my Silverlight control, I’ll call the method that will read the XML file:

private void LoadXMLFile()

        {

            WebClient xmlClient = new WebClient();

            xmlClient.DownloadStringCompleted += new DownloadStringCompletedEventHandler(XMLFileLoaded);

            xmlClient.DownloadStringAsync(new Uri("OrgChart_Data.xml", UriKind.RelativeOrAbsolute));

        }

void XMLFileLoaded(object sender, DownloadStringCompletedEventArgs e)

        {

            if (e.Error == null)

            {

                Person firstNode = Person.GetPerson("OrgChartRootNode", "LINK Development", "", "", "", "", "");

                firstNode.MinChildWidth = totalWidth;

                persons.Add(firstNode);

 

                XElement lobjDocument = XElement.Parse(e.Result.ToString());

 

                var Result = from view1 in lobjDocument.Descendants("Person")

                             select new Person

                             {

                                 Name = (string)view1.Element("Name"),

                                 ID = (string)view1.Element("ID"),

                                 ManagerID = (string)view1.Element("ManagerID"),

                                 Title = (string)view1.Element("Title"),

                                 Department = (string)view1.Element("Department"),

                                 Extension = (string)view1.Element("Extension"),

                                 Email = (string)view1.Element("Email")

                             };

 

                Person[] nodes = Result.ToArray();

 

                for (int i = 0; i < nodes.Length; i++)

                {

                    if (string.IsNullOrEmpty(nodes[i].ManagerID))

                    {

                        nodes[i].ManagerID = "OrgChartRootNode";

                    }

                }

                persons.AddRange(nodes);

                Start();

            }

        }

Here in my control, if any node did not has a ManagerID value, I’ll consider it as a parent node just under the organization root element.

In the last line of code, you will see a call to a Start method, which will start calculating and building the organization chart nodes. And we will talk about the calculations in a separate post soon isA.