// min and max values for header images
var min = 1;
var max = 55;

// pad numbers with 0s to length len
function pad(num, len) {
  s = String(num); p = "";
  while (s.length+p.length < len)
    p += "0";
  return p+s;
}

$(document).ready( function() {
  $("#hp")
    .mouseover( function() {
      $(this).attr("src", "images/headers/left-hi.png");
    })
    .mouseout( function() {
      $(this).attr("src", "images/headers/left.png");
    })
    .click( function() {
      var cur = $("#headerImg").attr("src").match(/[\d]+/);
      cur--;
      if (cur < min) cur = max;
      $("#headerImg").attr("src", "images/headers/header"+pad(cur,2)+".jpg");
    });
  
  $("#hn")
    .mouseover( function() {
      $(this).attr("src", "images/headers/right-hi.png");
    })
    .mouseout( function() {
      $(this).attr("src", "images/headers/right.png");
    })
    .click( function() {
      var cur = $("#headerImg").attr("src").match(/[\d]+/);
      cur++;
      if (cur > max) cur = min;
      $("#headerImg").attr("src", "images/headers/header"+pad(cur,2)+".jpg");
    });
  
  $("#header")
    .mouseover( function() {
      $("#hp").show();
      $("#hn").show();
    })
    .mouseleave( function() {
      $("#hp").hide();
      $("#hn").hide();
    });
});