Added Image Scroller Based on iTunes

rphMedia over at the Coppermine forums has offered a mod called Image Scroller – based on iTunes. It looks so cool that I couldn’t help but implementing it at my Take Thu gallery and my blog (at the bottom of the blog’s homepage).

For those who want an includable version of flow.htm, create a file in the include folder called flow.inc.php:

<?php

if (IN_COPPERMINE) {

 $path=$CONFIG['site_url'];

} else {

 $path = 'http://GALLERY_URL/'; //change this to your specific path to make the output url's absolute with trailing slash
}

?>

<script language="javascript">AC_FL_RunContent = 0;</script>

<script src="<?php echo $path; ?>flow/AC_RunActiveContent.js" language="javascript"></script>

<script language="javascript">

 if (AC_FL_RunContent == 0) {

 	alert("This page requires AC_RunActiveContent.js. In Flash, run \"Apply Active Content Update\" in the Commands menu to copy AC_RunActiveContent.js to the HTML output folder.");

 } else {

 	AC_FL_RunContent(

 		'codebase', 'http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=8,0,0,0',

 		'width', '750',

 		'height', '250',

 		'src', 'flow',

 		'FlashVars', 'xmlPath=<?php echo $path; ?>flow.php', <!--Absolute path to 'flow.php'-->

 		'quality', 'high',

 		'pluginspage', 'http://www.macromedia.com/go/getflashplayer',

 		'align', 'middle',

 		'play', 'true',

 		'loop', 'true',

 		'scale', 'showall',

 		'wmode', 'window',

 		'devicefont', 'false',

 		'id', 'flow',

 		'bgcolor', '#000000',

 		'name', 'flow',

 		'menu', 'true',

 		'movie', 'flow',

 		'salign', ''

 		); //end AC code

 }

</script>

The above code assumes:

  • The flow files are in a folder called flow
  • flow.php is in the root of the gallery

When including the file in an external application, add this line before the include function:

define('IN_COPPERMINE', false);

Edit GALLERY_URL accordingly.

Update: Things looked messed up in Internet Explorer so I added a browser detector so that the image scroller doesn’t appear in IE. Boo IE. The image scroller works fine in Firefox and Opera. If you’re using IE, please be kind and switch to a real browser so we webmasters don’t have to waste so much time making things work in–or hiding things from–IE. I recommend Firefox because it has a lot of cool extensions, and is less likely to have compatibility issues than Opera, which is an otherwise fine browser.

Update 2007-06-25: I figured out the issue with IE. So, since the scroller is at the bottom of the blog, there’s no sidebar, so I had made the width wider than the content at the top, since there would be no overlap of the sidebar. However, although the sidebar wasn’t visually there, it seemed to affect IE nonetheless. I have to use a small width, as if the sidebar was there. I already had the IE detector so instead of turning off the scroller for ie, I just changed the width variable defined for it.

Also, I’ve made several modifications with the help of rphMedia. It looks so much better now.

One thought on “Added Image Scroller Based on iTunes”

Leave a Reply

Your email address will not be published. Required fields are marked *

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>