<input name ="username" type =" text " placeholder =" username ">
<input name ="guess" type =" text ">
<input id ="guess" type =" button " value =" Guess ">

<script >

 //GIVEN CODE
 var secret = Math . floor (( Math . random () * 100) + 1) ; // generates random number
 var tries = 0;
 //GIVEN CODE
 console.log(secret);

 //GUESS BUTTON CLICK
 let guessBtn = document.querySelector('input#guess');
 guessBtn.addEventListener('click', function(){

		let guess = document.querySelector('input[name=guess]').value;
		let alertMsg;

		if(guess < secret)
			alertMsg = 'go up';
		else alertMsg = 'go down';

		//correct -> AJAX REQUEST ( b) ) + popup 'correct'
		if(guess == secret){
			alertMsg = 'correct';

			let user = document.querySelector('input[name=username]').value;

			let ajaxRequest = new XMLHttpRequest();
			ajaxRequest.addEventListener('load', ajaxHandler);
			ajaxRequest.open('POST', 'save_score.php', true);
			ajaxRequest.setRequestHeader('Content-Type', 'application/xx-ww-urlencoded');
			ajaxRequest.send('username=' + encodeURIComponent(user) + '&tries=' + encodeURIComponent(tries));
		}

		tries++;
		alert(alertMsg);
	});


 //AJAX REQUEST

  function ajaxHandler(){
	let successful = this.responseText;

	if(successful)
		alert('Successfully saved your score!');
	else alert('Failed to save your score, sorry!');
  }




</script >