$(function() {
 
  // get height of max column
  maxColumnHeight = 0;
  	
  $('#columns .column').each(function(){
    if (this.offsetHeight > maxColumnHeight) maxColumnHeight = this.offsetHeight;
  });

 
  $('#primaryOptions a').click(function() {
      $(this).parent().siblings('.on').removeClass('on');
      $(this).parent().addClass('on');

    var div_to_show_name = $(this).attr('rel');
    var div_to_show_id   = '#' + div_to_show_name;

    $('.folddown:visible').hide();
    $(div_to_show_id).show();
    
    resizeToMaxColumnHeight(div_to_show_id);
    
    captureUsageStats(div_to_show_name);
    
    return false; 
       
  });
  
  $('.folddown a.close').click(function() {
    $('.folddown:visible').hide();
    return false;
  });

  $('.panelSelector a').addClass('unvisited');

  $('.panelSelector a').click(function() {
        
    var div_to_show_name = $(this).attr('rel');
    var div_to_show_id   = '#' + div_to_show_name;
    
    // get parent folddown, as we need it's id to hide elements, and for stats
    var folddown    = $(div_to_show_id).parents('.folddown')[0];
    var folddown_id_name = $(folddown).attr('id');
   
    $('#' + folddown_id_name + ' .folddownPanel').hide();     
    $(div_to_show_id).show();
    resizeToMaxColumnHeight(div_to_show_id);
    
    captureUsageStats(folddown_id_name + '/' + div_to_show_name);
    
    return false;
    
  });
  
  $('.panelSelector td').click(function() {
    // run onclick event of child link
    $('a', this).click();  
  }).hover(
    function() { $(this).addClass('hover'); },
    function() { $(this).removeClass('hover'); }
  );
    
});

function resizeToMaxColumnHeight(id) {
     
  var elem_height = $(id).height();
    
  var new_height = maxColumnHeight + 30;
    
  if(elem_height < maxColumnHeight) {
    $(id)[0].style.height = new_height + 'px'; 
  }
     
}

function captureUsageStats(identifier) {
  urchinTracker('/fppInteractiveTool/' + identifier);
}