Merge pull request #680 from edx/usman/tnl708-multiple-prompts-fixes

Disable adding/removing prompts after release.

openassessment/templates/openassessmentblock/edit/oa_edit.html

 {% load i18n %}
 {% load tz %}
 {% spaceless %}
-<div id="openassessment-editor" class="editor-with-buttons editor-with-tabs">
+<div
+    id="openassessment-editor"
+    class="editor-with-buttons editor-with-tabs"
+    data-is-released="{{ is_released|lower }}"
+>
     <div class="openassessment_editor_content_and_tabs">
 
         <div id="openassessment_editor_header">

openassessment/xblock/static/js/spec/studio/oa_edit_prompt.js

@@ -24,7 +24,7 @@ describe("OpenAssessment.EditPromptViews", function() {
         loadFixtures('oa_edit.html');
 
         // Create the view
-        var element = $("#oa_prompt_editor_wrapper").get(0);
+        var element = $("#oa_prompts_editor_wrapper").get(0);
         notifier = new StubNotifier();
         view = new OpenAssessment.EditPromptsView(element, notifier);
     });
@@ -59,5 +59,49 @@ describe("OpenAssessment.EditPromptViews", function() {
             description: ""
         });
     });
+});
+
+describe("OpenAssessment.EditPromptViews after release", function() {
+
+    // Use a stub notifier implementation that simply stores
+    // the notifications it receives.
+    var notifier = null;
+    var StubNotifier = function() {
+        this.notifications = [];
+        this.notificationFired = function(name, data) {
+            this.notifications.push({
+                name: name,
+                data: data
+            });
+        };
+    };
+
+    var view = null;
 
+    beforeEach(function() {
+        // Load the DOM fixture
+        loadFixtures('oa_edit.html');
+        $("#openassessment-editor").attr('data-is-released', 'true');
+
+        // Create the view
+        var element = $("#oa_prompts_editor_wrapper").get(0);
+        notifier = new StubNotifier();
+        view = new OpenAssessment.EditPromptsView(element, notifier);
+    });
+
+    it("does not allow adding prompts", function() {
+        view.addPrompt(); // call method
+        $(view.promptsContainer.addButtonElement).click(); // click on button
+
+        var prompts = view.promptsDefinition();
+        expect(prompts.length).toEqual(2);
+    });
+
+    it("does not allow removing prompts", function() {
+        view.removePrompt(view.getAllPrompts()[0]); // call method
+        $("." + view.promptsContainer.removeButtonClass, view.element).click(); // click on buttons
+
+        var prompts = view.promptsDefinition();
+        expect(prompts.length).toEqual(2);
+    });
 });

openassessment/xblock/static/js/src/studio/oa_container.js

