2 files changed, 45 insertions, 0 deletions
diff --git a/app/assets/javascripts/admin.js b/app/assets/javascripts/admin.js
index 0b5d56525..4925a65a4 100644
--- a/app/assets/javascripts/admin.js
+++ b/app/assets/javascripts/admin.js
@@ -1,7 +1,10 @@
 // ...
 //= require jquery
 //= require jquery.ui.tabs
+//= require jquery.ui.sortable
+//= require jquery.ui.effect-highlight
 //= require admin/bootstrap-collapse
 //= require admin/bootstrap-tab
 //= require admin/admin
+//= require admin/category-order
 //= require jquery_ujs
diff --git a/app/assets/javascripts/admin/category-order.js b/app/assets/javascripts/admin/category-order.js
new file mode 100644
index 000000000..3be82e46f
--- /dev/null
+++ b/app/assets/javascripts/admin/category-order.js
@@ -0,0 +1,42 @@
+$(function() {
+  $('.save-order').each(function(index){
+
+    // identify the elements that will work together
+    var save_button = $(this);
+    var save_notice = save_button.next();
+    var save_panel = save_button.parent();
+    var list_element = $(save_button.data('list-id'));
+    var endpoint = save_button.data('endpoint');
+
+    // on the first list change, show that there are unsaved changes
+    list_element.sortable({
+        update: function (event, ui) {
+          if (save_button.is('.disabled')){
+            save_button.removeClass("disabled");
+            save_notice.html(save_notice.data('unsaved-text'));
+            save_panel.effect('highlight', {}, 2000);
+          }
+        }
+    });
+    // on save, POST to endpoint
+    save_button.click(function(){
+      if (!save_button.is('.disabled')){
+        var data = list_element.sortable('serialize', {'attribute': 'data-id'});
+        var update_call = $.ajax({ data: data, type: 'POST', url: endpoint });
+
+        // on success, disable the save button again, and show success notice
+        update_call.done(function(msg) {
+          save_button.addClass('disabled');
+          save_panel.effect('highlight', {}, 2000);
+          save_notice.html(save_notice.data('success-text'));
+        })
+        // on failure, show error message
+        update_call.fail(function(jqXHR, msg) {
+          save_panel.effect('highlight', {'color': '#cc0000'}, 2000);
+          save_notice.html(save_notice.data('error-text') + jqXHR.responseText);
+        });
+      }
+      return false;
+    })
+  });
+});