chat.css

@@ -56,7 +56,7 @@ button {
 }
 
 #loggeduser {
-    padding-top: 2%
+    padding-top: 1.5%
 }
 
 #errormessage {

chat.html

@@ -30,12 +30,13 @@
 
         <div id="loggeduser"></div>
 
-        <button type="button" id="logoutbutton" onclick="logout()">Logout</button> 
+        <script src="chat.js"></script>
+        <script src="logout.js"></script>
+
+        <button type="button" onclick="logout()">Logout</button> 
 
         <div id="errormessage"></div>
         
-        <script src="chat.js"></script>
-        <script src="logout.js"></script>
 
     </body>
 

chat.js

@@ -12,16 +12,8 @@ form.addEventListener("submit", async function (event) {
 
     formMessage = formData.get('message').toString();
 
-        //CHECKS TO SEE IF THE PERSON IS LOGGED IN IN ORDER TO SEND A MESSAGE.
-        const response = await fetch(`api/token/${username}/`);
-        const matches = await response.json();
-      
-        //YES THIS IS CONFUSING I KNOW.
-        if (matches.status === "ok") {
     sendMessage()
-        } else {
+
-            document.querySelector("#errormessage").innerHTML = 'Username and token mismatch. Try logging in again.'
-        }
 })
 
 //SEND MESSAGE FETCH FUNCTION
@@ -76,7 +68,7 @@ function printText(text) {
 //TODO ADD CHECK TO SEE IF USERNAME AND TOKEN MATCHES
 function loggedIn() {
     username = localStorage.getItem('username');
-    if (username === null) {
+    if (username === null || username === '') {
         document.querySelector("#loggeduser").innerHTML = 'You are not logged in'
     } else {
         document.querySelector("#loggeduser").innerHTML = `You are logged in as ${username}`

logout.js

@@ -1,9 +1,9 @@
 //VARIBLES
-myStorage = window.localStorage;
+
-// //IF NOT LOGGED IN DON'T SHOW LOGOUT BUTTON
+// //IF NOT LOGGED IN DON'T SHOW LOG IN BUTTON
-while (username === null) {
+//  if (username === '') {
-  document.getElementById("logoutbutton").style.display = "none";
+//     document.getElementById("logoutlink").style.display = "none";
-}
+//  }
 
 //LOGOUT FETCH FUNCTION
 
@@ -21,29 +21,3 @@ async function logout() {
   username = null;
   loggedIn()
 }
-
-//CHECKS TO SEE IF USERNAME MATCHES TOKEN 
-let tokenUpdate = window.setInterval(checkToken, 1000);
-
-async function checkToken() {
-  const response = await fetch(`api/token/${username}/`);
-  const matches = await response.json();
-
-  //YES THIS IS CONFUSING I KNOW.
-  if (matches.status === "fail") {
-    loggedOut()
-  }
-
-  // IF NO USERNAME BUT HAS A TOKEN THEN LOGOUT
-
-  if (matches.status === "ok" && myStorage.length === 0) {
-    logout()
-  }
-}
-
-//AND IF THEY DON'T HAVE A TOKEN CLEARS THE LOCAL STORED USERNAME
-
-function loggedOut() {
-  localStorage.removeItem('username')
-  document.querySelector("#loggeduser").innerHTML = 'You are not logged in'
-}