Hugging Face's logo

Spaces:
Gregniuki
/
Loginauth
Sleeping

App Files Community
Gregniuki commited on
Commit
b67759d
·
verified ·
1 Parent(s): 60bbce2

Update templates/register.html

Browse files
Files changed (1) hide show
  1. templates/register.html +70 -95
templates/register.html CHANGED
@@ -1,104 +1,79 @@
1
  <!DOCTYPE html>
2
  <html lang="en">
3
  <head>
4
- <meta charset="UTF-8">
5
- <meta name="viewport" content="width=device-width, initial-scale=1.0">
6
- <title>Register</title>
7
- <link rel="stylesheet" type="text/css" href="/static/style.css"> <!-- Add this line for your CSS -->
8
-
9
  </head>
10
-
11
  <body>
12
- <footer>
13
- <!-- Footer content -->
14
- <p>Copyright © Your Website</p>
15
- </footer>
16
- <div class="background-container">
17
- <div class="color-overlay"></div>
18
-
19
-
20
- <h1>Register</h1>
21
- <!-- Add this inside your register.html where appropriate -->
22
- <a href="{{ google_oauth_url }}">Register with Google</a>
23
- <form action="/register" method="post" id="registration-form">
24
- <label for="username">Username:</label>
25
- <input type="text" id="username" name="username" required><br><br>
26
-
27
- <label for="email">Email:</label>
28
- <input type="email" id="email" name="email" required><br><br>
29
-
30
- <label for="password">Password:</label>
31
- <input type="password" id="password" name="password" required><br><br>
32
-
33
- <label for="confirm_password">Confirm Password:</label>
34
- <input type="password" id="confirm_password" name="confirm_password" required><br><br>
35
-
36
- <!-- Hidden field for the reCAPTCHA token -->
37
- <input type="hidden" id="recaptcha_token" name="recaptcha_token" value="">
38
-
39
- <div class="g-recaptcha"
40
- data-sitekey="6LeSJgwpAAAAAD9UlPdC911k8UgD6Uh3068xXgGj"
41
- data-callback="setRecaptchaToken">
42
- </div>
43
- <br>
44
- <button type="submit" id="submit-button">Register</button>
45
- </div>
46
-
47
-
48
- </form>
49
-
50
-
51
- </div>
52
- <script src="https://www.google.com/recaptcha/api.js" async defer></script>
53
- <script>
54
- function setRecaptchaToken(token) {
55
- document.getElementById('recaptcha_token').value = token;
56
- }
57
 
58
- function areFieldsFilled() {
59
- var username = document.getElementById('username').value.trim();
60
- var email = document.getElementById('email').value.trim();
61
- var password = document.getElementById('password').value.trim();
62
- var confirmPassword = document.getElementById('confirm_password').value.trim();
63
- var recaptchaToken = document.getElementById('recaptcha_token').value.trim();
 
 
64
 
65
- return username && email && password && confirmPassword && recaptchaToken;
66
- }
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
67
 
68
- document.getElementById('registration-form').addEventListener('submit', function(event) {
69
- event.preventDefault();
70
-
71
- if (!areFieldsFilled()) {
72
- alert("Please fill in all required fields and complete the reCAPTCHA.");
73
- return;
74
- }
75
-
76
- var formData = new FormData(this);
77
-
78
- fetch('/register', {
79
- method: 'POST',
80
- body: formData
81
- })
82
- .then(response => {
83
- if (!response.ok) {
84
- throw new Error('Network response was not ok ' + response.statusText);
85
- }
86
- return response.json();
87
- })
88
- .then(data => {
89
- storeAccessToken(data.access_token);
90
- window.location.href = `${data.redirect_url}?token=${data.access_token}`;
91
- })
92
- .catch(error => {
93
- console.error('Error:', error);
94
- });
95
- });
96
-
97
- function storeAccessToken(token) {
98
- // Implement your token storage logic here
99
- console.log("Token stored:", token);
100
- }
101
- </script>
102
  </body>
103
-
104
- </html>
 
1
  <!DOCTYPE html>
2
  <html lang="en">
3
  <head>
4
+ <meta charset="UTF-8">
5
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
6
+ <title>Register</title>
7
+ <link rel="stylesheet" type="text/css" href="/static/style.css">
 
8
  </head>
 
9
  <body>
10
+ <footer>
11
+ <p>Copyright © Your Website</p>
12
+ </footer>
13
+ <div class="background-container">
14
+ <div class="color-overlay"></div>
15
+ <h1>Register</h1>
16
+ <a href="{{ google_oauth_url }}">Register with Google</a>
17
+ <form action="/register" method="post" id="registration-form" onsubmit="handleSubmit(event)">
18
+ <label for="username">Username:</label>
19
+ <input type="text" id="username" name="username" required><br><br>
20
+ <label for="email">Email:</label>
21
+ <input type="email" id="email" name="email" required><br><br>
22
+ <label for="password">Password:</label>
23
+ <input type="password" id="password" name="password" required><br><br>
24
+ <label for="confirm_password">Confirm Password:</label>
25
+ <input type="password" id="confirm_password" name="confirm_password" required><br><br>
26
+ <input type="hidden" id="recaptcha_token" name="recaptcha_token" value="">
27
+ <div class="g-recaptcha" data-sitekey="6LeSJgwpAAAAAD9UlPdC911k8UgD6Uh3068xXgGj" data-callback="setRecaptchaToken"></div>
28
+ <br>
29
+ <button type="submit" id="submit-button">Register</button>
30
+ </form>
31
+ </div>
32
+ <script src="https://www.google.com/recaptcha/api.js" async defer></script>
33
+ <script>
34
+ function setRecaptchaToken(token) {
35
+ document.getElementById('recaptcha_token').value = token;
36
+ }
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
37
 
38
+ function areFieldsFilled() {
39
+ var username = document.getElementById('username').value.trim();
40
+ var email = document.getElementById('email').value.trim();
41
+ var password = document.getElementById('password').value.trim();
42
+ var confirmPassword = document.getElementById('confirm_password').value.trim();
43
+ var recaptchaToken = document.getElementById('recaptcha_token').value.trim();
44
+ return username && email && password && confirmPassword && recaptchaToken;
45
+ }
46
 
47
+ function handleSubmit(event) {
48
+ event.preventDefault();
49
+ if (!areFieldsFilled()) {
50
+ alert("Please fill in all required fields and complete the reCAPTCHA.");
51
+ return;
52
+ }
53
+ var formData = new FormData(event.target);
54
+ fetch('/register', {
55
+ method: 'POST',
56
+ body: formData
57
+ })
58
+ .then(response => {
59
+ if (!response.ok) {
60
+ throw new Error('Network response was not ok ' + response.statusText);
61
+ }
62
+ return response.json();
63
+ })
64
+ .then(data => {
65
+ storeAccessToken(data.access_token);
66
+ window.location.href = `${data.redirect_url}?token=${data.access_token}`;
67
+ })
68
+ .catch(error => {
69
+ console.error('Error:', error);
70
+ });
71
+ }
72
 
73
+ function storeAccessToken(token) {
74
+ // Implement your token storage logic here
75
+ console.log("Token stored:", token);
76
+ }
77
+ </script>
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
78
  </body>
79
+ </html>