addToOnload('homePage.init()');



var homePage = {

	init : function() {

		$('column-left').getElements('img').each(function(e) {

			if(e.className == 'event-image') {

				e.addEvent('mousemove', function(ele) {

					var tmp = homePage.getPosition(ele);

					var mouseX = tmp.x;

					var mouseY = tmp.y;					

					var imgElement = $('eventPhotoLarge');

					

					if(!imgElement) {

						// create new element

						imgElement = new Element('div', {

							id : 'eventPhotoLarge'

						});

						

						imgElement.setStyles({

							'position' : 'absolute',

							'display' : 'block',

							'width' : '217px',

							'height' : '168px',

							'background-color' : '#ffffff',

							'border' : '1px solid #ffffff'

						});

						

						var uriString = 'getEventPhoto.html';

						var req = new Request({

							method : 'get',

							url : uriString,

							data : { 'id' : e.id.substr(6) },

							onComplete : function(htmlResponse) {

								homePage.writeImage(htmlResponse);

							}

						}).send();

						

						imgElement.innerHTML = '';

						imgElement.injectAfter($('container'));

					}

					

					imgElement.setStyles({

						'left' : mouseX-15,

						'top' : mouseY-(imgElement.offsetHeight+15)

					});

				});

				

				e.addEvent('mouseout', function(ele) {

					var imgElement = $('eventPhotoLarge');

					if(imgElement) {

						imgElement.destroy();

					}

				});

			}

		});

	},

	

	writeImage : function(htmlResponse) {

		var imgElement = $('eventPhotoLarge');		

		if(imgElement) {

			imgElement.innerHTML = htmlResponse;

		}

	},

	

	getPosition : function (e) {		

		var posx = 0;

		var posy = 0;

		

		posx = e.client.x + document.body.scrollLeft

			+ document.documentElement.scrollLeft;

		posy = e.client.y + document.body.scrollTop

			+ document.documentElement.scrollTop;

	

		return {x:posx, y:posy};

	}

}