/* 
@File:			moo.flection.js
@Version:		0.1
@License:		MIT-style license
@Author:		Edgar Post 
@Info:			http://www.setragasj.nl/mooflection/
@Copyright:		Author
*/

var Reflection = new Class({
    initialize: function(__parent, __options)
	{
		var startHeight = 50, startOpacity = 0.5, height, opacity, images, span, container, imgSize, imgWidth, imgHeight, imgSrc, imgStyles;
		
		if(__options)
		{
			if(__options.cssClass) {
				images = $ES('img.'+__options.cssClass, __parent);
			} else {
				images = $ES('img', __parent);
			}
			
			if(__options.height) { startHeight = __options.height; }
				
			if(__options.opacity) { startOpacity = __options.opacity; }			
		}
		else
		{
			images = $ES('img', __parent);
		}
			
		for(var imgs_i=0; imgs_i<images.length; imgs_i++)
		{	
			img = images[imgs_i];
			
			imgSrc = img.getProperty('src');
			imgStyles = {};
			if(window.ie) {
				imgStyles.cssFloat = img.getStyle('styleFloat');
			} else {
				imgStyles.cssFloat = img.getStyle('float');
			}
			imgStyles.clear = img.getStyle('clear');
			imgStyles.margin = 
			{
				top: img.getStyle('margin-top'),
				right: img.getStyle('margin-right'),
				bottom: img.getStyle('margin-bottom'),
				left: img.getStyle('margin-left')
			};					
			
			imgStyles.padding = 
			{
				top: img.getStyle('padding-top'),
				right: img.getStyle('padding-right'),
				bottom: img.getStyle('padding-bottom'),
				left: img.getStyle('padding-left')
			};					
			
			imgStyles.border = 
			{
				top: img.getStyle('border-top'),
				right: img.getStyle('border-right'),
				bottom: img.getStyle('border-bottom'),
				left: img.getStyle('border-left')
			};			
			
			imgStyles.size = img.getSize().size;
			imgStyles.width = imgStyles.size.x;			
			imgStyles.height = imgStyles.size.y;
			
			imgStyles.width = imgStyles.size.x - imgStyles.padding.left.toInt() - imgStyles.padding.right.toInt() - imgStyles.border.left.toInt() - imgStyles.border.right.toInt();			
			imgStyles.height = imgStyles.size.y - imgStyles.padding.top.toInt() - imgStyles.padding.bottom.toInt() - imgStyles.border.top.toInt() - imgStyles.border.left.toInt();
						
			imgStyles.backgroundColor = img.getStyle('background-color');
			
			container = new Element('div', 
			{
				'styles': {
					'clear': imgStyles.clear, 
					'width': imgStyles.width,
					'height': imgStyles.height+startHeight,
					'background-color': imgStyles.backgroundColor,
					'border-top': imgStyles.border.top, 
					'border-right': imgStyles.border.right, 
					'border-bottom': imgStyles.border.bottom, 
					'border-left': imgStyles.border.left, 
					'margin': imgStyles.margin.top+' '+imgStyles.margin.right+' '+imgStyles.margin.bottom+' '+imgStyles.margin.left, 
					'padding': imgStyles.padding.top+' '+imgStyles.padding.right+' '+imgStyles.padding.bottom+' '+imgStyles.padding.left, 
					'float': imgStyles.cssFloat
				}
			}).injectBefore(img);
			
			img.setStyles({'display': 'block', 'float': '', 'margin': 0, 'padding': 0, 'border': 'none'});
			
			img.injectInside(container);			
			
			height = startHeight;
			opacity = startOpacity;		
			opacityDescreaser = opacity / height;
			
			currentMargin = imgStyles.height++;
			
			for(var i=0; i< height; i++)
			{	
				currentMargin = imgStyles.height + i;
				span = new Element('span',
				{
					'styles': {
						'display': 'block',
						'clear': 'both',
						'height': '1px',
						'font-size': '1px',
						'line-height': '1px',
						'width': imgStyles.width+'px', 
						'overflow': 'hidden',
						'background-image': 'url('+imgSrc+')',
						'background-position': '0 '+currentMargin+'px',
						'opacity' : opacity
					}
				}).injectInside(container);					
				opacity -= opacityDescreaser;
			}
		}
    }
});