(function() {


var $ = document.id;


this.PlanitGallery = new Class({

	Implements: [Events, Options],

	options: {
		selector: "ul.planit-gallery li a",	/* the selector to use when grabbing the local images */
		drawArea: "gallery-drawArea" 		/* the id of the element that the main image will be draw into */
	},

	_drawArea: undefined,

	/**
	 * Initializes the component
	 *
	 * @param object options The components options
	 */
	initialize: function(options)
	{
		this.setOptions(options);
		$$(this.options.selector).each(function(link) {
			link.addEvent("mouseenter", this._mouseEnterEvent.bindWithEvent(this));
			link.addEvent("mouseleave", this._mouseLeaveEvent.bindWithEvent(this));
			link.addEvent("click", function(e) {
				e.stop();
			});
		}, this);
		this._drawArea = $(this.options.drawArea);
	},


	/**
	 * Handles the link interaction event
	 *
	 * @param Element link The link element that the user interacted with
	 */
	_mouseEnterEvent: function(e)
	{
		e.stop();
		// make sure the target is a link, not an image
		var target = $(e.target);
		if (target.nodeName.toLowerCase() == "img")
		{
			target = target.getParent("a");
		}
		new Asset.image(imageSrc);
		var imageSrc = target.getProperty("href");
		var img = new Element("img", {"src": imageSrc, "width": "373", styles:{height: "auto"}});
		this._drawArea.empty();
		img.inject(this._drawArea, "top");
		this.show();
	},

	/**
	 * Handles the link interaction event
	 *
	 * @param Element link The link element that the user interacted with
	 */
	_mouseLeaveEvent: function(e)
	{
		e.stop();
		this.hide();
	},

	/**
	 * Shows the main draw area
	 */
	show: function()
	{
		this._drawArea.setStyle("visibility", "hidden");
		this._drawArea.setStyle("display", "block");
		var parent = $$(".case-study-detail")[0];
		var coords = parent.getCoordinates($$("body")[0]);
		var top = (coords.top + coords.height) - 220 - this._drawArea.getCoordinates().height;
		this._drawArea.setStyle("top", top + "px");
		this._drawArea.setStyle("visibility", "visible");
	},

	/**
	 * Hides the main draw area
	 */
	hide: function()
	{
		this._drawArea.setStyle("display", "none");
	}


});

})();


window.addEvent("domready", function() {
	if ($("planitGalleryContainer"))
	{
		new PlanitGallery();
	}
});