yuvrajkhosa/index.html

## index.html
<!DOCTYPE html>
<html lang="en" dir="ltr">
  <head>
    <meta charset="utf-8">
    <title></title>
  </head>
  <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css" integrity="sha384-MCw98/SFnGE8fJT3GXwEOngsV7Zt27NXFoaoApmYm81iuXoPkFOJwJ8ERdknLPMO" crossorigin="anonymous">
    <style>
    body{
      background-color: #66b3ff;
    }
    .center{
      text-align: center;
    }
    #inputBox{
      font-size: 36px;
      text-align: center;
      color: black;
      border: 0px solid;
      outline: none;
      background-color: #1a8cff;
      position: absolute;
      top: 50%;
      width: 100%;
    }
    #submitButton{
      background-color:  #e6b3ff;
      position: absolute;
      top: 56.5%;
    }
    .output{
      font-size: 24px;
      text-align: center;
      padding-top: 500px;
    }
  </style>
  <h1 id="headdie" class="display-1 center">Synonym Convert!</h1>
  <body>

  <input id="inputBox" autocomplete="off" placeholder="Input Text Here"></input>


    <button id = "submitButton" onclick="changeWord()" class = "btn btn-lg btn-block">Submit</button>
      <h2 id="heading2" class = "output"></h2>
    <script src = "index.js"></script>
    <script src = "splitSentence.js"></script>
  </body>
</html>

## index.js
var input = document.getElementById("inputBox");

// Execute a function when the user releases a key on the keyboard
input.addEventListener("keyup", function(event) {
  console.log("enter")
  // Cancel the default action, if needed
  event.preventDefault();
  // Number 13 is the "Enter" key on the keyboard
  if (event.keyCode === 13) {
    // Trigger the button element with a click
    document.getElementById("submitButton").click();
  }
});
var textField = document.getElementById("inputBox");
//const apiKey = '895e758a134696bde1f2f7d53736ca00';
const apiKey = '41ff355681b5a0c0590c2c6de7b992f7';
var sentenceArray = [];
var convertedWords = [];

async function changeWord(){//Wait for the array of converted words to come back because some take longer than others and we need them to be in the same order as before.
  sentenceArray = [];
  convertedWords = [];
  sentenceSplit(textField.value.toLowerCase());
  console.log(sentenceArray)

  var promise = new Promise((resolve, reject) => {
    console.log("Function")
    putInArray(sentenceArray)
    function putInArray(arr){

      if (arr.length == 0){
        resolve(convertedWords);
        return(convertedWords);//Recursion end.
        //return(Promise.resolve(convertedWords));
      }
      getPromise(arr[arr.length - 1])
        .then(result => {
          convertedWords.push(pickRandomWord(result));
          arr.pop()
          putInArray(arr);
        })
        .catch(err => {//Not a real words
          convertedWords.push(arr[arr.length - 1]);
          arr.pop()
          putInArray(arr)
        })
    }
  })
  var result = await promise;
  var finalSentence = "";
  for (i = 0; i < result.length; i++){
    //console.log(result[result.length - i - 1])
    finalSentence += result[result.length - i - 1] + " ";
  }
  console.log(finalSentence)
  document.getElementById("heading2").innerHTML = finalSentence;
}

function pickRandomWord(wordObject){
  var typeOfWord = Object.keys(wordObject);
  typeOfWord = Math.floor(Math.random() * typeOfWord.length);
  typeOfWord = Object.keys(wordObject)[typeOfWord];
  lengthOfSyns = Math.floor(Math.random() * (wordObject[typeOfWord]["syn"].length));
  return(wordObject[typeOfWord]["syn"][lengthOfSyns])
//  console.log(wordObject[Object.keys(wordObject)[typeOfWord]]);
}
//Cooler Way.
async function getPromise(word){
  const apiURL = (`http://words.bighugelabs.com/api/2/${apiKey}/${word}/json`);
  const result = await fetch(apiURL);//Will not exceed this line until fetch has retrieven promise.
  if(result.status != 200){
    return(Promise.reject("fakeWord"));
  }
  return(result.json());
}


/*function getPromise(word){
  const apiURL = (`http://words.bighugelabs.com/api/2/${apiKey}/${word}/json`);
  return(
    fetch(apiURL).then((response) =>{
      if (response.status != 200){//To make sure the API gave back a good response.
        console.log("Error in response!");
      }
      return(response.json())
    })
   .catch(err => console.log(err))
  )
}*/

## splitSentence.js
//Completly useless. Use join and trim, to clear whitespace.
var endSub;

