$(document).ready(function () {
	
	var isMobileDevices = (/android|webos|iphone|ipad|ipod|blackberry|iemobile|opera mini/i.test(navigator.userAgent.toLowerCase()));
	
	$("#cancelPolicyForm").attr("autocomplete","off");
	$("#cancelPolicyForm").attr('novalidate', 'novalidate');
	
	loadPlateCode();
	//KaizenADM - Release 8.4 - OMAN - Request Id#92250 - Cancel Policy Revised changes - STARTS
	$("#page_name").text("Cancel Policy");
	$(".custom-tooltip").css("display", "none");
	document.body.style.overflowY = '';
	//KaizenADM - Release 8.4 - OMAN - Request Id#92250 - Cancel Policy Revised changes - ENDS
	
    var fields = {
        "civil_id" : [
        	{"required" : "required"}, 
            {"onpaste" : "return true;"}, 
            {"ondrag" : "return false;"}, 
            {"ondrop" : "return false;"},
            {"type" : "text"}
        ],
        "vehicle_regno" : [
        	{"required" : "required"}, 
            {"onpaste" : "return true;"}, 
            {"ondrag" : "return false;"}, 
            {"ondrop" : "return false;"},
            {"type" : "number"}
        ],
        "vehicle_code" : [
            {"required" : "required"}, 
            {"onpaste" : "return true;"}, 
            {"ondrag" : "return false;"}, 
            {"ondrop" : "return false;"},
            {"type" : "text"}
        ],
        
    };
    
    setTimeout(function() {
        $(".transferPolicyButton").hide();
		$(".cancelPolicyButton").hide();
		$(".quoteAndBuyButton").hide();
        //$(".arabicButton").hide();
        $(".retrieveQuoteButton").hide();
        $(".renewPolicyButton").hide();
		$(".englishButton").hide();
        }, 100);

    var date = new Date();
    var today = new Date(date.getFullYear(), date.getMonth(), date.getDate());
    var dateFormatOptions = {
        /*format: 'dd/mm/yyyy',        
        container: $(".calendar_container"),
        todayHighlight: true,
        autoclose: true,
        endDate: '+0d',
        enableOnReadonly: false*/
        changeMonth: true,
        changeYear: true,
        dateFormat: "dd/mm/yy",
        maxDate: '0D',
        yearRange: '-100:+0',
    };
   	

    var validators = {
        "civil_id" : {
            id: "civil_id",
            label: "civil_id-float",
            errorMessage0: 'Please provide a valid Civil ID.',
			inputpattern: /^[0-9!@#$%^&*/]+$/,
			
            
        },
        "vehicle_regno" : {
            id: "vehicle_regno",
            label: "vehicle_regno-float",
            errorMessage0: 'Please provide a valid Vehicle Registration Number.',
            inputpattern:  /^\d+$/,
			errorMessage1: 'Please enter the Registration Code',
			required:false
            
        },
		"vehicle_code" : {
            id: "vehicle_code",
            label: "vehicle_regno-float",
            errorMessage0: 'Please provide vehicle plate code.',
            required:false
        }
        
    };

    for (var id in fields) {
        for (var i = 0; i < fields[id].length; i++) {
            var field = fields[id][i];
            for (var attrName in field) {
                $("#" + id).attr(attrName, field[attrName]);
            }            
        }
    }

    var validate = function(key) {
        $("#" + validators[key].label).next(".red").remove();
		var glyphOk = "<span class='glyrenpol glyphicon glyphicon-ok'></span>";
        var glyphRemove = "<span class='glyrenpol glyphicon glyphicon-remove'></span>";
        var customErrorMessage = "", isFound = false, isInputValid = false;
        if (validators[key]["id"]) {
            var value = $('#' + validators[key].id).val();
            if (validators[key].duplicate) {
                var duplicateValidator = validators[key].duplicate;
                var elemPos = duplicateValidator.findDuplicate(value);
                var currPos = duplicateValidator.pos;
                customErrorMessage = duplicateValidator.errorMessage;
                if (validators[key].duplicate.edit) {
                    isFound = (elemPos == -1 || elemPos == currPos) ? false : true;
                } else {
                    isFound = (elemPos == -1) ? false : true;
                }
            }

            if (validators[key].required == false && validators[key].inputpattern) {
                isInputValid = (value !="" && value != null) ? (validators[key].inputpattern.test(value) ? true : false) : true;
                if (!isInputValid) {
                    $("#" + validators[key].id).css("border", "1px solid red");
                    $("#" + validators[key].label).after('<div class="red">' +  validators[key].errorMessage0 + '</div>');
					$("#" + validators[key].label).closest('.elem').find(".glyrenpol").remove();
					if(value!=null && value !=""){
						$("#" + validators[key].label).closest('.glyphdiv').before(glyphRemove);
						}
                    return false;
                } else {
                    $("#" + validators[key].id).css("border", "1px solid #55565A");
                    $("#" + validators[key].label).next(".red").remove();
					$("#" + validators[key].label).closest('.elem').find(".glyrenpol").remove();
					if(value!=null && value !=""){
					$("#" + validators[key].label).closest('.glyphdiv').before(glyphOk);
					}
                    return true;
                }               
            } else if (value.length == 0 || value.trim() == "" ||
                (validators[key].pattern0 && !validators[key].pattern0.test(value)) || isFound) {
                var errMsg = isFound ?  duplicateValidator.errorMessage : validators[key].errorMessage0;
                $("#" + validators[key].id).css("border", "1px solid red");
                $("#" + validators[key].label).after('<div class="red">' +  errMsg + '</div>');
				$("#" + validators[key].label).closest('.elem').find(".glyrenpol").remove();
                $("#" + validators[key].label).closest('.glyphdiv').before(glyphRemove);				
                return false;
            }  else if ((value != null && validators[key].patternFunc0 != null) && !validators[key].patternFunc0(value)) {
                $("#" + validators[key].id).css("border", "1px solid red");
                $("#" + validators[key].label).after('<div class="red">' + validators[key].errorMessage1 + '</div>');
				$("#" + validators[key].label).closest('.elem').find(".glyrenpol").remove();
				$("#" + validators[key].label).closest('.glyphdiv').before(glyphRemove);
            }
            else {
                $("#" + validators[key].id).css("border", "1px solid #55565A");
                $("#" + validators[key].label).next(".red").remove();
				$("#" + validators[key].label).closest('.elem').find(".glyrenpol").remove();
				$("#" + validators[key].label).closest('.glyphdiv').before(glyphOk);
                return true;
            }
        }  else {
            var value  = $("." + validators[key].class).val();
            if(value == null) {
                $("#" + validators[key].label).after('<div class="red">' + validators[key].errorMessage0 + '</div>'); 
                return false;
            }
            else {
               $("#" + validators[key].label).next(".red").remove();
                return true;
            }
        }
        
    };

    var transfer_policy = ["civil_id", "vehicle_regno"];
    var isFormValid = function(elements) {
        var validCount = 0;
        for (var i = 0; i < elements.length; i++) {
            if (validate(elements[i])) {
                validCount++;
            }
        }
        return { isFormValid : validCount == elements.length, invalidCount: elements.length - validCount};
    };

	function ValidateRegNum() {
        const reg_number_pattern = /^\d+$/;
        var reg_number = $('#vehicle_regno').val();
        var reg_code = $('#vehicle_code').val();
		var civilId=$('#civil_id').val();
		var glyphOk = "<span class='glyrenpol glyphicon glyphicon-ok'></span>";
        var glyphRemove = "<span class='glyrenpol glyphicon glyphicon-remove'></span>";
        $('#vehicle_regno-float').next(".red").remove();
        $("#vehicle_regno, #vehicle_code").removeClass('error');
		$('#vehicle_regno-float').closest('.right-input').find(".glyphicon-remove").remove();
		$('#vehicle_regno-float').closest('.right-input').find(".glyphicon-ok").remove();
        var isNumberValid = (reg_number.trim().length == 0 || !reg_number_pattern.test(reg_number)) ? false : true;
        var isPlateValid = (reg_code.trim().length == 0) ? false : true;
        if (!isNumberValid && !isPlateValid) {
			if(civilId != "" || civilId.length != 0){
			$("#vehicle_regno, #vehicle_code").addClass('error');
            $('#vehicle_regno-float').after('<div class="red">Please provide Vehicle Plate Code & Registration Number.</div>');
			$("#vehicle_regno-float").closest('.elem').find(".glyrenpol").remove();
			$("#vehicle_regno-float").closest('.glyphdiv').before(glyphRemove);
			}
			
			else{
					$("#vehicle_regno-float").closest('.elem').find(".glyrenpol").remove();
			}
        } else {
            if (!isNumberValid) {
                $("#vehicle_regno").addClass('error');
                $('#vehicle_regno-float').after('<div class="red">Please provide Vehicle Registration Number.</div>');
				$("#vehicle_regno-float").closest('.elem').find(".glyrenpol").remove();
			$("#vehicle_regno-float").closest('.glyphdiv').before(glyphRemove);
            } else if (!isPlateValid) {
                $("#vehicle_code").addClass('error');
                $('#vehicle_regno-float').after('<div class="red">Please provide Vehicle Plate Code.</div>');
				$("#vehicle_regno-float").closest('.elem').find(".glyrenpol").remove();
			$("#vehicle_regno-float").closest('.glyphdiv').before(glyphRemove);
            }
			else{
				$("#vehicle_regno-float").closest('.elem').find(".glyrenpol").remove();
				$("#vehicle_regno-float").closest('.glyphdiv').before(glyphOk);
			}		
			
        }
    }

	
    $("#civil_id").on("keyup blur",function() {
        validate('civil_id');
    });

    $("#vehicle_regno").on("keyup blur",function() {
        //validate('vehicle_regno');
		ValidateRegNum();
    });
	
	$("#vehicle_code").on("keyup change blur",function() {
        //validate('vehicle_code');
		ValidateRegNum();
		this.value = this.value.toLocaleUpperCase();
    });

    
    var errMsg = "Please provide both Civil ID and Vehicle Registration Number.";
	var errMsg1 = "Please provide both the vehicle plate code and plate number.";
	
    $("#cancel_submit").click(function() {
        if (isFormValid(transfer_policy).isFormValid) {
			var regnNo = $("#vehicle_regno").val();
			var plateCode = $("#vehicle_code").val();
			var civilId = $("#civil_id").val();
			
			 if(civilId!=null && civilId.trim()!="" && regnNo!=null && regnNo.trim()!="" && plateCode !='' && plateCode !="undefined" && plateCode != null ){
				document.cancelPolicyForm.action=contextPathUrl+"/cancelPolicyDetails.do?civilId="+civilId+"&regnNoText="+plateCode+regnNo+"";
				document.cancelPolicyForm.submit();
				$(".loading-container").show();
				$("body").addClass("show-loader");
			 }
			else{
				$("#vehicle_regno, #vehicle_code").addClass('error');
					ValidateRegNum();
					return false;
			
				 }	
        }
	    else{
        	return false;
        }
    });
	
	/*$("#vehicle_regno").keyup(function() {
		// const reg_number_pattern = "/[0-9]+[-][A-Za-z]+[-]\b[O]{1}[M]{1}[A]{1}[N]{1}\b/i";
	   //var reg_number_pattern=/[0-9]+[-][A-Za-z]+[-]\b[O]{1}[M]{1}[A]{1}[N]{1}\b/i;
	   var reg_number_pattern=/^[0-9]+-[A-Za-z]+-[Oo][Mm][Aa][Nn]$/;
        var reg_number = $('#vehicle_regno').val();
        $('#vehicle_regno-float').next(".red").remove();
        $("#vehicle_regno").removeClass('error');
		
			if (reg_number.trim().length == 0 || reg_number == " "){
				
					$(".form-btn").removeClass('disabled');
					$(".form-btn").removeClass('cursor-style');
					$("#vehicle_regno").removeClass('error');
					$('#vehicle_regno-float').next(".red").remove();
				
			} else {
				$("#vehicle_regno").removeClass('error');
				$('#vehicle_regno-float').next(".red").remove();
				if(reg_number_pattern.test(reg_number)){
					$(".form-btn").removeClass('disabled');
					$(".form-btn").removeClass('cursor-style');
					$("#vehicle_regno").removeClass('error');
					$('#vehicle_regno-float').next(".red").remove();
					//startButtonEnableCheck();
				}
				else{
					$(".form-btn").addClass('disabled');
					$(".form-btn").addClass('cursor-style');
					$('#vehicle_regno-float').after('<div class="red">Please enter Vehicle Registration Number in correct format(as given in the information tool tip).</div>');
					$("#vehicle_regno").addClass('error');
				}
			   // return true;
			}
			
		
    });*/

    /*$("body").on("click", ".modal-dialog", function(e) {
        if ($(e.target).hasClass('modal-dialog')) {
            var hidePopup = $(e.target.parentElement).attr('id');
            console.log(hidePopup);
            $('#' + hidePopup).modal('hide');
        }
    });*/
	
	setTimeout(function() {
		$(".quoteAndBuyButton").removeClass("trackChanges").addClass("untrackChanges");
        $(".retrieveQuoteButton").removeClass("trackChanges").addClass("untrackChanges");
        $(".pageLogo").removeClass("goTohomeSite").addClass("homeSite");
        $(".pageHome").removeClass("goTohomeSite").addClass("homeSite");
        
    }, 100);

    $("body").on("click", function(e) {
        if (!$(e.target).hasClass("custom-tooltip")) {
            $(".custom-tooltip").css("display", "none");
            document.body.style.overflowY = '';
        }
    });

    var showPopup = function(button, element) {
        setTimeout(function(){
            var val = button.offset();
            if (!isMobileDevices || $('.submenu-left').is(':visible')) {
                $(element)
                .css({
                    left: val.left + button.outerWidth() + 15,
                    top: val.top - $(element).height() / 2 - 5
                });
            }  else {
                document.body.style.overflowY = 'hidden';
				$(element).css({top:val.top - $(element).height() / 2 - 5});
            }        

           // $(element).height(window.innerHeight - 90);

            $(element).css('display', 'block');  

        });
    };

    if (!isMobileDevices) {
        $("#civil-id").hover(function(obj) {
            showPopup(
                $(this),
                '.civilId'
            );          
        }, function() {
            $(".civilId").css('display', 'none');
        });
    } else {
        $("#civil-id").click(function(obj) {
            showPopup(
                 $(this),
                 '.civilId'
             );           
         });
    }

    if (!isMobileDevices) {
        $("#vehicle-regno").hover(function(obj) {
            showPopup(
                $(this),
                '.vehicleRegNumber'
            );          
        }, function() {
            $(".vehicleRegNumber").css('display', 'none');
        });
    } else {
        $("#vehicle-regno").click(function(obj) {
            showPopup(
                 $(this),
                 '.vehicleRegNumber'
             );           
         });
    }
      
    $(".modal-backdrop").addClass("modal-bg-backdrop");
});

function loadPlateCode(vehPlateCode){ 
	   
	  
   	var ddName="vehPlateCodeList";

	$.ajax({
        type: "POST",
        url: contextPathUrl+"/loadDropDown.do?ddName="+ddName+"&",
        dataType: "json",
        
        success: function(data, status,xhr){
        $("#vehicle_code").html("");
        $("#vehicle_codespan").text("Select");
         $("#vehicle_code").append("<option value=''>Select</option>");
      				$.each(data, function(index, value) {
        		 	 $.each(value, function(key, name){
       	  			$("#vehicle_code").append('<option value="' + key + '">' + name + '</option>'); 
         		 index++;
      				});
         	 });
      				
      		retrieveDropdownvalues(vehPlateCode,"vehicle_code");
        },
       
      error: function(status, errorThrown){
           
      },
      complete: function (textStatus){
    	
      }
        
     
    });
  

}

function retrieveDropdownvalues(id,dropdownId){
	
	var dispLength;
	if(dropdownId == 'carFinance'){
		dispLength = 17;
		if(id == '99915'){
				$('.other-required').show();
		}
	}else if(dropdownId == 'carModel' || dropdownId == 'vehNCDProvider' || dropdownId == 'nationality' || dropdownId == 'emirate' || dropdownId == 'orangeCardBranch'){
		dispLength = 17;
	}
	else{
		dispLength = 23;
	}
	var selectobject = document.getElementById(dropdownId);
	if(selectobject!=null && selectobject.options){//Added null check
		for (var i=0; i<selectobject.options.length; i++){
			if(selectobject.options[i].value == id){
			 document.getElementById(dropdownId).selectedIndex = i;
				var trimTextValue = selectobject.options[i].innerHTML;
				 var dropdownText = trimTextValue.substring(0,dispLength);
					 $('#'+dropdownId+'span').text(dropdownText);
					if(dropdownId=="nationality"){
					$("#nationalityDesc").val(dropdownText);
					}
						break;
						}
		}
	}
}

function setValues(id,dropdownId){
		var pageFlag = 	$("#pageFlag").val();
		var selectobject = document.getElementById(dropdownId);
		for (var i=0; i<selectobject.options.length; i++){
			if(selectobject.options[i].value == id  ){
			 document.getElementById(dropdownId).selectedIndex = i;
			 var trimTextValue = selectobject.options[i].innerHTML;
			 var dropdownText = trimTextValue.substring(0,23);
			 $('#'+dropdownId+'span').text(dropdownText);
			
			break;
			}
		}
			if(id =='1'){
				$('.form-row-ext').show();
				$('.form-row-ext').removeClass('disable-row');
				loadPlateCodeDropDown();
				$('.toggle-fields').show();
				$('.btn-plate').show();
			}else {
				$('.form-row-ext').show();
				$('.form-row-ext').removeClass('disable-row');
			}
			
			
			var dispLength;
			if(dropdownId == 'carMake' || dropdownId == 'carModel'){
				dispLength = 17;
			
			var selectobject = document.getElementById(dropdownId);
			if(selectobject!=null && selectobject.options){//Added null check
				for (var i=0; i<selectobject.options.length; i++){
					if(selectobject.options[i].value == id){
					 document.getElementById(dropdownId).selectedIndex = i;
						var trimTextValue = selectobject.options[i].innerHTML;
						 var dropdownText = trimTextValue.substring(0,dispLength);
							 $('#'+dropdownId+'span').text(dropdownText);
								break;
								}
				}
			}
			}
			
	}