<!-- Header Wrap Starts -->
<?php include "common/header.php"; 

if (isset($_SESSION['normal_user_cey'])) {
  $redirectUrl = "index";
  echo "<script type=\"text/javascript\">";
  echo "window.location.href = '$redirectUrl'";
  echo "</script>";
}
?> 

<!-- Header Wrap Ends -->

<?php include "common/navbar.php"; ?> 

<!-- Main Container Starts -->
<div class="main-container" >
  <!-- Product Container Starts -->
  <div id="product-product" class="container" style="background-image: url(image/bg.jpg); ">
    <!-- Row Starts -->  
    <div class="col-lg-2"></div>
    <div class="row col-sm-8">

      <div id="content" class="login">
        <h3 class="page-heading-1">REGISTER</h3>
      <p>Already a Member? <a href="sign-in.php" class="text-primary">Sign In</a></p>
      
      <form class="my-4" method="post" id="reg_form" action="javascript:void(0);">
      <div class="row">
        <div class="form-group col-lg-6 mb-3">
          <label class="mb-1">First Name<font color="#FF3300">*</font></label>
          <input type="text" class="form-control clr" id="fname" name="fname" placeholder="First Name" required autocomplete="off"><span class="help-block"></span>
        </div>
        <div class="form-group col-lg-6 mb-3">
          <label class="mb-1">Last Name<font color="#FF3300">*</font></label>
          <input type="text" class="form-control clr" id="lname" name="lname" placeholder="Last Name" required autocomplete="off"><span class="help-block"></span>
        </div>
      </div>
      <div class="row">
        <div class="form-group col-lg-6 mb-3">
          <label class="mb-1">Address Line1<font color="#FF3300">*</font></label>
          <input type="text" class="form-control clr" id="address_1" name="address_1" placeholder="Address Line1" required autocomplete="off"><span class="help-block"></span>
        </div>
        <div class="form-group col-lg-6 mb-3">
          <label class="mb-1">Address Line2</label>
          <input type="text" class="form-control clr" id="address_2" name="address_2" placeholder="Address Line2" autocomplete="off"><span class="help-block"></span>
        </div>
      </div>
      <div class="row">
        <div class="form-group col-lg-12 mb-3">
          <label class="mb-1">City<font color="#FF3300">*</font></label>
          <input type="text" class="form-control clr" id="city" name="city" placeholder="City" required autocomplete="off"><span class="help-block"></span>
        </div>
        <div class="form-group col-lg-12 mb-3">
          <label class="mb-1">Contact No<font color="#FF3300">*</font></label>
          <input type="text" class="form-control clr" id="tel_no" name="tel_no" maxlength=10 placeholder="Contact No" required autocomplete="off"><span class="help-block"></span>
        </div>
        <div class="form-group col-lg-12 mb-3">
          <label class="mb-1">Email Address<font color="#FF3300">*</font></label>
          <input type="email" class="form-control clr" id="email" name="email" placeholder="Email Address" required autocomplete="off"><span class="help-block"></span>
        </div>
      </div>
      <div class="row">
        <div class="form-group col-lg-6 mb-3">
          <label class="mb-1">Account Password<font color="#FF3300">*</font></label>
          <input type="password" class="form-control clr" id="password" name="password" required autocomplete="off"><span class="help-block"></span>
        </div>
        <div class="form-group col-lg-6 mb-3">
          <label class="mb-1">Confirm Password<font color="#FF3300">*</font></label>
          <input type="password" class="form-control clr" id="cpassword" name="cpassword" required autocomplete="off"><span class="help-block"></span>
        </div>
      </div>

      <div id="errorDiv"></div>
      <div class="form-group pt-3 m-0">
        <input type="submit" class="btn btn-inverse" value="Register Now" name="reg_btn" id="reg_btn">
      </div>
        <?php if(isset($_SESSION['temp_user_cey'])) { ?>
        <hr class="my-5">
        <div class="text-center">
          <a href="connection/guest-login" class="btn btn-inverse">CONTINUE AS A GUEST</a>
        </div>
        <?php } ?>
      </form>
    
      </div>
    </div>
    <div class="col-lg-2"></div>
  </div>
