generalized JSON, so that scenarios are loaded from JSON file

questions.html

@@ -78,41 +78,6 @@
     </p>
     <h3>Scenarios</h3>
     <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>
   <p>More scenarios to come...</p>
   <p>

resources/questions/scenarios.js

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

resources/sandbox/sandbox.js

@@ -1,63 +1,58 @@
-/* AJAX Tutorial, By The Net Ninja
-https://www.youtube.com/watch?v=h0ZUpPiV1ac
-*/
+//AJAX request method
+updateCell = function(path, pageType, requestType){
+  path = path.toLowerCase();
+  const $element = $("#hello-" + path);
+  $.ajax({
+    type: requestType, //GET or POST
+    url: "https://server.figytuna.com:8080/ali/hello/" + path,
+    timeout: 2000, //ms
+    beforeSend: function(data){
+      $element.html("<em>Loading...</em>");
+    },
+    success: function(data){
+      if (pageType == "html"){
+        $element.html($data);
+      }else{
+        $element.text($data);
+      }
+    },
+    error: function(e){
+      $("#hello-" + path).html("<em>Error " + e.status + " " + e.statusText + "</em>");
+    }
+  });
+}
 
 window.onload = function(){
-
-  const serverPath = "https://server.figytuna.com:8080/ali/hello/";
-  const pages = {
-    "unsafe": [
-      "World",
-      "Data",
-      "Post"
-    ],
-    "html":[
-      "Location",
-      "Players",
-    ]
+  const pageList = {
+    "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");
+  //Generate HTML table
+  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($newTableRow);
+      $("#hello-table").append($row);
     }
   }
-
-  dataRequest = function(pagePath, pageType, requestType){
-    $.ajax({
-      type: requestType,
-      url: serverPath + pagePath.toLowerCase(),
-      timeout: 2000,
-      beforeSend: function(data){
-        $("#hello-" + pagePath.toLowerCase()).html("<em>Loading...</em>");
-      },
-      success: function(data){
-        $element = $("#hello-" + pagePath.toLowerCase())
-        if (pageType == "html"){
-          $element.html($data);
-        }else{
-          $element.text($data);
-        }
-      },
-      error: function(e){
-        $("#hello-" + pagePath.toLowerCase()).html("<em>Error " + e.status + " " + e.statusText + "</em>");
-      }
-    });
-  }
-  //Gets Table data from server
-  for (const pagePath of pages["html"]){
-    dataRequest(pagePath, "safe", "GET");
+  //Populate Table Data
+  for (const id of pageList["html"]){
+    //Gets data from server, adds response to table
+    updateCell(id, "safe", "GET");
   }
 
-  for (const pagePath of pages["unsafe"]){
-    dataRequest(pagePath, "unsafe", "GET");
+  for (const id of pageList["unsafe"]){
+    //Gets data from server, adds response to table
+    updateCell(id, "unsafe", "GET");
   }
+
+
 }

sandbox.html

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