/*
 * UI functions for BankBytte. 
 */
// To avoid flash of unstyled content
//$('head').append('<style type="text/css">.options {display:none}</style>');
//$('head').append('<style type="text/css">.kontorad {display:none}</style>');
//$('head').append('<style type="text/css">.laanerad {display:none}</style>');
$('head').append('<style type="text/css">.productbox {display:none}</style>');

var poststed_json_url = "/services/ps";
var bankbytteValidationRules = {
    rules : {
        produktvalg : {
            required : true,
            tilbyrProdukt : true
        },
        nyBank : {
            required : true
        },
        naaBank : {
            required : true
        },
        laanetype1 : {
            tilbyrLaan : true
        },
        laanetype2 : {
            tilbyrLaan : true
        },
        laanetype3 : {
            tilbyrLaan : true
        },
        laanetype4 : {
            tilbyrLaan : true
        },
        fornavn : {
            required : true,
            minlength : 2
        },
        etternavn : {
            required : true,
            minlength : 2
        },
        postnr : {
            required : true,
            minlength : 4,
            maxlength : 4,
            digits : true
        },
        poststed : {
            required : true
        },
        telefonnr : {
            required : true,
            digits : true,
            minlength : 8,
            maxlength : 8
        },
        epost : {
            required : false,
            email : true
        },
        godkjenn : "required"
    },
    messages : {
        produktvalg : {
            required : "(Velg tjeneste)"
        },
        nyBank : {
            required : "(Velg ny bank)"
        },
        naaBank : {
            required : "(Velg din bank)"
        },
        fornavn : {
            required : "(Skriv inn fornavn)",
            minlength : "(Skriv inn fornavn, minumum 2 bokstaver)"
        },
        etternavn : {
            required : "(Skriv inn etternavn",
            minlength : "(Skriv inn etternavn, minumum 2 bokstaver)"
        },
        postnr : {
            required : "(Skriv inn postnummer, fire siffer)",
            minlength : "(Skriv inn postnummer, fire siffer)",
            maxlength : "(Skriv inn postnummer, fire siffer)",
            digits : "(Skriv inn postnummer, fire siffer)"
        },
        poststed : {
            required : "(Skriv inn poststed)"
        },
        telefonnr : {
            required : "(Skriv inn telefonnummer)",
            minlength : "(Skriv inn telefonnummer, åtte siffer)",
            maxlength : "(Skriv inn telefonnummer, åtte siffer)",
            digits : "(Skriv inn telefonnummer, åtte siffer)"
        },
        epost : {
            email : "(Epostadressen er ikke gyldig)"
        }
    },
    errorPlacement : function(error, element) {
        error.appendTo(element.siblings("span"));
    },
    highlight : function(element, errorClass) {
        $(element).addClass("inputerror");
    },
    unhighlight : function(element, errorClass) {
        $(element).removeClass("inputerror");
    }
};

var formwizardConfig = {
    historyEnabled : true,
    formPluginEnabled : true,
    validationEnabled : true,
    afterNext : formWizardStateHandler,
    afterBack : function(wizardData) {
        toggleWizardNavigation();
    
        if (wizardData.previousStep == "steg_personalia") {
            /*
             * Sikrer at neste-knappen enables hvis den er disabled pga. manglende
             * godkjenning.
             */
            $("#bankbytteForm span.next").removeClass("disabled");
            $("#bankbytteForm input.next").removeClass("disabled");
            $("#bankbytteForm input.next").css("cursor", "pointer");
            $('#bankbytteForm input.next').removeAttr('disabled');
        }
    },
    textSubmit : "Send til bank",
    textNext : "Neste",
    textBack : "Forrige"
};

function toggleGodkjenning() {
    if (window.location.hash == "#_steg_personalia") {
        if ($('#godkjenn').attr('checked')) {
            $("#bankbytteForm span.next").removeClass("disabled");
            $("#bankbytteForm input.next").removeClass("disabled");
            $("#bankbytteForm input.next").css("cursor", "pointer");
            $('#bankbytteForm input.next').removeAttr('disabled');
        } else {
            $("#bankbytteForm span.next").addClass("disabled");
            $("#bankbytteForm input.next").addClass("disabled");
            $("#bankbytteForm input.next").css("cursor", "default");
            $("#bankbytteForm input.next").attr("disabled", "disabled");
        }
    }
};

