-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
116 lines (89 loc) · 4.27 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
<html>
<head>
<title>Firebase Authentication</title>
<link rel="stylesheet" href="index.css">
</head>
<body>
<div id="login-box">
<div class="left">
<h1 id='status'>Sign Up</h1>
<!-- <form action="" id="contactForm"> -->
<div class="created-alert">Account has been created successfully</div>
<div class="already-exits">Account already exits</div>
<input type="text" id="username" name="username" placeholder="username" />
<input type="text" id="email" name="email" placeholder="E-mail" />
<input type="password" id="password" name="password" placeholder="Password" />
<!-- <input type="password" id="conformpassword" name="conformpassword" placeholder="conform Password" /> -->
<input type="submit" id='signUp' name="signup_submit" value="Sign up" />
<br><br>
<!-- </form> -->
<p>Already have an account?</p>
<a class="already-login" href="login.html">Log-In</a>
</div>
<!-- <div class="right">
<span class="loginwith">Sign in with<br />social network</span>
<button class="social-signin facebook">Log in with facebook</button>
<button class="social-signin twitter">Log in with Twitter</button>
<button class="social-signin google">Log in with Google+</button>
</div>
<div class="or">OR</div> -->
</div>
</body>
<script type="module">
// Import the functions you need from the SDKs you need
import { initializeApp } from "https://www.gstatic.com/firebasejs/9.12.0/firebase-app.js";
import { getDatabase, set, ref, update } from "https://www.gstatic.com/firebasejs/9.12.0/firebase-database.js";
import { getAuth, createUserWithEmailAndPassword } from "https://www.gstatic.com/firebasejs/9.12.0/firebase-auth.js";
// TODO: Add SDKs for Firebase products that you want to use
// https://firebase.google.com/docs/web/setup#available-libraries
// Your web app's Firebase configuration
const firebaseConfig = {
apiKey: "AIzaSyAFonPFBDMWVHUqNGdEH1jnSSCKm89Q6qk",
authDomain: "xpense-tracker-auth.firebaseapp.com",
databaseURL: "https://xpense-tracker-auth-default-rtdb.firebaseio.com",
projectId: "xpense-tracker-auth",
storageBucket: "xpense-tracker-auth.appspot.com",
messagingSenderId: "127890520067",
appId: "1:127890520067:web:e85d61c69d76f9b3f7f636"
};
// Initialize Firebase
const app = initializeApp(firebaseConfig);
const database = getDatabase(app);
const auth = getAuth();
signUp.addEventListener('click', (e) => {
var username = document.getElementById('username').value;
var email = document.getElementById('email').value;
var password = document.getElementById('password').value;
createUserWithEmailAndPassword(auth, email, password)
.then((userCredential) => {
// Signed up
const user = userCredential.user;
// -------------------------------------------
// add to realtime database
set(ref(database, 'user/' + user.uid), {
username: username,
email: email,
// never save your password to database
})
// ---------------------------------------------
// alert('user created')
// enable alert
document.querySelector('.created-alert').style.display = 'block';
// remove the alert
setTimeout(() => {
document.querySelector('.created-alert').style.display = 'none';
}, 3000);
window.location.assign("login.html");
})
.catch((error) => {
const errorCode = error.code;
const errorMessage = error.message;
// alert(errorMessage);
document.querySelector('.already-exits').style.display = 'block';
setTimeout(() => {
document.querySelector('.already-exits').style.display = 'none';
}, 3000);
});
})
</script>
</html>