-
Notifications
You must be signed in to change notification settings - Fork 0
Expand file tree
/
Copy pathindex.html
More file actions
352 lines (307 loc) · 16.9 KB
/
index.html
File metadata and controls
352 lines (307 loc) · 16.9 KB
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
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
349
350
351
352
<!DOCTYPE html>
<head>
<title>JMU TA Portal</title>
<meta charset="UTF-8">
<meta name="author" content="Angela Preziuso">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="https://www.w3schools.com/w3css/4/w3.css">
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Lato">
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Montserrat">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
<link rel="stylesheet" href="css/style.css">
<link rel="icon" type="image/x-icon" href="pictures/favicon.ico" />
</head>
<body onload="viewControl()">
<div id="nav">
<!-- Navbar -->
<div class="w3-top">
<div class="w3-bar w3-white w3-card w3-left-align w3-large">
<a href="availability.html" class="w3-bar-item w3-button w3-hide-small w3-padding-large">Availability</a>
<a href="coverShift.html" class="w3-bar-item w3-button w3-hide-small w3-padding-large">Cover Shift</a>
<a href="" onclick="logout()" style="float: right" class="w3-bar-item w3-button w3-hide-small w3-padding-large">Logout</a>
</div>
</div>
</div>
<div id="stuNav">
<!-- Navbar -->
<div class="w3-top">
<div class="w3-bar w3-white w3-card w3-left-align w3-large">
<a href="" onclick="logout()" style="float: right" class="w3-bar-item w3-button w3-hide-small w3-padding-large">Logout</a>
</div>
</div>
</div>
<div id="index">
<!-- Header -->
<header class="w3-container w3-purple w3-center" style="padding:128px 16px">
<h1 id="JMUCS" style="color:white;" class="w3-margin w3-jumbo">JMU Computer Science</h1>
<p id="TAHours" class="w3-xlarge" style="color: white;">TA Hours</p>
<button class="w3-button w3-black w3-padding-large w3-large w3-margin-top" onclick="toggleLogin()">Login</button>
<div id="id01" class="modal">
<form class="modal-content animate" method="post" onsubmit="login(event)">
<div class="imgcontainer">
<span onclick="toggleLogin()" class="close" title="Close Modal">×</span>
<img src="pictures/avatar.png" alt="Avatar" class="avatar">
</div>
<p id="loginResponseMsg">There is no response</p>
<br>
<div>
<label id="positionLabel">Position? </label>
<select name="role" id="loginRoleOptions"></select>
</div>
<div class="container">
<label id="username"><b>Username</b></label>
<input id="loginEmailField" type="text" placeholder="Enter Username" name="username" required>
<label id="password"><b>Password</b></label>
<input id="loginPasswordField" type="password" placeholder="Enter Password" name="password" required>
<label>
<input type="checkbox" checked="checked" name="remember">Remember me
</label>
<br>
<button type="button" onclick="toggleLogin()" class="cancelbtn">Cancel</button>
<button name="login-submit" type="submit">Login</button>
<br> <span class="psw"><a href="#">Forgot password?</a></span>
<div class="container" style="background-color: white">
</div>
</div>
</form>
</div>
<button class="w3-button w3-black w3-padding-large w3-large w3-margin-top" onclick="toggleSignup()">Sign
Up</button>
<div id="id02" class="modal">
<form class="modal-content animate" method="POST" onsubmit="signup(event)">
<div class="container">
<span onclick="toggleSignup()" class="close" title="Close Modal">×</span>
<h1>Sign Up</h1>
<p>Please fill in this form to create an account.</p>
<p id="signupResponseMsg">There is no response</p>
<hr>
<div>
<label id="positionLabel2">Position? </label>
<select id="signupRoleOptions"></select>
</div>
<br>
<label id="firstName"><b>First Name</b></label>
<input id="signupFirstNameField" type="text" placeholder="First Name" name="firstName" required>
<label id="lastName"><b>Last Name</b></label>
<input id="signupLastNameField" type="text" placeholder="Last Name" name="lastName" required>
<label id="email"><b>Email</b></label>
<input id="signupEmailField" type="text" placeholder="Enter Email" name="email" required>
<label id="password2"><b>Password</b></label>
<input id="signupPasswordField" type="password" placeholder="Enter Password" name="password" required>
<label id="psw-repeat"><b>Repeat Password</b></label>
<input type="password" placeholder="Repeat Password" name="password-repeat" required>
<p>By creating an account you agree to our <a href="#" style="color:dodgerblue">Terms & Privacy</a>.
</p>
<div class="clearfix">
<button type="button" onclick="toggleSignup()" class="cancelbtn">Cancel</button>
<button name="signup-submit" type="submit" class="signupbtn">Sign Up</button>
</div>
</div>
</form>
</div>
</header>
<!-- Who Grid -->
<div class="w3-row-padding w3-padding-64 w3-container">
<div class="w3-content">
<div class="w3-twothird">
<h1>Who</h1>
<h5 class="w3-padding-32">
The TAs are students hired by professors who have previously taken the class in order to help new students
</h5>
<p class="w3-text-grey">
Some of the TAs for the CS Department are: Courtney Taylor, Teddy Pugh, William Krzyzkowski, Maddie Hince, Zeru Tadesse, Maggie Duke, Grant Showalter, Ryan Showalter, Maddie Brower, Virginia Olchevski, Avery Higgins, Megan Gilbert, Emma Macaluso, Cullen
O'Hara, Jeremy Kesterson, AJ Snarr, Andrew Lee, Matt Williams, Hannah Ripley, Nick Morris, Alex Castro, Austin Lam, Nick Morris, Abby Gardner, Emma Macaluso, Rebecca Woods, Chelsea Le Sage, Cindy Zastudil, and Reece Adkins.
</p>
<br>
<table class="table" style="width:140%">
<tr>
<th>CS101</th>
<th>CS149</th>
<th>CS159</th>
<th>CS227</th>
<th>CS261</th>
</tr>
<tr>
<td>Avery Higgins</td>
<td>Cullen O'Hara</td>
<td>Maddie Hince</td>
<td>Matt Williams</td>
<td>Courtney Taylor</td>
</tr>
<tr>
<td>Chelsea Le Sage</td>
<td>Megan Gilbert</td>
<td>Hannah Ripley</td>
<td>Alex Castro</td>
<td>AJ Snarr</td>
</tr>
<tr>
<td>Cynthia Zastudil</td>
<td>Jeremy Kesterson</td>
<td>Zeru Tadesse</td>
</tr>
<tr>
<td>Rebecca Woods</td>
<td>Virginia Olchevski</td>
</tr>
<tr>
<td>Teddy Pugh</td>
<td>Maddie Brower</td>
</tr>
<tr>
<td>Grant Showalter</td>
<td>Reece Adkins</td>
</tr>
</table>
</div>
<div class="w3-third w3-center">
<i class="fa fa-user-circle-o w3-padding-64 w3-text-purple"></i>
</div>
</div>
</div>
<!-- Why Grid -->
<div class="w3-row-padding w3-dark-grey w3-padding-64 w3-container">
<div class="w3-content">
<div class="w3-third w3-center">
<i class="fa fa-edit w3-padding-64 w3-text-purple w3-margin-right"></i>
</div>
<div class="w3-twothird">
<h1>Why</h1>
<h5 class="w3-padding-32">Why have TA Hours?</h5>
<p class="w3-text-light-grey">
TA Hours were put together in order to help students that need more assistance in a given class outside of class. Sometimes people need a little bit more practice, or need a little push into jump starting an idea in regards to a class project, that's
why we have TA hours.
</p>
</div>
</div>
</div>
<!-- How Grid -->
<div class="w3-row-padding w3-padding-64 w3-container">
<div class="w3-content">
<div class="w3-twothird">
<h1>How</h1>
<h5 class="w3-padding-32">How does TA Hours work?</h5>
<p class="w3-text-grey">
In order to use this TA system you have to Join as a student or TA. If you are not hired by the CS department, you will not be able to create a TA account. Also, only certain faculty will have the ability to join as admin. As a student you will be able
to see who is working for each class and time. You will be add yourself to the queue for the given class you need help with with whatever TA is assigned to that class. TA will be able to set their availability and see their schedule
for the week.
</p>
</div>
<div class="w3-third w3-center">
<i class="fa fa-handshake-o w3-padding-64 w3-text-purple"></i>
</div>
</div>
</div>
<!-- Get Involved Grid -->
<div class="w3-row-padding w3-dark-grey w3-padding-64 w3-container">
<div class="w3-content">
<div class="w3-third w3-center">
<i class="fa fa-comments w3-padding-64 w3-text-purple w3-margin-right"></i>
</div>
<div class="w3-twothird">
<h1>Get Invloved</h1>
<h5 class="w3-padding-32">Do you want to be come a TA?</h5>
<p class="w3-text-light-grey">
Keep an eye out on the JMU CS ListServ. TA Applications get send out on the ListServ and the process begins. Really think about why you would want to be a TA and how beneficial it is to people who really need help.
</p>
</div>
</div>
</div>
</div>
<div id="TA">
<iframe class="frame" src="http://www.piazza.com/" onload='javascript:(function(o){o.style.height=o.contentWindow.document.body.scrollHeight+"px ";}(this));' style="height:500px;width:75%;border:none;overflow:hidden;margin-top:50px;"></iframe>
<iframe class="queue" src="queue.html" onload='javascript:(function(o){o.style.height=o.contentWindow.document.body.scrollHeight+"px ";}(this));' style="float:right;height:500px;width:25%;border:none;overflow:hidden;margin-top:50px; "></iframe>
<iframe class="cal" src="cal.html" onload='javascript:(function(o){o.style.height=o.contentWindow.document.body.scrollHeight+"px ";}(this));' style="height:600px;width:100%;border:none;overflow:hidden;margin-top:50px; "></iframe>
</div>
<div id="admin">
<iframe class="frame" src="shiftCoverTable.html" onload='javascript:(function(o){o.style.height=o.contentWindow.document.body.scrollHeight+"px";}(this));' style="height:500px;width:75%;border:none;overflow:hidden;margin-top:50px;"></iframe>
<iframe class="cal" src="cal.html" onload='javascript:(function(o){o.style.height=o.contentWindow.document.body.scrollHeight+"px";}(this));' style="height:600px;width:100%;border:none;overflow:hidden;margin-top:50px;"></iframe>
</div>
<div id="foot">
<div class="w3-container w3-black w3-center w3-padding-64">
<h1 class="w3-margin w3-text-light-grey w3-xlarge">Quote of the day: if it breaks... you're one step closer.
</h1>
</div>
<div class="w3-container w3-white w3-center w3-padding-16">
<img src="pictures/cise-logo.png" alt="CISE Logo" /> <br>
</div>
<!-- Footer -->
<footer class="w3-container w3-padding-40 w3-center">
<div class="w3-xlarge w3-padding-30">
<i class="fa fa-facebook-official w3-hover-opacity"></i>
<i class="fa fa-instagram w3-hover-opacity"></i>
<i class="fa fa-snapchat w3-hover-opacity"></i>
<i class="fa fa-pinterest-p w3-hover-opacity"></i>
<i class="fa fa-twitter w3-hover-opacity"></i>
<i class="fa fa-linkedin w3-hover-opacity"></i>
</div>
</footer>
<script src="js/main.js"></script>
<script src="js/user/login.js"></script>
<script src="js/user/logout.js"></script>
<script src="js/user/signup.js"></script>
<script>
document.addEventListener('DOMContentLoaded', populateData, false);
</script>
</div>
<script>
const viewControl = async() => {
const visitsResponse = await fetch("api/acnt/sessions.php", {
credentials: "same-origin"
})
const resp = await visitsResponse.json()
switch (resp.role) {
case 1:
var x = document.getElementById("nav");
x.style.display = "none";
var x = document.getElementById("index");
x.style.display = "block";
var x = document.getElementById("TA");
x.style.display = "none";
var x = document.getElementById("admin");
x.style.display = "none";
break;
case 2:
var x = document.getElementById("nav");
x.style.display = "block";
var x = document.getElementById("index");
x.style.display = "none";
var x = document.getElementById("TA");
x.style.display = "block";
var x = document.getElementById("admin");
x.style.display = "none";
break;
case 3:
var x = document.getElementById("nav");
x.style.display = "none";
var x = document.getElementById("index");
x.style.display = "block";
var x = document.getElementById("TA");
x.style.display = "none";
var x = document.getElementById("admin");
x.style.display = "none";
break;
case 4:
var x = document.getElementById("nav");
x.style.display = "block";
var x = document.getElementById("index");
x.style.display = "none";
var x = document.getElementById("TA");
x.style.display = "none";
var x = document.getElementById("admin");
x.style.display = "block";
break;
default:
var x = document.getElementById("nav");
x.style.display = "none";
var x = document.getElementById("index");
x.style.display = "block";
var x = document.getElementById("TA");
x.style.display = "none";
var x = document.getElementById("admin");
x.style.display = "none";
}
}
</script>
</body>
</html>