add an ajax challenge

This commit is contained in:
Quincy Larson
2015-07-02 17:31:08 -07:00
parent 0301d3bc61
commit c2a9a1ca62
5 changed files with 77 additions and 91 deletions

29
public/json/cats.json Normal file
View File

@ -0,0 +1,29 @@
[
{
"id": 0,
"imageLink": "http://rs611.pbsrc.com/albums/tt194/allypopper423/Funny-Cat-Green-Avacado.jpg~c200",
"codeNames": [
"Juggernaut",
"Mrs. Wallace",
"Buttercup"
]
},
{
"id": 1,
"imageLink": "http://cdn.grumpycats.com/wp-content/uploads/2012/09/GC-Gravatar-copy.png",
"codeNames": [
"Oscar",
"Scrooge",
"Tyrion"
]
},
{
"id": 2,
"imageLink": "http://www.kittenspet.com/wp-content/uploads/2012/08/cat_with_funny_face_3-200x200.jpg",
"codeNames": [
"The Doctor",
"Loki",
"Joker"
]
}
]

View File

@ -196,38 +196,6 @@
"namePt": "",
"descriptionPt": []
},
{
"id": "bd7118d8c441eddfaeb5bdef",
"name": "Waypoint: Discover Chrome DevTools",
"dashedName": "waypoint-discover-chrome-devTools",
"difficulty": 0.32,
"challengeSeed": ["110752743"],
"description": [
"It's time to learn the most powerful tool your browser has - the Development Tools!",
"If you aren't already using Chrome, you'll want to download it here: <a href='http://www.google.com/chrome/' target='_blank'>http://www.google.com/chrome/</a>. While it's true that Firefox has a tool called Firebug that is very similar to Chrome's DevTools, we will use Chrome for this challenge.",
"Note that this course, jointly produced by Google and Code School, is technologically impressive, but occasionally buggy. If you encounter a bug, just ignore it and keep going.",
"Go to <a href='http://discover-devtools.codeschool.com' target='_blank'>http://discover-devtools.codeschool.com</a>.",
"Complete \"Chapter 1: Getting Started & Basic DOM and Styles\".",
"Complete \"Chapter 2: Advanced DOM and Styles\".",
"Complete \"Chapter 3: Working with the Console\".",
"Complete \"Chapter 4: Debugging JavaScript\".",
"Complete \"Chapter 5: Improving Network Performance\".",
"Complete \"Chapter 6: Improving Performance\".",
"Complete \"Chapter 7: Memory Profiling\"."
],
"challengeType": 2,
"tests": [],
"nameCn": "",
"descriptionCn": [],
"nameFr": "",
"descriptionFr": [],
"nameRu": "",
"descriptionRu": [],
"nameEs": "",
"descriptionEs": [],
"namePt": "",
"descriptionPt": []
},
{
"id": "bd7138d8c441eddfaeb5bdef",
"name": "Waypoint: Learn Regular Expressions",

View File

@ -524,7 +524,7 @@
"id": "bad87fee1348bd9ae9c08826",
"name": "Waypoint: Loop through JSON Data Using jQuery",
"dashedName": "waypoint-loop-through-json-data-using-jquery",
"difficulty": 0.089,
"difficulty": 0.088,
"description": [
],
@ -549,38 +549,50 @@
],
"challengeSeed": [
"fccss",
" $(document).ready(function() {",
"",
" });",
"fcces",
"<!-- You shouldn't need to modify code below this line -->",
"<button id='count-presses-button' class='btn btn-primary btn-block btn-lg>Press me</button>",
"<span id='times-pressed'>"
],
"challengeType": 0
}, {
"id": "bad87fee1348bd9aede08826",
"name": "Waypoint: Use Hex Codes for Precise Colors",
"dashedName": "waypoint-use-hex-codes-for-precise-colors",
"difficulty": 0.071,
},
{
"id": "bad88fee1348bd9ae8c08826",
"name": "Waypoint: Wire AJAX Call into a jQuery Click Event",
"dashedName": "waypoint-wire-ajax-call-into-a-jquery-click-event",
"difficulty": 0.089,
"description": [
"<img src='https://www.evernote.com/l/AjmAQ5BxGrFGRrWl_j2eSpGZMfrunfse89gB/image.png'>"
],
"tests": [
],
"challengeSeed": [
"fccss",
" var random = function() { return Math.floor(Math.random() * 3) }",
" $(document).ready(function() {",
"<!-- Don't change code above this line -->",
"",
" $('#cat-button').on('click', function() {",
" $.getJSON('/json/cats.json', function( json ) {",
" var kitten = json[random()];",
" $(\"<img src='\" + kitten.imageLink + \"'>\").appendTo('#output');",
" $(\"<h3>Code name: \" + kitten.codeNames[random()] + \"</h3>\").appendTo('#output');",
" });",
" });",
"",
"<!-- Don't change code below this line -->",
" });",
"fcces",
"<button id='cat-button' class='btn btn-primary btn-block btn-lg'>Cat Button</button>",
"<div class='jumbotron' id='output'>",
"</div>"
],
"challengeType": 0
}, {
"id": "bad87fee1348bd9aedd08826",
"name": "Waypoint: Use Shortened Hex Codes for Colors",
"dashedName": "waypoint-use-shortened-hex-codes-for-colors",
"difficulty": 0.071,
"description": [
],
"tests": [
],
"challengeSeed": [
]
}
]
}

