Effect.ReSize = Class.create();
Object.extend(Object.extend(Effect.ReSize.prototype, Effect.Base.prototype), {
	initialize: function(element)
	{
		this.element = element;
		if(!this.element) throw(Effect._elementDoesNotExistError);
		var options = Object.extend({ amount: 100, direction: 'vert', toSize:null }, arguments[1] || {});
		if( options.direction == 'vert' )
			this.originalSize = options.originalSize || parseInt(this.element.style.height);
		else
			this.originalSize = options.originalSize || parseInt(this.element.style.width);

	    if( options.toSize != null )
		{
			options.amount = options.toSize - this.originalSize;
		}

		this.start(options);
	},
  
	setup: function()
	{
		// Prevent executing on elements not in the layout flow
		if(this.element.getStyle('display')=='none') { this.cancel(); return; }
	},
  
	update: function(position) {
		if( this.options.direction == 'vert' )
		{
			this.element.setStyle({height: this.originalSize+(this.options.amount*position)+'px'});
		}
		else
		{
			this.element.setStyle({width: this.originalSize+(this.options.amount*position)+'px'});
		}
	},

	finish: function()
	{
		if( this.options.direction == 'vert' )
	    {
			this.element.setStyle({height: this.originalSize+this.options.amount+'px'});
	    }
	    else
	    {
			this.element.setStyle({width: this.originalSize+this.options.amount+'px'});
	    }
  }
});

var Tabs = Class.create({
	container: null,
	tabs: null,
	
	selected: 0,
	count: 0, 
	remember_tab: false, 
	
	initialize: function(element, selected, remember_tab)
	{
		// Initialize the object's variables
		this.container = $(element);
		this.selected = selected || 0;
		this.remember_tab = remember_tab || false;
		
		// if remember tab is set to true then get the last selected tab from the cookie:
		// if remember tab is set to true then set a cookie so it can be read later:
		
		if ( this.remember_tab == true ) 
		{
			this.selected = Cookie.get('cookie_selected') || 0;
		}
		
		//Get the tabs and Remove any contents that should be ignored
		var temp_tabs = this.container.down('div.tabs').childElements();
		var tabs_container = this.container.down('div.tabs');
		tabs_container.select('.ignore').each(function(n) {
			temp_tabs = temp_tabs.without(n);
		});
		this.tabs = temp_tabs;
		
		// Get the contents container
		var contents_container = this.container.down('div.tab-contents');
		// Get the contents
		var contents = contents_container.childElements();
		
		this.count = this.tabs.length;
		
		if ( this.selected >= this.count )
		{
			this.selected = 0;
		}
		
		// Get the biggest contents height to set everything to an equal height
		var max_height = Util.getMaxHeight(contents);
		
		// Remove any contents that should be ignored
		contents_container.select('.ignore').each(function(n) {
			contents = contents.without(n);
		});
		
		// Set the contents container styles to allow for effects
		contents_container.setStyle({
			height: max_height + 'px'
		});
		
		// Loop through the tabs to initialize each one
		var tab, content;
		for ( var i = 0; i < this.count; i++ )
		{
			tab = this.tabs[i];
			content = contents[i];
			
			if ( i == this.selected )
			{
				tab.addClassName('tab-selected');
			}
			else
			{
				tab.addClassName('tab');
				
				content.setStyle({
					display: 'none'
				});
			}
			
			content.setStyle({
				position: 'absolute',
				height: max_height + 'px'
			});
			
			var id = this.container.identify();
			
			content.writeAttribute({id: id + "-tab-content-" + i});
			tab.writeAttribute({id: id + "-tab-" + i});
			
			tab.observe('click', this.click.bind(this));
		}
	},
	
	click: function(e)
	{
		e = e || window.event;
		
		if( e.target )
		{
			var tab = e.target;
		}
		else if( e.srcElement )
		{
			var tab = e.srcElement;
		}
		
		// Make sure the element that was clicked is the tab
		if ( !Element.hasClassName(tab, 'tab') )
		{
			tab = tab.up('div');
		}
		
		var id = tab.identify();
		var index = id.substring(id.lastIndexOf('-') + 1);
		
		// Fire custom event for any listeners in custom handlers
		tab.fire("tab:show", {old_index: this.selected, new_index: index});
		
		this.show(index);
		
		
	},
	
	show: function(index)
	{
		if ( isNaN(index) || index < 0 || index >= this.count )
		{
			return;
		}
		
		var id = this.container.identify();
		
		// Get the tabs
		var new_tab = this.tabs[index];
		var old_tab = this.tabs[this.selected];
		
		// Check that the tab is not already selected
		if ( Element.hasClassName(new_tab, 'tab-selected') )
		{
			return;
		}
		
		// Unselect the old previous tab and hide the content
		old_tab.toggleClassName('tab-selected');
		old_tab.toggleClassName('tab');
		
		// Select the new tab and display the content
		new_tab.toggleClassName('tab-selected');
		new_tab.toggleClassName('tab');
		
		var old_content = $(id + '-tab-content-' + this.selected);
		Effect.Fade(old_content, {duration: 0.3});
		
		var new_content = $(id + '-tab-content-' + index);
		Effect.Appear(new_content, {duration: 0.3});
		
		this.selected = index;	
		
		//Cookie.set(document.title.toLowerCase()+'_selected_tab', this.selected, 1);
		setStaticCookie(this.selected, 1);
		if( $('rep_id') )
		{
			var rep_id = $('rep_id').getValue();
			//setCookie(rep_id,this.selected,5);
		}	
		
	},
	
	getMaxHeight: function(elements, inclusive)
	{
		if ( inclusive == undefined )
		{
			inclusive = false;
		} 
		
		var max = 0
		var height;
		
		elements.each( function(element) {
			
			if ( !inclusive )
			{
				var padding = parseInt(element.getStyle('paddingTop').gsub('px', '')) + parseInt(element.getStyle('paddingBottom').gsub('px', ''));
			}
			else
			{
				var padding = 0;
			}
			
			var height = element.getHeight() - padding;
			if ( height > max )
			{
				max = height;
			}
		});
		
		return max;
	}
});

