Merge pull request #2679 from FreeCodeCamp/staging
update framework to remove merge conflicts
This commit is contained in:
@ -1,2 +1,2 @@
|
|||||||
We're getting a lot of duplicate issues and bug reports that just aren't reporting actual bugs.
|
We're getting a lot of duplicate issues and bug reports that just aren't reporting actual bugs.
|
||||||
So, before you submit your issue, please read the [Help! I've Found a Bug](https://github.com/FreeCodeCamp/FreeCodeCamp/wiki/Help!-I've-Found-a-Bug) wiki page.
|
So, before you submit your issue, please read the [Help I've Found a Bug](https://github.com/FreeCodeCamp/FreeCodeCamp/wiki/Help-I've-Found-a-Bug) wiki page.
|
||||||
|
18
gulpfile.js
18
gulpfile.js
@ -19,10 +19,12 @@ var Rx = require('rx'),
|
|||||||
sync = require('browser-sync'),
|
sync = require('browser-sync'),
|
||||||
|
|
||||||
inject = require('gulp-inject'),
|
inject = require('gulp-inject'),
|
||||||
|
|
||||||
// css
|
// css
|
||||||
less = require('gulp-less'),
|
less = require('gulp-less'),
|
||||||
|
|
||||||
// lint
|
// lint
|
||||||
|
jsonlint = require('gulp-jsonlint'),
|
||||||
eslint = require('gulp-eslint');
|
eslint = require('gulp-eslint');
|
||||||
|
|
||||||
|
|
||||||
@ -60,6 +62,11 @@ var paths = {
|
|||||||
|
|
||||||
syncWatch: [
|
syncWatch: [
|
||||||
'public/**/*.*'
|
'public/**/*.*'
|
||||||
|
],
|
||||||
|
|
||||||
|
challenges: [
|
||||||
|
'seed/challenges/*.json',
|
||||||
|
'seed/under-construction/*.json'
|
||||||
]
|
]
|
||||||
};
|
};
|
||||||
|
|
||||||
@ -163,12 +170,20 @@ gulp.task('sync', ['serve'], function() {
|
|||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
|
||||||
gulp.task('lint', function() {
|
gulp.task('lint-js', function() {
|
||||||
return gulp.src(['public/js/lib/**/*'])
|
return gulp.src(['public/js/lib/**/*'])
|
||||||
.pipe(eslint())
|
.pipe(eslint())
|
||||||
.pipe(eslint.format());
|
.pipe(eslint.format());
|
||||||
});
|
});
|
||||||
|
|
||||||
|
gulp.task('lint-json', function() {
|
||||||
|
return gulp.src(paths.challenges)
|
||||||
|
.pipe(jsonlint())
|
||||||
|
.pipe(jsonlint.reporter());
|
||||||
|
});
|
||||||
|
|
||||||
|
gulp.task('test-challenges', ['lint-json']);
|
||||||
|
|
||||||
gulp.task('less', function() {
|
gulp.task('less', function() {
|
||||||
return gulp.src('./public/css/*.less')
|
return gulp.src('./public/css/*.less')
|
||||||
.pipe(plumber({ errorHandler: errorHandler }))
|
.pipe(plumber({ errorHandler: errorHandler }))
|
||||||
@ -182,6 +197,7 @@ gulp.task('build', ['less']);
|
|||||||
|
|
||||||
gulp.task('watch', ['less', 'serve', 'sync'], function() {
|
gulp.task('watch', ['less', 'serve', 'sync'], function() {
|
||||||
gulp.watch('./public/css/*.less', ['less']);
|
gulp.watch('./public/css/*.less', ['less']);
|
||||||
|
gulp.watch(paths.challenges, ['test-challenges']);
|
||||||
});
|
});
|
||||||
|
|
||||||
gulp.task('default', ['less', 'serve', 'sync', 'watch', 'pack-watch']);
|
gulp.task('default', ['less', 'serve', 'sync', 'watch', 'pack-watch']);
|
||||||
|
@ -120,6 +120,7 @@
|
|||||||
"gulp": "~3.8.8",
|
"gulp": "~3.8.8",
|
||||||
"gulp-eslint": "~0.9.0",
|
"gulp-eslint": "~0.9.0",
|
||||||
"gulp-inject": "~1.0.2",
|
"gulp-inject": "~1.0.2",
|
||||||
|
"gulp-jsonlint": "^1.1.0",
|
||||||
"gulp-nodemon": "^2.0.3",
|
"gulp-nodemon": "^2.0.3",
|
||||||
"gulp-notify": "^2.2.0",
|
"gulp-notify": "^2.2.0",
|
||||||
"gulp-plumber": "^1.0.1",
|
"gulp-plumber": "^1.0.1",
|
||||||
|
@ -683,9 +683,9 @@ thead {
|
|||||||
margin-right: 0px;
|
margin-right: 0px;
|
||||||
padding-left: 10px;
|
padding-left: 10px;
|
||||||
padding-right: 10px;
|
padding-right: 10px;
|
||||||
&:hover {
|
|
||||||
padding-top: 14px;
|
padding-top: 14px;
|
||||||
padding-bottom: 12px;
|
padding-bottom: 12px;
|
||||||
|
&:hover {
|
||||||
color: #4a2b0f;
|
color: #4a2b0f;
|
||||||
background-color: #eee;
|
background-color: #eee;
|
||||||
text-decoration: none;
|
text-decoration: none;
|
||||||
|
@ -28,7 +28,7 @@ $(document).ready(function () {
|
|||||||
$('#chosen').text('Coming from ' + city.replace(/-/g, ' ').replace(/\w\S*/g, function (txt) {
|
$('#chosen').text('Coming from ' + city.replace(/-/g, ' ').replace(/\w\S*/g, function (txt) {
|
||||||
return txt.charAt(0).toUpperCase() + txt.substr(1).toLowerCase();
|
return txt.charAt(0).toUpperCase() + txt.substr(1).toLowerCase();
|
||||||
}) + ', and making $' + lastYearsIncome.toString().replace(/0000$/, '0,000') + ', your true costs will be:');
|
}) + ', and making $' + lastYearsIncome.toString().replace(/0000$/, '0,000') + ', your true costs will be:');
|
||||||
var categoryNames = ['Lost Wages', 'Financing Cost', 'Housing Cost', 'Tuition / Wage Garnishing'];
|
var categoryNames = ['Lost Wages', 'Financing Cost', 'Housing Cost', 'Tuition / Est. Wage Garnishing'];
|
||||||
bootcamps.forEach(function (camp) {
|
bootcamps.forEach(function (camp) {
|
||||||
var x0 = 0;
|
var x0 = 0;
|
||||||
if (camp.cities.indexOf(city) > -1) {
|
if (camp.cities.indexOf(city) > -1) {
|
||||||
@ -38,7 +38,7 @@ $(document).ready(function () {
|
|||||||
}
|
}
|
||||||
camp.mapping = [{
|
camp.mapping = [{
|
||||||
name: camp.name,
|
name: camp.name,
|
||||||
label: 'Tuition / Wage Garnishing',
|
label: 'Tuition / Est. Wage Garnishing',
|
||||||
value: +camp.cost,
|
value: +camp.cost,
|
||||||
x0: x0,
|
x0: x0,
|
||||||
x1: x0 += +camp.cost
|
x1: x0 += +camp.cost
|
||||||
|
@ -221,7 +221,28 @@
|
|||||||
"cities": [
|
"cities": [
|
||||||
"portland"
|
"portland"
|
||||||
]
|
]
|
||||||
}, {
|
},
|
||||||
|
{
|
||||||
|
"name": "Viking Code School",
|
||||||
|
"cost": "18000",
|
||||||
|
"housing": "0",
|
||||||
|
"finance": false,
|
||||||
|
"weeks": "16",
|
||||||
|
"cities": [
|
||||||
|
"online"
|
||||||
|
]
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"name": "App Academy",
|
||||||
|
"cost": "18000",
|
||||||
|
"housing": "500",
|
||||||
|
"finance": false,
|
||||||
|
"weeks": "12",
|
||||||
|
"cities": [
|
||||||
|
"san-francisco"
|
||||||
|
]
|
||||||
|
},
|
||||||
|
{
|
||||||
"name": "Turing School",
|
"name": "Turing School",
|
||||||
"cost": "17500",
|
"cost": "17500",
|
||||||
"housing": "400",
|
"housing": "400",
|
||||||
@ -230,13 +251,4 @@
|
|||||||
"cities": [
|
"cities": [
|
||||||
"denver"
|
"denver"
|
||||||
]
|
]
|
||||||
}, {
|
|
||||||
"name": "Free Code Camp",
|
|
||||||
"cost": "0",
|
|
||||||
"housing": "0",
|
|
||||||
"finance": false,
|
|
||||||
"weeks": "0",
|
|
||||||
"cities": [
|
|
||||||
"online"
|
|
||||||
]
|
|
||||||
}]
|
}]
|
||||||
|
@ -13,7 +13,8 @@
|
|||||||
"<code>// This is a comment.</code>",
|
"<code>// This is a comment.</code>",
|
||||||
"The slash-star-star-slash comment will comment out everything between the <code>/*</code> and the <code>*/</code> characters:",
|
"The slash-star-star-slash comment will comment out everything between the <code>/*</code> and the <code>*/</code> characters:",
|
||||||
"<code>/* This is also a comment */</code>",
|
"<code>/* This is also a comment */</code>",
|
||||||
"Try creating one of each."
|
"Try creating one of each.",
|
||||||
|
"And one more thing you need to notice. Starting at this waypoint in JavaScript related challenges (except AngularJS, all Ziplines, Git, Node.js and Express.js, MongoDB and Full Stack JavaScript Projects) you can see contents of <code>assert()</code> functions (in some challenges <code>except()</code>, <code>assert.equal()</code> and so on) which are used to test your code. It's part of these challenges that you are able to see the tests that are running against your code."
|
||||||
],
|
],
|
||||||
"tests":[
|
"tests":[
|
||||||
"assert(editor.getValue().match(/(\\/\\/)...../g), 'Create a <code>\\/\\/</code> style comment that contains at least five letters');",
|
"assert(editor.getValue().match(/(\\/\\/)...../g), 'Create a <code>\\/\\/</code> style comment that contains at least five letters');",
|
||||||
@ -606,7 +607,7 @@
|
|||||||
"Take the myArray array and <code>shift()</code> the first value off of it."
|
"Take the myArray array and <code>shift()</code> the first value off of it."
|
||||||
],
|
],
|
||||||
"tests": [
|
"tests": [
|
||||||
"assert((function(d){if(d[0] == 23 && d[1][0] == 'dog' && d[1][1] == 3 && d[2] == undefined){return(true);}else{return(false);}})(myArray), 'myArray should only have the first two values left([\"John\", 23])');",
|
"assert((function(d){if(d[0] == 23 && d[1][0] == 'dog' && d[1][1] == 3 && d[2] == undefined){return(true);}else{return(false);}})(myArray), 'myArray should only have the last two values left([23, [\"dog\", 3]])');",
|
||||||
"assert((function(d){if(d === 'John' && typeof(myRemoved) === 'string'){return(true);}else{return(false);}})(myRemoved), 'myRemoved should contain \"John\"');"
|
"assert((function(d){if(d === 'John' && typeof(myRemoved) === 'string'){return(true);}else{return(false);}})(myRemoved), 'myRemoved should contain \"John\"');"
|
||||||
],
|
],
|
||||||
"challengeSeed": [
|
"challengeSeed": [
|
||||||
@ -670,8 +671,8 @@
|
|||||||
"<code>function functionName (a, b) {</code>",
|
"<code>function functionName (a, b) {</code>",
|
||||||
"<code>  return(a + b);</code>",
|
"<code>  return(a + b);</code>",
|
||||||
"<code>}</code>",
|
"<code>}</code>",
|
||||||
"We can \"call\" our function like this: <code>functionName();</code>, and it will run and return it's <code>return</code> value to us.",
|
"We can \"call\" our function like this: <code>functionName();</code>, and it will run and return its <code>return</code> value to us.",
|
||||||
"Create and call a function called <code>myFunction</code>."
|
"Create and call a function called <code>myFunction</code> that returns the sum of a and b."
|
||||||
],
|
],
|
||||||
"tests":[
|
"tests":[
|
||||||
"assert((function(){if(typeof(f) !== \"undefined\" && typeof(f) === \"number\" && f === a + b && editor.getValue().match(/return/gi).length >= 1 && editor.getValue().match(/a/gi).length >= 1 && editor.getValue().match(/b/gi).length >= 1 && editor.getValue().match(/\\+/gi).length >= 1){return(true);}else{return(false);}})(), 'Your function should return the value of a + b');"
|
"assert((function(){if(typeof(f) !== \"undefined\" && typeof(f) === \"number\" && f === a + b && editor.getValue().match(/return/gi).length >= 1 && editor.getValue().match(/a/gi).length >= 1 && editor.getValue().match(/b/gi).length >= 1 && editor.getValue().match(/\\+/gi).length >= 1){return(true);}else{return(false);}})(), 'Your function should return the value of a + b');"
|
||||||
@ -684,9 +685,9 @@
|
|||||||
" return a - b;",
|
" return a - b;",
|
||||||
"};",
|
"};",
|
||||||
"",
|
"",
|
||||||
"//Don't modify above this line",
|
"// Don't modify above this line",
|
||||||
"//Create a function called myFunction that returns the value of a plus b.",
|
"// Create a function called myFunction that returns the value of a plus b.",
|
||||||
" // Only change code below this line.",
|
"// Only change code below this line.",
|
||||||
"",
|
"",
|
||||||
"",
|
"",
|
||||||
"",
|
"",
|
||||||
@ -718,7 +719,7 @@
|
|||||||
"<code>};</code>",
|
"<code>};</code>",
|
||||||
"</code>",
|
"</code>",
|
||||||
"Objects are useful for storing data in a structured way, and can represents real world objects, like a cats.",
|
"Objects are useful for storing data in a structured way, and can represents real world objects, like a cats.",
|
||||||
"Let's try to make an Object that represents a dog called myDog!"
|
"Let's try to make an Object that represents a dog called myDog which contains the properties 'name' (String), 'legs' (Number), 'tails' (Number) and 'friends' (Array)!"
|
||||||
],
|
],
|
||||||
"tests":[
|
"tests":[
|
||||||
"assert((function(z){if(z.hasOwnProperty(\"name\") && z.name !== undefined && typeof(z.name) === \"string\"){return(true);}else{return(false);}})(myDog), 'myDog should contain the property name and it should be a string');",
|
"assert((function(z){if(z.hasOwnProperty(\"name\") && z.name !== undefined && typeof(z.name) === \"string\"){return(true);}else{return(false);}})(myDog), 'myDog should contain the property name and it should be a string');",
|
||||||
@ -903,7 +904,7 @@
|
|||||||
"tests":[
|
"tests":[
|
||||||
"assert(typeof(myFunction()) === \"number\", 'The result of myFunction should be a number');",
|
"assert(typeof(myFunction()) === \"number\", 'The result of myFunction should be a number');",
|
||||||
"assert(editor.getValue().match(/Math.random/g), 'You should be using Math.random to create a random number');",
|
"assert(editor.getValue().match(/Math.random/g), 'You should be using Math.random to create a random number');",
|
||||||
"assert(!(''+myFunction()).match(/\\./g), 'You should have multiplied the result of Math.random by 10 to make it a number that\\'s greater then zero');",
|
"assert(!(''+myFunction()).match(/\\./g), 'You should have multiplied the result of Math.random by 10 to make it a number that\\'s greater than zero');",
|
||||||
"assert(editor.getValue().match(/Math.floor/g), 'You should use Math.floor to remove the decimal part of the number');"
|
"assert(editor.getValue().match(/Math.floor/g), 'You should use Math.floor to remove the decimal part of the number');"
|
||||||
],
|
],
|
||||||
"challengeSeed":[
|
"challengeSeed":[
|
||||||
@ -1006,7 +1007,7 @@
|
|||||||
"<code>g</code> means that we want to search the entire string for this pattern.",
|
"<code>g</code> means that we want to search the entire string for this pattern.",
|
||||||
"<code>i</code> means that we want to ignore the case (uppercase or lowercase) when searching for the pattern.",
|
"<code>i</code> means that we want to ignore the case (uppercase or lowercase) when searching for the pattern.",
|
||||||
"<code>Regular expressions</code> are usually surrounded by <code>/</code> symbols.",
|
"<code>Regular expressions</code> are usually surrounded by <code>/</code> symbols.",
|
||||||
"Let's try selecting all the occurrences of the word <code>and</code> in the string <code>George Boole and Alan Turing went to the shop and got some milk</code>. We can do this by replacing the <code>.+</code> part of our regular expression with the current <code>regular expression</code> with the word <code>and</code>."
|
"Let's try selecting all the occurrences of the word <code>and</code> in the string <code>George Boole and Alan Turing went to the shop and got some milk</code>. We can do this by replacing the <code>.</code> part of our regular expression with the word <code>and</code>."
|
||||||
],
|
],
|
||||||
"tests":[
|
"tests":[
|
||||||
"assert(test==2, 'Your <code>regular expression</code> should find two occurrences of the word <code>and</code>');",
|
"assert(test==2, 'Your <code>regular expression</code> should find two occurrences of the word <code>and</code>');",
|
||||||
@ -1040,7 +1041,7 @@
|
|||||||
],
|
],
|
||||||
"tests":[
|
"tests":[
|
||||||
"assert(test === 2, 'Your RegEx should have found two numbers in the testString');",
|
"assert(test === 2, 'Your RegEx should have found two numbers in the testString');",
|
||||||
"assert(editor.getValue().match(/\\/\\\\d\\+\\//gi), 'You should be using the following expression /\\d+/gi to find the numbers in the testString');"
|
"assert(editor.getValue().match(/\\/\\\\d\\+\\//gi), 'You should be using the following expression /\\\\d+/gi to find the numbers in the testString');"
|
||||||
],
|
],
|
||||||
"challengeSeed":[
|
"challengeSeed":[
|
||||||
"var test = (function() {",
|
"var test = (function() {",
|
||||||
@ -1070,7 +1071,7 @@
|
|||||||
],
|
],
|
||||||
"tests":[
|
"tests":[
|
||||||
"assert(test === 7, 'Your RegEx should have found seven spaces in the <code>testString</code>.');",
|
"assert(test === 7, 'Your RegEx should have found seven spaces in the <code>testString</code>.');",
|
||||||
"assert(editor.getValue().match(/\\/\\\\s\\+\\//gi), 'You should be using the following expression /\\s+/gi to find the spaces in the <code>testString</code>.');"
|
"assert(editor.getValue().match(/\\/\\\\s\\+\\//gi), 'You should be using the following expression /\\\\s+/gi to find the spaces in the <code>testString</code>.');"
|
||||||
],
|
],
|
||||||
"challengeSeed":[
|
"challengeSeed":[
|
||||||
"var test = (function(){",
|
"var test = (function(){",
|
||||||
@ -1098,7 +1099,7 @@
|
|||||||
],
|
],
|
||||||
"tests":[
|
"tests":[
|
||||||
"assert(test === 49, 'Your RegEx should have found forty nine non-space characters in the <code>testString</code>.');",
|
"assert(test === 49, 'Your RegEx should have found forty nine non-space characters in the <code>testString</code>.');",
|
||||||
"assert(editor.getValue().match(/\\/\\\\S\\/gi/gi), 'You should be using the following expression <code>/\\S/gi</code> to find non-space characters in the <code>testString</code>.');"
|
"assert(editor.getValue().match(/\\/\\\\S\\/gi/gi), 'You should be using the following expression <code>/\\\\S/gi</code> to find non-space characters in the <code>testString</code>.');"
|
||||||
],
|
],
|
||||||
"challengeSeed":[
|
"challengeSeed":[
|
||||||
"var test = (function(){",
|
"var test = (function(){",
|
||||||
@ -1277,8 +1278,8 @@
|
|||||||
"description":[
|
"description":[
|
||||||
"Now that our slots will each generate random numbers, we need to check whether they've all returned the same number.",
|
"Now that our slots will each generate random numbers, we need to check whether they've all returned the same number.",
|
||||||
"If they have, we should notify our user that they've won.",
|
"If they have, we should notify our user that they've won.",
|
||||||
"Otherwise, we should return <code>null</code>, which is a JavaScript literal representing null or an \"empty\" value, i.e. no object value is present.",
|
"Otherwise, we should return <code>null</code>, which is a JavaScript data structure that means nothing.",
|
||||||
"If all three numbers match, we should return the number that we have in three of slots or leave it as null.",
|
"If all three numbers match, we should return the number that we have in three of slots or leave it as <code>null</code>.",
|
||||||
"Let's create an <code>if statement</code> with multiple conditions in order to check whether all numbers are equal.",
|
"Let's create an <code>if statement</code> with multiple conditions in order to check whether all numbers are equal.",
|
||||||
"<code>if(slotOne !== slotTwo || slotTwo !== slotThree){</code>",
|
"<code>if(slotOne !== slotTwo || slotTwo !== slotThree){</code>",
|
||||||
"<code>  return(null);</code>",
|
"<code>  return(null);</code>",
|
||||||
|
@ -45,6 +45,7 @@
|
|||||||
"<span class='text-info'>Rule #1:</span> Don't look at the example project's code on CodePen. Figure it out for yourself.",
|
"<span class='text-info'>Rule #1:</span> Don't look at the example project's code on CodePen. Figure it out for yourself.",
|
||||||
"<span class='text-info'>Rule #2:</span> You may use whichever libraries or APIs you need.",
|
"<span class='text-info'>Rule #2:</span> You may use whichever libraries or APIs you need.",
|
||||||
"<span class='text-info'>Rule #3:</span> Reverse engineer the example project's functionality, and also feel free to personalize it.",
|
"<span class='text-info'>Rule #3:</span> Reverse engineer the example project's functionality, and also feel free to personalize it.",
|
||||||
|
"<span class='text-info'>Hint:</span> If you don't want to start from scratch, you can fork this simple Bootstrap portfolio template on CodePen: <a href='http://codepen.io/FreeCodeCamp/pen/mJNqQj/' target='_blank'>http://codepen.io/FreeCodeCamp/pen/mJNqQj</a>.",
|
||||||
"Here are the <a href='http://en.wikipedia.org/wiki/User_story' target='_blank'>user stories</a> you must enable, and optional bonus user stories:",
|
"Here are the <a href='http://en.wikipedia.org/wiki/User_story' target='_blank'>user stories</a> you must enable, and optional bonus user stories:",
|
||||||
"<span class='text-info'>User Story:</span> As a user, I can access all of the portfolio webpage's content just by scrolling.",
|
"<span class='text-info'>User Story:</span> As a user, I can access all of the portfolio webpage's content just by scrolling.",
|
||||||
"<span class='text-info'>User Story:</span> As a user, I can click different buttons that will take me to the portfolio creator's different social media pages.",
|
"<span class='text-info'>User Story:</span> As a user, I can click different buttons that will take me to the portfolio creator's different social media pages.",
|
||||||
|
@ -176,8 +176,8 @@
|
|||||||
"title": "Center Text with Bootstrap",
|
"title": "Center Text with Bootstrap",
|
||||||
"difficulty": 2.03,
|
"difficulty": 2.03,
|
||||||
"description": [
|
"description": [
|
||||||
"Now that we're using Bootstrap, we can center our heading elements to make them look better. All we need to do is add the class <code>text-center</code> to our <code>h1</code> and <code>h2</code> elements.",
|
"Now that we're using Bootstrap, we can center our heading element to make it look better. All we need to do is add the class <code>text-center</code> to our <code>h2</code> element.",
|
||||||
"Remember that you can add several classes to the same element by separating each of them with a space, like this: <code><h2 class=\"text-red text-center\">your text</h2></code>."
|
"Remember that you can add several classes to the same element by separating each of them with a space, like this: <code><h2 class=\"red-text text-center\">your text</h2></code>."
|
||||||
],
|
],
|
||||||
"tests": [
|
"tests": [
|
||||||
"assert($(\"h2\").hasClass(\"text-center\"), 'Your <code>h2</code> element should be centered by applying the class <code>text-center</code>')"
|
"assert($(\"h2\").hasClass(\"text-center\"), 'Your <code>h2</code> element should be centered by applying the class <code>text-center</code>')"
|
||||||
@ -347,7 +347,7 @@
|
|||||||
"description": [
|
"description": [
|
||||||
"Normally, your <code>button</code> elements are only as wide as the text that they contain. By making them block elements, your button will stretch to fill your page's entire horizontal space.",
|
"Normally, your <code>button</code> elements are only as wide as the text that they contain. By making them block elements, your button will stretch to fill your page's entire horizontal space.",
|
||||||
"This image illustrates the difference between <code>inline</code> elements and <code>block-level</code> elements:",
|
"This image illustrates the difference between <code>inline</code> elements and <code>block-level</code> elements:",
|
||||||
"<img class=\"img-responsive\" src=\"https://www.evernote.com/l/AHTFU358y71AV6mokPeuTEgrZVdUJ4A8v3AB/image.png\" alt=\"An \"inline\" button is as small as the text it contains. In this image, it's centered. Below it is a \"block-level\" button, which stretches to fill the entire horizontal space.'>",
|
"<img class=\"img-responsive\" src=\"http://i.imgur.com/O32cDWE.png\" alt=\"An \"inline\" button is as small as the text it contains. In this image, it's centered. Below it is a \"block-level\" button, which stretches to fill the entire horizontal space.'>",
|
||||||
"Note that these buttons still need the <code>btn</code> class.",
|
"Note that these buttons still need the <code>btn</code> class.",
|
||||||
"Add Bootstrap's <code>btn-block</code> class to your Bootstrap button."
|
"Add Bootstrap's <code>btn-block</code> class to your Bootstrap button."
|
||||||
],
|
],
|
||||||
@ -614,7 +614,7 @@
|
|||||||
"Note that these buttons still need the <code>btn</code> and <code>btn-block</code> classes."
|
"Note that these buttons still need the <code>btn</code> and <code>btn-block</code> classes."
|
||||||
],
|
],
|
||||||
"tests": [
|
"tests": [
|
||||||
"assert(new RegExp(\"delete\",\"gi\").test($(\"button\").text()), 'Create a new <code>button</code> element with the text \"delete\".')",
|
"assert(new RegExp(\"Delete\",\"gi\").test($(\"button\").text()), 'Create a new <code>button</code> element with the text \"Delete\".')",
|
||||||
"assert($(\"button.btn-block.btn\").length > 2, 'All of your Bootstrap buttons should have the <code>btn</code> and <code>btn-block</code> classes.')",
|
"assert($(\"button.btn-block.btn\").length > 2, 'All of your Bootstrap buttons should have the <code>btn</code> and <code>btn-block</code> classes.')",
|
||||||
"assert($(\"button\").hasClass(\"btn-danger\"), 'Your new button should have the class <code>btn-danger</code>.')",
|
"assert($(\"button\").hasClass(\"btn-danger\"), 'Your new button should have the class <code>btn-danger</code>.')",
|
||||||
"assert(editor.match(/<\\/button>/g) && editor.match(/<button/g) && editor.match(/<\\/button>/g).length === editor.match(/<button/g).length, 'Make sure all your <code>button</code> elements have a closing tag.')"
|
"assert(editor.match(/<\\/button>/g) && editor.match(/<button/g) && editor.match(/<\\/button>/g).length === editor.match(/<button/g).length, 'Make sure all your <code>button</code> elements have a closing tag.')"
|
||||||
@ -700,7 +700,7 @@
|
|||||||
"description": [
|
"description": [
|
||||||
"Bootstrap uses a responsive grid system, which makes it easy to put elements into rows and specify each element's relative width. Most of Bootstrap's classes can be applied to a <code>div</code> element.",
|
"Bootstrap uses a responsive grid system, which makes it easy to put elements into rows and specify each element's relative width. Most of Bootstrap's classes can be applied to a <code>div</code> element.",
|
||||||
"Here's a diagram of how Bootstrap's 12-column grid layout works:",
|
"Here's a diagram of how Bootstrap's 12-column grid layout works:",
|
||||||
"<a href=\"https://www.evernote.com/l/AHTwlE2XCLhGFYJzoye_QfsF3ho6y87via4B/image.png\" target=\"_blank\"><img class=\"img-responsive\" src=\"https://www.evernote.com/l/AHTwlE2XCLhGFYJzoye_QfsF3ho6y87via4B/image.png\"></a>",
|
"<a href=\"http://i.imgur.com/FaYuui8.png\" target=\"_blank\"><img class=\"img-responsive\" src=\"http://i.imgur.com/FaYuui8.png\" alt=\"an image illustrating Bootstrap's grid system\"></a>",
|
||||||
"Note that in this illustration, the <code>col-md-*</code> class is being used. Here, <code>md</code> means medium, and <code>*</code> is a number specifying how many columns wide the element should be. In this case, the column width of an element on a medium-sized screen, such as a laptop, is being specified.",
|
"Note that in this illustration, the <code>col-md-*</code> class is being used. Here, <code>md</code> means medium, and <code>*</code> is a number specifying how many columns wide the element should be. In this case, the column width of an element on a medium-sized screen, such as a laptop, is being specified.",
|
||||||
"In the Cat Photo App that we're building, we'll use <code>col-xs-*</code>, where <code>xs</code> means extra small (like an extra-small mobile phone screen), and <code>*</code> is the number of columns specifying how many columns wide the element should be.",
|
"In the Cat Photo App that we're building, we'll use <code>col-xs-*</code>, where <code>xs</code> means extra small (like an extra-small mobile phone screen), and <code>*</code> is the number of columns specifying how many columns wide the element should be.",
|
||||||
"Put the <code>Like</code>, <code>Info</code> and <code>Delete</code> buttons side-by-side by nesting all three of them within one <code><div class=\"row\"></code> element, then each of them within a <code><div class=\"col-xs-4\"></code> element.",
|
"Put the <code>Like</code>, <code>Info</code> and <code>Delete</code> buttons side-by-side by nesting all three of them within one <code><div class=\"row\"></code> element, then each of them within a <code><div class=\"col-xs-4\"></code> element.",
|
||||||
@ -893,9 +893,9 @@
|
|||||||
"title": "Use Spans for Inline Elements",
|
"title": "Use Spans for Inline Elements",
|
||||||
"difficulty": 2.105,
|
"difficulty": 2.105,
|
||||||
"description": [
|
"description": [
|
||||||
"You can use use spans to create inline elements. Remember when we used the <code>btn-block</code> class to make the button fill the entire row?",
|
"You can use spans to create inline elements. Remember when we used the <code>btn-block</code> class to make the button fill the entire row?",
|
||||||
"This image illustrates the difference between <code>inline</code> elements and <code>block-level</code> elements:",
|
"This image illustrates the difference between <code>inline</code> elements and <code>block-level</code> elements:",
|
||||||
"<img class=\"img-responsive\" src=\"https://www.evernote.com/l/AHTFU358y71AV6mokPeuTEgrZVdUJ4A8v3AB/image.png\" alt=\"An \"inline\" button is as small as the text it contains. In this image, it's centered. Below it is a \"block-level\" button, which stretches to fill the entire horizontal space.'>",
|
"<img class=\"img-responsive\" src=\"http://i.imgur.com/O32cDWE.png\" alt=\"An \"inline\" button is as small as the text it contains. In this image, it's centered. Below it is a \"block-level\" button, which stretches to fill the entire horizontal space.'>",
|
||||||
"By using the <code>span</code> element, you can put several elements together, and even style different parts of the same element differently.",
|
"By using the <code>span</code> element, you can put several elements together, and even style different parts of the same element differently.",
|
||||||
"Nest the word \"love\" in your \"Things cats love\" element below within a <code>span</code> element. Then give that <code>span</code> the class <code>text-danger</code> to make the text red.",
|
"Nest the word \"love\" in your \"Things cats love\" element below within a <code>span</code> element. Then give that <code>span</code> the class <code>text-danger</code> to make the text red.",
|
||||||
"Here's how you would do this with the \"Top 3 things cats hate\" element: <code><p>Top 3 things cats <span class = \"text-danger\">hate</span></p></code>"
|
"Here's how you would do this with the \"Top 3 things cats hate\" element: <code><p>Top 3 things cats <span class = \"text-danger\">hate</span></p></code>"
|
||||||
@ -997,7 +997,7 @@
|
|||||||
"We will make a simple heading for our Cat Photo App by putting them in the same row.",
|
"We will make a simple heading for our Cat Photo App by putting them in the same row.",
|
||||||
"Remember, Bootstrap uses a responsive grid system, which makes it easy to put elements into rows and specify each element's relative width. Most of Bootstrap's classes can be applied to a <code>div</code> element.",
|
"Remember, Bootstrap uses a responsive grid system, which makes it easy to put elements into rows and specify each element's relative width. Most of Bootstrap's classes can be applied to a <code>div</code> element.",
|
||||||
"Here's a diagram of how Bootstrap's 12-column grid layout works:",
|
"Here's a diagram of how Bootstrap's 12-column grid layout works:",
|
||||||
"<a href=\"https://www.evernote.com/l/AHTwlE2XCLhGFYJzoye_QfsF3ho6y87via4B/image.png\" target=\"_blank\"><img class=\"img-responsive\" src=\"https://www.evernote.com/l/AHTwlE2XCLhGFYJzoye_QfsF3ho6y87via4B/image.png\"></a>",
|
"<a href=\"http://i.imgur.com/FaYuui8.png\" target=\"_blank\"><img class=\"img-responsive\" src=\"http://i.imgur.com/FaYuui8.png\" alt=\"an image illustrating Bootstrap's grid system\"></a>",
|
||||||
"Note that in this illustration, the <code>col-md-*</code> class is being used. Here, <code>md</code> means medium, and <code>*</code> is a number specifying how many columns wide the element should be. In this case, the column width of an element on a medium-sized screen, such as a laptop, is being specified.",
|
"Note that in this illustration, the <code>col-md-*</code> class is being used. Here, <code>md</code> means medium, and <code>*</code> is a number specifying how many columns wide the element should be. In this case, the column width of an element on a medium-sized screen, such as a laptop, is being specified.",
|
||||||
"In the Cat Photo App that we're building, we'll use <code>col-xs-*</code>, where <code>xs</code> means extra small (like an extra-small mobile phone screen), and <code>*</code> is the number of columns specifying how many columns wide the element should be.",
|
"In the Cat Photo App that we're building, we'll use <code>col-xs-*</code>, where <code>xs</code> means extra small (like an extra-small mobile phone screen), and <code>*</code> is the number of columns specifying how many columns wide the element should be.",
|
||||||
"Nest your first image and your <code>h2</code> element within a single <code><div class=\"row\"></code> element. Nest your <code>h2</code> text within a <code><div class=\"col-xs-8\"></code> and your image in a <code><div class=\"col-xs-4\"></code> so that they are on the same line.",
|
"Nest your first image and your <code>h2</code> element within a single <code><div class=\"row\"></code> element. Nest your <code>h2</code> text within a <code><div class=\"col-xs-8\"></code> and your image in a <code><div class=\"col-xs-4\"></code> so that they are on the same line.",
|
||||||
@ -1770,7 +1770,7 @@
|
|||||||
],
|
],
|
||||||
"tests": [
|
"tests": [
|
||||||
"assert($(\"div\").length > 4, 'Add a <code>div</code> element with the class <code>well</code> inside each of your <code>div class=\"col-xs-6\"> elements</code>')",
|
"assert($(\"div\").length > 4, 'Add a <code>div</code> element with the class <code>well</code> inside each of your <code>div class=\"col-xs-6\"> elements</code>')",
|
||||||
"assert($(\"div.col-xs-6\").children(\"div.well\").length > 1, 'Nest both of your <code>div class=\"col-xs-6\"</code> elements within your <code>div class=\"row\"</code> element.')",
|
"assert($(\"div.col-xs-6 div.well\").length > 1, 'Nest both of your <code>div class=\"col-xs-6\"</code> elements within your <code>div class=\"row\"</code> element.')",
|
||||||
"assert(editor.match(/<\\/div>/g) && editor.match(/<div/g) && editor.match(/<\\/div>/g).length === editor.match(/<div/g).length, 'Make sure all your <code>div</code> elements have closing tags.')"
|
"assert(editor.match(/<\\/div>/g) && editor.match(/<div/g) && editor.match(/<\\/div>/g).length === editor.match(/<div/g).length, 'Make sure all your <code>div</code> elements have closing tags.')"
|
||||||
],
|
],
|
||||||
"challengeSeed": [
|
"challengeSeed": [
|
||||||
|
@ -16,7 +16,7 @@
|
|||||||
"Choose Node.js in the selection area below the name field.",
|
"Choose Node.js in the selection area below the name field.",
|
||||||
"Click the Create button. Then click into your new workspace.",
|
"Click the Create button. Then click into your new workspace.",
|
||||||
"In the lower right hand corner you should see a terminal window. In this window use the following commands. You don't need to know what these mean at this point.",
|
"In the lower right hand corner you should see a terminal window. In this window use the following commands. You don't need to know what these mean at this point.",
|
||||||
"Install <code>how-to-npm</code> with this command: <code>npm install -g git-it</code>",
|
"Install <code>git-it</code> with this command: <code>npm install -g git-it</code>",
|
||||||
"Now start the tutorial by running <code>git-it</code>.",
|
"Now start the tutorial by running <code>git-it</code>.",
|
||||||
"Note that you can resize the c9.io's windows by dragging their borders.",
|
"Note that you can resize the c9.io's windows by dragging their borders.",
|
||||||
"Make sure that you are always in your project's \"workspace\" directory. You can always navigate back to this directory by running this command: <code>cd ~/workspace</code>.",
|
"Make sure that you are always in your project's \"workspace\" directory. You can always navigate back to this directory by running this command: <code>cd ~/workspace</code>.",
|
||||||
|
@ -428,8 +428,12 @@
|
|||||||
"description": [
|
"description": [
|
||||||
"Create a CSS class called <code>red-text</code> and apply it to your <code>h2</code> element.",
|
"Create a CSS class called <code>red-text</code> and apply it to your <code>h2</code> element.",
|
||||||
"Classes are reusable styles that can be added to HTML elements.",
|
"Classes are reusable styles that can be added to HTML elements.",
|
||||||
"Here's the anatomy of a CSS class:",
|
"Here's an example CSS class declaration:",
|
||||||
"<img class=\"img-responsive\" alt=\"a diagram of how style tags are composed, which is also described in detail on the following lines.\" src=\"https://www.evernote.com/l/AHSCzZV0l_dDLrqD8r9JsHaBWfEzdN0OpRwB/image.png\">",
|
"<code><style></code>",
|
||||||
|
"<code>  .blue-text {</code>",
|
||||||
|
"<code>    color: blue;</code>",
|
||||||
|
"<code>  }</code>",
|
||||||
|
"<code></style></code>",
|
||||||
"You can see that we've created a CSS class called <code>blue-text</code> within the <code><style></code> tag.",
|
"You can see that we've created a CSS class called <code>blue-text</code> within the <code><style></code> tag.",
|
||||||
"You can apply a class to an HTML element like this: <code><h2 class=\"blue-text\">CatPhotoApp</h2></code>.",
|
"You can apply a class to an HTML element like this: <code><h2 class=\"blue-text\">CatPhotoApp</h2></code>.",
|
||||||
"Note that in your CSS <code>style</code> element, classes should start with a period. In your HTML elements' class declarations, classes shouldn't start with a period.",
|
"Note that in your CSS <code>style</code> element, classes should start with a period. In your HTML elements' class declarations, classes shouldn't start with a period.",
|
||||||
@ -750,7 +754,7 @@
|
|||||||
"difficulty": 1.17,
|
"difficulty": 1.17,
|
||||||
"description": [
|
"description": [
|
||||||
"You can add images to your website by using the <code>img</code> element, and point to a specific image's URL using the <code>src</code> attribute.",
|
"You can add images to your website by using the <code>img</code> element, and point to a specific image's URL using the <code>src</code> attribute.",
|
||||||
"An example of this would be <code><img src=\"www.your-image-source.com/your-image.jpg\"></code>. Note that in most cases, <code>img</code> elements are self-closing.",
|
"An example of this would be <code><img src=\"http://www.your-image-source.com/your-image.jpg\"></code>. Note that in most cases, <code>img</code> elements are self-closing.",
|
||||||
"Try it with this image: <code>https://bit.ly/fcc-relaxing-cat</code>."
|
"Try it with this image: <code>https://bit.ly/fcc-relaxing-cat</code>."
|
||||||
],
|
],
|
||||||
"tests": [
|
"tests": [
|
||||||
@ -1056,7 +1060,7 @@
|
|||||||
"description": [
|
"description": [
|
||||||
"<code>a</code> elements, also known as <code>anchor</code> elements, are used to link to content outside of the current page.",
|
"<code>a</code> elements, also known as <code>anchor</code> elements, are used to link to content outside of the current page.",
|
||||||
"Here's a diagram of an <code>a</code> element. In this case, the <code>a</code> element is used in the middle of a paragraph element, which means the link will appear in the middle of a sentence.",
|
"Here's a diagram of an <code>a</code> element. In this case, the <code>a</code> element is used in the middle of a paragraph element, which means the link will appear in the middle of a sentence.",
|
||||||
"<img class=\"img-responsive\" alt=\"a diagram of how anchor tags are composed with the same text as on the following line\" src=\"https://www.evernote.com/l/AHSaNaepx_lG9LhhPkVYmagcedpmAeITDsQB/image.png\">",
|
"<img class=\"img-responsive\" alt=\"a diagram of how anchor tags are composed with the same text as on the following line\" src=\"http://i.imgur.com/hviuZwe.png\">",
|
||||||
"Here's an example: <code><p>Here's a <a href=\"http://freecodecamp.com\"> link to Free Code Camp</a> for you to follow.</p></code>.",
|
"Here's an example: <code><p>Here's a <a href=\"http://freecodecamp.com\"> link to Free Code Camp</a> for you to follow.</p></code>.",
|
||||||
"Create an <code>a</code> element that links to <code>http://catphotoapp.com</code> and has \"cat photos\" as its <code>anchor text</code>."
|
"Create an <code>a</code> element that links to <code>http://catphotoapp.com</code> and has \"cat photos\" as its <code>anchor text</code>."
|
||||||
],
|
],
|
||||||
@ -1126,7 +1130,7 @@
|
|||||||
"difficulty": 1.23,
|
"difficulty": 1.23,
|
||||||
"description": [
|
"description": [
|
||||||
"Again, here's a diagram of an <code>a</code> element for your reference:",
|
"Again, here's a diagram of an <code>a</code> element for your reference:",
|
||||||
"<img class=\"img-responsive\" alt=\"a diagram of how anchor tags are composed with the same text as on the following line\" src=\"https://www.evernote.com/l/AHSaNaepx_lG9LhhPkVYmagcedpmAeITDsQB/image.png\">",
|
"<img class=\"img-responsive\" alt=\"a diagram of how anchor tags are composed with the same text as on the following line\" src=\"http://i.imgur.com/hviuZwe.png\">",
|
||||||
"Here's an example: <code><p>Here's a <a href=\"http://freecodecamp.com\"> link to Free Code Camp</a> for you to follow.</p></code>.",
|
"Here's an example: <code><p>Here's a <a href=\"http://freecodecamp.com\"> link to Free Code Camp</a> for you to follow.</p></code>.",
|
||||||
"<code>Nesting</code> just means putting one element inside of another element.",
|
"<code>Nesting</code> just means putting one element inside of another element.",
|
||||||
"Now nest your <code>a</code> element within a new <code>p</code> element so that the surrounding paragraph says \"click here for cat photos\", but where only \"cat photos\" is a link, and the rest of the text is rest is plain text."
|
"Now nest your <code>a</code> element within a new <code>p</code> element so that the surrounding paragraph says \"click here for cat photos\", but where only \"cat photos\" is a link, and the rest of the text is rest is plain text."
|
||||||
@ -3281,12 +3285,14 @@
|
|||||||
"Let's override your <code>pink-text</code> and <code>blue-text</code> classes, and make your <code>h1</code> element orange, by giving the <code>h1</code> element an id and then styling that id.",
|
"Let's override your <code>pink-text</code> and <code>blue-text</code> classes, and make your <code>h1</code> element orange, by giving the <code>h1</code> element an id and then styling that id.",
|
||||||
"Give your <code>h1</code> element the <code>id</code> attribute of <code>orange-text</code>. Remember, id styles look like this: <code><h1 id=\"orange-text\"></code>",
|
"Give your <code>h1</code> element the <code>id</code> attribute of <code>orange-text</code>. Remember, id styles look like this: <code><h1 id=\"orange-text\"></code>",
|
||||||
"Leave the <code>blue-text</code> and <code>pink-text</code> classes on your <code>h1</code> element.",
|
"Leave the <code>blue-text</code> and <code>pink-text</code> classes on your <code>h1</code> element.",
|
||||||
"Create a CSS declaration for your <code>orange-text</code> id in your <code>style</code> element. Here's and example of what this looks like: <code>#brown-text { color: brown; }</code>"
|
"Create a CSS declaration for your <code>orange-text</code> id in your <code>style</code> element. Here's an example of what this looks like: <code>#brown-text { color: brown; }</code>"
|
||||||
],
|
],
|
||||||
"tests": [
|
"tests": [
|
||||||
"assert($(\"h1\").hasClass(\"pink-text\"), 'Your <code>h1</code> element should have the class <code>pink-text</code>.')",
|
"assert($(\"h1\").hasClass(\"pink-text\"), 'Your <code>h1</code> element should have the class <code>pink-text</code>.')",
|
||||||
"assert($(\"h1\").hasClass(\"blue-text\"), 'Your <code>h1</code> element should have the class <code>blue-text</code>.')",
|
"assert($(\"h1\").hasClass(\"blue-text\"), 'Your <code>h1</code> element should have the class <code>blue-text</code>.')",
|
||||||
"assert($(\"h1\").attr(\"id\") === \"orange-text\", 'Give your <code>h1</code> element the id of <code>orange-text</code>.')",
|
"assert($(\"h1\").attr(\"id\") === \"orange-text\", 'Give your <code>h1</code> element the id of <code>orange-text</code>.')",
|
||||||
|
"assert(editor.match(/#orange-text\\s*{/gi), 'Create a CSS declaration for your <code>orange-text</code> id')",
|
||||||
|
"assert(!editor.match(/<h1.*style.*>/gi), 'Do not give your <code>h1</code> any <code>style</code> attributes.')",
|
||||||
"assert($(\"h1\").css(\"color\") === \"rgb(255, 165, 0)\", 'Your <code>h1</code> element should be orange.')"
|
"assert($(\"h1\").css(\"color\") === \"rgb(255, 165, 0)\", 'Your <code>h1</code> element should be orange.')"
|
||||||
],
|
],
|
||||||
"challengeSeed": [
|
"challengeSeed": [
|
||||||
|
@ -138,9 +138,9 @@
|
|||||||
"id": "bd7158d8c442eddfaeb5bd1c",
|
"id": "bd7158d8c442eddfaeb5bd1c",
|
||||||
"title": "Build a Simon Game",
|
"title": "Build a Simon Game",
|
||||||
"difficulty": 1.07,
|
"difficulty": 1.07,
|
||||||
"challengeSeed": ["126415123"],
|
"challengeSeed": ["137213633"],
|
||||||
"description": [
|
"description": [
|
||||||
"<span class='text-info'>Objective:</span> Build a <a href='http://codepen.io' target='_blank'>CodePen.io</a> app that successfully reverse-engineers this: <a href='http://codepen.io/dting/full/KpJXZV/' target='_blank'>http://codepen.io/dting/full/KpJXZV/</a>.",
|
"<span class='text-info'>Objective:</span> Build a <a href='http://codepen.io' target='_blank'>CodePen.io</a> app that successfully reverse-engineers this: <a href='http://codepen.io/Em-Ant/full/QbRyqq/' target='_blank'>http://codepen.io/dting/full/QbRyqq/</a>.",
|
||||||
"<span class='text-info'>Rule #1:</span> Don't look at the example project's code on CodePen. Figure it out for yourself.",
|
"<span class='text-info'>Rule #1:</span> Don't look at the example project's code on CodePen. Figure it out for yourself.",
|
||||||
"<span class='text-info'>Rule #2:</span> You may use whichever libraries or APIs you need.",
|
"<span class='text-info'>Rule #2:</span> You may use whichever libraries or APIs you need.",
|
||||||
"<span class='text-info'>Rule #3:</span> Reverse engineer the example project's functionality, and also feel free to personalize it.",
|
"<span class='text-info'>Rule #3:</span> Reverse engineer the example project's functionality, and also feel free to personalize it.",
|
||||||
|
@ -17,7 +17,7 @@
|
|||||||
"assert(editor.match(/<script>/g), 'Create a <code>script</code> element.')",
|
"assert(editor.match(/<script>/g), 'Create a <code>script</code> element.')",
|
||||||
"assert(editor.match(/<\\/script>/g) && editor.match(/<script/g) && editor.match(/<\\/script>/g).length === editor.match(/<script/g).length, 'Make sure your <code>script</code> element has a closing tag.')",
|
"assert(editor.match(/<\\/script>/g) && editor.match(/<script/g) && editor.match(/<\\/script>/g).length === editor.match(/<script/g).length, 'Make sure your <code>script</code> element has a closing tag.')",
|
||||||
"assert(editor.match(/\\$\\(document\\)\\.ready\\(function\\(\\)\\s?\\{/g), 'Add <code>$(document).ready(function() {</code> to the beginning of your <code>script</code> element.')",
|
"assert(editor.match(/\\$\\(document\\)\\.ready\\(function\\(\\)\\s?\\{/g), 'Add <code>$(document).ready(function() {</code> to the beginning of your <code>script</code> element.')",
|
||||||
"assert(editor.match(/\\n\\s+?\\}\\);/g), 'Close your <code>$(document).ready(function() {</code> function with <code>});</code>.')"
|
"assert(editor.match(/\\n?\\s+?\\}\\);/g), 'Close your <code>$(document).ready(function() {</code> function with <code>});</code>.')"
|
||||||
],
|
],
|
||||||
"challengeSeed": [
|
"challengeSeed": [
|
||||||
"",
|
"",
|
||||||
@ -415,7 +415,7 @@
|
|||||||
"You can also change the non-CSS properties of HTML elements with jQuery. For example, you can disable buttons.",
|
"You can also change the non-CSS properties of HTML elements with jQuery. For example, you can disable buttons.",
|
||||||
"When you disable a button, it will become grayed-out and can no longer be clicked.",
|
"When you disable a button, it will become grayed-out and can no longer be clicked.",
|
||||||
"jQuery has a function called <code>.prop()</code> that allows you to adjust the properties of elements.",
|
"jQuery has a function called <code>.prop()</code> that allows you to adjust the properties of elements.",
|
||||||
"Here's how you would disable all buttons: <code>$('#button').prop('disabled', true);</code>",
|
"Here's how you would disable all buttons: <code>$(\"button\").prop(\"disabled\", true);</code>",
|
||||||
"Disable only the <code>target1</code> button."
|
"Disable only the <code>target1</code> button."
|
||||||
],
|
],
|
||||||
"tests": [
|
"tests": [
|
||||||
|
@ -180,7 +180,8 @@
|
|||||||
"<code>  return(val+1);</code>",
|
"<code>  return(val+1);</code>",
|
||||||
"<code>});</code>",
|
"<code>});</code>",
|
||||||
"",
|
"",
|
||||||
"The map method is one of the easiest ways to iterate through an array or object there is. Let's use it now."
|
"The map method is one of the easiest ways to iterate through an array or object there is. Let's use it now.",
|
||||||
|
"Use the map function to add 3 to every value in the variable <code>array</code>"
|
||||||
],
|
],
|
||||||
"tests":[
|
"tests":[
|
||||||
"assert.deepEqual(array, [4,5,6,7,8], 'You should have added three to each value in the array');",
|
"assert.deepEqual(array, [4,5,6,7,8], 'You should have added three to each value in the array');",
|
||||||
|
@ -49,7 +49,7 @@ export default function({ models }) {
|
|||||||
}
|
}
|
||||||
if (identity.userId.toString() !== userId.toString()) {
|
if (identity.userId.toString() !== userId.toString()) {
|
||||||
return Observable.throw(
|
return Observable.throw(
|
||||||
new Error('An account is already linked to that profile')
|
new Error("It looks like you already have an account associated with that sign in method. Here's what you can do: 1) Sign out of this account. 2) Use that sign in method to sign into your other account. 3) Delete that account. 4) Then sign back into this account and you'll be able to link it here. If you need help, send us an email at team@freecodecamp.com.")
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
identity.credentials = credentials;
|
identity.credentials = credentials;
|
||||||
|
@ -29,7 +29,7 @@ module.exports = function(loopbackApp) {
|
|||||||
|
|
||||||
loopbackApp.once('started', function() {
|
loopbackApp.once('started', function() {
|
||||||
app.listen(port, function() {
|
app.listen(port, function() {
|
||||||
console.log('https redirect lisenting on port %s', port);
|
console.log('https redirect listening on port %s', port);
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
};
|
};
|
||||||
|
@ -1,12 +1,5 @@
|
|||||||
var path = require('path'),
|
var cheerio = require('cheerio'),
|
||||||
// debug = require('debug')('freecc:cntr:resources'),
|
|
||||||
cheerio = require('cheerio'),
|
|
||||||
request = require('request'),
|
request = require('request'),
|
||||||
R = require('ramda'),
|
|
||||||
_ = require('lodash'),
|
|
||||||
fs = require('fs'),
|
|
||||||
|
|
||||||
|
|
||||||
MDNlinks = require('../../seed/bonfireMDNlinks'),
|
MDNlinks = require('../../seed/bonfireMDNlinks'),
|
||||||
resources = require('./resources.json'),
|
resources = require('./resources.json'),
|
||||||
nonprofits = require('../../seed/nonprofits.json');
|
nonprofits = require('../../seed/nonprofits.json');
|
||||||
@ -14,33 +7,7 @@ var path = require('path'),
|
|||||||
/**
|
/**
|
||||||
* Cached values
|
* Cached values
|
||||||
*/
|
*/
|
||||||
var allNonprofitNames,
|
var allNonprofitNames;
|
||||||
challengeMap, challengeMapForDisplay, challengeMapWithIds,
|
|
||||||
challengeMapWithNames, allChallengeIds,
|
|
||||||
challengeMapWithDashedNames;
|
|
||||||
|
|
||||||
(function() {
|
|
||||||
if (!challengeMap) {
|
|
||||||
var localChallengeMap = {};
|
|
||||||
var files = fs.readdirSync(
|
|
||||||
path.join(__dirname, '../../seed/challenges')
|
|
||||||
);
|
|
||||||
var keyCounter = 0;
|
|
||||||
files = files.map(function(file) {
|
|
||||||
return require(
|
|
||||||
path.join(__dirname, '../../seed/challenges/' + file)
|
|
||||||
);
|
|
||||||
});
|
|
||||||
files = files.sort(function(a, b) {
|
|
||||||
return a.order - b.order;
|
|
||||||
});
|
|
||||||
files.forEach(function(file) {
|
|
||||||
localChallengeMap[keyCounter++] = file;
|
|
||||||
});
|
|
||||||
challengeMap = _.cloneDeep(localChallengeMap);
|
|
||||||
}
|
|
||||||
})();
|
|
||||||
|
|
||||||
|
|
||||||
module.exports = {
|
module.exports = {
|
||||||
dasherize: function dasherize(name) {
|
dasherize: function dasherize(name) {
|
||||||
@ -59,75 +26,6 @@ module.exports = {
|
|||||||
.trim();
|
.trim();
|
||||||
},
|
},
|
||||||
|
|
||||||
getChallengeMapForDisplay: function() {
|
|
||||||
if (!challengeMapForDisplay) {
|
|
||||||
challengeMapForDisplay = {};
|
|
||||||
Object.keys(challengeMap).forEach(function(key) {
|
|
||||||
challengeMapForDisplay[key] = {
|
|
||||||
name: challengeMap[key].title,
|
|
||||||
dashedName: challengeMap[key].title.replace(/\s/g, '-'),
|
|
||||||
challenges: challengeMap[key].challenges,
|
|
||||||
completedCount: challengeMap[key].challenges
|
|
||||||
};
|
|
||||||
});
|
|
||||||
}
|
|
||||||
return challengeMapForDisplay;
|
|
||||||
},
|
|
||||||
|
|
||||||
getChallengeMapWithIds: function() {
|
|
||||||
if (!challengeMapWithIds) {
|
|
||||||
challengeMapWithIds = {};
|
|
||||||
Object.keys(challengeMap).forEach(function(key) {
|
|
||||||
var onlyIds = challengeMap[key].challenges.map(function(elem) {
|
|
||||||
return elem.id;
|
|
||||||
});
|
|
||||||
challengeMapWithIds[key] = onlyIds;
|
|
||||||
});
|
|
||||||
}
|
|
||||||
return challengeMapWithIds;
|
|
||||||
},
|
|
||||||
|
|
||||||
allChallengeIds: function() {
|
|
||||||
|
|
||||||
if (!allChallengeIds) {
|
|
||||||
allChallengeIds = [];
|
|
||||||
Object.keys(this.getChallengeMapWithIds()).forEach(function(key) {
|
|
||||||
allChallengeIds.push(challengeMapWithIds[key]);
|
|
||||||
});
|
|
||||||
allChallengeIds = R.flatten(allChallengeIds);
|
|
||||||
}
|
|
||||||
return allChallengeIds;
|
|
||||||
},
|
|
||||||
|
|
||||||
getChallengeMapWithNames: function() {
|
|
||||||
if (!challengeMapWithNames) {
|
|
||||||
challengeMapWithNames = {};
|
|
||||||
Object.keys(challengeMap).
|
|
||||||
forEach(function(key) {
|
|
||||||
var onlyNames = challengeMap[key].challenges.map(function(elem) {
|
|
||||||
return elem.name;
|
|
||||||
});
|
|
||||||
challengeMapWithNames[key] = onlyNames;
|
|
||||||
});
|
|
||||||
}
|
|
||||||
return challengeMapWithNames;
|
|
||||||
},
|
|
||||||
|
|
||||||
getChallengeMapWithDashedNames: function() {
|
|
||||||
if (!challengeMapWithDashedNames) {
|
|
||||||
challengeMapWithDashedNames = {};
|
|
||||||
Object.keys(challengeMap).
|
|
||||||
forEach(function(key) {
|
|
||||||
var onlyNames = challengeMap[key].challenges.map(function(elem) {
|
|
||||||
return elem.dashedName;
|
|
||||||
});
|
|
||||||
challengeMapWithDashedNames[key] = onlyNames;
|
|
||||||
});
|
|
||||||
}
|
|
||||||
return challengeMapWithDashedNames;
|
|
||||||
},
|
|
||||||
|
|
||||||
|
|
||||||
randomPhrase: function() {
|
randomPhrase: function() {
|
||||||
return resources.phrases[
|
return resources.phrases[
|
||||||
Math.floor(Math.random() * resources.phrases.length)
|
Math.floor(Math.random() * resources.phrases.length)
|
||||||
|
@ -14,7 +14,7 @@ block content
|
|||||||
else
|
else
|
||||||
a.btn.btn-lg.btn-block.btn-github.btn-link-social(href='/link/github')
|
a.btn.btn-lg.btn-block.btn-github.btn-link-social(href='/link/github')
|
||||||
i.fa.fa-github
|
i.fa.fa-github
|
||||||
| Update my profile from Github
|
| Update my profile from GitHub
|
||||||
|
|
||||||
if (!user.twitter)
|
if (!user.twitter)
|
||||||
.col-xs-12
|
.col-xs-12
|
||||||
@ -72,4 +72,4 @@ block content
|
|||||||
input(type='hidden', name='_csrf', value=_csrf)
|
input(type='hidden', name='_csrf', value=_csrf)
|
||||||
button.btn.btn-danger.btn-block(type='submit')
|
button.btn.btn-danger.btn-block(type='submit')
|
||||||
span.ion-trash-b
|
span.ion-trash-b
|
||||||
| Yes, Delete my account
|
| Yes, delete my account
|
||||||
|
@ -101,7 +101,6 @@ block content
|
|||||||
li.large-li The most substantial cost for most people is lost wages. A 40-hour-per-week job at the US Federal minimum wage would pay at least $15,000 per year. You can read more about economic cost
|
li.large-li The most substantial cost for most people is lost wages. A 40-hour-per-week job at the US Federal minimum wage would pay at least $15,000 per year. You can read more about economic cost
|
||||||
a(href='https://en.wikipedia.org/wiki/Economic_cost' target='_blank') here
|
a(href='https://en.wikipedia.org/wiki/Economic_cost' target='_blank') here
|
||||||
| .
|
| .
|
||||||
li.large-li Free Code Camp. We don't charge tuition or garnish wages. We're fully online so you don't have to move. We're self-paced so you don't have to quit your job. Thus, your true cost of attending Free Code Camp will be $0.
|
|
||||||
.spacer
|
.spacer
|
||||||
.row
|
.row
|
||||||
.col-xs-12.col-sm-6
|
.col-xs-12.col-sm-6
|
||||||
|
@ -103,7 +103,7 @@ script.
|
|||||||
"</a>" +
|
"</a>" +
|
||||||
"</div>" +
|
"</div>" +
|
||||||
"<div class='story-byline col-xs-12 wrappable'>" +
|
"<div class='story-byline col-xs-12 wrappable'>" +
|
||||||
"<a class='btn btn-no-shadow btn-primary btn-xs btn-primary-ghost' href='/news/" + linkedName + "'>more info.more info...</a> · " +
|
"<a class='btn btn-no-shadow btn-primary btn-xs btn-primary-ghost' href='/news/" + linkedName + "'>more info...</a> · " +
|
||||||
rank + (rank > 1 ? " points" : " point") + " · posted " +
|
rank + (rank > 1 ? " points" : " point") + " · posted " +
|
||||||
moment(data[i].timePosted).fromNow() +
|
moment(data[i].timePosted).fromNow() +
|
||||||
" by <a href='/" + data[i].author.username + "'>@" + data[i].author.username +
|
" by <a href='/" + data[i].author.username + "'>@" + data[i].author.username +
|
||||||
|
Reference in New Issue
Block a user