/*!
	reflection.js for mootools v1.3
	(c) 2006-2008 Christophe Beyls <http://www.digitalia.be>
	MIT-style license.
*/

Element.extend({
	reflect: function(options) {
		var img = this;
		if (img.getTag() != "img") return;

		options = $extend({
			height: 0.33,
			opacity: 0.5
		}, options || {});

		function doReflect() {
			img.unreflect();
			var reflection, reflectionHeight = Math.floor(img.height * options.height), wrapper, context, gradient;

			if (window.ie) {
				reflection = new Element("img", {src: img.src, styles: {
					width: img.width,
					height: img.height,
					marginBottom: -img.height + reflectionHeight,
					filter: "flipv progid:DXImageTransform.Microsoft.Alpha(opacity=" + (options.opacity * 100) + ", style=1, finishOpacity=0, startx=0, starty=0, finishx=0, finishy=" + (options.height * 100) + ")"
				}});
			} else {
				reflection = new Element("canvas");
				if (!reflection.getContext) return;
			}
			reflection.setStyles({display: "block", border: 0});

			wrapper = new Element(($(img.parentNode).getTag() == "a") ? "span" : "div").injectAfter(img).adopt(img, reflection);
			wrapper.className = img.className;
			wrapper.style.cssText = img.reflected = img.style.cssText;
			wrapper.setStyles({width: img.width, height: img.height + reflectionHeight, overflow: "hidden"});
			img.style.cssText = "display: block; border: 0px";
			img.className = "";
			if (!window.ie) {
				context = reflection.setProperties({width: img.width, height: reflectionHeight}).getContext("2d");
				context.save();
				context.translate(0, img.height-1);
				context.scale(1, -1);
				context.drawImage(img, 0, 0, img.width, img.height);
				context.restore();
				context.globalCompositeOperation = "destination-out";

				gradient = context.createLinearGradient(0, 0, 0, reflectionHeight);
				gradient.addColorStop(0, "rgba(255, 255, 255, " + (1 - options.opacity) + ")");
				gradient.addColorStop(1, "rgba(255, 255, 255, 1.0)");
				context.fillStyle = gradient;
				context.rect(0, 0, img.width, reflectionHeight);
				context.fill();
			}
		}

		if (img.complete) {
			img.unreflect();
			doReflect();
		}
		else img.onload = doReflect;

		return img;
	},

	unreflect: function() {
		var img = this, wrapper;
		img.onload = Class.empty;

		if (img.reflected !== undefined) {
			wrapper = img.parentNode;
			img.className = wrapper.className;
			img.style.cssText = img.reflected;
			img.reflected = undefined;
			wrapper.parentNode.replaceChild(img, wrapper);
		}

		return img;
	}
});

Elements.extend({
	reflect: function(options) {
		this.forEach(function(el) {
			el.reflect(options);
		});
	},

	unreflect: function() {
		this.forEach(function(el) {
			el.unreflect();
		});
	}
});