4 files changed, 64 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;
+    })
+  });
+});
diff --git a/app/assets/stylesheets/admin.scss b/app/assets/stylesheets/admin.scss
index b0de2eb7b..863a6c808 100644
--- a/app/assets/stylesheets/admin.scss
+++ b/app/assets/stylesheets/admin.scss
@@ -27,6 +27,9 @@ body.admin {
 }
 
 .admin {
+  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
+  font-size: 14px;
+  line-height: 20px;
 
   @import "compass/css3";
   @import "bootstrap";
@@ -47,6 +50,9 @@ body.admin {
 
   .accordion-group {
    border: none;
+   div {
+       clear: both;
+   }
   }
   .accordion-heading {
     .btn {
@@ -104,5 +110,14 @@ body.admin {
     width: 750px;
   }
 
+  .save-notice {
+    display: inline-block;
+    padding-left: 1em;
+  }
+
+  .category-list-item {
+    padding: 3px 0;
+  }
+
 }
 
diff --git a/app/assets/stylesheets/responsive/_user_layout.scss b/app/assets/stylesheets/responsive/_user_layout.scss
index a568a5fa3..84ddbf562 100644
--- a/app/assets/stylesheets/responsive/_user_layout.scss
+++ b/app/assets/stylesheets/responsive/_user_layout.scss
@@ -4,4 +4,8 @@
   #search_form {
     margin-top: 2rem;
   }
+
+  #request_latest_status {
+    width: 300px;
+  }
 }