View File

@ -237,22 +237,23 @@
"dashedName": "what-are-the-official-free-code-camp-chat-rooms",
"description": [
"<div class=\"text-left col-xs-12 col-md-10 col-md-offset-1\">",
" <h3>We have 3 official chat rooms:</h3>",
" <h3>We have 4 official chat rooms:</h3>",
" <ol>",
" <li class='large-li'><a href='//gitter.im/FreeCodeCamp/FreeCodeCamp'>Free Code Camp</a> - a friendly place where you can hang out and chat</li>",
" <li class='large-li'><a href='//gitter.im/FreeCodeCamp/Help'>Help</a> - the best place to get help from your fellow campers</li>",
" <li class='large-li'><a href='//gitter.im/FreeCodeCamp/LetsPair'>LetsPair</a> - the best room to find a fellow campers to pair program with</li>",
" <li class='large-li'><a href='//gitter.im/FreeCodeCamp/FreeCodeCamp' target='_blank'>Free Code Camp</a> - a friendly place where you can hang out and chat</li>",
" <li class='large-li'><a href='//gitter.im/FreeCodeCamp/Help' target='_blank'>Help</a> - the best place to get help from your fellow campers</li>",
" <li class='large-li'><a href='//gitter.im/FreeCodeCamp/LetsPair' target='_blank'>LetsPair</a> - the best room to find fellow campers to pair program with using <a href='/field-guide/how-do-i-install-screenhero'>Screen Hero</li>",
" <li class='large-li'><a href='//gitter.im/FreeCodeCamp/TeamViewer' target='_blank'>TeamViewer</a> - the best room to find fellow campers who use Linux and pair with using <a href='https://www.teamviewer.com/en/download/linux.aspx' target='_blank'>Team Viewer</a></li>",
" </ol>",
" <h3>We also have language-specific chat rooms:</h3>",
" <ul>",
" <li class='large-li'><a href='//gitter.im/FreeCodeCamp/Arabic'>Arabic</a></li>",
" <li class='large-li'><a href='//gitter.im/FreeCodeCamp/Chinese'>Chinese</a></li>",
" <li class='large-li'><a href='//gitter.im/FreeCodeCamp/Dutch'>Dutch</a></li>",
" <li class='large-li'><a href='//gitter.im/FreeCodeCamp/Francais'>French</a></li>",
" <li class='large-li'><a href='//gitter.im/FreeCodeCamp/Deutsch'>German</a></li>",
" <li class='large-li'><a href='//gitter.im/FreeCodeCamp/Portugues'>Portugues</a></li>",
" <li class='large-li'><a href='//gitter.im/FreeCodeCamp/Russian'>Russian</a></li>",
" <li class='large-li'><a href='//gitter.im/FreeCodeCamp/Espanol'>Spanish</a></li>",
" <li class='large-li'><a href='//gitter.im/FreeCodeCamp/Arabic' target='_blank'>Arabic</a></li>",
" <li class='large-li'><a href='//gitter.im/FreeCodeCamp/Chinese' target='_blank'>Chinese</a></li>",
" <li class='large-li'><a href='//gitter.im/FreeCodeCamp/Dutch' target='_blank'>Dutch</a></li>",
" <li class='large-li'><a href='//gitter.im/FreeCodeCamp/Francais' target='_blank'>French</a></li>",
" <li class='large-li'><a href='//gitter.im/FreeCodeCamp/Deutsch' target='_blank'>German</a></li>",
" <li class='large-li'><a href='//gitter.im/FreeCodeCamp/Portugues' target='_blank'>Portugues</a></li>",
" <li class='large-li'><a href='//gitter.im/FreeCodeCamp/Russian' target='_blank'>Russian</a></li>",
" <li class='large-li'><a href='//gitter.im/FreeCodeCamp/Espanol' target='_blank'>Spanish</a></li>",
" </ul>",
" <h3>Finally, we have one room for <a href='/field-guide/how-can-i-find-other-free-code-camp-campers-in-my-city'>each of our local Campsites</a>.</h3>",
" <p class='large-p'>If you think we should add a chat room, please message @quincylarson in Gitter.</p>",

View File

@ -28,10 +28,8 @@ module.exports = function(app) {
router.get('/nonprofits-form', nonprofitsForm);
router.get('/our-sponsors', sponsors);
router.get('/jobs-form', jobsForm);
router.get('/submit-cat-photo', catPhotoSubmit);
router.get('/unsubscribe/:email', unsubscribe);
router.get('/unsubscribed', unsubscribed);
router.get('/cats.json', getCats);
app.use(router);
@ -364,26 +362,4 @@ module.exports = function(app) {
}
);
}
function getCats(req, res) {
res.send(
[
{
'name': 'cute',
'imageLink': 'https://encrypted-tbn3.gstatic.com/images' +
'?q=tbn:ANd9GcRaP1ecF2jerISkdhjr4R9yM9-8ClUy-TA36MnDiFBukd5IvEME0g'
},
{
'name': 'grumpy',
'imageLink': 'http://cdn.grumpycats.com/wp-content/uploads/' +
'2012/09/GC-Gravatar-copy.png'
},
{
'name': 'mischievous',
'imageLink': 'http://www.kittenspet.com/wp-content' +
'/uploads/2012/08/cat_with_funny_face_3-200x200.jpg'
}
]
);
}
};