@@ -65,6 +65,7 @@ OpenAssessment.Container = function(containerItem, kwargs) {
     this.removeButtonClass = kwargs.removeButtonClass;
     this.containerItemClass = kwargs.containerItemClass;
     this.notifier = kwargs.notifier;
+    this.addRemoveEnabled = (typeof kwargs.addRemoveEnabled == 'undefined') || kwargs.addRemoveEnabled;
 
     // Since every container item should be instantiated with
     // the notifier we were given, create a helper method
@@ -83,17 +84,23 @@ OpenAssessment.Container.prototype = {
      */
     addEventListeners: function() {
         var container = this;
-        // Install a click handler for the add button
-        $(this.addButtonElement).click($.proxy(this.add, this));
-
-        // Find items already in the container and install click
-        // handlers for the delete buttons.
-        $("." + this.removeButtonClass, this.containerElement).click(
-            function(eventData) {
-                var item = container.createContainerItem(eventData.target);
-                container.remove(item);
-            }
-        );
+
+        if (this.addRemoveEnabled) {
+            // Install a click handler for the add button
+            $(this.addButtonElement).click($.proxy(this.add, this));
+
+            // Find items already in the container and install click
+            // handlers for the delete buttons.
+            $("." + this.removeButtonClass, this.containerElement).click(
+                function (eventData) {
+                    var item = container.createContainerItem(eventData.target);
+                    container.remove(item);
+                }
+            );
+        } else {
+            $(this.addButtonElement).addClass('is--disabled');
+            $("." + this.removeButtonClass, this.containerElement).addClass('is--disabled');
+        }
 
         // Initialize existing items, in case they need to install their
         // own event handlers.
@@ -122,16 +129,21 @@ OpenAssessment.Container.prototype = {
             .toggleClass(this.containerItemClass, true)
             .appendTo($(this.containerElement));
 
-        // Install a click handler for the delete button
         // Since we just added the new element to the container,
         // it should be the last one.
         var container = this;
         var containerItem = $("." + this.containerItemClass, this.containerElement).last();
-        containerItem.find('.' + this.removeButtonClass)
-            .click(function(eventData) {
-                var containerItem = container.createContainerItem(eventData.target);
-                container.remove(containerItem);
-            } );
+
+        // Install a click handler for the delete button
+        if (this.addRemoveEnabled) {
+            containerItem.find('.' + this.removeButtonClass)
+                .click(function (eventData) {
+                    var containerItem = container.createContainerItem(eventData.target);
+                    container.remove(containerItem);
+                });
+        } else {
+            containerItem.find('.' + this.removeButtonClass).addClass('is--disabled');
+        }
 
         // Initialize the item, allowing it to install event handlers.
         // Fire event handler for adding a new element

openassessment/xblock/static/js/src/studio/oa_edit_prompts.js

@@ -10,6 +10,8 @@ Returns:
 **/
 OpenAssessment.EditPromptsView = function(element, notifier) {
     this.element = element;
+    this.editorElement = $(this.element).closest("#openassessment-editor");
+    this.addRemoveEnabled = !(this.editorElement.attr('data-is-released') === 'true');
 
     this.promptsContainer = new OpenAssessment.Container(
         OpenAssessment.Prompt, {
@@ -18,7 +20,8 @@ OpenAssessment.EditPromptsView = function(element, notifier) {
             addButtonElement: $("#openassessment_prompts_add_prompt", this.element).get(0),
             removeButtonClass: "openassessment_prompt_remove_button",
             containerItemClass: "openassessment_prompt",
-            notifier: notifier
+            notifier: notifier,
+            addRemoveEnabled: this.addRemoveEnabled
         }
     );
     this.promptsContainer.addEventListeners();
@@ -55,7 +58,9 @@ OpenAssessment.EditPromptsView.prototype = {
     Uses a client-side template to create the new prompt.
     **/
     addPrompt: function() {
-        this.promptsContainer.add();
+        if (this.addRemoveEnabled) {
+            this.promptsContainer.add();
+        }
     },
 
     /**
@@ -65,7 +70,9 @@ OpenAssessment.EditPromptsView.prototype = {
         item (OpenAssessment.RubricCriterion): The criterion item to remove.
     **/
     removePrompt: function(item) {
-        this.promptsContainer.remove(item);
+        if (this.addRemoveEnabled) {
+            this.promptsContainer.remove(item);
+        }
     },
 
     /**

openassessment/xblock/static/sass/oa/utilities/_developer.scss

@@ -527,7 +527,7 @@
     h2{
       text-transform: uppercase;
       font-size: 80%;
-      float: right;
+      @include float(right);
       display: inline-block;
       padding: 3px 8px 3px 13px;
     }
@@ -570,6 +570,15 @@
     cursor: pointer;
   }
 
+  .openassessment_container_remove_button.is--disabled,
+  .openassessment_container_remove_button.is--disabled:hover,
+  .openassessment_container_add_button.is--disabled,
+  .openassessment_container_add_button.is--disabled:hover {
+    color: $edx-gray-l2;
+    background-color: transparent;
+    cursor: auto;
+  }
+
   #oa_prompts_editor_wrapper {
 
     .wrapper-comp-settings {

openassessment/xblock/studio_mixin.py

@@ -129,6 +129,7 @@ class StudioMixin(object):
                 make_django_template_key(asmnt)
                 for asmnt in editor_assessments_order
             ],
+            'is_released': self.is_released(),
         }
 
     @XBlock.json_handler