<?php 
include_once("include/main.inc.php"); 

?>

<div class="modal fade" id="whatsapp" tabindex="-1" role="dialog">
    <div class="modal-dialog modal-sm">
        <div class="modal-content">
            <div class="modal-header">
                <div class="modal-title">Message on WhatsApp</div>
                <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
            </div>
            <div class="modal-body">
                <form method="post" id="contact_id">
                     <div id="whatsapp_response"></div>
                    <div class="row">
                        <div class="col-xxl-12 col-xl-12 col-lg-12 col-md-12 col-sm-12 col-12">
                            <div class="form-group">
                                 <input class="form-control" type="text" name="wmname" id="wmname" placeholder="Full Name*" value="" onkeypress="return ValidateAlpha(event)" required>
                            </div>
                        </div>
                        <div class="col-xxl-12 col-xl-12 col-lg-12 col-md-12 col-sm-12 col-12">
                            <div class="form-group">
                                <input class="form-control" type="text" name="wmobile" id="wmobile" onkeyup="this.value=this.value.replace(/[^0-9]/g,'')"
oninput="this.value = this.value.replace(/[^0-9.]/g, '').replace(/(\..*)\./g, '$1');" maxlength="10" value="" placeholder="Mobile Number*" required>
                            </div>
                        </div>
                        <div class="col-xxl-12 col-xl-12 col-lg-12 col-md-12 col-sm-12 col-12">
                            <button type="submit" name="whatsapp_submit"  id="whatsEnq" class="read_more_btn_2">Submit</button>
                        </div>
                    </div>
                </form>
            </div>
        </div>
    </div>
</div>

<div class="modal fade" id="myModal" tabindex="-1" role="dialog">
    <div class="modal-dialog modal-sm">
        <div class="modal-content">
            <div class="modal-header">
                <div class="modal-title">Quick Enquiry</div>
                <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
            </div>
            <div class="modal-body">
                <form id="quick_enquiry" method="post">
                    <script>
                        setTimeout(function(){
                            $.getScript("https://www.google.com/recaptcha/api.js");
                            }, 10000)
                    </script>
                <span class="text-danger cat_error_message"></span>
                <span class="text-success cat_success_message"></span>
                    <div class="form-group">
                        <input class="form-control" type="text" name="names" onkeypress="return ValidateAlpha(event)" placeholder="Full Name*" value="" required>
                    </div>

                    <div class="form-group">
                          <input class="form-control" type="email" name="emails" value="" placeholder="Email ID*" required>
                    </div>

                    <div class="form-group">
                          <input class="form-control" type="tel" name="mobiles" value="" placeholder="Mobile Number*" onkeyup="if (/\D/g.test(this.value)) this.value = this.value.replace(/\D/g,'')" maxlength="10" required>
                    </div>

                    <div class="form-group">
                          <input class="form-control" type="text" name="locations" onkeypress="return ValidateAlpha(event)" value="" placeholder="Your Location*" required>
                    </div>

                    <div class="form-group">
                         <textarea class="form-control" name="messages" placeholder="Your Message*" required></textarea>
                    </div>

                    <div class="form-group" style="margin-bottom: 0;">
                        <div class="g-recaptcha" data-sitekey="<?=SITE_KEY;?>"></div>
                    </div>

                    <button type="submit" name="submit-enquiry" class="read_more_btn_2">Submit</button>
                </form>
            </div>
        </div>
    </div>
</div>

<div class="modal fade" id="productID" tabindex="-1">
    <div class="modal-dialog modal-lg">
        <div class="modal-content">
            <div class="modal-header">
                <div class="modal-title">Send Enquiry</div>
                <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
            </div>
            <div class="modal-body">
                <div class="row">
                    <div class="col-xxl-7 col-xl-7 col-lg-7 col-md-7 col-sm-7 col-12">
                        <div class="product_popup">
                        <div class="product_popup_image">
                               <img class="img-responsive catImg" src="<?=site_url;?>/designer/images/no-image.jpg" alt="No image" title="No image">
                            </div>                     
                        </div>
                    </div>
                    <div class="col-xxl-5 col-xl-5 col-lg-5 col-md-5 col-sm-5 col-12">

                        <form name="contact-form" method="post" id="product_pop_form">
                             <div id="mail-status1"></div>
                            <div class="form-group">
                                <input class="form-control" type="text" name="catuser_name" id="catuser_name" onkeypress="return ValidateAlpha(event)" placeholder="Full Name*" value=""  required>
                            </div>

                            <div class="form-group">
                                <input class="form-control" type="email" name="catemail_address" id="catemail_address" placeholder=" Email ID*" value="" required>
                            </div>

                            <div class="form-group">
                                <input class="form-control" type="tel" name="catphone_no" id="catphone_no" onkeyup="this.value=this.value.replace(/[^0-9]/g,'')" oninput="this.value = this.value.replace(/[^0-9.]/g, '').replace(/(\..*)\./g, '$1');" maxlength="10" placeholder=" Phone No*" value="" required>
                            </div>

                            <div class="form-group">
                                <input class="form-control" type="text"  placeholder="Location*" value="" name="catlocation" id="catlocation" required>
                            </div>
                            <div class="form-group">
                                <textarea class="form-control" name="caten_message" id="caten_message" placeholder=" Message*" required></textarea>
                            </div>

                            <div class="form-group" style="margin-bottom: 0;">
                                <div class="g-recaptcha" data-sitekey="<?=SITE_KEY;?>"></div>
                            </div>

                            <div class="form-group">
                                <button type="submit" name="submit" id="cat_submit" class="read_more_btn_2">Submit</button>
                            </div>
                        </form>

                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
