var partyfoods;

$(function () {
	var widget, duration, minHeight;
	duration = 6000;
	minHeight = 40;
	widget = new Slippy({
		container: '#partyfoods-messageboard-pizza',
		item: '#partyfoods-messageboard-pizza li',
		duration: duration,
		minHeight: minHeight
	});
	widget = new Slippy({
		container: '#partyfoods-messageboard-finger',
		item: '#partyfoods-messageboard-finger li',
		duration: duration,
		minHeight: minHeight
	});
	widget = new Slippy({
		container: '#partyfoods-messageboard-wings',
		item: '#partyfoods-messageboard-wings li',
		duration: duration,
		minHeight: minHeight
	});
	widget = new Slippy({
		container: '#partyfoods-messageboard-chili',
		item: '#partyfoods-messageboard-chili li',
		duration: duration,
		minHeight: minHeight
	});
	widget = new Slippy({
		container: '#partyfoods-messageboard-dips',
		item: '#partyfoods-messageboard-dips li',
		duration: duration,
		minHeight: minHeight
	});

	$('.messageboard-widget-wide-what, .messageboard-widget-wide-talk').each(function () {
		$(this).css({
			paddingTop: ($(this.parentNode).height() - $(this).height()) / 2
		});
	});
});


$(function () {

	var fadetime, hash, fragment, track;
	
	fadetime = 300;
	
	// set the fragment value during interaction
	fragment = function (key) {
		location.href = '#' + key;
	};
	
	// set the fragment and track the event
	track = function (key) {
		fragment(key);
		jsTrack.trackEvent('game-day-party-menu-' + key);
	};

	// read the initial fragment value
	hash = window.location.href.split('#')[1];
	if (hash) {
		hash = hash.toLowerCase();
		if (hash !== 'play') {
			track(hash);
		}
	}

	partyfoods = new Zing({
		container: '#partyfoods-body',
		
		// Start automatically unless direct linked.
		autoPlay: !hash || hash.toLowerCase() === 'play',
		
		// Use the class "partyfoods-current" for the current nav node instead of "current".
		currentClass: 'partyfoods-current',
		
		// When playing, stay on each pane for five seconds instead of ten.
		duration: 5000,
		
		// Set the initial tab
		startAt: (hash && $('#partyfoods-' + hash).hasClass('zing-pane')) ? hash : null,

		// Shared transitions that are applied to all panes:
		transitions: {
			show: function (callback) {
				// Fade in from zero to full opacity.
				$(this.pane).css({
					opacity: 0
				}).animate({
					opacity: 1
				}, fadetime, callback);
				
				// keep track externally which tab is selected
				current = this.name;
			},
			hide: function (callback) {
				// Fade out from full opacity to zero.
				$(this.pane).css({
					opacity: 1
				}).animate({
					opacity: 0
				}, fadetime, callback);
			}
		},
		
		// The pane-to-tab associations.
		panes: {
			'pizza': {
				tab: '#partyfoods-pizza-tab',
				pane: '#partyfoods-pizza'
			},
			'finger': {
				tab: '#partyfoods-finger-tab',
				pane: '#partyfoods-finger'
			},
			'wings': {
				tab: '#partyfoods-wings-tab',
				pane: '#partyfoods-wings'
			},
			'chili': {
				tab: '#partyfoods-chili-tab',
				pane: '#partyfoods-chili'
			},
			'dips': {
				tab: '#partyfoods-dips-tab',
				pane: '#partyfoods-dips'
			}
		}
	});
	
	// Update the fragment when a pane is clicked.
	$('#partyfoods-panes .zing-pane').click(function () {
		partyfoods.pause();
		fragment(current);
	});

	// Update the fragment when a tab is clicked.
	$('.partyfoods-tab').click(function () {
		if ($(this).hasClass('zing-play')) {
			fragment('play');
		} else {
			setTimeout(function () {
				var key = partyfoods.which();
				track(key);
				if (eyeblaster_JSEvent) {
					eyeblaster_JSEvent(key);
				}
			}, 0);
		}
	});

});