Merge pull request #56 from LWJ-Nicholas/HanisahMusrin-patch-1

fix: patched routing bug
LWJ-Nicholas · Jan 23, 2024 · 1151611 · 1151611
2 parents 753330b + 86053f4
commit 1151611
Show file tree

Hide file tree

Showing 10 changed files with 482 additions and 24 deletions.
diff --git a/main.py b/main.py
@@ -1,27 +1,6 @@
-
-from flask import Flask, render_template, request, redirect, url_for
-
-def create_app():
-    app = Flask(__name__)
-    return app
+from website import create_app
 
 app = create_app()
 
-# Application Routes Below
-
-@app.route('/')
-def home():
-    return render_template("home.html")
-
-@app.route('/login')
-def login():
-    return render_template("login.html")
-
-@app.route('/register')
-def register():
-    return render_template("register.html")
-
-
-
 if __name__ == '__main__':
     app.run(debug=True)
diff --git a/website/auth.py b/website/auth.py
@@ -32,7 +32,7 @@ def logout():
     flash('Logged out successfully!',category='success')
     return redirect('/')
 
-@auth.route('/create-account',methods=['GET','POST'])
+@auth.route('/register',methods=['GET','POST'])
 def createAccount():
     if request.method == "POST":
         username = request.form.get('username')
@@ -57,7 +57,7 @@ def createAccount():
 
             return redirect(url_for('auth.welcome'))
 
-    return render_template("create-account.html",user=current_user)
+    return render_template("register.html",user=current_user)
 
 @auth.route('/welcome')
 @login_required

