$(document).ready(function() {
  $('.key-item').click(function() {
    var cgiUrl   = '/cgi-bin/search_json/';
    var restPath = $(this).attr('id').replace('-', '/');
    if($(this).attr('id') == 'search') {
      restPath += '/'+$("input[name=expression]").val().replace('/', '-');
      restPath += '/'+$("select[name=category]").val();
    } 
      
    $.getJSON(cgiUrl + restPath, function(data) {
      $.each(data, function(i, item) {
        if(i.match(/^\d+/)) {
          // ensure these are interpreted as numbers rather than strings.
          item.startYear  = parseInt(item.startYear);
          item.startMonth = parseInt(item.startMonth);
          item.startDay   = parseInt(item.startDay);
          item.endYear    = parseInt(item.endYear);
          item.endMonth   = parseInt(item.endMonth);
          item.endDay     = parseInt(item.endDay);
	}
      });
      $.each(data, function(i, item) {
        if(i.match(/^\d+$/)) { 
          var text = generateOutputHtml(item);
          outputList.push(text);
	}
      });
      outputList.sort();
      var r = '';
      if( outputList.length > 9 ) {
        r = 'Results: ';
      }
      var outputHtml = '<span class="search-nav nav-left">';
      outputHtml += '<h2>'+data.title+'</h2></span>';
      outputHtml += '<span class="search-nav nav-right">'+r+'</span><br /><br />';
      if(outputList.length == 0) {
        switch(data.title) { 
          case 'Sanger Events':
	    outputHtml += 'There are currently no upcoming events at the Sanger Institute to advertise. The majority of Sanger Institute-related events are hosted through either <a href="/cgi-bin/search/category/1">Wellcome Trust Advanced Courses</a> or <a href="/cgi-bin/search/category/2">Wellcome Trust Scientific Conferences.</a> ';
	  break;
	}
      } else {
        for( var c = 0; c < outputList.length; c++) {
	  if(c > 9) {
	    outputHtml += '<div class="result" id="r'+c+'" style="display: none">';
	  } else {
	    outputHtml += '<div class="result" id="r'+c+'">';
	  }
          outputHtml += outputList[c];
	  outputHtml += '</div>';
        }
      }
      outputHtml += '<span class="search-nav nav-right">'+r+'</span>';
      $(outputDiv).hide();
      $(outputDiv).html(outputHtml);
      $(outputDiv).fadeIn('slow');
      var navBtns = '';
      if(outputList.length > 9) {
        for( var index = 0; index < outputList.length; index++ ) {
	  if( index % 10 == 0) {
	    navBtns += '<span class="nav-btn" id="offset-'+index+'">'+(index + 1)+' - '+(index + 10)+'</span>, ';
	  }
	}
        $('.nav-right').append(navBtns.replace(/, $/, ''));
      }

      // clear these parameters in prep for the next mouseclick
      outputHtml = '';
      outputList = [];
    });
  });

  $('body').delegate('.nav-btn','click', function() {
    var offset = parseInt($(this).attr('id').replace(/\D*/g, ''));
    var limit  = offset + 10;
    $('.result').each(function(index) {
      var id = parseInt($(this).attr('id').replace(/\D*/g, ''));
      if(id >= offset && id <= limit) {
        $(this).fadeIn('slow'); 
      } else {
        $(this).fadeOut('slow');
      }
    });
  });
});