YogNMe/index2.html at main · Arpitsing/YogNMe · GitHub

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
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
<html>
<head>
 <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta charset="utf-8">
    <title>Login / Sign Up Form</title>
       <script src="./src/login.js"></script>
    <script src="https://www.gstatic.com/firebasejs/9.5.0/firebase-app.js"></script>
    <link rel="shortcut icon" href="/assets/favicon.ico">
    <link rel="stylesheet" href="./src/login.css">
</head>

<body>
<div class = "container">
  <img src="imgs/favicon.ico" />

     <div id="createAccount">
    <h1>Create Account</h1>
      <div >
      <input type="text" id="username" name="username" placeholder="Username" />
      </div>
            <div >
      <input type="text" id="email" name="email" placeholder="E-mail" />
      </div>
            <div >
      <input type="password" id="password" name="password" placeholder="Password" />
      </div>
      <input type="submit" id='signUp' name="signup_submit" value="Sign up" />
                  <p class="form__text">
                <a class="form__link" href="index.html" id="linkLogin">Already have an account? Sign in</a>
            </p>
</div>

</div>
    <script src="./src/login.js"></script>
<script type="module">
  // Import the functions you need from the SDKs you need
  import { initializeApp } from "https://www.gstatic.com/firebasejs/9.5.0/firebase-app.js";
  import { getDatabase, set, ref, update } from "https://www.gstatic.com/firebasejs/9.5.0/firebase-database.js";
  import { getAuth, createUserWithEmailAndPassword, signInWithEmailAndPassword, onAuthStateChanged, signOut } from "https://www.gstatic.com/firebasejs/9.5.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 = {
    //yout config code
      apiKey: "AIzaSyA8QAi9aVbUgJAfrni69Fh446IkIPhFS4E",
  authDomain: "login-4a171.firebaseapp.com",
  projectId: "login-4a171",
  storageBucket: "login-4a171.appspot.com",
  messagingSenderId: "150871827794",
  appId: "1:150871827794:web:5f961fa403d0eed191868b"
  };

  // Initialize Firebase
  const app = initializeApp(firebaseConfig);
  const database = getDatabase(app);
  const auth = getAuth();
  const signUp = document.getElementById('signUp');
  const login = document.getElementById('login');

signUp.addEventListener('click',(e) => {

  var email = document.getElementById('email').value;
  var password = document.getElementById('password').value;
  var username = document.getElementById('username').value;

  createUserWithEmailAndPassword(auth, email, password)
    .then((userCredential) => {
     // Signed in
      const user = userCredential.user;
        alert('user created');
      set(ref(database, 'users/' + user.uid),{
          username: username,
          email: email
      })

      alert('user created!');
      // ...
    })
    .catch((error) => {
      const errorCode = error.code;
      const errorMessage = error.message;

      alert(errorMessage);
    // ..
    });

});

 login.addEventListener('click',(e)=>{
   var email = document.getElementById('email1').value;
   var password = document.getElementById('password1').value;

      signInWithEmailAndPassword(auth, email, password)
      .then((userCredential) => {
        // Signed in
        const user = userCredential.user;

        const dt = new Date();
         update(ref(database, 'users/' + user.uid),{
          last_login: dt,
        })

         alert('User loged in!');
        // ...
      })
      .catch((error) => {
        const errorCode = error.code;
        const errorMessage = error.message;

        alert(errorMessage);
  });

 });

const user = auth.currentUser;
onAuthStateChanged(auth, (user) => {
  if (user) {
    // User is signed in, see docs for a list of available properties
    // https://firebase.google.com/docs/reference/js/firebase.User
    const uid = user.uid;
    //bla bla bla
    // ...
  } else {
    // User is signed out
    // ...
    //bla bla bla
  }
});

logout.addEventListener('click',(e)=>{

   signOut(auth).then(() => {
     // Sign-out successful.
     alert('user loged out');
   }).catch((error) => {
     // An error happened.
     const errorCode = error.code;
     const errorMessage = error.message;

        alert(errorMessage);
   });

});

</script>
</body>

</html>