/**
 * reflection.js v0.4+
 *
 * With modifications by Cow (http://cow.neondragon.net) to attempt to
 * adapt reflection for Internet Explorer browsers.
 *
 * If you want to use this, feel free but it is very unpolished and there
 * are still issues with the IE implementation. I'd recommend waiting
 * for an official version to be released with IE support.
 *
 * Script by Cow http://cow.neondragon.net
 *           Gfx http://www.jroller.com/page/gfx/
 *           Sitharus http://www.sitharus.com
 *           Andreas Linde http://www.andreaslinde.de/
 *
 * Freely distributable under MIT-style license.
 */
 
function addReflections() {
	if (document.all && !window.opera) {
		var reflect = document.getElementsByClassName('reflect');
		for (i=0;i<reflect.length;i++) {
			try {
				var reflectionWidth = reflect[i].width;
				var reflectionHeight = Math.floor(reflect[i].height/2);
				var reflectImage = reflect[i].src;
				
				var reflection = document.createElement('div');
				
				reflection.style.width = reflectionWidth+'px';
				reflection.style.height = reflectionHeight+'px';
				reflection.style.background = 'url('+reflectImage+') 0px -'+reflectionHeight+'px';
				reflection.style.filter = 'progid:DXImageTransform.Microsoft.BasicImage(rotation=2, mirror=1) progid:DXImageTransform.Microsoft.Gradient(gradientType=\'0\')';
				
				var reflected = document.createElement('div');
				
				/* Copy original image's classes & styles to div */
				reflected.className = reflect[i].className;
				Element.removeClassName(reflected, 'reflect');

				reflected.style.cssText = reflect[i].style.cssText;
				reflect[i].style.cssText = ' ';
				
				reflect[i].parentNode.replaceChild(reflected, reflect[i]);
				reflected.appendChild(reflect[i]);
				reflected.appendChild(reflection);
				
				reflect[i].parentNode.appendChild(reflected);
				
				reflection.filters.item("DXImageTransform.Microsoft.Gradient").StartColor = 0xffebebeb;
				reflection.filters.item("DXImageTransform.Microsoft.Gradient").EndColor = 0xaaf1f0f0;
			} catch (e) {
		    }
		}
	} else {
		var reflect = document.getElementsByClassName('reflect');
		for (i=0;i<reflect.length;i++) {
			try {
				var canvas = document.createElement('canvas');
				var context = canvas.getContext("2d");
				
				if (Element.hasClassName(reflect[i], "wholeimage")) {
					var canvasHeight = reflect[i].height;
					var divHeight = reflect[i].height*2;
				} else {
					var canvasHeight = reflect[i].height/2;
					var divHeight = reflect[i].height*1.5;
				}
				
				var d = document.createElement('div');
				
				/* Copy original image's classes & styles to div */
				d.className = reflect[i].className;
				Element.removeClassName(d, 'reflect');
				
				d.setAttribute('style', reflect[i].getAttribute('style'));
				reflect[i].setAttribute('style', ' ');
			
				var canvasWidth = reflect[i].width;
				p = reflect[i];
				canvas.style.height = canvasHeight+'px';
				canvas.style.width = canvasWidth+'px';
				canvas.height = canvasHeight;
				canvas.width = canvasWidth;
				
				d.style.width = canvasWidth+'px';
				d.style.height = divHeight+'px';
				p.parentNode.replaceChild(d, reflect[i]);
				
				d.appendChild(p);
				d.appendChild(canvas);
				
				context.save();
				
				context.translate(0,canvasHeight*2-1);
				context.scale(1,-1);
				
				context.drawImage(reflect[i], 0, reflect[i].height-canvasHeight, canvasWidth, canvasHeight, 0, canvasHeight, canvasWidth, canvasHeight);
				
				context.globalCompositeOperation = "destination-out";
				
				var gradient = context.createLinearGradient(0, canvasHeight, 0, canvasWidth);
				gradient.addColorStop(0, "rgba(255, 255, 255, 1.0)");
				
				if (Element.hasClassName(reflect[i], "wholeimage")) {
					gradient.addColorStop(0.5, "rgba(255, 255, 255, 0.5)");
				} else {
					gradient.addColorStop(0.9, "rgba(255, 255, 255, 0.5)");
				}
	
				context.fillStyle = gradient;
				if (navigator.appVersion.indexOf('WebKit') != -1) {
					context.fill();
				} else {
					context.fillRect(0, 0, canvasWidth, canvasHeight*2);
				}
				
				context.restore();
			} catch (e) {
		    }
		}
	}
}

Event.observe(window, 'load', addReflections, false);