// Reference a file-based JavaScript 
/// <reference path="~/content/js/jquery/jquery-1.4.2.js" />
/// <reference path="~/content/js/danskit/danskit.notifier.js" />
/// <reference path="~/content/js/danskit/danskit.common.js" />
/// <reference path="~/content/js/jquery/jquery.validate-min.js" />

var ctrlSuffix_txtZipCode = "ZipCode";

$(document).ready(function () {
    SetupDefaultValidation();
    SetupCityAutoComplete();

    // add styling to all fieldset- and legend tags:
    $("legend").addClass("ui-state-default ui-corner-all");
    $("button, input:submit, input:button, .button").button();
    $('select').not('.multiselect').selectmenu({ style: 'dropdown', maxHeight: 250, close: function (e) { $("form").validate().element($(this)); } });
    $(".datepicker, .date").datepicker({
        dateFormat: 'dd-mm-yy',
        nextText: 'Frem',
        prevText: 'Tilbage',
        changeYear: true,
        changeMonth: true,
        firstDay: 1,
        yearRange: '1900:2010',
        dayNames: ['Søndag', 'Mandag', 'Tirsdag', 'Onsdag', 'Torsdag', 'Fredag', 'Lørdag'],
        dayNamesShort: ['Søn', 'Man', 'Tir', 'Ons', 'Tor', 'Fre', 'Lør'],
        dayNamesMin: ['Sø', 'Ma', 'Ti', 'On', 'To', 'Fr', 'Lø'],
        monthNames: ['Januar', 'Februar', 'Marts', 'April', 'Maj', 'Juni', 'Juli', 'August', 'September', 'Oktober', 'November', 'December'],
        monthNamesShort: ['Jan','Feb','Mar','Apr','Maj','Jun','Jul','Aug','Sep','Okt','Nov','Dec']


    });
});   


function SetupCityAutoComplete() {

	// find controls:
	var cityControls = $('input[name$=' + ctrlSuffix_txtZipCode + ']');

	if (cityControls.length > 0) {
		var dataSource = Strings.Urls._CompanyHandlerUrl;

		$(cityControls).each(function(index) {
			
			$(this).autocomplete({
				source: function (request, response) {
						$.ajax(
						{
							contentType: "application/json"                    
							, url: dataSource
								, data: {
									m: "GetCityByZip"
								, maxRows: 10
								, q: request.term
								}
							, success: function (data, textStatus, XMLHttpRequest) {
								response($.map(data, function (item) {
									return {
										label: item.ZipCode + " (" + item.City + ")",
										value: item.ZipCode,
										zipCode: item.ZipCode,
										city: item.City
									}
								}))
							}
							, complete: function (XMLHttpRequest, textStatus) {
								// alert(textStatus);
							}
							, error: function (XMLHttpRequest, textStatus, errorThrown) {
								// alert(errorThrown);
							}
						})
					},
					minLength: 2,
					select: function (event, ui) {					    
					    if (this != undefined) {
					        if (ui.item != undefined) {
					            $(this).parent().children('input[name$=City]').val(ui.item.city);
					            $(this).val(ui.item.zipCode);
					        }
					    }
					},
					open: function () {
						$(this).removeClass("ui-corner-all").addClass("ui-corner-top");
					},
					close: function () {
						$(this).removeClass("ui-corner-top").addClass("ui-corner-all");
					}
				})
				.data("autocomplete")._renderItem = function (ul, item) {
					$(item).removeClass("ui-corner-all").addClass("ui-corner-top");
					return $("<li></li>")
						.data("item.autocomplete", item)
						.append("<a class='ui-menu-item-link'> <div class='ui-menu-item-title'>" + item.zipCode + "</div> <div class='ui-menu-item-subtitle'>" + item.city + "</div> </a>")
						.appendTo(ul);

				};
			});

	} //end outer-if

} // end function


/* VALIDATION: 
 * *********** */ 
