Added initial page structure to project (#97)

DataBytes-Organisation · Nov 23, 2023 · 103c8e6 · 103c8e6
1 parent 85c67f5
commit 103c8e6
Show file tree

Hide file tree

Showing 5 changed files with 185 additions and 4 deletions.
diff --git a/dolfin_analytica/app.py b/dolfin_analytica/app.py
@@ -1,10 +1,30 @@
-from flask import Flask
+from flask import Flask, render_template, request, redirect, url_for
+import time
 
 app = Flask(__name__)
 
-@app.route('/')
-def home():
-    return 'Hello, Flask!'
+@app.route('/', methods=['GET', 'POST'])
+def landing():
+    if request.method == 'POST':
+        # Access form data using request.form
+        username = request.form['username']
+        password = request.form['password']
+
+        if username == 'dsuser':
+            if password == 'dolfin123':
+
+        # After processing the data, you can redirect to the /loading route
+                return redirect(url_for('loading'))
+
+    return render_template('landing.html')
+
+@app.route('/loading')
+def loading():
+    return render_template('loading.html')
+
+@app.route('/main')
+def main():
+    return render_template('main.html')
 
 if __name__ == '__main__':
     app.run(debug=True)
diff --git a/dolfin_analytica/static/css/main.css b/dolfin_analytica/static/css/main.css
diff --git a/dolfin_analytica/templates/landing.html b/dolfin_analytica/templates/landing.html
@@ -0,0 +1,51 @@
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
+    <title>Login Page</title>
+    <!-- Bootstrap CSS -->
+    <link href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" rel="stylesheet">
+    <style>
+        body {
+            height: 100vh;
+            display: flex;
+            align-items: center;
+            justify-content: center;
+            background-color: white;
+        }
+
+        .login-form {
+            max-width: 400px;
+            width: 100%;
+            padding: 15px;
+            margin: auto;
+            background-color: #fff;
+            border: 1px solid #ced4da;
+            border-radius: 4px;
+            box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
+        }
+    </style>
+</head>
+
+<body>
+
+        <form method="POST">
+            <div class="form-group">
+                <input type="text" class="form-control text-center" id="username" name="username" placeholder="Enter your username" required>
+            </div>
+            <div class="form-group">
+                <input type="password" class="form-control text-center" id="password" name="password" placeholder="Enter your password" required>
+            </div>
+            <button type="submit" class="btn btn-primary btn-block">Login</button>
+        </form>
+
+
+    <!-- Bootstrap JS and Popper.js -->
+    <script src="https://code.jquery.com/jquery-3.3.1.slim.min.js"></script>
+    <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js"></script>
+    <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js"></script>
+</body>
+
+</html>
diff --git a/dolfin_analytica/templates/loading.html b/dolfin_analytica/templates/loading.html
@@ -0,0 +1,49 @@
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
+    <title>Loading Page</title>
+    <!-- Bootstrap CSS -->
+    <link href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" rel="stylesheet">
+    <style>
+        body {
+            height: 100vh;
+            display: flex;
+            align-items: center;
+            justify-content: center;
+            background-color: #f8f9fa;
+        }
+
+        .loading-container {
+            text-align: center;
+        }
+
+        .spinner-border {
+            width: 3rem;
+            height: 3rem;
+        }
+    </style>
+</head>
+
+<body>
+    <div class="loading-container">
+        <div class="spinner-border text-primary" role="status">
+            <span class="sr-only">Loading...</span>
+        </div>
+    </div>
+
+    <script>
+        setTimeout(function () {
+            window.location.href = "/main"; // Replace with your desired route
+        }, 15000); // 15 seconds in milliseconds
+    </script>
+
+    <!-- Bootstrap JS and Popper.js -->
+    <script src="https://code.jquery.com/jquery-3.3.1.slim.min.js"></script>
+    <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js"></script>
+    <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js"></script>
+</body>
+
+</html>
diff --git a/dolfin_analytica/templates/main.html b/dolfin_analytica/templates/main.html
@@ -0,0 +1,61 @@
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
+    <title>Dashboard</title>
+    <!-- Bootstrap CSS -->
+    <link href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" rel="stylesheet">
+    <style>
+        body {
+            font-family: 'Arial', sans-serif;
+            background-color: #f8f9fa;
+        }
+
+        #sidebar {
+            height: 100vh;
+            width: 110px;
+            position: fixed;
+            top: 0;
+            left: 0;
+            background-color: #343a40;
+            padding-top: 20px;
+        }
+
+        #content {
+            margin-left: 250px;
+            padding: 20px;
+        }
+    </style>
+</head>
+
+<body>
+
+    <div id="sidebar">
+        <ul class="nav flex-column">
+            <li class="nav-item">
+                <a class="nav-link text-white" href="#">Home</a>
+            </li>
+            <li class="nav-item">
+                <a class="nav-link text-white" href="#">Dashboard</a>
+            </li>
+            <li class="nav-item">
+                <a class="nav-link text-white" href="#">Reports</a>
+            </li>
+            <!-- Add more items as needed -->
+        </ul>
+    </div>
+
+    <div id="content">
+        <h2>Welcome to the Dashboard</h2>
+        <!-- Add your dashboard content here -->
+    </div>
+
+    <!-- Bootstrap JS and Popper.js -->
+    <script src="https://code.jquery.com/jquery-3.3.1.slim.min.js"></script>
+    <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js"></script>
+    <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js"></script>
+</body>
+
+</html>