support reordering of units inside subsection list

cms/static/js/base.js

@@ -26,8 +26,35 @@ $(document).ready(function() {
     $('.unit .item-actions .delete-button').bind('click', deleteUnit);
     $('.new-unit-item').bind('click', createNewUnit);
     $('.save-subsection').bind('click', saveSubsection);
+
+    // making the unit list sortable
+    $('.sortable-unit-list').sortable();
+    $('.sortable-unit-list').disableSelection();
+    $('.sortable-unit-list').bind('sortstop', onUnitReordered);
 });
 
+// This method only changes the ordering of the child objects in a subsection
+function onUnitReordered() {
+    var subsection_id = $(this).data('subsection-id');
+
+    var _els = $(this).children('li:.leaf');
+
+    var children = new Array();
+    for(var i=0;i<_els.length;i++) {
+	el = _els[i];
+	children[i] = $(el).data('id');
+    }
+
+    // call into server to commit the new order
+    $.ajax({
+	    url: "/save_item",
+		type: "POST",
+		dataType: "json",
+		contentType: "application/json",
+		data:JSON.stringify({ 'id' : subsection_id, 'metadata' : null, 'data': null, 'children' : children})
+	});
+}
+
 function saveSubsection(e) {
     e.preventDefault();
     

cms/templates/widgets/units.html

@@ -3,8 +3,8 @@
 <!--
 This def will enumerate through a passed in subsection and list all of the units
 -->
-<%def name="enum_units(subsection, actions=True, selected=None)">
-<ol>
+<%def name="enum_units(subsection, actions=True, selected=None, sortable=True)">
+<ol ${'class="sortable-unit-list"' if sortable else ''} data-subsection-id="${subsection.location}">
   % for unit in subsection.get_children():
   <li class="leaf unit" data-id="${unit.location}">
     <%