function SetupDefaultValidation() {
	
    $.validator.setDefaults({ 
        debug: true 
        , submitHandler: DefaultValidatorSubmitHandler
		, success: DefaultOnValidatorSuccess
		, invalidHandler: DefaultOnValidatorInvalid
		, errorPlacement: DefaultOnValidatorErrorPlacement
		, ignore: ".ignore" 
		, highlight: function (input, errorCss) { 
            var input = $(input);
            switch (input.tagName()) {                
                case 'select':                    
                    if( input.css('display') == 'none')  {
                        var selectmenu = $("+ .ui-selectmenu", input);
                        selectmenu.addClass("error");
                    }
                    break;
                default:
                    input.addClass("ui-state-highlight error"); 
                    break;
            }
                
        }
		, unhighlight: function (input) { 
                var input = $(input);
            switch (input.tagName()) {                
                case 'select':                    
                    if( input.css('display') == 'none')  {
                        var selectmenu = $("+ .ui-selectmenu", input);
                        selectmenu.removeClass("error"); 
                    }
                    break;
                default:
                    input.removeClass("ui-state-highlight error"); 
                    break;
            }
        }
		, showErrors: function (errorMap, errorList) {
				
			for (var i = 0; errorList[i]; i++) {
				var element = this.errorList[i].element;
				// remove existing error label thus forcing the validator to recreate it
				// (that is: recreation == call to errorplacement function)
				this.errorsFor(element).remove();
			}
			this.defaultShowErrors();
		}
        , onfocusout: function(element) { this.element(element); }
        , onkeyup: function(element) { this.element(element); }
    
    });

	$.extend($.validator.messages, {
		required: "Dette felt skal udfyldes.",
		remote: "Please fix this field.",
		email: "Angiv venligst en gyldig email.",
		url: "Angiv venligst en gyldig URL.",
		date: "Angiv venligst en gyldig dato.",
		dateISO: "Angiv venligst en gyldig ISO dato.",
		number: "Angiv venligst en gyldigt nummer.",
		digits: "Angiv venligst kun tal.",
		creditcard: "Angiv venligst en gyldigt kreditkort nummer.",
		equalTo: "Angiv venligst den samme værdi igen.",
		accept: "Angiv venligst en streng med en gyldig extension.",
		maxlength: $.validator.format("Angiv venligst kun op til {0} tegn."),
		minlength: $.validator.format("Angiv venligst mindst {0} tegn."),
		rangelength: $.validator.format("Angiv venligst en værdi på mindst {0} og maks {1} tegn."),
		range: $.validator.format("Angiv venligst en værdi imellem {0} og {1}."),
		max: $.validator.format("Angiv venligst en værdi der er mindre eller lig med {0}."),
		min: $.validator.format("Angiv venligst værdi der er større eller lig med {0}.")
	});


	// Add custom validation aliases (methods) and messages:      
	  $.validator.addMethod("requiredCompanyName", $.validator.methods.required, "Firma navn skal udfyldes");
	  $.validator.addMethod("minlengthCompanyName", $.validator.methods.minlength, $.format("Firma navn skal være på mindst {0} tegn"));
	  $.validator.addClassRules("vCompanyName", { requiredCompanyName: true, minlengthCompanyName: 2 });

	  $.validator.addMethod("requiredContactPerson", $.validator.methods.required, "Kontaktperson navn skal udfyldes");
	  $.validator.addClassRules("vContactPerson", { requiredCompanyName: true, minlengthCompanyName: 2 });


	  $.validator.addMethod("requiredPhoneNumber", $.validator.methods.required, "Telefonnummer skal udfyldes!");
	  $.validator.addMethod("minlengthPhoneNumber", $.validator.methods.minlength, $.format("Telefonnummer skal være på mindst {0} tegn"));
	  $.validator.addMethod("digitsPhoneNumber", $.validator.methods.digits, $.format("Telefonnummer må kun indeholde tal."));
	  $.validator.addClassRules("vPhoneNumber", { minlengthPhoneNumber: 8, requiredPhoneNumber: true, digitsPhoneNumber: true });

	  
	  $.validator.addMethod("requiredFirstName", $.validator.methods.required, "Fornavn skal udfyldes!");
	  $.validator.addMethod("minlengthFirstName", $.validator.methods.minlength, $.format("Fornavn skal være på mindst {0} tegn"));
	  $.validator.addClassRules("vFirstName", { requiredFirstName: true, minlengthFirstName: 2 });

	  $.validator.addMethod("requiredLastName", $.validator.methods.required, "Efternavn skal udfyldes!");
	  $.validator.addMethod("minlengthLastName", $.validator.methods.minlength, $.format("Efternavn skal være på mindst {0} tegn"));
	  $.validator.addClassRules("vLastName", { requiredLastName: true, minlengthLastName: 2 });

	  $.validator.addMethod("requiredUserName", $.validator.methods.required, "Brugernavn skal udfyldes!");
	  $.validator.addMethod("minlengthUserName", $.validator.methods.minlength, $.format("Brugernavn skal være på mindst {0} tegn"));
	  $.validator.addClassRules("vUsername", { requiredUserName: true, minlengthUserName: 2 });

	  $.validator.addMethod("requiredEmail", $.validator.methods.required, "Email skal udfyldes!");        
	  $.validator.addClassRules("vEmail", {  requiredEmail: true, email: true});

	  $.validator.addMethod("requiredGender", $.validator.methods.required, "Køn skal angives!");       
	  $.validator.addClassRules("vGender", { requiredGender: true });

	  $.validator.addMethod("requiredBirthDay", $.validator.methods.required, "Fødselsdato skal udfyldes!");
	  $.validator.addMethod("dateBirthDay", $.validator.methods.date, "Fødselsdato skal være en gyldig dato!");
	  $.validator.addClassRules("vBirthDay", { requiredBirthDay: true, dateBirthDay: true });

	  $.validator.addMethod("requiredDate", $.validator.methods.required, "Dato skal udfyldes!");
	  $.validator.addMethod("dateDate", $.validator.methods.date, "Datoen skal være en gyldig dato!");
	  $.validator.addClassRules("vDate", { requiredDate: true, dateDate: true });

	  $.validator.addMethod("requiredAddressCo", $.validator.methods.required, "C/O Adresse skal udfyldes!");
	  $.validator.addClassRules("vAddressCo", { requiredAddressCo: true} );

	  $.validator.addMethod("requiredAddressStreet", $.validator.methods.required, "Vejnavn skal udfyldes!");
	  $.validator.addClassRules("vAddressStreet", { requiredAddressStreet: true });

	  $.validator.addMethod("requiredZipCode", $.validator.methods.required, "Postnummer skal udfyldes!");      
	  $.validator.addClassRules("vZipCode", { requiredZipCode: true, digits: true, minlength: 4, maxlength: 4 });

	  $.validator.addMethod("requiredPassword", $.validator.methods.required, "Adgangskode skal udfyldes!");      
	  $.validator.addClassRules("vPassword", { requiredPassword: true, minlength: 5 });

	  $.validator.addMethod("requiredConfirmPassword", $.validator.methods.required, "Postnummer skal udfyldes!");      
	  $.validator.addClassRules("vConfirmPassword", { requiredConfirmPassword: true, equalTo: "#vPassword" });

      $.validator.addMethod("requiredAcceptConditions", $.validator.methods.required, "Betingelserne skal accepteres!");      
	  $.validator.addClassRules("vAcceptConditions", { requiredAcceptConditions: true });
        
//      // a custom method for validating the date range
//    $.validator.addMethod("dateRange", function() {
//        return new Date($("#fromDate").val()) < new Date($("#toDate").val());
//    }, "Please specify a correct date range, the first must be before the second.");

//    // a new class rule to group all three methods
//    $.validator.addClassRules({
//    requiredDateRange: {required:true, date:true, dateRange:true}
//    });


    // hook-up validation for all forms:
	//var val = $("form").validate({});
}

function DefaultOnValidatorErrorPlacement(error, element) {
	var status = $(element).closest("div.field").find(".status");
	if(status)
		status.append(error);
}

function DefaultValidatorSubmitHandler(form) {
	// specifying a submitHandler prevents the default submit
	$.notify({ title: "Default Submit Handler", text: "(Submit to server)<br>TODO: Override this default SubmitHandler on the page triggering the validation.<p>Note that no data are posted to the server by the default submithandler as it <i>returns false</i>.</p>", clear: true });
    return false;     
}

function DefaultOnValidatorSuccess(label) {
    label.removeClass('error');  
	label.html('&nbsp;').addClass('valid');    
	//$.notify_clear();
}

function DefaultOnValidatorInvalid(form, validator) {

    var errors = validator.numberOfInvalids();
    var strMarkedFields = (errors == 1) ? 'det markeret felt' : $.format('de {0} markerede felter', errors);
    var msg = "Udfyld venligst " + strMarkedFields;

    $.notify({ type: 'error', title: 'Fejl i indtastning', text: msg, autohide: false, clear: true });
    $.scrollTo($(".error:first").not("label"),2500, { offset: -40, easing: 'swing' });
    //$.scrollTo(100, 2000, { easing: 'easeInOutBack' });
}