


<!-- Topbar -->


        <nav class="navbar navbar-expand navbar-light bg-white topbar mb-4 static-top shadow">





          <!-- Sidebar Toggle (Topbar) -->


          <button id="sidebarToggleTop" class="btn btn-link d-md-none rounded-circle mr-3">


            <i class="fa fa-bars"></i>


          </button>





          <!-- Topbar Search -->


          <!-- <form class="d-none d-sm-inline-block form-inline mr-auto ml-md-3 my-2 my-md-0 mw-100 navbar-search">


            <div class="input-group">


              <input type="text" class="form-control bg-light border-0 small" placeholder="Search for..." aria-label="Search" aria-describedby="basic-addon2">


              <div class="input-group-append">


                <button class="btn btn-primary" type="button">


                  <i class="fas fa-search fa-sm"></i>


                </button>


              </div>


            </div>


          </form> -->





          <!-- Topbar Navbar -->


          <ul class="navbar-nav ml-auto">





            <!-- Nav Item - Search Dropdown (Visible Only XS) -->


            <li class="nav-item dropdown no-arrow d-sm-none">


              <a class="nav-link dropdown-toggle" href="#" id="searchDropdown" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">


                <i class="fas fa-search fa-fw"></i>


              </a>


              <!-- Dropdown - Messages -->


              <div class="dropdown-menu dropdown-menu-right p-3 shadow animated--grow-in" aria-labelledby="searchDropdown">


                <form class="form-inline mr-auto w-100 navbar-search">


                  <div class="input-group">


                    <input type="text" class="form-control bg-light border-0 small" placeholder="Search for..." aria-label="Search" aria-describedby="basic-addon2">


                    <div class="input-group-append">


                      <button class="btn btn-primary" type="button">


                        <i class="fas fa-search fa-sm"></i>


                      </button>


                    </div>


                  </div>


                </form>


              </div>


            </li>





           <!-- Nav Item - Messages -->


            <li class="nav-item dropdown no-arrow mx-1 <?=$c?>">


              <a class="nav-link dropdown-toggle" href="#" id="messagesDropdown" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">


                <span class="text-info">PKA Periode Ini Tertutup Secara Otomatis Pada : &nbsp</span><b><i id="demo" class="text-danger"></i></b>


              </a>


              <!-- 


              <p>PKA Periode ini Akan ditutup secara otomatis pada</p>


              <p id="demo">gfdghdfhgf</p> -->


            </li>





            <div class="topbar-divider d-none d-sm-block"></div>





            <!-- Nav Item - User Information -->


            <li class="nav-item dropdown no-arrow">


              <a class="nav-link dropdown-toggle" href="#" id="userDropdown" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">


                <span class="mr-2 d-none d-lg-inline text-gray-600 small"><?=ucwords($this->session->userdata("username"));?></span>


                <img class="img-profile rounded-circle" src="<?=base_url().'assets/img/profile/'.$this->session->userdata("foto")?>">


              </a>


              <!-- Dropdown - User Information -->


              <div class="dropdown-menu dropdown-menu-right shadow animated--grow-in" aria-labelledby="userDropdown">


                <a class="dropdown-item" href='javascript:void(0)' onclick="getcontens('page/detail_user');">


                  <i class="fas fa-user fa-sm fa-fw mr-2 text-gray-400"></i>


                  Profile


                </a>


                <a class="dropdown-item <?=$s?>" href="#">


                  <i class="fas fa-cogs fa-sm fa-fw mr-2 text-gray-400"></i>


                  Settings


                </a>


                <div class="dropdown-divider"></div>


                <a class="dropdown-item" href="#" data-toggle="modal" data-target="#logoutModal">


                  <i class="fas fa-sign-out-alt fa-sm fa-fw mr-2 text-gray-400"></i>


                  Logout


                </a>


              </div>


            </li>





          </ul>





        </nav>


        <!-- End of Topbar -->


<script>


// Mengatur waktu akhir perhitungan mundur


var periode_sampai = "<?=$periode_sampai?>";


var countDownDate = new Date(periode_sampai+" 23:59:59").getTime();





// Memperbarui hitungan mundur setiap 1 detik


var x = setInterval(function() {





  // Untuk mendapatkan tanggal dan waktu hari ini


  var now = new Date().getTime();


    


  // Temukan jarak antara sekarang dan tanggal hitung mundur


  var distance = countDownDate - now;


    


  // Perhitungan waktu untuk hari, jam, menit dan detik


  var days = Math.floor(distance / (1000 * 60 * 60 * 24));


  var hours = Math.floor((distance % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60));


  var minutes = Math.floor((distance % (1000 * 60 * 60)) / (1000 * 60));


  var seconds = Math.floor((distance % (1000 * 60)) / 1000);


    





  if(String(hours).length ==1){


    var jam = "0"+hours;


  }else{


    var jam = hours;


  }


  if(String(minutes).length ==1){


    var menit = "0"+minutes;


  }else{


    var menit = minutes;


  }


  if(String(seconds).length ==1){


    var detik = "0"+seconds;


  }else{


    var detik = seconds;


  }


  // Keluarkan hasil dalam elemen dengan id = "demo"


  document.getElementById("demo").innerHTML = days + " Hari " + jam + ":"


  + menit + ":" + detik + "";


    


  // Jika hitungan mundur selesai, tulis beberapa teks 


  if (distance < 0) {


    clearInterval(x);


    document.getElementById("demo").innerHTML = "EXPIRED";


  }


}, 1000);


</script>