Mastermind_Full_withoutFaultsCorrected

<html>
<head>
<title>Project_Mastermind</title>
	<script>
		var kleuren = ['geel', 'groen', 'rood', 'blauw', 'oranje'];
		var arrayLengte = 5;

		var juisteCombinatieGeraden;

		function randomArrayItem(array)
		{
			var index = Math.floor(Math.random(kleuren) * array.length);
			return array[index];
		}

		function randomKleur()
		{
			return randomArrayItem(kleuren);
		}

		function randomKleurenCombinatie(aantal)
		{
			var result = [];

			for(var i = 0; i != aantal; i++)
			{
				result.push(randomKleur());
			}

			return result;
		}

		function arraySpeler()
		{
			var speler = [];

			for(var i = 0; i < arrayLengte; i++)
			{
				var invoerSpeler = prompt("Gelieve een kleur in te vullen. geel, groen, rood, blauw of oranje. stop om te stoppen!","");

				if (invoerSpeler === "stop")
				{
					canvasLeegMaken();
					stopMasterMind();
				}
				else if (invoerSpeler === "")
				{
					i--;
				}
				else
				{
				speler[i] = invoerSpeler;

				var ingegevenKleurSpeler = invoerSpeler;
				kleurenBundelaar(ingegevenKleurSpeler);
				}
			}

			return speler;
		}

		function vergelijking(computer, speler)
		{
			var arrayVergelijken = [];

			for(var i = 0; i < arrayLengte; i++)
			{
				if(computer[i] === speler[i])
				{
					arrayVergelijken.push("1");
				}
				else
				{
					arrayVergelijken.push("0");
				}
			}

			return arrayVergelijken;
		}

		function juisteAntwoorden(array)
		{
			var juisteTeller = 0;
			var fouteTeller = 0;
			var teller = 1;

			for(var i = 0; i < arrayLengte; i++)
			{
				if(array[i] === "1")
				{
					alert("Kleur nummer " + teller + " is juist");
					juisteTeller += 1;
				}
				else
				{
					alert("Kleur nummer " + teller + " is niet juist");
					fouteTeller += 1;
				}

				teller += 1;

			}

			return juisteTeller;
		}

		function startSpel()
		{
			var code = randomKleurenCombinatie(arrayLengte);
		    var spelGedaan = false;
			var pogingTeller = 0;
			var maximumAantalPogingen = 10;
			var vergelijkingArray;

			while(spelGedaan !== true && pogingTeller !== maximumAantalPogingen)
			{
				var a = arraySpeler();
				vergelijkingArray = vergelijking(code, a);

				var juisteAntwoordenSpeler = juisteAntwoorden(vergelijkingArray);

				if (juisteAntwoordenSpeler !== arrayLengte) {
				    pogingTeller += 1;
				    spelGedaan = false;
				}
				else
				{
					juisteCombinatieGeraden = "geraden";
				    spelGedaan = true;
				}
			}
		}

		function vraagNogEenKeer()
		{
			canvasLeegMaken();

			var x;
			var r = confirm("Druk op Ok als u nog een keer wilt spelen.");

			if (r === true)
			{
				x = true;
			}
			else
			{
				x = false;
			}

			return x;
		}

		function nieuwSpelStarten(antwoord)
		{
			var nieuwSpel = antwoord;

			while(nieuwSpel !== false)
			{
			    startSpel();

				if (juisteCombinatieGeraden === "geraden")
				{
					alert("U heeft de juiste kleurencombinatie geraden, proficiat!!!")
					canvasLeegMaken();
				}
				else
				{
					alert("U slaagde er niet in de juiste kleurenconbinatie te raden, probeer nog een keer")
				}

				nieuwSpel = vraagNogEenKeer();
			}
			alert("U stopte met spelen, tot volgende keer.");
		}

		function startMasterMind()
		{
			canvasLeegMaken();
			nieuwSpelStarten(true);
		}

		function stopMasterMind()
		{
			break;
		}


		//Hier begint de code van canvas;
		var yWaarde = 0;
		var xWaarde = 0;

		function tekenCirkel(x, y, kleur)
		{
			var c=document.getElementById("myCanvas");
			var ctx=c.getContext("2d");

			ctx.beginPath();

			var huidigeKleur = kleur;

			ctx.fillStyle = huidigeKleur;
			ctx.arc(x,y,40,0,2*Math.PI);
			ctx.fill();
		}

		function kleurenCirkelTellerX()
		{
			if (xWaarde === 0 || xWaarde === 450)
			{
				xWaarde = 50;
				return xWaarde;
			}
			else
			{
				xWaarde += 100;
				return xWaarde;
			}
		}

		function kleurenCirkelTellerY()
		{
			if (yWaarde === 0)
			{
				yWaarde = 50;
				return yWaarde;
			}
			else if (yWaarde <= 950 && xWaarde === 50)
			{
				yWaarde += 100;
				return yWaarde;
			}
			else
			{
				return yWaarde;
			}
		}

		function kleurCirkel(kleurVanSpeler)
		{
			var kleur = kleurVanSpeler;

			if(kleur === "geel")
			{
				return "FFFF00";
			}
			else if(kleur === "groen")
			{
				return "#00FF00";
			}
			else if(kleur === "rood")
			{
				return "#FF0000";
			}
			else if(kleur === "blauw")
			{
				return "#0000FF";
			}
			else if(kleur === "oranje")
			{
				return "#FF6600";
			}
		}

		function kleurenBundelaar(kleurSpelerArray)
		{
			var a = kleurSpelerArray;
			var kleurCode = kleurCirkel(a);
			var x = kleurenCirkelTellerX();
			var y = kleurenCirkelTellerY();
			tekenCirkel(x, y, kleurCode);
		}

		function canvasLeegMaken()
		{
			xWaarde = 0;
			yWaarde = 0;

			var c=document.getElementById("myCanvas");
			var ctx=c.getContext("2d");

			ctx.clearRect(0,0,500,1000);
		}
	</script>
</head>
<body>
<p>
<button onclick="startMasterMind()">start mastermind</button>
</p>
	<canvas id="myCanvas" width="500" height="1000">Your browser does not support the HTML5 canvas tag. Please use Chrome or Firefox.</canvas>
	<script>

	</script>
</body>
</html>