JS Advanced Exam - 19 December 2018

function dart() {

	$(`#firstLayer`).on(`click`, onShootAction)


	let dictionary = {
		firstLayer: 1,
		secondLayer: 2,
		thirdLayer: 3,
		fourthLayer: 4,
		fifthLayer: 5,
		sixthLayer: 6
	}

	let isHome = true;
	let $firstPlayerScore = $(`#home p:nth-child(1)`);
	let $secondPLayerScore = $(`#away p:nth-child(1)`);

	let $scoreboard = $(`#scoreBoard table tbody`);

	let $turns = $(`#turns`);
	let $firstTurn = $turns.children(`:nth-child(1)`);
	let $secondTurn = $turns.children(`:nth-child(2)`);

	function onShootAction(e) {
		let currentValue = getValue(e);
		let $currentScore;

		if (isHome) {
			$currentScore = Number($firstPlayerScore.text()) + currentValue;
			$firstPlayerScore.text($currentScore);

		} else {
			$currentScore = Number($secondPLayerScore.text()) + currentValue;
			$secondPLayerScore.text($currentScore);

		}


		checkForWinner($currentScore);
		isHome = !isHome;
		switchTurns(isHome);

	}

	function getValue(e) {
		let currentIdOfDiv = e.target.id;
		let indexOfTr = dictionary[currentIdOfDiv];
		let currentTr = $scoreboard.children(`:nth-child(${indexOfTr})`);
		let value = Number(currentTr.children(`:nth-child(2)`).text()
			.split(` `)[0]);
		return value;
	}

	function checkForWinner(currentScore) {

		if (currentScore >= 100) {

			let $home = $(`#Home`).children(`:nth-child(2)`)
			let $away = $(`#Away`).children(`:nth-child(2)`)


			$(`#firstLayer`).off(`click`)

			if (isHome) { // home is winning
				$home.css(`background`, `green`)
				$away.css(`background`, `red`)
			} else { //away is winning
				$away.css(`background`, `green`)
				$home.css(`background`, `red`)

			}

			//	just for testing...
			// let homeScoree = $("#Home").find("p").text();
			// let awayScoreee = $("#Away").find("p").text();
			// console.log(homeScoree);
			// console.log(awayScoreee);
		}
	}

	function switchTurns(isHome) {
		//mistake here with the turns... made it home/away.. :(
		//mistake => had to check the css , on how to change the multiple css selectors
		let turnOn = `Turn on `
		let nextIs = `Next is `
		let home = `Home`;
		let away = `Away`;

		if (isHome) {

			$firstTurn.text(turnOn + home);
			$secondTurn.text(nextIs + away);
			// $firstTurn.css({ "textDecoration": "underline", "fontWeight": "bold" })
			// $secondTurn.css({ "textDecoration": "none", "fontWeight": "normal" })
		} else {

			$secondTurn.text(nextIs + home);
			$firstTurn.text(turnOn + away);
			// $firstTurn.css({ "textDecoration": "none", "fontWeight": "normal" })
			// $secondTurn.css({ "textDecoration": "underline", "fontWeight": "bold" })
		}


	}

}