
function reloadData(reset_page) {
  if (typeof reset_page == 'undefined') reset_page = false;
  if (reset_page) $('#filter #page').val('1');
  $('#posts .dynamic table').animate({opacity: 0.01}, 1000);
  var url = $('#filter form').attr('action');
  $('#posts .dynamic').load(url+' #posts .dynamic', $('#filter form').serialize());
}


// Ajax pagination.
// Note: This was a jQuery.live call that didn't re-attach.
function paginate(el) {
  var match = $(el).attr('href').match(/page=(\d)/);
  $('#filter #page').val(match[1]);
  reloadData();
  return false;
}




$(function() {

  // change number of posts per page.
  $('.per_page').live('change', function () {
    $('#filter #per_page').val($(this).val());
    reloadData(false);
  });

  // ajaxified prev/next page.
  $('.prev a, .next a').live('click', function(e) {
    var url = '/posts.html?page=THE_PAGE #posts .dynamic';
    var page = $(this).attr('href').match(/page=(\d+)/)[1];
    url = url.replace('THE_PAGE', page);
    $('#posts .dynamic').load(url, $('#filter form').serialize());
    return false;
  });

  // ajax filtering.
  $('#filter input').change(function () {
    reloadData();
  });

  // Ajax column sorts.
  $('.sort a').live('click', function() {
    var match = $(this).attr('href').match('search%5Border%5D=([^&]+)');
    $('#filter #search_order').val(match[1]);
    reloadData();
    return false;
  });

  // Show teaser row.
  $('#posts tr td').live('mouseover', function() {
    var hovering = $(this).parents('tr');
    if (hovering.hasClass('teaser')) {
      hovering = hovering.prev('tr');
    }
    hovering.addClass('hovered')
    // Show the teaser row on a delay so the interface doesn't jump around.
    function showTeaser() {
      if ($(hovering).hasClass('hovered')) {
        $(hovering).next('tr.teaser').show();
      }
    }
    setTimeout(showTeaser, 500);
  });
  $('#posts tr td').live('mouseout', function() {
    var outing = $(this).parents('tr');
    if (outing.hasClass('teaser')) outing = outing.prev('tr');
    outing.removeClass('hovered')
    // Hide the teaser, but give enough time for the user to
    // move to the next td in this row to avoid hiding the teaser.
    function hideTeaser() {
      if ($(outing).hasClass('hovered')) return;
      $(outing).next('tr.teaser').hide();
    }
    setTimeout(hideTeaser, 10);
  });

  // Filter set on hover effect.
  $('#filter_set li').live('mouseover', function() {
    $(this).addClass('unselect');
  });
  $('#filter_set li').live('mouseout', function() {
    $(this).removeClass('unselect');
  });

  // Filtering
  // ... categories
  $('#filter .category').click(function(evt) {
    var category = $(this);
    // Toggle category.
    function toggleCategory(el) {
      // Select/deselect filter.
      el.toggleClass('selected');
      // Toggling form checkbox value.
      var checkbox = $('.category-checkbox[value="'+el.text()+'"]').get(0)
      checkbox.checked = !checkbox.checked;
      $(checkbox).trigger('change');
    }
    toggleCategory(category);

    // Deselection handled by handlers attached on select event.
    if (!category.hasClass('selected')) return;
    
    // Append to the filter stack.
    var new_filter = $('<li>'+category.text()+'</li>');
    $('#filter_set ul').append(new_filter);

    // Remove filter by clicking item in filter set.
    new_filter.click(function() {
      new_filter.remove();
      toggleCategory(category);
    });

    // Remove filter by clicking category.
    category.click(function(e) {
      if (e == evt) return;
      new_filter.remove();
    });
  });
  // ... switch between cities on state selection.
  $('#filter #state').change(function() {
    var state_id = $(this).val();
    $('#filter .state').hide();
    $('#filter #state-'+state_id).show();
  });
  // ... filter by city
  $('#filter .city').click(function(evt) {
    var city = $(this);
    var city_id = city.attr('id').substring('city-'.length);
    // Toggle city.
    function toggleCity(el) {
      // Select/deselect filter.
      el.toggleClass('selected');
      // Toggling form checkbox value.
      var checkbox = $('.city-checkbox[value="'+city_id+'"]').get(0)
      checkbox.checked = !checkbox.checked;
      $(checkbox).trigger('change');
    }
    toggleCity(city);

    // Deselection handled by handlers attached on select event.
    if (!city.hasClass('selected')) return;

    // Append to the filter stack.
    var new_filter = $('<li>'+city.text()+'</li>');
    $('#filter_set ul').append(new_filter);

    // Remove filter by clicking item in filter set.
    new_filter.click(function() {
      new_filter.remove();
      toggleCity(city)
    });

    // Remove filter by clicking category.
    city.click(function(e) {
      if (e == evt) return;
      new_filter.remove();
    });
  });
  // ... filter by employment type
  $('#filter .post-type').click(function(evt) {
    var employmentType = $(this);
    // Toggle city.
    function toggleEmploymentType(el) {
      // Select/deselect filter.
      el.toggleClass('selected');
      // Toggling form checkbox value.
      var checkbox = $('.post_type-checkbox[value="'+el.text()+'"]').get(0)
      checkbox.checked = !checkbox.checked;
      $(checkbox).trigger('change');
    }
    toggleEmploymentType(employmentType);

    // Deselection handled by handlers attached on select event.
    if (!employmentType.hasClass('selected')) return;

    // Append to the filter stack.
    var new_filter = $('<li>'+employmentType.text()+'</li>');
    $('#filter_set ul').append(new_filter);

    // Remove filter by clicking item in filter set.
    new_filter.click(function() {
      new_filter.remove();
      toggleEmploymentType(employmentType)
    });

    // Remove filter by clicking employment type.
    employmentType.click(function(e) {
      if (e == evt) return;
      new_filter.remove();
    });
  });
  // Filter by created at after
  function updateChangedAtAfter(event, ui) {
    // Update the verbalisation.
    if (ui.value == 0) {
      $('#created_at-duration').html('No date range specified.');
    } else {
      $('#created_at-duration').html('Posted less than '+ui.value+' days ago');
    }
    // Update the form value.
    switch(event.type) {
      case 'slidechange':
        var now = new Date();
        now.setDate(now.getDate() - ui.value);
        if (ui.value == 0) {
          $('#search_created_at_after').val('');
        } else {
          $('#search_created_at_after').val([now.getUTCFullYear(), now.getUTCMonth()+1, now.getUTCDate()].join('/'));
        }
        reloadData();
      break;
    }
  }
  $('#filter #created_at-slider').slider({
    min: 0,
    max: 100,
    value: 0,
    change: updateChangedAtAfter,
    slide: updateChangedAtAfter
  });
  $('#created_at-duration').html($('#filter #created_at-slider').slider().value);
  // Filter by price less than
  function updatePriceLessThan(event, ui) {
    // Update the verbalisation.
    if (ui.value == 9999) {
      $('#price-range').html('No maximum price specified.');
    } else {
      var currency = new Array();
      var currency_str = ui.value.toString();
      var triple = '';
      // while (triple = currency_str.slice(-3,0) && triple.length == 3) {
      //   currency.push(triple);
      // }
      // currency.push(triple);
      while (triple = currency_str.slice(-3)) {
        currency.unshift(triple);
        currency_str = currency_str.slice(0,-3);
      }
      $('#price-range').html('Price less than $'+currency.join(',')+'.00');
    }
    // Update the form value.
    switch(event.type) {
      case 'slidechange':
        if (ui.value == 9999) {
          $('#search_price_less_than').val('');
        } else {
          $('#search_price_less_than').val(ui.value);
        }
        reloadData();
      break;
    }
  }
  $('#filter #price-slider').slider({
    min: 9999,
    max: 1000000,
    value: 0,
    change: updatePriceLessThan,
    slide: updatePriceLessThan
  });
  $('#price-range').html($('#filter #price-slider').slider().value);

});
