Added JS functionality to allow us to display our associated items wh…

…en a page has been changed. Also refactored so that the pagination works as we expect it to.

app/views/features/show.rjs.erb

@@ -1,2 +1,20 @@
-  $('#list').html("<%= escape_javascript(render :partial => '/common/sortable_list',:locals => {:models => @feature_stories, :item_name => 'story', :assoc => 'step', :order =>true})%>");
-  $('div#lists ul').customSortable();
+$('div.list').replaceWith("<%= escape_javascript(render :partial => '/common/sortable_list',:locals => {:models => @feature_stories, :item_name => 'story', :assoc => 'step', :order =>true})%>");
+$('div#lists ul').customSortable();
+$('div#sidebar').html("<%= escape_javascript(render :partial => '/common/sidebar_list_content', :locals => {:models => @feature_stories, :assoc => 'steps'})%>");
+
+// Ideally we should not duplicate this functionality, need to find a way to centralise it
+$(document).ready(function() {
+
+  var hoverItem = function() {
+    $classArray = $(this).attr('id');
+    $sidebarPostfix = $('div#sidebar > ul').attr('id').split('_');
+
+    $hover_class = 'li#' + $classArray + '_' + $sidebarPostfix[1];
+    $($hover_class).toggle();
+  };
+
+  $("div.list_item").each(function(event) {
+    $(this).mouseover(hoverItem);
+    $(this).mouseout(hoverItem);
+  });
+});