Categories
Code Web Work

Flash Slideshows in ZeppOS

So I find myself spending a lot of time trying to debug issues with Javascript and Flash when building sites out in ZeppOS. I’m posting this in the hopes that other people might find this useful!

Basically, I use the Flash Nifties XML Slideshow any time I need to do a quick image slideshow. To embed the swf file, I use the included SWFObject javascript for cross-browser compatible flash integration.

Now, the key to pulling this off successfully is to make sure the paths are all correct. Not only do we need to make sure the path to the XML file is good, but we need to make sure the paths to the images inside the XML file are valid as well. Trying to embed slideshow.swf by itself using the built in WYSIWYG editor doesn’t work, because the SWF can’t find the XML file. So, using the editor override method, I drop in the following code:

<script type="text/javascript">
var so = new SWFObject("/_Library/Media/Slideshow/slideshow.swf?file=_library/Media/slideshow/slideshow.xml", "gallery", "400", "300", "6", "#ffffff");
so.write("flashcontent");
</script>

Alternatively, I could use addVariable technique to tell the slideshow where the XML file is (found here):
so.addVariable("file", "xml/images.xml");

However, since there’s only one variable, it’s easy enough to just add it directly to the uri string.

Now that slideshow.swf knows where it’s XML file is, I can test this by changing the bgcolor attribute in the XML file and seeing if it shows up. Once I’m sure the slideshow is reading from the XML file, I need to make sure the file paths to the images are correct. Since Flash reads the directory structure relative to the page it’s being called from (in this case, the root of the web site, index.asp), the path has to look like this:

<image img="_Library/Media/Slideshow/image1.jpg" />
<image img="_Library/Media/Slideshow/image2.jpg" />
<image img="_Library/Media/Slideshow/image3.jpg" />
<image img="_Library/Media/Slideshow/image4.jpg" />

Since ZeppOS is on a Windows platform, the paths are case-insensitive, but I add in capitalization anyway.

And that’s about it. Next time I’ll show a snippet of Javascript that I sometimes add to trick the browser into updating the XML file each time the page loads.