$(document).ready(function() {

    $("#qq").validate({
      messages: {
        email_addr: {
          email: "A valid email address is required.",
          remote: "Unable to find a match for this email address in our system.<br />Please call Customer Service at (800) 922-9226 to setup an account."
        }
      }
    });

    var productNum = 0,
        template   = $('#productTemplate'),
        emailAddr  = $('input[name$="email_addr"]'),
        vend_num  = $('input[name$="vend_num"]');

    var xhr;
    var select = $('<select name="mbb"/>');
    $('#email_addr').change(function (event) {
        $('#email_val_failure').empty();
        if (xhr) {
            xhr.abort();
            xhr = null;
        }
        $.getJSON('/qq/email_val.pl', {email_addr:$(this).val()},
          function (data, textStatus, hqXHR) {
            var i;
            $('#mbb').empty();
            // assumes json data returned is an array
            if (data.ok === 'true') {
              if ( data.contact.length > 1) {
                for (i = 0; i < data.contact.length; i++) {
                  $('<option/>', {
                    value:
                      data.contact[i].cust_num + "!" + data.contact[i].cont_num,
                    text:
                  //    data.contact[i].name + " - " +
                   //   data.contact[i].cust_num + " - " +
                      data.contact[i].cust_address1 + ", " +
                      data.contact[i].cust_city + ", " +
                      data.contact[i].cust_state + " " +
                      data.contact[i].cust_zip
                  }).appendTo(select);
                }
                select.appendTo('#mbb');

                // label and spacing
                var mbb_text = $('<p>Your email address matches multiple branches.  Which branch is this quote for?</p>');
                mbb_text.prependTo('#mbb');
                $('<br /><br />').appendTo('#mbb');

                xhr = null;
              }
            }
            else {
              var email_val_failure = $('<p class="error">Unable to find a match for this email address in our system.<br />Please call Customer Service at (800) 922-9226 to setup an account.</p>');
              email_val_failure.appendTo('#email_val_failure');
            }
          }
        );
    });

    $.ajaxSetup({
      cache: false
    });
    function bindAutoComplete(elem) {
        elem.autocomplete({
            minLength : 0,
            selectFirst: true,
            source : function (request, response) {
              $('prod_num.${num}').addClass('ui-autocomplete-loading');
              if (xhr) {
                $('prod_num.${num}').removeClass('ui-autocomplete-loading');
                xhr.abort();
              }
              xhr = $.getJSON('/qq/suggest.pl', { email_addr: emailAddr.val(), vend_num: vend_num.val(), term: request.term }, function (data) {
                xhr = null;
                response(data);
                $('.prod_num').removeClass('ui-autocomplete-loading');
              });
              $('prod_num.${num}').removeClass('ui-autocomplete-loading');
            },
            focus : function (event, ui) {
                elem.val(ui.item.label);
                return false;
            },
            select : function (event, ui) {
                elem.val(ui.item.label);
                return false;
            },
            close : function (event, ui) {
                elem.autocomplete('close');
                $('prod_num.${num}').removeClass('ui-autocomplete-loading');
                return false;
            }
        }).data('autocomplete')._renderItem = function (ul, item) {
            $('prod_num.${num}').removeClass('ui-autocomplete-loading');
            return $('<li></li>')
                .data('item.autocomplete', item)
                .append('<a>' + item.label + '<br>' + item.desc + '<br>' + item.vendor + '</a><hr>')
                .appendTo(ul);
        };
    }
    bindAutoComplete($('.prod_num').removeClass('ui-autocomplete-loading'));

    $('#add-product').click(function () {
        var elem;
        productNum++;
        elem = template.tmpl({num : productNum});
        elem.appendTo('#products');
        elem.find('#remove-product-' + productNum).click(function () {
            elem.detach();
        });
        bindAutoComplete(elem.find('.prod_num'));
    });
});