Address review comments.

problem_builder/mentoring.py

@@ -835,7 +835,7 @@ class MentoringWithExplicitStepsBlock(BaseMentoringBlock, StudioContainerWithNes
     )
 
     # User state
-    step = Integer(
+    active_step = Integer(
         # Keep track of the student progress.
         default=0,
         scope=Scope.user_state,
@@ -862,22 +862,23 @@ class MentoringWithExplicitStepsBlock(BaseMentoringBlock, StudioContainerWithNes
 
     def student_view(self, context):
         fragment = Fragment()
-        child_content = u""
+        children_contents = []
 
         for child_id in self.children:
             child = self.runtime.get_block(child_id)
             if child is None:  # child should not be None but it can happen due to bugs or permission issues
-                child_content += u"<p>[{}]</p>".format(self._(u"Error: Unable to load child component."))
+                child_content = u"<p>[{}]</p>".format(self._(u"Error: Unable to load child component."))
             elif not isinstance(child, MentoringMessageBlock):
                 child_fragment = self._render_child_fragment(child, context, view='mentoring_view')
                 fragment.add_frag_resources(child_fragment)
-                child_content += child_fragment.content
+                child_content = child_fragment.content
+            children_contents.append(child_content)
 
         fragment.add_content(loader.render_template('templates/html/mentoring_with_steps.html', {
             'self': self,
             'title': self.display_name,
             'show_title': self.show_title,
-            'child_content': child_content,
+            'children_contents': children_contents,
         }))
         fragment.add_css_url(self.runtime.local_resource_url(self, 'public/css/problem-builder.css'))
         fragment.add_javascript_url(self.runtime.local_resource_url(self, 'public/js/mentoring_with_steps.js'))
@@ -909,16 +910,16 @@ class MentoringWithExplicitStepsBlock(BaseMentoringBlock, StudioContainerWithNes
         ]
 
     @XBlock.json_handler
-    def update_step(self, step, suffix=''):
-        if step < len(self.steps):
-            self.step = step
+    def update_active_step(self, new_value, suffix=''):
+        if new_value < len(self.steps):
+            self.active_step = new_value
         return {
-            'step': self.step
+            'active_step': self.active_step
         }
 
     @XBlock.json_handler
     def try_again(self, data, suffix=''):
-        self.step = 0
+        self.active_step = 0
 
         step_blocks = [self.runtime.get_block(child_id) for child_id in self.steps]
 
@@ -926,7 +927,7 @@ class MentoringWithExplicitStepsBlock(BaseMentoringBlock, StudioContainerWithNes
             step.reset()
 
         return {
-            'result': 'success'
+            'active_step': self.active_step
         }
 
     def author_edit_view(self, context):

problem_builder/public/js/mentoring_with_steps.js

@@ -3,24 +3,24 @@ function MentoringWithStepsBlock(runtime, element) {
     var steps = runtime.children(element).filter(
         function(c) { return c.element.className.indexOf('pb-mentoring-step') > -1; }
     );
-    var step = $('.mentoring', element).data('step');
-    var active_child, checkmark, submitDOM, nextDOM, tryAgainDOM, submitXHR;
+    var activeStep = $('.mentoring', element).data('active-step');
+    var checkmark, submitDOM, nextDOM, tryAgainDOM, submitXHR;
 
-    function isLastChild() {
-        return (active_child === steps.length-1);
+    function isLastStep() {
+        return (activeStep === steps.length-1);
     }
 
-    function updateStep() {
-        var handlerUrl = runtime.handlerUrl(element, 'update_step');
-        $.post(handlerUrl, JSON.stringify(step+1))
+    function updateActiveStep(newValue) {
+        var handlerUrl = runtime.handlerUrl(element, 'update_active_step');
+        $.post(handlerUrl, JSON.stringify(newValue))
             .success(function(response) {
-                step = response.step;
+                activeStep = response.active_step;
             });
     }
 
     function handleResults(response) {
-        // Update step so next step is shown on page reload (even if user does not click "Next Step")
-        updateStep();
+        // Update active step so next step is shown on page reload (even if user does not click "Next Step")
+        updateActiveStep(activeStep+1);
 
         // Update UI
         if (response.completed === 'correct') {
@@ -36,16 +36,16 @@ function MentoringWithStepsBlock(runtime, element) {
         nextDOM.removeAttr("disabled");
         if (nextDOM.is(':visible')) { nextDOM.focus(); }
 
-        if (isLastChild()) {
+        if (isLastStep()) {
             tryAgainDOM.removeAttr('disabled');
             tryAgainDOM.show();
         }
     }
 
     function submit() {
-        // We do not handle submissions at this level, so just forward to "submit" method of current step
-        var child = steps[active_child];
-        child['submit'](handleResults);
+        // We do not handle submissions at this level, so just forward to "submit" method of active step
+        var step = steps[activeStep];
+        step.submit(handleResults);
     }
 
     function hideAllSteps() {
@@ -61,23 +61,21 @@ function MentoringWithStepsBlock(runtime, element) {
         hideAllSteps();
     }
 
-    function displayNextChild() {
+    function updateDisplay() {
         cleanAll();
-        findNextChild();
+        showActiveStep();
         nextDOM.attr('disabled', 'disabled');
         validateXBlock();
     }
 
-    function findNextChild() {
-        // find the next real child block to display. HTMLBlock are always displayed
-        ++active_child;
-        var child = steps[active_child];
-        $(child.element).show();
+    function showActiveStep() {
+        var step = steps[activeStep];
+        $(step.element).show();
     }
 
     function onChange() {
         // We do not allow users to modify answers belonging to a step after submitting them:
-        // Once an answer has been submitted (next button is enabled),
+        // Once an answer has been submitted ("Next Step" button is enabled),
         // start ignoring changes to the answer.
         if (nextDOM.attr('disabled')) {
             validateXBlock();
@@ -85,17 +83,17 @@ function MentoringWithStepsBlock(runtime, element) {
     }
 
     function validateXBlock() {
-        var is_valid = true;
-        var child = steps[active_child];
-        if (child) {
-            is_valid = child['validate']();
+        var isValid = true;
+        var step = steps[activeStep];
+        if (step) {
+            isValid = step.validate();
         }
-        if (!is_valid) {
+        if (!isValid) {
             submitDOM.attr('disabled', 'disabled');
         } else {
             submitDOM.removeAttr('disabled');
         }
-        if (isLastChild()) {
+        if (isLastStep()) {
             nextDOM.hide();
         }
     }
@@ -103,19 +101,16 @@ function MentoringWithStepsBlock(runtime, element) {
     function initSteps(options) {
         for (var i=0; i < steps.length; i++) {
             var step = steps[i];
-            step['initChildren'](options);
+            step.initChildren(options);
         }
     }
 
     function handleTryAgain(result) {
-        if (result.result !== 'success')
-            return;
-
-        active_child = -1;
-        displayNextChild();
+        activeStep = result.active_step;
+        updateDisplay();
         tryAgainDOM.hide();
         submitDOM.show();
-        if (! isLastChild()) {
+        if (! isLastStep()) {
             nextDOM.show();
         }
     }
@@ -132,24 +127,22 @@ function MentoringWithStepsBlock(runtime, element) {
         checkmark = $('.assessment-checkmark', element);
 
         submitDOM = $(element).find('.submit .input-main');
-        submitDOM.bind('click', submit);
+        submitDOM.on('click', submit);
         submitDOM.show();
 
         nextDOM = $(element).find('.submit .input-next');
-        nextDOM.bind('click', displayNextChild);
+        nextDOM.on('click', updateDisplay);
         nextDOM.show();
 
         tryAgainDOM = $(element).find('.submit .input-try-again');
-        tryAgainDOM.bind('click', tryAgain);
+        tryAgainDOM.on('click', tryAgain);
 
         var options = {
             onChange: onChange
         };
         initSteps(options);
 
-        active_child = step;
-        active_child -= 1;
-        displayNextChild();
+        updateDisplay();
     }
 
     initXBlockView();

problem_builder/step.py

@@ -58,6 +58,12 @@ def _normalize_id(key):
     return key
 
 
+class Correctness(object):
+    CORRECT = 'correct'
+    PARTIAL = 'partial'
+    INCORRECT = 'incorrect'
+
+
 class HtmlBlockShim(object):
     CATEGORY = 'html'
     STUDIO_LABEL = _(u"HTML")
@@ -127,18 +133,17 @@ class MentoringStepBlock(
                 child.save()
 
         # Update results stored for this step
-        while self.student_results:
-            self.student_results.pop()
+        self.reset()
         for result in submit_results:
             self.student_results.append(result)
 
         # Compute "answer status" for this step
         if all(result[1]['status'] == 'correct' for result in submit_results):
-            completed = 'correct'
+            completed = Correctness.CORRECT
         elif all(result[1]['status'] == 'incorrect' for result in submit_results):
-            completed = 'incorrect'
+            completed = Correctness.INCORRECT
         else:
-            completed = 'partial'
+            completed = Correctness.PARTIAL
 
         return {
             'message': 'Success!',

problem_builder/templates/html/mentoring_with_steps.html

 {% load i18n %}
-<div class="mentoring themed-xblock" data-step="{{ self.step }}">
+<div class="mentoring themed-xblock" data-active-step="{{ self.active_step }}">
 
   {% if show_title and title %}
   <div class="title">
@@ -8,7 +8,11 @@
   {% endif %}
 
   <div class="assessment-question-block">
-    {{child_content|safe}}
+
+    {% for child_content in children_contents %}
+      {{ child_content|safe }}
+    {% endfor %}
+
     <div class="submit">
       <span class="assessment-checkmark fa icon-2x"></span>
       <input type="button" class="input-main" value="Submit" disabled="disabled" />