$(document).ready(function() {

	/* Initialize */
	
	$('#hardware_browser').show();
	// initialise slider controls
	$('#hardware_browser').append('<div id="slide_controls"></div>');
	$('#slide_controls').html('<a href="#" class="slide_left"></a><a href="#" class="slide_right"></a>');
	$('#slide_controls').hide();
	// hide all hardware lists
	$('#hardware_browser li div').hide();
	// make the first tab active
	$('#tab1').addClass('active');
	// show the first hardware list
	$('#tab1 div').show();	
	$("#hardware_browser ul>li > div").addClass('browser_active');
	var	slide = 1;	
	var items_per_slide = 6;
	var	scroll_unit = 853;	
	var active_list = $('.active div ul');
	var	items = $(active_list).find('li').size();
	var the_list = $('#hardware_browser div ul').eq(0);	
	var in_progress = false;
	
	setup_list(the_list);
	
	function setup_list(list) {
		items = $(active_list).find('li').size();
		var empty_cells = 6-(items%items_per_slide);
		if (empty_cells == 6) {empty_cells=0;}
		var maxSlide = (items+empty_cells)/items_per_slide;
		// Generate empty spaces
		for(i=1;i<=empty_cells;i++) {
			$('<li class="original">&nbsp;</li>').appendTo(list);
		}
		// add the edge class to the last empty cell
		$(list).find('li.original:last').addClass('edge_right');
		// add 'original' class to every item	
		for(i=0;i<items;i++) {$(list).find('li').eq(i).attr('id',i).addClass('original');}
		/* Clone first slide */
		for(i=0;i<items_per_slide;i++) {$(list).find('li').eq(i).clone().removeClass('original').addClass('head_clone').appendTo(list);}
		/* Clone last slide */
		for(i=0;i<items_per_slide;i++) {$(list).find('li').eq(items+empty_cells-1).clone().removeClass('original').addClass('end_clone').prependTo(list);}
		
		// indicate that the list has been set up
		// TODO remove this and set up all list in one go when the document loads
		$(list).addClass('cloned');
		
		//$(list).addClass('cloned').find('li.original:last').css('margin-right','20px');
	}
	
	resetSlider();
	
	// tabs
	$('#hardware_browser h2').click(function(){
		tab = $(this).parent();
		tabID = tab.attr('id');
		// remove any classes on the slide controls
		$('#slide_controls').attr('class','');
		// give the slider controls a class to match their appearance to this tab
		$('#slide_controls').addClass(tabID);
		browser = tab.find('div');
		// find out if the clicked tab is active
		if (tab.hasClass('active')) {return false;}
		else {
			// hide the active tab	
			$('.active div').hide();
			// remove the active class from all tabs
			$('#hardware_browser ul>li').removeClass('active');
			// assign the active class to the clicked tab
			tab.addClass('active');
			active_list = tab.find('div ul');
			if (!$(active_list).hasClass('cloned')) {setup_list(active_list);}
			$('#slide_controls').hide();	
			resetSlider();
			$(browser).show();
			$(browser).addClass('slider');
		}
		return false;
	});
		
	function resetSlider(){
		slide = 1;
		items = $('.active div li.original').size();
		maxSlide = items/items_per_slide;
		// push the list back one slide
		$(active_list).css('left','-'+scroll_unit+'px');
		// display the slide controls if there's more than 6 items in the list
		if (items>6) {$('#slide_controls').show();}
	}
		
	function moveToLast() {
		slide=maxSlide;
		$(active_list).css('left','-'+(scroll_unit*maxSlide)+'px');
	}
		
	$("#slide_controls .slide_left").click(function(){
		if (!in_progress) {
			in_progress = true;		
			if (slide==1) {
				$(active_list).animate({left: '+='+scroll_unit+'px'}, "normal", function(){moveToLast();in_progress = false;});
			}
			else {
				$(active_list).animate({left: '+='+scroll_unit+'px'}, "normal", function () { 
					slide--;
					if (slide==1) {resetSlider();}
					in_progress = false;
				});
			}
		}	
		return false;
	});
	
	$(".slide_right").click(function(){
		if (!in_progress) {
			in_progress = true;		
			if (slide<maxSlide) {
				$(active_list).animate({left: '-='+scroll_unit+'px'}, "normal", function(){slide++;in_progress = false;});
			}
			else if (slide==maxSlide) {
				$(active_list).animate({left: '-='+scroll_unit+'px'}, "normal", function() {
					resetSlider();
					in_progress = false;
				});
			}
		}	
		return false;
	});
	
	// NEW Hompage js
	
	// tabs switcher
	$('#mp_updates #tabs li').click( function() {
		$(this).prevAll('li').nextAll('li').removeClass('current');
		$(this).addClass('current');
	});
	
	
	
	
	
});