From ab83f6d5fa6ec2ea143b807b8ecb40fbe7c889d0 Mon Sep 17 00:00:00 2001
From: Arsen Melikyan <bugron@mail.ru>
Date: Sat, 31 Oct 2015 17:24:05 +0400
Subject: [PATCH] adds back button for step challenges

---
 client/commonFramework.js              | 48 +++++++++++++++++++++++++-
 server/views/coursewares/showStep.jade |  4 +++
 2 files changed, 51 insertions(+), 1 deletion(-)

diff --git a/client/commonFramework.js b/client/commonFramework.js
index 2505fe08f4..39a40923b9 100644
--- a/client/commonFramework.js
+++ b/client/commonFramework.js
@@ -892,12 +892,32 @@ var runTests = function(err, data) {
 // step challenge
 common.init.push((function() {
   var stepClass = '.challenge-step';
+  var prevBtnClass = '.challenge-step-btn-prev';
   var nextBtnClass = '.challenge-step-btn-next';
   var actionBtnClass = '.challenge-step-btn-action';
   var finishBtnClass = '.challenge-step-btn-finish';
   var submitBtnId = '#challenge-step-btn-submit';
   var submitModalId = '#challenge-step-modal';
 
+  function getPreviousStep($challengeSteps) {
+    var length = $challengeSteps.length;
+    var $prevStep = false;
+    var prevStepIndex = 0;
+    $challengeSteps.each(function(index) {
+      var $step = $(this);
+      if (
+        !$step.hasClass('hidden') &&
+        index + 1 !== length
+      ) {
+        prevStepIndex = index - 1;
+      }
+    });
+
+    $prevStep = $challengeSteps[prevStepIndex];
+
+    return $prevStep;
+  }
+
   function getNextStep($challengeSteps) {
     var length = $challengeSteps.length;
     var $nextStep = false;
@@ -917,11 +937,36 @@ common.init.push((function() {
     return $nextStep;
   }
 
+  function handlePrevStepClick(e) {
+    e.preventDefault();
+    var prevStep = getPreviousStep($(stepClass));
+    $(this)
+      .parent()
+      .removeClass('fadeOutLeft')
+      .addClass('animated fadeOutRight fast-animation')
+      .delay(250)
+      .queue(function(prev) {
+        $(this).addClass('hidden');
+        if (prevStep) {
+          $(prevStep)
+            .removeClass('hidden')
+            .removeClass('slideInRight')
+            .addClass('animated slideInLeft fast-animation')
+            .delay(500)
+            .queue(function(prev) {
+              prev();
+            });
+        }
+        prev();
+      });
+  }
+
   function handleNextStepClick(e) {
     e.preventDefault();
     var nextStep = getNextStep($(stepClass));
     $(this)
       .parent()
+      .removeClass('fadeOutRight')
       .addClass('animated fadeOutLeft fast-animation')
       .delay(250)
       .queue(function(next) {
@@ -929,10 +974,10 @@ common.init.push((function() {
         if (nextStep) {
           $(nextStep)
             .removeClass('hidden')
+            .removeClass('slideInLeft')
             .addClass('animated slideInRight fast-animation')
             .delay(500)
             .queue(function(next) {
-              $(this).removeClass('slideInRight');
               next();
             });
         }
@@ -1035,6 +1080,7 @@ common.init.push((function() {
   }
 
   return function($) {
+    $(prevBtnClass).click(handlePrevStepClick);
     $(nextBtnClass).click(handleNextStepClick);
     $(actionBtnClass).click(handleActionClick);
     $(finishBtnClass).click(handleFinishClick);
diff --git a/server/views/coursewares/showStep.jade b/server/views/coursewares/showStep.jade
index 74bb6705f5..16e4777c54 100644
--- a/server/views/coursewares/showStep.jade
+++ b/server/views/coursewares/showStep.jade
@@ -10,8 +10,12 @@ block content
                             p.large-p!= step[2]
                         if step[3]
                             a.btn.btn-block.btn-primary.challenge-step-btn-action(id='#{index}' href='#{step[3]}' target='_blank') Open link in new tab
+                            .button-spacer
                         if index + 1 === description.length
                             .btn.btn-block.btn-primary.challenge-step-btn-finish(id='last' class=step[3] ? 'disabled' : '') Finish challenge
+                        else if index !== 0
+                            .col-xs-12.col-md-6.col-lg-6.btn.btn-danger.challenge-step-btn-prev(id='#{index - 1}' class=step[3] ? 'disabled' : '') Go to my previous step
+                            .col-xs-12.col-md-6.col-lg-6.btn.btn-primary.challenge-step-btn-next(id='#{index}' class=step[3] ? 'disabled' : '') Go to my next step
                         else
                             .btn.btn-block.btn-primary.challenge-step-btn-next(id='#{index}' class=step[3] ? 'disabled' : '') Go to my next step
     #challenge-step-modal.modal(tabindex='-1')