if(Object.isUndefined(Controls.Slideshow))
	throw Error("missing parent Controls.Slideshow");

Controls.TabbedSlideshow = Class.create(Controls.Slideshow, {
	
	controlsContainer: null,
	
	initialize: function($super, container, options)
	{
		var _options = {
			controlsSelector: '.controls',
			controlSelector: '.control',			
			controlActiveClassName: 'active',
			controlsActiveClassName: 'active',			
			controlEffectOptions: {
				duration: .3
			}
		};
		Object.extend(_options, options);
		$super(container, _options);
		
		var o = this.options;
		
		this.controlsContainer = this.container.down(o.controlsSelector);
		this.controlsContainer.observe('mouseover', this.controls_Mouseover.bind(this));
		this.controlsContainer.observe('mouseout', this.controls_Mouseout.bind(this));
		
		var controls = this.getControls();
		
		controls.each(function(control) {
			control.observe('mouseover', this.control_Mouseover.bind(this));
		}.bind(this));
	},
	
	controls_Mouseover: function(event)
	{
		var o = this.options;
		this.controlsContainer.addClassName(o.controlActiveClassName);
	},
	
	controls_Mouseout: function(event)
	{
		var o = this.options;
		this.controlsContainer.removeClassName(o.controlActiveClassName);
	},

	control_Mouseover: function(event)
	{
		var o = this.options;
		var e = event.element().up(o.controlSelector);
		var i = null;
		var controls = this.getControls();
		
		controls.each(function(control, index) {
			if(control == e)
			{
				i = index;
				throw $break;
			}
		});
		
		this.change(i, o.controlEffectOptions);
	},
	
	getControls: function()
	{
		var o = this.options;
		return this.controlsContainer.select(o.controlSelector);
	},
	
	change: function($super, slide, effectOptions)
	{
		var o = this.options;
		slide = this.slide(slide);
		if(!slide)
		{
			throw new Error("Missing 'slide'");
		}
		
		var _effectOptions = {
			afterSetup: Prototype.emptyFunction
		};
		Object.extend(_effectOptions, effectOptions || {});
		var effectAfterSetup = _effectOptions.afterSetup;
		
		var i = null;
		var slides = this.getSlides();
		slides.each(function(s, index) {
			if(slide == s)
			{
				i = index;
				throw $break;
			}
		});

		_effectOptions.afterSetup = function()
		{
			var controls = this.getControls();
			controls.each(function(control, index) {
				if(i === index)
				{
					control.addClassName(o.controlActiveClassName);
				}
				else
				{
					control.removeClassName(o.controlActiveClassName);
				}
			});
			effectAfterSetup();
		}.bind(this);		
		$super(slide, _effectOptions);

	}
});