<div class="modal fade" id="callback" tabindex="-1">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <div class="modal-title">Get Callback Quickly</div>
                <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
            </div>
            <div class="modal-body">
                <div class="row">
                    <div class="col-xxl-5 col-xl-5 col-lg-5 col-md-5 col-sm-5 col-12">
                        <div class="product_popup">
                            <div class="product_popup_image">
                                <img class="img-responsive catImg" src="<?=site_url;?>/designer/images/no-image.jpg" alt="No image" title="No image">
                            </div>
                           
                        </div>
                    </div>
                    <div class="col-xxl-7 col-xl-7 col-lg-7 col-md-7 col-sm-7 col-12">

                        <form name="contact-form" method="post" id="callback_form">
                            <div id="num_response"></div>
                            <div class="form-group">
                                <input class="form-control" type="text" name="qname" id="qname" placeholder="Full Name*" onkeypress="return ValidateAlpha(event)" value="" pattern="[a-z A-Z]+" required>
                            </div>


                            <div class="form-group">
                                <input class="form-control" type="tel" name="qmobile" id="qmobile" placeholder=" Phone No*" value="" onkeyup="this.value=this.value.replace(/[^0-9]/g,'')" oninput="this.value = this.value.replace(/[^0-9.]/g, '').replace(/(\..*)\./g, '$1');" maxlength="10" required>
                            </div>
                            <p>We will contact you on this number</p>

                            <div class="form-group">
                                <button type="submit" id="Num_enq" class="read_more_btn_2">Submit</button>
                            </div>
                        </form>

                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
<script>
   $(document).ready(function(){
    $('#cat_submit').click(function(e){
           e.preventDefault();
         if($("#catuser_name").val()!='' && $("#catemail_address").val()!='' && $("#catphone_no").val()!='' && $("#caten_message").val()!='' && $("#catlocation").val()!=''){
            jQuery.ajax({
            url: "<?=site_url;?>/ajaxEnquirycat.php",
           data:$('#product_pop_form').serialize(),
            type: "POST",
            success:function(data){
                var data = data.trim();
                if(data=='success'){
                     $("#mail-status1").html('<div class="alert alert-success alert-dismissible show">Your Enquiry has been sent successfully.  Our Team will contact you shortly!<button type="button" class="close" data-bs-dismiss="alert" aria-label="Close"><span aria-hidden="true">&times;</span></button></div>');
                        $('#productID').trigger('reset');
                    
                }else{
                     $("#mail-status1").html(data).css('color','red');
                }
            },
            error:function (){}
            });
        }else{
             $("#mail-status1").html('<div class="alert alert-danger alert-dismissible show"><strong>Asterisk(*) Marked fields are Mandatory!<button type="button" class="close" data-bs-dismiss="alert" aria-label="Close"><span aria-hidden="true">&times;</span></button></div>');
        }
     
       })    
       
         }) 
</script>

<script>
$(document).ready(function(){
  $('#whatsEnq').click(function(e){
      
    
         e.preventDefault();
     var wname = $('#wmname').val();
     var wmobile = $('#wmobile').val();
     $.ajax({
          url: "<?=site_url;?>/whatsapp_enq.php",
          data:$('#contact_id').serialize(),
         type : "POST",
         success : function(data){
               
             if(data.trim() == 'success')
                 {
                    
                 $('#whatsapp_response').html('<div class="alert alert-success">Whatsapp Enquiry Submitted successfully</div>');
                    $('#whatsappEnq').trigger('reset');
                     
                     window.open("https://api.whatsapp.com/send?phone=919537966270&text=Hello, I was on your website https://www.melodyledotlight.com/  and I am interested in your product.&source=&data=&app_absent=","_blank");
                   
                 }
             else{
                
                 $('#whatsapp_response').html(data);
             }
         }
        
     })
          
      })
  })  
</script>

<script>
    $(document).ready(function() {
        $('#Num_enq').click(function(e) {
            e.preventDefault();
            var wmobile = $('#qname').val() && $('#qmobile').val();
            $.ajax({
                url: "<?= site_url; ?>/num_enq.php",
                data: $('#callback_form').serialize(),
                type: "POST",
                success: function(data) {
                    if (data == 'success') {
                        $('#num_response').html(
                            '<div class="alert alert-success">Callback From Enquiry Submitted successfully<button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"><span aria-hidden="true">&times;</span></button></div>'
                        );
                        $('#callback_form').trigger('reset');
                    } else {
                        $("#num_response").html(data).css('color', 'red');
                    }
                }
            })
        })
    })
</script>