function sentenceSplit(s){
  var i = 0;

  if(s == ""){
    //sentenceArray.push(s);
    return(sentenceArray);
  }

  while(s.charAt(i) == ' '){
    i++;
  }
  endSub = i;

  while(endSub < s.length){
    if(s.charAt(endSub) == ' '){
      sentenceArray.push(s.substring(i, endSub));
      break;
    }
    if(endSub == s.length - 1){
      sentenceArray.push(s.substring(i, endSub + 1));
      return(sentenceArray);
    }
    endSub++;
  }
  s = s.substring(endSub, s.length);
  return(sentenceSplit(s));
}
	<!DOCTYPE html>
	<html lang="en" dir="ltr">
	<head>
	<meta charset="utf-8">
	<title></title>
	</head>
	<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css" integrity="sha384-MCw98/SFnGE8fJT3GXwEOngsV7Zt27NXFoaoApmYm81iuXoPkFOJwJ8ERdknLPMO" crossorigin="anonymous">
	<style>
	body{
	background-color: #66b3ff;
	}
	.center{
	text-align: center;
	}
	#inputBox{
	font-size: 36px;
	text-align: center;
	color: black;
	border: 0px solid;
	outline: none;
	background-color: #1a8cff;
	position: absolute;
	top: 50%;
	width: 100%;
	}
	#submitButton{
	background-color: #e6b3ff;
	position: absolute;
	top: 56.5%;
	}
	.output{
	font-size: 24px;
	text-align: center;
	padding-top: 500px;
	}
	</style>
	<h1 id="headdie" class="display-1 center">Synonym Convert!</h1>
	<body>

	<input id="inputBox" autocomplete="off" placeholder="Input Text Here"></input>


	<button id = "submitButton" onclick="changeWord()" class = "btn btn-lg btn-block">Submit</button>
	<h2 id="heading2" class = "output"></h2>
	<script src = "index.js"></script>
	<script src = "splitSentence.js"></script>
	</body>
	</html>
	var input = document.getElementById("inputBox");

	// Execute a function when the user releases a key on the keyboard
	input.addEventListener("keyup", function(event) {
	console.log("enter")
	// Cancel the default action, if needed
	event.preventDefault();
	// Number 13 is the "Enter" key on the keyboard
	if (event.keyCode === 13) {
	// Trigger the button element with a click
	document.getElementById("submitButton").click();
	}
	});
	var textField = document.getElementById("inputBox");
	//const apiKey = '895e758a134696bde1f2f7d53736ca00';
	const apiKey = '41ff355681b5a0c0590c2c6de7b992f7';
	var sentenceArray = [];
	var convertedWords = [];

	async function changeWord(){//Wait for the array of converted words to come back because some take longer than others and we need them to be in the same order as before.
	sentenceArray = [];
	convertedWords = [];
	sentenceSplit(textField.value.toLowerCase());
	console.log(sentenceArray)

	var promise = new Promise((resolve, reject) => {
	console.log("Function")
	putInArray(sentenceArray)
	function putInArray(arr){

	if (arr.length == 0){
	resolve(convertedWords);
	return(convertedWords);//Recursion end.
	//return(Promise.resolve(convertedWords));
	}
	getPromise(arr[arr.length - 1])
	.then(result => {
	convertedWords.push(pickRandomWord(result));
	arr.pop()
	putInArray(arr);
	})
	.catch(err => {//Not a real words
	convertedWords.push(arr[arr.length - 1]);
	arr.pop()
	putInArray(arr)
	})
	}
	})
	var result = await promise;
	var finalSentence = "";
	for (i = 0; i < result.length; i++){
	//console.log(result[result.length - i - 1])
	finalSentence += result[result.length - i - 1] + " ";
	}
	console.log(finalSentence)
	document.getElementById("heading2").innerHTML = finalSentence;
	}

	function pickRandomWord(wordObject){
	var typeOfWord = Object.keys(wordObject);
	typeOfWord = Math.floor(Math.random() * typeOfWord.length);
	typeOfWord = Object.keys(wordObject)[typeOfWord];
	lengthOfSyns = Math.floor(Math.random() * (wordObject[typeOfWord]["syn"].length));
	return(wordObject[typeOfWord]["syn"][lengthOfSyns])
	// console.log(wordObject[Object.keys(wordObject)[typeOfWord]]);
	}
	//Cooler Way.
	async function getPromise(word){
	const apiURL = (`http://words.bighugelabs.com/api/2/${apiKey}/${word}/json`);
	const result = await fetch(apiURL);//Will not exceed this line until fetch has retrieven promise.
	if(result.status != 200){
	return(Promise.reject("fakeWord"));
	}
	return(result.json());
	}



	/*function getPromise(word){
	const apiURL = (`http://words.bighugelabs.com/api/2/${apiKey}/${word}/json`);
	return(
	fetch(apiURL).then((response) =>{
	if (response.status != 200){//To make sure the API gave back a good response.
	console.log("Error in response!");
	}
	return(response.json())
	})
	.catch(err => console.log(err))
	)
	}*/
	//Completly useless. Use join and trim, to clear whitespace.
	var endSub;

	function sentenceSplit(s){
	var i = 0;

	if(s == ""){
	//sentenceArray.push(s);
	return(sentenceArray);
	}

	while(s.charAt(i) == ' '){
	i++;
	}
	endSub = i;

	while(endSub < s.length){
	if(s.charAt(endSub) == ' '){
	sentenceArray.push(s.substring(i, endSub));
	break;
	}
	if(endSub == s.length - 1){
	sentenceArray.push(s.substring(i, endSub + 1));
	return(sentenceArray);
	}
	endSub++;
	}
	s = s.substring(endSub, s.length);
	return(sentenceSplit(s));
	}