$(function () {
    $(".btnsearch.original a").click(function () {
        showOemSearch();
    });

    $(".btnsearch.accessories a").click(function () {
        showPartSearch();
    });

    

});

function showPartSearch() {

    destroyCalloutSearches();

    var html = "<div class='accessoriessearch call'>" + $("#accessoriessearch").html() + "</div>";
    // alert(html);
    $(".btnsearch.accessories").callout({
        msg: html,
        position: "right",
        align: "top",
        pointer: "top"
    });

    bindHideCallouts();


    var part = getParameterByName("search");
    if (part != null && part.length > 0) {
        $(".call input.input-part").val(part);
    }

    $("input.search-button.accessory-search").click(function () {
        var part = $(".call input.input-part").val();
        if (part.length == 0) {
            alert("Please enter a part number");
        }
        else {
            window.location = "/PartSearch.aspx?search=" + part;
        }
    });

    $(".call input.input-part").Watermark($(".call input.input-part").attr("title"));
    $(".call input.input-part").keypress(function (e) {
        code = (e.keyCode ? e.keyCode : e.which);
        if (code == 13) {
            $("input.search-button.accessory-search").click();
            e.preventDefault();
        }
      
    });

}
 

    function showOemSearch() {
        destroyCalloutSearches();
        var searchform = $($("#originalsearch").clone());

        // wrap in div
        var html = "<div class='originalsearch call'>" + searchform.html() + "</div>";

        // show the callout
        $(".btnsearch.original").callout({
            msg: html,
            position: "right",
            align: "top",
            pointer: "top"
        });

        // do the IE fix for select
        $(".call .select-part").ieSelectWidth
                        ({
                            containerClassName: 'select-container',
                            overlayClassName: 'select-overlay'
                        });

        // populate intial dropdown
        optionsModel(".call .select-model");
        bindSelectChanges(".call .select-model", ".call .select-year", ".call .select-part");

        // bind the close buttons
        bindHideCallouts();

        // bind the search button
        $("input.search-button.original-search").click(function () {
            //http://www.jerseyh-d.com/Components.aspx?model=Softail&year=1999&part=163
            var model = $(".call .select-model").val();
            var year = $(".call .select-year").val();
            var part = $(".call .select-part").val();
            if (model.length == 0 || year.length == 0 || part.length == 0)
                alert("Please select a model, year and part.");
            else
                window.location = "/Components.aspx?model=" + model + "&year=" + year + "&part=" + part;
        });
    }

    //var modelOption;
    function optionsModel(selector) {

        var modelOption = selector;
        ajaxoem("Models", "{}", function (msg) {
            var models = msg.d;
            //alert($(modelOption).html);
            // alert(modelOption);
            enable(modelOption);
            $(modelOption).html("").append($("<option/>").html("Select model").val(""));

            for (var a in models) {
                $(modelOption).append($("<option/>").html(models[a]).val(models[a]));
            }

            // call cahnge event if it has a model on the qs.
            var model = getParameterByName("model");
            if (model != null && model.length > 0) {
                $(modelOption).val(model);
                $(modelOption).change();
            }
        });
    }

    function getParameterByName(name) {

    var match = RegExp('[?&]' + name + '=([^&]*)')
                    .exec(window.location.search);

    return match && decodeURIComponent(match[1].replace(/\+/g, ' '));

}

      function bindSelectChanges(model, year, part) {
          $(model).change(function () {
              if ($(this).val().length == 0)
                  return;
              disable(year); disable(part);
              var data = "{model:'" + $(this).val() + "'}";
              ajaxoem("Years", data, function (msg) {
                  var years = msg.d;
                  $(year).html("").append($("<option/>").html("Select year").val(""));
                  for (var a in years) {
                      $(year).append($("<option/>").html(years[a]).val(years[a]));
                  }
                  enable(year);

                  var yearqs = getParameterByName("year");
                  if (yearqs != null && yearqs.length > 0) {
                      $(year).val(yearqs);
                      $(year).change();
                  }
              });
          });
          $(year).change(function () {
              disable(part);
              var data = "{model:'" + $(model).val() + "',year:" + $(this).val() + "}";
              ajaxoem("Parts", data, function (msg) {
                  var parts = msg.d;
                  //alert(parts.length);
                  $(part).html("").append($("<option/>").html("Select part").val(""));
                    for (var i=0;i<parts.length;i++) {
                		var r = parts[i];
                      $(part).append($("<option/>").html(r.Name).val(r.ID));
                  }
                  enable(part);
                
                  var partqs = getParameterByName("part");
                  if (partqs != null && partqs.length > 0) {
                      $(part).val(partqs);
                      
                  }
              });
          });
      }

      function disable(element) {
          $(element).html("").attr('disabled', 'disabled');
      }

      function enable(element) {
         // alert(element);
         // alert($(element));
          $(element).removeAttr('disabled');
      } 

    function ajaxoem(method, data, complete) {
        $.ajax({
            type: "POST",
            url: "/services/oemservice.asmx/" + method,
            data: data,
            contentType: "application/json; charset=utf-8",
            dataType: "json",
            success: complete,
            error: function (jqXHR, textStatus, errorThrown) {
                //alert(errorThrown);
            }
        });
    }

  

    function bindHideCallouts() {

        $("a.callout-close").click(function () {
            destroyCalloutSearches();
        });
    }

    function destroyCalloutSearches() {
        $(".original").callout("destroy");
        $(".accessories").callout("destroy");
    }