function showDivs() {
    if ($("#produkt").val() == "alle") {
        $("div.options").show();
    } else if ($("#produkt").val() == "dagligbank") {
        $("div.options").hide();
        $("#kredittkort").show();
        $("#bankkort").show();
        $("#banksparing").show();
    } else {
        $("div.options").hide();
        if ($("#produkt").val() && $("#" + $("#produkt").val())) {
            $("#" + $("#produkt").val()).show();
        }
    }
}

function formWizardStateHandler(wizardData) {
    toggleWizardNavigation();
    var formWizardHandleProduktopplysninger = function() {
        switch ($("#produkt").val()) {
        case 'alle':
            $("tbody.options").show();
            break;
        case "dagligbank":
            $("tbody.options").hide();
            $("#kredittkortseksjon").show();
            $("#bankkortseksjon").show();
            $("#banksparingseksjon").show();

            $("#sl_kredittkort").show();
            $("#sl_bankkort").show();
            $("#sl_banksparing").show();
            break;
        default:
            $("tbody.options").hide();
            if ($("#produkt").val() && $("#" + $("#produkt").val() + "seksjon")) {
                $("#" + $("#produkt").val() + "seksjon").show();
                if ($("#sl_" + $("#produkt"))) {
                    $("#sl_" + $("#produkt").val()).show();
                }
            }
        }

        $('#kvitteringnybank').text($('#nyBankCache').val());
        $('#kvitteringproduktvalgTekst').text($('#produkt option:selected').text());
        $('#kvitteringdinbank').text($('#naaBankCache').val());
        for (i = 1; i <= 4; ++i) {
            if ($('#kontotype' + i + ' option:selected').val() != "") {
                $('#kontotyperad' + i).removeClass('invisible');
                $('#kontotyperad' + i + ' td.right').text($('#kontotype' + i + ' option:selected').text());
            } else {
                $('#kontotyperad' + i).addClass('invisible');
            }
        }

        for (i = 1; i <= 4; ++i) {
            if ($('#laanetype' + i + ' option:selected').val() != "") {
                $('#laanrad' + i).removeClass('invisible');
                $('#laanrad' + i + ' td.right').text($('#laanetype' + i + ' option:selected').text());
            } else {
                $('#laanrad' + i).addClass('invisible');
            }
        }

        if ($('#korttype option:selected').val() != "") {
            $('#kredittkortseksjon').removeClass('invisible');
            $('#kvitteringkredittkort').text($('#korttype option:selected').text());
        } else {
            $('#kredittkortseksjon').addClass('invisible');
        }

        if ($('#bankkorttype option:selected').val() != "") {
            $('#bankkortseksjon').removeClass('invisible');
            $('#kvitteringbankkort').text($('#bankkorttype option:selected').text());
        } else {
            $('#bankkortseksjon').addClass('invisible');
        }
        toggleGodkjenning();
    };

    var formWizardHandlePersonalia = function() {
        $('#kvitteringfornavn').text($('#fornavn').val());
        $('#kvitteringetternavn').text($('#etternavn').val());
        $('#kvitteringpostnr').text($('#postnr').val());
        $('#kvitteringpoststed').text($('#poststed').val());
        $('#kvitteringadresse1').text($('#adresse1').val());
        $('#kvitteringtelefonnr').text($('#telefonnr').val());
        $('#kvitteringadresse2').text($('#adresse2').val());
        $('#kvitteringepost').text($('#epost').val());
    };

    if (!wizardData) // Gjennoppretter tilstand ved refresh.
    {
        $('#nyBank').val($('#nyBankCache').val());
        $('#naaBank').val($('#naaBankCache').val());
        formWizardHandleProduktopplysninger();
        formWizardHandlePersonalia();
        if (window.location.hash == "#_steg_kvittering") {
            $('#steg_kvittering').show();
        } else {
            $('#steg_kvittering').hide();
        }
    } else {
        switch (wizardData.previousStep) {
        case "steg_produktopplysninger":
            formWizardHandleProduktopplysninger();
            break;
        case "steg_personalia":
            formWizardHandlePersonalia();
            break;
        }
    }
};

