$(document).ready(function()
{
	// Woordbox altijd verbergen als er ergens in de pagina wordt geklikt
	$('body').click(function()
	{
		$('#wordbox_container').slideUp('fast');
	});
	
	// Vaste variabelen (niet aanpassen)
	var searching = false;
	var search = '';
	var selected_word = '';
	$('#dictionary_input_text').val('');


	// Woord vertalen (klik op 'Vertaal' button)
	$('#translate_button').click(function()
	{
		var inputword = $('#dictionary_input_text').val();
		var language = $("input:radio[@name=translate_type]:checked").val();
		
		if(inputword == '') return false;
		if(language == '') language = nl_fr;
		
		$('#wordbox_container').slideUp('fast');
		
		$.ajax(
		{
			type: "GET",
			url: "http://www.hallofryslan.nl/misc/dictionary/ajax_translate.php",
			data: "word=" + inputword + "&lang=" + language,
			success: function(msg)
			{
				$('#translation_container').html(msg);
				$('#translation_container').slideDown();
			}
		});
	});


	// Toetsenbord events
	$('#dictionary_input_text').keyup(function(e)
	{
		var key = e.charCode ? e.charCode : e.keyCode ? e.keyCode : 0;
		
		if(key == 13) // Enter toets
		{
			if( $('#wordbox_container').css('display') == 'block')
			{
				if(selected_word == '') $('#translate_button').trigger('click'); 	// Niks doen met de woordenlijst, het ingevoerde woord direct vertalen
				else $('.wordbox_word').trigger('click'); 							// Lijst verbergen, en woord vervangen
			}
			else $('#translate_button').trigger('click'); 							// Vertalen
		}
		else
		{
			// Woorden lijst ophalen en weergeven (na een halve seconde)
			var inputword = $('#dictionary_input_text').val();
			appendSearchBox( inputword );
		}
	});


	// Als de gebruiker iets heeft geypt, dan even wachten voordat er een ajax request gedaan wordt (het ingetypte woord meegeven)
	function appendSearchBox(search)
	{
		if(searching == false)
		{
			this.search = search;
			searching = true;
			setTimeout(checkWord, 100);
		}
	}


	// Het woord wat op dit moment in het input veld staat controleren met het woord uit het geheugen
	// Zijn de woorden gelijk? Dan het woord opzoeken met ajax, en in een dropdown weergeven
	function checkWord()
	{
		searching = false;
		var inputword = $('#dictionary_input_text').val();
		if(search != inputword)
		{
			search = inputword;
			appendSearchBox(inputword);
		}
		else
		{
			// De woorden zijn gelijk, nu de woorden ophalen met ajax en laten zien in een dropdown
			var inputword = $('#dictionary_input_text').val();
			var language = $("input:radio[@name=translate_type]:checked").val();
			if(language == '') language = nl_fr;
			if(inputword == '')
			{
				$('#wordbox_container').slideUp('fast');
				return false;
			}
			$('#wordbox_loader').css('display','block');
			$('#wordbox_content').css('display','none');
			$('#wordbox_container').slideDown('fast');

			$.ajax(
			{
				type: "GET",
				url: "http://www.hallofryslan.nl/misc/dictionary/ajax_findwords.php",
				data: "word=" + inputword + "&lang=" + language,
				success: function(msg)
				{
					$('#wordbox_content').html(msg);
					$('#wordbox_loader').css('display','none');
					$('#wordbox_content').css('display','block');
				}
			});
			selected_word = '';
		}
		
	}


	// Een klik op een woord in de woord-dropdown lijst
	$('.wordbox_word').live('click', function()
	{
		$('#dictionary_input_text').val( $(this).html()	);
		$('#wordbox_container').slideUp('fast');
	});


	// Visuele effecten van de woord-dropdown lijst
	$('.wordbox_word').live('mouseover', function()
	{
		$(this).addClass('word_selected');
		selected_word = $(this).attr('id');
	});
	$('.wordbox_word').live('mouseout', function()
	{
		$(this).removeClass('word_selected');
	});


	// Een klik op het input veld
	$('#dictionary_input_text').live('click', function()
	{
		$('#dictionary_input_text').trigger('keyup');
	});


	// Pagina nummer aanklikken
	$('.translate_page').live('click', function()
	{
		$('.translations').each(function()
		{
			$(this).css('display','none');
		});
		$('.translate_page').each(function()
		{
			$(this).removeClass('page_active');
		});
		$('#translation_' + $(this).attr('id') ).css('display','block');
		$(this).addClass('page_active');
	});


	// Pagina nummers: visuele effecten
	$('.translate_page').live('mouseover', function()
	{
		$(this).addClass('page_selected');
	});
	$('.translate_page').live('mouseout', function()
	{
		$(this).removeClass('page_selected');
	});


});
