From 67a557d59ac12a82199d3a99f08294044891cda7 Mon Sep 17 00:00:00 2001
From: cahrens <christina@edx.org>
Date: Mon, 11 Feb 2013 14:07:11 -0500
Subject: [PATCH 1/2] Update Save/Cancel button state on typing events.

---
 cms/static/js/views/settings/advanced_view.js | 36 ++++++++++++++-----
 1 file changed, 27 insertions(+), 9 deletions(-)

diff --git a/cms/static/js/views/settings/advanced_view.js b/cms/static/js/views/settings/advanced_view.js
index a0ad5fd8ac..fa36b4c101 100644
--- a/cms/static/js/views/settings/advanced_view.js
+++ b/cms/static/js/views/settings/advanced_view.js
@@ -14,8 +14,9 @@ CMS.Views.Settings.Advanced = CMS.Views.ValidatingView.extend({
         'click .cancel-button' : "revertView",
         'click .new-button' : "addEntry",
         // update model on changes
-        'change #course-advanced-policy-key' : "updateKey"
-        // TODO enable/disable save (add disabled class) based on validation & dirty
+        'change #course-advanced-policy-key' : "updateKey",
+        'keydown #course-advanced-policy-key' : "enableSaveCancelButtons"
+        // TODO enable/disable save based on validation (currently enabled whenever there are changes)
         // TODO enable/disable new button?
     },
     initialize : function() {
@@ -56,6 +57,9 @@ CMS.Views.Settings.Advanced = CMS.Views.ValidatingView.extend({
         var self = this;
         CodeMirror.fromTextArea(textarea, {
             mode: "application/json", lineNumbers: false, lineWrapping: true,
+            onChange: function() {
+                self.enableSaveCancelButtons();
+            },
             onBlur: function (mirror) {
                 var key = $(mirror.getWrapperElement()).closest('.row').children('.key').attr('id');
                 var quotedValue = mirror.getValue();
@@ -69,22 +73,36 @@ CMS.Views.Settings.Advanced = CMS.Views.ValidatingView.extend({
 
     showMessage: function (type) {
         this.$el.find(".message-status").removeClass("is-shown");
-        var saveButton = this.$el.find(".save-button").addClass('disabled');
-        var cancelButton = this.$el.find(".cancel-button").addClass('disabled');
         if (type) {
             if (type === this.error_saving) {
                 this.$el.find(".message-status.error").addClass("is-shown");
-                saveButton.removeClass("disabled");
-                cancelButton.removeClass("disabled");
             }
             else if (type === this.unsaved_changes) {
                 this.$el.find(".message-status.warning").addClass("is-shown");
-                saveButton.removeClass("disabled");
-                cancelButton.removeClass("disabled");
             }
-            else if (type === this.successful_changes)
+            else if (type === this.successful_changes) {
                 this.$el.find(".message-status.confirm").addClass("is-shown");
+                this.disableSaveCancelButtons();
+            }
         }
+        else {
+            // This is the case of the page first rendering.
+            this.disableSaveCancelButtons();
+        }
+    },
+
+    enableSaveCancelButtons: function() {
+       if (!this.buttonsEnabled) {
+           this.$el.find(".save-button").removeClass('disabled');
+           this.$el.find(".cancel-button").show();
+           this.buttonsEnabled = true;
+       }
+    },
+
+    disableSaveCancelButtons: function() {
+        this.$el.find(".save-button").addClass('disabled');
+        this.$el.find(".cancel-button").hide();
+        this.buttonsEnabled = false;
     },
 
     deleteEntry : function(event) {

From 437c806fce0c4eda4f551f824c9d033f180a6283 Mon Sep 17 00:00:00 2001
From: cahrens <christina@edx.org>
Date: Mon, 11 Feb 2013 14:16:04 -0500
Subject: [PATCH 2/2] Enable/disable new entry button.

---
 cms/static/js/views/settings/advanced_view.js | 15 +++++++++++++++
 1 file changed, 15 insertions(+)

diff --git a/cms/static/js/views/settings/advanced_view.js b/cms/static/js/views/settings/advanced_view.js
index fa36b4c101..c7e2fb2738 100644
--- a/cms/static/js/views/settings/advanced_view.js
+++ b/cms/static/js/views/settings/advanced_view.js
@@ -105,6 +105,16 @@ CMS.Views.Settings.Advanced = CMS.Views.ValidatingView.extend({
         this.buttonsEnabled = false;
     },
 
+    toggleNewButton: function (enable) {
+        var newButton = this.$el.find(".new-button");
+        if (enable) {
+            newButton.removeClass('disabled');
+        }
+        else {
+            newButton.addClass('disabled');
+        }
+    },
+
     deleteEntry : function(event) {
         event.preventDefault();
         // find out which entry
@@ -154,6 +164,7 @@ CMS.Views.Settings.Advanced = CMS.Views.ValidatingView.extend({
         var policyValueDivs = this.$el.find('#' + this.new_key).closest('li').find('.json');
         // only 1 but hey, let's take advantage of the context mechanism
         _.each(policyValueDivs, this.attachJSONEditor, this);
+        this.toggleNewButton(false);
         this.showMessage(this.unsaved_changes);
     },
     updateKey : function(event) {
@@ -205,6 +216,10 @@ CMS.Views.Settings.Advanced = CMS.Views.ValidatingView.extend({
                 this.model.deleteKeys.push(oldKey);
                 this.model.unset(oldKey) ;
             }
+            else {
+                // id for the new entry will now be the key value. Enable new entry button.
+                this.toggleNewButton(true);
+            }
             
             // check for newkey being the name of one which was previously deleted in this session
             var wasDeleting = this.model.deleteKeys.indexOf(newKey);