JSFiddle - React, Tailwind, and code Playground

by Koding Kamp

HTML

<body>
Please enter your name and password.<br>
<input id="name" type="text" placeholder="name" value=""><br>
<input id="pass" type="password" placeholder="password" value=""><br>
<input id="" type="button" value="Submit" onclick="submitInfo()"><p/>
pretend database:<br>
Genel, Tristian123<br>
Kamp, intense2<br>
Ray, Sucks123
</body>

JavaScript

function submitInfo(){
	var name = document.getElementById("name").value;
  var pass = document.getElementById("pass").value;
  if(name == "Genel" && pass == "Tristian123"){
  		document.body.innerHTML = "Access Granted!";
  }
  else if (name == "Ray" && pass == "Sucks123"){
  		document.body.innerHTML = "Access Granted!";
  }
  else if (name == "Kamp" && pass == "intense2"){
  		document.body.innerHTML = "Access Granted!";
  } else {
  	alert("Invalde Name and/or Password.");
    return;
  };
  granted(name);
}

function granted(name){
 document.body.innerHTML += "<p/>Welcome " + name + ".<p/>Where would you like to go today?<br>";
 switch (name){
 case "Genel": document.body.innerHTML += '<a href="https://www.geneljumalon.com">Genel Jumalon dot Com</a>';
 break;
 case "Kamp": document.body.innerHTML += '<a href="https://www.kampkode.com">Kamp Kode dot Com</a>';
 break;
 case "Ray": document.body.innerHTML += '<a href="https://support.microsoft.com/en-us/help/17621/internet-explorer-downloads">Raymond Thompson</a>';
 };
 document.body.innerHTML += '<p/><a href="https://www.google.com">Google</a>';
}