function toggleWizardNavigation() {
    if (window.console) {
        console.info("toggleWizardNavigation: " + window.location.hash);
    }
    switch (window.location.hash) {
    case "#_steg_produktopplysninger":
        if (window.console) {
            console.info("toggleWizardNavigation: showing produktopplysninger");
        }
        $('#bankbytte_navigation li:nth-child(1)').html('<img src="/images/ic_one.gif"/><span>Produktopplysninger &gt; </span>');
        $('#bankbytte_navigation li:nth-child(2)').html('<img src="/images/ic_two_disabled.gif"/><span class="disabled">Personopplysninger &gt; </span>');
        $('#bankbytte_navigation li:nth-child(3)').html('<img src="/images/ic_three_disabled.gif"/><span class="disabled">Kontroller opplysninger &gt; </span>');
        $('#bankbytte_navigation li:nth-child(4)').html('<img src="/images/ic_four_disabled.gif"/><span class="disabled">Kvittering </span>');
		$('#published_information').hide();
        break;
    case "#_steg_personalia":
        if (window.console) {
            console.info("toggleWizardNavigation: showing personalia");
        }
        $('#bankbytte_navigation li:nth-child(1)').html('<img src="/images/ic_one_disabled.gif"/><span class="disabled">Produktopplysninger &gt; </span>');
        $('#bankbytte_navigation li:nth-child(2)').html('<img src="/images/ic_two.gif"/><span>Personopplysninger &gt; </span>');
        $('#bankbytte_navigation li:nth-child(3)').html('<img src="/images/ic_three_disabled.gif"/><span class="disabled">Kontroller opplysninger &gt; </span>');
        $('#bankbytte_navigation li:nth-child(4)').html('<img src="/images/ic_four_disabled.gif"/><span class="disabled">Kvittering </span>');
		$('#published_information').hide();
        break;
    case "#_steg_kontroll":
        if (window.console) {
            console.info("toggleWizardNavigation: showing kontroller opplysninger");
        }
        $('#bankbytte_navigation li:nth-child(1)').html('<img src="/images/ic_one_disabled.gif"/><span class="disabled">Produktopplysninger &gt; </span>');
        $('#bankbytte_navigation li:nth-child(2)').html('<img src="/images/ic_two_disabled.gif"/><span class="disabled">Personopplysninger &gt; </span>');
        $('#bankbytte_navigation li:nth-child(3)').html('<img src="/images/ic_three.gif"/><span>Kontroller opplysninger &gt; </span>');
        $('#bankbytte_navigation li:nth-child(4)').html('<img src="/images/ic_four_disabled.gif"/><span class="disabled">Kvittering </span>');
		$('#published_information').show();
        break;
    case "#_steg_kvittering":
        if (window.console) {
            console.info("toggleWizardNavigation: showing kvittering");
        }
        $('#bankbytte_navigation li:nth-child(1)').html('<img src="/images/ic_one_disabled.gif"/><span class="disabled">Produktopplysninger &gt; </span>');
        $('#bankbytte_navigation li:nth-child(2)').html('<img src="/images/ic_two_disabled.gif"/><span class="disabled">Personopplysninger &gt; </span>');
        $('#bankbytte_navigation li:nth-child(3)').html('<img src="/images/ic_three_disabled.gif"/><span class="disabled">Kontroller opplysninger &gt; </span>');
        $('#bankbytte_navigation li:nth-child(4)').html('<img src="/images/ic_four.gif"/><span>Kvittering </span>');
		$('#published_information').show();
        break;
    }
};

