var simpleGallery = new Class({
	////////////////////////////////////////
	// Variables and options
	////////////////////////////////////////
	Implements: [Options,Events],
	options: {
		borderWidth:15,
		identifier: 'simpleGallery'
	},
	img: Element('img'),
	block: Element('div'),
	
	initialize: function(options) {
		var that = this;
		var child;
		this.setOptions(options);

		this.img.setStyles({
			'display':'none',
			'position':'absolute',
			'border':'3px solid #fff'
		});
		$$('body').adopt(this.img);
		this.block.setStyles({
			'display':'none',
			'position':'absolute',
			'zIndex':999
		});

		this.block.addEvent('mouseleave',function(e) {
			//console.log( dim.x +" "+ dim.y );
			//console.log( size.x +" "+ size.y );
				that.block.setStyles({
					'display':'none'
				});
				that.img.setStyles({
					'display':'none'
				});
		});


		$$('body').adopt(this.block);

		$$('a').each(function(item,index,array) {
			
			if ( item.getProperty('rel') != null && item.getProperty('rel').contains( that.options.identifier ) ) {
				child = item.getChildren('img')[0];
				if ( child != null ) {
					
					size = child.getSize();
					item.setStyles({
						'height': size.y,
						'width': size.x,
						'display': 'block',
						'float': 'left',
						'margin': 5
					});
				}
				item.addEvent('mouseenter',function(e) {
					target = e.target;

					while( target.tagName != 'A' ) {
						target = target.parentNode;
					}

					var tmp = new Date();
					//{'src':target.getProperty('href')+'?b='+tmp.getTime()}
					var url = target.getProperty('href')+'?b='+tmp.getTime();
					var test = Element('img',{'src':url});
					test.setStyles({
						'visibility':'hidden',
						'position':'absolute',
						'bottom':0,
						'left':0
					})
					$$('body').adopt(test);

					test.addEvent('load',function() {
						//console.log('Image Loaded');
						size = test.getSize();
						that.show({
							'x': size.x,
							'y': size.y,
							'el':target,
							'url':url
						});
						test.destroy();
					});

					
				});

			}
		});
	},

	show: function(obj) {
		//console.log('In Show');
		//console.log(obj.x)

		var that = this;
		
		var size = obj.el.getSize()
		var dim = obj.el.getPosition();

		var left = dim.x - ( obj.x / 2 - ( size.x / 2 ) );
		var top = dim.y + size.y + 5;

		var win = $(window).getSize();
		var scroll = $(window).getScroll();

		if ( top < 5 ) { top = 5; }
		if( left < 5 ) { left = 5; }

		

		if ( top + obj.y > win.y+scroll.y ) { top = win.y+scroll.y - 10 - obj.y; }
		if ( left + obj.x > win.x ) { left = win.x - 10 - obj.x; }

		this.img.setProperty('src',obj.url);
		this.img.setStyles({
			'top':top,
			'left': dim.x + (size.x/2),
			'height':0,
			'width': 0,
			'display': 'block',
			'border': '0px solid #fff'
		});
		this.img.set('morph', {'duration':400,'transition': 'expo:out'});

		this.img.morph({'height':[0,obj.y],'width':[0,obj.x],'left': left, 'border':'3px solid #fff'});

		this.block.setStyles({
			'top':dim.y,
			'left':dim.x,
			'height':size.y,
			'width':size.x,
			'display':'block'
		});
	}
});