$(document).ready(function(){
	/* The following code is executed once the DOM is loaded */
	var i = 0;
	
	$('.animate_flip').bind("click",function(){
		
		
		// Create a class of 'flip' + i in order to recall the previous div that was flipped.
		// Increment i so that each div has a unique class
		i++;
		
		// Store current div that has been flipped
		// $(this) point to the clicked .sponsorFlip element (caching it in elem for speed):
		var elem = $(this);
		
		
		// Check to see if this is the same div or a different div being flipped
		// If this is the same div, revert flip current div, reset i to 0 and do not add new class to this div thus resetting to the orignal state.
		// data('flipped') is a flag we set when we flip the element:
		if (elem.hasClass('flip' + (i-1)))
		{
			elem.removeClass('flip' + (i-1));
			elem.revertFlip();
			elem.data('flipped',false);
			i = 0;
		
		} else 
		{
			
			// If this is a new div being flipped, revert flip previous div, clear class, add new unique class to the current div
			elem.addClass('flip' + i);
			var elemClass = ".flip" + (i-1);
			
			if(i > 1)
			{
				$(elemClass).revertFlip();
				$(elemClass).data('flipped',false);
				$(elemClass).removeClass('flip' + (i-1));
			}
		}
		
		// Using the flip method defined by the plugin:
		
		elem.flip({
			direction:'lr',
			speed: 200,
			color: 'white',
			onBefore: function(){
				
				// Insert the contents of the .sponsorData div (hidden from view with display:none)
				// into the clicked .sponsorFlip div before the flipping animation starts:
				
				elem.html(elem.siblings('.flipData').html());
				},
			});
			
			// Setting the flag:
			elem.data('flipped',true);
		});
	
});

function stopFlip(e) 
{
	if (!e) var e = window.event;
	e.cancelBubble = true;
	if (e.stopPropagation) e.stopPropagation();
}	

