<?php include "app_modal.php"; ?>
<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap/5.1.3/js/bootstrap.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/wow/1.1.2/wow.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/OwlCarousel2/2.3.4/owl.carousel.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/fancybox/3.1.20/jquery.fancybox.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-validate/1.9.0/jquery.validate.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/intl-tel-input/25.2.1/build/js/intlTelInputWithUtils.min.js"></script>
<script src="<?= site_url; ?>/designer/js/themes.js"></script>


<script>
    /* WhatsApp Form Validation*/
    $(document).ready(function() {
        function setupPhoneValidation(formId) {
            if (typeof window.intlTelInput !== "function") {
                console.error("intlTelInput library is not loaded.");
                return;
            }

            const inputFields = document.querySelectorAll(formId + " .telePhone");

            inputFields.forEach(input => {
                const iti = window.intlTelInput(input, {
                    initialCountry: "in",
                    allowDropdown: true,
                    useFullscreenPopup: false,
                    separateDialCode: false,
                    utilsScript: "https://cdnjs.cloudflare.com/ajax/libs/intl-tel-input/25.2.1/js/utils.min.js",
                });

                function updateHiddenFields() {
                    const selectedCountry = iti.getSelectedCountryData();
                    const codeInput = document.querySelector(formId + " .code");
                    const countryNameInput = document.querySelector(formId + " .countryName");

                    if (codeInput) codeInput.value = `${selectedCountry.dialCode}`; // Adding plus sign
                    if (countryNameInput) countryNameInput.value = selectedCountry.name;

                    updatePhoneValidation(formId, input, selectedCountry);
                }

                updateHiddenFields(); // Set initial values

                input.addEventListener("countrychange", updateHiddenFields);
            });
        }

        function updatePhoneValidation(formId, input, countryData) {
            let validator = $(formId).data("validator");
            if (!validator) return;

            let fieldName = $(input).attr("name");
            $(input).rules("remove"); // Remove previous validation rules

            if (countryData.iso2 === "in") {
                $(input).attr({
                    maxlength: 10,
                    minlength: 10
                });
                $(input).rules("add", {
                    required: true,
                    number: true,
                    minlength: 10,
                    maxlength: 10,
                    messages: {
                        required: "Mobile number is required",
                        minlength: "Indian mobile number must be exactly 10 digits long",
                        maxlength: "Indian mobile number must be exactly 10 digits long",
                    }
                });
            } else {
                $(input).attr({
                    maxlength: 17,
                    minlength: 4
                });
                $(input).rules("add", {
                    required: true,
                    number: true,
                    minlength: 4,
                    maxlength: 17,
                    messages: {
                        required: "Mobile number is required",
                        minlength: "Your Mobile No. must be at least 4 digits long",
                        maxlength: "Your Mobile No. must be at most 17 digits long",
                    }
                });
            }

            $(input).valid(); // Trigger validation check
        }

        if (typeof window.intlTelInput === "function") {
            setupPhoneValidation("#whatsapp_form");
        } else {
            console.error("intlTelInput is not loaded. Check your script includes.");
        }

        if (typeof $.fn.validate === "function") {
            $("#whatsapp_form").validate({
                rules: {
                    name: "required",
                    mobile: {
                        required: true,
                        number: true,
                        minlength: 10,
                        maxlength: 10,
                    },
                },
                messages: {
                    name: "Please Enter Your Name",
                    mobile: {
                        required: "Please Enter Your Mobile Number",
                        number: "Mobile Number Must be Numeric",
                        minlength: "Mobile Number must have 10 digits",
                        maxlength: "Mobile Number must have 10 digits",
                    },
                },
            });
        } else {
            console.error("jQuery Validate is not loaded. Check your script includes.");
        }
    });

    $('#whatsapp_form').submit(function(e) {
        e.preventDefault();
        $(':input[type="submit"]').prop('disabled', true);
        $.ajax({
            'url': '<?= site_url; ?>/whatsapp_enq.php',
            'type': 'POST',
            'dataType': 'json',
            'data': $(this).serialize(),
            'success': function(result) {
                if (result.status == false) {
                    $('.wht_success_message').text('');
                    $('.wht_error_message').text(result.message_response)
                    $(':input[type="submit"]').prop('disabled', false);
                } else {
                    $('.wht_error_message').text('');
                    $('.wht_success_message').text("You Have Successfully Submitted enquiry. We will contact you soon.");
                    $('#whatsapp_form').trigger("reset");
                    window.open(result.message_response, '_blank');
                    $(':input[type="submit"]').prop('disabled', false);
                }
            }
        });
    });
    /* WhatsApp Form Validation*/



    /* Call back */
    $(document).ready(function() {
        function setupPhoneValidation(formId) {
            if (typeof window.intlTelInput !== "function") {
                console.error("intlTelInput library is not loaded.");
                return;
            }

            const inputVacations = document.querySelectorAll(formId + " .telePhone");

            inputVacations.forEach(input => {
                const iti = window.intlTelInput(input, {
                    initialCountry: "in",
                    allowDropdown: true,
                    separateDialCode: false,
                    useFullscreenPopup: false,
                    utilsScript: "https://cdnjs.cloudflare.com/ajax/libs/intl-tel-input/25.2.1/js/utils.min.js",
                });

                // Set initial validation rules
                const selectedCountry = iti.getSelectedCountryData();
                updatePhoneValidation(formId, input, selectedCountry);

                input.addEventListener("countrychange", function() {
                    const selectedCountry = iti.getSelectedCountryData();

                    // Ensure elements exist before updating them
                    const codeInput = document.querySelector(formId + " input.code");
                    const countryNameInput = document.querySelector(formId + " input.countryName");

                    if (codeInput) codeInput.value = `${selectedCountry.dialCode}`;
                    if (countryNameInput) countryNameInput.value = selectedCountry.name;

                    updatePhoneValidation(formId, input, selectedCountry);
                });
            });
        }

        function updatePhoneValidation(formId, input, countryData) {
            let validator = $(formId).data("validator");
            if (!validator) return;

            let fieldName = $(input).attr("name");

            if (countryData.iso2 === "in") {
                $(input).attr("maxlength", 10);
                $(input).attr("minlength", 10);
                validator.settings.rules[fieldName] = {
                    required: true,
                    minlength: 10,
                    maxlength: 10
                };
                validator.settings.messages[fieldName] = {
                    required: "Mobile number is required",
                    minlength: "Indian mobile number must be exactly 10 digits long",
                    maxlength: "Indian mobile number must be exactly 10 digits long",
                };
            } else {
                $(input).attr("maxlength", 17);
                $(input).attr("minlength", 4);
                validator.settings.rules[fieldName] = {
                    required: true,
                    minlength: 4,
                    maxlength: 17
                };
                validator.settings.messages[fieldName] = {
                    required: "Mobile number is required",
                    minlength: "Your Mobile No. must be at least 4 digits long",
                    maxlength: "Your Mobile No. must be at most 17 digits long",
                };
            }

            $(input).valid(); // Trigger validation check
        }

        // Ensure intlTelInput is loaded before running setup
        if (typeof window.intlTelInput === "function") {
            setupPhoneValidation("#callback_form");
        } else {
            console.error("intlTelInput is not loaded. Check your script includes.");
        }

        // Validate form only if jQuery Validate is available
        if (typeof $.fn.validate === "function") {
            $("#callback_form").validate({
                rules: {
                    name: "required",
                    mobile: {
                        required: true,
                        number: true,
                        minlength: 10, // Default for India
                        maxlength: 17,
                    },
                },
                messages: {
                    name: "Please enter your name",
                    mobile: {
                        required: "Please enter your mobile no.",
                        number: "Mobile No. contains only numbers",
                        minlength: "Your Mobile No. must be at least 10 digits long",
                        maxlength: "Your Mobile No. must be at most 17 digits long",
                    },
                },
                submitHandler: function(form) {
                    $.ajax({
                        url: "<?= site_url; ?>/ajax_enq_action.php",
                        type: "POST",
                        data: $("#callback_form").serialize(),
                        dataType: "json",
                        success: function(response) {
                            if (response.status === true) {
                                $("#cpop_up").text(response.message_response).css("color", "green");
                                $("#callback_form")[0].reset();
                                grecaptcha.reset();
                            } else {
                                $("#cpop_up").text(response.message_response).css("color", "red");
                            }
                        },
                    });
                }
            });
        } else {
            console.error("jQuery Validate is not loaded. Check your script includes.");
        }
    });
    /*Call Back */

    /*enq_pop_form1 */

    $(document).ready(function() {
        function setupPhoneValidation(formId) {
            if (typeof window.intlTelInput !== "function") {
                console.error("intlTelInput library is not loaded.");
                return;
            }

            const inputVacations = document.querySelectorAll(formId + " .telePhone");

            inputVacations.forEach(input => {
                const iti = window.intlTelInput(input, {
                    initialCountry: "in",
                    allowDropdown: true,
                    separateDialCode: false,
                    useFullscreenPopup: false,
                    utilsScript: "https://cdnjs.cloudflare.com/ajax/libs/intl-tel-input/25.2.1/js/utils.min.js",
                });

                // Set initial validation rules for India
                const selectedCountry = iti.getSelectedCountryData();
                updatePhoneValidation(formId, input, selectedCountry);

                input.addEventListener("countrychange", function() {
                    const selectedCountry = iti.getSelectedCountryData();

                    // Ensure elements exist before updating them
                    const codeInput = document.querySelector(formId + " input.code");
                    const countryNameInput = document.querySelector(formId + " input.countryName");

                    if (codeInput) codeInput.value = `${selectedCountry.dialCode}`; // Adding plus sign
                    // if (codeInput) codeInput.value = selectedCountry.dialCode;
                    if (countryNameInput) countryNameInput.value = selectedCountry.name;

                    updatePhoneValidation(formId, input, selectedCountry);
                });
            });
        }

        function updatePhoneValidation(formId, input, countryData) {
            let validator = $(formId).data("validator");
            if (!validator) return;

            let fieldName = $(input).attr("name");

            if (countryData.iso2 === "in") {
                $(input).attr("maxlength", 10);
                $(input).attr("minlength", 10);
                validator.settings.rules[fieldName] = {
                    required: true,
                    minlength: 10,
                    maxlength: 10
                };
                validator.settings.messages[fieldName] = {
                    required: "Mobile number is required",
                    minlength: "Indian mobile number must be exactly 10 digits long",
                    maxlength: "Indian mobile number must be exactly 10 digits long",
                };
            } else {
                $(input).attr("maxlength", 17);
                $(input).attr("minlength", 4);
                validator.settings.rules[fieldName] = {
                    required: true,
                    minlength: 4,
                    maxlength: 17
                };
                validator.settings.messages[fieldName] = {
                    required: "Mobile number is required",
                    minlength: "Your Mobile No. must be at least 4 digits long",
                    maxlength: "Your Mobile No. must be at most 17 digits long",
                };
            }

            $(input).valid(); // Trigger validation check
        }

        // Ensure intlTelInput is loaded before running setup
        if (typeof window.intlTelInput === "function") {
            setupPhoneValidation("#enq_pop_form1");
        } else {
            console.error("intlTelInput is not loaded. Check your script includes.");
        }

        // Validate form only if jQuery Validate is available
        if (typeof $.fn.validate === "function") {
            $("#enq_pop_form1").validate({
                rules: {
                    name: "required",
                    message: {
                        required: true
                    },
                    location: {
                        required: true
                    },
                    email: {
                        required: true
                    },
                    mobile: {
                        required: true,
                        number: true,
                        minlength: 10, // Default for India
                        maxlength: 17,
                    },
                },
                messages: {
                    name: "Please enter your name",
                    message: {
                        required: "Please enter your message"
                    },
                    email: {
                        required: "Please enter your email address"
                    },
                    location: {
                        required: "Please enter your location"
                    },
                    mobile: {
                        required: "Please enter your mobile no.",
                        number: "Mobile No. contains only numbers",
                        minlength: "Your Mobile No. must be at least 10 digits long",
                        maxlength: "Your Mobile No. must be at most 17 digits long",
                    },
                },
                submitHandler: function(form) {
                    $.ajax({
                        url: "<?= site_url; ?>/enquiry_popup.php",
                        type: "POST",
                        data: $("#enq_pop_form1").serialize(),
                        dataType: "json",
                        success: function(response) {
                            if (response.status === true) {
                                $("#enq_pop_up").text(response.message_response).css("color", "green");
                                $("#enq_pop_form1")[0].reset();
                                grecaptcha.reset();
                            } else {
                                $("#enq_pop_up").text(response.message_response).css("color", "red");
                            }
                        },
                    });
                }
            });
        } else {
            console.error("jQuery Validate is not loaded. Check your script includes.");
        }
    });

    /* enq_pop_form1*/


    /*product_pop_form */


    $(document).ready(function() {
        function setupPhoneValidation(formId) {
            if (typeof window.intlTelInput !== "function") {
                console.error("intlTelInput library is not loaded.");
                return;
            }

            const inputVacations = document.querySelectorAll(formId + " .telePhone");

            inputVacations.forEach(input => {
                const iti = window.intlTelInput(input, {
                    initialCountry: "in",
                    allowDropdown: true,
                    separateDialCode: false,
                    useFullscreenPopup: false,
                    utilsScript: "https://cdnjs.cloudflare.com/ajax/libs/intl-tel-input/25.2.1/js/utils.min.js",
                });

                // Set initial validation rules for India
                const selectedCountry = iti.getSelectedCountryData();
                updatePhoneValidation(formId, input, selectedCountry);

                input.addEventListener("countrychange", function() {
                    const selectedCountry = iti.getSelectedCountryData();

                    // Ensure elements exist before updating them
                    const codeInput = document.querySelector(formId + " input.code");
                    const countryNameInput = document.querySelector(formId + " input.countryName");

                    if (codeInput) codeInput.value = `${selectedCountry.dialCode}`; // Adding plus sign

                    if (countryNameInput) countryNameInput.value = selectedCountry.name;

                    updatePhoneValidation(formId, input, selectedCountry);
                });
            });
        }

        function updatePhoneValidation(formId, input, countryData) {
            let validator = $(formId).data("validator");
            if (!validator) return;

            let fieldName = $(input).attr("name");

            if (countryData.iso2 === "in") {
                $(input).attr("maxlength", 10);
                $(input).attr("minlength", 10);
                validator.settings.rules[fieldName] = {
                    required: true,
                    minlength: 10,
                    maxlength: 10
                };
                validator.settings.messages[fieldName] = {
                    required: "Mobile number is required",
                    minlength: "Indian mobile number must be exactly 10 digits long",
                    maxlength: "Indian mobile number must be exactly 10 digits long",
                };
            } else {
                $(input).attr("maxlength", 17);
                $(input).attr("minlength", 4);
                validator.settings.rules[fieldName] = {
                    required: true,
                    minlength: 4,
                    maxlength: 17
                };
                validator.settings.messages[fieldName] = {
                    required: "Mobile number is required",
                    minlength: "Your Mobile No. must be at least 4 digits long",
                    maxlength: "Your Mobile No. must be at most 17 digits long",
                };
            }

            $(input).valid(); // Trigger validation check
        }

        // Ensure intlTelInput is loaded before running setup
        if (typeof window.intlTelInput === "function") {
            setupPhoneValidation("#product_pop_form");
        } else {
            console.error("intlTelInput is not loaded. Check your script includes.");
        }

        // Validate form only if jQuery Validate is available
        if (typeof $.fn.validate === "function") {
            $("#product_pop_form").validate({
                rules: {
                    name: "required",
                    message: {
                        required: true
                    },
                    location: {
                        required: true
                    },
                    quantity: {
                        required: true
                    },
                    email: {
                        required: true
                    },
                    mobile: {
                        required: true,
                        number: true,
                        minlength: 10, // Default for India
                        maxlength: 17,
                    },
                },
                messages: {
                    name: "Please enter your name",
                    message: {
                        required: "Please enter your message"
                    },
                    email: {
                        required: "Please enter your email address"
                    },
                    location: {
                        required: "Please enter your location"
                    },
                    quantity: {
                        required: "Please enter your minimum order quantity"
                    },
                    mobile: {
                        required: "Please enter your mobile no.",
                        number: "Mobile No. contains only numbers",
                        minlength: "Your Mobile No. must be at least 10 digits long",
                        maxlength: "Your Mobile No. must be at most 17 digits long",
                    },
                },
                submitHandler: function(form) {
                    $.ajax({
                        url: "<?= site_url; ?>/enquirycat_popup.php",
                        type: "POST",
                        data: $("#product_pop_form").serialize(),
                        dataType: "json",
                        success: function(response) {
                            if (response.status === true) {
                                $("#cat_pop_up").text(response.message_response).css("color", "green");
                                $("#product_pop_form")[0].reset();
                                grecaptcha.reset();
                            } else {
                                $("#cat_pop_up").text(response.message_response).css("color", "red");
                            }
                        },
                    });
                }
            });
        } else {
            console.error("jQuery Validate is not loaded. Check your script includes.");
        }
    });


    /*product_pop_form */




    /* Contact page Form*/

    $(document).ready(function() {
        function setupPhoneValidation(formId) {
            if (typeof window.intlTelInput !== "function") {
                console.error("intlTelInput library is not loaded.");
                return;
            }

            const inputFields = document.querySelectorAll(formId + " .telePhone");

            inputFields.forEach(input => {
                const iti = window.intlTelInput(input, {
                    initialCountry: "in",
                    allowDropdown: true,
                    separateDialCode: false,
                    utilsScript: "https://cdnjs.cloudflare.com/ajax/libs/intl-tel-input/25.2.1/js/utils.min.js",
                });

                const selectedCountry = iti.getSelectedCountryData();
                updatePhoneValidation(formId, input, selectedCountry);

                input.addEventListener("countrychange", function() {
                    const selectedCountry = iti.getSelectedCountryData();

                    // Update country dial code and country name in hidden fields
                    const codeInput = document.querySelector(formId + " .code");
                    const countryNameInput = document.querySelector(formId + " .countryName");

                    if (codeInput) codeInput.value = `${selectedCountry.dialCode}`; // Adding plus sign
                    if (countryNameInput) countryNameInput.value = selectedCountry.name;

                    updatePhoneValidation(formId, input, selectedCountry);
                });
            });
        }

        function updatePhoneValidation(formId, input, countryData) {
            let validator = $(formId).data("validator");
            if (!validator) return;

            let fieldName = $(input).attr("name");

            if (countryData.iso2 === "in") {
                $(input).attr("maxlength", 10);
                $(input).attr("minlength", 10);
                validator.settings.rules[fieldName] = {
                    required: true,
                    minlength: 10,
                    maxlength: 10
                };
                validator.settings.messages[fieldName] = {
                    required: "Mobile number is required",
                    minlength: "Indian mobile number must be exactly 10 digits long",
                    maxlength: "Indian mobile number must be exactly 10 digits long",
                };
            } else {
                $(input).attr("maxlength", 17);
                $(input).attr("minlength", 4);
                validator.settings.rules[fieldName] = {
                    required: true,
                    minlength: 4,
                    maxlength: 17
                };
                validator.settings.messages[fieldName] = {
                    required: "Mobile number is required",
                    minlength: "Your Mobile No. must be at least 4 digits long",
                    maxlength: "Your Mobile No. must be at most 17 digits long",
                };
            }

            $(input).valid(); // Trigger validation check
        }

        // Ensure intlTelInput is loaded before running setup
        if (typeof window.intlTelInput === "function") {
            setupPhoneValidation("#contact_form");
        } else {
            console.error("intlTelInput is not loaded. Check your script includes.");
        }

        // Validate form only if jQuery Validate is available
        if (typeof $.fn.validate === "function") {
            $("#contact_form").validate({
                rules: {
                    name: "required",
                    message: {
                        required: true
                    },
                    location: {
                        required: true
                    },
                    email: {
                        required: true,
                        email: true
                    },
                    mobile: {
                        required: true,
                        number: true,
                        minlength: 10, // Default for India
                        maxlength: 17,
                    },
                },
                messages: {
                    name: "Please enter your name",
                    message: {
                        required: "Please enter your message"
                    },
                    email: {
                        required: "Please enter your email address",
                        email: "Enter a valid email address"
                    },
                    location: {
                        required: "Please enter your location"
                    },
                    mobile: {
                        required: "Please enter your mobile no.",
                        number: "Mobile No. contains only numbers",
                        minlength: "Your Mobile No. must be at least 10 digits long",
                        maxlength: "Your Mobile No. must be at most 17 digits long",
                    },
                },
                submitHandler: function(form) {
                    $.ajax({
                        url: "<?= site_url; ?>/contact.php",
                        type: "POST",
                        data: $("#contact_form").serialize(),
                        dataType: "json",
                        success: function(response) {
                            if (response.status === true) {
                                $("#pop_up").text(response.message_response).css("color", "green");
                                $("#contact_form")[0].reset();
                                grecaptcha.reset();
                            } else {
                                $("#pop_up").text(response.message_response).css("color", "red");
                            }
                        },
                    });
                }
            });
        } else {
            console.error("jQuery Validate is not loaded. Check your script includes.");
        }
    });

    /*Contact Page Form */
</script>

<script>
    function ValidateAlpha(evt) {
        var keyCode = (evt.which) ? evt.which : evt.keyCode
        if ((keyCode < 65 || keyCode > 90) && (keyCode < 97 || keyCode > 123) && keyCode != 32)
            return false;
        return true;
    }

    function isNumberKey(evt) {
        //var e = evt || window.event;
        var charCode = (evt.which) ? evt.which : evt.keyCode
        if (charCode != 46 && charCode > 31 &&
            (charCode < 48 || charCode > 57))
            return false;
        return true;
    }

    function validateOnlyTextField(element) {
        var str = element.value;
        if (str == ' ') {
            element.value = "";
        }
        if (!(/^[a-zA-Z\s]+$/.test(str))) {
            // console.log('String contain number characters');
            str = str.substr(0, str.length - 1);
            element.value = "";
        }
    }
</script>
<script>
    setTimeout(function() {

        $.getScript("https://www.google.com/recaptcha/api.js");
    }, 10000)
</script>