<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <title>ACCE ONLINE VOTING</title>  
  <!-- Tell the browser to be responsive to screen width -->
  <meta name="viewport" content="width=device-width, initial-scale=1">

  <!-- Font Awesome -->
  <link rel="stylesheet" href="<?php echo base_url();?>assets/plugins/fontawesome-free/css/all.min.css">
  <!-- Ionicons -->
  <link rel="stylesheet" href="https://code.ionicframework.com/ionicons/2.0.1/css/ionicons.min.css">
  <!-- icheck bootstrap -->
  <link rel="stylesheet" href="<?php echo base_url();?>assets/plugins/icheck-bootstrap/icheck-bootstrap.min.css">
  <!-- Theme style -->
  <link rel="stylesheet" href="<?php echo base_url();?>assets/dist/css/adminlte.min.css">
  <!-- Google Font: Source Sans Pro -->
  <link href="https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,400i,700" rel="stylesheet">
</head>
<body class="hold-transition login-page">
<div class="login-box">
  <div class="login-logo">
    <a href="../../index2.html"><b>MEMBER</b> LOGIN</a>
  </div>
  <!-- /.login-logo -->
  <div class="card">
    <div class="card-body login-card-body">
      <form action="<?php echo base_url();?>index.php/login/verify_otp/ <?php echo $data;?>" method="post">
        <div class="input-group mb-3">
        <div class="input-group mb-3">
          <input type="text" class="form-control" placeholder="<?php echo $data ?>" value="<?php echo $data ?>"  name="cid" disabled>
          <div class="input-group-append">
            <div class="input-group-text">
              <span class="fas fa-envelope"></span>
            </div>
          </div>
        </div>
         <?php if($_SESSION['msg']!=='You alreay voted'){?>
                  <input type="text" class="form-control" placeholder="Enter OTP" name="otp">
            <?php } ?>

          
              
          <div class="input-group-append">
            <div class="input-group-text">
              <span class="fas fa-envelope"></span>
            </div>
          </div>
        </div>
    <div class="row">
          
          <!-- /.col -->
          <div class="col-12">
         
          </div>
          <!-- /.col -->
        </div>
        <br/>
        <div class="row">
          
          <!-- /.col -->
          <div class="col-12">
          <?php if(isset($_SESSION['msg'])){?>
                  <div class="alert alert-info"> <?php echo $_SESSION['msg']; ?></div>   
            <?php } ?>

          <?php if(isset($_SESSION['invalid_otp'])){?>
                  <div class="alert alert-danger"> <?php echo $_SESSION['invalid_otp']; ?></div>   
            <?php } ?> 
          
          <?php if(isset($_SESSION['otp_resent'])){?>
                  <div class="alert alert-info"> <?php echo $_SESSION['otp_resent']; ?></div>   
            <?php } ?> 
            <button type="submit" class="btn btn-primary btn-block" name="login">Sign In</button>
             
          </div>
          <!-- /.col -->
        </div>
      </form>
      <!-- /.social-auth-links -->
	
	</br>
      <p class="mb-1"> OTP &nbsp;Can be resent after
      <div id="timer" style="display:inline;">2:00 mins</div>
        <a href="<?php echo base_url();?>index.php/login/resend_otp/ <?php echo $data;?>" style="display:none;" id="time">Resend OTP</a>
      </p>
    </div>
    <!-- /.login-card-body -->
  </div>
</div>
<!-- /.login-box -->
 <script>
   function onSubmit(token) {
     document.getElementById("demo-form").submit();
   }
 </script>
<!-- jQuery -->
<script src="../../plugins/jquery/jquery.min.js"></script>
<!-- Bootstrap 4 -->
<script src="../../plugins/bootstrap/js/bootstrap.bundle.min.js"></script>
<!-- AdminLTE App -->
<script src="../../dist/js/adminlte.min.js"></script>

<script type="text/javascript">
var timeoutHandle;
function countdown(minutes) {
    var seconds = 60;
    var mins = minutes
    function tick() {
        var counter = document.getElementById("timer");
        var current_minutes = mins-1;
        seconds--;
        counter.innerHTML =
        current_minutes.toString() + ":" + (seconds < 10 ? "0" : "") + String(seconds);
      

        if(current_minutes==0 && seconds==0)
        {
          document.getElementById("time").style.display="block";
        }
        
        if( seconds > 0 ) {
            timeoutHandle=setTimeout(tick, 1000);
        } 
        
        else {
 
            if(mins > 1){
 
               // countdown(mins-1);   never reach “00″ issue solved:Contributed by Victor Streithorst
               setTimeout(function () { countdown(mins - 1); }, 1000);
 
            }

        }
    }


    tick();
}
 
countdown(2);
 
</script>

</body>
</html>
