Accessibility

Table of Contents

Creating data-driven application prototypes with Dreamweaver and Flash

Build a PHP file to simulate server connectivity

I find that I need to make server calls during my development process in order to build and test the server-related functionality of the user interface. I don't have extensive knowledge of a server-based scripting language. Beyond that, I don't want to work with anything complicated at this point. I want to implement the simplest interaction possible that simulates calls and responses from the server, but exists in a format that's easy to modify as I shape the application.

This page shows you how to build a simple PHP template to simulate server calls and responses.

Why use PHP and Microsoft IIS server?

I started using PHP a while back for server script prototyping because it is a free open-source technology that I found was fairly easy to learn. It had enough similarities to ActionScript and JavaScript that I could shape out simple scripts without having to spend a long time learning new code syntax.

I discovered the IIS server when I moved my OS to Windows XP Professional and found the extras disc. I was running PHP on an Apache server at the time, but IIS server was far easier to install and work with. To cap it off, the PHP installer updated to be a two-click process for installation into the IIS server. I've continued to use this configuration with success ever since.

If you're using a different scripting technology or server, you can apply the general concepts as your syntax dictates. Flash communicates to the server through a standard HTTP call, so any server that can handle an HTTP call and run a scripting technology can be used in the place of IIS and PHP.

A few words about simulating server logic

Before you build the PHP file, you have to scope out the needs of what you're trying to prototype. Flash HTTP calls from the prototype will send GET variables to the script and expect a return string of XML data in response. The PHP file will interpret the GET variables and return an XML string stored in a static XML file. This step simulates a database query with a fixed set of prototype XML files. In the end, the Flash movie doesn't care how the XML string is generated or what type of script generated it. Everything happens through the HTTP protocol.

You can send variables to the server using the GET or POST action, just as you can with an HTML form. In the prototype you'll use the GET action so you can test the PHP in a browser.

You'll supply the following GET variables to the server during an HTTP call:

  • function: Router function name in the server script (router key)
  • type: Type of template data requested (secondary router key)
  • id: Id ID of template data requested (tertiary router key)

These three values are generally enough to request a wide range of server data or functionality. The function variable supplies the primary request key that routes to a specific functionality. The type variable enables you to request a type of template within the primary key. The id variable enables you to request a specific page by ID or by path.

Tip: To avoid errors in the PHP, if I don't use any of the three values, I set the unused value(s) to –1.

Build a PHP file in Dreamweaver

Now you're ready to build the PHP file. You'll build the file locally in Dreamweaver and then sync the file to the development server for a test.

  1. Create a new PHP file in Dreamweaver.
  2. Save the file as dataRouter.php in the local files folder.
  3. Click the Code view tab in Dreamweaver. Delete the HTML code that appears by default on the page.
  4. Click the PHP tab in the workspace at the top of the code view. You should see the PHP snippet shorts appear.
  5. Add the following code to the file:

    <?php
        //*************************
        // GET Variables:
        
        $func = $_GET["function"]; 
        $type = $_GET["type"];
        $id = $_GET["id"];
        
        //*************************
        // RETURN Data:
        // Find the correct file to return...
        if( $func == "getCatalog" )
        {
            echo "return catalog code...";
        }
        else if( $func == "getTemplate" )
        {
            echo "return template code -> type = $type, id = $id";
        }
    ?>
  6. Save the file.

The PHP code above starts off by saving the three GET values in PHP variables. The second half of the code contains a conditional statement that evaluates the function value and routes to the appropriate data. For now, the script returns a placeholder for testing. The echo command returns the text to Flash.

You'll return to the PHP file to add the code that routes to the XML files in the next section.

Test the file

Before moving on to the XML development, it's wise to test your PHP file from the development server. If there are any problems, you'll want to figure them out now. Otherwise, you can confirm that everything works to this point.

  1. In Dreamweaver, select the dataRouter.php file in the Local view of the Files panel and right-click to choose Put to sync the file to the development server.
  2. Change the Local view in the Files panel to the Remote view to confirm the file was copied over (see Figure 6).
  3. Test the file by opening a browser and typing in a path to the PHP file followed by a query string containing the three GET variables. On my localhost server the path looks like this:
http://localhost/adobe/dataRouter.php?function=getCatalog&type=-1&id=-1

If everything is working you should see the text from the server appear in the browser.

Dreamweaver's Files panel can display
server files.

Figure 6. The Files panel can display server files.