$(document).ready(function() {
	$('.flashcards').each(function() {
		var current = this;
		initFlashCards(current);
		
		$('.startbutton', current).click(function() {
			startFlashCards(current);
		});
		
		$('.restartbutton', current).click(function() {
			initFlashCards(current);
		});
		
		$('img.previousbutton', current).mouseover(function() {
			this.src = "_include/images/PrevMO.jpg"; 
		});
		
		$('img.previousbutton', current).mouseout(function() {
			this.src = "_include/images/PrevRst.jpg"; 
		});
		
		$('img.nextbutton', current).mouseover(function() {
			this.src = "_include/images/NextMO.jpg"; 
		});
		
		$('img.nextbutton', current).mouseout(function() {
			this.src = "_include/images/NextRst.jpg";
		});
	});	
});

function initFlashCards(flashCardsDiv)
{	
	$('div.startscreen', flashCardsDiv).show();
	$('div.flashcardwrapper', flashCardsDiv).hide();
}

function startFlashCards(flashCardsDiv)
{	
	//flashCardMaxCount is used when not all flashcards need to be displayed
	//if flashCardMaxCount is set, a random selection of flashCardMaxCount cards is selected to be displayed
	//otherwise all flashcards will be displayed
	var flashCardMaxCount = $(flashCardsDiv).attr('count');
	if (!flashCardMaxCount) { flashCardMaxCount = 0; }
	
	var flashCards = [];
	$('div.flashcard', flashCardsDiv).each(function() { flashCards.push($(this).attr('id')) });	
	var flashCardCount = $(flashCards).size();
	
	if (flashCardMaxCount > 0)
	{
		//randomize array and select flashCardMaxCount flashcards
		flashCards.randomize();

		while ($(flashCards).size() > flashCardMaxCount)
		{
			flashCards.pop();
		}
	}
	
	//store selected flashcards
	$(flashCardsDiv).data('selectedflashcards', flashCards);
	
	//hide the startscreen and show the flashcards
	$('div.startscreen', flashCardsDiv).hide();
	$('div.flashcardwrapper', flashCardsDiv).show();
	
	//determine mode: show questions or show answers
	var mode = $('[name=mode]:checked', flashCardsDiv).val();
	
	//show the first flashcard
	showFlashCard(flashCardsDiv, flashCards[0], mode == 'questionside');
}

function showFlashCard(flashCardsDiv, flashCardId, showQuestion)
{	
	//loop over all flashcards
	//show one flashcard and hide the others
	$('div.flashcard', flashCardsDiv).each(function() {
		var current = this;
		
		//only show the flashcard with id = flashCardId, hide all other flashcards
		if (current.id == flashCardId) 
		{
			//show flashcard with id = 'flashCardId'
			$(current).show();
			
			//set event handler for the turn button
			$(current).unbind('click');
			$(current).click(function() {
				turnFlashCard(flashCardsDiv, current.id);
			}).css('cursor','pointer');
			
			//show question or answer depending on the value of 'showQuestion'
			if (showQuestion)
			{
				$('div.questionside', current).show();
				$('div.answerside', current).hide();
			}
			else
			{
				$('div.questionside', current).hide();
				$('div.answerside', current).show();
			}
			
			//set event handlers for next and previous buttons
			var prevId = getPreviousFlashCardId(flashCardsDiv, flashCardId);
			
			if (prevId)
			{
				$('.previousbutton', flashCardsDiv).show();
				$('.previousbutton', flashCardsDiv).unbind('click');
				$('.previousbutton', flashCardsDiv).click(function() {
					showFlashCard(flashCardsDiv, prevId, showQuestion);
				});
			}
			else
			{
				$('.previousbutton', flashCardsDiv).hide();
			}
			
			var nextId = getNextFlashCardId(flashCardsDiv, flashCardId);
			$('.nextbutton', flashCardsDiv).unbind('click');
			$('.nextbutton', flashCardsDiv).click(function() {
				showFlashCard(flashCardsDiv, nextId, showQuestion);
			});
		} 
		else
		{
			//hide all other cards
			$('.turnbutton', current).unbind('click');
			$(current).hide();
		}		
	});
	
	//update flashcard numbering
	$('.currentcard', flashCardsDiv).text(getFlashCardIndex(flashCardsDiv, flashCardId));
	$('.totalcards', flashCardsDiv).text(getTotalFlashCardCount(flashCardsDiv));
}

function turnFlashCard(flashCardsDiv, flashCardId)
{
	if ($('#' + flashCardId + ' div.questionside', flashCardsDiv).is(':hidden'))
	{
		//show question and hide answer
		$('#' + flashCardId + ' div.answerside', flashCardsDiv).hide('fast', function() {
			$('#' + flashCardId + ' div.questionside', flashCardsDiv).show('fast');
		});
		
	}
	else
	{
		//show answer and hide question
		$('#' + flashCardId + ' div.questionside', flashCardsDiv).hide('fast', function() {
			$('#' + flashCardId + ' div.answerside', flashCardsDiv).show('fast');
		});
	}
}

function getPreviousFlashCardId(flashCardsDiv, flashCardId)
{
	var flashCards = $(flashCardsDiv).data('selectedflashcards');
	var flashCardIndex = $.inArray(flashCardId, flashCards);
	if (flashCardIndex > 0)
	{
		return flashCards[flashCardIndex - 1];
	}
	else
	{
		return undefined;
	}
}

function getNextFlashCardId(flashCardsDiv, flashCardId)
{
	var flashCards = $(flashCardsDiv).data('selectedflashcards');
	var flashCardIndex = $.inArray(flashCardId, flashCards);
	if (flashCardIndex == ($(flashCards).size() - 1))
	{
		return flashCards[0];
	}
	else
	{
		return flashCards[flashCardIndex + 1];
	}
}

function getTotalFlashCardCount(flashCardsDiv)
{
	var flashCards = $(flashCardsDiv).data('selectedflashcards');
	return $(flashCards).size();
}

function getFlashCardIndex(flashCardsDiv, flashCardId)
{
	var flashCards = $(flashCardsDiv).data('selectedflashcards');
	var flashCardIndex = $.inArray(flashCardId, flashCards);
	return flashCardIndex + 1;
}

function log(text)
{
	$('#console').append('<p>'+new Date()+' '+text+'</p>');
}