$(document).ready(function() {
    if(/Chrome/.test(navigator.userAgent)) {
        $("#bankbytteError")
            .html("Merk: det finnes kjente problemer med Google Chrome og 'Bytt bank' tjenesten.<br/>Dette påvirker spesielt FORRIGE/NESTE knappene.")
            .show();        
    }
    
	$("#bankbytte_navigation").after('<div id="productbox_loader_image" style="margin-left:229px"><img src="/images/ventesymbol_stort.gif"/><p/></div>');
	
	if ($('#produkt').val() == ''){	
		$(':input', "#bankbytteForm").not(':button, :submit, :reset, .next, .previous,#forespoersel').val('').removeAttr('checked').removeAttr('selected');
	}
	
	$('#nyBankCache, #naaBankCache').val('');



    $("#postnr").blur(function() {
        $("#poststed").attr('disabled', 'disabled');
        $.getJSON(poststed_json_url, {
            "pn" : $("#postnr").val()
        }, function(data) {
            $("#poststed").val(data.poststed);
            if ($("#poststed").val() != "") {
                $("#telefonnr").focus();
            }
        });
        $("#poststed").removeAttr('disabled');
    });

    $("#produktvalgTekst").val($('#produkt :selected').text());
    $(".kontorad").hide();
    $(".laanerad").hide();
    $("div.options").hide();
    showDivs();

    if ($("#antallkonto").val() == "2") {
        $("#konto2").show();
    } else if ($("#antallkonto").val() == "3") {
        $("#konto2").show();
        $("#konto3").show();
    } else if ($("#antallkonto").val() == "4") {
        $(".kontorad").show();
    }

    if ($("#antalllaan").val() == "2") {
        $("#laan2").show();
    } else if ($("#antalllaan").val() == "3") {
        $("#laan2").show();
        $("#laan3").show();
    } else if ($("#antalllaan").val() == "4") {
        $(".laanerad").show();
    }

    // show divs based on selected
    $("#produkt").change(function() {
        submit = true;
        showDivs();
        // get text from select
        $("#produktvalgTekst").val($('#produkt :selected').text());
    });

    // show input fields based on user click
    $("#leggtil1").click(function() {
        $("#konto2").show();
        $("#antallkonto").val("2");
    });
    $("#leggtil2").click(function() {
        $("#konto2").show();
        $("#konto3").show();
        $("#antallkonto").val("3");
    });
    $("#leggtil3").click(function() {
        $(".kontorad").show();
        $("#antallkonto").val("4");
    });

    $("#leggtillaan1").click(function() {
        $("#laan2").show();
        $("#antalllaan").val("2");
    });
    $("#leggtillaan2").click(function() {
        $("#laan2").show();
        $("#laan3").show();
        $("#antalllaan").val("3");
    });
    $("#leggtillaan3").click(function() {
        $("#laan2").show();
        $("#laan3").show();
        $("#laan4").show();
        $("#antalllaan").val("4");
    });

    // Egendefinert valideringsmetode for å sjekke om valgt
    // leverandør tilbyr valgt produkt
    jQuery.validator.addMethod("tilbyrProdukt", function(value, element) {
        if (nyBankValgt) {
            if (element.value == "laan" && ($("#tilbyr_boliglan").val() == "nei" && $("#tilbyr_forbrukslan").val() == "nei")) {
                return false;
            } else if (element.value == "dagligbank" && $("#tilbyr_dagligbank").val() == "nei") {
                return false;
            } else if (element.value == "banksparing" && $("#tilbyr_banksparing").val() == "nei") {
                return false;
            } else if (element.value == "kredittkort" && $("#tilbyr_kredittkort").val() == "nei") {
                return false;
            }
        }
        return true;
    }, "(Banken du har valgt tilbyr ikke dette produktet)");

    // Egendefinert valideringsmetode for å sjekke om valgt lånetype
    // er gyldig
    jQuery.validator.addMethod("tilbyrLaan", function(value, element) {
        if (nyBankValgt && $("#produkt").val() == "laan" && element.value != "") {
            if ($("#tilbyr_boliglan").val() == "ja" && $("#tilbyr_forbrukslan").val() == "nei") {
                if (element.value == "Forbrukslån") {
                    return false;
                }
            } else if ($("#tilbyr_boliglan").val() == "nei" && $("#tilbyr_forbrukslan").val() == "ja") {
                if (element.value != "Forbrukslån") {
                    return false;
                }
            }
        }
        return true;
    }, "(Banken du har valgt tilbyr ikke denne lånetypen)");

    // validate personalia
    var produktopplysningerValidator = $("#bankbytteForm").validate(bankbytteValidationRules);

    $("#bankbytteForm").formwizard(formwizardConfig, {
            // Validation settings
        }, {
            // Form plugin settings
            type : "post",
            beforeSubmit : bankBytteBeforeSubmit,
            success : bankBytteOnSuccess
    });
    // Handled in afterNext(), ref formwizardConfig
    // $('.ajax_form_controls input').click(toggleWizardNavigation);

    var wizardState = $("#bankbytteForm").formwizard("state");
    if ('steg_produktopplysninger' != wizardState.currentStep) {
        if (window.console) {
            console.info("Resetting wizard");
        }
        $("#bankbytteForm").formwizard("reset");
    }

    formWizardStateHandler();

    $("#bankbytteForm .next").click(toggleGodkjenning);
    $("#godkjenn").click(toggleGodkjenning);

    $("#productbox_loader_image").remove();
    $(".productbox").show();
});