Merge pull request #4467 from FreeCodeCamp/feature/step-challenge-prev-button

Step Challenge - Prev from end, x/y step display
This commit is contained in:
Logan Tegman
2015-11-17 09:16:10 -08:00
2 changed files with 20 additions and 15 deletions

View File

@ -1179,14 +1179,12 @@ common.init.push((function() {
var submitModalId = '#challenge-step-modal'; var submitModalId = '#challenge-step-modal';
function getPreviousStep($challengeSteps) { function getPreviousStep($challengeSteps) {
var length = $challengeSteps.length;
var $prevStep = false; var $prevStep = false;
var prevStepIndex = 0; var prevStepIndex = 0;
$challengeSteps.each(function(index) { $challengeSteps.each(function(index) {
var $step = $(this); var $step = $(this);
if ( if (
!$step.hasClass('hidden') && !$step.hasClass('hidden')
index + 1 !== length
) { ) {
prevStepIndex = index - 1; prevStepIndex = index - 1;
} }
@ -1220,7 +1218,7 @@ common.init.push((function() {
e.preventDefault(); e.preventDefault();
var prevStep = getPreviousStep($(stepClass)); var prevStep = getPreviousStep($(stepClass));
$(this) $(this)
.parent() .parent().parent()
.removeClass('fadeOutLeft') .removeClass('fadeOutLeft')
.addClass('animated fadeOutRight fast-animation') .addClass('animated fadeOutRight fast-animation')
.delay(250) .delay(250)
@ -1244,7 +1242,7 @@ common.init.push((function() {
e.preventDefault(); e.preventDefault();
var nextStep = getNextStep($(stepClass)); var nextStep = getNextStep($(stepClass));
$(this) $(this)
.parent() .parent().parent()
.removeClass('fadeOutRight') .removeClass('fadeOutRight')
.addClass('animated fadeOutLeft fast-animation') .addClass('animated fadeOutLeft fast-animation')
.delay(250) .delay(250)

View File

@ -8,16 +8,23 @@ block content
img.gif-block.img-center.img-responsive.thumbnail(src='#{step[0]}' alt='#{step[1]}') img.gif-block.img-center.img-responsive.thumbnail(src='#{step[0]}' alt='#{step[1]}')
.caption .caption
p.large-p!= step[2] p.large-p!= step[2]
if step[3] .challenge-button-block
a.btn.btn-block.btn-primary.challenge-step-btn-action(id='#{index}' href='#{step[3]}' target='_blank') Open link in new tab if step[3]
.button-spacer a.btn.btn-block.btn-primary.challenge-step-btn-action(id='#{index}' href='#{step[3]}' target='_blank') Open link in new tab
if index + 1 === description.length .button-spacer
.btn.btn-block.btn-primary.challenge-step-btn-finish(id='last' class=step[3] ? 'disabled' : '') Finish challenge if index + 1 === description.length
else if index !== 0 .btn.btn-warning.col-sm-5.col-xs-12.challenge-step-btn-prev(id='#{index - 1}') Go to my previous step
.btn.btn-block.btn-primary.challenge-step-btn-next(id='#{index}' class=step[3] ? 'disabled' : '') Go to my next step .challenge-step-counter.large-p.col-sm-2.col.xs-12.text-center (#{index + 1} / #{description.length})
.btn.btn-block.btn-warning-ghost.challenge-step-btn-prev(id='#{index - 1}') Go to my previous step .btn.btn-primary.col-sm-5.col-xs-12.challenge-step-btn-finish(id='last' class=step[3] ? 'disabled' : '') Finish challenge
else else if index !== 0
.btn.btn-block.btn-primary.challenge-step-btn-next(id='#{index}' class=step[3] ? 'disabled' : '') Go to my next step .btn.btn-warning.col-sm-5.col-xs-12.challenge-step-btn-prev(id='#{index - 1}') Go to my previous step
.challenge-step-counter.large-p.col-sm-2.col.xs-12.text-center (#{index + 1} / #{description.length})
.btn.btn-primary.col-sm-5.col-xs-12.challenge-step-btn-next(id='#{index}' class=step[3] ? 'disabled' : '') Go to my next step
else
.col-sm-5.hidden-xs  
.challenge-step-counter.large-p.col-sm-2.col-xs-6.text-center (#{index + 1} / #{description.length})
.btn.btn-primary.col-sm-5.col-xs-6.challenge-step-btn-next(id='#{index}' class=step[3] ? 'disabled' : '') Go to my next step
.clearfix
#challenge-step-modal.modal(tabindex='-1') #challenge-step-modal.modal(tabindex='-1')
.modal-dialog.animated.fadeIn.fast-animation .modal-dialog.animated.fadeIn.fast-animation
.modal-content .modal-content