Step Builder: Allow re-adding children after removing them and (un)lock unit navigation when appropriate

problem_builder/public/js/mentoring_with_steps.js

@@ -178,6 +178,11 @@ function MentoringWithStepsBlock(runtime, element) {
     function updateDisplay() {
         cleanAll();
         if (atReviewStep()) {
+            // Tell supporting runtimes to enable navigation between units;
+            // user is currently not in the middle of an attempt
+            // so it makes sense for them to be able to leave the current unit by clicking arrow buttons
+            notify('navigation', {state: 'unlock'});
+
             showReviewStep();
             showAttempts();
         } else {
@@ -324,6 +329,11 @@ function MentoringWithStepsBlock(runtime, element) {
     }
 
     function showGrade() {
+        // Tell supporting runtimes to enable navigation between units;
+        // user is currently not in the middle of an attempt
+        // so it makes sense for them to be able to leave the current unit by clicking arrow buttons
+        notify('navigation', {state: 'unlock'});
+
         cleanAll();
         showReviewStep();
         showAttempts();
@@ -343,6 +353,11 @@ function MentoringWithStepsBlock(runtime, element) {
     }
 
     function handleTryAgain(result) {
+        // Tell supporting runtimes to disable navigation between units;
+        // this keeps users from accidentally clicking arrow buttons
+        // and interrupting their experience with the current unit
+        notify('navigation', {state: 'lock'});
+
         activeStep = result.active_step;
         clearSelections();
         updateDisplay();
@@ -364,6 +379,13 @@ function MentoringWithStepsBlock(runtime, element) {
         submitXHR = $.post(handlerUrl, JSON.stringify({})).success(handleTryAgain);
     }
 
+    function notify(name, data){
+        // Notification interface does not exist in the workbench.
+        if (runtime.notify) {
+            runtime.notify(name, data);
+        }
+    }
+
     function initClickHandlers() {
         $(document).on("click", function(event, ui) {
             var target = $(event.target);
@@ -382,6 +404,11 @@ function MentoringWithStepsBlock(runtime, element) {
     }
 
     function initXBlockView() {
+        // Tell supporting runtimes to disable navigation between units;
+        // this keeps users from accidentally clicking arrow buttons
+        // and interrupting their experience with the current unit
+        notify('navigation', {state: 'lock'});
+
         // Hide steps until we're ready
         hideAllSteps();
 

problem_builder/public/js/mentoring_with_steps_edit.js

@@ -1,6 +1,8 @@
 function MentoringWithStepsEdit(runtime, element) {
     "use strict";
 
+    var $buttons = $('.add-xblock-component-button[data-category=sb-review-step]', element);
+
     var blockIsPresent = function(klass) {
         return $('.xblock ' + klass).length > 0;
     };
@@ -18,16 +20,26 @@ function MentoringWithStepsEdit(runtime, element) {
         }
     };
 
-    var initButtons = function(dataCategory) {
-        var $buttons = $('.add-xblock-component-button[data-category='+dataCategory+']', element);
-        $buttons.each(function() {
-            updateButton($(this), blockIsPresent('.xblock-header-sb-review-step'));
+    var updateButtons = function(buttons) {
+        buttons.each(function() {
+            var button = $(this);
+            updateButton(button, blockIsPresent('.xblock-header-sb-review-step'));
         });
+    };
+
+    var initButtons = function() {
+        updateButtons($buttons);
         $buttons.on('click', disableButton);
     };
 
-    initButtons('sb-review-step');
+    var resetButtons = function() {
+        var $disabledButtons = $buttons.filter('.disabled');
+        updateButtons($disabledButtons);
+    };
 
     ProblemBuilderUtil.transformClarifications(element);
-    StudioEditableXBlockMixin(runtime, element);
+
+    initButtons();
+    runtime.listenTo('deleted-child', resetButtons);
+
 }

problem_builder/public/js/review_step_edit.js

@@ -1,6 +1,8 @@
 function ReviewStepEdit(runtime, element) {
     "use strict";
 
+    var $buttons = $('.add-xblock-component-button[data-category=pb-message]', element);
+
     var blockIsPresent = function(klass) {
         return $('.xblock ' + klass).length > 0;
     };
@@ -18,17 +20,27 @@ function ReviewStepEdit(runtime, element) {
         }
     };
 
-    var initButtons = function(dataCategory) {
-        var $buttons = $('.add-xblock-component-button[data-category='+dataCategory+']', element);
-        $buttons.each(function() {
-            var msg_type = $(this).data('boilerplate');
-            updateButton($(this), blockIsPresent('.submission-message.'+msg_type));
+    var updateButtons = function(buttons) {
+        buttons.each(function() {
+            var button = $(this);
+            var msgType = button.data('boilerplate');
+            updateButton(button, blockIsPresent('.submission-message.'+msgType));
         });
+    };
+
+    var initButtons = function() {
+        updateButtons($buttons);
         $buttons.on('click', disableButton);
     };
 
-    initButtons('pb-message');
+    var resetButtons = function() {
+        var $disabledButtons = $buttons.filter('.disabled');
+        updateButtons($disabledButtons);
+    };
 
     ProblemBuilderUtil.transformClarifications(element);
-    StudioEditableXBlockMixin(runtime, element);
+
+    initButtons();
+    runtime.listenTo('deleted-child', resetButtons);
+
 }