</div>
<!-- Main Container Ends -->


<!-- Footer Starts -->
<?php include "common/footer.php"; ?> 

<!-- Footer Ends -->

<script type="text/javascript">
$('document').ready(function () {
  // valid email pattern
  var eregex = /^([a-zA-Z0-9_\.\-\+])+\@(([a-zA-Z0-9\-])+\.)+([a-zA-Z0-9]{2,4})+$/;
  $.validator.addMethod("validemail", function (value, element) {
    return this.optional(element) || eregex.test(value);
  });
  
  // contact no validation
  var telregex = /^\d{10}$/;
  $.validator.addMethod("validtel", function (value, element) {
    return this.optional(element) || telregex.test(value);
  });
  
  // JavaScript Validation For Reg Form 
  $("#reg_form").validate({
    rules: {
      password: {
        required: true,
        minlength: 5,
        maxlength: 15
      },
      email: {
        required: true,
        validemail: true
      },
      cpassword: {
        required: true,
        equalTo: '#password'
      },
      tel_no: {
        validtel: true,
      }
    },
    messages: {
      password: {
        minlength: "Password at least have 5 characters"
      },
      email: {
        validemail: "Please Enter Valid Email Address"
      },
      cpassword: {
        equalTo: "Passwords do not match!"
      },
      tel_no: {
        validtel: "Invalid Contact Number"
      }
    },
    errorPlacement: function (error, element) {
      $(element).closest('.form-group').find('.help-block').html(error.html());
    },
    highlight: function (element) {
      $(element).closest('.form-group').removeClass('has-success').addClass('has-error');
    },
    unhighlight: function (element, errorClass, validClass) {
      $(element).closest('.form-group').removeClass('has-error');
      $(element).closest('.form-group').find('.help-block').html('');
    },
    submitHandler: regForm
  });

  function regForm() {
    $("#pre_loader").fadeIn();
    $.ajax({
    url: 'connection/user_login',
    type: 'POST',
    data: $('#reg_form').serialize(),
    dataType: 'json'
    })
    .done(function (data) {
      $('input[name=reg_btn]').prop('disabled', true);
      $('input[type=text],input[type=password],input[type=email]').prop('disabled', true);
      setTimeout(function () {
        if (data.status === '1') {
          $("#pre_loader").fadeOut("slow");
          //send_sms_fun(data.tel_no, data.email);
          setTimeout(function() {
            window.location.href = 'checkout';
          }, 1000);
        
        } else if (data.status === '2') {
          $("#pre_loader").fadeOut("slow");
          //send_sms_fun(data.tel_no, data.email);
          setTimeout(function() {
            window.location.href = 'index';
          }, 1000);
        
        } else {
          $("#pre_loader").fadeOut("slow");
          $('#errorDiv').slideDown(200, function () {
            $('#errorDiv').html('<div class="alert alert-danger">' + data.message + '</div>');
            $('#errorDiv').delay(5000).slideUp(100);
            $('input[type=text],input[type=password],input[type=email]').prop('disabled', false);
            $('input[name=reg_btn]').prop('disabled', false);       
            $('#email').focus();
            $('#password').val('');
            $('#cpassword').val('');
          });
        }
      }, 1000);
    })
    .fail(function () {
      $('input[name=reg_btn]').prop('disabled', true);
      $('input[type=text],input[type=password],input[type=email]').prop('disabled', true);
      setTimeout(function () {
        $("#pre_loader").fadeOut("slow");
        //alert('An unknown error occoured, Please try again Later...!')
        $('#errorDiv').slideDown(200, function () {
          $('#errorDiv').html('<div class="alert alert-danger">An unknown error occoured, Please try again Later...!</div>');
          $('#errorDiv').delay(5000).slideUp(100);
          $('input[type=text],input[type=password],input[type=email]').prop('disabled', false);
          $('input[name=reg_btn]').prop('disabled', false);
        });
      }, 1000);
    });
  }
});
</script>

</body>
</html> 
