$(document).ready(function() {

    $("a#search_show_button").click(function(){
        $("div#Search-Panel").fadeIn("slow");
        $("a.search_button").toggle();
    });    

    $("a#search_hide_button").click(function(){
        $("div#Search-Panel").fadeOut("slow");
        $("a.search_button").toggle();
    });

    $("div#Search-Panel :input#searchbox").click(function(){
        $(this).val("");
        $(this).addClass("selected");
    });

    // initialize scrollable and return the programming API
    var api = $("#scroll").scrollable({
        items: '#scrollbanner',
        size: 1,
        speed: 1000,
        clickable: false,
        loop: true
        // use the navigator plugin
        }).autoscroll({
        autoplay: true,
        autopause: true,
        interval: 8000
    }).navigator({api: true});

    $("#PauseButton").click(function(){
        api.stop();
        $(this).addClass("active");
        $("#PlayButton").removeClass("active");
    });

    $("#PlayButton").click(function(){
        api.play();
        $(this).addClass("active");
        $("#PauseButton").removeClass("active");
    });

    //
    // Payment Form Code
    //
    $("#Payment_form").validate({
        rules: {
            Account_Name: "required",
            Contact_Name: "required",
            Telephone: "required",
            Email: {
                required: true,
                email: true
            },
            Domain_Name: "required",
            Card_Holders_Name: "required",
            Card_Number: {
                required: true,
                creditcard: true
            },
            Amount_to_Charge: {
                required: true,
                number: true
            }
        }
    });

    $("#Payment_form #Card_Number").mask("9999-9999-9?999-9999",{placeholder:""});
    $("#Payment_form #Postal").mask("a9a-9a9");
    $("#Payment_form #Telephone").mask("(999) 999-9999? x99999");

    $("#Payment_form #Contact_Name").keyup(function(){
        $("#Payment_form #Card_Holders_Name").val($("#Payment_form #Contact_Name").val());
    });
    
    
    
    $("#Payment_form #domain_suffix").change(function(){
        renewal_cost();
    });
    
    $("#Payment_form #renewal_period").change(function(){
        renewal_cost();
    });
    
    function renewal_cost(){
        var renewal_period = $("#Payment_form #renewal_period").val();
        var domain_suffix = $("#Payment_form #domain_suffix").val();
        var amount = 0;

        if(domain_suffix == "ca") {
            amount = 34.95 * renewal_period;
        } else if(domain_suffix == "com" || domain_suffix == "net" || domain_suffix == "org" || domain_suffix == "biz" || domain_suffix == "info") {
            amount = 18.95 * renewal_period;
        } else if(domain_suffix == "mobi") {
            amount = 23.95 * renewal_period;
        }

        $("#Payment_form #domaincost").text(amount.toFixed(2));
        $("#Payment_form #Renewal_cost").val(amount.toFixed(2));
        $("#Payment_form #Renewal_cost_tax").val((amount*1.05).toFixed(2));
    }
    
    //
    // End Payment Form Code
    //
    
    //
    // Signup Form Code
    //
        $("#signupform #form_postal_code").mask("a9a-9a9");
    $("#signupform #form_phone").mask("(999) 999-9999? x99999");
    $("#signupform #card_number").mask("9999-9999-9?999-9999",{placeholder:""});
    $("#signupform #phone_number_to_keep").mask("(999) 999-9999");
    $("#signupform #phone_number_for_LD").mask("(999) 999-9999");
    
    $("#signupform #next_step1").click(function(){
        $("b.username").text($(":input[name='username']").val() + "@lara.on.ca");
    });

    $("#signupform #next_step2").click(function(){
        $(":input[name='card_holders_name']").val($(":input:[name='full_name']").val());
    });
       
    // Credit card validator
    $("#signupform").keydown(function(e) {
        if (e.keyCode == 13) {
            return false;
        }
    });
    
    $("#signupform").validate({
        rules: {
            card_number: {
                required: true,
                creditcard: true
            }
        }
    });

    $("#signupform #next_step3").attr("disabled", true);
    
    $("#signupform #card_number").blur(function() {
        if($("#signupform #card_number").valid()) {
            $("#signupform #next_step3").attr("disabled", false);
        } else {
            $("#signupform #next_step3").attr("disabled", true);
        }
    });

    // Displays the Order Confirmation page and removes any fields that do not exist for this service or are both optional and blank
    $("#signupform #next_step3").click(function(){
        // Package Options
        $("#oc_package").text($(":input:[name='package']").val());

        if($(":input:[name='package_term']").length === 0) {
            $("#oc_package_term").remove();
        } else {
            $("#oc_package_term b").text($(":input:[name='package_term']").val());
        }

        if($(":input:[name='modem_option']").length === 0) {
            $("#oc_modem_option").remove();
        } else {
            $("#oc_modem_option b").text($(":input:[name='modem_option']").val());
        }

        if($(":input:[name='ship_modem']").length === 0) {
            $("#oc_ship_modem").remove();
        } else {
            $("#oc_ship_modem b").text($(":input:[name='ship_modem']").val());
        }

        if($(":input:[name='keep_phone_number']").length === 0) {
            $("#oc_keep_phone_number").remove();
        } else {
            $("#oc_keep_phone_number b").text($(":input:[name='keep_phone_number']").val());
        }

        if($(":input:[name='phone_number_to_keep']").length === 0 || $(":input:[name='phone_number_to_keep']").val()=='') {
            $("#oc_phone_number_to_keep").hide();
        } else {
            $("#oc_phone_number_to_keep").show();
            $("#oc_phone_number_to_keep b").text($(":input:[name='phone_number_to_keep']").val());
        }
        
        if($(":input:[name='phone_provider']").length === 0 || $(":input:[name='phone_provider']").val()=='' ) {
            $("#oc_phone_provider").hide();
        } else {
            $("#oc_phone_provider").show();
            $("#oc_phone_provider b").text($(":input:[name='phone_provider']").val());
        }

        if($(":input:[name='circuit_id']").length === 0 || $(":input:[name='circuit_id']").val()=='' ) {
            $("#oc_circuit_id").hide();
        } else {
            $("#oc_circuit_id").show();
            $("#oc_circuit_id b").text($(":input:[name='circuit_id']").val());
        }

        $("#oc_username").text($(":input:[name='username']").val());
        $("#oc_password").text($(":input:[name='password']").val());
        

        // Contact Information Section
        $("#oc_full_name").text($(":input:[name='full_name']").val());

        if($(":input:[name='company']").val()=='') {
            $("#oc_company").hide();
        } else {
            $("#oc_company").show();
            $("#oc_company b").text($(":input:[name='company']").val());
        }

        $("#oc_address").text($(":input:[name='address']").val());
        $("#oc_city").text($(":input:[name='city']").val());
        $("#oc_province").text($(":input:[name='province']").val());
        $("#oc_postal").text($(":input:[name='postal']").val());
        $("#oc_phone").text($(":input:[name='phone']").val());
        if($(":input:[name='email']").val()=='') {
            $("#oc_email").hide();
        } else {
            $("#oc_email").show();
            $("#oc_email b").text($(":input:[name='email']").val());
        }
        
        // Billing Information - only listed the card type and not other info
        $("#oc_credit_card").text($(":input:[name='credit_card']").val());
    });

    //
    // End Signup Form Code
    //
    
    // popup images
    xOffset = -15;
    yOffset = -20;
        
    // these 2 variable determine popup's distance from the cursor
    // you might want to adjust to get the right result
    
    /* END CONFIG */
    $("a.preview").click(function(e){
        this.t = this.title;
        this.title = "";    
        var c = (this.t != "") ? "<br/>" + this.t : "";
        $("body").append("<p id='preview'><img src='"+ this.href +"' alt='Image preview' />"+ c +"</p>");                                 
        $("#preview")
            .css("top", "25%")
            .css("left", "25%")
            .fadeIn("fast");
        return false;
    },
    function(){
        this.title = this.t;    
        $("#preview").remove();
    });    
});