Merge pull request #366 from edx/peter-fogg/stud-116

Use new feedback notification when changing section release dates.

cms/djangoapps/contentstore/features/section.feature

@@ -26,6 +26,7 @@ Feature: Create Section
     When I click the Edit link for the release date
     And I save a new section release date
     Then the section release date is updated
+    And I see a "saving" notification
 
   Scenario: Delete section
     Given I have opened a new course in Studio

cms/djangoapps/contentstore/features/section.py

@@ -42,6 +42,12 @@ def i_save_a_new_section_release_date(_step):
     world.browser.click_link_by_text('Save')
 
 
+@step('I see a "saving" notification')
+def i_see_a_saving_notification(step):
+    saving_css = '.wrapper-notification-saving'
+    assert world.is_css_present(saving_css)
+
+
 ############ ASSERTIONS ###################
 
 

cms/static/coffee/spec/views/overview_spec.coffee

+describe "Course Overview", ->
+
+    beforeEach ->
+        appendSetFixtures """
+            <script src="/static/js/vendor/date.js"></script>
+        """
+
+        appendSetFixtures """
+            <script type="text/javascript" src="/jsi18n/"></script>
+        """
+
+        appendSetFixtures """
+            <div class="section-published-date">
+              <span class="published-status">
+                <strong>Will Release:</strong> 06/12/2013 at 04:00 UTC
+              </span>
+              <a href="#" class="edit-button" "="" data-date="06/12/2013" data-time="04:00" data-id="i4x://pfogg/42/chapter/d6b47f7b084f49debcaf67fe5436c8e2">Edit</a>
+           </div>
+        """#"
+
+        appendSetFixtures """
+          <div class="edit-subsection-publish-settings">
+            <div class="settings">
+              <h3>Section Release Date</h3>
+              <div class="picker datepair">
+                <div class="field field-start-date">
+                  <label for="">Release Day</label>
+                  <input class="start-date date" type="text" name="start_date" value="04/08/1990" placeholder="MM/DD/YYYY" class="date" size='15' autocomplete="off"/>
+              </div>
+              <div class="field field-start-time">
+                <label for="">Release Time (<abbr title="Coordinated Universal Time">UTC</abbr>)</label>
+                <input class="start-time time" type="text" name="start_time" value="12:00" placeholder="HH:MM" class="time" size='10' autocomplete="off"/>
+              </div>
+              <div class="description">
+                <p>On the date set above, this section – <strong class="section-name"></strong> – will be released to students. Any units marked private will only be visible to admins.</p>
+              </div>
+            </div>
+            <a href="#" class="save-button">Save</a><a href="#" class="cancel-button">Cancel</a>
+          </div>
+        </div>
+        """#"
+
+        spyOn(window, 'saveSetSectionScheduleDate').andCallThrough()
+        # Have to do this here, as it normally gets bound in document.ready()
+        $('a.save-button').click(saveSetSectionScheduleDate)
+        @notificationSpy = spyOn(CMS.Views.Notification.Saving.prototype, 'show').andCallThrough()
+        window.analytics = jasmine.createSpyObj('analytics', ['track'])
+        window.course_location_analytics = jasmine.createSpy()
+        sinon.useFakeXMLHttpRequest()
+
+    afterEach ->
+        delete window.analytics
+        delete window.course_location_analytics
+
+    it "should save model when save is clicked", ->
+        $('a.edit-button').click()
+        $('a.save-button').click()
+        expect(saveSetSectionScheduleDate).toHaveBeenCalled()
+
+    it "should show a confirmation on save", ->
+        $('a.edit-button').click()
+        $('a.save-button').click()
+        expect(@notificationSpy).toHaveBeenCalled()

cms/static/js/base.js

@@ -712,6 +712,10 @@ function saveSetSectionScheduleDate(e) {
         'start': start
     });
 
+    var saving = new CMS.Views.Notification.Saving({
+        title: gettext("Saving") + "…",
+    });
+    saving.show();
     // call into server to commit the new order
     $.ajax({
         url: "/save_item",
@@ -738,16 +742,7 @@ function saveSetSectionScheduleDate(e) {
             '" data-date="' + input_date +
             '" data-time="' + input_time +
             '" data-id="' + id + '">' + gettext('Edit') + '</a>');
-        $thisSection.find('.section-published-date').animate({
-            'background-color': 'rgb(182,37,104)'
-        }, 300).animate({
-            'background-color': '#edf1f5'
-        }, 300).animate({
-            'background-color': 'rgb(182,37,104)'
-        }, 300).animate({
-            'background-color': '#edf1f5'
-        }, 300);
-
         hideModal();
+        saving.hide();
     });
 }

cms/static/js/models/section.js

@@ -23,7 +23,7 @@ CMS.Models.Section = Backbone.Model.extend({
     showNotification: function() {
         if(!this.msg) {
             this.msg = new CMS.Views.Notification.Saving({
-                title: gettext("Saving…")
+                title: gettext("Saving") + "…"
             });
         }
         this.msg.show();

cms/static/js/views/textbook.js

@@ -35,7 +35,7 @@ CMS.Views.ShowTextbook = Backbone.View.extend({
                     click: function(view) {
                         view.hide();
                         var delmsg = new CMS.Views.Notification.Saving({
-                            title: gettext("Deleting…")
+                            title: gettext("Deleting") + "…"
                         }).show();
                         textbook.destroy({
                             complete: function() {
@@ -122,7 +122,7 @@ CMS.Views.EditTextbook = Backbone.View.extend({
         this.setValues();
         if(!this.model.isValid()) { return; }
         var saving = new CMS.Views.Notification.Saving({
-            title: gettext("Saving…")
+            title: gettext("Saving") + "…"
         }).show();
         var that = this;
         this.model.save({}, {