<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <title>PRUfutureteam | Absen</title>
  <!-- Tell the browser to be responsive to screen width -->
  <meta content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" name="viewport">
  <link rel="SHORTCUT ICON" HREF="<?php echo base_url()?>dist/logo.png">
  <!-- Bootstrap 3.3.6 -->
  <link  href="<?php echo base_url()?>bootstrap/css/bootstrap.min.css" rel="stylesheet">
  <!-- Font Awesome -->
  <link href="<?php echo base_url()?>plugins/font-awesome/css/font-awesome.min.css" rel="stylesheet">
  <!-- Theme style -->
  <link href="<?php echo base_url()?>dist/css/AdminLTE.min.css" rel="stylesheet">
  <!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
  <!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
  <!--[if lt IE 9]>
  <script src="https://oss.maxcdn.com/html5shiv/3.7.3/html5shiv.min.js"></script>
  <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
  <![endif]-->
<style>
#loadingmessage{
  position:fixed;
  top:0px;
  right:0px;
  width:100%;
  height:100%;
  background-color:#666;
  background-image:url('<?php echo base_url()?>dist/flickr.gif');
  background-repeat:no-repeat;
  background-position:center;
  z-index:10000000;
  opacity: 0.4;
  filter: alpha(opacity=40); /* For IE8 and earlier */
}

</style> 
</head>
<body class="login-page" onLoad="startTime()" >
<div class="wrapper">
  <section class="content">
<div
  <div class="col-md-6 col-md-offset-3">
   <div class="login-logo">
    <b>Presensi PRUfutureteam</b>
	<br/>
	<?php date_default_timezone_set('Asia/Jakarta');
    echo(date('d-m-Y')); ?> <div id="txt"></div>
    </div>

    <div class="login-box-body">
<div class="table-responsive">
<div class="box-tools">
                <div class="input-group input-group-sm" style="width: 150px;">
                  <input type="text" name="table_search" class="form-control pull-right" id="search" placeholder="Search">
                  </div>
                  </div>
  <table id="example1" class="table table-bordered table-striped">
                    <thead>
                      <tr style="center">
                        <th>Nik</th>
                        <th>Nama</th>
                        <th>Jabatan</th>
                        <th>Masuk</th>
                        <th>Keluar</th>
                      </tr>
                    </thead>
                    <tbody>
                      <?php  foreach($query as $row):
                      $jam=date('H:i:s');
                      $hari=date('l');    
                      ?>
                    <tr>   
                        <td><?php echo $row->nik ?></td>
                        <td><?php echo $row->nama ?></td>
                        <td><?php echo $row->jabatan ?></td>
                        <td>
                      <?php 
                      if($row->masuk=='' and $jam<'12:00:00') {
                      ?>
                            <div class='buttonmasuk'>
                              <a class="btn btn-sm btn-primary" href="javascript:void()" title="Masuk" onclick="masuk('<?php echo $row->id_kar;?>')">Masuk</a>
                              <form class="formmasuk" action="#">
                              <input type="hidden" name="id_kar" value="<?php echo $row->id_kar;?>">
                              <input type="text" name="pass" id="passmasuk">
                              </form>
                         </div> <?php }else {
                         echo $row->masuk;
                          } ?>
                              <td>
                               <?php 
                               if($hari=='Saturday'){ ?>
                               <?php
                                 if($row->keluar=='' and $jam>'12:00:00') {
                                 ?>
                              <div class='buttonmasuk'>
                              <a class="btn btn-sm btn-danger"  title="Keluar" ></i> Keluar</a>
                              <form class='formkeluar'>
                               <input type="hidden" name="id_kar" value="<?php echo $row->id_kar;?>">
                              <input type="text" name="pass" id="passkeluar">
                              </form>
                         </div>
                         <?php }else {
                         echo $row->keluar;
                          } 
                         } else {?>
                              <?php
                              if($row->keluar=='' and $jam>'12:00:00') {
                                 ?>
                              <div class='buttonmasuk'>
                              <a class="btn btn-sm btn-danger"  title="Keluar" ></i> Keluar</a>
                              <form class='formkeluar'>
                               <input type="hidden" name="id_kar" value="<?php echo $row->id_kar;?>">
                              <input type="text" name="pass" id="passkeluar">
                              </form>
                         </div>
                         <?php }else {
                         echo $row->keluar;
                          } }?>
                              </td>
                       </tr>
                        <?php 
                        endforeach ;?>
                    </tbody>  
                  </table>
