Skip to content

Commit

Permalink
Merge pull request ayush-that#1605 from Devanshu1603/main
Browse files Browse the repository at this point in the history 
solved issue ayush-that#1542
  • Loading branch information
@sampadatiwari30
sampadatiwari30 authored Oct 19, 2024
2 parents c2646fe + d89fbd9 commit 62b0c16
Show file tree
Hide file tree
Showing 2 changed files with 159 additions and 2 deletions.
4 changes: 2 additions & 2 deletions loginPage.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -90,9 +90,9 @@ <h3>New here ?</h3>
<p>
Discover new experiences with BuddyTrail! <br> Create your account.
</p>
<button class="btn transparent" id="sign-up-btn">
<a href="registerpage.html"><button class="btn transparent" id="sign-up-btn">
Sign up
</button>
</button></a>
</div>
<img src="img/log.svg" class="image" alt="" />
</div>
Expand Down
157 changes: 157 additions & 0 deletions registerpage.html
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,157 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Register & Login</title>
<link rel="stylesheet" href="loginPage.css" />
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
</head>
<body>

<div class="container">
<div class="forms-container">
<div class="sign-in-signup">
<form action="#" class="sign-in-form">
<h2 class="title">Create Account</h2>

<div class="input-field">
<i class="fas fa-user"></i>
<input type="text" placeholder=" Full Name" required />
</div>
<div class="input-field">
<i class="fa-solid fa-envelope"></i>
<input type="email" placeholder="Email" required />
</div>
<div class="input-field">
<i class="fas fa-lock"></i>
<input type="password" placeholder="Password" id="password" />
<i class="fas fa-eye password-toggle" onclick="togglePassword('password', this)"></i>
</div>
<div class="input-field">
<i class="fas fa-lock"></i>
<input type="password" placeholder=" Confirm Password" id="confirm-password" />
<i class="fas fa-eye password-toggle" onclick="togglePassword('confirm-password', this)"></i>
</div>
<button type="submit" class="btn solid" onclick="handleregister(event)">Register</button>
</form>
<p class="social-text" style="position: relative; bottom: 30px;">Or Sign Up using social platforms</p>
<div class="social-media" style="position: relative; bottom: 30px;">
<a href="https://www.google.com" target="_blank" class="social-icon" id="google">
<i class="fab fa-google"></i>
</a>
<button class="social-icon" id="githubSignInBtn">
<i class="fab fa-github"></i>
</button>
</div>
<form action="#" class="sign-up-form">
<h2 class="title">Sign up</h2>
<div class="input-field">
<i class="fas fa-user"></i>
<input type="text" placeholder="Username" />
</div>
<div class="input-field">
<i class="fas fa-envelope"></i>
<input type="email" placeholder="Email" />
</div>
<div class="input-field">
<i class="fas fa-lock"></i>
<input type="password" placeholder="Password" id="signup-password" />
<i class="fas fa-eye password-toggle" onclick="togglePassword('signup-password', this)"></i>
</div>
<div class="password-strength">
<div id="strength-weak"></div>
<div id="strength-medium"></div>
<div id="strength-strong"></div>
</div>
<input type="submit" class="btn" value="Sign up" />
</form>
</div>
</div>
<script src="https://www.gstatic.com/firebasejs/9.18.0/firebase-app-compat.js"></script>
<script src="https://www.gstatic.com/firebasejs/9.18.0/firebase-auth-compat.js"></script>
<script src="firebase.js"></script>
<script>
// Home button
document.getElementById('home-btn').addEventListener('click', function() {
window.location.href = "index.html";
});

function togglePassword(inputId, eyeIcon) {
const passwordField = document.getElementById(inputId);
const isPasswordVisible = passwordField.type === "text";

if (isPasswordVisible) {
passwordField.type = "password";
eyeIcon.classList.remove("fa-eye-slash");
eyeIcon.classList.add("fa-eye");
} else {
passwordField.type = "text";
eyeIcon.classList.remove("fa-eye");
eyeIcon.classList.add("fa-eye-slash");
}
}
</script>
<script>
function handleregister(event) {
// Prevent the form from submitting
event.preventDefault();

// Getting the values of the input fields
const fullName = document.querySelector('.sign-in-form input[type="text"]').value;
const email = document.querySelector('.sign-in-form input[type="email"]').value;
const password = document.querySelector('.sign-in-form input[type="password"]').value;
const confirmPassword = document.querySelectorAll('.sign-in-form input[type="password"]')[1].value;

// Checking if all fields are filled
if (!fullName || !email || !password || !confirmPassword) {
alert("Please fill all fields.");
return;
}

// Checking if password and confirm password match
if (password !== confirmPassword) {
alert("Passwords do not match.");
return;
}

alert("Your Account has been Created Successfully!");
window.location.href = "index.html"; // Redirect to index.html
}
</script>
<div class="panels-container">
<div class="panel left-panel">
<div class="content">
<h3>Already Have a Account ?</h3>
<p>
Discover new experiences with BuddyTrail! <br>Signing in to your Account.
</p>
<button class="btn transparent" id="sign-up-btn">
Login
</button>
</div>
<img src="img/log.svg" class="image" alt="" />
</div>
<div class="panel right-panel">
<div class="content">
<h3>One of us ?</h3>
<p>
Welcome back to our community
</p>
<button class="btn transparent" id="sign-in-btn">
Sign in
</button>
</div>
<img src="img/register.svg" class="image" alt="" />
</div>
</div>
</div>
<a href="index.html" class="homeBtn">
<i class="fas fa-home"></i>
</a>

<script src="auth.js"></script>
<script type="module" src="SignIn-Up-withGithub.js"></script>
</body>
</html>

0 comments on commit 62b0c16

Please sign in to comment.