////
//// javascript code for MIT Medical directory page: result filters
////

//
// required:
//   jquery.js (version 1.2.6+)
//

$(document).ready(function(){

  // CONFIGURATION
  //
  // how many items per row // set also in index.php, and adjust css styles to match
  var resultitemsperrow = 3;
  // banner images
  var bannerimgsrc_lex = '/images/banner_lincolnlab.jpg';
  var bannerimgsrc_def = '/images/banner_urgent_combined.jpg';

  // initial filter states
  var newpatientsonly = false;
  var lexingtononly = false;
  var servicesonly = false;

  //
  // insert HTML for filters
  //
  $("#filterset1").html("<form id='filter1form' method='post' action='/directory/index.html'><p class='paddingFilters'><input type='checkbox' name='newpatientsonly' id='newpatientsonly' /> <label for='newpatientsonly'>Show only primary care providers accepting new patients</label></p></form>");
  $("#filterset2").html("<form id='filter2form' method='post' action='/directory/index.html'><p class='paddingFilters'><input type='checkbox' name='lexingtononly' id='lexingtononly' /> <label for='lexingtononly'>Show providers in <br />Lexington only</label></p></form>");
  $("#filterset3").html("<form id='filter3form' method='post' action='/directory/index.html'><p class='paddingFilters'><input type='checkbox' name='servicesonly' id='servicesonly' /> <label for='servicesonly'>Show medical services only</label></p></form>");


  //
  // gather all items in the table, for later filtering
  //
  var allitems = new Array();
  $("#directorytable td").each(function(i) {
      allitems[i] = { jqobject: $(this).clone(),
                      newpatients:  $(this).hasClass("filter_nwp"),
                      lexington:  $(this).hasClass("filter_lex"),
                      service: $(this).hasClass("filter_srv")

                 };
  });

  //
  // respond to filter changes
  //
  var filterchange = function(e) {
    // if clicked newpatientsonly, deselect servicesonly
    if (e.target == $("#newpatientsonly")[0]) {
      $("#servicesonly").removeAttr("checked");
    }
    // if clicked lexingtononly, deselect servicesonly
    if (e.target == $("#lexingtononly")[0]) {
      $("#servicesonly").removeAttr("checked");
    }
    // if clicked servicesonly only, deselect newpatientsonly and lexingtononly
    if (e.target == $("#servicesonly")[0]) {
      $("#newpatientsonly").removeAttr("checked");
      $("#lexingtononly").removeAttr("checked");
    }
    // re-read values of all filters
    newpatientsonly = $("#newpatientsonly").attr("checked");
    lexingtononly = $("#lexingtononly").attr("checked");
    servicesonly = $("#servicesonly").attr("checked");

    // set banner image
    $('#headerLeft img').attr('src', (lexingtononly ? bannerimgsrc_lex : bannerimgsrc_def));

    // empty table
    $("#directorytable tbody").empty();

    // insert all matching items into table
    var matchcount = 0;
    for (var i = 0; i < allitems.length; i++) {
      // check this item against current filters
      if ((newpatientsonly && !allitems[i].newpatients) || (lexingtononly && !allitems[i].lexington) || (servicesonly && !allitems[i].service))
        continue;
      // add a new row if needed
      if (matchcount % resultitemsperrow == 0) {
        $("#directorytable tbody").append("<tr></tr>");
      }
      // add item to last row
      $("#directorytable tbody tr:last").append(allitems[i].jqobject);
      // increment count
      ++matchcount;
    }
    // show count of matchng items
    $("#resultcount").text(matchcount);

  }

  // attach form elements to handler
  $("#newpatientsonly").click(filterchange);
  $("#lexingtononly").click(filterchange);
  $("#servicesonly").click(filterchange);
  $("#newpatientsonly").keypress(function(e) {if(e.which == 13 || e.which == 32){return filterchange(e);}});
  $("#lexingtononly").keypress(function(e) {if(e.which == 13 || e.which == 32){return filterchange(e);}});
  $("#servicesonly").keypress(function(e) {if(e.which == 13 || e.which == 32){return filterchange(e);}});

});
