Misc changes.

chat.css

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

chat.html

@@ -30,13 +30,12 @@
 
         <div id="loggeduser"></div>
 
-        <script src="chat.js"></script>
+        <button type="button" id="logoutbutton" onclick="logout()">Logout</button> 
-        <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,8 +12,16 @@ form.addEventListener("submit", async function (event) {
 
     formMessage = formData.get('message').toString();
 
-    sendMessage()
+        //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
@@ -68,7 +76,7 @@ function printText(text) {
 //TODO ADD CHECK TO SEE IF USERNAME AND TOKEN MATCHES
 function loggedIn() {
     username = localStorage.getItem('username');
-    if (username === null || username === '') {
+    if (username === null) {
         document.querySelector("#loggeduser").innerHTML = 'You are not logged in'
     } else {
         document.querySelector("#loggeduser").innerHTML = `You are logged in as ${username}`