Reflection of Photo's in Gallery

Hi,

I was looking at this reflection site http://cow.neondragon.net/stuff/reflection/ and wanted to add something like this in X_treme theme or for that matter in Gallery. Is it doable ? Has anyone tried it ? I have least knowledge of JS, PHP, so please let me know how this can be easily achieved. I am sure it will add lots of value to the look and feel of any Theme.

I posted this question on X_Treme theme forum but did not hear any response

Thanks in advance.

Gallery version: 2.2.2
Module / Theme name & version: X_Treme
PHP version (e.g. 5.1.6): I guess 4.*
(rest of the parameters shouldn't matter for my question)

I modified theme.tpl and now the JS started appearing on the top of page after I added this to theme.tpl:

<script type="text/javascript" src="themes/x_treme/reflection.js"></script>

Now I am not sure where to modify photo.tpl, when I do modification I dont see the changes for Photo in source of the page:

{* for image without frame *}
<div style="position:relative; width:{$imagewidth}px; height:{$imageheight}px; top:0px; left:0px;">
{if !empty($theme.params.imageFadin) && empty($theme.panoramaItem)}
<div class="gsSingleImage" id="gsSingleImageId" style="position:absolute; width:{$imagewidth}px; top:0px; left:0px; background-color: #000000;">
{g->image item=$theme.item image=$image fallback=$smarty.capture.fallback class="%CLASS% reflect rheight66" id="%ID%" longdesc="%ID%" usemap="#fotomap"}
{if $theme.params.RightClick != "none"}
<map id="fotomap" name="fotomap">
<area shape="rect" coords="0,0,{$imagewidth},2000" alt=""/>
</map>
{/if}
{else}

Well a bit later than today. Anyway...

save this http://cow.neondragon.net/stuff/reflection/reflection.js as
gallery2/themes/matrix/javascript/reflection.js

Edit gallery2/themes/matrix/templates/theme.tpl
add:
<script type="text/javascript" src="{g->theme url="javascript/reflection.js"}"></script>
before the </head> tag.

Edit gallery2/themes/matrix/templates/album.tpl
find:

		{g->image id="%ID%" item=$child image=$child.thumbnail
			class="%CLASS% giThumbnail"}

change to

			{g->image id="%ID%" item=$child image=$child.thumbnail
			 class="reflect rheight44 ropacity33 %CLASS% giThumbnail" style="display: block; margin-left: auto; margin-right: auto;"}

Dave
_____________________________________________
Blog & G2 || floridave - Gallery Team