Wrote front-end for Hello Location; Made Javascript generate request table
This commit is contained in:
parent
c19620348a
commit
6a81961f59
2 changed files with 23 additions and 54 deletions
|
@ -3,49 +3,30 @@ https://www.youtube.com/watch?v=h0ZUpPiV1ac
|
||||||
*/
|
*/
|
||||||
|
|
||||||
window.onload = function(){
|
window.onload = function(){
|
||||||
$.get("./data/players.json", function(data){
|
|
||||||
console.log(data);
|
|
||||||
document.getElementById('atom-players').innerHTML = JSON.stringify(data);
|
|
||||||
});
|
|
||||||
|
|
||||||
$.get("https://server.figytuna.com:8080/ali/hello/world", function(data){
|
const serverPath = "https://server.figytuna.com:8080/ali/hello/";
|
||||||
document.getElementById('hello-world').innerHTML = data;
|
const pages = [
|
||||||
});
|
"world",
|
||||||
|
"data",
|
||||||
|
"players",
|
||||||
|
"location"
|
||||||
|
]
|
||||||
|
//Generate HTML table
|
||||||
|
for (pagePath in pages){
|
||||||
|
//Adds new table row based on the data request
|
||||||
|
const $newTableRow = $("<tr>"
|
||||||
|
+ "<td>Hello " + pagePath + "</td>"
|
||||||
|
+ "<td id=\"hello-"+ pagePath + "\"></td>"
|
||||||
|
+ "</tr>");
|
||||||
|
|
||||||
$.get("https://server.figytuna.com:8080/ali/hello/data", function(data){
|
//Appends new table row to table
|
||||||
document.getElementById('hello-data').innerHTML = data;
|
$("#hello-table").after($newTableRow);
|
||||||
});
|
|
||||||
$.get("https://server.figytuna.com:8080/ali/hello/players", function(data){
|
|
||||||
document.getElementById('hello-players').innerHTML = data;
|
|
||||||
});
|
|
||||||
/*
|
|
||||||
let http = new XMLHttpRequest();
|
|
||||||
|
|
||||||
http.onreadystatechange = function(){
|
|
||||||
const finalState = 4;
|
|
||||||
const idealStatus = 200;
|
|
||||||
|
|
||||||
if(http.readyState == finalState && http.status == idealStatus){
|
|
||||||
console.log(JSON.parse(http.response));
|
|
||||||
}
|
}
|
||||||
|
|
||||||
|
//Gets Table data from server
|
||||||
|
for (pagePath in pages){
|
||||||
|
$.get(serverPath + pagePath, function(data){
|
||||||
|
document.getElementById("hello-" + pagePath).innerHTML = data;
|
||||||
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
const method = "GET";
|
|
||||||
const filepath = "data/players.json";
|
|
||||||
const isASYNC = true;
|
|
||||||
http.open(method, filepath, isASYNC);
|
|
||||||
http.send();
|
|
||||||
*/
|
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
/* READY STATES
|
|
||||||
|
|
||||||
0 - Request not initialized
|
|
||||||
1 - Request has been set up
|
|
||||||
2 - Request has been sent
|
|
||||||
3 - Request is in process
|
|
||||||
4 - Request is complete
|
|
||||||
|
|
||||||
*/
|
|
||||||
|
|
14
sandbox.html
14
sandbox.html
|
@ -19,23 +19,11 @@
|
||||||
|
|
||||||
<h2>ButtonPresents Stuff</h2>
|
<h2>ButtonPresents Stuff</h2>
|
||||||
|
|
||||||
<table>
|
<table id="hello-table">
|
||||||
<tr>
|
<tr>
|
||||||
<th>Data Requests</th>
|
<th>Data Requests</th>
|
||||||
<th>Data Responses</th>
|
<th>Data Responses</th>
|
||||||
</tr>
|
</tr>
|
||||||
<tr>
|
|
||||||
<td>Hello World</td>
|
|
||||||
<td id="hello-world"></td>
|
|
||||||
</tr>
|
|
||||||
<tr>
|
|
||||||
<td>Hello Data</td>
|
|
||||||
<td id="hello-data"></td>
|
|
||||||
</tr>
|
|
||||||
<tr>
|
|
||||||
<td>Hello Players</td>
|
|
||||||
<td id= "hello-players"></td>
|
|
||||||
</tr>
|
|
||||||
</table>
|
</table>
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
||||||
|
|
Loading…
Reference in a new issue