-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
196 lines (182 loc) · 9.78 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
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
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
<!DOCTYPE html>
<html lang="en">
<head>
<link rel="icon" href="/art/ezFavi.png">
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Register</title>
<!-- Include Petite Vue -->
<script src="https://unpkg.com/petite-vue" defer init></script>
<!-- <link rel="stylesheet" href="style.css"> nah actually we doing bootstrap lol--->
<link href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-9aIt2nRpC12Uk9gS9baDl411NQApFmC26EwAOH8WgZl5MYYxFfc+NcPb1dKGj7Sk" crossorigin="anonymous">
<!-- Simple style tag to center text and divs-->
<style>
body {
text-align: center;
}
.center-div {
display: inline-block;
margin: 0 auto;
}
</style>
</head>
<body>
<!--Start of body, putting nav bar first-->
<nav class="navbar navbar-expand-lg navbar-light bg-light">
<a class="navbar-brand" href="home.html">
<img src="/art/ezSVG.svg" alt="Easy Intern" height="30" class="d-incline-block align-top">
</a>
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarNav" aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarNav">
<ul class="navbar-nav">
<li class="nav-item active">
<a class="nav-link" href="home.html">Home</a>
</li>
<li class="nav-item">
<a class="nav-link" href="index.html">Register</a>
</li>
<li class="nav-item">
<a class="nav-link" href="login.html">Login</a>
</li>
<li class="nav-item">
<a class="nav-link" href="contact.html">Contact Us</a>
</li>
<li class="nav-item">
<a class="nav-link" href="faq.html">FAQ</a>
</li>
<!-- Add more links as needed -->
</ul>
</div>
</nav>
<!--if we make a change to this nav bar we have to copy and paste it to all other pages, this is what frameworks like react and vue solve-->
<h1>Easy Intern Website</h1>
<!--making a form with petite vue-->
<div class="center-div" v-scope="{ firstName: '', lastName: '', email: '', password: '', areaCode:'', phoneNumber:'', resume:'', userType:'', submitForm: submitForm}">
<h2>Register</h2>
<form @submit.prevent="submitForm">
<div class="form-group">
<input type="text" v-model="firstName" name="firstName" id="firstName" placeholder="First name*" class="form-control" required>
<input type="text" v-model="lastName" name= "lastname" id= "lastName" placeholder="Last name*" class="form-control" required>
<input type="email" v-model="email" name="email" id="email" placeholder="Email*" class="form-control" required>
<input type="password" v-model="password" name="password" id="password" placeholder="Password*" class="form-control" required>
<input type="number" v-model="areaCode" name="areaCode" id="areaCode" placeholder="Country Code*" class="form-control" required>
<input type="tel" v-model="phoneNumber" name="phoneNumber" id="phoneNumber" placeholder="Phone Number*" class="form-control" required>
<label for="resumeForm">Upload Resume:</label>
<input type="file" v-model="resume" name="resume" id="resume" placeholder="Resume*" class="form-control" required>
<label for="userType">Who are you</label>
<select name="userType" v-model="userType" name="userType" id="userType" placeholder="userType" class="form-control" required>Who are you
<option value="student">Student</option>
<option value="company">Employer</option>
</select>
</div>
<button type="submit" class="btn btn-primary" style="background-color: black; color: white;">Register</button>
</form>
</div>
<!-- The core Firebase JS SDK is always required and must be listed first -->
<script src="https://www.gstatic.com/firebasejs/9.22.2/firebase-app-compat.js"></script>
<script src="https://www.gstatic.com/firebasejs/9.22.2/firebase-firestore-compat.js"></script>
<script src="https://www.gstatic.com/firebasejs/9.22.2/firebase-auth-compat.js"></script>
<script src="https://www.gstatic.com/firebasejs/9.22.2/firebase-storage-compat.js"></script>
<!--firebase config scripts-->
<script>
var firebaseConfig = {
apiKey: "AIzaSyD3uOK9dhNN_yV9Src3FHQoKFPIuqxzu8g",
authDomain: "easy-intern.firebaseapp.com",
projectId: "easy-intern",
storageBucket: "easy-intern.appspot.com",
messagingSenderId: "1032116527504",
appId: "1:1032116527504:web:7bb7fab99a11d5fae29315",
measurementId: "G-XMR4VMND5T"
};
// Initialize Firebase
const firebaseApp = firebase.initializeApp(firebaseConfig);
const db = firebaseApp.firestore();
const auth = firebaseApp.auth();
</script>
<!--Functionality for the form-->
<script>
const submitForm = function() {
console.log(this.firstName, this.lastName, this.email, this.password, this.areaCode, this.phoneNumber, this.userType);
// Upload resume to Firebase Storage
var file = document.getElementById('resume').files[0]; // get the file
var storageRef = firebase.storage().ref('resumes/' + file.name); // create a reference to the file in Firebase Storage
storageRef.put(file).then((snapshot) => {
console.log('Uploaded a blob or file!');
});
// Create a new user in your 'users' collection
auth.createUserWithEmailAndPassword(this.email, this.password)
.then(userCredential => {
// Signed in
var user = userCredential.user;
db.collection("users").doc(user.uid).set({ // use .doc().set() instead of .add()
firstName: this.firstName,
lastName: this.lastName,
email: this.email,
areaCode: this.areaCode,
phoneNumber: this.phoneNumber,
userType: this.userType // added userType
})
.then(() => {
console.log("User document successfully written!");
if(this.userType == "student") {
// Create new student document
var newStudentData = {
major: "Unspecified", // You can specify these fields later
gpa: 0,
userId: user.uid
};
db.collection("students").doc(user.uid).set(newStudentData)
.then(() => {
console.log("Student written with ID: ", user.uid);
})
.catch((error) => {
console.error("Error adding student: ", error);
});
}
})
.catch((error) => {
console.error("Error adding document: ", error);
});
})
.catch((error) => {
var errorCode = error.code;
var errorMessage = error.message;
console.error("Error creating user:", errorMessage);
});
};
</script>
<button id="secret" onClick="migrateData()">One time run</button>
<script>
function migrateData() {
// Assuming db is your Firestore database instance
db.collection('users').get().then((querySnapshot) => {
querySnapshot.forEach((doc) => {
var userData = doc.data();
if(userData.userType === "student") {
// Create new student document
var newStudentData = {
major: "Unspecified", // Set to some default value
gpa: 0, // Set to some default value
userId: doc.id
};
db.collection("students").doc(doc.id).set(newStudentData)
.then(() => {
console.log("Student written with ID: ", doc.id);
})
.catch((error) => {
console.error("Error adding student: ", error);
});
}
});
});
console.log("alright we did it")
}
</script>
<!-- add this just before body closing tag-->
<script src="https://code.jquery.com/jquery-3.5.1.slim.min.js" integrity="sha384-DfXdz2htPH0lsSSs5nCTpuj/zy4C+OGpamoFVy38MVBnE+IbbVYUew+OrCXaRkfj" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js" crossorigin="anonymous"></script>
</body>
</html>