diff --git a/website/templates/base.html b/website/templates/base.html
@@ -0,0 +1,79 @@
+<!DOCTYPE html>
+
+<html>
+    <!DOCTYPE html>
+    <html>
+      <head>
+        <meta charset="utf-8" />
+        <meta name="viewport" content="width=device-width, initial-scale=1" />
+        <link
+          rel="stylesheet"
+          href="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css"
+          integrity="sha384-Vkoo8x4CGsO3+Hhxv8T/Q5PaXtkKtu6ug5TOeNV6gBiFeWPGFN9MuhOf23Q9Ifjh"
+          crossorigin="anonymous"
+        />
+        <link
+          rel="stylesheet"
+          href="https://stackpath.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css"
+          crossorigin="anonymous"
+        />
+        {% block stylesheet %}{% endblock %}
+
+        <title>{% block title %}Template{% endblock %}</title>
+
+        </head>
+
+    <body>
+        <nav class="navbar navbar-expand-lg navbar-light bg-white">
+          <h3 style="color: #4CAF50;"class="p-3 mr-auto">TSAO Capstone Records System</h3> 
+
+          {% block nav %}{% endblock %}
+        </nav>
+
+        {% with messages = get_flashed_messages(with_categories=true) %}
+          {% if messages %}
+            {% for category, message in messages %}
+              {% if category == 'error' %}
+                <div class="alert alert-danger alter-dismissable fade show" role="alert">
+                  {{ message }}
+                  <button type="button" class="close" data-dismiss="alert">
+                    <span aria-hidden="true">&times;</span>
+                  </button>
+                </div>
+                {% else %}
+                <div class="alert alert-success alter-dismissable fade show" role="alert">
+                  {{ message }}
+                  <button type="button" class="close" data-dismiss="alert">
+                    <span aria-hidden="true">&times;</span>
+                  </button>
+                </div>
+              {% endif %}
+            {% endfor %}
+          {% endif %}
+        {% endwith %}
+
+        <div class="container" style="max-width: 500px;">
+            {% block forms %}
+            {% endblock %}
+        </div>
+
+        {% block content %}
+        {% endblock %}
+
+      <script
+        src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.9/umd/popper.min.js"
+        integrity="sha384-ApNbgh9B+Y1QKtv3Rn7W3mgPxhU9K/ScQsAP7hUibX39j7fakFPskvXusvfa0b4Q"
+        crossorigin="anonymous"
+      ></script>
+      <script
+        src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js"
+        integrity="sha384-JZR6Spejh4U02d8jOt6vLEHfe/JQGiRRSQQxSfFWpi1MquVdAyjUar5+76PVCmYl"
+        crossorigin="anonymous"
+      ></script>
+
+      <script
+        type="text/javascript"
+        src="{{ url_for('static', filename='index.js')}}">
+      </script>
+    </body>
+</html>
diff --git a/website/templates/create-entry.html b/website/templates/create-entry.html
@@ -0,0 +1,178 @@
+{% extends "base.html" %}
+{% block stylesheet %}
+<style>
+.WebName {
+    color: green; 
+    position: absolute;
+    left: 200px;
+    top: 0px;
+    font-size: 40px;
+}
+
+
+.FormHeader {
+    position: relative;
+    text-align: center;
+    top: 50px; 
+    font-size: 50px;
+}
+
+
+.form {
+    display: flex;
+    position: relative;
+    flex-direction: column;     
+    justify-content: center;
+    align-items: center;
+    height: 100%;
+    top: 50px; 
+}
+
+
+.form input {
+    width: 400px;
+    border: 1px solid #000000;
+    border-radius: 4px;
+    font-size: 16px;
+    padding: 8px;
+}
+
+.form input[type='radio'] {
+    width: 20px;
+    border: 1px solid #000000;
+    border-radius: 4px;
+    font-size: 16px;
+    padding: 8px;
+}
+
+.FormGroup1 {
+    display: flex;
+    justify-content: space-between;
+    margin-top: 10px;
+    margin-bottom: 10px;
+}
+
+.FormGroup2 {
+    display: flex;
+    justify-content: space-between;
+    margin-top: 10px;
+    margin-bottom: 10px;
+}
+
+.FormGroup3 {
+    display: flex;
+    justify-content: space-between;
+    margin-top: 10px;
+    margin-bottom: 10px;
+}
+
+
+.FormGroup4 {
+    display: flex;
+    justify-content: space-between;
+    margin-top: 10px;
+    margin-bottom: 10px;
+    margin-left: -250px;
+
+}
+
+.FormGroup5 {
+    display: flex;
+    justify-content: space-between;
+    margin-top: 10px;
+    margin-bottom: 10px;
+    margin-left: -250px;
+}
+
+.floating-input {
+    float: left;
+    margin-right: 100px;
+}
+
+.green-button {
+    background-color: green;
+    color: white;
+    padding: 20px 40px;
+    border: none;
+    border-radius: 10px;
+    cursor: pointer;
+    margin-right: 400px
+}
+.red-button {
+    background-color: red;
+    color: white;
+    padding: 20px 40px;
+    border: none;
+    border-radius: 10px;
+    cursor: pointer;
+}
+</style>
+{% endblock %}
+{% block title %}Query{% endblock %}
+
+
+{% block content %}
+    <p class="FormHeader">      
+        <u> Create New Capstone Entry</u>
+
+    </p>
+
+    <form method="post" action="/form">
+
+        <div  class="form">
+
+                <div class="FormGroup1">
+                    <div class="floating-input">
+                        <label for = "name"> <B>NAME</B> </label><br>
+                        <input type = "text" id = "name"  placeholder="e.g. Tan KK"><br>
+                    </div>
+                    <div class="floating-input">
+                        <label for = "title"> <b>CAPSTONE TITLE</b></label><br>
+                    <input type = "text" id = "title"  placeholder="e.g. Quantum Mechanics"><br>
+                    </div>
+                </div>
+
+                <div class="FormGroup2">
+                    <div class="floating-input">
+                        <label for = "student"> <B>NO. OF STUDENT</B> </label><br>
+                        <input type = "text" id = "student"  placeholder="e.g. 4"><br>
+                    </div>
+                    <div class="floating-input">
+                        <label for = "company"> <B>NAME OF COMPANY</B> </label><br>
+                        <input type = "text" id = "company"  placeholder="e.g. KK Company"><br>
+                    </div>
+                </div>
+
+                <div class="FormGroup3">
+                    <div class="floating-input">
+                        <label for = "year"> <B>ACADEMIC YEAR</B> </label><br>
+                        <input type = "date" id = "year"  placeholder="e.g. 4"><br>
+                    </div>
+                    <div class="floating-input">
+                        <label for = "companycontact"> <B>COMPANY POINT OF CONTACT</B> </label><br>
+                        <input type = "text" id = "companycontact"  placeholder="e.g. TAN BB"><br>
+                    </div>
+                </div>
+
+                <div class="FormGroup4">
+                    <div class="floating-input">
+                        <label for = "description"> <B>BRIEF DESCRIPTION OF PROJECT</B> </label><br>
+                        <textarea  type = "text" id = "description" placeholder="Write Here"  rows="6"  cols="70"></textarea><br>
+                    </div>
+                    <div>
+                        <label for = "contact"> <B>ROLE OF CONTACT</B> </label><br>
+                        <input type="radio" id="staff" value="Staff">
+                        <label for="staff">Staff</label><br>
+                        <input type="radio" id="student" value="Student">
+                        <label for="student">Student</label>        
+                    </div>
+                </div>
+
+                <div class="FormGroup5">
+                    <a class="green-button btn btn-primary btn-danger btn-lg ml-5" href="/welcome">Save</a>
+                    <a class="red-button btn btn-primary btn-danger btn-lg ml-5" href="/welcome">Cancel</a>
+                </div>
+        </div>
+    </form>
+{% endblock %}
+
diff --git a/website/templates/home.html b/website/templates/home.html
@@ -0,0 +1,15 @@
+{% extends "base.html" %}
+
+{% block title %}Home{% endblock %}
+
+{% block nav %}
+    <div class="navbar-nav ml-auto" style="margin-right: 100px;">
+        <a class="btn btn-primary btn-success btn-lg" style="width: 120px" id="login" href="/login">Login</a>
+    </div>
+{% endblock %}
+
+{% block content %}
+    <br/><br/><br/><br/><br/><br/>
+    <h1 class="text-center fw-bold" style="font-size: 60px;">Welcome to the TSAO</h1>
+    <h1 class="text-center fw-bold" style="font-size: 60px;">Capstone Records System</h1>
+{% endblock %}
diff --git a/website/templates/login.html b/website/templates/login.html
@@ -0,0 +1,33 @@
+{% extends "base.html" %}
+
+{% block title %}Login{% endblock %}
+
+{% block forms %}
+    <h1 style="text-align: center;"}><u>Login</u></h1> 
+    <br/>
+    <form method="POST">
+        <div class="form-group">
+            <label for="username" class="font-weight-bold">USERNAME</label>
+            <input 
+                type="text" 
+                class="form-control" 
+                id="username" 
+                name="username" 
+                placeholder="e.g. TanKK"
+            />
+        </div>
+        <div class="form-group">
+            <label for="password" class="font-weight-bold">PASSWORD</label>
+            <input 
+                type="password" 
+                class="form-control" 
+                id="password" 
+                name="password" 
+                placeholder="e.g. password"
+            />
+        </div>
+        <br/><br/>
+        <button type="submit" class="btn btn-primary btn-success btn-lg" style="width: 200px"> Login</button>
+        <a type="submit" class="btn btn-primary btn-success btn-lg" style="float: right; width:200px" href="/register"> Create New User </a>
+    </form>
+{% endblock %}
diff --git a/website/templates/register.html b/website/templates/register.html
@@ -0,0 +1,33 @@
+{% extends "base.html" %}
+
+{% block title %}Signup{% endblock %}
+
+{% block forms %}
+    <form method="POST">
+        <h1 style="text-align: center;"}><u>Create Account</u></h1> 
+        <br/>
+        <div class="form-group">
+            <label for="username" class="font-weight-bold">USERNAME</label>
+            <input 
+                type="text" 
+                class="form-control" 
+                id="username" 
+                name="username" 
+                placeholder="e.g. TanKK"
+            />
+        </div>
+        <div class="form-group">
+            <label for="password" class="font-weight-bold">PASSWORD</label>
+            <input 
+                type="password" 
+                class="form-control" 
+                id="password" 
+                name="password" 
+                placeholder="e.g. password"
+            />
+        </div>
+        <br/><br/>
+        <button type="submit" class="btn btn-primary btn-success btn-lg" style="width: 200px"> Create New User </button>
+        <a class="btn btn-primary btn-danger btn-lg" style="float: right; width: 200px;" href="/login"> Cancel </a>
+    </form>
+{% endblock %}