184 lines
6.9 KiB
PHP
184 lines
6.9 KiB
PHP
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<title>Change Password - Golf Evolution</title>
|
|
<meta charset="UTF-8">
|
|
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
|
<link rel="icon" href="<?= base_url()."/public/"; ?>assets/member_images/favicon.png" sizes="192x192" />
|
|
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<link rel="stylesheet" href="<?= base_url()."/public/"; ?>assets/member_css/front-style.css">
|
|
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-EVSTQN3/azprG1Anm3QDgpJLIm9Nao0Yz1ztcQTwFspd3yD65VohhpuuCOmLASjC" crossorigin="anonymous">
|
|
<link rel="preconnect" href="https://fonts.googleapis.com">
|
|
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
|
|
<link href="https://fonts.googleapis.com/css2?family=Comfortaa:wght@300;400;500;600;700&family=DM+Sans:wght@400;500;700&display=swap" rel="stylesheet">
|
|
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
|
|
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.4/jquery.min.js"></script>
|
|
<style>
|
|
|
|
.show-password{
|
|
position:relative;
|
|
}
|
|
.field-icon {
|
|
right:25px;
|
|
top:42px;
|
|
position: absolute;
|
|
}
|
|
|
|
</style>
|
|
<?php
|
|
header('Cache-Control: no-cache, no-store, must-revalidate');
|
|
header('Pragma: no-cache');
|
|
header('Expires: 0');
|
|
?>
|
|
</head>
|
|
<body class="forgetpassword">
|
|
<?php include 'member_layout/header.php' ?>
|
|
<section class="pt-5 pb-5">
|
|
<div class="container">
|
|
<div class="recovery-account">
|
|
<h1>Set Password</h1>
|
|
<form method="post" action="<?= base_url()."update_password"; ?>" role="form" class="parsley-examples">
|
|
<input id="id" type="hidden" value="<?= session()->getTempdata('id'); ?>" name="id">
|
|
|
|
<?php if(session()->getTempdata('mail_success')):?>
|
|
<div class="alert alert-success" >
|
|
<?= session()->getTempdata('mail_success'); ?>
|
|
</div>
|
|
<?php endif;?>
|
|
|
|
|
|
<?php if(session()->getTempdata('error')):?>
|
|
<div class="alert alert-danger" >
|
|
<?= session()->getTempdata('error'); ?>
|
|
</div>
|
|
<?php endif;?>
|
|
|
|
<div class="row">
|
|
<div class="col-12 mb-3">
|
|
<label for="email">Email</label>
|
|
<input type="email" id="email" class="form-control" value="<?= session()->getTempdata('email'); ?>" readonly>
|
|
</div>
|
|
<div class="col-12 mb-4 show-password">
|
|
<label for="toggle-password">Password</label>
|
|
<span toggle="#hori-pass1" id="toggle-password" class="fa fa-fw fa-eye field-icon toggle-password"></span>
|
|
<input type="password" id="hori-pass1" name="password" class="form-control" placeholder="Password">
|
|
<div class="aro-pswd_info">
|
|
<div id="pswd_info">
|
|
<h4>Password requirements</h4>
|
|
<ul>
|
|
<li id="letter" class="invalid">At least <strong>one letter</strong></li>
|
|
<li id="capital" class="invalid">At least <strong>one capital letter</strong></li>
|
|
<li id="number" class="invalid">At least <strong>one number</strong></li>
|
|
<li id="length" class="invalid">Be at least <strong>8 characters</strong></li>
|
|
<li id="space" class="invalid">use any one<strong> [~,!,@,#,$,%,^,&,*,-,=,.,;,']</strong></li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
|
|
</div>
|
|
<div class="col-12 mb-4 show-password">
|
|
<label for="toggle-password1">Confirm Password</label>
|
|
<input type="password" id="hori-pass2" data-parsley-equalto="#hori-pass1" class="form-control" placeholder="Enter confirm password" required>
|
|
<span toggle="#hori-pass2" id="toggle-password1" class="fa fa-fw fa-eye field-icon toggle-password"></span>
|
|
</div>
|
|
</div>
|
|
<button type="submit" class="forget-submit">Submit</button>
|
|
</form>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
<?php include 'member_layout/footer.php' ?>
|
|
|
|
<script>
|
|
$(document).ready(function(){
|
|
|
|
$('#hori-pass1').keyup(function() {
|
|
var pswd = $(this).val();
|
|
|
|
//validate the length
|
|
if ( pswd.length < 8 ) {
|
|
$('#length').removeClass('valid').addClass('invalid');
|
|
} else {
|
|
$('#length').removeClass('invalid').addClass('valid');
|
|
}
|
|
|
|
//validate letter
|
|
if ( pswd.match(/[A-z]/) ) {
|
|
$('#letter').removeClass('invalid').addClass('valid');
|
|
} else {
|
|
$('#letter').removeClass('valid').addClass('invalid');
|
|
}
|
|
|
|
//validate capital letter
|
|
if ( pswd.match(/[A-Z]/) ) {
|
|
$('#capital').removeClass('invalid').addClass('valid');
|
|
} else {
|
|
$('#capital').removeClass('valid').addClass('invalid');
|
|
}
|
|
|
|
//validate number
|
|
if ( pswd.match(/\d/) ) {
|
|
$('#number').removeClass('invalid').addClass('valid');
|
|
} else {
|
|
$('#number').removeClass('valid').addClass('invalid');
|
|
}
|
|
|
|
//validate space
|
|
if ( pswd.match(/[^a-zA-Z0-9\-\/]/) ) {
|
|
$('#space').removeClass('invalid').addClass('valid');
|
|
} else {
|
|
$('#space').removeClass('valid').addClass('invalid');
|
|
}
|
|
|
|
}).focus(function() {
|
|
$('#pswd_info').show();
|
|
}).blur(function() {
|
|
$('#pswd_info').hide();
|
|
});
|
|
|
|
});
|
|
</script>
|
|
<script>
|
|
$("#toggle-password").click(function() {
|
|
$(this).toggleClass("fa-eye fa-eye-slash");
|
|
var input = $($(this).attr("toggle"));
|
|
if (input.attr("type") == "password") {
|
|
input.attr("type", "text");
|
|
}
|
|
else {
|
|
input.attr("type", "password");
|
|
}
|
|
});
|
|
|
|
$("#toggle-password1").click(function() {
|
|
$(this).toggleClass("fa-eye fa-eye-slash");
|
|
var input = $($(this).attr("toggle"));
|
|
if (input.attr("type") == "password") {
|
|
input.attr("type", "text");
|
|
}
|
|
else {
|
|
input.attr("type", "password");
|
|
}
|
|
});
|
|
|
|
$("#hori-pass1").change(function() {
|
|
const passwordPattern = /(?=.*\d)(?=.*[a-z])(?=.*[A-Z])(?=.*[^a-zA-Z0-9])(?!.*\s).{8,}/;
|
|
if (passwordPattern.test($('#hori-pass1').val()))
|
|
{
|
|
$('#pass-err').html("")
|
|
}
|
|
else
|
|
{
|
|
$('#pass-err').html("Must contain at least one number 
and one uppercase 
and one special character like !@#$%^&*() 
and lowercase letter,
and at least 8 or more characters").css('color','red')
|
|
}
|
|
});
|
|
</script>
|
|
<!-- Plugin js-->
|
|
<script src="<?= base_url()."/public"; ?>/assets/libs/parsleyjs/parsley.min.js"></script>
|
|
|
|
<!-- Validation init js-->
|
|
<script src="<?= base_url()."/public"; ?>/assets/js/pages/form-validation.init.js"></script>
|
|
</body>
|
|
</html>
|