LosAltosHackathon/SignUp.html at main · Logan-Rothe/LosAltosHackathon · 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
<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Food Findr</title>
  <link rel="canonical" href="https://ziadm9.github.io/minecraft/" />
  <link rel="manifest" href="/minecraft/manifest.webmanifest">
  <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@4.6.1/dist/css/bootstrap.min.css">
  <script src="https://cdn.jsdelivr.net/npm/jquery@3.6.0/dist/jquery.slim.min.js"></script>
  <script src="https://cdn.jsdelivr.net/npm/popper.js@1.16.1/dist/umd/popper.min.js"></script>
  <script src="https://cdn.jsdelivr.net/npm/bootstrap@4.6.1/dist/js/bootstrap.bundle.min.js"></script>
  <link rel="stylesheet" href="index.css">
  <link rel="icon" href="Screen Shot 2023-04-08 at 5.59.07 PM.png">
</head>
<body>
  <nav>
    <div class = "row">
      <div class="col-sm">
        <a href ="https://HotSanta.github.io/LosAltosHackathon/index.html"><img src ="Screen Shot 2023-04-08 at 5.59.07 PM.png" id="logo" class="img-fluid" width="80" height = '80' ></a>
      </div>
      <div class="col-sm row justify-content-center">
        <h1 class="py-2 text-light" style="font-size:4rem">FoodFindr</h1>
      </div>
      <div class="col-sm">
        <a href ="https://HotSanta.github.io/LosAltosHackathon/LogIn.html"class ="indexButtons" id ="linkToLogIn">Log In</a>


      </div>
    </div>

  </nav>
    <form id="signup-form">
      <div class="row">
        <div class="col-sm">
          <label>Sign Up</label>
        </div>
      </div>
      <div class="row">
        <div class="col-sm">
          <label>
            <b>Email</b>
            <input type="email" id="signUpEmail" required placeholder="Email">
        </label>
        </div>
      </div>
      <div class="row">
        <div class="col-sm">
          <label>
            <b>Password</b>
            <input type="Password" id="signUpPassword" required placeholder="Password">
        </label>
        </div>
      </div>
      <div class="row">
        <div class ="col-sm">
          <button style = "cursor: pointer;"type="submit" id='emailSignInButton'>
            <b>Sign Up</b>
        </button>
        </div>
      </div>


        <br>
        <div class="alternativeLogins">
            <a title="Sign in with Google" id="google-sign-in-button"><img src="https://codehs.com/uploads/5c566dfffd7b82d08e0b2a733318be18" class="img-fluid" width="80" height="80"></a>        </div>
      </div>
    </form>
    <a class="loginLink" href = "LogIn.html">Already Have an Account?</a>


    <script src="https://www.gstatic.com/firebasejs/8.6.5/firebase-app.js"></script>
    <script src="https://www.gstatic.com/firebasejs/8.6.5/firebase-auth.js"></script>
    <script>
      // Your web app's Firebase configuration
      var firebaseConfig = {
        apiKey: "AIzaSyB4vrsbuA0_8xFlrY_ysnlKPM6bYhvV2l4",
        authDomain: "los-altos-hackathon-project.firebaseapp.com",
        projectId: "los-altos-hackathon-project",
        storageBucket: "los-altos-hackathon-project.appspot.com",
        messagingSenderId: "14005580470",
        appId: "1:14005580470:web:3c7029a8021494c3296c17",
        measurementId: "G-TGJC2F0DR4"
      };

      // Initialize Firebase
      firebase.initializeApp(firebaseConfig);

        const signupButton = document.getElementById('emailSignInButton');
        signupButton.addEventListener('click', (event) => {
            event.preventDefault(); // prevent default form submission behavior
            signUpFirebase(); // call your custom function to handle the form submission
        });

      function signUpFirebase(){
        const email = document.getElementById("signUpEmail").value
        const password = document.getElementById("signUpPassword").value
        firebase.auth().createUserWithEmailAndPassword(email, password)
          .then((userCredential) => {
            // Signed in
            sessionStorage.setItem("loggedIn","yes")
            sessionStorage.setItem("email",email)
            window.location.href = "home.html";
          })
          .catch((error) => {
            var errorCode = error.code;
            var errorMessage = error.message;
            window.alert("Error: " + errorMessage);
          });
      }
        document.getElementById('google-sign-in-button').addEventListener('click', function(event) {
            var provider = new firebase.auth.GoogleAuthProvider();
            firebase.auth().signInWithPopup(provider).then(function(result) {
                sessionStorage.setItem("loggedIn","yes")
                window.location.href = "home.html";
                var profile = result.user.providerData[0];
                var email = profile.email;
                sessionStorage.setItem("email",email)

            }).catch(function(error) {
                var errorCode = error.code;
                var errorMessage = error.message;
                window.alert("Error: " + errorMessage);
            });
        });


    </script>
  <script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script>
  <script src="https://cdn.jsdelivr.net/npm/popper.js@1.14.7/dist/umd/popper.min.js" integrity="sha384-UO2eT0CpHqdSJQ6hJty5KVphtPhzWj9WO1clHTMGa3JDZwrnQq4sF86dIHNDz0W1" crossorigin="anonymous"></script>
  <script src="https://cdn.jsdelivr.net/npm/bootstrap@4.3.1/dist/js/bootstrap.min.js" integrity="sha384-JjSmVgyd0p3pXB1rRibZUAYoIIy6OrQ6VrjIEaFf/nJGzIxFDsf4x0xIM+B07jRM" crossorigin="anonymous"></script>
  </body>
</html>