</div>     
    </div>
</div>
</div>
<!-- /.login-box -->
<!-- /.register-box -->
<!-- jQuery 2.2.3 -->
 </section>
    <!-- /.content -->
  </div>
 <a class="btn btn-sm btn-success" style="position:fixed;bottom:20px;right:20px;margin:0;" href="<?php echo base_url()?>beranda">LOGIN</a>
<div id='loadingmessage' style='display:none'>

      </div>

<script src="<?php echo base_url()?>plugins/jQuery/jQuery-2.1.4.min.js"></script>
<!-- Bootstrap 3.3.6 -->
<script src="<?php echo base_url()?>bootstrap/js/bootstrap.min.js"></script>
<script>
$(document).ready(function() {
$('.formmasuk').keypress(function (e) {
  if (e.which == 13) {
 $(this).hide();
$('#loadingmessage').show();
        $.ajax({
        url : '<?php echo base_url(); ?>absen/cekmasuk/',
        type: "POST",
        data: $(this).serialize(),
        dataType: "JSON",
        success: function(data)
        {
$('#loadingmessage').hide();
            if(data=='0') //if success close modal 
            {
                alert('password salah');           
             window.location.reload(true);                     
            }if(data=='1'){
              window.location.reload(true);
            }
        }
    });
           return false; 
      }
  });
var $rows = $('#example1 tbody tr');
$('#search').keyup(function() {
    
    var val = '^(?=.*\\b' + $.trim($(this).val()).split(/\s+/).join('\\b)(?=.*\\b') + ').*$',
        reg = RegExp(val, 'i'),
        text;
    $rows.show().filter(function() {
        text = $(this).text().replace(/\s+/g, ' ');
        return !reg.test(text);
    }).hide();
});
$('.formkeluar').keypress(function (e) {
  if (e.which == 13) {
 $(this).hide(); 
$('#loadingmessage').show();
        $.ajax({
        url : '<?php echo base_url(); ?>absen/cekkeluar/',
        type: "POST",
        data: $(this).serialize(),
        dataType: "JSON",
        success: function(data)
        {
$('#loadingmessage').hide();
             if(data=='0') //if success close modal 
            {
                alert('password salah');
                window.location.reload(true);     
            }if(data=='1'){
              window.location.reload(true);
            }
        }
    });
           return false; 
      }
  });
$('form').hide();
$('.btn-primary').click(function() {
   $('.formmasuk')[0].reset();
  $(this).next('form').show();
  $(this).closest('.btn-primary').hide();
});
$('.btn-danger').click(function() {
  $(this).next('form').show();
  $(this).closest('.btn-danger').hide();
  });
});
function startTime()
{
var today=new Date();
var h=today.getHours();
var m=today.getMinutes();
var s=today.getSeconds();
// add a zero in front of numbers<10
m=checkTime(m);
s=checkTime(s);
document.getElementById('txt').innerHTML=h+":"+m+":"+s;
t=setTimeout(function(){startTime()},500);

/**
if(h+":"+m+":"+s=='17:00:00'){
  window.location.replace("<?php echo site_url('absen')?>");
}
if(today.getDay()==6){
  if(h>='12'){
  $('.btn-danger').show();
}if (h<'12'){
 $('.btn-danger').hide(); 
}

}else if(today.getDay()==0){
$('.btn-danger').hide();
$('.btn-primary').hide();
}else{
  if(h>='17'){
  $('.btn-danger').show();
}if (h<'17'){
 $('.btn-danger').hide(); 
}

}**/

}

function checkTime(i)
{
if (i<10)
  {
  i="0" + i;
  }
return i;
}
</script>
</body>
</html>
