FIx registering not working by now redirecting to register and challenges having a completed attribute

main.py

@@ -17,7 +17,7 @@ app.secret_key = os.environ["FLASK_SECRET_KEY"]
 login_manager = flask_login.LoginManager()
 login_manager.init_app(app)
 
-global challenges 
+global challenges
 challenges = {}
 
 os.makedirs("uploads", exist_ok=True)
@@ -66,7 +66,7 @@ def generate_challenge_route():
     username = request.json["username"]
 
     if not username in challenges:
-        challenges[username] = generate_challenge(username)
+        challenges[username] = {"text": generate_challenge(username), "completed": False}
 
     return challenges[username]
 
@@ -117,8 +117,8 @@ def submit_challenge():
     if not challenges.get(username):
         return Response("You havent started a challenge yet.", 400)
     
-    detected_text, text_similarity = check_text_similarity(f"{UPLOAD_DIR}/{image_uuid}.{image_type}", challenges[username])
+    detected_text, text_similarity = check_text_similarity(f"{UPLOAD_DIR}/{image_uuid}.{image_type}", challenges[username]["text"])
-    challenges.pop(username)
+    challenges[username]['completed'] = True
 
     if not text_similarity >= MINIMUM_OCR_SIMILARITY:
         return Response(f"The text is incorrect on the image. Similarity: {round(text_similarity * 100, 2)}% Detected Text: {detected_text}")
@@ -191,6 +191,15 @@ def register():
         return render_template("register.jinja2")
     elif request.method == "POST":
         username, password = request.form.get("username"), request.form.get("password")
+        
+        if not challenges.get(username):
+            return Response("Start and finish a challenge before registering.", 401)
+        
+        if not challenges[username]["completed"]:
+            return Response("Finish a challenge before registering.", 401)
+
+        challenges.pop(username)
+
         cur = get_db().cursor()
 
         cur.execute("SELECT username FROM Users WHERE username = ?", (username,))
@@ -205,11 +214,7 @@ def register():
         get_db().commit()
         cur.close()
 
-        user = User()
+        return redirect(url_for("login"))
-        user.id = username
-        flask_login.login_user(user, remember=True)
-
-        return redirect(url_for("application"))
     
 @app.route("/uploads/<filename>")
 def uploads(filename):

templates/register.jinja2

@@ -4,27 +4,29 @@
 
 <div class="d-flex justify-content-center align-items-center" style="height: 75vh;">
     <div class="bg-white rounded rounded-5 border border-5 border-white p-4">
-        <h2>Register</h2>
+        <form action="/register" method="post">
-        <div class="form-group" style="margin-top: 4%;">
+            <h2>Register</h2>
-            <label for="usernameinput">Username</label>
+            <div class="form-group" style="margin-top: 4%;">
-            <input name="username" class="form-control" id="usernameinput" placeholder="Enter username">
+                <label for="usernameinput">Username</label>
-        </div>
+                <input name="username" class="form-control" id="usernameinput" placeholder="Enter username">
-
-        <div class="form-group" style="margin-top: 4%;">
-            <label for="passwordinput">Password</label>
-            <input type="password" name="password" class="form-control" id="passwordinput" placeholder="Enter password">
-        </div>
-
-        <div class="form-group" style="margin-top: 4%;">
-            <div hidden id="grass-touching-form" class="mb-3">
-                <label class="form-label" for="file_input">Grass touching proof</label>
-                <div id="challengehelp">To complete this challenge, you need to submit a picture of you touching grass next to a paper containing the following text: Loading...</div>
-                <input accept="image/png, image/jpeg" name="file" type="file" class="form-control" id="file_input">
             </div>
 
-            <small id="proofhelp" class="form-text text-muted">Dont worry! We wont tell your friends.</small>
+            <div class="form-group" style="margin-top: 4%;">
-        </div>
+                <label for="passwordinput">Password</label>
-        <button id="submit" class="btn btn-primary mx-auto d-block" style="width: 100%; margin-top: 4%;">Submit</button>
+                <input type="password" name="password" class="form-control" id="passwordinput" placeholder="Enter password">
+            </div>
+
+            <div class="form-group" style="margin-top: 4%;">
+                <div hidden id="grass-touching-form" class="mb-3">
+                    <label class="form-label" for="file_input">Grass touching proof</label>
+                    <div id="challengehelp">To complete this challenge, you need to submit a picture of you touching grass next to a paper containing the following text: Loading...</div>
+                    <input accept="image/png, image/jpeg" name="file" type="file" class="form-control" id="file_input">
+                </div>
+
+                <small id="proofhelp" class="form-text text-muted">Dont worry! We wont tell your friends.</small>
+            </div>
+            <button id="submit" type="button" class="btn btn-primary mx-auto d-block" style="width: 100%; margin-top: 4%;">Submit</button>
+        </form>
     </div>
 </div>
 
@@ -34,20 +36,19 @@ function upload_success(image_url) {
     document.getElementById("submit").innerHTML = "Submit"
     document.getElementById("submit").type = "submit"
 
-    document.getElementById("grass-touching-form").innerHTML += `<img class="preview-img" src="${image_url}"></img>`;
+    document.getElementById("grass-touching-form").innerHTML += `<img class="preview-img" src="${image_url}">`;
 }
 
 function upload_error(error_message) {
     console.error(error_message)
-    
+
+    file_input = document.getElementById("file_input");
     file_input.value = ''
 
     document.getElementById("submit").innerHTML = "Submit"
+    document.getElementById("submit").disabled = false;
     document.getElementById("grass-touching-form").innerHTML += `<div class="text-danger">${error_message}</div>`;
 
-    file_input = document.getElementById("file_input");
-    file_input.removeEventListener("change", read_file);
-    file_input.addEventListener("change", read_file);
 }
 
 function upload_file(file_type, file_content) {
@@ -100,6 +101,10 @@ function read_file () {
         else if (file.type.match("image/png")) {
             file_type = "png";
         }
+        else {
+            document.getElementById("grass-touching-form").textContent += `<div class="text-danger">Only JPEG and PNG is supported.</div>`;
+            return;
+        }
 
         upload_file(file_type, filereader.result);
     };