Hugging Face's logo

Spaces:
ReikerXx
/
Xx
Sleeping

App Files Community
Reaperxxxx commited on
Commit
f3a0bb4
·
verified ·
1 Parent(s): 1ca246d

Update public/index.html

Browse files
Files changed (1) hide show
  1. public/index.html +92 -8
public/index.html CHANGED
@@ -3,21 +3,83 @@
3
  <head>
4
  <meta charset="UTF-8">
5
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
6
- <title>Login</title>
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
7
  </head>
8
  <body>
9
- <form id="loginForm">
10
- <input type="text" id="username" placeholder="Username" required>
11
- <input type="password" id="password" placeholder="Password" required>
12
- <button type="submit">Login</button>
13
- </form>
 
 
 
 
 
 
 
 
 
 
 
 
 
 
14
 
15
  <script>
 
 
 
 
 
 
 
 
 
 
 
16
  document.getElementById("loginForm").addEventListener("submit", async (event) => {
17
  event.preventDefault();
18
 
19
- const username = document.getElementById("username").value;
20
- const password = document.getElementById("password").value;
21
 
22
  const response = await fetch("/login", {
23
  method: "POST",
@@ -33,6 +95,28 @@
33
  window.location.href = "/terminal.html";
34
  }
35
  });
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
36
  </script>
37
  </body>
38
  </html>
 
3
  <head>
4
  <meta charset="UTF-8">
5
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
6
+ <title>Login & Sign Up</title>
7
+ <style>
8
+ body {
9
+ font-family: Arial, sans-serif;
10
+ text-align: center;
11
+ margin-top: 50px;
12
+ }
13
+ form {
14
+ margin: 20px auto;
15
+ max-width: 300px;
16
+ padding: 20px;
17
+ border: 1px solid #ccc;
18
+ border-radius: 5px;
19
+ }
20
+ input {
21
+ width: 100%;
22
+ padding: 10px;
23
+ margin: 10px 0;
24
+ border: 1px solid #ccc;
25
+ border-radius: 5px;
26
+ }
27
+ button {
28
+ padding: 10px;
29
+ background-color: #007BFF;
30
+ color: white;
31
+ border: none;
32
+ border-radius: 5px;
33
+ cursor: pointer;
34
+ }
35
+ button:hover {
36
+ background-color: #0056b3;
37
+ }
38
+ .switch {
39
+ margin-top: 10px;
40
+ color: #007BFF;
41
+ cursor: pointer;
42
+ }
43
+ </style>
44
  </head>
45
  <body>
46
+ <div id="loginSection">
47
+ <h2>Login</h2>
48
+ <form id="loginForm">
49
+ <input type="text" id="loginUsername" placeholder="Username" required>
50
+ <input type="password" id="loginPassword" placeholder="Password" required>
51
+ <button type="submit">Login</button>
52
+ </form>
53
+ <p class="switch" onclick="showSignUp()">Don't have an account? Sign Up</p>
54
+ </div>
55
+
56
+ <div id="signupSection" style="display: none;">
57
+ <h2>Sign Up</h2>
58
+ <form id="signupForm">
59
+ <input type="text" id="signupUsername" placeholder="Username" required>
60
+ <input type="password" id="signupPassword" placeholder="Password" required>
61
+ <button type="submit">Sign Up</button>
62
+ </form>
63
+ <p class="switch" onclick="showLogin()">Already have an account? Login</p>
64
+ </div>
65
 
66
  <script>
67
+ function showSignUp() {
68
+ document.getElementById("loginSection").style.display = "none";
69
+ document.getElementById("signupSection").style.display = "block";
70
+ }
71
+
72
+ function showLogin() {
73
+ document.getElementById("signupSection").style.display = "none";
74
+ document.getElementById("loginSection").style.display = "block";
75
+ }
76
+
77
+ // Login handler
78
  document.getElementById("loginForm").addEventListener("submit", async (event) => {
79
  event.preventDefault();
80
 
81
+ const username = document.getElementById("loginUsername").value;
82
+ const password = document.getElementById("loginPassword").value;
83
 
84
  const response = await fetch("/login", {
85
  method: "POST",
 
95
  window.location.href = "/terminal.html";
96
  }
97
  });
98
+
99
+ // Sign-up handler
100
+ document.getElementById("signupForm").addEventListener("submit", async (event) => {
101
+ event.preventDefault();
102
+
103
+ const username = document.getElementById("signupUsername").value;
104
+ const password = document.getElementById("signupPassword").value;
105
+
106
+ const response = await fetch("/signup", {
107
+ method: "POST",
108
+ headers: { "Content-Type": "application/json" },
109
+ body: JSON.stringify({ username, password }),
110
+ });
111
+
112
+ const message = await response.text();
113
+ alert(message);
114
+
115
+ if (response.ok) {
116
+ // Redirect to terminal page
117
+ window.location.href = "/terminal.html";
118
+ }
119
+ });
120
  </script>
121
  </body>
122
  </html>