This is my first attempt to integrate an existing flash file into a modx page (or any page for that matter).
I want to use this nifty slide show/stack in a modx site.
http://www.mustardlab.com/developer/test/new/
More info about the slide show is here.
http://twelvestone.com/forum_thread/view/15182?offset=0
I will of course use different images, but I can’t seem to get this to work. I downloaded the files for the slideshow
http://www.mustardlab.com/developer/test/new/gallery.zip
Here’s what I did.
I copied all the files from the download into a folder in assets called "stack". This includes the
index.php file which points to the gallery.swf file which uses a gallery.xml file for the list of images in the slideshow/stack.
I created very simple new template and pasted in the code from the downloaded index.php file.
Added added <base href="[(site_url)]" > to the head
Changed the path to the swf file to assets/stack/gallery.swf.
Changed the path to the images in the xml file to assets/stack/image.jpg
Changed the background color to gray (so I could see where the flash file should be)
Result:
The flash file is not running. If I change the size to 50% I can see the white box where it should be with the gray background around it, but flash is not running.
I’m thinking this is a path problem of some sort. Perhaps it can’t see the xml file or the images? I can’t seem to resolve this.
If copy the code from my modx template into standalone html page, it works fine.
Here’s my modx template
<html>
<head>
<meta http-equiv="content-type" content="text/html;charset=ISO-8859-1">
<title>Flash Photo Stack</title>
<base href="[(site_url)]" >
<style>
body {background: gray;}
</style>
</head>
<body style="margin:0px">
<object id="flashmovie" type="application/x-shockwave-flash" data="assets/stack/gallery.swf" width="100%" height="100%">
<param name="movie" value="assets/stack/gallery.swf" />
<param name="FlashVars" value="<? if(isset($_GET['image'])) echo "topimage=".$_GET['image'] ?>" />
</object>
</body>
</html>
Here’s the xml file
<?xml version=\"1.0\" ?>
<img src="assets/stack/animal.jpg" width="466" height="548" />
<img src="assets/stack/just_married.jpg" width="389" height="578" />
<img src="assets/stack/richard_mackson.jpg" width="473" height="316" />
<img src="assets/stack/sinister.jpg" width="480" height="360" />
<img src="assets/stack/superdog.jpg" width="500" height="339" />
<img src="assets/stack/st_helens.jpg" width="479" height="480" />
Here’s the original html code from the download
<html>
<head>
<meta http-equiv="content-type" content="text/html;charset=ISO-8859-1">
<title>Flash Photo Stack</title>
</head>
<body style="margin:0px">
<object id="flashmovie" type="application/x-shockwave-flash" data="gallery.swf" width="100%" height="100%">
<param name="movie" value="gallery.swf" />
<param name="FlashVars" value="<? if(isset($_GET['image'])) echo "topimage=".$_GET['image'] ?>" />
</object>
</body>
</html>
I did try to use SWFObject and had similar results. However, since I’d never used this before either, I may not have used it correctly.
I have noticed this code is much simpler than other flash integration examples I found by googling around, yet it works in a stand alone file.
Any thoughts or ideas are greatly appreciated.
?