diff --git a/README.md b/README.md index 0307641300..092c5b76e9 100644 --- a/README.md +++ b/README.md @@ -60,24 +60,32 @@ touch .env ``` -Edit your .env file with the following API keys accordingly (if you only use email login, only the MONGOHQ_URL, SESSION_SECRET, MANDRILL_USER and MANDRILL_PASSWORD fields are necessary: +Edit your .env file with the following API keys accordingly (if you only use email login, only the MONGOHQ_URL, SESSION_SECRET, MANDRILL_USER and MANDRILL_PASSWORD fields are necessary. Keep in mind if you want to use more services you'll have to get your own API keys for those services. ``` MONGOHQ_URL='mongodb://localhost:27017/freecodecamp' -SESSION_SECRET='ANY ENGLISH PHRASE' -MANDRILL_USER='THE EMAIL ADDRESS FROM YOUR MANDRILL ACCOUNT' -MANDRILL_PASSWORD='YOUR MANDRILL PASSWORD' -FACEBOOK_ID='FACEBOOK APP API KEY' -FACEBOOK_SECRET='FACEBOOK SECRET' -GITHUB_ID='GITHUB APP API KEY' -GITHUB_SECRET='GITHUB APP SECRET' -TWITTER_KEY='TWITTER APP API KEY' -TWITTER_SECRET='TWITTER APP SECRET' -GOOGLE_ID='GOOGLE APP API KEY' -GOOGLE_SECRET='GOOGLE APP SECRET' -LINKEDIN_ID='LINKEDIN APP API KEY' -LINKEDIN_SECRET='LINKEDIN APP SECRET' +BLOGGER_KEY=stuff +FACEBOOK_ID=stuff +FACEBOOK_SECRET=stuff +GITHUB_ID=stuff +GITHUB_SECRET=stuff +GOOGLE_ID=stuff +GOOGLE_SECRET=stuff +LINKEDIN_ID=stuff +LINKEDIN_SECRET=stuff +MANDRILL_PASSWORD=stuff +MANDRILL_USER=stuff +SESSION_SECRET=secretstuff +TRELLO_KEY=stuff +TRELLO_SECRET=stuff +TWITTER_KEY=stuff +TWITTER_SECRET=stuff +TWITTER_TOKEN=stuff +TWITTER_TOKEN_SECRET=stuff +SLACK_WEBHOOK=stuff +PEER=stuff +DEBUG=true ``` diff --git a/models/Challenge.js b/models/Challenge.js index bb4cfcd954..35d4a2c293 100644 --- a/models/Challenge.js +++ b/models/Challenge.js @@ -16,7 +16,17 @@ var challengeSchema = new mongoose.Schema({ tests: Array, challengeSeed: Array, challengeType: Number, // 0 = html, 1 = javascript only, 2 = video, 3 = zipline, 4 = basejump - MDNlinks: Array + MDNlinks: Array, + nameCn: String, + descriptionCn: Array, + nameFr: String, + descriptionFr: Array, + nameRu: String, + descriptionRu: Array, + nameEs: String, + descriptionEs: Array, + namePt: String, + descriptionPt: Array }); module.exports = mongoose.model('Challenge', challengeSchema); diff --git a/public/css/main.less b/public/css/main.less index 2b9fa9d826..2a5cf1f433 100644 --- a/public/css/main.less +++ b/public/css/main.less @@ -1087,6 +1087,19 @@ hr { color: @gray-light; } +@media only screen and (min-width: 993px) { + .iframe-scroll { + position: fixed !important; + margin-top: 75px; + } +} +@media only screen and (max-width: 992px) { + .iframe-scroll { + height: auto; + overflow: auto; + } +} + //uncomment this to see the dimensions of all elements outlined in red //* { // border-color: red; diff --git a/public/js/lib/coursewares/coursewaresHCJQFramework_0.1.3.js b/public/js/lib/coursewares/coursewaresHCJQFramework_0.1.3.js deleted file mode 100644 index c57817eca5..0000000000 --- a/public/js/lib/coursewares/coursewaresHCJQFramework_0.1.3.js +++ /dev/null @@ -1,154 +0,0 @@ -/** - * Created by nathanleniz on 2/2/15. - */ - -var widgets = []; -var editor = CodeMirror.fromTextArea(document.getElementById("codeEditor"), { - lineNumbers: true, - mode: "text/html", - theme: 'monokai', - runnable: true, - matchBrackets: true, - autoCloseBrackets: true, - scrollbarStyle: 'null', - lineWrapping: true, - gutters: ["CodeMirror-lint-markers"], - onKeyEvent: doLinting -}); - - -// Hijack tab key to insert two spaces instead -editor.setOption("extraKeys", { - Tab: function(cm) { - if (cm.somethingSelected()){ - cm.indentSelection("add"); - } else { - var spaces = Array(cm.getOption("indentUnit") + 1).join(" "); - cm.replaceSelection(spaces); - } - }, - "Shift-Tab": function(cm) { - if (cm.somethingSelected()){ - cm.indentSelection("subtract"); - } else { - var spaces = Array(cm.getOption("indentUnit") + 1).join(" "); - cm.replaceSelection(spaces); - } - } -}); - -editor.setSize("100%", "auto"); - -var libraryIncludes = "" + - "" + - "" + - "" + - "" + - "" + - "" + - "" + - ""; - -var allTests = ''; -(function() { - tests.forEach(function(elem) { - allTests += elem + ' '; - }); -})(); - -var otherTestsForNow = ""; - -var delay; -// Initialize CodeMirror editor with a nice html5 canvas demo. -editor.on("change", function () { - clearTimeout(delay); - delay = setTimeout(updatePreview, 300); -}); -var nodeEnv = prodOrDev === 'production' ? 'http://www.freecodecamp.com' : 'http://localhost:3001'; -function updatePreview() { - goodTests = 0; - var previewFrame = document.getElementById('preview'); - var preview = previewFrame.contentDocument || previewFrame.contentWindow.document; - preview.open(); - $('#testSuite').empty(); - preview.write(libraryIncludes + editor.getValue() + otherTestsForNow); - preview.close(); - -} -setTimeout(updatePreview, 300); - -/** - * "post" methods - */ - -var postSuccess = function(data) { - var testDoc = document.createElement("div"); - $(testDoc) - .html("
git push origin master
, and to Heroku by running grunt --force && grunt buildcontrol:heroku
.",
"Now you're ready to move on to your first Basejump. Click the \"I've completed this challenge\" button and enter the URLs for both your GitHub repository and your live app running on Heroku. If you pair programmed with a friend, enter his or her Free Code Camp username as well so that you both get credit for completing it."
],
- "challengeType": 4,
+ "challengeType": 2,
"tests": []
},
{
@@ -86,7 +86,17 @@
"If you'd like immediate feedback on your project, click this button and paste in a link to your Heroku project. Otherwise, we'll review it before you start your nonprofit projects.Hello Paragraph
" ], - "challengeType": 0 + "challengeType": 0, + "nameCn": "", + "descriptionCn": [], + "nameFr": "", + "descriptionFr": [], + "nameRu": "", + "descriptionRu": [], + "nameEs": "", + "descriptionEs": [], + "namePt": "", + "descriptionPt": [] }, { "_id": "bad87fee1348bd9aedf08802", @@ -93,9 +133,9 @@ "You can start a comment with<!--
and end a comment with -->
."
],
"tests": [
- "assert(($('h1').length > 0), 'The h1 element should not commented. It should be visible in the browser.')",
- "assert(($('h2').length > 0), 'The h2 element should not commented. It should be visible in the browser.')",
- "assert(($('p').length > 0), 'The paragraph element should not commented. It should be visible in the browser.')"
+ "assert($('h1').length > 0, 'The h1 element should not be commented. It should be visible in the browser.')",
+ "assert($('h2').length > 0, 'The h2 element should not be commented. It should be visible in the browser.')",
+ "assert($('p').length > 0, 'The paragraph element should not be commented. It should be visible in the browser.')"
],
"challengeSeed": [
""
],
- "challengeType": 0
+ "challengeType": 0,
+ "nameCn": "",
+ "descriptionCn": [],
+ "nameFr": "",
+ "descriptionFr": [],
+ "nameRu": "",
+ "descriptionRu": [],
+ "nameEs": "",
+ "descriptionEs": [],
+ "namePt": "",
+ "descriptionPt": []
},
{
"_id": "bad87fee1348bd9aedf08804",
@@ -130,12 +180,22 @@
"",
"Hello Paragraph
", "-->" ], - "challengeType": 0 + "challengeType": 0, + "nameCn": "", + "descriptionCn": [], + "nameFr": "", + "descriptionFr": [], + "nameRu": "", + "descriptionRu": [], + "nameEs": "", + "descriptionEs": [], + "namePt": "", + "descriptionPt": [] }, { "_id": "bad87fee1348bd9aedf08833", @@ -156,11 +216,21 @@ "", "Hello Paragraph
" ], - "challengeType": 0 + "challengeType": 0, + "nameCn": "", + "descriptionCn": [], + "nameFr": "", + "descriptionFr": [], + "nameRu": "", + "descriptionRu": [], + "nameEs": "", + "descriptionEs": [], + "namePt": "", + "descriptionPt": [] }, { "_id": "bad87fed1348bd9aedf08833", @@ -182,11 +252,21 @@ "", "Kitty ipsum dolor sit amet, shed everywhere shed everywhere stretching attack your ankles chase the red dot, hairball run catnip eat the grass sniff.
" ], - "challengeType": 0 + "challengeType": 0, + "nameCn": "", + "descriptionCn": [], + "nameFr": "", + "descriptionFr": [], + "nameRu": "", + "descriptionRu": [], + "nameEs": "", + "descriptionEs": [], + "namePt": "", + "descriptionPt": [] }, { "_id": "bad87fee1348bd9aedf08803", @@ -196,7 +276,7 @@ "Change theh2
element's style so that its text color is red.",
"We can do this by changing the style
of the h2
element.",
"The style that is responsible for the color of an element's text is the \"color\" style.",
- "Here's how you would set your h2
element's text color to blue: <h2 style=\"color: blue\">CatPhotoApp<h2>
"
+ "Here's how you would set your h2
element's text color to blue: <h2 style=\"color: blue\">CatPhotoApp</h2>
"
],
"tests": [
"assert($('h2').css('color') === 'rgb(255, 0, 0)', 'Your h2 element should be red.')"
@@ -206,7 +286,17 @@
"",
"Kitty ipsum dolor sit amet, shed everywhere shed everywhere stretching attack your ankles chase the red dot, hairball run catnip eat the grass sniff.
" ], - "challengeType": 0 + "challengeType": 0, + "nameCn": "", + "descriptionCn": [], + "nameFr": "", + "descriptionFr": [], + "nameRu": "", + "descriptionRu": [], + "nameEs": "", + "descriptionEs": [], + "namePt": "", + "descriptionPt": [] }, { "_id": "bad87fee1348bd9aedf08805", @@ -230,7 +320,17 @@ "", "Kitty ipsum dolor sit amet, shed everywhere shed everywhere stretching attack your ankles chase the red dot, hairball run catnip eat the grass sniff.
" ], - "challengeType": 0 + "challengeType": 0, + "nameCn": "", + "descriptionCn": [], + "nameFr": "", + "descriptionFr": [], + "nameRu": "", + "descriptionRu": [], + "nameEs": "", + "descriptionEs": [], + "namePt": "", + "descriptionPt": [] }, { "_id": "bad87fee1348bd9aecf08806", @@ -261,11 +361,21 @@ "", "Kitty ipsum dolor sit amet, shed everywhere shed everywhere stretching attack your ankles chase the red dot, hairball run catnip eat the grass sniff.
" ], - "challengeType": 0 + "challengeType": 0, + "nameCn": "", + "descriptionCn": [], + "nameFr": "", + "descriptionFr": [], + "nameRu": "", + "descriptionRu": [], + "nameEs": "", + "descriptionEs": [], + "namePt": "", + "descriptionPt": [] }, { "_id": "bad87fee1348bd9aefe08806", - "name": "Waypoint: Style Multiple Elements with a CSS Classes", + "name": "Waypoint: Style Multiple Elements with a CSS Class", "difficulty": 0.020, "description": [ "Apply the \"red-text\" class to theh2
and p
elements.",
@@ -288,7 +398,17 @@
"",
"Kitty ipsum dolor sit amet, shed everywhere shed everywhere stretching attack your ankles chase the red dot, hairball run catnip eat the grass sniff.
" ], - "challengeType": 0 + "challengeType": 0, + "nameCn": "", + "descriptionCn": [], + "nameFr": "", + "descriptionFr": [], + "nameRu": "", + "descriptionRu": [], + "nameEs": "", + "descriptionEs": [], + "namePt": "", + "descriptionPt": [] }, { "_id": "bad87fee1348bd9aedf08806", @@ -315,7 +435,17 @@ "", "Kitty ipsum dolor sit amet, shed everywhere shed everywhere stretching attack your ankles chase the red dot, hairball run catnip eat the grass sniff.
" ], - "challengeType": 0 + "challengeType": 0, + "nameCn": "", + "descriptionCn": [], + "nameFr": "", + "descriptionFr": [], + "nameRu": "", + "descriptionRu": [], + "nameEs": "", + "descriptionEs": [], + "namePt": "", + "descriptionPt": [] }, { "_id": "bad87fee1348bd9aede08807", @@ -324,7 +454,7 @@ "description": [ "Make all paragraph elements use the \"Monospace\" font.", "You can set an element's font by using thefont-family
attribute.",
- "For example, if you wanted to set your h2 element's font to \"San-serif\", you would use the following CSS: h2 { font-family: 'San-serif'; }
"
+ "For example, if you wanted to set your h2 element's font to \"Sans-serif\", you would use the following CSS: h2 { font-family: 'Sans-serif'; }
"
],
"tests": [
"assert($('p').css('font-family').match(/monospace/i), 'Your paragraph elements should use the font \"Monospace\".')"
@@ -345,7 +475,17 @@
"Kitty ipsum dolor sit amet, shed everywhere shed everywhere stretching attack your ankles chase the red dot, hairball run catnip eat the grass sniff.
", "Purr jump eat the grass rip the couch scratched sunbathe, shed everywhere rip the couch sleep in the sink fluffy fur catnip scratched.
" ], - "challengeType": 0 + "challengeType": 0, + "nameCn": "", + "descriptionCn": [], + "nameFr": "", + "descriptionFr": [], + "nameRu": "", + "descriptionRu": [], + "nameEs": "", + "descriptionEs": [], + "namePt": "", + "descriptionPt": [] }, { "_id": "bad87fee1348bd9aedf08807", @@ -378,7 +518,17 @@ "Kitty ipsum dolor sit amet, shed everywhere shed everywhere stretching attack your ankles chase the red dot, hairball run catnip eat the grass sniff.
", "Purr jump eat the grass rip the couch scratched sunbathe, shed everywhere rip the couch sleep in the sink fluffy fur catnip scratched.
" ], - "challengeType": 0 + "challengeType": 0, + "nameCn": "", + "descriptionCn": [], + "nameFr": "", + "descriptionFr": [], + "nameRu": "", + "descriptionRu": [], + "nameEs": "", + "descriptionEs": [], + "namePt": "", + "descriptionPt": [] }, { "_id": "bad87fee1348bd9aedf08808", @@ -417,7 +567,17 @@ "Kitty ipsum dolor sit amet, shed everywhere shed everywhere stretching attack your ankles chase the red dot, hairball run catnip eat the grass sniff.
", "Purr jump eat the grass rip the couch scratched sunbathe, shed everywhere rip the couch sleep in the sink fluffy fur catnip scratched.
" ], - "challengeType": 0 + "challengeType": 0, + "nameCn": "", + "descriptionCn": [], + "nameFr": "", + "descriptionFr": [], + "nameRu": "", + "descriptionRu": [], + "nameEs": "", + "descriptionEs": [], + "namePt": "", + "descriptionPt": [] }, { "_id": "bad87fee1348bd9aedf08809", @@ -434,6 +594,9 @@ "Now see if you can make sure the h2 element is rendered in the color red without removing the \"blue-text\" class, doing an in-line styling, or changing the sequence of CSS class declarations." ], "tests": [ + "assert(new RegExp('.blue-text', 'gi').test(editor), 'Ensure you implemented the css class \".blue-text\"')", + "assert(new RegExp('.urgently-red', 'gi').test(editor), 'Ensure you implemented the css class \".urgently-red\"')", + "assert(new RegExp('red !important', 'gi').test(editor), 'Ensure you added the \"!important\" declaration!')", "assert($('h2').hasClass('blue-text'), 'Your h2 element should have the class \"blue-text\".')", "assert($('h2').hasClass('urgently-red'), 'Your h2 element should have the class \"urgently-red\".')", "assert($('h2').css('color') === 'rgb(255, 0, 0)', 'Your h2 element should be red.')" @@ -460,9 +623,18 @@ "Kitty ipsum dolor sit amet, shed everywhere shed everywhere stretching attack your ankles chase the red dot, hairball run catnip eat the grass sniff.
", "Purr jump eat the grass rip the couch scratched sunbathe, shed everywhere rip the couch sleep in the sink fluffy fur catnip scratched.
" ], - "challengeType": 0 + "challengeType": 0, + "nameCn": "", + "descriptionCn": [], + "nameFr": "", + "descriptionFr": [], + "nameRu": "", + "descriptionRu": [], + "nameEs": "", + "descriptionEs": [], + "namePt": "", + "descriptionPt": [] }, - { "_id": "bad87fee1348bd9aedf08812", "name": "Waypoint: Add Images to your Website", @@ -499,7 +671,17 @@ "Kitty ipsum dolor sit amet, shed everywhere shed everywhere stretching attack your ankles chase the red dot, hairball run catnip eat the grass sniff.
", "Purr jump eat the grass rip the couch scratched sunbathe, shed everywhere rip the couch sleep in the sink fluffy fur catnip scratched.
" ], - "challengeType": 0 + "challengeType": 0, + "nameCn": "", + "descriptionCn": [], + "nameFr": "", + "descriptionFr": [], + "nameRu": "", + "descriptionRu": [], + "nameEs": "", + "descriptionEs": [], + "namePt": "", + "descriptionPt": [] }, { "_id": "bad87fee1348bd9acdf08812", @@ -538,21 +720,31 @@ "Kitty ipsum dolor sit amet, shed everywhere shed everywhere stretching attack your ankles chase the red dot, hairball run catnip eat the grass sniff.
", "Purr jump eat the grass rip the couch scratched sunbathe, shed everywhere rip the couch sleep in the sink fluffy fur catnip scratched.
" ], - "challengeType": 0 + "challengeType": 0, + "nameCn": "", + "descriptionCn": [], + "nameFr": "", + "descriptionFr": [], + "nameRu": "", + "descriptionRu": [], + "nameEs": "", + "descriptionEs": [], + "namePt": "", + "descriptionPt": [] }, { "_id": "bad87fee1348bd9bedf08813", "name": "Waypoint: Add Borders Around your Elements", "difficulty": 0.028, "description": [ - "Create a class called \"thick-green-border\" that puts a 10-pixel-wide green border around an HTML element, and apply it to your cat photo.", + "Create a class called \"thick-green-border\" that puts a 10-pixel-wide green border with a style of \"solid\" around an HTML element, and apply it to your cat photo.", "CSS borders have attributes like style, color and width.", "For example, if we wanted to create a red, 5 pixel border around an HTML element, we could use this class:<style> .thin-red-border { border-color: red; border-width: 5px; border-style: solid; } </style>
."
],
"tests": [
"assert($('img').hasClass('smaller-image'), 'Your img
element should have the class \"smaller-image\".')",
- "assert($('img').hasClass('thick-green-border'), 'Your image element should have the class \"thick-green-border\".')",
- "assert(parseInt($('img').css('border-left-width')) > 8, 'Your image should have a border with a width of 10 pixels.')"
+ "assert($('img').hasClass('thick-green-border'), 'Your img
element should have the class \"thick-green-border\".')",
+ "assert(parseInt($('img').css('border-width')) >= 9 && new RegExp('solid').test($('img').css('border-style')), 'You need to specify a border width of 10px and a border style of \"solid\".')"
],
"challengeSeed": [
"",
@@ -582,7 +774,17 @@
"Kitty ipsum dolor sit amet, shed everywhere shed everywhere stretching attack your ankles chase the red dot, hairball run catnip eat the grass sniff.
", "Purr jump eat the grass rip the couch scratched sunbathe, shed everywhere rip the couch sleep in the sink fluffy fur catnip scratched.
" ], - "challengeType": 0 + "challengeType": 0, + "nameCn": "", + "descriptionCn": [], + "nameFr": "", + "descriptionFr": [], + "nameRu": "", + "descriptionRu": [], + "nameEs": "", + "descriptionEs": [], + "namePt": "", + "descriptionPt": [] }, { "_id": "bad87fee1348bd9aedf08814", @@ -631,7 +833,17 @@ "Kitty ipsum dolor sit amet, shed everywhere shed everywhere stretching attack your ankles chase the red dot, hairball run catnip eat the grass sniff.
", "Purr jump eat the grass rip the couch scratched sunbathe, shed everywhere rip the couch sleep in the sink fluffy fur catnip scratched.
" ], - "challengeType": 0 + "challengeType": 0, + "nameCn": "", + "descriptionCn": [], + "nameFr": "", + "descriptionFr": [], + "nameRu": "", + "descriptionRu": [], + "nameEs": "", + "descriptionEs": [], + "namePt": "", + "descriptionPt": [] }, { "_id": "bad87fee1348bd9aedf08815", @@ -679,7 +891,17 @@ "Kitty ipsum dolor sit amet, shed everywhere shed everywhere stretching attack your ankles chase the red dot, hairball run catnip eat the grass sniff.
", "Purr jump eat the grass rip the couch scratched sunbathe, shed everywhere rip the couch sleep in the sink fluffy fur catnip scratched.
" ], - "challengeType": 0 + "challengeType": 0, + "nameCn": "", + "descriptionCn": [], + "nameFr": "", + "descriptionFr": [], + "nameRu": "", + "descriptionRu": [], + "nameEs": "", + "descriptionEs": [], + "namePt": "", + "descriptionPt": [] }, { "_id": "bad87fee1348bd9aedf08816", @@ -692,7 +914,7 @@ "Here's an example:<p>Here's a <a href='http://freecodecamp.com'> link to Free Code Camp</a> for you to follow.</p>
"
],
"tests": [
- "assert((/photo/gi).test($('a').text()), 'Your anchor
element should have the anchor text of \"See my cat photos\"')",
+ "assert((/cat photos/gi).test($('a').text()), 'Your anchor
element should have the anchor text of \"cat photos\"')",
"assert($('a').filter(function(index) { return /com/gi.test($('a').attr('href')); }).length > 0, 'You need an anchor
element that links to http://catphotoapp.com.')"
],
"challengeSeed": [
@@ -730,7 +952,17 @@
"Kitty ipsum dolor sit amet, shed everywhere shed everywhere stretching attack your ankles chase the red dot, hairball run catnip eat the grass sniff.
",
"Purr jump eat the grass rip the couch scratched sunbathe, shed everywhere rip the couch sleep in the sink fluffy fur catnip scratched.
"
],
- "challengeType": 0
+ "challengeType": 0,
+ "nameCn": "",
+ "descriptionCn": [],
+ "nameFr": "",
+ "descriptionFr": [],
+ "nameRu": "",
+ "descriptionRu": [],
+ "nameEs": "",
+ "descriptionEs": [],
+ "namePt": "",
+ "descriptionPt": []
},
{
"_id": "bad87fee1348bd9aede08817",
@@ -744,7 +976,7 @@
],
"tests": [
"assert((/photo/gi).test($('a').text()), 'You need an anchor
element that links to \"catphotoapp.com\".')",
- "assert($('a').filter(function(index) { return /photo/gi.test($('a')[index]); }).length === 1, 'Your anchor
element should have the anchor text of \"See my cat photos\"')",
+ "assert($('a').filter(function(index) { return /photo/gi.test($('a')[index]); }).length === 1, 'Your anchor
element should have the anchor text of \"cat photos\"')",
"assert($('a').parent().is('p'), 'Your anchor element should be wrapped within a paragraph element.')"
],
"challengeSeed": [
@@ -784,9 +1016,18 @@
"Kitty ipsum dolor sit amet, shed everywhere shed everywhere stretching attack your ankles chase the red dot, hairball run catnip eat the grass sniff.
",
"Purr jump eat the grass rip the couch scratched sunbathe, shed everywhere rip the couch sleep in the sink fluffy fur catnip scratched.
"
],
- "challengeType": 0
+ "challengeType": 0,
+ "nameCn": "",
+ "descriptionCn": [],
+ "nameFr": "",
+ "descriptionFr": [],
+ "nameRu": "",
+ "descriptionRu": [],
+ "nameEs": "",
+ "descriptionEs": [],
+ "namePt": "",
+ "descriptionPt": []
},
-
{
"_id": "bad87fee1348bd9aedf08817",
"name": "Waypoint: Make Dead Links using the Hash Symbol",
@@ -837,7 +1078,17 @@
"Kitty ipsum dolor sit amet, shed everywhere shed everywhere stretching attack your ankles chase the red dot, hairball run catnip eat the grass sniff.
",
"Purr jump eat the grass rip the couch scratched sunbathe, shed everywhere rip the couch sleep in the sink fluffy fur catnip scratched.
"
],
- "challengeType": 0
+ "challengeType": 0,
+ "nameCn": "",
+ "descriptionCn": [],
+ "nameFr": "",
+ "descriptionFr": [],
+ "nameRu": "",
+ "descriptionRu": [],
+ "nameEs": "",
+ "descriptionEs": [],
+ "namePt": "",
+ "descriptionPt": []
},
{
"_id": "bad87fee1348bd9aedf08820",
@@ -851,7 +1102,8 @@
"Once you've done this, hover over your image with your cursor. Your cursor's normal pointer should become the link clicking pointer. The photo is now a link."
],
"tests": [
- "assert($('a').filter(function(index) { return /#/gi.test($('a')[index]); }).length > 1, 'Wrap your image element inside an anchor element that has its href
attribute set to \"#\".')"
+ "expect($('a').children('img').length, 'Wrap your image element inside an anchor element that has its href
attribute set to \"#\"').to.equal(1);",
+ "expect(new RegExp('#').test($('a').children('img').parent().attr('href')), 'Make sure to specify the \"src\" attribute as \"#\"').to.be.true;"
],
"challengeSeed": [
"",
@@ -890,7 +1142,17 @@
"Kitty ipsum dolor sit amet, shed everywhere shed everywhere stretching attack your ankles chase the red dot, hairball run catnip eat the grass sniff.
",
"Purr jump eat the grass rip the couch scratched sunbathe, shed everywhere rip the couch sleep in the sink fluffy fur catnip scratched.
"
],
- "challengeType": 0
+ "challengeType": 0,
+ "nameCn": "",
+ "descriptionCn": [],
+ "nameFr": "",
+ "descriptionFr": [],
+ "nameRu": "",
+ "descriptionRu": [],
+ "nameEs": "",
+ "descriptionEs": [],
+ "namePt": "",
+ "descriptionPt": []
},
{
"_id": "bad87fee1348bd9aedf08818",
@@ -943,13 +1205,22 @@
"Kitty ipsum dolor sit amet, shed everywhere shed everywhere stretching attack your ankles chase the red dot, hairball run catnip eat the grass sniff.
",
"Purr jump eat the grass rip the couch scratched sunbathe, shed everywhere rip the couch sleep in the sink fluffy fur catnip scratched.
"
],
- "challengeType": 0
+ "challengeType": 0,
+ "nameCn": "",
+ "descriptionCn": [],
+ "nameFr": "",
+ "descriptionFr": [],
+ "nameRu": "",
+ "descriptionRu": [],
+ "nameEs": "",
+ "descriptionEs": [],
+ "namePt": "",
+ "descriptionPt": []
},
-
{
- "_id" : "bad87fee1348bd9aedf08827",
+ "_id": "bad87fee1348bd9aedf08827",
"name": "Waypoint: Create a Bulleted Unordered List",
- "difficulty" : 0.036,
+ "difficulty": 0.036,
"description": [
"Replace the paragraph elements with an unordered list of three things that cats love.",
"HTML has a special element for creating unordered lists, or bullet point-style lists.",
@@ -997,13 +1268,22 @@
"Kitty ipsum dolor sit amet, shed everywhere shed everywhere stretching attack your ankles chase the red dot, hairball run catnip eat the grass sniff.
",
"Purr jump eat the grass rip the couch scratched sunbathe, shed everywhere rip the couch sleep in the sink fluffy fur catnip scratched.
"
],
- "challengeType": 0
+ "challengeType": 0,
+ "nameCn": "",
+ "descriptionCn": [],
+ "nameFr": "",
+ "descriptionFr": [],
+ "nameRu": "",
+ "descriptionRu": [],
+ "nameEs": "",
+ "descriptionEs": [],
+ "namePt": "",
+ "descriptionPt": []
},
-
{
- "_id" : "bad87fee1348bd9aedf08828",
+ "_id": "bad87fee1348bd9aedf08828",
"name": "Waypoint: Create an Ordered List",
- "difficulty" : 0.037,
+ "difficulty": 0.037,
"description": [
"Create an ordered list
of the the top 3 things cats hate the most.",
"HTML has a special element for creating ordered lists, or numbered-style lists.",
@@ -1013,8 +1293,8 @@
"tests": [
"assert($('ul').length > 0, 'You should have an ul
element on your webpage.')",
"assert($('ol').length > 0, 'You should have an ol
element on your webpage.')",
- "assert($('li').length > 5, 'You should have three li
elements on within your ul
element.')",
- "assert($('li').length > 5, 'You should have three li
elements on within your ol
element.')"
+ "assert($('li').length > 5, 'You should have three li
elements within your ul
element.')",
+ "assert($('li').length > 5, 'You should have three li
elements within your ol
element.')"
],
"challengeSeed": [
"",
@@ -1057,13 +1337,22 @@
" lasagna ",
""
],
- "challengeType": 0
+ "challengeType": 0,
+ "nameCn": "",
+ "descriptionCn": [],
+ "nameFr": "",
+ "descriptionFr": [],
+ "nameRu": "",
+ "descriptionRu": [],
+ "nameEs": "",
+ "descriptionEs": [],
+ "namePt": "",
+ "descriptionPt": []
},
-
{
- "_id" : "bad87fee1348bd9aedf08829",
+ "_id": "bad87fee1348bd9aedf08829",
"name": "Waypoint: Create a Text Field",
- "difficulty" : 0.038,
+ "difficulty": 0.038,
"description": [
"Now we'll create a web form. Create a text field under your lists.",
"Text inputs are a convenient way to get input from your user.",
@@ -1119,20 +1408,30 @@
" other cats ",
""
],
- "challengeType": 0
+ "challengeType": 0,
+ "nameCn": "",
+ "descriptionCn": [],
+ "nameFr": "",
+ "descriptionFr": [],
+ "nameRu": "",
+ "descriptionRu": [],
+ "nameEs": "",
+ "descriptionEs": [],
+ "namePt": "",
+ "descriptionPt": []
},
-
{
- "_id" : "bad87fee1348bd9aedf08830",
+ "_id": "bad87fee1348bd9aedf08830",
"name": "Waypoint: Add Placeholder Text to a Text Field",
- "difficulty" : 0.039,
+ "difficulty": 0.039,
"description": [
- "Add the placeholder text \"type a cat photo URL here\" to your text field.",
+ "Add the placeholder text \"cat photo URL\" to your text field.",
"Placeholder text will appear in your text field before your user has inputed anything.",
"For example: <input type='text' placeholder='this is placeholder text'>
"
],
"tests": [
- "assert($('[placeholder]').length > 0, 'Your text field should have the placeholder text of \"cat photo URL\".')"
+ "assert($('[placeholder]').length > 0, 'Your text field should have a placeholder attribute.')",
+ "assert(/url/gi.test($('input').attr('placeholder')), 'Your placeholder field should have the value of \"cat photo URL\".')"
],
"challengeSeed": [
"",
@@ -1182,13 +1481,22 @@
"",
""
],
- "challengeType": 0
+ "challengeType": 0,
+ "nameCn": "",
+ "descriptionCn": [],
+ "nameFr": "",
+ "descriptionFr": [],
+ "nameRu": "",
+ "descriptionRu": [],
+ "nameEs": "",
+ "descriptionEs": [],
+ "namePt": "",
+ "descriptionPt": []
},
-
{
- "_id" : "bad87fee1348bd9aede08830",
+ "_id": "bad87fee1348bd9aede08830",
"name": "Waypoint: Create a Form Element",
- "difficulty" : 0.040,
+ "difficulty": 0.040,
"description": [
"Wrap your text field in a <form>
element. Add the action=\"/submit-cat-photo\"
attribute to this form element.",
"You can build web forms that actually submit data to a server using nothing more than pure HTML. You can do this by specifying an action on your form
element.",
@@ -1246,20 +1554,29 @@
"",
""
],
- "challengeType": 0
+ "challengeType": 0,
+ "nameCn": "",
+ "descriptionCn": [],
+ "nameFr": "",
+ "descriptionFr": [],
+ "nameRu": "",
+ "descriptionRu": [],
+ "nameEs": "",
+ "descriptionEs": [],
+ "namePt": "",
+ "descriptionPt": []
},
-
{
- "_id" : "bad87fee1348bd9aedd08830",
+ "_id": "bad87fee1348bd9aedd08830",
"name": "Waypoint: Add a Submit Button to a Form",
- "difficulty" : 0.041,
+ "difficulty": 0.041,
"description": [
- "Add a submit button to your form field.",
- "Let's add a submit button to your form. Clicking this button will send the date from your form to the URL you specified with your form's action
attribute.",
+ "Add a submit button to your form field with type submit
and a test value of \"Submit\".",
+ "Let's add a submit button to your form. Clicking this button will send the data from your form to the URL you specified with your form's action
attribute.",
"Here's an example submit button: <button type='submit'>this button submits the form</button>"
],
"tests": [
- "assert($('button').length > 0, 'Your form should have a button inside it.')"
+ "assert(new RegExp('', 'gi').test(editor), 'Make sure you have completely declared your button!');"
],
"challengeSeed": [
"",
@@ -1311,21 +1628,30 @@
" ",
""
],
- "challengeType": 0
+ "challengeType": 0,
+ "nameCn": "",
+ "descriptionCn": [],
+ "nameFr": "",
+ "descriptionFr": [],
+ "nameRu": "",
+ "descriptionRu": [],
+ "nameEs": "",
+ "descriptionEs": [],
+ "namePt": "",
+ "descriptionPt": []
},
-
{
- "_id" : "bad87fee1348bd9aedc08830",
+ "_id": "bad87fee1348bd9aedc08830",
"name": "Waypoint: Use HTML5 to Require a Field",
- "difficulty" : 0.042,
+ "difficulty": 0.042,
"description": [
"Make it required for your user to input text into your form before being able to submit it.",
"You can require your user to complete specific form fields before they will be able to submit your form.",
"For example, if you wanted to make a text input field required, you can just add the word \"required\" within your input
element use: <input type='text' required>
"
],
"tests": [
- "assert($('input').prop('required'), 'Your text field have the property of being required.')",
- "assert($('[placeholder]').length > 0, 'Your text field should have the placeholder text of \"cat photo URL\".')"
+ "assert($('input').prop('required'), 'Your text field should have the property of being required.')",
+ "assert(new RegExp('cat photo URL').test($('input').prop('placeholder')), 'Your text field should have the placeholder text of \"cat photo URL\".')"
],
"challengeSeed": [
"",
@@ -1378,13 +1704,22 @@
" ",
""
],
- "challengeType": 0
+ "challengeType": 0,
+ "nameCn": "",
+ "descriptionCn": [],
+ "nameFr": "",
+ "descriptionFr": [],
+ "nameRu": "",
+ "descriptionRu": [],
+ "nameEs": "",
+ "descriptionEs": [],
+ "namePt": "",
+ "descriptionPt": []
},
-
{
- "_id" : "bad87fee1348bd9aedf08834",
+ "_id": "bad87fee1348bd9aedf08834",
"name": "Waypoint: Create a Set of Radio Buttons",
- "difficulty" : 0.043,
+ "difficulty": 0.043,
"description": [
"Add to your form a pair of radio buttons
that are wrapped in label
elements and share a name
attribute, with the options of \"indoor\" and \"outdoor\".",
"You can use radio buttons
for questions where you want the user to only give you one answer.",
@@ -1394,8 +1729,8 @@
"Here's an example of a radio button: <label><input type='radio' name='indoor-outdoor'> Indoor</label>
"
],
"tests": [
- "assert($('input[type=\"radio\"').length > 1, 'Your webpage should have two radio button elements.')",
- "assert($('input[type=\"radio\"').attr('name'), 'Both of your radio button should have name
attributes with the same value.')",
+ "assert($('input[type=\"radio\"]').length > 1, 'Your webpage should have two radio button elements.')",
+ "assert($('input[type=\"radio\"]:nth-child(1)').attr('name') === 'indoor-outdoor', 'Give your radio buttons the name
attribute of \"indoor-outdoor\".')",
"assert($('label').length > 1, 'Each of your two radio button elements should be wrapped in a label element.')"
],
"challengeSeed": [
@@ -1449,21 +1784,30 @@
" ",
""
],
- "challengeType": 0
+ "challengeType": 0,
+ "nameCn": "",
+ "descriptionCn": [],
+ "nameFr": "",
+ "descriptionFr": [],
+ "nameRu": "",
+ "descriptionRu": [],
+ "nameEs": "",
+ "descriptionEs": [],
+ "namePt": "",
+ "descriptionPt": []
},
-
{
- "_id" : "bad87fee1348bd9aedf08835",
+ "_id": "bad87fee1348bd9aedf08835",
"name": "Waypoint: Create a Set of Checkboxes",
- "difficulty" : 0.044,
+ "difficulty": 0.044,
"description": [
"Add to your form a set of three checkbox
elements that are wrapped in label
elements and share the same name
attribute.",
"Forms commonly use checkbox
elements for questions that may have more than one answer.",
"For example: <label><input type='checkbox' name='personality'> Loving</label>
"
],
"tests": [
- "assert($('input[type=\"checkbox\"').length > 2, 'Your webpage should have three checkbox elements.')",
- "assert($('label').length > 2, 'Each of your three checkbox elements should be wrapped in a label element.')"
+ "assert($('input[type=\"checkbox\"]').length > 2, 'Your webpage should have three checkbox elements.')",
+ "assert($('label').length > 4, 'Each of your three checkbox elements should be wrapped in a label element.')"
],
"challengeSeed": [
"",
@@ -1518,13 +1862,22 @@
" ",
""
],
- "challengeType" : 0
+ "challengeType": 0,
+ "nameCn": "",
+ "descriptionCn": [],
+ "nameFr": "",
+ "descriptionFr": [],
+ "nameRu": "",
+ "descriptionRu": [],
+ "nameEs": "",
+ "descriptionEs": [],
+ "namePt": "",
+ "descriptionPt": []
},
-
{
- "_id" : "bad87fee1348bd9aede08835",
+ "_id": "bad87fee1348bd9aede08835",
"name": "Waypoint: Clean up your form using Linebreaks",
- "difficulty" : 0.045,
+ "difficulty": 0.045,
"description": [
"Clean up your form by adding linebreaks between form elements.",
"Remember that you can create a linebreak element by using the code: <br>
"
@@ -1583,26 +1936,35 @@
" ",
" ",
" ",
- " ",
+ " ",
" ",
" ",
""
],
- "challengeType" : 0
+ "challengeType": 0,
+ "nameCn": "",
+ "descriptionCn": [],
+ "nameFr": "",
+ "descriptionFr": [],
+ "nameRu": "",
+ "descriptionRu": [],
+ "nameEs": "",
+ "descriptionEs": [],
+ "namePt": "",
+ "descriptionPt": []
},
-
{
- "_id" : "bad87fee1348bd9aedd08835",
+ "_id": "bad87fee1348bd9aedd08835",
"name": "Waypoint: Check Radio Buttons and Checkboxes by Default",
- "difficulty" : 0.046,
+ "difficulty": 0.046,
"description": [
"Set the first of your radio buttons and the first of your checkboxes to both be checked by default.",
"You set a checkbox or radio button to be checked by default using the checked
attribute.",
"To do this, just add the word \"checked\" to the inside of an input element. For example, <input type='radio' name='test-name' checked>
."
],
"tests": [
- "assert($('input[type=\"radio\"').prop('checked'), 'Your first radio button on your form should be checked by default.')",
- "assert($('input[type=\"checkbox\"').prop('checked'), 'Your first checkbox on your form should be checked by default.')"
+ "assert($('input[type=\"radio\"]').prop('checked'), 'Your first radio button on your form should be checked by default.');",
+ "assert($('input[type=\"checkbox\"]').prop('checked'), 'Your first checkbox on your form should be checked by default.')"
],
"challengeSeed": [
"",
@@ -1656,13 +2018,23 @@
"
",
" ",
" ",
- " ",
+ " ",
"
",
" ",
" ",
""
],
- "challengeType" : 0
+ "challengeType": 0,
+ "nameCn": "",
+ "descriptionCn": [],
+ "nameFr": "",
+ "descriptionFr": [],
+ "nameRu": "",
+ "descriptionRu": [],
+ "nameEs": "",
+ "descriptionEs": [],
+ "namePt": "",
+ "descriptionPt": []
},
{
"_id": "bad88fee1348bd9aedf08825",
@@ -1713,7 +2085,17 @@
" padding
",
""
],
- "challengeType": 0
+ "challengeType": 0,
+ "nameCn": "",
+ "descriptionCn": [],
+ "nameFr": "",
+ "descriptionFr": [],
+ "nameRu": "",
+ "descriptionRu": [],
+ "nameEs": "",
+ "descriptionEs": [],
+ "namePt": "",
+ "descriptionPt": []
},
{
"_id": "bad87fee1348bd9aedf08822",
@@ -1766,7 +2148,17 @@
" padding
",
""
],
- "challengeType": 0
+ "challengeType": 0,
+ "nameCn": "",
+ "descriptionCn": [],
+ "nameFr": "",
+ "descriptionFr": [],
+ "nameRu": "",
+ "descriptionRu": [],
+ "nameEs": "",
+ "descriptionEs": [],
+ "namePt": "",
+ "descriptionPt": []
},
{
"_id": "bad87fee1348bd9aedf08823",
@@ -1818,7 +2210,17 @@
" padding
",
""
],
- "challengeType": 0
+ "challengeType": 0,
+ "nameCn": "",
+ "descriptionCn": [],
+ "nameFr": "",
+ "descriptionFr": [],
+ "nameRu": "",
+ "descriptionRu": [],
+ "nameEs": "",
+ "descriptionEs": [],
+ "namePt": "",
+ "descriptionPt": []
},
{
"_id": "bad87fee1348bd9aedf08824",
@@ -1830,7 +2232,9 @@
"CSS allows you to control the padding of an element on all four sides with padding-top
, padding-right
, padding-bottom
, and padding-left
attributes."
],
"tests": [
+ "assert($('.green-box').css('padding-top') === '40px', 'Your green-box
class should give the top of elements 40px of padding.')",
"assert($('.green-box').css('padding-left') === '40px', 'Your green-box
class should give the left of elements 40px of padding.')",
+ "assert($('.green-box').css('padding-right') === '20px', 'Your green-box
class should give the right of elements 20px of padding.')",
"assert($('.green-box').css('padding-bottom') === '20px', 'Your green-box
class should give the bottom of elements 20px of padding.')"
],
"challengeSeed": [
@@ -1871,7 +2275,17 @@
" padding
",
""
],
- "challengeType": 0
+ "challengeType": 0,
+ "nameCn": "",
+ "descriptionCn": [],
+ "nameFr": "",
+ "descriptionFr": [],
+ "nameRu": "",
+ "descriptionRu": [],
+ "nameEs": "",
+ "descriptionEs": [],
+ "namePt": "",
+ "descriptionPt": []
},
{
"_id": "bad87fee1248bd9aedf08824",
@@ -1924,21 +2338,33 @@
" padding
",
""
],
- "challengeType": 0
+ "challengeType": 0,
+ "nameCn": "",
+ "descriptionCn": [],
+ "nameFr": "",
+ "descriptionFr": [],
+ "nameRu": "",
+ "descriptionRu": [],
+ "nameEs": "",
+ "descriptionEs": [],
+ "namePt": "",
+ "descriptionPt": []
},
{
"_id": "bad87fee1348bd9aedf08826",
"name": "Waypoint: Use Clockwise Notation to Specify the Padding of an Element",
"difficulty": 0.069,
"description": [
- "Use Clockwise Notation
to give an element padding of 40 pixels on its top and left side, but only 20 pixels on its bottom and right side.",
+ "Use Clockwise Notation
to give the \".green-box\" class a padding of 40 pixels on its top and left side, but only 20 pixels on its bottom and right side.",
"Instead of specifying an element's padding-top
, padding-right
, padding-bottom
, and padding-left
attributes, you can specify them all in one line, like this: padding: 10px 20px 10px 20px;
.",
"These four values work like a clock: top, right, bottom, left, and will produce the exact same result as using the side-specific padding instructions.",
"You can also use this notation for margins!"
],
"tests": [
- "assert($('.green-box').css('padding-left') === '40px', 'Your green-box
class should give the left of elements 40px of padding.')",
- "assert($('.green-box').css('padding-bottom') === '20px', 'Your green-box
class should give the bottom of elements 20px of padding.')"
+ "assert($('.green-box').css('padding-top') === '40px', 'Your green-box
class should give the top of elements 40px of padding.')",
+ "assert($('.green-box').css('padding-right') === '20px', 'Your green-box
class should give the right of elements 20px of padding.')",
+ "assert($('.green-box').css('padding-bottom') === '20px', 'Your green-box
class should give the bottom of elements 20px of padding.')",
+ "assert($('.green-box').css('padding-left') === '40px', 'Your green-box
class should give the left of elements 40px of padding.')"
],
"challengeSeed": [
"