var Tabs =  {
	Toggle: function(tab_section_id, active_tab_id, active_tab_content_id) {
		active_tab_id = $(active_tab_id);
		active_tab_content_id = $(active_tab_content_id);
		if(!active_tab_id.hasClassName('active'))
		{
			$(tab_section_id).select("div.tabs li.active").first().removeClassName('active');
			$(tab_section_id).select("div.tabs_content div.active").first().removeClassName('active');
			active_tab_id.addClassName('active');
			active_tab_content_id.addClassName('active');
		}
	}
};


var CrossFader = {
	item_index: 0,
	item_list: null,
	interval: null,
	contianer: null,

	Start: function(container, delay) 
	{
		this.container = $(container);
		this.item_list = $(container).select('ol').first();
		this.item_list.childElements().each( function(item){ item.hide(); }	);
		this.item_list.childElements().first().show();
		this.interval = setInterval("CrossFader.Next()", delay*1000);
	},

	Next: function()
	{
		Effect.Fade(this.item_list.childElements()[this.item_index], { duration:1, from:1.0, to:0.0 });
		this.item_index++;
		if (this.item_index >= (this.item_list.childElements().size())) this.item_index = 0;
		Effect.Appear(this.item_list.childElements()[this.item_index], { duration:1, from:0.0, to:1.0 });
		CrossFader.ToggleLink(this.container.select('div.steps li')[this.item_index]);
	},

	GoTo: function(index, step)
	{
		Effect.Fade(this.item_list.childElements()[this.item_index], { duration:1, from:1.0, to:0.0 });
		this.item_index = index;
		if (this.item_index >= (this.item_list.childElements().size())) this.item_index = 0;
		Effect.Appear(this.item_list.childElements()[this.item_index], { duration:1, from:0.0, to:1.0 });
		clearInterval(this.interval);
		CrossFader.ToggleLink(step);

	},

	ToggleLink: function(step)
	{
		var step = $(step);
		if(!step.hasClassName('active'))
		{
			var old_link = step.up().select('li.active').first();
			old_link.removeClassName('active');
			step.addClassName('active');
		}
	},

	Previous: function()
	{
		Effect.Fade(this.item_list.childElements()[this.item_index], { duration:1, from:1.0, to:0.0 });
		this.item_index--;
		if (this.item_index < 0) this.item_index = this.item_list.childElements().size() - 1;
		Effect.Appear(this.item_list.childElements()[this.item_index], { duration:1, from:0.0, to:1.0 });
	}

};


var Course = { 
	
	lineIndex: 0, 
	
	indexedHTML: function() {
			this.lineIndex++
			return "<td> <p class=\"textfield course_field\"> <span class=\"left\"><span class=\"right\"><input type=\"text\" name=\"course[name][" + this.lineIndex + "]\" /></span></span> </p> </td><td> <p class=\"textfield quantity_field\" name=\"course[quantity][" + this.lineIndex + "]\"> <span class=\"left\"><span class=\"right\"> <input type=\"text\" /> </span></span> </p> </td><td></td>"
		},
	
	
	add: function() {
		$('courses').insert( { 'top' : this.indexedHTML() } );
	}
};

