<!DOCTYPE html>

<html lang="en">


<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <meta name="description" content="Responsive HTML Admin Dashboard Template based on Bootstrap 5">
    <meta name="author" content="NobleUI">
    <meta name="keywords" content="nobleui, bootstrap, bootstrap 5, bootstrap5, admin, dashboard, template, responsive, css, sass, html, theme, front-end, ui kit, web">

    <title id="title"></title>

    <!-- Fonts -->
    <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=Roboto:wght@300;400;500;700;900&amp;display=swap" rel="stylesheet">
    <!-- End fonts -->

    <!-- core:css -->
    <link rel="stylesheet" href="<?= base_url(); ?>/public/assets/vendors/core/core.css">
    <!-- endinject -->

    <!-- Plugin css for this page -->
    <link rel="stylesheet" href="<?= base_url(); ?>/public/assets/vendors/flatpickr/flatpickr.min.css">
    <!-- End plugin css for this page -->

    <!-- inject:css -->
    <link rel="stylesheet" href="<?= base_url(); ?>/public/assets/fonts/feather-font/css/iconfont.css">
    <link rel="stylesheet" href="<?= base_url(); ?>/public/assets/vendors/flag-icon-css/css/flag-icon.min.css">
    <!-- endinject -->

    <!-- Layout styles -->
    <link rel="stylesheet" href="<?= base_url(); ?>/public/assets/css/demo1/style.min.css">
    <!-- End layout styles -->

    <link id="favicon" rel="shortcut icon" href="<?= base_url('/public/assets/images/favicon.png') ?>" />

    <!-- Jquery ajax -->
    <script src="<?= base_url(); ?>/public/assets/vendors/core/core.js"></script>

    <!-- Plugin css for this data table -->
    <link rel="stylesheet" href="<?= base_url(); ?>/public/assets/vendors/datatables.net-bs5/dataTables.bootstrap5.css">
    <!-- End plugin css for this data table -->

    <!-- Plugin css for this notifikasi sweet alert -->
    <link rel="stylesheet" href="<?= base_url(); ?>/public/assets/vendors/sweetalert2/sweetalert2.min.css">
    <!-- End plugin css for this notifikasi sweet alert -->

    <!-- Plugin css for this select2 -->
    <link rel="stylesheet" href="<?= base_url(); ?>/public/assets/vendors/select2/select2.min.css">
    <!-- End plugin css for this select2 -->
</head>

