/**
 * reflection.js v2.0
 * http://cow.neondragon.net/stuff/reflection/
 * Freely distributable under MIT-style license.
 */
 
/* From prototype.js */
if (!document.myGetElementsByClassName) {
	document.myGetElementsByClassName = function(className) {
		var children = document.getElementsByTagName('*') || document.all;
		var elements = new Array();
	  
		for (var i = 0; i < children.length; i++) {
			var child = children[i];
			var classNames = child.className.split(' ');
			for (var j = 0; j < classNames.length; j++) {
				if (classNames[j] == className) {
					elements.push(child);
					break;
				}
			}
		}
		return elements;
	};
}

function addReflection(image)
{
	var p = image;
	
	var classes = p.className.split(' ');
	var newClasses = '';
	for (var j=0;j<classes.length;j++)
	{
		if (classes[j] != "reflect")
		{
			if (newClasses)
			{
				newClasses += ' ';
			}
			
			newClasses += classes[j];
		}
	}

	var reflectionHeight = Math.floor(p.clientHeight*0.5);
	var reflectionWidth = p.clientWidth;
	
	var canvas = document.createElement('canvas');
	if (canvas.getContext)
	{
		/* Copy original image's classes & styles to div */
		p.className = 'reflected ' + newClasses;
		
		p.style.cssText = 'vertical-align: bottom';

		var context = canvas.getContext("2d");
	
		canvas.className = newClasses;
		// does not seem to affect the <canvas> element
		//canvas.style.height = reflectionHeight+'px';
		//canvas.style.width = reflectionWidth+'px';
		canvas.height = reflectionHeight;
		canvas.width = reflectionWidth;
		
		p.parentNode.appendChild(canvas);
		
		context.save();
		
		context.translate(0,image.height-1);
		context.scale(1,-1);
		
		context.drawImage(image, 0, 0, reflectionWidth, image.height);

		context.restore();
		
		context.globalCompositeOperation = "destination-out";
		var gradient = context.createLinearGradient(0, 0, 0, reflectionHeight);
		
		gradient.addColorStop(1, "rgba(255, 255, 255, 1.0)");
		gradient.addColorStop(0, "rgba(255, 255, 255, "+(1-1)+")");

		context.fillStyle = gradient;
		context.rect(0, 0, reflectionWidth, reflectionHeight*2);
		context.fill();
	}
}

function addReflections()
{
	var rimages = document.myGetElementsByClassName('reflect');
	for (var i=0;i<rimages.length;i++)
	{
		var rheight = null;
		var ropacity = null;
		
		var classes = rimages[i].className.split(' ');
		for (var j=0;j<classes.length;j++)
		{
			if (classes[j].indexOf("rheight") == 0)
			{
				var rheight = classes[j].substring(7)/100;
			}
			else if (classes[j].indexOf("ropacity") == 0)
			{
				var ropacity = classes[j].substring(8)/100;
			}
		}
		
		addReflection(rimages[i]);
	}
}

addLoadEvent(addReflections);