BranchGraph now loads async

Centralized keyboard and drag events for BranchGraph

app/assets/javascripts/projects.js.coffee

@@ -18,10 +18,3 @@ $ ->
   # Ref switcher
   $('.project-refs-select').on 'change', ->
     $(@).parents('form').submit()
-
-class @GraphNav
-  @init: ->
-    $('.graph svg').css 'position', 'relative'
-    $('body').bind 'keyup', (e) ->
-      $('.graph svg').animate(left: '+=400') if e.keyCode is 37 # left
-      $('.graph svg').animate(left: '-=400') if e.keyCode is 39 # right

app/controllers/projects_controller.rb

@@ -83,9 +83,19 @@ class ProjectsController < ProjectResourceController
   end
 
   def graph
-    graph = Gitlab::Graph::JsonBuilder.new(project)
+    
+    respond_to do |format|
+      format.html
+      format.json do
+        graph = Gitlab::Graph::JsonBuilder.new(project)
+        #@days_json, @commits_json = graph.days_json, graph.commits_json
+        render :text => graph.to_json
+      end
+    end
+    
+    
 
-    @days_json, @commits_json = graph.days_json, graph.commits_json
+    
   end
 
   def destroy

app/views/projects/graph.html.haml

@@ -4,12 +4,10 @@
   %h4
     %small You can move around the graph by using the arrow keys.
   #holder.graph
+    .loading
 
 :javascript
-  var commits = #{@commits_json}
-    , days = #{@days_json};
-  var branch_graph = new BranchGraph(days, commits);
+  var branch_graph;
   $(function(){
-    branch_graph.buildGraph($("#holder")[0]);
-    GraphNav.init();
+    branch_graph = new BranchGraph($("#holder"), '#{url_for :controller => 'projects', :action => 'graph'}');
   });