Skip to content

Commit d2498ba

Browse files
committed
ASYNCHRONOUS PROGRAMMING EXERCISE
1 parent 15b3a6a commit d2498ba

File tree

4 files changed

+165
-0
lines changed

4 files changed

+165
-0
lines changed
Lines changed: 61 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,61 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
<head>
4+
<meta charset="UTF-8">
5+
<title>Shit</title>
6+
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
7+
<style>
8+
#results {
9+
background-color: #FFFFFF;
10+
display: flex;
11+
flex-direction: column;
12+
text-align: center;
13+
}
14+
15+
#results tr {
16+
background-color: #AAAAAA;
17+
padding: 5vh;
18+
font-size: 1.5vw;
19+
}
20+
21+
#results tr:nth-child(odd) {
22+
background-color: #808080;
23+
}
24+
25+
#results tr:first-child {
26+
background-color: #000000;
27+
color: #FFFFFF;
28+
font-weight: bold;
29+
font-size: 2vw;
30+
}
31+
32+
#results tr th {
33+
padding: 1vw;
34+
}
35+
36+
#results tr td {
37+
padding: 1vw;
38+
transition: font-size 0.2s;
39+
}
40+
41+
#results tr:not(:first-child):hover {
42+
background-color: #F0F8FF;
43+
color: #000000;
44+
font-size: 2.25vw;
45+
}
46+
47+
</style>
48+
<script defer src="04.Students.js"></script>
49+
</head>
50+
<body>
51+
<table id="results">
52+
<tr>
53+
<th>ID</th>
54+
<th>First Name</th>
55+
<th>Last Name</th>
56+
<th>Faculty Number</th>
57+
<th>Grade</th>
58+
</tr>
59+
</table>
60+
</body>
61+
</html>

05.AsyncProgramming/04.Students.js

Lines changed: 33 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,33 @@
1+
(() => {
2+
const authorization = {"Authorization": "Basic " + btoa("guest" + ":" + "guest")};
3+
const baseUrl = "https://baas.kinvey.com/appdata/kid_BJXTsSi-e/Students/?query={}&sort=ID";
4+
const tableBody = $("#results tbody");
5+
loadStudents();
6+
7+
function loadStudents() {
8+
sendRequest().then(displayStudents).catch(handleError)
9+
}
10+
11+
function sendRequest() {
12+
return $.ajax({
13+
url: baseUrl,
14+
headers: authorization,
15+
});
16+
}
17+
18+
function displayStudents(data) {
19+
for (let student of data) {
20+
$("<tr>")
21+
.append($("<td>").text(`${student.ID}`))
22+
.append($("<td>").text(`${student.FirstName}`))
23+
.append($("<td>").text(`${student.LastName}`))
24+
.append($("<td>").text(`${student.FacultyNumber}`))
25+
.append($("<td>").text(`${student.Grade}`))
26+
.appendTo(tableBody);
27+
}
28+
}
29+
30+
function handleError(err) {
31+
$("body").text(`${err.status} (${err.textContent})`);
32+
}
33+
})();
Lines changed: 16 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,16 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
<head>
4+
<meta charset="UTF-8">
5+
<title>Secret Knock</title>
6+
<script src="https://code.jquery.com/jquery-3.1.1.min.js"></script>
7+
<script src="07.SecretKnock.js"></script>
8+
</head>
9+
<body>
10+
<script>
11+
$(function () {
12+
secretKnock()
13+
});
14+
</script>
15+
</body>
16+
</html>
Lines changed: 55 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,55 @@
1+
function secretKnock() {
2+
const username = "guest";
3+
const password = "guest";
4+
const baseUrl = "https://baas.kinvey.com/appdata/kid_BJXTsSi-e/knock";
5+
const loginUrl = "https://baas.kinvey.com/user/kid_BJXTsSi-e/login";
6+
let msg = "Knock Knock.";
7+
let authToken;
8+
9+
let loginRequest = {
10+
method: "POST",
11+
url: loginUrl,
12+
headers: {
13+
"Authorization": "Basic " + btoa(username + ":" + password)
14+
},
15+
data: {
16+
username: username,
17+
password: password
18+
}
19+
};
20+
21+
$.ajax(loginRequest).then(getAuthToken)
22+
.catch(handleError);
23+
24+
25+
function getAuthToken(data) {
26+
// console.log(data);
27+
authToken = data._kmd.authtoken;
28+
sendMessageRequest()
29+
}
30+
31+
function sendMessageRequest() {
32+
if (msg) {
33+
$.ajax({
34+
method: "GET",
35+
url: baseUrl + "?query=" + msg,
36+
headers: {
37+
Authorization: 'Kinvey ' + authToken
38+
}
39+
}).then(getMessage).catch(handleError)
40+
}
41+
}
42+
43+
function getMessage(data) {
44+
msg = data.message;
45+
console.log(data.answer);
46+
if (msg) {
47+
console.log(msg);
48+
}
49+
sendMessageRequest()
50+
}
51+
52+
function handleError(err) {
53+
console.log(err);
54+
}
55+
}

0 commit comments

Comments
 (0)