$(function() {
  // Hide registration form
  $("#registration").hide();

  // Show registration form when button pushed
  $("a.hst-toggle").click(function() {
    $("#registration").fadeIn();
    $(".to-hide").hide();
  });

  /**
   * This would automatically hide the page content and
   * display the form if the #registration anchor is
   * detected in the URL onload.
   *
   * Not recommended. The sensible alternative would be
   * to move the registration form to its own page.
   */
  /*
  var loc = document.location.toString();
  if (loc.match('#')) {
    var anchor = '#' + loc.split('#')[1];
    if ('#registration' == anchor) {
      $("#registration").fadeIn();
      $(".to-hide").hide();
    }
  }
  */

  // Hide optional form fields
  $("form .option").hide();
  $("form #source").change(function() {
      $("dd.mandatory").remove(); /* Remove any existing warnings */

      /* If "other" is selected, show and require text field */
      if ("other" == $(this).val()) {
        $(".source_other").show();
        $(".source_other :input").addClass("required");
      /* Otherwise, hide text field and make it optional again*/
      } else {
        $(".source_other").hide();
        $(".source_other :input").removeClass("required");
      }
  });
});
function changeSource(ele) {
    var form = $(ele).parents("form");
    $(".option", form).hide();  /* Hide options */
    $("dd.mandatory").remove(); /* Remove any existing warnings */

    /* Unrequire optional fields */
    $(".if-require :input", form).removeClass("required");
    $("label[for='telephone']").css("padding-left", "0.65em");
    $("label[for='telephone']").siblings("span").remove();
    $("#telephone").removeClass("required");

    /* Show options for this type and require as necessary */
    $("." + ele.value, form).show();
    $("." + ele.value + ".if-require :input", form).addClass("required");

    if (ele.value == 'appointment' || ele.value == 'estimate') {
        /* Require telephone */
        var html = "<span class='required'>*</span> <label for='telephone'>Telephone</label>";
        $("label[for='telephone']").parents("dt").html(html);
        $("label[for='telephone']").css("padding-left", "0");
        $("#telephone").addClass("required");
    }
}