start refactoring the learn-to-code view to use ajax

This commit is contained in:
Michael Q Larson
2015-02-16 23:35:02 -08:00
parent 44ea0039f6
commit 8e209d6bca
5 changed files with 161 additions and 138 deletions

8
app.js
View File

@ -272,6 +272,14 @@ app.get(
app.all('/account', passportConf.isAuthenticated); app.all('/account', passportConf.isAuthenticated);
app.get('/account/api', userController.getAccountAngular); app.get('/account/api', userController.getAccountAngular);
/**
* API routes
*/
app.get('/api/github', resourcesController.githubCalls);
app.get('/api/blogger', resourcesController.bloggerCalls);
app.get('/api/trello', resourcesController.trelloCalls);
/** /**
* Bonfire related routes * Bonfire related routes
*/ */

View File

@ -96,61 +96,68 @@ module.exports = {
title: 'JavaScript in your Inbox' title: 'JavaScript in your Inbox'
}); });
}, },
githubCalls: function(req, res) {
var githubHeaders = {headers: {'User-Agent': 'Mozilla/5.0 (Macintosh; Intel Mac OS X 10_8_2) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/29.0.1521.3 Safari/537.36'}, port:80 };
client.get('https://api.github.com/repos/freecodecamp/freecodecamp/pulls?client_id=' + secrets.github.clientID + '&client_secret=' + secrets.github.clientSecret, githubHeaders, function(pulls, res3) {
pulls = Object.keys(JSON.parse(pulls)).length || "Can't connect to github";
client.get('https://api.github.com/repos/freecodecamp/freecodecamp/issues?client_id=' + secrets.github.clientID + '&client_secret=' + secrets.github.clientSecret, githubHeaders, function (issues, res4) {
issues = ((pulls === parseInt(pulls)) && issues) ? Object.keys(JSON.parse(issues)).length - pulls : "Can't connect to GitHub";
res.send({"issues": issues, "pulls" : pulls});
});
});
},
trelloCalls: function(req, res) {
client.get('https://trello.com/1/boards/BA3xVpz9/cards?key=' + secrets.trello.key, function(trello, res2) {
trello = trello ? (JSON.parse(trello)).length : "Can't connecto to Trello";
res.send({"trello": trello});
});
},
bloggerCalls: function(req, res) {
client.get('https://www.googleapis.com/blogger/v3/blogs/2421288658305323950/posts?key=' + secrets.blogger.key, function (blog, res5) {
var blog = blog.length > 100 ? JSON.parse(blog) : "";
res.send({
blog1Title: blog ? blog["items"][0]["title"] : "Can't connect to Blogger",
blog1Link: blog ? blog["items"][0]["url"] : "http://blog.freecodecamp.com",
blog2Title: blog ? blog["items"][1]["title"] : "Can't connect to Blogger",
blog2Link: blog ? blog["items"][1]["url"] : "http://blog.freecodecamp.com",
blog3Title: blog ? blog["items"][2]["title"] : "Can't connect to Blogger",
blog3Link: blog ? blog["items"][2]["url"] : "http://blog.freecodecamp.com",
blog4Title: blog ? blog["items"][3]["title"] : "Can't connect to Blogger",
blog4Link: blog ? blog["items"][3]["url"] : "http://blog.freecodecamp.com",
blog5Title: blog ? blog["items"][4]["title"] : "Can't connect to Blogger",
blog5Link: blog ? blog["items"][4]["url"] : "http://blog.freecodecamp.com"
});
});
},
about: function(req, res) { about: function(req, res) {
var date1 = new Date("10/15/2014"); var date1 = new Date("10/15/2014");
var date2 = new Date(); var date2 = new Date();
var timeDiff = Math.abs(date2.getTime() - date1.getTime()); var timeDiff = Math.abs(date2.getTime() - date1.getTime());
var daysRunning = Math.ceil(timeDiff / (1000 * 3600 * 24)); var daysRunning = Math.ceil(timeDiff / (1000 * 3600 * 24));
var githubHeaders = {headers: {'User-Agent': 'Mozilla/5.0 (Macintosh; Intel Mac OS X 10_8_2) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/29.0.1521.3 Safari/537.36'}, port:80 }; var announcements = resources.announcements;
client.get('https://trello.com/1/boards/BA3xVpz9/cards?key=' + secrets.trello.key, function(trello, res2) { User.count({'points': {'$gt': 2}}, function (err, c3) {
trello = trello ? (JSON.parse(trello)).length : "Can't connecto to Trello"; if (err) {
client.get('https://www.googleapis.com/blogger/v3/blogs/2421288658305323950/posts?key=' + secrets.blogger.key, function (blog, res5) { debug('User err: ', err);
var blog = blog.length > 100 ? JSON.parse(blog) : ""; next(err);
client.get('https://api.github.com/repos/freecodecamp/freecodecamp/pulls?client_id=' + secrets.github.clientID + '&client_secret=' + secrets.github.clientSecret, githubHeaders, function(pulls, res3) { }
pulls = Object.keys(JSON.parse(pulls)).length || "Can't connect to github"; User.count({'points': {'$gt': 9}}, function (err, c10) {
client.get('https://api.github.com/repos/freecodecamp/freecodecamp/issues?client_id=' + secrets.github.clientID + '&client_secret=' + secrets.github.clientSecret, githubHeaders, function(issues, res4) { if (err) {
issues = ((pulls === parseInt(pulls)) && issues) ? Object.keys(JSON.parse(issues)).length - pulls : "Can't connect to GitHub"; debug('User err: ', err);
var announcements = resources.announcements; next(err);
User.count({'points': {'$gt': 2}}, function (err, c3) { }
if (err) { User.count({'points': {'$gt': 53}}, function (err, all) {
debug('User err: ', err); if (err) {
next(err); debug('User err: ', err);
} next(err);
User.count({'points': {'$gt': 9}}, function (err, c10) { }
if (err) { res.render('resources/learn-to-code', {
debug('User err: ', err); title: 'About Free Code Camp and Our Team of Volunteers',
next(err); daysRunning: daysRunning,
} c3: c3,
User.count({'points': {'$gt': 53}}, function (err, all) { c10: c10,
if (err) { all: all,
debug('User err: ', err); announcements: announcements
next(err);
}
res.render('resources/learn-to-code', {
title: 'About Free Code Camp and Our Team of Volunteers',
daysRunning: daysRunning,
nonprofitProjects: trello,
pulls: pulls,
issues: issues,
c3: c3,
c10: c10,
all: all,
blog1Title: blog ? blog["items"][0]["title"] : "Can't connect to Blogger",
blog1Link: blog ? blog["items"][0]["url"] : "http://blog.freecodecamp.com",
blog2Title: blog ? blog["items"][1]["title"] : "Can't connect to Blogger",
blog2Link: blog ? blog["items"][1]["url"] : "http://blog.freecodecamp.com",
blog3Title: blog ? blog["items"][2]["title"] : "Can't connect to Blogger",
blog3Link: blog ? blog["items"][2]["url"] : "http://blog.freecodecamp.com",
blog4Title: blog ? blog["items"][3]["title"] : "Can't connect to Blogger",
blog4Link: blog ? blog["items"][3]["url"] : "http://blog.freecodecamp.com",
blog5Title: blog ? blog["items"][4]["title"] : "Can't connect to Blogger",
blog5Link: blog ? blog["items"][4]["url"] : "http://blog.freecodecamp.com",
announcements: announcements
});
});
});
});
}); });
}); });
}); });

View File

@ -1,45 +1,5 @@
[ [
{
"_id" : "bd7123d8c441eddfaeb5bdef",
"name": "Learn how Free Code Camp Works",
"difficulty": 9.99,
"description": [
"Watch this 90 second video, or simply read this summary:",
"Welcome to Free Code Camp. We're a community of busy people learning to code.",
"We built this community because learning to code is hard. But anyone who can stay motivated can learn to code. And the best way to stay motivated is to code with friends.",
"To maximize accessibility, all our challenges are self-paced, browser-based, and free.",
"All of us start with the same 100 hours of interactive coding challenges. These cover Computer Science and databases. They also cover in-demand JavaScript tools like jQuery, Node.js and MongoDB.",
"Once we have a basic understanding of web development, we'll spend another 900 hours putting that theory into practice. We'll build full stack solutions for nonprofits.",
"By the end of this process, we'll be good at coding. We'll have a portfolio of apps with happy users to prove it. We'll also have an alumni network of fellow coders and nonprofits ready to serve as references.",
"If you make it through Free Code Camp, you will be able to get a coding job. There are far more job openings out there than there are qualified coders to fill them.",
"Also, for every pure coding job, there are at least 5 additional jobs that require some coding skills. So even if you decide not to pursue coding as a career, you'll still walk away with a valuable job skill.",
"There are 3 keys to succeeding in our community: do the challenges, make friends, and find a routine.",
"Now it's time to join our chatroom. Click the \"Go to my next challenge\" button to move on to your next challenge."
],
"tests": [
""
],
"challengeSeed": [
"114486344"
],
"challengeType" : 2
},
{
"_id": "bd7123c8c441eddfaeb5bdef",
"name": "Meet Booleans",
"difficulty": "9.999",
"description": [
"Return true"
],
"tests": [
"expect(welcomeToBooleans()).to.be.a(\"boolean\");",
"expect(welcomeToBooleans()).to.be.true;"
],
"challengeSeed": [
"function welcomeToBooleans() {\n // Good luck!\n return false;\n}\n\nwelcomeToBooleans();"
],
"challengeType": 1
},
{ {
"_id" : "bd7123c8c441eddfaeb5bdef", "_id" : "bd7123c8c441eddfaeb5bdef",
"name": "Start our Challenges", "name": "Start our Challenges",
@ -1323,7 +1283,7 @@
}, },
{ {
"_id" : "bad87fee1348cd8acef08812", "_id" : "bae87fee1348cd8acef08812",
"name": "Color a Bootstrap Button with Button Primary", "name": "Color a Bootstrap Button with Button Primary",
"difficulty" : "0.38", "difficulty" : "0.38",
"description": [ "description": [
@ -1332,7 +1292,8 @@
"Note that these buttons still need the <code>btn</code> class." "Note that these buttons still need the <code>btn</code> class."
], ],
"tests": [ "tests": [
"expect($('.btn-block').length).to.eql(2);" "expect($('.btn-block').length).to.eql(2);",
"expect($('.btn-primary').length).to.eql(2);"
], ],
"challengeSeed": [ "challengeSeed": [
"<style>", "<style>",
@ -2617,5 +2578,46 @@
"<h1>hello world</h1>" "<h1>hello world</h1>"
], ],
"challengeType": 0 "challengeType": 0
},
{
"_id" : "bd7123d8c441eddfaeb5bdef",
"name": "Learn how Free Code Camp Works",
"difficulty": 9.99,
"description": [
"Watch this 90 second video, or simply read this summary:",
"Welcome to Free Code Camp. We're a community of busy people learning to code.",
"We built this community because learning to code is hard. But anyone who can stay motivated can learn to code. And the best way to stay motivated is to code with friends.",
"To maximize accessibility, all our challenges are self-paced, browser-based, and free.",
"All of us start with the same 100 hours of interactive coding challenges. These cover Computer Science and databases. They also cover in-demand JavaScript tools like jQuery, Node.js and MongoDB.",
"Once we have a basic understanding of web development, we'll spend another 900 hours putting that theory into practice. We'll build full stack solutions for nonprofits.",
"By the end of this process, we'll be good at coding. We'll have a portfolio of apps with happy users to prove it. We'll also have an alumni network of fellow coders and nonprofits ready to serve as references.",
"If you make it through Free Code Camp, you will be able to get a coding job. There are far more job openings out there than there are qualified coders to fill them.",
"Also, for every pure coding job, there are at least 5 additional jobs that require some coding skills. So even if you decide not to pursue coding as a career, you'll still walk away with a valuable job skill.",
"There are 3 keys to succeeding in our community: do the challenges, make friends, and find a routine.",
"Now it's time to join our chatroom. Click the \"Go to my next challenge\" button to move on to your next challenge."
],
"tests": [
""
],
"challengeSeed": [
"114486344"
],
"challengeType" : 2
},
{
"_id": "bd7123c8c441eddfaeb5bdef",
"name": "Meet Booleans",
"difficulty": "9.98",
"description": [
"Return true"
],
"tests": [
"expect(welcomeToBooleans()).to.be.a(\"boolean\");",
"expect(welcomeToBooleans()).to.be.true;"
],
"challengeSeed": [
"function welcomeToBooleans() {\n // Good luck!\n return false;\n}\n\nwelcomeToBooleans();"
],
"challengeType": 1
} }
] ]

View File

@ -1,10 +1,16 @@
h2 #blog
a(href=blog1Link)= blog1Title script.
h2 (function() {
a(href=blog2Link)= blog2Title $.ajax({
h2 url: 'http://localhost:3001/api/blogger',
a(href=blog3Link)= blog3Title type: 'GET'
h2 }).done(
a(href=blog4Link)= blog4Title function(data) {
h2 var props = Object.keys(data);
a(href=blog5Link)= blog5Title for (var i = 0; i < props.length; i+=2) {
var blogger = document.createElement('div');
$(blogger).html('<h2><a href=' + data[props[i+1]] + '>' + data[props[i]] + '</a></h2></div>').prependTo($('#blog'))
}
}
);
})();

View File

@ -1,36 +1,36 @@
h2.stats-text //h2.stats-text
.row // .row
.col-xs-6.text-right Days since we launched: // .col-xs-6.text-right Days since we launched:
.col-xs-6.text-left= daysRunning // .col-xs-6.text-left= daysRunning
.row // .row
.col-xs-6.text-right Nonprofit Projects: // .col-xs-6.text-right Nonprofit Projects:
.col-xs-6.text-left= nonprofitProjects // .col-xs-6.text-left= nonprofitProjects
| &nbsp // | &nbsp
a(href="https://trello.com/b/BA3xVpz9/nonprofit-projects") (view them) // a(href="https://trello.com/b/BA3xVpz9/nonprofit-projects") (view them)
.row // .row
.col-xs-6.text-right Open Issues: // .col-xs-6.text-right Open Issues:
.col-xs-6.text-left= issues // .col-xs-6.text-left= issues
| &nbsp // | &nbsp
a(href="https://github.com/freecodecamp/freecodecamp/issues") (create one) // a(href="https://github.com/freecodecamp/freecodecamp/issues") (create one)
.row // .row
.col-xs-6.text-right Pull Requests: // .col-xs-6.text-right Pull Requests:
.col-xs-6.text-left= pulls // .col-xs-6.text-left= pulls
| &nbsp // | &nbsp
a(href="https://github.com/freecodecamp/freecodecamp/pulls") (create one) // a(href="https://github.com/freecodecamp/freecodecamp/pulls") (create one)
.row // .row
.col-xs-6.text-right Campers with at least... // .col-xs-6.text-right Campers with at least...
.col-xs-4 // .col-xs-4
.row // .row
.col-xs-6.text-right 3 Points: // .col-xs-6.text-right 3 Points:
.col-xs-6.text-left= c3 // .col-xs-6.text-left= c3
.row // .row
.col-xs-6.text-right 10 Points: // .col-xs-6.text-right 10 Points:
.col-xs-6.text-left= c10 // .col-xs-6.text-left= c10
.row // .row
.col-xs-6.text-right All 54 Points: // .col-xs-6.text-right All 54 Points:
.col-xs-6.text-left= all // .col-xs-6.text-left= all
.row // .row
.col-xs-6.text-right Star our project here: // .col-xs-6.text-right Star our project here:
.col-xs-6.text-left.github-button-container // .col-xs-6.text-left.github-button-container
html. // html.
<iframe src="http://ghbtns.com/github-btn.html?user=freecodecamp&repo=freecodecamp&type=watch&count=true&size=large" height="30" width="170" frameborder="0" scrolling="0" style="width:170px; height: 30px;" allowTransparency="true"></iframe> // <iframe src="http://ghbtns.com/github-btn.html?user=freecodecamp&repo=freecodecamp&type=watch&count=true&size=large" height="30" width="170" frameborder="0" scrolling="0" style="width:170px; height: 30px;" allowTransparency="true"></iframe>