Simplifying the Display of Information

Information displayed in lists and tables can often be difficult to process. Humans are more comfortable with visual or summarized information that scans easily. Flash is very good at taking complicated information and displaying it in a simplified manner. It can alter the visual appearance by reducing the amount of information that displays. Flash can also add sorting, animation, or other kinds of visual cues to the data.

Displaying content from Office 2003 for PCs

Microsoft Office 2003 is a very popular PC software suite for business and personal users alike. At the time of writing, the latest version of Office for Macintosh users is Office 2004. The Mac version offers limited XML functionality only within Excel, so the example that follows isnt applicable to Macintosh users.

Organizations frequently store complicated tables of information in Excel spreadsheets. If the information is stored in these software packages, how can you make selected parts available to your clients ? You may need to simplify a complex Excel structure into something more manageable. You might also have to restrict access to the full worksheet for commercial reasons.

One of my clients, Dura-lite, faced this problem. Dura-lite works with heat transfer products and maintains a complex set of related part numbers within an Excel workbook. The company uses Excel for complicated lookups between two different sets of numbering systems.

Dura-lite needed to make the lookup available to their clients. The existing structure was complicated and contained confidential information so they couldnt just send out their Excel workbook. The clients would have found it difficult to understand and use the content.

Dura-lite also wanted to place this information on their website and on a CD-ROM catalog that could be run offline. However, they felt most comfortable maintaining the data in their Excel workbook. They didnt want to re-create the data in a database and wanted to use the same content for both the website and CD-ROM.

I used Flash to create a catalog for the Excel information. The content for the catalog comes from the Excel workbook via an XML document. Dura-lite updates the workbook and from time to time saves the information from Excel in XML format. The catalog is available on the Dura-lite website in a password-protected area. They also distribute it on a CD-ROM.

The structure of the Excel workbook they use is relatively complex. It contains seven worksheets, each corresponding to a manufacturer. Each worksheet contains information about a model and engine with corresponding part numbers. An additional sheet provides a cross-lookup between part numbers.

Figure 1-5 shows the structure of the workbook. For commercial reasons, Ive removed the data, but imagine the structure populated with long part numbers. It would be very difficult to read!

Figure 1-5: The Excel workbook structure for Dura-lite parts

Figure 1-6 shows the same content displayed in the Flash catalog.

Figure 1-6: The Flash catalog for Dura-lite parts

There are two ways to use the catalog. If the user knows the original equipment manufacturer (OEM) part number, they enter it and click Search . Otherwise, they select a manufacturer from a drop-down list. This populates the Model drop-down list with all related models. The Engine drop-down list is then populated. The user can optionally choose an engine before they click Search .

The results display in a list below the search form. The text is selectable so that clients can copy and paste the part numbers. You cant see this example on the Web as it is in a password-protected area.

The Flash catalog is much easier to use than the Excel workbook. It simplifies the information available to the user and offers a simple but powerful means of searching for data. An XML document provides the link between Excel and Flash. Dura-lite can update their content at any time using their Excel file, and they dont need to rely on me to make changes for them. Likewise, I dont have to make numerous small updates on their behalf . I can leave control of the content up to Dura-lite and focus on design and development issues.

Displaying content from a web service

Web services provide another example where Flash simplifies the display of complex information. Many organizations make their data available to the public through web services. Data arrives in an XML document, and the built-in XML parser within Flash can translate this document into a simple visual display for users.

Earlier in the chapter, we saw an example of a web service that provides airport weather information. In the next example, we look at how Flash can consume a news service from Moreover. The new headlines update on a daily basis, but the structure of the XML document providing the information never changes. Users can view up-to-date news items any time they open the Flash movie.

Figure 1-7 shows a sample XML document from Moreover displayed in a web browser.

Figure 1-7: An XML document from Moreover news

I requested the daily web developer news and this XML document was provided. It contains a set of articles. Each article has related information such as an id, URL, and headline.

Its not easy for me to scan this document to read the news headlines. The document isnt designed to be read by humans. I can look through the list for the <headline_text> element but its pretty hard work. If I want to see the news item in full, Ill have to copy the <url> text and paste it into the address line of a web browser.

Compare the XML document with Figure 1-8, which shows the same information displayed within a Flash movie.

Figure 1-8: Moreover news headlines displayed in a Flash movie

Flash has extracted the relevant information and the headline displays in a DataGrid component. It has also colored every second line to make it easy to view the headlines. Each headline links to an HTML page that displays more detail when clicked.

I could change the display by adding extra columns or by using different colors. I could also make this movie more interactive. For example, the source for the news item could display as the user moves their mouse over the title. I could also add a button that allows me to look up news items from earlier dates.

Flash provides a presentation layer that makes the information much more accessible. Youll build something similar later in this book.

Accessing your computer

Another example of simplifying information with Flash is using it to interact with parts of your computerfor example, the files and folders. Flash cant interact with files and folders directly so you have to use a server-side file. This is important for security reasonsyou dont really want a user being able to delete the contents of your hard drive by using a Flash movie.

Server-side languages like ColdFusion, PHP, and VB .NET allow you to work with folders and files on your computer. You could use them to generate a list of characteristics such as file and folder names , file sizes, or the last modified date of a document. You can also use server-side languages to edit and delete files and folders, as well as to change the contents inside text files.

Flash can use a server-side language to work with files and folders on a computer. The server-side file can generate an XML representation of your files and folders. Flash then has access to the information about them in a structured format.

So when would this be useful? Well, any time you wanted to create an up-to-date list of files for use within a Flash movie. In this book, one of the examples well look at is an MP3 player.

Ive backed up most of my CDs in MP3 format so I can listen to them while I work. I have also built a Flash MP3 player that can play the files. The MP3 player loads the file list from an XML document.

I could type the names of all of my MP3s into an XML file and display the list in Flash. However, given the number of CDs I own, thats likely to take me a long time and Id have to update the file each time I add new songs.

Instead, I wrote a server-side file that gets the details of the folders and MP3 files in my library, and creates the XML document automatically. However, the XML document doesnt exist in a physical file. Instead, its generated as a stream of XML information whenever I open the Flash movie.

Figure 1-9 shows the XML document that I have generated from my folders and MP3 files. I used an ASP.NET file to create this document. At the time of writing, there were 542 lines in the file. Id hate to have to maintain the list manually by typing the content myself !

Figure 1-9: An XML document containing a list of MP3 files generated by an ASP.NET file

This XML document powers the Flash MP3 player shown in Figure 1-10.

Figure 1-10: An MP3 player that uses an XML document listing the MP3 files

Youll learn how to build a very similar MP3 player a little later in this book.