var WorkGallery = Class.create();

WorkGallery.prototype = 
{
	initialize : function(script_path, first_work, first_item_id, first_item_title)
	{
		this.script_path = script_path+'/work/';
		this.img_path = script_path+'/work/image/';
		this.spacer = script_path+"/img/spacer.gif";
		this.preloader = 'preloader';
		this.nav_container = 'work-nav';
		this.img_container = 'work-page';
		this.image = 'work-image';
		this.duration = '0.6';
		this.item_component_prefix = 'component-';
		this.item_images_prefix = 'images-';
		this.item_image_title_prefix = 'image-title';
		this.active_work = first_work;
		this.first_item_id = first_item_id;
		this.first_item_title = first_item_title;
		this.block = false;
	},
	
	start : function()
	{	
		new Effect.Appear(this.nav_container, { duration : this.duration } );
		this.change_image(this.first_item_id);
		this.change_title(this.first_item_title, false);	
	},
	
	change_work : function(work_id, first_item_id, first_item_title)
	{
		if(!this.block)
		{
			if(this.active_work != work_id)
			{
				prev_work_id = this.active_work;
				this.active_work = work_id;
				this.hide_prev_work(prev_work_id);
			}
			this.reset_items(0);
			if(first_item_id) 
			{
				this.change_image(first_item_id);
			}
			else
			{
				Element.hide(this.img_container);
			}
			if(first_item_title) this.change_title(first_item_title, false);
		}
	},
	
	change_item : function(pos, id, title)
	{
		if(!this.block)
		{
			this.reset_items(pos);
			this.change_image(id);
			this.change_title(title, false);
		}
	},
	
	change_image : function(id) 
	{		
		this.block = true;
		Element.show(this.preloader);
		Element.hide(this.img_container);
		Element.setSrc(this.image, this.spacer);
		loader = new Image();
		loader.onload=function()
		{
			Element.setSrc(myWork.image, myWork.img_path+id);
			myWork.show();
		};
		loader.src = this.img_path+id;
	},
	
	show : function(id)
	{
		Element.hide(this.preloader);
		new Effect.Appear(this.img_container, { duration: this.duration });
		this.block = false;
	},
	
	change_title : function(title, effect_on)
	{
		titles = $S('#'+this.active_work+' div.'+this.item_image_title_prefix);
		Element.hide(titles[0]);
		Element.update(titles[0], title);
		if(effect_on)
		{
			new Effect.Appear(titles[0], { duration: this.duration });
		}
		else
		{
			Element.show(titles[0]);
		}
	},
	
	hide_prev_work : function(prev_work_id)
	{		
		Element.removeClassName(prev_work_id, 'on');
		Element.addClassName(prev_work_id, 'off');
		Element.hide('component-'+prev_work_id);
		this.show_work();
		//Effect.Fade('component-'+prev_work_id, { duration: this.duration, afterFinish:this.show_work() });
	},
	
	show_work : function()
	{
		Element.removeClassName(this.active_work, 'off');
		Element.addClassName(this.active_work, 'on');
		Element.show('component-'+this.active_work);
		//Effect.Appear('component-'+this.active_work, { duration: this.duration });
	},
	
	reset_items : function(pos)
	{
		var list = $(this.item_images_prefix+this.active_work).getElementsByTagName('a');
		var data = $A(list);
		if(data.length > 0)
		{
			for(i = 0; i < data.length; i++)
			{
			    var item = data[i]; 
				if(i == pos)
				{
					Element.removeClassName(item, 'off');
					Element.addClassName(item, 'on');
				}
				else
				{
					Element.removeClassName(item, 'on');
					Element.addClassName(item, 'off');
				}
			}
		}
		return false;
	}
}