generalized JSON, so that scenarios are loaded from JSON file

This commit is contained in:
alisolarflare 2017-06-15 17:08:23 -06:00
parent cc030bff87
commit 8cdcad37a9
4 changed files with 73 additions and 109 deletions

View file

@ -78,41 +78,6 @@
</p> </p>
<h3>Scenarios</h3> <h3>Scenarios</h3>
<ul id="scenarios"> <ul id="scenarios">
<li>
You find your base raided: All of your stuff is missing, chests are empty.
What would be your first action?
<ul>
<li>Try to find who stole the goods, and try to get it back</li>
<li>Go to the moderators, report what happened.</li>
<li>Ignore it all, and try to gather resources to recover</li>
<li>Question yourself... has your base really been raided?</li>
<li>Other...</li>
</ul>
Why would you choose this action?
<br />
<input type="text" name="" placeholder="Enter response here">
</li>
<br />
<li>
Someone is breaking Rule #1 and well... being a dick. They'are
angry about (having their base raided/being harrassed by another
member/their family treating them unfairly/griefers destroying
their base), and are swearing, insulting people, and generally
making chat a negative enviornment.
What is your first action?
<ul>
<li>Attempt to defuse the situation, listening</li>
<li>Go to the moderators, report what happened.</li>
<li>Ignore them with /ignore, and continue playing your game</li>
<li>See if there is some way distract them from their issue</li>
<li>Other...</li>
</ul>
If you were a moderator, what would you choose instead? Why?
<br />
<input type="text" name="" placeholder="Enter response here">
</li>
<br />
</ul> </ul>
<p>More scenarios to come...</p> <p>More scenarios to come...</p>
<p> <p>

View file

@ -1,35 +1,34 @@
window.onload = function(){ window.onload = function(){
addScenario = function(object){ addScenario = function(scenario){
let $liElement = $("<li id=\"scenarios-${scenario.name}\"></li>")
if(scenario.adult == true){
$adultText = $("<p class=\"adult\">(question for those over the age of 18... or those mature enough)</p>"); $adultText = $("<p class=\"adult\">(question for those over the age of 18... or those mature enough)</p>");
$description = $( $liElement.append($adultText);
"<p>One of your friends is upset. Someone has been harrassing them, asking" }
+ "for innapropriate photos, constantly private messaging them without consent" $description = $("<p>" + scenario.description +"</p>");
+ "<br><span class=\"aside\">(THEIR NAME IS FUCKING GIO)</span><br>"
+ "Your friend is visibly uncomfortable, would would be your first action?</p>");
$options = $("<ul></ul>"); $options = $("<ul></ul>");
$options.append($("<li>Try to listen to both sides, see what the other person has to say</li>")); for(option of scenario.options){
$options.append($("<li>Go to the moderators, and report what happened.</li>")); $options.append($("<li>" + option + "</li>"));
$options.append($("<li>Try to cheer up your friend, diverting their attention to something else</li>")); }
$options.append($("<li>Listen to your friend, and reccommend some advice</li>")); $question = $("<p>" + scenario.question + "</p>");
$options.append($("<li>Other...</li>"));
$question = $("<p>If this was happening to you, what would you choose instead?</p>")
$input = $("<input type=\"text\" placeholder=\"Enter response here\">"); $input = $("<input type=\"text\" placeholder=\"Enter response here\">");
$liElement = $("<li id=\"scenarios-harrassment\"></li>")
$liElement.append($adultText);
$liElement.append($description); $liElement.append($description);
$liElement.append($options); $liElement.append($options);
$liElement.append($input); $liElement.append($input);
console.table($liElement);
$("#scenarios").append($liElement); $("#scenarios").append($liElement);
} }
$.getJSON("./resources/questions/scenarios.json", function(data){ $.getJSON("./resources/questions/scenarios.json", "", function(data){
console.log(data); for(const scenario of data.scenarios){
addScenario(scenario);
}
}); });
}; }

View file

@ -1,46 +1,15 @@
/* AJAX Tutorial, By The Net Ninja //AJAX request method
https://www.youtube.com/watch?v=h0ZUpPiV1ac updateCell = function(path, pageType, requestType){
*/ path = path.toLowerCase();
const $element = $("#hello-" + path);
window.onload = function(){
const serverPath = "https://server.figytuna.com:8080/ali/hello/";
const pages = {
"unsafe": [
"World",
"Data",
"Post"
],
"html":[
"Location",
"Players",
]
}
//Generate HTML table
for (const pageType in pages){
for (const pagePath of pages[pageType]){
//Adds new table row based on the data request
const $newTableRow = $("<tr>"
+ "<td>Hello " + pagePath + "</td>"
+ "<td id=\"hello-"+ pagePath.toLowerCase() + "\"></td>"
+ "</tr>");
console.log(pagePath + " added");
//Appends new table row to table
$("#hello-table").append($newTableRow);
}
}
dataRequest = function(pagePath, pageType, requestType){
$.ajax({ $.ajax({
type: requestType, type: requestType, //GET or POST
url: serverPath + pagePath.toLowerCase(), url: "https://server.figytuna.com:8080/ali/hello/" + path,
timeout: 2000, timeout: 2000, //ms
beforeSend: function(data){ beforeSend: function(data){
$("#hello-" + pagePath.toLowerCase()).html("<em>Loading...</em>"); $element.html("<em>Loading...</em>");
}, },
success: function(data){ success: function(data){
$element = $("#hello-" + pagePath.toLowerCase())
if (pageType == "html"){ if (pageType == "html"){
$element.html($data); $element.html($data);
}else{ }else{
@ -48,16 +17,42 @@ window.onload = function(){
} }
}, },
error: function(e){ error: function(e){
$("#hello-" + pagePath.toLowerCase()).html("<em>Error " + e.status + " " + e.statusText + "</em>"); $("#hello-" + path).html("<em>Error " + e.status + " " + e.statusText + "</em>");
} }
}); });
} }
//Gets Table data from server
for (const pagePath of pages["html"]){ window.onload = function(){
dataRequest(pagePath, "safe", "GET"); const pageList = {
"unsafe": ["World", "Data", "Post"],
"html": ["Location", "Players"],
} }
for (const pagePath of pages["unsafe"]){ //Generate HTML table
dataRequest(pagePath, "unsafe", "GET"); for (const pageType in pageList){
for (const path of pageList[pageType]){
//Adds new table row based on the data request
const $row = $("<tr></tr>");
const $request = $("<td>Hello " + path + "</td>");
const $response = $("<td id=\"hello-"+ path.toLowerCase() + "\"></td>")
$row.append($request);
$row.append($response);
//Appends new table row to table
$("#hello-table").append($row);
} }
} }
//Populate Table Data
for (const id of pageList["html"]){
//Gets data from server, adds response to table
updateCell(id, "safe", "GET");
}
for (const id of pageList["unsafe"]){
//Gets data from server, adds response to table
updateCell(id, "unsafe", "GET");
}
}

View file

@ -18,8 +18,13 @@
<h1>Developer's Sandbox</h1> <h1>Developer's Sandbox</h1>
<!-- h2>ATOM Live Server Stuff</h2> <h2>ATOM Live Server Stuff</h2>
<p id="atom-players"></p --> <table id="atom-table">
<tr>
<th>Data Requests</th>
<th>Data Responses</th>
</tr>
</table>
<h2>ButtonPresents Stuff</h2> <h2>ButtonPresents Stuff</h2>