apply Nathan's insights into multistep form'

This commit is contained in:
Michael Q Larson
2015-03-27 12:36:21 -07:00
parent c69d919d46
commit 94b6cae3ec
9 changed files with 88 additions and 65 deletions

1
app.js
View File

@ -281,7 +281,6 @@ app.get('/nonprofits/are-there-people-that-are-already-benefiting-from-your-serv
app.get('/nonprofits/in-exchange-we-ask', nonprofitController.inExchangeWeAsk);
app.get('/nonprofits/ok-with-javascript', nonprofitController.okWithJavaScript);
app.get('/nonprofits/how-can-free-code-camp-help-you', nonprofitController.howCanFreeCodeCampHelpYou);
app.post('/nonprofits/how-can-free-code-camp-help-you', nonprofitController.howCanFreeCodeCampHelpYouPost);
app.get('/nonprofits/what-does-your-nonprofit-do', nonprofitController.whatDoesYourNonprofitDo);
app.get('/nonprofits/link-us-to-your-website', nonprofitController.linkUsToYourWebsite);
app.get('/nonprofits/tell-us-your-name', nonprofitController.tellUsYourName);

View File

@ -55,30 +55,14 @@ exports.howCanFreeCodeCampHelpYou = function(req, res) {
});
};
exports.howCanFreeCodeCampHelpYouPost = function(req, res) {
var queryString = '';
if (req.body.websites) { queryString += 'websites&'}
if (req.body.websites) { queryString += 'websites&'}
if (req.body.websites) { queryString += 'websites&'}
if (req.body.websites) { queryString += 'websites&'}
if (req.body.websites) { queryString += 'websites&'}
if (req.body.websites) { queryString += 'websites&'}
if (req.body.websites) { queryString += 'websites&'}
if (req.body.websites) { queryString += 'websites&'}
res.redirect('/nonprofits/tell-us-your-name?' + encodeURIComponent(queryString));
};
exports.whatDoesYourNonprofitDo = function(req, res) {
res.render('nonprofits/what-does-your-nonprofit-do', {
existingParams: req.params,
title: 'What does your nonprofit do?',
step: 6
});
};
exports.whatDoesYourNonprofitDoPost = function(req, res) {
res.redirect('nonprofits/link-us-to-your-website?' + req.params);
};
exports.linkUsToYourWebsite = function(req, res) {
res.render('nonprofits/link-us-to-your-website', {
title: 'Link us to your website',
@ -86,10 +70,6 @@ exports.linkUsToYourWebsite = function(req, res) {
});
};
exports.linkUsToYourWebsitePost = function(req, res) {
res.redirect('nonprofits/tell-us-your-email?' + req.params);
};
exports.tellUsYourEmail = function(req, res) {
res.render('nonprofits/tell-us-your-email', {
title: 'Tell us your name',
@ -97,10 +77,6 @@ exports.tellUsYourEmail = function(req, res) {
});
};
exports.tellUsYourEmailPost = function(req, res) {
res.redirect('nonprofits/tell-us-your-name?' + req.params);
};
exports.tellUsYourName = function(req, res) {
res.render('nonprofits/tell-us-your-name', {
title: 'Tell us your name',
@ -108,9 +84,9 @@ exports.tellUsYourName = function(req, res) {
});
};
exports.tellUsYourNamePost = function(req, res) {
};
exports.finishApplication = function(req, res) {
};
exports.yourNonprofitProjectApplicationHasBeenSubmitted = function(req, res) {
res.render('nonprofits/your-nonprofit-project-application-has-been-submitted', {

View File

@ -4,31 +4,30 @@ block content
h1.hug-top Nonprofit Sign Up
include ../partials/nonprofit-application-progress-bar
h2 How can Free Code Camp help you?
form.text-left.form-inline(role='form', method='POST', action="/nonprofits/how-can-free-code-camp-help-you/")
input(type='hidden', name='_csrf', value=_csrf)
.text-left.form-inline
h3.col-xs-12.col-sm-offset-5.checkbox-table
.col-xs-12
input.checkbox(type='checkbox', name='websites')
input.checkbox(type='checkbox', id='websites')
label.ion-android-globe   Websites
.col-xs-12
input.checkbox(type='checkbox', name='donation-systems')
input.checkbox(type='checkbox', id='donationSystems')
label.ion-card   Donation Systems
.col-xs-12
input.checkbox(type='checkbox', name='volunteer-systems')
input.checkbox(type='checkbox', id='volunteerSystems')
label.ion-android-calendar   Volunteer Systems
.col-xs-12
input.checkbox(type='checkbox', name='inventory-systems')
input.checkbox(type='checkbox', id='inventorySystems')
label.ion-ios-box   Inventory Systems
.col-xs-12
input.checkbox(type='checkbox', name='e-learning-platforms')
input.checkbox(type='checkbox', id='eLearningPlatforms')
label.ion-university   E-learning Platforms
.col-xs-12
input.checkbox(type='checkbox', name='web-forms')
input.checkbox(type='checkbox', id='webForms')
label.ion-ios-list   Web Forms
.col-xs-12
input.checkbox(type='checkbox', name='community-tools')
input.checkbox(type='checkbox', id='communityTools')
label.ion-ios-people   Community Tools
.col-xs-12
input.checkbox(type='checkbox', name='other-tools')
input.checkbox(type='checkbox', id='otherTools')
label.ion-settings   Other tools
button.btn.btn-primary.btn-big.btn-block(type='submit') I've selected all that apply and am ready to move on
button#next-step.btn.btn-primary.btn-big.btn-block(type='submit') I've selected all that apply and am ready to move on

View File

@ -1,10 +1,14 @@
.jumbotron.text-center
h1.hug-top Nonprofit Sign Up
include ../partials/nonprofit-application-progress-bar
h2 In 140 characters or less, what does your nonprofit do? For whom?
.spacer
.formgroup
.input-group
input.form-control.big-text-field.field-responsive(type='text', maxlength='140', autofocus='')
span.input-group-btn
button.btn.btn-big.btn-primary.btn-responsive(href='/nonprofits/tell-us-your-name') Submit
extends ../layout
block content
.jumbotron.text-center
h1.hug-top Nonprofit Sign Up
include ../partials/nonprofit-application-progress-bar
h2 Link us to the website, blog, or social media page that best represents your organization.
.spacer
form(role='form', method='GET', action="/nonprofits/tell-us-your-email/?" + existingParams)
input(type='hidden', name='_csrf', value=_csrf)
.formgroup
.input-group
input.form-control.big-text-field.field-responsive(type='text', name='link', autocomplete='off', maxlength='500', autofocus='')
span.input-group-btn
button.btn.btn-big.btn-primary.btn-responsive Submit

View File

@ -5,8 +5,10 @@ block content
include ../partials/nonprofit-application-progress-bar
h2 Please tell us your email
.spacer
.formgroup
.input-group
input.form-control.big-text-field.field-responsive(type='text', maxlength='140', autofocus='')
span.input-group-btn
button.btn.btn-big.btn-primary.btn-responsive(href='/nonprofits/your-nonprofit-project-application-has-been-submitted') Submit
form(role='form', method='GET', novalidate='novalidate', name='nonprofitForm', action="/nonprofits/tell-us-your-name/")
input(type='hidden', name='_csrf', value=_csrf)
.formgroup
.input-group
input.form-control.big-text-field.field-responsive(type='text', name='email', autocomplete='off', maxlength='500', autofocus='')
span.input-group-btn
button.btn.btn-big.btn-primary.btn-responsive Submit

View File

@ -5,9 +5,9 @@ block content
include ../partials/nonprofit-application-progress-bar
h2 Please tell us your name
.spacer
form(role='form', action="/nonprofits/tell-us-your-name-post", method='POST', novalidate='novalidate', name='nonprofitForm')
form(role='form', method='POST', novalidate='novalidate', name='nonprofitForm', action="/nonprofits/finish-application/")
.formgroup
.input-group
input.form-control.big-text-field.field-responsive(type='text', maxlength='140', autofocus='')
input.form-control.big-text-field.field-responsive(type='text', name='name', autocomplete='off', maxlength='140', autofocus='')
span.input-group-btn
button.btn.btn-big.btn-primary.btn-responsive Submit

View File

@ -5,13 +5,15 @@ block content
include ../partials/nonprofit-application-progress-bar
h2 In 140 characters or less, what does your nonprofit do? For whom?
.spacer
.formgroup
.input-group
input.form-control.big-text-field.field-responsive#what-does-the-nonprofit-do(type='text', maxlength='140', autofocus='')
span.input-group-btn
button.btn.btn-big.btn-primary.btn-responsive(href='/nonprofits/link-us-to-your-website') Submit
.text-left
span#what-does-the-nonprofit-do-feedback
form(role='form', method='GET', action="/nonprofits/link-us-to-your-website/")
input(type='hidden', name='_csrf', value=_csrf)
.formgroup
.input-group
input.form-control.big-text-field.field-responsive#what-does-the-nonprofit-do(type='text', maxlength='140', autofocus='', autocomplete='off', name='mission')
span.input-group-btn
button.btn.btn-big.btn-primary.btn-responsive(href='/nonprofits/link-us-to-your-website') Submit
.text-left
span#what-does-the-nonprofit-do-feedback
script.
var text_max = 140;

View File

@ -4,3 +4,36 @@
span.sr-only= step * 10
| % Complete
h3.gray-text.text-center Step #{step} of 9
script.
$('#story-url').on('keypress', function (e) {
if (e.which === 13 || e === 13) {
$('#preliminary-story-submit').click();
}
});
var preliminaryStorySubmit = function preliminaryStorySubmit() {
var storyURL = $('#story-url').val();
$('#preliminary-story-submit').attr('disabled', 'disabled');
$.post('/stories/preliminary',
{
data: {
url: storyURL
}
})
.fail(function (xhr, textStatus, errorThrown) {
$('#preliminary-story-submit').attr('disabled', false);
})
.done(function (data, textStatus, xhr) {
if (data.alreadyPosted) {
window.location = data.storyURL;
} else {
window.location = '/stories/submit/new-story?url=' +
encodeURIComponent(data.storyURL) +
'&title=' + encodeURIComponent(data.storyTitle) +
'&image=' + encodeURIComponent(data.storyImage) +
'&description=' + encodeURIComponent(data.storyMetaDescription);
}
});
}
$('#preliminary-story-submit').on('click', preliminaryStorySubmit);

View File

@ -45,3 +45,11 @@
});
}
$('#preliminary-story-submit').on('click', preliminaryStorySubmit);
arr = $( "h3 input:checked" )
.map(function() {
return this.id;
})
.get()
.join('&');