$(document).ready(function() {

	/****** CONFIGURATION ***********/
	var max_questions = 15;
	var max_chrono = 5;
	var max_wait = 2;
	var max_infinite_errors = 5;
	/********************************/

	/****** General variables ******/	
	var questions = 0;
	var good_answers = 0;
	var bad_answers = 0;
	var chrono = max_chrono;
	var infinite = false;		// type of game
	var whole_set = false;		// type of game
	var image_name;				// preload
	var image_memory;			// preload
	var gen_list = new Array();
	var available_pokemon = new Array();
	var domain = "https://poketest.marchal.dev/index.html"; 

	/****** Generations ******/
	var G1 		= [1, 151];
	var G2 		= [152, 251];
	var G3 		= [252, 386];
	var G4 		= [387, 493];
	var G5 		= [494, 649];
	var G6 		= [650, 721];
	var G7 		= [722, 809];
	var G8		= [810, 905];
	var G9		= [906, 1025];
	var MEGA 	= [1026, 1075]; 
	var GIGA	= [1076, 1107];
	var REG		= [1108, 1162];
	var gen_number = 9;
	var extra_number = 3; // mega, giga, reg

	/************ UTIL *************/
	/*******************************/

	function random(min, max)
	{
		return Math.floor(Math.random()*(max-min+1)+min);
	}

	function shuffleArray(array)
	{
		for (var i = array.length - 1; i > 0; i--) {
			var j = Math.floor(Math.random() * (i + 1));
			var temp = array[i];
			array[i] = array[j];
			array[j] = temp;
		}
		return array;
	}

	function findInArray(array, elem)
	{
		for (var j = 0; j < array.length; j++) {
			if (array[j] === elem)
				return true;
		}
		return false;
	}

	function normalizeString(string)
	{
		return string.toLowerCase().normalize('NFD').replace(/[\u0300-\u036f]/g, "");
	}


	/************ GAME *************/
	/*******************************/

	// loading json file
	$.getJSON('pokemon.json', function(pk)
	{
		var pklist = pk;
		var pokemon_generation_list = new Array();

		// starting the game for the first time and creating the layout
		function firstGame()
		{
			$('article #game').fadeToggle('quick', function()
			{
				document.removeEventListener('keydown', funcListener);
				$('article #container').append('<div id="score"><div id="top_game"><h1 class="whois"></h1><h1 class="chrono"></h1></div></div>');
				$('article #container #score').append('<p class="pokemon"></p><div id="answers"></div>');
				generations();
				max_chrono = $('article select.time option:selected').attr('id');
				max_questions = $('article select.questions option:selected').attr('id');
				if (max_questions == "infinite") infinite = true;
				if (max_questions == "set")
				{
					whole_set = true;
					// if it's not all generation, we check list of available pokemons
					if (pokemon_generation_list.length > 0)
						max_questions = pokemon_generation_list.length;
					else // else, it's all the generation, from the first one to the regional forms
						max_questions = REG[1] + 1;
				}
				answertype = $('article input[name="answertype"]:checked').attr('id');
				game();
			});
		}

		// allows to start the game when pressing enter
		document.addEventListener('keydown', funcListener = function(event)
		{
			if (event.keyCode == 13) // press enter
				firstGame();
		});

		// start the game when clicking on start game
		$('article #container .button input.start').click(function() 
		{
			firstGame();
		});

		function generations()
		{
			// create the list of the different generations
			function createGenerationList(name)
			{
				if ( $('article input[name="'+name+'"]').is(':checked') )
					gen_list[gen_list.length] = name;
			}

			// create the list of all possible pokemons for selected options
			function generatePokemonList()
			{
				function evaluateByGeneration(index, name, variable)
				{
					if (gen_list[index] == name)
					{
						for (j = (variable[0] - 1); j <= (variable[1] - 1); j++)
							pokemon_generation_list[pokemon_generation_list.length] = j;
					}
				}

				if (gen_list.length > 0)
				{
					for (i in gen_list)
					{
						evaluateByGeneration(i, "1g", G1); evaluateByGeneration(i, "2g", G2); evaluateByGeneration(i, "3g", G3);
						evaluateByGeneration(i, "4g", G4); evaluateByGeneration(i, "5g", G5); evaluateByGeneration(i, "6g", G6);
						evaluateByGeneration(i, "7g", G7); evaluateByGeneration(i, "8g", G8); evaluateByGeneration(i, "9g", G9);
						evaluateByGeneration(i, "mega", MEGA); evaluateByGeneration(i, "gigantamax", GIGA); evaluateByGeneration(i, "regional", REG); 
					}
				}
			}

			// we parse the list of generation, then check if there are other forms
			if ( $('article input[name="gen"]:checked').attr('id') === "all" )
			{
				gen_list.push("1g"); gen_list.push("2g"); gen_list.push("3g"); gen_list.push("4g"); gen_list.push("5g");
				gen_list.push("6g"); gen_list.push("7g"); gen_list.push("8g"); gen_list.push("9g");
				gen_list.push("mega"); gen_list.push("gigantamax"); gen_list.push("regional");
				generatePokemonList();
			}
			else
			{
				for (i = 1; i <= gen_number; i++)
					createGenerationList((i + "g"));
				createGenerationList("mega");
				createGenerationList("gigantamax");
				createGenerationList("regional");
				generatePokemonList();
			}
			available_pokemon = [...pokemon_generation_list];
			max_questions = pokemon_generation_list.length;
		}

		// multiple artworks
		function imageType(result)
		{
			function randomizer(result)
			{
				if (pk.mn[result]["sprite"])
					return pklist.mn[result]["num"] + '-' + random(0, pk.mn[result]["sprite"] - 1);
				else
				{
					if (pk.mn[result]["origin"] == "Kanto")
					{
						randomValue = random(0, 2);
						if (randomValue == 0)
							return pklist.mn[result]["num"];
						else if (randomValue == 1)
							return pklist.mn[result]["num"]+'-RB';
						else if (randomValue == 2)
							return pklist.mn[result]["num"]+'-RG';
					}
					return pklist.mn[result]["num"];
				}
			}
			image_name = randomizer(result);
			image_memory = new Image();
			image_memory.src = 'pokemon/' + image_name + '.png';
			return image_name;
		}

		function recursiveOptions(options, lang)
		{
			tmp = pokemon_generation_list[random(0, pokemon_generation_list.length - 1)];

			// checking if it's already there, if it is, recursion
			if (!findInArray(options, pklist.mn[tmp][lang]))
				return pklist.mn[tmp][lang];
			else
				return recursiveOptions(options, lang);
		}

		// choosing the four options
		function chooseOptions(result, lang)
		{
			options = new Array();
			options[0] = pklist.mn[result][lang];
			for (var i = 1; i < 4; i++)
				options[i] = recursiveOptions(options, lang);
			options = shuffleArray(options);
		}

		function choosePokemon()
		{
			lang = $('article select.lang option:selected').attr('id');
			silhouette = $('article input[name="silhouette"]:checked').attr('id');

			resultIndex = Math.floor((available_pokemon.length - 1) * Math.random());
			result = available_pokemon[resultIndex];

			if (!infinite)
				available_pokemon.splice(resultIndex, 1);

			answer = pklist.mn[result][lang];
			
			if (answertype == "choice")
				chooseOptions(result, lang);
			imageType(result);
		}

		function game()
		{
			choosePokemon();
			questions++;
			chrono = max_chrono;
			$('article #container').addClass('game_active');
			$('article #container #share').remove();
			$('article #container #seed').remove();
			$('article #container #copyseed').remove();
			if (chrono != "notimer")
				$('article #container .chrono').empty().append(chrono);
			else
				$('article #container .chrono').hide();
			$('article #container .whois').empty().append("Who's that Pokémon? " + (!infinite? " (" + questions + "/" + max_questions + ")" : ""));
			$('article #container .pokemon').empty().append('<img src="pokemon/' + image_name + '.png" class="' + (silhouette) + ' ' + (answertype) + '" />');
			
			if (answertype == "choice")
			{
				$('article #container #answers').empty().append('<span><input type="submit" class="option a1" name="a1" value="' + options[0] + '"></span>');
				$('article #container #answers').append('<span><input type="submit" class="option a2" name="a2" value="' + options[1] + '"></span>');
				$('article #container #answers').append('<span><input type="submit" class="option a3" name="a3" value="' + options[2] + '"></span>');
				$('article #container #answers').append('<span><input type="submit" class="option a4" name="a4" value="' + options[3] + '"></span>');
			}
			else
			{
				$('article #container #answers').empty().append('<form autocomplete="off"><input type="text" id="answer" name="answer" placeholder="Input the Pokémon name!"\
																class="choice"><p class="button"><input type="submit" value="Answer!"></p></form>');
				$('article #container #answers input').focus().select();
			}

			// timer setting
			var clock = setInterval(function()
			{
				chrono--;
				if (chrono === 0)
				{
					clearInterval(clock);
					showAnswer(false); // timer has ended, so it's a bad answer
				}
				$('article #container .chrono').empty().append(chrono);
			}, 1000);

			// checking if the answer is good or not
			$('article .option').click(function()
			{
				clearInterval(clock);
				($(this).attr('value') == answer) ? showAnswer(true) : showAnswer(false);
			});
			
			if (answertype == "choice")
			{
				document.addEventListener('keydown', funcListener = function(event)
				{
					function checkAnswer(v)
					{
						clearInterval(clock);
						($('#answers input.a'+v).attr('value') == answer) ? showAnswer(true) : showAnswer(false);
					}
					if 		(event.keyCode == 49 || event.keyCode == 72) 	checkAnswer(1);
					else if (event.keyCode == 50 || event.keyCode == 74) 	checkAnswer(2);
					else if (event.keyCode == 51 || event.keyCode == 75)	checkAnswer(3);
					else if (event.keyCode == 52 || event.keyCode == 76)	checkAnswer(4);
				});
			}
			else
			{
				$("form").submit(function(event)
				{
					clearInterval(clock);
					pokemon_name = event.currentTarget[0].value;
					event.preventDefault(); // do not submit form
					if (normalizeString(answer) == normalizeString(pokemon_name))
						showAnswer(true);
					else
						showAnswer(false);
				});
			}

			function showAnswer(ok)
			{
				document.removeEventListener('keydown', funcListener);
				$('article .pokemon img').removeClass('silhouette');
				if (ok)
				{
					good_answers++;
					$('article #answers').empty().append("<p class=\"final_answer\"><span class=\"good\">That's right!</span> \
															The answer is <strong>"+ answer +"</strong>!</p>");
				}
				else
				{
					bad_answers++;
					$('article #answers').empty().append("<p class=\"final_answer\"><span class=\"bad\">Too bad...</span> \
															The answer was <strong>"+ answer +"</strong>!</p>");
				}
				var wait = max_wait;
				clock = setInterval(function()
				{
					wait--;
					if (wait === 0) {
						if (!infinite)	questions < max_questions ? game() : score();
						else			bad_answers < max_infinite_errors ? game() : score();
					}
				}, 1000);
			}

			function score()
			{
				function generateSeed()
				{
					gen = '';
					if (gen_list.length < (gen_number + extra_number))
					{
						for (i in gen_list)
							gen += gen_list[i].substring(0,1);
					}
					else gen += "all";

					s_gen = "?gen=" + gen;
					s_lang = "&lang=" + lang;
					s_answertype = "&answertype=" + answertype;
					s_silhouette = "&silhouette=" + (silhouette == "silhouette" ? "true" : "false");
					s_questions = "&questions=" + (!whole_set? max_questions : "set");
					s_time = "&time=" + max_chrono;

					// save in the local storage for default use
					localStorage.setItem('generation', gen);
					localStorage.setItem('lang', lang);
					localStorage.setItem('answertype', answertype);
					localStorage.setItem('silhouette', silhouette);
					localStorage.setItem('questions', (!whole_set? max_questions : "set"));
					localStorage.setItem('time', max_chrono);

					return domain + s_gen + s_lang + s_answertype + s_silhouette + s_questions + s_time;
				}

				$('article #container #score .pokemon').empty().after('<div id="seed"></div><div id="share"></div>');
				$('article #container').addClass('diploma');
				$('article #container').removeClass('game_active');
				$('article #container .chrono').hide();
				if (!infinite)
					$('article #container .pokemon').empty().append("<p class=\"score-text\">Score: <strong>"+(Math.floor(good_answers/max_questions*100))+"%</strong></p>");
				else
					$('article #container .pokemon').empty().append("<p class=\"score-text\">Score: <strong>"+good_answers+" good answer"+(good_answers>1?("s"):"")+"!</strong></p>");
				
				$('article #container #seed').empty().append('<p style="margin:0px;">Share your configuration</p><input type="text" name="seed" value="'+
																generateSeed()+'">');
				$('article #container #share').empty().append('<div id="copyseed"><a href="#">Copy</a></div>');
				$('article #container #answers').empty().append('<p class="button"><input type="submit" \
																class="start_again" name="start_again" value="Play again!"></p>');
								
				// copy seed in clipboard
				$("article #container #copyseed").click(function()
				{
					$('article #container #seed input').select();
					navigator.clipboard.writeText($('article #container #seed input').val());
				});

				$('article #container .button input.start_again').click(function()
				{
					score = questions = good_answers = bad_answers = 0;
					chrono = max_chrono;
					$('article #container .chrono').show();
					$('article #container').removeClass('diploma');
					$('article #container').addClass('game_active');
					game();
				});
			}
		}
	});
});