<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="utf-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no" />
    <meta name="description" content="" />
    <meta name="author" content="" />
    <title>Login - SINARAN</title>
    <link href="<?php echo base_url('assets_/css/login.css'); ?>" rel="stylesheet" />
    <link rel="shortcut icon" type="image/png" href="<?= base_url('assets_/assets/img/logo-mini.png') ?>">
    <script src="https://use.fontawesome.com/releases/v6.3.0/js/all.js" crossorigin="anonymous"></script>
    <noscript>
        <!-- Pengalihan ke halaman kosong setelah 0 detik -->
        <meta http-equiv="refresh" content="0; url=halaman_kosong.html">
    </noscript>
    <!-- <script>
        // Mencegah klik kanan
        document.addEventListener('contextmenu', function(e) {
            e.preventDefault(); // Mencegah menu konteks
        });

        // Mencegah kombinasi tombol Ctrl+U, F12, dan Ctrl+Shift+I
        document.addEventListener('keydown', function(e) {
            // Cek jika tombol yang ditekan adalah Ctrl+U
            if (e.ctrlKey && e.key === 'u') {
                e.preventDefault(); // Mencegah tindakan default
            }
            // Cek jika tombol yang ditekan adalah F12
            if (e.key === 'F12') {
                e.preventDefault(); // Mencegah tindakan default
            }
            // Cek jika tombol yang ditekan adalah Ctrl+Shift+I
            if (e.ctrlKey && e.shiftKey && e.key === 'I') {
                e.preventDefault(); // Mencegah tindakan default
            }
        });
    </script> -->

    <style>
        .responsive-button {
            width: 100%;
            /* Full width by default */
        }

        @media (min-width: 576px) {
            .responsive-button {
                width: 100%;
                /* 50% width on small screens and up */
            }
        }

        @media (min-width: 768px) {
            .responsive-button {
                width: 100%;
                /* 25% width on medium screens and up */
            }
        }
    </style>

<body>
    <div class="container" id="container">
        <div class="form-container sign-up-container">
            <form action="#">
                <h1>TAMPILAN DASHBOARD</h1>
                <div class="social-containernew">
                    <div class="social-item">
                        <a href="http://103.255.241.122:8080/dashboard/dashboard" target="_blank" class="social">
                            <img src="<?= base_url('assets_/assets/icon/dashboard1.png') ?>" style="width: 50px; height: auto;" />
                        </a>
                        <span>Dashboard Pasien</span>
                    </div>
                    <div class="social-item">
                        <a href="http://103.255.241.122:8080/sicepot/antrean" target="_blank" class="social">
                            <img src="<?= base_url('assets_/assets/icon/antrian.png') ?>" style="width: 50px; height: auto;" />
                        </a>
                        <span>Antrean Poliklinik</span>
                    </div>
                    <div class="social-item">
                        <a href="http://103.255.241.122:8080/sicepot/tt" target="_blank" class="social">
                            <img src="<?= base_url('assets_/assets/icon/bed.png') ?>" style="width: 50px; height: auto;" />
                        </a>
                        <span>Tempat Tidur</span>
                    </div>
                    <div class="social-item">
                        <a href="http://103.255.241.122:8080/sicepot/jadwal/jadwal1" target="_blank" class="social">
                            <img src="<?= base_url('assets_/assets/icon/doctor.png') ?>" style="width: 50px; height: auto;" />
                        </a>
                        <span>Jadwal Dokter</span>
                    </div>
                    <div class="social-item">
                        <a href="http://103.255.241.146/layar_poli/a1/lyr1" target="_blank" class="social">
                            <img src="<?= base_url('assets_/assets/icon/polig.png') ?>" style="width: 50px; height: auto;" />
                        </a>
                        <span>Layar Poli Gigi dan Penyakit Dalam</span>
                    </div>
                    <div class="social-item">
                        <a href="http://103.255.241.146/layar_poli/a1/lyr2" target="_blank" class="social">
                            <img src="<?= base_url('assets_/assets/icon/obygn.png') ?>" style="width: 50px; height: auto;" />
                        </a>
                        <span>Layar Poli Obygin dan Anak</span>
                    </div>
                    <div class="social-item">
                        <a href="http://103.255.241.146/layar_poli/a1/lyr3" target="_blank" class="social">
                            <img src="<?= base_url('assets_/assets/icon/bedah.png') ?>" style="width: 50px; height: auto;" />
                        </a>
                        <span>Layar Poli Bedah dan THT</span>
                    </div>
                    <div class="social-item">
                        <a href="http://103.255.241.146/layar_poli/a1/lyr4" target="_blank" class="social">
                            <img src="<?= base_url('assets_/assets/icon/jantung.png') ?>" style="width: 50px; height: auto;" />
                        </a>
                        <span>Layar Poli Saraf dan Jantung</span>
                    </div>
                </div>

            </form>
        </div>
        <div class="form-container sign-in-container">
            <form action="<?php echo base_url('login/auth'); ?>" method="POST">
                <div class=" social-container">
                    <img src="<?= base_url('assets_/assets/img/and.png') ?>" class="logo">
                </div>
                <h1>LOGIN SINARAN</h1>
                <input type="text" name="kd_user" id="kd_user" placeholder="Username" onkeyup="myFunction()" />
                <input type="password" name="password" id="password" placeholder="Password" onkeyup="myFunction()" />
                <button type="submit">MASUK</button>
            </form>
        </div>
        <div class="overlay-container">
            <div class="overlay">
                <div class="overlay-panel overlay-left">
                    <h1>Selamat Datang di SINARAN!</h1>
                    <p>Sebuah Aplikasi alternatif yang di gunakan oleh manajer, sebagai langkah akhir dalam
                        sinkronisasi data pelayanan dengan data yang digunakan untuk Klaim BPJS ataupun Asuransi.</p>
                    <button class="ghost" id="signIn">KEMBALI</button>
                </div>
                <div class="overlay-panel overlay-right">
                    <h2>Halo , Selamat Datang di SINARAN</h2>
                    <p>Sebuah Aplikasi alternatif yang di gunakan oleh manajer, sebagai langkah akhir dalam
                        sinkronisasi data pelayanan dengan data yang digunakan untuk Klaim BPJS ataupun Asuransi.</p>
                    <button class="ghost" id="signUp">Pilihan Dashboard Tampilan </button>
                </div>
            </div>
        </div>
    </div>
    <footer>
        <p>© By IT RSU ANANDA 2024</p>
    </footer>
    <script>
        const signUpButton = document.getElementById('signUp');
        const signInButton = document.getElementById('signIn');
        const container = document.getElementById('container');

        signUpButton.addEventListener('click', () => {
            container.classList.add("right-panel-active");
        });

        signInButton.addEventListener('click', () => {
            container.classList.remove("right-panel-active");
        });
    </script>

    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.2.3/dist/js/bootstrap.bundle.min.js" crossorigin="anonymous"></script>
    <script src="<?php echo base_url('assets_/js/scripts.js'); ?>"></script>
    <script>
        function myFunction() {
            var userField = document.getElementById("kd_user");
            userField.value = userField.value.toUpperCase();
            var passwordField = document.getElementById("password");
            passwordField.value = passwordField.value.toUpperCase();
        }
    </script>
</body>