var dipstart,
	diplast,
	diptotal,
	rename,
	carousel,
	prefix,
	defaultTab;

prefix = 'salads-tab-';
defaultTab = 'quick-easy';

carousel = function () {

	$('#salad-ideas-swatch a').click(function () {
		this.blur();
	});
	
	$('.salad-idea-content').each(function () {
		$(this).css({
			paddingTop: Math.max(0, (130 - $(this).height()) / 2)
		});
	});
	
	$('.salad-idea').css({width: '517px'});

	stepcarousel.setup({
		galleryid: 'salad-ideas-carousel', //id of carousel DIV
		beltclass: 'salad-ideas-carousel-belt', //class of inner "belt" DIV containing all the panel DIVs
		panelclass: 'salad-idea', //class of panel DIVs each holding content
		autostep: {enable:false},
		panelbehavior: {speed:500, wraparound:true, persist:true},
		defaultbuttons: {enable: false},
		statusvars: ['dipstart', 'diplast', 'diptotal'],
		contenttype: ['inline'],
		onslide: function () {
			var thumbs = $('#salad-ideas-swatch div');
			thumbs.removeClass('current');
			$(thumbs[dipstart-1]).addClass('current');
		}
	});
};

rename = function () {
	$('.salads-tab').each(function () {
		this.id = prefix + this.id;
	});
};
	

// set up tabs
$(function () {
	
	var pick,
		tabs,
		panes,
		init,
		height,
		fragment;
		
	init = function () {
		tabs = {};
		panes = {};
		height = 0;

		// set up each tab
		$('.salads-tab-hotspot').each(function () {
			var key;
			
			// remove the prefix added inline
			key = this.parentNode.id.replace(prefix, '');
			
			// keep the tab and the pane for picking later
			tabs[key] = this;
			panes[key] = this.parentNode;
			
			// transplant the tab
			this.parentNode.removeChild(this);
			$('#salads-tabs').append(this);
			
			// make it clickable
			$(this).click(function () {
				pick(key);
			})
		});

		// size tab images here because Safari doesn't obey height in css file
		// until after the height-equalizing code below is finished.
		$('.salads-tab-thumb').css({
			height: 100,
			lineHeight: 0,
			paddingBottom: '.5em'
		});

		// equalize tab height
		$('.salads-tab-hotspot-inner').each(function () {
			height = Math.max(height, $(this).height());
		});
		$('.salads-tab-hotspot-inner').height(height);
		
		// pick the tab from the url fragment
		pick(fragment(window.location.href));

	};

	fragment = function (url) {
		var hash;
		hash = url.split('#');
		return hash[1] || defaultTab;
	};
	
	pick = function (key) {
		// select the tab
		$('.salads-tab-hotspot').addClass('hidden');
		$(tabs[key]).removeClass('hidden');
		
		// select the pane
		$('.salads-tab').css({display: 'none'});
		$(panes[key]).css({display: 'block'});
		
		// set the hash
		window.location.href = '#' + key;
		
		// track the event
		jsTrack.trackEvent('summer-salads-' + key);
	};

	init();


});