O'Reilly    
 Published on O'Reilly (http://oreilly.com/)
 See this if you're having trouble printing code examples


Exercise 6-3: Deep linking Using SWFAddress - Search Engine Optimization for Flash

by Todd Perkins
Search Engine Optimization for Flash book cover

This excerpt is from Search Engine Optimization for Flash. Search Engine Optimization for Flash dispels the myth that Flash-based websites won't show up in a web search by demonstrating exactly what you can do to make your site fully searchable -- no matter how much Flash it contains. You'll learn best practices for using HTML, CSS and JavaScript, as well as SWFObject, for building sites with Flash that will stand tall in search rankings.

buy button

Exercise 6-3: Deep Linking Using SWFAddress

Using SWFAddress, you can easily implement deep linking in your site. This exercise gives you practice using SWFAddress with Flex.

  1. Open the output file, index.html in the bin-debug folder for Exercise 6-3 in Flex and notice it links to swfaddress/swfaddress.js.

  2. In the src folder, open the file App.mxml, and then, in Flex, view its code.

  3. Notice the file’s <mx:Application> has a value of initApp() for its creationComplete property.

  4. In the initApp() function, notice that SWFAddress’s change event executes the handleSWFAddress() function.

  5. Look at the TabNavigator’s change property. Notice that runs the setSWFAddress() function.

  6. Notice the utility and XML loading and displaying functions that are already written.

  7. In the setSWFAddress() function, add the code to update the page’s URL using SWFAddress’s setValue() method:

    SWFAddress.setValue("/" + urls[navigator.selectedIndex] + "/");
    
  8. Remember, the SWFAddress.setValue() method triggers the SWFAddressEvent.CHANGE event, which causes handleSWFAddress() to run. In the handleSWFAddress() function, write the code to get SWFAddress’ value, remove the forward slashes, set the appropriate selected index of the TabNavigator based on SWFAddress’ value, and then use the formatted version of the value to set the title in the browser window using SWFAddress.setTitle(). The finished version of handleSWFAddress() should look like this:

    private function handleSWFAddress():void
    {
        var value:String = SWFAddress.getValue();
        value = value.replace(/\//g, "");
        navigator.selectedIndex = urls.indexOf(value);
        SWFAddress.setTitle(formatAsTitle(value));
    }
    
  9. Save the file, and then, from the bin-debug folder in your web browser, open index.html using your testing server to view SWFAddress working when you click through the tabs. Nice!

If you enjoyed this excerpt, buy a copy of Search Engine Optimization for Flash.

Copyright © 2009 O'Reilly Media, Inc.