﻿//REMEMBER  - Javascript is global. So make sure you use some kinda distinction when naming your controls. 
//          - btnSubmit on one control needs to be distinguished from another btnSubmit created on another control.
//          - This problem is apparent when you have two forms (with similarly named controls) created independantly
//            & loaded on the same page.

//This is my namespace.
var MailingList = function() {

    $(document).ready(function() {


        // Hide Notifivations
    $(".mailing-list-form #MailingListsendingMessage").hide();
    $(".mailing-list-form #MailingListconfirmationMessage").hide();
    $(".mailing-list-form #MailingListerrorMessage").hide();

        // set up the focus behavior handler for all form text boxes.
        $(".mailing-list-form .defaultText").focus(function(srcc) {
            if ($(this).val() == $(this)[0].title) {
                $(this).removeClass("defaultTextActive");
                $(this).val("");
            }
        });

        // set up the blur behavior handler for all form text boxes.
        $(".mailing-list-form .defaultText").blur(function() {
            if ($(this).val() == "") {
                $(this).addClass("defaultTextActive");
                $(this).val($(this)[0].title);
            }
        });

        // Blur all text boxes.
        $(".mailing-list-form .defaultText").blur();

        // Set up the click handler for the form button.
        $(".mailing-list-form #btnSignUp").click(function() {
            disableMailingListSubmit();
            var isMailingListFormValid = validateMailingListInput()
            if (isMailingListFormValid) {
                sendMailingListForm();
            } else {
                enableMailingListSubmit();
            }
        });

    });

    function resetMailingListFormFields() {
        $($(".mailing-list-form #txtName")).val($($(".mailing-list-form #txtName"))[0].title);
        $($(".mailing-list-form #txtMailingListEmail")).val($($(".mailing-list-form #txtMailingListEmail"))[0].title)
        $(".mailing-list-form .defaultText").addClass("defaultTextActive");
    }

    function enableMailingListSubmit() {
        $(".mailing-list-form #btnSignUp").removeAttr('disabled');
        $(".mailing-list-form #btnSignUp").attr("value", "Join Mailing List");
    }

    function disableMailingListSubmit() {
        $(".mailing-list-form #btnSignUp").attr("disabled", "true");
        $(".mailing-list-form #btnSignUp").attr("value", "Please Wait...");
    }

    function IsMailingListFieldEmpty(String) {
        if ((String.trim().length == 0) ||
    (String.trim() == null)) {
            return true;
        }
        else { return false; }
    }

    function validateMailingListInput() {
        var isMailingListValid = true;
        if (!validateMailingListFullName()) { isMailingListValid = false };
        if (!validateMailingListEmail()) { isMailingListValid = false };       
        return isMailingListValid;
    }

    function validateMailingListFullName() {
       
        var isValid = true;
        // validate full name.
        if ($(".mailing-list-form #txtName").attr("title") == $(".mailing-list-form #txtName").val() || IsMailingListFieldEmpty($(".mailing-list-form #txtName").val())) {
            isValid = false;
            $(".mailing-list-form #MailingListFullNameValidator").html("Full name is a required field.");
            $(".mailing-list-form #MailingListFullNameValidator").slideDown("slow");
        } else {
        $(".mailing-list-form #MailingListFullNameValidator").hide();
        }      
        return isValid;
        
    }

    function validateMailingListEmail() {            
        var isValid = true;
        // validate email address.
        if ($(".mailing-list-form #txtMailingListEmail").attr("title") == $(".mailing-list-form #txtMailingListEmail").val() || IsMailingListFieldEmpty($(".mailing-list-form #txtMailingListEmail").val())) {
            isValid = false;
            $(".mailing-list-form #MailingListEmailValidator").html("Email is a required field.");
            $(".mailing-list-form #MailingListEmailValidator").slideDown("slow");
        } else {
        $(".mailing-list-form #MailingListEmailValidator").hide();
        }       
        return isValid;
    }

    function sendMailingListForm() {
   
        $(".mailing-list-form #MailingListsendingMessage").slideDown("slow");
        $(".mailing-list-form #MailingListconfirmationMessage").hide();
        $(".mailing-list-form #MailingListerrorMessage").hide();

        var fullName = $(".mailing-list-form #txtName").val();
        var emailAddress = $(".mailing-list-form #txtMailingListEmail").val();

        $.ajax({
            type: "POST",
            url: "App_Services/Mailing-List.asmx/Subscribe",
            data: "{'fullName':'" + fullName + "','emailAddress':'" + emailAddress + "'}",
            contentType: "application/json; charset=utf-8",
            dataType: "json",
            success:
            function(msg) {
                if (msg.d == "Success") {

                    $(".mailing-list-form #MailingListconfirmationMessage").slideDown("slow");
                    $(".mailing-list-form #MailingListsendingMessage").hide("slow");
                    resetMailingListFormFields();
                    enableMailingListSubmit();
                } else {

                $(".mailing-list-form #MailingListerrorMessage").slideDown("slow");
                $(".mailing-list-form #MailingListsendingMessage").hide("slow");
                    enableMailingListSubmit();
                }
            },
            error: function(xhr, status, error) {
                // Display a generic error for now.
            $(".mailing-list-form #MailingListsendingMessage").hide("slow");
            $(".mailing-list-form #MailingListerrorMessage").slideDown("slow");
                enableMailingListSubmit();
            }
        });


    }

} ();

//String.prototype.trim = function() {
//    return this.replace(/^\s*/, "").replace(/\s*$/, "");
//}