var VideoTabs = Class.create({
	// All elements
	tabs: null,
	contents: null,
	previous_link: null,
	previous_img: null,
	next_link: null,
	next_img: null,
	
	controls: null,
	dots: null,
	images: null,
	
	// State values
	current: 0,
	previous: 0,
	locked: false,
	
	// Dynamic values
	count: 0,
	tab_margin_bottom: 0,
	
	// Settings
	prev_img_enabled: "http://us-cdn.creamermedia.co.za/template/mw/previous_red.png",
	prev_img_disabled: "http://us-cdn.creamermedia.co.za/template/mw/previous_grey.png",
	next_img_enabled: "http://us-cdn.creamermedia.co.za/template/mw/next_red.png",
	next_img_disabled: "http://us-cdn.creamermedia.co.za/template/mw/next_grey.png",
	
	initialize: function(container, controls, both, selected)
	{
		container = $(container);
		
		this.current = selected || 0;
		
		this.tabs = container.select('.video-tab');
		this.contents = container.select('.video-tab-content');
		
		if ( this.tabs.length == 0 || this.contents.length == 0 )
		{
			return;
		}
		
		this.count = this.tabs.length;
		this.tab_margin_bottom = parseInt(this.tabs[0].getStyle('margin-bottom').gsub('px', ''));
		
		var tab_height = Util.getMaxHeight(this.tabs);
		var content_height = Util.getMaxHeight(this.contents);
		
		container.insert({
			top: '<div class="video-tab-container"></div><div class="video-content-container"></div>'
		});
		
		var tab_container = container.down('.video-tab-container');
		var content_container = container.down('.video-content-container');
		
		tab_container.setStyle({
			height: (tab_height + 11) + 'px'
		});
		
		content_container.setStyle({
			position: 'relative',
			height: (content_height + 20) + 'px'
		});
		
		var tab, content;
		for ( var i = 0, length = this.count; i < length; i++ )
		{
			tab = this.tabs[i];
			content = this.contents[i];
			
			tab_container.insert(tab.remove());
			content_container.insert(content.remove());
			
			tab.setStyle({
				position: 'relative',
				height: (( i == this.current ) ? tab_height + 11 : tab_height) + 'px', 
				marginBottom: ( i == this.current ) ? '-1px' : '',
				borderBottomColor: ( i == this.current ) ? '#FFFFFF' : '',
				marginLeft: ( i == 0 ) ? 0 : '',
				zIndex: 999
			});
			
			content.setStyle({
				position: 'absolute',
				height: content_height + 'px',
				display: ( i == this.current ) ? '' : 'none'
			});
		}
		
		if ( both && controls != undefined )
		{
			this.setupControls(controls);
			this.setupTabs(container);
		}
		else if ( controls != undefined )
		{
			this.setupControls(controls);
		}
		else
		{
			this.setupTabs(container);
		}
		
		tab_container.insert('<div class="clear">&nbsp;</div>');
	},
	
	setupTabs: function(container)
	{
		this.images = container.select('div.video-tab img');
		
		var image;
		for ( var i = 0, length = this.images.length; i < length; i++ )
		{
			image = this.images[i];
			image.writeAttribute({id: container.identify() + "-tab-" + i});
			image.observe('click', this.click.bind(this));
			
			image.addClassName(( i == this.current ) ? 'video-tab-image-selected' : 'video-tab-image');
		}
	},
	
	setupControls: function(controls)
	{
		this.controls = $(controls);
		
		// Set up the next/previous links
		var links = this.controls.select('a');
		
		this.previous_link = links[0];
		this.previous_img = this.previous_link.down('img');
		this.previous_link.observe('click', this.clickPrevious.bind(this));
		
		this.next_link = links[1];
		this.next_img = this.next_link.down('img');
		this.next_link.observe('click', this.clickNext.bind(this));
		
		this.checkButtons();
		
		// Set up the dots
		this.dots = this.controls.select('.dot');
		if ( this.dots[this.current] )
		{
			this.toggleDots(this.dots[this.current]);
		}
	},
	
	click: function(e)
	{
		if ( this.locked )
		{
			return;
		}
		
		e = e || window.event;
		
		if( e.target )
		{
			var image = e.target;
		}
		else if( e.srcElement )
		{
			var image = e.srcElement;
		}
		
		// Make sure the element that was clicked is the tab
		if ( image.tagName.toLowerCase() != "img" )
		{
			image = image.up('img');
		}
		
		var id = image.identify();
		var index = id.substring(id.lastIndexOf('-') + 1);
		
		this.show(index);
		setCookie("navrow",index,5);
	},
	
	show: function(index)
	{
		if ( isNaN(index) || index < 0 || index >= this.count || index == this.current )
		{
			return;
		}
		
		this.previous = this.current;
		this.current = index;
		
		this.images[this.previous].removeClassName('video-tab-image-selected');
		this.images[this.previous].addClassName('video-tab-image');
		
		this.images[this.current].removeClassName('video-tab-image');
		this.images[this.current].addClassName('video-tab-image-selected');
		
		this.doEffects(this.effectsComplete);
	},
	
	clickPrevious: function()
	{
		if ( this.current == 0 || this.count == 1 || this.locked )
		{
			return;
		}
		
		this.locked = true;
		
		this.previous = this.current;
		this.current--;
		this.doEffects(this.effectsComplete);
	},
	
	clickNext: function()
	{
		if ( (this.current == this.count - 1) || this.count == 1 || this.locked )
		{
			return;
		}
		
		this.locked = true;
		
		this.previous = this.current;
		this.current++;
		this.doEffects(this.effectsComplete)
	},
	
	doEffects: function(completeFunction)
	{
		var previous_tab = this.tabs[this.previous];
		var previous_content = this.contents[this.previous];
		
		var current_tab = this.tabs[this.current];
		var current_content = this.contents[this.current];
		
		if ( this.dots != null )
		{
			this.toggleDots(this.dots[this.previous]);
			this.toggleDots(this.dots[this.current]);
		}
		
		// Previous tab transformations
		previous_tab.setStyle({borderBottomColor: ''});
		new Effect.ReSize(previous_tab, {amount: -11, duration: 0.25});
		new Effect.Fade(previous_content, {duration: 0.25});
		
		// Current transformations
		current_tab.setStyle({marginBottom: '-1px'});
		new Effect.ReSize(current_tab, {amount: 11, duration: 0.25});
		new Effect.Appear(current_content, {duration: 0.25, afterFinish: completeFunction.bind(this)});
	},
	
	effectsComplete: function()
	{

		this.tabs[this.current].setStyle({
			borderBottomColor: '#FFFFFF'
		});
		
		this.tabs[this.previous].setStyle({
			marginBottom: this.tab_margin_bottom + 'px'
		});
		
		this.checkButtons();
		
		this.images[this.current].fire('videotab:selected');
		
		this.locked = false;
	},
	
	toggleDots: function(dot)
	{
		dot.toggleClassName('dot');
		dot.toggleClassName('dot-selected');
	},
	
	checkButtons: function()
	{
		if ( this.controls == null )
		{
			return;
		}
		
		this.previous_img.src = ( this.current == 0 || this.count == 1 ) ? this.prev_img_disabled : this.prev_img_enabled;
		this.next_img.src = ( (this.current == this.count - 1) || this.count == 1 ) ? this.next_img_disabled : this.next_img_enabled;
		
		if ( Prototype.Browser.IE5_5 || Prototype.Browser.IE6 )
		{
			Images.fix(this.previous_img);
			Images.fix(this.next_img);
		}
	},
	
	getMaxHeight: function(elements, inclusive)
	{
		if ( inclusive == undefined )
		{
			inclusive = false;
		} 
		
		var max = 0
		var height;
		
		elements.each( function(element) {
			
			if ( !inclusive )
			{
				var padding = parseInt(element.getStyle('paddingTop').gsub('px', '')) + parseInt(element.getStyle('paddingBottom').gsub('px', ''));
			}
			else
			{
				var padding = 0;
			}
			
			var height = element.getHeight() - padding;
			if ( height > max )
			{
				max = height;
			}
		});
		
		return max;
	}
});


function setStaticCookie(value,expiredays)
{
	var exdate=new Date();
	exdate.setDate(exdate.getDate()+expiredays);
	
	document.cookie =
  'cookie_selected='+ value + '; expires=' + exdate + '; path=/'

}
function setCookie(c_name,value,expiredays)
{
	var exdate=new Date();
	exdate.setDate(exdate.getDate()+expiredays);
	document.cookie=c_name+ "=" +escape(value)+
	((expiredays==null) ? "" : ";expires="+exdate.toGMTString());
}