From 566459b7b813b3ff1576314ad48e7dd3d0f7c9bf Mon Sep 17 00:00:00 2001
From: alisolarflare <alisunderstorm@gmail.com>
Date: Thu, 15 Jun 2017 13:28:54 -0600
Subject: [PATCH] Used JQuery to generate one scenario

---
 questions.html                     | 24 ++------------
 resources/questions/scenarios.js   | 50 ++++++++++++++++++++++++++++++
 resources/questions/scenarios.json |  4 +--
 resources/questions/style.css      |  9 ++++--
 4 files changed, 61 insertions(+), 26 deletions(-)
 create mode 100644 resources/questions/scenarios.js
diff --git a/questions.html b/questions.html
index c01daea..8567216 100644
--- a/questions.html
+++ b/questions.html
@@ -3,8 +3,10 @@
   <head>
     <meta charset="utf-8">
     <title>Questions</title>
+    <script src="./resources/frameworks/jquery-3.2.1.min.js" type="text/javascript"></script>
     <link rel="stylesheet" href="resources/questions/style.css">
     <link rel="stylesheet" href="resources/global/style.css">
+    <script type="text/javascript" src="resources/questions/scenarios.js"></script>
   </head>
   <body>
     <nav>
@@ -110,27 +112,7 @@
         <input type="text" name="" placeholder="Enter response here">
       </li>
       <br />
-      <li>
-        <p class="adult">
-          (question for those over the age of 18... or those mature enough)
-        </p>
-        One of your friends is upset. Someone has been harrassing them,
-        asking for innapropriate pictures, constantly private messaging
-        them about sexual topics without their consent.
-        (<em>THEIR NAME IS FUCKING GIO</em>)
-        Your friend is visibly uncomfortable, what would be your first
-        action?
-        <ul>
-          <li>Try to listen to both sides, see what the other person has to say</li>
-          <li>Go to the moderators, and report what happened.</li>
-          <li>Try to cheer up your friend, diverting their attention to something else</li>
-          <li>Listen to your friend, and reccommend some advice</li>
-          <li>Other...</li>
-        </ul>
-        If this situation is happening to you, what would you choose instead?
-        <br />
-        <input type="text" name=""  placeholder="Enter response here">
-    </li>
+
   </ul>
   <p>More scenarios to come...</p>
   <p>
diff --git a/resources/questions/scenarios.js b/resources/questions/scenarios.js
new file mode 100644
index 0000000..a65f75e
--- /dev/null
+++ b/resources/questions/scenarios.js
@@ -0,0 +1,50 @@
+/*<li>
+  <p class="adult">
+    (question for those over the age of 18... or those mature enough)
+  </p>
+  One of your friends is upset. Someone has been harrassing them,
+  asking for innapropriate pictures, constantly private messaging
+  them without their consent.
+  (<em>THEIR NAME IS FUCKING GIO</em>)
+  Your friend is visibly uncomfortable, what would be your first
+  action?
+  <ul>
+    <li>Try to listen to both sides, see what the other person has to say</li>
+    <li>Go to the moderators, and report what happened.</li>
+    <li>Try to cheer up your friend, diverting their attention to something else</li>
+    <li>Listen to your friend, and reccommend some advice</li>
+    <li>Other...</li>
+  </ul>
+  If this situation is happening to you, what would you choose instead?
+  <br />
+  <input type="text" name=""  placeholder="Enter response here">
+</li>*/
+
+window.onload = function(){
+  $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>");
+
+  $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>")
+
+  $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);
+};
diff --git a/resources/questions/scenarios.json b/resources/questions/scenarios.json
index fac9b04..72a3988 100644
--- a/resources/questions/scenarios.json
+++ b/resources/questions/scenarios.json
@@ -36,11 +36,11 @@
       "adult": false,
     },
     {
-      "name": "Gio",
+      "name": "Harrassment",
       "description":
         "One of your friends is upset. Someone has been harrassing them,
         asking for innapropriate pictures, constantly private messaging
-        them about sexual topics without their consent.
+        them without their consent.
         <br/>
         Your friend is visibly uncomfortable, what would be your first
         action?",
diff --git a/resources/questions/style.css b/resources/questions/style.css
index faca1a8..6cb8c28 100644
--- a/resources/questions/style.css
+++ b/resources/questions/style.css
@@ -1,8 +1,11 @@
-#scenarios li{
+li, li p{
   font-family: "Times New Roman";
 
 }
-.adult{
-  font-family: monospace;
+.aside{
+  color: rgb(250, 250, 250);
+}
+#scenarios li p.adult{
+  font-family: monospace  ;
   color: rgb(240, 0, 100);
 }
