/*
 * Setup the middle line in the timeline
 */
function setLengthTimeline(){
  var first = $timeline.find(".first").height() / 2,
      height = $timeline_c1.height(),
      height_middle = height - first + 20,
      height_overlap = 0;

  $timeline_c2.animate({"height": height_middle}, 500);
}

function lineDown(e){
  var active_line = $(this),
      height = active_line.height() / 2,
      pos = active_line.position(),
      x = pos.top,
      new_x;

  if($(this).css("float") == "right"){
    new_x = (x + height) - 20 + "px";
  }
  else{
    new_x = (x + height) + 20 + "px";
  }

  $timeline_c3.stop().animate({"height": new_x}, 500);
}

function lineUp(){
  $timeline_c3.stop().animate({"height": 0}, 2500);
}

@@ -1,52 +1,444 @@
-/*%0A * Setup the middle line in the timeline%0A */%0A
+$(function() %7B%0A%0A  // Vars%0A  var $doc = $(%22html, body%22),%0A      $timeline = $doc.find(%22.timeline%22),%0A      $timeline_c1 = $timeline.find(%22.c1%22),%0A      $timeline_dates = $timeline_c1.find(%22.date%22),%0A      $timeline_c2 = $timeline.find(%22.c2%22),%0A      $timeline_c3 = $timeline.find(%22.c3%22);%0A%0A  // Events%0A  $timeline_dates.hover(lineDown, lineUp);%0A  $(window).on(%22resize%22, setLengthTimeline);%0A  setLengthTimeline();%0A%0A  // Calculate timeline length%0A  
 func
@@ -463,16 +463,18 @@
 line()%7B%0A
+  
   var fi
@@ -516,32 +516,34 @@
 ht() / 2,%0A      
+ 
+ 
 height = $timeli
@@ -554,24 +554,26 @@
 1.height(),%0A
+  
       height
@@ -605,37 +605,13 @@
 + 20
-,%0A      height_overlap = 0
 ;%0A%0A
+  
   $t
@@ -654,35 +654,59 @@
 _middle%7D, 500);%0A
+  
 %7D%0A%0A
+  // Draw line down%0A  
 function lineDow
@@ -711,16 +711,18 @@
 own(e)%7B%0A
+  
   var ac
@@ -744,24 +744,26 @@
 his),%0A      
+ 
+ 
 height = act
@@ -791,16 +791,18 @@
 ,%0A      
+  
 pos = ac
@@ -829,16 +829,18 @@
 ,%0A      
+ 
+ 
 x = pos.
@@ -846,24 +846,26 @@
 .top,%0A      
+  
 new_x;%0A%0A  if
@@ -862,16 +862,18 @@
 w_x;%0A%0A  
+ 
+ 
 if($(thi
@@ -890,16 +890,17 @@
 oat%22) ==
+=
  %22right%22
@@ -902,16 +902,18 @@
 ight%22)%7B%0A
+  
     new_
@@ -948,18 +948,22 @@
 ;%0A  
-%7D%0A
+  %7D%0A  
   else%7B%0A
     
@@ -958,16 +958,18 @@
   else%7B%0A
+  
     new_
@@ -998,21 +998,25 @@
 + %22px%22;%0A
+  
   %7D%0A%0A
+  
   $timel
@@ -1062,19 +1062,41 @@
 , 500);%0A
+  
 %7D%0A%0A
+  // Move line up%0A  
 function
@@ -1108,16 +1108,18 @@
 Up()%7B%0A  
+ 
+ 
 $timelin
@@ -1160,10 +1160,25 @@
  2500);%0A
-%7D
+  %7D%0A%0A%7D)(jQuery);
 %0A

Refactor js timeline.js