<body>
    <div class="main-wrapper">

        <!-- partial:partials/_sidebar.html -->
        <?= $this->include('layout/sidebar'); ?>

        <!-- partial -->

        <div class="page-wrapper">

            <!-- partial:partials/_navbar.html -->
            <nav class="navbar">
                <a href="#" class="sidebar-toggler">
                    <i data-feather="menu"></i>
                </a>
                <div class="navbar-content">
                    <form class="search-form">
                        <div class="input-group">
                            <div class="input-group-text">
                                <i data-feather="search"></i>
                            </div>
                            <input type="text" class="form-control" id="navbarForm" placeholder="Search here<?= base_url(); ?>/public.">
                        </div>
                    </form>
                    <ul class="navbar-nav">
                        <li class="nav-item dropdown">
                            <a class="nav-link dropdown-toggle" href="#" id="languageDropdown" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
                                <i class="flag-icon flag-icon-us mt-1" title="us"></i> <span class="ms-1 me-1 d-none d-md-inline-block">English</span>
                            </a>
                            <div class="dropdown-menu" aria-labelledby="languageDropdown">
                                <a href="javascript:;" class="dropdown-item py-2"><i class="flag-icon flag-icon-us" title="us" id="us"></i> <span class="ms-1"> English </span></a>
                            </div>
                        </li>
                        <li class="nav-item dropdown">
                            <a class="nav-link dropdown-toggle" href="#" id="appsDropdown" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
                                <i data-feather="grid"></i>
                            </a>
                        </li>
                        <li class="nav-item dropdown">
                            <a class="nav-link dropdown-toggle" href="#" id="profileDropdown" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
                                <img id="profilePictureTemplate" class="wd-30 ht-30 rounded-circle" src="<?= base_url(); ?>/public/assets/images/faces/default.png" alt="profile">
                            </a>
                            <div class="dropdown-menu p-0" aria-labelledby="profileDropdown">
                                <div class="d-flex flex-column align-items-center border-bottom px-5 py-3">
                                    <div class="mb-3">
                                        <img id="profilePictureDropdown" class="wd-80 ht-80 rounded-circle" src="<?= base_url(); ?>/public/assets/images/faces/default.png" alt="">
                                    </div>
                                    <div class="text-center">
                                        <p id="firstnameTemplate" class="tx-16 fw-bolder">Jagodigital</p>
                                        <p id="emailTemplate" class="tx-12 text-muted">jagodigital@gmail.com</p>
                                    </div>
                                </div>
                                <ul class="list-unstyled p-1">
                                    <!-- <li class="dropdown-item py-2">
                                        <a href="<?= base_url(); ?>/users/viewprofil" class="text-body ms-0">
                                            <i class="me-2 icon-md" data-feather="user"></i>
                                            <span>Profile</span>
                                        </a>
                                    </li> -->
                                    <li class="dropdown-item py-2">
                                        <a href="<?= base_url(); ?>/profil/index" class="text-body ms-0">
                                            <i class="me-2 icon-md" data-feather="edit"></i>
                                            <span>Edit Profile</span>
                                        </a>
                                    </li>
                                    <li class="dropdown-item py-2">
                                        <a href="javascript:void(0);" onclick="confirmLogout()" class="text-body ms-0" data-bs-toggle="modal" data-bs-target="#konfirmasiModal">
                                            <i class="me-2 icon-md" data-feather="log-out"></i>
                                            <span>Log Out</span>
                                        </a>
                                    </li>
                                </ul>
                            </div>
                        </li>
                    </ul>
                </div>
            </nav>
            <!-- partial -->

            <div class="page-content">


                <!-- Modal Alert -->
                <div class="modal fade" id="alertMessageModal" tabindex="-1" aria-labelledby="alertMessageModalLabel" aria-hidden="true">
                    <div class="modal-dialog modal-dialog-centered">
                        <div class="modal-content">
                            <div class="modal-header">
                                <h5 class="modal-title" id="alertMessageModalLabel">Pemberitahuan</h5>
                                <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
                            </div>
                            <div class="modal-body" id="alertMessageText">
                                <!-- Pesan sukses atau error akan dimuat di sini -->
                            </div>
                            <div class="modal-footer">
                                <button type="button" class="btn btn-primary" data-bs-dismiss="modal">Tutup</button>
                            </div>
                        </div>
                    </div>
                </div>

                <!-- Alert sukses atau error -->


                <?= $this->renderSection('content'); ?>
            </div>

            <!-- partial:partials/_footer.html -->
            <?= $this->include('layout/footer'); ?>

            <!-- partial -->

        </div>
    </div>

    <!-- Konfrimasi logout pakai alert -->
    <script>
        function confirmLogout() {
            Swal.fire({
                title: 'Konfirmasi Logout',
                text: 'Apakah Anda yakin ingin keluar?',
                icon: 'warning',
                showCancelButton: true,
                confirmButtonColor: '#d33',
                cancelButtonColor: '#3085d6',
                confirmButtonText: 'Ya, Logout!',
                cancelButtonText: 'Batal'
            }).then((result) => {
                if (result.isConfirmed) {
                    window.location.href = "<?= base_url('auth/logout') ?>";
                }
            });
        }
    </script>

    <script>
        $(document).ready(function() {
            loadProfilTemplate(); // Muat Data Profil saat halaman dimuat
            loadSettingsTemplate(); // Muat Data Settings saat halaman dimuat
        });

        // Fungsi Memuat Data Profil
        function loadProfilTemplate() {
            var id_user = $('#id_user').val(); // Ambil User ID dari input hidden atau sesi

            $.ajax({
                url: "<?= base_url('/Profil/getProfil') ?>/" + id_user, // Panggil Controller
                type: 'GET',
                dataType: 'json',
                success: function(response) {
                    if (response.success) {
                        // Update Data Profil
                        $('#firstnameTemplate').text(response.profil.nama || "Nama Tidak Ditemukan");
                        $('#emailTemplate').text(response.profil.email || "Email Tidak Ditemukan");

                        // Update gambar profil jika ada
                        let profileImageUrl = response.profil.foto ?
                            "<?= base_url('/public/assets/images/faces/') ?>/" + response.profil.foto :
                            "<?= base_url('/public/assets/images/faces/default.png') ?>";
                        $('#profilePictureDropdown').attr('src', profileImageUrl);
                        $('#profilePictureTemplate').attr('src', profileImageUrl);

                    } else {
                        alert('Data profil tidak ditemukan!');
                    }
                },
                error: function() {
                    alert('Terjadi kesalahan saat memuat profil');
                }
            });
        }

        function loadSettingsTemplate() {
            $.ajax({
                url: "<?= base_url('/settings/getSettingstemplate') ?>", // URL untuk Settings
                type: 'GET',
                dataType: 'json',
                success: function(response) {
                    if (response.success) {
                        // Update Title dari Settings
                        let appName = response.settings.nama_aplikasi || "Aplikasi Jagodigital";
                        document.title = appName;

                        // Update Favicon dari Settings jika ada logo
                        let faviconUrl = response.settings.logo ?
                            "<?= base_url('/public/assets/images/faces/') ?>/" + response.settings.logo :
                            "<?= base_url('/public/assets/images/favicon.png') ?>";
                        updateFavicon(faviconUrl);
                    } else {
                        console.error("Settings tidak ditemukan!");
                    }
                },
                error: function() {
                    alert('Terjadi kesalahan saat memuat settings');
                }
            });
        }

        // Fungsi untuk memperbarui favicon
        function updateFavicon(url) {
            let favicon = document.getElementById("favicon");
            if (favicon) {
                favicon.href = url; // Update atribut href
            } else {
                // Jika elemen favicon belum ada, buat elemen baru
                favicon = document.createElement("link");
                favicon.rel = "shortcut icon";
                favicon.id = "favicon";
                favicon.href = url;
                document.head.appendChild(favicon);
            }
        }
    </script>

    <script>
        var timeout;

        // Fungsi untuk melakukan logout
        function logout() {
            window.location.href = "<?= base_url('logout') ?>";
        }

        // Fungsi untuk mereset timer setiap kali ada aktivitas
        function resetTimer() {
            clearTimeout(timeout); // Hapus timer yang ada
            timeout = setTimeout(logout, 10 * 60 * 1000); // Set timer untuk 5 menit
        }

        // Deteksi aktivitas pengguna
        document.addEventListener('mousemove', resetTimer);
        document.addEventListener('keydown', resetTimer);

        // Mulai timer pertama kali saat halaman dimuat
        resetTimer();
    </script>


    <!-- select2  -->
    <script src="<?= base_url(); ?>/public/assets/vendors/select2/select2.min.js"></script>
    <!-- Custom js for data-tabel ada pagination dan search -->
    <script src="<?= base_url(); ?>/public/assets/js/data-table.js"></script>

    <!-- Plugin js for this page flatpickr-->
    <script src="<?= base_url(); ?>/public/assets/js/flatpickr.js"></script>
    <script src="<?= base_url(); ?>/public/assets/vendors/flatpickr/flatpickr.min.js"></script>
    <!-- plugin untuk chart -->
    <script src="<?= base_url(); ?>/public/assets/vendors/apexcharts/apexcharts.min.js"></script>
    <!-- End plugin js for this page -->

    <!-- <script src="<?= base_url(); ?>/public/assets/vendors/chartjs/Chart.min.js"></script> -->
    <!-- inject:js -->
    <script src="<?= base_url(); ?>/public/assets/vendors/feather-icons/feather.min.js"></script>
    <script src="<?= base_url(); ?>/public/assets/js/template.js"></script>
    <!-- endinject -->

    <!-- Custom js for this page -->
    <script src="<?= base_url(); ?>/public/assets/js/dashboard-light.js"></script>
    <!-- End custom js for this page -->

    <!-- Plugin js for this page -->
    <script src="<?= base_url(); ?>/public/assets/vendors/datatables.net/jquery.dataTables.js"></script>
    <script src="<?= base_url(); ?>/public/assets/vendors/datatables.net-bs5/dataTables.bootstrap5.js"></script>
    <!-- End plugin js for this page -->

    <!-- Plugin js for this notifikasi alert  -->
    <script src="<?= base_url(); ?>/public/assets/vendors/sweetalert2/sweetalert2.min.js"></script>
    <!-- End plugin js for this notifikasi alert  -->



</body>

</html>