

<!DOCTYPE html>
<html>
<head>
  <title>Forgot_password Page</title>
   <!--Made with love by Mutiullah Samim -->
     <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css">
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js"></script>
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js"></script>
  
    

  <link rel="stylesheet" type="text/css" href="styles.css">
 



</head>
<body  >


      <?php include 'heder.php';?>
      <br><br><br><br><br><br>
<center>
    <div class=" container"  >

        <div class="col-lg-8 m-auto d-block" style=" border-radius: 10px;font-family:Rockwell;font-size: 20px; 
        background-color: #4682B4 ;">
       <br>
    
    <h1 class="text-red" style="text-align: center;color:#8B0000;font-family:Monotype Corsiva;font-size: 50px;"><b>New Create Password  </b></h1>

       
            <form method="POST" action="forgot_password_process.php">
                <div class="form-group row col-lg-10">
                    <label for="user" style="font-size: 20px; color: black "> Email: </label>
                    <input type="email" name="email" placeholder="Email" id="email" class="form-control"autocomplete="off" required>
                    <h5 id="emailcheck" ></h5>
                </div>
                <div class="form-group  pass_show row col-lg-10">
                    <label for="password" style="font-size: 20px; color: black "> Create  New password: </label>
 <input type="password" placeholder="********" name="password" id="password" class="form-control" maxlength="8" minlength="8" autocomplete="off" required>  
                
                <h5 id="passcheck"></h5>
                </div>
                 <div class="form-group  pass_show row col-lg-10">
                    <label for="password" style="font-size: 20px; color: black "> Confirm password: </label>
                    <input type="password" placeholder="********" name="conpassword" id="conpassword" class="form-control" maxlength="8" minlength="8" autocomplete="off" required>  
                
                <h5 id="conpasswordcheck"></h5>
                </div>

                 
                 

            
                <input type="submit" name="submit" id="submitbtn" value="submit" class="btn btn-primary" style="text-align: center; font-size: 30px">
                
            </form>
            
            <br>
        </div>
    </div></center>
    <br>
     <div class="jumbotron" style="margin-top: 0px;background-color:#2980B9;  margin-bottom: 0px;">
    <div class="container" style="margin-top: 30px;">
      <p id="abt-ftr" style="color: white">@ Copyright 2019-2020 www.bi_lal.com. All rights reseerved. Developed by <span style="color:black;">Saurabh Salvi</span> &nbsp;<span style="color: white;"> Privacy policy &#10072; Disclaimer</span></p>
    </div>
  </div>
  </div>
<script type="text/javascript">
    $(document).ready(function(){
            $('usercheck').hide();
            $('passcheck').hide();
            $('emailcheck').hide();
    
            

            var user_err =true;
            var pass_err =true;
            var conpass_err=true;
         
            

            $('#email').keyup(function(){
                email_check();
            });
            function email_check(){
                var email_val =$('#email').val();
                var reg = /^\w+([-+.']\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*$/
                if (email_val.length == '') {
                    $('#emailcheck').show();
                    $('#emailcheck').html("<p class=text-DarkRed >**Please Fill the email</p>");
                    $('#emailcheck').focus();
                    $("#email").css("border","2px solid DarkRed ");
                    
                    return false;
                } else {
                    $('#emailcheck').hide();
                } if (reg.test(email_val)) {
                    
                    
                  //if ((email_val.length  >= 5) == (email_val.length  <= 8)) {
                    $('#emailcheck').show();
                    $("#email").css("border","2px solid DarkGreen ");
                    $("#emailcheck").html("<p class=text-light>Validated</p>");
                     $('#emailcheck').focus();
                    return true;
                } else {
$('#emailcheck').focus();
$('#emailcheck').show();
                    $("#email").css("border","2px solid DarkRed ");
                    $("#emailcheck").html("<p class=text-DarkRed >Un-Validated</p>");
                    return false;
                }
            }

            $('#password').keyup(function(){
                password_check();
            });
            function password_check(){
                var passwrdstr =$('#password').val();

                if (passwrdstr.length == '') {
                    $('#passcheck').show();
                    $('#passcheck').html("**Please Fill the password");
                    $('#passcheck').focus();
                    $('#passcheck').css("color","DarkRed ");
                    pass_err =false;
                    return false;
                } else {
                    $('#passcheck').hide();
                }
                if ((passwrdstr.length =='8')) {
                    $('#passcheck').show();
                    $('#passcheck').html("**password length  8");
                    $('#passcheck').focus();
                    $('#passcheck').css("color","DarkRed ");
                    pass_err =false;
                    return false;
                } else {
                    $('#passcheck').hide();
                }

            }
             

             /*$('#conpassword').keyup(function(){
                con_password();
            });
            function conpassword_check(){
                var conpass =$('#conpassword').val();
                var passwrdstr =$('#password').val();

                if (conpass.length == '') {
                    $('#conpasswordcheck').show();
                    $('#conpasswordcheck').html("**Please Fill the conpassword");
                    $('#conpasswordcheck').focus();
                    $('#conpasswordcheck').css("color","DarkRed ");
                    pass_err =false;
                    return false;
                } else {
                    $('#conpasswordcheck').hide();
                }
                if (passwrdstr == conpass) {
                    $('#conpasswordcheck').show();
                    $('#conpasswordcheck').html("**conpassword length  8");
                    $('#conpasswordcheck').focus();
                    $('#conpasswordcheck').css("color","DarkRed ");
                    pass_err =false;
                    return false;
                } else {
                    $('#conpasswordcheck').hide();
                }

            }*/
            $('#conpassword').keyup(function(){
                if(con_password()){
                $("#canpassword").css("border","2px solid DarkGreen ");
                    $("#conpasswordcheck").html("<p class=text-light> password is Valid</p>");

            }else{
                $("#canpassword").css("border","2px solid DarkRed ");
                    $("#conpasswordcheck").html("<p class=text-DarkRed > password is Not  Valid</p>");

            }
            });
            function con_password(){
                var conpass =$('#conpassword').val();
                var passwrdstr =$('#password').val();

                if (passwrdstr == conpass) {
                    
                    
                    conpass_err =true;
                    return true;
                } else {
                    return false;
                    
                }  
          
                
            }
           
          
                
            
            $('#submitbtn').click(function(){
                var user_err =true;
                var pass_err =true;
               
               

                email_check();
                password_check();
                con_password();
              

                if ((user_err == true) && (pass_err == true) && (conpass_err == true) ) {
                    return true;
                } else {
                    return false;
                }
            });

            

    });
    function myFunction() {
  var x = document.getElementById("password");
  if (x.type === "password") {
    x.type = "text";
  } else {
    x.type = "password";
  }
}
</script>



</body>
</html>