Redmind commited on
Commit
158ecc4
·
verified ·
1 Parent(s): 97d29e4

Update templates/index.html

Browse files
Files changed (1) hide show
  1. templates/index.html +106 -117
templates/index.html CHANGED
@@ -1,117 +1,106 @@
1
- <!--
2
- This is the login page template for the RedMindGPT application.
3
- It contains a login form where users can enter their username and password to sign in.
4
- The form includes validation to ensure that both fields are filled out before submission.
5
- The page also includes styling using CSS and utilizes the AdminLTE and Font Awesome libraries for additional design elements.
6
- -->
7
-
8
- <!DOCTYPE html>
9
- <html lang="en">
10
- <head>
11
- <meta charset="UTF-8">
12
- <meta name="viewport" content="width=device-width, initial-scale=1.0">
13
- <style>
14
- /* CSS styles for the login page */
15
- .login-box-msg {
16
- color: grey;
17
- font-size: larger;
18
- font-weight: bold;
19
- }
20
-
21
- .remember-me {
22
- text-align: center;
23
- }
24
- </style>
25
- <title>RedMindGPT</title>
26
- <!-- AdminLTE CSS -->
27
- <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/adminlte.min.css">
28
- <!-- Font Awesome -->
29
- <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.3/css/all.min.css">
30
- </head>
31
- <body class="hold-transition login-page" style="background-image: url('static/img/AI.jpg'); background-size: cover;">
32
- <div class="login-box">
33
- <div class="card">
34
- <!-- Logo -->
35
- <div style="align-items: center;">
36
- <a href="#" style="color: blue;
37
- font-size: 30px;
38
- font-weight: bold;
39
- margin-left: 80px;
40
- margin-top: 20px;
41
- "><b>RedMindGPT</b></a>
42
- </div>
43
- <form action='/validate-user' name='loginForm' method="post" onsubmit="return validateForm()">
44
- <div class="card-body login-card-body">
45
- <p class="login-box-msg">Sign in</p>
46
- <div class="input-group mb-3">
47
- <input type="text" class="form-control" placeholder="Username" name="username" required>
48
- <div class="input-group-append">
49
- <div class="input-group-text">
50
- <span class="fas fa-user"></span>
51
- </div>
52
- </div>
53
- </div>
54
- <div class="input-group mb-3">
55
- <input type="password" class="form-control" placeholder="Password" name="password" required>
56
- <div class="input-group-append">
57
- <div class="input-group-text">
58
- <span class="fas fa-lock"></span>
59
- </div>
60
- </div>
61
- </div>
62
- <div class="row" style="align-content: center;">
63
- <div class="col-8">
64
- <div class="icheck-primary">
65
- <input type="checkbox" id="remember">
66
- <label for="remember">
67
- Remember Me
68
- </label>
69
- </div>
70
- </div>
71
- </div>
72
- <div class="row" style="align-content: center;">
73
- <div class="col-4">
74
- <button type="submit" class="btn btn-primary btn-block">Sign In</button>
75
- </div>
76
- <div class="col-4">
77
- <button type="reset" class="btn btn-secondary btn-block">Clear</button>
78
- </div>
79
- </div>
80
- </div>
81
- <input type="hidden" id="userRole" name="userRole" value="{{ role }}">
82
- </form>
83
- </div>
84
- </div>
85
- <!-- jQuery -->
86
- <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
87
- <!-- Bootstrap 4 -->
88
- <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/js/bootstrap.bundle.min.js"></script>
89
- <!-- AdminLTE App -->
90
- <script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/adminlte.min.js"></script>
91
- <script>
92
- // JavaScript function to validate the login form
93
- function validateForm() {
94
- //alert("Validating form");
95
- var username = document.forms["loginForm"]["username"].value;
96
- var password = document.forms["loginForm"]["password"].value;
97
- if (username == "" || password == "") {
98
- alert("Username and Password must be filled out");
99
- return false;
100
- }
101
- }
102
- function storeUserRole() {
103
- // Store user role in localStorage or sessionStorage
104
- var role1 = document.getElementById('userRole').value;
105
- //Salert("Role retrieved: " + role1); // Alert to confirm retrieval
106
- console.log("Retrieved user role from sessionStorage in index:", role1); // Debugging
107
- sessionStorage.setItem('userRole', role1);
108
- console.log("Role set in sessionStorage:", sessionStorage.getItem('userRole'));
109
- console.log("role",role1);
110
- }
111
- document.querySelector('input[name="username"]').addEventListener('change', function(event) {
112
- storeUserRole(); // Call this function before form submission
113
- });
114
-
115
- </script>
116
- </body>
117
- </html>
 
