        <!-- footer website -->
        <footer class="main-footer">
            <div class="pull-right hidden-xs">
                <b>Website</b> Manajemen CSIRT LPP RRI
            </div>
            <strong>Copyright &copy; 2025 <a href="https://rri.co.id">Direktorat Teknologi dan Media Baru</a>.</strong> All rights reserved.
        </footer>

    </div>
    <!-- /.content-wrapper --> 

    <script src="<?php echo base_url('assets/bower_components/jquery/dist/jquery.min.js'); ?>"></script>
    <!-- Script AJAX untuk pengambilan & pengiriman pesan -->
    <script>
        $(document).ready(function() {
            // Setup AJAX global untuk memasukkan token CSRF, jika perlu
            $.ajaxSetup({
                data: {
                    '<?= $this->security->get_csrf_token_name(); ?>': '<?= $this->security->get_csrf_hash(); ?>'
                }
            });

            function fetchMessages() {
                $.ajax({
                    url: "<?php echo site_url('dashboard/fetch_messages'); ?>",
                    method: "GET",
                    dataType: "json",
                    success: function(data) {
                        var chatBox = $('#chat-box');
                        chatBox.html('');
                        data.forEach(function(message) {
                            chatBox.append(`
                                <div class="item">
                                    <img src="<?php echo base_url('gambar/pengguna/'); ?>${message.sampul}" alt="user image" class="${message.status}">
                                    <p class="message">
                                        <a href="#" class="name">
                                            <small class="text-muted pull-right">
                                                <i class="fa fa-clock-o"></i> ${message.created_at}
                                            </small>
                                            ${message.username}
                                        </a>
                                        ${message.message}
                                    </p>
                                </div>
                            `);
                        });
                        // Scroll ke pesan terbaru
                        chatBox.scrollTop(chatBox[0].scrollHeight);
                    },
                    error: function(xhr, status, error) {
                        console.error('Error fetching messages:', error);
                    }
                });
            }

            $('#chat-form').on('submit', function(e) {
                e.preventDefault();
                var message = $('#message').val().trim();
                if (message === "") {
                    alert("Pesan tidak boleh kosong!");
                    return;
                }
                $.ajax({
                    url: "<?php echo site_url('dashboard/send_message'); ?>",
                    method: "POST",
                    data: { message: message },
                    dataType: "json",
                    success: function(response) {
                        if (response.status === 'success') {
                            $('#message').val('');
                            fetchMessages(); // Refresh segera setelah pesan berhasil dikirim
                        } else {
                            alert(response.message || "Gagal mengirim pesan.");
                        }
                    },
                    error: function(xhr, status, error) {
                        console.error('Error sending message:', error);
                        alert("Gagal mengirim pesan.");
                    }
                });
            });

            // Panggil fetchMessages saat halaman selesai dimuat
            fetchMessages();

            // Auto-refresh chatbox setiap 5 detik (5000 milidetik)
            setInterval(fetchMessages, 5000);
        });
    </script>

    <script src="<?php echo base_url('assets/bower_components/raphael/raphael.min.js'); ?>"></script>
    <script src="<?php echo base_url('assets/bower_components/morris.js/morris.min.js'); ?>"></script>    
    <script src="<?php echo base_url('assets/bower_components/jquery-ui/jquery-ui.min.js'); ?>"></script>    
        
    <!-- Untuk Progress Bar -->
    <script>
        $(document).ready(function() {
            $('#uploadForm').on('submit', function(e) {
                e.preventDefault(); // Mencegah form dari pengiriman default

                // Validasi file sebelum upload
                var fileInput = $('input[name="sampul"]')[0];
                if (fileInput.files.length === 0) {
                    alert('Silakan pilih file untuk diupload.');
                    return;
                }

                // Mengambil data form
                var formData = new FormData(this);

                // Menggunakan AJAX untuk mengupload file
                $.ajax({
                    url: $(this).attr('action'), // URL untuk mengirim data
                    type: 'POST',
                    data: formData,
                    contentType: false, // Jangan set content type
                    processData: false, // Jangan proses data
                    xhr: function() {
                        var xhr = new window.XMLHttpRequest();
                        // Mengupdate progress bar
                        xhr.upload.addEventListener("progress", function(evt) {
                            if (evt.lengthComputable) {
                                var percentComplete = evt.loaded / evt.total;
                                percentComplete = parseInt(percentComplete * 100);
                                $('#progressBarArtikel').css('width', percentComplete + '%');
                                $('#progressBarArtikel').attr('aria-valuenow', percentComplete);
                                $('#progressBarArtikel span').text(percentComplete + '% Complete');
                            }
                        }, false);
                        return xhr;
                    },
                    success: function(response) {
                        // Reset progress bar
                        $('#progressBarArtikel').css('width', '0%');
                        $('#progressBarArtikel').attr('aria-valuenow', 0);
                        $('#progressBarArtikel span').text('0% Complete');

                        // Pastikan respons adalah objek JSON
                        try {
                            response = JSON.parse(response);
                        } catch (e) {
                            alert('Terjadi kesalahan saat memproses respons dari server.');
                            return;
                        }

                        if (response.status === 'success') {
                            // Redirect atau tampilkan pesan sukses
                            window.location.href = "<?php echo base_url('dashboard/artikel'); ?>";
                        } else {
                            // Tampilkan pesan kesalahan
                            alert(response.message);
                        }
                    },
                    error: function() {
                        // Tindakan jika terjadi kesalahan
                        alert('Terjadi kesalahan saat mengupload file.');
                    }
                });
            });
        });
    </script>
    
    <script>
        $(document).ready(function() {
            $('#uploadDokumenForm').on('submit', function(e) {
                e.preventDefault(); // Mencegah form dari pengiriman default

                // Validasi file sebelum upload
                var fileInput = $('input[name="dokumen_baru"]')[0];
                if (fileInput.files.length === 0) {
                    alert('Silakan pilih file untuk diupload.');
                    return;
                }

                // Mengambil data form
                var formData = new FormData(this);

                // Menggunakan AJAX untuk mengupload file
                $.ajax({
                    url: $(this).attr('action'), // URL untuk mengirim data
                    type: 'POST',
                    data: formData,
                    contentType: false, // Jangan set content type
                    processData: false, // Jangan proses data
                    xhr: function() {
                        var xhr = new window.XMLHttpRequest();
                        // Mengupdate progress bar
                        xhr.upload.addEventListener("progress", function(evt) {
                            if (evt.lengthComputable) {
                                var percentComplete = evt.loaded / evt.total;
                                percentComplete = parseInt(percentComplete * 100);
                                $('#progressBarDokumen').css('width', percentComplete + '%');
                                $('#progressBarDokumen').attr('aria-valuenow', percentComplete);
                                $('#progressBarDokumen span').text(percentComplete + '% Complete');
                            }
                        }, false);
                        return xhr;
                    },
                    success: function(response) {
                        // Reset progress bar
                        $('#progressBarDokumen').css('width', '0%');
                        $('#progressBarDokumen').attr('aria-valuenow', 0);
                        $('#progressBarDokumen span').text('0% Complete');

                        // Pastikan respons adalah objek JSON
                        try {
                            response = JSON.parse(response);
                        } catch (e) {
                            alert('Terjadi kesalahan saat memproses respons dari server.');
                            return;
                        }

                        if (response.status === 'success') {
                            // Redirect ke dashboard/panduan
                            window.location.href = "<?php echo base_url('dashboard/panduan'); ?>";
                        } else {
                            // Tampilkan pesan kesalahan
                            alert(response.message);
                        }
                    },
                    error: function() {
                        // Tindakan jika terjadi kesalahan
                        alert('Terjadi kesalahan saat mengupload file.');
                    }
                });
            });
        });
    </script>
    
    <!-- Timer Logout Website Jika Tidak Ada Aktifitas -->
    <script>  
        let timeout;  
        const logoutUrl = "<?php echo base_url('dashboard/keluar'); ?>"; // URL logout yang dapat disesuaikan

        // Fungsi untuk logout  
        function logout() {  
            window.location.href = logoutUrl;  
        }  

        // Fungsi untuk reset timer  
        function resetTimer() {  
            clearTimeout(timeout);  
            timeout = setTimeout(logout, 1800000); // 30 Menit  
        }  

        // Menetapkan event listener untuk mendeteksi aktivitas  
        window.onload = resetTimer;  
        document.onmousemove = resetTimer;  
        document.onkeypress = resetTimer;  
        document.ontouchstart = resetTimer; // Untuk perangkat sentuh  
        document.ontouchmove = resetTimer; // Untuk mendeteksi gerakan sentuh
        document.onclick = resetTimer; // Untuk mendeteksi klik
        document.onscroll = resetTimer; // Untuk mendeteksi scrolling
    </script>

    <script>
        $.widget.bridge('uibutton', $.ui.button);
    </script>    
    
    <script src="<?php echo base_url('assets/bower_components/bootstrap/dist/js/bootstrap.min.js'); ?>"></script>    

    <!-- Memanggil ChartJS dan adapter date untuk sumbu time -->
    <script src="https://cdn.jsdelivr.net/npm/chart.js"></script>
    <script src="https://cdn.jsdelivr.net/npm/chartjs-adapter-date-fns"></script>
    
    <!-- bandwidthChart -->
    <script>
        /* === Chart 1: Real-Time TX/RX Bandwidth === */
        const ctx = document.getElementById('bandwidthChart').getContext('2d');
    const chart = new Chart(ctx, {
        type: 'line',
        data: {
            labels: [],
            datasets: [
                {
                    label: 'TX (kbps)',
                    borderColor: 'rgb(255, 99, 132)',
                    backgroundColor: 'rgba(255, 99, 132, 0.1)',
                    data: [],
                    fill: true,
                    tension: 0.3
                },
                {
                    label: 'RX (kbps)',
                    borderColor: 'rgb(54, 162, 235)',
                    backgroundColor: 'rgba(54, 162, 235, 0.1)',
                    data: [],
                    fill: true,
                    tension: 0.3
                }
            ]
        },
        options: {
            responsive: true,
            scales: {
                x: {
                    title: {
                        display: true,
                        text: 'Waktu'
                    }
                },
                y: {
                    beginAtZero: true,
                    title: {
                        display: true,
                        text: 'Bandwidth (kbps)'
                    }
                }
            },
            plugins: {
                legend: {
                    display: true
                }
            }
        }
    });

    function fetchData() {
        fetch('<?= base_url('dashboard/get_bandwidth_data') ?>')
            .then(response => response.json())
            .then(data => {
                const now = new Date().toLocaleTimeString();
                chart.data.labels.push(now);
                chart.data.datasets[0].data.push(data.tx);
                chart.data.datasets[1].data.push(data.rx);

                if (chart.data.labels.length > 20) {
                    chart.data.labels.shift();
                    chart.data.datasets[0].data.shift();
                    chart.data.datasets[1].data.shift();
                }

                chart.update();
            })
            .catch(error => console.error('Gagal ambil data:', error));
    }

    setInterval(fetchData, 2000); // Update setiap 2 detik

    function fetchData() {
        fetch('<?= base_url('dashboard/get_bandwidth_data') ?>')
            .then(response => response.json())
            .then(data => {
                const now = new Date().toLocaleTimeString();
                chart.data.labels.push(now);
                chart.data.datasets[0].data.push(data.tx);
                chart.data.datasets[1].data.push(data.rx);

                if (chart.data.labels.length > 20) {
                    chart.data.labels.shift();
                    chart.data.datasets[0].data.shift();
                    chart.data.datasets[1].data.shift();
                }

                chart.update();
            })
            .catch(error => console.error('Gagal ambil data:', error));
    }

    setInterval(fetchData, 2000); // Update setiap 2 detik
        
        
        /* === Chart 2: Trend Analysis Insiden (Bar Chart) === */
        // Data trend diambil dari variabel PHP (encoded ke JSON)
        const trendLabels = <?= $trend_labels; ?>;
        const trendCounts = <?= $trend_counts; ?>;
        
        const ctxTrend = document.getElementById('trendChart').getContext('2d');
        const trendChart = new Chart(ctxTrend, {
        type: 'bar',
        data: {
            labels: trendLabels,
            datasets: [{
            label: 'Jumlah Insiden',
            data: trendCounts,
            backgroundColor: 'rgba(153,102,255,0.6)',
            borderColor: 'rgba(153,102,255,1)',
            borderWidth: 1
            }]
        },
        options: {
            responsive: true,
            scales: {
            x: { title: { display: true, text: 'Hari' } },
            y: { beginAtZero: true, title: { display: true, text: 'Jumlah Insiden' } }
            }
        }
        });
        
    </script>            

    <script src="<?php echo base_url('assets/bower_components/datatables.net/js/jquery.dataTables.js'); ?>"></script>
    <script src="<?php echo base_url('assets/bower_components/datatables.net-bs/js/dataTables.js'); ?>"></script>    
    <script src="<?php echo base_url('assets/bower_components/datatables.net-bs/js/dataTables.bootstrap.js'); ?>"></script>   
    <script src="<?php echo base_url('assets/bower_components/datatables.net-bs/js/dataTables.responsive.js'); ?>"></script>    
    <script src="<?php echo base_url('assets/bower_components/datatables.net-bs/js/responsive.bootstrap.js'); ?>"></script>    
    
    <!-- DataTables -->
    <!-- script>
        $(function () {
            // Inisialisasi DataTable untuk tabel dengan ID 'example1'
            $('#table45').DataTable({
                'pageLength': 6 // Menampilkan 6 baris per halaman                
            });

            // Inisialisasi DataTable untuk tabel dengan ID 'example2' dengan opsi konfigurasi
            $('#table84').DataTable({
                'paging': true,          // Mengaktifkan pagination
                'lengthChange': false,   // Menonaktifkan perubahan jumlah tampilan
                'searching': false,      // Menonaktifkan fitur pencarian
                'ordering': true,        // Mengaktifkan pengurutan kolom
                'info': true,            // Menampilkan informasi tabel
                'autoWidth': false,      // Menonaktifkan lebar otomatis kolom
                'pageLength': 5          // Menampilkan 5 baris per halaman
            });
        });
    </!-->

    <script>
        $(function () {
            $('#table45').DataTable({
                responsive: true
            });

            $('#table84').DataTable({
                responsive: true
            });
        });
    </script>

    <!-- Untuk menampilkan pop up jika ingin delete table -->
    <script>
        document.addEventListener('DOMContentLoaded', function() {
            document.querySelectorAll('.delete-btn').forEach(function(button) {
                button.addEventListener('click', function(event) {
                    if (!confirm('Apakah Anda yakin ingin menghapus kategori ini?')) {
                        event.preventDefault();
                    }
                });
            });
        });
    </script>  

    <!-- Untuk Menampilkan Nama Satker Pada Level -->
    <script>
        // Fungsi untuk menampilkan atau menyembunyikan dropdown Satker berdasarkan level yang dipilih
        function toggleSatkerSelect() {
            var level = document.getElementById('level').value; // Ambil nilai level
            var satkerDiv = document.getElementById('satker-select'); // Ambil div untuk Nama Satker

            // Jika level = satker, tampilkan dropdown Nama Satker
            if (level === 'satker') {
                satkerDiv.style.display = 'block';
            } else {
                satkerDiv.style.display = 'none';
            }
        }

        // Event listener untuk menangani perubahan level
        document.getElementById('level').addEventListener('change', toggleSatkerSelect);

        // Cek saat halaman diload untuk memastikan tampilan sesuai dengan nilai sebelumnya
        window.addEventListener('DOMContentLoaded', function() {
            toggleSatkerSelect(); // Panggil fungsi untuk memeriksa nilai level dan menampilkan dropdown Nama Satker jika perlu
        });
    </script>



    <!-- Untuk menampilkan Balok Chart Artikel -->
    <script>
        const ctx = document.getElementById('barChart').getContext('2d');
        
        // Data kategori
        const labels = <?php echo json_encode(array_column($kategori, 'nama_kategori')); ?>;
        const data = <?php echo json_encode(array_column($kategori, 'jumlah')); ?>;

        // Warna spesifik untuk 15 kategori
        const backgroundColors = [
            'rgba(255, 99, 132, 0.6)',  // Kategori 1
            'rgba(54, 162, 235, 0.6)',  // Kategori 2
            'rgba(255, 206, 86, 0.6)',  // Kategori 3
            'rgba(75, 192, 192, 0.6)',  // Kategori 4
            'rgba(153, 102, 255, 0.6)', // Kategori 5
            'rgba(255, 159, 64, 0.6)',  // Kategori 6
            'rgba(199, 199, 199, 0.6)', // Kategori 7
            'rgba(255, 99, 71, 0.6)',   // Kategori 8
            'rgba(173, 216, 230, 0.6)', // Kategori 9
            'rgba(50, 205, 50, 0.6)',   // Kategori 10
            'rgba(147, 112, 219, 0.6)', // Kategori 11
            'rgba(255, 140, 0, 0.6)',   // Kategori 12
            'rgba(70, 130, 180, 0.6)',  // Kategori 13
            'rgba(240, 128, 128, 0.6)', // Kategori 14
            'rgba(46, 139, 87, 0.6)'    // Kategori 15
        ];

        const borderColors = backgroundColors.map(color => color.replace('0.6', '1')); // Warna garis tepi tanpa transparansi

        const kategoriData = {
            labels: labels,
            datasets: [{
                label: 'Jumlah Artikel per Kategori',
                data: data,
                backgroundColor: backgroundColors.slice(0, labels.length), // Ambil warna sebanyak jumlah kategori
                borderColor: borderColors.slice(0, labels.length), // Sinkronisasi warna garis tepi
                borderWidth: 1
            }]
        };

        const barChart = new Chart(ctx, {
            type: 'bar',
            data: kategoriData,
            options: {
                scales: {
                    y: {
                        beginAtZero: true
                    }
                }
            }
        });
    </script>   

    <script src="<?php echo base_url('assets/bower_components/jquery-sparkline/dist/jquery.sparkline.min.js'); ?>"></script>   
    <script src="<?php echo base_url('assets/plugins/jvectormap/jquery-jvectormap-1.2.2.min.js'); ?>"></script>
    <script src="<?php echo base_url('assets/plugins/jvectormap/jquery-jvectormap-world-mill-en.js'); ?>"></script>    
    <script src="<?php echo base_url('assets/bower_components/jquery-knob/dist/jquery.knob.min.js'); ?>"></script>    
    <script src="<?php echo base_url('assets/bower_components/moment/min/moment.min.js'); ?>"></script>
    <script src="<?php echo base_url('assets/bower_components/bootstrap-daterangepicker/daterangepicker.js'); ?>">"></script>   
    <script src="<?php echo base_url('assets/bower_components/bootstrap-datepicker/dist/js/bootstrap-datepicker.min.js'); ?>"></script>    
    <script src="<?php echo base_url('assets/bower_components/ckeditor/ckeditor.js'); ?>"></script>
    <script>
        $(function () {
            // Replace the <textarea id="editor1"> with a CKEditor
            // instance, using default configuration.
            CKEDITOR.replace('editor1')
        })
    </script>      
    <script src="<?php echo base_url('assets/plugins/bootstrap-wysihtml5/bootstrap3-wysihtml5.all.min.js'); ?>"></script>
    <script>
        $(function () {        
            //bootstrap WYSIHTML5 - text editor
            $('.textarea').wysihtml5()
        })
    </script>   
    <script src="<?php echo base_url('assets/bower_components/jquery-slimscroll/jquery.slimscroll.min.js'); ?>"></script> 
    <script src="<?php echo base_url('assets/bower_components/fastclick/lib/fastclick.js'); ?>"></script>    
    <script src="<?php echo base_url('assets/dist/js/adminlte.min.js'); ?>"></script>   
    <script src="<?php echo base_url('assets/dist/js/pages/dashboard.js'); ?>"></script>   
    <script src="<?php echo base_url('assets/dist/js/demo.js'); ?>"></script>

</body>
</html>