$(document).ready(function() {
  $("#ganttkey").hide().before('<input type="button" id="ganttkeyshow" value="Show gantt chart key" /><input type="button" id="ganttkeyhide" value="Hide gantt chart key" />');
  $("#ganttkeyhide").hide();
  $("#ganttkeyshow").click(function () {
      $("#ganttkey").show('fast');
      $("#ganttkeyshow").hide();
      $("#ganttkeyhide").show();
  });
  $("#ganttkeyhide").click(function () {
      $("#ganttkey").hide('fast');
      $("#ganttkeyshow").show();
      $("#ganttkeyhide").hide();
  });
  $("#morekeys").hide().before('<input type="button" id="morekeysshow" value="Show more keys" /><input type="button" id="morekeyshide" value="Hide more keys" />');
  $("#morekeyshide").hide();
  $("#morekeysshow").click(function () {
      $("#morekeys").show('fast');
      $("#morekeysshow").hide();
      $("#morekeyshide").show();
  });
  $("#morekeyshide").click(function () {
      $("#morekeys").hide('fast');
      $("#morekeysshow").show();
      $("#morekeyshide").hide();
  });
  $("#creategraphs").hide();
  $("select,input").change(function() {
    graph();
  });
  graph();
});

function graph() {
  $('img#graph,img#gantt').attr("src", function (arr) {
    string = '';
    $('select,input[checked]').each(function() {
      string = string+$(this).attr('name')+"="+$(this).val()+"&";
    });
    return $(this).attr('id') + ".php?" + string;
  });
}