From 8077d37f118da5c574962f6f513292c77563fce5 Mon Sep 17 00:00:00 2001
From: Quincy Larson <michaelqlarson@gmail.com>
Date: Sun, 17 May 2015 16:57:16 -0700
Subject: [PATCH] add coursewares and note to zipline basejump views

---
 seed_data/coursewares.json                   | 98 ++++++++++++++++++++
 views/coursewares/showZiplineOrBasejump.jade |  7 ++
 2 files changed, 105 insertions(+)

diff --git a/seed_data/coursewares.json b/seed_data/coursewares.json
index 28f2a0bff3a..243cf5208f7 100644
--- a/seed_data/coursewares.json
+++ b/seed_data/coursewares.json
@@ -3065,6 +3065,101 @@
     "completionMessage": ""
   },
 
+  {
+    "_id" : "bad87fee1348bd9aeb908845",
+    "name": "Line up Form Elements Responsively with Bootstrap",
+    "difficulty" : 0.063,
+    "description": [
+      "."
+    ],
+    "tests": [
+      "assert($('.row').length > 4, 'Wrap your all of your checkboxes inside one div with the class \"row\".')",
+      "assert($('.col-xs-5').length > 0, 'Wrap each of your checkboxes inside its own div with the class \"col-xs-4\".')",
+      "assert($('.col-xs-7').length > 0, 'Wrap each of your checkboxes inside its own div with the class \"col-xs-4\".')"
+    ],
+    "challengeSeed": [
+      "<link href='http://fonts.googleapis.com/css?family=Lobster' rel='stylesheet' type='text/css'>",
+      "<style>",
+      "  h2 {",
+      "    font-family: Lobster, Monospace;",
+      "  }",
+      "",
+      "  .thick-green-border {",
+      "    border-color: green;",
+      "    border-width: 10px;",
+      "    border-style: solid;",
+      "    border-radius: 50%;",
+      "  }",
+      "",
+      "</style>",
+      "",
+      "<div class='row'>",
+      "  <div class='col-xs-8'>",
+      "    <h2 class='text-primary text-center'>CatPhotoApp</h2>",
+      "  </div>",
+      "  <div class='col-xs-4'>",
+      "    <a href='#'><img class='img-responsive thick-green-border' src='https://bit.ly/fcc-kittens'/></a>",
+      "  </div>",
+      "</div>",
+      "<br>",
+      "<img src='http://bit.ly/fcc-kittens2' class='img-responsive'>",
+      "<br>",
+      "<div class='row'>",
+      "  <div class='col-xs-4'>",
+      "    <button class='btn btn-block btn-primary'><i class='fa fa-thumbs-up'></i> Like</button>",
+      "  </div>",
+      "  <div class='col-xs-4'>",
+      "    <button class='btn btn-block btn-info'><i class='fa fa-info-circle'></i> Info</button>",
+      "  </div>",
+      "  <div class='col-xs-4'>",
+      "    <button class='btn btn-block btn-danger'><i class='fa fa-trash'></i> Delete</button>",
+      "  </div>",
+      "</div>",
+      "<p>Things cats love:</p>",
+      "<ul>",
+      "  <li>cat nip</li>",
+      "  <li>laser pointers</li>",
+      "  <li>lasagna</li>",
+      "</ul>",
+      "<p>Top 3 things cats hate:</p>",
+      "<ol>",
+      "  <li>flea treatment</li>",
+      "  <li>thunder</li>",
+      "  <li>other cats</li>",
+      "</ol>",
+      "<form action=\"/submit-cat-photo\">",
+      "  <br>",
+      "  <div class='row'>",
+      "    <div class='col-xs-6'>",
+      "      <label><input type='radio' name='indoor-outdoor'> Indoor</label>",
+      "    </div>",
+      "    <div class='col-xs-6'>",
+      "      <label><input type='radio' name='indoor-outdoor'> Outdoor</label>",
+      "    </div>",
+      "  </div>",
+      "  <br>",
+      "  <div class='row'>",
+      "    <div class='col-xs-4'>",
+      "      <label><input type='checkbox' name='personality'> Loving</label>",
+      "    </div>",
+      "    <div class='col-xs-4'>",
+      "      <label><input type='checkbox' name='personality'> Lazy</label>",
+      "    </div>",
+      "    <div class='col-xs-4'>",
+      "      <label><input type='checkbox' name='personality'> Crazy</label>",
+      "    </div>",
+      "  </div>",
+      "  <br>",
+      "  <input type='text' class='form-control' placeholder='cat photo URL' required>",
+      "  <button type='submit' class='btn btn-primary'><i class='fa fa-paper-plane'></i> Submit</button>",
+      "</form>"
+    ],
+    "challengeType": 0,
+    "completionMessage": ""
+  },
+
+
+
   {
     "_id": "bad88fee1348bd9aedf08825",
     "name": "Adjusting the Padding of an Element",
@@ -3776,6 +3871,9 @@
     "challengeSeed": "125658022",
     "description": [
       "Now you're ready to start our Zipline challenges. These front-end development challenges will give you many opportunities to apply the HTML, CSS, jQuery and JavaScript you've learned to build static (database-less) applications.",
+      "For many of these challenges, you will be using JSON data from API endpoints. This takes some getting used to.",
+      "You will use the following two functions in many Ziplines: <a href='https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/JSON/parse'>JSON.parse()</a> and <a href='http://api.jquery.com/jquery.each/'>jQuery $.each()</a>.",
+      "Whatever you do, don't get discouraged! Remember to use <a href='/field-guide/how-do-i-get-help-when-I-get-stuck'>RSAP</a> if you get stuck.",
       "We'll build these challenges using CodePen, a popular tool for creating, sharing, and discovering static web applications.",
       "Go to <a href='http://codepen.io' target='_blank'>http://codepen.io</a> and create an account.",
       "Click your user image in the top right corner, then click the \"New pen\" button that drops down.",
diff --git a/views/coursewares/showZiplineOrBasejump.jade b/views/coursewares/showZiplineOrBasejump.jade
index 5be1d7d897d..7695c6fff82 100644
--- a/views/coursewares/showZiplineOrBasejump.jade
+++ b/views/coursewares/showZiplineOrBasejump.jade
@@ -3,6 +3,13 @@ block content
     .row
         .col-xs-12.col-sm-12.col-md-4.bonfire-top
             h1.text-center= name
+            p.text-center Tips: Use&thinsp;
+                a(href='/field-guide/how-do-i-get-help-when-I-get-stuck') RSAP
+                | . Try using&thinsp;
+                a(href='https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/JSON/parse') JSON.parse()
+                | &thinsp;and&thinsp;
+                a(href='http://api.jquery.com/jquery.each/') $.each()
+                | &thinsp;with APIs.
             .well
                 h4
                     ol