window.addEvent('domready', function()
{
	//we add an event on all the thumbnails of our gallery:
	$$('img.gi_simpleimagegallery').addEvent('mouseover', function(e)
	{

		//we get the picture id:
		var s_id = this.getProperty('id');

		//we copy the big object:
		var obj_big = $('big_' + s_id).clone();

		//we display the object in block:
		obj_big.setStyle('display', 'block');

		//we empty our container:
		simple_image_gallery.empty_container();

		//we inject the object inside our container:
		obj_big.injectInside(simple_image_gallery.get_big_img());
/*
		//we get the src of the thumbnail:
		var s_src = this.getProperty('src');
		
		//we empty our container:
		simple_image_gallery.empty_container();

		//we create a new image & add it inside our container:
		var obj_img = new Element('img', {'src': s_src});
		obj_img.injectInside(simple_image_gallery.get_big_img());

*/
		
	});
});

var simple_image_gallery = new Abstract({
	options: {
		ms_container_id: ''
	},
	set_big_img: function(_s_big_img_class)
	{
		simple_image_gallery['options']['ms_container_id'] = _s_big_img_class;
	},
	get_big_img: function()
	{
		return simple_image_gallery['options']['ms_container_id'];
	},
	empty_container: function()
	{
		var obj = $(simple_image_gallery['options']['ms_container_id']);
		obj.empty();
	}
});