1
+ <!--
2
+ This is the login page template for the RedMindGPT application.
3
+ It contains a login form where users can enter their username and password to sign in.
4
+ The form includes validation to ensure that both fields are filled out before submission.
5
+ The page also includes styling using CSS and utilizes the AdminLTE and Font Awesome libraries for additional design elements.
6
+ -->
7
+
8
+ <!DOCTYPE html>
9
+ <html lang="en">
10
+ <head>
11
+ <meta charset="UTF-8">
12
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
13
+ <style>
14
+ /* CSS styles for the login page */
15
+ .login-box-msg {
16
+ color: grey;
17
+ font-size: larger;
18
+ font-weight: bold;
19
+ }
20
+
21
+ .remember-me {
22
+ text-align: center;
23
+ }
24
+ </style>
25
+ <title>RedMindGPT</title>
26
+ <!-- AdminLTE CSS -->
27
+ <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/adminlte.min.css">
28
+ <!-- Font Awesome -->
29
+ <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.3/css/all.min.css">
30
+ </head>
31
+ <body class="hold-transition login-page" style="background-image: url('static/img/AI.jpg'); background-size: cover;">
32
+ <div class="login-box">
33
+ <div class="card">
34
+ <!-- Logo -->
35
+ <div style="align-items: center;">
36
+ <a href="#" style="color: blue;
37
+ font-size: 30px;
38
+ font-weight: bold;
39
+ margin-left: 80px;
40
+ margin-top: 20px;
41
+ "><b>RedMindGPT</b></a>
42
+ </div>
43
+ <form action='/validate-user' name='loginForm' method="post" onsubmit="return validateForm()">
44
+ <div class="card-body login-card-body">
45
+ <p class="login-box-msg">Sign in</p>
46
+ <div class="input-group mb-3">
47
+ <input type="text" class="form-control" placeholder="Username" name="username" required>
48
+ <div class="input-group-append">
49
+ <div class="input-group-text">
50
+ <span class="fas fa-user"></span>
51
+ </div>
52
+ </div>
53
+ </div>
54
+ <div class="input-group mb-3">
55
+ <input type="password" class="form-control" placeholder="Password" name="password" required>
56
+ <div class="input-group-append">
57
+ <div class="input-group-text">
58
+ <span class="fas fa-lock"></span>
59
+ </div>
60
+ </div>
61
+ </div>
62
+ <div class="row" style="align-content: center;">
63
+ <div class="col-8">
64
+ <div class="icheck-primary">
65
+ <input type="checkbox" id="remember">
66
+ <label for="remember">
67
+ Remember Me
68
+ </label>
69
+ </div>
70
+ </div>
71
+ </div>
72
+ <div class="row" style="align-content: center;">
73
+ <div class="col-4">
74
+ <button type="submit" class="btn btn-primary btn-block">Sign In</button>
75
+ </div>
76
+ <div class="col-4">
77
+ <button type="reset" class="btn btn-secondary btn-block">Clear</button>
78
+ </div>
79
+ </div>
80
+ </div>
81
+
82
+ </form>
83
+ </div>
84
+ </div>
85
+ <!-- jQuery -->
86
+ <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
87
+ <!-- Bootstrap 4 -->
88
+ <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/js/bootstrap.bundle.min.js"></script>
89
+ <!-- AdminLTE App -->
90
+ <script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/adminlte.min.js"></script>
91
+ <script>
92
+ // JavaScript function to validate the login form
93
+ function validateForm() {
94
+ //alert("Validating form");
95
+ var username = document.forms["loginForm"]["username"].value;
96
+ var password = document.forms["loginForm"]["password"].value;
97
+ if (username == "" || password == "") {
98
+ alert("Username and Password must be filled out");
99
+ return false;
100
+ }
101
+
102
+ }
103
+
104
+ </script>
105
+ </body>
106
+ </html>